/* =====================================================================
   СЛЕД · дизайн-система «Трасса»
   Графитовая рабочая среда (по умолчанию) и светлая «бумажная» тема
   (переключатель в шапке; печать и PDF всегда светлые).
   Правила цвета:
   - медь (--accent) — только выбор, фокус и след выбранной машины; не статус;
   - статус передаётся цветом И знаком: ● норма, ■ инфо, ▲ внимание, ◆ критично,
     ◌ устарело / нет связи, ? неизвестно;
   - контраст: текст ≥ 4,5:1 на bg/surface/raised/sunken/hover обеих тем, статусы — и на своей -soft подложке;
     расчёт из этого файла: python3 docs/сверка/perf/contrast.py (SLED-007, 148 пар, 0 ниже порога).
   ===================================================================== */

@font-face{font-family:"Onest";font-style:normal;font-weight:100 900;font-display:swap;src:url(lib/fonts/onest-cyrillic-wght-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-style:normal;font-weight:100 900;font-display:swap;src:url(lib/fonts/onest-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(lib/fonts/ibm-plex-mono-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(lib/fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url(lib/fonts/ibm-plex-mono-cyrillic-500-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url(lib/fonts/ibm-plex-mono-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---------- токены: тёмная тема (по умолчанию) ---------- */
:root{
  color-scheme:dark;
  /* поверхности: тёплый графит, три уровня глубины */
  --bg:#141412; --surface:#1B1A18; --raised:#23221F; --sunken:#100F0E;
  --line:#2E2C28; --line-strong:#3D3A35; --hover:#26241F;
  /* текст */
  --ink:#ECE8E1; --ink-2:#A9A398; --ink-3:#989286;
  /* единственный акцент */
  --accent:#D08A5A; --accent-ink:#141412; --accent-soft:rgba(208,138,90,.10); --accent-line:rgba(208,138,90,.55);
  /* функциональные статусы */
  --ok:#7FBF8E;   --ok-soft:rgba(127,191,142,.13);
  --info:#7FA7D6; --info-soft:rgba(127,167,214,.13);
  --warn:#E0B93E; --warn-soft:rgba(224,185,62,.13);
  --crit:#F1786A; --crit-soft:rgba(239,106,91,.10);
  --unknown:#A99BC9; --stale:#97928A; --stale-soft:rgba(140,135,126,.08);
  /* графики и карта */
  --chart-line:#7FA7D6; --chart-fill:rgba(127,167,214,.14); --chart-grid:#2A2824; --chart-text:#989286;
  --map-bg:#0F0E0D; --track:#7FBF8E; --track-ctx:#4A463F;
  --shadow:0 1px 0 rgba(255,255,255,.03) inset,0 10px 30px rgba(0,0,0,.28);
  --overlay:rgba(10,10,9,.62);
  /* SLED-040: карта «СЛЕД Dark» утверждена и остаётся тёмной в обеих темах — токены --map-* не переопределяются темой (значения из ТЗ карты) */
  --map-ground:#111111; --map-card:#1C1C1C; --map-inner:#242424; --map-line:#303030; --map-ink:#E5E5E5; --map-ink-2:#A8A8A8;
  --map-move:#73957B; --map-stop:#7C8998; --map-over:#C46460; --map-ctl:#B77D55; --map-gap:#A8A8A8;
  /* плеер смены (SLED-040): рейка ползунка (не менее 3:1 к поверхности) и заполненная часть */
  --pl-rail:#7A756B; --pl-fill:#ECE8E1;
  /* совместимые имена: старый код FleetView.html (индикатор источника, поле поиска) — те же значения, что у канонических токенов */
  --amber:var(--warn); --green:var(--ok); --panel2:var(--sunken); --line2:var(--line-strong);

  /* типографика */
  --font:"Onest","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"Cascadia Mono",Consolas,monospace;
  --fs-xs:11px; --fs-s:12px; --fs-m:13px; --fs-l:15px; --fs-xl:19px; --fs-2xl:26px; --fs-3xl:34px;
  /* интервалы: шаг 4 */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px; --s8:32px;
  /* радиусы: малые — инструмент, не «пузыри» */
  --r1:3px; --r2:5px; --r3:8px;
  /* движение */
  --t-fast:120ms; --t-mid:180ms; --ease:cubic-bezier(.2,.7,.2,1);
  /* размеры каркаса */
  --nav-w:208px; --top-h:56px;
}
/* ---------- светлая тема: тёплая бумага ---------- */
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#F3F1EC; --surface:#FBFAF7; --raised:#FFFFFF; --sunken:#ECE9E2;
  --line:#DDD8CE; --line-strong:#C9C3B7; --hover:#EFECE5;
  --ink:#1C1B19; --ink-2:#57524A; --ink-3:#6A645A;
  --accent:#9B5226; --accent-ink:#FFFFFF; --accent-soft:rgba(155,82,38,.06); --accent-line:rgba(155,82,38,.55);
  --ok:#2A7344; --ok-soft:rgba(42,115,68,.06);
  --info:#2F619E; --info-soft:rgba(47,97,158,.08);
  --warn:#7E6100; --warn-soft:rgba(176,136,0,.09);
  --crit:#B3362A; --crit-soft:rgba(184,56,42,.06);
  --unknown:#6B5A9B; --stale:#6A645A; --stale-soft:rgba(110,104,94,.08);
  --chart-line:#2F619E; --chart-fill:rgba(47,97,158,.10); --chart-grid:#E4E0D7; --chart-text:#6A645A;
  --map-bg:#E9E6DF; --track:#2A7344; --track-ctx:#B9B2A5;
  --shadow:0 1px 2px rgba(28,27,25,.06),0 8px 24px rgba(28,27,25,.06);
  --overlay:rgba(28,27,25,.28);
  /* SLED-040: карта «СЛЕД Dark» утверждена и остаётся тёмной в обеих темах — токены --map-* не переопределяются темой (значения из ТЗ карты) */
  --map-ground:#111111; --map-card:#1C1C1C; --map-inner:#242424; --map-line:#303030; --map-ink:#E5E5E5; --map-ink-2:#A8A8A8;
  --map-move:#73957B; --map-stop:#7C8998; --map-over:#C46460; --map-ctl:#B77D55; --map-gap:#A8A8A8;
  --pl-rail:#8A8478; --pl-fill:#1C1B19;
}

*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font:var(--fs-m)/1.45 var(--font);-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--accent);text-underline-offset:2px}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
::selection{background:var(--accent-soft)}
.num,.mono{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.eyebrow{font:500 var(--fs-xs)/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.muted{color:var(--ink-2)} .dim{color:var(--ink-3)}
.red{color:var(--crit)} .amber{color:var(--warn)} .green{color:var(--ok)}
[hidden]{display:none!important}

/* ---------- каркас ---------- */
.app{display:grid;grid-template-columns:var(--nav-w) minmax(0,1fr);grid-template-rows:var(--top-h) minmax(0,1fr);height:100vh}
.top{grid-column:1/3;display:flex;align-items:center;gap:var(--s2);padding:0 var(--s4);border-bottom:1px solid var(--line);background:var(--bg);min-width:0}
.logo{display:flex;align-items:center;gap:10px;width:calc(var(--nav-w) - var(--s4));flex:none;color:var(--ink);text-decoration:none}
.logo .mark{width:30px;height:30px;flex:none;display:block}
.logo b{display:block;font:700 15px/1 var(--font);letter-spacing:.14em}
.logo small{display:block;color:var(--ink-3);font:400 var(--fs-xs)/1.3 var(--font);margin-top:3px;white-space:nowrap}
.ctx{display:flex;align-items:center;gap:var(--s2);min-width:0;flex:1 1 auto;overflow:hidden}
.app.no-ctx .ctx{visibility:hidden;pointer-events:none}
.ctl{display:flex;flex-direction:column;gap:1px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r2);padding:4px 10px;min-width:0;transition:border-color var(--t-fast)}
.ctl:hover{border-color:var(--line-strong)}
.ctl:focus-within{border-color:var(--accent)}
.ctl label{font:500 10px/1.2 var(--mono);color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em}
.ctl select,.ctl input{background:transparent;border:0;outline:0;padding:0;min-width:0;font-size:var(--fs-m)}
.ctl select option{background:var(--raised);color:var(--ink)}
.spacer{flex:1}
.top-actions{display:flex;align-items:center;gap:var(--s2);flex:none}

/* ---------- кнопки ---------- */
.btn{display:inline-flex;align-items:center;gap:6px;background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r2);padding:7px 12px;cursor:pointer;white-space:nowrap;color:var(--ink);font-size:var(--fs-m);transition:background var(--t-fast),border-color var(--t-fast),color var(--t-fast)}
.btn:hover{background:var(--hover);border-color:var(--ink-3)}
.btn:active{transform:translateY(1px)}
.btn:disabled,.btn[aria-disabled="true"]{opacity:.45;cursor:not-allowed;transform:none}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}
.btn.primary:hover{filter:brightness(1.08)}
.btn.ghost{background:transparent;border-color:transparent;color:var(--ink-2)}
.btn.ghost:hover{background:var(--hover);color:var(--ink)}
.btn.sm{padding:4px 9px;font-size:var(--fs-s);border-radius:var(--r1)}
.btn.icon{padding:6px;width:32px;height:32px;justify-content:center}
.btn.loading{pointer-events:none;color:transparent;position:relative}
.btn.loading::after{content:"";position:absolute;inset:0;margin:auto;width:14px;height:14px;border:2px solid var(--ink-3);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- бейджи и статусы ---------- */
.badge{display:inline-flex;align-items:center;gap:6px;padding:3px 8px;border-radius:var(--r1);font:500 var(--fs-xs)/1.2 var(--mono);letter-spacing:.04em;background:var(--sunken);color:var(--ink-2);border:1px solid var(--line);white-space:nowrap}
.badge.demo{color:var(--warn);border-color:var(--warn);background:var(--warn-soft)}
.badge.real{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 50%,transparent);background:var(--ok-soft)}
/* знак статуса: форма + цвет */
.g{display:inline-grid;place-items:center;width:14px;height:14px;flex:none;font:600 11px/1 var(--font)}
.g::before{content:"";display:block}
.g.move::before,.g.ok::before{width:9px;height:9px;border-radius:50%;background:var(--ok)}
.g.park::before,.g.info::before{width:8px;height:8px;background:var(--info);border-radius:1px}
.g.warn::before{width:0;height:0;border-left:5.5px solid transparent;border-right:5.5px solid transparent;border-bottom:10px solid var(--warn)}
.g.crit::before{width:8px;height:8px;background:var(--crit);transform:rotate(45deg)}
.g.stale::before{width:7px;height:7px;border-radius:50%;border:2px solid var(--warn);background:transparent}
.g.off::before{width:7px;height:7px;border-radius:50%;border:2px dotted var(--stale);background:transparent}
.g.nopos::before{content:"?";color:var(--unknown);font-weight:700}
.g.nodata::before{width:7px;height:7px;border-radius:50%;border:2px dashed var(--unknown);background:transparent}
/* старые маркеры важности событий — тот же язык форм */
.sev{display:inline-grid;place-items:center;width:18px;height:18px;font-size:0;vertical-align:middle}
.sev::before{content:"";display:block}
.sev.high::before{width:9px;height:9px;background:var(--crit);transform:rotate(45deg)}
.sev.check::before{width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:11px solid var(--warn)}
.sev.info::before{width:8px;height:8px;background:var(--info);border-radius:1px}
.st-new{color:var(--warn)} .st-ok{color:var(--ok)} .st-expl{color:var(--info)}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block;background:var(--ok)}

/* ---------- навигация ---------- */
.nav{border-right:1px solid var(--line);padding:var(--s3) var(--s2);display:flex;flex-direction:column;gap:2px;background:var(--bg);overflow:auto}
.nav .sec{font:500 10px/1 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);padding:var(--s4) 10px var(--s2)}
.nav .sec:first-child{padding-top:var(--s1)}
.nav button{all:unset;cursor:pointer;padding:7px 10px;border-radius:var(--r2);color:var(--ink-2);display:flex;gap:10px;align-items:center;position:relative;transition:background var(--t-fast),color var(--t-fast)}
.nav button:hover{background:var(--hover);color:var(--ink)}
.nav button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.nav button.on{color:var(--ink);background:var(--surface)}
.nav button.on::before{content:"";position:absolute;left:-8px;top:7px;bottom:7px;width:2px;background:var(--accent);border-radius:2px}
.nav .foot{margin-top:auto;font-size:var(--fs-xs);color:var(--ink-2);border-top:1px solid var(--line);padding:var(--s3) 10px var(--s1);display:flex;gap:8px;align-items:flex-start;line-height:1.4}
.nav .foot .dot{margin-top:4px;flex:none}
.ico{width:17px;height:17px;flex:none;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* ---------- рабочая область ---------- */
main{overflow:auto;padding:var(--s5) var(--s6);min-width:0}
.view{display:none}
.view.on{display:block;animation:viewIn var(--t-mid) var(--ease)}
@keyframes viewIn{from{opacity:.0;transform:translateY(4px)}to{opacity:1;transform:none}}
.grid{display:grid;gap:var(--s3)}
.row2{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
.row3{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr) minmax(0,.9fr)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r3);padding:var(--s4);min-width:0}
.card h3{margin:0 0 var(--s3);font:600 var(--fs-l)/1.3 var(--font);letter-spacing:-.005em}
.card h3 small{color:var(--ink-3);font:400 var(--fs-s) var(--font);margin-left:6px}
h2{font:600 var(--fs-xl)/1.25 var(--font);letter-spacing:-.01em}

/* показатели-«плитки» на экранах смены: одна строка, разделители вместо карточек */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r3);overflow:hidden}
.kpis>.card{border:0;border-radius:0;border-right:1px solid var(--line);background:transparent;box-shadow:none}
.kpis>.card:last-child{border-right:0}
.kpis>.card.empty{grid-column:1/-1}
.kpi{display:flex;gap:10px;align-items:flex-start;position:relative;padding:var(--s3) var(--s4)}
.kpi .ic{display:none}
.kpi .lbl{color:var(--ink-2);font-size:var(--fs-s)}
.kpi .val{font:500 var(--fs-2xl)/1.15 var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em;margin-top:4px;white-space:nowrap}
.kpi .val small{font:400 var(--fs-m) var(--font);color:var(--ink-2);margin-left:4px;letter-spacing:0}
.kpi .sub{font-size:var(--fs-xs);color:var(--ink-3);margin-top:3px}
.kpi.warn::before,.kpi.bad::before,.kpi.good::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:2px}
.kpi.warn::before{background:var(--warn)} .kpi.bad::before{background:var(--crit)} .kpi.good::before{background:var(--ok)}
.kpi.bad .val{color:var(--crit)} .kpi.warn .val{color:var(--warn)}

