/* Miracue design system v2 (TEST, 28 Sept 2026): the tokens, in one place.
   STAGING ONLY (see v2-fonts.css). The reference is the Design System v2 artifact
   (claude.ai/artifact/HhaSEvCde5aqLbUQ3iyTzi) and docs/miracue-design-system-v2.md.
   Palette C, "Plum and Citrus" (Luke, 29 Sept 2026). Colours are named by role, not hue,
   so a palette change is values only. This is the single token file for the app and the
   mock site (public/mock/v2/). */
:root{
  --ink:#2A1733; --ink-2:#5E4D5A; --ink-3:#766873;
  --line:#E9E4E8;
  --field-edge:#D9D2D7;      /* field borders; v2.css uses it, the artifact token list does not have it yet */
  --accent:#FFE14D; --calm-1:#F1ECF7; --calm-2:#F4F1EC; --calm-3:#CCDBDF;
  --panel:#8EE3C8;           /* website feature panels only, never in the apps; ink text only */
  --white:#FFFFFF; --tint:#FBFAFA;
  /* Colour 13 (Luke, 1 Oct 2026, canvas FUfALQ6CdiL2gJfnw9m5KF artboard 13): soft tones
     as fills, never as text, so contrast never drops; citrus stays the one loud colour.
     Each tool has one (its active tab and its header band) ... */
  --soft-sand:#F4F1EC; --soft-lilac:#F1ECF7; --soft-mint:#DDF3EA; --soft-mist:#DDE8EB;
  --soft-peach:#FBE3D6; --soft-lemon:#FFF4C2; --soft-rose:#F7DCE6;
  --tool-callsheet:var(--soft-sand); --tool-shotlist:var(--soft-lilac); --tool-storyboard:var(--soft-lilac);
  --tool-moodboard:var(--soft-mint); --tool-day:var(--soft-mist);
  /* ... and each project colour (set in the library) has its soft tone: the project's
     name in the shoot bar and its tile wear it. */
  --proj-terracotta:var(--soft-peach); --proj-ochre:var(--soft-lemon); --proj-sage:var(--soft-mint);
  --proj-slate:var(--soft-mist); --proj-plum:var(--soft-lilac); --proj-stone:var(--soft-sand);
  /* The project's small marks (Desk B, 4 Oct 2026): its chip and its lettered tile in the
     library. Stronger than the fills so projects tell apart at small size (Luke, 4 Oct). Ink text
     sits on these, so any new value must keep 4.5:1 or better under --ink. */
  --proj-terracotta-swatch:#F2B99B;
  --proj-ochre-swatch:#F5D66B;
  --proj-sage-swatch:#9FD8BE;
  --proj-slate-swatch:#A9C6D3;
  --proj-plum-swatch:#C9B3E6;
  --proj-stone-swatch:#D6CBB8;
  --danger:#D93A2B; --danger-soft:#FBE9E7; --on-ink:#FFFFFF;
  /* State, the other way (Luke, 2 Oct 2026: "change the yes to green"): a client's yes
     and an approval. 5.9:1 under white text, 5.1:1 as text on its soft fill. */
  --success:#1B7340; --success-soft:var(--soft-mint);
  /* People in one conversation (Luke, 3 Oct 2026): each name in a shared approval chat
     has its own colour for the name, never a decoration. The producer is ink.
     Each is 5:1 or better on white, tint, calm-1 and calm-2. */
  --who-1:#0E6B66; --who-2:#2B57A6; --who-3:#A2421B; --who-4:#A3256A; --who-5:#6B3DB3; --who-6:#8A5A00;
  /* ... and each person's messages wear a soft fill of their own hue (Luke, 4 Oct 2026:
     "each name should have a different coloured bubble"). Fills only, never text: on
     each, ink is 12.7:1 or better, ink-2 6:1 or better, the person's own --who name
     5.1:1 or better. The producer's bubbles stay lilac (--calm-1). */
  --who-1-fill:#DDF3EA; --who-2-fill:#E0E9F7; --who-3-fill:#FBE3D6;
  --who-4-fill:#F7DCE6; --who-5-fill:#E6DEF6; --who-6-fill:#FFF4C2;
  /* "Not sent" on a coloured bubble: a danger dark enough for 4.8:1 on every fill above */
  --danger-on-fill:#B42D1E;
  /* white at a strength: a quote inside a coloured bubble */
  --white-a60:rgba(255,255,255,.6);
  --reading-black:#000000;
  --read-standard-fg:#F4F4F5; --read-yellow-fg:#FFD75E;
  --read-cream-bg:#F6ECD9; --read-cream-fg:#1D1D1F;
  --read-amber-bg:#101A2E; --read-amber-fg:#FFB454;
  --read-gray-bg:#26262A; --read-gray-fg:#E8E8EA;
  --read-accent-fg:var(--accent); --read-lilac-fg:var(--calm-1); --read-sand-bg:var(--calm-2);
  /* ink at a strength, for scrims and quiet fills over white */
  --ink-a08:rgba(42,23,51,.08); --ink-a35:rgba(42,23,51,.35); --ink-a92:rgba(42,23,51,.92);
  --sans:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  /* Shape (docs/miracue-design-system-v2.md): 16 for cards, sheets and panels, 10 for small
     controls, pills for tabs and chips; 50% only for true circles (avatars, round icon buttons).
     --r-m is the website's 12px and is not used in the apps. */
  --r:16px; --r-s:10px; --pill:99px; --r-m:12px;
  /* Type (the same doc): display 56/500, h 44/400, title 33/500, lead 22.7/400, body 18/400,
     small 14/500, label 13/700 caps +.06em. The apps add two working steps the doc's page scale
     has no need of: ui 16 (fields, list rows, the editor's chrome) and micro 12 (badges, counts).
     Line height 1.2 for headings, 1.5 for body. The prompter's reading size is the reader's own. */
  --fs-display:56px; --fs-h:44px; --fs-title:33px; --fs-lead:22.7px; --fs-body:18px;
  --fs-ui:16px; --fs-small:14px; --fs-label:13px; --fs-micro:12px;
  --lh-head:1.2; --lh-body:1.5;
  --fw-display:500; --fw-h:400; --fw-title:500; --fw-lead:400; --fw-body:400; --fw-small:500;
  --fw-label:700; --fw-strong:600; --fw-bold:700;
  --ls-label:.06em;
  /* Space: one 4px-based scale for padding, margins and gaps */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px; --sp-8:64px;
  /* Controls (buttons, the header): s 36, m 48, l 56 high; the header is one height everywhere */
  --ctl-s:36px; --ctl-m:48px; --ctl-l:56px; --hit:44px;
  --head-h:68px; --head-h-phone:60px;
  --float:0 8px 48px rgba(0,0,0,.15);
  --v2-ease:.6s ease-in-out;
}