:root{--gold:#f0c27b;--text:#fff7f2;--muted:#e9c8c8}*{box-sizing:border-box}body{margin:0;font-family:'Segoe UI',system-ui,sans-serif;background:#120205;color:var(--text)}button,input,select{font:inherit}a{color:inherit}.top{padding:16px 4vw;background:#190207;border-bottom:1px solid #7c2630;display:flex;justify-content:space-between;align-items:center;gap:16px}.brand{font-size:20px;font-weight:750;text-decoration:none}.top nav{display:flex;gap:20px;font-size:13px}.hero{min-height:calc(100vh - 60px);background:radial-gradient(circle at 50% 15%,#9b1727 0,#650b16 32%,#35050d 70%,#1b0206 100%);padding:42px 5vw 70px}.heroInner{max-width:1100px;margin:auto;text-align:center}.logo{width:72px;height:72px;border:1px solid var(--gold);border-radius:22px;margin:0 auto 16px;display:grid;place-items:center;font-size:36px;background:#4b0710}.hero h1{font-size:clamp(34px,5vw,62px);margin:10px 0}.heroInner>p{color:var(--muted);font-size:18px;margin-bottom:32px}.panel{max-width:920px;margin:auto;background:#31050dcc;border:1px solid #9b3340;border-radius:24px;padding:26px}.panel h2{margin:0 0 20px;font-size:23px}.cityGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.city{padding:18px 10px;border-radius:14px;border:1px solid #b84450;background:#6c101b;color:white;font-weight:700;cursor:pointer}.city.sel{background:var(--gold);color:#31060b}.searchRow{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:10px;align-items:end;margin-top:22px}.searchRow label{text-align:left;display:grid;gap:8px;font-size:12px;color:var(--muted)}input,select{width:100%;background:#2f0710;color:white;border:1px solid #8f3440;border-radius:10px;padding:12px;min-height:46px}.primary{border:0;background:var(--gold);color:#321006;border-radius:10px;padding:13px 18px;font-weight:750;cursor:pointer;min-height:46px}button:disabled{opacity:.5;cursor:default}.notice{color:var(--muted);font-size:13px;line-height:1.7;margin-bottom:0}.rooms{margin:30px auto 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.room{background:#3d0710;border:1px solid #8f3440;border-radius:18px;text-align:left}.roomBody{padding:20px}.room h3{margin:0 0 10px}.room p,.roomBody>div:not(.price){font-size:13px;color:var(--muted);line-height:1.6}.price{font-size:26px;font-weight:750;color:var(--gold);margin-top:10px}.room button{width:100%;margin-top:18px}.modal{display:none;position:fixed;inset:0;z-index:50;background:#100006d9;place-items:center;padding:20px}.modal.open{display:grid}.modalCard{width:min(540px,100%);max-height:90vh;overflow:auto;background:#31050d;border:1px solid #9b3340;border-radius:18px;padding:26px;text-align:left}.modalCard h2{margin:0 0 15px}.modalCard label{display:block;font-size:13px;margin:16px 0 8px}#selectedRoom p{font-size:14px;line-height:1.8;color:var(--muted)}.modalCard button{width:100%;margin-top:14px}.secondary{background:transparent;border:1px solid #8f3440;color:var(--text);border-radius:10px;padding:12px;cursor:pointer}:focus-visible{outline:2px solid var(--gold);outline-offset:3px}@media(max-width:800px){.cityGrid{grid-template-columns:repeat(2,1fr)}.searchRow{grid-template-columns:1fr 1fr}.rooms{grid-template-columns:1fr 1fr}.top nav{font-size:11px;gap:12px}}@media(max-width:500px){.top{flex-direction:column}.hero{padding:30px 14px}.panel{padding:20px 15px}.rooms{grid-template-columns:1fr}.panel h2{font-size:20px}.searchRow{grid-template-columns:1fr}.heroInner>p{font-size:15px}}
.socialCards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:650px;margin:0 auto 30px}.socialCards button{border:1px solid #c75560;background:#7b1520;border-radius:16px;padding:17px 14px;color:white;font-weight:650;cursor:pointer}.socialDialog{width:min(640px,94vw);max-height:85dvh;overflow:auto;margin:auto;border:1px solid #87505a;border-radius:16px;padding:24px;background:#31050d;color:#fff7f2}.socialDialog::backdrop{background:#100006d9}.socialHead{display:flex;align-items:start;gap:16px;justify-content:space-between}.socialHead h2{font-size:22px;margin:0}.socialHead button{background:#351017;border:1px solid #87505a;color:white;border-radius:8px;padding:8px 12px;cursor:pointer}#socialChannel{font-size:13px;color:#e9c8c8;margin:16px 0}.socialMotel{display:grid;gap:6px;text-align:left;text-decoration:none;margin:10px 0;padding:15px;border:1px solid #87505a;border-radius:10px;color:#fff7f2;background:#4b0710}.socialMotel small{color:#e9c8c8}.socialMotel.unavailable{opacity:.65;background:transparent}@media(max-width:500px){.socialCards{gap:7px}.socialCards button{padding:14px 8px;font-size:13px}.socialDialog{padding:18px}}

/* Responsive booking controls */
.searchRow,.searchRow>*{min-width:0;max-width:100%}.panel{width:100%}.searchRow{grid-template-columns:repeat(3,minmax(0,1fr)) auto}.searchRow label{min-width:0;grid-template-columns:minmax(0,1fr)}.searchRow input,.searchRow select{display:block;box-sizing:border-box;width:100%;min-width:0;max-width:100%;font-size:16px}.searchRow button{min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere}@media(max-width:900px){.searchRow{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.searchRow{grid-template-columns:minmax(0,1fr)}.searchRow button{width:100%}}

/* MotelCloud desktop layout - 2026-10-23 */
@media(min-width:1000px) and (min-height:620px){.top{height:58px;padding:0 4vw;background:#21040b}.hero{min-height:calc(100dvh - 58px);padding:16px 4vw;background:radial-gradient(ellipse at 15% 35%,#751222 0,#400912 45%,#19040a 100%)}.heroInner{max-width:1320px;height:calc(100dvh - 90px);display:grid;grid-template-columns:minmax(280px,.85fr) minmax(0,1.5fr);grid-template-rows:138px 100px 48px minmax(0,1fr);column-gap:clamp(28px,4vw,72px);row-gap:10px;text-align:left}.heroInner>.logo{grid-column:1;grid-row:1;width:132px!important;height:132px!important;margin:0;align-self:center}.hero h1{grid-column:1;grid-row:2;font-size:clamp(34px,3.6vw,50px);line-height:1.08;letter-spacing:-1.5px;margin:0;align-self:center;max-width:390px}.heroInner>p{grid-column:1;grid-row:3;font-size:16px;line-height:1.5;margin:0;max-width:300px}.socialCards{grid-column:1;grid-row:4;align-self:end;width:100%;margin:0;gap:8px}.socialCards button{padding:12px 6px;font-size:13px;border-radius:10px;background:#53101c}.panel{grid-column:2;grid-row:1 / 3;align-self:start;max-width:none;margin:0;padding:18px 20px;background:#300911;border-color:#a14a51;border-radius:20px}.panel h2{font-size:22px;margin-bottom:12px;letter-spacing:-.5px}.cityGrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.city{padding:12px 10px;border-radius:10px}.searchRow{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:16px;gap:10px}.searchRow label{gap:5px}.searchRow input,.searchRow select{padding:9px;min-height:42px;font-size:14px}.searchRow>.primary{grid-column:1 / -1;min-height:42px;padding:10px 15px}.notice{line-height:1.4;margin-top:12px}.rooms{grid-column:2;grid-row:3 / 5;display:grid;grid-template-columns:1fr;align-content:start;gap:12px;min-height:0;overflow:auto;margin:32px 0 0;scrollbar-width:thin}.rooms:empty{margin:0}.room{border-radius:16px;background:#2b0910;border-color:#76323f}.roomBody{padding:12px 18px}.room h3{font-size:20px;margin-bottom:6px}.room p,.roomBody>div:not(.price){font-size:12px;line-height:1.5}.room p{margin:7px 0}.price{font-size:25px;margin-top:8px}.room button{margin-top:8px;min-height:40px;padding:10px 16px}.amenityList{display:flex;flex-wrap:wrap;gap:4px 10px}.modalCard{padding:20px;max-height:94dvh}.modalCard label{margin:10px 0 5px}.modalCard input,.modalCard select{min-height:40px;padding:8px}.modalCard button{margin-top:10px}#selectedRoom p{line-height:1.5;margin:6px 0}}
