@import url('https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@75..125,400..800&family=IBM+Plex+Mono:wght@400;600;700&display=swap');

* { box-sizing:border-box; }
html { min-width:320px; background:var(--ground); color-scheme:light dark; }
:root[data-theme="dark"] { color-scheme:dark; }
:root[data-theme="light"] { color-scheme:light; }
body { margin:0; background:var(--ground); color:var(--ink); font:15px/1.5 Archivo, -apple-system, system-ui, sans-serif; }
button, input, textarea { font:inherit; }
button, a { -webkit-tap-highlight-color:transparent; }
a { color:inherit; }
:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.mono { font-family:"IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace; }
.eyebrow { font:600 .72rem/1 "IBM Plex Mono", ui-monospace, Menlo, monospace; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-muted); }
.display, h1, h2, h3 { font-family:Archivo, "Arial Narrow", "Helvetica Neue", sans-serif; font-stretch:75%; font-weight:700; line-height:1.12; letter-spacing:.01em; text-wrap:balance; }
h1, h2, h3, p { margin:0; }
h1 { font-size:clamp(2.25rem, 9vw, 4.25rem); text-transform:uppercase; }
h2 { font-size:1.35rem; text-transform:uppercase; letter-spacing:.03em; }
.muted { color:var(--ink-muted); }
:root[data-theme="light"] .muted { color:var(--ink); }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .muted { color:var(--ink); } }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.stamp { display:inline-block; width:fit-content; transform:rotate(-2deg); border:1.5px solid var(--accent); color:var(--ink); border-radius:3px; font:700 .8rem/1 "IBM Plex Mono", ui-monospace, monospace; letter-spacing:.18em; text-transform:uppercase; padding:.45rem .7rem; }
.stamp.neg { border-color:var(--neg); color:var(--neg); }
.chip-s { display:inline-flex; align-items:center; gap:.4rem; width:fit-content; font:600 .7rem/1 "IBM Plex Mono", ui-monospace, monospace; letter-spacing:.08em; padding:.32rem .6rem; border-radius:999px; border:1px solid var(--line); color:var(--ink-muted); }
.chip-s.live { border-color:var(--live); color:var(--ink); }
.chip-s.live::before { content:""; width:.45rem; height:.45rem; border-radius:50%; background:var(--live); animation:pulse 1.6s infinite; }
.chip-s.pos { border-color:var(--pos); color:var(--pos); }
.chip-s.neg { border-color:var(--neg); color:var(--neg); }
.chip-s.acc { border-color:var(--accent); color:var(--ink); }
@keyframes pulse { 0%,100% { opacity:1; } 50% { opacity:.35; } }
.pop { animation:pickpop 200ms cubic-bezier(.2,0,0,1); }
@keyframes pickpop { from { opacity:0; transform:translateY(-4px); background:var(--surface-2); } }
.tickline { display:flex; gap:1rem; align-items:baseline; }
.tickline .score, .team-wire__score .score { font:700 2rem/1 "IBM Plex Mono", ui-monospace, monospace; font-variant-numeric:tabular-nums; padding:.1rem .3rem; border-radius:3px; }
.tickline .score.flash-pos, .team-wire__score .score.flash-pos { animation:flashpos 400ms; }
@keyframes flashpos { 0% { background:transparent; } 30% { background:color-mix(in srgb, var(--pos) 18%, transparent); } 100% { background:transparent; } }
.slam { animation:slam 200ms cubic-bezier(.2,0,0,1); }
@keyframes slam { from { transform:rotate(-6deg) scale(1.15); opacity:.4; } to { transform:rotate(-2deg) scale(1); opacity:1; } }
button.k, .k { display:inline-flex; align-items:center; justify-content:center; min-height:44px; font:600 .9rem/1 Archivo, system-ui, sans-serif; letter-spacing:.02em; padding:.7rem 1.2rem; border-radius:4px; cursor:pointer; border:1px solid transparent; text-decoration:none; transition:transform 120ms cubic-bezier(.2,0,0,1), background 120ms; }
button.k:active, .k:active { transform:scale(.98); }
.k.primary { background:var(--accent); color:var(--accent-ink); }
.k.secondary { background:transparent; color:var(--ink); border-color:var(--line); }
.k.danger { background:transparent; color:var(--neg); border-color:var(--neg); }
.k[aria-disabled="true"], button.k:disabled { cursor:not-allowed; opacity:.7; }
.dossier, .panel { border:1px solid var(--line); border-radius:8px; background:var(--surface); }
.dossier { max-width:24rem; overflow:hidden; }
.dossier .top { display:flex; gap:.9rem; padding:1rem; align-items:center; }
.dossier .headshot { width:3.4rem; height:3.4rem; border-radius:4px; background:var(--surface-2); display:grid; place-items:center; color:var(--ink-muted); font:700 1.1rem/1 Archivo, "Arial Narrow", sans-serif; font-stretch:75%; border:1px solid var(--line); }
.dossier .who { display:flex; flex-direction:column; gap:.25rem; }
.dossier .name { font:700 1.15rem/1.1 Archivo, "Arial Narrow", sans-serif; font-stretch:75%; text-transform:uppercase; }
.dossier .statstrip { display:grid; grid-template-columns:repeat(3, 1fr); border-top:1px solid var(--line); background:var(--surface-2); }
.dossier .stat { padding:.6rem .75rem; display:flex; flex-direction:column; gap:.1rem; }
.dossier .stat + .stat { border-left:1px solid var(--line); }
.dossier .stat b, .num { font-variant-numeric:tabular-nums; }
.dossier .stat span { font:600 .62rem/1 "IBM Plex Mono", ui-monospace, monospace; letter-spacing:.1em; color:var(--ink-muted); text-transform:uppercase; }
.tablewrap { overflow-x:auto; border:1px solid var(--line); border-radius:8px; }
table { border-collapse:collapse; width:100%; font-size:.88rem; background:var(--surface); }
th, td { text-align:left; padding:.55rem .8rem; border-bottom:1px solid var(--line); white-space:nowrap; }
thead th { font:600 .68rem/1.3 "IBM Plex Mono", ui-monospace, monospace; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-muted); background:var(--surface-2); }
tbody tr:last-child td { border-bottom:none; }
tbody tr:hover td { background:var(--surface-2); }
td.num, th.num { text-align:right; font-variant-numeric:tabular-nums; }
.delta.up { color:var(--pos); } .delta.dn { color:var(--neg); }
.panel { padding:1.1rem 1.25rem; display:flex; flex-direction:column; gap:.75rem; }
.redaction { position:relative; display:inline-flex; align-items:center; width:fit-content; }
.redaction::after { content:""; position:absolute; inset:0; background:var(--ink); transform-origin:right; transition:transform 320ms cubic-bezier(.2,0,0,1); }
.redaction.is-revealed::after { transform:scaleX(0); }
.page { width:min(100% - 2.5rem, 70rem); margin:0 auto; padding:3rem 0 8rem; }
.stack { display:flex; flex-direction:column; gap:var(--stack-gap, 1rem); }
.cluster { display:flex; flex-wrap:wrap; gap:.75rem; align-items:center; }
.proto-chrome { position:fixed; z-index:10; right:12px; bottom:12px; display:flex; gap:4px; align-items:center; max-width:calc(100vw - 24px); padding:4px; border:1px solid var(--line); border-radius:8px; background:var(--surface); box-shadow:0 12px 32px color-mix(in srgb, var(--ink) 15%, transparent); }
.proto-chrome__nav, .proto-chrome__theme, .proto-chrome__state { border:0; border-radius:4px; background:transparent; color:var(--ink-muted); min-height:36px; padding:0 9px; cursor:pointer; font:600 .63rem/1 "IBM Plex Mono", ui-monospace, monospace; letter-spacing:.06em; text-transform:uppercase; }
.proto-chrome__nav:hover, .proto-chrome__theme:hover, .proto-chrome__state:hover { color:var(--ink); background:var(--surface-2); }
.proto-chrome__state-label { display:flex; align-items:center; color:var(--ink-muted); font:600 .58rem/1 "IBM Plex Mono", ui-monospace, monospace; letter-spacing:.06em; text-transform:uppercase; }
.proto-chrome__state { appearance:none; max-width:6.8rem; color:var(--ink); }
.proto-menu a[aria-current="page"] { color:var(--ink); font-weight:700; }
.proto-chrome__stamp { padding:0 7px; color:var(--ink); font:600 .58rem/1 "IBM Plex Mono", ui-monospace, monospace; letter-spacing:.08em; white-space:nowrap; }
.proto-menu { position:absolute; right:0; bottom:calc(100% + 6px); width:min(18rem, calc(100vw - 24px)); padding:6px; border:1px solid var(--line); border-radius:8px; background:var(--surface); box-shadow:0 12px 32px color-mix(in srgb, var(--ink) 15%, transparent); }
.proto-menu[hidden] { display:none; }
.proto-menu a { display:block; padding:10px; text-decoration:none; color:var(--ink); border-radius:4px; font-size:.85rem; }
.proto-menu a:hover { background:var(--surface-2); }
.proto-menu [role="link"][aria-disabled="true"] { display:block; padding:10px; color:var(--ink-muted); font-size:.85rem; cursor:not-allowed; }
[data-prototype-tooltip] { position:relative; }
[data-prototype-tooltip]::after { content:attr(data-prototype-tooltip); position:absolute; z-index:5; bottom:calc(100% + 6px); left:50%; width:max-content; max-width:14rem; transform:translateX(-50%); padding:.4rem .55rem; border:1px solid var(--line); border-radius:4px; background:var(--surface-2); color:var(--ink); font:600 .62rem/1.3 "IBM Plex Mono", ui-monospace, monospace; letter-spacing:.05em; opacity:0; pointer-events:none; transition:opacity 120ms; }
[data-prototype-tooltip]:hover::after, [data-prototype-tooltip]:focus-visible::after { opacity:1; }
@media (max-width:640px) { .page { width:min(100% - 1.5rem, 70rem); padding-top:2rem; } .proto-chrome__stamp { display:none; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:.01ms !important; } }