/* ---------- таблицы ---------- */
table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
th{text-align:left;color:var(--ink-3);font:500 10.5px/1.2 var(--mono);text-transform:uppercase;letter-spacing:.05em;padding:7px 8px;border-bottom:1px solid var(--line-strong);position:sticky;top:0;background:var(--surface);z-index:1}
td{padding:7px 8px;border-bottom:1px solid var(--line);vertical-align:middle}
tr.click{cursor:pointer}
tr.click:hover td{background:var(--hover)}
.scroll{max-height:420px;overflow:auto}
.kv{display:grid;grid-template-columns:1fr auto;gap:7px 12px}
.kv div:nth-child(odd){color:var(--ink-2)}
.kv div:nth-child(even){text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums}
.note{font-size:var(--fs-s);color:var(--ink-3);margin-top:var(--s2)}
.prov{white-space:nowrap;font:500 10px/1.2 var(--mono);padding:2px 6px;border-radius:var(--r1);border:1px solid var(--line-strong);color:var(--ink-3);margin-left:6px;letter-spacing:.03em}
.pill{font-size:var(--fs-xs);border-radius:var(--r1);padding:2px 7px;background:var(--sunken)}

/* ---------- поля ввода ---------- */
.form{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s3)}
.f label{display:block;font-size:var(--fs-s);color:var(--ink-2);margin-bottom:5px}
.f input,.f select,.f textarea,input.search{width:100%;background:var(--sunken);border:1px solid var(--line-strong);border-radius:var(--r2);padding:7px 10px;outline:0;transition:border-color var(--t-fast),box-shadow var(--t-fast)}
.f input:hover,.f select:hover,input.search:hover{border-color:var(--ink-3)}
.f input:focus,.f select:focus,.f textarea:focus,input.search:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.f input:disabled,.f select:disabled{opacity:.5;cursor:not-allowed}
.f input[aria-invalid="true"]{border-color:var(--crit)}
.f input.manual{border-left:2px solid var(--info)}
.seg{display:inline-flex;border:1px solid var(--line-strong);border-radius:var(--r2);overflow:hidden;background:var(--sunken)}
.seg button{all:unset;cursor:pointer;padding:5px 11px;color:var(--ink-2);font-size:var(--fs-s);transition:background var(--t-fast),color var(--t-fast)}
.seg button:hover{color:var(--ink)}
.seg button.on{background:var(--raised);color:var(--ink);box-shadow:inset 0 -2px 0 var(--accent)}
.seg button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}

/* ---------- состояния ---------- */
.empty{padding:var(--s8) var(--s4);text-align:center;color:var(--ink-2)}
.empty b{display:block;color:var(--ink);font-size:var(--fs-l);margin-bottom:4px}
.drop{border:1px dashed var(--line-strong);border-radius:var(--r3);padding:var(--s6);text-align:center;color:var(--ink-2);transition:border-color var(--t-fast),background var(--t-fast)}
.drop.over{border-color:var(--accent);background:var(--accent-soft)}
.skel{background:linear-gradient(90deg,var(--raised) 0,var(--hover) 50%,var(--raised) 100%);background-size:200% 100%;animation:skel 1.2s linear infinite;border-radius:var(--r1);height:12px}
@keyframes skel{to{background-position:-200% 0}}
.banner{display:flex;gap:var(--s3);align-items:flex-start;padding:var(--s3) var(--s4);border-radius:var(--r2);border:1px solid var(--line-strong);background:var(--surface);font-size:var(--fs-m)}
.banner.warn{border-color:color-mix(in srgb,var(--warn) 55%,transparent);background:var(--warn-soft)}
.banner.crit{border-color:color-mix(in srgb,var(--crit) 55%,transparent);background:var(--crit-soft)}
.banner.info{border-color:color-mix(in srgb,var(--info) 45%,transparent);background:var(--info-soft)}

/* ---------- карта и графики ---------- */
#map,#emap{height:340px;border-radius:var(--r2);background:var(--map-bg)}
.tiles-dark{filter:invert(1) hue-rotate(185deg) brightness(.78) contrast(.92) saturate(.25) sepia(.12)}
.leaflet-container{background:var(--map-bg);font:var(--fs-s) var(--font)}
.legend{display:flex;gap:14px;flex-wrap:wrap;margin-top:var(--s2);font-size:var(--fs-xs);color:var(--ink-2)}
.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px;vertical-align:-1px}
.chartbox{position:relative;height:250px}
.chartbox.sm{height:170px}
.minis{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s2);margin-top:var(--s3);border-top:1px solid var(--line);padding-top:var(--s3)}
.minis div{font-size:var(--fs-xs);color:var(--ink-2)}
.minis b{display:block;color:var(--ink);font:500 var(--fs-l) var(--mono)}
.bars .b{display:grid;grid-template-columns:130px 1fr 84px;gap:10px;align-items:center;margin:9px 0}
.bars .track{height:6px;background:var(--sunken);border-radius:3px;overflow:hidden}
.bars .fill{height:100%;border-radius:3px;transition:width var(--t-mid) var(--ease)}
.bars .b>div:last-child{font-family:var(--mono)}
.leaflet-control-layers,.leaflet-bar a{background:var(--raised)!important;color:var(--ink)!important;border-color:var(--line-strong)!important}
.leaflet-control-layers{border:1px solid var(--line-strong)!important;border-radius:var(--r2)!important;box-shadow:var(--shadow)!important}
.leaflet-control-layers-expanded{padding:8px 12px}
.leaflet-bar{border:1px solid var(--line-strong)!important;box-shadow:var(--shadow)!important;border-radius:var(--r2)!important;overflow:hidden}
.leaflet-tooltip{background:var(--raised);color:var(--ink);border:1px solid var(--line-strong);box-shadow:var(--shadow);border-radius:var(--r1);font:var(--fs-s) var(--font)}
.leaflet-tooltip-top:before{border-top-color:var(--line-strong)}
.leaflet-control-attribution{background:color-mix(in srgb,var(--bg) 80%,transparent)!important;color:var(--ink-3)!important}
.leaflet-control-attribution a{color:var(--ink-2)!important}
.ep-head{display:flex;align-items:center;gap:var(--s3);margin-bottom:var(--s4);flex-wrap:wrap}

/* ---------- уведомления ---------- */
#toast{position:fixed;right:var(--s5);bottom:var(--s5);background:var(--raised);border:1px solid var(--line-strong);border-left:2px solid var(--info);padding:10px 14px;border-radius:var(--r2);display:none;max-width:440px;z-index:9999;box-shadow:var(--shadow);animation:toastIn var(--t-mid) var(--ease)}
#toast.err{border-left-color:var(--crit)}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
@keyframes toastIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ---------- вход ---------- */
#loginWrap{position:fixed;inset:0;background:var(--bg);z-index:10000;place-items:center} /* фон плоский, без градиента: токен --bg обеих тем */
#loginWrap .card{width:360px;padding:var(--s8);box-shadow:var(--shadow)}

