/* ── DashCloud — Kinetic Authority Design System ── */
:root {
  /* Surface hierarchy — deep oceanic slate */
  --cream: #0e141a;           /* surface / base canvas */
  --warm-white: #161c22;      /* surface-container-low */
  --surface: #1a2026;         /* surface-container */

  /* Primary — Solar Flare */
  --spice: #ffb599;
  --spice-dark: #e07141;
  --spice-mid: #ffc9ad;
  --spice-glow: rgba(255,181,153,0.12);

  /* Gold accent — pricing badges */
  --gold: #d3a74a;
  --gold-light: #1e1a0e;
  --gold-border: rgba(211,167,74,0.35);

  /* Typography */
  --ink: #dde3eb;              /* on-surface */
  --ink-soft: #bec5e4;         /* secondary — cool blue-purple */
  --ink-muted: #a58b82;        /* outline */
  --ink-faint: #6a5d58;        /* muted labels */

  /* Ghost borders — felt, not seen */
  --border: rgba(86,66,59,0.20);
  --border-strong: rgba(255,181,153,0.22);

  /* Panels */
  --panel-strong: #090f14;     /* surface-container-lowest */
  --panel-soft: rgba(26,32,38,0.82);

  /* Glassmorphism — nav & floating cards */
  --glass-bg: rgba(14,20,26,0.75);
  --glass-border: rgba(255,255,255,0.05);
  --glass-inset: inset 0 0 0 1px rgba(255,255,255,0.04);

  /* Gradients */
  --accent-grad: linear-gradient(135deg, #ffb599 0%, #e07141 100%);
  --sidebar-grad: linear-gradient(180deg, #0e141a 0%, #090f14 100%);

  /* Ambient shadows — primary-tinted for organic lift */
  --shadow-sm: 0 2px 8px rgba(0,0,0,0.50), 0 0 0 1px rgba(255,181,153,0.03);
  --shadow-md: 0 4px 40px rgba(0,0,0,0.55), 0 2px 12px rgba(255,181,153,0.05);
  --shadow-lg: 0 8px 60px rgba(0,0,0,0.60), 0 4px 24px rgba(255,181,153,0.08);

  /* Radii */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-xl: 24px;
}

body.light-mode {
  --cream: #f6f2ea;
  --warm-white: #fffdf8;
  --surface: #ffffff;
  --spice: #c95c2f;
  --spice-dark: #aa4b23;
  --spice-mid: #da7a50;
  --spice-glow: rgba(201,92,47,0.12);
  --gold: #b78e2d;
  --gold-light: #f5ecd6;
  --gold-border: rgba(183,142,45,0.35);
  --ink: #22160e;
  --ink-soft: #3d2b1d;
  --ink-muted: #6e5a49;
  --ink-faint: #8f7b68;
  --border: rgba(58,37,21,0.16);
  --border-strong: rgba(58,37,21,0.28);
  --panel-strong: #2a1b10;
  --panel-soft: rgba(255,250,241,0.75);
  --glass-bg: rgba(255,253,248,0.75);
  --glass-border: rgba(58,37,21,0.10);
  --glass-inset: inset 0 0 0 1px rgba(255,255,255,0.6);
  --sidebar-grad: linear-gradient(180deg,#fffdf8 0%,#faf6ee 100%);
  --shadow-sm: 0 1px 4px rgba(34,22,14,0.09), 0 4px 16px rgba(34,22,14,0.06);
  --shadow-md: 0 2px 10px rgba(34,22,14,0.11), 0 12px 34px rgba(34,22,14,0.08);
  --shadow-lg: 0 4px 18px rgba(34,22,14,0.12), 0 20px 56px rgba(34,22,14,0.1);
}
