/* deltacenter.io design kit v1: tokens (2026-10-25; user: "establish a 'style' base across all these pages (that can be
 * slightly modified but by and large use the theme)"). One palette for every deltacenter app: Sloan's light values and
 * Live Odds' dark values (Optic Odds' dark theme), which the two already shared. Served at https://deltacenter.io/ds/v1/.
 * v1 never changes underneath a page (fixes only); a different look ships as v2.
 *
 * Theme: light on :root, dark on :root[data-theme="dark"] (dc.js sets data-theme before first paint from the shared
 * dc_theme cookie, else the app's default: <html data-dc-theme-default="dark">).
 * Font: each app keeps its own default (user: "keep the fonts the way they are": Sloan Inter, Live Odds IBM Plex Sans) by
 * setting <html data-dc-font="inter|plex|system">; the user can change it per app (dc.js, cookie dc_font_<app>).
 */

@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("fonts/inter-var-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("fonts/inter-var-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  color-scheme: light;

  /* fonts: the app picks the default, the user may switch (dc.js) */
  --dc-font-inter: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --dc-font-plex: "IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --dc-font-system: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --dc-font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --dc-font: var(--dc-font-inter);

  /* sizes (user 2026-10-24: numbers one font, one size, one weight; emphasis by colour, never bold or bigger) */
  --dc-text: 14px;        /* body copy */
  --dc-num: 13px;         /* numbers in tables and rows */
  --dc-num-lg: 15px;      /* numbers on cards (Sloan cards, user 2026-10-24 "bigger across the board") */
  --dc-label: 12px;       /* row labels */
  --dc-small: 11px;       /* juice, times, ROI, notes */
  --dc-head: 10px;        /* column headers (uppercase) */
  --dc-radius: 6px;
  --dc-radius-lg: 10px;
  --dc-gap-1: 4px; --dc-gap-2: 8px; --dc-gap-3: 12px; --dc-gap-4: 16px;
  --dc-gutter: 16px;      /* page side gutter, phone width included */
  --dc-hit: 28px;         /* icon buttons */

  /* colours: light */
  --dc-page: #fafafa;
  --dc-surface: #ffffff;
  --dc-subtle: #f4f4f5;      /* hover, chips, inset panels */
  --dc-line: #e4e4e7;        /* hairline borders */
  --dc-line-soft: #f0f0f2;   /* table row separators */
  --dc-line-strong: #d4d4d8;
  --dc-fg: #18181b;
  --dc-fg-2: #27272a;
  --dc-muted: #52525b;
  --dc-faint: #71717a;       /* the floor for small grey text on white */
  --dc-accent: #2563eb;      /* links, selection, focus, "on" controls */
  --dc-accent-soft: #eff6ff;
  --dc-model: #3a68ad;       /* model numbers (Sloan Classic, "ala 199") */
  --dc-pos: #15803d;         /* wins, +P&L, overs edges */
  --dc-pos-soft: #f0fdf4;
  --dc-neg: #b91c1c;         /* losses, -P&L, unders edges */
  --dc-neg-soft: #fef2f2;
  --dc-warn: #b45309;
  --dc-warn-soft: #fffbeb;
  --dc-purple: #7e22ce;      /* swaps / flips (Sloan fhbo) */
  --dc-purple-soft: #faf5ff;
  --dc-hot: #bbf7d0;         /* the highlight box (a rec > 5): light green, both themes */
  --dc-hot-ring: #4ade80;
  --dc-hot-fg: #052e16;
  --dc-flash: #fde68a;       /* a number that just changed */
  --dc-live: #dc2626;        /* live / in-play dot */
  --dc-up-bg: #dcfce7; --dc-up-bd: #86efac; --dc-up-tx: #166534;   /* line moved up (Live Odds) */
  --dc-dn-bg: #fee2e2; --dc-dn-bd: #fca5a5; --dc-dn-tx: #991b1b;   /* line moved down */
  --dc-shadow: 0 10px 30px rgba(0, 0, 0, .12);
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --dc-page: #001029;
  --dc-surface: #020821;
  --dc-subtle: #03183d;
  --dc-line: #002662;
  --dc-line-soft: #021c48;
  --dc-line-strong: #0a3170;
  --dc-fg: #ededed;
  --dc-fg-2: #d5dbe5;
  --dc-muted: #94a3b8;
  --dc-faint: #5b6b86;
  --dc-accent: #22a2ff;
  --dc-accent-soft: #002155;
  --dc-model: #8db8ff;
  --dc-pos: #4ade80;
  --dc-pos-soft: #1d3b2a;
  --dc-neg: #fb7185;
  --dc-neg-soft: #3d1d25;
  --dc-warn: #fbbf24;
  --dc-warn-soft: #3a2a08;
  --dc-purple: #c084fc;
  --dc-purple-soft: #2a1645;
  --dc-hot: #bbf7d0;
  --dc-hot-ring: #4ade80;
  --dc-hot-fg: #052e16;
  --dc-flash: #1e4a8a;
  --dc-live: #ef4444;
  --dc-up-bg: #1d3b2a; --dc-up-bd: #4c8a5c; --dc-up-tx: #b9f5c8;
  --dc-dn-bg: #3d1d25; --dc-dn-bd: #9a4a57; --dc-dn-tx: #ffc4cc;
  --dc-shadow: 0 10px 30px rgba(0, 0, 0, .45);
}

/* the font the page uses: the app's default, or the user's choice (dc.js keeps data-dc-font current) */
:root[data-dc-font="inter"] { --dc-font: var(--dc-font-inter); }
:root[data-dc-font="plex"] { --dc-font: var(--dc-font-plex); }
:root[data-dc-font="system"] { --dc-font: var(--dc-font-system); }