/* FulSystem · токены панелей. Три темы: dark (по умолчанию), dim, light.
   Тема меню задаётся отдельно атрибутом data-side-theme на сайдбаре. */

:root, [data-theme="dark"]{
  --bg:#1F2126; --surface:#2A2E34; --panel:#24272C; --node:#252A31; --elev:#32363D;
  --border:#3B4048; --border-2:#3B4048; --border-soft:#2F3339;
  --head:#1A1C20; --deep:#16181C; --track:#32363D;
  --side:#16181C; --side-text:#FFFFFF; --side-text-2:#C4CAD3; --side-muted:#8A96A3;
  --side-border:#2F3339; --side-dot:#4A5058; --side-active:#22252A; --side-fg-active:#FFFFFF;
  --text:#E9EDF2; --text-2:#9AA4B0; --text-3:#8A96A3;
  --blue:#0078D4; --blue-hover:#0069BE; --blue-text:#4DAAFC; --blue-soft:rgba(0,120,212,.16);
  --link:#4DAAFC; --link-hover:#7FC2FF;
  --ok:#3FB950; --warn:#FFB000; --err:#F14C4C; --off:#5C646E; --line:#3B4048;
  --sk-a:#31353B; --sk-b:#2C3036; --grid-line:rgba(0,120,212,.10);
  --edge-top:inset 0 1px 0 rgba(255,255,255,.07);
  --shadow-1:0 2px 6px rgba(0,0,0,.34), 0 18px 34px -12px rgba(0,0,0,.56);
  --shadow-2:0 5px 12px rgba(0,0,0,.40), 0 26px 48px -14px rgba(0,0,0,.64);
  --shadow-3:0 10px 22px rgba(0,0,0,.46), 0 42px 74px -18px rgba(0,0,0,.72);
}
[data-theme="dim"]{
  --bg:#33383F; --surface:#3C424A; --panel:#444A53; --node:#444A53; --elev:#515863;
  --border:#555D68; --border-2:#616974; --border-soft:#4B525B;
  --head:#2D323A; --deep:#2D323A; --track:#515863;
  --side:#2D323A; --side-text:#F5F8FA; --side-text-2:#D4DCE4; --side-muted:#B1BBC6;
  --side-border:#4B525B; --side-dot:#6B747F; --side-active:#3A404A; --side-fg-active:#FFFFFF;
  --text:#F5F8FA; --text-2:#C1CAD5; --text-3:#B1BBC6;
  --blue-text:#95CDFF; --blue-soft:rgba(0,120,212,.26);
  --link:#95CDFF; --link-hover:#C0E2FF;
  --ok:#66D77A; --warn:#FFC95C; --err:#F97C7C; --off:#868F9B; --line:#616974;
  --sk-a:#515863; --sk-b:#4B525B; --grid-line:rgba(0,120,212,.16);
  --edge-top:inset 0 1px 0 rgba(255,255,255,.09);
  --shadow-1:0 2px 6px rgba(0,0,0,.30), 0 18px 34px -12px rgba(0,0,0,.48);
  --shadow-2:0 5px 12px rgba(0,0,0,.36), 0 26px 48px -14px rgba(0,0,0,.56);
  --shadow-3:0 10px 22px rgba(0,0,0,.42), 0 42px 74px -18px rgba(0,0,0,.64);
}
[data-theme="light"]{
  --bg:#F3F4F5; --surface:#FFFFFF; --panel:#ECEDEE; --node:#FFFFFF; --elev:#F9FAFA;
  --border:#DEDFE0; --border-2:#CDCFD0; --border-soft:#E9EAEB;
  --head:#FAFBFB; --deep:#16181C; --track:#E4E5E6;
  --side:#FAFBFB; --side-text:#16181C; --side-text-2:#4A545F; --side-muted:#4A545F;
  --side-border:#DEDFE0; --side-dot:#C4C6C7; --side-active:#EBECED; --side-fg-active:#16181C;
  --text:#16181C; --text-2:#4A545F; --text-3:#5A6472;
  --blue-text:#005A9E; --blue-soft:rgba(0,120,212,.10);
  --link:#005A9E; --link-hover:#0078D4;
  --ok:#1A7F37; --warn:#9A6700; --err:#C4342F; --off:#8A96A3; --line:#C4CAD3;
  --sk-a:#E6E7E8; --sk-b:#EFF0F1; --grid-line:rgba(0,120,212,.08);
  --edge-top:none;
  --shadow-1:0 1px 3px rgba(19,26,38,.09), 0 10px 20px -8px rgba(19,26,38,.20);
  --shadow-2:0 3px 8px rgba(19,26,38,.12), 0 17px 33px -12px rgba(19,26,38,.28);
  --shadow-3:0 7px 16px rgba(19,26,38,.15), 0 31px 57px -18px rgba(19,26,38,.38);
  --shadow-ctl:none;
}

