@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Mono:wght@400;700&display=swap');
:root{color-scheme:dark;--bg:#060809;--fg:#e0e5e2;--muted:#7d8884;--green:#b8ffd8;--line:#ffffff18}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font-family:'DM Sans',sans-serif;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:11px 'Space Mono',monospace;letter-spacing:1px;color:var(--fg);background:#0d1312;border:1px solid #ffffff20;cursor:pointer;padding:13px 18px;transition:background .2s,border .2s}button:hover{background:#1c2923;border-color:#9ac8ae}button:focus-visible,a:focus-visible{outline:2px solid var(--green);outline-offset:5px}button:disabled{opacity:.4;cursor:default}canvas{position:fixed;inset:0;width:100%;height:100%;touch-action:none}.grain{pointer-events:none;position:fixed;inset:0}.grain{opacity:.045;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.5' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}header{position:fixed;top:0;left:0;right:0;padding:30px 44px;display:flex;justify-content:space-between;align-items:center;z-index:4}.wordmark{font-size:25px;letter-spacing:5px;font-weight:700;text-decoration:none;color:var(--fg)}.wordmark>span:first-child{color:var(--green)}.tag{font:9px 'Space Mono';letter-spacing:2px;color:#78827f;margin-left:18px}.topright{display:flex;gap:12px;align-items:center}.status,.eyebrow,.introfoot,.sphereLabel,footer,.small,.keys,.location,.mapbtn{font:10px 'Space Mono',monospace;letter-spacing:1.5px}.status{color:#87968e;margin-right:20px}.status i{display:inline-block;width:5px;height:5px;background:var(--green);border-radius:50%;margin-right:10px;box-shadow:0 0 10px #b8ffd8}#menu{font-size:17px;padding:7px 12px;border:none;background:none}#sound{background:transparent;border:none;font-size:9px}#intro{position:absolute;top:28%;left:7.5%;right:7.5%;pointer-events:none}.eyebrow{color:var(--green);font-size:9px}#intro .eyebrow span{color:#7d8884;margin-left:20px}h1{font-size:clamp(40px,5.4vw,83px);font-weight:500;line-height:1.08;letter-spacing:-4px;margin:30px 0 24px}h1 em{font-style:normal;color:#83948b}#intro p{font-size:14px;line-height:1.9;color:#8b9690}#intro button{pointer-events:auto;margin-top:25px}.primary{background:var(--green);color:#10251a;border:0;min-width:220px;display:inline-flex;justify-content:space-between;gap:35px;padding:19px 23px;font-weight:700}.primary:hover{background:#ddffed}.introfoot{color:#68756e;margin-top:44px;display:flex;gap:35px;font-size:8px}.sphereLabel{position:fixed;right:15%;bottom:24%;font-size:9px;color:#a0b9ac}.sphereLabel span{display:block;color:#596b60;font-size:8px;margin-top:10px}footer{position:fixed;bottom:28px;left:44px;right:44px;display:flex;justify-content:space-between;font-size:8px;color:#657169;border-top:1px solid var(--line);padding-top:22px}footer i{color:var(--green);margin-left:15px;font-size:6px}.mission{position:fixed;top:135px;left:44px;max-width:290px}h2{font-size:22px;letter-spacing:-.6px;font-weight:500;margin:13px 0 9px}.mission p{font-size:12px;color:var(--muted);line-height:1.7}#cores{display:flex;gap:7px;margin-top:23px}#cores span{width:35px;height:3px;background:#38463e}#cores span.on{background:var(--green);box-shadow:0 0 14px #b8ffd855}.location{position:fixed;right:44px;top:140px;text-align:right;color:#a5b5ab;font-size:9px}.location small{display:block;margin-top:12px;font-size:9px;color:#65796d}.crosshair{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);color:#e4fff0;font-size:20px;pointer-events:none}.bottom{position:fixed;bottom:42px;left:44px;right:44px;display:flex;align-items:end;gap:35px}.small{font-size:8px;color:#80968a}.bottom b{display:block;margin-top:10px;font:28px 'Space Mono';font-weight:400}.bottom b small{font-size:12px;color:#6e8277}.pulse{border-radius:50%;width:80px;height:80px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:0;color:var(--green);font-size:18px}.pulse span{font-size:9px}.pulse small{font-size:7px;color:#75847c}.keys{margin-left:auto;color:#adbbb3;font-size:9px;line-height:2}.keys span{color:#576b5e}.mapbtn{position:fixed;right:44px;top:205px;font-size:9px;background:#07100c88}#toast{position:fixed;top:26%;left:50%;transform:translateX(-50%);font:11px 'Space Mono';color:var(--green);text-align:center;width:80%;opacity:0;transition:opacity .4s;pointer-events:none}dialog{background:#0a100e;color:var(--fg);border:1px solid #34483d;padding:44px;max-width:520px;width:calc(100% - 32px);box-shadow:0 0 120px #000;max-height:85vh;overflow:auto}dialog::backdrop{background:#020504bb;backdrop-filter:blur(12px)}.close{position:absolute;right:12px;top:10px;border:0;background:none;font-size:22px}dialog p{font-size:14px;color:#92a69a;line-height:1.8}dialog h2{font-size:30px}dialog h3{font-size:14px;font-weight:500;margin-top:25px}dialog .primary{margin-top:20px;width:100%}.line{padding:16px 0;border-bottom:1px solid #ffffff14;font:11px 'Space Mono';line-height:1.8}.line span{float:right;color:var(--green)}input[type=range]{width:100%;accent-color:var(--green);margin:25px 0}.freq{font:40px 'Space Mono';color:var(--green)}.wave{height:52px;background:repeating-linear-gradient(90deg,transparent 0 6px,#b8ffd850 7px 8px);mask-image:linear-gradient(transparent,black,transparent);margin:20px 0}[hidden]{display:none!important}@media(pointer:coarse){.keys{display:none}.pulse small{display:none}}@media(max-width:700px){header{padding:22px}.tag,.status{display:none}#intro{left:26px;right:20px;top:32%}h1{letter-spacing:-2px;font-size:45px}#intro p{font-size:12px;max-width:290px}#intro p br{display:none}.introfoot{gap:18px;font-size:7px;margin-top:28px}.sphereLabel{display:none}footer{left:23px;right:23px;bottom:22px;font-size:7px}footer span:last-child{display:none}.mission{left:22px;top:100px;max-width:235px}.mission h2{font-size:18px}.mission p{font-size:11px}.location{right:22px;top:auto;bottom:100px;font-size:8px}.mapbtn{right:22px;top:102px;font-size:0;padding:12px}.mapbtn:after{content:'⌘';font-size:20px}.bottom{left:22px;right:22px;bottom:25px;gap:15px}.bottom .primary{min-width:0;padding:15px;font-size:9px;gap:14px;margin-left:auto}.pulse{height:65px;width:65px;position:fixed;right:26px;bottom:155px}.keys{display:none}dialog{padding:35px 25px}#toast{top:37%;font-size:10px}}
/* Shared universe */
:root{--accent:#b8ffd8}body{overscroll-behavior:none;user-select:none}button{touch-action:manipulation}#transition{position:fixed;inset:0;background:#060809;pointer-events:none;opacity:0;transition:opacity .65s;z-index:8}#transition.active{opacity:1}.identity b{font-size:13px!important;letter-spacing:2px;color:var(--green)}.ghost{background:#0b151088;font-size:10px;padding:14px 18px}.ghost.active{border-color:#b8ffd870;color:var(--green)}.zenbtn{position:fixed;right:44px;top:255px;border:0;background:none;font-size:23px;color:#80978a}#restore{position:fixed;right:24px;bottom:26px;z-index:12;background:#07100c88;border-radius:50%;font-size:23px;padding:8px 15px}body.zen header,body.zen #hud{opacity:0;pointer-events:none}#mobileTip{display:none;position:fixed;bottom:100px;left:22px;max-width:180px;color:#6c8174;font:9px 'Space Mono';line-height:1.7;pointer-events:none;transition:opacity 1s}.atlas-dialog{max-width:820px}.atlas-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:25px 0}.realmcard{text-align:left;position:relative;min-height:125px;overflow:hidden;padding:22px;font:12px 'DM Sans';letter-spacing:0;background:linear-gradient(135deg,#14201980,#080c0b);border:1px solid #ffffff12}.realmcard.selected{border-color:#b8ffd880}.realmcard small{display:block;margin-bottom:14px;font:8px 'Space Mono';letter-spacing:1.5px;color:#89a394}.realmcard b{font-size:17px;font-weight:500;display:block;position:relative}.realmcard p{font-size:10px;line-height:1.5;margin-bottom:0;max-width:85%;color:#82988b}.realmcard:after{content:'◌';font:120px 'DM Sans';position:absolute;right:-13px;top:3px;color:var(--tint);opacity:.12;pointer-events:none}.realmcard:hover{background:#14241c}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:12px}.dialog-top button{font-size:9px;padding:10px}.spacebox{background:#ffffff04;border:1px solid #ffffff12;padding:17px;margin-top:20px}.spacebox p{font-size:12px;margin:8px 0 15px}.spacebox .row{display:flex;gap:8px;flex-wrap:wrap}.spacebox button{font-size:9px;padding:11px}.spacebox input{background:#0006;border:1px solid #ffffff25;color:#c8edda;font:12px monospace;padding:12px;width:150px;user-select:text}.linkbox{display:block;width:100%;font:11px monospace!important;word-break:break-all;user-select:text;color:var(--green)!important;margin-top:12px}.swatches{display:flex;gap:12px;margin:20px 0}.swatch{border-radius:50%;width:32px;height:32px;padding:0;background:var(--sw);border:3px solid #0a100e;outline:1px solid #ffffff20}.swatch.selected{outline-color:#fff}.setting-row{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff14;padding:16px 0;font-size:12px}.setting-row button{min-width:82px;font-size:9px;padding:10px}.setting-row input{width:100px;margin:0}.error{color:#edb7b7!important;font-size:11px!important}dialog p.note{font:10px 'Space Mono';line-height:1.8;color:#657e6e}.spaceTitle{font:9px 'Space Mono';letter-spacing:1px;color:#90a79b}.status.offline{color:#a38b73}.mission{transition:opacity .8s}.location{max-width:250px}.bottom{padding-bottom:env(safe-area-inset-bottom)}#portal{font-size:9px;min-width:155px;padding:15px}.pulse{background:#07100c99}#hud,header{transition:opacity .6s}.close{z-index:2}.line span{float:none;display:block;font-size:10px;margin-top:6px}#world{background:#060809}@media(max-width:700px){.mission{top:100px;max-width:230px}.mission p{max-width:215px}.mapbtn{top:100px}.zenbtn{top:155px;right:27px;font-size:23px;padding:5px}.bottom{bottom:24px;gap:14px}.bottom .identity{max-width:115px}.bottom #drift{font-size:9px;padding:12px}.bottom #portal{position:fixed;right:22px;bottom:235px;min-width:145px}.location{bottom:110px;right:22px;max-width:150px}.location small{font-size:8px}.pulse{bottom:155px}#mobileTip{display:block}.atlas-grid{gap:8px}.realmcard{padding:15px;min-height:125px}.realmcard b{font-size:15px}.realmcard p{font-size:10px}.dialog-top{display:block}.dialog-top button{margin-top:8px}.tag{display:none}}@media(prefers-reduced-motion:reduce){*{transition:none!important}.grain{display:none}}@media(max-height:500px){#intro{top:22%}h1{font-size:38px;margin:14px 0}#intro p{margin:8px 0}#intro button{margin-top:10px}.introfoot,footer{display:none}.mission{top:80px}.mission p{display:none}.pulse{bottom:90px}.location{top:80px;bottom:auto}.mapbtn{top:130px}.zenbtn{top:180px}}

#interact{min-width:170px;font-size:10px} @media(max-width:700px){#interact{position:fixed;right:22px;bottom:240px;min-width:150px}.mission{max-width:280px}.mission p{max-width:280px}}

/* Calm, compact settings and safe framing in either phone orientation. */
.howto{border-bottom:1px solid var(--line);padding:12px 0}.howto summary{font-size:12px;color:var(--green);cursor:pointer}.howto summary:focus-visible{outline:2px solid var(--green);outline-offset:4px}
header{padding-top:max(22px,env(safe-area-inset-top))}#sensorStatus{color:#a0b7aa;margin-top:0}.setting-row{gap:16px}.setting-row button{flex-shrink:0}.setting-row input{flex-shrink:0}
#restore{right:max(24px,env(safe-area-inset-right));bottom:max(26px,env(safe-area-inset-bottom))}
@media(max-height:500px) and (orientation:landscape){header{padding:12px max(22px,env(safe-area-inset-right))}.mission{top:65px;left:max(22px,env(safe-area-inset-left));max-width:210px}.mission h2{font-size:16px}.bottom{bottom:15px;left:max(22px,env(safe-area-inset-left));right:max(22px,env(safe-area-inset-right))}.pulse{right:24px;bottom:85px;width:55px;height:55px}.zenbtn{top:60px;right:24px}#interact{position:fixed;bottom:155px;right:24px;padding:12px;min-width:145px}#mobileTip,.keys{display:none}}

/* World gestures work beneath the HUD and in immersive view. */
/* iOS needs both selection and callout suppression for sustained game holds. */
html,body,#world,#hud,#hud *,header,header *,#intro,#intro *,#landingFooter,#restore,.grain{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#world,header a{-webkit-user-drag:none}
dialog,dialog *{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}
dialog button,dialog button *,dialog input[type=range]{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
dialog .linkbox,dialog input:not([type=range]),dialog textarea,dialog [contenteditable=true]{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}
body{touch-action:none}#hud,header,.mission,.bottom,.keys{pointer-events:none}#hud button,header button,header a{pointer-events:auto}body.zen #hud,body.zen #hud *,body.zen header,body.zen header *{pointer-events:none!important}dialog{touch-action:pan-y}#world{touch-action:none}

/* Tuning stays connected to the visible world. */
dialog.tuning-panel{position:fixed;inset:auto 16px max(24px,env(safe-area-inset-bottom)) 16px;margin:0 auto;width:min(460px,calc(100% - 32px));padding:25px 28px 22px;background:rgba(6,15,11,.88);border-color:rgba(184,255,216,.22);box-shadow:0 10px 60px #0008;overflow:auto;max-height:70dvh}
dialog.tuning-panel::backdrop{background:#02050425;backdrop-filter:none}.tuning-panel h2{font-size:22px;margin:10px 0}.tuning-panel p{font-size:12px;margin:0;padding-right:75px}.tuning-panel .freq{font-size:27px;margin-top:14px}.tuning-panel .freq small{font-size:13px}.tuning-panel input{margin:18px 0}.tuning-panel .primary{padding:14px 18px;margin-top:18px}.tuning-panel #quality{font-size:8px}#tuneGlow{position:absolute;right:28px;top:92px;width:64px;height:64px;border:1px solid #b8ffd880;border-radius:50%;box-shadow:0 0 25px #b8ffd812,inset 0 0 18px #b8ffd818;pointer-events:none;transition:opacity .2s}@media(max-height:500px){dialog.tuning-panel{left:auto;right:16px;bottom:12px;width:310px;max-height:calc(100dvh - 24px);overflow:auto;padding:20px}.tuning-panel h2{font-size:18px}.tuning-panel input{margin:12px 0}.tuning-panel .primary{margin-top:10px}}

.tune-sound{display:block;margin:10px 0 22px;padding:9px 12px;min-height:40px;font-size:10px;letter-spacing:.14em;border:1px solid #a8f0c744;color:#b8e5cb}.tune-sound:disabled{opacity:.55;cursor:default}
.memory-button{margin-top:5px;padding:8px 0;min-height:32px;background:transparent;border:0;border-bottom:1px solid #a8f0c72b;color:#a4c5b2;font-size:8px;letter-spacing:1.1px}.memory-entry{margin-top:27px;padding-top:22px;border-top:1px solid #a8f0c723}.memory-entry h3{font-size:19px;margin:10px 0}.memory-entry .memory-effect{font-size:11px;color:#b5d7c4;border-left:2px solid #a8f0c744;padding-left:12px}.memory-next{margin-top:25px;padding:20px;background:#a8f0c708;border:1px solid #a8f0c72b}.memory-next h3{margin:9px 0;font-size:17px}.memory-next p{font-size:12px;margin-bottom:0}.memory-ending{padding:18px 0;border-top:1px solid #a8f0c733;color:#c9e3d3!important}.memory-close{width:100%;margin-top:15px;padding:15px 8px;font-size:9px}.play-choices .next-story-action{border-color:#a8f0c799;background:#182b20}.memory-button:hover{background:transparent;border-color:#a8f0c7}.mission{max-width:310px}#phraseProgress{font-size:10px;color:#b1d9c2}dialog.tuning-panel{background:rgba(6,15,11,.97)}
@media(max-width:700px){.mission{max-width:250px}.mission p{max-width:240px}.memory-button{font-size:8px}.memory-entry h3{font-size:18px}}

.offer-voice{width:100%;margin-top:12px;background:#b8ffd8;color:#10251a;font-size:9px;padding:12px 8px}.offer-voice:hover{background:#d7ffe7}

.commons-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:20px 0;border-top:1px solid #a8f0c730;border-bottom:1px solid #a8f0c730}.commons-stats b{display:block;font:26px monospace;color:#b8ffd8}.commons-stats span{font:7px monospace;letter-spacing:1px;color:#91a699}.commons-place{padding:14px 0;border-bottom:1px solid #a8f0c720}.commons-place b{font:10px monospace;color:#c4e6d4;display:block}.commons-place span{font-size:11px;color:#8ba697}.commons-place p{font-size:11px;line-height:1.5;margin:6px 0}.mission p{line-height:1.6}#mobileTip{max-width:200px}

/* Touch pulse is on the world; keep the immersive toggle in one stable place. */
@media(pointer:coarse){#pulse{display:none}}
#hud,header{transition:opacity .3s ease}
#restore{top:255px;right:44px;bottom:auto;border:0;background:none;border-radius:0;font-size:23px;padding:13px 18px;color:#80978a}
@media(max-width:700px){#restore{top:155px;right:27px;padding:5px}}
@media(max-height:500px){#restore{top:180px}}
@media(prefers-reduced-motion:reduce){#hud,header{transition:none}}

/* Keep event feedback independent of the disappearing navigation. */
body.zen #hud{opacity:1;pointer-events:none}
#hud .mission,#hud .bottom,#hud .zenbtn{transition:opacity .6s ease}
body.zen #hud .mission,body.zen #hud .bottom,body.zen #hud .zenbtn,body.zen #mobileTip{opacity:0;pointer-events:none}
body.zen.context-active #hud .mission{opacity:1}
body.zen.context-active #commons{pointer-events:auto}
body.zen #hud #toast{pointer-events:none}
body.zen.context-active #hud .bottom{opacity:1}
body.zen #hud .bottom>*{opacity:0;pointer-events:none}
body.zen #hud .bottom #interact{opacity:1}
body.zen.context-active #hud .bottom #interact{pointer-events:auto}
@media(prefers-reduced-motion:reduce){#hud .mission,#hud .bottom,#hud .zenbtn{transition:none}}

.company-strip{position:fixed;right:122px;bottom:110px;max-width:220px;text-align:right;transition:opacity .6s;pointer-events:none}
#company{pointer-events:auto;margin-top:12px;background:#07100c99;font-size:8px;padding:12px 14px}
#socialEvent{font:10px 'Space Mono',monospace;line-height:1.7;color:#8fae9f;margin:12px 0 0;transition:opacity .6s}
body.zen .company-strip{opacity:0;pointer-events:none}body.zen #company{pointer-events:none}
body.zen.social-active .company-strip{opacity:1}body.zen.social-active #company{pointer-events:auto}
@media(max-width:700px){.company-strip{right:102px;bottom:92px;max-width:min(205px,calc(100vw - 124px))}#socialEvent{font-size:9px}}
@media(max-height:500px){.company-strip{bottom:28px;right:180px;max-width:220px}}
@media(prefers-reduced-motion:reduce){.company-strip,#socialEvent{transition:none}}

/* The universe's living instrument: light, memory and making share one heart. */
.universe-life{--life-period:6s;--life-scale:1.2;--life-glow:.2;position:fixed;right:max(28px,env(safe-area-inset-right));bottom:calc(106px + env(safe-area-inset-bottom));width:72px;height:72px;z-index:7;pointer-events:none;color:#b8ffd8}
.life-toggle{display:block;width:72px;height:72px;padding:0;border:0;border-radius:50%;background:radial-gradient(circle,#10211a88,transparent 72%);color:inherit;pointer-events:auto;transition:opacity .7s,background .4s;opacity:.88}
.life-toggle:hover,.life-toggle:focus-visible,.is-open .life-toggle{opacity:1;background:radial-gradient(circle,#1b382977,transparent 72%)}
.life-toggle:focus-visible,.life-currents button:focus-visible,#lifeClose:focus-visible{outline:1px solid #b8ffd88c;outline-offset:4px}
.life-orb{display:block;width:100%;height:100%;overflow:visible;stroke:currentColor;stroke-width:1;pointer-events:none}
.life-track{opacity:.2;stroke-width:.7}.life-online{color:#b8ffd8}.life-visitors{color:#c7b993}.life-activities,.life-streams{color:#afa5d2}
.life-heart{fill:#d1ffe6;stroke:none;transform-origin:120px 120px;animation:universe-heart var(--life-period) ease-in-out infinite}
.life-wave{stroke:#b8ffd8;stroke-width:.8;transform-origin:120px 120px;animation:universe-wave var(--life-period) ease-out infinite}
.life-aura{fill:#b8ffd8;stroke:none;opacity:var(--life-glow);filter:blur(12px)}
.life-orbit{transform-origin:120px 120px;animation:universe-orbit 90s linear infinite}.life-visitors .life-orbit{animation-duration:150s;animation-direction:reverse}.life-activities .life-orbit{animation-duration:120s}
.life-layer,.life-streams,.life-aura,.life-heart{transition:opacity .65s,stroke .65s}
.life-flow{transform-origin:120px 120px;animation:universe-flow var(--life-period) ease-in-out infinite;opacity:.5;stroke-width:.8}
.life-reading{fill:currentColor;stroke:#060b08;stroke-width:4;paint-order:stroke;letter-spacing:1px;font:9px 'Space Mono',monospace;font-variant-numeric:tabular-nums}
.life-view{position:absolute;right:0;bottom:88px;width:304px;max-width:calc(100vw - 40px);padding:18px 22px 22px;border:1px solid #b8ffd81c;background:radial-gradient(ellipse at 50% 42%,#0d1915f5,#060b09f5 72%);box-shadow:0 16px 65px #0008;pointer-events:auto;max-height:calc(100dvh - 225px);overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;animation:universe-unfold .35s ease-out}
body.life-inspecting{touch-action:pan-y}
.life-heading{display:flex;align-items:center;justify-content:space-between}.life-heading h2{font:8px 'Space Mono',monospace;font-weight:400;letter-spacing:2px;color:#aac5b7;margin:0}
#lifeClose{width:44px;height:44px;padding:0;margin:-8px -12px -5px 0;background:none;border:0;font-size:21px;color:#98b4a4}
.life-diagram{width:232px;height:232px;max-width:100%;margin:4px auto 12px}
.life-currents{display:flex;justify-content:center;gap:12px}.life-currents button{width:42px;height:42px;padding:10px;background:none;border:1px solid transparent;border-radius:50%;color:#829a8b;transition:color .4s,border-color .4s,background .4s}
.life-currents svg{width:20px;height:20px;stroke:currentColor;stroke-width:1;fill:none}.life-currents [aria-pressed=true]{border-color:#b8ffd840;background:#b8ffd808;color:#d1ffe6}
#life-online{color:#b8ffd8}#life-visitors{color:#c7b993}#life-activities{color:#afa5d2}
#lifeCaption{color:#9bb2a6;font:11px/1.7 'DM Sans',sans-serif;text-align:center;margin:16px 0 0;min-height:38px}
#lifeFootnote{color:#637f6f;font:8px/1.6 'Space Mono',monospace;text-align:center;margin:12px 0 0;min-height:26px}
.universe-life[data-layer=online] .life-diagram .life-visitors,.universe-life[data-layer=online] .life-diagram .life-activities,.universe-life[data-layer=online] .life-diagram .life-streams,
.universe-life[data-layer=visitors] .life-diagram .life-online,.universe-life[data-layer=visitors] .life-diagram .life-activities,.universe-life[data-layer=visitors] .life-diagram .life-streams,
.universe-life[data-layer=activities] .life-diagram .life-online,.universe-life[data-layer=activities] .life-diagram .life-visitors{opacity:.06}
.universe-life[data-layer=online] .life-diagram :is(.life-visitors,.life-activities) .life-reading,
.universe-life[data-layer=visitors] .life-diagram :is(.life-online,.life-activities) .life-reading,
.universe-life[data-layer=activities] .life-diagram :is(.life-online,.life-visitors) .life-reading{visibility:hidden}
.universe-life:not([data-state=live]) .life-heart{fill:none;stroke:#7b9587;stroke-dasharray:2 3;animation:none}
.universe-life:not([data-state=live]) :is(.life-wave,.life-streams,.life-aura){opacity:0;animation:none}
.universe-life:not([data-state=live]) .life-orbit{animation-play-state:paused}
.universe-life:not([data-state=live]) .life-online .life-track{stroke-dasharray:3 5;opacity:.4}
.universe-life[data-state=connecting] .life-online .life-track{transform-origin:120px 120px;animation:universe-orbit 12s linear infinite}
.universe-life[data-arrival=true] .life-aura{opacity:.5}
.universe-life[data-gentle=true] :is(.life-heart,.life-wave,.life-orbit,.life-flow,.life-track){animation:none}.universe-life[data-gentle=true] .life-wave{opacity:.3}
body.zen #hud .universe-life{opacity:1;pointer-events:none!important}body.zen #hud #lifeToggle{pointer-events:auto!important;opacity:.5}
body.zen #hud .universe-life.is-open #lifeToggle{opacity:1}body.zen #hud .universe-life.is-open .life-view,body.zen #hud .universe-life.is-open button{pointer-events:auto!important}
body.zen #hud .universe-life.is-open .life-heading,body.zen #hud .universe-life.is-open p,body.zen #hud .universe-life.is-open .life-diagram{pointer-events:auto!important}
@keyframes universe-heart{0%,100%{transform:scale(1);opacity:.75}20%{transform:scale(var(--life-scale));opacity:1}55%{transform:scale(1);opacity:.8}}
@keyframes universe-wave{0%{transform:scale(.8);opacity:0}20%{opacity:.35}90%,100%{transform:scale(2.35);opacity:0}}
@keyframes universe-flow{0%{transform:scale(1);opacity:0}20%{opacity:.65}75%,100%{transform:scale(.22);opacity:0}}
@keyframes universe-orbit{to{transform:rotate(360deg)}}
@keyframes universe-unfold{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:700px){.universe-life{right:max(18px,env(safe-area-inset-right));bottom:calc(86px + env(safe-area-inset-bottom));width:66px;height:66px}.life-toggle{width:66px;height:66px}.life-view{bottom:78px;width:288px;padding:16px 18px 18px;max-height:calc(100dvh - 200px)}.life-diagram{width:224px;height:224px}.life-currents{gap:12px}}
@media(max-height:620px){.universe-life{bottom:calc(20px + env(safe-area-inset-bottom));right:90px}.life-view{bottom:80px;right:-62px;max-height:calc(100dvh - 125px);width:288px;padding:10px 18px}.life-diagram{width:146px;height:146px;margin:0 auto 4px}#lifeCaption{margin-top:8px;min-height:0}#lifeFootnote{margin:5px 0 0;min-height:0}}
@media(prefers-reduced-motion:reduce){.universe-life *{animation:none!important;transition:none!important}.life-wave{opacity:.25}}

/* Readability is independent of bitmap resolution. Size actual layout and ink,
   never stretch a finished canvas or rasterize the interface with transform. */
:root{--ui-scale:1;--muted:#a1afa7}
#world{image-rendering:auto;filter:none}
.grain{opacity:.018}
header{padding:calc(30px * var(--ui-scale)) calc(44px * var(--ui-scale))}
.wordmark{font-size:calc(28px * var(--ui-scale))}
.tag,.status,.eyebrow,.introfoot,.sphereLabel,footer,.small,.keys,.location,.mapbtn{font-size:calc(11px * var(--ui-scale))}
.tag,.status,.introfoot,footer{color:#a1b2a7}
#menu{font-size:calc(22px * var(--ui-scale))}
button{font-size:calc(12px * var(--ui-scale));padding:calc(13px * var(--ui-scale)) calc(18px * var(--ui-scale))}
.primary{min-width:calc(220px * var(--ui-scale));padding:calc(19px * var(--ui-scale)) calc(23px * var(--ui-scale))}
#intro p{font-size:calc(16px * var(--ui-scale));color:#a1afa7}
h1{font-size:clamp(40px,5.4vw,calc(83px * var(--ui-scale)))}
.mission{top:calc(135px * var(--ui-scale));left:calc(44px * var(--ui-scale));max-width:min(42vw,calc(340px * var(--ui-scale)))}
.mission h2{font-size:calc(26px * var(--ui-scale));line-height:1.25}
.mission p{font-size:calc(15px * var(--ui-scale));line-height:1.65;max-width:none}
.memory-button{font-size:calc(11px * var(--ui-scale));line-height:1.7}
.bottom{left:calc(44px * var(--ui-scale));right:calc(44px * var(--ui-scale));bottom:calc(42px * var(--ui-scale))}
.keys{font-size:calc(12px * var(--ui-scale))}.keys span{color:#9bafa1}
.ghost,#company,.bottom #drift{font-size:calc(12px * var(--ui-scale))}
.pulse{width:calc(80px * var(--ui-scale));height:calc(80px * var(--ui-scale))}
.pulse span,.pulse small{font-size:calc(11px * var(--ui-scale));color:#a1b8a9}
.zenbtn,#restore{top:calc(255px * var(--ui-scale));right:calc(44px * var(--ui-scale));font-size:calc(26px * var(--ui-scale))}
#toast{font-size:calc(13px * var(--ui-scale));line-height:1.6;text-shadow:0 1px 4px #000}
dialog{max-width:calc(620px * var(--ui-scale));padding:calc(44px * var(--ui-scale))}
dialog p,dialog h3,.howto summary,.setting-row{font-size:calc(15px * var(--ui-scale))}
dialog h2{font-size:calc(30px * var(--ui-scale))}
dialog p.note,.setting-row button,.commons-place span,.commons-place p{font-size:calc(12px * var(--ui-scale));color:#a1b8a9}
.commons-stats span,.commons-place b{font-size:calc(11px * var(--ui-scale))}
.setting-row input{width:calc(120px * var(--ui-scale))}
.universe-life{width:calc(72px * var(--ui-scale));height:calc(72px * var(--ui-scale));bottom:calc(106px * var(--ui-scale) + env(safe-area-inset-bottom))}
.life-toggle{width:100%;height:100%}
.life-view{bottom:calc(88px * var(--ui-scale));width:calc(336px * var(--ui-scale));padding:calc(22px * var(--ui-scale));max-height:calc(100dvh - 210px * var(--ui-scale))}
.life-diagram{width:calc(256px * var(--ui-scale));height:calc(256px * var(--ui-scale))}
.life-heading h2,#lifeFootnote{font-size:calc(11px * var(--ui-scale));color:#9db3a6}
#lifeCaption,#socialEvent{font-size:calc(13px * var(--ui-scale))}
.life-reading{font-size:11px}
@media(max-width:700px){
 header{padding:22px}.mission{left:22px;top:100px;max-width:min(310px,calc(100vw - 68px))}
 .mission h2{font-size:22px}.mission p{font-size:14px}
 #intro p{font-size:15px;max-width:330px}.introfoot{font-size:9px}
 footer{font-size:9px}.bottom{left:22px;right:22px;bottom:24px}
 .zenbtn,#restore{top:155px;right:22px;font-size:26px}
 dialog{padding:35px 25px}.universe-life{width:66px;height:66px;bottom:calc(86px + env(safe-area-inset-bottom))}
 .life-view{bottom:78px;max-height:calc(100dvh - 200px)}
}
@media(max-height:620px){.life-view{max-height:calc(100dvh - 125px);bottom:80px}.life-diagram{width:146px;height:146px}.universe-life{bottom:calc(20px + env(safe-area-inset-bottom))}}
@media(max-height:500px){.mission{top:65px}.mission h2{font-size:18px}header{padding:12px 22px}.zenbtn,#restore{top:60px}.bottom{bottom:15px}}
/* Context choices remain crisp DOM text over the canvas at every resolution. */
.presence-actions,.shared-action{position:fixed;z-index:35;border:1px solid #9ac5ae40;background:#08110ff2;box-shadow:0 8px 26px #0006;padding:10px;display:flex;gap:6px;flex-wrap:wrap;max-width:288px;animation:presence-in .18s ease-out;touch-action:manipulation;user-select:none;-webkit-user-select:none}
.presence-actions[hidden],.shared-action[hidden]{display:none!important}
.presence-name,.shared-action>span{width:100%;font:calc(11px * var(--ui-scale)) monospace;letter-spacing:.08em;color:#a7ccba;padding:4px 5px 8px}
.presence-actions button,.shared-action button{min-height:44px;padding:8px 10px;color:#c7e5d6;border:1px solid #92b6a333;background:#11221a;font:calc(12px * var(--ui-scale)) monospace;cursor:pointer}
.presence-actions button:hover,.shared-action button:hover{background:#1b3528;border-color:#a2d9ba80}
.presence-actions button:focus-visible,.shared-action button:focus-visible{outline:2px solid #b8ffd8;outline-offset:2px}
.presence-actions button:disabled,.shared-action button:disabled{opacity:.5;cursor:default}
.shared-action{bottom:calc(90px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);max-width:min(460px,calc(100vw - 32px));width:max-content}
@keyframes presence-in{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.presence-actions,.shared-action{animation:none}}
.presence-actions{max-width:min(calc(288px * var(--ui-scale)),calc(100vw - 24px))}
.shared-action{max-width:min(calc(460px * var(--ui-scale)),calc(100vw - 32px))}
.presence-actions button,.shared-action button{min-height:calc(44px * var(--ui-scale));max-width:100%;white-space:normal}

/* Context help fades without removing its layout or input surface. */
#hint{transition:opacity .22s ease}
@media(prefers-reduced-motion:reduce){#hint{transition-duration:.1s}}
/* Optional local intentions; the canvas remains the entire movement surface. */
#journeyChoice{position:fixed;right:calc(36px * var(--ui-scale));top:calc(300px * var(--ui-scale));z-index:24;width:44px;height:44px;padding:9px;border:0;background:transparent;color:#afcfbd;opacity:.8;transition:opacity .22s;touch-action:manipulation}
#journeyChoice[hidden]{display:none!important}#journeyChoice svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.3}
.zen #journeyChoice{opacity:0;pointer-events:none}
.journey-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:22px 0}
.journey-options button{display:flex;align-items:flex-start;gap:14px;min-height:100px;padding:18px;text-align:left;white-space:normal;border:1px solid #9ccbb139;background:#0c1510;color:#d4e6db;touch-action:manipulation}
.journey-options button[aria-pressed=true]{border-color:#b8ffd8;background:#11251b}.journey-options button:hover{background:#14231a}
.journey-options svg{width:30px;min-width:30px;height:30px;fill:none;stroke:#a8d7bc;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.journey-options b{font:500 17px/1.3 system-ui,sans-serif;display:block}.journey-options small{display:block;font:13px/1.55 system-ui,sans-serif;color:#9aafa2;margin-top:6px}
.journey-options button:focus-visible,#journeyChoice:focus-visible{outline:2px solid #b8ffd8;outline-offset:3px}
.place-mark{width:64px;height:64px;float:right;margin-left:12px;fill:none;stroke:#aacdb8;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}.journey-commons .commons-place{min-height:100px}
@media(max-width:600px){.journey-options{grid-template-columns:1fr;gap:8px;margin:16px 0}.journey-options button{min-height:76px;padding:13px}.journey-options small{font-size:12px}#journeyChoice{right:20px;top:205px}}
@media(max-height:550px){#journeyChoice{top:108px}.journey-options{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){#journeyChoice{transition:none}}
/* The Chronicle is a nonmodal layer in the same world. Empty space still receives movement. */
#chronicleToggle{position:fixed;z-index:22;right:max(112px,calc(env(safe-area-inset-right) + 90px));top:max(12px,env(safe-area-inset-top));left:auto;width:44px;height:44px;padding:8px;color:#7ca18f;opacity:.55;border:0;background:transparent;transition:opacity .3s,color .3s}
#chronicleToggle:hover,#chronicleToggle:focus-visible,#chronicleToggle.remembered{opacity:1;color:#bbf8d7}
#chronicleToggle svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.2}
#chronicleView{position:fixed;inset:0;z-index:24;pointer-events:none;color:#c6dbd0;animation:chronicle-unfold .45s ease both}
.chronicle-heading{position:absolute;top:max(90px,12vh);left:50%;transform:translateX(-50%);width:min(760px,calc(100% - 40px));display:flex;align-items:center;justify-content:space-between;font:11px ui-monospace,monospace;letter-spacing:2px;color:#9bbdaa}
.chronicle-heading button{pointer-events:auto;width:44px;height:44px;font-size:26px;border:0;background:#07100b99;color:#bfd6ca}
#chronicleSky{position:absolute;top:22%;left:50%;transform:translateX(-50%);width:min(760px,calc(100% - 24px));height:36%;min-height:200px}
.chronicle-threads{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke-width:1;pointer-events:none}
.chronicle-node{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;width:48px;height:48px;border:0;padding:7px;background:#07100bd9;border-radius:50%;color:hsl(var(--memory-hue),38%,72%);transition:background .25s,color .25s}
.chronicle-node svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.chronicle-node:hover,.chronicle-node[aria-pressed=true]{color:#d9ffeb;background:#173324}
#chronicleDetail{position:absolute;top:61%;left:50%;transform:translateX(-50%);width:min(490px,calc(100% - 44px));max-height:28%;overflow:auto;pointer-events:auto;background:linear-gradient(90deg,#060a08e8,#060a08b8,#060a08e8);padding:12px 16px;border-left:1px solid #9ad1b33b;scrollbar-width:thin}
#chronicleDetail h2{font-size:clamp(21px,2vw,30px);line-height:1.2;font-weight:400;margin:10px 0;color:#d1dfd7}
#chronicleDetail p{font-size:clamp(13px,1vw,17px);line-height:1.65;margin:10px 0;color:#aabbb1}
#chronicleDetail .eyebrow{font-size:10px;letter-spacing:1.8px}#chronicleDetail small,.chronicle-date{font:11px/1.7 ui-monospace,monospace!important;color:#88a494!important}
.chronicle-actions{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.chronicle-actions button,#chroniclePages button{min-height:44px;border:1px solid #9bc3ae33;padding:10px 12px;font:11px ui-monospace,monospace;color:#bcdac9;background:#0b140e}
.chronicle-possibility{border-top:1px solid #99bb9922;font-size:13px;padding:10px 0}.chronicle-possibility summary{min-height:28px;cursor:pointer;color:#b6cdbe}
#chroniclePages{position:absolute;bottom:max(16px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;gap:8px;pointer-events:auto;white-space:nowrap}
#chroniclePlace{position:fixed;z-index:21;width:44px;height:44px;color:#9bbdaa;background:transparent;border:0;font-size:24px;opacity:.75}
.chronicle-open .mission,.chronicle-open .bottom,.chronicle-open .company-strip{opacity:.08!important;pointer-events:none!important}.chronicle-open #chronicleToggle{opacity:0;pointer-events:none}
@keyframes chronicle-unfold{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){#chronicleView{animation:none}.chronicle-node{transition:none}}
@media(min-width:2000px){#chronicleSky{width:min(1100px,65vw)}#chronicleDetail{width:650px}#chronicleDetail h2{font-size:36px}#chronicleDetail p{font-size:21px}.chronicle-heading{width:1100px;font-size:15px}.chronicle-node{width:60px;height:60px}}
@media(max-height:560px){#chronicleSky{top:22%;left:28%;width:48%;height:65%;min-height:160px}#chronicleDetail{left:76%;top:27%;width:42%;max-height:53%}.chronicle-heading{top:60px}}
#chronicleView,#chronicleToggle,#chroniclePlace{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#chronicleDetail{touch-action:pan-y}.chronicle-node:focus-visible,#chronicleToggle:focus-visible,#chroniclePlace:focus-visible{outline:1px solid #c4f9da;outline-offset:3px}
#chronicleView.closing{animation:chronicle-fold .24s ease forwards}
@keyframes chronicle-fold{to{opacity:0;transform:translateY(4px)}}
.chronicle-thread{stroke-dasharray:900;stroke-dashoffset:900;animation:chronicle-thread 1.2s ease forwards}
@keyframes chronicle-thread{to{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){#chronicleView.closing{animation:none;opacity:0}.chronicle-thread{animation:none;stroke-dashoffset:0}}
#world{transition:opacity .3s}.chronicle-open #world{opacity:.55}

.meeting-person{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;margin:8px 0;text-align:left;min-height:48px}.meeting-person small{color:#a5b8ad;font-size:11px;letter-spacing:0}#meetingReturn{display:block;margin-top:12px!important;font-size:10px}#meetingNote{max-width:410px;line-height:1.5!important}#sharelink{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default;touch-action:pan-y}
@media(max-width:700px){.meeting-entry #intro{top:16%;bottom:65px;overflow:auto;pointer-events:auto}.meeting-entry #intro h1{font-size:36px;margin:20px 0 15px}.meeting-entry #intro p{font-size:13px;line-height:1.5}.meeting-entry #intro button{margin-top:12px}.meeting-entry .introfoot{margin-top:18px;flex-wrap:wrap;gap:8px}}