/* =====================================================================
   ОБСТАНОВКА (Command)
   ===================================================================== */
.cmd{display:grid;grid-template-rows:auto auto minmax(0,1fr);gap:var(--s4);height:calc(100vh - var(--top-h) - 40px);min-height:560px}
.cmd-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s4);flex-wrap:wrap}
.cmd-title{margin:6px 0 0;font:600 28px/1.15 var(--font);letter-spacing:-.022em;text-wrap:balance;max-width:44ch}
.cmd-title em{font-style:normal;color:var(--crit)}
.cmd-title .w{color:var(--warn)}
.cmd-title .q{color:var(--ink-3);font-weight:500}
.fresh{display:flex;align-items:center;gap:10px;font:400 var(--fs-s)/1.35 var(--mono);color:var(--ink-2);text-align:right}
.fresh .pulse{width:8px;height:8px;border-radius:50%;background:var(--ok);flex:none;box-shadow:0 0 0 0 var(--ok-soft)}
.fresh.ok .pulse{animation:pulse 2.4s ease-out 1}
.fresh.warn .pulse{background:var(--warn)}
.fresh.crit .pulse{background:var(--crit)}
.fresh.hist .pulse{background:var(--stale)}
@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--ok) 45%,transparent)}100%{box-shadow:0 0 0 10px transparent}}

/* полоса состояния парка: доли = реальные пропорции, сегменты = фильтры */
.state{display:grid;gap:var(--s2)}
.state-bar{display:flex;height:6px;border-radius:3px;overflow:hidden;background:var(--sunken);gap:2px}
.state-bar i{display:block;height:100%;min-width:0;transition:flex-grow var(--t-mid) var(--ease)}
.state-bar .move{background:var(--ok)} .state-bar .park{background:var(--info)} .state-bar .stale{background:var(--warn)} .state-bar .off{background:var(--stale)} .state-bar .nopos{background:var(--unknown)} .state-bar .nodata{background:var(--unknown)}
.state-legend{display:flex;flex-wrap:wrap;gap:2px}
.sf{all:unset;cursor:pointer;display:grid;grid-template-columns:auto auto;align-items:baseline;column-gap:8px;padding:6px 12px 7px 10px;border-radius:var(--r2);border:1px solid transparent;transition:background var(--t-fast),border-color var(--t-fast)}
.sf:hover{background:var(--hover)}
.sf:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.sf.on{background:var(--surface);border-color:var(--accent-line)}
.sf .g{grid-row:1/3;align-self:center}
.sf b{font:500 var(--fs-xl)/1.1 var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.sf span{grid-column:2;font-size:var(--fs-xs);color:var(--ink-2);white-space:nowrap}
.sf.zero b{color:var(--ink-3)}
.sf.all{padding-left:12px}
.sf.all b{color:var(--ink)}

.fleet{display:grid;grid-template-columns:minmax(300px,380px) minmax(0,1fr);gap:var(--s3);min-height:0}
.flist{display:flex;flex-direction:column;min-height:0;padding:0;overflow:hidden}
.flist .tools{display:flex;gap:var(--s2);padding:var(--s3);border-bottom:1px solid var(--line);align-items:center}
.flist .tools .count{font:400 var(--fs-xs) var(--mono);color:var(--ink-3);white-space:nowrap}
.flist .rows{overflow:auto;flex:1;position:relative;contain:strict}
.vlist{position:relative}
.fgrp,.frow{position:absolute;left:0;right:0;height:44px}
.fgrp{display:flex;align-items:flex-end;justify-content:space-between;padding:0 var(--s3) 7px;font:500 10.5px/1 var(--mono);color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em;cursor:pointer;user-select:none;border-bottom:1px solid var(--line)}
.fgrp:hover{color:var(--ink)}
.frow{display:grid;grid-template-columns:14px minmax(0,1fr) auto;gap:10px;align-items:center;padding:0 var(--s3);cursor:pointer;border-bottom:1px solid var(--line);transition:background var(--t-fast)}
.frow:hover{background:var(--hover)}
.frow:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.frow.on{background:var(--accent-soft);box-shadow:inset 2px 0 0 var(--accent)}
.frow .nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--fs-m)}
.frow .nm small{display:block;color:var(--ink-3);font:400 var(--fs-xs)/1.35 var(--mono);overflow:hidden;text-overflow:ellipsis}
.frow .rt{text-align:right;font:400 var(--fs-s)/1.35 var(--mono);color:var(--ink-2);white-space:nowrap}
.frow .rt b{color:var(--ink);font-weight:500}
.frow .rt.stale{color:var(--warn)} .frow .rt.off{color:var(--ink-3)}

.mapwrap{position:relative;min-height:0;border-radius:var(--r3);overflow:hidden;border:1px solid var(--line)}
#fmap{position:absolute;inset:0;background:var(--map-bg)}
.map-legend{position:absolute;left:var(--s3);bottom:var(--s3);right:64px;width:max-content;max-width:calc(100% - 80px);z-index:500;display:flex;gap:12px;flex-wrap:wrap;background:color-mix(in srgb,var(--surface) 92%,transparent);border:1px solid var(--line);border-radius:var(--r2);padding:6px 10px;font-size:var(--fs-xs);color:var(--ink-2);backdrop-filter:blur(6px)}
.map-legend span{display:inline-flex;gap:5px;align-items:center}
/* ===== Обстановка: карта MapLibre (SLED-041). Две карты в одной карточке: #fmapGl (основная, тёмная в обеих темах) и #fmap (Leaflet — геозоны). ===== */
#fmapGl{position:absolute;inset:0;background:var(--map-ground)}
#fmap.fv-off,#fmapGl.fv-off{display:none}
@media (pointer:coarse),(max-width:640px){#fmapGl .maplibregl-ctrl-group button{width:44px;height:44px}}   /* зум на «Обстановке» вне .sl-map: цель касания ≥ 44 px */
.mapwrap.gl .map-legend{bottom:40px;right:auto;max-width:calc(100% - 24px);background:color-mix(in srgb,var(--map-card) 92%,transparent);border-color:var(--map-line);color:var(--map-ink-2);
  --ok:#7FBF8E;--info:#7FA7D6;--warn:#E0B93E;--stale:#97928A;--unknown:#A99BC9}   /* легенда лежит на тёмной карте: цвета знаков — как у маркеров (значения тёмной темы токенов) */
.gz-ctl.fv-glzone{position:absolute;right:var(--s3);bottom:40px;z-index:1000}   /* как контролы Leaflet: поверх карточки машины */
.fv-gltip{position:absolute;z-index:550;pointer-events:none;max-width:260px;padding:6px 10px;background:var(--raised);color:var(--ink);border:1px solid var(--line-strong);box-shadow:var(--shadow);border-radius:var(--r1);font:var(--fs-s)/1.35 var(--font)}
.fv-gltip[hidden]{display:none}
.mapwrap:not(.gl) .fv-glzone,.mapwrap:not(.gl) .fv-glnote,.mapwrap:not(.gl) .fv-gltip{display:none}   /* элементы MapLibre не нужны, пока показан Leaflet */
.fv-gltip .dim{color:var(--ink-3)}
.fv-glnote{position:absolute;left:50%;top:var(--s3);transform:translateX(-50%);z-index:600;display:flex;gap:var(--s2);align-items:center;max-width:calc(100% - 96px);padding:6px 10px;background:var(--raised);color:var(--ink);border:1px solid var(--line-strong);border-radius:var(--r2);box-shadow:var(--shadow);font:var(--fs-s)/1.35 var(--font)}
.fv-glnote .btn{min-height:32px;flex:none}
@media (pointer:coarse){ .fv-glnote .btn{min-height:44px} }

/* панель машины: выезжает поверх карты, контекст списка сохраняется */
.drawer{position:absolute;top:var(--s3);right:var(--s3);bottom:var(--s3);width:min(340px,calc(100% - 24px));z-index:600;background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r3);box-shadow:var(--shadow);display:flex;flex-direction:column;transform:translateX(0);opacity:1;transition:transform var(--t-mid) var(--ease),opacity var(--t-mid) var(--ease)}
.drawer.closed{transform:translateX(16px);opacity:0;pointer-events:none}
.drawer header{padding:var(--s4) var(--s4) var(--s3);border-bottom:1px solid var(--line);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s1) var(--s2)}
.drawer h3{margin:0;font:600 var(--fs-xl)/1.2 var(--font);letter-spacing:-.01em;overflow-wrap:anywhere}
.drawer .sub{grid-column:1/-1;font:400 var(--fs-s) var(--mono);color:var(--ink-3)}
.drawer .body{padding:var(--s4);overflow:auto;display:grid;gap:var(--s4);align-content:start}
.drawer .stat{display:flex;gap:10px;align-items:flex-start}
.drawer .stat b{display:block;font-size:var(--fs-l)}
.drawer .stat small{display:block;color:var(--ink-2);font-size:var(--fs-s);margin-top:2px}
.drawer .kv div:nth-child(even){font-size:var(--fs-s)}
.drawer footer{padding:var(--s3) var(--s4);border-top:1px solid var(--line);display:flex;gap:var(--s2);flex-wrap:wrap}
.speedo{font:500 var(--fs-3xl)/1 var(--mono);letter-spacing:-.03em}
.speedo small{font:400 var(--fs-m) var(--font);color:var(--ink-2);margin-left:4px;letter-spacing:0}

