/* ═══════════════════════════════════════════════════════════
   DOSSIER UI TUNING
   ───────────────────────────────────────────────────────────
   This is YOUR file. Change any value below, save, push —
   the site updates. Nothing else to touch.

   Sizes are in px (bigger number = bigger).
   Colors are #hex codes — try any color picker app.
   Delete a line to go back to the default.
   ═══════════════════════════════════════════════════════════ */

:root {

  /* ── HEADER: the big DOSSIER name on the front page ── */
  --t-nameplate-size: clamp(52px, 13vw, 108px);  /* title size */
  --t-nameplate-pad: 26px;                        /* space above/below title */

  /* ── ARTICLE TOP BAR: date row with the X button ── */
  --t-topbar-pad: 10px;       /* bar height */
  --t-closebtn-size: 40px;    /* X button size */

  /* ── TABLE OF CONTENTS dropdown (under the sticky TOC bar) ── */
  --t-toc-sec-size: 12px;     /* section title text size */
  --t-toc-sub-size: 11.5px;   /* sub-section text size */

  /* ── LIVE FEED: the scrolling ticker at the very top ── */
  --t-ticker-speed: 28s;  /* scroll speed — bigger number = slower */

  /* ── BOARD: the news cards ── */
  --t-card-gap: 28px;         /* space between cards on mobile */
  --t-card-gap-desktop: 24px; /* space between cards on desktop */
  --t-card-pad: 28px;         /* space inside each card */
  --t-card-title: clamp(24px, 4.5vw, 34px);  /* card headline size */

  /* ── READING page: the sticky top bar (date + X) and the TOC bar ── */
  --t-read-blur: 12px;  /* frosted-glass blur behind them — 0px turns it off */

  /* ── ARTICLE page ── */
  --t-article-width: 680px;   /* how wide the article column is */
  --t-article-title: clamp(32px, 8.5vw, 56px);  /* article headline size */
  --t-body-size: 18px;        /* article text size */

}

/* ── COLORS: one block per theme ──
   Every color the theme owns lives here, with a plain-English note.
   Delete any line to fall back to the built-in default.
   --paper = page background, --paper-2 = cards/secondary surfaces,
   --ink = main text, --ink-soft/--ink-faint = dimmer text,
   --line/--line-strong = borders, --accent = lime highlight,
   --accent-strong = readable lime for lines on paper,
   --card = article cards, --chip-* = small labels, --ticker-* = top strip. */

[data-theme="light"] {
  --accent: #e5ff00;   /* lime highlight (on dark) */
  --accent-strong: #6f7f00;   /* readable version for lines on paper */
  --paper: #f5f2eb;    /* page background */
  --paper-2: #faf6ee;  /* cards, secondary surfaces */
  --ink: #121212;      /* text */
  --ink-soft: rgb(18 18 18 / .62);   /* dimmer text */
  --ink-faint: rgb(18 18 18 / .38);  /* faintest text */
  --line: rgb(18 18 18 / .16);       /* thin borders */
  --line-strong: #121212;            /* fat borders */
  --card: #fdfaf3;     /* article cards */
  --chip-bg: #121212;  /* small label background */
  --chip-ink: #faf9f7; /* small label text */
  --ticker-bg: #121212;  /* scrolling top strip background */
  --ticker-ink: #faf9f7; /* scrolling top strip text */
  --danger: #dc2626;   /* red for warnings */
  --hero-fade: #f5f2eb;    /* hero scrim: solid end of the fade */
  --hero-ink: #121212;      /* hero headline */
  --hero-soft: rgb(18 18 18 / .72);   /* hero summary */
  --hero-faint: rgb(18 18 18 / .48);  /* hero meta */
  --hero-pill-ink: #1a1a1a;  /* featured pill text */
}

