/* ------------------------------------------------------------------
   Sārthi — shared design system.
   One ground, one serif, one sans, one accent. No gradients, no glass.
   Loaded by every page before its own <style> block.
   Legacy token names are aliased at the bottom so existing page CSS
   keeps working while pointing at the new flat palette.
   ------------------------------------------------------------------ */

:root{
  /* ground + ink */
  --bg:#FBFBFA;
  --surface:#FFFFFF;
  --sunk:#F2F3F1;
  --ink:#182226;
  --muted:#6A7A80;
  --faint:#74848A;
  --line:#E4E7E5;
  --hair:#EDEFEC;

  /* the single accent */
  --accent:#0E6E8A;
  --accent-bg:#E7F1F4;
  --accent-ink:#FFFFFF;
  --ring:rgba(14,110,138,.16);

  /* type */
  --serif:Spectral,Georgia,"Times New Roman",serif;
  --sans:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --deva:"Nirmala UI","Noto Serif Devanagari","Noto Sans Devanagari","Kohinoor Devanagari","Devanagari MT",serif;

  /* depth — used sparingly, on lifted things only */
  --shadow:0 1px 2px rgba(20,40,50,.05);
  --shadow-soft:none;

  color-scheme:light;
}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0C1013;
    --surface:#131A1E;
    --sunk:#101619;
    --ink:#E2E8E9;
    --muted:#8D9CA2;
    --faint:#718187;
    --line:#212A2E;
    --hair:#1A2226;
    --accent:#63BFD6;
    --accent-bg:#0F2830;
    --accent-ink:#07171C;
    --ring:rgba(99,191,214,.20);
    --shadow:0 1px 2px rgba(0,0,0,.3);
    color-scheme:dark;
  }
}

:root[data-theme="dark"]{
  --bg:#0C1013;
  --surface:#131A1E;
  --sunk:#101619;
  --ink:#E2E8E9;
  --muted:#8D9CA2;
  --faint:#718187;
  --line:#212A2E;
  --hair:#1A2226;
  --accent:#63BFD6;
  --accent-bg:#0F2830;
  --accent-ink:#07171C;
  --ring:rgba(99,191,214,.20);
  --shadow:0 1px 2px rgba(0,0,0,.3);
  color-scheme:dark;
}

/* ---- legacy aliases: old page CSS keeps working, flat palette applies ---- */
:root{
  --page:var(--bg);
  --panel:var(--surface);
  --card:var(--surface);
  --field:var(--surface);
  --btn:transparent;
  --chip-bg:var(--sunk);
  --peacock:var(--accent);
  --indigo:var(--accent);
  --teal:var(--accent);
  --gold:var(--accent);
  --wm-opacity:0;
}

/* ---- base ---- */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
/* fields draw their own ring (border + glow); a second outline reads as a bug */
input:focus-visible,textarea:focus-visible,select:focus-visible{outline:none}

/* the peacock eye is drawn in ink-dark indigo; lift it on a dark ground */
:root[data-theme="dark"] .mark{filter:brightness(1.8) saturate(1.1)}

/* the watermark and the frosted panels are gone for good */
.watermark{display:none !important}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .mark{filter:brightness(1.8) saturate(1.1)}
}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}