/* ---------- адаптивность ---------- */
@media (max-width:1400px){ .row3{grid-template-columns:1fr 1fr} .row3>:first-child{grid-column:1/-1} }
@media (max-width:1100px){
  .row2,.row3{grid-template-columns:1fr} .row3>:first-child{grid-column:auto}
  .form{grid-template-columns:1fr 1fr}
  .fleet{grid-template-columns:1fr;grid-template-rows:minmax(320px,45vh) minmax(360px,1fr)}
  .cmd{height:auto}
  .cmd-title{font-size:var(--fs-2xl)}
}
@media (max-width:900px){
  :root{--nav-w:56px}
  .nav .sec,.nav .foot span:not(.dot),.nav button .lbl{display:none}
  .nav button{justify-content:center;padding:9px 0}
  .nav button.on::before{left:-4px}
  .logo{width:auto} .logo div{display:none}
  .top{gap:6px;padding:0 var(--s2)}
  .top-actions .btn:not(.icon):not(#btnRefresh){padding:6px 8px}
  main{padding:var(--s4)}
}

/* телефон (SLED-007): шапка в две строки — логотип и действия, ниже контекст (машина/дата/смена); страница не скроллится вбок.
   Excel и PDF на телефоне скрыты (печать и выгрузка — задачи рабочего места). */
@media (max-width:600px){
  .app{grid-template-rows:auto minmax(0,1fr)}
  .top{flex-wrap:wrap;height:auto;padding:var(--s2);row-gap:var(--s2)}
  .top-actions{flex:1 1 0;min-width:0;justify-content:flex-end}
  .top-actions #btnXlsx,.top-actions #btnPdf{display:none}
  .ctx{order:3;flex:1 0 100%;flex-wrap:wrap;overflow:visible}
  .ctx .ctl{flex:1 1 40%!important;min-width:0!important}
  .app.no-ctx .ctx{display:none}
  main{padding:var(--s3)}
  .kpi .val{font-size:var(--fs-xl)}
  .kpi .val small{margin-left:2px}
}

/* =====================================================================
   ГЕОЗОНЫ НА КАРТЕ «ОБСТАНОВКИ» (SLED-028; конструктор — SLED-018). Только токены «Трасса»; цвета зон задаёт пользователь (данные, не тема).
   Знаки статуса — .g; медь — только выбор (контур выбранной зоны, фокус, ручки).
   ===================================================================== */
#fmap.drawing{cursor:crosshair}
#fmap.drawing .leaflet-interactive{cursor:crosshair}
/* правка: машины приглушены и не принимают клики; пустой верхний canvas вне правки ничего не перехватывает */
.gz-mute{opacity:.28;pointer-events:none!important}
.gz-off{pointer-events:none!important}
.mapwrap.gz-editing .map-legend,.mapwrap.gz-editing .gz-ctl{display:none}

/* кнопка на карте: над сменой подложки (правый нижний угол) */
.gz-ctl{position:relative;display:flex;flex-direction:column;gap:6px;align-items:flex-end}
.gz-btn{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 12px;background:var(--raised);color:var(--ink);border:1px solid var(--line-strong);border-radius:var(--r2);box-shadow:var(--shadow);cursor:pointer;font:400 var(--fs-m) var(--font);white-space:nowrap}
.gz-btn:hover{background:var(--hover)}
.gz-btn .ico{width:16px;height:16px}
.gz-btn[aria-pressed="true"],.gz-shapes button[aria-pressed="true"]{background-image:linear-gradient(var(--accent-soft),var(--accent-soft))}
.gz-btn[aria-pressed="true"]{box-shadow:var(--shadow),inset 0 -2px 0 var(--accent)}
.gz-btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed}
.gz-btn.err{border-color:var(--crit);color:var(--crit)}
.gz-list{position:absolute;right:178px;bottom:var(--s3);z-index:700;box-sizing:border-box;width:min(280px,calc(100vw - 150px));background:var(--raised);border:1px solid var(--line-strong);border-radius:var(--r2);box-shadow:var(--shadow);padding:var(--s2);display:flex;flex-direction:column;gap:2px}
.gz-list[hidden]{display:none!important}
.gz-done{display:none}
.gz-lscroll{max-height:min(260px,30vh);overflow:auto;display:flex;flex-direction:column;gap:2px;border-top:1px solid var(--line);margin-top:var(--s1);padding-top:var(--s1)}
.gz-li{display:flex;align-items:center;gap:var(--s2);min-height:34px;padding:0 var(--s2);border-radius:var(--r1);cursor:pointer;font:400 var(--fs-m) var(--font);color:var(--ink)}
.gz-li:hover{background:var(--hover)}
.gz-li:focus-within{outline:2px solid var(--accent);outline-offset:-2px}
.gz-li input{width:18px;height:18px;margin:0;accent-color:var(--accent);flex:none}
.gz-li .gz-sw{flex:none}
.gz-lt{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gz-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.gz-btn[hidden],.gz-bar[hidden],.gz-hint[hidden],.gz-card[hidden],.gz-dlg[hidden],.gz-pop[hidden],.gz-msg[hidden],.gz-dirty[hidden],#gzDel[hidden]{display:none!important}

/* панель инструментов правки: поверх карты сверху, правее кнопок масштаба */
.gz-bar{position:absolute;top:var(--s3);left:54px;right:var(--s3);z-index:900;display:flex;flex-direction:column;gap:var(--s2);align-items:flex-start;pointer-events:none}
.gz-bar>*{pointer-events:auto}
.gz-row{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;background:color-mix(in srgb,var(--surface) 95%,transparent);border:1px solid var(--line-strong);border-radius:var(--r3);box-shadow:var(--shadow);padding:var(--s2);max-width:100%}
.gz-bar.dirty .gz-row{border-color:var(--accent-line)}
.gz-shapes button{display:inline-flex;align-items:center;gap:6px;padding:6px 11px}
.gz-shapes button .ico{width:16px;height:16px}
.gz-name{box-sizing:border-box;width:200px;min-height:32px;background:var(--sunken);border:1px solid var(--line-strong);border-radius:var(--r2);padding:5px 10px;color:var(--ink);font:400 var(--fs-m) var(--font)}
.gz-name:focus{outline:2px solid var(--accent);outline-offset:1px}
.gz-name:disabled{opacity:.5;cursor:not-allowed}
.gz-name[aria-invalid="true"]{border-color:var(--crit)}
.gz-colw{position:relative}
.gz-sw{display:block;width:16px;height:16px;border-radius:var(--r1);border:1px solid var(--line-strong)}
.gz-pop{position:absolute;top:calc(100% + 6px);left:0;z-index:910;display:grid;grid-template-columns:repeat(4,32px);gap:6px;background:var(--raised);border:1px solid var(--line-strong);border-radius:var(--r2);box-shadow:var(--shadow);padding:var(--s2)}
.gz-pop button{all:unset;box-sizing:border-box;width:32px;height:32px;border-radius:var(--r1);border:1px solid var(--line-strong);cursor:pointer;display:grid;place-items:center;color:#fff;font:700 14px/1 var(--font);text-shadow:0 0 2px rgba(0,0,0,.6)}
.gz-pop button[aria-checked="true"]{outline:2px solid var(--accent);outline-offset:2px}
.gz-pop button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.gz-dirty{display:inline-flex;gap:6px;align-items:center;font-size:var(--fs-xs);color:var(--warn);white-space:nowrap}
.gz-msg{max-width:min(440px,100%);box-shadow:var(--shadow)}

/* подсказка режима: снизу слева (легенда в правке скрыта) */
.zhint{position:absolute;left:var(--s3);right:64px;bottom:calc(var(--s3) + 22px);z-index:500;width:max-content;max-width:calc(100% - 80px);background:color-mix(in srgb,var(--surface) 92%,transparent);border:1px solid var(--line);border-radius:var(--r2);padding:6px 10px;font-size:var(--fs-xs);color:var(--ink-2);display:flex;gap:var(--s3);flex-wrap:wrap;align-items:center}
.zhint .btn{pointer-events:auto}
.zcross{display:none;position:absolute;left:50%;top:50%;width:28px;height:28px;margin:-14px 0 0 -14px;z-index:450;pointer-events:none}
.zcross::before,.zcross::after{content:"";position:absolute;background:var(--accent)}
.zcross::before{left:13px;top:0;bottom:0;width:2px}
.zcross::after{top:13px;left:0;right:0;height:2px}
.zcross.on{display:block}
/* ручки правки: видимая 14 px, зона нажатия 44 px */
.zh-wrap{background:none;border:0}
.zh{all:unset;box-sizing:border-box;display:block;position:relative;width:14px;height:14px;background:var(--raised);border:2px solid var(--accent);transform:rotate(45deg);cursor:grab}
.zh::after{content:"";position:absolute;inset:-15px}
.zh.rad{border-radius:50%;transform:none}
.zh.ctr{border-radius:50%;transform:none;background:var(--accent)}
.zh.sel{background:var(--accent)}
.zh:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.zm{all:unset;box-sizing:border-box;display:block;position:relative;width:8px;height:8px;margin:3px;border-radius:50%;background:var(--accent);opacity:.7;cursor:copy}
.zm::after{content:"";position:absolute;inset:-18px}
.zm:hover,.zm:focus-visible{opacity:1}
.zm:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
/* подпись зоны: чистый текст с обводкой, без рамки и тени — не путается с чипами измерений (рамка + тень) */
.leaflet-tooltip.zlab{background:transparent;border:0;box-shadow:none;padding:0 2px;font:600 var(--fs-s)/1.2 var(--font);color:var(--ink);letter-spacing:.02em;pointer-events:none;white-space:nowrap;text-shadow:-1px -1px 0 var(--surface),1px -1px 0 var(--surface),-1px 1px 0 var(--surface),1px 1px 0 var(--surface),0 0 4px var(--surface),0 0 6px var(--surface)}
.leaflet-tooltip.zlab::before{display:none}
.fv-lab{position:absolute;left:0;top:0;height:16px;max-width:190px;padding:0 2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;font:600 var(--fs-xs)/16px var(--font);color:var(--ink);text-shadow:-1px -1px 0 var(--surface),1px -1px 0 var(--surface),-1px 1px 0 var(--surface),1px 1px 0 var(--surface),0 0 4px var(--surface)}
.fv-lab[hidden]{display:none}
#fmap.gz-editing .leaflet-fvLab-pane{display:none}
.leaflet-tooltip.zlab>span{display:block;max-width:160px;overflow:hidden;text-overflow:ellipsis}
/* измерение при рисовании: плашка с рамкой, моноширинный шрифт — отличается от подписи зоны */
.leaflet-tooltip.zmeas{padding:2px 7px;font:500 var(--fs-xs)/1.3 var(--mono);color:var(--ink);background:var(--raised);border:1px solid var(--accent);pointer-events:none;white-space:nowrap}
.leaflet-tooltip.zmeas::before{display:none}

/* карточка зоны: поверх карты слева сверху (карточка машины — справа) */
.gz-card{position:absolute;top:var(--s3);left:54px;z-index:600;width:min(320px,calc(100% - 70px));max-height:calc(100% - 90px);overflow:hidden;background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r3);box-shadow:var(--shadow);padding:var(--s4);display:flex;flex-direction:column;gap:var(--s3)}
.gz-body{min-height:0;overflow:auto;display:grid;gap:var(--s3);align-content:start}
.gz-act{flex:none;display:flex;gap:var(--s2);padding-top:var(--s2);border-top:1px solid var(--line)}
.gz-head{display:flex;justify-content:space-between;gap:var(--s2);align-items:flex-start}
.gz-head h3{margin:0;font:600 var(--fs-l)/1.3 var(--font);overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}
.gz-head{flex:none}
.gz-cnt{font:400 var(--fs-m) var(--font);color:var(--ink-2)}
.gz-cnt b{font:500 var(--fs-3xl)/1 var(--mono);color:var(--ink);margin-right:2px}
.gz-note{font-size:var(--fs-xs)}
.gz-vl{display:grid;gap:2px;margin-top:var(--s2)}
.gz-veh{all:unset;box-sizing:border-box;cursor:pointer;padding:6px 8px;border-radius:var(--r1);font-size:var(--fs-s);color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gz-veh:hover{background:var(--hover);color:var(--ink)}
.gz-veh:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.zp-act{display:flex;gap:var(--s2);flex-wrap:wrap}
.zp-meta{font:400 var(--fs-s) var(--mono);color:var(--ink-2)}

/* подтверждение внутри карты (вместо window.confirm) */
.gz-dlg{position:absolute;inset:0;z-index:1100;background:var(--overlay);display:grid;place-items:center;padding:var(--s4)}
.gz-dlg-box{background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r3);box-shadow:var(--shadow);padding:var(--s5);max-width:380px;width:100%;display:grid;gap:var(--s4)}
.gz-dlg-box p{margin:0;font-size:var(--fs-l);line-height:1.4;overflow-wrap:anywhere}
.gz-dlg-act{display:flex;gap:var(--s2);flex-wrap:wrap;justify-content:flex-end}
.btn.danger{border-color:var(--crit);color:var(--crit);background:var(--crit-soft)}
.btn.danger:hover{background:var(--crit-soft);filter:brightness(1.15)}

@media (max-width:900px){
  .zhint .kb-only{display:none}
}
@media (pointer:coarse),(max-width:600px){
  .gz-btn{min-height:44px;padding:0 14px}
  .gz-li{min-height:44px}
  .gz-li input{width:22px;height:22px}
  .gz-veh{min-height:44px;display:flex;align-items:center}
}
@media (max-width:600px){
  /* телефон: кнопки на карте — квадраты 44 px только с иконкой (подпись — в aria-label и title) */
  .gz-btn{width:44px;padding:0;justify-content:center}
  .gz-btn .gz-lbl{display:none}
  /* список — нижний лист на ширину карты, не закрывает «+/−» и легенду целиком */
  .gz-list{z-index:1100;left:0;right:0;bottom:0;width:auto;border-radius:var(--r3) var(--r3) 0 0;border-width:1px 0 0;padding:var(--s2) var(--s3) var(--s3)}
  .gz-lscroll{max-height:130px}
  .gz-done{display:inline-flex;justify-content:center;min-height:44px;margin-top:var(--s2)}
  .zhint{bottom:calc(var(--s2) + 22px)}
  /* правка: ряд 1 — фигуры, цвет, отмена; ряд 2 — название и «Сохранить»; ряд 3 — компактно «Удалить» и «Закрыть правку» */
  .gz-bar{left:50px;right:var(--s2)}
  .gz-row{width:100%;gap:6px;padding:6px}
  .gz-shapes{order:1}.gz-colw{order:2}#gzUndo{order:3}#gzRedo{order:7}
  .gz-shapes button{min-height:44px;width:44px;min-width:44px;justify-content:center;padding:0}
  .gz-shapes .tl{display:none}
  .gz-row .btn,.gz-row .btn.icon{min-height:44px;min-width:44px}
  .gz-name{flex:1 1 90px;min-width:0;order:5;min-height:44px;font-size:16px}
  #gzSave{order:6;flex:0 0 auto}
  .gz-dirty{display:none}   /* признак «не сохранено» на телефоне — рамка панели и доступная «Сохранить» */
  #gzDel{order:8}#gzExit{order:9;margin-left:auto}
  #gzDel,#gzExit{font-size:var(--fs-xs);padding:0 8px}
  .gz-pop{grid-template-columns:repeat(4,44px)}
  .gz-pop button{width:44px;height:44px}
  .gz-card{left:50px;width:auto;right:60px;max-height:calc(100% - 24px);top:var(--s2)}
  .gz-card .btn,.gz-card .btn.icon{min-height:44px;min-width:44px}
  .gz-dlg-act .btn{min-height:44px}
  .zhint{right:var(--s2);max-width:calc(100% - 24px);bottom:var(--s2)}
}


/* ---------- движение: уважение к настройке ОС ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* ---------- печать: всегда светлая «бумага» ---------- */
@media print{
  :root{color-scheme:light;--bg:#fff;--surface:#fff;--raised:#fff;--sunken:#F3F1EC;--line:#D9D4CA;--line-strong:#BDB6A9;--ink:#1C1B19;--ink-2:#4B463F;--ink-3:#6E685E;--accent:#A65A2A;--ok:#2A7344;--info:#2F619E;--warn:#7E6100;--crit:#B3362A;--stale:#6E685E;--chart-grid:#E4E0D7;--chart-text:#4B463F}
  .nav,.top .btn,.top-actions,#toast,.drawer{display:none!important}
  .app{display:block;height:auto} main{overflow:visible;padding:0}
  .card{break-inside:avoid;box-shadow:none}
  .view{display:none!important} #v-main{display:block!important;animation:none}
  .print-head{display:block!important}
}
.print-head{display:none;border-bottom:2px solid var(--ink);padding-bottom:10px;margin-bottom:14px}
.print-head h1{font:600 22px/1.2 var(--font);margin:4px 0}
.print-head p{margin:0;font:400 11px/1.5 var(--mono);color:var(--ink-2)}

/* уведомление: закрывается крестиком */
#toast .tclose{all:unset;box-sizing:border-box;cursor:pointer;float:right;margin:-6px -8px 0 10px;min-width:28px;min-height:28px;text-align:center;line-height:28px;color:var(--ink-3);font-size:18px}
#toast .tclose:hover{color:var(--ink)}
#toast .tclose:focus-visible{outline:2px solid var(--accent);outline-offset:1px}

/* ---------- оборудование машины (SLED-032) ---------- */
.eq-grid{display:grid;grid-template-columns:minmax(240px,300px) minmax(0,1fr);gap:var(--s4);align-items:start}
.eq-side{border:1px solid var(--line);border-radius:var(--r2);background:var(--sunken);padding:var(--s2)}
.eq-list{max-height:420px;overflow:auto;margin-top:var(--s2)}
.eq-li{display:flex;align-items:center;gap:var(--s2);min-height:34px;padding:0 var(--s2);border-radius:var(--r1);cursor:pointer;color:var(--ink)}
.eq-li:hover{background:var(--hover)}
.eq-li.on{background:var(--accent-soft);outline:1px solid var(--accent);outline-offset:-1px}
.eq-li input{flex:none}
.eq-li .eq-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:none;border:0;padding:0;text-align:left;color:inherit;font:inherit;cursor:pointer}
.eq-st{font:500 var(--fs-xs)/1.2 var(--mono);padding:2px 6px;border-radius:var(--r1);border:1px solid var(--line);background:var(--surface);color:var(--ink-3);white-space:nowrap}
.eq-st.ok::before{content:"● "}
.eq-st.none::before{content:"■ "}
.eq-st.warn{color:var(--warn);border-color:var(--warn)}
.eq-st.warn::before{content:"▲ "}
.eq-st.ok{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 50%,transparent)}
.eq-st.none{color:var(--info);border-color:color-mix(in srgb,var(--info) 45%,transparent)}
.eq-sec{border-top:1px solid var(--line);padding-top:var(--s3);margin-top:var(--s3)}
.eq-sec:first-child{border-top:0;margin-top:0;padding-top:0}
.eq-sec h4{margin:0 0 var(--s2);font:600 var(--fs-m) var(--font)}
.eq-bits{display:flex;gap:3px;flex-wrap:wrap}
.eq-bit{min-width:38px;text-align:center;padding:3px 4px;border:1px solid var(--line-strong);border-radius:var(--r1);font:500 var(--fs-s)/1.2 var(--mono)}
.eq-bit small{display:block;color:var(--ink-3);font-size:10px}
.eq-bit.hi{background:var(--ok-soft);border-color:color-mix(in srgb,var(--ok) 50%,transparent);color:var(--ok)}
.eq-bit.sel{outline:2px solid var(--accent);outline-offset:1px}
.eq-live{display:grid;grid-template-columns:auto 1fr;gap:var(--s2) var(--s4);align-items:center}
.eq-live .stale{color:var(--warn)}
.eq-live .stale::before{content:"◌ "}
.eq-row{display:flex;gap:var(--s3);flex-wrap:wrap;align-items:flex-end}
.eq-row .f{min-width:110px;flex:0 1 150px}
.eq-row .f:has(select){flex-basis:230px}
.eq-bit small{font-size:var(--fs-xs)}
.eq-adv{margin-top:var(--s2)}.eq-adv>summary{cursor:pointer;color:var(--ink-2);padding:var(--s1) 0}
.eq-adv>summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.eq-sug{border:1px solid color-mix(in srgb,var(--info) 45%,transparent);background:var(--info-soft);border-radius:var(--r2);padding:var(--s3);margin-top:var(--s2)}
/* SLED-047: лента входов I1…I8 за сутки на общей оси времени + предпросмотр правила (только цвета и размеры из токенов) */
.eq-tl{display:grid;grid-template-columns:44px 1fr;gap:var(--s1) var(--s3);align-items:center;margin-top:var(--s2)}
.eq-tl-lab{font:500 var(--fs-s) var(--mono);color:var(--ink-2);text-align:right}
.eq-tl-lab.sel{color:var(--accent);font-weight:600}
.eq-tl-track{position:relative;height:16px;background:var(--sunken);border:1px solid var(--line);border-radius:var(--r1);overflow:hidden}
.eq-tl-track.sp{height:44px}
.eq-tl-on{position:absolute;top:0;bottom:0;min-width:2px;background:var(--ok);opacity:.85}
.eq-tl-track.sel{border-color:var(--accent-line)}
.eq-tl-track svg{position:absolute;inset:0;width:100%;height:100%}
.eq-tl-axis{position:relative;height:16px;font:var(--fs-xs) var(--mono);color:var(--ink-3)}
.eq-tl-axis span{position:absolute;transform:translateX(-50%)}
.eq-tl-axis span:first-child{transform:none}.eq-tl-axis span:last-child{transform:translateX(-100%)}
.eq-tl-txt{margin:var(--s2) 0 0;padding:0;list-style:none;font:var(--fs-s) var(--mono);color:var(--ink-2)}
.eq-prev{border:1px solid var(--line-strong);background:var(--raised);border-radius:var(--r2);padding:var(--s3);margin:var(--s2) 0}
.eq-prev b{font-family:var(--mono)}
.eq-tare input{width:100%;background:var(--sunken);border:1px solid var(--line-strong);border-radius:var(--r1);padding:4px 8px;font:var(--fs-m) var(--mono)}
.eq-tare input[aria-invalid="true"]{border-color:var(--crit)}
.eq-tare td{padding:3px 4px}
.eq-err{color:var(--crit);font-size:var(--fs-s);margin:var(--s1) 0}
.eq-warn{color:var(--warn);font-size:var(--fs-s);margin:var(--s1) 0}
.eq-group{margin-top:var(--s2);padding-top:var(--s2);border-top:1px solid var(--line)}
@media (max-width:900px){ .eq-grid{grid-template-columns:minmax(0,1fr)} }
.eq-grid>*{min-width:0}
/* SLED-036: вкладки реестра, шаги опросника, предпросмотр «было -> стало». Только токены. */
.eq-tabs{display:flex;gap:var(--s1);flex-wrap:wrap;border-bottom:1px solid var(--line);margin-bottom:var(--s3)}
.eq-tab{background:none;border:0;border-bottom:2px solid transparent;padding:var(--s2) var(--s3);color:var(--ink-2);font:inherit;cursor:pointer;min-height:36px}
.eq-tab:hover{color:var(--ink);background:var(--hover)}
.eq-tab[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--accent);font-weight:600}
.eq-tab:focus-visible,.eq-step:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.eq-steps{list-style:none;margin:var(--s3) 0;padding:0;display:flex;gap:var(--s1);flex-wrap:wrap}
.eq-step{display:inline-flex;align-items:center;gap:var(--s2);background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r2);padding:var(--s1) var(--s3);min-height:34px;color:var(--ink-2);font:inherit;cursor:pointer}
.eq-step .num{font:600 var(--fs-xs)/1 var(--mono);border:1px solid currentColor;border-radius:50%;min-width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center}
.eq-step[aria-current="step"]{border-color:var(--accent);color:var(--ink);background:var(--accent-soft);font-weight:600}
.eq-step .dot{color:var(--warn)}
.eq-nav{justify-content:space-between;margin-top:var(--s4)}
.eq-wrap{overflow-x:auto;max-width:100%}
.eq-tbl input,.eq-tbl select{width:100%;min-width:70px;background:var(--sunken);border:1px solid var(--line-strong);border-radius:var(--r1);padding:4px 8px;font:var(--fs-m) var(--font);color:var(--ink)}
.eq-tbl input[aria-invalid="true"]{border-color:var(--crit)}
.eq-tbl td{padding:3px 4px;vertical-align:top}
.eq-was{color:var(--ink-3);text-decoration:line-through}
.eq-now{color:var(--ok)}
.eq-arrow{color:var(--ink-3)}
.eq-st.bad{color:var(--crit);border-color:color-mix(in srgb,var(--crit) 50%,transparent)}
.eq-st.bad::before{content:"✕ "}
.eq-st.chg{color:var(--info);border-color:color-mix(in srgb,var(--info) 45%,transparent)}
.eq-st.chg::before{content:"■ "}
.eq-diff{margin:0;padding:0;list-style:none;font-size:var(--fs-s)}
.eq-diff li{padding:1px 0}
.eq-box{border:1px solid var(--line);border-radius:var(--r2);background:var(--sunken);padding:var(--s3);margin:var(--s2) 0}
.eq-ok{color:var(--ok);font-size:var(--fs-s);margin:var(--s1) 0}
.eq-chk{display:flex;align-items:center;gap:var(--s2);min-height:28px}
.eq-chk input{flex:none}
.eq-drop{border:1px dashed var(--line-strong);border-radius:var(--r2);padding:var(--s4);text-align:center;color:var(--ink-2)}
.eq-journal td{vertical-align:top}
.eq-wrap caption{text-align:left;font-weight:600;padding:var(--s2) 0;color:var(--ink)}
@media (max-width:600px){
  .eq-tabs,.eq-steps{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}
  .eq-tab,.eq-step{flex:none;white-space:nowrap}
  .eq-tab,.eq-step,.eq-nav .btn,.eq-box .btn{min-height:44px}
  .eq-row .f{flex:1 1 100%}
  .eq-live{grid-template-columns:1fr}
}