[data-theme="dark"] {
  --accent: #e5ff00;
  --accent-strong: #e5ff00;
  --paper: #0f1115;
  --paper-2: #151821;
  --ink: #e8e6e1;
  --ink-soft: rgb(232 230 225 / .66);
  --ink-faint: rgb(232 230 225 / .40);
  --line: rgb(232 230 225 / .16);
  --line-strong: #4b5263;
  --card: #151821;
  --chip-bg: #e8e6e1;
  --chip-ink: #0f1115;
  --ticker-bg: #ffffff;
  --ticker-ink: #0f1115;
  --danger: #ff5a4d;
  --hero-fade: #000000;
  --hero-ink: #ffffff;
  --hero-soft: rgb(255 255 255 / .84);
  --hero-faint: rgb(255 255 255 / .70);
  --hero-pill-ink: #101216;
}

[data-theme="brutalism"] {
  --accent: #e5ff00;
  --accent-strong: #6f7f00;
  --paper: #ffffff;
  --paper-2: #ffffff;
  --ink: #000000;
  --ink-soft: #000000;
  --ink-faint: rgb(0 0 0 / .55);
  --line: #000000;
  --line-strong: #000000;
  --card: #ffffff;
  --chip-bg: #000000;
  --chip-ink: #ffffff;
  --ticker-bg: #000000;
  --ticker-ink: #ffffff;
  --danger: #ff0000;
  --hero-fade: #ffffff;
  --hero-ink: #000000;
  --hero-soft: #000000;
  --hero-faint: rgb(0 0 0 / .62);
  --hero-pill-ink: #000000;
}

[data-theme="brutalism-night"] {
  --accent: #e5ff00;
  --accent-strong: #e5ff00;
  --paper: #131316;
  --paper-2: #131316;
  --ink: #f4f2ec;
  --ink-soft: #f4f2ec;
  --ink-faint: rgb(244 242 236 / .55);
  --line: #f4f2ec;
  --line-strong: #f4f2ec;
  --card: #1a1a1f;
  --chip-bg: #e5ff00;
  --chip-ink: #131316;
  --ticker-bg: #e5ff00;
  --ticker-ink: #131316;
  --danger: #ff5a4d;
  --hero-fade: #000000;
  --hero-ink: #f4f2ec;
  --hero-soft: rgb(244 242 236 / .84);
  --hero-faint: rgb(244 242 236 / .70);
  --hero-pill-ink: #101216;
}

[data-theme="amoled"] {
  --accent: #6a9bff;   /* cosmos blue — the AMOLED accent, easy on eyes */
  --accent-strong: #6a9bff;   /* readable version for lines on paper */
  --paper: #000000;    /* pure black: pixels off, less charge */
  --paper-2: #000000;
  --ink: #e8e6e1;      /* off-white text: no eye strain */
  --ink-soft: rgb(232 230 225 / .66);
  --ink-faint: rgb(232 230 225 / .40);
  --line: #1e1e22;     /* near-black dividers */
  --line-strong: #e8e6e1;
  --card: #000000;
  --chip-bg: #e8e6e1;
  --chip-ink: #000000;
  --ticker-bg: #000000;
  --ticker-ink: #6a9bff;
  --danger: #ff7a6b;
  --hero-fade: #000000;
  --hero-ink: #ffffff;
  --hero-soft: rgb(255 255 255 / .84);
  --hero-faint: rgb(255 255 255 / .70);
  --hero-pill-ink: #06101f;
}

/* ── ACCENTS: the theme sheet's color picks. ──
   To add your own: 1) add its key to --accent-keys, 2) add a
   [data-accent="key"] block below with the two colors and a name.
   To remove one: delete its key and its block. No JS changes needed. */
:root { --accent-keys: lime, cosmos, ember, tangerine, violet; }
[data-accent="lime"]      { --accent: #e5ff00; --accent-strong: #6f7f00; --accent-name: "Lime"; }
[data-accent="cosmos"]    { --accent: #6a9bff; --accent-strong: #4a7de0; --accent-name: "Cosmos"; }
[data-accent="ember"]     { --accent: #ff6b4a; --accent-strong: #c23a1c; --accent-name: "Ember"; }
[data-accent="tangerine"] { --accent: #ffa01f; --accent-strong: #b25e00; --accent-name: "Tangerine"; }
[data-accent="violet"]    { --accent: #a78bfa; --accent-strong: #6440d8; --accent-name: "Violet"; }