@font-face {
  font-family: Geist;
  src: url(/fonts/geist.woff2) format("woff2");
  font-weight: 400 700;
  font-display: swap;
  unicode-range:
    U+20-7E,
    U+A0,
    U+B1-B2,
    U+B7,
    U+D7,
    U+2013-2014,
    U+2018-2019,
    U+201C-201D,
    U+2026,
    U+2190-2193,
    U+2197,
    U+25B2,
    U+25B6,
    U+25BC,
    U+25C0,
    U+25CF;
}
@font-face {
  font-family: Geist;
  src: url(/fonts/geist-latin.woff2) format("woff2");
  font-weight: 400 700;
  font-display: swap;
  unicode-range:
    U+A1-AC,
    U+AE-B0,
    U+B3-B6,
    U+B8-D6,
    U+D8-FF,
    U+131,
    U+152-153,
    U+201A,
    U+201E,
    U+2030,
    U+2039-203A,
    U+20AC,
    U+2122;
}
@font-face {
  font-family: Geist;
  src: url(/fonts/geist-sym.woff2) format("woff2");
  font-weight: 400 700;
  font-display: swap;
  unicode-range:
    U+2020-2022,
    U+2032-2033,
    U+2194-2196,
    U+2198-2199,
    U+219D,
    U+21A9-21AA,
    U+21B0-21B1,
    U+21B3-21B5,
    U+21E4-21E5,
    U+21E7,
    U+2202,
    U+2206,
    U+220F,
    U+2211-2212,
    U+221A,
    U+221E,
    U+222B,
    U+2236,
    U+2248,
    U+2260,
    U+2264-2265,
    U+25B3,
    U+25B7,
    U+25BD,
    U+25C1,
    U+25CA-25CC;
}
@font-face {
  font-family: "Geist Mono";
  src: url(/fonts/geist-mono.woff2) format("woff2");
  font-weight: 400 700;
  font-display: swap;
  unicode-range:
    U+20-7E,
    U+A0,
    U+B1-B2,
    U+B7,
    U+D7,
    U+2013-2014,
    U+2018-2019,
    U+201C-201D,
    U+2026,
    U+2190-2193,
    U+2197,
    U+23CE,
    U+25B2,
    U+25B6,
    U+25BC,
    U+25C0,
    U+25CF;
}
@font-face {
  font-family: "Geist Mono";
  src: url(/fonts/geist-mono-latin.woff2) format("woff2");
  font-weight: 400 700;
  font-display: swap;
  unicode-range:
    U+A1-AC,
    U+AE-B0,
    U+B3-B6,
    U+B8-D6,
    U+D8-FF,
    U+131,
    U+152-153,
    U+201A,
    U+201E,
    U+2030,
    U+2039-203A,
    U+20AC,
    U+2122;
}
@font-face {
  font-family: "Geist Mono";
  src: url(/fonts/geist-mono-sym.woff2) format("woff2");
  font-weight: 400 700;
  font-display: swap;
  unicode-range:
    U+2020-2022,
    U+2032-2033,
    U+2194-2196,
    U+2198-2199,
    U+219D,
    U+21A9-21AA,
    U+21B0-21B1,
    U+21B3-21B5,
    U+21E4-21E5,
    U+21E7,
    U+2202,
    U+2206,
    U+220F,
    U+2211-2212,
    U+221A,
    U+221E,
    U+222B,
    U+2236,
    U+2248,
    U+2260,
    U+2264-2265,
    U+25B3,
    U+25B7,
    U+25BD,
    U+25C1,
    U+25CA-25CC;
}
@font-face {
  font-family: "Geist Mono";
  src: url(/fonts/geist-mono-box.woff2) format("woff2");
  font-weight: 400 700;
  font-display: swap;
  unicode-range: U+2500-259F;
}
@font-face {
  font-family: "WB Symbols";
  src: url(/fonts/wb-symbols.woff2) format("woff2");
  font-weight: 100 900;
  font-display: swap;
  unicode-range:
    U+394,
    U+3A3,
    U+3B1-3B2,
    U+21BA-21BB,
    U+21D2,
    U+21D4,
    U+2204-2205,
    U+2208-2209,
    U+220B-220C,
    U+2227-222A,
    U+2261,
    U+226A-226B,
    U+2282-2287,
    U+228F-2290,
    U+2310,
    U+23E9-23EA,
    U+23F8,
    U+25C6,
    U+26A0,
    U+2713,
    U+2717,
    U+27F2,
    U+27F9-27FA;
}
@font-face {
  font-family: "Geist Fallback";
  src: local("Arial"), local("ArialMT");
  font-weight: 100 500;
  size-adjust: 102.34%;
  ascent-override: 98.2%;
  descent-override: 28.83%;
  line-gap-override: 0%;
  unicode-range: U+0-FF, U+2000-206F;
}
@font-face {
  font-family: "Geist Fallback";
  src: local("Arial Bold"), local("Arial-BoldMT");
  font-weight: 600 900;
  size-adjust: 99.36%;
  ascent-override: 101.15%;
  descent-override: 29.69%;
  line-gap-override: 0%;
  unicode-range: U+0-FF, U+2000-206F;
}
@font-face {
  font-family: "Geist Mono Fallback";
  src: local("Courier New"), local("CourierNewPSMT");
  size-adjust: 99.98%;
  ascent-override: 100.52%;
  descent-override: 29.51%;
  line-gap-override: 0%;
  unicode-range: U+0-FF, U+2000-206F;
}
@font-face {
  font-family: "WB Arcade";
  src: url(/fonts/wb-arcade.woff2) format("woff2");
  font-display: swap;
}
:root {
  --bg:#0d1022;
  --bg-card:#16213e;
  --bg-deep:#10131f;
  --fg:#eceef8;
  --muted:#9a9fbe;
  --border:rgba(160,180,255,.14);
  --cyan:#88d8f1;
  --pink:#ff7bcc;
  --red-btn:#d63553;
  --hair:rgba(160,180,255,.10);
  --sans:Geist,"WB Symbols","Geist Fallback",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono2:"Geist Mono","WB Symbols","Geist Mono Fallback",ui-monospace,SFMono-Regular,Menlo,Consolas,"DejaVu Sans Mono",monospace;
}
body {
  font: 13px/1.5 var(--sans);
  -webkit-font-smoothing: antialiased;
  background:
    radial-gradient(
      900px 480px at 0 -80px,
      rgba(255, 123, 204, .06),
      transparent 60%),
    var(--bg);
}
.mono,
pre.mono,
#reasoning-body,
#action-history,
.action-history li,
.actor-chip,
.kn-rules li .conf,
.kn-rules li .src,
.kn-rules li .born,
.stage-pill,
#reflections-list li,
#transport button,
#step-counter,
#time-meta,
.speed-lbl select,
#level-nav select,
#level-nav .lbl,
#level-buttons .lvl-btn,
.btn-back,
#hdr-title .hdr-v,
#hdr-title .hdr-k,
.hdr-lbl,
.pane h2,
.pane h3,
.pane h4,
.llm-legend,
.legend,
.keycap,
.plan-chip,
#kbd-help,
code {
  font-family: var(--mono2);
}
:focus-visible {
  outline: 2px solid var(--cyan);
  outline-offset: 2px;
}
#topbar {
  background: rgba(13, 16, 34, .92);
  border-bottom-color: var(--hair);
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-right: 16px;
  color: var(--pink);
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
}
.brand .mk {
  flex: none;
  width: 16px;
  height: 16px;
  filter: drop-shadow(0 0 4px rgba(255, 123, 204, .55));
}
.brand span {
  font: 10px "WB Arcade", monospace;
  display: inline-block;
  transform: scaleY(1.3);
  position: relative;
  top: 1px;
}
.btn-back {
  border-color: rgba(136, 216, 241, .45);
  border-radius: 999px;
  background: rgba(136, 216, 241, .06);
  font-family: var(--mono2);
  font-weight: 500;
}
#hdr-title .hdr-v {
  border-color: var(--border);
  border-radius: 6px;
  font-family: var(--mono2);
  font-weight: 500;
}
#hdr-title .hdr-k,
.hdr-lbl {
  font-family: var(--mono2);
  letter-spacing: .1em;
}
#transport,
#level-nav {
  background: var(--bg-deep);
  border-bottom-color: var(--hair);
}
#transport button {
  font-family: var(--mono2);
  font-variant-emoji: text;
  border-color: var(--border);
  border-radius: 8px;
  background: rgba(255, 255, 255, .03);
}
#transport button:hover {
  border-color: var(--cyan);
  color: var(--cyan);
}
#transport button#btn-prev,
#btn-prev {
  transform: none;
}
.speed-lbl select,
#level-nav select {
  border-color: var(--border);
  border-radius: 6px;
  font-family: var(--mono2);
}
#scrubber {
  accent-color: var(--cyan);
}
#level-nav .lbl {
  font-family: var(--mono2);
}
#level-buttons {
  position: relative;
  gap: 6px;
  padding: 2px 0;
}
#level-buttons .lvl-btn + .lvl-btn::before {
  content: "";
  position: absolute;
  right: calc(100% + 1px);
  top: 50%;
  width: 6px;
  height: 2px;
  margin-top: -1px;
  background: rgba(160, 180, 255, .18);
  pointer-events: none;
}
#level-buttons .lvl-btn {
  position: relative;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 3px 10px;
  background: var(--bg-card);
  font-family: var(--mono2);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}
