/* TicketScope brand tokens: the ONLY source of colour, type, spacing and radius.
   Founder-approved 17 Oct 2026 (Alex). Every page, email, PDF and flyer uses these.
   Change a value here, never inline. No new colours or fonts without Alex's go.
   Fonts: Montserrat (headlines, 800/900) + Inter (body/UI, 400/600/700), both SIL OFL.
   Self-host as subset woff2 in /brand/fonts/ (to be added by C13); until then the
   stack falls back safely. */

:root {
  /* Colour */
  --ts-charcoal: #131211;      /* page background */
  --ts-card: #1C1A19;          /* cards, panels */
  --ts-line: #2A2833;          /* borders, dividers */
  --ts-cream: #EDE7D8;         /* main text, light surfaces */
  --ts-muted: #B9B3A6;         /* secondary text (AA on charcoal) */
  --ts-blue: #8FA8E0;          /* THE action colour: buttons, links, focus */
  --ts-blue-ink: #131211;      /* text on blue buttons */
  --ts-red: #F70016;           /* logo red (sampled from badge): accents only */
  --ts-electric: #0A62F7;      /* logo-ring electric blue (sampled): glows, lines, highlights. NOT for text or buttons */
  --ts-night: #070C1C;         /* night-sky top: DARK navy (Alex 17 Oct: not too blue), fades into charcoal */
  --ts-star: #F4F1E8;          /* star points */
  --ts-ok: #6FD49B;            /* success / valid */
  --ts-warn: #F2C14E;          /* warning */
  --ts-danger: #FF5A66;        /* errors / refused */
  --ts-sky: linear-gradient(180deg, var(--ts-night) 0%, #0B0F1B 50%, var(--ts-charcoal) 100%);
  --ts-glow-blue: radial-gradient(60% 60% at 50% 40%, rgba(143,168,224,.20), rgba(143,168,224,0) 70%); /* LIGHTER, softer glow (Alex 17 Oct) */
  --ts-glow-red: radial-gradient(50% 50% at 50% 50%, rgba(247,0,22,.18), rgba(247,0,22,0) 70%);
  --ts-scrim: linear-gradient(180deg, rgba(19,18,17,0) 0%, rgba(19,18,17,.85) 70%, #131211 100%);

  /* Type */
  --ts-font-head: "Montserrat", "Arial Black", system-ui, sans-serif;
  --ts-font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --ts-w-head: 900;
  --ts-w-subhead: 800;
  --ts-w-body: 400;
  --ts-w-strong: 600;
  --ts-w-button: 800;          /* buttons: UPPERCASE, letter-spacing .06em */
  --ts-size-hero: clamp(2.6rem, 9vw, 6rem);   /* uppercase, line-height .95 */
  --ts-size-h2: clamp(1.8rem, 5vw, 3rem);     /* uppercase */
  --ts-size-h3: 1.25rem;                      /* sentence case, Montserrat 800 */
  --ts-size-body: 1rem;                       /* min 16px on phones */
  --ts-size-small: .875rem;                   /* never smaller than 14px */
  --ts-size-kicker: .8125rem;                 /* uppercase, letter-spacing .14em, blue */
  --ts-lh-head: .95;
  --ts-lh-body: 1.5;

  /* Space (4px grid) */
  --ts-s1: 4px; --ts-s2: 8px; --ts-s3: 12px; --ts-s4: 16px;
  --ts-s5: 24px; --ts-s6: 32px; --ts-s7: 48px; --ts-s8: 64px;
  --ts-gutter: 16px;            /* phone side padding */
  --ts-max: 1200px;             /* content width */

  /* Shape and motion */
  --ts-radius: 14px;            /* cards */
  --ts-radius-btn: 4px;         /* buttons (style B, Alex 17 Oct) */
  --ts-radius-input: 8px;       /* form inputs */
  --ts-radius-stub: 6px;        /* ticket-stub main CTA (style C) */
  --ts-tap: 44px;               /* minimum tap target */
  --ts-ease: cubic-bezier(.2,.7,.2,1);
  --ts-dur: 180ms;
}

@media (prefers-reduced-motion: reduce) {
  :root { --ts-dur: 0ms; }
}

/* Rule 15: shared form rhythm (approved by Alex, 19 October). */
:root{--ts-form-label-gap:8px;--ts-form-field-gap:24px;--ts-form-submit-gap:24px;--ts-form-helper-gap:12px}
@media(min-width:761px){:root{--ts-form-submit-gap:32px}}
