/* ─────────────────────────────────────────────────────────────
   GridAPI Images — Design tokens
   Тема: Emerald (--c1 изумруд → --c2 синий). Dark (default) + Light.
   ───────────────────────────────────────────────────────────── */

:root{
  /* ── Акцент (Emerald) ── */
  --c1:#22c79a;            /* изумруд */
  --c2:#3b9dff;            /* синий */
  --accent:var(--c1);
  --accent-grad:linear-gradient(135deg,var(--c1),var(--c2));
  --glow:rgba(34,199,154,.40);
  --glow-soft:rgba(34,199,154,.16);

  /* ── Нейтрали (DARK по умолчанию) ── */
  --bg:#07090c;            /* фон приложения */
  --bg-soft:#0c0f14;       /* сайдбары/полосы */
  --panel:#10141a;         /* карточки/панели */
  --panel-2:#171c24;       /* вложенные поля */
  --panel-3:#1e242e;       /* hover/активные */
  --line:rgba(255,255,255,.07);
  --line-2:rgba(255,255,255,.13);
  --line-3:rgba(255,255,255,.20);
  --text:#eaf0f2;          /* основной текст */
  --text-2:#b9c2cc;        /* вторичный */
  --muted:#7f8a98;         /* приглушённый */
  --on-accent:#04130d;     /* текст на акцентной заливке (тёмный — изумруд светлый) */

  /* семантика */
  --ok:#22c79a; --warn:#ffb84d; --danger:#ff6b81; --danger-soft:rgba(255,107,129,.14);

  /* ── Типографика ── */
  --font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,system-ui,sans-serif;
  --font-mono:ui-monospace,'SF Mono',SFMono-Regular,Menlo,Consolas,monospace;
  --fs-xs:.72rem; --fs-sm:.82rem; --fs-md:.92rem; --fs-base:1rem;
  --fs-lg:1.12rem; --fs-xl:1.4rem; --fs-2xl:1.9rem; --fs-3xl:2.6rem;
  --fw-normal:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700;
  --lh-tight:1.2; --lh-base:1.5; --lh-relaxed:1.65;
  --ls-tight:-.02em; --ls-base:0; --ls-wide:.04em;

  /* ── Spacing (4-base) ── */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px;
  --sp-6:24px; --sp-7:32px; --sp-8:48px; --sp-9:64px;

  /* ── Radius ── */
  --r-sm:8px; --r-md:12px; --r-lg:16px; --r-xl:22px; --r-full:999px;

  /* ── Shadow ── */
  --sh-sm:0 1px 3px rgba(0,0,0,.3);
  --sh-md:0 8px 24px rgba(0,0,0,.4);
  --sh-lg:0 24px 70px rgba(0,0,0,.55);
  --sh-glow:0 8px 26px var(--glow);

  /* ── Motion ── */
  --ease:cubic-bezier(.4,0,.2,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --dur-fast:.12s; --dur-base:.2s; --dur-slow:.4s;

  /* ── Layout ── */
  --side-w:66px;
  --cmd-max:840px;
  --z-nav:20; --z-cmd:40; --z-modal:1080; --z-lightbox:1150; --z-toast:1200;
}

/* ── LIGHT THEME ── */
[data-theme="light"]{
  --bg:#f5f7f9;
  --bg-soft:#ffffff;
  --panel:#ffffff;
  --panel-2:#f0f3f6;
  --panel-3:#e6eaef;
  --line:rgba(0,0,0,.08);
  --line-2:rgba(0,0,0,.14);
  --line-3:rgba(0,0,0,.22);
  --text:#11161b;
  --text-2:#3c4651;
  --muted:#697483;
  --on-accent:#ffffff;
  --glow:rgba(34,199,154,.30);
  --glow-soft:rgba(34,199,154,.12);
  --sh-sm:0 1px 3px rgba(0,0,0,.08);
  --sh-md:0 8px 24px rgba(0,0,0,.10);
  --sh-lg:0 24px 60px rgba(0,0,0,.16);
}

/* Уважение к prefers-reduced-motion */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}