/* ==========================================================================
   Unclick theme: the ONLY place for fonts, colors, radii, shadows and easing.
   Rebrand = edit this file + replace logo.svg.
   Colors are "R G B" triplets so components can add alpha: rgb(var(--accent) / .15).
   app.css and app.js only reference these variables (no hex/rgb literals).
   Look: light, warm, editorial. Serif headlines, sans UI, one orange accent.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700&family=Newsreader:ital,opsz,wght@0,6..72,300;0,6..72,400;0,6..72,500;1,6..72,300;1,6..72,400&display=swap');

:root {
  /* Fonts */
  --font-serif: 'Newsreader', 'Iowan Old Style', Georgia, serif;   /* headlines, big numbers, card titles */
  --font-sans: 'DM Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'DM Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
  --serif-weight: 350;

  /* The one accent (orange): primary action, live/active states, new egress host */
  --accent: 255 116 10;
  --accent-strong: 255 116 10;   /* button background */
  --accent-soft: 196 84 0;       /* accent-colored text on light backgrounds */
  --accent-ink: 255 255 255;     /* text on an accent background */

  /* Surfaces */
  --bg: 249 248 245;             /* page: warm off-white */
  --surface: 255 255 255;        /* cards */
  --surface-2: 247 245 240;      /* rows, inputs, code */
  --surface-3: 238 234 225;      /* chips, hover */
  --screen: 243 240 233;         /* backdrops for code/JSON/curl */
  --border: 120 100 60;          /* hairlines, used at low alpha (~ rgba(227,221,207)) */
  --scrim: 18 12 8;              /* shadows */
  --white: 255 255 255;          /* text on dark/colored fills */
  --ink: 18 12 8;                /* dark buttons, toast */

  /* Text */
  --text: 18 12 8;               /* warm near-black */
  --text-2: 92 90 86;            /* secondary */
  --text-3: 114 113 109;         /* labels, muted status */
  --text-4: 172 168 160;         /* line numbers, disabled */

  /* Status (muted to sit in the warm palette) */
  --ok: 46 125 84;
  --bad: 192 64 48;
  --warn: 176 118 14;
  --info: 52 103 160;
  --code: 112 84 168;

  /* Stripe (sponsor color) */
  --stripe: 99 91 255;
  --stripe-light: 83 74 230;

  /* Stage band: soft blurred motion gradient behind the live desktop */
  --band-1: 236 196 92;          /* warm yellow */
  --band-2: 104 120 170;         /* dusty blue */
  --band-3: 214 170 96;          /* ochre */
  --band-4: 168 180 120;         /* sage */

  /* Syntax highlighting (light) */
  --syn-keyword: 196 56 40;
  --syn-string: 30 96 70;
  --syn-number: 40 90 170;
  --syn-title: 120 72 190;
  --syn-comment: 150 146 138;
  --syn-builtin: 170 90 10;
  --syn-attr: 40 90 170;

  /* Shape + motion */
  --radius: 20px;
  --radius-sm: 12px;
  --shadow-card: 0 1px 2px rgb(var(--scrim) / .04), 0 10px 30px -18px rgb(var(--scrim) / .18);
  --shadow-float: 0 2px 6px rgb(var(--scrim) / .06), 0 24px 50px -24px rgb(var(--scrim) / .3);
  --ease-reveal: cubic-bezier(0.22, 1, 0.36, 1);   /* ~1s section/card reveals */
  --ease-ui: cubic-bezier(0, 0, 0.2, 1);           /* 150-300ms hovers and state changes */
}