/* New Tech Hollywood design tokens (v1). Source: "New_Tech_Hollywood_Fully_Art_Directed_Template" deck
   (Drive 1F-AwwkFpRBMBzFBsTepqn_7zOhSj-FodAqyLT8ZuOFY) and the NTH brand sheet in the same Drive folder.
   See design/DESIGN.md for where each value comes from. public/tokens.css must stay byte-identical (tested). */
:root {
  color-scheme: dark;

  /* Color: "Black, white, graphite. No startup blue. No gradient soup." (deck slide 2) */
  --nth-black: #000000;          /* brand sheet and logo field, sampled #000000 */
  --nth-ink: #050505;            /* page background; deck cover sampled #020101 to #0a0a09 */
  --nth-graphite-900: #0c0c0c;   /* raised surface */
  --nth-graphite-800: #151515;   /* card */
  --nth-graphite-700: #222222;   /* input field, hover */
  --nth-graphite-600: #333333;   /* hairline on cards */
  --nth-graphite-400: #5c5c5c;   /* disabled text, faint rule */
  --nth-steel: #9a9898;          /* brand sheet grid rule, sampled (154,152,152) */
  --nth-silver: #c0c0c0;         /* brand sheet panel rule, sampled (192,192,192) */
  --nth-white: #ffffff;          /* logo, headlines, primary button */

  --color-bg: var(--nth-ink);
  --color-surface: var(--nth-graphite-900);
  --color-card: var(--nth-graphite-800);
  --color-field: var(--nth-graphite-700);
  --color-line: var(--nth-graphite-600);
  --color-line-strong: var(--nth-steel);
  --color-text: var(--nth-white);
  --color-text-2: #b3b3b3;       /* body copy on ink, contrast 9.6:1 */
  --color-text-3: #8a8a8a;       /* captions, labels, contrast 5.9:1 */
  --color-accent: var(--nth-white);
  --color-on-accent: var(--nth-black);
  /* Functional only (errors). Not a brand color; never used for decoration. */
  --color-alert: #ff6b5e;

  /* Type: "Headers: Bebas Neue. Body: IBM Plex Mono. Keep copy short and severe." (deck slide 2)
     Brand sheet: "Primary font: Bebas Neue Pro (tracking +200)". Bebas Neue (Google Fonts) stands in for Pro. */
  --font-display: "Bebas Neue", "Bebas Neue Pro", Impact, "Arial Narrow", sans-serif;
  --font-body: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --tracking-wordmark: 0.2em;    /* +200 tracking, wordmark and eyebrow labels */
  --tracking-display: 0.02em;
  --tracking-label: 0.12em;

  --text-xs: 0.75rem;    /* 12 */
  --text-sm: 0.8125rem;  /* 13 */
  --text-base: 0.9375rem;/* 15: Plex Mono runs wide */
  --text-md: 1.125rem;   /* 18 */
  --text-lg: 1.5rem;     /* 24 */
  --display-sm: 2rem;    /* 32 */
  --display-md: clamp(2.5rem, 7vw, 3.5rem);
  --display-lg: clamp(3.5rem, 13vw, 7rem);
  --display-xl: clamp(4.5rem, 18vw, 11rem);
  --leading-tight: 0.92;
  --leading-body: 1.6;

  /* Space: 4px base. "Preserve heavy negative space." (deck slide 22) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 144px;
  --gutter: 16px;
  --max-width: 1180px;

  /* Radius: hard edges on everything except the app icon (brand sheet colorways). */
  --radius-0: 0;
  --radius-sm: 2px;
  --radius-icon: 22%;

  --line: 1px solid var(--color-line);
  --line-strong: 1px solid var(--color-line-strong);
  --focus: 0 0 0 2px var(--nth-black), 0 0 0 4px var(--nth-white);
  --ease: cubic-bezier(0.2, 0.7, 0.1, 1);
}
@media (min-width: 720px) { :root { --gutter: 32px; } }