/* ==========================================================================
   Moxu design tokens — shared by every Moxu product and the Moxu website.
   Change a value here and every product picks it up. Product-specific
   styling belongs in that product's own stylesheet, never in this file.

   Style: graphite surfaces, hairline structure, one blue accent used
   sparingly, amber reserved for anything paid. Flat — no glows, no glass.
   ========================================================================== */

:root {
  /* Ground */
  --bg: #111315;
  --bg-deep: #0c0e10;
  --surface: #181b1f;
  --surface-2: #1e2228;
  --surface-3: #262b32;

  /* Structure */
  --line: #262b32;
  --line-soft: #1e2229;
  --line-bright: #333941;

  /* Ink */
  --text: #e9edf2;
  --text-dim: #98a1ac;
  --text-faint: #626b76;

  /* Accent */
  --accent: #0099ff;
  --accent-bright: #3db2ff;
  --accent-deep: #0072c2;
  --accent-wash: rgba(0, 153, 255, 0.12);
  --accent-glow: rgba(0, 153, 255, 0.28);

  /* Semantic */
  --pro: #f0b429;
  --pro-wash: rgba(240, 180, 41, 0.12);
  --danger: #ff5f56;
  --ok: #35d07f;

  /* Type */
  --font-ui: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", "Fira Code", Menlo,
    Consolas, monospace;

  /* Geometry */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 20px;

  --rail: 336px;
  --bar-h: 60px;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 8px 24px -8px rgba(0, 0, 0, 0.6);
  --shadow-lg: 0 24px 60px -20px rgba(0, 0, 0, 0.8);

  --ease: cubic-bezier(0.32, 0.72, 0, 1);
}