:root{--bg:#0b0f1a;--ink:#e8ecf5;--acc:#ffb347;--cy:#5ee1ff;--ok:#6dffa8;color-scheme:dark}

#c{position:fixed;inset:0;display:block;touch-action:none}
.ui{position:fixed;pointer-events:none}
#hud{top:calc(env(safe-area-inset-top,0px) + 10px);left:12px;background:#0b0f1acc;padding:8px 12px;border:1px solid #ffffff30;border-radius:10px}
#hud b{color:var(--acc)}
#vf{left:50%;top:50%;transform:translate(-50%,-50%);border:2px solid #fff;box-shadow:0 0 0 9999px #0000002e;border-radius:4px}
#vf:before,#vf:after{content:"";position:absolute;left:50%;top:50%;background:#fff}
#vf:before{width:16px;height:2px;margin:-1px -8px}#vf:after{width:2px;height:16px;margin:-8px -1px}
#vf span{position:absolute;left:4px;bottom:2px;font-size:11px;color:var(--cy)}
#msg{top:18%;left:50%;transform:translateX(-50%);background:#000b;padding:8px 14px;border-radius:20px;opacity:0;transition:opacity .3s;text-align:center;max-width:90vw}
#panel{bottom:120px;left:50%;transform:translateX(-50%);width:min(520px,92vw);background:#0b0f1aee;border:1px solid var(--cy);border-radius:12px;padding:12px 16px;display:none}
#panel h3{margin:0 0 4px;color:var(--cy)}#panel p{margin:0}
#tray{bottom:calc(env(safe-area-inset-bottom,0px) + 10px);left:50%;transform:translateX(-50%);display:flex;gap:8px;align-items:flex-end;pointer-events:auto;max-width:96vw;overflow-x:auto;padding:4px}
.ph{background:#fff;padding:4px 4px 14px;border-radius:3px;cursor:pointer;opacity:.85;transition:.15s;flex:none;color:#222;font-size:10px;text-align:center;position:relative}
.ph img{width:84px;height:63px;display:block}.ph.sel{outline:3px solid var(--acc);transform:translateY(-8px);opacity:1}
.ph i{position:absolute;top:-6px;left:-6px;background:#222;color:#fff;border-radius:50%;width:16px;height:16px;font-style:normal;line-height:16px}
.btns{top:calc(env(safe-area-inset-top,0px) + 10px);right:12px;display:flex;gap:6px;pointer-events:auto}
button{background:#1b2540;color:var(--ink);border:1px solid #ffffff40;border-radius:8px;padding:8px 12px;font:inherit;cursor:pointer}
button:hover{border-color:var(--acc)}
#flash{inset:0;background:#fff;opacity:0}#flash.on{animation:fl .35s}@keyframes fl{from{opacity:.9}to{opacity:0}}
#rw{inset:0;background:repeating-linear-gradient(0deg,#5ee1ff22 0 3px,#0000 3px 7px);opacity:0}#rw.on{animation:fl .6s}
.ov{position:fixed;inset:0;background:#05080ff0;display:flex;align-items:center;justify-content:center;text-align:center;z-index:9}
.ov div{max-width:520px;padding:20px}.ov h1{color:var(--acc);margin:0 0 8px}.ov li{text-align:left;margin:4px 0}
#win{display:none;z-index:30}#imgs{z-index:30}

html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 system-ui,-apple-system,sans-serif}
body.play{overflow:hidden}body:not(.play) .g{display:none!important}
#c.g{z-index:20}.ui.g{z-index:21}#bClose{border-color:var(--acc)}
#help{bottom:132px;left:12px;font-size:12px;background:#000a;padding:6px 10px;border-radius:8px;max-width:60vw}
:root{--blue:#009edb}
h1,h2,h3.big{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.01em;line-height:1.05}
nav{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:18px;padding:12px 4vw;background:#070a12d9;backdrop-filter:blur(10px);border-bottom:1px solid #ffffff18}
nav b{letter-spacing:.2em;font-size:12px}nav b i{color:var(--blue);font-style:normal}nav a{color:var(--ink);text-decoration:none;font-size:13px;opacity:.75}nav a:hover{opacity:1}nav .sp{flex:1}#cnt{font-size:12px;color:var(--ok)}
#bar{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,var(--blue),var(--acc));width:0;z-index:11}
.enter{background:var(--blue);border:0;color:#fff;font-weight:600;border-radius:30px;padding:10px 20px}.enter:disabled{opacity:.55;cursor:wait}.enter.big{font-size:17px;padding:15px 30px}
.hero{position:relative;min-height:92vh;display:flex;align-items:center;overflow:hidden;padding:0 6vw}
.stars{position:absolute;inset:-8%;background:linear-gradient(#070a1288,#070a12),var(--star) center/cover;animation:dr 160s linear infinite alternate}
@keyframes dr{to{transform:scale(1.15) translateX(-3%)}}
.hin{position:relative;max-width:900px}.eyebrow{letter-spacing:.25em;font-size:12px;color:var(--acc)}
.hero h1{font-size:clamp(46px,9vw,120px);margin:.2em 0}.sub{font-size:clamp(17px,2vw,22px);max-width:640px;opacity:.85;font-weight:300}
.hb{display:flex;gap:22px;align-items:center;margin-top:30px;flex-wrap:wrap}.ghost{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--ink)}
.scroll{position:absolute;bottom:20px;left:50%;font-size:11px;letter-spacing:.3em;opacity:.6}
.strip{display:flex;justify-content:space-around;flex-wrap:wrap;gap:20px;padding:40px 6vw;background:#0d1322;border-block:1px solid #ffffff14}
.strip div{text-align:center}.strip b{display:block;font:400 clamp(40px,6vw,72px) Georgia,serif;color:var(--acc)}.strip span{font-size:13px;opacity:.7;letter-spacing:.1em;text-transform:uppercase}
.sec{padding:90px 6vw;max-width:1180px;margin:auto}.sec h2{font-size:clamp(34px,5vw,60px);margin:0 0 .4em}.sec p{max-width:720px;font-size:18px;font-weight:300;opacity:.9}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-top:36px}
.steps div{background:#101830;border:1px solid #ffffff1c;border-radius:14px;padding:20px}.steps em{font:normal 34px Georgia,serif;color:var(--blue)}.steps h4{margin:.3em 0}.steps p{font-size:14px;margin:0}
.rel{position:relative;padding:100px 6vw;background:radial-gradient(circle at 15% 0,color-mix(in srgb,var(--a) 22%,transparent),transparent 55%),#070a12;border-top:1px solid #ffffff14}
.relin{max-width:1180px;margin:auto;display:grid;grid-template-columns:minmax(300px,5fr) 6fr;gap:6vw;align-items:start}
.stick{position:sticky;top:90px}.tag{font-size:12px;letter-spacing:.25em;color:var(--a);text-transform:uppercase}
.rel h2{font-size:clamp(36px,5vw,64px);margin:.2em 0}.lead{font:italic 22px/1.4 Georgia,serif;opacity:.9}
.stick img{width:100%;border-radius:10px;border:1px solid #ffffff30;box-shadow:0 20px 60px #000a,0 0 60px color-mix(in srgb,var(--a) 25%,transparent);background:#111}
.cap{font-size:11px;opacity:.55;margin:6px 0 14px}.cta{background:var(--a);color:#05070d;border:0;font-weight:700;padding:11px 18px;border-radius:30px}
.badge{display:inline-block;margin-left:10px;font-size:12px;opacity:.6}.badge.ok{color:var(--ok);opacity:1}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:46px}
.stats div{border-top:2px solid var(--a);padding-top:10px}.stats b{display:block;font:400 clamp(28px,4vw,46px) Georgia,serif}.stats span{font-size:12px;opacity:.7}
.tl{list-style:none;margin:0;padding:0 0 0 34px;position:relative;--p:0}
.tl:before,.tl:after{content:"";position:absolute;left:7px;top:6px;width:2px;bottom:0;background:#ffffff22}
.tl:after{background:var(--a);bottom:auto;height:calc((100% - 6px)*var(--p))}
.tl li{position:relative;padding-bottom:44px;opacity:.15;transform:translateY(20px);transition:.6s}.tl li.in{opacity:1;transform:none}
.tl li:before{content:"";position:absolute;left:-34px;top:6px;width:16px;height:16px;border-radius:50%;background:#070a12;border:3px solid var(--a)}
.tl time{font:400 30px Georgia,serif;color:var(--a)}.tl h4{margin:.1em 0 .2em;font-size:19px}.tl p{margin:0;font-size:16px;opacity:.85}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin:10px 0 0}
.facts div{background:#ffffff0a;border:1px solid #ffffff18;border-radius:10px;padding:12px}.facts dt{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--a)}.facts dd{margin:4px 0 0;font-size:14px}
#rail{position:fixed;right:16px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:12px;z-index:9}
#rail a{width:10px;height:10px;border-radius:50%;border:2px solid #fff8;transition:.3s}#rail a.on{background:var(--acc);border-color:var(--acc);transform:scale(1.4)}
.end{text-align:center;padding:100px 6vw;background:#0d1322}.end h2{font-size:clamp(34px,5vw,60px)}.end small{display:block;max-width:780px;margin:30px auto 0;opacity:.6;font-size:12px}.end a{color:var(--blue)}
@media(max-width:860px){.relin{grid-template-columns:1fr}.stick{position:static}#rail{display:none}.stats{grid-template-columns:1fr 1fr 1fr}}
@media(prefers-reduced-motion:reduce){.stars{animation:none}.tl li{transition:none}}
#opui{top:70px;left:12px;width:min(350px,88vw);max-height:calc(100vh - 160px);max-height:calc(100dvh - 160px);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;background:#0b0f1aee;border:1px solid var(--cy);border-radius:12px;padding:12px 14px;display:none;font-size:13px;line-height:1.5}
#opx{left:50%;top:50%;width:74px;height:74px;margin:-37px;border:2px solid var(--cy);border-radius:50%;display:none}#opx:after{content:"";position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px;background:var(--cy);border-radius:50%}
.cta.alt{background:transparent;color:var(--a);border:1px solid var(--a);margin-left:8px;margin-top:8px}#opc canvas{width:100%;border-radius:6px;margin-top:6px}

/* ===== premium layer ===== */
:root{--d:'Unbounded',system-ui,sans-serif;--e:cubic-bezier(.2,.7,.2,1)}
body{font-family:Inter,system-ui,sans-serif}
body:not(.ready):not(.play){overflow:hidden}
h1,h2,h3.big,.strip b,.stats b,.tl time,.steps em{font-family:var(--d);font-weight:500;letter-spacing:-.03em}
.rel h2{font-size:clamp(28px,4vw,54px)}.sec h2,.end h2{font-size:clamp(28px,4.4vw,56px)}
.lead{font-family:Inter;font-style:normal;font-weight:300;font-size:20px}
.stats b{font-size:clamp(22px,3vw,36px)}.tl time{font-size:22px}
#pre{position:fixed;inset:0;z-index:100;background:#05070d;display:flex;align-items:center;justify-content:center;transition:clip-path 1.1s var(--e),opacity .4s 1s;clip-path:inset(0 0 0 0)}
#pre.out{clip-path:inset(0 0 100% 0);opacity:0;pointer-events:none}
.pc{text-align:center;width:min(420px,80vw)}.pc b{font:300 clamp(70px,16vw,140px) var(--d);display:block;line-height:1}.pc span{letter-spacing:.5em;font-size:11px;opacity:.6}
.pbar{height:1px;background:#fff2;margin:26px 0}.pbar i{display:block;height:100%;width:0;background:var(--acc);box-shadow:0 0 12px var(--acc)}
.pbt{display:flex;gap:10px;justify-content:center;transition:.6s}.pbt button{border-radius:40px;padding:11px 20px;background:transparent}.pbt button:first-child{background:var(--acc);color:#05070d;border:0;font-weight:600}
.cur,.cur2{position:fixed;left:0;top:0;pointer-events:none;z-index:99;border-radius:50%;mix-blend-mode:difference}
.cur{width:6px;height:6px;background:#fff;margin:-3px}.cur2{width:38px;height:38px;margin:-19px;border:1px solid #fff;transition:width .3s,height .3s,margin .3s,background .3s}
.cur2.h{width:72px;height:72px;margin:-36px;background:#fff}body.play .cur,body.play .cur2{display:none}
@media(pointer:fine){body:not(.play),body:not(.play) a,body:not(.play) button{cursor:none}}
nav.nv{position:fixed;top:14px;left:50%;transform:translateX(-50%);width:min(1120px,94vw);box-sizing:border-box;padding:8px 10px 8px 22px;border-radius:60px;background:#0a0f1c99;backdrop-filter:blur(18px) saturate(1.4);border:1px solid #ffffff22;box-shadow:0 10px 40px #0008;gap:14px}
.br{font:700 12px var(--d);letter-spacing:.14em;color:#fff!important;opacity:1!important}.br i{color:var(--acc);font-style:normal}
.pill{position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:2px;padding:4px;border-radius:40px;background:#ffffff0d;border:1px solid #ffffff14}
.pill a{position:relative;padding:8px 18px;border-radius:30px;font-size:13px;opacity:.7;transition:.3s}.pill a.on{opacity:1;background:#ffffff14}
.pill a.on:before{content:"";position:absolute;left:25%;right:25%;top:-5px;height:3px;border-radius:3px;background:var(--acc);box-shadow:0 0 14px 3px var(--acc),0 4px 22px 6px #ffb34766}
.snd{font-size:12px;border-radius:30px;background:transparent;padding:8px 14px}.snd.on{color:var(--acc);border-color:var(--acc)}
nav.nv .enter{padding:10px 18px}#bar{z-index:60;box-shadow:0 0 12px var(--acc)}
@media(max-width:820px){.pill,#cnt{display:none}}
.shim{position:relative;overflow:hidden}.shim:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,#ffffff66 50%,transparent 70%);transform:translateX(-120%);animation:sh 3s infinite}@keyframes sh{to{transform:translateX(120%)}}
.hero{padding-top:90px;--hx:50%;--hy:50%}.hero:before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(520px circle at var(--hx) var(--hy),#ffb34722,transparent 60%)}
.hin{z-index:2}.hero h1{font-size:clamp(40px,8.2vw,118px);line-height:.98;margin:.25em 0}
.ln{display:block;overflow:hidden;padding-bottom:.08em}.ln span{display:block;transform:translateY(110%);transition:transform 1.3s var(--e)}body.ready .ln span{transform:none}.ln:nth-child(2) span{transition-delay:.15s;background:linear-gradient(90deg,#fff,var(--acc),#fff);background-size:200%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:gl 6s linear infinite}@keyframes gl{to{background-position:200%}}
.aur{position:absolute;inset:0;overflow:hidden;filter:blur(70px);opacity:.55;pointer-events:none}.aur i{position:absolute;border-radius:50%;width:46vw;height:46vw;animation:fl2 18s ease-in-out infinite alternate}
.aur i:nth-child(1){background:#009edb;left:-10%;top:-20%}.aur i:nth-child(2){background:#7a4dff;right:-12%;top:10%;animation-delay:-6s}.aur i:nth-child(3){background:#ff7a3d;left:30%;bottom:-40%;animation-delay:-12s;opacity:.7}@keyframes fl2{to{transform:translate(8vw,6vh) scale(1.2)}}
.orb{position:absolute;right:-4vw;top:50%;width:min(620px,60vw);aspect-ratio:1;margin-top:calc(min(620px,60vw)/-2);transition:transform .4s;pointer-events:none;z-index:1}
.orb i{position:absolute;inset:0;border:1px solid #ffffff26;border-radius:50%;animation:sp 40s linear infinite}.orb i:nth-child(2){inset:14%;animation-duration:26s;animation-direction:reverse;border-color:#ffb34755}.orb i:nth-child(3){inset:30%;animation-duration:16s;border-color:#5ee1ff55}
.orb i:after{content:"";position:absolute;top:-4px;left:50%;width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 16px 4px #fff}.orb i:nth-child(2):after{background:var(--acc);box-shadow:0 0 16px 4px var(--acc)}.orb i:nth-child(3):after{background:var(--cy);box-shadow:0 0 16px 4px var(--cy)}
.orb u{position:absolute;inset:44%;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#ffb347 40%,#5a2a00);box-shadow:0 0 80px 20px #ffb34755}@keyframes sp{to{transform:rotate(360deg)}}
.scroll{z-index:2;display:flex;flex-direction:column;align-items:center;gap:10px;transform:translateX(-50%)}.scroll i{width:1px;height:46px;background:linear-gradient(var(--acc),transparent);animation:ln 2s infinite}@keyframes ln{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.mq{overflow:hidden;border-block:1px solid #ffffff1a;background:#05070d;padding:18px 0;white-space:nowrap}.mq div{display:inline-block;animation:mq 38s linear infinite}.mq:hover div{animation-play-state:paused}.mq span{font:500 clamp(22px,3.4vw,44px) var(--d);margin:0 26px;color:transparent;-webkit-text-stroke:1px #ffffff55;transition:.3s}.mq span:hover{color:var(--acc);-webkit-text-stroke-color:var(--acc)}.mq em{color:var(--acc);font-style:normal}@keyframes mq{to{transform:translateX(-50%)}}
.rv{opacity:0;transform:translateY(34px);transition:opacity 1s var(--e),transform 1s var(--e)}.rv.in{opacity:1;transform:none}
.steps div,.facts div,.stats div,.strip div{position:relative;overflow:hidden;transition:transform .3s,border-color .3s;--mx:50%;--my:50%}
.steps div:before,.facts div:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:.3s;background:radial-gradient(260px circle at var(--mx) var(--my),#ffffff1c,transparent 60%)}.steps div:hover:before,.facts div:hover:before{opacity:1}.steps div:hover{border-color:var(--acc)}
.strip{background:linear-gradient(#0d1322,#070a12)}.strip b{background:linear-gradient(#fff,var(--acc));-webkit-background-clip:text;background-clip:text;color:transparent}
.tl li:before{transition:.6s;box-shadow:0 0 0 0 transparent}.tl li.in:before{background:var(--a);box-shadow:0 0 0 6px color-mix(in srgb,var(--a) 25%,transparent),0 0 20px var(--a)}
.tl:after{box-shadow:0 0 14px var(--a)}.tl li>*{transition:transform .4s}.tl li:hover>*{transform:translateX(8px)}
.tl li.in time{text-shadow:0 0 24px color-mix(in srgb,var(--a) 60%,transparent)}
.stick img{transition:transform .5s var(--e)}.stick img:hover{transform:scale(1.03) rotate(-.6deg)}
.cta{transition:box-shadow .3s}.cta:hover{box-shadow:0 0 30px color-mix(in srgb,var(--a) 60%,transparent)}
.ft{background:#05070d;border-top:1px solid #ffffff18;padding:110px 6vw 30px;text-align:left;position:relative;overflow:hidden}
.ftc{max-width:1180px;margin:0 auto 70px}.ftc h2{max-width:800px}.ftc p{margin:0 0 26px;max-width:560px;font-weight:300;opacity:.8}
.ftl{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:30px;padding-top:40px;border-top:1px solid #ffffff18}.ftl h5{margin:0 0 12px;font:500 11px var(--d);letter-spacing:.2em;color:var(--acc)}.ftl a{display:block;color:var(--ink);opacity:.7;text-decoration:none;padding:4px 0;font-size:14px;transition:.3s}.ftl a:hover{opacity:1;color:var(--acc);transform:translateX(6px)}
.ftw{font:700 clamp(40px,12.5vw,190px)/1 var(--d);text-align:center;margin:60px 0 10px;letter-spacing:-.05em;white-space:nowrap;--fx:50%;--fy:50%;background:radial-gradient(circle 260px at var(--fx) var(--fy),var(--acc),#ffffff14 75%);-webkit-background-clip:text;background-clip:text;color:transparent;user-select:none}
.ftb{max-width:1180px;margin:auto;display:flex;justify-content:space-between;align-items:center;font-size:12px;opacity:.7}.ftb button{border-radius:30px}
.ft small{margin:24px auto 0;max-width:1180px;text-align:left}
@media(max-width:860px){.ftl{grid-template-columns:1fr}.orb{opacity:.35}}
@media(prefers-reduced-motion:reduce){.aur i,.orb i,.shim:after,.mq div{animation:none}.rv,.ln span{transition:none;transform:none;opacity:1}}

/* ===== v3: ascii space + chapters ===== */
.hero,.mq,.strip,.sec,#rel,.ft{position:relative;z-index:1}
.stars{opacity:.3}.rel{background:radial-gradient(circle at 15% 0,color-mix(in srgb,var(--a) 22%,transparent),transparent 55%)}
.strip{background:#0d1322aa}.mq{background:#05070dbb}.ft{background:#05070dcc}
.pill a{padding:8px 13px;font-size:12.5px}@media(max-width:1180px){#cnt{display:none}}@media(max-width:1000px){.pill{display:none}}
.sec h3.big{font-size:22px;margin:56px 0 14px}.chap{padding-top:120px}
.mapw{display:grid;grid-template-columns:1.1fr 1fr;gap:26px;margin-top:34px;align-items:center}.mapw svg{width:100%;max-height:520px;display:block}
.mapi{background:#101830cc;border:1px solid #ffffff1c;border-radius:16px;padding:22px;min-height:220px;backdrop-filter:blur(8px)}.mapi h3{font:500 22px var(--d);margin:.2em 0}.mapi ul{padding-left:18px;margin:10px 0 0;font-size:15px;font-weight:300}.mapi p{font-size:15px;margin:8px 0}.mapi .sub2{opacity:.7;font-size:13px}
.mk{cursor:pointer;outline:none}.mk circle{fill:var(--acc)}.mk .pu{fill:none;stroke:var(--acc);transform-box:fill-box;transform-origin:center;animation:pu 2s infinite}@keyframes pu{from{transform:scale(1);opacity:1}to{transform:scale(3.2);opacity:0}}
.mk text{fill:#fff;font:600 10px Inter,sans-serif;paint-order:stroke;stroke:#000b;stroke-width:3px}.mk.on circle:nth-child(2),.mk:hover circle:nth-child(2){fill:#fff}.mk:focus-visible circle:nth-child(2){stroke:#fff;stroke-width:3}.mf{fill:#ffffff88;font:italic 10px Inter,sans-serif}
.dgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px;margin-top:20px}
.dos{position:relative;overflow:hidden;background:linear-gradient(160deg,#ffffff12,#ffffff04);border:1px solid #ffffff1c;border-radius:18px;padding:24px;--mx:50%;--my:50%;transition:border-color .3s,transform .3s,opacity 1s var(--e)}.dos:hover{border-color:var(--a);transform:translateY(-4px)}
.dos:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:.3s;background:radial-gradient(300px circle at var(--mx) var(--my),color-mix(in srgb,var(--a) 22%,transparent),transparent 60%)}.dos:hover:before{opacity:1}
.dh{display:flex;justify-content:space-between;gap:8px;align-items:center;flex-wrap:wrap}.dos .tag{color:var(--a)}.st{font-size:11px;border:1px solid var(--a);color:var(--a);border-radius:20px;padding:3px 10px}
.dos h3{font:500 24px var(--d);letter-spacing:-.03em;margin:.5em 0 .3em}.dos blockquote{margin:0 0 16px;font-weight:300;font-style:italic;font-size:16px;color:#fff}.dos cite{display:block;font-size:10px;font-style:normal;opacity:.5;margin-top:4px;letter-spacing:.08em}
.dos dl{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 14px}.dos dt{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--a)}.dos dd{margin:2px 0 0;font-size:13.5px}
.dos .lr{font-size:14px;margin:0 0 10px}.dos summary{cursor:pointer;color:var(--a);font-size:13px;padding:6px 0}.dos ol{list-style:none;padding:0;margin:6px 0 10px;font-size:13.5px}.dos li{padding:6px 0;border-top:1px solid #ffffff14}.dos li time{font-weight:600;color:var(--a);margin-right:6px}
.src{font-size:12px;color:var(--ink);opacity:.7}.src:hover{color:var(--a);opacity:1}
@media(max-width:860px){.mapw{grid-template-columns:1fr}}
#scp{left:50%;bottom:16px;transform:translateX(-50%);display:none;gap:6px;align-items:center;background:#0b0f1aee;border:1px solid var(--cy);border-radius:40px;padding:6px 10px;pointer-events:auto;z-index:22;max-width:96vw;flex-wrap:wrap;justify-content:center}
#scp button{padding:6px 12px;border-radius:30px;font-size:13px;background:#ffffff10;color:#fff;border:1px solid #ffffff30;cursor:pointer}#scp button.on{background:var(--cy);color:#05070d;border-color:var(--cy)}
#scp .sep{width:10px}#scp input[type=range]{width:110px;accent-color:#5ee1ff}#zv{min-width:92px;text-align:center;font-size:12px;opacity:.85}
#lab{right:12px;top:70px;width:min(560px,94vw);max-height:calc(100vh - 150px);overflow:auto;background:#0b0f1aee;border:1px solid var(--cy);border-radius:12px;padding:12px 14px;display:none;pointer-events:auto;font-size:13px;z-index:22}
#lab canvas{width:100%;display:block;border-radius:6px;margin:6px 0;background:#05080f}#lab #kc1{cursor:crosshair}
.chip{display:inline-block;margin:2px;padding:5px 10px;border-radius:20px;border:1px solid #ffffff40;background:#ffffff10;color:#fff;font-size:12.5px;cursor:pointer}.chip.on{background:var(--cy);color:#05070d;border-color:var(--cy)}
.pt{padding:6px 9px;border:1px solid #ffffff22;border-radius:8px;margin:4px 0;cursor:pointer}.pt.on{border-color:var(--acc);background:#ffffff0d}
#hots{inset:0;z-index:21;pointer-events:none;overflow:hidden}
.hot{position:absolute;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;border:2px solid var(--cy);background:#0b0f1acc;color:#fff;display:none;align-items:center;justify-content:center;font-weight:700;pointer-events:auto;cursor:pointer;animation:pu2 2s infinite;padding:0}
.hot.hid{border-style:dashed}.hot.on{background:var(--acc);color:#000;border-color:var(--acc)}
.tg{position:absolute;width:34px;height:34px;margin:-17px 0 0 -17px;border:0;background:none;pointer-events:auto;cursor:pointer;display:none;padding:0}
.tg i{position:absolute;inset:0;border:2px solid #ffd27a;border-radius:50%;animation:pu2 2s infinite}.tg.done i{border-color:#6dffa8}.tg.on i{border-color:#fff}
.tg span{position:absolute;left:40px;top:6px;white-space:nowrap;font-size:12px;color:#ffd27a;text-shadow:0 0 4px #000}.tg.done span{color:#6dffa8}
@keyframes pu2{50%{box-shadow:0 0 0 8px #5ee1ff22}}

/* ===== v4 amendments ===== */
/* icons + flexbox buttons */
.ic{width:1.15em;height:1.15em;flex:none;display:inline-block;vertical-align:-.2em}
button,.cta,.enter{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.ov h1{display:flex;align-items:center;justify-content:center;gap:12px}
.ghost{display:inline-flex;align-items:center;gap:8px}
.mq em{display:inline-flex;vertical-align:middle}.mq em .ic{width:.9em;height:.9em}
.ftb{flex-wrap:wrap;gap:12px}
.ftl a{display:flex;align-items:center;gap:6px}
.src{display:inline-flex;align-items:center;gap:6px}

/* navigation: three flex zones, nothing absolutely positioned, so nothing can overlap */
nav.nv{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:nowrap}
nav.nv .br{flex:none}
nav.nv .pill{position:static;left:auto;transform:none;flex:0 1 auto;min-width:0;margin:0 auto;white-space:nowrap}
nav.nv .pill a{white-space:nowrap}
nav.nv .nact{display:flex;align-items:center;gap:10px;flex:none}
nav.nv .snd{display:inline-flex;align-items:center;gap:8px;min-width:118px;justify-content:center;white-space:nowrap}
nav.nv .enter{white-space:nowrap}
#cnt{white-space:nowrap}
@media(max-width:1280px){.pill a{padding:8px 10px}#cnt{display:none}}
@media(max-width:560px){nav.nv{padding-left:16px}nav.nv .snd{min-width:0;padding:9px 11px}nav.nv .snd .sl{display:none}nav.nv .enter{padding:9px 14px;font-size:13px}}

/* custom cursor: above the preloader, hidden until the pointer first moves */
.cur,.cur2{z-index:300;opacity:0;transition:opacity .25s}
.cur2{transition:opacity .25s,width .3s,height .3s,margin .3s,background .3s}
body.mm .cur,body.mm .cur2{opacity:1}
@media(pointer:fine){
body:not(.play),body:not(.play) a,body:not(.play) button{cursor:auto}
body.mm:not(.play),body.mm:not(.play) a,body.mm:not(.play) button,body.mm:not(.play) .pbox canvas{cursor:none}
}
#pre .pbt{flex-wrap:wrap}

/* in-museum controls wrap instead of overflowing */
.btns{flex-wrap:wrap;justify-content:flex-end;max-width:min(calc(100vw - 24px),640px)}
#hud{max-width:min(46vw,420px)}
@media(max-width:760px){#hud{max-width:calc(100vw - 24px)}.btns{left:12px;right:12px;top:calc(env(safe-area-inset-top,0px) + 62px);justify-content:flex-start;max-width:none}#opui{top:112px;max-height:calc(100vh - 200px);max-height:calc(100dvh - 200px)}}

/* relic sections alternate sides */
.acts{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:6px}
.acts .cta,.acts .cta.alt{margin:0}
.rel.flip{background:radial-gradient(circle at 85% 0,color-mix(in srgb,var(--a) 22%,transparent),transparent 55%),#070a12}
.rel.flip .relin{grid-template-columns:minmax(0,6fr) minmax(300px,5fr)}
.rel.flip .relin>aside{order:2}
@media(max-width:860px){.rel.flip .relin{grid-template-columns:1fr}.rel.flip .relin>aside{order:0}}

/* ===== planets ===== */
.plan{display:flex;flex-direction:column;align-items:center;gap:20px;margin:44px auto 10px;width:100%}
.pbox{--ps:min(660px,88vw,86vh);position:relative;width:var(--ps);aspect-ratio:1;flex:none}
.pbox:before{content:"";position:absolute;inset:-10%;border-radius:50%;background:radial-gradient(circle,var(--gl) 40%,transparent 68%);pointer-events:none}
.plan[data-k=moon]{--gl:#aebcff30}.plan[data-k=mars]{--gl:#ff6a2a3d}
.pbox canvas{position:absolute;inset:0;width:100%;height:100%;border-radius:50%;opacity:0;transition:opacity .8s;cursor:pointer}
.plan[data-k=moon] canvas{box-shadow:0 0 70px 2px #b9c6ff26}.plan[data-k=mars] canvas{box-shadow:0 0 70px 4px #ff7a3d30}
.plan.rdy canvas{opacity:1}
.pph{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 36% 32%,#cfd6e6,#7b8398 55%,#262b3d);opacity:.35;filter:blur(3px);transition:opacity .8s}
.plan[data-k=mars] .pph{background:radial-gradient(circle at 36% 32%,#e0a070,#a8532c 55%,#3a1a10)}
.plan.rdy .pph{opacity:0}
.pin{position:absolute;width:52px;height:52px;margin:-26px 0 0 -26px;padding:0;border:0;border-radius:50%;background:none;z-index:2;color:#1a1000;transition:opacity .25s}
.pin b{position:relative;display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 3px #0b0f1a99,0 6px 18px #000a;transition:transform .2s,background .2s}
.pin b:before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--acc);animation:pn 2.2s infinite}
@keyframes pn{from{transform:scale(1);opacity:.9}to{transform:scale(2.3);opacity:0}}
.pin:hover b,.pin.on b,.pin:focus-visible b{background:#fff;transform:scale(1.18)}
.pin:focus-visible{outline:2px solid #fff;outline-offset:-4px}
.pin em{position:absolute;top:calc(50% + 17px);left:50%;transform:translateX(-50%);font:600 11px/1 Inter,sans-serif;font-style:normal;white-space:nowrap;color:#fff;text-shadow:0 1px 3px #000,0 0 8px #000;pointer-events:none}
@media(max-width:620px){.pin em{display:none}}
.sbx{position:absolute;left:0;top:0;z-index:6;width:min(300px,calc(100vw - 24px));box-sizing:border-box;padding:14px 16px;border-radius:16px;background:linear-gradient(160deg,#151d38f4,#0a0f1cf4);border:1px solid #ffffff2e;border-top:2px solid var(--acc);box-shadow:0 18px 50px #000b,0 0 40px #ffb34718;backdrop-filter:blur(10px);pointer-events:none;opacity:0;transform:translateY(6px) scale(.97);transition:opacity .18s,transform .18s;font-size:13px;line-height:1.5}
.sbx.on{opacity:1;transform:none}
.sbx:after{content:"";position:absolute;bottom:-8px;left:var(--tx,50%);width:14px;height:14px;margin-left:-7px;transform:rotate(45deg);background:#0a0f1c;border-right:1px solid #ffffff2e;border-bottom:1px solid #ffffff2e;border-radius:0 0 4px 0}
.sbx.dn:after{bottom:auto;top:-9px;border:0;border-left:1px solid #ffffff2e;border-top:2px solid var(--acc);border-radius:4px 0 0 0;background:#151d38}
.sbh{display:flex;align-items:center;gap:7px;color:var(--acc);font-size:11.5px;letter-spacing:.04em}
.sbx h4{font:500 17px/1.2 var(--d);letter-spacing:-.02em;margin:6px 0 2px}
.sbs{opacity:.65;font-size:12px}
.sbx ul{margin:9px 0 0;padding:0;list-style:none}.sbx li{position:relative;padding:3px 0 3px 15px}.sbx li:before{content:"";position:absolute;left:0;top:11px;width:7px;height:2px;border-radius:2px;background:var(--acc)}
.sbx p{margin:8px 0 0;font-size:13px;font-weight:300;opacity:.92;max-width:none}.sbx p.sbd{font-weight:600;opacity:1;color:#fff}
.phint{display:flex;align-items:center;gap:8px;margin:0;font-size:13px;opacity:.65;max-width:none;text-align:center}
.pchips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:860px}
.pchip,.ppb{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:30px;border:1px solid #ffffff2e;background:#ffffff0d;color:#fff;font-size:13px;transition:background .2s,border-color .2s}
.pchip:hover,.pchip.on{background:#ffb34726;border-color:var(--acc)}
.ppb{border-color:var(--cy);color:var(--cy)}
@media(prefers-reduced-motion:reduce){.pin b:before{animation:none}.sbx{transition:none}}

/* ===== mobile + touch layer ===== */
html{-webkit-text-size-adjust:100%}body:not(.play){overflow-x:hidden}
.hero{min-height:92dvh}.dgrid{grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
body.play{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}
#tc{position:fixed;inset:0;pointer-events:none;z-index:23;display:none}
body.play.touch #tc{display:block}
#joy{position:absolute;left:calc(env(safe-area-inset-left,0px) + 16px);bottom:calc(env(safe-area-inset-bottom,0px) + 92px);width:128px;height:128px;border-radius:50%;background:#0b0f1a99;border:2px solid #ffffff40;pointer-events:auto;touch-action:none}
#joy i{position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px;border-radius:50%;background:#5ee1ffbb;border:2px solid #fff;pointer-events:none}
#abt{position:absolute;right:calc(env(safe-area-inset-right,0px) + 14px);bottom:calc(env(safe-area-inset-bottom,0px) + 92px);display:flex;flex-wrap:wrap-reverse;justify-content:flex-end;gap:10px;max-width:210px;pointer-events:none}
.tb{pointer-events:auto;touch-action:none;min-width:62px;height:62px;padding:0 10px;border-radius:32px;background:#0b0f1acc;border:2px solid var(--cy);color:#fff;font-size:13px;font-weight:600;-webkit-user-select:none;user-select:none}
.tb.on{background:var(--cy);color:#05070d}.tb.big{min-width:96px;height:78px;border-color:var(--acc)}
body.touch #opui{pointer-events:auto;top:calc(env(safe-area-inset-top,0px) + 104px);left:8px;width:min(310px,64vw);max-height:30dvh;font-size:12px;padding:8px 10px}
body.touch #opui h3:after{content:" \25BE";opacity:.6}body.touch #opui.min h3:after{content:" \25B8"}#opui.min>div{display:none}
body.touch #scp{bottom:calc(env(safe-area-inset-bottom,0px) + 232px)}
body.touch #lab{top:calc(env(safe-area-inset-top,0px) + 104px);left:8px;right:8px;width:auto;max-height:44dvh}
body.touch .btns button{padding:7px 9px;font-size:12px}body.touch #help{bottom:calc(env(safe-area-inset-bottom,0px) + 236px);max-width:50vw;font-size:11px}
@media(max-width:560px){.sec,.rel{padding-left:5vw;padding-right:5vw;padding-top:64px;padding-bottom:64px}.chap{padding-top:84px}.strip{padding:28px 5vw}.mapi{padding:16px}.pbox{--ps:min(94vw,80vh)}.hb{gap:14px}.enter.big{padding:13px 22px;font-size:16px}.stats{gap:8px}.ftw{margin-top:30px}}
@media(max-height:480px) and (orientation:landscape){#joy{width:104px;height:104px;bottom:calc(env(safe-area-inset-bottom,0px) + 70px)}#abt{bottom:calc(env(safe-area-inset-bottom,0px) + 70px)}.tb{min-width:54px;height:54px}body.touch #scp{bottom:calc(env(safe-area-inset-bottom,0px) + 16px)}}