/* color-scheme default */
:root { color-scheme: light dark; }
/* Declared on :root AND on the board root ([data-state]) so the var() fallbacks re-resolve where the
   host's variables are in scope. Set color-scheme on the page root from the host theme.
   dz-chess design tokens. Host variables first, dz fallbacks second (design/README rule 3).
   Fallbacks are "club-room warm": paper, ink, a brick accent. light-dark() follows color-scheme,
   which the board sets from the host theme (fallback: prefers-color-scheme). */
:root, [data-host], [data-state] {

  /* Surfaces: the page stays transparent */
  --dz-bg:        var(--color-background-primary, transparent);
  --dz-surface:   var(--color-background-secondary, light-dark(#f6f2e9, #24211d));
  --dz-surface-2: var(--color-background-tertiary, light-dark(#ece6d8, #2f2b25));
  --dz-paper:      light-dark(#fbf7ee, #2a2620);   /* scoresheet, banners, review: always ours */
  --dz-paper-rule: light-dark(#e2d8c3, #433c31);

  /* Ink */
  --dz-text:   var(--color-text-primary, light-dark(#1f1c17, #ede8de));
  --dz-muted:  var(--color-text-secondary, light-dark(#5e584c, #aca596));
  --dz-border: var(--color-border-primary, light-dark(#d6cebd, #453f35));

  /* Accent follows the host where it has one */
  --dz-accent:    var(--color-ring-primary, light-dark(#8e4420, #e49a6b));
  --dz-on-accent: light-dark(#ffffff, #1f1c17);
  --dz-focus:     var(--color-ring-primary, light-dark(#8e4420, #e49a6b));

  /* Feedback: ours, so AA holds whatever the host sends */
  --dz-danger:     light-dark(#a3261c, #ff9a8f);
  --dz-danger-bg:  light-dark(#fbe8e4, #3b211c);
  --dz-on-danger:  light-dark(#ffffff, #1f1c17);
  --dz-warn-bg:    light-dark(#fbf0d6, #352d1a);
  --dz-warn-line:  light-dark(#b8862a, #c9a14e);

  /* Type: host sans; our serif for the scoresheet and banners (system fonts, no downloads) */
  --dz-font:       var(--font-sans, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif);
  --dz-font-serif: "Iowan Old Style", "Charter", "Palatino Linotype", Palatino, Georgia, serif;
  --dz-font-mono:  var(--font-mono, ui-monospace, "SF Mono", Menlo, Consolas, monospace);
  --dz-text-xs: 11px;   /* version stamp, coordinates */
  --dz-text-sm: 13px;   /* notes, legend, captured */
  --dz-text-md: 15px;   /* body, buttons, commentary */
  --dz-text-lg: 17px;   /* status line */
  --dz-text-xl: 22px;   /* result banner, setup title (serif) */
  --dz-text-clock: 22px;
  --dz-leading: 1.45;

  /* Space (4 px grid) */
  --dz-space-1: 4px;  --dz-space-2: 8px;  --dz-space-3: 12px;
  --dz-space-4: 16px; --dz-space-5: 24px; --dz-space-6: 32px;
  --dz-tap: 44px;     /* minimum touch target */
  --dz-gutter: 14px;  /* coordinate gutter */

  /* Radii */
  --dz-radius-sm: 4px;
  --dz-radius-md: var(--border-radius-md, 8px);
  --dz-radius-lg: var(--border-radius-lg, 12px);

  /* Motion (reduced-motion: all 0ms, no thinking pulse) */
  --dz-ease: cubic-bezier(.2, .7, .2, 1);
  --dz-dur-fast: 120ms;   /* hover, toggles */
  --dz-dur-move: 180ms;   /* a piece sliding one move */
  --dz-dur-think: 1400ms; /* thinking dots cycle */

  --dz-shadow-board: 0 0 0 1px light-dark(rgba(60,40,20,.25), rgba(0,0,0,.6)), 0 2px 6px light-dark(rgba(60,40,20,.12), rgba(0,0,0,.4));
  --dz-shadow-panel: 0 8px 28px light-dark(rgba(40,28,14,.18), rgba(0,0,0,.55));
}
@media (prefers-reduced-motion: reduce) {
  :root, [data-host], [data-state] { --dz-dur-fast: 0ms; --dz-dur-move: 0ms; --dz-dur-think: 0ms; }
}

/* ── Brand and site ─────────────────────────────────────────────────────────────────────────────
   Added 2026-10-10 for dzchess.app (P-0003 W1): the talking-board mark (D-0023) and Checkme's wordmark
   and type (D-0026 to D-0028). The board's
   tokens above are unchanged. The site has no host, so the fallbacks apply, light or dark from the
   visitor's setting; inside an MCP App view the host's variables still win wherever a token maps to
   one. Fluid sizes use cqi: they follow the page's container (site.css makes .page one), so the
   same markup gets phone sizes in a 360 px box, a host's card or a phone. */
:root, [data-host], [data-state] {

  /* Brand: the mark and the wordmark. Fixed colours, never the host's. */
  --dz-brick:       #8e4420;                          /* the brand colour */
  --dz-brick-deep:  #6f3218;
  --dz-ink:         #1f1c17;
  --dz-cream:       #fbf7ee;                          /* the brand's paper (--dz-paper is the scoresheet) */
  --dz-mark-bubble: light-dark(#8e4420, #ede8de);     /* the speech bubble */
  --dz-mark-square: light-dark(#fbf7ee, #8e4420);     /* its two board squares */
  --dz-word-accent: light-dark(#8e4420, #e49a6b);     /* "me." in the wordmark, "מי." in Hebrew */
  --dz-word-ink:    light-dark(#1f1c17, #ede8de);     /* "check", "צ׳ק" */

  /* Site surfaces, lines and links */
  --dz-page:          var(--color-background-primary, light-dark(#fbf7ee, #1c1a16));
  --dz-border-strong: light-dark(#8a8170, #8f8778);   /* 3:1 or more: outlines of controls */
  --dz-link:          var(--dz-accent);
  --dz-link-hover:    light-dark(#6f3218, #f3c3a5);
  --dz-accent-hover:  light-dark(#6f3218, #f0b48f);
  --dz-brick-soft:    light-dark(#f3e4d9, #3a251b);   /* icon tiles, badges */
  --dz-tip-bg:        light-dark(#eaf1e2, #1f2a1c);
  --dz-tip-line:      light-dark(#a9c08f, #46603a);
  --dz-tip-ink:       light-dark(#4a6b32, #9cc283);   /* tip icon and label: 5:1 or more on --dz-tip-bg */
  --dz-warn-ink:      light-dark(#8a5d0a, #e0b45a);   /* warning icon and label: 5:1 or more on --dz-warn-bg */

  /* Site type: the system stacks, no font files. Headings are the system sans in bold (D-0027). */
  --dz-font-display:   var(--dz-font);
  --dz-weight-display: 800;     /* page titles, the home headline, section titles; Hebrew 700 (below) */
  --dz-text-body:    1.0625rem;   /* 17 px: reading */
  --dz-text-ui:      0.9375rem;   /* 15 px: navigation, buttons, captions */
  --dz-text-fine:    0.8125rem;   /* 13 px: footer, labels */
  --dz-leading-body: 1.6;
  --dz-leading-head: 1.15;
  --dz-measure:      68ch;        /* long text */
  --dz-display-1: clamp(2.25rem, 1.55rem + 3cqi, 3.75rem);     /* 36 → 60 px: the home headline */
  --dz-display-2: clamp(1.875rem, 1.5rem + 1.6cqi, 2.75rem);   /* 30 → 44 px: page titles */
  --dz-heading-2: clamp(1.4375rem, 1.3rem + .6cqi, 1.875rem);  /* 23 → 30 px */
  --dz-heading-3: 1.1875rem;                                   /* 19 px */

  /* Site space and shape */
  --dz-space-7: 48px; --dz-space-8: 64px; --dz-space-9: 96px;
  --dz-wrap:      72rem;                      /* 1152 px content width */
  --dz-gutter-x:  clamp(16px, 4cqi, 40px);    /* side padding */
  --dz-section-y: clamp(48px, 7cqi, 96px);    /* between home sections */
  --dz-radius-xl: 16px;
  --dz-shadow-card: 0 1px 2px light-dark(rgba(40,28,14,.06), rgba(0,0,0,.35)), 0 6px 24px light-dark(rgba(40,28,14,.07), rgba(0,0,0,.3));

  /* Chart series, for the admin dashboard. Assign in this order and never cycle; text stays in the
     text tokens. Validated with the dataviz method against --dz-page and --dz-surface in both modes:
     OKLCH band and chroma pass; worst adjacent CVD ΔE 13.6 light / 12.0 dark (target 8), normal-vision
     ΔE 19.2 / 17.6 (floor 15); every colour 3:1 or more on both surfaces (AA for graphics).
     Scatter, maps and small multiples (all pairs touch): two series at most, then fold or facet. */
  --dz-series-1: light-dark(#a73b15, #cb6443);   /* brick */
  --dz-series-2: light-dark(#2a61b1, #5286d3);   /* blue */
  --dz-series-3: light-dark(#47872d, #65a64d);   /* green */
  --dz-series-4: light-dark(#7241a0, #9468c2);   /* violet */
  --dz-series-5: light-dark(#a77600, #b8892d);   /* amber */
  --dz-series-6: light-dark(#b14576, #d36a96);   /* rose */
}
/* Hebrew display headings: bold rather than extra bold, which crowds Hebrew letters. */
:lang(he) { --dz-weight-display: 700; }