/* Светлая тема: карточки получают тень уровня 1 автоматически.
   Кнопки, поля и ячейки таблиц остаются плоскими: у них нет радиуса 10–14 px.
   Селекторы даны в двух написаниях — как в исходнике и как их нормализует React. */
[data-theme="light"] [style*="border-radius: 10px"][style*="background: var(--surface)"],
[data-theme="light"] [style*="border-radius: 12px"][style*="background: var(--surface)"],
[data-theme="light"] [style*="border-radius: 14px"][style*="background: var(--surface)"],
[data-theme="light"] [style*="border-radius: 10px"][style*="background: var(--panel)"],
[data-theme="light"] [style*="border-radius: 12px"][style*="background: var(--panel)"],
[data-theme="light"] [style*="border-radius:10px"][style*="background:var(--surface)"],
[data-theme="light"] [style*="border-radius:12px"][style*="background:var(--surface)"],
[data-theme="light"] [style*="border-radius:14px"][style*="background:var(--surface)"],
[data-theme="light"] [style*="border-radius:10px"][style*="background:var(--panel)"],
[data-theme="light"] [style*="border-radius:12px"][style*="background:var(--panel)"]{
  box-shadow:var(--shadow-1);
}
[data-theme="light"] [style*="border-radius: 14px"][style*="background: var(--bg)"],
[data-theme="light"] [style*="border-radius:14px"][style*="background:var(--bg)"]{
  box-shadow:var(--shadow-2);
}
[data-theme="light"] header[style*="position: sticky"],
[data-theme="light"] header[style*="position:sticky"]{
  box-shadow:0 1px 0 var(--border), 0 6px 15px -9px rgba(19,26,38,.24);
}
[data-theme="dim"] header[style*="position: sticky"],
[data-theme="dim"] header[style*="position:sticky"]{
  box-shadow:0 1px 0 var(--border), 0 11px 28px -10px rgba(0,0,0,.52);
}
[data-theme="dark"] header[style*="position: sticky"],
[data-theme="dark"] header[style*="position:sticky"]{
  box-shadow:0 1px 0 var(--border), 0 11px 28px -10px rgba(0,0,0,.66);
}

/* Кнопки, поля и строки таблиц плоские: объём несут карточки и слои поверх страницы. */
[data-theme="light"] button:active{
  transform:translateY(1px);
}
[data-theme="light"] input:focus,
[data-theme="light"] select:focus,
[data-theme="light"] textarea:focus{
  box-shadow:0 0 0 2px rgba(0,120,212,.28);
}
/* Строка таблицы отзывается подсветкой, без тени. */
[data-theme="light"] [data-row]:hover,
[data-theme="light"] [data-row][data-active="1"]{
  background:var(--elev);
}

/* Отклик плиток и карточек: подъём, синяя граница, тень на ступень выше.
   Селекторы продублированы с пробелом и без — движок нормализует инлайн-стили. */
