:root{font-family:Arial,Helvetica,sans-serif;color:#fff;background:#080d19;color-scheme:dark;--gold:#dbc69d;--muted:#b3bac8}*{box-sizing:border-box}body{margin:0;overflow:hidden;-webkit-user-select:none;user-select:none}button,input{font:inherit}button{cursor:pointer;color:inherit}button:disabled{opacity:.6;cursor:default}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:4px}[hidden]{display:none!important}#app{position:fixed;inset:0;overflow:hidden}#camera,#scene,#scene canvas{position:absolute;inset:0;width:100%;height:100%}#scene{pointer-events:none}.welcome{position:absolute;inset:0;overflow:auto;display:flex;align-items:center;flex-direction:column;padding:max(30px,env(safe-area-inset-top)) 28px max(20px,env(safe-area-inset-bottom));background:radial-gradient(ellipse at 50% 30%,#172652 0,transparent 60%),#080d19}.eyebrow{font-size:10px;letter-spacing:3px;font-weight:600;color:var(--gold)}.illustration{position:relative;height:160px;width:200px;margin:24px 0 12px}.portal{position:absolute;left:56px;top:12px;width:88px;height:138px;border:1px solid #b6d7ff;border-radius:4px;box-shadow:0 0 18px #1273ff,inset 0 0 15px #086aff;background:linear-gradient(160deg,#091126,#142951)}.illustration i{position:absolute;left:37px;top:90px;font-size:22px;color:#cbefff;text-shadow:0 0 12px #6ba5ff;font-style:normal}.illustration i:nth-child(3){left:155px;top:36px;font-size:27px}.illustration i:nth-child(4){left:103px;top:61px;font-size:14px}h1{font-family:Georgia,serif;font-size:42px;font-weight:400;line-height:1.05;text-align:center;margin:0 0 14px;letter-spacing:-1px}.intro{color:var(--muted);font-size:14px;margin:0}ol{list-style:none;padding:0;font-size:13px;line-height:2.3;margin:24px 0;width:100%;max-width:340px}li span{font-size:10px;color:var(--gold);margin-right:15px}.primary{background:var(--gold);color:#141921;min-height:54px;border:none;border-radius:12px;font-weight:600;letter-spacing:.2px;width:100%;max-width:400px;padding:14px 20px}.primary span{float:right}.fine,.credits{font-size:10px;line-height:1.7;color:#939eaf;text-align:center}.fine{margin:16px 0 9px}.credits{margin-top:auto;padding-top:8px}.error{color:#ffcfb3;font-size:13px;max-width:360px;text-align:center}#hud{position:absolute;inset:0;pointer-events:none;background:linear-gradient(#0007,transparent 26%,transparent 72%,#0008)}#hud button,#hud input,#hud .panel{pointer-events:auto}header{display:flex;align-items:center;justify-content:space-between;padding:calc(env(safe-area-inset-top) + 16px) 20px 0}header .eyebrow{color:#fff;letter-spacing:2px}header .eyebrow span{color:var(--gold);margin-left:8px}.icon{width:40px;height:40px;border:1px solid #ffffff35;border-radius:50%;background:#08101bbd;font-size:24px}.status{margin:16px auto 0;width:max-content;max-width:90%;border:1px solid #ffffff26;background:#08101bd9;border-radius:20px;display:flex;gap:8px;align-items:center;padding:9px 13px;font-size:11px}.dot{background:#e2b658;width:6px;height:6px;border-radius:50%}.dot.ready{background:#91ecc3}.hint{font-size:12px;text-align:center;line-height:1.6;text-shadow:0 1px 4px #000;margin:10px 26px;color:#fff}.distance{position:absolute;top:32%;left:10px;width:64px;display:flex;align-items:center;flex-direction:column;gap:10px;background:#08101bbc;border:1px solid #ffffff20;border-radius:30px;padding:16px 6px;pointer-events:auto}.distance label{font-size:7px;letter-spacing:1px;color:#c4cbd8}.distance output{font-size:12px;font-variant-numeric:tabular-nums}.rangeEnd{font-size:7px;letter-spacing:1px;color:#9aa7bb}#distance{writing-mode:vertical-lr;direction:rtl;width:28px;height:142px;padding:0;accent-color:var(--gold);touch-action:none}#handles button{position:absolute;width:36px;height:36px;margin:-18px 0 0 -18px;border:none;background:transparent;touch-action:none;pointer-events:auto}#handles button:after{content:'';position:absolute;inset:11px;background:#fff4d2;border:2px solid #c5a86c;border-radius:3px;box-shadow:0 1px 8px #0008}footer{position:absolute;bottom:0;width:100%;padding:0 22px calc(env(safe-area-inset-bottom) + 12px);display:flex;align-items:center;flex-direction:column}#placementInfo{text-align:center;width:100%;margin-bottom:12px}.auto{border:1px solid #ffffff40;border-radius:20px;background:#101827da;font-size:11px;padding:9px 15px}.auto[aria-pressed=true]{border-color:#dbc69d90;color:#e6d4b5}#depthNote{font-size:10px;color:#e2e6ee;margin:9px 8px 0;text-shadow:0 1px 3px #000}.secondary{width:100%;max-width:400px;min-height:48px;background:#0b1426dd;border:1px solid #ffffff40;border-radius:12px;padding:12px;color:#fff}.footerNote{font-size:8px;letter-spacing:1.2px;color:#b9c3d3;margin-top:14px;display:flex;justify-content:space-between;width:100%;max-width:400px}.panel{position:absolute;right:15px;top:calc(env(safe-area-inset-top) + 72px);width:280px;border:1px solid #ffffff30;border-radius:18px;padding:20px;background:#101a2bf5;z-index:5;box-shadow:0 12px 50px #0008}.panel h2{font-size:16px;margin:0 0 20px}.panel label{display:block;font-size:12px;margin-bottom:20px}.panel label input[type=range]{width:100%;margin-top:14px;accent-color:var(--gold)}.panel .check{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.panel small{color:#98a5b9;margin-left:25px;width:100%}.panel input[type=checkbox]{accent-color:var(--gold)}@media(max-height:700px){.illustration{height:120px;margin:12px 0;transform:scale(.8);transform-origin:50% 0}h1{font-size:34px}ol{margin:14px 0}.distance{top:30%;gap:7px;padding:12px 6px}#distance{height:112px}.hint{margin-top:8px}.status{margin-top:8px}footer{padding-bottom:calc(env(safe-area-inset-bottom) + 8px)}}@media(min-width:700px){.welcome{justify-content:center}.credits{margin-top:10px}.illustration{height:180px}h1{font-size:52px}#hud .distance{left:30px}.hint{font-size:14px}}

/* Minimal onboarding and controls. */
.welcome{justify-content:center}
header{justify-content:flex-end}
