:root{--bg:#02040a;--glass:#0a101c85;--glass-strong:#0a101cb8;--line:#a0c8ff24;--text:#e9f0fb;--muted:#8d9bb3;--accent:#7fd3ff;--warm:#ffb46b;--font:"Manrope", -apple-system, "SF Pro Display", "Segoe UI", Roboto, sans-serif;--mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--font);margin:0;overflow:hidden}body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}button{font:inherit;color:inherit}canvas#scene{cursor:grab;width:100%;height:100%;display:block;position:fixed;inset:0}canvas#scene:active{cursor:grabbing}.hidden{opacity:0;pointer-events:none!important}#loader{z-index:50;background:radial-gradient(at 50% 40%,#0c1830 0%,#02040a 70%);place-items:center;transition:opacity .9s;display:grid;position:fixed;inset:0}.loader-inner{text-align:center;width:min(440px,86vw)}.loader-globe{background:radial-gradient(circle at 35% 32%,#5fb4ff 0%,#1c4f8f 38%,#07182f 72%);border-radius:50%;width:96px;height:96px;margin:0 auto 26px;animation:2.4s ease-in-out infinite pulse;box-shadow:0 0 60px #5aaaff59,inset -14px -10px 30px #0009}@keyframes pulse{50%{box-shadow:0 0 90px #5aaaff8c,inset -14px -10px 30px #0009}}#loader h1{letter-spacing:.02em;margin:0 0 8px;font-size:30px;font-weight:800}.loader-sub{color:var(--muted);margin:0 0 26px;font-size:13.5px;line-height:1.5}.bar{background:#ffffff14;border-radius:4px;height:4px;overflow:hidden}.bar i{background:linear-gradient(90deg,#4fa8ff,#9be3ff);border-radius:4px;width:0;height:100%;transition:width .2s;display:block}.loader-status{font-family:var(--mono);color:var(--muted);margin-top:12px;font-size:12px}#hud{z-index:10;pointer-events:none;text-shadow:0 2px 18px #000000b3;transition:opacity .8s;position:fixed;top:26px;left:30px}.brand{letter-spacing:.22em;text-transform:uppercase;color:#cfe3ff;font-size:13px;font-weight:700}.brand span:not(.brand-title){letter-spacing:.08em;text-transform:none;color:var(--muted);margin-top:4px;font-size:13px;font-weight:400;display:block}.age{align-items:baseline;gap:12px;margin-top:22px;display:flex}#age-value{letter-spacing:-.03em;font-variant-numeric:tabular-nums;font-size:76px;font-weight:800;line-height:.9}.age .unit{color:#b9c7dc;font-size:17px;font-weight:500}.period-line{align-items:center;gap:9px;margin-top:14px;font-size:16px;font-weight:600;display:flex}.period-line .dot{color:var(--muted)}#epoch-name{color:#b9c7dc;font-weight:500}#period-swatch{border-radius:3px;width:12px;height:12px;display:inline-block;box-shadow:0 0 12px}.stats{gap:26px;margin-top:20px;display:flex}.stat{flex-direction:column;gap:3px;display:flex}.stat .k{letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-size:11px}.stat .v{font-family:var(--mono);font-size:17px;font-weight:600}#event{z-index:10;background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(16px)saturate(1.2);border-radius:16px;width:min(360px,40vw);padding:18px 20px;transition:opacity .6s,transform .6s;position:fixed;bottom:150px;right:30px}#event.swap{opacity:0;transform:translateY(8px)}.event-age{font-family:var(--mono);color:var(--warm);letter-spacing:.06em;font-size:11.5px}#event h2{margin:6px 0 8px;font-size:20px;font-weight:700}#event p{color:#c6d2e4;margin:0;font-size:14px;line-height:1.55}#settings{z-index:20;flex-direction:column;align-items:flex-end;transition:opacity .8s;display:flex;position:fixed;top:22px;right:26px}.icon-btn{cursor:pointer;background:var(--glass);border:1px solid var(--line);color:#dce8fa;-webkit-backdrop-filter:blur(14px);border-radius:12px;place-items:center;width:40px;height:40px;transition:background .2s,transform .15s;display:grid}.icon-btn:hover{background:#283c5a99}.icon-btn:active{transform:scale(.95)}.panel{background:var(--glass-strong);border:1px solid var(--line);-webkit-backdrop-filter:blur(18px);transform-origin:100% 0;border-radius:16px;flex-direction:column;gap:9px;width:290px;margin-top:10px;padding:14px 16px;transition:opacity .25s,transform .25s;display:flex}.panel.closed{opacity:0;pointer-events:none;transform:scale(.96)translateY(-6px)}.seg{background:#ffffff0d;border-radius:10px;grid-template-columns:1fr 1fr;margin-bottom:4px;padding:3px;display:grid}.seg button{cursor:pointer;color:var(--muted);background:0 0;border:0;border-radius:8px;padding:7px 0;font-size:13px;font-weight:600}.seg button.on{color:#fff;background:#7fd3ff29}.tg{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:10px;font-size:13.5px;display:flex}.tg input{appearance:none;cursor:pointer;background:#ffffff1f;border-radius:10px;flex:none;width:32px;height:18px;margin:0;transition:background .2s;position:relative}.tg input:after{content:"";background:#cfd8e6;border-radius:50%;width:14px;height:14px;transition:transform .2s;position:absolute;top:2px;left:2px}.tg input:checked{background:#3f95e0}.tg input:checked:after{background:#fff;transform:translate(14px)}.slider{grid-template-columns:70px 1fr 38px;align-items:center;gap:8px;margin-top:4px;font-size:13px;display:grid}.slider b{font-family:var(--mono);text-align:right;font-size:12px;font-weight:600}.slider select{color:var(--text);border:1px solid var(--line);font:inherit;background:#ffffff12;border-radius:8px;grid-column:span 2;padding:5px 8px;font-size:13px}input[type=range]{accent-color:#5fb4ff;width:100%}.keys{color:var(--muted);margin:6px 0 0;font-size:11.5px;line-height:1.8}kbd{font-family:var(--mono);border:1px solid var(--line);background:#ffffff0d;border-radius:4px;padding:1px 5px;font-size:10.5px}.credits{color:#6f7d94;margin:2px 0 0;font-size:10.5px;line-height:1.5}#timeline-wrap{z-index:10;background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(16px)saturate(1.2);border-radius:18px;align-items:center;gap:18px;padding:14px 20px 14px 14px;transition:opacity .8s;display:flex;position:fixed;bottom:26px;left:30px;right:30px}.controls{align-items:center;gap:10px;display:flex}.play-btn{cursor:pointer;color:#fff;background:linear-gradient(145deg,#6cc4ff,#2f7fd6);border:0;border-radius:50%;place-items:center;width:50px;height:50px;transition:transform .15s,box-shadow .2s;display:grid;box-shadow:0 6px 24px #3c96ff66}.play-btn:hover{box-shadow:0 6px 32px #3c96ffa6}.play-btn:active{transform:scale(.94)}.speed{background:#ffffff0d;border-radius:10px;padding:3px;display:flex}.speed button{color:var(--muted);cursor:pointer;font-size:12.5px;font-weight:600;font-family:var(--mono);background:0 0;border:0;border-radius:7px;padding:6px 9px}.speed button.on{color:#fff;background:#7fd3ff29}#timeline{cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none;flex:1;height:62px;position:relative}#tl-periods{border-radius:5px;height:16px;position:absolute;top:16px;left:0;right:0;overflow:hidden}#tl-periods .p{color:#000000b8;letter-spacing:.04em;white-space:nowrap;border-right:1px solid #00000040;justify-content:center;align-items:center;font-size:10.5px;font-weight:700;display:flex;position:absolute;top:0;bottom:0;overflow:hidden}#tl-progress{pointer-events:none;background:#02060e80;border-radius:5px 0 0 5px;height:16px;position:absolute;top:16px;left:0}#tl-events{height:14px;position:absolute;top:0;left:0;right:0}#tl-events .ev{opacity:.55;cursor:pointer;background:#e6eefb;border-radius:2px;width:9px;height:9px;margin-left:-4.5px;transition:opacity .2s,transform .2s,background .2s;position:absolute;top:3px;transform:rotate(45deg)}#tl-events .ev:hover,#tl-events .ev.past{opacity:1}#tl-events .ev.past{background:var(--warm)}#tl-events .ev:hover{transform:rotate(45deg)scale(1.35)}#tl-events .ev .tip{display:none}#tl-ticks{height:20px;position:absolute;top:38px;left:0;right:0}#tl-ticks span{font-family:var(--mono);color:var(--muted);font-size:10.5px;position:absolute;transform:translate(-50%)}#tl-ticks span:before{content:"";background:#ffffff40;width:1px;height:4px;position:absolute;top:-5px;left:50%}#tl-head{pointer-events:none;width:0;position:absolute;top:8px;bottom:22px}#tl-head:before{content:"";background:#fff;border-radius:2px;width:2px;position:absolute;top:0;bottom:0;left:-1px;box-shadow:0 0 10px #fffc}#tl-head i{background:#fff;border-radius:50%;width:14px;height:14px;position:absolute;top:17px;left:-7px;box-shadow:0 0 0 3px #5fb4ff99,0 0 16px #5fb4ffe6}.tl-tip{z-index:30;pointer-events:none;white-space:nowrap;border:1px solid var(--line);background:#080c16e6;border-radius:8px;margin-top:-10px;padding:6px 10px;font-size:12px;position:fixed;transform:translate(-50%,-100%)}.tl-tip b{color:var(--warm);font-family:var(--mono);margin-right:6px;font-weight:600}#labels{pointer-events:none;z-index:5;position:fixed;inset:0;overflow:hidden}.lbl{white-space:nowrap;will-change:transform, opacity;transition:opacity .35s;position:absolute;top:0;left:0;transform:translate(-50%,-50%)}.lbl.continent{letter-spacing:.24em;text-transform:uppercase;color:#fff;text-shadow:0 0 6px #000000e6,0 1px 14px #000c;font-size:12.5px;font-weight:700}.lbl.region{letter-spacing:.08em;color:#e6ecf5;text-shadow:0 0 6px #000000f2;font-size:11.5px;font-weight:600}.lbl.super{letter-spacing:.34em;text-transform:uppercase;color:#ffd9a0;text-shadow:0 0 20px #000000e6,0 0 40px #ffaa5040;font-size:26px;font-weight:800}.lbl.ocean{letter-spacing:.3em;color:#9fdcff;text-shadow:0 0 10px #000a1ee6;font-size:16px;font-style:italic;font-weight:500}.lang{z-index:60;background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);border-radius:12px;gap:2px;padding:4px;display:flex;position:fixed;top:22px;left:50%;transform:translate(-50%)}.lang button{cursor:pointer;font-family:var(--mono);letter-spacing:.06em;color:var(--muted);background:0 0;border:0;border-radius:8px;padding:6px 11px;font-size:12px;font-weight:600;transition:background .2s,color .2s}.lang button:hover{color:#fff}.lang button.on{color:#fff;background:#7fd3ff2e}.legend{z-index:10;background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);border-radius:14px;flex-direction:column;gap:7px;padding:12px 14px;font-size:12.5px;transition:opacity .3s;display:flex;position:fixed;bottom:150px;left:30px}.lg-title{letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:2px;font-size:11px}.lg-row{align-items:center;gap:9px;display:flex}.legend .sw{border-radius:3px;width:22px;height:12px}.legend .sw.up{background:linear-gradient(90deg,#ff3c1459,#ff3a14)}.legend .sw.down{background:linear-gradient(90deg,#1e6eff59,#1e6eff)}.legend .ln{border-radius:2px;width:22px;height:3px}.legend .ln.sub{background:#ff5a2a;box-shadow:0 0 6px #ff5a2a}.legend .ln.ridge{background:#ffd95a;box-shadow:0 0 6px #ffd95a}body.map-mode .legend{bottom:150px}@media (width<=760px){.legend{font-size:11px;bottom:170px;left:10px}.lang{padding:3px;top:14px;left:14px;transform:none}.lang button{padding:6px 7px;font-size:11px}#hud{top:64px;left:16px}#age-value{font-size:48px}.stats{gap:16px}#event{width:auto;padding:14px;bottom:150px;left:16px;right:16px}#event p{font-size:12.5px}#timeline-wrap{flex-direction:column;align-items:stretch;gap:10px;padding:10px;bottom:10px;left:10px;right:10px}.controls{justify-content:center}#tl-periods .p{font-size:0}#settings{top:14px;right:14px}}body.map-mode #hud .age{margin-top:12px}body.map-mode #age-value{font-size:44px}body.map-mode .stats{margin-top:10px}body.map-mode .period-line{margin-top:8px;font-size:14px}body.map-mode #hud .brand span:not(.brand-title){display:none}body.map-mode #hud{grid-template-columns:auto auto auto;align-items:end;column-gap:34px;display:grid}body.map-mode #hud .brand{grid-column:1/-1;margin-bottom:4px}body.map-mode #event{width:min(420px,34vw);padding:12px 16px;top:22px;bottom:auto;right:86px}body.map-mode #event p{-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:12.5px;line-height:1.45;display:-webkit-box;overflow:hidden}body.map-mode #event h2{margin:3px 0 4px;font-size:16px}