@font-face{font-family:Atlantis;src:local("Avenir Next")}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;background:#080e16;color:#edf3f4;font-family:Atlantis,"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased}body{overflow:hidden}button,a,select,input{-webkit-tap-highlight-color:transparent}button,select{font:inherit}button{cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid #a5f1ff;outline-offset:5px}button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}button{color:inherit}#experience{height:100svh;height:100dvh;min-height:400px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 65% 40%,#122637,#080e16 75%)}#scene{position:absolute;inset:0;touch-action:none}#scene canvas{display:block;width:100%;height:100%;outline:none}.vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,#060c14ee,transparent 32%,transparent 80%,#080e1640),linear-gradient(90deg,#080e16a6,transparent 48%)}.topbar{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:calc(27px + env(safe-area-inset-top)) 40px 20px;pointer-events:none}.brand{display:flex;gap:13px;align-items:center;color:inherit;text-decoration:none;pointer-events:auto}.brand>svg{width:39px;height:39px;fill:none;stroke:#b2d0dd;stroke-width:1.2}.brand>span{font-size:13px;letter-spacing:5px;font-weight:600}.brand small{display:block;font-size:8px;letter-spacing:2.3px;color:#879cae;margin-top:8px}.header-actions{display:flex;gap:10px;pointer-events:auto}.icon-button{width:43px;height:43px;border:1px solid #b8dfff25;border-radius:50%;display:grid;place-items:center;background:#0c162566;backdrop-filter:blur(12px);transition:background .2s}.icon-button:hover,.view-button:hover{background:#28465788}.icon-button[aria-pressed=true]{color:#8ce4f5;border-color:#8ce4f566}.intro{position:absolute;top:27%;left:7%;pointer-events:none}.eyebrow{font-size:10px;letter-spacing:3px;color:#a3b5c0;font-weight:500;margin:0 0 23px;display:flex;align-items:center;gap:10px}.eyebrow>span{width:5px;height:5px;border-radius:100%;background:#6ce2e4;box-shadow:0 0 12px #6ce2e4}h1{font-weight:300;font-size:clamp(44px,5.5vw,86px);line-height:1.08;letter-spacing:-3px;margin:0}h1 em{font-style:normal;color:#add2e0}.intro-copy{color:#8d9eae;font-size:14px;line-height:1.8;margin-top:23px;font-weight:300}.coordinate{display:flex;gap:24px;margin-top:46px;font-size:8px;letter-spacing:2px;color:#627b8e}.coordinate span:first-child{color:#adc0ca}.view-tools{position:absolute;right:32px;top:42%;display:flex;flex-direction:column;border:1px solid #b8dfff20;border-radius:30px;padding:5px;background:#0c162555;backdrop-filter:blur(12px);gap:7px}.view-button{width:40px;height:40px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:#9bb0bf}.view-button[aria-pressed=true]{color:#9df4ff;background:#1d4f5a66}.console{position:absolute;width:350px;bottom:60px;left:50%;transform:translateX(-50%)}.connection{display:flex;align-items:center;font-size:10px;letter-spacing:1.1px;margin-bottom:18px;color:#9aaeba;min-height:14px}.status-dot{width:5px;height:5px;border-radius:50%;background:#617484;margin-right:9px;transition:background .4s,box-shadow .4s}body[data-state=open] .status-dot{background:#8df5e6;box-shadow:0 0 12px #5df8dc}body[data-state=dialing] .status-dot,body[data-state=opening] .status-dot{background:#8cdbff;box-shadow:0 0 12px #8cdbff}#counter{margin-left:auto;font-variant-numeric:tabular-nums;letter-spacing:2px;font-size:9px}.address{display:flex;justify-content:space-between;gap:8px;margin-bottom:20px}.glyph{height:35px;flex:1;display:grid;place-items:center;border-bottom:1px solid #b8dfff23;color:#4b5e70;transition:color .25s,border-color .25s,filter .25s}.glyph svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.3}.glyph.active{color:#a7f4ff;filter:drop-shadow(0 0 5px #54c5ff);border-color:#81d8ee88}.command-row{display:flex;gap:9px}.primary{border:1px solid #9ed8e94a;border-radius:7px;background:linear-gradient(135deg,#c2e8ef,#8cc6dc);color:#102432;min-height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 22px;font-size:12px;letter-spacing:1px;font-weight:600;box-shadow:0 5px 34px #2f8bb31a;transition:filter .2s,transform .2s;flex:1}.primary:hover{filter:brightness(1.1)}.primary:active{transform:scale(.985)}.primary:disabled{background:#1b2c3a;color:#8198a8;border-color:#4f708a44;box-shadow:none}.replay{display:grid;place-items:center;width:52px;border-radius:7px;border:1px solid #91b7ca35;background:#10202c88;color:#a0c3d4;backdrop-filter:blur(12px)}.replay:disabled{opacity:.35}.gesture-hint{display:flex;align-items:center;justify-content:center;gap:8px;font-size:9px;color:#677e90;letter-spacing:.2px;margin:16px 0 0;white-space:nowrap}.gesture-hint svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1}.gesture-hint span{margin:0 2px}.bottomline{position:absolute;bottom:20px;left:40px;right:40px;display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.8px;color:#4e687d;pointer-events:none}.loading{position:absolute;inset:0;background:#080e16;display:flex;flex-direction:column;gap:24px;justify-content:center;align-items:center;z-index:15;transition:opacity .5s}.loading.done{opacity:0;pointer-events:none}.loading p{font-size:12px;letter-spacing:2px;text-align:center;color:#c2d5df}.loading span{display:block;font-size:10px;letter-spacing:.5px;margin-top:14px;color:#6a8498}.loader-ring{width:62px;height:62px;border:1px solid #6cdcff22;border-top-color:#8cdaef;border-right-color:#8cdaef;border-radius:100%;animation:spin 1.5s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-panel{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);max-width:450px;width:calc(100% - 40px);padding:26px;background:#112230;border:1px solid #406478;border-radius:12px;z-index:20;line-height:1.7}.error-panel[hidden]{display:none}.error-panel h2{font-size:20px}.error-panel p{font-size:14px;color:#b3c7d1}.error-panel .primary{width:100%}.toast{position:absolute;top:110px;left:50%;transform:translateX(-50%);padding:14px 20px;background:#193447ed;color:#d7eef6;border:1px solid #79badf40;border-radius:8px;font-size:12px;z-index:30;max-width:90%;text-align:center}.toast[hidden]{display:none}dialog{background:#101d29;color:#e7f0f4;border:1px solid #3c596a;border-radius:18px;max-width:440px;width:calc(100% - 32px);max-height:85dvh;padding:28px;box-shadow:0 20px 100px #0009}dialog::backdrop{background:#040b12b8;backdrop-filter:blur(7px)}.dialog-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}.dialog-heading h2{font-size:28px;font-weight:400;letter-spacing:-1px;margin:0}.dialog-heading .eyebrow{margin-bottom:8px;font-size:8px}.field-label{display:block;font-size:12px;margin-bottom:10px}select{width:100%;background:#1c303e;color:#dcebf1;border:1px solid #466172;border-radius:6px;padding:12px;font-size:13px;color-scheme:dark}.field-note{font-size:11px;line-height:1.7;color:#91a9ba;margin:11px 0 22px}.toggle{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:25px 0;font-size:12px}.toggle small{display:block;font-size:11px;color:#91a9ba;line-height:1.7;margin-top:5px}.toggle input{width:20px;height:20px;accent-color:#92daed;flex-shrink:0}.secondary{width:100%;background:#243e4f;color:#cfebf5;border:1px solid #5f97af66;border-radius:6px;min-height:45px;font-size:12px}.secondary:disabled{opacity:.5}details{border-top:1px solid #7fa0b327;padding:17px 0;font-size:12px}summary{cursor:pointer}details p{font-size:11px;line-height:1.8;color:#9ab1c0}details a{color:#afdce9}.diagnostics{font-family:monospace;font-size:9px;color:#658296;margin:15px 0 0;line-height:1.7}
@media(min-width:1100px){.console{left:65%;width:350px}}
@media(max-width:700px){.topbar{padding:calc(16px + env(safe-area-inset-top)) 20px 12px}.brand{gap:9px}.brand>svg{width:32px;height:32px}.brand>span{font-size:11px;letter-spacing:3px}.brand small{font-size:6px;letter-spacing:1.8px;margin-top:6px}.header-actions{gap:7px}.icon-button{width:37px;height:37px}.intro{top:calc(105px + env(safe-area-inset-top));left:24px}.eyebrow{font-size:8px;letter-spacing:2.4px;margin-bottom:11px}.intro h1{font-size:32px;letter-spacing:-1px;line-height:1.1}.intro h1 br{display:none}.intro h1 em{margin-left:7px}.intro-copy,.coordinate{display:none}.view-tools{top:auto;bottom:calc(245px + env(safe-area-inset-bottom));right:15px;gap:4px;padding:3px}.view-button{width:33px;height:33px}.view-button svg{width:18px;height:18px}.console{width:calc(100% - 48px);max-width:380px;bottom:calc(48px + env(safe-area-inset-bottom))}.connection{margin-bottom:10px;font-size:9px}.address{margin-bottom:15px}.glyph{height:29px}.glyph svg{width:21px;height:21px}.primary{min-height:51px;font-size:12px}.gesture-hint{font-size:8px;margin-top:15px}.bottomline{bottom:calc(17px + env(safe-area-inset-bottom));left:24px;right:24px;font-size:6px;letter-spacing:1.2px}.vignette{background:linear-gradient(0deg,#060c14 2%,#060c14b5 22%,transparent 47%,transparent 72%,#080e1680)}.toast{top:85px;font-size:11px}}
@media(max-height:600px) and (orientation:landscape){.topbar{padding:12px 25px}.intro{top:100px;left:30px}.intro h1{font-size:33px;letter-spacing:-1px}.intro .eyebrow{font-size:8px;margin-bottom:12px}.intro-copy,.coordinate{display:none}.console{width:245px;left:auto;right:25px;transform:none;bottom:45px}.connection{font-size:9px;margin-bottom:8px}.address{margin-bottom:10px}.glyph{height:25px}.primary{min-height:44px;font-size:10px;padding:0 13px}.replay{width:44px}.gesture-hint{font-size:8px}.view-tools{right:25px;top:90px;bottom:auto;flex-direction:row}.bottomline{bottom:12px;left:25px;right:25px}.vignette{background:linear-gradient(0deg,#080e1680,transparent 35%),linear-gradient(90deg,#080e1670,transparent 40%,#080e1650)}}
@media(prefers-reduced-motion:reduce){.loader-ring{animation:none}*{transition:none!important}}

/* The root mobile experience shares the room with VR. View controls remain touchable. */
.room-views{display:flex;gap:8px;margin-top:22px;pointer-events:auto;max-width:310px}.room-views button{flex:1;min-width:0;min-height:44px;padding:10px 17px;border:1px solid #a8cddd55;border-radius:7px;background:#102230e8;color:#c1dbe5;font-size:12px;backdrop-filter:blur(12px)}.room-views button[aria-pressed=true]{background:#b7e0ea;border-color:#c1edf4;color:#132e3a}.room-views button:disabled{opacity:.5}.room-view-status{font-size:10px;line-height:1.5;color:#a6c4d1;letter-spacing:.3px;margin:9px 0 0}.vignette{background:linear-gradient(0deg,#060c14f5,transparent 33%,transparent 75%,#080e1670),linear-gradient(90deg,#080e16bd,transparent 49%)}
@media(max-width:700px){.room-views{gap:7px;max-width:300px;margin-top:14px}.room-views button{font-size:11px;padding:10px 16px}.room-view-status{font-size:9px;margin-top:7px}.vignette{background:linear-gradient(0deg,#060c14 2%,#060c14d9 24%,transparent 45%,transparent 70%,#080e16c0)}}
@media(max-height:740px) and (orientation:portrait){.intro{top:calc(86px + env(safe-area-inset-top))}.intro h1{font-size:28px}.room-views{margin-top:9px}.room-view-status{margin-top:5px}}
@media(max-height:600px) and (orientation:landscape){.room-views{max-width:260px;margin-top:14px;gap:5px}.room-views button{padding:8px 12px;font-size:10px}.room-view-status{font-size:9px}.vignette{background:linear-gradient(0deg,#080e16a0,transparent 35%),linear-gradient(90deg,#080e1690,transparent 40%,#080e1670)}}

/* Independent thumbs: left joystick moves; the unobstructed canvas looks around. */
.movement{position:absolute;left:40px;bottom:calc(78px + env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;gap:13px;z-index:2}#move-pad{position:relative;width:112px;height:112px;display:grid;place-items:center;border-radius:50%;border:1px solid #9ccddb60;background:radial-gradient(circle,#173a4acc,#0a1a28e8);box-shadow:inset 0 0 0 16px #85d1e508;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;backdrop-filter:blur(12px);padding:0}#move-pad.moving{border-color:#b5f2ff;background:#214d60e8}#move-pad:disabled{opacity:.35}#move-knob{width:37px;height:37px;border:1px solid #ccf6ff8c;border-radius:50%;background:linear-gradient(135deg,#abdce8c9,#518aa6b0);box-shadow:0 3px 12px #0005;pointer-events:none}.move-arrows{position:absolute;inset:0;pointer-events:none;color:#a7cad9;font-size:15px}.move-arrows span{position:absolute}.move-arrows span:nth-child(1){left:50%;top:6px;transform:translateX(-50%)}.move-arrows span:nth-child(2){left:8px;top:50%;transform:translateY(-50%)}.move-arrows span:nth-child(3){right:8px;top:50%;transform:translateY(-50%)}.move-arrows span:nth-child(4){left:50%;bottom:6px;transform:translateX(-50%)}.move-caption{font-size:8px;letter-spacing:2px;color:#b1d1dd;pointer-events:none}.gesture-hint{display:block;white-space:normal;text-align:center;line-height:1.7}
@media(max-width:700px){.movement{left:22px;bottom:calc(68px + env(safe-area-inset-bottom))}.console{left:auto;right:22px;transform:none;width:calc(100% - 172px);bottom:calc(48px + env(safe-area-inset-bottom))}.console .address{gap:4px;margin-bottom:11px}.console .glyph{height:23px}.console .glyph svg{width:17px;height:17px}.console .primary{min-width:0;min-height:53px;padding:8px 11px;font-size:10px;letter-spacing:.2px;gap:7px}.console .primary span{min-width:0}.console .primary svg{width:16px;height:16px;flex-shrink:0}.console .replay{width:38px;flex-shrink:0}.console .command-row{gap:6px}.console .connection{font-size:8px;letter-spacing:.2px;gap:4px}.console .status-dot{margin-right:0;flex-shrink:0}.console #counter{display:none}.console .gesture-hint{font-size:8px;margin-top:11px}.vignette{background:linear-gradient(0deg,#060c14 1%,#060c14bb 20%,transparent 42%,transparent 72%,#080e16c0)}}
@media(max-width:360px){.movement{left:16px}.console{right:16px;width:calc(100% - 158px)}.console .primary{padding:8px;font-size:10px}.console .replay{width:34px}}
@media(max-height:600px) and (orientation:landscape){.movement{left:28px;bottom:42px}.console{width:245px;right:25px;bottom:36px;left:auto;transform:none}.intro{top:78px}.intro h1{font-size:26px}.intro .eyebrow{margin-bottom:7px}.room-views{margin-top:10px}.room-view-status{margin-top:5px}.gesture-hint{margin-top:8px}.vignette{background:linear-gradient(0deg,#080e1670,transparent 34%),linear-gradient(90deg,#080e1680,transparent 40%,#080e1660)}}

/* Four room shortcuts; compact mobile HUD remains unchanged. */
.room-views{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}