/* SilliestDuck — tokens. Import once, globally. */
/* Fonts (Nunito + JetBrains Mono) are loaded from index.html so the request can be preconnected. */
:root{
  /* surfaces */
  --sd-cream:#F6F2E7;--sd-paper:#FFFFFF;--sd-paper-warm:#FFFCF4;
  --sd-night:#1F1B30;--sd-night-deep:#171327;--sd-night-card:#2A2440;
  /* ink */
  --sd-ink:#2A2440;--sd-ink-2:#6F6890;--sd-ink-dark:#F4EFE4;--sd-ink-dark-2:#A89BD1;
  /* accents (each has a -deep for hard shadows) */
  --sd-yolk:#FFC93C;--sd-yolk-deep:#F2A91D;
  --sd-beak:#FF8A3C;--sd-beak-deep:#E36A1F;
  --sd-pond:#7BC4C4;--sd-pond-deep:#4FA3A3;
  --sd-berry:#E86A92;--sd-berry-deep:#C84572;
  --sd-sky:#B5D8FF;--sd-sky-deep:#7AAEE8;
  --sd-rule:#EAE3D2;--sd-rule-dark:rgba(244,239,228,.14);
  /* off tiles read as the rule colour: 8% ink was too faint on the warm board plate */
  --sd-tile-off:var(--sd-rule);
  /* type */
  --sd-font-display:"Nunito",system-ui,sans-serif;
  --sd-font-body:"Nunito",system-ui,sans-serif;
  --sd-font-mono:"JetBrains Mono",ui-monospace,monospace;
  /* radii */
  --sd-r-pill:999px;--sd-r-card:22px;--sd-r-inset:14px;
  /* tiles: radius scales with the cell (≈10–12px on the game board); hard bottom edge on lit tiles */
  --sd-r-tile:22%;--sd-tile-edge:4px;
  /* borders + hard shadows (no blur, ever) */
  --sd-border-w:2px;
  --sd-shadow-btn:0 3px 0 rgba(0,0,0,.15);--sd-shadow-ghost:0 3px 0 rgba(0,0,0,.10);
  --sd-shadow-card:0 6px 0 rgba(42,36,64,.15);--sd-shadow-card-sm:0 4px 0 rgba(42,36,64,.15);
  /* modal backdrop */
  --sd-overlay:rgba(42,36,64,.55);

  /* SEMANTIC — use these in components. Themes swap them. */
  --sd-bg:var(--sd-cream);--sd-surface:var(--sd-paper);--sd-surface-2:var(--sd-paper-warm);
  --sd-fg:var(--sd-ink);--sd-fg-2:var(--sd-ink-2);--sd-line:var(--sd-ink);
  /* per-game accent — set on <html> or <body> via .sd-game--* */
  --sd-accent:var(--sd-yolk);--sd-accent-deep:var(--sd-yolk-deep);--sd-on-accent:var(--sd-ink);
  /* secondary accent — pieces, tutorial/learning, completion checks, toggle on. Never with the accent on one element. */
  --sd-accent-2:var(--sd-pond);--sd-accent-2-deep:var(--sd-pond-deep);--sd-on-accent-2:var(--sd-ink);
}
[data-theme="dark"]{
  --sd-bg:var(--sd-night);--sd-surface:var(--sd-night-card);--sd-surface-2:var(--sd-night-deep);
  --sd-fg:var(--sd-ink-dark);--sd-fg-2:var(--sd-ink-dark-2);--sd-line:var(--sd-ink-dark);
  --sd-tile-off:var(--sd-rule-dark);--sd-overlay:rgba(23,19,39,.7);
  --sd-shadow-card:0 6px 0 rgba(0,0,0,.35);--sd-shadow-card-sm:0 4px 0 rgba(0,0,0,.35);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --sd-bg:var(--sd-night);--sd-surface:var(--sd-night-card);--sd-surface-2:var(--sd-night-deep);
  --sd-fg:var(--sd-ink-dark);--sd-fg-2:var(--sd-ink-dark-2);--sd-line:var(--sd-ink-dark);
  --sd-tile-off:var(--sd-rule-dark);--sd-overlay:rgba(23,19,39,.7);
  --sd-shadow-card:0 6px 0 rgba(0,0,0,.35);--sd-shadow-card-sm:0 4px 0 rgba(0,0,0,.35);
}}
/* games */
.sd-game--diminoes{--sd-accent:var(--sd-yolk);--sd-accent-deep:var(--sd-yolk-deep);--sd-on-accent:var(--sd-ink);--sd-accent-2:var(--sd-pond);--sd-accent-2-deep:var(--sd-pond-deep);--sd-on-accent-2:var(--sd-ink);}
.sd-game--pentanagram{--sd-accent:var(--sd-berry);--sd-accent-deep:var(--sd-berry-deep);--sd-on-accent:#fff;--sd-accent-2:var(--sd-sky);--sd-accent-2-deep:var(--sd-sky-deep);--sd-on-accent-2:var(--sd-ink);}
.sd-game--home{--sd-accent:var(--sd-yolk);--sd-accent-deep:var(--sd-yolk-deep);--sd-on-accent:var(--sd-ink);--sd-accent-2:var(--sd-pond);--sd-accent-2-deep:var(--sd-pond-deep);--sd-on-accent-2:var(--sd-ink);}
/* duck skins */
.sd-duck--yolk{--duck-body:#F8C746;--duck-shade:#E49F2C;--duck-hi:#FFE393;--duck-stroke:#A06D23;--duck-beak:#E98D37;--duck-beak-shade:#9E3B24;--duck-beak-hi:#FFCE87;}
.sd-duck--berry{--duck-body:#E86A92;--duck-shade:#C84572;--duck-hi:#F7AFC6;--duck-stroke:#8A2A4E;--duck-beak:#FFC93C;--duck-beak-shade:#B7791A;--duck-beak-hi:#FFE8A8;}
.sd-duck--pond{--duck-body:#7BC4C4;--duck-shade:#4FA3A3;--duck-hi:#BFE6E6;--duck-stroke:#2E6F70;--duck-beak:#E98D37;--duck-beak-shade:#9E3B24;--duck-beak-hi:#FFCE87;}
.sd-duck--sky{--duck-body:#B5D8FF;--duck-shade:#7AAEE8;--duck-hi:#E3F0FF;--duck-stroke:#3F6FA8;--duck-beak:#E98D37;--duck-beak-shade:#9E3B24;--duck-beak-hi:#FFCE87;}
.sd-game--pentanagram .sd-duck-host{--duck-body:#E86A92;--duck-shade:#C84572;--duck-hi:#F7AFC6;--duck-stroke:#8A2A4E;--duck-beak:#FFC93C;--duck-beak-shade:#B7791A;--duck-beak-hi:#FFE8A8;}