/* ─────────────────────────────────────────────────────────────────────
 * Theme · sunset-zine
 *   Indie risograph zine. Warm peach paper, riso-magenta accent,
 *   Fraunces serif (with playful curves), DASHED rules (cut-and-paste
 *   feel), springy motion. Hero numbers are oversized italic Fraunces.
 *
 *   character knobs:
 *     • hero numbers   — italic Fraunces, very tight tracking
 *     • rule           — 1.5px DASHED (zine cut line)
 *     • card           — 12px radius (slight softening)
 *     • surface        — coarser peach paper grain (riso noise)
 *     • motion         — springy with overshoot (playful)
 * ───────────────────────────────────────────────────────────────────── */
:root {
  /* ─── palette ─── */
  --shell:        #f4d4b6;
  --surface:      #fcecd4;
  --surface-2:    #ffe6c8;
  --surface-3:    #f0d4a8;
  --text:         #2a1810;
  --text-2:       #4a2c20;
  --text-mute:    #7a5040;
  --text-faint:   #a07866;
  --rule:         #c89878;
  --accent:       #e91e63;             /* riso magenta */
  --accent-soft:  rgba(233, 30, 99, 0.10);
  --accent-glow:  rgba(233, 30, 99, 0.40);

  /* ─── fonts ─── */
  --font-display-cn: "Noto Serif SC", "Source Han Serif SC", serif;
  --font-display-en: "Fraunces", "Recoleta", "GT Sectra", "Playfair Display", serif;
  --font-body:       "Fraunces", "Source Serif Pro", "Noto Serif SC", serif;
  --font-mono:       "JetBrains Mono", "SF Mono", ui-monospace, monospace;
  --font-features:   "ss01", "ss02", "tnum", "dlig";

  /* ─── motion: springy zine ─── */
  --dur-base:       550ms;
  --dur-slow:       850ms;
  --dur-cinematic:  1300ms;

  /* ─── design identity: zine ─── */
  --r-card:        var(--r-md);       /* slight softening */
  --r-stage:       0;
  --rule-w:        2px;
  --rule-style:    dashed;             /* SIGNATURE — cut-and-paste */
  --hero-num-font:    var(--font-display-en);
  --hero-num-style:   italic;
  --hero-num-weight:  600;
  --hero-num-track:   -0.04em;
  --stage-pad-x:   110px;
  --stage-pad-y:   80px;
  --card-shadow:
    0 1px 0 var(--rule),
    8px 8px 0 var(--accent-soft);     /* offset peach shadow */
  --shadow-stage:
    0 60px 160px rgba(120, 70, 40, 0.30),
    0 0 0 1px rgba(0, 0, 0, 0.04);

  /* ─── decoration: coarse riso paper grain ─── */
  --surface-pattern:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.6' numOctaves='3' seed='12'/><feColorMatrix values='0 0 0 0 0.65 0 0 0 0 0.50 0 0 0 0 0.40 0 0 0 0.20 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  --surface-pattern-size: 200px 200px;
  --surface-pattern-blend: multiply;
  --surface-pattern-opacity: 0.55;
}