[style*="border-radius: 8px"][style*="background: var(--surface)"],
[style*="border-radius:8px"][style*="background:var(--surface)"],
[style*="border-radius: 10px"][style*="background: var(--surface)"],
[style*="border-radius:10px"][style*="background:var(--surface)"],
[style*="border-radius: 12px"][style*="background: var(--surface)"],
[style*="border-radius:12px"][style*="background:var(--surface)"],
[style*="border-radius: 10px"][style*="background: var(--panel)"],
[style*="border-radius:10px"][style*="background:var(--panel)"]{
  transition:transform .26s cubic-bezier(.16,1,.3,1), box-shadow .26s ease, border-color .18s ease;
}
[style*="border-radius: 8px"][style*="background: var(--surface)"]:hover,
[style*="border-radius:8px"][style*="background:var(--surface)"]:hover,
[style*="border-radius: 10px"][style*="background: var(--surface)"]:hover,
[style*="border-radius:10px"][style*="background:var(--surface)"]:hover,
[style*="border-radius: 12px"][style*="background: var(--surface)"]:hover,
[style*="border-radius:12px"][style*="background:var(--surface)"]:hover,
[style*="border-radius: 10px"][style*="background: var(--panel)"]:hover,
[style*="border-radius:10px"][style*="background:var(--panel)"]:hover{
  transform:translateY(-2px);
  border-color:var(--blue)!important;
  box-shadow:var(--edge-top), var(--shadow-2);
}
/* Плитки KPI внутри сетки с общей рамкой: у них своего радиуса нет. */
[data-tile]{transition:background-color .2s ease, transform .26s cubic-bezier(.16,1,.3,1);}
[data-tile]:hover{background:var(--elev); transform:translateY(-1px);}

/* Карточки, размеченные атрибутом, ведут себя так же. */
[data-card]{transition:transform .26s cubic-bezier(.16,1,.3,1), box-shadow .26s ease, border-color .18s ease;}
[data-card]:hover{transform:translateY(-2px); border-color:var(--blue)!important; box-shadow:var(--edge-top), var(--shadow-2);}

/* Ссылки: цвет из темы, иначе на светлой теме они нечитаемы. */
body a{color:var(--link);}
body a:hover{color:var(--link-hover);}

/* Пункты меню: без плиток. Отклик — синяя полоса слева, сдвиг и подсветка текста.
   Работает и когда пункт вложен в обёртку группы. Круглые и пилюльные кнопки
   в подвале меню (темы, режим) правилом не затрагиваются. */
aside button:not([style*="border-radius:50%"]):not([style*="border-radius: 50%"]):not([style*="border-radius:999px"]):not([style*="border-radius: 999px"]){
  position:relative;
  background:transparent !important;
  box-shadow:none !important;
  border:none !important;
  border-radius:6px !important;
  transition:transform .2s cubic-bezier(.16,1,.3,1), color .18s ease, background-color .18s ease;
}
aside button:not([style*="border-radius:50%"]):not([style*="border-radius: 50%"]):not([style*="border-radius:999px"]):not([style*="border-radius: 999px"])::before{
  content:"";
  position:absolute; left:0; top:7px; bottom:7px; width:3px;
  border-radius:2px; background:var(--blue);
  transform:scaleY(0);
  transition:transform .24s cubic-bezier(.16,1,.3,1);
}
aside button:not([style*="border-radius:50%"]):not([style*="border-radius: 50%"]):not([style*="border-radius:999px"]):not([style*="border-radius: 999px"]):hover{
  transform:translateX(3px);
  background:var(--side-active) !important;
}
aside button:not([style*="border-radius:50%"]):not([style*="border-radius: 50%"]):not([style*="border-radius:999px"]):not([style*="border-radius: 999px"]):hover::before{ transform:scaleY(1); }
aside button:focus-visible{
  outline:2px solid var(--blue);
  outline-offset:1px;
}
aside button[style*="rgba(0,120,212"]:not([data-swatch]),
aside button[style*="rgba(0, 120, 212"]:not([data-swatch]),
aside button[style*="--side-active"]:not([data-swatch]){
  background:var(--side-active) !important;
  color:var(--side-fg-active) !important;
}
aside button[style*="rgba(0,120,212"]:not([data-swatch])::before,
aside button[style*="rgba(0, 120, 212"]:not([data-swatch])::before,
aside button[style*="--side-active"]:not([data-swatch])::before{ transform:scaleY(1); }
@media (prefers-reduced-motion:reduce){
  aside button, aside button::before{ transition:none; }
  aside button:hover{ transform:none; }
}

