:root { color-scheme: dark; --bg:#080d12; --surface:#111922; --surface-2:#17232e; --line:#263541; --text:#f4f7f9; --muted:#93a2af; --cyan:#43d6c5; --blue:#5794ff; --red:#ff6673; --amber:#ffbd59; --green:#67d49c; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; padding-top:env(safe-area-inset-top); overflow-x:hidden; background:radial-gradient(circle at 75% -15%,#173b47 0,transparent 34%),var(--bg); color:var(--text); font-family:Inter,"Segoe UI",Arial,sans-serif; }
.login-page { min-height:100vh; }
.login-shell { min-height:100vh; display:grid; place-items:center; padding:24px; }
.login-card { width:min(100%,440px); border:1px solid rgba(67,214,197,.28); border-radius:24px; background:linear-gradient(145deg,rgba(22,33,44,.98),rgba(10,17,23,.99)); padding:clamp(28px,6vw,46px); box-shadow:0 28px 80px rgba(0,0,0,.38); }
.login-card h1 { font-size:clamp(30px,8vw,44px); line-height:1.02; }
.login-copy { margin:16px 0 28px; color:var(--muted); font-size:14px; line-height:1.5; }
.login-form { display:grid; gap:16px; }
.login-form label { display:grid; gap:7px; color:var(--muted); font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.login-form input { width:100%; min-height:50px; border:1px solid var(--line); border-radius:12px; background:#0b141b; color:var(--text); padding:12px 14px; outline:none; }
.login-form input:focus { border-color:var(--cyan); box-shadow:0 0 0 3px rgba(67,214,197,.12); }
.login-form .primary { min-height:52px; margin-top:4px; font-size:14px; }
.login-form .primary:disabled { opacity:.58; cursor:wait; }
.login-error { margin:0; border:1px solid rgba(255,102,115,.35); border-radius:10px; background:rgba(255,102,115,.08); padding:10px 12px; color:#ff9aa5; font-size:12px; line-height:1.4; }
.login-error[hidden] { display:none; }
button,input { font:inherit; }
button { color:inherit; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,[tabindex]:focus-visible { outline:2px solid rgba(67,214,197,.75); outline-offset:2px; }
.shell { width:min(1480px,calc(100% - 48px)); margin:0 auto; padding:26px 0 calc(56px + env(safe-area-inset-bottom)); }
.topbar { display:flex; justify-content:space-between; align-items:center; margin-bottom:18px; }
.topbar-actions { display:flex; align-items:center; justify-content:flex-end; gap:10px; }
.management-open { min-height:48px; display:inline-flex; align-items:center; gap:9px; border:1px solid rgba(67,214,197,.36); border-radius:14px; background:rgba(67,214,197,.09); padding:10px 14px; color:var(--cyan); cursor:pointer; }
.management-open span { font-size:18px; line-height:1; }.management-open b { font-size:12px; }.management-open:hover,.management-open:focus-visible { border-color:var(--cyan); background:rgba(67,214,197,.15); }
.eyebrow { margin:0 0 7px; color:var(--cyan); font-size:11px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
h1 { margin:0; font-size:clamp(30px,3.6vw,48px); line-height:1; letter-spacing:-.045em; }
h2 { margin:0; font-size:20px; }
.live { display:grid; grid-template-columns:auto 1fr; column-gap:9px; align-items:center; max-width:360px; border:1px solid rgba(147,162,175,.13); border-radius:14px; background:rgba(12,20,27,.45); padding:9px 12px; text-align:right; }
.live > span { width:9px; height:9px; border-radius:50%; background:var(--cyan); box-shadow:0 0 15px var(--cyan); grid-row:1/3; }
.live b { font-size:13px; }.live small,.card small { color:var(--muted); font-size:11px; }.degraded .live > span { background:var(--amber); box-shadow:0 0 15px var(--amber); }.offline .live > span { background:var(--red); box-shadow:0 0 15px var(--red); }
.period-bar { position:relative; z-index:2; display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-bottom:14px; padding:12px 14px; border:1px solid rgba(67,214,197,.22); border-radius:15px; background:rgba(15,24,32,.92); box-shadow:0 10px 30px rgba(0,0,0,.18); backdrop-filter:blur(18px); }
.period-title { min-width:150px; }.period-title span,.period-bar label { display:block; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.08em; }.period-title b { display:block; margin-top:3px; font-size:13px; }
.period-bar label { display:flex; align-items:center; gap:7px; }
.period-bar input,.drawer-tools input { border:1px solid var(--line); border-radius:10px; background:#0c141b; color:var(--text); padding:9px 10px; outline:none; }.period-bar input:focus,.drawer-tools input:focus { border-color:var(--cyan); box-shadow:0 0 0 3px rgba(67,214,197,.1); }
.period-bar input[aria-invalid="true"] { border-color:var(--red); box-shadow:0 0 0 3px rgba(255,102,115,.1); }.period-error { flex:0 0 100%; margin:0; color:#ff9ba4; font-size:11px; line-height:1.35; }.period-error[hidden] { display:none; }
.date-availability { flex:0 0 100%; min-width:0; display:grid; grid-template-columns:120px minmax(0,1fr); gap:10px; align-items:center; padding-top:10px; border-top:1px solid rgba(147,162,175,.12); }.date-availability > div:first-child span,.date-availability > div:first-child small { display:block; }.date-availability > div:first-child span { color:var(--muted); font-size:9px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.date-availability > div:first-child small { margin-top:3px; color:#b6c4cd; font-size:9px; }.availability-dates { display:flex; min-width:0; gap:5px; overflow-x:auto; padding:2px 1px 5px; scrollbar-width:thin; }.availability-day { flex:0 0 auto; min-width:52px; min-height:40px; display:grid; place-items:center; gap:1px; border:1px solid var(--line); border-radius:9px; background:#0c141b; padding:5px 7px; color:var(--text); cursor:pointer; }.availability-day b { font-size:10px; }.availability-day small { color:var(--muted); font-size:8px; }.availability-day.complete { border-color:rgba(67,214,197,.34); }.availability-day.partial { border-color:rgba(255,189,89,.42); }.availability-day.selected,.availability-day:hover,.availability-day:focus-visible { background:rgba(67,214,197,.13); border-color:var(--cyan); outline:none; }.availability-state { color:var(--muted); font-size:10px; }.availability-state.error { color:var(--red); }
.data-freshness { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:-4px 0 16px; padding:11px 14px; border:1px solid rgba(255,181,71,.34); border-radius:13px; background:rgba(255,181,71,.08); color:#f3c77f; font-size:11px; }.data-freshness[hidden],.data-freshness button[hidden] { display:none; }.data-freshness > div { display:flex; align-items:center; gap:10px; min-width:0; }.data-freshness strong { flex:0 0 auto; color:#ffd28c; }.data-freshness span { color:#c8b99e; }.data-freshness button { flex:0 0 auto; min-height:36px; border:1px solid rgba(255,189,89,.4); border-radius:9px; background:rgba(255,189,89,.12); padding:7px 11px; color:#ffd28c; cursor:pointer; font-size:10px; font-weight:800; }.data-freshness button:hover,.data-freshness button:focus-visible { background:rgba(255,189,89,.2); outline:none; }
.presets { display:flex; gap:5px; }.presets button,.primary { border:1px solid var(--line); border-radius:9px; background:#15212a; padding:9px 11px; cursor:pointer; font-size:11px; }.presets button:hover,.presets button.active { border-color:var(--cyan); background:rgba(67,214,197,.12); }.primary { border-color:transparent; background:var(--cyan); color:#06110f; font-weight:800; }
.cards { display:grid; grid-template-columns:2fr repeat(2,1fr); gap:12px; margin-bottom:12px; }
.bitrix-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }.bitrix-head p { margin:0; color:var(--muted); font-size:11px; line-height:1.45; }.bitrix-status { display:inline-flex; align-items:center; gap:7px; flex:0 0 auto; border:1px solid var(--line); border-radius:999px; padding:7px 10px; color:var(--muted); font-size:9px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }.bitrix-status::before { content:""; width:7px; height:7px; border-radius:50%; background:currentColor; }.bitrix-status.connected { border-color:rgba(67,214,197,.35); background:rgba(67,214,197,.08); color:var(--cyan); }.bitrix-status.error { border-color:rgba(255,100,115,.35); background:rgba(255,100,115,.08); color:var(--red); }.bitrix-status.loading::before { animation:bitrix-pulse 1s infinite alternate; }.bitrix-form { margin-top:18px; }.bitrix-form fieldset { display:grid; grid-template-columns:minmax(150px,.8fr) minmax(220px,1.25fr); gap:12px; min-width:0; margin:0; border:0; padding:0 0 18px; }.bitrix-form fieldset:disabled { opacity:.55; }.bitrix-form legend { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }.bitrix-roles { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }.bitrix-roles label { cursor:pointer; }.bitrix-roles input { position:absolute; opacity:0; pointer-events:none; }.bitrix-roles span { display:grid; place-items:center; min-height:44px; border:1px solid var(--line); border-radius:11px; background:#101820; color:#bdc9d1; font-size:11px; font-weight:800; transition:.15s; }.bitrix-roles input:checked + span { border-color:var(--cyan); background:rgba(67,214,197,.13); color:var(--cyan); box-shadow:inset 0 0 0 1px rgba(67,214,197,.12); }.bitrix-roles input:focus-visible + span { outline:2px solid rgba(67,214,197,.75); outline-offset:2px; }.bitrix-field { display:grid; align-content:start; gap:6px; min-width:0; }.bitrix-field > span { color:var(--muted); font-size:9px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }.bitrix-field input,.bitrix-field select,.bitrix-field textarea { width:100%; min-width:0; min-height:43px; border:1px solid var(--line); border-radius:10px; background:#0d171f; color:var(--text); padding:10px 11px; resize:vertical; }.bitrix-field textarea { min-height:92px; line-height:1.45; }.bitrix-title-field,.bitrix-description,.bitrix-submit { grid-column:1/-1; }.bitrix-submit { position:sticky; bottom:0; z-index:2; min-height:50px; border:1px solid rgba(67,214,197,.45); border-radius:11px; background:linear-gradient(135deg,#43d6c5,#29b9ab); color:#06110f; cursor:pointer; font-size:11px; font-weight:900; box-shadow:0 -10px 24px #0c131a; }.bitrix-submit:hover,.bitrix-submit:focus-visible { filter:brightness(1.07); }.bitrix-submit:disabled { cursor:wait; filter:none; opacity:.55; }.bitrix-result { margin:12px 0 0; border:1px solid var(--line); border-radius:10px; padding:11px 12px; color:#b9c7cf; font-size:11px; line-height:1.4; }.bitrix-result.success { border-color:rgba(67,214,197,.35); background:rgba(67,214,197,.08); color:var(--cyan); }.bitrix-result.error { border-color:rgba(255,100,115,.35); background:rgba(255,100,115,.08); color:#ff9aa5; }.tool-menu { display:grid; gap:10px; }.tool-card { width:100%; min-height:92px; display:grid; grid-template-columns:48px minmax(0,1fr) auto; align-items:center; gap:13px; border:1px solid var(--line); border-radius:15px; background:linear-gradient(145deg,#151f29,#101820); padding:14px; color:inherit; text-align:left; cursor:pointer; }.tool-card:hover,.tool-card:focus-visible { border-color:var(--cyan); background:rgba(67,214,197,.08); }.tool-card > span:nth-child(2) { min-width:0; }.tool-card b,.tool-card small { display:block; }.tool-card b { font-size:14px; }.tool-card small { margin-top:5px; color:var(--muted); font-size:10px; line-height:1.35; }.tool-card > strong { color:var(--cyan); font-size:26px; }.tool-icon { display:grid; place-items:center; width:48px; height:48px; border:1px solid rgba(67,214,197,.28); border-radius:13px; background:rgba(67,214,197,.1); color:var(--cyan); font-size:12px; font-weight:900; }.tool-card.bitrix .tool-icon { border-color:rgba(87,148,255,.35); background:rgba(87,148,255,.12); color:#8db6ff; }.tool-back { min-height:40px; margin:0 0 14px; border:0; border-radius:9px; background:transparent; padding:7px 9px; color:var(--cyan); cursor:pointer; font-size:11px; font-weight:750; }.tool-back:hover,.tool-back:focus-visible { background:rgba(67,214,197,.08); }.future-tools { margin-top:18px; border:1px dashed rgba(147,162,175,.25); border-radius:14px; padding:16px; }.future-tools b { font-size:12px; }.future-tools p:last-child { margin:7px 0 0; color:var(--muted); font-size:10px; line-height:1.45; }@keyframes bitrix-pulse { to { opacity:.25; } }
.trend-panel { min-height:0; margin-bottom:14px; }.trend-head { align-items:flex-start; }.trend-meta { max-width:55%; display:grid; justify-items:end; gap:4px; text-align:right; }.trend-selected { color:var(--text); font-size:12px; font-weight:750; }.trend-meta small { color:var(--muted); font-size:10px; }.kip-trend { min-height:0; }.trend-single { min-height:180px; display:grid; place-items:center; align-content:center; gap:5px; border:1px dashed #30434f; border-radius:14px; background:rgba(10,17,23,.35); text-align:center; }.trend-single strong { color:var(--cyan); font-size:40px; letter-spacing:-.04em; }.trend-single span { font-size:13px; }.trend-single small { margin-top:10px; color:var(--muted); font-size:11px; }.trend-canvas { position:relative; width:100%; aspect-ratio:var(--trend-ratio,4/1); }.trend-canvas svg { display:block; width:100%; height:100%; overflow:visible; }.trend-grid line { stroke:#263541; stroke-width:1; stroke-dasharray:4 8; }.trend-grid text,.trend-labels text { fill:var(--muted); font-size:11px; }.trend-area { fill:rgba(67,214,197,.08); }.trend-line { fill:none; stroke:var(--cyan); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 0 6px rgba(67,214,197,.26)); }.trend-point { position:absolute; left:var(--x); top:var(--y); width:10px; height:10px; padding:0; border:2px solid #0f1921; border-radius:50%; background:var(--cyan); box-shadow:0 0 0 1px rgba(67,214,197,.55); transform:translate(-50%,-50%); cursor:pointer; }.trend-point.active,.trend-point:focus-visible { width:14px; height:14px; background:var(--amber); box-shadow:0 0 0 3px rgba(255,189,89,.16); outline:none; }.trend-point span { position:absolute; left:50%; bottom:15px; display:none; border:1px solid var(--line); border-radius:7px; background:#0b1218; padding:4px 6px; color:var(--text); font-size:10px; white-space:nowrap; transform:translateX(-50%); }.trend-point:hover span,.trend-point:focus-visible span,.trend-point.active span { display:block; }
.trend-drilldown { min-height:34px; margin-top:3px; border:1px solid rgba(67,214,197,.35); border-radius:9px; background:rgba(67,214,197,.09); padding:6px 9px; color:var(--cyan); cursor:pointer; font-size:10px; font-weight:750; }.trend-drilldown:hover,.trend-drilldown:focus-visible { background:rgba(67,214,197,.16); outline:none; }.trend-drilldown:disabled { border-color:var(--line); background:rgba(147,162,175,.05); color:var(--muted); cursor:not-allowed; }
.card,.panel { position:relative; overflow:hidden; border:1px solid var(--line); border-radius:18px; background:linear-gradient(145deg,rgba(22,33,44,.97),rgba(12,20,27,.99)); box-shadow:0 18px 50px rgba(0,0,0,.18); }
.card { appearance:none; width:100%; min-height:194px; padding:20px 20px 54px; text-align:left; cursor:pointer; transition:transform .18s,border-color .18s,box-shadow .18s; }.card:hover,.card:focus-visible { transform:translateY(-2px); border-color:#3e5a6d; box-shadow:0 22px 55px rgba(0,0,0,.28); outline:none; }.card::after { content:""; position:absolute; width:130px; height:130px; right:-70px; top:-75px; border-radius:50%; background:rgba(72,137,255,.12); pointer-events:none; }.card.accent { background:linear-gradient(135deg,#142d36,#0e1c24); }
.card-head { display:flex; justify-content:space-between; gap:12px; font-size:13px; font-weight:750; }.card-head > span { line-height:1.25; }.metric { display:block; margin:24px 0 9px; font-size:40px; line-height:1; letter-spacing:-.045em; }.danger { color:var(--red)!important; }.warning { color:var(--amber)!important; }.positive { color:var(--green)!important; }.card p { margin:0; color:var(--muted); font-size:12px; line-height:1.45; }.card-link { position:absolute; bottom:17px; left:20px; color:#c5d1d9; font-size:11px; font-weight:650; }
.card-head-meta { display:grid; max-width:62%; justify-items:end; gap:4px; }.card .card-freshness { display:inline-flex; max-width:100%; align-items:center; justify-content:flex-end; gap:5px; color:var(--muted); text-align:right; line-height:1.25; }.card-freshness::before { content:""; flex:0 0 auto; width:6px; height:6px; border-radius:50%; background:currentColor; }.card-freshness.current { color:var(--green); }.card-freshness.stale { color:var(--amber); }.card-freshness.fallback { color:#ff9e62; }.card-freshness.missing { color:var(--muted); }.card .card-channel { display:inline-flex; align-items:center; border:1px solid rgba(147,162,175,.24); border-radius:999px; padding:2px 6px; color:#afbdc7; font-size:8px; font-weight:800; letter-spacing:.05em; line-height:1.2; text-transform:uppercase; white-space:nowrap; }.card .card-channel.direct { border-color:rgba(67,214,197,.38); background:rgba(67,214,197,.08); color:var(--cyan); }.card .card-channel.browser { border-color:rgba(87,148,255,.35); background:rgba(87,148,255,.08); color:#8db6ff; }.card .card-channel.unknown { color:var(--muted); }
.maintenance-summary { display:grid; grid-template-columns:minmax(150px,.55fr) minmax(360px,1.45fr); gap:10px; }.maintenance-all { position:relative; appearance:none; width:100%; min-height:94px; display:grid; align-content:center; border:1px solid rgba(255,189,89,.3); border-radius:14px; background:linear-gradient(145deg,rgba(255,189,89,.1),rgba(255,189,89,.025)); padding:12px 14px; color:inherit; text-align:left; cursor:pointer; }.maintenance-all span,.maintenance-all strong,.maintenance-all small { display:block; }.maintenance-all span { color:var(--muted); font-size:9px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.maintenance-all strong { margin:4px 0 5px; font-size:34px; line-height:1; }.maintenance-all small { color:#d7c39f; font-size:9px; }.maintenance-all:hover,.maintenance-all:focus-visible { border-color:var(--amber); background:rgba(255,189,89,.12); }.maintenance-breakdown { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }.maintenance-filter { min-width:0; min-height:94px; border:1px solid var(--line); border-radius:14px; background:rgba(8,13,18,.5); padding:12px; color:inherit; text-align:left; cursor:pointer; }.maintenance-filter span,.maintenance-filter b,.maintenance-filter small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.maintenance-filter span { color:var(--muted); font-size:8px; font-weight:750; text-transform:uppercase; letter-spacing:.04em; }.maintenance-filter b { margin-top:7px; font-size:24px; font-variant-numeric:tabular-nums; }.maintenance-filter small { margin-top:5px; color:#7f919e; font-size:8px; }.maintenance-filter.overdue b { color:var(--red); }.maintenance-filter.due b { color:var(--amber); }.maintenance-filter.due-soon b { color:#f4d39f; }.maintenance-filter:hover,.maintenance-filter:focus-visible { border-color:var(--cyan); background:rgba(67,214,197,.09); outline:none; }
.fleet-card-content { display:grid; grid-template-columns:145px minmax(180px,1fr); gap:18px; align-items:center; }.gauge-column { min-width:0; text-align:center; }.gauge { --value:0deg; position:relative; isolation:isolate; width:112px; aspect-ratio:1; margin:16px auto 8px; display:grid; place-items:center; border-radius:50%; background:conic-gradient(from -90deg,var(--cyan) 0 var(--value),#25333e var(--value) 360deg); box-shadow:0 0 0 1px rgba(67,214,197,.08),0 13px 32px rgba(0,0,0,.2),inset 0 0 15px rgba(67,214,197,.08); }.gauge::before { content:""; position:absolute; z-index:-1; inset:10px; border:1px solid rgba(255,255,255,.035); border-radius:inherit; background:radial-gradient(circle at 50% 42%,#18313a 0,#14232b 62%,#101d24 100%); box-shadow:inset 0 8px 22px rgba(0,0,0,.2); }.gauge strong { position:relative; display:block; transform:translateY(-1px); color:#f4f8fa; font-size:25px; font-variant-numeric:tabular-nums; letter-spacing:-.045em; line-height:1; text-shadow:0 2px 12px rgba(0,0,0,.3); }.gauge-column p { text-align:center; }.not-issued-preview { min-height:134px; padding-left:18px; border-left:1px solid var(--line); display:flex; flex-direction:column; }.not-issued-preview > span { color:var(--muted); font-size:11px; }.not-issued-preview > strong { margin:3px 0 8px; font-size:36px; }.not-issued-preview div { display:grid; gap:6px; }.not-issued-preview .not-issued-split { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:28px; border:1px solid rgba(147,162,175,.12); border-radius:9px; background:rgba(7,13,18,.24); padding:6px 8px; color:#c7d2d9; font-size:9px; letter-spacing:.04em; text-transform:uppercase; }.not-issued-preview .not-issued-split b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.not-issued-preview .not-issued-split strong { flex:0 0 auto; min-width:25px; border-radius:999px; padding:3px 7px; background:#22313b; color:var(--text); font-size:11px; text-align:center; }.not-issued-preview .not-issued-split.ready { border-color:rgba(67,214,197,.26); background:rgba(67,214,197,.07); }.not-issued-preview .not-issued-split.ready b,.not-issued-preview .not-issued-split.ready strong { color:var(--cyan); }.not-issued-preview em { margin-top:auto; color:var(--cyan); font-size:10px; font-style:normal; }
.layout { display:grid; grid-template-columns:1.65fr 1fr; gap:14px; align-items:start; }.panel { padding:22px; min-height:300px; }.wide { align-self:start; }.panel-head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:18px; }.tag,.pill { display:inline-block; border:1px solid #384b5a; border-radius:999px; color:#bac7d1; font-size:9px; padding:5px 9px; text-transform:uppercase; letter-spacing:.07em; white-space:nowrap; }.table-wrap { overflow-x:auto; }table { width:100%; border-collapse:collapse; font-size:12px; }th { padding:10px 12px; color:var(--muted); text-align:left; font-size:10px; letter-spacing:.07em; text-transform:uppercase; border-bottom:1px solid var(--line); }td { padding:12px; border-bottom:1px solid rgba(36,50,64,.7); white-space:nowrap; }td:first-child { white-space:normal; }.num { text-align:right; font-variant-numeric:tabular-nums; }tbody tr[data-view] { cursor:pointer; transition:background .15s; }tbody tr[data-view]:hover,tbody tr[data-view]:focus { background:rgba(67,214,197,.06); outline:none; }
.maintenance-rule { border-color:rgba(255,189,89,.38); color:#f2c983; text-transform:none; letter-spacing:.02em; }
.maintenance-reading small { display:block; margin-bottom:3px; color:var(--muted); font-size:9px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; }.maintenance-reading b,.maintenance-reading strong { display:block; font-variant-numeric:tabular-nums; }
.maintenance-kind { display:block; max-width:240px; margin-top:4px; overflow:hidden; color:#9fb1bd; font-size:9px; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }
.maintenance-items { margin-top:13px; padding-top:12px; border-top:1px solid var(--line); }.maintenance-items h3 { margin:0 0 8px; color:var(--muted); font-size:9px; letter-spacing:.06em; text-transform:uppercase; }.maintenance-items ol { display:grid; gap:6px; margin:0; padding:0; list-style:none; }.maintenance-items li { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 9px; border-radius:9px; background:rgba(255,255,255,.025); }.maintenance-items li b,.maintenance-items li small { display:block; }.maintenance-items li b { font-size:11px; }.maintenance-items li small { margin-top:2px; color:var(--muted); font-size:9px; }.maintenance-items li strong { flex:0 0 auto; font-size:11px; font-variant-numeric:tabular-nums; }
.maintenance-panel-head { align-items:flex-start; gap:18px; }.maintenance-explainer { margin:7px 0 0; color:var(--muted); font-size:10px; line-height:1.4; }.maintenance-panel .card-head-meta { max-width:48%; }.maintenance-panel .card-freshness { display:inline-flex; align-items:center; justify-content:flex-end; gap:5px; font-size:10px; text-align:right; }.maintenance-panel .card-channel { display:inline-flex; justify-self:end; border:1px solid rgba(147,162,175,.24); border-radius:999px; padding:3px 7px; color:#afbdc7; font-size:8px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }.maintenance-panel .card-channel.direct { border-color:rgba(67,214,197,.38); background:rgba(67,214,197,.08); color:var(--cyan); }.maintenance-panel .card-channel.browser { border-color:rgba(87,148,255,.35); background:rgba(87,148,255,.08); color:#8db6ff; }.maintenance-controls { display:grid; grid-template-columns:auto minmax(220px,1fr) auto; gap:8px 12px; align-items:center; margin-top:14px; border:1px solid rgba(147,162,175,.12); border-radius:13px; background:rgba(8,13,18,.28); padding:11px 12px; }.maintenance-controls label { color:var(--muted); font-size:9px; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }.maintenance-controls select { width:100%; min-height:40px; border:1px solid var(--line); border-radius:10px; background:#101820; color:var(--text); padding:7px 30px 7px 10px; }.maintenance-controls .maintenance-rule { max-width:none; text-align:center; }
.maintenance-details { margin-top:12px; border-top:1px solid var(--line); }.maintenance-details summary { display:flex; align-items:center; gap:10px; min-height:50px; border-radius:10px; padding:8px 10px; color:var(--cyan); cursor:pointer; font-size:11px; font-weight:750; list-style:none; }.maintenance-details summary::-webkit-details-marker { display:none; }.maintenance-details summary::before { content:""; flex:0 0 auto; width:8px; height:8px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(-45deg); transition:transform .16s ease; }.maintenance-details[open] summary::before { transform:rotate(45deg); }.maintenance-details summary:hover,.maintenance-details summary:focus-visible { background:rgba(67,214,197,.08); outline:none; }.maintenance-details summary strong { margin-left:auto; border-radius:999px; background:#1b2b35; padding:4px 8px; color:#cbd5db; font-size:10px; font-variant-numeric:tabular-nums; }.maintenance-details-open { display:none; }.maintenance-details[open] .maintenance-details-open { display:inline; }.maintenance-details[open] .maintenance-details-closed { display:none; }.maintenance-details[open] .table-wrap { margin-top:4px; }
.status-list { display:grid; gap:7px; }.status-row { appearance:none; width:100%; border:0; border-radius:10px; background:transparent; padding:7px 8px; text-align:left; cursor:pointer; }.status-row:hover,.status-row:focus-visible { background:rgba(87,148,255,.08); outline:none; }.status-row > div { display:flex; justify-content:space-between; margin-bottom:5px; font-size:12px; }.status-row i { display:block; height:5px; overflow:hidden; border-radius:9px; background:#25323d; }.status-row em { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--blue),var(--cyan)); }.status-row small { display:block; max-height:0; overflow:hidden; color:var(--cyan); font-size:9px; transition:max-height .15s,margin .15s; }.status-row:hover small { max-height:14px; margin-top:5px; }
.rank-list { display:grid; gap:4px; }.rank { display:grid; grid-template-columns:25px minmax(0,1fr) auto; gap:10px; align-items:center; padding:9px 4px; border-radius:9px; border-bottom:1px solid rgba(36,50,64,.7); cursor:pointer; }.rank:hover,.rank:focus { background:rgba(87,148,255,.07); outline:none; }.rank > span { display:grid; place-items:center; width:22px; height:22px; border-radius:7px; background:#202e3a; color:var(--muted); font-size:10px; }.rank b { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; }.rank small { display:block; margin-top:3px; }.rank > strong { color:var(--red); font-size:12px; font-variant-numeric:tabular-nums; }
.balance-table-wrap { overflow-x:auto; }.balance-table { table-layout:fixed; }.balance-table th:first-child,.balance-table td:first-child { width:22%; }.balance-table th:nth-child(2),.balance-table td:nth-child(2) { width:34%; }.balance-table th:nth-child(3),.balance-table td:nth-child(3),.balance-table th:nth-child(4),.balance-table td:nth-child(4) { width:22%; }.balance-table td { vertical-align:middle; }.balance-table .board-number { color:var(--text); font-variant-numeric:tabular-nums; }.balance-table .driver-name b { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.balance-table .driver-name small { display:block; margin-top:4px; }.balance-table .driver-name .call { min-height:0; border:0; padding:0; }.vehicle-model { display:block; margin-top:4px; overflow:hidden; color:var(--muted); font-size:9px; font-weight:500; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }.balance-total { color:var(--red); font-weight:800; }.balance-autosila { color:#c9d5dc; font-weight:700; }
.call { display:inline-flex; align-items:center; gap:6px; min-height:32px; border:1px solid rgba(67,214,197,.35); border-radius:9px; padding:6px 9px; color:var(--cyan); text-decoration:none; font-size:11px; }.call:hover { background:rgba(67,214,197,.1); }.rank .call { min-height:0; border:0; padding:0; }.no-phone { color:var(--muted); font-size:10px; }
.sources-panel { grid-column:2; }.source-list { display:grid; gap:6px; }.source-row { appearance:none; width:100%; display:grid; grid-template-columns:10px minmax(0,1fr) auto; gap:10px; align-items:center; padding:10px 6px; border:0; border-bottom:1px solid rgba(36,50,64,.7); border-radius:9px; background:transparent; color:inherit; text-align:left; cursor:pointer; }.source-row:hover,.source-row:focus-visible { background:rgba(67,214,197,.06); outline:1px solid rgba(67,214,197,.25); }.source-dot { width:8px; height:8px; border-radius:50%; background:var(--muted); }.source-dot.ok { background:var(--cyan); box-shadow:0 0 10px rgba(67,214,197,.7); }.source-dot.bad { background:var(--red); }.source-row b { display:block; font-size:12px; }.source-row small { display:block; margin-top:3px; color:var(--muted); font-size:10px; }.source-row strong { color:var(--muted); font-size:10px; text-transform:uppercase; }.empty { color:var(--muted); padding:24px; text-align:center; }
.drawer-backdrop { position:fixed; inset:0; z-index:30; background:rgba(2,6,9,.7); backdrop-filter:blur(4px); }.drawer { position:fixed; visibility:hidden; z-index:31; top:0; right:0; width:min(560px,100%); height:100dvh; display:flex; flex-direction:column; border-left:1px solid var(--line); background:#0c131a; box-shadow:-30px 0 80px rgba(0,0,0,.45); transform:translateX(102%); transition:transform .24s ease,visibility 0s linear .24s; }.drawer.open { visibility:visible; transform:translateX(0); transition:transform .24s ease; }.drawer-handle { display:none; }.drawer header { display:flex; justify-content:space-between; align-items:start; gap:20px; padding:24px 24px 15px; border-bottom:1px solid var(--line); }.drawer header > div { min-width:0; }.drawer header small { display:block; margin-top:6px; color:var(--muted); }.drawer header button { flex:0 0 38px; width:38px; height:38px; border:1px solid var(--line); border-radius:50%; background:var(--surface-2); font-size:24px; cursor:pointer; }.drawer-tools { display:flex; align-items:center; gap:10px; padding:14px 24px; }.drawer-tools[hidden] { display:none; }.drawer-tools input { flex:1; min-width:0; }.drawer-tools span { color:var(--muted); font-size:11px; white-space:nowrap; }.drawer-export { display:inline-flex; min-height:38px; align-items:center; border:1px solid rgba(67,214,197,.35); border-radius:10px; padding:7px 10px; color:var(--cyan); text-decoration:none; font-size:10px; font-weight:750; white-space:nowrap; }.drawer-export:hover,.drawer-export:focus-visible { background:rgba(67,214,197,.1); outline:none; }.drawer-content { flex:1; overflow:auto; padding:0 24px 30px; overscroll-behavior:contain; }.detail-card { margin-bottom:9px; padding:15px; border:1px solid var(--line); border-radius:14px; background:linear-gradient(145deg,#151f29,#101820); }.detail-title { display:flex; justify-content:space-between; align-items:start; gap:12px; }.detail-title b { display:block; font-size:15px; }.detail-title span:not(.pill) { display:block; margin-top:3px; color:var(--muted); font-size:11px; }.detail-title strong { font-size:14px; white-space:nowrap; }.detail-card dl { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:13px 0 0; }.detail-card dl div { min-width:0; }.detail-card dt { color:var(--muted); font-size:9px; text-transform:uppercase; letter-spacing:.06em; }.detail-card dd { overflow:hidden; margin:3px 0 0; text-overflow:ellipsis; font-size:11px; }.detail-card > .call { margin-top:13px; }.detail-card.debt .detail-title strong { color:var(--red); }.source-action { margin:16px 0 0; padding:12px; border:1px solid rgba(255,189,89,.35); border-radius:10px; background:rgba(255,189,89,.08); font-size:11px; line-height:1.45; }.drawer-open { overflow:hidden; }
.fleet-groups { display:grid; gap:22px; }.fleet-group { display:grid; gap:10px; }.fleet-group-head { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:0; border:1px solid var(--line); border-radius:14px; padding:13px 14px; background:#111b23; }.fleet-group-head div { min-width:0; }.fleet-group-head b,.fleet-group-head span { display:block; }.fleet-group-head b { font-size:12px; letter-spacing:.055em; }.fleet-group-head span { margin-top:4px; color:var(--muted); font-size:10px; line-height:1.35; }.fleet-group-head > strong { flex:0 0 auto; min-width:34px; border-radius:999px; padding:6px 10px; background:#22313b; font-size:13px; font-variant-numeric:tabular-nums; text-align:center; }.fleet-group.ready .fleet-group-head { border-color:rgba(67,214,197,.35); background:linear-gradient(135deg,rgba(67,214,197,.13),rgba(67,214,197,.035)); }.fleet-group.ready .fleet-group-head b,.fleet-group.ready .fleet-group-head > strong { color:var(--cyan); }.fleet-group.others .fleet-group-head { border-color:rgba(147,162,175,.22); }.fleet-group-list .detail-card:last-child { margin-bottom:0; }.fleet-group-empty { margin:0; border:1px dashed var(--line); border-radius:12px; padding:18px; color:var(--muted); font-size:11px; text-align:center; }
.source-controls { display:flex; gap:9px; margin-top:14px; }.source-controls button { flex:1; min-height:44px; border:1px solid rgba(67,214,197,.38); border-radius:11px; background:rgba(67,214,197,.1); color:var(--cyan); cursor:pointer; font-size:11px; font-weight:750; }.source-controls button:first-child:not(:last-child) { border-color:rgba(255,189,89,.42); background:rgba(255,189,89,.1); color:#ffd28c; }.source-controls button:hover,.source-controls button:focus-visible { background:rgba(67,214,197,.17); outline:none; }.source-controls button:disabled { cursor:wait; opacity:.55; }.source-action-result { margin:10px 0 0; color:#aebdc7; font-size:11px; line-height:1.45; }.source-action-result.error { color:var(--red); }
.onec-sms-form { margin-top:15px; padding:14px; border:1px solid rgba(67,214,197,.28); border-radius:13px; background:rgba(67,214,197,.05); }.onec-sms-form label { display:block; margin-bottom:7px; color:var(--muted); font-size:10px; font-weight:750; letter-spacing:.06em; text-transform:uppercase; }.onec-sms-form input { width:100%; min-height:48px; border:1px solid var(--line); border-radius:11px; padding:0 14px; background:#0a1218; color:var(--text); font-size:20px; font-weight:800; letter-spacing:.18em; text-align:center; }.onec-sms-form input:focus { border-color:var(--cyan); outline:2px solid rgba(67,214,197,.15); }.onec-sms-form .source-controls { margin-top:10px; }
.onec-captcha { margin-top:15px; padding:12px; border:1px solid rgba(255,189,89,.32); border-radius:13px; background:rgba(255,189,89,.055); }.onec-captcha-frame { overflow:hidden; border:1px solid rgba(147,162,175,.3); border-radius:11px; background:#87909a; }.onec-captcha img { display:block; width:100%; height:auto; cursor:crosshair; user-select:none; -webkit-user-drag:none; touch-action:manipulation; }.onec-captcha img:focus-visible { outline:2px solid var(--cyan); outline-offset:-2px; }.onec-captcha p { margin:9px 2px 0; color:#b9c7cf; font-size:10px; line-height:1.4; }.onec-captcha .source-controls { margin-top:10px; }
.drawer.captcha-mode { width:min(760px,100%); }.onec-captcha-frame { overflow:auto; }.onec-captcha img { width:100%; min-width:0; }.onec-captcha.zoomed img { width:200%; max-width:none; }.onec-captcha p { font-size:13px; }.onec-captcha .source-controls button { font-size:13px; }
@media (max-width:760px) { .drawer.captcha-mode { height:100dvh; border-radius:0; }.drawer.captcha-mode .drawer-content { padding-bottom:calc(24px + env(safe-area-inset-bottom)); }.onec-captcha { padding:8px; }.onec-captcha.zoomed img { width:200%; } }
.source-history { margin:18px 0 0; }.source-history h3 { margin:0 0 9px; color:#cbd6dd; font-size:12px; }.source-history ol { display:grid; gap:7px; margin:0; padding:0; list-style:none; }.source-history li { padding:11px 12px; border:1px solid var(--line); border-radius:11px; background:#101820; }.source-history li > div { display:flex; justify-content:space-between; align-items:center; gap:10px; }.source-history time,.source-history strong { font-size:11px; }.source-history small,.source-history span { display:block; margin-top:4px; color:var(--muted); font-size:10px; line-height:1.35; }.source-history span { color:#b9c7cf; font-variant-numeric:tabular-nums; }.source-history-state { margin:0; padding:14px; border:1px dashed var(--line); border-radius:11px; color:var(--muted); font-size:11px; text-align:center; }.source-history-state.error { color:var(--red); }
.load-more,.retry { display:block; width:100%; min-height:46px; margin:14px 0 0; border:1px solid rgba(67,214,197,.35); border-radius:12px; background:rgba(67,214,197,.09); color:var(--cyan); cursor:pointer; font-weight:750; }.load-more:hover,.retry:hover { background:rgba(67,214,197,.15); }.load-more:disabled { cursor:wait; opacity:.6; }.empty.loading::after { content:""; display:block; width:22px; height:22px; margin:14px auto 0; border:2px solid #2d404c; border-top-color:var(--cyan); border-radius:50%; animation:spin .8s linear infinite; }.empty.error { color:var(--red); }.retry { width:min(220px,100%); margin:0 auto; }
@keyframes spin { to { transform:rotate(360deg); } }
.maintenance-details[open] thead { position:sticky; top:0; z-index:1; background:#111922; }
@media (max-width:1180px) { .cards { grid-template-columns:repeat(2,1fr); }.fleet-card { grid-column:span 2; }.layout { grid-template-columns:1fr; }.wide { grid-row:auto; }.sources-panel { grid-column:auto; }.period-title { min-width:120px; } }
@media (max-width:760px) { .shell { width:min(100% - 24px,1480px); padding-top:16px; }.topbar { align-items:flex-start; margin-bottom:14px; }.live { max-width:48%; padding:7px 9px; }.live small { display:none; }.period-bar { position:static; display:grid; grid-template-columns:1fr 1fr; gap:9px; border-radius:18px; }.period-title { grid-column:1/-1; }.presets { grid-column:1/-1; }.presets button { flex:1; min-height:44px; }.period-bar label { display:grid; gap:5px; }.period-bar input { width:100%; min-width:0; min-height:44px; }.primary,.period-error,.date-availability { grid-column:1/-1; }.primary { min-height:46px; }.period-error { font-size:12px; }.date-availability { grid-template-columns:1fr; gap:7px; }.availability-day { min-width:58px; min-height:44px; }.data-freshness { align-items:stretch; flex-direction:column; gap:9px; margin-top:0; font-size:12px; line-height:1.4; }.data-freshness > div { align-items:flex-start; flex-direction:column; gap:4px; }.data-freshness button { width:100%; min-height:44px; }.cards { grid-template-columns:1fr; }.fleet-card { grid-column:auto; }.card { min-height:176px; padding:18px 18px 52px; }.fleet-card { min-height:218px; }.card-link { left:18px; }.panel { padding:16px; }.panel-head { align-items:start; }.panel-head .tag { max-width:158px; white-space:normal; text-align:right; }.trend-panel .panel-head { display:grid; }.trend-selected { max-width:none; text-align:left; }.trend-canvas { min-height:0; }.trend-point span { display:none!important; }.table-wrap { margin:0 -16px; padding:0 16px; }.drawer { top:auto; bottom:0; height:min(88dvh,850px); border:1px solid var(--line); border-radius:22px 22px 0 0; transform:translateY(105%); }.drawer.open { transform:translateY(0); }.drawer-handle { display:block; width:42px; height:4px; margin:8px auto 0; border-radius:3px; background:#40515f; }.drawer header { padding:14px 16px 12px; }.drawer-tools { position:sticky; top:0; z-index:2; padding:12px 16px; background:#0c131a; }.drawer-content { padding:0 16px calc(24px + env(safe-area-inset-bottom)); }.detail-card { padding:14px; }.call { min-height:44px; }.source-controls { flex-direction:column; }.source-controls button { flex:none; width:100%; min-height:46px; } }
@media (max-width:480px) { .topbar h1 { max-width:190px; font-size:31px; line-height:1.04; }.topbar .eyebrow { font-size:9px; }.live { border:0; background:transparent; padding:2px 0; }.live b { font-size:10px; line-height:1.25; }.cards { gap:10px; }.fleet-card-content { grid-template-columns:125px minmax(0,1fr); gap:8px; }.gauge { width:102px; height:102px; }.not-issued-preview { padding-left:12px; }.not-issued-preview > strong { font-size:30px; }.metric { margin-top:18px; }.card-link { bottom:15px; }.panel { min-height:250px; }.table-wrap { overflow-x:hidden; }table { table-layout:fixed; font-size:11px; }th,td { padding:10px 5px; overflow:hidden; text-overflow:ellipsis; }th:nth-child(3),td:nth-child(3),th:nth-child(4),td:nth-child(4) { display:none; }th:first-child,td:first-child { width:37%; }th:nth-child(2),td:nth-child(2) { width:26%; }th:last-child,td:last-child { width:37%; }.maintenance-reading small { font-size:8px; }.detail-card dl { grid-template-columns:1fr; } }
@media (max-width:480px) { .balance-panel { padding:16px 8px; }.balance-panel .panel-head { padding:0 8px; }.balance-table-wrap { overflow-x:auto; }.balance-table { min-width:304px; font-size:9.5px; }.balance-table th,.balance-table td { display:table-cell!important; padding:9px 3px; }.balance-table th { white-space:normal; font-size:7.5px; line-height:1.2; letter-spacing:.025em; }.balance-table th:first-child,.balance-table td:first-child { width:18%; }.balance-table th:nth-child(2),.balance-table td:nth-child(2) { width:34%; }.balance-table th:nth-child(3),.balance-table td:nth-child(3),.balance-table th:nth-child(4),.balance-table td:nth-child(4) { width:24%; }.balance-table .driver-name b { font-size:9.5px; }.balance-table .driver-name .call { gap:2px; font-size:8px; }.balance-table .board-number { font-size:9px; } }
@media (max-width:760px) { .trend-meta { max-width:none; justify-items:start; text-align:left; }.trend-drilldown { width:100%; min-height:44px; margin-top:5px; } }
@media (max-width:760px) { .maintenance-panel-head { display:flex; }.maintenance-panel .card-head-meta { max-width:46%; }.maintenance-summary { grid-template-columns:1fr; }.maintenance-all { min-height:86px; }.maintenance-breakdown { gap:6px; }.maintenance-filter { min-height:82px; padding:9px 7px; }.maintenance-filter b { font-size:20px; }.maintenance-controls { width:100%; grid-template-columns:1fr; justify-items:stretch; }.maintenance-controls select { min-height:44px; }.maintenance-controls .maintenance-rule { max-width:none; text-align:left; } }
@media (max-width:760px) { .bitrix-head { display:grid; gap:12px; }.bitrix-status { justify-self:start; }.bitrix-head p:not(.eyebrow) { font-size:11px; }.bitrix-form fieldset { grid-template-columns:1fr; }.bitrix-roles,.bitrix-title-field,.bitrix-description,.bitrix-submit { grid-column:1; }.bitrix-roles { gap:6px; }.bitrix-roles span { min-height:46px; padding:6px; font-size:10px; }.bitrix-field input,.bitrix-field select { min-height:46px; }.bitrix-submit { min-height:50px; } }
@media (max-width:420px) { .bitrix-roles { grid-template-columns:1fr; }.bitrix-roles span { min-height:42px; } }
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; transition:none!important; } }
@media (max-width:760px) { .topbar-actions { max-width:56%; flex-wrap:wrap; gap:6px; }.management-open { order:2; width:100%; min-height:44px; justify-content:center; padding:8px 10px; }.topbar-actions .live { max-width:100%; }.drawer .bitrix-head { display:grid; }.tool-card { min-height:88px; } }
@media (max-width:420px) { .management-open b { font-size:10px; }.management-open span { font-size:15px; } }

/* Compact operational view; keep touch targets at least 44px. */
.shell { padding-top:20px; }
.topbar { margin-bottom:14px; }
.period-bar { gap:8px 10px; padding:10px 12px; margin-bottom:10px; }
.cards { gap:10px; align-items:stretch; margin-bottom:10px; }
.card { min-height:170px; padding:15px 15px 44px; }
.card-link { bottom:13px; left:15px; }
.metric { margin:15px 0 6px; font-size:34px; }
.gauge { width:100px; margin:10px auto 6px; }
.fleet-card-content { grid-template-columns:125px minmax(0,1fr); gap:10px; }
.fleet-card { padding-bottom:15px; }
.panel { min-height:0; padding:16px; }
.panel-head { gap:10px; margin-bottom:11px; }
h2 { font-size:18px; }
.layout { gap:10px; }
.trend-panel { margin-bottom:10px; }
.maintenance-all,.maintenance-filter { min-height:82px; padding:10px; }
.maintenance-controls { margin-top:10px; padding:8px 10px; }
.maintenance-details { margin-top:8px; }
.maintenance-details summary { min-height:44px; }
th { padding:8px 10px; } td { padding:8px 10px; line-height:1.25; }
.status-list { gap:3px; }.status-row { min-height:44px; padding:6px 8px; }
.detail-card { margin-bottom:7px; padding:12px; }
.detail-card dl { gap:7px; margin-top:9px; }
.detail-card dd { margin-top:2px; }
.detail-card > .call { margin-top:9px; }
.source-row { min-height:52px; padding:8px 6px; }
.source-row small { margin-top:2px; line-height:1.3; }
.source-row strong { max-width:90px; text-align:right; }
.compact-details { border:1px solid var(--line); border-radius:12px; background:rgba(9,16,22,.35); }
.compact-details > summary { display:flex; align-items:center; gap:9px; min-height:44px; padding:10px 12px; list-style:none; color:var(--cyan); font-size:12px; font-weight:750; cursor:pointer; }
.compact-details > summary::-webkit-details-marker { display:none; }
.compact-details > summary::before { content:""; width:7px; height:7px; flex:0 0 auto; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(-45deg); }
.compact-details[open] > summary::before { transform:rotate(45deg); }
.compact-details > summary strong { margin-left:auto; color:var(--muted); font-size:10px; font-variant-numeric:tabular-nums; }
.autocollect-details .source-list { padding:0 10px 8px; }
.source-explainer { margin:0; padding:0 12px 12px; color:var(--muted); font-size:11px; line-height:1.4; }
.transport-details { margin-top:10px; }
.balance-card { display:flex; flex-direction:column; padding:0; cursor:default; }
.balance-card:hover { transform:none; }
.balance-summary { position:relative; flex:1; width:100%; min-height:128px; border:0; background:transparent; padding:15px 15px 36px; text-align:left; cursor:pointer; }
.balance-metrics { display:flex; align-items:baseline; gap:8px; margin:13px 0 5px; }
.balance-metrics .metric { margin:0; }
.balance-metrics > span { color:var(--muted); font-size:10px; }
.balance-card .compact-details { margin:0 10px 10px; }
.balance-card .balance-table-wrap { padding:0 10px; }
.balance-card .balance-table { min-width:320px; }
.balance-table .driver-name small,.vehicle-model { margin-top:2px; }
.balance-all { min-height:44px; display:block; width:100%; border:0; background:transparent; color:var(--cyan); font-size:11px; font-weight:750; cursor:pointer; }
.bitrix-submit { position:static; box-shadow:none; }
.cards:has(#balance-details[open]) { grid-template-columns:2fr 1fr; }
.cards:has(#balance-details[open]) .fleet-card { grid-column:1; }
.cards:has(#balance-details[open]) .balance-card { grid-column:1/-1; grid-row:2; }
.cards:has(#balance-details[open]) > [data-view="cash"] { grid-column:2; }
@media (max-width:1180px) and (min-width:761px) { .cards:has(#balance-details[open]) .fleet-card { grid-column:1; } }
@media (max-width:760px) {
  .shell { padding-top:14px; }.cards,.cards:has(#balance-details[open]) { grid-template-columns:1fr; }
  .cards:has(#balance-details[open]) .fleet-card,.cards:has(#balance-details[open]) .balance-card,.cards:has(#balance-details[open]) > [data-view="cash"] { grid-column:auto; grid-row:auto; }
  .card { min-height:144px; padding:14px 14px 40px; }.fleet-card { min-height:176px; padding-bottom:14px; }
  .balance-card { padding:0; min-height:0; }.balance-summary { min-height:122px; padding:14px 14px 34px; }
  .card-link { left:14px; bottom:11px; }.panel { min-height:0; padding:14px; }
  .maintenance-panel-head { gap:8px; }.maintenance-summary { gap:7px; }
  .maintenance-all { min-height:76px; }.maintenance-filter { min-height:74px; }
  .drawer-content { padding-left:14px; padding-right:14px; }
  .bitrix-field input,.bitrix-field select,.bitrix-field textarea { font-family:inherit; font-size:16px; }
  .bitrix-roles { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .bitrix-roles span { min-height:44px; font-size:10px; }
  .balance-table th,.balance-table td { display:table-cell!important; padding:7px 4px; }
  .balance-table { font-size:11px; }.balance-table th { font-size:8px; white-space:normal; }
  .balance-table .driver-name b { font-size:11px; }.balance-table .driver-name .call { font-size:10px; min-height:44px; }
  .balance-table td { min-height:44px; }.balance-table .board-number { font-size:11px; }
  .balance-table th:first-child,.balance-table td:first-child { width:18%; }
  .balance-table th:nth-child(2),.balance-table td:nth-child(2) { width:38%; }
  .balance-table th:nth-child(3),.balance-table td:nth-child(3),.balance-table th:nth-child(4),.balance-table td:nth-child(4) { width:22%; }
}