/* Starkpad · muted mission control. deep space slate, bone, ice-blue. Exo 2 + IBM Plex Mono. */
:root {
  --bg: #10141b;
  --bg-2: #141922;
  --bg-3: #1a2029;
  --panel: #161c25;
  --line: #262e3a;
  --line-2: #323b49;
  --bone: #e8e3d8;
  --bone-2: #b9b4aa;
  --bone-3: #7f8590;
  --ice: #8fa8c0;
  --ice-2: #b4c6d8;
  --ice-d: #5d7690;
  --ice-w: rgba(143,168,192,.12);
  --warn: #c2a272;
  --bad: #b77b72;
  --ok: #8fb09a;
  --mono: 'IBM Plex Mono', ui-monospace, Menlo, monospace;
  --disp: 'Exo 2', system-ui, sans-serif;
  --ease: cubic-bezier(.2,.7,.2,1);
}
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--bone); font: 400 15.5px/1.6 var(--disp); overflow-x: hidden; }
a { color: var(--ice-2); }
button, input, select { font: inherit; color: inherit; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 12px; top: -60px; background: var(--ice); color: var(--bg); padding: 8px 12px; z-index: 300; }
.skip:focus { top: 10px; }
:focus-visible { outline: 1.5px solid var(--ice-2); outline-offset: 3px; }
.num { font-variant-numeric: tabular-nums; }
.small { font-size: 12.5px; color: var(--bone-3); margin: 0; line-height: 1.5; }
.empty { color: var(--bone-3); font: 400 13px var(--mono); margin: 0; padding: 28px; border: 1px dashed var(--line-2); text-align: center; }

/* ---------- HUD ---------- */
.hud { position: sticky; top: 0; z-index: 100; background: rgba(16,20,27,.88); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); }
.hud__strip { display: flex; gap: 22px; align-items: center; height: 28px; padding: 0 28px; border-bottom: 1px solid var(--line); font: 400 11px var(--mono); color: var(--bone-3); letter-spacing: .04em; overflow: hidden; white-space: nowrap; }
.hud__strip i { font-style: normal; color: var(--ice-d); margin-right: 4px; }
.hud__strip b { font-weight: 500; color: var(--bone-2); }
.hud__strip b.tick { color: var(--ice-2); }
.hud__net { margin-left: auto; display: flex; align-items: center; gap: 7px; }
.led { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 3px rgba(143,176,154,.14); animation: led 2.4s ease-in-out infinite; }
.led--ref { background: var(--warn); box-shadow: 0 0 0 3px rgba(194,162,114,.14); }
@keyframes led { 50% { opacity: .45; } }
.hud__bar { display: flex; align-items: center; gap: 24px; height: 60px; padding: 0 28px; }
.mark { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--bone); font: 600 17px/1 var(--disp); letter-spacing: .14em; flex: none; }
.mark b { font-weight: 300; color: var(--ice); }
.mark svg { width: 30px; height: 30px; }
.mk-o { fill: none; stroke: var(--line-2); stroke-width: 1.4; }
.mk-o2 { fill: none; stroke: var(--ice-d); stroke-width: 1.2; }
.mk-c { fill: var(--bone); }
.mk-s { fill: var(--ice); }
.hud__nav { display: flex; gap: 2px; margin-left: auto; align-items: center; }
.hud__nav a { color: var(--bone-2); text-decoration: none; font: 500 12.5px var(--mono); text-transform: uppercase; letter-spacing: .06em; padding: 8px 10px; position: relative; transition: color .2s; }
.hud__nav a::after { content: ''; position: absolute; left: 10px; right: 10px; bottom: 2px; height: 1px; background: var(--ice); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease); }
.hud__nav a:hover { color: var(--bone); }
.hud__nav a:hover::after { transform: scaleX(1); }
.hud__x svg { width: 14px; height: 14px; fill: currentColor; display: block; }
.hud__right { display: flex; align-items: center; gap: 10px; flex: none; }
.burger { display: none; width: 40px; height: 40px; background: none; border: 1px solid var(--line-2); position: relative; cursor: pointer; }
.burger i { position: absolute; left: 11px; right: 11px; height: 1.5px; background: var(--bone); transition: transform .3s var(--ease); }
.burger i:first-of-type { top: 15px; } .burger i:last-of-type { top: 23px; }
.burger[aria-expanded="true"] i:first-of-type { transform: translateY(4px) rotate(45deg); }
.burger[aria-expanded="true"] i:last-of-type { transform: translateY(-4px) rotate(-45deg); }

