/* =====================================================================
   BIT TEK.ai - Design Tokens (v0.1)
   ---------------------------------------------------------------------
   Single source of visual truth. The whole feel of the product lives
   here so it can be re-tuned in one place.

   Design intent (from docs/NORTH_STAR, docs/PRODUCT_DIRECTION):
     - Warm, minimal, confident, quietly intelligent.
     - "Creative workshop / studio desk" - craftsmanship over futurism.
     - NO neon, NO heavy gradients, NO AI cliches.
   Palette is warm paper + ink, with a single clay accent used sparingly.
   Perspective hues are deliberately MUTED so they read as calm labels,
   never as loud persona cards.
   ===================================================================== */

:root {
  /* --- Surfaces: warm paper, not clinical white --- */
  --paper:            #F7F4EE;   /* page background */
  --paper-deep:       #F1ECE2;   /* recessed areas */
  --surface:          #FFFFFF;   /* cards, input */
  --surface-warm:     #FBF9F5;   /* secondary surfaces */

  /* --- Ink: warm near-black, never pure #000 --- */
  --ink:              #2A2723;   /* primary text */
  --ink-soft:         #4A453E;   /* secondary text */
  --ink-muted:        #857E73;   /* hints, captions */
  --ink-faint:        #C5BDB0;   /* placeholder, dividers */

  /* --- Accent: a single warm clay. Used sparingly. --- */
  --clay:             #C15F3C;
  --clay-deep:        #A54E2F;
  --clay-tint:        #F4E4DA;   /* washed accent background */

  /* --- Perspective hues (muted, calm - small labels only) --- */
  --p-practical:      #6B6357;   /* neutral ink-brown - the lead voice */
  --p-skeptical:      #5B6B78;   /* muted slate */
  --p-creative:       #8A5A76;   /* muted plum */
  --p-humor:          #7C7A4E;   /* warm olive */

  /* --- Lines & edges --- */
  --line:             #E7E0D4;
  --line-strong:      #D9D0C0;

  /* --- Soft, warm-tinted elevation (never harsh) --- */
  --shadow-sm:  0 1px 2px rgba(58, 44, 30, 0.05);
  --shadow-md:  0 6px 24px rgba(58, 44, 30, 0.07);
  --shadow-lg:  0 18px 48px rgba(58, 44, 30, 0.10);

  /* --- Type --- */
  --font-serif: "Fraunces", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --font-sans:  "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono:  "SFMono-Regular", "JetBrains Mono", Menlo, Consolas, monospace;

  /* --- Spacing scale (4-based) --- */
  --s-1: 4px;   --s-2: 8px;   --s-3: 12px;  --s-4: 16px;
  --s-5: 24px;  --s-6: 32px;  --s-7: 48px;  --s-8: 64px;  --s-9: 96px;

  /* --- Radii: soft, generous - notebook corners --- */
  --r-sm: 10px;  --r-md: 16px;  --r-lg: 22px;  --r-pill: 999px;

  /* --- Motion: gentle, composed, never flashy --- */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur:  480ms;

  --content-width: 720px;
}

/* Respect users who prefer calm. All motion collapses gracefully. */
@media (prefers-reduced-motion: reduce) {
  :root { --dur: 0ms; }
}