/* =====================================================================
   SLED-040 · плеер смены, состояния и легенда карты, popup MapLibre
   Спецификация и разметка: docs/дизайн/SLED-040-плеер-и-карта.md
   Правила: карта тёмная в обеих темах (--map-*), плеер и легенда подчиняются теме продукта;
   медь — только выбор/фокус (выбранное событие, фокус), не статус; всё значимое — цвет И форма.
   ===================================================================== */

/* ---------- плеер под графиком скорости ---------- */
.sl-player{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"play time speed" "rail rail rail" "ev ev ev" "status status status" "hint hint hint";align-items:center;gap:var(--s2) var(--s3);margin-top:var(--s3);padding-top:var(--s3);border-top:1px solid var(--line)}
.sl-player[data-state="disabled"]{opacity:.55}
.sl-player[data-state="disabled"] :is(button,input){cursor:not-allowed}
.sl-player__play{grid-area:play;position:relative;width:40px;height:40px;padding:0;border-radius:var(--r2);background:var(--raised);border:1px solid var(--line-strong);cursor:pointer;display:grid;place-items:center;transition:background var(--t-fast),border-color var(--t-fast)}
.sl-player__play:hover{background:var(--hover);border-color:var(--ink-3)}
.sl-player__play:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* значок рисуется формой: ▶ — треугольник, пауза — две полосы; цвет смысла не несёт */
.sl-player__play::before{content:"";display:block;width:0;height:0;border-style:solid;border-width:7px 0 7px 12px;border-color:transparent transparent transparent var(--ink);margin-left:3px}
.sl-player__play[aria-pressed="true"]::before{width:12px;height:14px;border:0;margin:0;background:linear-gradient(90deg,var(--ink) 0 4px,transparent 4px 8px,var(--ink) 8px 12px)}
.sl-player__time{grid-area:time;display:flex;align-items:baseline;gap:var(--s2);min-width:0;font:500 var(--fs-xl)/1.1 var(--mono);font-variant-numeric:tabular-nums;color:var(--ink);white-space:nowrap}
.sl-player__time small{font:400 var(--fs-xs)/1.2 var(--mono);color:var(--ink-3);overflow:hidden;text-overflow:ellipsis}
.sl-player__speed{grid-area:speed;display:inline-flex;border:1px solid var(--line-strong);border-radius:var(--r2);overflow:hidden;background:var(--sunken)}
.sl-player__sp{all:unset;box-sizing:border-box;min-width:42px;height:38px;display:grid;place-items:center;padding:0 var(--s2);cursor:pointer;color:var(--ink-2);font:500 var(--fs-s)/1 var(--mono);border-left:1px solid var(--line);transition:background var(--t-fast),color var(--t-fast)}
.sl-player__sp:first-child{border-left:0}
.sl-player__sp:hover{color:var(--ink);background:var(--hover)}
/* выбранная скорость — инверсная заливка + полоса снизу (форма), не только цвет; для скринридера — aria-pressed */
.sl-player__sp[aria-pressed="true"]{background:var(--ink);color:var(--bg);box-shadow:inset 0 -3px 0 var(--accent)}
.sl-player__sp:focus-visible{outline:2px solid var(--accent);outline-offset:-3px}
.sl-player__rail{grid-area:rail;position:relative;height:32px;display:flex;align-items:center}
.sl-player__range{--sl-p:0%;-webkit-appearance:none;appearance:none;position:relative;z-index:1;width:100%;height:32px;margin:0;background:transparent;cursor:pointer;touch-action:none}
.sl-player__range::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--pl-fill) var(--sl-p),var(--pl-rail) var(--sl-p))}
.sl-player__range::-moz-range-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--pl-fill) var(--sl-p),var(--pl-rail) var(--sl-p))}
/* бегунок — вертикальная планка (тот же образ, что линия времени на графике) */
.sl-player__range::-webkit-slider-thumb{-webkit-appearance:none;width:8px;height:22px;margin-top:-9px;border-radius:2px;background:var(--ink);border:2px solid var(--surface);box-shadow:0 0 0 1px var(--ink-3)}
.sl-player__range::-moz-range-thumb{width:4px;height:18px;border-radius:2px;background:var(--ink);border:2px solid var(--surface);box-shadow:0 0 0 1px var(--ink-3)}
.sl-player__range:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--r1)}
.sl-player__range:disabled{cursor:not-allowed}
/* метки на рейке: пропуски данных (штриховка) и события (засечки); позиция — left/width в %, задаёт frontend */
.sl-player__marks{position:absolute;left:0;right:0;top:50%;height:0;pointer-events:none}
.sl-player__gap{position:absolute;top:-7px;height:14px;min-width:3px;border:1px dashed var(--stale);border-radius:1px;background:repeating-linear-gradient(135deg,var(--stale-soft) 0 3px,transparent 3px 6px)}
.sl-player__tick{position:absolute;top:-11px;width:0;height:0;margin-left:-4px;border-left:4px solid transparent;border-right:4px solid transparent;border-top:7px solid var(--ink-2)}
.sl-player__tick.is-sel{border-top-color:var(--accent);border-left-width:5px;border-right-width:5px;border-top-width:9px;margin-left:-5px}
.sl-player__ev{grid-area:ev;display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap;padding:6px var(--s2);border:1px solid var(--line-strong);border-left:3px solid var(--accent);border-radius:var(--r1);background:var(--accent-soft);color:var(--ink);font-size:var(--fs-s)}
.sl-player__evtxt{flex:1 1 160px;min-width:0;overflow-wrap:anywhere}
.sl-player__status{grid-area:status;margin:0;display:flex;align-items:center;gap:6px;min-height:18px;font-size:var(--fs-s);color:var(--ink-2)}
.sl-player__status:empty{display:none}
.sl-player[data-state="gap"] .sl-player__status{color:var(--ink);font-weight:500}
.sl-player__hint{grid-area:hint;margin:0;font-size:var(--fs-xs);line-height:1.4;color:var(--ink-3)}
.sl-player kbd{font:500 var(--fs-xs)/1 var(--mono);padding:1px 4px;border:1px solid var(--line-strong);border-bottom-width:2px;border-radius:var(--r1);background:var(--sunken);color:var(--ink-2)}