/* wallet */
.wb { position: relative; }
.wb-btn { background: var(--ice); color: var(--bg); border: 1px solid var(--ice); font: 600 12.5px/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; padding: 11px 15px; cursor: pointer; white-space: nowrap; clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px); transition: background .2s, transform .15s; }
.wb-btn:hover { background: var(--ice-2); }
.wb-btn:active { transform: translateY(1px); }
.wb-btn.is-on { background: transparent; color: var(--ice-2); text-transform: none; letter-spacing: 0; padding-left: 26px; position: relative; }
.wb-btn.is-on::before { content: ''; position: absolute; left: 11px; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: var(--ok); }
.wb-menu { position: absolute; right: 0; top: calc(100% + 10px); z-index: 400; width: 290px; max-width: calc(100vw - 24px); background: var(--bg-3); border: 1px solid var(--line-2); padding: 8px; box-shadow: 0 24px 50px -20px rgba(0,0,0,.8); animation: dd .22s var(--ease); }
@keyframes dd { from { opacity: 0; transform: translateY(-4px); } }
.wb-item { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px; background: none; border: 0; color: var(--bone); font: 400 13px var(--mono); text-align: left; text-decoration: none; cursor: pointer; }
.wb-item:hover { background: var(--ice-w); color: var(--ice-2); }
.wb-item img { width: 18px; height: 18px; }
.wb-addr { font: 400 11.5px/1.5 var(--mono); word-break: break-all; color: var(--bone-2); padding: 10px; border: 1px solid var(--line); background: var(--bg); }
.wb-bal { font: 500 18px var(--disp); padding: 10px 10px 4px; color: var(--ice-2); }
.wb-note { font: 400 11.5px var(--mono); color: var(--bone-3); padding: 6px 10px 2px; }

/* buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; text-decoration: none; cursor: pointer; font: 600 12.5px/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; padding: 15px 22px; border: 1px solid transparent; transition: background .2s, color .2s, border-color .2s, transform .15s; clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px); white-space: nowrap; }
.btn:active { transform: translateY(1px); }
.btn--ice { background: var(--ice); color: var(--bg); }
.btn--ice:hover { background: var(--ice-2); }
.btn--line { border-color: var(--line-2); color: var(--bone); background: rgba(16,20,27,.5); }
.btn--line:hover { border-color: var(--ice-d); color: var(--ice-2); }
.linkb { background: none; border: 0; color: var(--ice-2); cursor: pointer; text-decoration: underline; padding: 0; }
.sk, .shimmer { position: relative; overflow: hidden; background: var(--bg-3) !important; color: transparent !important; }
.sk::after, .shimmer::after { content: ''; position: absolute; inset: 0; transform: translateX(-100%); background: linear-gradient(90deg, transparent, rgba(143,168,192,.09), transparent); animation: sh 1.5s infinite; }
@keyframes sh { to { transform: translateX(100%); } }

/* ---------- hero ---------- */
.hero { position: relative; min-height: calc(100vh - 89px); min-height: 700px; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr); align-items: center; border-bottom: 1px solid var(--line); }
.hero__orbit { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero__copy { position: relative; z-index: 2; max-width: 600px; margin-left: max(28px, calc((100vw - 1240px) / 2)); padding: 70px 0 120px; pointer-events: none; }
.hero__copy > * { pointer-events: auto; }
.kicker { font: 400 12px var(--mono); color: var(--bone-3); letter-spacing: .05em; margin: 0 0 26px; display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.kicker span { color: var(--ice); border: 1px solid var(--ice-d); padding: 3px 7px; }
.display { font: 300 clamp(42px, 5.4vw, 74px)/1.02 var(--disp); letter-spacing: -.02em; margin: 0 0 24px; }
.lede { font-size: 17.5px; line-height: 1.65; color: var(--bone-2); max-width: 31em; margin: 0 0 32px; }
.hero__cta { display: flex; gap: 12px; flex-wrap: wrap; }
.ca { display: inline-flex; align-items: center; gap: 10px; margin-top: 22px; border: 1px solid var(--line-2); padding: 5px 5px 5px 10px; font: 400 12px var(--mono); max-width: 100%; background: var(--bg); }
.ca span { color: var(--ice); }
.ca code { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ca button { border: 0; background: var(--ice); color: var(--bg); padding: 5px 10px; cursor: pointer; font: 600 11px var(--mono); }
.hero__legend { position: absolute; z-index: 2; right: max(28px, calc((100vw - 1240px) / 2)); bottom: 36px; width: 260px; background: rgba(20,25,34,.82); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); border: 1px solid var(--line); padding: 16px 18px; font: 400 12px var(--mono); color: var(--bone-2); }
.hl__t { margin: 0 0 10px; color: var(--ice); text-transform: uppercase; letter-spacing: .08em; font-size: 11px; }
.hero__legend ul { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 6px; }
.hero__legend li { display: flex; align-items: center; gap: 9px; }
.hero__legend li i { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.k1 { border: 1px solid var(--ice); } .k2 { background: var(--bone); } .k3 { background: var(--ice); box-shadow: -8px 0 0 -3px rgba(143,168,192,.4); }
.hl__n { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; border-top: 1px solid var(--line); padding-top: 12px; }
.hl__n dt { font-size: 10px; color: var(--bone-3); text-transform: uppercase; letter-spacing: .04em; line-height: 1.3; }
.hl__n dd { margin: 4px 0 0; font: 500 20px var(--disp); color: var(--bone); }
.hl__s { margin: 12px 0 0; color: var(--bone-3); font-size: 11.5px; min-height: 2.8em; overflow-wrap: anywhere; }
.ld { opacity: 0; transform: translateY(14px); transition: opacity 1s var(--ease), transform 1s var(--ease); }
.is-ready .ld { opacity: 1; transform: none; }
.split .w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .1em; margin-bottom: -.1em; }
.split .wi { display: inline-block; transform: translateY(100%); transition: transform 1.1s var(--ease); transition-delay: calc(var(--i) * 70ms + 100ms); }
.is-ready .split .wi { transform: none; }
.reveal { opacity: 0; transform: translateY(20px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.is-in { opacity: 1; transform: none; }

/* telemetry row */
.tele { border-bottom: 1px solid var(--line); background: var(--bg-2); }
.tele__in { max-width: 1240px; width: calc(100% - 56px); margin: 0 auto; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tcell { padding: 22px 22px 20px; border-right: 1px solid var(--line); min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.tcell:first-child { padding-left: 0; } .tcell:last-child { border-right: 0; }
.tcell span { font: 400 11px var(--mono); color: var(--bone-3); text-transform: uppercase; letter-spacing: .06em; }
.tcell b { font: 400 30px/1.1 var(--disp); color: var(--bone); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tcell small { font: 400 11.5px var(--mono); color: var(--ice-d); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* sections */
.sec { padding: 110px 0; border-bottom: 1px solid var(--line); }
.sec--deep { background: var(--bg-2); }
.sec__in { max-width: 1240px; width: calc(100% - 56px); margin: 0 auto; }
.sh { max-width: 780px; margin-bottom: 40px; }
.sh__no { font: 400 12px var(--mono); color: var(--ice); margin: 0 0 16px; letter-spacing: .06em; display: flex; gap: 14px; align-items: center; }
.sh__no span { color: var(--bone-3); text-transform: uppercase; }
.sh__no::after { content: ''; height: 1px; flex: 0 0 60px; background: var(--line-2); order: 1; }
.sh h2, .flight h2 { font: 300 clamp(32px, 3.8vw, 50px)/1.08 var(--disp); letter-spacing: -.015em; margin: 0 0 16px; }
.sh p { color: var(--bone-2); margin: 0; font-size: 16.5px; }
.panel { background: var(--panel); border: 1px solid var(--line); min-width: 0; position: relative; }
.panel::before, .console::before { content: ''; position: absolute; top: -1px; left: -1px; width: 14px; height: 14px; border-top: 1px solid var(--ice-d); border-left: 1px solid var(--ice-d); pointer-events: none; }
.panel__t { font: 500 11.5px var(--mono); text-transform: uppercase; letter-spacing: .07em; color: var(--bone-2); margin: 0 0 16px; display: flex; align-items: center; gap: 9px; }
.fld { display: flex; flex-direction: column; gap: 7px; font: 400 12px var(--mono); color: var(--bone-2); min-width: 0; }
.fld > span { display: flex; justify-content: space-between; gap: 8px; }
.fld b { color: var(--ice-2); font-weight: 500; }
.fld em { font-style: normal; color: var(--warn); font-size: 10.5px; text-transform: uppercase; letter-spacing: .05em; }
input[type="text"], input[type="number"] { width: 100%; background: var(--bg); border: 1px solid var(--line-2); padding: 11px 12px; font: 400 14px var(--mono); color: var(--bone); outline: none; transition: border-color .2s, box-shadow .2s; min-width: 0; border-radius: 0; }
input:focus { border-color: var(--ice-d); box-shadow: 0 0 0 3px var(--ice-w); }
input[type="range"] { -webkit-appearance: none; appearance: none; width: 100%; height: 22px; background: transparent; cursor: pointer; }
input[type="range"]::-webkit-slider-runnable-track { height: 2px; background: var(--line-2); }
input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 12px; height: 18px; margin-top: -8px; background: var(--ice); border: 0; }
input[type="range"]::-moz-range-track { height: 2px; background: var(--line-2); }
input[type="range"]::-moz-range-thumb { width: 12px; height: 18px; background: var(--ice); border: 0; border-radius: 0; }
.out-err { border: 1px solid #4a3532; background: #1f1817; color: var(--bad); padding: 14px 16px; font: 400 13px var(--mono); display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }

/* console / tabs */
.console { background: var(--panel); border: 1px solid var(--line); position: relative; }
.console__bar { display: flex; align-items: center; gap: 16px; padding: 0 16px; border-bottom: 1px solid var(--line); min-height: 50px; flex-wrap: wrap; }
.console__meta { margin-left: auto; font: 400 11.5px var(--mono); color: var(--bone-3); }
.tabs { position: relative; display: flex; }
.tabs button { background: none; border: 0; padding: 16px 14px; font: 500 12px var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--bone-3); cursor: pointer; transition: color .25s; }
.tabs button.is-on { color: var(--bone); }
.tabs__ind { position: absolute; bottom: -1px; left: 0; height: 2px; background: var(--ice); transition: transform .45s var(--ease), width .45s var(--ease); }

/* graduation tracker */
.gt { display: grid; }
.gt__row { display: grid; grid-template-columns: 40px minmax(0, 1.4fr) minmax(0, 2fr) 90px 90px 110px; gap: 16px; align-items: center; padding: 12px 16px; border-bottom: 1px solid var(--line); min-height: 64px; min-width: 0; cursor: pointer; transition: background .2s; }
.gt__row:hover { background: rgba(143,168,192,.05); }
.gt__row.sk { cursor: default; }
.gt__row img { width: 36px; height: 36px; border-radius: 50%; background: var(--bg-3); }
.gt__name { min-width: 0; display: flex; flex-direction: column; }
.gt__name b { font-weight: 500; font-size: 15.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gt__name small { font: 400 11.5px var(--mono); color: var(--bone-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gt__bar { position: relative; height: 22px; background: var(--bg); border: 1px solid var(--line); min-width: 0; }
.gt__bar i { position: absolute; inset: 0 auto 0 0; width: 100%; background: linear-gradient(90deg, rgba(93,118,144,.5), var(--ice)); transform-origin: left; transition: transform 1s var(--ease); }
.gt__bar.hot i { background: linear-gradient(90deg, rgba(143,168,192,.5), var(--bone)); }
.gt__bar span { position: absolute; z-index: 1; right: 2px; top: 1px; padding: 0 6px; background: rgba(16,20,27,.92); font: 500 11.5px/18px var(--mono); color: var(--bone); }
.gt__bar::after { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, transparent 0 calc(10% - 1px), rgba(16,20,27,.6) calc(10% - 1px) 10%); pointer-events: none; }
.gt__v { font: 400 13px var(--mono); text-align: right; color: var(--bone-2); }
.gt__v small { display: block; color: var(--bone-3); font-size: 10.5px; text-transform: uppercase; }
.gt__v.up { color: var(--ok); } .gt__v.dn { color: var(--bad); }
.gt__row.flash { animation: fl 1.2s var(--ease); }
@keyframes fl { 0% { background: rgba(143,168,192,.12); } }

/* ATH table */
.tblwrap { overflow-x: auto; }
.ath { width: 100%; border-collapse: collapse; font-size: 14px; }
.ath th { font: 500 11px var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--bone-3); text-align: left; padding: 12px 16px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.ath th button { background: none; border: 0; color: inherit; font: inherit; letter-spacing: inherit; text-transform: inherit; cursor: pointer; padding: 0; }
.ath th button.is-sort { color: var(--ice-2); }
.ath th button.is-sort::after { content: ' ↓'; }
.ath th button.is-sort.asc::after { content: ' ↑'; }
.ath td { padding: 12px 16px; border-bottom: 1px solid var(--line); font-variant-numeric: tabular-nums; vertical-align: middle; }
.ath .r { text-align: right; }
.ath tbody tr { cursor: pointer; transition: background .2s; animation: rin .5s var(--ease) both; }
.ath tbody tr:hover { background: rgba(143,168,192,.05); }
@keyframes rin { from { opacity: 0; transform: translateY(6px); } }
.ath .coin { display: flex; align-items: center; gap: 12px; min-width: 0; max-width: 240px; }
.ath .coin img { width: 30px; height: 30px; border-radius: 50%; background: var(--bg-3); flex: none; }
.ath .coin span { display: flex; flex-direction: column; min-width: 0; }
.ath .coin b { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ath .coin small { font: 400 11px var(--mono); color: var(--bone-3); }
.ath .dd { font-family: var(--mono); }
.ath .dd.deep { color: var(--bad); } .ath .dd.mid { color: var(--warn); } .ath .dd.near { color: var(--ok); }
.ath .win { font: 400 10.5px var(--mono); color: var(--bone-3); display: block; }
.spark { width: 150px; height: 34px; display: block; }
.spark .p { fill: none; stroke: var(--ice); stroke-width: 1.3; }
.spark .h { fill: var(--bone); } .spark .l { fill: var(--bad); }
.ath td.skc { height: 54px; }

/* flight (pinned) */
.flight { height: 380vh; position: relative; background: radial-gradient(ellipse at 70% 40%, #17202c, var(--bg) 60%); border-bottom: 1px solid var(--line); }
.flight__pin { position: sticky; top: 89px; height: calc(100vh - 89px); display: flex; align-items: center; overflow: hidden; }
.flight__in { max-width: 1240px; width: calc(100% - 56px); margin: 0 auto; display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.4fr); gap: 50px; align-items: center; }
.flight__steps { list-style: none; margin: 26px 0 18px; padding: 0; display: grid; gap: 4px; counter-reset: f; }
.flight__steps li { counter-increment: f; position: relative; padding: 10px 12px 10px 48px; color: var(--bone-3); border-left: 1px solid var(--line); transition: color .4s, border-color .4s, background .4s; font-size: 15px; }
.flight__steps li::before { content: 'T+' counter(f); position: absolute; left: 12px; top: 12px; font: 500 11px var(--mono); color: var(--line-2); transition: color .4s; }
.flight__steps li.is-on { color: var(--bone); border-color: var(--ice); background: linear-gradient(90deg, var(--ice-w), transparent); }
.flight__steps li.is-on::before { color: var(--ice); }
.flight__note { font: 400 11.5px/1.6 var(--mono); color: var(--bone-3); margin: 0; }
.flight__stage { border: 1px solid var(--line); background: rgba(20,25,34,.6); position: relative; min-width: 0; }
#flightCanvas { display: block; width: 100%; aspect-ratio: 1.5 / 1; }
.flight__read { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; border-top: 1px solid var(--line); }
.flight__read div { padding: 12px 16px; border-right: 1px solid var(--line); min-width: 0; }
.flight__read div:last-child { border-right: 0; }
.flight__read dt { font: 400 10.5px var(--mono); color: var(--bone-3); text-transform: uppercase; letter-spacing: .06em; }
.flight__read dd { margin: 2px 0 0; font: 400 20px var(--disp); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* cost */
.cost { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; }
.cost__sol, .cost__stark { padding: 22px; display: flex; flex-direction: column; gap: 16px; }
.cost__out { grid-column: 1 / -1; padding: 24px; }
.ledger { width: 100%; border-collapse: collapse; font: 400 13px var(--mono); }
.ledger td { padding: 9px 0; border-bottom: 1px dashed var(--line-2); vertical-align: top; }
.ledger td:last-child { text-align: right; color: var(--bone); white-space: nowrap; padding-left: 12px; }
.ledger td small { display: block; color: var(--bone-3); font-size: 11px; }
.ledger tr.tot td { border-bottom: 0; border-top: 1px solid var(--ice-d); color: var(--ice-2); font-weight: 600; padding-top: 12px; }
.ledger td.sk { height: 120px; }
.refs { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.cmp { display: grid; gap: 18px; }
.cmp__row { display: grid; grid-template-columns: 170px minmax(0, 1fr) 120px; gap: 16px; align-items: center; }
.cmp__row > span:first-child { font: 400 12px var(--mono); color: var(--bone-2); }
.cmp__bars { display: grid; gap: 6px; min-width: 0; }
.cmp__bar { height: 14px; position: relative; background: var(--bg); }
.cmp__bar i { position: absolute; inset: 0 auto 0 0; width: 100%; transform-origin: left; transition: transform 1s var(--ease); }
.cmp__bar.s i { background: var(--ice); } .cmp__bar.k i { background: repeating-linear-gradient(135deg, var(--warn) 0 4px, rgba(194,162,114,.6) 4px 8px); }
.cmp__v { font: 400 12px/1.5 var(--mono); text-align: right; }
.cmp__v .s { color: var(--ice-2); } .cmp__v .k { color: var(--warn); }
.cmp__sum { font-size: 15px; color: var(--bone-2); margin: 6px 0 0; padding-top: 16px; border-top: 1px solid var(--line); }
.cmp__sum b { color: var(--bone); font-weight: 500; }

/* pre-flight + fleet */
.pf__q { display: flex; gap: 10px; max-width: 760px; margin-bottom: 22px; }
.pf__q input { flex: 1; }
.pf__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 20px; }
.pf__head { display: flex; gap: 14px; align-items: center; padding: 20px 22px; border-bottom: 1px solid var(--line); min-width: 0; }
.pf__head img { width: 48px; height: 48px; border-radius: 50%; background: var(--bg-3); flex: none; }
.pf__head div { min-width: 0; }
.pf__head b { display: block; font: 400 24px/1.15 var(--disp); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pf__head code { font: 400 11.5px var(--mono); color: var(--bone-3); word-break: break-all; }
.verdict { margin-left: auto; font: 600 12px var(--mono); letter-spacing: .1em; padding: 8px 12px; border: 1px solid; flex: none; }
.verdict.go { color: var(--ok); border-color: rgba(143,176,154,.5); } .verdict.hold { color: var(--warn); border-color: rgba(194,162,114,.5); } .verdict.nogo { color: var(--bad); border-color: rgba(183,123,114,.5); }
.checks { list-style: none; margin: 0; padding: 10px 22px 20px; display: grid; gap: 0; }
.checks li { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 12px; align-items: baseline; padding: 11px 0; border-bottom: 1px dashed var(--line); font-size: 14px; animation: rin .4s var(--ease) both; }
.checks li::before { content: ''; width: 9px; height: 9px; border: 1.5px solid var(--bone-3); transform: translateY(1px) rotate(45deg); }
.checks li.ok::before { background: var(--ok); border-color: var(--ok); }
.checks li.warn::before { background: var(--warn); border-color: var(--warn); }
.checks li.bad::before { background: var(--bad); border-color: var(--bad); }
.checks li small { display: block; font: 400 11.5px var(--mono); color: var(--bone-3); }
.checks li span:last-child { font: 400 12.5px var(--mono); color: var(--bone-2); text-align: right; }
.hold { padding: 20px 22px; }
.hold__bars { display: grid; gap: 6px; margin-top: 10px; }
.hold__r { display: grid; grid-template-columns: 26px minmax(0, 1fr) 56px; gap: 10px; align-items: center; font: 400 11.5px var(--mono); color: var(--bone-3); }
.hold__r .b { height: 10px; background: var(--bg); position: relative; }
.hold__r .b i { position: absolute; inset: 0 auto 0 0; width: 100%; background: var(--ice-d); transform-origin: left; transition: transform .8s var(--ease); }
.hold__r.pool .b i { background: var(--line-2); }
.hold__r span:last-child { text-align: right; color: var(--bone-2); }
.kv { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; border-bottom: 1px solid var(--line); }
.kv div { padding: 14px 22px; border-right: 1px solid var(--line); min-width: 0; }
.kv div:last-child { border-right: 0; }
.kv dt { font: 400 10.5px var(--mono); color: var(--bone-3); text-transform: uppercase; letter-spacing: .05em; }
.kv dd { margin: 3px 0 0; font: 400 19px var(--disp); overflow-wrap: anywhere; }

.fleet__sum { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--line); margin-bottom: 18px; background: var(--panel); }
.fleet__sum div { padding: 16px 20px; border-right: 1px solid var(--line); min-width: 0; }
.fleet__sum div:last-child { border-right: 0; }
.fleet__sum dt { font: 400 10.5px var(--mono); color: var(--bone-3); text-transform: uppercase; }
.fleet__sum dd { margin: 4px 0 0; font: 400 24px var(--disp); overflow-wrap: anywhere; }
.ships { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.ship { background: var(--panel); border: 1px solid var(--line); padding: 16px; display: grid; gap: 12px; min-width: 0; cursor: pointer; transition: border-color .25s, transform .3s var(--ease); animation: rin .5s var(--ease) both; text-align: left; color: inherit; font: inherit; }
.ship:hover { border-color: var(--ice-d); transform: translateY(-3px); }
.ship__top { display: flex; gap: 10px; align-items: center; min-width: 0; }
.ship__top img { width: 34px; height: 34px; border-radius: 50%; background: var(--bg-3); flex: none; }
.ship__top span { min-width: 0; display: flex; flex-direction: column; }
.ship__top b { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ship__top small { font: 400 11px var(--mono); color: var(--bone-3); }
.ship__val { margin-left: auto; text-align: right; font: 400 18px var(--disp); flex: none; }
.ship__st { display: flex; justify-content: space-between; gap: 10px; font: 400 11.5px var(--mono); color: var(--bone-3); }
.ship__st b { color: var(--bone-2); font-weight: 500; }
.ship .gt__bar { height: 18px; }
.ship .gt__bar span { line-height: 16px; font-size: 11px; }

/* concept + faq */
.con { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border: 1px solid var(--line); }
.con__c { padding: 26px 22px; border-right: 1px solid var(--line); min-width: 0; }
.con__c:last-child { border-right: 0; }
.con__k { font: 400 11px var(--mono); color: var(--ice); text-transform: uppercase; letter-spacing: .07em; margin: 0 0 30px; }
.con__c h3 { font: 400 21px/1.2 var(--disp); margin: 0 0 10px; }
.con__c p:last-child { margin: 0; color: var(--bone-2); font-size: 14.5px; }
.faq { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; }
.faq details { border-top: 1px solid var(--line); min-width: 0; }
.faq summary { list-style: none; cursor: pointer; padding: 20px 30px 20px 0; position: relative; font: 400 17px var(--disp); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: '+'; position: absolute; right: 0; top: 18px; font: 300 22px var(--mono); color: var(--ice); transition: transform .3s var(--ease); }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq p { margin: 0 0 22px; color: var(--bone-2); }

/* footer */
.foot { padding: 50px 0 40px; background: var(--bg); }
.foot__in { max-width: 1240px; width: calc(100% - 56px); margin: 0 auto; display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 18px 40px; }
.foot__note { margin: 0; color: var(--bone-2); font-size: 13.5px; }
.foot__coin { grid-column: 2; display: flex; gap: 18px; font: 400 13px var(--mono); }
.foot__fine { grid-column: 1 / -1; margin: 8px 0 0; padding-top: 18px; border-top: 1px solid var(--line); font: 400 11.5px var(--mono); color: var(--bone-3); }

/* responsive */
@media (max-width: 1180px) { .hud__nav a { padding: 8px 7px; font-size: 11.5px; } .hero__legend { width: 230px; } }
@media (max-width: 1040px) {
  .burger { display: block; }
  .hud__nav { position: absolute; left: 0; right: 0; top: 89px; flex-direction: column; align-items: stretch; background: var(--bg-2); border-bottom: 1px solid var(--line); padding: 10px 24px 18px; opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity .25s, transform .25s var(--ease), visibility .25s; }
  .hud__nav.is-open { opacity: 1; visibility: visible; transform: none; }
  .hud__nav a { padding: 13px 4px; font-size: 13px; border-bottom: 1px solid var(--line); }
  .hud__right { margin-left: auto; }
  .gt__row { grid-template-columns: 36px minmax(0, 1fr) minmax(0, 1.4fr) 80px; }
  .gt__row > :nth-child(5), .gt__row > :nth-child(6) { display: none; }
  .flight { height: auto; }
  .flight__pin { position: relative; top: 0; height: auto; padding: 90px 0; }
  .flight__in { grid-template-columns: minmax(0, 1fr); gap: 30px; }
  .cost, .pf__grid { grid-template-columns: minmax(0, 1fr); }
  .con { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .con__c:nth-child(2) { border-right: 0; } .con__c:nth-child(n+3) { border-top: 1px solid var(--line); }
  .ships { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .faq { grid-template-columns: minmax(0, 1fr); }
  .hide-m { display: none; }
  .hero { align-items: start; }
  .hero__legend { position: relative; right: auto; bottom: auto; margin: -80px 28px 36px auto; }
}
@media (max-width: 680px) {
  .hud__strip { padding: 0 14px; gap: 14px; }
  .hide-s { display: none; }
  .hud__bar { padding: 0 14px; gap: 10px; }
  .mark span { font-size: 15px; letter-spacing: .1em; }
  .wb-btn { padding: 10px 11px; font-size: 11.5px; }
  .hero { min-height: 0; }
  .hero__copy { margin: 0 16px; padding: 46px 0 40px; }
  .display { font-size: 40px; }
  .lede { font-size: 16px; }
  .hero__legend { width: auto; margin: 0 16px 30px; }
  .tele__in, .sec__in, .flight__in, .foot__in { width: calc(100% - 32px); }
  .tele__in { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tcell { padding: 16px 12px; } .tcell:first-child { padding-left: 0; }
  .tcell:nth-child(2) { border-right: 0; } .tcell:nth-child(3) { padding-left: 0; } .tcell:nth-child(n+3) { border-top: 1px solid var(--line); }
  .tcell b { font-size: 22px; }
  .sec { padding: 76px 0; }
  .gt__row { grid-template-columns: 30px minmax(0, 1fr) 72px; gap: 10px; padding: 12px; }
  .gt__row img { width: 30px; height: 30px; }
  .gt__row > :nth-child(3) { grid-column: 1 / -1; grid-row: 2; }
  .tabs button { padding: 14px 9px; font-size: 11px; }
  .console__meta { width: 100%; margin: 0 0 10px; }
  .ath th, .ath td { padding: 10px 8px; }
  .ath .coin { max-width: 130px; }
  .hide-s { display: none; }
  .refs { grid-template-columns: minmax(0, 1fr); }
  .cmp__row { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .cmp__v { text-align: left; }
  .pf__q { flex-direction: column; }
  .kv { grid-template-columns: minmax(0, 1fr); }
  .kv div { border-right: 0; border-bottom: 1px solid var(--line); }
  .fleet__sum { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fleet__sum div:nth-child(2) { border-right: 0; } .fleet__sum div:nth-child(n+3) { border-top: 1px solid var(--line); }
  .ships, .con { grid-template-columns: minmax(0, 1fr); }
  .con__c { border-right: 0 !important; border-top: 1px solid var(--line); }
  .con__c:first-child { border-top: 0; }
  .flight__read dd { font-size: 16px; }
  .foot__in { grid-template-columns: minmax(0, 1fr); }
  .foot__coin { grid-column: auto; }
  .checks li { grid-template-columns: 18px minmax(0, 1fr); }
  .checks li span:last-child { grid-column: 2; text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
  .ld, .reveal { opacity: 1 !important; transform: none !important; }
  .split .wi { transform: none !important; }
}
.hud__nav a.is-cur { color: var(--bone); }
.hud__nav a.is-cur::after { transform: scaleX(1); }
@media (max-width: 900px) { #orbit { opacity: .5; } }
@media (max-width: 600px) {
  .hide-s { display: none; }
  .ath th, .ath td { padding: 10px 8px; }
  .ath td .win { display: none; }
  .ath .coin img { display: none; }
}