:root{--bg:#05070b;--panel:#0a0e16;--line:#252c38;--text:#f4f3ed;--muted:#7c8797;--acid:#d8ff57}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:Manrope,system-ui,sans-serif}button,select,input{font:inherit}.topbar{height:70px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 20px;background:#080b11;position:relative;z-index:5}.brand{display:flex;gap:11px;align-items:center;color:var(--muted);text-decoration:none;font:500 .66rem/1.1 DM Mono;letter-spacing:.12em}.brand b{color:var(--text);font-weight:500}.brand-mark{font-size:2rem;color:var(--acid);line-height:1}.status{margin-left:auto;display:flex;align-items:center;gap:9px;font:400 .7rem DM Mono;color:var(--muted)}.status i,.pulse{width:7px;height:7px;background:var(--acid);border-radius:50%;box-shadow:0 0 12px var(--acid);animation:pulse 1.8s infinite}.icon-btn{margin-left:20px;border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:50%;width:32px;height:32px;cursor:pointer}@keyframes pulse{50%{opacity:.3}}.workspace{height:calc(100vh - 70px);display:grid;grid-template-columns:250px 1fr}.rail{background:#080b11;border-right:1px solid var(--line);padding:24px 18px;overflow:auto;position:relative;z-index:4}.rail-block{border-bottom:1px solid var(--line);padding-bottom:22px;margin-bottom:22px}.rail-label{font:500 .65rem DM Mono;letter-spacing:.14em;color:#596474;margin:0 0 12px}.tool{display:flex;width:100%;gap:10px;align-items:center;border:0;background:transparent;color:var(--muted);padding:9px 10px;text-align:left;border-radius:5px;font-size:.83rem;cursor:pointer}.tool:hover,.tool.active{background:#141a24;color:var(--text)}.tool.active span{color:var(--acid)}.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:9px 2px;font-size:.8rem;color:#aeb5bf;cursor:pointer}.toggle-row input{position:absolute;opacity:0}.toggle-row i{display:block;width:32px;height:18px;background:#242b36;border-radius:20px;position:relative;transition:.2s}.toggle-row i:after{content:"";width:12px;height:12px;position:absolute;top:3px;left:3px;border-radius:50%;background:#737d8b;transition:.2s}.toggle-row input:checked+i{background:#a9c945}.toggle-row input:checked+i:after{left:17px;background:#071006}.compare-block label{display:block;color:#66717f;font:500 .6rem DM Mono;letter-spacing:.1em}.compare-block select{display:block;width:100%;margin-top:6px;padding:10px;border:1px solid var(--line);background:#0e131c;color:var(--text);border-radius:4px;font-size:.8rem}.compare-line{height:44px;display:flex;align-items:center;gap:10px;color:var(--muted)}.compare-line b{color:var(--acid);font:400 .73rem DM Mono}.compare-block>p:last-child{font:400 .65rem DM Mono;color:#65707d;margin:10px 0 0}.rail-hint{font:400 .61rem/1.6 DM Mono;color:#525d6a}.map-wrap{position:relative;overflow:hidden;background:radial-gradient(circle at 50% 50%,#121b2b 0,#080b12 46%,#030509 100%);touch-action:none}.map-wrap:after{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(#fff 0.65px,transparent .8px),radial-gradient(#86a7dc .55px,transparent .75px);background-size:83px 83px,137px 137px;background-position:10px 8px,50px 70px;opacity:.38}canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1}.map-head{position:absolute;z-index:2;top:28px;left:32px;right:32px;display:flex;justify-content:space-between;pointer-events:none}.map-head p{font:500 .61rem DM Mono;letter-spacing:.13em;color:var(--muted);margin:0 0 8px;display:flex;align-items:center;gap:8px}.map-head h1{font-size:clamp(1.7rem,3vw,3rem);letter-spacing:-.055em;line-height:1;margin:0}.map-head h1 em{font-style:normal;color:var(--acid)}.zoom-readout{text-align:right;font:400 .61rem DM Mono;color:var(--muted)}.zoom-readout span,.zoom-readout b{display:block}.zoom-readout b{color:var(--text);font-size:.75rem;margin-top:6px}.map-controls{position:absolute;z-index:3;left:26px;bottom:88px;display:flex;background:#0c1119;border:1px solid var(--line);border-radius:5px;overflow:hidden}.map-controls button{border:0;border-right:1px solid var(--line);background:transparent;color:var(--text);height:36px;min-width:38px;cursor:pointer}.map-controls button:hover{background:#1a2230}.map-controls #reset-view{font:500 .6rem DM Mono;padding:0 12px;color:var(--muted);border:0}.timebar{position:absolute;z-index:3;left:26px;right:26px;bottom:20px;height:50px;background:#0b1018e8;border:1px solid var(--line);display:flex;align-items:center;padding:0 14px;gap:14px;border-radius:5px;backdrop-filter:blur(10px)}.timebar button{border:0;background:var(--acid);color:#081008;border-radius:3px;padding:8px 11px;font:600 .62rem DM Mono;cursor:pointer}.timebar input{flex:1;accent-color:var(--acid)}.timebar>div{width:112px}.timebar span,.timebar small{display:block;font:400 .66rem DM Mono}.timebar small{color:var(--muted);font-size:.57rem;margin-top:3px}.detail{position:absolute;z-index:4;right:24px;top:110px;width:270px;background:#0b1019ed;border:1px solid #323a48;padding:23px;backdrop-filter:blur(16px);transition:.25s}.detail.hidden{transform:translateX(calc(100% + 30px));opacity:0;pointer-events:none}.detail-close{position:absolute;right:12px;top:10px;border:0;background:transparent;color:var(--muted);font-size:1.4rem;cursor:pointer}.detail>p{font:500 .61rem DM Mono;letter-spacing:.13em;color:var(--acid);margin:0 0 14px}.detail-title{display:flex;align-items:center;gap:12px}.detail-title span{width:24px;height:24px;border-radius:50%;box-shadow:inset -6px -3px 8px #0008}.detail h2{font-size:1.7rem;margin:0}.detail dl{margin:22px 0}.detail dl div{border-top:1px solid var(--line);padding:11px 0}.detail dt{font:500 .57rem DM Mono;color:#67717e;letter-spacing:.09em}.detail dd{font:400 .73rem DM Mono;margin:5px 0 0}.detail>button:last-child{width:100%;padding:10px;border:1px solid #46505f;background:transparent;color:var(--text);font:500 .61rem DM Mono;cursor:pointer}.help-card{display:none;position:absolute;z-index:8;right:20px;top:20px;width:min(340px,calc(100% - 40px));background:#101721;border:1px solid #3a4452;padding:22px;box-shadow:0 18px 70px #000a}.help-card.open{display:block}.help-card button{float:right;border:0;background:none;color:var(--muted);font-size:1.2rem}.help-card h2{font-size:1.2rem;margin:0 0 14px}.help-card p{font-size:.78rem;line-height:1.6;color:#a8b0bb}.help-card b{color:var(--acid)}
@media(max-width:760px){.topbar{height:58px}.workspace{height:calc(100vh - 58px);display:block}.rail{position:absolute;z-index:6;left:10px;right:10px;bottom:10px;height:auto;padding:8px;background:#090d14ed;border:1px solid var(--line);border-radius:7px;display:flex;gap:5px;overflow:visible}.rail-block:first-child{display:flex}.rail-block{border:0;margin:0;padding:0}.rail-block:nth-child(2){display:flex;margin-left:auto}.rail .tool{width:38px;height:38px;padding:0;justify-content:center}.rail .tool span{font-size:1.1rem}.rail .tool:not(:first-child){display:none}.rail .tool{font-size:0}.rail-label,.compare-block,.rail-hint{display:none}.toggle-row{font-size:0;padding:0 4px}.toggle-row:before{font-size:.6rem;color:var(--muted);font-family:DM Mono}.toggle-row:first-of-type:before{content:'MOONS'}.toggle-row:nth-of-type(2),.toggle-row:nth-of-type(3){display:none}.map-wrap{height:100%}.map-head{top:20px;left:18px;right:18px}.map-head h1{font-size:1.65rem}.detail{top:78px;right:12px;width:236px;padding:18px}.timebar{bottom:64px;left:12px;right:12px}.map-controls{left:12px;bottom:126px}.map-controls #reset-view{display:none}}
.unit-switch{display:flex;margin-left:20px;border:1px solid var(--line);padding:3px;border-radius:4px}.unit-switch button{border:0;background:transparent;color:var(--muted);font:500 .59rem DM Mono;padding:6px 8px;cursor:pointer}.unit-switch button.active{background:var(--acid);color:#071006}.rolling{font-variant-numeric:tabular-nums;white-space:nowrap;letter-spacing:-.035em}.detail dd#detail-rate{color:var(--acid)}
@media(max-width:520px){.status{display:none}.unit-switch{margin-left:auto}.unit-switch button{padding:5px 6px}.icon-btn{margin-left:8px}}
.focus-picker{display:inline-flex;align-items:center;gap:8px;margin-top:14px;color:#66717f;font:500 .58rem DM Mono;letter-spacing:.1em;pointer-events:auto}.focus-picker select{min-width:120px;border:1px solid #384250;background:#0c121b;color:var(--text);border-radius:4px;padding:6px 24px 6px 8px;font:500 .68rem DM Mono}.workspace{height:calc(100dvh - 70px)}
@media(max-width:760px){.workspace{height:calc(100dvh - 58px)}.rail{bottom:max(8px,env(safe-area-inset-bottom))}.timebar{bottom:82px;z-index:7;height:52px}.map-controls{bottom:150px}.map-head h1{font-size:1.48rem}.focus-picker{margin-top:10px}.focus-picker select{min-width:104px}.detail{top:126px;max-height:calc(100dvh - 280px);overflow:auto}}
.timebar{height:auto;min-height:58px;display:grid;grid-template-columns:minmax(380px,auto) minmax(240px,1fr) 150px;gap:14px;padding:8px 12px}.transport,.scrubber{display:flex;align-items:center;gap:8px}.transport{min-width:380px}.transport #play-btn{font-size:.8rem;min-width:34px}.transport #play-btn.playing{background:#ff8157}.transport input[type=date]{height:32px;border:1px solid var(--line);border-radius:3px;background:#111720;color:var(--text);padding:0 7px;font:400 .65rem DM Mono;color-scheme:dark}.scrubber{min-width:240px}.scrubber>input{min-width:70px;flex:1}.scrubber>div{width:100px}.speed-control{display:flex;flex-direction:column;justify-content:center;gap:4px;color:var(--muted);font:500 .57rem DM Mono}.speed-control input{width:100%;accent-color:var(--acid)}
@media(max-width:760px){.timebar{bottom:80px;grid-template-columns:1fr auto;min-height:92px;gap:6px 10px;padding:8px}.transport{grid-column:1/-1;min-width:0}.transport input[type=date]{flex:1}.scrubber{min-width:0}.scrubber>div{width:82px}.speed-control{width:92px}.map-controls{bottom:184px}.timebar span,.timebar small{font-size:.58rem}}
.date-entry{display:flex;flex:1;min-width:205px;flex-direction:column;gap:3px;color:var(--acid);font:500 .52rem DM Mono;letter-spacing:.07em}.date-entry input{width:100%;min-width:132px}.date-entry span{white-space:nowrap}.transport{align-items:flex-end}
@media(max-width:760px){.date-entry{flex:1;min-width:0}.date-entry input{width:100%;min-width:0}}
