/* ============================================================================
   Nury Chat — design system
   Ported from the Nur Docs Platform. Gemini-inspired: near-black cool neutrals,
   blue→purple→coral gradient, mouse-reactive ambient light. Dark is default.

   This sheet was one 3,700-line file; it is now split by concern. THE SPLIT IS
   PURE — the partials are contiguous slices of the original in its original
   order, so the cascade is unchanged. index.html links them in the order
   below and THAT ORDER IS LOAD-BEARING: later sheets override earlier ones
   (responsive.css in particular exists to override everything above it).

      1. tokens.css
      2. base.css
      3. shell.css
      4. controls.css
      5. auth.css
      6. upload.css
      7. progress.css
      8. library.css
      9. chat.css
     10. citations.css
     11. composer.css
     12. files-panel.css
     13. modal.css
     14. responsive.css
     15. chat-rail.css
     16. admin.css
   ========================================================================== */
/* ------------------------------------------------------------ tokens */
:root,
:root[data-theme='dark'] {
  color-scheme: dark;

  --bg: #090710;
  --bg-soft: #110e1a;
  --surface: #1a1626;
  --surface-2: #231e33;
  --surface-3: #2d2740;
  --text: #e3e3e3;
  --muted: #9aa0a6;
  --border: rgba(255, 255, 255, 0.08);
  --border-strong: rgba(255, 255, 255, 0.16);

  --accent: #e10076;
  --accent-2: #4cb6ae;
  --primary-bg: #624692;
  --primary-text: #ffffff;
  --grad: linear-gradient(74deg, #624692 0%, #e10076 40%, #689dca 75%, #4cb6ae 100%);

  /* Fixed geometry on purpose — see .glow-layer. The layer is overscanned to
     inset:-25% (a 150vw × 150vh box), so these centre percentages are in BOX
     coordinates: (25 + viewport%) / 1.5. The optical rest position is still
     viewport (50%, 44%); js/ambient.js moves and breathes the whole layer
     with a transform from there, so these gradients rasterise exactly once.
     Each radius is capped viewport-relative so the fade (at 70% of the
     radius) always completes INSIDE the box — an uncapped 640px radius is
     wider than a phone's box, and the gradient clipped at the box edge
     painted a hard cut-off line whenever a transform brought that edge into
     view. The caps only bite on small viewports; desktop keeps the px look. */
  --glow:
    radial-gradient(min(640px, 105vw) min(500px, 95vh) at 50% 46%, rgba(225, 0, 118, 0.14), transparent 70%),
    radial-gradient(min(520px, 85vw) min(430px, 90vh) at 59.33% 56.67%, rgba(98, 70, 146, 0.10), transparent 70%),
    radial-gradient(min(720px, 80vw) min(560px, 105vh) at 39.33% 50%, rgba(76, 182, 174, 0.05), transparent 72%);

  --ok-text: #81c995;
  --ok-bg: rgba(129, 201, 149, 0.12);
  --warn-text: #fdd663;
  --warn-bg: rgba(253, 214, 99, 0.10);
  --danger-text: #f28b82;
  --danger-bg: rgba(242, 139, 130, 0.12);

  --shadow: 0 4px 20px rgba(0, 0, 0, 0.45);
  --shadow-soft: 0 1px 8px rgba(0, 0, 0, 0.30);

  --radius: 16px;
  --radius-sm: 12px;
  --radius-pill: 28px;
  --control-h: 40px;
  --header-h: 57px;
}

:root[data-theme='light'] {
  color-scheme: light;

  --bg: #ffffff;
  --bg-soft: #faf9fc;
  --surface: #f3f0f7;
  --surface-2: #e8e4f1;
  --surface-3: #dcd6e8;
  --text: #1f1f1f;
  --muted: #5a5762;
  --border: rgba(31, 31, 31, 0.09);
  --border-strong: rgba(31, 31, 31, 0.18);

  --accent: #624692;
  --accent-2: #4cb6ae;
  --primary-bg: #624692;
  --primary-text: #ffffff;
  --grad: linear-gradient(74deg, #624692 0%, #e10076 40%, #689dca 75%, #4cb6ae 100%);

  --glow:
    radial-gradient(min(640px, 105vw) min(500px, 95vh) at 50% 46%, rgba(225, 0, 118, 0.07), transparent 70%),
    radial-gradient(min(520px, 85vw) min(430px, 90vh) at 59.33% 56.67%, rgba(98, 70, 146, 0.05), transparent 70%),
    radial-gradient(min(720px, 80vw) min(560px, 105vh) at 39.33% 50%, rgba(76, 182, 174, 0.03), transparent 72%);

  --ok-text: #146c2e;
  --ok-bg: rgba(20, 108, 46, 0.09);
  --warn-text: #8a5a00;
  --warn-bg: rgba(180, 130, 20, 0.12);
  --danger-text: #b3261e;
  --danger-bg: rgba(179, 38, 30, 0.08);

  --shadow: 0 4px 20px rgba(40, 60, 100, 0.12);
  --shadow-soft: 0 1px 8px rgba(40, 60, 100, 0.08);
}

