:root {
  /* Базовая палитра поверхностей (Dark по умолчанию) */
  --bg: #0c0e13;
  --surface: #161a21;
  --surface-2: #1e232c;
  --line: rgba(255, 255, 255, 0.09);
  --line-2: rgba(255, 255, 255, 0.055);
  --ink: #eef1f5;
  --ink-2: #a6aeba;
  --ink-3: #6f7884;

  /* Семантические цвета */
  --green: #4eb583;
  --green-ink: #8fdcae;
  --green-bg: rgba(46, 140, 90, 0.22);
  --red: #e67e6f;
  --red-bg: rgba(224, 122, 108, 0.18);
  --amber: #d9a646;
  --amber-bg: rgba(217, 164, 67, 0.18);
  --blue: #86a8ee;
  --blue-bg: rgba(134, 168, 238, 0.18);

  /* Плашки маркетплейсов */
  --p-wb: #b79ee0;
  --p-wb-bg: rgba(154, 120, 196, 0.22);
  --p-ozon: #7aa7df;
  --p-ozon-bg: rgba(79, 130, 200, 0.22);
  --p-ya: #d8b15a;
  --p-ya-bg: rgba(200, 150, 40, 0.22);

  /* Контраст-чип */
  --chip: #eef1f5;
  --chip-ink: #15171c;
  --chip-hover: #dfe4ea;

  /* Радиусы */
  --r-s: 8px;
  --r-m: 12px;
  --r-l: 16px;
  --r-island-s: 20px;
  --r-island: 26px;

  /* Тени */
  --shadow-s: 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 1px rgba(0, 0, 0, 0.2);
  --shadow-m: 0 4px 20px rgba(0, 0, 0, 0.35), 0 1px 3px rgba(0, 0, 0, 0.2);
  --shadow-pop: 0 16px 48px rgba(0, 0, 0, 0.55), 0 2px 8px rgba(0, 0, 0, 0.3);

  /* Liquid Glass */
  --glass: rgba(26, 30, 38, 0.55);
  --glass-strong: rgba(26, 30, 38, 0.72);
  --glass-2: rgba(26, 30, 38, 0.45);
  --glass-border: rgba(255, 255, 255, 0.13);
  --glass-blur: saturate(160%) blur(24px);
  --glass-shadow: 0 16px 46px rgba(0, 0, 0, 0.5), 0 3px 12px rgba(0, 0, 0, 0.4);
  --glass-inset: inset 0 1px 0 rgba(255, 255, 255, 0.14), inset 0 0 0 1px rgba(255, 255, 255, 0.05);
  --glass-active: rgba(255, 255, 255, 0.11);
  --hair-glass: rgba(255, 255, 255, 0.13);

  /* Шрифты */
  --sans: 'Golos Text', system-ui, -apple-system, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, monospace;

  /* Совместимость с предыдущими переменными */
  --accent: var(--amber);
  --accent-dim: var(--amber-bg);
  --border: var(--line);
  --border2: var(--line-2);
  --text: var(--ink);
  --muted: var(--ink-2);
  --muted2: var(--ink-3);
  --danger: var(--red);
  --danger-dim: var(--red-bg);
}

/* Поддержка светлой темы */
html[data-theme="light"] {
  --bg: #eef0f2;
  --surface: #ffffff;
  --surface-2: #f7f8f9;
  --line: #e6e8ea;
  --line-2: #eef0f1;
  --ink: #0f1115;
  --ink-2: #5b606b;
  --ink-3: #969ba5;

  --green: #1f7a4d;
  --green-ink: #176038;
  --green-bg: #eaf4ee;
  --red: #c0473a;
  --red-bg: #faecea;
  --amber: #b07d1e;
  --amber-bg: #f7efdc;
  --blue: #3a5db0;

  --p-wb: #6a4d8f;
  --p-wb-bg: #f0ebf6;
  --p-ozon: #2f6fb0;
  --p-ozon-bg: #e8f0f8;
  --p-ya: #a07410;
  --p-ya-bg: #f7efda;

  --chip: #0f1115;
  --chip-ink: #ffffff;
  --chip-hover: #23262d;

  --shadow-s: 0 1px 2px rgba(15, 17, 21, 0.04), 0 1px 1px rgba(15, 17, 21, 0.03);
  --shadow-m: 0 4px 16px rgba(15, 17, 21, 0.06), 0 1px 3px rgba(15, 17, 21, 0.04);
  --shadow-pop: 0 12px 40px rgba(15, 17, 21, 0.14), 0 2px 8px rgba(15, 17, 21, 0.08);

  --glass: rgba(255, 255, 255, 0.50);
  --glass-strong: rgba(255, 255, 255, 0.64);
  --glass-2: rgba(255, 255, 255, 0.40);
  --glass-border: rgba(255, 255, 255, 0.72);
  --glass-blur: saturate(180%) blur(22px);
  --glass-shadow: 0 14px 40px rgba(15, 17, 21, 0.13), 0 3px 10px rgba(15, 17, 21, 0.06);
  --glass-inset: inset 0 1px 0 rgba(255, 255, 255, 0.85), inset 0 0 0 1px rgba(255, 255, 255, 0.18);
  --glass-active: rgba(255, 255, 255, 0.72);
  --hair-glass: rgba(15, 17, 21, 0.10);
}