/* Боковое меню: на светлой теме отделяется тенью вправо. */
[data-theme="light"] aside,
[data-side-theme="light"]{
  box-shadow:1px 0 0 var(--side-border), 6px 0 15px -9px rgba(19,26,38,.24);
  position:relative;
  z-index:5;
}
[data-theme="dim"] aside{
  box-shadow:1px 0 0 var(--side-border), 11px 0 28px -10px rgba(0,0,0,.52);
  position:relative;
  z-index:5;
}
[data-theme="dark"] aside{
  box-shadow:1px 0 0 var(--side-border), 11px 0 28px -10px rgba(0,0,0,.66);
  position:relative;
  z-index:5;
}

[data-side-theme="dark"]{
  --side:#16181C; --side-text:#FFFFFF; --side-text-2:#C4CAD3; --side-muted:#8A96A3;
  --side-border:#2F3339; --side-dot:#4A5058; --side-active:#22252A; --side-fg-active:#FFFFFF;
}
[data-side-theme="dim"]{
  --side:#2D323A; --side-text:#F5F8FA; --side-text-2:#D4DCE4; --side-muted:#B1BBC6;
  --side-border:#4B525B; --side-dot:#6B747F; --side-active:#3A404A; --side-fg-active:#FFFFFF;
}
[data-side-theme="light"]{
  --side:#FAFBFB; --side-text:#16181C; --side-text-2:#4A545F; --side-muted:#4A545F;
  --side-border:#DEDFE0; --side-dot:#C4C6C7; --side-active:#EBECED; --side-fg-active:#16181C;
}

/* Клавиатурный фокус: видимая рамка только при навигации с клавиатуры */
button:focus-visible,
input:focus-visible,
select:focus-visible,
a:focus-visible,
[tabindex]:focus-visible{
  outline:2px solid #0078D4;
  outline-offset:2px;
  border-radius:4px;
}
[data-row]:focus-visible,
[data-node]:focus-visible{
  outline:2px solid #0078D4;
  outline-offset:-2px;
}

/* Глубина: карточки — уровень 1 плюс световая линия сверху (в светлой теме она none).
   Кнопки, поля и строки таблиц тени не получают. */
[data-card]{box-shadow:var(--edge-top), var(--shadow-1);}
[data-layer="2"]{box-shadow:var(--edge-top), var(--shadow-2);}
[data-layer="3"]{box-shadow:var(--edge-top), var(--shadow-3);}

/* ── Акцент ────────────────────────────────────────────────────────────
   Атрибут data-accent на том же элементе, что и data-theme.
   Меняет только цвет действия: кнопки, ссылки, активный пункт меню,
   фокус, сетку канваса. Статусные цвета и палитра данных не меняются.
   Без атрибута — синий #0078D4. */

