/* ==========================================================================
   HOUSE — design tokens
   Every color, size and weight in the interface resolves to a token here.
   Change the palette in one place; components never hard-code values.
   ========================================================================== */

:root {
  /* — Palette: green on paper ————————————————————————————————————
     One family of green carries everything. Other hues appear only where
     they carry meaning: terracotta = your partner, chartreuse = now. */
  --paper:       #F3F0E8;  /* the page */
  --ink:         #1F3127;  /* deep green: all text and strong rules */
  --green:       #3E5232;  /* the field; you; active state */
  --terracotta:  #BD765E;  /* partner — marks only */
  --chartreuse:  #C6D17A;  /* now — a highlight behind ink, never text */

  /* Three shades of ink, mixed toward the paper, plus the hairline */
  --text:        var(--ink);
  --text-2:      color-mix(in srgb, var(--ink) 70%, var(--paper));  /* secondary */
  --text-3:      color-mix(in srgb, var(--ink) 44%, var(--paper));  /* past, placeholder */
  --rule:        color-mix(in srgb, var(--ink) 17%, var(--paper));
  --bg:          var(--paper);
  --bg-press:    color-mix(in srgb, var(--ink) 7%, var(--paper));
  --accent:      var(--green);
  --accent-ink:  var(--paper);
  --live:        var(--chartreuse);
  --live-ink:    #1F3127;
  --scrim:       color-mix(in srgb, var(--ink) 30%, transparent);

  /* The field: oil-crayon land under a paper sky */
  --field:       var(--green);
  --on-field:    var(--paper);
  --scribble:      url("../art/scribble-wide.svg");
  --scribble-tall: url("../art/scribble-tall.svg");

  /* Calendar identities */
  --cal-me:      var(--green);
  --cal-partner: var(--terracotta);
  --cal-shared:  var(--text-3);

  /* — Type: three voices, all built into iPadOS ——————————————————
     serif  New York  speaks   time, titles, notes      400 (+ italic)
     sans   SF Pro    works    lists, copy, controls    400, 500
     mono   SF Mono   records  times, labels, counts    400
     The wordmark is the one exception: a logo, set 600 italic. */
  --font:       -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-serif: ui-serif, "New York", "Iowan Old Style", "Times New Roman", Georgia, serif;
  --font-mono:  ui-monospace, "SF Mono", SFMono-Regular, Menlo, "Roboto Mono", monospace;

  /* Seven sizes. rem tracks the viewport; 1rem = 16px at 1194 × 834. */
  --t-clock:    11.5rem;   /* serif — the time */
  --t-display:  4.5rem;    /* serif — temperature */
  --t-title:    2.25rem;   /* serif — date, view titles, event titles */
  --t-lead:     1.5rem;    /* serif — notes, column titles, empty states */
  --t-body:     1.1875rem; /* sans  — lists, copy */
  --t-small:    0.9375rem; /* sans/mono — secondary lines, controls, times */
  --t-meta:     0.75rem;   /* mono  — uppercase labels */

  --w-regular: 400;
  --w-medium:  500;

  --track-serif: -0.015em;
  --track-meta:  0.06em;

  /* — Space (4pt base) ——————————————————————————————————————————— */
  --s1: 0.25rem;
  --s2: 0.5rem;
  --s3: 0.75rem;
  --s4: 1rem;
  --s5: 1.5rem;
  --s6: 2rem;
  --s7: 3rem;
  --s8: 4rem;

  --margin: 2.5rem;   /* page margin */
  --gutter: 1.5rem;   /* column gap */
  --cols: 12;
  --masthead: 3.75rem;
  --hair: 1px;
  --radius: 2px;      /* the only radius: a slight softening, never a pill */
  --touch: 3rem;      /* minimum touch target (48px) */

  /* — Motion ————————————————————————————————————————————————————— */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-in: cubic-bezier(0.4, 0, 1, 1);
  --dur-press: 90ms;
  --dur-1: 160ms;
  --dur-2: 240ms;
  --dur-3: 380ms;

  color-scheme: light;
}

/* Night: the same page, lights down — paper becomes the ink, the night
   ground a deep green. Applied between sunset and sunrise. */
:root[data-theme="evening"] {
  --paper:      #15201A;
  --ink:        #E7E3D7;
  --green:      #2C3D25;
  --terracotta: #D28B72;
  --accent:     #A9C09B;
  --accent-ink: #15201A;
  --on-field:   #E7E3D7;
  --scribble:      url("../art/scribble-wide-evening.svg");
  --scribble-tall: url("../art/scribble-tall-evening.svg");
  --scrim:      rgba(0, 0, 0, 0.5);
  color-scheme: dark;
}

/* Dawn: golden hour. Honeyed paper, olive-umber ink, a wheat-gold field. */
:root[data-theme="dawn"] {
  --paper:      #F6EBD3;
  --ink:        #2F2A16;
  --green:      #6E5E26;
  --accent:     #8A6A1F;
  --on-field:   #F6EBD3;
  --scribble:      url("../art/scribble-wide-dawn.svg");
  --scribble-tall: url("../art/scribble-tall-dawn.svg");
}

/* Dusk: blue hour. The whole page goes deep blue; type turns white. */
:root[data-theme="dusk"] {
  --paper:      #1F3552;
  --ink:        #EEF1F4;
  --green:      #142538;
  --accent:     #A9C4E2;
  --accent-ink: #1F3552;
  --terracotta: #DA9179;
  --on-field:   #EEF1F4;
  --scrim:      rgba(0, 0, 0, 0.45);
  --scribble:      url("../art/scribble-wide-dusk.svg");
  --scribble-tall: url("../art/scribble-tall-dusk.svg");
  color-scheme: dark;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-1: 1ms; --dur-2: 1ms; --dur-3: 1ms; }
}