/* ==========================================================================
   NexStudio design tokens  -  the ONE place to restyle the whole site.
   Every page (home, pricing, docs, auth, user panel, admin) loads this file
   first. Change a value here and it changes everywhere; components never use
   raw colours. Owner palette (2026-10-06): #8B0000 #DC143C #FF8C00 #FFD700
   #8B4513 + soft black / grey.
   ========================================================================== */
:root {
  color-scheme: dark;

  /* ---- surfaces (wine-tinted near-black) ---- */
  --ink: #0e0b0c;          /* page background */
  --ink-2: #140f10;        /* sunken areas, inputs, sidebar */
  --panel: #191314;        /* cards */
  --panel-2: #21181a;      /* raised / hover */
  --panel-3: #2b1f22;      /* chips, tracks */
  --line: #2f2427;         /* hairlines */
  --line-2: #413236;       /* stronger borders */

  /* ---- text ---- */
  --bone: #f2eae7;         /* primary text */
  --dust: #ab9c9d;         /* secondary text */
  --dim: #8f7f81;          /* tertiary text, labels */

  /* ---- brand accent ---- */
  --accent: #f8313c;       /* text accents, focus, wires (5.1:1 on ink) */
  --crimson: #a30f1a;
  --crimson-deep: #6b0a12;
  --accent-fill: #b5121b;  /* primary buttons */
  --accent-fill-hover: #cc1622;
  --on-accent: #fff4f2;
  --accent-glow: rgba(248, 49, 60, .18);
  --steel: #9ab8c8;        /* mesh sockets */
  --grey-sock: #a3a3a3;    /* text sockets */

  /* ---- owner palette (cards, charts, illustrations) ---- */
  --p-blood: #8B0000;
  --p-crimson: #DC143C;
  --p-orange: #FF8C00;
  --p-gold: #FFD700;
  --p-brown: #8B4513;
  --p-brown-lt: #b06a2c;  /* brown that reads on dark: chart lines, small marks */

  /* ---- status ---- */
  --ok: #4fbf7a;   --ok-bg: rgba(79, 191, 122, .12);
  --warn: #ffb347; --warn-bg: rgba(255, 140, 0, .12);
  --bad: #ff5a64;  --bad-bg: rgba(248, 49, 60, .12);
  --info: #9ab8c8; --info-bg: rgba(154, 184, 200, .12);

  /* ---- type ---- */
  --f-display: 'Familjen Grotesk', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --f-body: 'Familjen Grotesk', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --f-accent: 'Karmatic Arcade', 'Courier New', ui-monospace, monospace; /* pixel font: big accent words only */
  --f-pixel: 'Familjen Grotesk', 'Segoe UI', system-ui, -apple-system, sans-serif; /* small labels use the main font */
  --f-dot: 'Karmatic Arcade', 'Courier New', ui-monospace, monospace;
  --f-mono: ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;

  /* ---- layout, radius, motion ---- */
  --gutter: clamp(16px, 4vw, 48px);
  --max: 1320px;
  --r-lg: 22px;
  --r-md: 14px;
  --r-sm: 9px;
  --card-r: 16px;
  --px-step: 6px;          /* stepped pixel corners */
  --side-w: 248px;         /* app sidebar */
  --top-h: 64px;           /* app top bar */
  --ease: cubic-bezier(.2, .7, .1, 1);
  --ease-spring: cubic-bezier(.34, 1.4, .5, 1);
  --t-fast: .15s;
  --t-med: .28s;
}