/* tokens.css — the maistro-cloud design system (MV2-CLOUD-SHELL-DESIGN).
 *
 * Direction B "Deep Field", picked by Samer 2026-07-25 from three mockups
 * (cloud/static/mockups/ — the design record): deep-space blue, soft layered
 * depth, the brand blue→violet gradient as THE accent, glass-like surfaces.
 *
 * RULES (enforced by tests/shell_design_test.py):
 *  - This file is the ONLY place raw colors and px values may appear.
 *  - Every shell page consumes these custom properties via shell.css classes —
 *    zero page-local styling forks.
 *  - Card 33 vendors this file into the engine (home + board chrome) — keep
 *    property NAMES stable; changing a VALUE restyles every surface at once.
 *
 * name → role:
 *  --mc-bg / --mc-bg-2      page background (deep) / raised background
 *  --mc-bg-wash             the page's radial backdrop (login, home)
 *  --mc-surface             translucent card/panel fill (glass)
 *  --mc-surface-solid       opaque panel fill (menus, chips)
 *  --mc-text / --mc-muted   primary / secondary ink
 *  --mc-hairline            1px-class borders and rules
 *  --mc-hairline-w          the border width itself
 *  --mc-accent / --mc-accent-2  brand pair (blue → violet)
 *  --mc-accent-grad         the brand gradient (buttons, orb)
 *  --mc-glow                accent halo (focus rings, shadows)
 *  --mc-danger / --mc-success   error ink / positive state
 *  --mc-font / --mc-font-mono   UI stack / metadata stack (system, no CDN)
 *  --mc-fs-*                type scale (sm / base / lg / xl)
 *  --mc-sp-*                spacing scale 1..6 (4 8 12 16 24 32)
 *  --mc-r-sm/-r/-r-lg/-r-pill   radii
 *  --mc-shadow / --mc-shadow-soft / --mc-shadow-accent   depth
 *  --mc-tr                  standard transition
 */
:root {
  --mc-bg: #0c1120;
  --mc-bg-2: #0f1730;
  --mc-bg-wash: radial-gradient(1100px 500px at 75% -10%, #1b2a55 0%, #0f1730 45%, #0c1120 100%);
  --mc-surface: rgba(23, 32, 58, .72);
  --mc-surface-solid: #171f38;
  --mc-text: #e9edfa;
  --mc-muted: #94a0c4;
  --mc-hairline: rgba(148, 160, 196, .16);
  --mc-hairline-w: 1px;
  --mc-accent: #4f7bff;
  --mc-accent-2: #8b5cf6;
  --mc-accent-grad: linear-gradient(90deg, #4f7bff, #8b5cf6);
  --mc-accent-grad-tilt: linear-gradient(135deg, #4f7bff, #8b5cf6);
  --mc-glow: rgba(79, 123, 255, .28);
  --mc-danger: #ff7089;
  --mc-success: #4cd9a0;
  --mc-success-glow: rgba(76, 217, 160, .7);
  --mc-font: system-ui, "Segoe UI", sans-serif;
  --mc-font-mono: ui-monospace, "Cascadia Mono", Consolas, monospace;
  --mc-fs-sm: .76rem;
  --mc-fs-base: .92rem;
  --mc-fs-lg: 1.08rem;
  --mc-fs-xl: 1.35rem;
  --mc-sp-1: 4px;
  --mc-sp-2: 8px;
  --mc-sp-3: 12px;
  --mc-sp-4: 16px;
  --mc-sp-5: 24px;
  --mc-sp-6: 32px;
  --mc-r-sm: 10px;
  --mc-r: 14px;
  --mc-r-lg: 18px;
  --mc-r-pill: 99px;
  --mc-blur: 8px;
  --mc-lift: -1px;
  --mc-shadow: 0 18px 50px rgba(4, 8, 20, .55);
  --mc-shadow-soft: 0 8px 26px rgba(4, 8, 20, .35);
  --mc-shadow-accent: 0 8px 24px var(--mc-glow);
  --mc-tr: .12s ease;
}
