/* Оформление внутренней системы AKF — фирменный стиль «Стройплощадка» (26.10.2026; владелец: «давай дальше» на рекомендацию).
   Знак — буква «А»-ферма с красной балкой. Бетонный фон, графитовые чернила, один красный акцент.
   Темы: data-theme="light" (Бетон, основная), "dark" (Графит), "sapphire" (Ночь). Всё цветное — через переменные ниже. */

@font-face { font-family: "Unbounded"; font-weight: 400 800; font-display: swap; src: url(../fonts/unbounded-cyrillic-ext.woff2) format("woff2"); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: "Unbounded"; font-weight: 400 800; font-display: swap; src: url(../fonts/unbounded-cyrillic.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Unbounded"; font-weight: 400 800; font-display: swap; src: url(../fonts/unbounded-latin-ext.woff2) format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Unbounded"; font-weight: 400 800; font-display: swap; src: url(../fonts/unbounded-latin.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: "Golos Text"; font-weight: 400 700; font-display: swap; src: url(../fonts/golostext-cyrillic-ext.woff2) format("woff2"); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: "Golos Text"; font-weight: 400 700; font-display: swap; src: url(../fonts/golostext-cyrillic.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Golos Text"; font-weight: 400 700; font-display: swap; src: url(../fonts/golostext-latin-ext.woff2) format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Golos Text"; font-weight: 400 700; font-display: swap; src: url(../fonts/golostext-latin.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, [data-theme="light"] {
  /* Бетон: светлый, для улицы и телефона на солнце */
  --bg: #E9EBEA;
  --bg-glow: none;
  --surface: #FFFFFF;
  --surface-2: #F3F4F4;
  --surface-hover: #F7F8F8;
  --line: #D9DDE0;
  --text: #1B2430;
  --text-soft: #36414E;
  --muted: #5B6573;
  --accent: #C8102E;
  --accent-grad: linear-gradient(#C8102E, #C8102E);
  --accent-glow: transparent;
  --accent-soft: rgba(200, 16, 46, .08);
  --on-accent: #FFFFFF;
  --btn: #1B2430;
  --on-btn: #FFFFFF;
  --ink: #1B2430;
  --panel-bg: #1B2430;
  --hero-bg: #1B2430;
  --input-bg: #FFFFFF;
  --shadow: none;
  --shadow-hover: 0 2px 0 rgba(27, 36, 48, .08);
  --ok: #13744F; --ok-bg: #E2F2EA;
  --wait: #845400; --wait-bg: #FBF0D6;
  --alarm: #B0101F; --alarm-bg: #FBE6E8; --alarm-row: #FCEEEF;
  color-scheme: light;
}
[data-theme="dark"] {
  /* Графит: тёмный, для вечера */
  --bg: #13171C;
  --surface: #1B2027;
  --surface-2: #20262E;
  --surface-hover: #242B34;
  --line: #2F3742;
  --text: #ECEFF2;
  --text-soft: #C4CBD3;
  --muted: #949DA9;
  --accent: #FF5C64;
  --accent-grad: linear-gradient(#C8102E, #C8102E);
  --accent-soft: rgba(255, 92, 100, .12);
  --btn: #C8102E;
  --on-btn: #FFFFFF;
  --ink: #ECEFF2;
  --panel-bg: #0E1115;
  --hero-bg: #0E1115;
  --input-bg: #161A20;
  --shadow: none;
  --shadow-hover: none;
  --ok: #4ED3A0; --ok-bg: rgba(78, 211, 160, .12);
  --wait: #F2C14E; --wait-bg: rgba(242, 193, 78, .12);
  --alarm: #FF7A80; --alarm-bg: rgba(255, 122, 128, .12); --alarm-row: rgba(255, 122, 128, .07);
  color-scheme: dark;
}
[data-theme="sapphire"] {
  /* Ночь: тёмно-синий с золотом */
  --bg: #0B1322;
  --surface: #121C30;
  --surface-2: #172239;
  --surface-hover: #1B2843;
  --line: #24345A;
  --text: #EDF1F9;
  --text-soft: #C5CFE2;
  --muted: #94A2BE;
  --accent: #E2B65C;
  --accent-grad: linear-gradient(#E2B65C, #E2B65C);
  --accent-soft: rgba(226, 182, 92, .12);
  --on-accent: #1B1405;
  --btn: #E2B65C;
  --on-btn: #1B1405;
  --ink: #EDF1F9;
  --panel-bg: #070D1A;
  --hero-bg: #070D1A;
  --input-bg: #0E182B;
  --shadow: none;
  --shadow-hover: none;
  --ok: #4FD1A5; --ok-bg: rgba(79, 209, 165, .12);
  --wait: #F1D38A; --wait-bg: rgba(241, 211, 138, .12);
  --alarm: #FF7A80; --alarm-bg: rgba(255, 122, 128, .12); --alarm-row: rgba(255, 122, 128, .07);
  color-scheme: dark;
}
/* ---------- Ещё 7 палитр (26.10.2026): Сталь, Хаки, Песок, Кирпич — светлые; Сигнал, Изумруд, Аметист — тёмные ---------- */
[data-theme="steel"] {
  /* Сталь */
  --bg: #E4E9EF; --surface: #FFFFFF; --surface-2: #F1F4F7; --surface-hover: #F6F8FA; --line: #D3DAE2;
  --text: #142233; --text-soft: #33445A; --muted: #56657A;
  --accent: #1F5FAD; --accent-grad: linear-gradient(#1F5FAD, #1F5FAD); --accent-soft: rgba(31, 95, 173, 0.1); --on-accent: #FFFFFF;
  --btn: #142233; --on-btn: #FFFFFF; --ink: #142233; --panel-bg: #142233; --hero-bg: #142233; --input-bg: #FFFFFF;
  color-scheme: light;
}
[data-theme="khaki"] {
  /* Хаки */
  --bg: #E6E7DD; --surface: #FFFFFF; --surface-2: #F2F3EC; --surface-hover: #F7F8F2; --line: #D4D6C8;
  --text: #23291C; --text-soft: #3C4433; --muted: #5C6450;
  --accent: #5E6C22; --accent-grad: linear-gradient(#5E6C22, #5E6C22); --accent-soft: rgba(94, 108, 34, 0.1); --on-accent: #FFFFFF;
  --btn: #2E3624; --on-btn: #FFFFFF; --ink: #23291C; --panel-bg: #2E3624; --hero-bg: #2E3624; --input-bg: #FFFFFF;
  color-scheme: light;
}
[data-theme="sand"] {
  /* Песок */
  --bg: #ECE6DA; --surface: #FFFFFF; --surface-2: #F5F1E9; --surface-hover: #F9F6F0; --line: #DDD4C3;
  --text: #2B2418; --text-soft: #4A3F2E; --muted: #6B5F4B;
  --accent: #A0521A; --accent-grad: linear-gradient(#A0521A, #A0521A); --accent-soft: rgba(160, 82, 26, 0.1); --on-accent: #FFFFFF;
  --btn: #2B2418; --on-btn: #FFFFFF; --ink: #2B2418; --panel-bg: #2B2418; --hero-bg: #2B2418; --input-bg: #FFFFFF;
  color-scheme: light;
}
[data-theme="brick"] {
  /* Кирпич */
  --bg: #F1ECEA; --surface: #FFFFFF; --surface-2: #F8F4F2; --surface-hover: #FBF8F7; --line: #E0D3CE;
  --text: #2A1714; --text-soft: #4B302B; --muted: #6E5550;
  --accent: #A23B1E; --accent-grad: linear-gradient(#A23B1E, #A23B1E); --accent-soft: rgba(162, 59, 30, 0.1); --on-accent: #FFFFFF;
  --btn: #7A2414; --on-btn: #FFFFFF; --ink: #2A1714; --panel-bg: #3A1B15; --hero-bg: #3A1B15; --input-bg: #FFFFFF;
  color-scheme: light;
}
[data-theme="signal"] {
  /* Сигнал */
  --bg: #141414; --surface: #1E1E1E; --surface-2: #252525; --surface-hover: #2A2A2A; --line: #353535;
  --text: #F0F0F0; --text-soft: #CFCFCF; --muted: #A0A0A0;
  --accent: #FFC20E; --accent-grad: linear-gradient(#FFC20E, #FFC20E); --accent-soft: rgba(255, 194, 14, 0.14); --on-accent: #141414;
  --btn: #FFC20E; --on-btn: #141414; --ink: #F0F0F0; --panel-bg: #0A0A0A; --hero-bg: #0A0A0A; --input-bg: #141414;
  color-scheme: dark;
}
[data-theme="emerald"] {
  /* Изумруд */
  --bg: #0C1814; --surface: #12221C; --surface-2: #172A23; --surface-hover: #1B3229; --line: #243D33;
  --text: #E8F2EE; --text-soft: #C2D6CD; --muted: #8FA89C;
  --accent: #3DD39B; --accent-grad: linear-gradient(#3DD39B, #3DD39B); --accent-soft: rgba(61, 211, 155, 0.14); --on-accent: #06261A;
  --btn: #137352; --on-btn: #FFFFFF; --ink: #E8F2EE; --panel-bg: #07110D; --hero-bg: #07110D; --input-bg: #0C1814;
  color-scheme: dark;
}
[data-theme="amethyst"] {
  /* Аметист */
  --bg: #14111E; --surface: #1C1829; --surface-2: #221D32; --surface-hover: #28223A; --line: #342D4A;
  --text: #EEEAF7; --text-soft: #CCC4E0; --muted: #9C93B5;
  --accent: #A994FF; --accent-grad: linear-gradient(#A994FF, #A994FF); --accent-soft: rgba(169, 148, 255, 0.14); --on-accent: #160F2E;
  --btn: #5B41D8; --on-btn: #FFFFFF; --ink: #EEEAF7; --panel-bg: #0C0A14; --hero-bg: #0C0A14; --input-bg: #14111E;
  color-scheme: dark;
}
[data-theme="signal"], [data-theme="emerald"], [data-theme="amethyst"] {
  --shadow: none; --shadow-hover: none;
  --ok: #4ED3A0; --ok-bg: rgba(78, 211, 160, .12);
  --wait: #F2C14E; --wait-bg: rgba(242, 193, 78, .12);
  --alarm: #FF7A80; --alarm-bg: rgba(255, 122, 128, .12); --alarm-row: rgba(255, 122, 128, .07);
}
.swatch-steel { background: linear-gradient(135deg, #E4E9EF 50%, #1F5FAD 50%); }
.swatch-khaki { background: linear-gradient(135deg, #E6E7DD 50%, #5E6C22 50%); }
.swatch-sand { background: linear-gradient(135deg, #ECE6DA 50%, #A0521A 50%); }
.swatch-brick { background: linear-gradient(135deg, #F1ECEA 50%, #7A2414 50%); }
.swatch-signal { background: linear-gradient(135deg, #141414 50%, #FFC20E 50%); }
.swatch-emerald { background: linear-gradient(135deg, #0C1814 50%, #3DD39B 50%); }
.swatch-amethyst { background: linear-gradient(135deg, #14111E 50%, #A994FF 50%); }

:root {
  --zone-2: #1F9D6E;
  --zone-3: #D99A00;
  --zone-4: #C8102E;
  --zone-5: #6E5FE0;
  --olma: #E07A10;
  --radius: 4px;
  --radius-lg: 6px;
  --font: "Golos Text", "Segoe UI", system-ui, sans-serif;
  --font-display: Unbounded, "Golos Text", "Arial Black", sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; font: 400 15.5px/1.55 var(--font); background: var(--bg); color: var(--text); -webkit-font-smoothing: antialiased; }
a { color: var(--accent); text-underline-offset: 3px; }
h1, h2, h3 { font-family: var(--font-display); font-weight: 600; letter-spacing: 0; line-height: 1.2; margin: 0 0 8px; }
h1 { font-size: 1.9rem; font-weight: 700; }
h2 { font-weight: 500; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.muted { color: var(--muted); }
main { max-width: 1100px; margin: 0 auto; padding: 24px 16px 48px; }

/* ---------- Раскладка: слева панель (~20%), справа рабочая часть ---------- */
body.with-panel { display: grid; grid-template-columns: clamp(250px, 20%, 340px) minmax(0, 1fr); min-height: 100vh; }
body.with-panel main { max-width: none; width: 100%; padding: 32px clamp(16px, 3vw, 48px) 56px; }

/* ---------- Панель (всегда тёмная) ---------- */
.panel { position: sticky; top: 0; height: 100vh; overflow-y: auto; display: flex; flex-direction: column; background: var(--panel-bg); color: #fff; border-right: 1px solid rgba(255, 255, 255, .06); }
.panel a { color: #fff; text-decoration: none; }
.panel-head { display: flex; align-items: center; justify-content: space-between; padding: 22px 22px 18px; }
.brand { display: flex; align-items: center; gap: 12px; }
.brand-mark { width: 40px; height: 40px; flex: none; display: grid; place-items: center; }
.brand-mark svg { width: 38px; height: 38px; }
.brand-name { font: 700 1.1rem/1.1 var(--font-display); }
.brand-name small { display: block; font: 600 .68rem/1.4 var(--font); letter-spacing: 0; color: rgba(255, 255, 255, .5); }
.panel-toggle { display: none; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .15); padding: 8px 14px; box-shadow: none; color: #fff; }
.panel-body { display: flex; flex-direction: column; justify-content: space-between; flex: 1; }
.panel nav { padding: 8px 12px; }
.nav-label { padding: 14px 12px 8px; font-size: .8rem; color: rgba(255, 255, 255, .6); }
.nav-zone { border-radius: var(--radius); margin-bottom: 6px; }
.nav-zone.active { background: rgba(255, 255, 255, .05); padding-bottom: 6px; }
.nav-zone-title { display: flex; align-items: center; gap: 12px; padding: 11px 12px; border-radius: var(--radius); font: 600 1rem/1.2 var(--font); }
.nav-dot { width: 8px; height: 8px; border-radius: 1px; flex: none; background: currentColor; }
.zone-2 .nav-dot { color: var(--zone-2); }
.zone-3 .nav-dot { color: var(--zone-3); }
.zone-4 .nav-dot { color: var(--zone-4); }
.zone-5 .nav-dot { color: var(--zone-5); }
.nav-zone ul { list-style: none; margin: 2px 0 0; padding: 0 6px; }
.nav-zone li a { position: relative; display: block; padding: 8px 12px 8px 33px; border-radius: var(--radius); color: rgba(255, 255, 255, .68); font-size: .93rem; transition: background .15s, color .15s; }
.panel a:hover { background: rgba(255, 255, 255, .07); color: #fff; }
.panel a.current { background: rgba(255, 255, 255, .1); color: #fff; }
.nav-zone li a.current::before { content: ""; position: absolute; left: 14px; top: 50%; width: 8px; height: 2px; background: var(--accent); }
.nav-zone-title.current { background: rgba(255, 255, 255, .1); }
.panel-user { margin: 12px; padding: 16px; border-radius: var(--radius); background: rgba(255, 255, 255, .06); font-size: .88rem; }
.panel-user .who { display: flex; gap: 12px; align-items: center; margin-bottom: 14px; }
.avatar { width: 38px; height: 38px; border-radius: 50%; flex: none; display: grid; place-items: center; background: var(--accent-grad); color: var(--on-accent); font: 600 .95rem/1 var(--font-display); }
.panel-user .name { font-weight: 700; line-height: 1.3; }
.panel-user .role { color: rgba(255, 255, 255, .55); font-size: .8rem; }
.themes { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 8px; margin: 0 0 18px; }
.themes-label { flex-basis: 100%; color: rgba(255, 255, 255, .6); font-size: .8rem; }
.themes-label b { color: #fff; font-weight: 600; }
.swatch { width: 28px; height: 28px; padding: 0; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .25); box-shadow: none; cursor: pointer; transition: transform .15s, border-color .15s; }
.swatch:hover { transform: scale(1.12); box-shadow: none; }
.swatch.on { border-color: #fff; box-shadow: 0 0 0 3px rgba(255, 255, 255, .15); }
.swatch-dark { background: linear-gradient(135deg, #13171C 50%, #C8102E 50%); }
.swatch-sapphire { background: linear-gradient(135deg, #0B1322 50%, #E2B65C 50%); }
.swatch-light { background: linear-gradient(135deg, #E9EBEA 50%, #C8102E 50%); }
.panel-user .user-actions { display: flex; gap: 8px; }
.panel-user .user-actions > * { flex: 1; }
.panel-user .user-actions a, .panel-user .user-actions button { display: block; width: 100%; text-align: center; padding: 8px 6px; border-radius: var(--radius); border: 1px solid rgba(255, 255, 255, .14); background: transparent; color: #fff; box-shadow: none; font: 600 .8rem/1.2 var(--font); cursor: pointer; }
.panel-user .user-actions button:hover { background: rgba(250, 47, 47, .2); border-color: rgba(250, 47, 47, .5); transform: none; }
.panel-user form { margin: 0; }

/* ---------- Шапка страницы ---------- */
.crumbs { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 14px; color: var(--muted); font-size: .85rem; text-decoration: none; font-weight: 600; }
.crumbs:hover { color: var(--accent); }
.page-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.page-head p { margin: 0; color: var(--muted); }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; font-size: .88rem; font-weight: 600; color: var(--accent); margin-bottom: 8px; }
.eyebrow::before { content: ""; width: 22px; height: 4px; background: var(--accent); }

.hero { position: relative; overflow: hidden; border-radius: var(--radius-lg); padding: 36px clamp(20px, 4vw, 44px); margin-bottom: 28px; color: #fff; background: var(--hero-bg); border: 1px solid rgba(255, 255, 255, .06); }
.hero::after { content: ""; position: absolute; left: 0; bottom: 0; width: min(180px, 40%); height: 6px; background: var(--accent); }
.hero h1 { font-size: clamp(1.7rem, 3vw, 2.5rem); }
.hero p { margin: 6px 0 0; color: rgba(255, 255, 255, .78); }
.hero .eyebrow { color: var(--accent); filter: brightness(1.25); }

/* ---------- Плитки ---------- */
.tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.tile { position: relative; display: flex; flex-direction: column; gap: 8px; min-height: 150px; padding: 22px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  text-decoration: none; color: var(--text); box-shadow: var(--shadow); transition: transform .18s, box-shadow .18s, border-color .18s, background .18s; overflow: hidden; }
.tile::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: var(--line); transition: background .18s; }
.tile:hover { box-shadow: var(--shadow-hover); background: var(--surface-hover); }

.tile .num { font: 600 .8rem/1 var(--font); color: var(--muted); }
.tile strong { font: 500 1.15rem/1.25 var(--font-display); }
.tile span { color: var(--muted); font-size: .9rem; }
.tile .go { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: .85rem; color: var(--accent); }
.tile.ready::before { background: var(--accent-grad); }
.badge { align-self: flex-start; padding: 3px 9px; border-radius: 3px; font-size: .72rem; font-weight: 700; letter-spacing: .04em; background: var(--surface-2); color: var(--text-soft); border: 1px solid var(--line); }
.tile span.badge { color: var(--text-soft); font-size: .72rem; }
.tile span.badge.live, .badge.live { background: var(--ok-bg); color: var(--ok); border-color: transparent; }
.tile.zone-2::before { background: var(--zone-2); }
.tile.zone-3::before { background: var(--zone-3); }
.tile.zone-4::before { background: var(--zone-4); }
.tile.zone-5::before { background: var(--zone-5); }
.tile.big { min-height: 190px; padding: 26px; }
.tile.big strong { font-size: 1.5rem; }

/* ---------- Карточки и формы ---------- */
.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 28px; box-shadow: var(--shadow); }
.narrow { max-width: 480px; }
.empty { text-align: center; padding: 56px 24px; }
.empty .icon { width: 64px; height: 64px; margin: 0 auto 16px; border-radius: var(--radius); display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); font: 600 1.6rem/1 var(--font-display); }
.empty p { color: var(--muted); max-width: 420px; margin: 8px auto 0; }

.field { margin-bottom: 18px; }
.field label { display: block; font-weight: 700; font-size: .88rem; margin-bottom: 6px; }
.field label.check { display: flex; align-items: center; gap: 10px; font-weight: 600; font-size: .95rem; }
.field input:not([type=checkbox]), .field select, .filters select {
  width: 100%; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--input-bg); font: 500 1rem var(--font); color: var(--text); transition: border-color .15s, box-shadow .15s, background .15s; }
.field input:focus, .field select:focus, .filters select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); }
input[type=checkbox] { width: 18px; height: 18px; accent-color: var(--accent); }
.field small { display: block; color: var(--muted); margin-top: 6px; font-size: .82rem; }
.field small ul { margin: 4px 0 0; padding-left: 18px; }
.has-error input, .has-error select { border-color: var(--alarm); }
.error { color: var(--alarm); font-size: .85rem; font-weight: 600; margin-top: 6px; }

button, .button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 22px; border: 0; border-radius: var(--radius); cursor: pointer; text-decoration: none;
  background: var(--btn); color: var(--on-btn); font: 600 .95rem/1.2 var(--font); min-height: 44px; box-shadow: none; transition: transform .15s, box-shadow .15s, filter .15s; }
button:hover, .button:hover { filter: brightness(1.15); }
button.wide { width: 100%; }
button.link { background: none; border: 0; padding: 0; box-shadow: none; color: inherit; text-decoration: underline; font: inherit; }

.msg { display: flex; gap: 10px; align-items: flex-start; padding: 13px 16px; border-radius: var(--radius); margin-bottom: 18px; background: var(--surface-2); font-weight: 600; border: 1px solid var(--line); }
.msg-success { background: var(--ok-bg); color: var(--ok); border-color: transparent; }
.msg-error { background: var(--alarm-bg); color: var(--alarm); border-color: transparent; }
.msg-warning { background: var(--wait-bg); color: var(--wait); border-color: transparent; }

/* ---------- Таблицы ---------- */
.table-wrap { overflow-x: auto; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: 13px 16px; border-bottom: 1px solid var(--line); vertical-align: middle; }
tbody tr:last-child td { border-bottom: 0; }
th { background: var(--surface-2); font-size: .82rem; font-weight: 600; color: var(--muted); white-space: nowrap; }
tbody tr { transition: background .12s; }
tbody tr:hover td { background: var(--surface-hover); }
tr.inactive td { color: var(--muted); }
tr.alarm td { background: var(--alarm-row); }
tr.alarm td:first-child { box-shadow: inset 3px 0 0 var(--alarm); }
td.actions { white-space: nowrap; text-align: right; }
td.actions a { margin-left: 14px; font-weight: 700; font-size: .88rem; text-decoration: none; }
td.actions a:hover { text-decoration: underline; }
.person { display: flex; align-items: center; gap: 12px; font-weight: 700; }
.person .avatar { width: 34px; height: 34px; font-size: .85rem; }
.pill { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 3px; font-size: .78rem; font-weight: 700; background: var(--surface-2); color: var(--text-soft); white-space: nowrap; max-width: 100%; }
@media (max-width: 480px) { .pill { white-space: normal; } }
.pill::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.pill.ok { background: var(--ok-bg); color: var(--ok); }
.pill.wait { background: var(--wait-bg); color: var(--wait); }
.pill.off { color: var(--muted); }
.pill.alarm { background: var(--alarm-bg); color: var(--alarm); }
.role-owner { color: var(--accent); font-weight: 700; }
.filters { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-bottom: 18px; padding: 14px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
.filters select { width: auto; min-width: 220px; }
.filters label { display: flex; gap: 8px; align-items: center; font-weight: 600; }
.pager { display: flex; gap: 16px; align-items: center; justify-content: center; margin-top: 18px; font-weight: 700; }
.pager a { text-decoration: none; }

/* ---------- Страница входа ---------- */
body.auth { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); background: var(--bg); }
.auth-brand { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; padding: 48px clamp(24px, 5vw, 72px); color: #fff; background: var(--hero-bg); }
.auth-brand::after { content: ""; position: absolute; left: 0; bottom: 0; width: 40%; height: 8px; background: var(--accent); }
.auth-brand h2 { font-size: clamp(2rem, 4vw, 3.4rem); max-width: 12ch; }
.auth-brand p { color: rgba(255, 255, 255, .7); max-width: 40ch; }
.auth-brand ul { list-style: none; padding: 0; margin: 28px 0 0; display: grid; gap: 10px; position: relative; z-index: 1; }
.auth-brand li { display: flex; gap: 12px; align-items: center; color: rgba(255, 255, 255, .85); font-weight: 600; }
.auth-brand li::before { content: ""; width: 18px; height: 4px; background: var(--accent); }
.auth-form { display: flex; align-items: center; justify-content: center; padding: 48px 24px; }
.auth-form .box { width: 100%; max-width: 400px; }
.auth-form h1 { font-size: 2rem; }
.auth-form .muted { margin: 0 0 28px; }
.auth-foot { margin-top: 24px; font-size: .85rem; color: var(--muted); }

/* ---------- Телефон ---------- */
@media (max-width: 860px) {
  body.with-panel { display: flex; flex-direction: column; }
  body.with-panel main { padding: 22px 16px 40px; }
  .panel { position: static; height: auto; border-right: 0; }
  .panel-toggle { display: inline-flex; }
  .panel-body { display: none; }
  .panel.open .panel-body { display: flex; }
  h1 { font-size: 1.5rem; }
  body.auth { grid-template-columns: 1fr; }
  .auth-brand { padding: 32px 24px; }
  .auth-brand ul, .auth-brand p { display: none; }
  .auth-brand h2 { font-size: 1.8rem; margin: 18px 0 0; }
}

/* Заявки с сайта */
.lead-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.lead-tabs a { display: inline-flex; gap: 8px; align-items: center; padding: 9px 14px; border-radius: 3px; border: 1px solid var(--line); background: var(--surface); color: var(--text); text-decoration: none; font-weight: 600; font-size: .9rem; }
.lead-tabs a b { color: var(--muted); font-weight: 700; }
.lead-tabs a.on { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.lead-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 16px; }
@media (max-width: 480px) { .lead-list { grid-template-columns: 1fr; } }
.lead-card { padding: 20px; display: flex; flex-direction: column; gap: 10px; border-left: 4px solid var(--line); }
.lead-card.status-new { border-left-color: var(--alarm); }
.lead-card.status-in_work { border-left-color: var(--wait); }
.lead-card.status-done { border-left-color: var(--ok); }
.lead-card header { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.lead-name { font-size: 1.08rem; }
.lead-phone { font: 600 1.3rem/1.1 var(--font-display); color: var(--text); text-decoration: none; letter-spacing: .02em; }
.lead-phone:hover { color: var(--accent); }
.lead-meta { margin: 0; display: grid; gap: 4px; font-size: .88rem; }
.lead-meta div { display: flex; gap: 8px; }
.lead-meta dt { color: var(--muted); min-width: 96px; }
.lead-meta dd { margin: 0; }
.lead-msg { margin: 0; padding: 12px 14px; border-radius: var(--radius); background: var(--surface-2); font-size: .94rem; }
.lead-form { display: grid; grid-template-columns: auto 1fr auto; gap: 8px; margin-top: auto; }
@media (max-width: 480px) { .lead-form { grid-template-columns: 1fr; } }
.lead-form select, .lead-form input { padding: 10px 12px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--surface-2); color: var(--text); font: inherit; font-size: .9rem; min-width: 0; }
.lead-form button { padding: 10px 16px; }

/* Тексты сайта (Админ-панель) */
.sc-status { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: baseline; padding: 14px 18px; border-radius: var(--radius); margin-bottom: 18px; border: 1px solid var(--line); }
.sc-status.is-draft { background: var(--wait-bg); color: var(--wait); border-color: transparent; }
.sc-status.is-live { background: var(--ok-bg); color: var(--ok); border-color: transparent; }
.sc-status .muted { font-size: .85rem; }
.sc-form { display: grid; gap: 16px; }
.sc-block { padding: 22px; display: grid; gap: 14px; }
.sc-block h2 { margin: 0; font-size: 1.15rem; }
.sc-block > p.muted { margin: -8px 0 0; }
.sc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.sc-field { display: grid; gap: 6px; }
.sc-field > span { font-size: .85rem; font-weight: 700; color: var(--text-soft); }
.sc-field input, .sc-field textarea, .sc-rows input { width: 100%; padding: 10px 12px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--surface-2); color: var(--text); font: inherit; font-size: .92rem; }
.sc-field textarea { resize: vertical; line-height: 1.5; }
.sc-field input:focus, .sc-field textarea:focus, .sc-rows input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.sc-rows { width: 100%; border-collapse: separate; border-spacing: 0 6px; }
.sc-rows th { text-align: left; font-size: .78rem; font-weight: 700; color: var(--muted); padding: 0 6px; }
.sc-rows td { padding: 0 6px 0 0; vertical-align: middle; }
.sc-rows td:first-child { width: 28px; font-size: .8rem; text-align: right; padding-right: 10px; }
.sc-actions { position: sticky; bottom: 0; z-index: 5; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 14px 18px; border-radius: var(--radius); background: var(--surface); border: 1px solid var(--line); box-shadow: 0 -10px 30px rgba(0, 0, 0, .25); }
.sc-actions .link { margin-left: auto; }
@media (max-width: 640px) { .sc-rows, .sc-rows tbody, .sc-rows tr { display: block; } .sc-rows thead { display: none; } .sc-rows tr { display: grid; gap: 6px; padding: 8px 0; border-bottom: 1px solid var(--line); } .sc-rows td:first-child { text-align: left; } }
button.secondary, .button.secondary { background: var(--surface-2); color: var(--text); border: 1px solid var(--line); box-shadow: none; }

/* Объекты СМР: доска, карточка объекта, маршрут */
.field textarea { width: 100%; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--input-bg); font: 500 1rem var(--font); color: var(--text); resize: vertical; }
.field textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); }
body.with-panel main { min-width: 0; }
.smr-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; margin-bottom: 18px; }
.stat { display: flex; flex-direction: column; gap: 2px; padding: 16px 18px; border-radius: var(--radius); background: var(--surface); border: 1px solid var(--line); color: var(--text); text-decoration: none; }
.stat b { font: 600 1.9rem/1 var(--font-display); }
@media (max-width: 600px) { .smr-stats { grid-template-columns: 1fr 1fr; } .stat { padding: 12px 14px; } .stat b { font-size: 1.5rem; } }
.stat span { color: var(--muted); font-size: .85rem; }
.stat.wait { background: var(--wait-bg); border-color: transparent; } .stat.wait b { color: var(--wait); }
.stat.alarm { background: var(--alarm-bg); border-color: transparent; } .stat.alarm b { color: var(--alarm); }
.stat.link:hover { border-color: var(--accent); }
.smr-mine { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.smr-mine-card { display: grid; gap: 6px; padding: 18px 20px; color: var(--text); text-decoration: none; border-left: 4px solid var(--wait); }
.smr-mine-card.my-turn { border-left-color: var(--accent); }
.smr-mine-card header { display: flex; justify-content: space-between; align-items: center; }
.smr-mine-card strong { font: 600 1.15rem/1.2 var(--font-display); }
.smr-mine-card .now { font-size: .9rem; } .late { color: var(--alarm); font-weight: 700; }
.smr-h2 { font-size: 1.15rem; margin: 28px 0 12px; }
.smr-head-side { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.smr-note { margin: -10px 0 20px; padding: 12px 16px; border-radius: var(--radius); background: var(--surface-2); color: var(--text-soft); }
.smr-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; align-items: start; }
@media (max-width: 960px) { .smr-layout { grid-template-columns: minmax(0, 1fr); } .smr-route { order: -1; } }
.smr-action { padding: 22px 24px; border-top: 3px solid var(--accent); }
.smr-action.review { border-top-color: var(--wait); }
.smr-action.done { border-top-color: var(--ok); }
.smr-action h2 { font-size: 1.4rem; }
.smr-form { display: grid; gap: 14px; margin-top: 12px; }
.smr-form input[type=file] { color: var(--text-soft); font: inherit; font-size: .9rem; }
.smr-buttons { display: flex; flex-wrap: wrap; gap: 10px; }
.smr-history { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.smr-history li { padding: 12px 16px; border-radius: var(--radius); background: var(--surface); border: 1px solid var(--line); border-left: 3px solid var(--line); font-size: .92rem; overflow-wrap: anywhere; }
.smr-history li p { margin: 6px 0; color: var(--text-soft); }
.smr-history li .muted { font-size: .8rem; }
.smr-history .pill { margin-left: 6px; }
.smr-history .k-approved, .smr-history .k-done { border-left-color: var(--ok); }
.smr-history .k-submitted { border-left-color: var(--wait); }
.smr-history .k-returned { border-left-color: var(--alarm); }
.smr-route { padding: 20px 22px; position: sticky; top: 20px; }
@media (max-width: 960px) { .smr-route { position: static; } }
.smr-route h2 { font-size: 1.1rem; }
.smr-route ol { list-style: none; margin: 0; padding: 0; }
.smr-route li { position: relative; display: flex; gap: 12px; padding: 0 0 14px; }
.smr-route li:not(:last-child)::before { content: ""; position: absolute; left: 6px; top: 16px; bottom: 0; width: 2px; background: var(--line); }
.smr-route .dot { flex: none; width: 14px; height: 14px; margin-top: 4px; border-radius: 50%; border: 2px solid var(--line); background: var(--surface); position: relative; z-index: 1; }
.smr-route li b { display: block; font-size: .92rem; font-weight: 600; }
.smr-route li .muted { font-size: .8rem; }
.smr-route .s-pending b { color: var(--muted); font-weight: 500; }
.smr-route .s-done .dot { background: var(--ok); border-color: var(--ok); }
.smr-route .s-done:not(:last-child)::before { background: var(--ok); }
.smr-route .s-active .dot { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); }
.smr-route .s-review .dot { background: var(--wait); border-color: var(--wait); }
.smr-route .overdue .dot { border-color: var(--alarm); background: var(--alarm); }
.smr-files { list-style: none; margin: 4px 0 0; padding: 0; font-size: .82rem; display: grid; gap: 2px; }
.smr-files a { word-break: break-all; }
.smr-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.smr-tabs a { display: inline-flex; gap: 8px; align-items: center; padding: 9px 14px; border-radius: 3px; border: 1px solid var(--line); background: var(--surface); color: var(--text); text-decoration: none; font-weight: 600; font-size: .88rem; }
.smr-tabs a .n { font: 600 .75rem/1 var(--font-display); color: var(--muted); }
.smr-tabs a b { color: var(--muted); font-weight: 700; }
.smr-tabs a.zero { opacity: .55; }
.smr-tabs a.on { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); opacity: 1; }
.smr-tabs a:hover { border-color: var(--accent); }
.smr-rows { display: grid; gap: 8px; }
.smr-row { background: var(--surface); border: 1px solid var(--line); border-left: 4px solid var(--ok); border-radius: var(--radius); }
.smr-row.review { border-left-color: var(--wait); }
.smr-row.overdue { border-left-color: var(--alarm); }
.smr-row.paused { border-left-color: var(--line); opacity: .7; }
.smr-row summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 124px minmax(0, 2fr) minmax(0, 1.2fr) minmax(0, 1.2fr) 172px; gap: 14px; align-items: center; padding: 14px 18px; }
.smr-row summary::-webkit-details-marker { display: none; }
.smr-row summary:hover { background: var(--surface-hover); border-radius: var(--radius); }
.smr-row[open] summary { border-bottom: 1px solid var(--line); border-radius: var(--radius) 12px 0 0; }
.smr-row .code { font: 600 .98rem/1.2 var(--font-display); white-space: nowrap; overflow-wrap: normal; overflow: hidden; text-overflow: ellipsis; }
.smr-row .state { justify-self: end; }  /* колонки одинаковые во всех строках: код и метка справа — постоянной ширины */
.smr-row .t { font-weight: 600; } .smr-row .t small { display: block; color: var(--muted); font-weight: 500; font-size: .82rem; }
.smr-row .step, .smr-row .who { font-size: .86rem; color: var(--text-soft); }
@media (max-width: 860px) { .smr-row summary { grid-template-columns: auto 1fr; } .smr-row .step, .smr-row .who { display: none; } .smr-row .state { grid-column: 1 / -1; justify-self: start; } }
.smr-row-body { padding: 16px 18px 18px; display: grid; gap: 14px; justify-items: start; }
.smr-passport { margin: 0; width: 100%; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px 18px; }
.smr-passport dt { font-size: .74rem; font-weight: 700; letter-spacing: 0; color: var(--muted); }
.smr-passport dd { margin: 2px 0 0; font-weight: 600; }
.smr-passport dd.late { color: var(--alarm); }
.smr-progress { display: flex; align-items: center; gap: 10px; font-size: .9rem; width: 100%; max-width: 520px; }
.smr-progress .bar { flex: 1; height: 10px; min-width: 80px; background: linear-gradient(var(--line), var(--line)) center / 100% 2px no-repeat; border-inline: 2px solid var(--muted); }
.smr-progress .bar i { display: block; height: 4px; margin-top: 3px; background: var(--ink); }
.smr-pass { padding: 20px 24px; margin-bottom: 20px; display: grid; gap: 14px; }
.smr-pass h2 { font-size: 1.15rem; margin: 0; }
.smr-pass .smr-note { margin: 0; }
.smr-pass-files { display: grid; gap: 8px; }
.smr-upload { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.smr-upload input[type=file] { color: var(--text-soft); font: inherit; font-size: .88rem; }
.smr-upload button { padding: 9px 16px; }
.smr-statement { padding: 18px 22px; margin-bottom: 14px; }
.smr-statement header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; align-items: center; margin-bottom: 8px; }
.smr-statement header .smr-progress { max-width: 280px; }
.smr-statement h3 { font-size: .85rem; letter-spacing: 0; color: var(--muted); margin: 14px 0 6px; }
.smr-statement ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.smr-statement li { padding: 6px 8px; border-radius: 8px; }
.smr-statement li:hover { background: var(--surface-hover); }
.smr-statement li label { display: flex; gap: 10px; align-items: baseline; cursor: pointer; }
.smr-statement li .nm { flex: 1; }
.smr-statement li .q { white-space: nowrap; color: var(--text-soft); font-size: .88rem; }
.smr-statement li.done .nm { color: var(--muted); text-decoration: line-through; }
.smr-statement li small { display: block; padding-left: 28px; font-size: .78rem; }
.smr-statement-save { position: sticky; bottom: 0; padding-top: 12px; background: var(--surface); }
.inbox-actions { display: grid; gap: 8px; margin-top: auto; }
.inbox-actions .button { justify-self: start; }
.assign-list { display: grid; gap: 12px; max-width: 760px; }
.assign-rule { padding: 18px 20px; display: grid; grid-template-columns: 1fr auto 1fr; gap: 14px; align-items: end; }
.assign-rule h2 { grid-column: 1 / -1; font-size: 1.05rem; margin: 0; }
.assign-rule .smr-buttons, .assign-rule > button, .assign-rule .error { grid-column: 1 / -1; }
.assign-rule .check { display: flex; gap: 8px; align-items: center; font-weight: 600; padding-bottom: 10px; }
.assign-rule select { width: 100%; padding: 10px 12px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--surface-2); color: var(--text); font: inherit; }
@media (max-width: 640px) { .assign-rule { grid-template-columns: 1fr; } }
.rate-input { width: 140px; padding: 8px 10px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--surface-2); color: var(--text); font: inherit; text-align: right; }
.rate-input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.rates-form .sc-actions { margin-top: 16px; }
.rate-add { margin-top: 24px; max-width: 760px; grid-template-columns: 1fr 2fr; }
.rate-add select, .rate-add input { width: 100%; padding: 10px 12px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--surface-2); color: var(--text); font: inherit; }
.master-form ul { list-style: none; padding: 0; margin: 4px 0 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 6px; }
.master-form ul label { display: flex; gap: 8px; align-items: center; font-weight: 600; }
.field textarea + small, .master-form textarea { width: 100%; }
.smr-brigade { padding: 18px 22px; display: grid; gap: 12px; }
.smr-brigade p { margin: 0; }
.smr-brigade-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.smr-brigade-list li { display: flex; flex-wrap: wrap; gap: 10px; align-items: baseline; padding: 8px 10px; border-radius: var(--radius); background: var(--surface-2); }
.smr-brigade-list form { margin-left: auto; }
/* Реклама */
.ads-rows .smr-row summary { grid-template-columns: 90px minmax(0, 1fr) 190px 200px 120px; }
.ads-rows .state { justify-self: end; }
@media (max-width: 860px) { .ads-rows .smr-row summary { grid-template-columns: auto 1fr; } .ads-rows .ad-strip { grid-column: 1 / -1; } .ads-rows .state { justify-self: start; } }
.ad-strip { display: inline-flex; gap: 3px; }
.ad-strip i { font-style: normal; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 5px; font-size: .72rem; background: var(--surface-2); color: var(--muted); }
.ad-strip i.m-done { background: var(--ok-bg); color: var(--ok); }
.ad-strip i.m-wip { background: var(--wait-bg); color: var(--wait); }
.ad-strip i.m-unclear { background: var(--alarm-bg); color: var(--alarm); }
.ad-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 6px; width: 100%; }
.ad-cell { padding: 8px 10px; border-radius: var(--radius); background: var(--surface-2); display: grid; gap: 2px; font-size: .82rem; }
.ad-cell span { color: var(--muted); }
.ad-cell.m-done { background: var(--ok-bg); } .ad-cell.m-wip { background: var(--wait-bg); } .ad-cell.m-unclear { background: var(--alarm-bg); }
.ad-qlist { margin: 0; padding-left: 18px; display: grid; gap: 4px; font-size: .9rem; }
.ad-stages { padding: 20px 24px; margin-bottom: 20px; display: grid; gap: 12px; }
.ad-stages h2 { margin: 0; font-size: 1.15rem; }
.ad-stage-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; }
.ad-stage { display: grid; gap: 6px; padding: 10px; border-radius: var(--radius); background: var(--surface-2); border: 1px solid var(--line); }
.ad-stage.m-done { border-color: var(--ok); } .ad-stage.m-wip { border-color: var(--wait); } .ad-stage.m-unclear { border-color: var(--alarm); }
.ad-stage b { font-size: .85rem; }
.ad-stage select, .ad-stage input, .ad-qnew input, .ad-qnew textarea, .smr-form > input:not([type=file]), .smr-form select { width: 100%; padding: 8px 10px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--surface); color: var(--text); font: inherit; font-size: .88rem; }
.ad-q { padding: 14px 18px; margin-bottom: 10px; display: grid; gap: 6px; border-left: 4px solid var(--wait); font-size: .92rem; }
.ad-q.check { border-left-color: var(--ok); } .ad-q.closed { border-left-color: var(--line); opacity: .7; }
.ad-qnew { padding: 14px 18px; display: grid; gap: 8px; }
.ad-edit { padding: 14px 18px; margin-top: 14px; } .ad-edit summary { cursor: pointer; font-weight: 700; }
/* Выбор шага — раскрывающийся список вместо ряда кнопок */
.step-picker { margin-bottom: 16px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); max-width: 560px; }
.step-picker summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; padding: 12px 16px; }
.step-picker summary::-webkit-details-marker { display: none; }
.step-picker summary b { flex: 1; }
.step-picker .count { min-width: 28px; text-align: center; padding: 2px 8px; border-radius: 3px; background: var(--surface-2); font-weight: 700; font-size: .85rem; }
.step-picker .arrow { transition: transform .15s; color: var(--muted); }
.step-picker[open] .arrow { transform: rotate(180deg); }
.step-picker[open] summary { border-bottom: 1px solid var(--line); }
.step-picker nav { display: grid; padding: 6px; }
.step-picker nav a { display: grid; grid-template-columns: 26px 1fr auto; align-items: center; gap: 8px; padding: 9px 10px; border-radius: var(--radius); color: var(--text); text-decoration: none; font-weight: 600; font-size: .92rem; }
.step-picker nav a:hover { background: var(--surface-hover); }
.step-picker nav a.on { background: var(--accent-soft); }
.step-picker nav a.zero { color: var(--muted); font-weight: 500; }
.step-picker nav .n { font: 600 .75rem/1 var(--font-display); color: var(--muted); }
.step-picker nav b { font-size: .85rem; color: var(--muted); }
/* Пульт владельца */
.pult-home { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: baseline; padding: 18px 22px; margin-bottom: 16px; color: var(--text); text-decoration: none; border-left: 4px solid var(--accent); }
.pult-home b { font: 600 1.3rem/1 var(--font-display); }
.pult-home span { color: var(--muted); }
.pult-home:hover { border-color: var(--accent); background: var(--surface-hover); }
.pult-attention { padding: 18px 22px; margin-bottom: 16px; }
.pult-attention h2 { font-size: 1.1rem; }
.pult-attention ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 8px; }
.pult-attention li a { display: flex; gap: 10px; align-items: baseline; padding: 10px 12px; border-radius: var(--radius); text-decoration: none; color: var(--text); background: var(--wait-bg); }
.pult-attention li.lvl-alarm a { background: var(--alarm-bg); }
.pult-attention li b { font: 600 1.3rem/1 var(--font-display); color: var(--wait); }
.pult-attention li.lvl-alarm b { color: var(--alarm); }
.pult-filters input { padding: 12px 14px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--input-bg); color: var(--text); font: 500 1rem var(--font); min-width: 160px; }
.pult-filters select { min-width: 140px; }
.pult-feed { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.pult-feed .day { margin: 14px 0 4px; font: 600 .8rem/1 var(--font-display); letter-spacing: 0; color: var(--muted); }
.pult-feed .ev { display: grid; grid-template-columns: 48px 110px 1fr; gap: 12px; align-items: baseline; padding: 9px 12px; border-radius: var(--radius); background: var(--surface); border: 1px solid var(--line); border-left: 3px solid var(--line); font-size: .92rem; }
.pult-feed .ev.alarm { border-left-color: var(--alarm); background: var(--alarm-row); }
.pult-feed .s-smr { border-left-color: var(--zone-2); } .pult-feed .s-ads { border-left-color: var(--zone-3); }
.pult-feed .s-tasks { border-left-color: var(--accent); } .pult-feed .s-bots { border-left-color: var(--wait); }
.pult-feed time { font-weight: 700; color: var(--muted); }
.pult-feed .sec { font-size: .75rem; font-weight: 700; color: var(--muted); letter-spacing: 0; }
.pult-feed .code { font-weight: 700; color: var(--accent); }
.pult-feed .txt a { color: var(--text); text-decoration: none; } .pult-feed .txt a:hover { color: var(--accent); }
@media (max-width: 640px) { .pult-feed .ev { grid-template-columns: 44px 1fr; } .pult-feed .sec { display: none; } }
/* Поиск */
.search-box input { flex: 1; min-width: 220px; padding: 12px 14px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--input-bg); color: var(--text); font: inherit; font-size: 1.02rem; }
.search-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.search-list li { display: grid; gap: 2px; padding: 10px 14px; border-radius: var(--radius); background: var(--surface); border: 1px solid var(--line); }
.search-list a { font-weight: 600; text-decoration: none; color: var(--text); } .search-list a:hover { color: var(--accent); }
.search-list .muted { font-size: .85rem; }
.pult-feed .reply { font-size: .82rem; border-left: 2px solid var(--line); padding-left: 8px; margin: 2px 0; }
.pult-feed .s-semen { border-left-color: var(--zone-2); } .pult-feed .s-revizor { border-left-color: var(--wait); }

/* ПСД */
.psd-found { padding: 18px 22px; margin-bottom: 16px; border-left: 4px solid var(--wait); }
.psd-found ul { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 6px; }
.psd-found li { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 8px 10px; border-radius: var(--radius); background: var(--surface-2); }
.psd-found li form { margin-left: auto; }
.psd-new { margin-top: 20px; max-width: 900px; grid-template-columns: 1fr 1fr; }
.psd-new input { width: 100%; padding: 10px 12px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--surface-2); color: var(--text); font: inherit; }
.psd-file { padding: 16px 20px; margin-bottom: 10px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; overflow-wrap: anywhere; }
.psd-sheet summary { cursor: pointer; padding: 4px 0; font-size: .9rem; }
.psd-sheet pre { white-space: pre-wrap; max-height: 360px; overflow: auto; padding: 10px 12px; border-radius: var(--radius); background: var(--surface-2); font: .82rem/1.45 var(--font); }
.psd-vol { padding: 14px 18px; margin-top: 10px; display: grid; grid-template-columns: 2fr 1.5fr .8fr .6fr 1.5fr 1.5fr auto; gap: 8px; }
.psd-vol select, .psd-vol input { width: 100%; padding: 9px 10px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--surface-2); color: var(--text); font: inherit; font-size: .88rem; }
@media (max-width: 960px) { .psd-vol { grid-template-columns: 1fr 1fr; } }
.psd-table tr.st-bad td { background: var(--alarm-row); }
.psd-table tr.st-bad td:first-child { box-shadow: inset 3px 0 0 var(--alarm); }
.psd-table td:nth-child(n+3) { white-space: nowrap; }
form.inline { display: inline; }

/* Почта */
.mail-head-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-start; }
.mail-table tr.unseen td { font-weight: 700; }
.mail-table tr.unseen td .muted { font-weight: 400; }
.mail-body pre, .mail-preview { white-space: pre-wrap; word-break: break-word; margin: 0; font: .95rem/1.55 var(--font); }
.mail-body, .mail-files, .mail-teach { padding: 18px 22px; margin-bottom: 14px; }
.mail-files ul { margin: 6px 0; padding-left: 18px; }
.mail-settings { display: grid; grid-template-columns: 1.2fr 1fr; gap: 16px; align-items: start; }
.mail-settings .card { padding: 18px 22px; display: grid; gap: 12px; }
.mail-settings input:not([type=checkbox]), .mail-settings textarea { width: 100%; padding: 10px 12px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--surface-2); color: var(--text); font: inherit; }
label.check { display: inline-flex; align-items: center; gap: 8px; }
@media (max-width: 900px) { .mail-settings { grid-template-columns: 1fr; } }

/* Быстрый ввод одной строкой (поручения, встречи) */
.task-quick { padding: 18px 22px; display: grid; gap: 12px; margin-bottom: 18px; }
.task-quick-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.task-quick-row input, .task-quick-row select { padding: 10px 12px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--surface-2); color: var(--text); font: inherit; font-size: .92rem; min-height: 44px; }
.task-quick-row input:not([type]) { flex: 1 1 160px; }
.task-quick-row input:focus, .task-quick-row select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.card.task-quick-row { padding: 14px 22px; margin-top: 12px; }

/* Боты: где и с кем */
.guard-bot { padding: 18px 22px; margin-bottom: 16px; display: grid; gap: 8px; }
.guard-bot p { margin: 0; }
.guard-head { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; }
.guard-head h2 { margin: 0; }
.guard-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.guard-actions button { padding: 8px 14px; font-size: .85rem; white-space: nowrap; }
.guard-list { margin: 0; padding-left: 18px; display: grid; gap: 6px; }

/* Дашборд руководства */
.dash-attention { padding: 18px 22px; margin-bottom: 16px; }
.dash-attention h2 { margin: 0 0 10px; }
.dash-attention ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.dash-attention li a { display: inline-flex; gap: 6px; padding: 8px 14px; border-radius: 3px; background: var(--wait-bg); color: var(--text); text-decoration: none; font-weight: 600; }
.dash-attention li.lvl-alarm a { background: var(--alarm-bg); }
.dash-attention li b { color: var(--wait); }
.dash-attention li.lvl-alarm b { color: var(--alarm); }
.dash-kpi { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 16px; }
@media (max-width: 1100px) { .dash-kpi { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .dash-kpi { grid-template-columns: 1fr 1fr; } }
.dash-kpi > * { padding: 16px 18px; display: grid; gap: 4px; align-content: start; text-decoration: none; color: var(--text); }
.dash-kpi b { font: 600 2rem/1 var(--font-display); }
.dash-kpi span { color: var(--muted); font-size: .85rem; }
.dash-kpi a.alarm b { color: var(--alarm); }
.dash-block { padding: 18px 22px; margin-bottom: 16px; }
.dash-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 10px; }
.dash-head h2 { margin: 0; }
.dash-head a { color: var(--accent); text-decoration: none; font-weight: 600; font-size: .9rem; }
.dash-bar { width: 120px; height: 10px; background: linear-gradient(var(--line), var(--line)) center / 100% 2px no-repeat; border-inline: 2px solid var(--muted); }
.dash-bar i { display: block; height: 4px; margin-top: 3px; background: var(--ink); }
.dash-two { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 900px) { .dash-two { grid-template-columns: 1fr; } }
.dash-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.dash-feed { margin: 0; }

/* Посетители сайта */
.vis-tops { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media (max-width: 1100px) { .vis-tops { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .vis-tops { grid-template-columns: 1fr; } }
.vis-tops .dash-block { margin-bottom: 0; }
.vis-tops h2 { font-size: 1.05rem; margin: 0 0 8px; }
.vis-top { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.vis-top li { display: flex; justify-content: space-between; gap: 10px; font-size: .9rem; }
.vis-top li span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vis-dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 14px; margin: 0; font-size: .92rem; }
.vis-dl dt { color: var(--muted); }
.vis-dl dd { margin: 0; word-break: break-word; }

/* ---------- Наблюдатель ---------- */
.obs-switch { margin-bottom: 18px; }
.obs-state { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }
.obs-clip { margin-bottom: 14px; padding: 20px; overflow-wrap: anywhere; }
.obs-head { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 8px; }
.obs-clip video { width: 100%; max-width: 420px; max-height: 360px; border-radius: var(--radius); background: #000; }
.obs-clip audio { width: 100%; max-width: 420px; }
.obs-frames { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; max-width: 760px; margin: 12px 0; }
@media (max-width: 560px) { .obs-frames { grid-template-columns: repeat(3, 1fr); } }
.obs-frames img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); }
.obs-previews { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: 14px; margin-top: 18px; }
.obs-msg { white-space: normal; line-height: 1.55; font-size: .92rem; overflow-wrap: anywhere; }

/* ---------- Фото для сайта ---------- */
.ph-sources { display: grid; gap: 10px; padding: 18px 22px; margin-bottom: 18px; font-size: .92rem; overflow-wrap: anywhere; }
.ph-sources > * { min-width: 0; }
.ph-sources .pill { margin: 0 4px; }
.ph-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.ph-tabs a { padding: 8px 14px; border-radius: 3px; border: 1px solid var(--line); background: var(--surface); color: var(--text); text-decoration: none; font-weight: 600; font-size: .9rem; }
.ph-tabs a b { margin-left: 4px; color: var(--muted); }
.ph-tabs a.active { background: var(--accent-soft); border-color: var(--accent); color: var(--accent); }
.ph-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
.ph-card { padding: 14px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.ph-img { display: block; border-radius: var(--radius); overflow: hidden; background: var(--surface-2); }
.ph-img img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.ph-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.ph-meta { margin: 0; font-size: .8rem; overflow-wrap: anywhere; }
.ph-form { display: grid; gap: 8px; }
.ph-form label { display: grid; gap: 4px; font-size: .78rem; font-weight: 700; color: var(--text-soft); min-width: 0; }
.ph-form input, .ph-form select { width: 100%; min-width: 0; padding: 9px 11px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--input-bg); color: var(--text); font: 500 .92rem var(--font); }
.ph-form input:focus, .ph-form select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.ph-two { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ph-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.ph-actions button { padding: 9px 14px; font-size: .86rem; }
.ph-pages { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 20px; }
@media (max-width: 480px) { .ph-grid { grid-template-columns: 1fr; } .ph-two { grid-template-columns: 1fr; } }

/* ---------- Объект: статус вручную (владелец) ---------- */
.smr-by-hand { margin-bottom: 18px; padding: 18px 22px; }
.smr-by-hand summary { cursor: pointer; }
.smr-by-hand form { display: grid; gap: 12px; margin-top: 14px; max-width: 560px; }
.smr-by-hand label { display: grid; gap: 6px; font-weight: 600; }

/* ---------- Рабочий кабинет: «Я на объекте», новые виды работ, своя задача ---------- */
#check-in { display: inline; }
.smr-new-works { padding: 18px 22px; margin-bottom: 18px; display: grid; gap: 14px; }
.smr-new-work-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; align-items: end; }
.smr-new-work-form label, .nw-decide label, .task-self label { display: grid; gap: 6px; font-weight: 600; }
.smr-new-work-form .wide { grid-column: 1 / -1; }
.smr-new-work-form button { grid-column: 1 / -1; justify-self: start; }
@media (max-width: 700px) { .smr-new-work-form { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.smr-checkins { list-style: none; padding: 14px 22px; margin: 0 0 18px; display: grid; gap: 6px; }
.nw-card { padding: 18px 22px; margin-bottom: 14px; }
.nw-card header { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.nw-decide { display: grid; grid-template-columns: 220px 1fr; gap: 12px; align-items: end; margin-top: 10px; }
.nw-buttons { grid-column: 1 / -1; display: flex; gap: 10px; flex-wrap: wrap; }
@media (max-width: 600px) { .nw-decide { grid-template-columns: 1fr; } }
.task-self { padding: 18px 22px; margin-bottom: 18px; display: grid; gap: 12px; }
.task-self-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; }
.smr-new-work-form input, .smr-new-work-form select, .nw-decide input, .task-self input, .task-self select,
.smr-by-hand input, .smr-by-hand select { width: 100%; padding: 10px 12px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--surface-2); color: var(--text); font: inherit; font-size: .92rem; font-weight: 500; min-height: 44px; }
.task-self-row label { min-width: 180px; }

/* ---------- Админ-панель: управление ботами ---------- */
.bc-switches { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; padding: 18px 22px; margin-bottom: 18px; }
.bc-switches > div { display: grid; gap: 8px; align-content: start; }
.bc-switches form { margin: 0; }
@media (max-width: 1000px) { .bc-switches { grid-template-columns: 1fr; } }
.bc-bots { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 8px; }
@media (max-width: 1100px) { .bc-bots { grid-template-columns: 1fr; } }
.bc-bot { padding: 18px 22px; }
.bc-bot header { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between; }
.bc-caps { margin: 10px 0; padding-left: 18px; display: grid; gap: 6px; }
.bc-caps li.off { color: var(--muted); }
.bc-health, .bc-jobs, .bc-confirm { padding: 18px 22px; margin-bottom: 18px; }
.bc-confirm { border-color: var(--accent); }
.bc-form { display: grid; gap: 12px; }
.bc-form label { display: grid; gap: 6px; font-weight: 600; }
.bc-form select, .bc-form input, .bc-form textarea { width: 100%; padding: 10px 12px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--surface-2); color: var(--text); font: inherit; font-size: .92rem; font-weight: 500; }
.bc-form button { justify-self: start; }
.bc-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.bc-buttons { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.bc-buttons form { margin: 0; }
.bc-line { margin: 8px 0; }
.bc-job { margin-top: 10px; }
.bc-job pre { white-space: pre-wrap; word-break: break-word; max-height: 320px; overflow: auto; background: var(--surface-2); padding: 12px; border-radius: var(--radius); font-size: .82rem; }

/* ---------- Админ-панель: помощник Claude ---------- */
.as-chat { display: grid; gap: 12px; margin-bottom: 16px; }
.as-q { justify-self: end; max-width: min(720px, 90%); background: var(--accent-soft); border-radius: var(--radius); padding: 12px 16px; }
.as-q p { margin: 4px 0 0; }
.as-a { max-width: 900px; padding: 16px 20px; line-height: 1.55; }
.as-wait { color: var(--muted); }
.as-form { padding: 16px 20px; display: grid; gap: 12px; }
.as-form textarea { width: 100%; padding: 12px 14px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--input-bg); color: var(--text); font: inherit; resize: vertical; }
.as-buttons { display: flex; gap: 10px; flex-wrap: wrap; }
.as-recent { list-style: none; padding: 14px 20px; margin: 0; display: grid; gap: 6px; }

/* ---------- Светофор по объектам, статистика поручений, фото при сдаче (идеи Усмона, 23.10) ---------- */
.svet-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; vertical-align: middle; background: var(--muted); }
.svet-dot.svet-red { background: var(--alarm); }
.svet-dot.svet-yellow { background: var(--wait); }
.svet-dot.svet-green { background: var(--ok); }
.svet-why { font-size: .82rem; color: var(--text-soft); margin-top: 2px; }
.svet-list { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 10px; }
.svet-list li { padding: 10px 14px; border-radius: var(--radius); background: var(--surface-2); border-left: 4px solid var(--muted); display: grid; gap: 3px; overflow-wrap: anywhere; }
.svet-list li.svet-red { border-left-color: var(--alarm); background: var(--alarm-bg); }
.svet-list li.svet-yellow { border-left-color: var(--wait); background: var(--wait-bg); }
.svet-list a { color: inherit; }
.svet-action { font-weight: 600; }
.dash-head > span a { font-size: .9rem; }
.task-stats td, .task-stats th { white-space: nowrap; }
.task-proof-toggle { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 14px 0 6px; }

/* ---------- Поручения: черновики из голосовых ---------- */
.voice-draft { padding: 16px 20px; margin-bottom: 12px; display: grid; gap: 10px; }
.voice-draft audio { width: 100%; max-width: 420px; }
.voice-draft-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; align-items: end; }
.voice-draft-form .wide { grid-column: 1 / -1; }
.voice-draft-form label { display: grid; gap: 6px; font-weight: 600; }
.voice-draft-form select, .voice-draft-form input, .voice-draft-form textarea { width: 100%; padding: 10px 12px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--surface-2); color: var(--text); font: inherit; font-size: .92rem; font-weight: 500; }
.voice-draft-buttons { grid-column: 1 / -1; display: flex; gap: 10px; flex-wrap: wrap; }
@media (max-width: 700px) { .voice-draft-form { grid-template-columns: 1fr; } }

/* ---------- Радар: деньги и снабжение ---------- */
.radar-list { display: grid; gap: 10px; margin-bottom: 16px; }
.radar-item { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: start; padding: 14px 18px; cursor: pointer; }
.radar-item p { margin: 6px 0 0; }
.radar-item.k-shortage { border-left: 4px solid var(--alarm); }
.radar-head { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }

.bc-switches .pill, .bc-switches button { justify-self: start; }

/* ---------- Админ-панель: Claude Code (Remote Control) ---------- */
.cc-card { padding: 20px 24px; display: grid; gap: 12px; max-width: 900px; }
.cc-card .button { justify-self: start; }
.cc-card ol { margin: 0; padding-left: 20px; display: grid; gap: 8px; }

/* ---------- Приложение на телефоне ---------- */
.tabbar { display: none; }
@media (max-width: 860px) {
  body.with-panel main { padding-bottom: calc(96px + env(safe-area-inset-bottom)); }
  .tabbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
    padding: 6px 4px calc(6px + env(safe-area-inset-bottom)); background: var(--surface); border-top: 1px solid var(--line); box-shadow: 0 -6px 24px rgba(0, 0, 0, .18); }
  .tabbar a, .tabbar button { display: flex; flex-direction: column; align-items: center; gap: 3px; min-height: 52px; padding: 6px 2px; border: 0; border-radius: var(--radius);
    background: none; box-shadow: none; color: var(--muted); font: 600 .7rem/1.1 var(--font); letter-spacing: 0; text-decoration: none; cursor: pointer; }
  .tabbar a:hover, .tabbar button:hover { transform: none; filter: none; color: var(--text); }
  .tabbar .current { color: var(--accent); background: var(--accent-soft); }
  .tab-icon { width: 24px; height: 24px; background: currentColor; -webkit-mask: var(--icon) center / contain no-repeat; mask: var(--icon) center / contain no-repeat; }
}
.tab-home { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5 12 3l9 7.5V20a1 1 0 0 1-1 1h-5v-6H9v6H4a1 1 0 0 1-1-1z'/%3E%3C/svg%3E"); }
.tab-tasks { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6h11M9 12h11M9 18h11'/%3E%3Cpath d='m3 6 1.5 1.5L7 5M3 12l1.5 1.5L7 11M3 18l1.5 1.5L7 17'/%3E%3C/svg%3E"); }
.tab-objects { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18M5 21V8l7-5 7 5v13M9 21v-5h6v5M9 11h.01M15 11h.01'/%3E%3C/svg%3E"); }
.tab-card { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3C/svg%3E"); }
.tab-chart { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20V10M10 20V4M16 20v-7M22 20H2'/%3E%3C/svg%3E"); }
.tab-menu { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 6h16M4 12h16M4 18h16'/%3E%3C/svg%3E"); }

/* Открыто как приложение: строка состояния телефона лежит поверх страницы — отступаем от неё. */
@media (display-mode: standalone) {
  body { padding-top: env(safe-area-inset-top); }
  body.auth .auth-brand { padding-top: calc(24px + env(safe-area-inset-top)); }
}

/* Страницы «Приложение на телефон» и «Нет связи» */
body.app-install main, body.app-offline main { max-width: 520px; margin: 0 auto; padding: calc(32px + env(safe-area-inset-top)) 20px calc(40px + env(safe-area-inset-bottom)); }
.app-install-icon { display: block; border-radius: var(--radius); margin-bottom: 18px; box-shadow: 0 10px 30px var(--accent-glow); }
.app-step { margin: 22px 0; padding: 18px 20px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.app-step h2 { margin: 0 0 10px; font-size: 1.15rem; }
.app-step ol { margin: 10px 0 0; padding-left: 20px; display: grid; gap: 6px; }
.app-step .app-install-btn { margin-bottom: 6px; }
.app-step-other { order: 2; opacity: .75; }
body.app-install .box { display: flex; flex-direction: column; }
body.app-install .button.wide { width: 100%; margin-top: 8px; order: 3; }
body.app-offline .box { text-align: center; padding-top: 12vh; }
body.app-offline .brand-mark { margin: 0 auto 18px; }

/* Вход по одноразовому коду */
.sf-steps { padding-left: 20px; display: grid; gap: 14px; margin: 18px 0 24px; }
.sf-qr { margin: 12px 0; display: inline-block; padding: 8px; border-radius: var(--radius); background: #fff; line-height: 0; }
.sf-qr svg { width: 220px; height: 220px; max-width: 100%; }
.sf-key { display: inline-block; margin-top: 8px; padding: 10px 12px; border-radius: var(--radius); background: var(--surface-2); font: 600 1rem/1.4 ui-monospace, monospace; letter-spacing: 0; word-break: break-all; }

/* Отчёты (3.3) */
td.num, th.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
tr.total td { font-weight: 700; background: var(--surface-2); }
.rep-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; margin-bottom: 22px; }
.rep-card { display: flex; flex-direction: column; gap: 6px; padding: 18px; color: var(--text); text-decoration: none; }
.rep-card:hover { border-color: var(--accent); }
.rep-card b { font-size: 1.05rem; }
.rep-card span { color: var(--muted); font-size: .9rem; }
.filters input[type=date] { width: auto; }
.filters select.short { min-width: 120px; }
.rep-pass { display: grid; grid-template-columns: max-content 1fr; gap: 6px 18px; margin: 0; }
.rep-pass dt { color: var(--muted); }
.rep-pass dd { margin: 0; font-weight: 600; }
@media print {
  .tabbar, .topbar, .panel, .panel-toggle, .crumbs, .filters, .smr-head-side, .no-print { display: none !important; }
  body { background: #fff; }
  .card, .stat { border-color: #ccc; box-shadow: none; }
}
.bc-scenarios { margin-top: 12px; }
.bc-scenarios summary { cursor: pointer; }
.bc-scenario { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 10px 0; border-top: 1px solid var(--line); }
.bc-scenario span:first-child { flex: 1 1 240px; }
.bc-scenario button { padding: 8px 14px; }

/* Комната запуска (зона 5): OLMA и AKF — два раздела, которые не смешиваются */
.launch-split { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.launch-side { position: relative; display: flex; flex-direction: column; gap: 12px; padding: 24px; color: inherit; text-decoration: none; border-top: 4px solid var(--accent); transition: transform .18s, box-shadow .18s; }
.launch-side.olma { border-top-color: var(--olma); }
.launch-side:hover {  box-shadow: var(--shadow-hover); }
.launch-side h2 { margin: 0; }
.launch-brand { font: 700 .8rem/1 var(--font-display); letter-spacing: 0; color: var(--accent); }
.launch-side.olma .launch-brand { color: var(--olma); }
.launch-nums { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; }
.launch-nums div { padding: 10px 12px; background: var(--surface-2); border-radius: var(--radius); }
.launch-nums dt { color: var(--muted); font-size: .82rem; }
.launch-nums dd { margin: 2px 0 0; font: 700 1.5rem/1.1 var(--font-display); }
.launch-nums .alarm dd { color: var(--alarm); }
.launch-side .go { margin-top: auto; font-weight: 700; color: var(--accent); }
.launch-side.olma .go { color: var(--olma); }
.launch-tabs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 0 0 18px; padding: 10px 14px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
.launch-tabs a { color: var(--text-soft); text-decoration: none; font-weight: 600; }
.launch-tabs a.current { color: var(--text); text-decoration: underline; text-underline-offset: 4px; }
.launch-tabs-label { font: 700 .75rem/1 var(--font-display); letter-spacing: 0; color: var(--accent); }
.launch-tabs-label.olma { color: var(--olma); }
.launch-tabs-label.akf { margin-left: auto; }
@media (max-width: 640px) { .launch-tabs-label.akf { margin-left: 0; flex-basis: 100%; } .launch-tabs-label.olma { flex-basis: 100%; } }
.launch-eyebrow.olma { color: var(--olma); }
.launch-eyebrow.akf { color: var(--accent); }
.launch-directions summary { cursor: pointer; font-weight: 700; }
form.inline { display: inline; margin-left: 8px; }

/* Профиль сотрудника */
.avatar-photo { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; flex: none; border: 1px solid var(--line); }
.avatar.big, .avatar-photo.big { width: 112px; height: 112px; font-size: 2rem; }
.profile-head { display: flex; align-items: center; gap: 24px; margin-bottom: 16px; flex-wrap: wrap; }
.profile-head h1 { margin: 2px 0 4px; }
.profile-head p { margin: 0 0 4px; }
.profile-main { flex: 1 1 260px; min-width: 0; }
.profile-pos { font-size: 1.05rem; }
.profile-contacts { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 8px; }
.profile-actions { align-self: flex-start; }
.profile-info { margin-bottom: 16px; }
.profile-dl { display: grid; grid-template-columns: max-content 1fr; gap: 8px 16px; margin: 0; }
.profile-dl dt { color: var(--muted); }
.profile-dl dd { margin: 0; }
.profile-duties { margin: 0 0 12px; padding-left: 20px; }
.profile-duties li { margin-bottom: 4px; }
.profile-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.profile-about { margin-bottom: 16px; }
.profile-form { max-width: 640px; }
.profile-photo-now { display: flex; align-items: center; gap: 16px; margin-bottom: 20px; }
@media (max-width: 600px) { .profile-head { gap: 14px; } .avatar.big, .avatar-photo.big { width: 84px; height: 84px; } }

/* ---------- Фирменный стиль: мелкие поправки ---------- */
.swatch { min-height: 0; flex: none; }
.panel-user .user-actions a, .panel-user .user-actions button { min-height: 40px; display: flex; align-items: center; justify-content: center; }
.hero h1 { font-size: clamp(1.5rem, 2.6vw, 2.1rem); }

/* ---------- Эффекты: след за курсором и «вдавливание» кнопок (static fx.js) ---------- */
.fx-trail { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 2147483000; }
.fx-host { overflow: hidden; }
.fx-host-rel { position: relative; }
.fx-dent { position: absolute; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(0, 0, 0, .30) 0%, rgba(0, 0, 0, .16) 42%, rgba(255, 255, 255, .22) 58%, rgba(255, 255, 255, 0) 70%);
  filter: blur(1px); animation: fx-dent .9s cubic-bezier(.16, .84, .3, 1) forwards; }
@keyframes fx-dent { 0% { transform: scale(.15); opacity: .95; } 40% { transform: scale(.8); opacity: .8; } 100% { transform: scale(1.15); opacity: 0; } }
/* Кнопка — как клавиша: снизу ребро; навели — чуть приподнялась и посветлела, нажали — плавно ушла вниз и продавилась.
   :where() — правило слабое, его перебивает любая кнопка со своим видом (нижняя панель телефона, «Меню», кнопки в меню). */
:where(button:not(.link):not(.swatch)), .button { box-shadow: 0 3px 0 rgba(0, 0, 0, .28); transition: transform .14s cubic-bezier(.2, .8, .3, 1), box-shadow .14s, filter .2s, background-color .2s, border-color .2s; }
:where(button:not(.link):not(.swatch)):hover, .button:hover { transform: translateY(-1px); box-shadow: 0 4px 0 rgba(0, 0, 0, .28); filter: brightness(1.12); }
:where(button:not(.link):not(.swatch)):active, .button:active { transform: translateY(3px); box-shadow: 0 0 0 rgba(0, 0, 0, .28), inset 0 3px 8px rgba(0, 0, 0, .35); filter: brightness(.96); transition-duration: .06s; }
:where(button, .button, a, input, select, textarea, summary):focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.panel-user .user-actions button:active, .panel-user .user-actions a:active { transform: translateY(2px); box-shadow: inset 0 3px 8px rgba(0, 0, 0, .45); }
a.tile { transition: transform .14s cubic-bezier(.2, .8, .3, 1), box-shadow .14s, border-color .2s, background .2s; }
a.tile:hover { border-color: var(--accent); }
a.tile:active { transform: translateY(2px); box-shadow: inset 0 3px 10px rgba(0, 0, 0, .12); transition-duration: .06s; }
.swatch:hover { border-color: #fff; }
::selection { background: var(--accent); color: var(--on-accent); }
@media (prefers-reduced-motion: reduce) { button:hover, button:active, .button:hover, .button:active, a.tile:active { transform: none; } }
@media (prefers-reduced-motion: reduce) { .fx-dent { display: none; } }
