/* ----------------------------------------------------------------------------
 * Drama Studio design tokens — the single source of truth for every page.
 *
 * Visual system: the short-drama "studio" look — warm stage backdrop, frosted
 * glass surfaces, soft rounded cards, terracotta accent, serif display type.
 * One theme for the whole app: there are no per-page variants any more.
 *
 * tailwind.config.js reads the `--rgb-*` scales (so utilities such as
 * `bg-marigold-500/10` keep working), page stylesheets read the semantic
 * aliases below. Nothing else in the app may introduce a colour, radius,
 * shadow, blur, background image or font family that is not defined here —
 * see ui-system-guard.test.ts.
 * --------------------------------------------------------------------------*/
:root {
  color-scheme: light;

  /* Neutral scale (warm ink). 50 = strongest text … 950 = app ground. */
  --rgb-ink-50: 40 33 38;
  --rgb-ink-100: 48 40 45;
  --rgb-ink-200: 62 52 58;
  --rgb-ink-300: 84 72 79;
  --rgb-ink-400: 96 84 90;
  --rgb-ink-500: 115 105 113;
  --rgb-ink-600: 150 140 146;
  --rgb-ink-700: 196 186 191;
  --rgb-ink-750: 214 206 210;
  --rgb-ink-800: 226 220 223;
  --rgb-ink-850: 236 232 234;
  --rgb-ink-900: 243 240 241;
  --rgb-ink-925: 246 243 244;
  --rgb-ink-950: 244 239 235;

  /* Single accent — studio terracotta (#bd5d36). */
  --rgb-accent-50: 255 247 240;
  --rgb-accent-100: 255 239 226;
  --rgb-accent-200: 242 200 180;
  --rgb-accent-300: 230 161 132;
  --rgb-accent-400: 210 122 86;
  --rgb-accent-500: 189 93 54;
  --rgb-accent-600: 151 64 36;
  --rgb-accent-700: 122 50 25;
  --rgb-accent-900: 74 31 15;
  --rgb-accent-950: 46 19 10;

  /* Danger (rust). */
  --rgb-danger-300: 252 165 165;
  --rgb-danger-400: 248 113 113;
  --rgb-danger-500: 185 28 28;
  --rgb-danger-600: 153 27 27;
  --rgb-danger-950: 254 242 242;

  /* Semantic aliases ------------------------------------------------------ */
  --bg: rgb(var(--rgb-ink-950));
  --bg-image: url("/static/studio-backgrounds/production-stage.webp");
  --bg-tint: linear-gradient(105deg, rgba(248, 245, 244, 0.72), rgba(247, 241, 238, 0.48));
  --bg-glow: radial-gradient(circle at 72% 8%, rgba(255, 255, 255, 0.62), transparent 32rem),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.04), rgba(248, 246, 248, 0.48));

  /* Frosted surfaces. `--surface` is what `bg-white` resolves to. */
  --surface: rgba(255, 255, 255, 0.68);
  --surface-solid: #fbfaf9;
  --surface-2: rgba(255, 255, 255, 0.42);
  --surface-3: rgba(255, 255, 255, 0.62);
  --glass: rgba(255, 255, 255, 0.72);
  --glass-strong: rgba(255, 255, 255, 0.86);
  --glass-soft: rgba(255, 255, 255, 0.42);
  --glass-rail: rgba(250, 249, 250, 0.69);
  --blur: blur(22px) saturate(1.08);
  --blur-rail: blur(28px) saturate(1.08);

  --ink: rgb(var(--rgb-ink-50));
  --ink-strong: rgb(var(--rgb-ink-50));
  --ink-soft: rgb(var(--rgb-ink-400));
  --ink-muted: rgb(var(--rgb-ink-500));
  --ink-faint: rgb(var(--rgb-ink-600));
  --line: rgba(82, 64, 73, 0.12);
  --line-strong: rgba(74, 58, 67, 0.22);
  --line-light: rgba(255, 255, 255, 0.66);
  --accent: rgb(var(--rgb-accent-500));
  --accent-strong: rgb(var(--rgb-accent-600));
  --accent-deep: rgb(var(--rgb-accent-700));
  --accent-soft: rgba(255, 239, 226, 0.84);
  --accent-soft-2: rgb(var(--rgb-accent-200));
  --accent-gradient: linear-gradient(135deg, var(--accent), var(--accent-strong));
  --danger: rgb(var(--rgb-danger-500));
  --danger-strong: rgb(var(--rgb-danger-600));
  --danger-soft: rgb(var(--rgb-danger-950));
  --success: #15803d;
  --warning: #b45309;

  --radius-sm: 10px;
  --radius: 14px;
  --radius-lg: 20px;
  --radius-xl: 24px;
  --radius-pill: 999px;

  --shadow-1: 0 7px 20px -16px rgba(49, 34, 43, 0.56);
  --shadow-2: 0 24px 70px -44px rgba(57, 35, 47, 0.46), 0 8px 24px -18px rgba(57, 35, 47, 0.26);
  --shadow-3: 0 32px 90px -30px rgba(47, 31, 40, 0.48);
  --shadow-lift: 0 28px 70px -38px rgba(57, 36, 47, 0.48), 0 12px 28px -20px rgba(57, 36, 47, 0.3);
  --shadow-accent: 0 12px 28px -18px rgba(189, 93, 54, 0.72);
  --focus-ring: 0 0 0 3px rgba(189, 93, 54, 0.13);

  /* System stacks only: production CSP is same-origin and no webfont is
     vendored. Display type is serif to match the studio wordmark. */
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", system-ui, sans-serif;
  --font-display: Georgia, "Songti SC", "STSong", "Noto Serif CJK SC", "Source Han Serif SC", "SimSun", serif;
  --font-mono: ui-monospace, "SFMono-Regular", "JetBrains Mono", Menlo, Consolas, monospace;

  --sidebar-w: 260px;
  --sidebar-w-mobile: 280px;
  --topbar-h: 48px;
}