/* BavABS D3 TaskStack — ultra-light mobile */
:root{--hdr:#1A1A2E;--bg:#F7F7F9;--ink:#111;--muted:#4A4A4A;--line:#D8D8DE;--teal:#00695C;--done:#1B5E20;--next:#0B5FFF;--warn:#8A5A00;--danger:#B00020;--future:#6B7280;--tap:48px;--cta:64px;--safe:env(safe-area-inset-bottom,0px);--f:system-ui,"Segoe UI",Roboto,sans-serif}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{height:100%;font-family:var(--f);background:var(--bg);color:var(--ink);font-size:16px;line-height:1.45;-webkit-text-size-adjust:100%;overscroll-behavior-y:none}
.app{min-height:100%;display:flex;flex-direction:column;max-width:480px;margin:0 auto;padding-bottom:calc(12px + var(--safe))}
.build-ver{position:fixed;right:30px;bottom:calc(18px + var(--safe));font-size:12px;font-weight:800;letter-spacing:.04em;color:#6B7280;text-shadow:0 1px 0 #fff,0 0 2px rgba(255,255,255,.9);pointer-events:none;user-select:none;opacity:.9;z-index:99;font-variant-numeric:tabular-nums}

.hdr{background:var(--hdr);color:#fff;padding:18px 16px 16px;border-bottom:3px solid var(--teal)}
.hdr-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:12px}
.hdr-truck{font-size:13px;font-weight:600;opacity:.85}
.hdr-actions{display:flex;gap:6px}
.hdr-link{background:none;border:none;color:#fff;font-size:18px;cursor:pointer;padding:4px;opacity:.85;text-decoration:none;line-height:1}
.hdr-link:active{opacity:1}

.settings-list{display:flex;flex-direction:column;gap:8px}
.settings-item{display:flex;align-items:center;gap:12px;padding:14px 12px;background:#fff;border:2px solid var(--line);border-radius:12px;cursor:pointer;font-family:inherit;text-align:left;width:100%;text-decoration:none;color:var(--ink)}
.settings-item:active{background:#f0f0f0}
.settings-item--static{cursor:default}
.settings-item--static:active{background:#fff}
.settings-ico{font-size:24px;line-height:1}
.settings-text{display:flex;flex-direction:column;gap:2px}
.settings-text b{font-size:15px;font-weight:700}
.settings-text small{font-size:12px;color:var(--muted)}
.hdr-net{font-size:12px;font-weight:800;letter-spacing:.04em;color:#7EE2A8}
.hdr-net.is-off{color:#FFB703}
.hdr-metrics{display:grid;gap:10px}
.m-trip{display:flex;align-items:baseline;gap:12px;padding:10px 12px;background:rgba(255,255,255,.08);border-radius:12px;border:1px solid rgba(255,255,255,.12)}
.m-trip .m-value{font-size:36px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1}
.m-trip .m-label{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;opacity:.75}
.m-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.m-block{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:10px 8px;display:flex;flex-direction:column;gap:4px;min-width:0}
.m-block .m-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;opacity:.7}
.m-block .m-value{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.1;white-space:nowrap}
.hdr-route{margin-top:12px;font-size:15px;font-weight:600}



.offline-strip{margin:8px 12px 0;padding:10px 12px;background:#FFF3CD;color:var(--ink);font-size:13px;font-weight:700;border:2px solid var(--warn);border-radius:10px;text-align:center}

/* push-driven trip status (not interactive) */
.push-status{margin:12px 12px 4px;padding:12px;background:#fff;border-radius:14px;border:2px solid var(--done)}
.push-badge{font-size:11px;font-weight:800;letter-spacing:.05em;color:var(--done);background:#E8F5E9;display:inline-block;padding:3px 8px;border-radius:999px;margin-bottom:8px}
.push-title{font-size:20px;font-weight:800;color:var(--ink);line-height:1.2;pointer-events:none;user-select:none}
.push-addr{font-size:13px;color:var(--muted);margin-top:4px}
.map-wrap{margin-top:10px}
.map-preview{display:block;border-radius:10px;overflow:hidden;border:2px solid var(--line);line-height:0}
.map-preview img{width:100%;height:auto;display:block;min-height:120px;background:#e8eaed}
.nav-btn{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;margin-top:8px;border:2px solid var(--next);background:var(--next);color:#fff;font-size:16px;font-weight:800;border-radius:12px;cursor:pointer;font-family:inherit;text-decoration:none;text-align:center}
.nav-btn:active{background:var(--teal);border-color:var(--teal)}
.map-wrap.collapsed{display:none}

.steps{flex:1;padding:12px;display:flex;flex-direction:column;gap:10px}
.step{display:grid;grid-template-columns:36px 1fr;gap:10px;background:#fff;border-radius:14px;padding:12px;border:1px solid var(--line)}
.step.done{border-color:var(--done);background:#F1F8F2}
.step.done h3{color:var(--done)}
.step.next{border:2px solid var(--next);box-shadow:0 0 0 3px rgba(11,95,255,.18);background:#F5F9FF}
.step.next h3{color:var(--ink);font-size:18px;font-weight:800}
.next-tag{display:inline-block;margin:4px 0;padding:2px 8px;border-radius:999px;background:var(--next);color:#fff!important;font-size:11px!important;font-weight:800!important;letter-spacing:.05em}
.step.future{border:1px dashed var(--future);background:#FBFBFC;opacity:.88}
.step.future h3{color:var(--muted);font-size:16px;font-weight:700}
.step.future p{color:var(--future)}
.step-rail{display:flex;justify-content:center;padding-top:2px}
.step-dot{width:28px;height:28px;border-radius:50%;border:2px solid var(--future);color:var(--future);font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center;position:relative;background:#fff}
.step-dot.done{background:var(--done);border-color:var(--done);color:#fff}
.step-dot.next{background:var(--next);border-color:var(--next);color:#fff}
.step-body h3{font-size:16px;font-weight:700;line-height:1.25;margin-bottom:2px}
.step-body p{font-size:13px;color:var(--muted)}

.pulse{position:absolute;inset:-4px;border-radius:50%;border:2px solid var(--next);animation:breath 1.8s ease-in-out infinite;pointer-events:none}
.pulse-dot{width:10px;height:10px;border-radius:50%;background:var(--next);display:inline-block;margin-right:8px;flex-shrink:0;animation:breath 1.8s ease-in-out infinite}
@keyframes breath{0%{opacity:1}50%{opacity:.3}100%{opacity:1}}
@media (prefers-reduced-motion:reduce){.pulse,.pulse-dot{animation:none;opacity:1}}

.action-area{padding:10px 12px 14px;position:sticky;bottom:0;background:var(--bg)}
.test-push{width:100%;min-height:44px;margin-bottom:8px;border:2px solid var(--done);background:#E8F5E9;color:var(--done);font-size:14px;font-weight:800;border-radius:10px;cursor:pointer;font-family:inherit}
.test-push:active{background:var(--done);color:#fff}
#enablePush{border-color:var(--next);background:#E3F2FD;color:var(--next)}
#enablePush:active{background:var(--next);color:#fff}
.swipe{position:relative;height:var(--cta);border-radius:16px;background:var(--hdr);overflow:hidden;user-select:none;touch-action:none;border:2px solid var(--hdr);cursor:grab}
.swipe-fill{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,var(--teal),var(--next));border-radius:14px;pointer-events:none}
.swipe-hint{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px;font-weight:800;pointer-events:none;padding-left:28px}
.swipe-thumb{position:absolute;top:4px;left:4px;width:56px;height:56px;border-radius:12px;background:var(--next);color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.swipe.is-done .swipe-thumb{background:var(--done)}
.swipe-fallback{margin-top:10px;text-align:center;font-size:13px;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:8px}
.hold-btn{min-height:var(--tap);min-width:160px;border:2px solid var(--ink);background:#fff;color:var(--ink);border-radius:12px;font-family:inherit;font-size:15px;font-weight:800;cursor:pointer}
.hold-btn.is-holding{background:var(--next);color:#fff;border-color:var(--next)}

.toast{position:fixed;left:50%;bottom:calc(140px + var(--safe));transform:translateX(-50%);background:var(--ink);color:#fff;padding:12px 18px;border-radius:12px;font-size:14px;font-weight:700;z-index:50;max-width:90vw;text-align:center}
.sheet-backdrop{position:fixed;inset:0;background:rgba(10,10,20,.55);z-index:60;display:flex;align-items:flex-end;justify-content:center}
.sheet-backdrop[hidden]{display:none}
.sheet{width:100%;max-width:480px;background:#fff;border-radius:18px 18px 0 0;padding:20px 16px calc(20px + var(--safe));color:var(--ink)}
.sheet h2{font-size:18px;font-weight:800;margin-bottom:8px}
.sheet p{font-size:15px;color:var(--muted);margin-bottom:16px}
.sheet-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.btn-ghost,.btn-solid{min-height:var(--tap);border-radius:12px;font-family:inherit;font-size:15px;font-weight:800;cursor:pointer;border:2px solid var(--ink)}
.btn-ghost{background:#fff;color:var(--ink)}
.btn-solid{background:var(--teal);border-color:var(--teal);color:#fff}

/* status picker (appears after Бетон сдан) */
.pick{padding:0 12px 12px}
.pick-title{font-size:15px;font-weight:800;color:var(--ink);margin-bottom:10px}
.pick-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
.pick-card{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px 8px;gap:6px;border-radius:14px;border:2px solid var(--line);background:#fff;cursor:pointer;min-height:100px;font-family:inherit}
.pick-card:active{transform:scale(.97)}
.pick-ico{font-size:26px;line-height:1}
.pick-label{font-size:15px;font-weight:800;color:var(--ink)}
.pick-sub{font-size:11px;color:var(--muted);text-align:center;line-height:1.3}
.pick-card.queue{border-color:var(--next)}.pick-card.queue.sel{background:#E3F2FD;border-color:var(--next);box-shadow:0 0 0 3px rgba(11,95,255,.22)}
.pick-card.rest{border-color:var(--warn)}.pick-card.rest.sel{background:#FFF3CD;border-color:var(--warn);box-shadow:0 0 0 3px rgba(138,90,0,.22)}
.pick-card.repair{border-color:var(--danger)}.pick-card.repair.sel{background:#FFEBEE;border-color:var(--danger);box-shadow:0 0 0 3px rgba(176,0,32,.22)}

@media (min-width:481px){.app{box-shadow:0 0 0 1px var(--line)}.sheet{border-radius:18px;margin-bottom:40px}.sheet-backdrop{align-items:center}}
@media (max-width:359px){.m-trip .m-value{font-size:30px}.m-block .m-value{font-size:18px}.pick-card{padding:12px 4px;min-height:80px}}