/* tokens.css — design C «Диспетчерская». Active ONLY under :root.ui-c (class is set by shell.js).
   Must be linked right AFTER the inline <style> of index.html (equal specificity with the old dark theme → order wins).
   Source: pf-private/redesign/c-control.html «BEGIN tokens.css … END tokens.css», scoped to :root.ui-c. */
:root.ui-c{
  /* type */
  --font-ui:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Consolas,monospace;
  --wdth-dense:88%;
  --fw-regular:400; --fw-medium:500; --fw-semibold:600;
  --fs-xs:11px; --fs-sm:12px; --fs-md:13px; --fs-lg:14px; --fs-xl:16px; --fs-2xl:20px; --fs-3xl:28px;
  --fs-input:13px;
  --lh:1.45; --lh-tight:1.2; --ls-num:-.02em;
  /* space 4px grid */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:20px; --s-6:24px; --s-8:32px;
  /* shape: exactly three radii */
  --r-sm:4px; --r-md:6px; --r-lg:8px;
  /* density: desktop compact */
  --ctl-h:30px; --row-h:34px; --tab-h:48px; --topbar-h:48px;
  --sidebar-w:236px; --rail-w:56px; --bottombar-h:56px;
  /* shell helpers */
  --safe-t:env(safe-area-inset-top,0px); --safe-b:env(safe-area-inset-bottom,0px);
  --ui-top-h:calc(var(--topbar-h) + var(--safe-t));
  --z-sb:40; --z-top:45; --z-bb:45; --z-fab:50; --z-scrim:1200; --z-drw:1201; --z-pal:1202; --z-toast:10002;
  /* motion */
  --ease:cubic-bezier(.2,.8,.2,1); --t-fast:140ms; --t-panel:220ms;

  /* colour · DARK (default) */
  color-scheme:dark;
  --canvas:#0B0D0E; --surface:#121517; --surface-2:#191D20; --surface-3:#20252A; --raise:#22282D; --field:#0E1113;
  --border:#262B30; --border-soft:#1C2024; --border-strong:#343B42; --border-input:#5F6973;
  --text:#E6EAED; --text-2:#9AA3AB; --text-3:#7E8892;
  --accent:#C6D63F; --on-accent:#0B0D0E;
  --fill:#C6D63F; --fill-hover:#D4E35C; --fill-border:#C6D63F; --on-fill:#0B0D0E;
  --ok:#45C27A;   --ok-bg:#11251A;
  --warn:#F0A93B; --warn-bg:#2B200D;
  --crit:#FF6B5B; --crit-bg:#321614; --on-crit:#0B0D0E;
  --info:#4FB3D9; --info-bg:#0F2430;
  --ai:#A99CFF;   --ai-bg:#221E3A;
  --scrim:rgb(0 0 0 / .55);
  --shadow-pop:0 18px 48px -12px rgb(0 0 0 / .6);
  --accent-soft:color-mix(in srgb,var(--accent) 13%,transparent);
  --accent-line:color-mix(in srgb,var(--accent) 45%,transparent);
  --chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239AA3AB' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  --tick:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B0D0E' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");

  /* old variables → aliases (contract §1.3). Same-name tokens (--border --text --accent --on-accent --ok* --warn* --info* --ai*) need no alias. */
  --bg:var(--canvas); --panel:var(--surface); --panel2:var(--surface-2); --muted-bg:var(--surface-3);
  --text-dim:var(--text-2);
  --accent2:var(--fill-hover); --accent-dim:var(--accent);
  --err:var(--crit); --err-bg:var(--crit-bg);
  --brand-brown:var(--text); --brand-olive:var(--text-3); --brand-green:var(--fill); --brand-green2:var(--fill-hover); --brand-orange:var(--warn);
  --radius:var(--r-lg);
  font-family:var(--font-ui);
}
/* colour · LIGHT (OS preference, unless user forced dark) */
@media (prefers-color-scheme:light){:root.ui-c:not([data-theme="dark"]){
  color-scheme:light;
  --canvas:#F3F5F6; --surface:#FFFFFF; --surface-2:#EEF1F3; --surface-3:#E3E8EB; --raise:#FFFFFF; --field:#FFFFFF;
  --border:#DDE2E6; --border-soft:#E9EDF0; --border-strong:#C5CDD3; --border-input:#848D95;
  --text:#111417; --text-2:#4F5A63; --text-3:#606B74;
  --accent:#566300; --on-accent:#FFFFFF;
  --fill:#C6D63F; --fill-hover:#B9C933; --fill-border:#A6B52A; --on-fill:#111417;
  --ok:#18794E; --ok-bg:#E4F4EC; --warn:#9A5500; --warn-bg:#FCF0DC;
  --crit:#C2302A; --crit-bg:#FCE9E7; --on-crit:#FFFFFF;
  --info:#0B6A94; --info-bg:#E3F2F9; --ai:#5B4BC4; --ai-bg:#EFECFC;
  --scrim:rgb(17 20 23 / .32); --shadow-pop:0 18px 40px -12px rgb(17 20 23 / .22);
  --chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234F5A63' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  --tick:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}}
/* colour · LIGHT (manual switch, pf_theme = light) — same values as the block above */
:root.ui-c[data-theme="light"]{
  color-scheme:light;
  --canvas:#F3F5F6; --surface:#FFFFFF; --surface-2:#EEF1F3; --surface-3:#E3E8EB; --raise:#FFFFFF; --field:#FFFFFF;
  --border:#DDE2E6; --border-soft:#E9EDF0; --border-strong:#C5CDD3; --border-input:#848D95;
  --text:#111417; --text-2:#4F5A63; --text-3:#606B74;
  --accent:#566300; --on-accent:#FFFFFF;
  --fill:#C6D63F; --fill-hover:#B9C933; --fill-border:#A6B52A; --on-fill:#111417;
  --ok:#18794E; --ok-bg:#E4F4EC; --warn:#9A5500; --warn-bg:#FCF0DC;
  --crit:#C2302A; --crit-bg:#FCE9E7; --on-crit:#FFFFFF;
  --info:#0B6A94; --info-bg:#E3F2F9; --ai:#5B4BC4; --ai-bg:#EFECFC;
  --scrim:rgb(17 20 23 / .32); --shadow-pop:0 18px 40px -12px rgb(17 20 23 / .22);
  --chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234F5A63' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  --tick:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}
/* density · TOUCH (phones and coarse pointers: 44px controls, 16px inputs = no iOS zoom) */
@media (max-width:599px),(pointer:coarse){:root.ui-c{
  --fs-xs:12px; --fs-sm:13px; --fs-md:15px; --fs-lg:16px; --fs-xl:17px; --fs-2xl:20px; --fs-3xl:24px; --fs-input:16px;
  --ctl-h:44px; --row-h:52px; --tab-h:44px; --topbar-h:52px;
}}
@media (prefers-reduced-motion:reduce){:root.ui-c{--t-fast:0ms;--t-panel:0ms}}
