/* POV system. Everything the camera prints is stamp orange; everything the viewer marks is marker yellow; only LIVE is red. */
:root {
  --base: #0A0A0B; --base-1: #141416; --base-2: #1C1C1F; --base-3: #2A2A2E;
  --ink: #F5F5F7; --muted: #A1A1AA; --faint: #8A8A93;
  --line: rgba(244, 246, 250, .12); --line-2: rgba(244, 246, 250, .26);
  --stamp: #F4F6FA; --stamp-hi: #FFFFFF; --stamp-dim: rgba(244, 246, 250, .14); --stamp-line: rgba(244, 246, 250, .38);
  --marker: #F4F6FA; --marker-dim: rgba(244, 246, 250, .16);
  --rec: #FF3B2F; --rec-dim: rgba(255, 59, 47, .18);
  --ok: #9BDC8A; --ok-dim: rgba(155, 220, 138, .14); --bad: #FF7A63;
  --veil: rgba(20, 20, 22, .42); --veil-lo: rgba(20, 20, 22, .28);
  --f-ui: "Geist", system-ui, -apple-system, sans-serif;
  --f-display: "Geist", system-ui, -apple-system, sans-serif;
  --f-stamp: "Geist", system-ui, sans-serif; --f-dot: "Doto", ui-monospace, monospace;
  --f-code: ui-monospace, 'SF Mono', Menlo, monospace;
  --r-1: 8px; --r-2: 14px; --r-3: 24px;
  --ease-out: cubic-bezier(.16, 1, .3, 1); --ease-in: cubic-bezier(.7, 0, .84, 0);
  /* Legacy aliases kept for page CSS that still reads them */
  --bg: var(--base); --fg: var(--ink); --accent: var(--rec);
  --line-strong: var(--line-2);
  color-scheme: dark;
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin: 0; background: var(--base); color: var(--ink); font-family: var(--f-ui); font-stretch: 100%; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body { touch-action: manipulation; }
button { font: inherit; color: inherit; cursor: pointer; }
a { color: var(--ink); text-decoration-thickness: 1px; text-underline-offset: 3px; }
::selection { background: var(--stamp); color: var(--base); }
:focus-visible { outline: 2px solid var(--marker); outline-offset: 2px; }
input, textarea, select { caret-color: var(--stamp); }
::-webkit-scrollbar { width: 8px; height: 8px; } ::-webkit-scrollbar-thumb { background: var(--base-3); border-radius: 0; } ::-webkit-scrollbar-track { background: transparent; }
* { scrollbar-color: var(--base-3) transparent; }
h1, h2, h3 { text-wrap: balance; }
.mono { font-family: var(--f-ui); font-stretch: 75%; font-weight: 600; font-size: 12px; letter-spacing: .06em; font-variant-numeric: tabular-nums; }
/* LIVE: a stamped tag, never a pill */
.live-pill { display: inline-flex; align-items: center; gap: 6px; height: 22px; padding: 0 7px 0 6px; border-radius: var(--r-1); background: var(--rec); color: var(--base); font-family: var(--f-dot); font-weight: 900; font-size: 12px; letter-spacing: .14em; line-height: 1; }
.live-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--base); animation: livepulse 1.6s steps(2, jump-none) infinite; }
@keyframes livepulse { 0%, 100% { opacity: 1 } 50% { opacity: .25 } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }