/* Monas stil (MONAS-STIL.md, verzija 1): paleta, fontovi i oblik.
   Boje postoje samo kao varijable; aplikacijske varijable i komponente su u styles.css.
   Tamna tema prati uređaj, a data-theme="light|dark" na <html> je nadjačava. */
:root {
  color-scheme: light;
  --bg: #f6f1e7;
  --bg-deep: #ede4d2;
  --card: #fffdf8;
  --ink: #1c2b2e;
  --heading: #12313f;
  --muted: #657575;
  --line: rgba(18, 49, 63, 0.12);
  --line-strong: rgba(18, 49, 63, 0.32);
  --hair: rgba(18, 49, 63, 0.07);
  --teal: #0f766e;
  --teal-soft: rgba(15, 118, 110, 0.12);
  --gold: #9a7415;
  --gold-soft: rgba(154, 116, 21, 0.14);
  --terra: #b04a3f;
  --terra-soft: rgba(176, 74, 63, 0.12);
  --wine: #7a2436;
  --wine-soft: rgba(122, 36, 54, 0.1);
  --pos: #1d7a53;
  --neg: #b04a3f;
  --track: rgba(18, 49, 63, 0.08);
  --on-accent: #fffdf8;
  --shadow: 0 10px 30px -14px rgba(18, 49, 63, 0.22);
  --radius: 18px;

  --font-heading: "Fraunces", Georgia, serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-weight-heading: 600;
  --leading-body: 1.55;
  --focus-ring: 3px;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #0e1a1e;
    --bg-deep: #152529;
    --card: #152529;
    --ink: #dde7e5;
    --heading: #f0ece1;
    --muted: #93a5a3;
    --line: rgba(255, 255, 255, 0.12);
    --line-strong: rgba(255, 255, 255, 0.3);
    --hair: rgba(255, 255, 255, 0.07);
    --teal: #2dd4bf;
    --teal-soft: rgba(45, 212, 191, 0.14);
    --gold: #e2b843;
    --gold-soft: rgba(226, 184, 67, 0.14);
    --terra: #ef8275;
    --terra-soft: rgba(239, 130, 117, 0.14);
    --wine: #e79ab0;
    --wine-soft: rgba(231, 154, 176, 0.12);
    --pos: #4ade80;
    --neg: #ef8275;
    --track: rgba(255, 255, 255, 0.09);
    --on-accent: #0e1a1e;
    --shadow: 0 10px 30px -14px rgba(0, 0, 0, 0.6);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0e1a1e;
  --bg-deep: #152529;
  --card: #152529;
  --ink: #dde7e5;
  --heading: #f0ece1;
  --muted: #93a5a3;
  --line: rgba(255, 255, 255, 0.12);
  --line-strong: rgba(255, 255, 255, 0.3);
  --hair: rgba(255, 255, 255, 0.07);
  --teal: #2dd4bf;
  --teal-soft: rgba(45, 212, 191, 0.14);
  --gold: #e2b843;
  --gold-soft: rgba(226, 184, 67, 0.14);
  --terra: #ef8275;
  --terra-soft: rgba(239, 130, 117, 0.14);
  --wine: #e79ab0;
  --wine-soft: rgba(231, 154, 176, 0.12);
  --pos: #4ade80;
  --neg: #ef8275;
  --track: rgba(255, 255, 255, 0.09);
  --on-accent: #0e1a1e;
  --shadow: 0 10px 30px -14px rgba(0, 0, 0, 0.6);
}