/* вертикальная линия времени поверх #chSpeed; внутри .chartbox (position:relative); X в пикселях — var(--sl-x) */
.sl-chartline{position:absolute;top:0;bottom:0;left:0;width:0;transform:translateX(var(--sl-x,0px));pointer-events:none;z-index:2}
.sl-chartline::before{content:"";position:absolute;top:18px;bottom:0;left:-1px;width:2px;background:var(--ink);box-shadow:0 0 0 1px var(--surface)}
.sl-chartline__tag{position:absolute;top:0;left:0;transform:translateX(-50%);padding:1px 6px;border:1px solid var(--ink-3);border-radius:var(--r1);background:var(--raised);color:var(--ink);font:500 var(--fs-xs)/16px var(--mono);white-space:nowrap}
.sl-chartline[data-edge="l"] .sl-chartline__tag{transform:translateX(-4px)}
.sl-chartline[data-edge="r"] .sl-chartline__tag{transform:translateX(calc(-100% + 4px))}
/* пропуск данных: линия пунктиром, подпись вместо времени — «нет данных», не «стоянка» */
.sl-chartline.is-gap::before{background:repeating-linear-gradient(180deg,var(--ink) 0 5px,transparent 5px 9px)}
.sl-chartline.is-gap .sl-chartline__tag{border-style:dashed;color:var(--ink-2)}
.chartbox.sl-seek{cursor:crosshair}