[data-accent="blue"]{
  --acc:#0078D4; --acc-hover:#0069BE; --acc-rgb:0,120,212;
  --acc-btn:#0078D4; --acc-btn-hover:#0069BE;
  --acc-on-light:#005A9E; --acc-on-dim:#95CDFF; --acc-on-dark:#4DAAFC; --acc-on-dark-hover:#7FC2FF;
}
[data-accent="duo"]{
  --acc:#4B5FD0; --acc-hover:#3D4FB8; --acc-rgb:75,95,208;
  --acc-btn:#0078D4; --acc-btn-hover:#0069BE;
  --acc-on-light:#3D4FB8; --acc-on-dim:#AAB7FF; --acc-on-dark:#8395F5; --acc-on-dark-hover:#AAB7FF;
}
[data-accent="indigo"]{
  --acc:#4B5FD0; --acc-hover:#3D4FB8; --acc-rgb:75,95,208;
  --acc-btn:#0078D4; --acc-btn-hover:#0069BE;
  --acc-on-light:#3D4FB8; --acc-on-dim:#AAB7FF; --acc-on-dark:#8395F5; --acc-on-dark-hover:#AAB7FF;
}
[data-accent="indigo-light"]{
  --acc:#6C7FE8; --acc-hover:#5A6DDB; --acc-rgb:131,149,245;
  --acc-btn:#0078D4; --acc-btn-hover:#0069BE;
  --acc-on-light:#4757C4; --acc-on-dim:#BFC8FF; --acc-on-dark:#A9B6FF; --acc-on-dark-hover:#C9D1FF;
}
/* violet — старое имя, оставлено псевдонимом: фиолетовый теперь один */
[data-accent="violet"],
[data-accent="violet-full"]{
  --acc:#6152C9; --acc-hover:#5344AF; --acc-rgb:97,82,201;
  --acc-btn:#6152C9; --acc-btn-hover:#5344AF;
  --acc-on-light:#5344AF; --acc-on-dim:#BDB4FF; --acc-on-dark:#A79CF5; --acc-on-dark-hover:#C4BCFF;
}
[data-accent="teal"]{
  --acc:#0E8A8A; --acc-hover:#0B7373; --acc-rgb:14,138,138;
  --acc-btn:#0078D4; --acc-btn-hover:#0069BE;
  --acc-on-light:#0B6E6E; --acc-on-dim:#5FE0E0; --acc-on-dark:#2CC4C4; --acc-on-dark-hover:#5FE0E0;
}
/* Палитра TecMachinery: бирюза #00E5FF на графите */
[data-accent="cyan"]{
  --acc:#00B8D4; --acc-hover:#0098B0; --acc-rgb:0,184,212;
  --acc-btn:#0078D4; --acc-btn-hover:#0069BE;
  --acc-on-light:#046B7C; --acc-on-dim:#5FE7F7; --acc-on-dark:#2ED4EC; --acc-on-dark-hover:#6FEBFA;
}
[data-accent="cyan-full"]{
  --acc:#00B8D4; --acc-hover:#0098B0; --acc-rgb:0,184,212;
  --acc-btn:#0098B0; --acc-btn-hover:#00808F;
  --acc-on-light:#046B7C; --acc-on-dim:#5FE7F7; --acc-on-dark:#2ED4EC; --acc-on-dark-hover:#6FEBFA;
}
/* Тёплые: рядом со статусами — статус подписываем словом */
[data-accent="orange"]{
  --acc:#E2681C; --acc-hover:#C25612; --acc-rgb:226,104,28;
  --acc-btn:#0078D4; --acc-btn-hover:#0069BE;
  --acc-on-light:#A9500F; --acc-on-dim:#FFB574; --acc-on-dark:#F79A50; --acc-on-dark-hover:#FFC08A;
}
[data-accent="red"]{
  --acc:#C90A15; --acc-hover:#AC0811; --acc-rgb:201,10,21;
  --acc-btn:#0078D4; --acc-btn-hover:#0069BE;
  --acc-on-light:#AC0811; --acc-on-dim:#FF9099; --acc-on-dark:#FF858E; --acc-on-dark-hover:#FFAAB1;
}
[data-accent="red-full"]{
  --acc:#C90A15; --acc-hover:#AC0811; --acc-rgb:201,10,21;
  --acc-btn:#C90A15; --acc-btn-hover:#AC0811;
  --acc-on-light:#AC0811; --acc-on-dim:#FF9099; --acc-on-dark:#FF858E; --acc-on-dark-hover:#FFAAB1;
}
[data-accent="orange-full"]{
  --acc:#E2681C; --acc-hover:#C25612; --acc-rgb:226,104,28;
  --acc-btn:#D35F16; --acc-btn-hover:#B44E0E;
  --acc-on-light:#A9500F; --acc-on-dim:#FFB574; --acc-on-dark:#F79A50; --acc-on-dark-hover:#FFC08A;
}
[data-accent="green-full"]{
  --acc:#2E9E5B; --acc-hover:#26834B; --acc-rgb:46,158,91;
  --acc-btn:#2A8F52; --acc-btn-hover:#227544;
  --acc-on-light:#1F7A45; --acc-on-dim:#7BE49B; --acc-on-dark:#4CC276; --acc-on-dark-hover:#7BE49B;
}
[data-accent="teal-full"]{
  --acc:#0E8A8A; --acc-hover:#0B7373; --acc-rgb:14,138,138;
  --acc-btn:#0E8A8A; --acc-btn-hover:#0B7373;
  --acc-on-light:#0B6E6E; --acc-on-dim:#5FE0E0; --acc-on-dark:#2CC4C4; --acc-on-dark-hover:#5FE0E0;
}
[data-accent="green"]{
  --acc:#2E9E5B; --acc-hover:#26834B; --acc-rgb:46,158,91;
  --acc-btn:#0078D4; --acc-btn-hover:#0069BE;
  --acc-on-light:#005A9E; --acc-on-dim:#95CDFF; --acc-on-dark:#4DAAFC; --acc-on-dark-hover:#7FC2FF;
}
[data-accent="green-indigo"]{
  --acc:#2E9E5B; --acc-hover:#26834B; --acc-rgb:46,158,91;
  --acc-btn:#0078D4; --acc-btn-hover:#0069BE;
  --acc-on-light:#3D4FB8; --acc-on-dim:#AAB7FF; --acc-on-dark:#8395F5; --acc-on-dark-hover:#AAB7FF;
}
/* Полные режимы: меняют и заливку кнопок, и логотип */
[data-accent="indigo-full"]{
  --acc:#4B5FD0; --acc-hover:#3D4FB8; --acc-rgb:75,95,208;
  --acc-btn:#4B5FD0; --acc-btn-hover:#3D4FB8;
  --acc-on-light:#3D4FB8; --acc-on-dim:#AAB7FF; --acc-on-dark:#8395F5; --acc-on-dark-hover:#AAB7FF;
}

