:root{--bg:#05070c;--panel:#0b0f17;--panel-2:#111826;--line:#aebbd029;--text:#edf1f7;--muted:#96a2b6;--faint:#5c6a80;--amber:#f0a24b;--amber-2:#ffc073;--teal:#7fd4c1;--serif:"Playfair Display", "Times New Roman", Georgia, serif;--sans:"DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;--mono:"DM Mono", ui-monospace, Menlo, monospace;--sat:env(safe-area-inset-top,0px);--sab:env(safe-area-inset-bottom,0px);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:var(--sans);overscroll-behavior:none;-webkit-user-select:none;user-select:none;font-size:14px;line-height:1.45;overflow:hidden}button{font-family:inherit}.eyebrow{letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-size:10px}.start{height:100%;padding:calc(24px + var(--sat)) 24px calc(24px + var(--sab));background:radial-gradient(120% 80% at 50% 110%,#1a1208 0%,#05070c 60%);justify-content:center;align-items:center;display:flex;overflow-y:auto}.start-inner{flex-direction:column;gap:14px;width:100%;max-width:420px;display:flex}.start-title{font-family:var(--serif);letter-spacing:.02em;margin:0;font-size:52px;font-weight:600;line-height:1}.start-lede{color:var(--muted);margin:0;font-size:14px}.gauge{border:1px solid var(--line);background:#0b0f17b3;border-radius:12px;flex-direction:column;gap:8px;padding:12px 14px;display:flex}.gauge-row{justify-content:space-between;font-size:13px;display:flex}.gauge-row.small{color:var(--muted);font-size:11px;font-family:var(--mono)}.gauge-value{font-family:var(--mono)}.gauge-bar{background:#ffffff14;border-radius:2px;height:4px;overflow:hidden}.gauge-bar span{background:var(--faint);height:100%;transition:width .4s,background .4s;display:block}.gauge-excellent .gauge-bar span{background:#3fbf8a}.gauge-good .gauge-bar span{background:#8fd3a8}.gauge-fair .gauge-bar span{background:var(--amber)}.gauge-poor .gauge-bar span{background:#e45a5a}.start-error{color:#ff9c9c;margin:0;font-size:13px}.start-hint,.start-foot{color:var(--faint);margin:0;font-size:12px}.btn{border:1px solid var(--line);background:var(--panel-2);color:var(--text);cursor:pointer;border-radius:999px;padding:12px 20px;font-size:15px;font-weight:500}.btn:disabled{opacity:.5;cursor:default}.btn-primary{background:var(--amber);border-color:var(--amber);color:#1a1208}.btn-primary:disabled{background:var(--panel-2);border-color:var(--line);color:var(--muted)}.btn-ghost{background:0 0}.btn-ghost.danger{color:#ff9c9c}.btn-danger{color:#fff;background:#e45a5a;border-color:#e45a5a}.btn-small{padding:8px 14px;font-size:13px}.icon-btn{border:1px solid var(--line);width:36px;height:36px;color:var(--text);cursor:pointer;background:#0b0f17bf;border-radius:50%;justify-content:center;align-items:center;font-size:20px;line-height:1;display:inline-flex}.icon-btn:disabled{opacity:.35}.pill{border:1px solid var(--line);background:var(--panel-2);color:var(--amber-2);cursor:pointer;border-radius:999px;padding:5px 10px;font-size:12px}button:focus-visible{outline:2px solid var(--amber);outline-offset:2px}input:focus-visible{outline:2px solid var(--amber);outline-offset:2px}.app{background:var(--bg);height:100%;display:grid}.app.portrait{grid-template-columns:1fr}.app.landscape{grid-template-columns:2fr 1fr}.stage{height:100%;position:relative;overflow:hidden}.diagram{display:block;position:absolute;top:0;bottom:0;left:0;right:0}.side{border-left:1px solid var(--line);background:var(--panel);height:100%;overflow:hidden}.overlay-top{padding:calc(12px + var(--sat)) 14px 0 16px;pointer-events:none;justify-content:space-between;align-items:flex-start;display:flex;position:absolute;top:0;left:0;right:0}.overlay-top>*{pointer-events:auto}.readout{text-shadow:0 1px 8px #000000e6;flex-direction:column;gap:2px;display:flex}.readout-eyebrow{letter-spacing:.18em;text-transform:uppercase;color:var(--amber);font-size:10px}.readout-main{align-items:baseline;gap:6px;display:flex}.readout-value{font-family:var(--serif);font-variant-numeric:tabular-nums;font-size:40px;font-weight:600;line-height:1}.readout-unit{font-family:var(--serif);color:var(--muted);font-size:18px}.readout-sub{font-family:var(--mono);color:var(--muted);flex-wrap:wrap;gap:6px;font-size:11px;display:flex}.readout.compact .readout-value{font-size:30px}.readout.compact .readout-unit{font-size:15px}.readout.compact .readout-sub,.readout.compact .readout-status{font-size:10px}.readout-status{color:var(--faint);align-items:center;gap:6px;margin-top:2px;font-size:11px;display:flex}.status-dot{background:var(--faint);border-radius:50%;width:6px;height:6px}.status-dot.walking,.status-dot.moving{background:#3fbf8a;box-shadow:0 0 8px #3fbf8a}.gear{color:var(--muted)}.banner{top:calc(12px + var(--sat));color:#f8d0d0;white-space:nowrap;pointer-events:none;background:#3c1414d9;border:1px solid #833;border-radius:16px;padding:5px 12px;font-size:12px;position:absolute;left:50%;transform:translate(-50%)}.strip{left:12px;right:12px;bottom:calc(12px + var(--sab));border:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0b0f17d1;border-radius:14px;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px 10px 14px;display:flex;position:absolute}.strip-main{flex-direction:column;gap:1px;min-width:0;display:flex}.strip-name{font-family:var(--serif);letter-spacing:.02em;white-space:nowrap;text-overflow:ellipsis;font-size:18px;font-weight:600;overflow:hidden}.strip-sub{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.strip-sub b{color:var(--text);font-weight:500}.strip-side{flex-direction:column;flex-shrink:0;align-items:flex-end;gap:6px;display:flex}.strip-progress{font-family:var(--mono);color:var(--faint);font-size:11px}.detail{flex-direction:column;height:100%;min-height:0;display:flex}.detail-head{padding:calc(12px + var(--sat)) 14px 8px;border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:8px;display:flex}.detail-sheet .detail-head{padding-top:10px}.detail-nav{align-items:center;gap:8px;display:flex}.detail-count{font-family:var(--mono);color:var(--faint);text-align:center;min-width:44px;font-size:11px}.detail-body{-webkit-overflow-scrolling:touch;min-height:0;padding:16px 18px calc(24px + var(--sab));flex-direction:column;flex:1;gap:14px;transition:transform .15s;display:flex;overflow-y:auto}.detail-figure{justify-content:center;align-items:center;min-height:140px;display:flex}.detail-figure img{filter:drop-shadow(0 10px 30px #0009);width:60%;max-width:240px;height:auto}.detail-figure img.veil{width:100%;max-width:none}.band-figure{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.band-figure img{object-fit:contain;width:54px;height:54px}.detail-name{font-family:var(--serif);letter-spacing:.04em;text-transform:uppercase;text-wrap:balance;margin:2px 0 0;font-size:34px;font-weight:600;line-height:1.05}.detail-dist{border-top:2px solid var(--teal);flex-direction:column;gap:4px;width:-moz-fit-content;width:fit-content;min-width:60%;margin-top:8px;padding-top:10px;display:flex}.detail-dist .big{font-family:var(--serif);font-size:24px}.detail-dist .big small{color:var(--muted);font-size:14px}.muted{color:var(--muted);font-size:12px}.tag{letter-spacing:.08em;text-transform:uppercase;width:-moz-fit-content;width:fit-content;color:var(--muted);border:1px solid var(--line);border-radius:999px;margin-top:4px;padding:3px 9px;font-size:11px;display:inline-block}.tag.reached{color:var(--amber-2);border-color:#f0a24b80}.detail-blurb{color:var(--text);max-width:62ch;margin:8px 0 0;font-size:14px;line-height:1.55}.detail-facts{color:var(--muted);flex-direction:column;gap:5px;margin:0;padding-left:18px;font-size:13px;display:flex}.detail-planets ul{flex-direction:column;gap:4px;margin:6px 0 0;padding:0;font-size:13px;list-style:none;display:flex}.detail-planets li{border-bottom:1px solid var(--line);justify-content:space-between;gap:12px;padding:4px 0;display:flex}.sheet-wrap{z-index:20;flex-direction:column;justify-content:flex-end;display:flex;position:fixed;top:0;bottom:0;left:0;right:0}.scrim{background:#00000073;position:absolute;top:0;bottom:0;left:0;right:0}.detail-sheet,.sheet{background:var(--panel);border-top:1px solid var(--line);border-radius:18px 18px 0 0;height:62%;animation:.28s cubic-bezier(.2,.8,.2,1) rise;position:relative;box-shadow:0 -20px 60px #0009}.sheet{height:auto;max-height:85%;padding:14px 18px calc(24px + var(--sab));flex-direction:column;gap:16px;display:flex;overflow-y:auto}.sheet-head{justify-content:space-between;align-items:center;display:flex}.sheet-head h2{font-family:var(--serif);margin:0;font-size:22px}@keyframes rise{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.detail-sheet,.sheet{animation:none}.detail-body{transition:none}}.settings-group{flex-direction:column;gap:8px;display:flex}.settings-label{letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-size:10px}.settings-help{color:var(--muted);margin:0;font-size:12.5px}.seg{border:1px solid var(--line);border-radius:999px;display:flex;overflow:hidden}.seg button{color:var(--muted);cursor:pointer;background:0 0;border:0;flex:1;padding:9px 10px;font-size:13px}.seg button.on{background:var(--panel-2);color:var(--text)}.confirm{color:var(--muted);flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;display:flex}.scrub{left:12px;right:12px;bottom:calc(84px + var(--sab));border:1px solid var(--line);color:var(--muted);z-index:5;background:#0b0f17d9;border-radius:10px;padding:8px 12px;font-size:12px;position:absolute}.landscape .scrub{bottom:calc(12px + var(--sab))}.scrub input{width:100%;margin-top:4px}.scrub b{color:var(--text);font-family:var(--mono)}.welcome{color:var(--text);padding:calc(16px + var(--sat)) 24px calc(24px + var(--sab));z-index:30;background:#000;grid-template-rows:1fr auto auto;display:grid;position:fixed;top:0;bottom:0;left:0;right:0}.welcome-skip{z-index:2;top:calc(14px + var(--sat));border:1px solid var(--line);color:var(--muted);cursor:pointer;background:0 0;border-radius:999px;padding:6px 14px;font-size:13px;position:absolute;right:16px}.welcome-stage{justify-content:center;align-items:center;min-height:160px;display:flex;position:relative;overflow:hidden}.welcome-scene{opacity:0;transition:opacity 1.6s;position:absolute;top:0;bottom:0;left:0;right:0}.welcome-scene.in{opacity:1}.welcome-scene .diagram{position:absolute;top:0;bottom:0;left:0;right:0}.welcome-orbit{width:100%;height:100%;position:absolute;top:0;bottom:0;left:0;right:0}.welcome-sunglow{opacity:0;pointer-events:none;justify-content:center;align-items:center;width:60px;height:60px;transition:opacity 1.4s;display:flex;position:absolute}.welcome-sunglow.in{opacity:1}.welcome-sunglow img{opacity:.6;width:44px;height:44px;position:absolute}.welcome-sunhalo{background:radial-gradient(circle,#ffd68c8c 0%,#ffaa462e 35%,#ff963200 100%);border-radius:50%;width:60px;height:60px;position:absolute}.welcome-pixel{background:gold;position:absolute;box-shadow:0 0 2px .5px #ffd700e6}.welcome-halo{border:1px solid #ffd7008c;border-radius:50%;width:36px;height:36px;animation:2.4s ease-out infinite halo;position:absolute}@keyframes halo{0%{opacity:0;transform:scale(.5)}30%{opacity:.9}to{opacity:0;transform:scale(1.6)}}@media (prefers-reduced-motion:reduce){.welcome-halo{opacity:.6;animation:none}}.welcome-copy{flex-direction:column;gap:10px;width:100%;max-width:440px;min-height:236px;margin:0 auto;animation:.35s fadeup;display:flex}@keyframes fadeup{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.welcome-title{font-family:var(--serif);text-wrap:balance;letter-spacing:.01em;margin:0;font-size:30px;font-weight:600;line-height:1.12}.welcome-body{color:var(--muted);margin:0;font-size:15px;line-height:1.55}.welcome-foot{flex-direction:column;gap:14px;width:100%;max-width:440px;margin:24px auto 0;display:flex}.welcome-dots{gap:6px;display:flex}.welcome-dots span{background:var(--faint);border-radius:50%;width:6px;height:6px}.welcome-dots span.on{background:var(--amber);border-radius:3px;width:18px}.welcome-actions{gap:10px;display:flex}.welcome-actions .btn-primary{flex:1}@media (orientation:landscape) and (max-height:500px){.welcome{grid-template-rows:1fr auto;grid-template-columns:1fr 1fr;column-gap:24px}.welcome-stage{grid-row:1/3;min-height:0}.welcome-copy,.welcome-foot{margin:0}.welcome-title{font-size:24px}}