/* ── Desi Plot shared design system ──
   Used by both plot/index.php and plot/play.php. Bright, warm, rounded
   "premium mobile game" palette — intentionally distinct from the main
   site's dark editorial theme (css/style.css), which this sub-brand does
   not inherit colors/fonts from. */

@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@500;600;700;800&family=Rubik:wght@400;500;600;700;800&display=swap');

:root{
  /* base */
  --dp-cream:    #FFF6E9;
  --dp-cream-2:  #FFEFD6;
  --dp-ink:      #2B1B12;
  --dp-ink-60:   rgba(43,27,18,.62);
  --dp-ink-30:   rgba(43,27,18,.3);

  /* green — flag / board felt */
  --dp-green:    #1E9E62;
  --dp-green-l:  #3DD68C;
  --dp-green-d:  #0E6B3F;

  /* gold / saffron — mosque domes, rupee notes */
  --dp-gold:     #F2B84B;
  --dp-gold-l:   #FFD98A;
  --dp-gold-d:   #C98A1F;

  /* terracotta — sandstone, Lahore Fort */
  --dp-terra:    #D9622B;
  --dp-terra-d:  #A8441A;

  /* dusk purple — sunset sky accent */
  --dp-dusk:     #5B4B8A;
  --dp-dusk-l:   #8B76C9;

  /* rose — truck-art accent, used sparingly */
  --dp-rose:     #E85C8A;

  /* status colors (shared across toasts, event amounts) */
  --dp-good:     #1E9E62;
  --dp-bad:      #D9462B;

  /* radius scale */
  --dp-r-sm:   10px;
  --dp-r-md:   16px;
  --dp-r-lg:   24px;
  --dp-r-pill: 999px;

  /* warm-tinted shadows/glow — never pure black */
  --dp-shadow-sm: 0 4px 14px rgba(120,66,20,.18);
  --dp-shadow-md: 0 10px 28px rgba(120,66,20,.22);
  --dp-shadow-lg: 0 24px 60px rgba(90,50,15,.30);
  --dp-glow-turn: 0 0 0 3px rgba(242,184,75,.45), 0 0 18px rgba(242,184,75,.55);
  --dp-bevel: inset 0 1px 0 rgba(255,255,255,.5);

  --dp-display: 'Baloo 2', Georgia, serif;
  --dp-ui:      'Rubik', system-ui, sans-serif;
}

/* ── Dark mode ──
   Toggled via [data-dark="true"] on <html> (see toggleDark() in play.php).
   Accent colors (green/gold/terra/dusk/rose/good/bad) stay identical in
   both modes — they're already vivid enough to read against either base,
   and GRP's saturated group colors on the board are untouched too (see
   PAL_DARK in play.php for the board canvas's own dark palette). Only the
   base/ink/shadow tokens — which everything else is built from — change. */
[data-dark="true"]{
  --dp-cream:    #1C1510;
  --dp-cream-2:  #251D15;
  --dp-ink:      #F3E8D8;
  --dp-ink-60:   rgba(243,232,216,.65);
  --dp-ink-30:   rgba(243,232,216,.3);

  --dp-shadow-sm: 0 4px 14px rgba(0,0,0,.45);
  --dp-shadow-md: 0 10px 28px rgba(0,0,0,.5);
  --dp-shadow-lg: 0 24px 60px rgba(0,0,0,.6);
  --dp-glow-turn: 0 0 0 3px rgba(242,184,75,.55), 0 0 20px rgba(242,184,75,.65);
  --dp-bevel: inset 0 1px 0 rgba(255,255,255,.08);
}