/* GitHub Stats Dashboard — design tokens (Tokyo Night + Sudo)
   Source of truth for colors/type. Values are copied from design/Main.dc.html. */

@font-face {
  font-family: "Sudo UI";
  src: url("/static/fonts/SudoUIVariable.woff2") format("woff2");
  font-weight: 200 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Sudo";
  src: url("/static/fonts/SudoVariable.woff2") format("woff2");
  font-weight: 200 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Surfaces */
  --bg:            #1a1b26; /* page */
  --bg-inset:      #16161e; /* controls (segmented, select) */
  --surface:       #1f2335; /* cards */
  --line:          #292e42; /* card borders, hairlines, strip track, empty heat cell */
  --line-strong:   #3b4261; /* tag border */
  --neutral-cell:  #24283b; /* "near median" table cell */

  /* Text (all pass 4.5:1 on --surface) */
  --fg:            #c0caf5; /* values, headings */
  --fg-dim:        #a9b1d6; /* labels, teammate names */
  --muted:         #8089b3; /* captions, axis labels, footnotes */
  --tick:          #565f89; /* teammate ticks on KPI strips (non-text) */

  /* Accents */
  --you:           #7aa2f7; /* "You" marker — the only per-user accent */
  --good:          #9ece6a; /* favorable delta, "better" shading */
  --bad:           #f7768e; /* unfavorable delta, "worse" shading */
  --cyan:          #7dcfff; /* review flow: first response */
  --orange:        #ff9e64; /* review flow: response → approval */
  --purple:        #bb9af7; /* review flow: approval → merge; "sample data" tag */

  /* Diverging (team table), strong enough to sit beside the heat squares.
     Level 1 keeps --fg text ≥ 4.8:1; level 2 switches to white text (≥ 5.4:1). */
  --better-1: rgba(158, 206, 106, 0.28);
  --better-2: rgba(158, 206, 106, 0.45);
  --worse-1:  rgba(247, 118, 142, 0.28);
  --worse-2:  rgba(247, 118, 142, 0.45);

  /* Heat ramp: one smooth Tokyo Night sweep from deep blue through cyan and teal
     to pale lime (like viridis), lightness rising at every step so it reads in
     order. Warm colors stay reserved for deltas and the review flow.
     Level 0 = no activity. */
  --heat-0: #24283b;
  --heat-1: #3d59a1; /* blue0 */
  --heat-2: #2ac3de; /* blue1, cyan */
  --heat-3: #73daca; /* green1, teal */
  --heat-4: #c3e88d; /* green (moon), pale lime */

  /* Type */
  --font-ui:   "Sudo UI", "IBM Plex Sans", system-ui, sans-serif; /* labels, names, headings */
  --font-mono: "Sudo", ui-monospace, monospace;                   /* every number, the wordmark */

  --text-base: 15px;  /* body / table */
  --text-sm:   14px;  /* labels, controls */
  --text-xs:   13px;  /* column headers, legends */
  --text-2xs:  12px;  /* axis labels, footnote */
  --text-h1:   22px;  /* wordmark, mono 600 */
  --text-h2:   16px;  /* card titles, 600 */
  --text-kpi:  44px;  /* KPI value, mono 500, line-height 1 */

  /* Shape & spacing */
  --radius-card: 8px;
  /* Panels float like macOS windows: a crisp contact shadow, one soft blur
     pulled in under the panel, and a faint lit top edge. Kept to a 24px blur:
     panels that resize during transitions repaint their shadow every frame. */
  --panel-shadow:
    inset 0 1px 0 rgb(255 255 255 / .04),
    0 1px 2px rgb(0 0 0 / .3),
    0 10px 24px -10px rgb(0 0 0 / .65);
  --radius-ctl:  6px;
  --radius-cell: 3px;   /* heat cells, bars */
  --radius-td:   4px;   /* team table cells */
  --gap-section: 24px;
  --pad-card:    18px 20px;
  --page-max:    1280px;
  --page-pad:    28px 32px 36px;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: var(--font-ui);
  font-size: var(--text-base);
  line-height: 1.4;
}