/* ============================================================
   Sonda & Orbit pages: the "flight" layout.
   Level rail + telemetry HUD, then the interactive labs (phones, game,
   orbit stage, calendar, diagrams). Colours come from site.css tokens;
   --accent is blue on Sonda and red on Orbit.
   ============================================================ */

/* ---------- telemetry HUD (bottom-left) ---------- */
.app-hud{
  position:fixed; left:max(14px, 2vw); bottom:26px; z-index:50;
  font-family:'JetBrains Mono', monospace; font-size:10.5px; letter-spacing:1px; padding:12px 14px;
  background:rgba(10,10,15,0.82);
  border:1px solid rgba(228,217,204,0.18); display:flex; flex-direction:column; gap:5px; min-width:210px; max-width:300px;
  transition:opacity 0.3s ease;
}
.app-hud .hud-row{ display:flex; justify-content:space-between; gap:18px; }
.app-hud .hud-label{ color:rgba(228,217,204,0.45); text-transform:uppercase; }
.app-hud .hud-value{ color:var(--accent); font-weight:700; text-align:right; }
.app-hud .hud-value.warn{ color:var(--yellow); }
.app-hud .hud-value.ok{ color:var(--teal); }
@media (max-width:1599px){ .app-hud{ display:none; } }
html.menu-open .app-hud{ opacity:0; }

/* ---------- level scaffolding ---------- */
.level{ position:relative; padding:clamp(60px, 8vw, 112px) 0; scroll-margin-top:60px; }
/* the first level is the hero: keep its own spacing so it clears the fixed header (this rule was beaten by .level) */
.hero.level{ padding:130px 0 70px; }
@media (max-width:900px){ .hero.level{ padding-top:124px; } }
@media (max-width:520px){ .hero.level{ padding-top:116px; padding-bottom:56px; } }
.level-tag{
  display:inline-flex; align-items:center; gap:10px; margin-bottom:20px;
  font:8px 'Press Start 2P', monospace; letter-spacing:1px; line-height:1;
  color:var(--accent); padding:8px 10px; border:2px solid var(--accent);
}
.level-tag b{ color:var(--yellow); font-weight:400; }
.level-head{ max-width:760px; margin-bottom:38px; }
.level-head .lead{ max-width:640px; }

/* ============================================================
   SONDA
   ============================================================ */

