/* Low Qi — design tokens. Dark Botanical, decided 26 July 2026.
   Canonical spec: 00_Start-Here/Brand - Color Palette.md
   THE LAW: deep blooms on paper, pale blooms on dark. Never the reverse. */

:root {
  /* grounds */
  --film:        #0A0908;   /* warm black, never #000 */
  --charcoal:    #1E1A17;   /* cards on dark */
  --ink-blue:    #2A3A4E;   /* the cool ground */
  --paper:       #EDE8E0;   /* the reading ground, never #FFF */
  --paper-card:  #F5F1EA;
  --paper-tile:  #E4DDD1;

  /* neutrals */
  --ink:         #17130F;   /* body text on paper   15.2:1 */
  --ash:         #6E665C;   /* secondary on paper    4.6:1 */
  --silver:      #B8AFA3;   /* secondary on dark     8.8:1 */
  --border-warm: #D8CFC2;
  --border-dark: rgba(184,175,163,.15);

  /* deep blooms — PAPER ONLY */
  --scarlet-deep: #A81C25;
  --oxblood:      #701826;
  --damson:       #5A2E44;
  --forest:       #33452F;
  --rust:         #8A5A3B;
  --slate-blue:   #5B6B78;

  /* pale blooms — DARK ONLY */
  --damask:       #D3899B;
  --blush:        #E0BFBC;
  --cream:        #E4D6BE;
  --pale-olive:   #ABAB7D;
  --terracotta:   #D08E71;

  /* growth stages */
  --stage-seedling:  var(--pale-olive);
  --stage-budding:   var(--blush);
  --stage-bloom:     var(--damask);
  --stage-evergreen: var(--cream);

  /* type */
  /* THREE FACES, THREE JOBS, NO OVERLAP — locked 26 July 2026 */
  --display: 'Insignia Serif', Georgia, serif;      /* wordmark, headlines. UNICASE — renders as caps */
  --body:    'New Tropic Text', Palatino, Georgia, serif;  /* reading. essays, anything over 500 words */
  --ui:      'Cartica Sans', system-ui, sans-serif; /* interface. nav, labels, buttons, captions, meta */
  --script:  'KADarling', cursive;                  /* INTERIM. accent only: "Says Who" + sign-off.
                                                       Upgrade target = Qi's real handwriting (Action Board task 6) */

  /* motion — "The Bloom" */
  --ease-bloom: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 300ms;
  --dur-slow: 600ms;

  /* space */
  --gutter: clamp(20px, 5vw, 56px);
  --measure: 70ch;   /* New Tropic is ~30% wider than average — needs the longer measure */
}

/* Grain — the only texture the brand uses */
.grain::after {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 90;
  opacity: .14; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}

@media (prefers-reduced-motion: no-preference) {
  .bloom { animation: bloom var(--dur-slow) var(--ease-bloom) both; }
  @keyframes bloom {
    from { opacity: 0; transform: translateY(12px) scale(.96); }
    to   { opacity: 1; transform: none; }
  }
}