/* جدول پخش — design tokens (palette «پاپ‌کورن»).
   Light is the default. Dark follows the OS, and data-theme on <html> overrides both ways.
   Rule: red #EE3B2B is for fills, the logo and large text; small red text uses --jp-red-text. */
:root {
  --jp-paper: #FFFFFF;        /* page background */
  --jp-canvas: #F6F5F4;       /* quiet blocks, poster placeholders */
  --jp-ink: #1B1B1F;          /* text */
  --jp-ink-2: #45454D;        /* secondary text */
  --jp-muted: #6B6B72;        /* meta, captions */
  --jp-line: #ECEAE9;         /* hairlines */
  --jp-red: #EE3B2B;          /* brand: logo, primary buttons, «پخش» */
  --jp-red-press: #D63020;
  --jp-red-text: #CC2A1C;     /* red text under 24px (AA on white) */
  --jp-red-soft: #FFEDEA;
  --jp-on-red: #FFFFFF;
  /* UI fills under small white text (buttons, badges): a deeper red so white text passes AA (4.7:1).
     The logo, posts and display text keep --jp-red. */
  --jp-red-fill: #D93222;
  --jp-red-fill-press: #BF2A1C;
  --jp-butter: #FFD449;       /* small highlights only: «تازه», counts */
  --jp-butter-soft: #FFF5D1;
  --jp-on-butter: #1B1B1F;

  --jp-font: "Vazirmatn", Tahoma, "Segoe UI", sans-serif;
  --jp-fs-xs: 12px; --jp-fs-sm: 14px; --jp-fs-md: 16px; --jp-fs-lg: 18px;
  --jp-fs-xl: 22px; --jp-fs-2xl: 28px; --jp-fs-3xl: 36px; --jp-fs-4xl: 48px;
  --jp-lh: 1.85;

  --jp-s1: 4px; --jp-s2: 8px; --jp-s3: 12px; --jp-s4: 16px;
  --jp-s5: 24px; --jp-s6: 32px; --jp-s7: 48px; --jp-s8: 64px;

  --jp-r-sm: 8px; --jp-r-md: 12px; --jp-r-lg: 16px; --jp-r-pill: 999px;
  /* the logo bubble: round corners with one sharp corner where the tail is */
  --jp-r-bubble: 14px 14px 3px 14px;

  --jp-shadow: 0 1px 2px rgb(27 27 31 / .05), 0 6px 20px rgb(27 27 31 / .06);
  --jp-maxw: 1120px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --jp-paper: #121214; --jp-canvas: #1B1B1F; --jp-ink: #F3F3F5; --jp-ink-2: #C9C9D1;
    --jp-muted: #9A9AA5; --jp-line: #2A2A30;
    --jp-red: #FF4A3A; --jp-red-press: #FF6352; --jp-red-text: #FF7466; --jp-red-soft: #3A1714; --jp-on-red: #FFFFFF;
    --jp-butter: #FFD449; --jp-butter-soft: #3A3010; --jp-on-butter: #1B1B1F;
    --jp-shadow: 0 1px 2px rgb(0 0 0 / .4), 0 6px 20px rgb(0 0 0 / .35);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --jp-paper: #121214; --jp-canvas: #1B1B1F; --jp-ink: #F3F3F5; --jp-ink-2: #C9C9D1;
  --jp-muted: #9A9AA5; --jp-line: #2A2A30;
  --jp-red: #FF4A3A; --jp-red-press: #FF6352; --jp-red-text: #FF7466; --jp-red-soft: #3A1714; --jp-on-red: #FFFFFF;
  --jp-butter: #FFD449; --jp-butter-soft: #3A3010; --jp-on-butter: #1B1B1F;
  --jp-shadow: 0 1px 2px rgb(0 0 0 / .4), 0 6px 20px rgb(0 0 0 / .35);
  color-scheme: dark;
}