/* ---------- SLED-046: график уровня топлива на «Обзоре смены» (курсор плеера — тот же .sl-chartline) ---------- */
.sl-chartline--bare::before{top:0}
.sl-fuel{margin-top:var(--s4)}
.sl-fuel h3 small{margin-left:var(--s2)}
.sl-fuelmarks{position:absolute;inset:0;z-index:3;pointer-events:none}
.sl-fmark{position:absolute;width:28px;height:28px;padding:0;margin:0;transform:translate(-50%,-50%);border:0;border-radius:var(--r2);background:transparent;cursor:pointer;pointer-events:auto;font:700 14px/1 var(--mono);display:grid;place-items:center}
.sl-fmark span{text-shadow:0 0 3px var(--surface),0 0 3px var(--surface),0 0 5px var(--surface)}
.sl-fmark[hidden]{display:none}
.sl-fmark--refuel,.sl-fmark__key.sl-fmark--refuel{color:var(--ok)}
.sl-fmark--drain,.sl-fmark__key.sl-fmark--drain{color:var(--crit)}
.sl-fmark:hover{background:var(--hover)}
.sl-fmark[aria-pressed="true"]{background:var(--raised);box-shadow:0 0 0 1.5px currentColor}
.sl-fuel__pop{margin:var(--s2) 0 0;padding:var(--s2) var(--s3);border:1px solid var(--line-strong);border-radius:var(--r2);background:var(--raised);color:var(--ink);font:500 var(--fs-s)/1.4 var(--mono)}
.sl-fuel__pop[hidden],.sl-fuelmsg[hidden],.sl-fuel[hidden]{display:none}
.sl-fuel__legend{list-style:none;margin:var(--s2) 0 0;padding:0;display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);font-size:var(--fs-s);color:var(--ink-2)}
.sl-fuel__legend li{display:inline-flex;align-items:center;gap:6px}
.sl-fuel__legend .sl-fuel__note{flex-basis:100%;color:var(--ink-3);font-size:var(--fs-xs)}
.sl-fmark__key{font:700 13px/1 var(--mono)}
.sl-fuelmsg{margin-top:var(--s3);padding:var(--s2) var(--s3);border:1px dashed var(--line-strong);border-radius:var(--r2);color:var(--ink-2);font-size:var(--fs-s);display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2)}
.sl-fuel__bak{margin:var(--s3) 0 var(--s1);font-size:var(--fs-s);color:var(--ink-2);font-weight:600}
@media (prefers-reduced-motion:reduce){ .sl-fmark{transition:none} }

/* ---------- карта: контейнер, маркер времени, выбранное событие ---------- */
.sl-map{position:relative;border-radius:var(--r2);overflow:hidden;background:var(--map-ground);color:var(--map-ink)}
.sl-map{--sl-attr-h:28px}   /* высота зоны атрибуции, которую не перекрывают состояния */
.sl-map #map,.sl-map #emap{height:340px;border-radius:0;background:var(--map-ground)}   /* карта тёмная и в светлой теме */
.sl-marker{width:22px;height:22px;position:relative;transform:rotate(var(--sl-hdg,0deg));pointer-events:none}
.sl-marker::before{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--map-ink);border:3px solid var(--map-ground);box-shadow:0 0 0 1px var(--map-ink-2)}
.sl-marker::after{content:"";position:absolute;left:50%;top:-4px;margin-left:-5px;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:8px solid var(--map-ink);filter:drop-shadow(0 0 1px var(--map-ground))}
.sl-marker[hidden]{display:none!important}   /* пропуск данных: маркер скрыт, причина — в .sl-player__status */
.sl-evmark{width:28px;height:28px;border-radius:50%;border:3px solid var(--map-ctl);box-shadow:0 0 0 2px var(--map-ground),inset 0 0 0 2px var(--map-ground);background:transparent;pointer-events:none}

/* ---------- состояния карты (поверх #map; низ — var(--sl-attr-h) — оставлен атрибуции) ---------- */
.sl-mapstate{position:absolute;left:0;right:0;top:0;bottom:var(--sl-attr-h);z-index:5;display:flex;align-items:center;justify-content:center;padding:var(--s4);background:var(--map-ground);color:var(--map-ink);text-align:center}
.sl-mapstate__box{max-width:340px;display:flex;flex-direction:column;align-items:center;gap:var(--s2)}
.sl-mapstate__ico{display:grid;place-items:center;width:28px;height:28px;color:var(--map-ink-2)}
.sl-mapstate__ico::before{content:"";display:block;width:16px;height:16px;box-sizing:border-box}
.sl-mapstate[data-kind="empty"] .sl-mapstate__ico::before{border:2px dashed var(--map-ink-2);border-radius:50%}                  /* ◌ данных нет */
.sl-mapstate[data-kind="nocoords"] .sl-mapstate__ico::before{border:2px solid var(--map-ink-2);transform:rotate(45deg);width:12px;height:12px}   /* ◇ координат нет */
.sl-mapstate[data-kind="error"] .sl-mapstate__ico::before{width:0;height:0;border-left:9px solid transparent;border-right:9px solid transparent;border-bottom:16px solid var(--map-over)}   /* ▲ внимание */
.sl-mapstate[data-kind="loading"] .sl-mapstate__ico::before{border:2px solid var(--map-line);border-top-color:var(--map-ink);border-radius:50%;animation:spin .9s linear infinite}
.sl-mapstate__t{margin:0;font:600 var(--fs-m)/1.3 var(--font);color:var(--map-ink)}
.sl-mapstate__d{margin:0;font-size:var(--fs-s);line-height:1.45;color:var(--map-ink-2)}
/* нет связи с сервером тайлов: трек и маркеры остаются, поэтому не заслон, а полоса сверху (справа место под +/−) */
.sl-mapstate[data-kind="offline"]{inset:var(--s2) 52px auto var(--s2);padding:6px var(--s2);justify-content:flex-start;gap:var(--s2);flex-wrap:wrap;text-align:left;border:1px solid var(--map-line);border-left:3px solid var(--map-over);border-radius:var(--r1);background:color-mix(in srgb,var(--map-card) 94%,transparent);font-size:var(--fs-s)}
.sl-mapstate[data-kind="offline"] .sl-mapstate__box{max-width:none;flex-direction:row;flex-wrap:wrap;align-items:center;text-align:left;flex:1 1 200px}
.sl-mapstate[data-kind="offline"] .sl-mapstate__ico{width:18px;height:18px}
.sl-mapstate[data-kind="offline"] .sl-mapstate__ico::before{width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:12px solid var(--map-over)}
.sl-mapstate__btn{min-height:32px;padding:5px 12px;border:1px solid var(--map-ctl);border-radius:var(--r1);background:var(--map-inner);color:var(--map-ink);font:500 var(--fs-s)/1.2 var(--font);cursor:pointer}
.sl-mapstate__btn:hover{background:var(--map-line)}
.sl-mapstate__btn:focus-visible{outline:2px solid var(--map-ink);outline-offset:2px}

/* ---------- легенда (под картой, подчиняется теме; образцы — на тёмной «плашке» карты, цвета одинаковы в обеих темах) ---------- */
.sl-legend{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s4);margin:var(--s2) 0 0;padding:0;list-style:none;font-size:var(--fs-xs);color:var(--ink-2)}
.sl-legend li{display:inline-flex;align-items:center;gap:6px;min-height:20px}
.sl-legend__sw{position:relative;flex:none;width:34px;height:16px;border-radius:var(--r1);background:var(--map-ground);border:1px solid var(--map-line)}
.sl-legend__sw::before{content:"";position:absolute;left:4px;right:4px;top:50%;border-top:3px solid var(--map-move);transform:translateY(-50%)}
.sl-legend__sw::after{content:"";position:absolute;left:50%;top:50%;box-sizing:content-box;transform:translate(-50%,-50%);background:var(--map-move);outline:2px solid var(--map-ground)}
.sl-legend__sw--move::after{width:7px;height:7px;border-radius:50%}                                                       /* ● */
.sl-legend__sw--stop::before{border-top:3px dotted var(--map-stop)}
.sl-legend__sw--stop::after{width:7px;height:7px;background:var(--map-stop);border-radius:1px}                              /* ■ */
.sl-legend__sw--over::before{border-top:5px solid var(--map-over)}
.sl-legend__sw--over::after{width:7px;height:7px;background:var(--map-over);transform:translate(-50%,-50%) rotate(45deg)}     /* ◆ */
.sl-legend__sw--gap::before{border-top:2px dashed var(--map-gap)}
.sl-legend__sw--gap::after{width:5px;height:5px;background:var(--map-ground);border:2px dotted var(--map-gap);border-radius:50%;outline:0} /* ◌ */
.sl-legend__sw--sel::before,.sl-legend__sw--cur::before{display:none}
.sl-legend__sw--sel::after{width:10px;height:10px;background:transparent;border:2px solid var(--map-ctl);border-radius:50%;outline:0}
.sl-legend__sw--cur::after{width:8px;height:8px;background:var(--map-ink);border:2px solid var(--map-ground);border-radius:50%;outline:0;box-shadow:0 0 0 1px var(--map-ink-2)}