#level-buttons .lvl-btn:hover {
  border-color: var(--cyan);
}
#level-buttons .lvl-btn.completed {
  border-left: 1px solid var(--ok);
  border-color: var(--ok);
  box-shadow: 0 0 0 1px rgba(79, 204, 48, .35);
}
#level-buttons .lvl-btn.retry {
  border-left: 1px solid var(--bad);
  border-color: var(--bad);
  box-shadow: 0 0 0 1px rgba(249, 60, 49, .35);
}
#level-buttons .lvl-btn.failed {
  border-left: 1px solid var(--border);
}
#level-buttons .lvl-btn.cur {
  background: var(--red-btn);
  border-color: var(--red-btn);
  color: #fff;
}
.pane {
  border-color: var(--border);
  border-radius: 12px;
}
.card {
  border-color: rgba(160, 180, 255, .12);
  border-radius: 8px;
}
.pane h2 {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .12em;
}
.pane h2 .muted {
  font-size: 11px;
  font-weight: 400;
  letter-spacing: .02em;
  text-transform: none;
}
.pane h3,
.pane h4 {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .1em;
}
.pane h3 .muted,
.pane h4 .muted,
.card-hdr .muted {
  font: 400 11px var(--mono2);
  letter-spacing: .02em;
  text-transform: none;
}
.action-history,
.plan-chip,
.keycap {
  border-color: var(--border);
}
.action-history li.plan-exec .actor-llm_plan,
.action-history li.plan-exec .src-reflection_plan,
.action-history li.plan-exec .exec-suffix {
  color: #a8944a;
}
.action-history li.plan-exec.cur .actor-llm_plan,
.action-history li.plan-exec.cur .src-reflection_plan,
.action-history li.plan-exec.cur .exec-suffix {
  color: #fff;
}
#kn-rules li.muted {
  display: block;
}
.plan-chip {
  border-radius: 7px;
}
#kbd-help {
  border-top-color: var(--hair);
  font-family: var(--mono2);
}
.action-history li.cur,
.action-history li.llm.cur,
.action-history li.reset-marker.cur {
  background: var(--red-btn);
  color: #fff;
}
.action-history li.cur span {
  color: #fff;
}
#reflections-list li.cur {
  background: var(--red-btn);
  color: #fff;
}
#reflections-list li.cur span {
  color: #fff;
}
.btn-back {
  font-size: 12px;
}
#hdr-title .hdr-k,
.hdr-lbl {
  font-size: 11px;
  font-weight: 500;
}
#hdr-title .hdr-v {
  font-size: 13px;
}
#hdr-meta {
  font-size: 13px;
}
#transport button {
  font-size: 14px;
}
#step-counter {
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}
#time-meta {
  font-size: 12px;
}
.speed-lbl {
  font-size: 12px;
}
.speed-lbl select,
#level-nav select {
  font-size: 12px;
}
#level-nav .lbl {
  font-size: 12px;
  font-weight: 500;
}
#stagebar > div:last-child {
  font-variant-numeric: tabular-nums;
}
.crt-toggle {
  font: 500 11px var(--mono2);
  letter-spacing: .08em;
}
.llm-legend {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0;
}
#canvas-overlay {
  font-size: 12px;
}
#dpad-label {
  font-size: 12px;
}
.keycap {
  font-size: 17px;
}
#submit-note {
  font-size: 12px;
  line-height: 1.5;
}
.kvp {
  font-size: 12px;
}
.kvp dt,
.kvp dd {
  line-height: 1.4;
}
.actor-chip {
  font-weight: 600;
  font-size: 11px;
}
.action-history li {
  font-size: 12px;
  line-height: 18px;
}
.action-history li .step {
  font-variant-numeric: tabular-nums;
}
.action-history li .small {
  font-size: 12px;
}
.action-history li.plan-exec .exec-suffix {
  font-size: 11px;
}
.action-history li .llm-badge {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .04em;
}
.action-history li.level-hdr {
  font-size: 12px;
  font-weight: 600;
}
.action-history li.level-hdr .small {
  font-weight: 400;
}
.action-history li.level-hdr .lvl-stat,
.action-history li.level-hdr .lvl-jump {
  font-size: 11px;
}
.plan-chips {
  font-size: 20px;
}
#plan-meta {
  font-size: 12px;
  line-height: 1.5;
}
.legend {
  font-size: 11px;
}
.kn-rules li {
  font-size: 12px;
}
.kn-rules li .conf {
  font-variant-numeric: tabular-nums;
}
.kn-rules li .text {
  font-family: var(--sans);
  line-height: 1.45;
}
.kn-rules li .src,
.kn-rules li .born {
  font-size: 11px;
}
#kn-compacted {
  font-size: 12px;
  line-height: 1.55;
}
.kn-diff {
  font-size: 12px;
  line-height: 1.45;
}
#reasoning-grid pre {
  font-size: 11px;
  line-height: 1.4;
}
#reasoning-grid .c-board pre {
  line-height: 1.3;
}
#reasoning-body {
  font-size: 13px;
  line-height: 1.6;
  max-width: 100ch;
}
#reasoning-body .plan {
  font-weight: 600;
}
#fsm-help .card {
  font-size: 13px;
  line-height: 1.6;
}
#fsm-help p,
.stage-help li {
  max-width: 52em;
}
#fsm-help p {
  line-height: 1.6;
}
#fsm-help em {
  font-style: normal;
  color: var(--cyan);
}
.stage-pill {
  font-weight: 600;
  font-size: 11px;
  letter-spacing: .02em;
}
#reflections-list li {
  font-size: 12px;
  line-height: 1.5;
}
#reflections-list li .step,
#reflections-list li .delta {
  font-variant-numeric: tabular-nums;
}
#kbd-help {
  font-size: 12px;
}
