:root{--navy:#0A192F;--navy-2:#112240;--navy-3:#1d4580;--yellow:#FFD600;--red:#E53935;--red-2:#C62828;--green:#0f9d58;--amber:#e6a800;--grey:#6b7685;--paper:#eef2f7;--line:#dfe4ec}
body{font-family:"Work Sans",system-ui,sans-serif;background:var(--paper);color:#0d1726}
h1,h2,h3,.bebas,.brand{font-family:"Bebas Neue",Impact,sans-serif;letter-spacing:.03em;font-weight:400}
.text-yellow{color:var(--yellow)}
.hazard{height:10px;background:repeating-linear-gradient(-45deg,var(--red) 0 14px,#fff 14px 28px)}
.hazard-y{height:6px;background:repeating-linear-gradient(-45deg,var(--yellow) 0 12px,var(--navy) 12px 24px);animation:slide 3s linear infinite;background-size:200% 100%}
@keyframes slide{to{background-position:68px 0}}
:focus-visible{outline:3px solid var(--yellow)!important;outline-offset:2px}

/* Login */
body.login{min-height:100vh;background:radial-gradient(circle at 30% 20%,#1d4580,#0A192F 60%)}
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:1rem}
.login-card{background:#fff;border-radius:18px;overflow:hidden;width:min(460px,100%);box-shadow:0 30px 80px rgba(0,0,0,.5)}
.login-card h1{font-size:2.6rem;color:var(--navy);margin:0}
.login-logo{width:120px;height:120px;border-radius:50%;box-shadow:0 0 0 5px var(--yellow);animation:pulse 2.4s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 5px var(--yellow),0 0 0 22px rgba(229,57,53,0)}0%{box-shadow:0 0 0 5px var(--yellow),0 0 0 0 rgba(229,57,53,.5)}}
.btn-red{background:var(--red);color:#fff;font-family:"Bebas Neue";font-size:1.4rem;letter-spacing:.05em;border:0;border-radius:10px}
.btn-red:hover{background:var(--red-2);color:#fff}
.btn-navy{background:var(--navy);color:#fff;font-weight:700;border-radius:10px}
.btn-navy:hover{background:var(--navy-3);color:#fff}
.btn-wa,.bg-wa{background:#25d366;color:#fff;border:0;font-weight:800}
.btn-wa:hover{background:#1da851;color:#fff}

/* Topnav */
.topnav{position:sticky;top:0;z-index:1020;background:var(--navy);color:#fff;display:flex;justify-content:space-between;align-items:center;padding:.55rem 1rem;border-bottom:3px solid var(--yellow)}
.topnav .brand{font-size:1.6rem;line-height:.9}
.logo-mini{position:relative;width:46px;height:46px}
.logo-mini img{width:100%;height:100%;border-radius:50%;box-shadow:0 0 0 2px var(--yellow);position:relative;z-index:2}
.logo-mini::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:3px solid var(--red);animation:ring 2s infinite}
@keyframes ring{to{transform:scale(1.5);opacity:0}}
.clock{font-family:"Bebas Neue";font-size:1.6rem;color:var(--yellow);letter-spacing:.06em}
.btn-ghost{color:#fff;border:1px solid rgba(255,255,255,.3)}
.btn-ghost:hover{background:rgba(255,255,255,.1);color:#fff}
.btn-ghost.off{color:#ff8a8a}
.live-pill{font-size:.72rem;font-weight:800;letter-spacing:.12em;background:rgba(255,255,255,.1);padding:.25rem .6rem;border-radius:999px}
.live-pill .dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#3ee07f;margin-right:5px;animation:blink 1.2s infinite}
.live-pill.err .dot{background:var(--red)}
@keyframes blink{50%{opacity:.2}}

/* KPIs */
.kpi{position:relative;border-radius:14px;padding:.9rem 1rem;color:#fff;overflow:hidden;cursor:pointer;transition:transform .2s;min-height:96px}
.kpi:hover{transform:translateY(-3px)}
.kpi .kv{font-family:"Bebas Neue";font-size:2.8rem;line-height:1}
.kpi .kl{font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;opacity:.95}
.kpi i{position:absolute;right:10px;bottom:4px;font-size:2.6rem;opacity:.22}
.k-neu{background:var(--red)}.k-over{background:#7a0010}.k-tri{background:var(--amber);color:#1a1300}.k-ein{background:#1846a3}.k-wei{background:#5b2aa8}.k-heute{background:var(--navy)}
.k-over.alarm{animation:alarmBg 1s infinite}
@keyframes alarmBg{50%{background:var(--red);box-shadow:0 0 0 5px rgba(229,57,53,.35)}}

/* Tabs */
.tnr-tabs{border-bottom:3px solid var(--navy);flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden}
.tnr-tabs .nav-link{font-weight:800;text-transform:uppercase;font-size:.85rem;letter-spacing:.05em;color:var(--navy);border:0;white-space:nowrap}
.tnr-tabs .nav-link.active{background:var(--navy);color:var(--yellow)}
.btn-f{background:#fff;border:2px solid var(--line);font-weight:700;font-size:.85rem}
.btn-f.active{background:var(--navy);border-color:var(--navy);color:#fff}
.search-wrap{position:relative;min-width:240px}
.search-wrap i{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:#7d8899}
.search-wrap input{padding-left:34px;border:2px solid var(--line);border-radius:10px}

/* Report-Karten */
.rcard{background:#fff;border-radius:14px;box-shadow:0 6px 18px rgba(11,31,58,.08);border-left:8px solid var(--grey);overflow:hidden;height:100%;display:flex;flex-direction:column;cursor:pointer;transition:transform .15s,box-shadow .15s}
.rcard:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(11,31,58,.15)}
.rcard.p-rot{border-left-color:var(--red)}.rcard.p-gelb{border-left-color:var(--amber)}.rcard.p-gruen{border-left-color:var(--green)}.rcard.p-grau{border-left-color:var(--grey)}
.rcard.overdue{box-shadow:0 0 0 3px var(--red),0 10px 28px rgba(229,57,53,.3);animation:od 1.4s infinite}
@keyframes od{50%{box-shadow:0 0 0 6px rgba(229,57,53,.55),0 10px 28px rgba(229,57,53,.3)}}
.rcard.isnew{animation:flashIn 1.6s ease 2}
@keyframes flashIn{0%,100%{background:#fff}50%{background:#fff4c2}}
.od-banner{background:var(--red);color:#fff;font-weight:800;font-size:.78rem;letter-spacing:.06em;padding:.3rem .8rem;display:flex;justify-content:space-between}
.rc-body{padding:.85rem 1rem;display:flex;gap:.8rem;flex:1}
.rc-thumb{flex:0 0 78px;height:78px;border-radius:10px;background:#e8edf3 center/cover;display:grid;place-items:center;color:#8a97a8;font-size:1.6rem}
.rc-ticket{font-family:"Bebas Neue";font-size:1.35rem;color:var(--navy);letter-spacing:.03em;line-height:1}
.rc-meta{font-size:.82rem;color:#4b5667}
.rc-foot{display:flex;justify-content:space-between;align-items:center;gap:.5rem;padding:.55rem 1rem;border-top:1px solid var(--line);background:#fafbfd;font-size:.8rem}
.age{font-weight:800}
.age.warn{color:var(--amber)}.age.bad{color:var(--red)}
.pb{display:inline-block;font-weight:800;font-size:.7rem;letter-spacing:.06em;padding:.2rem .5rem;border-radius:6px;color:#fff}
.pb-rot{background:var(--red)}.pb-gelb{background:var(--amber);color:#1a1300}.pb-gruen{background:var(--green)}.pb-grau{background:var(--grey)}
.sb{display:inline-block;font-weight:800;font-size:.72rem;padding:.2rem .55rem;border-radius:999px}
.sb-neu{background:#fde2e2;color:#a3141c}.sb-triage{background:#fff3c4;color:#8a6300}.sb-einsatz{background:#dbe8ff;color:#1846a3}.sb-weitergeleitet{background:#ece1ff;color:#5b2aa8}.sb-erledigt{background:#d9f5e3;color:#11713a}
.empty{text-align:center;padding:3rem 1rem;color:#4b5667;font-weight:700}
.empty i{font-size:3rem;color:var(--green)}

/* Karte */
#opsMap{height:calc(100vh - 330px);min-height:440px;border-radius:14px;border:3px solid var(--navy)}
.lg{display:inline-block;width:14px;height:14px;border-radius:50%;margin-right:4px;vertical-align:-2px;border:2px solid #fff;box-shadow:0 0 0 1px #999}
.lg-rot{background:var(--red)}.lg-gelb{background:var(--amber)}.lg-gruen{background:var(--green)}.lg-grau{background:var(--grey)}.lg-over{background:#fff;box-shadow:0 0 0 3px var(--red)}
.mk{width:26px;height:26px;border-radius:50%;border:3px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.45)}
.mk.over{animation:mkp 1s infinite}
@keyframes mkp{50%{box-shadow:0 0 0 10px rgba(229,57,53,.35),0 2px 8px rgba(0,0,0,.45)}}

/* Panels / Kontakte */
.panel{background:#fff;border-radius:14px;padding:1.1rem;box-shadow:0 6px 18px rgba(11,31,58,.08)}
.panel h3,.panel-h{font-size:1.8rem;color:var(--navy)}
.contact-list{display:grid;gap:.5rem}
.contact{display:flex;align-items:center;gap:.8rem;padding:.7rem .8rem;border:1px solid var(--line);border-radius:12px}
.contact .av{flex:0 0 44px;height:44px;border-radius:50%;background:var(--navy);color:var(--yellow);display:grid;place-items:center;font-family:"Bebas Neue";font-size:1.4rem}
.contact .cat{display:inline-block;background:#fff3c4;color:#8a6300;font-weight:800;font-size:.7rem;padding:.1rem .5rem;border-radius:999px}
.wa-contacts{display:grid;gap:.4rem;max-height:240px;overflow:auto}
.wa-c{display:flex;align-items:center;gap:.6rem;padding:.55rem .7rem;border:2px solid var(--line);border-radius:10px;cursor:pointer;background:#fff;text-align:left;width:100%}
.wa-c.sel{border-color:#25d366;background:#eafbf1}
.wa-c .av{flex:0 0 36px;height:36px;border-radius:50%;background:#25d366;color:#fff;display:grid;place-items:center;font-weight:800}

/* Detail */
.d-head{background:var(--navy);color:#fff}
.d-head .tk{font-family:"Bebas Neue";font-size:2rem;letter-spacing:.04em;line-height:1}
.d-sec{font-weight:800;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:#7d8899;margin:1rem 0 .4rem}
.kv-list{display:grid;grid-template-columns:auto 1fr;gap:.25rem .9rem;font-size:.92rem}
.kv-list dt{color:#4b5667;font-weight:700}
.kv-list dd{margin:0}
.st-btns{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.4rem}
.st-btn{border:2px solid var(--line);background:#fff;border-radius:10px;padding:.6rem .4rem;font-weight:800;font-size:.8rem;text-transform:uppercase;line-height:1.15}
.st-btn i{display:block;font-size:1.3rem;margin-bottom:.15rem}
.st-btn.on{color:#fff}
.st-btn[data-s=triage].on{background:var(--amber);border-color:var(--amber);color:#1a1300}
.st-btn[data-s=einsatz].on{background:#1846a3;border-color:#1846a3}
.st-btn[data-s=weitergeleitet].on{background:#5b2aa8;border-color:#5b2aa8}
.st-btn[data-s=erledigt].on{background:var(--green);border-color:var(--green)}
.st-btn[data-s=neu].on{background:var(--red);border-color:var(--red)}
#dMap{height:220px;border-radius:12px;border:2px solid var(--line)}
.photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.5rem}
.photos a{display:block;aspect-ratio:1;border-radius:10px;overflow:hidden;border:2px solid var(--line)}
.photos img{width:100%;height:100%;object-fit:cover}
.timeline{list-style:none;padding:0;margin:0;border-left:3px solid var(--line);margin-left:.4rem}
.timeline li{position:relative;padding:0 0 .8rem 1rem;font-size:.88rem}
.timeline li::before{content:"";position:absolute;left:-8px;top:4px;width:13px;height:13px;border-radius:50%;background:var(--navy);border:2px solid #fff}
.timeline li.a-status::before{background:var(--amber)}.timeline li.a-whatsapp::before{background:#25d366}.timeline li.a-eingang::before{background:var(--red)}.timeline li.a-notiz::before{background:var(--navy-3)}
.timeline .tm{font-weight:800;color:#4b5667;font-size:.75rem}
.triage-timer{border-radius:12px;padding:.7rem .9rem;font-weight:800;display:flex;align-items:center;gap:.6rem}
.triage-timer.ok{background:#d9f5e3;color:#11713a}.triage-timer.warn{background:#fff3c4;color:#8a6300}.triage-timer.bad{background:var(--red);color:#fff;animation:alarmBg 1s infinite}
.stat-card{background:#fff;border-radius:14px;padding:1rem;box-shadow:0 6px 18px rgba(11,31,58,.08);text-align:center}
.stat-card .v{font-family:"Bebas Neue";font-size:2.6rem;color:var(--navy);line-height:1}
.stat-card .l{font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:#4b5667}

.btn-red-pdf{background:#E53935;color:#fff;font-weight:800;border:0}.btn-red-pdf:hover{background:#C62828;color:#fff}
.btn-yellow{background:#FFD600;color:#0A192F;font-weight:800;border:0}.btn-yellow:hover{background:#fff;color:#0A192F}
.proto .form-label{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:#4b5667;margin-bottom:.2rem}
.ev{position:relative}.ev a{display:block;aspect-ratio:1;border-radius:10px;overflow:hidden;border:2px solid #E53935}.ev img{width:100%;height:100%;object-fit:cover}
.ev small{display:block;font-size:.68rem;color:#4b5667;line-height:1.2;margin-top:2px}
.ev-del{position:absolute;top:5px;right:5px;width:28px;height:28px;border-radius:50%;border:0;background:rgba(10,25,47,.85);color:#fff;display:grid;place-items:center}
.timeline li.a-pdf::before{background:#E53935}.timeline li.a-beweis::before{background:#c2185b}.timeline li.a-protokoll::before{background:#1846a3}
