:root { --text:#f7f8fa; --muted:#c5cad0; --stroke:#4a4e54; --accent:#73d9bb; --r:8px; }
body { color:var(--text); }
[hidden] { display:none !important; }
.btn { min-height:44px; border-radius:6px; font-size:14px; padding:10px 14px; background:#25292e; box-shadow:none; backdrop-filter:none; }
.btn:hover:not(:disabled) { background:#3b4249; border-color:#8c969e; }
.btn.primary { background:#a3efd4; color:#112a24; border-color:#a3efd4; }
.btn.primary:hover:not(:disabled) { background:#c5f7e6; }
.btn:focus-visible, select:focus-visible { outline:3px solid #a3efd4; outline-offset:3px; }
.btn:disabled { opacity:.5; }
.btn kbd { display:none; }
.brand { background:#1a1e23; border-radius:6px; box-shadow:none; padding:10px 16px; }
.brand-logo { height:34px; }
.brand-sub { font-size:14px; }
#topbar { top:16px; left:20px; right:20px; }
.controls { gap:8px; }
#hero { left:20px; bottom:116px; padding:16px; background:#1a1e23; border-radius:8px; box-shadow:0 8px 28px #0003; }
#hero h2 { font-size:20px; }
#hero p { font-size:16px; line-height:1.5; }
#hero.collapsed h2 { font-size:16px; }
#visitorNav { position:fixed; z-index:24; bottom:24px; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:20px; background:#1a1e23; border:1px solid var(--stroke); padding:12px 18px; border-radius:8px; max-width:calc(100% - 32px); }
.room-group { display:grid; gap:5px; min-width:170px; }
.room-group label, #tourStatus { font-size:14px; color:var(--muted); }
select { font:inherit; font-size:16px; min-height:44px; background:#292e34; color:#fff; border:1px solid #626970; border-radius:5px; padding:8px 28px 8px 10px; max-width:100%; }
.tour-controls { display:flex; gap:6px; }
.tour-controls .btn { justify-content:center; }
.tour-controls .primary { min-width:165px; }
#tourStatus { min-width:100px; }
#settings { top:80px; bottom:auto; right:20px; width:340px; max-height:calc(100dvh - 100px); overflow:auto; background:#1a1e23; }
#settings h4 { font-size:16px; letter-spacing:0; }
.setting-row { flex-wrap:wrap; margin:20px 0; }
.setting-row label { font-size:14px; width:120px; }
.setting-row span { font-size:14px; }
#settings > .btn { width:100%; margin-top:10px; justify-content:center; }
#settings > div:last-of-type { font-size:14px !important; }
#gallery { background:#101317f5; backdrop-filter:none; }
.gallery-card { width:min(1000px,calc(100% - 32px)); max-height:92dvh; background:transparent; border:0; box-shadow:none; border-radius:0; padding:24px; }
#galleryHeader { margin-bottom:30px; align-items:flex-start; }
#galleryHeader h3 { font-size:32px; }
#galleryHeader .muted { font-size:16px; margin-top:8px; }
#grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.tile { border-radius:8px; background:#22272d; min-height:0; }
.thumb { height:auto; aspect-ratio:16/10; }
.tileBody { padding:20px; }
.tileTitle { font-size:22px; }
.tileDesc { font-size:16px; line-height:1.5; }
.tileBody::after { content:'Explore property \2192'; display:block; color:#a3efd4; font-size:14px; margin-top:22px; }
#galleryMsg { font-size:14px !important; }
#loadHud { top:90px; }
#loadHud .wrap { background:#1a1e23; }
.prog-label { font-size:16px; color:#fff; }
.prog-fill { background:#a3efd4; }
#toast { font-size:14px; border-radius:6px; white-space:normal; bottom:125px; }
#lookpad { display:none !important; }
#joystick { bottom:125px; }
#visitorHelp { width:min(440px,calc(100% - 32px)); background:#1a1e23; color:#fff; border:1px solid #626970; border-radius:8px; padding:28px; }
#visitorHelp::backdrop { background:#0009; }
#visitorHelp h2 { font-size:24px; margin-top:0; }
#visitorHelp p { font-size:16px; line-height:1.6; color:#d4d9de; }
@media (pointer:fine) { #joystick { display:none !important; } }
@media (max-width:700px) {
  #topbar { left:12px; right:12px; top:12px; align-items:flex-start; }
  .brand { padding:8px; } .brand-logo { width:78px; height:auto; } .brand-sub { display:none; }
  .controls { gap:6px; max-width:260px; } .controls .btn { padding:8px 10px; }
  #visitorNav { bottom:12px; width:calc(100% - 24px); padding:12px; gap:10px; flex-wrap:wrap; }
  .room-group { min-width:0; flex:1; } .room-group label { font-size:14px; }
  .tour-controls { align-self:flex-end; } .tour-controls .primary { min-width:0; width:100px; white-space:normal; }
  #tourStatus { width:100%; text-align:center; }
  #hero { left:12px; bottom:155px; width:min(265px,calc(100% - 112px)); padding:12px; }
  #hero h2 { font-size:16px; } #hero p { font-size:14px; }
  #heroChoose { display:none; } #hero.collapsed { max-width:calc(100% - 112px); }
  #joystick { bottom:160px; right:12px; }
  #settings { top:118px; right:12px; max-height:calc(100dvh - 140px); width:min(340px,calc(100% - 24px)); }
  .gallery-card { padding:8px; } #galleryHeader { gap:16px; flex-wrap:wrap; margin-bottom:20px; }
  #galleryHeader h3 { font-size:26px; } #grid { grid-template-columns:1fr; gap:16px; }
  .thumb { aspect-ratio:16/8; } .tileTitle { font-size:20px; } .tileBody { padding:16px; }
  #loadHud { top:125px; } #toast { bottom:160px; }
}
@media (max-height:500px) and (orientation:landscape) {
  #hero { display:none; } #visitorNav { bottom:8px; padding:8px; width:auto; flex-wrap:nowrap; }
  #tourStatus { display:none; } .room-group label { display:none; } #settings { top:65px; max-height:calc(100dvh - 80px); }
}
@media (prefers-reduced-motion:reduce) { *, *::before, *::after { animation:none !important; transition:none !important; } }