[data-accent]{
  --blue:var(--acc-btn); --blue-hover:var(--acc-btn-hover);
  --accent:var(--acc); --accent-soft:rgba(var(--acc-rgb),.16); --accent-line:rgba(var(--acc-rgb),.36);
  --blue-text:var(--acc-on-dark); --blue-soft:rgba(var(--acc-rgb),.16);
  --link:var(--acc-on-dark); --link-hover:var(--acc-on-dark-hover);
  --grid-line:rgba(var(--acc-rgb),.10);
}
[data-theme="dim"][data-accent]{
  --blue-text:var(--acc-on-dim); --blue-soft:rgba(var(--acc-rgb),.26);
  --link:var(--acc-on-dim); --link-hover:var(--acc-on-dark-hover);
  --grid-line:rgba(var(--acc-rgb),.16);
}
[data-theme="light"][data-accent]{
  --blue-text:var(--acc-on-light); --blue-soft:rgba(var(--acc-rgb),.10);
  --accent-soft:rgba(var(--acc-rgb),.12); --accent-line:rgba(var(--acc-rgb),.30);
  --link:var(--acc-on-light); --link-hover:var(--acc);
  --grid-line:rgba(var(--acc-rgb),.08);
}

/* Плитки и капсовые метки читают акцент */
[data-tile]{
  background:var(--accent-soft); border-color:var(--accent-line); color:var(--accent);
}
[data-tile]:hover{border-color:var(--accent);}

/* Логотип меняется только в полных режимах — он и так стоит на var(--blue) */

/* Палитра данных: графики, схемы, дашборды, иллюстрации блога.
   В панелях применяется к рядам, узлам карты, меткам, тегам и легендам.
   Кнопки, ссылки, активный пункт меню и фокус остаются синими,
   статусы — только статусными цветами. */
:root{
  --data-1:#3FA0F0; --data-2:#4CC276; --data-3:#2CC4C4;
  --data-4:#E5A32E; --data-5:#E58063; --data-6:#8395F5; --data-0:#7C8794;
  --data-7:#2ED4EC; --data-8:#F79A50; --data-9:#C4A6FF;
}
[data-theme="light"]{
  --data-1:#0078D4; --data-2:#2E9E5B; --data-3:#0E8A8A;
  --data-4:#9A6E00; --data-5:#BC5539; --data-6:#4B5FD0; --data-0:#8A96A3;
  --data-7:#00B8D4; --data-8:#E2681C; --data-9:#6152C9;
}

/* Плотность таблиц: обычная 44 px, компактная 32 px */
[data-density="compact"] [data-row] > div{padding-top:5px;padding-bottom:5px;}
[data-density="compact"] [data-row] [data-sub]{display:none;}
[data-density="compact"] [data-head] > div{padding-top:6px;padding-bottom:6px;}
