/* ============================================================================
   Creative Studio — design-system tokens (SINGLE SOURCE)

   Role-named, mirrored across modes. Colour carries meaning:
   action(cobalt) = pipeline + submit, ink = where you are,
   success(green) = in the DAM, danger(red) = failed/destructive.
   Dark is the default (:root); .light flips the role values.

   Values originate in the Product Producer V5live prototype
   (pp-v5-live/src/index.css) and are asserted equal to every React app's usage
   by packages/theme/src/tokens.test.ts — so tweaking a colour here is the only
   way to tweak it, and drift fails the suite.

   Consumers: import "@creaitve/theme/studio.css" (tailwind + tokens + base) or
   just this file if the app brings its own base rules.
   ============================================================================ */
:root {
  /* Native form controls, scrollbars and focus rings follow the theme. An app
     asserting `color-scheme: dark` itself keeps them dark in light mode. */
  color-scheme: dark;
  /* surfaces */
  --canvas: #161618;
  --panel: #1F1F22;
  --well: #2A2A2C;
  --line: #2E2E32;
  --line-2: #26262A;
  /* text */
  --ink: #F0F0EE;
  --ink-2: #C7C7C4;
  --muted: #9A9A9E;
  --faint: #6E6E74;
  /* action (cobalt) — pipeline + submit only */
  --action: #3B82F6;
  --action-hover: #5C9BFF;
  --action-text: #8AB4FF;
  --action-strong: #A8C7FF;
  --action-tint: #1C2C4A;
  /* success (green) — submitted to DAM */
  --success: #15803D;
  --success-text: #4CC38A;
  /* danger (red) — failed / destructive */
  --danger: #DC2626;
  --danger-text: #F08585;
  /* attention (amber) — stale / needs regen. NOTE: outside the DS palette;
     flagged for review — the spec defines no warning hue. */
  --warn: #D9A441;
  --warn-text: #E8B765;
  --warn-tint: #2A2113;
  --warn-ink: #18130A;
  /* placeholder gradient lightness (image blocks) — theme-aware */
  --ph-l1: 18%;
  --ph-l2: 10%;
  --ph-l1e: 26%;
  --ph-l2e: 16%;
  /* modal/overlay scrim — theme-aware so light mode isn't a heavy black wash */
  --scrim: rgba(8, 8, 10, 0.72);
  /* Studio chrome — one height for hub + every tool navbar */
  --header-height: 3.5rem;
  /* fixed */
  --on-action: #FFFFFF;
}

:root.light {
  color-scheme: light;
  --canvas: #FAFAF9;
  --panel: #FFFFFF;
  --well: #ECECEA;
  --line: #DCDCDA;
  --line-2: #E7E7E3;
  --ink: #18181A;
  --ink-2: #3A3A3E;
  --muted: #6E6E72;
  --faint: #A0A09E;
  --action: #2563EB;
  --action-hover: #1D4ED8;
  --action-text: #1D4ED8;
  --action-strong: #1D4ED8;
  --action-tint: #E8F0FE;
  --success: #15803D;
  --success-text: #15803D;
  --danger: #DC2626;
  --danger-text: #A32D2D;
  --warn: #B45309;
  --warn-text: #92400E;
  --warn-tint: #FDF1E0;
  --warn-ink: #FFFFFF;
  /* lighter, cleaner placeholder blocks in light mode */
  --ph-l1: 90%;
  --ph-l2: 82%;
  --ph-l1e: 94%;
  --ph-l2e: 88%;
  --scrim: rgba(24, 24, 27, 0.42);
  --on-action: #FFFFFF;
}