/* One token set for the whole site (town, story, entry and inner pages).
   Colours follow the town: parchment paper, ink, one red. The red is #AE2D23,
   darkened from #C6352A so small red text passes WCAG AA on paper (4.99:1). */
:root {
  /* Colour */
  --c-paper: #E6E0D4;        /* page ground */
  --c-paper-2: #EFEAE0;      /* raised ground, inputs */
  --c-card: #F7F3EB;         /* cards, signs */
  --c-ink: #161413;          /* text, rules */
  --c-ink-2: #2A2725;
  --c-body: #2A2725;         /* running text */
  --c-muted: #57514A;        /* secondary text (5.96:1 on paper) */
  --c-line: #CFC8BB;         /* decorative dividers only */
  --c-border: #57514A;       /* input and control boundaries (3:1+) */
  --c-art: #AE2D23;          /* the one red: sun, roofs, primary action */
  --c-art-deep: #8E271D;
  --c-art-tint: #F3DCD8;
  --c-on-art: #F7F3EB;       /* text on red (5.3:1) */
  --c-door-brand: #5A2A45;   /* Work page, Brand design door: wine (cream text 10.2:1) */
  --c-door-photo: #16324F;   /* Work page, Photography door: navy (cream text 11.8:1) */
  /* Older names kept so existing pages keep working */
  --c-stone: var(--c-paper-2);
  --c-biz: var(--c-ink);
  --c-biz-tint: #E2DDD3;
  --c-on-biz: var(--c-card);
  --c-on-biz-muted: #C9C2B6;

  /* Type */
  --f-sign: "Anton", "Oswald", Impact, sans-serif;     /* display, all caps */
  --f-body: "Hanken Grotesk", system-ui, sans-serif;   /* reading */
  --f-mono: "DM Mono", ui-monospace, monospace;        /* labels, meta */
  --f-hand: "Patrick Hand", "Comic Sans MS", cursive;  /* speech bubbles */
  --f-display: var(--f-sign);
  --t-min: 12px;                                       /* smallest text size used */

  /* Space and shape */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 40px; --space-8: 56px;
  --radius-sm: 4px; --radius-md: 6px; --radius-lg: 10px; --radius-pill: 999px;
  --rule: 1.5px solid var(--c-ink);
  --rule-dashed: 1.5px dashed var(--c-ink);
  --shadow-card: 3px 6px 12px -6px rgba(22, 20, 19, .45);

  /* Motion */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);          /* UI enters, presses, hovers */
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);      /* long on-screen moves (camera flights) */
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);       /* sheets and drawers */
  --dur-press: 140ms;
  --dur-hover: 200ms;
  --dur-ui: 240ms;
  --dur-modal: 300ms;
}