/* ==========================================================================
   Edgework Studio — Design System
   Tokens / Токены · v1.0
   L1 primitives (raw values) · L2 semantics (intent). Components use L2 only.
   ========================================================================== */

:root {
  /* ---------- L1 · Ink (near-black violet neutrals) ---------- */
  --ink-000:#ffffff; --ink-050:#f6f5fa; --ink-100:#eceaf3; --ink-200:#ddd9e8;
  --ink-300:#b8b2cc; --ink-400:#918aa8; --ink-500:#6b6183; --ink-600:#4a4160;
  --ink-700:#322b45; --ink-800:#241f33; --ink-850:#1a1725; --ink-900:#12101a;
  --ink-950:#0a0810; --ink-999:#08070c;

  /* ---------- L1 · Spectrum (brand refraction) ---------- */
  --cyan-300:#7ce9f8; --cyan-500:#22d3ee; --cyan-700:#0e8ba6;
  --azure-300:#93b8ff; --azure-500:#3b82f6; --azure-700:#1d4ed8;
  --violet-300:#b9a6ff; --violet-500:#7c5cff; --violet-600:#6b46ff; --violet-700:#4a2fc4;
  --violet-solid:#7350f0; /* white-on-violet at 5.08:1 — the interactive brand fill */
  --magenta-300:#ff9ac8; --magenta-500:#ff3d9a;--magenta-strong:#d63381; --magenta-700:#c01a68;
  --flame-300:#ffc09a; --flame-500:#ff7a3d; --flame-700:#c4501a;
  --lime-500:#a3e635;

  /* ---------- L1 · Signal ---------- */
  --green-500:#2fd48f; --green-700:#10855a;--green-800:#0d6f4b;
  --amber-500:#ffb340; --amber-700:#b87400; --amber-800:#9c6200;--amber-900:#8a5700;
  --red-500:#d13f57;   --red-700:#c01030;

  /* ---------- L1 · Gradients ---------- */
  --spectrum-linear: linear-gradient(90deg,#22d3ee 0%,#7c5cff 38%,#ff3d9a 70%,#ff7a3d 100%);
  --spectrum-diagonal: linear-gradient(135deg,#22d3ee 0%,#7c5cff 40%,#ff3d9a 75%,#ff7a3d 100%);
  --spectrum-conic: conic-gradient(from 210deg,#22d3ee,#7c5cff,#ff3d9a,#ff7a3d,#22d3ee);
  --spectrum-veil: radial-gradient(120% 120% at 15% 0%,rgba(34,211,238,.18) 0%,rgba(124,92,255,.16) 35%,rgba(255,61,154,.10) 65%,transparent 100%);

  /* ---------- L1 · Space (4pt base) ---------- */
  --space-1:2px; --space-2:4px; --space-3:8px; --space-4:12px; --space-5:16px;
  --space-6:20px; --space-7:24px; --space-8:32px; --space-9:40px; --space-10:48px;
  --space-11:64px; --space-12:80px; --space-13:96px; --space-14:128px;

  /* ---------- L1 · Radius ---------- */
  --radius-2xs:2px; --radius-xs:4px; --radius-sm:6px; --radius-md:10px; --radius-lg:14px;
  --radius-xl:20px; --radius-2xl:28px; --radius-full:999px;

  /* ---------- L1 · Type ---------- */
  --font-sans:"Manrope","Segoe UI",system-ui,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,monospace;
  --text-display:64px; --text-h1:44px; --text-h2:32px; --text-h3:24px;
  --text-h4:19px; --text-lg:18px; --text-md:15px; --text-sm:13px; --text-xs:11px; --text-code:12px;
  --leading-none:1; --leading-tight:1.1; --leading-snug:1.2; --leading-normal:1.45;--leading-body:1.55; --leading-relaxed:1.7;
  --tracking-snug:-.01em;
  --tracking-caps:.2em;
  --tracking-tighter:-.03em; --tracking-tight:-.02em; --tracking-normal:0; --tracking-wide:.12em; --tracking-widest:.14em;
  --border-1:1px; --border-2:1.5px; --border-3:2px; /* применяется через --info-solid в акцентной полосе информационных блоков */
  --icon-xs:12px;
  --icon-sm:14px; --icon-md:17px; --icon-lg:20px; --icon-xl:24px;
  --hit-min:24px; --hit-touch:44px; /* задел: применяется в B5 при переходе на 44px (AAA, вне объёма) */
  --bp-sm:520px; /* указывается комментарием в @media — условие не принимает var() */ --bp-md:820px; /* указывается комментарием в @media — условие не принимает var() */ --bp-lg:1180px; /* указывается комментарием в @media — условие не принимает var() */ --bp-xl:1440px; /* указывается комментарием в @media — условие не принимает var() */
  --opacity-disabled:.45; --opacity-muted:.65; --opacity-scrim:.72;
  --text-2xs:10px; /* dense inspector labels only — never interactive copy */
  --weight-regular:400; --weight-medium:500; --weight-semibold:600; --weight-bold:700; --weight-black:800;

  /* ---------- L1 · Motion ---------- */
  --dur-instant:80ms; --dur-fast:140ms; --dur-base:220ms; --dur-slow:360ms; --dur-slower:600ms; /* задел: длинные переходы рабочих пространств */
  --ease-standard:cubic-bezier(.2,.8,.2,1);
  --ease-entrance:cubic-bezier(.05,.7,.1,1);
  --ease-exit:cubic-bezier(.3,0,.8,.15); /* задел: кривая ухода для закрывающихся оверлеев */
  --ease-spring:cubic-bezier(.34,1.56,.64,1);

  /* ---------- L1 · Z ---------- */
  --z-canvas:0; --z-chrome:100; --z-dropdown:300; --z-overlay:400;
  --z-modal:500; --z-toast:600; --z-tooltip:700;

  /* ======================================================================
     L2 · SEMANTICS — dark is default (Edgework ships dark-first)
     ====================================================================== */
  --bg-canvas:var(--ink-950); --bg-sunken:var(--ink-999); --bg-surface:var(--ink-900);
  --bg-raised:var(--ink-850); --bg-inset:#171422;
  --bg-hover:rgba(255,255,255,.05); --bg-active:rgba(255,255,255,.09);
  --bg-selected:rgba(124,92,255,.16); --bg-scrim:rgba(8,7,12,.72);

  --fg-primary:var(--ink-050); --fg-secondary:var(--ink-300); --fg-muted:#8b84a3;
  --fg-disabled:#6b6183; --fg-inverse:var(--ink-950); --fg-on-accent:#ffffff;

  --border-subtle:rgba(255,255,255,.08); --border-default:rgba(255,255,255,.14);
  --border-control:rgba(255,255,255,.34);--border-interactive:rgba(255,255,255,.34); /* 3.05:1 on bg-surface — inputs, checkboxes, radio */
  --border-strong:rgba(255,255,255,.34); --border-focus:var(--violet-300);

  --accent-fg:var(--violet-300); --accent-bg:var(--violet-solid); --accent-bg-hover:#6543d6;
  --accent-bg-active:var(--violet-600); --accent-subtle:rgba(124,92,255,.16);
  --accent-border:rgba(124,92,255,.8);

  --success-fg:#6ee7b7; --success-bg:rgba(47,212,143,.16); --success-solid:var(--green-500);
  --warning-fg:#ffd08a; --warning-bg:rgba(255,179,64,.16); --warning-solid:var(--amber-500);
  --danger-fg:#ff8fa3;  --danger-bg:rgba(255,77,106,.16);  --danger-solid:#d13f57;
  --info-fg:var(--cyan-300); --info-bg:rgba(34,211,238,.14); --info-solid:var(--cyan-500);

  /* Canvas surfaces (vector editor) */
  --canvas-paper:#1c1929; --canvas-grid:rgba(255,255,255,.05);
  --canvas-guide:var(--magenta-500); --canvas-selection:var(--cyan-500);
  --canvas-handle:#ffffff; --canvas-handle-border:var(--canvas-selection); --canvas-measure:var(--cyan-300); /* применяется в светлой теме через --canvas-selection */

  --shadow-xs:0 1px 2px rgba(0,0,0,.5); --shadow-sm:0 2px 8px rgba(0,0,0,.45);
  --shadow-md:0 8px 24px rgba(0,0,0,.5); --shadow-lg:0 20px 48px rgba(0,0,0,.55);
  --shadow-xl:0 32px 80px rgba(0,0,0,.65);
  --glow-accent:0 0 0 1px rgba(124,92,255,.5),0 8px 32px rgba(124,92,255,.35);
  --warning-border:rgba(255,179,64,.42);
  --success-border:rgba(47,212,143,.35);
  --danger-border:rgba(255,77,106,.35);
  --info-border:rgba(34,211,238,.35);
  /* Текст на ярком фоне. Один на обе темы: на акценте он не
     переворачивается вместе с ней, поэтому это не --fg-inverse. */
  --fg-on-bright:var(--ink-999);
  /* Шахматка прозрачности. Два серых, читающихся одинаково в обеих темах:
     узор показывает отсутствие цвета и от темы не зависит. */
  --checker-light:#8c8798; --checker-dark:#5d5870;
  /* Затемнение под окном. Отдельно от --bg-scrim: у модальных окон оно
     легче, чем у полноэкранного показа. */
  --bg-scrim-light:rgba(6,5,12,.55);
  /* Текст на жёлтом и красном. Не тот, что --fg-on-bright — он почти чёрный, а эти
     два подкрашены своим цветом, иначе на насыщенном фоне читается грязь. */
  --fg-on-warning:#1b1205; --fg-on-danger:#1b0508;
  /* Выделение текста и образец цвета в списке. */
  --bg-selection:rgba(124,92,255,.4);
  --bg-swatch:rgba(255,255,255,.16); --border-swatch:rgba(255,255,255,.24);
  /* Тени с собственной ролью, которых шкала --shadow-* не выражает.
     Панель дока стоит внизу и светит вверх — у шкалы все тени падают вниз. */
  --shadow-dock:0 -18px 44px rgba(0,0,0,.45);
  /* Белая рукоятка на светлом содержимом сливалась бы: тёмный контур в 1px. */
  --canvas-handle-outline:0 0 0 1px rgba(0,0,0,.5);
  /* Направляющая: свечение при захвате и тонкий ореол в покое. */
  --canvas-guide-glow:0 0 0 1px rgba(255,61,154,.28),0 0 12px rgba(255,61,154,.65);
  --canvas-guide-halo:0 0 0 1px rgba(255,61,154,.25);
  /* Пульсация зовущей кнопки. Один цвет на кадры и на покоящееся состояние:
     врозь они уже разошлись — .55 в кадрах против .5 в разметке. */
  --accent-pulse:rgba(124,92,255,.55);
  --glass-bg:rgba(24,21,36,.72); --glass-border:rgba(255,255,255,.10);
  --glass-raised:rgba(38,33,55,.78);
  --glass-shadow:0 24px 64px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.06);

  /* ======================================================================
     L2 · DOCUMENT COLOUR — цвет содержимого, а не интерфейса.
     Эти значения не переворачиваются вместе с темой: лист бумаги остаётся
     белым в тёмной теме, а голубая краска остаётся голубой в светлой.
     См. «3D scene» и «Prepress» в docs/Edgework — новое в прототипе.md §6.
     ====================================================================== */

  /* ---------- Материалы 3D — значение, которое выбирает пользователь ---------- */
  --material-violet:var(--violet-solid);
  --material-cyan:var(--cyan-500);
  --material-magenta:var(--magenta-500);
  --material-flame:var(--flame-500);
  --material-paper:var(--ink-100);
  /* Блик от окружения. Три HDRI — три подсветки белого пятна. */
  --env-studio:rgba(255,255,255,.55);
  --env-sunset:rgba(255,122,61,.5);
  --env-night:rgba(59,130,246,.45);
  /* Оси гизмо. Отдельно от --success/--danger/--info: это не статус, а ось. */
  --axis-x:var(--red-500); --axis-y:var(--green-500); --axis-z:var(--azure-500);

  /* ---------- Печатные краски и лист ---------- */
  --press-cyan:#00b2bf; --press-magenta:#ff3d9a; --press-yellow:#f2c94c; --press-black:#241f33;
  --press-spot:#ff3d9a; /* Pantone 806 C — экранное приближение, не цветопроба */
  --press-paper:#ffffff;
  --press-ink:var(--ink-900);      /* текст при включённой чёрной краске */
  --press-ink-colour:var(--ink-800); /* текст без K, но с цветными */
  --press-ink-off:var(--ink-300);  /* все краски погашены */
  --press-muted:var(--ink-500);
  --press-accent-magenta:var(--magenta-700);
  --press-accent-cyan:var(--cyan-700);
  --press-accent-yellow:#978200;
  --press-accent-off:var(--ink-400);
  /* Технические направляющие поверх белого листа. */
  --press-bleed-guide:rgba(255,61,154,.85);
  --press-safe-guide:rgba(14,139,166,.7);
  --press-mark:var(--ink-400);
  /* Предел суммарной краски по умолчанию, в процентах. */
  --press-ink-limit:300;
}

/* ---------- L2 · light theme override ---------- */
[data-theme="light"] {
  --info-solid:var(--cyan-700);
  --canvas-measure:var(--cyan-700);
  --canvas-selection:var(--cyan-700); /* 3.99:1 */
  --warning-solid:var(--amber-800); /* 5.05:1 */
  --success-solid:var(--green-700); /* 4.64:1 */
  --bg-canvas:var(--ink-050); --bg-sunken:var(--ink-100); --bg-surface:var(--ink-000);
  --bg-raised:var(--ink-000); --bg-inset:var(--ink-050);
  --bg-hover:rgba(18,16,26,.04); --bg-active:rgba(18,16,26,.08);
  --bg-selected:rgba(107,70,255,.10); --bg-scrim:rgba(18,16,26,.45);

  --fg-primary:var(--ink-900); --fg-secondary:var(--ink-600); --fg-muted:var(--ink-500);
  --fg-disabled:var(--ink-400); --fg-inverse:var(--ink-000);

  --border-subtle:#e6e3f0; --border-default:#d5d0e3;
  --border-control:#918aa8;--border-interactive:#918aa8; /* 3.02:1 on white — inputs, checkboxes, radio */
  --border-strong:#918aa8; --border-focus:var(--violet-600);

  --accent-fg:var(--violet-700); --accent-bg:var(--violet-600); --accent-bg-hover:#5b36ef;
  --accent-bg-active:var(--violet-700); --accent-subtle:rgba(107,70,255,.10);
  --accent-border:rgba(107,70,255,.8);

  --success-fg:var(--green-800); --success-bg:rgba(47,212,143,.14);
  --warning-fg:var(--amber-900); --warning-bg:rgba(255,179,64,.18);
  --danger-fg:var(--red-700);    --danger-bg:rgba(255,77,106,.12);
  --info-fg:#0c758c;             --info-bg:rgba(34,211,238,.14);

  --canvas-paper:#ffffff; --canvas-grid:rgba(18,16,26,.06);

  --shadow-xs:0 1px 2px rgba(18,16,26,.06); --shadow-sm:0 2px 8px rgba(18,16,26,.08);
  --shadow-md:0 8px 24px rgba(18,16,26,.10); --shadow-lg:0 20px 48px rgba(18,16,26,.14);
  --shadow-xl:0 32px 80px rgba(18,16,26,.18);
  --glow-accent:0 0 0 1px rgba(107,70,255,.35),0 8px 28px rgba(107,70,255,.22);

  --warning-border:rgba(180,110,10,.34);
  --success-border:rgba(47,212,143,.45);
  --danger-border:rgba(255,77,106,.45);
  --info-border:rgba(34,211,238,.45);
  --glass-bg:rgba(255,255,255,.72); --glass-border:rgba(18,16,26,.10);
  --glass-raised:rgba(255,255,255,.86);
  --glass-shadow:0 24px 60px rgba(18,16,26,.16),inset 0 1px 0 rgba(255,255,255,.9);

  /* Содержимое тему не меняет: --press-* и --material-* намеренно не переопределяются.
     Исключение одно: метки реза рисуются на холсте, а не на листе. */
  --press-mark:var(--ink-500);
}