/* Hallmark · theme: custom — CandyCane Light, the app's own scheme
 *
 * Not a palette invented for the web. Every value below is lifted from
 * core/design-system/.../theme/Color.kt (LightCandyCaneColorScheme) so the site
 * and the app are the same product rather than two things with one name. When
 * that file is retuned, this one is what has to follow it.
 */

:root {
  /* ---- Paper & ink — Color.kt background / ink ---------------------------- */
  --bg:            #FFFBF3;  /* warm cream, not white */
  --ink:           #3A2A1E;  /* warm dark brown, not black — the outline colour */
  --surface:       #FFFFFF;
  --card:          #F1EADD;
  --highlight:     #FCEFE0;
  --line:          #E3D9C6;
  --line-text:     #B0A18A;

  /* ---- Accents ----------------------------------------------------------- */
  --green:         #2F8F5B;
  --green-2:       #37A166;
  --red:           #E8483C;
  --star:          #E8B84B;
  --trunk:         #8B5E3C;
  --on-green:      #FFFFFF;

  /* The tree's own ground, from treeCanvasTop / treeCanvasBorder. */
  --canvas:        #EAF3EC;
  --canvas-line:   #CFE3D5;

  /* Ink at strength, rather than a second set of browns. Only one step down:
     a weaker one measured 3.36:1 on this cream, which is under the floor for
     text this size, and "quiet" is not worth "hard to read". */
  --ink-70:        #3A2A1EB3;

  /* The app's darker green, from DarkCandyCaneColorScheme.treeTier3. White body
     copy on the light green reads 4.04:1 — under the 4.5 floor — so the one
     place this page sets a paragraph on green uses the darker cut instead of a
     green invented for the web. */
  --green-deep:    #2A6849;

  /* ---- The 3D ------------------------------------------------------------
     Buttons.kt: a 4dp Ink shelf sits under the pill, the pill carries a 3dp Ink
     border, and pressing sinks the pill onto the shelf over 70ms. Everything
     raised on this page uses that same language, so the page reads as one
     material rather than a button style bolted onto a flat site. */
  --shelf:         4px;
  --shelf-lg:      6px;
  --stroke:        3px;
  --press-dur:     70ms;

  /* ---- Type — Type.kt ----------------------------------------------------
     Nunito. Headings ExtraBold at -0.5sp; body SemiBold, which is heavier than
     the web's habit and is a large part of why the app reads the way it does. */
  --font: 'Nunito', ui-rounded, system-ui, -apple-system, sans-serif;
  --w-body:    600;
  --w-strong:  700;
  --w-display: 800;
  --track-display: -0.02em;

  --text-display: clamp(2.3rem, 6.4vw + 0.7rem, 4.1rem);
  --text-h2:      clamp(1.6rem, 2.6vw + 0.8rem, 2.4rem);
  --text-h3:      1.25rem;
  --text-lead:    1.14rem;
  --text-base:    1rem;
  /* 19px + ExtraBold clears the large-text threshold, so the app's own white-on-green
     button reads at its real legibility instead of just above the floor. */
  --text-btn:     1.19rem;
  --text-sm:      0.9rem;
  --text-label:   0.78rem;

  /* ---- Space (4 pt, the platform's own grid) ----------------------------- */
  --s-xs:  4px;
  --s-sm:  8px;
  --s-md:  16px;
  --s-lg:  24px;
  --s-xl:  40px;
  --s-2xl: 64px;

  --page-max:    1120px;
  --gutter:      clamp(20px, 5vw, 48px);
  --section-gap: clamp(56px, 8vw, 112px);
  --measure:     58ch;

  /* ---- Shape ------------------------------------------------------------- */
  --r-pill: 999px;
  --r-card: 22px;
  --r-sm:   14px;

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur:      220ms;
}