/* ---------- MapLibre: элементы управления, атрибуция, popup — нейтральные, в стиле продукта ---------- */
.sl-map .maplibregl-ctrl-group{background:var(--map-card);border:1px solid var(--map-line);border-radius:var(--r2);box-shadow:none}
.sl-map .maplibregl-ctrl-group button{width:32px;height:32px;background:transparent;border:0;border-top:1px solid var(--map-line)}
.sl-map .maplibregl-ctrl-group button:first-child{border-top:0}
.sl-map .maplibregl-ctrl-group button:hover{background:var(--map-inner)}
.sl-map .maplibregl-ctrl-group button:focus-visible{outline:2px solid var(--map-ctl);outline-offset:-2px;border-radius:0}
.sl-map .maplibregl-ctrl-icon{filter:invert(.9)}   /* встроенные значки MapLibre тёмные — на тёмной карте инвертируем */
/* атрибуция всегда раскрыта (OSM/OpenMapTiles/OpenFreeMap) и не перекрыта: оверлеи состояний оставляют низ свободным */
.sl-map .maplibregl-ctrl-bottom-right{z-index:6;max-width:100%}
.sl-map .maplibregl-ctrl.maplibregl-ctrl-attrib{background-color:rgba(17,17,17,.88);color:var(--map-ink-2);font:var(--fs-xs)/1.4 var(--font);padding:1px 6px;margin:0 4px 4px 0;border-radius:var(--r1)}
.sl-map .maplibregl-ctrl.maplibregl-ctrl-attrib a{color:var(--map-ink);text-decoration:underline;text-underline-offset:2px}
.sl-map .maplibregl-ctrl-attrib-button{display:none}
.sl-map .maplibregl-ctrl-attrib.maplibregl-compact .maplibregl-ctrl-attrib-inner{display:block}
.sl-map .maplibregl-ctrl.maplibregl-ctrl-attrib.maplibregl-compact{padding:1px 6px;min-height:0;min-width:0}
.sl-map .maplibregl-ctrl.maplibregl-ctrl-attrib:has(.maplibregl-ctrl-attrib-inner:empty){display:none}   /* стиль не загрузился — пустой блок не рисуем; причина — в статусе карты */
@media (max-width:640px){.sl-map .maplibregl-ctrl-scale{display:none}}   /* на узком экране шкала накладывается на атрибуцию */
/* SLED-053: атрибуция карты «Обстановки» (#fmapGl без класса .sl-map): плотная тёмная плашка поверх шкалы и маркеров, читаема в обеих темах */
#fmapGl .maplibregl-ctrl-bottom-right{z-index:700;max-width:100%}
#fmapGl .maplibregl-ctrl.maplibregl-ctrl-attrib,#fmapGl .maplibregl-ctrl.maplibregl-ctrl-attrib.maplibregl-compact{background-color:rgba(17,17,17,.94);color:var(--map-ink-2);font:var(--fs-xs)/1.4 var(--font);padding:2px 6px;margin:0 4px 4px 0;border-radius:var(--r1);min-height:0;min-width:0}
#fmapGl .maplibregl-ctrl.maplibregl-ctrl-attrib a{color:var(--map-ink);text-decoration:underline;text-underline-offset:2px}
#fmapGl .maplibregl-ctrl-attrib-button{display:none}
#fmapGl .maplibregl-ctrl-attrib.maplibregl-compact .maplibregl-ctrl-attrib-inner{display:block}
@media (max-width:640px){#fmapGl .maplibregl-ctrl-scale{display:none}}
.sl-map .maplibregl-popup{max-width:280px!important;font:var(--fs-s)/1.4 var(--font)}
.sl-map .maplibregl-popup-content{padding:var(--s2) var(--s3);background:var(--map-card);color:var(--map-ink);border:1px solid var(--map-line);border-radius:var(--r2);box-shadow:0 6px 18px rgba(0,0,0,.45)}
.sl-map .maplibregl-popup-anchor-top .maplibregl-popup-tip,.sl-map .maplibregl-popup-anchor-top-left .maplibregl-popup-tip,.sl-map .maplibregl-popup-anchor-top-right .maplibregl-popup-tip{border-bottom-color:var(--map-line)}
.sl-map .maplibregl-popup-anchor-bottom .maplibregl-popup-tip,.sl-map .maplibregl-popup-anchor-bottom-left .maplibregl-popup-tip,.sl-map .maplibregl-popup-anchor-bottom-right .maplibregl-popup-tip{border-top-color:var(--map-line)}
.sl-map .maplibregl-popup-anchor-left .maplibregl-popup-tip{border-right-color:var(--map-line)}
.sl-map .maplibregl-popup-anchor-right .maplibregl-popup-tip{border-left-color:var(--map-line)}
.sl-map .maplibregl-popup-close-button{width:28px;height:28px;font-size:18px;line-height:1;color:var(--map-ink-2);background:transparent;border:0;border-radius:var(--r1);cursor:pointer}
.sl-map .maplibregl-popup-close-button:hover{background:var(--map-inner);color:var(--map-ink)}
.sl-map .maplibregl-popup-close-button:focus-visible{outline:2px solid var(--map-ctl);outline-offset:-2px}
.sl-pop{display:flex;flex-direction:column;gap:2px;padding-right:20px}
.sl-pop__t{font-weight:600;color:var(--map-ink)}
.sl-pop__time{font:500 var(--fs-xs)/1.3 var(--mono);color:var(--map-ink-2)}
.sl-pop__row{color:var(--map-ink-2)}
.sl-pop__btn{align-self:flex-start;margin-top:var(--s1);padding:4px 10px;border:1px solid var(--map-ctl);border-radius:var(--r1);background:var(--map-inner);color:var(--map-ink);font:500 var(--fs-s)/1.2 var(--font);cursor:pointer}
.sl-pop__btn:focus-visible{outline:2px solid var(--map-ink);outline-offset:2px}

/* ---------- «События смены»: клик — время и карта, «Разбор» / Enter / двойной клик — эпизод ---------- */
tr.sl-evrow{cursor:pointer}
tr.sl-evrow:hover td{background:var(--hover)}
tr.sl-evrow:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
tr.sl-evrow.is-sel td{background:var(--accent-soft)}
tr.sl-evrow.is-sel td:first-child{box-shadow:inset 3px 0 0 var(--accent)}
.sl-evact{width:1%;white-space:nowrap;text-align:right}
.sl-evbtn{min-height:28px}

/* ---------- телефон 390 px и сенсорные экраны: цели не меньше 44 px ---------- */
@media (pointer:coarse),(max-width:600px){
  .sl-player__play{width:44px;height:44px}
  .sl-player__sp{height:44px;min-width:44px}
  .sl-player__rail,.sl-player__range{height:44px}
  .sl-player__range::-webkit-slider-thumb{width:12px;height:28px;margin-top:-12px}
  .sl-player__range::-moz-range-thumb{width:8px;height:24px}
  .sl-evbtn,.sl-mapstate__btn,.sl-pop__btn{min-height:44px;min-width:44px}
  .sl-map .maplibregl-ctrl-group button{width:44px;height:44px}
  .sl-map .maplibregl-popup-close-button{width:44px;height:44px}
  tr.sl-evrow td{padding-top:10px;padding-bottom:10px}
}
@media (max-width:600px){
  .sl-player{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"play time" "rail rail" "speed speed" "ev ev" "status status" "hint hint"}
  .sl-player__speed{display:grid;grid-template-columns:repeat(4,1fr)}
  .sl-player__hint .kb-only{display:none}
  .sl-mapstate[data-kind="offline"]{right:60px}   /* +/− на телефоне 44 px — полоса не заходит под них */
  .sl-map{--sl-attr-h:46px}   /* на 390 px атрибуция переносится на 2 строки */
  .sl-map #map,.sl-map #emap{height:300px}
}
/* ревью SLED-040: карточка карты заполняет высоту строки сетки (при 1440 справа график + плеер выше) — карта растёт, легенда у низа, пустоты нет.
   Высота карты не меньше прежних 340 px (300 на телефоне); MapLibre пересчитывает размер сам (ResizeObserver) */
.card:has(>.sl-map){display:flex;flex-direction:column}
.card>.sl-map{flex:1 1 auto;min-height:340px;display:flex;flex-direction:column}
.card>.sl-map>#map,.card>.sl-map>#emap{flex:1 1 auto;height:auto;min-height:340px}
.card>.sl-legend{flex:none}
@media (max-width:1100px){ .card>.sl-map{flex:none} }
@media (max-width:600px){ .card>.sl-map,.card>.sl-map>#map,.card>.sl-map>#emap{min-height:300px} }
/* таблица «События смены» на ≤600 px: строка-сетка вместо горизонтальной прокрутки — кнопка «Разбор» (≥44 px) всегда в поле зрения, форма важности ◆▲■ сохранена */
@media (max-width:600px){
  #tblEventsShort,#tblEventsShort tbody{display:block;width:100%}
  #tblEventsShort tr:has(>th){display:none}
  #tblEventsShort tr.sl-evrow{display:grid;grid-template-columns:auto 20px minmax(0,1fr) auto;grid-template-areas:"t s e a" "t s v a";column-gap:var(--s2);align-items:center;border-bottom:1px solid var(--line);padding:var(--s1) 0}
  #tblEventsShort tr.sl-evrow>td{display:block;border:0;padding:2px 0;min-width:0;background:transparent}
  #tblEventsShort tr.sl-evrow.is-sel{background:var(--accent-soft);box-shadow:inset 3px 0 0 var(--accent)}
  #tblEventsShort tr.sl-evrow.is-sel>td{background:transparent;box-shadow:none}
  #tblEventsShort tr.sl-evrow:hover{background:var(--hover)}
  #tblEventsShort tr.sl-evrow>td:nth-child(1){grid-area:t;min-width:3.4em;padding-left:var(--s2)}
  #tblEventsShort tr.sl-evrow>td:nth-child(2){grid-area:s}
  #tblEventsShort tr.sl-evrow>td:nth-child(3){grid-area:e;overflow-wrap:anywhere}
  #tblEventsShort tr.sl-evrow>td:nth-child(4){grid-area:v;color:var(--ink-2);font-size:var(--fs-s)}
  #tblEventsShort tr.sl-evrow>td.sl-evact{grid-area:a;width:auto;padding-right:var(--s1)}
}
@media print{ .sl-player,.sl-mapstate,.sl-chartline{display:none!important} }

/* ===== SLED-010: блок «Отклонения» на «Обстановке» (очередь с сервера: /api/focus/queue). Только токены; маркеры формы — как у .sev. */
.foc{border:1px solid var(--line);border-radius:var(--r3);background:var(--surface);min-width:0}
.foc>summary{list-style:none;cursor:pointer;display:flex;align-items:center;flex-wrap:wrap;gap:var(--s3);padding:8px var(--s3);font:500 var(--fs-sm)/1.3 var(--font);color:var(--ink)}
.foc>summary::-webkit-details-marker{display:none}
.foc>summary:hover{background:var(--hover)}
.foc>summary:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.foc-t{font-weight:600}
.foc-n{font:500 var(--fs-xs)/1.2 var(--mono);color:var(--ink-2)}
.foc-fresh{margin-left:auto;font:500 var(--fs-xs)/1.2 var(--mono);color:var(--ink-3)}
.foc-body{border-top:1px solid var(--line);max-height:240px;overflow:auto}
.foc-row{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:var(--s2);align-items:start;padding:8px var(--s3);border-bottom:1px solid var(--line)}
.foc-row:last-child{border-bottom:0}
.foc-h{font-weight:600;font-size:var(--fs-sm);color:var(--ink)}
.foc-s{font-size:var(--fs-xs);color:var(--ink-2);margin-top:2px}
.foc-b{font-size:var(--fs-xs);color:var(--ink-3);margin-top:2px}
.foc-m{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:4px;font:500 var(--fs-xs)/1.2 var(--mono);color:var(--ink-2)}
.foc-c.low{color:var(--warn)} .foc-c.high{color:var(--ok)}
.foc-go{white-space:nowrap}
.foc-msg{padding:var(--s3);font-size:var(--fs-sm);color:var(--ink-2)}
.foc-msg.err{color:var(--crit)}
.foc-m span+span::before{content:"· ";color:var(--ink-3)}