/* Editorial hierarchy and transparent, optional game controls. */
.page{position:relative;z-index:2;pointer-events:none}.page button,.page a,.page input,.page select{pointer-events:auto}.header,.launch,footer{position:relative;z-index:3}
body:after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#071519f5 0%,#071519df 33%,#07151977 57%,#07151912 80%,transparent)}
:root[data-theme=day] body:after{background:linear-gradient(90deg,#e5eeebfa 0%,#e5eeebeb 34%,#e5eeeb80 58%,#e5eeeb0c 82%,transparent)}
.hero-copy{isolation:isolate}.hero-copy:before{content:'';position:absolute;inset:-12px -20px -8px -36px;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#071519f0 0%,#071519e8 77%,#07151900);filter:blur(12px)}
:root[data-theme=day] .hero-copy:before{background:linear-gradient(90deg,#e5eeebfc 0%,#e5eeebf5 77%,#e5eeeb00)}
.positioning{font-size:clamp(14px,1.45vw,17px);line-height:1.65;padding:13px 18px;margin-top:30px;border-left:2px solid var(--aqua);background:linear-gradient(90deg,#20c7b70e,#20c7b703 70%,transparent);max-width:550px}
.positioning>span:first-child{font-weight:600}.positioning strong{font-weight:700}
:root[data-theme=day] .positioning{background:linear-gradient(90deg,#f4f9f6f5,#f4f9f6a6 72%,transparent)}
.challenge-scene{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.network-space{position:relative;width:100%;height:440px;pointer-events:auto;touch-action:none;outline:none}.network-space:focus-visible{outline:1px solid var(--aqua);outline-offset:8px;border-radius:18px}
.visual-caption{bottom:auto;top:5px;color:var(--muted)}.visual-caption i{color:var(--aqua)}
.experience-dock{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:min(290px,calc(100% - 12px));padding:10px 44px 0 0}
.dock-actions{display:flex;align-items:center;gap:6px}
.play-network,.network-options,.network-mute{color:var(--soft);border:1px solid var(--glass-edge);background:#b2e3da08;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);cursor:pointer;border-radius:8px}
.play-network{font:600 12px/1.45 Manrope,sans-serif;min-height:44px;padding:10px 14px;text-align:left;flex:1;box-shadow:inset 0 1px #ffffff08;transition:border-color .2s,background .2s}
.play-network:hover{background:#20c7b717;border-color:var(--aqua)}
.network-options,.network-mute{display:grid;place-items:center;width:38px;height:38px;padding:9px;flex-shrink:0}.network-options svg,.network-mute svg{width:19px;height:19px;pointer-events:none}.network-options:hover,.network-mute:hover{color:var(--aqua);border-color:var(--aqua)}
.network-mute{position:absolute;right:0;bottom:28px;z-index:20}.network-mute .sound-cross{display:none}.network-mute[aria-pressed=true] .sound-cross{display:block}.network-mute[aria-pressed=true] .sound-waves{display:none}
:root[data-theme=day] .play-network,:root[data-theme=day] .network-options,:root[data-theme=day] .network-mute{background:#f6faf733;border-color:#007f7838}
.gesture-hint{position:absolute;left:50%;bottom:-27px;transform:translateX(-50%);width:290px;max-width:100%;text-align:center;color:var(--muted);font:400 9px/1.5 Manrope,sans-serif;margin:0;pointer-events:none}
.experience-ranking{font:400 9px/1.3 Manrope,sans-serif;margin:7px 0 0;width:100%;max-width:220px;color:var(--muted)}.experience-ranking summary{cursor:pointer;padding:3px 0}.experience-ranking table{width:100%;border-collapse:collapse;text-align:left;font-variant-numeric:tabular-nums;margin-top:4px}.experience-ranking th{font-weight:400;opacity:.8}.experience-ranking th,.experience-ranking td{padding:2px 3px;line-height:1.35}.experience-ranking td:nth-child(2){max-width:125px;overflow-wrap:anywhere}.experience-ranking td:last-child,.experience-ranking th:last-child{text-align:right;white-space:nowrap}.record-current{color:var(--aqua)}
.experience-panel{position:fixed;z-index:18;left:20px;bottom:20px;width:250px;max-width:calc(100vw - 40px);max-height:calc(100dvh - 40px);overflow:auto;padding:15px;border:1px solid var(--glass-edge);border-radius:12px;background:#102a305c;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 10px 40px #0001;font:400 11px/1.6 Manrope,sans-serif;overscroll-behavior:contain}
:root[data-theme=day] .experience-panel{background:#edf5f36b}
.experience-panel-heading{display:flex;align-items:center;justify-content:space-between;color:var(--ink);font-weight:600}.experience-panel button,.experience-dialog button{font:400 11px/1.4 Manrope,sans-serif;padding:8px 9px;min-height:36px;background:var(--glass);border:1px solid var(--line);border-radius:6px;color:var(--soft);cursor:pointer}.experience-panel-heading button{border:0;background:none;padding:3px 6px;font-size:20px;min-height:30px}.experience-controls{display:flex;flex-wrap:wrap;gap:6px}.experience-panel p{margin:8px 0;color:var(--muted)}.experience-clock{display:flex;gap:7px;align-items:center;margin:8px 0}.experience-clock output{font:600 13px/1.4 Manrope,sans-serif;font-variant-numeric:tabular-nums;color:var(--ink)}.experience-clock span{color:var(--muted);font-size:10px}.experience-panel button:disabled{opacity:.45;cursor:default}
.floating-target{position:absolute;z-index:15;width:46px;height:46px;display:grid;place-items:center;padding:6px;border-radius:50%;border:1px solid var(--aqua);background:var(--menu);color:var(--aqua);box-shadow:0 0 18px #20c7b73a;cursor:pointer}.floating-target svg{width:28px;height:28px;pointer-events:none}
.experience-dialog{color:var(--ink);background:var(--menu);border:1px solid var(--glass-edge);border-radius:14px;padding:23px;width:min(420px,calc(100% - 32px));font:400 13px/1.6 Manrope,sans-serif}.experience-dialog::backdrop{background:#071519bb;backdrop-filter:blur(5px)}.experience-dialog h2{font:600 23px/1.25 Manrope,sans-serif;margin:0 0 15px}.experience-dialog p{color:var(--muted)}.experience-dialog label{display:block;margin:12px 0 4px}.experience-dialog input,.experience-dialog select{display:block;width:100%;font:400 16px/1.4 Manrope,sans-serif;border:1px solid var(--line);padding:10px;border-radius:6px;background:var(--bg);color:var(--ink);margin-bottom:12px}.experience-dialog button{min-height:40px}#keepr-alias-error{color:var(--ink);min-height:18px}
@media(max-width:800px){.network-space{height:360px}.experience-dock{padding-right:38px}.play-network{font-size:11px;padding:9px}.network-options{width:32px;height:36px;padding:7px}}
@media(max-width:600px){.network-space{height:330px;margin-top:24px;margin-bottom:28px}.hero-copy:before{inset:-12px -15px -8px;background:linear-gradient(180deg,#071519f5 75%,transparent);filter:blur(9px)}:root[data-theme=day] .hero-copy:before{background:linear-gradient(180deg,#e5eeebfa 75%,#e5eeebc0 90%,transparent)}.experience-panel{left:12px;bottom:12px;width:250px;max-width:calc(100vw - 24px)}.experience-panel button{min-height:40px}.positioning{font-size:14px;padding:13px 15px;margin-top:24px}.experience-dock{width:290px;max-width:100%;padding-right:44px}.play-network{font-size:12px;padding:10px 12px}.network-options{width:36px;height:40px;padding:8px}.network-mute{bottom:28px;right:0}.visual-caption{top:0;font-size:6px}.gesture-hint{bottom:-26px}.experience-ranking{font-size:9px}}
@media(prefers-reduced-motion:reduce){.play-network{transition:none}}
/* Local light surfaces preserve contrast for the small green labels. */
:root[data-theme=day] .status>span:last-child,:root[data-theme=day] .date-label{background:#f4f9f6;padding:3px 5px;width:fit-content;border-radius:2px}
:root[data-theme=day] .visual-caption,:root[data-theme=day] .gesture-hint{background:#edf5f3e8;padding:3px 6px;border-radius:3px}
:root[data-theme=day] .experience-ranking[open]{background:#edf5f3e8;padding:4px 7px;border-radius:5px}

/* Keep text colors in step with the selected theme during the switch. */
body{transition:background .4s}
/* Keep the countdown and footer legible even behind the largest generation. */
.launch,footer{background:linear-gradient(90deg,#071519c7,#071519cf)}
:root[data-theme=day] .launch,:root[data-theme=day] footer{background:linear-gradient(90deg,#f4f9f6a6,#f4f9f6f5)}