/* Tasarım belirteçleri — "Boya Kalemi Sınıfı" */
:root {
  /* boya kalemi paleti */
  --tomato: #ff6b57;
  --sun: #ffc93c;
  --grass: #3dbb7a;
  --sky: #4aa8ff;
  --grape: #8a5cf6;
  --bubble: #ff8cc6;
  --tangerine: #ff9b3d;
  --ocean: #17708a;
  --berry: #c22a62;
  --tomato-ink: #c0392b;   /* açık zeminde okunur kırmızı yazı */
  --grape-deep: #6b3fd9;  /* beyaz yazı için koyu mor */

  /* yüzeyler */
  --ink: #2b2347;
  --ink-soft: #5b5378;
  --ink-faint: #6e6789;
  --paper: #fff7ea;
  --paper-deep: #fbecd3;
  --card: #ffffff;
  --line: #2b2347;
  --dot: rgba(43, 35, 71, 0.09);

  /* kategori renkleri (server/categories.py ile eşleşir) */
  --cat-sun: var(--sun);
  --cat-grape: var(--grape-deep);
  --cat-sky: var(--sky);
  --cat-ocean: var(--ocean);
  --cat-grass: var(--grass);
  --cat-berry: var(--berry);
  --cat-tangerine: var(--tangerine);
  --cat-bubble: var(--bubble);
  --cat-tomato: var(--tomato);
  --cat-ink: #5f587c;

  /* tipografi */
  --font-display: "Baloo 2", ui-rounded, "Arial Rounded MT Bold", system-ui, sans-serif;
  --font-body: "Nunito", ui-rounded, system-ui, -apple-system, sans-serif;
  --text-xs: 0.78rem;
  --text-sm: 0.9rem;
  --text-base: clamp(1rem, 0.96rem + 0.2vw, 1.08rem);
  --text-lg: clamp(1.2rem, 1.1rem + 0.5vw, 1.45rem);
  --text-xl: clamp(1.6rem, 1.3rem + 1.4vw, 2.4rem);
  --text-hero: clamp(2.6rem, 1.6rem + 5vw, 5.4rem);

  /* ritim */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4.5rem;
  --gutter: clamp(1rem, 0.5rem + 2.5vw, 2.5rem);
  --page-max: 1320px;

  /* çıkartma (sticker) yüzeyi */
  --border: 2.5px solid var(--line);
  --radius-sm: 12px;
  --radius: 20px;
  --radius-lg: 30px;
  --shadow: 4px 5px 0 var(--line);
  --shadow-hover: 7px 8px 0 var(--line);
  --shadow-press: 1px 1px 0 var(--line);

  /* hareket */
  --duration-fast: 140ms;
  --duration-normal: 280ms;
  --ease-pop: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
}

/* gün renkleri: Pazartesi → Cuma */
.wd-0 { --day: var(--tomato); --day-ink: var(--ink); }
.wd-1 { --day: var(--sun); --day-ink: var(--ink); }
.wd-2 { --day: var(--grass); --day-ink: var(--ink); }
.wd-3 { --day: var(--sky); --day-ink: var(--ink); }
.wd-4 { --day: var(--grape-deep); --day-ink: #fff; }
.wd-5, .wd-6 { --day: var(--bubble); --day-ink: var(--ink); }