/* Waflin design tokens
 * Derived from the business's own paint, packaging, and room — every value traced in
 * VISUAL-READ.md. Nothing here was chosen from category convention.
 *
 *   ground   #0E0F13  black storefront panels + black cone sleeve
 *   pink     #FF4FA3  window frames and hand-painted lettering (peak sample #FC78C6)
 *   crimson  #E8194B  the Waflin script printed on the cups
 *   gold     #E9C74A  the waffle itself under their real interior light (#E4C642)
 *   duckegg  #B9CBCB  the shopfront ceiling (#AEC0C0)
 *   ivory    #F4F1EA  white trim (#E3E4DD), warmed for type comfort
 *   cocoa    #3A2A22  chocolate and wood
 */

:root {
  /* ---- surfaces ---- */
  --ground: #0e0f13;
  --raised: #171a20;
  --raised-2: #1f242c;
  --line: #2b313a;
  --line-soft: #21262e;

  /* ---- brand ---- */
  --pink: #ff4fa3;
  --pink-dim: #d13c85;
  --pink-wash: rgba(255, 79, 163, 0.12);
  --crimson: #e8194b;
  --gold: #e9c74a;
  --gold-dim: #b99c34;
  --duckegg: #b9cbcb;
  --cocoa: #3a2a22;

  /* ---- type colours ---- */
  --ivory: #f4f1ea;
  --text: #eae6de;
  --text-2: #a9a49c;
  --text-3: #908a7c; /* raised from #746f68: the original failed 4.5:1 on --raised */

  /* ---- type ---- */
  --sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
    Arial, sans-serif;
  --display: "Helvetica Neue", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
    Arial, sans-serif;
  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  /* type scale, 1.25 ratio off 16px, clamped for fluidity */
  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-md: clamp(1.06rem, 0.99rem + 0.3vw, 1.19rem);
  --fs-lg: clamp(1.3rem, 1.15rem + 0.7vw, 1.6rem);
  --fs-xl: clamp(1.6rem, 1.3rem + 1.4vw, 2.4rem);
  --fs-2xl: clamp(2rem, 1.5rem + 2.4vw, 3.4rem);
  --fs-3xl: clamp(2.6rem, 1.6rem + 4.6vw, 5.6rem);

  /* ---- rhythm ----
   * The physical space is hard-edged: rectangular painted frames, flat panels, straight
   * glass. Small radii, depth-not-glow shadows. */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4rem;
  --sp-9: 6rem;

  --r-sm: 6px;
  --r: 10px;
  --r-lg: 16px;
  --r-pill: 999px;

  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-2: 0 6px 18px -6px rgba(0, 0, 0, 0.7);
  --shadow-3: 0 22px 50px -18px rgba(0, 0, 0, 0.85);

  --maxw: 1180px;
  --measure: 62ch;

  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-1: 180ms;
  --dur-2: 340ms;
  --dur-3: 620ms;
}

/* The one soft element in the real room is the mosaic lamp light. That is the only place
 * a glow is allowed, and it is a glow behind content — never a fill. */
:root {
  --lamp-glow: radial-gradient(
    58% 46% at 50% 8%,
    rgba(255, 79, 163, 0.2) 0%,
    rgba(233, 199, 74, 0.07) 38%,
    transparent 72%
  );
}