:root{color-scheme:dark;--ink:#eaf0ff;--dim:#aebfe0;--line:rgba(150,180,255,.18);--panel:rgba(9,13,26,.9);--teal:#3fe0c8;--amber:#ffab5e;--focus:#7fd4ff;--f:.2s cubic-bezier(.2,.7,.3,1)}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#04050c;color:var(--ink);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:16px;line-height:1.55;-webkit-text-size-adjust:100%}#app{position:fixed;top:0;right:0;bottom:0;left:0}#view{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;touch-action:none}#ui{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none}#ui>*{pointer-events:auto}body.locked #ui .nav{opacity:.25}button{font:inherit;color:var(--ink);background:#141c32b8;border:1px solid var(--line);border-radius:10px;padding:.62rem 1rem;min-height:44px;cursor:pointer;transition:background var(--f),border-color var(--f),transform var(--f)}button:hover{background:#263458d9;border-color:#a0c8ff66}button:active{transform:translateY(1px)}:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:10px}kbd{font:600 .78em ui-monospace,SFMono-Regular,Menlo,monospace;background:#78a0ff24;border:1px solid var(--line);border-radius:6px;padding:.1em .42em;margin-right:.15em}.nav{position:fixed;z-index:15;top:0;left:0;right:0;display:flex;gap:.4rem;padding:.7rem;flex-wrap:wrap;transition:opacity var(--f);background:linear-gradient(180deg,rgba(4,5,12,.85),transparent)}.nav button{padding:.5rem .85rem;font-size:.92rem}.nav .mute{margin-left:.6rem}.nav{padding-right:15rem}@media (max-width:720px){.nav{padding-right:.7rem}}.screen{position:absolute;top:0;right:0;bottom:0;left:0;padding:4.6rem 1.25rem 1.25rem;display:flex;pointer-events:none;animation:fade .35s var(--f) both}.screen>*{pointer-events:auto}@keyframes fade{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.home{align-items:flex-end;justify-content:space-between;gap:1.25rem;flex-wrap:wrap}.hero{max-width:34rem;background:var(--panel);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:18px;padding:1.4rem 1.5rem}.eyebrow{margin:0 0 .3rem;color:var(--teal);font-size:.8rem;letter-spacing:.14em;text-transform:uppercase}.hero h1{margin:0;font-size:clamp(2rem,6vw,3.4rem);line-height:1.05;letter-spacing:-.02em}.lede{color:var(--dim);margin:.7rem 0 1.1rem}.cta{display:flex;gap:.55rem;flex-wrap:wrap}.primary{background:linear-gradient(135deg,#2fbfae,#1c7fa0);border-color:transparent;font-weight:600}.primary:hover{background:linear-gradient(135deg,#3fe0c8,#2394ba)}.controls-card{width:min(20rem,100%);background:var(--panel);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:18px;padding:1.1rem 1.25rem}.controls-card h2{margin:0 0 .6rem;font-size:.85rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}.controls-card ul{margin:0;padding:0;list-style:none;display:grid;gap:.45rem;font-size:.95rem}.hint{color:var(--dim);font-size:1rem;margin:.8rem 0 0}.explore{flex-direction:column;gap:.7rem}.hud-top{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:.6rem .75rem}.where{display:flex;flex-direction:column;line-height:1.15;min-width:7rem}.where .label{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}.regions{display:flex;gap:.4rem;flex-wrap:wrap}.regions button{font-size:.9rem;padding:.45rem .8rem}.hud-top .reset{margin-left:auto;border-color:#ffab5e73;color:var(--amber)}.tip{margin:0;color:var(--dim);font-size:1rem;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:.5rem .75rem;align-self:flex-start}.marker-card{margin-top:auto;max-width:32rem;background:var(--panel);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid rgba(63,224,200,.35);border-left:3px solid var(--teal);border-radius:14px;padding:.9rem 1.1rem;animation:fade .3s var(--f) both}.marker-card h2{margin:0 0 .25rem;font-size:1.05rem}.marker-card p{margin:0;color:#cfd9f2}.hud-bottom{display:flex;gap:1rem;color:var(--dim);font-size:.85rem;font-variant-numeric:tabular-nums;padding-top:.4rem}.pad{display:none}.screen.sheet{width:100%;flex-direction:column;gap:1rem;overflow:auto;pointer-events:auto;background:linear-gradient(180deg,#04050cdb,#04050c99);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.sheet header{max-width:44rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.sheet h1{text-shadow:0 2px 18px rgba(0,0,0,.9);margin:0;font-size:clamp(1.5rem,4vw,2.2rem);letter-spacing:-.01em}.sheet .back{margin-left:auto}.sheet .note{max-width:44rem}.layer-list,.fact-list{list-style:none;margin:0;padding:0 0 3rem;display:grid;gap:.6rem;max-width:44rem}.layer-list button{border:1px solid var(--line);display:flex;align-items:center;gap:.85rem;width:100%;text-align:left;background:var(--panel);border-radius:14px;padding:.85rem 1rem}.layer-list .dot{width:12px;height:12px;border-radius:50%;flex:0 0 auto;background:#a0b4dc4d;transition:background var(--f),box-shadow var(--f)}.layer-list .on .dot{background:var(--teal);box-shadow:0 0 12px #3fe0c8cc}.layer-list .txt{display:flex;flex-direction:column}.layer-list em{font-style:normal;color:var(--dim);font-size:1rem}.layer-list .state{margin-left:auto;color:var(--dim);font-size:.8rem;letter-spacing:.08em;text-transform:uppercase}.fact-list li{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:1rem 1.15rem}.fact-list h2{margin:0 0 .3rem;font-size:1.05rem;color:var(--teal)}.fact-list p{margin:0;color:#cfd9f2}.note{text-shadow:0 1px 10px rgba(0,0,0,.9);color:var(--dim);font-size:1rem;margin:0 0 2rem}.toast{position:fixed;left:50%;bottom:1.5rem;transform:translate(-50%,1rem);background:#0c1224f0;border:1px solid var(--line);border-radius:999px;padding:.55rem 1.1rem;font-size:.92rem;opacity:0;transition:opacity var(--f),transform var(--f);pointer-events:none;z-index:20}.toast.show{opacity:1;transform:translate(-50%)}@media (pointer:coarse){.pad{display:grid;grid-template-columns:repeat(3,56px);grid-template-rows:repeat(2,56px);gap:.4rem;place-items:center;position:fixed;right:1rem;bottom:5.4rem;z-index:10}.pad button{width:56px;height:56px;border-radius:14px;padding:0;font-size:1.1rem;background:#141c32d9}.pad [data-pad=forward]{grid-area:1/2}.pad [data-pad=left]{grid-area:2/1}.pad [data-pad=back]{grid-area:2/2}.pad [data-pad=right]{grid-area:2/3}}@media (max-width:720px){.nav{top:auto;bottom:0;padding:.6rem .7rem calc(.6rem + env(safe-area-inset-bottom));background:linear-gradient(0deg,rgba(4,5,12,.95),rgba(4,5,12,.75) 70%,transparent);overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}.nav button{flex:0 0 auto}.nav .mute{margin-left:.4rem}.screen{padding:1rem .8rem 5.4rem}.home,.sheet{padding-top:4.6rem}.home{align-items:flex-start;flex-direction:column;overflow:auto}.controls-card{width:100%}.hud-top .reset{margin-left:0;width:100%}.hud-bottom{padding-bottom:.4rem}.marker-card{margin-bottom:1rem}.explore .hud-bottom{padding-bottom:0}.sheet{padding-bottom:6rem}}@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}#boot{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;display:grid;place-content:center;justify-items:center;gap:.5rem;background:#04050c;text-align:center;transition:opacity .5s ease}#boot.gone{opacity:0;pointer-events:none}#boot p{margin:.6rem 0 0;font-size:1.35rem;letter-spacing:-.01em}#boot span{color:var(--dim);font-size:1rem}#boot .ring{width:64px;height:64px;border-radius:50%;border:4px solid rgba(63,224,200,.22);border-top-color:var(--teal);animation:spin 1.1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){#boot .ring{animation:none;border-top-color:var(--teal)}}.nav .who{display:inline-flex;align-items:center;min-height:44px;padding:.5rem .85rem;font-size:.95rem;border:1px solid var(--line);border-radius:10px;text-decoration:none;color:var(--ink);background:#141c32b8;transition:background var(--f)}.nav .who:hover{background:#263458d9}