/* ---- live phone ---- */
.phone.live{ cursor:default; }
.phone.live .screen{ display:flex; flex-direction:column; }
.sp-top{ flex:none; }
.sp-lanes{ display:flex; gap:14px; padding:12px 16px 0; border-bottom:1px solid #C8D8EE; }
.sp-lane{
  appearance:none; border:0; background:transparent; cursor:pointer; padding:0 0 7px; margin:0;
  font:600 11px ui-monospace, 'SF Mono', Menlo, monospace; color:#4E6285; border-bottom:2px solid transparent;
  display:inline-flex; align-items:baseline; gap:3px;
}
.sp-lane u{ text-decoration:none; opacity:0.75; transition:transform 0.2s ease; display:inline-block; }
.sp-lane:hover{ color:#1A56DB; }
.sp-lane[aria-selected="true"]{ color:#1A56DB; border-bottom-color:#1A56DB; }
.sp-lane.bump u{ animation:count-bump 0.4s ease; }
@keyframes count-bump{ 40%{ transform:scale(1.7); color:#1A56DB; } }
.sp-list{ list-style:none; flex:1; overflow-y:auto; overscroll-behavior:auto; scrollbar-width:none; position:relative; }
/* a mouse wheel over the phone should not drag the page, but a finger must always be able to: with 'contain' a swipe on the phone could not scroll the page on Android */
@media (hover:hover) and (pointer:fine){ .sp-list{ overscroll-behavior:contain; } }
.sp-list::-webkit-scrollbar{ display:none; }
.sp-row{ border-bottom:1px solid #D8E5F5; }
.sp-row > button.sp-main{
  appearance:none; border:0; background:transparent; width:100%; text-align:left; cursor:pointer; color:inherit; font:inherit;
  display:flex; gap:10px; padding:11px 16px;
}
.sp-row > button.sp-main:hover{ background:rgba(26,86,219,0.05); }
.sp-row .av{ flex:none; width:32px; height:32px; border-radius:50%; background:#D3E1F6; color:#1A56DB; display:grid; place-items:center; font:700 11px -apple-system, system-ui, sans-serif; position:relative; }
.sp-row .av.unread::after{ content:""; position:absolute; right:-2px; top:-2px; width:9px; height:9px; border-radius:50%; background:#1A56DB; border:2px solid #E6EEF9; }
.sp-row .sp-body{ flex:1; min-width:0; }
.sp-row .r1{ display:flex; justify-content:space-between; gap:8px; font-size:12px; }
.sp-row .r1 time{ font:500 10px ui-monospace, 'SF Mono', Menlo, monospace; color:#4E6285; }
.sp-row .subj{ font:600 12.5px ui-serif, 'New York', Georgia, serif; margin-top:1px; line-height:1.3; }
.sp-row .snip{ font-size:11px; color:#4E6285; line-height:1.35; margin-top:2px; }
.sp-row .tag{ display:inline-block; margin-top:5px; font:600 9.5px ui-monospace, 'SF Mono', Menlo, monospace; padding:2px 7px; border-radius:99px; background:#F3F7FD; border:1px solid #C8D8EE; color:#1A56DB; }
.sp-row .tag.later{ color:#087A6A; }
.sp-row .tag.noise{ color:#4E6285; }
.sp-row .tag.star{ color:#8A5A00; border-color:#E7CF8A; background:#FFF8E1; }
.sp-why{
  display:none; padding:2px 16px 12px 58px; font-size:11px; color:#2B3E63; line-height:1.45;
}
.sp-row.open .sp-why{ display:block; animation:fade-down 0.22s ease; }
.sp-why b{ color:#0C1A35; }
.sp-why .moves{ display:flex; flex-wrap:wrap; gap:5px; margin-top:8px; }
.sp-why .moves button{
  appearance:none; cursor:pointer; font:600 10px ui-monospace, 'SF Mono', Menlo, monospace; padding:4px 8px;
  border-radius:99px; border:1px solid #1A56DB; background:#fff; color:#1A56DB;
}
.sp-why .moves button:hover{ background:#1A56DB; color:#fff; }
.sp-why .moves button.star{ border-color:#C79500; color:#8A5A00; }
.sp-why .moves button.star:hover{ background:#FFE347; color:#0C1A35; }
@keyframes fade-down{ from{ opacity:0; transform:translateY(-4px); } to{ opacity:1; transform:none; } }
.sp-row.leave{ animation:row-leave 0.34s ease forwards; }
.sp-row.enter{ animation:row-enter 0.4s ease; }
@keyframes row-leave{ to{ opacity:0; transform:translateX(38px); } }
@keyframes row-enter{ from{ opacity:0; transform:translateX(-26px); background:rgba(26,86,219,0.14); } }
.sp-empty{ padding:34px 24px; text-align:center; font-size:12px; color:#4E6285; line-height:1.5; }
.sp-toast{
  position:absolute; left:12px; right:12px; bottom:14px; z-index:5; padding:9px 12px; border-radius:12px;
  background:#0C1A35; color:#fff; font:600 11px -apple-system, system-ui, sans-serif;
  opacity:0; transform:translateY(10px); transition:opacity 0.2s ease, transform 0.2s ease; pointer-events:none;
}
.sp-toast.show{ opacity:1; transform:none; }
.hero-art .pix-hint{ max-width:320px; }

/* ---- Sort the signals (game) ---- */
.game .lab-body{ display:grid; gap:22px; }
.game-run{ display:grid; gap:22px; }
.diff-list{ list-style:none; text-align:left; max-width:560px; margin:18px auto 0; display:grid; gap:8px; }
.diff-list li{ padding:10px 14px 10px 36px; position:relative; border:1px solid var(--line); background:rgba(10,10,15,0.6); color:var(--muted); font-size:0.92rem; line-height:1.5; }
.diff-list li::before{ content:"✗"; position:absolute; left:13px; top:10px; color:var(--crazy); font-weight:700; }
.diff-list b{ color:var(--paper); }
.nojs-list{ list-style:none; display:grid; gap:8px; }
.nojs-list li{ padding:10px 14px; border:1px solid var(--line); background:rgba(10,10,15,0.6); color:var(--muted); }
.nojs-list b{ color:var(--paper); }
.game-pips{ display:flex; gap:6px; }
.game-pips i{ width:12px; height:12px; border:2px solid rgba(228,217,204,0.4); background:transparent; }
.game-pips i.cur{ border-color:var(--yellow); animation:coin-blink 1s steps(1) infinite; }
.game-pips i.hit{ background:var(--teal); border-color:var(--teal); }
.game-pips i.miss{ background:var(--crazy); border-color:var(--crazy); }
.game-field{ position:relative; display:grid; place-items:center; min-height:272px; }
.mail-card{
  position:relative; width:min(520px, 100%); background:#E6EEF9; color:#0C1A35; padding:18px 20px 20px 22px;
  border-left:8px solid #1A56DB; box-shadow:6px 6px 0 rgba(0,0,0,0.55);
  font-family:-apple-system, 'SF Pro Text', system-ui, sans-serif;
  transition:transform 0.38s cubic-bezier(0.5,0,0.75,0), opacity 0.38s ease;
  will-change:transform;
}
.mail-card.enter{ animation:card-in 0.34s cubic-bezier(0.2,0.9,0.2,1); }
@keyframes card-in{ from{ opacity:0; transform:translateY(-26px) rotate(-2deg); } to{ opacity:1; transform:none; } }
.mail-card .mc-from{ display:flex; align-items:center; gap:12px; }
.mail-card .av{ flex:none; width:38px; height:38px; border-radius:50%; background:#D3E1F6; color:#1A56DB; display:grid; place-items:center; font:700 12px -apple-system, system-ui, sans-serif; }
.mail-card .mc-who{ font-weight:700; font-size:15px; line-height:1.2; }
.mail-card .mc-who small{ display:block; font:500 11px ui-monospace, 'SF Mono', Menlo, monospace; color:#4E6285; margin-top:2px; }
.mail-card .mc-subj{ font:600 21px/1.25 ui-serif, 'New York', Georgia, serif; margin-top:14px; }
.mail-card .mc-snip{ font-size:14px; color:#2B3E63; line-height:1.5; margin-top:6px; }
.mail-card .mc-stamp{
  position:absolute; right:14px; top:12px; font:8px 'Press Start 2P', monospace; color:#1A56DB; opacity:0.55;
  border:2px dashed #1A56DB; padding:5px 6px; transform:rotate(4deg);
}
.mail-card.fly-now{ transform:translate(-62%, 130px) rotate(-10deg) scale(0.55); opacity:0; }
.mail-card.fly-later{ transform:translate(0, 150px) scale(0.55); opacity:0; }
.mail-card.fly-noise{ transform:translate(62%, 130px) rotate(10deg) scale(0.55); opacity:0; }
.game-verdict{
  min-height:3.1em; text-align:center; font-size:0.98rem; line-height:1.55; color:var(--muted);
}
.game-verdict .v{ display:block; font:9px/1.8 'Press Start 2P', monospace; letter-spacing:1px; margin-bottom:4px; }
.game-verdict.hit .v{ color:var(--teal); }
.game-verdict.miss .v{ color:var(--crazy); }
.game-verdict b{ color:var(--paper); }
.game-bins{ display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; }
.bin{
  appearance:none; cursor:pointer; text-align:left; position:relative; padding:14px 14px 15px; color:var(--paper);
  background:rgba(10,10,15,0.9); border:2px solid var(--c); box-shadow:4px 4px 0 rgba(0,0,0,0.6);
  transition:transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease, color 0.15s ease;
}
.bin[data-lane="now"]{ --c:var(--blue); }
.bin[data-lane="later"]{ --c:var(--teal); }
.bin[data-lane="noise"]{ --c:#9a9aa8; }
.bin:hover:not([disabled]){ background:var(--c); color:var(--ink); transform:translate(-2px,-2px); box-shadow:6px 6px 0 rgba(0,0,0,0.6); }
.bin:active:not([disabled]){ transform:translate(2px,2px); box-shadow:1px 1px 0 rgba(0,0,0,0.6); }
.bin[disabled]{ cursor:default; opacity:0.6; }
.bin .bk{ font:8px 'Press Start 2P', monospace; letter-spacing:1px; color:var(--c); }
.bin:hover:not([disabled]) .bk{ color:var(--ink); }
.bin .bn{ display:block; font:700 1.25rem 'Space Grotesk', sans-serif; text-transform:uppercase; margin-top:8px; }
.bin .bd{ display:block; font-size:0.8rem; opacity:0.8; line-height:1.4; margin-top:2px; }
.bin.pick{ background:var(--c); color:var(--ink); }
.bin.pick .bk{ color:var(--ink); }
.bin.sonda::after{
  content:"SONDA'S PICK"; position:absolute; right:8px; top:-9px; font:7px 'Press Start 2P', monospace; letter-spacing:1px;
  background:var(--yellow); color:var(--ink); padding:4px 6px;
}
.game-end{ text-align:center; padding:6px 0 4px; display:none; }
.game.over .game-end{ display:block; }
.game:not(.playing) .game-run, .game.over .game-run{ display:none; }
.game-end .rank{ font:clamp(12px,2vw,16px)/1.6 'Press Start 2P', monospace; color:var(--yellow); }
.game-end .tally{ font:clamp(2rem,6vw,3.4rem) 'Press Start 2P', monospace; color:var(--accent); margin:16px 0 6px; }
.game-end p{ color:var(--muted); max-width:520px; margin:12px auto 0; }
.game-end .btn-row{ justify-content:center; margin-top:22px; }
.game-start{ text-align:center; padding:26px 0; }
.game.playing .game-start, .game.over .game-start{ display:none; }
.game.over .game-end{ display:block; }
.game-start p{ color:var(--muted); max-width:520px; margin:0 auto 22px; }
.kbd-hint{ font:10px 'JetBrains Mono', monospace; letter-spacing:1px; color:var(--soft); text-align:center; }
.kbd-hint kbd{ font:inherit; border:1px solid var(--soft); padding:1px 6px; margin:0 2px; color:var(--paper); }
@media (max-width:640px){
  .game-bins{ grid-template-columns:1fr; }
  .bin{ display:grid; grid-template-columns:auto 1fr; gap:0 14px; align-items:center; }
  .bin .bk{ grid-row:1 / 3; }
  .bin .bn{ margin-top:0; }
  .kbd-hint{ display:none; }
  .game-field{ min-height:236px; }
  .mail-card .mc-subj{ font-size:18px; }
  .mail-card.fly-now, .mail-card.fly-noise{ transform:translate(0,140px) scale(0.55); }
}

/* ---- explorer (inbox features) ---- */
.ex{ display:grid; grid-template-columns:minmax(210px, 280px) 1fr; gap:22px; align-items:start; }
.ex-tabs{ display:flex; flex-direction:column; gap:8px; }
.ex-tab{
  appearance:none; cursor:pointer; text-align:left; display:flex; gap:12px; align-items:baseline;
  padding:13px 14px; border:2px solid var(--line); background:rgba(10,10,15,0.7); color:var(--muted);
  font:700 0.92rem 'Space Grotesk', sans-serif; text-transform:uppercase; letter-spacing:0.3px;
  transition:border-color 0.15s ease, color 0.15s ease, transform 0.15s ease, background 0.15s ease;
}
.ex-tab span.n{ font:8px 'Press Start 2P', monospace; color:var(--soft); }
.ex-tab:hover{ border-color:var(--paper); color:var(--paper); transform:translateX(3px); }
.ex-tab[aria-selected="true"]{ border-color:var(--accent); color:var(--paper); background:rgba(10,10,15,0.95); transform:translateX(6px); box-shadow:-5px 0 0 var(--accent); }
.ex-tab[aria-selected="true"] span.n{ color:var(--accent); }
.ex-panels{ min-width:0; }
.ex-panel{ display:grid; grid-template-columns:1fr minmax(240px, 330px); gap:24px; align-items:start; }
.ex-panel[hidden]{ display:none; }
.ex-panel .ex-text h3{ font-size:1.25rem; text-transform:uppercase; line-height:1.25; margin-bottom:10px; }
.ex-panel .ex-text p{ color:var(--muted); line-height:1.65; }
.ex-panel .ex-text .k{ font:8px 'Press Start 2P', monospace; color:var(--accent); letter-spacing:1px; text-transform:uppercase; display:block; margin-bottom:12px; }
.ex-panel .ex-text .try{ margin-top:16px; text-align:left; }
html:not(.js) .ex{ display:block; }
html:not(.js) .ex-tabs{ display:none; }
html:not(.js) .ex-panels{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 290px), 1fr)); gap:18px; }
html:not(.js) .ex-panel{ display:block; border:1px solid var(--line); background:rgba(10,10,15,0.62); padding:22px; }
@media (max-width:900px){
  .ex{ grid-template-columns:1fr; }
  .ex-tabs{ flex-direction:row; overflow-x:auto; gap:8px; padding-bottom:6px; scrollbar-width:thin; }
  .ex-tab{ flex:none; }
  .ex-tab:hover, .ex-tab[aria-selected="true"]{ transform:none; box-shadow:none; }
  .ex-tab[aria-selected="true"]{ box-shadow:0 4px 0 var(--accent); }
  .ex-panel{ grid-template-columns:1fr; }
}

/* mini screens (inside the explorer + privacy lab): a light "phone fragment" */
.mini{
  background:#E6EEF9; color:#0C1A35; border:3px solid #2a2a33; border-radius:24px; overflow:hidden; position:relative;
  box-shadow:0 20px 50px rgba(0,0,0,0.5), 0 0 40px -12px var(--accent);
  font-family:-apple-system, 'SF Pro Text', system-ui, sans-serif; font-size:12px; min-height:200px;
}
.mini.dark{ background:#0E1424; color:#E6EEF9; }
.mini-h{ display:flex; align-items:center; justify-content:space-between; padding:12px 14px 8px; }
.mini-h strong{ font:600 19px ui-serif, 'New York', Georgia, serif; }
.mini-chips{ display:flex; flex-wrap:wrap; gap:6px; padding:0 14px 10px; }
.mini-chip{
  appearance:none; cursor:pointer; font:600 10.5px -apple-system, system-ui, sans-serif; padding:4px 9px 4px 8px; border-radius:99px;
  background:#F3F7FD; border:1px solid #C8D8EE; color:#4E6285; display:inline-flex; align-items:center; gap:5px;
}
.mini-chip i{ width:8px; height:8px; border-radius:50%; background:var(--dot, #1A56DB); }
.mini-chip u{ text-decoration:none; font-weight:700; opacity:0.7; }
.mini-chip[aria-pressed="true"]{ background:var(--th, #1A56DB); border-color:var(--th, #1A56DB); color:#fff; }
.mini-chip[aria-pressed="true"] i{ box-shadow:0 0 0 2px rgba(255,255,255,0.7); }
.mini.dark .mini-chip{ background:#17203A; border-color:#2C3A60; color:#A8B8DC; }
.mini.dark .mini-chip[aria-pressed="true"]{ background:var(--th, #1A56DB); border-color:var(--th, #1A56DB); color:#fff; }
.mini-rows{ list-style:none; }
.mini-rows li{ display:flex; align-items:center; gap:10px; padding:9px 14px; border-top:1px solid rgba(78,98,133,0.22); border-left:4px solid var(--dot, #1A56DB); position:relative; }
.mini-rows li.enter{ animation:row-enter 0.4s ease; }
.mini-rows li.leave{ animation:row-leave 0.34s ease forwards; }
.mini-rows .mr-t{ flex:1; min-width:0; }
.mini-rows .mr-t b{ display:block; font-size:12px; }
.mini-rows .mr-t span{ display:block; font-size:11px; opacity:0.7; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mini-rows .mr-a{ display:flex; gap:5px; flex:none; }
.mini-rows .mr-a button, .mini-btn{
  appearance:none; cursor:pointer; font:600 10px ui-monospace, 'SF Mono', Menlo, monospace; padding:4px 8px; border-radius:99px;
  border:1px solid #1A56DB; background:#fff; color:#1A56DB;
}
.mini-rows .mr-a button:hover, .mini-btn:hover{ background:#1A56DB; color:#fff; }
.mini-btn.solid{ background:#1A56DB; color:#fff; }
.mini-btn.solid:hover{ background:#0C3FA8; }
.mini-btn[disabled]{ opacity:0.55; cursor:default; }
.mini-rows li.pinned::after{ content:"PIN"; position:absolute; right:6px; top:4px; font:700 7.5px ui-monospace, Menlo, monospace; color:#C79500; }
.mini-toast{
  display:flex; align-items:center; justify-content:space-between; gap:10px; margin:8px 12px 12px; padding:9px 12px; border-radius:12px;
  background:#0C1A35; color:#fff; font:600 11px -apple-system, system-ui, sans-serif;
}
.mini-toast button{ appearance:none; cursor:pointer; border:0; background:transparent; color:#FFC74A; font:700 11px ui-monospace, Menlo, monospace; padding:4px 6px; }
.mini-pad{ padding:0 14px 14px; }
.mini-field{ display:flex; gap:8px; padding:8px 0; border-bottom:1px solid rgba(78,98,133,0.28); font-size:12px; }
.mini-field label{ color:#4E6285; width:50px; flex:none; }
.mini-body{ padding:10px 0 6px; line-height:1.55; font-size:12px; min-height:62px; }
.mini-body .sig{ display:block; margin-top:8px; padding-top:7px; border-top:1px dashed rgba(78,98,133,0.4); color:#4E6285; }
.mini-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; padding:0 14px 14px; }
.mini-file{ border-radius:10px; background:#fff; border:1px solid #C8D8EE; padding:9px 8px; text-align:center; font:600 10px ui-monospace, Menlo, monospace; color:#4E6285; }
.mini-file i{ display:block; height:36px; margin-bottom:6px; border-radius:6px; background:var(--fc, #D3E1F6); position:relative; }
.mini-file i::after{ content:attr(data-ext); position:absolute; inset:0; display:grid; place-items:center; font:700 10px ui-monospace, Menlo, monospace; color:#fff; }
.mini-file.hide{ display:none; }
.mini-search{ margin:0 14px 10px; display:block; width:calc(100% - 28px); border:1px solid #C8D8EE; border-radius:99px; padding:6px 12px; font:12px -apple-system, system-ui, sans-serif; background:#fff; color:#0C1A35; }
.mini-search:focus-visible{ outline:2px solid #1A56DB; outline-offset:1px; }
.mini-invite{ margin:0 14px 14px; padding:12px; border-radius:14px; background:#fff; border:1px solid #C8D8EE; }
.mini-invite .when{ font:600 10px ui-monospace, Menlo, monospace; color:#1A56DB; }
.mini-invite b{ display:block; font:600 15px ui-serif, 'New York', Georgia, serif; margin:4px 0 3px; }
.mini-invite p{ font-size:11px; color:#4E6285; margin-bottom:10px; }
.mini-sw{ display:flex; gap:8px; padding:0 14px 8px; }
.mini-sw button{ appearance:none; cursor:pointer; width:26px; height:26px; border-radius:50%; border:3px solid transparent; background:var(--sw); box-shadow:0 0 0 1px rgba(0,0,0,0.25); }
.mini-sw button[aria-pressed="true"]{ border-color:#fff; box-shadow:0 0 0 2px var(--sw); }
.mini-row2{ display:flex; gap:6px; flex-wrap:wrap; padding:0 14px 10px; }
.mini.dark .mini-rows li{ border-top-color:rgba(168,184,220,0.2); }
.mini.dark .mini-rows .mr-t span{ opacity:0.6; }

/* ---- who talks to whom (diagram) ---- */
.diagram{ display:grid; gap:16px; }
.dia-svg{ width:100%; height:auto; overflow:visible; }
.dia-node rect, .dia-node circle{ fill:#0b0b12; stroke:rgba(228,217,204,0.55); stroke-width:2; transition:stroke 0.25s ease, fill 0.25s ease; }
.dia-node text{ font-family:'Press Start 2P', monospace; fill:var(--paper); }
.dia-node .sub{ font-family:'JetBrains Mono', monospace; fill:var(--soft); font-size:11px; }
.dia-node.lit rect, .dia-node.lit circle{ stroke:var(--accent); fill:rgba(61,139,255,0.12); }
.dia-line{ fill:none; stroke:rgba(228,217,204,0.28); stroke-width:2; stroke-dasharray:4 7; transition:stroke 0.25s ease, stroke-width 0.25s ease; }
.dia-line.lit{ stroke:var(--accent); stroke-width:3; stroke-dasharray:none; }
.dia-line.ghost{ stroke:rgba(255,61,31,0.45); }
.dia-line.ghost.lit-ghost{ stroke:var(--crazy); stroke-width:3; stroke-dasharray:3 6; }
.dia-pkt{ fill:var(--yellow); opacity:0; }
.dia-pkt.on{ opacity:1; }
.dia-ghost rect{ fill:rgba(255,61,31,0.05); stroke:rgba(255,61,31,0.65); stroke-dasharray:6 6; stroke-width:2; }
.dia-ghost text{ font-family:'Press Start 2P', monospace; fill:rgba(255,61,31,0.9); }
.dia-ghost .sub{ font-family:'JetBrains Mono', monospace; fill:rgba(228,217,204,0.6); font-size:11px; }
.dia-ghost .x{ stroke:var(--crazy); stroke-width:4; stroke-linecap:square; }
.dia-ghost.shake{ animation:dia-shake 0.5s ease; }
@keyframes dia-shake{ 20%{ transform:translateX(-7px); } 40%{ transform:translateX(7px); } 60%{ transform:translateX(-4px); } 80%{ transform:translateX(4px); } }
.dia-ctl{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.dia-log{
  border:2px solid var(--line); background:rgba(5,5,10,0.7); padding:14px 16px; min-height:5.4em;
  font:12.5px/1.65 'JetBrains Mono', monospace; color:var(--muted);
}
.dia-log b{ color:var(--accent); font-weight:700; }
.dia-log .no{ color:var(--crazy); font-weight:700; }
@media (max-width:600px){ .dia-node text{ font-size:11px; } }

.dia-v{ display:none; max-width:420px; margin:0 auto; }
@media (max-width:640px){ .dia-h{ display:none; } .dia-v{ display:block; } }

/* ---- privacy lab triplet ---- */
.plab{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap:18px; margin-top:26px; }
.plab-item > h3{ font-size:1rem; text-transform:uppercase; margin:14px 0 6px; }
.plab-item > p{ color:var(--muted); font-size:0.92rem; line-height:1.55; }
.plab-img{ margin:0 14px 14px; height:92px; border-radius:10px; background:repeating-linear-gradient(45deg, #D3E1F6 0 10px, #C3D6F1 10px 20px); display:grid; place-items:center; position:relative; overflow:hidden; font:600 11px ui-monospace, Menlo, monospace; color:#4E6285; }
.plab-img.shown{ background:linear-gradient(135deg, #1A56DB, #7AB6FF 55%, #FFD36B); color:#fff; }
.plab-img.shown::after{ content:""; position:absolute; right:18px; top:14px; width:26px; height:26px; border-radius:50%; background:rgba(255,255,255,0.85); }
.plab-lock{ position:absolute; inset:0; z-index:4; display:grid; place-items:center; align-content:center; gap:10px; text-align:center; background:rgba(12,26,53,0.96); color:#fff; font:600 12px -apple-system, system-ui, sans-serif; opacity:0; pointer-events:none; transition:opacity 0.2s ease; }
.plab-lock.on{ opacity:1; pointer-events:auto; }
.plab-lock .face{ width:46px; height:46px; border:3px solid #7AB6FF; border-radius:14px; position:relative; }
.plab-lock .face::before, .plab-lock .face::after{ content:""; position:absolute; top:13px; width:5px; height:8px; background:#7AB6FF; border-radius:3px; }
.plab-lock .face::before{ left:11px; } .plab-lock .face::after{ right:11px; }
.plab-lock .face i{ position:absolute; left:12px; right:12px; bottom:9px; height:5px; border-bottom:3px solid #7AB6FF; border-radius:0 0 8px 8px; }
.plab-lock.scan .face{ animation:face-scan 0.9s ease; }
@keyframes face-scan{ 50%{ box-shadow:0 0 0 6px rgba(122,182,255,0.35); border-color:#2DE8C9; } }
.link-demo{ color:#1A56DB; text-decoration:underline; text-underline-offset:2px; cursor:pointer; background:none; border:0; font:inherit; padding:0; }
.tip{ margin-top:8px; padding:7px 10px; border-radius:10px; background:#0C1A35; color:#fff; font-size:11px; }

/* ---- stage track (status) ---- */
.track{ list-style:none; display:grid; grid-template-columns:repeat(var(--n, 4), 1fr); gap:0; position:relative; counter-reset:tr; }
.track li{ position:relative; padding:0 10px 0 0; }
.track li::before{ content:""; position:absolute; top:19px; left:40px; right:0; height:3px; background:rgba(228,217,204,0.2); }
.track li:last-child::before{ display:none; }
.track li.done::before{ background:var(--teal); }
.track li.now::before{ background:repeating-linear-gradient(90deg, var(--yellow) 0 8px, transparent 8px 14px); }
.track button{
  appearance:none; background:none; border:0; cursor:pointer; text-align:left; color:var(--paper); width:100%; padding:0 0 4px;
  display:block; font:inherit;
}
.track .pin{
  width:40px; height:40px; display:grid; place-items:center; background:var(--ink); border:3px solid rgba(228,217,204,0.4);
  font:10px 'Press Start 2P', monospace; color:var(--soft); position:relative; z-index:1; transition:transform 0.2s ease;
}
.track li.done .pin{ border-color:var(--teal); color:var(--teal); }
.track li.now .pin{ border-color:var(--yellow); color:var(--yellow); animation:pin-pulse 1.6s ease-in-out infinite; }
@keyframes pin-pulse{ 50%{ box-shadow:0 0 0 7px rgba(255,227,71,0.18); } }
.track button:hover .pin, .track button:focus-visible .pin, .track button[aria-expanded="true"] .pin{ transform:scale(1.1) rotate(-3deg); }
.track .tt{ display:block; margin-top:14px; font:700 0.98rem 'Space Grotesk', sans-serif; text-transform:uppercase; line-height:1.25; }
.track .ts{ display:block; text-transform:uppercase; margin-top:4px; font:9px 'Press Start 2P', monospace; letter-spacing:1px; color:var(--soft); }
.track li.done .ts{ color:var(--teal); } .track li.now .ts{ color:var(--yellow); }
.track-detail{ margin-top:22px; border:2px solid var(--line); background:rgba(10,10,15,0.7); padding:18px 20px; min-height:5.5em; color:var(--muted); line-height:1.65; }
.track-detail b{ color:var(--paper); }
html:not(.js) .track .td{ display:block; margin-top:8px; font-size:0.9rem; color:var(--muted); line-height:1.55; }
html.js .track .td{ display:none; }
@media (max-width:700px){
  .track{ grid-template-columns:1fr; gap:6px; }
  .track li{ padding:0 0 14px 0; display:grid; grid-template-columns:1fr; }
  .track li::before{ top:44px; left:19px; right:auto; bottom:-4px; width:3px; height:auto; }
  .track button{ display:grid; grid-template-columns:40px 1fr; column-gap:14px; align-items:center; }
  .track .pin{ grid-row:1 / 3; }
  .track .tt{ margin-top:0; }
}

/* warp gate card (next probe) */
.gate-card{
  display:grid; grid-template-columns:auto 1fr auto; gap:20px; align-items:center; padding:22px 24px;
  border:2px solid var(--gc, var(--crazy)); background:rgba(10,10,15,0.8); position:relative; overflow:hidden;
  box-shadow:6px 6px 0 rgba(0,0,0,0.55); transition:transform 0.18s ease, box-shadow 0.18s ease;
}
.gate-card:hover{ transform:translate(-3px,-3px); box-shadow:10px 10px 0 rgba(0,0,0,0.55); }
.gate-card::before{
  content:""; position:absolute; inset:0; opacity:0.5; pointer-events:none;
  background:radial-gradient(ellipse at 100% 50%, color-mix(in srgb, var(--gc, #FF3D1F) 40%, transparent), transparent 62%);
}
.gate-card img{ width:64px; height:64px; border-radius:16px; position:relative; }
.gate-card .gk{ font:8px 'Press Start 2P', monospace; letter-spacing:1px; color:var(--gc, var(--crazy)); position:relative; }
.gate-card .gt{ font:700 1.5rem 'Space Grotesk', sans-serif; text-transform:uppercase; position:relative; margin-top:6px; }
.gate-card .gs{ color:var(--muted); font-size:0.95rem; position:relative; }
.gate-card .go{ font:9px 'Press Start 2P', monospace; letter-spacing:1px; position:relative; color:var(--ink); background:var(--gc, var(--crazy)); padding:12px 14px; white-space:nowrap; }
@media (max-width:640px){ .gate-card{ grid-template-columns:auto 1fr; } .gate-card .go{ grid-column:1 / -1; text-align:center; } }

/* ============================================================
   ORBIT
   ============================================================ */

/* ---- break the orbit stage ---- */
.ostage-wrap{ display:flex; flex-direction:column; align-items:center; gap:16px; width:100%; }
.ostage{
  position:relative; width:min(520px, 100%); aspect-ratio:1 / 0.72; user-select:none;
}
.ostage .ring{
  position:absolute; left:50%; top:50%; border:1.5px dashed rgba(228,217,204,0.28); border-radius:50%;
  transform:translate(-50%,-50%); pointer-events:none;
}
.ostage .core{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); text-align:center; z-index:2;
  width:34%; aspect-ratio:1; border-radius:50%; display:grid; place-content:center;
  background:radial-gradient(circle at 35% 30%, #FFE347 0, #FF7A1F 38%, #FF3D1F 72%, #6a1608 100%);
  box-shadow:0 0 70px 14px rgba(255,61,31,0.42), 0 0 140px 30px rgba(255,122,31,0.16);
  color:var(--ink); transition:box-shadow 0.4s ease, filter 0.4s ease;
}
.ostage .core small{ font:700 8px 'Press Start 2P', monospace; letter-spacing:0.5px; color:rgba(5,5,10,0.78); display:block; }
.ostage .core strong{ display:block; font:700 clamp(15px, 3.4vw, 24px) 'Space Grotesk', sans-serif; letter-spacing:-0.5px; font-variant-numeric:tabular-nums; margin:5px 0 2px; white-space:nowrap; }
.ostage .core.calm{ filter:saturate(0.55) brightness(0.85); box-shadow:0 0 40px 6px rgba(45,232,201,0.25); }
.planet{
  position:absolute; left:0; top:0; z-index:3; width:var(--d); height:var(--d); margin:calc(var(--d) / -2) 0 0 calc(var(--d) / -2);
  border-radius:50%; border:3px solid var(--ink); background:var(--pc); color:#fff; cursor:pointer; padding:0;
  display:grid; place-items:center; font:700 11px -apple-system, system-ui, sans-serif;
  box-shadow:0 0 0 2px rgba(228,217,204,0.35), 0 6px 18px rgba(0,0,0,0.5);
  transition:box-shadow 0.18s ease, opacity 0.5s ease;
  will-change:transform;
}
.planet:hover, .planet:focus-visible{ box-shadow:0 0 0 3px var(--yellow), 0 0 22px 2px rgba(255,227,71,0.55); z-index:6; }
.planet.broken{ pointer-events:none; opacity:0; }
.planet-tip{
  position:absolute; z-index:8; pointer-events:none; padding:9px 11px; background:var(--paper); color:var(--ink);
  font:700 11px 'Space Grotesk', sans-serif; line-height:1.35; white-space:nowrap; opacity:0; transition:opacity 0.15s ease;
  box-shadow:4px 4px 0 rgba(0,0,0,0.5);
}
.planet-tip small{ display:block; font:500 10.5px 'JetBrains Mono', monospace; opacity:0.75; }
.planet-tip.show{ opacity:1; }
.ofloat{
  position:absolute; z-index:9; pointer-events:none; font:9px 'Press Start 2P', monospace; color:var(--teal); text-shadow:2px 2px 0 rgba(0,0,0,0.7);
  animation:ofloat 1.4s ease-out forwards; white-space:nowrap;
}
@keyframes ofloat{ from{ opacity:1; transform:translate(-50%,0); } to{ opacity:0; transform:translate(-50%,-60px); } }
.ostage-hud{ display:flex; flex-wrap:wrap; gap:10px 14px; justify-content:center; align-items:center; }
.ostage-readout{
  font:9px/1.9 'Press Start 2P', monospace; letter-spacing:1px; color:var(--soft); text-align:center; min-height:3.8em; max-width:430px; text-transform:uppercase;
}
.ostage-readout b{ color:var(--teal); font-weight:400; }
.ostage-readout .y{ color:var(--yellow); }
.ostage-note{ font-size:0.86rem; color:var(--soft); text-align:center; max-width:430px; line-height:1.55; }
.ostage-note a{ color:var(--teal); text-decoration:underline; text-underline-offset:3px; }
.ostage.static .planet{ transition:none; }

/* ---- calendar lab ---- */
.cal-lab .lab-body{ display:grid; grid-template-columns:minmax(280px, 1.15fr) minmax(240px, 0.85fr); gap:26px; align-items:start; }
.cal-month{ font:700 1.25rem 'Space Grotesk', sans-serif; text-transform:uppercase; display:flex; justify-content:space-between; align-items:baseline; margin-bottom:12px; gap:10px; flex-wrap:wrap; }
.cal-month small{ font:8px 'Press Start 2P', monospace; color:var(--soft); letter-spacing:1px; }
.cal-grid{ display:grid; grid-template-columns:repeat(7, minmax(0, 1fr)); gap:5px; }
.cal-dow{ font:8px 'Press Start 2P', monospace; color:var(--soft); text-align:center; padding:6px 0; }
.cal-d{
  appearance:none; position:relative; aspect-ratio:1 / 0.92; min-height:38px; border:2px solid rgba(228,217,204,0.14); background:rgba(10,10,15,0.7);
  color:var(--muted); font:600 13px 'JetBrains Mono', monospace; padding:5px 0 0 7px; text-align:left; cursor:pointer;
  transition:border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}
.cal-d:hover{ border-color:var(--paper); }
.cal-d.blank{ visibility:hidden; pointer-events:none; }
.cal-d.charge{ color:var(--paper); border-color:rgba(228,217,204,0.4); }
.cal-d.charge::after{ content:""; position:absolute; left:50%; bottom:7px; width:11px; height:11px; margin-left:-5.5px; border-radius:50%; background:var(--pc); box-shadow:0 0 10px var(--pc); }
.cal-d.passed{ background:rgba(228,217,204,0.07); }
.cal-d[aria-pressed="true"]{ border-color:var(--yellow); background:rgba(255,227,71,0.1); transform:scale(1.06); z-index:2; }
.cal-side{ display:grid; gap:16px; }
.cal-card{ border:2px solid var(--line); background:rgba(10,10,15,0.8); padding:16px 18px; }
.cal-card .ck{ font:8px 'Press Start 2P', monospace; letter-spacing:1px; color:var(--accent); }
.cal-card .cn{ font:700 1.5rem 'Space Grotesk', sans-serif; text-transform:uppercase; margin-top:8px; line-height:1.15; }
.cal-card .cs{ color:var(--muted); font-size:0.95rem; margin-top:4px; }
.cal-total{ margin-top:12px; }
.cal-total .bar{ height:14px; border:2px solid rgba(228,217,204,0.4); background:rgba(5,5,10,0.8); position:relative; }
.cal-total .bar i{ position:absolute; left:0; top:0; bottom:0; width:0; background:linear-gradient(90deg, var(--crazy), var(--orange)); transition:width 0.4s cubic-bezier(0.2,0.9,0.2,1); }
.cal-total .num{ display:flex; justify-content:space-between; font:700 0.95rem 'JetBrains Mono', monospace; margin-bottom:8px; color:var(--muted); }
.cal-total .num b{ color:var(--paper); font-variant-numeric:tabular-nums; }
.prev-opts{ display:flex; flex-wrap:wrap; gap:0; }
.notif{
  position:relative; margin-top:12px; border-radius:20px; padding:12px 14px; display:flex; gap:11px; align-items:flex-start;
  background:rgba(60,60,70,0.78); border:1px solid rgba(255,255,255,0.14); color:#fff; font-family:-apple-system, 'SF Pro Text', system-ui, sans-serif;
  box-shadow:0 14px 30px rgba(0,0,0,0.45); min-height:70px;
}
.notif img{ width:34px; height:34px; border-radius:9px; flex:none; }
.notif .nt{ flex:1; min-width:0; }
.notif .nh{ display:flex; justify-content:space-between; font-size:11px; opacity:0.7; text-transform:uppercase; letter-spacing:0.3px; }
.notif b{ display:block; font-size:14px; margin-top:2px; line-height:1.3; }
.notif span.nb{ display:block; font-size:13px; opacity:0.9; line-height:1.35; margin-top:1px; }
.notif.flip{ animation:notif-in 0.35s cubic-bezier(0.2,0.9,0.2,1); }
@keyframes notif-in{ from{ transform:translateY(-10px) scale(0.98); opacity:0.3; } to{ transform:none; opacity:1; } }
@media (max-width:860px){ .cal-lab .lab-body{ grid-template-columns:minmax(0, 1fr); } }
@media (max-width:420px){ .cal-d{ font-size:11px; padding:4px 0 0 4px; min-height:32px; } .cal-d.charge::after{ width:9px; height:9px; margin-left:-4.5px; bottom:4px; } .cal-grid{ gap:3px; } }

/* ---- toolkit cards ---- */
.toolkit .card{ transition:transform 0.2s ease, border-color 0.2s ease; }
.toolkit .card:hover{ transform:translateY(-4px); border-color:var(--accent); }

/* ---- cancel guide stepper ---- */
.cx .lab-body{ display:grid; grid-template-columns:minmax(0, 1fr) minmax(250px, 320px); gap:28px; align-items:start; }
.cx-prog{ display:flex; gap:6px; align-items:center; font:8px 'Press Start 2P', monospace; color:var(--soft); letter-spacing:1px; }
.cx-prog i{ width:26px; height:8px; background:rgba(228,217,204,0.2); }
.cx-prog i.on{ background:var(--accent); }
.cx-step{ display:none; }
.cx-step.on{ display:block; animation:fade-down 0.28s ease; }
.cx-step h3{ font:700 1.5rem 'Space Grotesk', sans-serif; text-transform:uppercase; line-height:1.2; margin-bottom:6px; }
.cx-step > p{ color:var(--muted); line-height:1.6; margin-bottom:16px; }
.cx-opts{ display:grid; gap:10px; }
.cx-opt{
  appearance:none; cursor:pointer; text-align:left; color:var(--paper); display:grid; gap:2px; padding:14px 16px;
  background:rgba(10,10,15,0.8); border:2px solid var(--line); transition:border-color 0.15s ease, transform 0.15s ease, background 0.15s ease;
  font:inherit;
}
.cx-opt b{ font:700 1rem 'Space Grotesk', sans-serif; text-transform:uppercase; }
.cx-opt span{ color:var(--muted); font-size:0.9rem; line-height:1.5; }
.cx-opt:hover{ border-color:var(--paper); transform:translateX(4px); }
.cx-opt[aria-pressed="true"], .cx-opt[aria-checked="true"]{ border-color:var(--accent); background:rgba(255,61,31,0.1); }
.cx-opt.soon{ border-style:dashed; cursor:default; opacity:0.6; }
.cx-opt.soon:hover{ border-color:var(--line); transform:none; }
.cx-list{ list-style:none; counter-reset:cxl; display:grid; gap:8px; margin-bottom:16px; }
.cx-list li{ counter-increment:cxl; position:relative; padding:10px 12px 10px 44px; border:1px solid var(--line); background:rgba(10,10,15,0.6); color:var(--muted); font-size:0.95rem; }
.cx-list li::before{ content:counter(cxl); position:absolute; left:12px; top:10px; width:22px; height:22px; display:grid; place-items:center; font:8px 'Press Start 2P', monospace; background:var(--accent); color:var(--ink); }
.cx-email{ border:1px solid var(--line); background:rgba(5,5,10,0.7); padding:14px 16px; margin-bottom:16px; font:12.5px/1.65 'JetBrains Mono', monospace; color:var(--muted); white-space:pre-wrap; overflow-wrap:anywhere; }
.cx-email b{ color:var(--paper); }
.cx-nav{ display:flex; gap:12px; flex-wrap:wrap; margin-top:18px; align-items:center; }
.cx-answer .res{
  display:none; margin-top:14px; padding:14px 16px; border:2px solid var(--teal); background:rgba(45,232,201,0.07); color:var(--paper); line-height:1.6;
}
.cx-answer .res.on{ display:block; animation:fade-down 0.28s ease; }
.cx-answer .res b{ color:var(--teal); }
.cx-phone{ position:sticky; top:100px; }
.mini.orbit{ background:#F3F4F7; color:#101114; min-height:0; border-radius:28px; }
.mini.orbit .oh{ padding:14px 16px 6px; display:flex; justify-content:space-between; align-items:center; }
.mini.orbit .oh strong{ font-size:16px; letter-spacing:-0.3px; }
.mini.orbit .oh small{ font:600 10px -apple-system, system-ui, sans-serif; color:#646876; }
.mini.orbit .osub{ margin:0 14px 12px; background:#fff; border-radius:16px; padding:13px; display:flex; gap:11px; align-items:center; }
.mini.orbit .osub .mono{ flex:none; width:38px; height:38px; border-radius:50%; display:grid; place-items:center; font:700 12px -apple-system, system-ui, sans-serif; color:#fff; background:#C23A7B; }
.mini.orbit .osub b{ display:block; font-size:14px; }
.mini.orbit .osub small{ color:#646876; font-size:11px; }
.mini.orbit .ostat{ margin:0 14px 14px; padding:12px 13px; border-radius:14px; font-size:12px; line-height:1.45; background:#fff; border:1px solid #E3E5EB; }
.mini.orbit .ostat.ok{ background:#E8F7F1; border-color:#9BDCC3; color:#0B5B43; }
.mini.orbit .ostat.wait{ background:#FFF6DF; border-color:#F0D58A; color:#7A5600; }
.mini.orbit .ostat.bad{ background:#FDECEA; border-color:#F2B1A8; color:#8E2515; }
.mini.orbit .ostat b{ display:block; font-size:12.5px; margin-bottom:2px; }
.mini.orbit .ostep{ margin:0 14px 14px; font:700 10px -apple-system, system-ui, sans-serif; color:#646876; text-transform:uppercase; letter-spacing:0.5px; }
@media (max-width:860px){ .cx .lab-body{ grid-template-columns:1fr; } .cx-phone{ position:static; max-width:340px; } }

/* ---- bank flow ---- */
.bank .dia-node.lit rect{ stroke:var(--crazy); fill:rgba(255,61,31,0.1); }
.bank .dia-line.lit{ stroke:var(--crazy); }
.bank .dia-line.login{ stroke:rgba(45,232,201,0.55); }
.bank .dia-line.login.lit{ stroke:var(--teal); }
.bank .dia-log b{ color:var(--crazy); }
.bank .dia-log .ok{ color:var(--teal); font-weight:700; }
.bank-know{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap:12px; margin-top:6px; }
.know{ appearance:none; text-align:left; cursor:pointer; color:inherit; font:inherit; display:grid; align-content:start; width:100%; border:2px solid var(--line); background:rgba(10,10,15,0.7); padding:14px 16px; transition:border-color 0.2s ease, opacity 0.2s ease; }
.know h4{ font:8px/1.6 'Press Start 2P', monospace; letter-spacing:1px; color:var(--soft); text-transform:uppercase; margin-bottom:8px; }
.know p{ color:var(--muted); font-size:0.9rem; line-height:1.55; }
.know.lit{ border-color:var(--crazy); }
.know.lit h4{ color:var(--crazy); }
.bank .know.lit.t{ border-color:var(--teal); }

/* ---- free / pro ---- */
.fp .lab-bar .seg{ margin-left:auto; }
.fp-table{ width:100%; border-collapse:collapse; }
.fp-table th, .fp-table td{ text-align:left; padding:13px 14px; border-bottom:1px solid var(--line); vertical-align:top; font-size:0.95rem; }
.fp-table thead th{ font:8px 'Press Start 2P', monospace; letter-spacing:1px; color:var(--soft); text-transform:uppercase; padding-bottom:14px; }
.fp-table tbody td:first-child{ color:var(--paper); font-weight:700; }
.fp-table td{ color:var(--muted); transition:background 0.25s ease, color 0.25s ease, opacity 0.25s ease; }
html.js .fp[data-plan="free"] .fp-table .c-pro{ opacity:0.38; }
html.js .fp[data-plan="pro"] .fp-table .c-free{ opacity:0.38; }
html.js .fp[data-plan="pro"] .fp-table td.c-pro.up{ background:rgba(45,232,201,0.10); color:var(--paper); }
html.js .fp[data-plan="pro"] .fp-table td.c-pro.up::before{ content:"✓ "; color:var(--teal); font-weight:700; }
.fp-sum{ margin-top:14px; font:9px/1.9 'Press Start 2P', monospace; color:var(--yellow); letter-spacing:1px; text-transform:uppercase; }
html:not(.js) .fp .seg{ display:none; }
@media (max-width:640px){ .fp-table th, .fp-table td{ padding:10px 8px; font-size:0.85rem; } .fp-table thead th{ font-size:7px; } }

@media (prefers-reduced-motion: reduce){
  .mail-card, .level-ship, .planet{ transition:none; }
  .pix-hint::before, .game-pips i.cur{ animation:none; }
}

/* ============================================================
   SONDA, as in the app today (design board "Sonda app screens", 22 Oct 2026, build 34).
   The theme's own colours: surface header with a red accent, one diagonal stripe,
   the chosen lane filled with the accent, unread = a short tick, "REPLY" chip,
   Space Grotesk / New York / JetBrains Mono (all bundled). The hero phone shows
   dark mode (the board's default); the small phones are light, and dark when the
   demo's Dark chip is on.
   ============================================================ */
.phone-sonda, .mini:not(.orbit){
  --ink:#101114; --slate:#5E616D; --rule:#E2E3EA; --mist:#F3F4F7; --surface:#FFFFFF; --sunken:#EEEFF3; --accent:#C0301A; --on:#FFFFFF; --stripe2:#2F6FED;
}
.phone-sonda, .mini:not(.orbit).dark{
  --ink:#F5F5F7; --slate:#9A9CAB; --rule:#262733; --mist:#0B0B0F; --surface:#17181F; --sunken:#22232D; --accent:#E8492B; --on:#FFFFFF; --stripe2:#3D8BFF;
}
.mini:not(.orbit){ --accent:var(--th, #C0301A); }
.mini:not(.orbit).dark{ --accent:var(--th, #E8492B); }
.phone-sonda .screen, .mini:not(.orbit){ background:var(--mist); color:var(--ink); }
.phone-sonda .m-top{ position:relative; overflow:hidden; flex:none; background:var(--surface); border-bottom:1px solid var(--rule); padding-bottom:9px; }
.phone-sonda .m-top::after, .mini:not(.orbit) .mini-h::after{ content:""; position:absolute; right:-34px; top:30px; width:140px; height:11px; transform:rotate(-32deg); opacity:0.85; pointer-events:none;
  background:repeating-linear-gradient(90deg, var(--accent) 0 12px, transparent 12px 17px, var(--stripe2) 17px 29px, transparent 29px 34px); }
.phone-sonda .m-status{ position:relative; z-index:1; color:var(--ink); padding:16px 24px 4px; }
.phone-sonda .m-head{ position:relative; z-index:1; padding:4px 12px 0; }
.phone-sonda .m-title{ display:flex; align-items:center; gap:6px; font:700 22px 'Space Grotesk', -apple-system, system-ui, sans-serif; letter-spacing:-0.02em; }
.phone-sonda .m-title b{ font-weight:700; flex:1; margin-left:2px; }
.phone-sonda .m-logo{ width:26px; height:26px; border-radius:8px; flex:none; background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E") center/62% no-repeat; }
.phone-sonda .m-ic{ width:26px; height:26px; border-radius:50%; flex:none; border:1px solid var(--rule); background:var(--surface) center/13px no-repeat; }
.phone-sonda .m-ic-s{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F5F5F7' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M4 7h10M18 7h2M4 17h4M12 17h8'/%3E%3Ccircle cx='16' cy='7' r='2'/%3E%3Ccircle cx='10' cy='17' r='2'/%3E%3C/svg%3E"); }
.phone-sonda .m-ic-w{ width:32px; height:32px; border:0; background-color:var(--accent); background-size:15px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9'/%3E%3Cpath d='M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4Z'/%3E%3C/svg%3E"); }
.phone-sonda .m-chips{ display:flex; gap:5px; margin:0; padding:8px 12px 0; position:relative; z-index:1; }
.phone-sonda .m-top .m-chips{ padding:8px 12px 0; }
.phone-sonda .m-chips i{ display:inline-flex; align-items:center; gap:5px; font:500 10px 'Space Grotesk', -apple-system, system-ui, sans-serif; font-style:normal; min-height:22px; padding:0 8px; border-radius:11px; background:transparent; border:1px solid var(--rule); color:var(--slate); }
.phone-sonda .m-chips i.on{ background:var(--sunken); border-color:var(--sunken); color:var(--ink); }
.phone-sonda .m-chips s{ text-decoration:none; min-width:14px; height:14px; padding:0 4px; box-sizing:border-box; border-radius:7px; background:#FF8AC4; color:#fff; font:700 8px/14px 'JetBrains Mono', ui-monospace, Menlo, monospace; text-align:center; display:inline-block; }
.phone-sonda .m-chips s.p{ background:#2DE8C9; color:#05050A; }
.phone-sonda .m-greet{ margin:7px 0 8px; font:italic 400 11.5px ui-serif, 'New York', Georgia, serif; color:var(--slate); line-height:1.3; }
/* lanes: the chosen one is filled with the accent */
.phone-sonda .m-tabs, .phone-sonda .sp-lanes{ position:relative; z-index:1; display:flex; gap:4px; padding:0 12px; border:0; font:0/0 sans-serif; }
.phone-sonda .m-tabs b, .phone-sonda .sp-lane{
  flex:1; height:28px; box-sizing:border-box; border-radius:10px; border:1px solid var(--rule); background:transparent; padding:0; margin:0; cursor:pointer;
  display:flex; align-items:center; justify-content:center; gap:4px; color:var(--slate); font:500 11.5px 'Space Grotesk', -apple-system, system-ui, sans-serif;
}
.phone-sonda .m-tabs u, .phone-sonda .sp-lane u{ text-decoration:none; opacity:0.8; margin:0; font:600 8.5px 'JetBrains Mono', ui-monospace, Menlo, monospace; }
.phone-sonda .m-tabs b.on, .phone-sonda .sp-lane[aria-selected="true"]{ background:var(--accent); border-color:var(--accent); color:var(--on); font-weight:700; }
.phone-sonda .sp-lane:hover:not([aria-selected="true"]){ border-color:var(--slate); color:var(--ink); }
.phone-sonda .sp-lane:focus-visible{ outline:2px solid var(--stripe2); outline-offset:2px; }
.phone-sonda .sp-lane.bump u{ animation:count-bump 0.4s ease; }
/* mail cards */
.phone-sonda .m-rows, .phone-sonda .sp-list{ list-style:none; display:flex; flex-direction:column; gap:6px; padding:9px 12px 12px; }
.phone-sonda .m-rows > li, .phone-sonda .sp-row{ position:relative; background:var(--surface); border:0; border-radius:13px; }
.phone-sonda .m-rows > li{ display:flex; gap:9px; padding:9px 10px; }
.phone-sonda .m-rows > li > div{ flex:1; min-width:0; }
.phone-sonda .sp-row > button.sp-main{ padding:9px 10px; gap:9px; border-radius:13px; }
.phone-sonda .sp-row > button.sp-main:hover{ background:rgba(128,128,150,0.08); }
.phone-sonda .sp-main:focus-visible{ outline:2px solid var(--stripe2); outline-offset:-2px; }
.phone-sonda .av{ flex:none; width:30px; height:30px; border-radius:50%; background:var(--sunken); color:var(--ink); display:grid; place-items:center; font:700 10px 'Space Grotesk', -apple-system, system-ui, sans-serif; position:relative; }
.phone-sonda .av.unread::after, .phone-sonda li.unread > .av::after{ content:""; position:absolute; left:-15px; top:5px; right:auto; width:3px; height:13px; border-radius:2px; background:var(--accent); border:0; }
.phone-sonda .r1{ align-items:baseline; font:500 12px 'Space Grotesk', -apple-system, system-ui, sans-serif; color:var(--ink); }
.phone-sonda .r1 strong{ font-weight:500; }
.phone-sonda .av.unread + .sp-body .r1 strong, .phone-sonda li.unread .r1 strong{ font-weight:700; }
.phone-sonda .r1 time{ font:500 9.5px 'JetBrains Mono', ui-monospace, Menlo, monospace; color:var(--slate); }
.phone-sonda .subj{ font:500 12.5px ui-serif, 'New York', Georgia, serif; color:var(--ink); margin-top:1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.phone-sonda .av.unread + .sp-body .subj, .phone-sonda li.unread .subj{ font-weight:700; }
.phone-sonda .snip{ font-size:10.5px; color:var(--slate); margin-top:1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.phone-sonda .tag{ display:inline-flex; margin-top:5px; font:600 8.5px 'JetBrains Mono', ui-monospace, Menlo, monospace; padding:2px 7px; border-radius:7px; background:var(--accent); color:var(--on); border:0; }
.phone-sonda .tag.later, .phone-sonda .tag.noise, .phone-sonda .tag.star{ background:var(--sunken); color:var(--slate); }
.phone-sonda .sp-why{ padding:0 10px 10px 49px; font-size:10.5px; color:var(--slate); }
.phone-sonda .sp-why b{ color:var(--ink); font-family:'Space Grotesk', -apple-system, system-ui, sans-serif; }
.phone-sonda .sp-why .moves button{ font:600 9.5px 'Space Grotesk', -apple-system, system-ui, sans-serif; padding:5px 9px; border-radius:11px; border:1px solid var(--rule); background:var(--sunken); color:var(--ink); }
.phone-sonda .sp-why .moves button:hover{ background:var(--accent); border-color:var(--accent); color:var(--on); }
.phone-sonda .sp-why .moves button.star{ color:var(--ink); }
.phone-sonda .sp-empty{ color:var(--slate); }
.phone-sonda .sp-toast{ background:var(--ink); color:var(--mist); font-family:'Space Grotesk', -apple-system, system-ui, sans-serif; }

/* the smaller Sonda screens (inbox explorer, privacy lab) */
.mini:not(.orbit) .mini-h{ position:relative; overflow:hidden; background:var(--surface); border-bottom:1px solid var(--rule); padding:15px 14px 11px; }
.mini:not(.orbit) .mini-h::after{ top:8px; right:-40px; width:120px; height:9px; }
.mini:not(.orbit) .mini-h strong{ position:relative; z-index:1; font:700 18px 'Space Grotesk', -apple-system, system-ui, sans-serif; letter-spacing:-0.02em; }
.mini:not(.orbit) .mini-h + *{ margin-top:10px; }
.mini:not(.orbit) .mini-chip{ background:transparent; border:1px solid var(--rule); color:var(--slate); font:500 10.5px 'Space Grotesk', -apple-system, system-ui, sans-serif; }
.mini:not(.orbit) .mini-chip i{ width:7px; height:7px; border-radius:50%; }
.mini:not(.orbit) .mini-chip u{ font:600 9px 'JetBrains Mono', ui-monospace, Menlo, monospace; opacity:0.85; }
.mini:not(.orbit) .mini-chip[aria-pressed="true"]{ background:var(--sunken); border-color:var(--sunken); color:var(--ink); font-weight:600; }
.mini:not(.orbit) .mini-chip[aria-pressed="true"] i{ box-shadow:none; }
.mini:not(.orbit) .mini-rows{ display:flex; flex-direction:column; gap:6px; padding:0 12px 12px; }
.mini:not(.orbit) .mini-rows li{ background:var(--surface); border:0; border-radius:13px; padding:9px 12px 9px 24px; }
.mini:not(.orbit) .mini-rows li::before{ content:""; position:absolute; left:10px; top:50%; width:7px; height:7px; margin-top:-3.5px; border-radius:50%; background:var(--dot, var(--accent)); }
.mini:not(.orbit) .mini-rows .mr-t b{ font:700 12px 'Space Grotesk', -apple-system, system-ui, sans-serif; }
.mini:not(.orbit) .mini-rows .mr-t span{ font:500 11.5px ui-serif, 'New York', Georgia, serif; opacity:0.9; color:var(--slate); }
.mini:not(.orbit) .mini-rows li.pinned::after{ font-family:'JetBrains Mono', ui-monospace, Menlo, monospace; color:var(--accent); }
.mini:not(.orbit) .mini-rows .mr-a button, .mini:not(.orbit) .mini-btn{ font:600 10px 'Space Grotesk', -apple-system, system-ui, sans-serif; border-radius:11px; border:1px solid var(--rule); background:var(--sunken); color:var(--ink); padding:5px 10px; }
.mini:not(.orbit) .mini-rows .mr-a button:hover, .mini:not(.orbit) .mini-btn:hover{ background:var(--accent); border-color:var(--accent); color:var(--on); }
.mini:not(.orbit) .mini-btn.solid{ background:var(--accent); border-color:var(--accent); color:var(--on); }
.mini:not(.orbit) .mini-btn.solid:hover{ filter:brightness(1.1); }
.mini:not(.orbit) .mini-toast{ background:var(--ink); color:var(--mist); font-family:'Space Grotesk', -apple-system, system-ui, sans-serif; }
.mini:not(.orbit) .mini-toast button{ color:var(--accent); filter:brightness(1.25); font-family:'JetBrains Mono', ui-monospace, Menlo, monospace; }
.mini:not(.orbit) .mini-field{ border-bottom-color:var(--rule); font-family:'Space Grotesk', -apple-system, system-ui, sans-serif; }
.mini:not(.orbit) .mini-field label{ color:var(--slate); font:500 10.5px 'JetBrains Mono', ui-monospace, Menlo, monospace; padding-top:1px; }
.mini:not(.orbit) .mini-body{ font-family:ui-serif, 'New York', Georgia, serif; font-size:13px; }
.mini:not(.orbit) .mini-body .sig{ color:var(--slate); border-top-color:var(--rule); font:500 10.5px 'JetBrains Mono', ui-monospace, Menlo, monospace; }
.mini:not(.orbit) .mini-file{ background:var(--surface); border-color:var(--rule); color:var(--slate); font-family:'JetBrains Mono', ui-monospace, Menlo, monospace; }
.mini:not(.orbit) .mini-search{ background:var(--surface); color:var(--ink); border-color:var(--rule); border-radius:14px; font-family:-apple-system, 'SF Pro Text', system-ui, sans-serif; }
.mini:not(.orbit) .mini-search:focus-visible{ outline-color:var(--accent); }
.mini:not(.orbit) .mini-invite{ background:var(--surface); border:0; border-radius:14px; }
.mini:not(.orbit) .mini-invite .when{ color:var(--accent); font:600 10px 'JetBrains Mono', ui-monospace, Menlo, monospace; }
.mini:not(.orbit) .mini-invite b{ font-family:ui-serif, 'New York', Georgia, serif; font-size:16px; }
.mini:not(.orbit) .mini-invite p{ color:var(--slate); }
.mini:not(.orbit) .mini-sw button[aria-pressed="true"]{ border-color:var(--surface); }
.mini:not(.orbit) .plab-img{ background:repeating-linear-gradient(45deg, var(--sunken) 0 10px, var(--rule) 10px 20px); color:var(--slate); }
.mini:not(.orbit) .plab-img.shown{ background:linear-gradient(135deg, var(--accent), #FF7A1F 70%); color:#fff; }
.mini:not(.orbit) .link-demo{ color:var(--accent); text-decoration-thickness:2px; }

/* ============================================================
   ORBIT, as in the app today (design board "Orbit — app design", family look redrawn 22 Oct 2026).
   Warm paper screen, ink slab with the diagonal cut in crazy red to orange,
   `// mono` comments, orbit-ring avatars with a comet dot, floating ink tab bar.
   ============================================================ */
.phone.phone-orbit .screen{ background:#E9E2D7; color:#05050A; font-family:'Space Grotesk', -apple-system, system-ui, sans-serif; }
.phone-orbit .m-status{ color:#05050A; padding:16px 24px 4px; }
.phone-orbit .o-hello{ padding:6px 16px 0; font:400 10px 'JetBrains Mono', ui-monospace, Menlo, monospace; color:#645B52; }
.phone-orbit .o-hello strong{ display:block; margin-top:1px; font:700 21px 'Space Grotesk', -apple-system, system-ui, sans-serif; letter-spacing:-0.02em; color:#05050A; }
.phone-orbit .o-total{ margin:9px 12px 0; padding:0; border-radius:0; background:none; box-shadow:none; color:#EDE6DC; }
.phone-orbit .o-slab{ position:relative; height:112px; border-radius:20px; overflow:hidden; background:linear-gradient(115deg, #FF3D1F, #FF7A1F); }
.phone-orbit .o-slab::before, .phone-orbit .o-slab::after{ content:""; position:absolute; inset:0; background:#05050A; }
.phone-orbit .o-slab::before{ clip-path:polygon(0 0, 104.5% 0, 73.8% 100%, 0 100%); }
.phone-orbit .o-slab::after{ clip-path:polygon(calc(104.5% + 10px) 0, 100% 0, 100% 100%, calc(73.8% + 10px) 100%); }
.phone-orbit .o-slab > *{ position:absolute; z-index:1; }
.phone-orbit .o-total .o-per{ left:15px; top:14px; font:400 9.5px 'JetBrains Mono', ui-monospace, Menlo, monospace; color:#9F978E; }
.phone-orbit .o-total strong{ left:15px; top:35px; margin:0; font:700 31px/1 'Space Grotesk', -apple-system, system-ui, sans-serif; letter-spacing:-0.04em; color:#EDE6DC; font-variant-numeric:tabular-nums; white-space:nowrap; }
.phone-orbit .o-total em{ left:15px; bottom:14px; font:400 10px 'Space Grotesk', -apple-system, system-ui, sans-serif; font-style:normal; color:#9F978E; white-space:nowrap; }
.phone-orbit .o-total .o-pill{ right:12px; top:12px; padding:3px 9px; border-radius:99px; background:#05050A; border:1px solid rgba(159,151,142,0.35); color:#EDE6DC; font:600 9px 'Space Grotesk', -apple-system, system-ui, sans-serif; }
.phone-orbit .o-next{ margin:6px 12px 0; padding:12px 14px 10px; border-radius:20px; background:#05050A; color:#EDE6DC; }
.phone-orbit .o-next .o-bars{ height:24px; gap:3px; }
.phone-orbit .o-next .o-bars i{ background:#EDE6DC; opacity:0.22; }
.phone-orbit .o-next .o-bars i.h{ background:#EDE6DC; opacity:1; }
.phone-orbit .o-stats{ display:flex; align-items:center; gap:10px; margin-top:9px; }
.phone-orbit .o-stats > div{ flex:1; display:flex; flex-direction:column; gap:1px; }
.phone-orbit .o-stats small{ font:400 8.5px 'JetBrains Mono', ui-monospace, Menlo, monospace; color:#9F978E; }
.phone-orbit .o-stats b{ font:600 12px 'Space Grotesk', -apple-system, system-ui, sans-serif; font-variant-numeric:tabular-nums; }
.phone-orbit .o-stats i{ width:1px; height:22px; background:#9F978E; opacity:0.5; }
.phone-orbit .o-sec{ margin:12px 16px 6px; font:700 14px 'Space Grotesk', -apple-system, system-ui, sans-serif; letter-spacing:-0.02em; text-transform:none; color:#05050A; }
.phone-orbit .o-rows{ margin:0 12px; background:#F5F0E9; border:0; border-radius:16px; padding:2px 12px; box-shadow:0 3px 9px rgba(5,5,10,0.04); }
.phone-orbit .o-rows li{ padding:8px 0; border-bottom:0; gap:10px; }
.phone-orbit .mono{ position:relative; width:28px; height:28px; border-radius:50%; margin:0 4px 0 4px; background:var(--b, #E3DACE); color:var(--t, #645B52); font:700 10px 'Space Grotesk', -apple-system, system-ui, sans-serif; z-index:1; }
/* the orbit ring: the back half behind the avatar, the front half over it, a comet on it */
.phone-orbit .mono::before, .phone-orbit .mono::after{ content:""; position:absolute; left:50%; top:50%; width:44px; height:17px; margin:-8.5px 0 0 -22px; border-radius:50%; border:1.2px solid rgba(5,5,10,0.2); transform:rotate(-18deg); pointer-events:none; box-sizing:border-box; }
.phone-orbit .mono::before{ z-index:-1; }
.phone-orbit .mono::after{ z-index:2; border-color:transparent; border-bottom-color:rgba(5,5,10,0.42); }
.phone-orbit .mono i{ position:absolute; z-index:3; right:-6px; top:2px; width:5px; height:5px; border-radius:50%; background:var(--c, #05050A); }
.phone-orbit .o-rows b{ line-height:1.25; font:600 12.5px 'Space Grotesk', -apple-system, system-ui, sans-serif; color:#05050A; }
.phone-orbit .o-rows small{ display:block; line-height:1.3; font:400 9.5px 'JetBrains Mono', ui-monospace, Menlo, monospace; color:#645B52; }
.phone-orbit .o-rows li.soon small{ color:#BA2A13; }
.phone-orbit .o-rows em{ font:600 12.5px 'Space Grotesk', -apple-system, system-ui, sans-serif; color:#05050A; text-align:right; }
.phone-orbit .o-rows em s{ display:block; text-decoration:none; font:400 9px 'Space Grotesk', -apple-system, system-ui, sans-serif; color:#645B52; }
.phone-orbit .o-tabbar{ left:12px; right:12px; bottom:10px; gap:2px; padding:4px; justify-content:stretch; background:#05050A; border:1px solid rgba(255,255,255,0.1); border-radius:24px; box-shadow:0 6px 14px rgba(0,0,0,0.28); font:600 9px 'Space Grotesk', -apple-system, system-ui, sans-serif; color:#8E8A93; }
.phone-orbit .o-tabbar span{ flex:1; text-align:center; padding:8px 0; border-radius:19px; }
.phone-orbit .o-tabbar .on{ background:#E4D9CC; color:#05050A; }

/* cancel guide: the small Orbit screen next to the steps */
.mini.orbit{ background:#E9E2D7; color:#05050A; font-family:'Space Grotesk', -apple-system, system-ui, sans-serif; }
.mini.orbit .oh{ padding:16px 16px 8px; }
.mini.orbit .oh strong{ font:700 18px 'Space Grotesk', -apple-system, system-ui, sans-serif; letter-spacing:-0.02em; }
.mini.orbit .oh small{ font:600 10px 'Space Grotesk', -apple-system, system-ui, sans-serif; color:#7A7066; }
.mini.orbit .osub{ background:#F5F0E9; border:0; border-radius:20px; box-shadow:0 3px 9px rgba(5,5,10,0.04); }
.mini.orbit .osub .mono{ position:relative; width:36px; height:36px; border-radius:50%; background:#F4D8CD; color:#BA2A13; font:700 13px 'Space Grotesk', -apple-system, system-ui, sans-serif; margin:3px 5px 3px 6px; z-index:1; }
.mini.orbit .osub .mono::before, .mini.orbit .osub .mono::after{ content:""; position:absolute; left:50%; top:50%; width:56px; height:22px; margin:-11px 0 0 -28px; border-radius:50%; border:1.2px solid rgba(5,5,10,0.2); transform:rotate(-18deg); box-sizing:border-box; pointer-events:none; }
.mini.orbit .osub .mono::before{ z-index:-1; }
.mini.orbit .osub .mono::after{ z-index:2; border-color:transparent; border-bottom-color:rgba(5,5,10,0.42); }
.mini.orbit .osub .mono i{ position:absolute; z-index:3; right:-7px; top:3px; width:6px; height:6px; border-radius:50%; background:#FF3D1F; }
.mini.orbit .osub b{ font:600 14px 'Space Grotesk', -apple-system, system-ui, sans-serif; }
.mini.orbit .osub small{ font:400 11px 'Space Grotesk', -apple-system, system-ui, sans-serif; color:#645B52; }
.mini.orbit .ostat{ background:#F5F0E9; border:0; color:#05050A; border-radius:20px; }
.mini.orbit .ostat.ok{ background:#D3EDE6; color:#06705F; }
.mini.orbit .ostat.wait{ background:#F1E6BF; color:#7A5A00; }
.mini.orbit .ostat.bad{ background:#F4D8CD; color:#BA2A13; }
.mini.orbit .ostat b{ font-family:'Space Grotesk', -apple-system, system-ui, sans-serif; }
.mini.orbit .ostep{ color:#7A7066; }