.app-shell { min-height: 100vh; }
.product-bar { min-height: 64px; display: flex; align-items: center; gap: 18px; padding: 8px clamp(18px, 4vw, 58px); border-bottom: 1px solid var(--rule); }
.brand { display: inline-flex; align-items: center; min-height: 44px; color: var(--ink); font-weight: 750; letter-spacing: -.02em; text-decoration: none; }
.brand-mark { display: inline-grid; place-items: center; width: 31px; height: 31px; margin-right: 9px; border: 1px solid currentColor; border-radius: 50%; font-size: 12px; letter-spacing: .04em; }
.switcher { display: flex; align-self: stretch; align-items: center; gap: 5px; }
.switcher button, .theme-button, .text-button, .sheet-close { min-width: 44px; min-height: 44px; border: 0; color: var(--ink); background: transparent; cursor: pointer; }
.switcher button { padding: 0 10px; border-bottom: 2px solid transparent; }
.switcher button[aria-current="page"] { border-color: var(--reserve-teal); font-weight: 700; }
.theme-button { margin-left: auto; border: 1px solid var(--rule); border-radius: 50%; }
.page { width: min(100% - 36px, 1180px); margin: 0 auto; padding: clamp(34px, 7vw, 92px) 0 70px; }
.narrow { width: min(100%, 610px); }
.eyebrow, .fixture-heading, .replay-label, .gate-marker { margin: 0 0 13px; color: var(--ink-muted); font-size: 12px; font-weight: 800; letter-spacing: .11em; line-height: 1.25; text-transform: uppercase; }
h1, h2, h3, p { margin-top: 0; }
h1 { max-width: 770px; margin-bottom: 18px; font-size: clamp(34px, 6vw, 66px); line-height: .98; letter-spacing: -.055em; }
h2 { margin-bottom: 10px; font-size: clamp(25px, 3.5vw, 39px); line-height: 1.04; letter-spacing: -.04em; }
h3 { margin-bottom: 8px; font-size: 16px; line-height: 1.2; }
p { line-height: 1.52; }
.helper, .secondary, .quiet, .basis-line, .status-line, .fixture-provenance { color: var(--ink-muted); }
.button, .pool-control, .metric-cell, .pool-row, .primary-action, .secondary-action { min-height: 44px; border: 1px solid var(--ink); border-radius: 0; color: var(--ink); background: transparent; cursor: pointer; }
.button, .primary-action, .secondary-action { display: inline-flex; align-items: center; justify-content: center; padding: 10px 16px; font-weight: 700; text-decoration: none; }
.primary-action { background: var(--ink); color: var(--paper); }
.primary-action:disabled { cursor: not-allowed; opacity: .42; }
.secondary-action { border-color: var(--rule); }
.secondary-action:disabled { cursor: not-allowed; opacity: .42; }
.pool-control { display: block; width: min(100%, 610px); margin-top: 27px; padding: 16px; text-align: left; }
.pool-control strong, .pool-control span { display: block; }
.pool-control span { margin-top: 4px; color: var(--ink-muted); font-size: 14px; }
.arrival-layout { display: grid; grid-template-columns: minmax(0, 610px); align-items: end; }
.arrival-actions { margin-top: 16px; }
.trade-atmosphere { min-height: 154px; display: flex; align-items: center; gap: 11px; overflow: hidden; color: var(--ink-muted); }
.cylinder { display: grid; flex: 0 0 42px; place-items: center; width: 42px; height: 70px; border: 1px solid currentColor; border-radius: 50% / 14%; font-size: 10px; font-weight: 800; letter-spacing: .05em; writing-mode: vertical-rl; }
.cylinder.fund { color: var(--reserve-teal); }
.cylinder.anchor { color: var(--anchor-amber); }
.beads { display: flex; flex: 1 1 0; gap: 7px; min-width: 0; contain: inline-size; overflow: hidden; border-top: 1px solid var(--rule); }
.beads i { display: block; flex: 0 0 9px; width: 9px; height: 9px; margin-top: -5px; border: 1px solid var(--ink-muted); border-radius: 50%; background: var(--paper); }
.beads i:nth-child(3n) { border-color: var(--reserve-teal); }
.beads i:nth-child(5n) { border-color: var(--anchor-amber); }
.loading-block { min-height: 180px; padding-top: 56px; }
.skeleton { width: min(100%, 500px); height: 18px; margin-top: 15px; border: 1px solid var(--rule); opacity: .55; }
.skeleton.short { width: min(65%, 310px); }
.identity-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 18px; padding-bottom: 18px; border-bottom: 1px solid var(--rule); }
.identity-row h1 { margin: 0; font-size: clamp(30px, 4vw, 47px); }
.change-pool { margin-left: auto; }
.answer-block { margin-top: 34px; padding: 22px 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.answer-block h2 { margin-bottom: 11px; }
.answer-detail { max-width: 690px; margin-bottom: 10px; }
.basis-line { margin: 0; font-size: 13px; font-weight: 700; letter-spacing: .025em; }
.gate-panel { position: relative; padding-left: 19px; border-color: var(--rule); }
.gate-panel::before { position: absolute; top: 23px; bottom: 23px; left: 0; width: 4px; background: var(--gate); content: ""; }
.gate-panel .gate-marker { color: var(--anchor-amber); }
.gate-actions, .sheet-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.basket-line { margin: 24px 0 14px; font-size: 14px; font-weight: 650; }
.metric-grid { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; border-top: 1px solid var(--rule); border-left: 1px solid var(--rule); }
.metric-cell { display: block; min-width: 0; min-height: 180px; padding: 15px; border: 0; border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule); overflow-wrap: anywhere; text-align: left; }
.metric-cell:hover, .metric-cell:focus-visible, .pool-row:hover, .pool-row:focus-visible, .pool-control:hover, .pool-control:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.metric-label { display: block; min-height: 38px; color: var(--ink-muted); font-size: 12px; font-weight: 800; letter-spacing: .055em; line-height: 1.2; text-transform: uppercase; }
.metric-value { display: block; margin-top: 14px; font-size: clamp(21px, 2.6vw, 31px); font-weight: 750; letter-spacing: -.045em; line-height: 1.02; overflow-wrap: anywhere; white-space: pre-line; }
.token-number { white-space: nowrap; }
.token-unit { white-space: nowrap; }
.metric-phrase { display: block; min-height: 42px; margin-top: 6px; font-size: 13px; line-height: 1.3; overflow-wrap: anywhere; }
.metric-footer { display: block; margin-top: 14px; color: var(--ink-muted); font-size: 12px; font-weight: 700; }
.partial-banner { margin: 16px 0 0; padding-left: 12px; border-left: 2px solid var(--reserve-teal); color: var(--ink); font-size: 13px; }
.full-width-action { width: 100%; margin-top: 16px; }
.replay-placeholder { margin-top: 50px; padding-top: 17px; border-top: 1px solid var(--rule); }
.master-tag { display: inline-block; margin-left: 7px; padding: 2px 5px; border: 1px solid var(--rule); font-size: 10px; font-weight: 800; letter-spacing: .08em; }
.replay-frame { width: 100%; max-width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: var(--ink); }
.replay-frame video { display: block; width: 100%; height: 100%; object-fit: contain; }
.replay-transport { display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto auto; gap: 10px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--rule); }
.replay-control, .replay-speed select { min-height: 44px; }
.replay-time { margin: 0; font-variant-numeric: tabular-nums; white-space: nowrap; }
.replay-scrubber { width: 100%; min-height: 44px; margin: 0; }
.replay-speed { display: flex; align-items: center; gap: 5px; min-height: 44px; font-size: 13px; font-weight: 700; white-space: nowrap; }
.replay-speed select { max-width: 84px; border: 1px solid var(--rule); border-radius: 0; color: var(--ink); background: var(--paper); font: inherit; }
.final-result-band { display: flex; gap: 12px; justify-content: space-between; margin-top: 14px; padding: 14px 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.final-result-band strong { text-transform: uppercase; font-size: 12px; letter-spacing: .08em; }
.custom-speed-label { display: block; margin-bottom: 8px; font-weight: 700; }
[data-custom-speed] { width: 100%; min-height: 44px; padding: 8px 12px; border: 1px solid var(--ink); border-radius: 0; color: var(--ink); background: var(--paper-raised); font: inherit; }
.empty-state { max-width: 650px; padding-top: 50px; }
.auth-page { min-height: 100vh; padding: clamp(30px, 7vw, 95px) clamp(18px, 8vw, 140px); }
.auth-page .brand { margin-bottom: 65px; }
.auth-block { max-width: 450px; }
.auth-footer { margin-top: 55px; color: var(--ink-muted); font-size: 13px; }
.overlay { position: fixed; z-index: 20; inset: 0; display: flex; align-items: end; justify-content: center; padding: 0; background: color-mix(in srgb, var(--ink) 28%, transparent); }
.sheet { width: 100%; max-height: min(85vh, 760px); overflow: auto; padding: 9px 18px 28px; background: var(--sheet); border-top: 1px solid var(--ink); }
.sheet-evidence { height: 100%; max-height: none; }
.drag-handle { width: 38px; height: 4px; margin: 0 auto 13px; border-radius: 4px; background: var(--rule); }
.sheet-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 13px; border-bottom: 1px solid var(--rule); }
.sheet-head h2 { margin: 0; font-size: 24px; }
.sheet-close { padding: 0 8px; font-weight: 700; }
.sheet-body { padding-top: 22px; }
.evidence-body { padding-top: 0; }
.evidence-summary { padding-top: 22px; }
.evidence-summary .sheet-value { margin-bottom: 8px; }
.sheet-jumps { position: sticky; z-index: 1; top: 0; display: flex; gap: 0; margin: 0 -18px; padding: 10px 18px; overflow-x: auto; -webkit-overflow-scrolling: touch; white-space: nowrap; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); background: var(--sheet); }
.sheet-jumps button { flex: 0 0 auto; min-width: 44px; min-height: 44px; padding: 0 10px; border: 0; color: var(--ink); background: transparent; font-weight: 700; cursor: pointer; }
.evidence-section { padding: 24px 0; border-bottom: 1px solid var(--rule); scroll-margin-top: 65px; }
.evidence-section p:last-child { margin-bottom: 0; }
.evidence-rows { border-top: 1px solid var(--rule); }
.evidence-rows > div { display: grid; grid-template-columns: minmax(112px, .7fr) 1.3fr; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--rule); font-size: 14px; line-height: 1.45; }
.evidence-rows > div > span:first-child { color: var(--ink-muted); }
.calibration-block { padding: 24px 0; border-bottom: 1px solid var(--rule); }
.calibration-block p:last-child { margin-bottom: 0; }
.evidence-assistant { margin-top: 28px; }
.sheet-value { font-size: 20px; font-weight: 750; }
.supporting-rows { margin: 20px 0; border-top: 1px solid var(--rule); }
.supporting-row { display: grid; grid-template-columns: minmax(130px, .8fr) 1.2fr; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--rule); font-size: 14px; }
.supporting-row span:first-child { color: var(--ink-muted); }
.quiet-note { margin: 8px 0 0; color: var(--ink-muted); font-size: 13px; }
.search { width: 100%; min-height: 48px; margin-bottom: 8px; padding: 9px 12px; border: 1px solid var(--ink); border-radius: 0; color: var(--ink); background: var(--paper-raised); }
.result-count { margin: 0 0 8px; font-size: 13px; }
.pool-list { border-top: 1px solid var(--rule); }
.pool-row { display: grid; grid-template-columns: 1fr auto; width: 100%; padding: 14px 0; border: 0; border-bottom: 1px solid var(--rule); text-align: left; }
.pool-row strong, .pool-row span { display: block; }
.pool-row .secondary { margin-top: 3px; font-size: 13px; }
.pool-status { align-self: center; margin-left: 14px; color: var(--ink-muted); font-size: 12px; text-align: right; }
.pool-row[data-selected="true"] .pool-status::after { display: block; margin-top: 5px; color: var(--reserve-teal); content: "✓"; }
.gate-list { margin: 14px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--rule); }
.gate-list li { display: grid; grid-template-columns: 1fr auto; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--rule); }
.gate-status { color: var(--ink-muted); font-size: 13px; white-space: nowrap; }
.fixture-page { width: min(100% - 36px, 1040px); margin: 0 auto; padding: 34px 0 70px; }
.fixture-controls { display: flex; flex-wrap: wrap; gap: 8px; margin: 21px 0; }
.fixture-controls button[aria-pressed="true"] { background: var(--ink); color: var(--paper); }
.fixture-provenance { margin: 0 0 24px; font-size: 13px; }
.demo-note { margin: 0 0 16px; color: var(--anchor-amber); font-size: 13px; font-weight: 750; }
body.sheet-open { overflow: hidden; }
button:focus-visible, input:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

@media (min-width: 900px) {
  .overlay { justify-content: end; }
  .sheet { width: min(490px, 45vw); height: 100%; max-height: none; border-top: 0; border-left: 1px solid var(--ink); }
  .drag-handle { display: none; }
}
@media (max-width: 720px) {
  .product-bar { gap: 6px; padding-inline: 12px; }
  .brand { font-size: 14px; }
  .brand-mark { width: 27px; height: 27px; margin-right: 6px; }
  .switcher button { padding-inline: 6px; font-size: 13px; }
  .page { width: min(100% - 28px, 1180px); }
  .arrival-layout { grid-template-columns: 1fr; }
  .trade-atmosphere { min-height: 86px; }
  .metric-grid { grid-template-columns: 1fr 1fr; }
  .metric-cell { min-height: 165px; }
  .replay-transport { grid-template-columns: 1fr 1fr; }
  .replay-scrubber { grid-column: 1 / -1; grid-row: 2; }
}