:root{font-family:"Segoe UI",system-ui,Arial,sans-serif;font-synthesis:none;color:#101820;background:#000}
*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0}
body{overflow:hidden}
[hidden]{display:none!important}
/* Registrierung: bisher bestätigtes Layout, mit mittigem Inhalt und Footer unten */
.auth-screen{min-height:100dvh;display:grid;grid-template-rows:1fr auto 1fr;align-items:center;justify-items:center;padding:26px 22px 22px;color:#fff;text-align:center;background:radial-gradient(circle at top,#20334c,#101925 70%)}
.auth-center{align-self:center;width:min(100%,980px)}
.auth-logo{width:110px;max-width:22vw;height:auto;display:block;margin:0 auto 26px;filter:drop-shadow(0 8px 24px rgba(0,0,0,.28))}
.auth-center h1{font-size:clamp(2.4rem,4vw,3.5rem);font-weight:600;letter-spacing:.02em;margin:0 0 20px}
.auth-center h2{font-size:clamp(1.5rem,2.8vw,2.25rem);font-weight:500;margin:20px 0}
.auth-center p{font-size:clamp(1.05rem,1.7vw,1.45rem);color:#c9d5e6;line-height:1.5}
.registration-code{font-family:Consolas,"Courier New",monospace;font-size:clamp(1.35rem,3.15vw,2.9rem);font-variant-numeric:tabular-nums;letter-spacing:.08em;overflow-wrap:anywhere;padding:28px 22px;margin:26px auto;border:1px solid #526984;border-radius:15px;background:#223348;max-width:920px}
.auth-notice{min-height:1.5em;color:#c5d2e1!important}
.auth-footer{grid-row:3;align-self:end;justify-self:center;font-size:clamp(.92rem,1.1vw,1.05rem);color:#aebfd3;line-height:1.6}
/* Uhrzeit im Ruhezustand - unverändert vollflächig schwarz */
#alarm-screen{width:100vw;height:100dvh}
.idle-screen{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#fff;background:#000}
.idle-center{text-align:center;width:min(92%,1500px)}
.idle-time{font-size:clamp(5.5rem,10.6vw,13rem);font-weight:740;font-variant-numeric:tabular-nums;letter-spacing:.018em;line-height:1.08;white-space:nowrap}
.idle-rule{width:82%;height:2px;background:#fff;margin:24px auto}
.idle-date{font-size:clamp(1.8rem,3.15vw,3.5rem);font-weight:400;line-height:1.2}
/* Aktuelle Alarmierung */
.incident-screen{width:100%;height:100%;background:#f8fafc;color:#111b28;display:flex;flex-direction:column;overflow:hidden}
.incident-main{padding:clamp(22px,3vw,58px) clamp(24px,3.8vw,78px);min-height:0;overflow:auto}
.incident-heading{display:flex;align-items:flex-start;gap:clamp(20px,2.7vw,54px)}
.level{background:#e5b91e;color:#151b1f;border-radius:22px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;font-weight:850;box-shadow:0 8px 30px rgba(0,0,0,.12)}
.level.level-T{background:#3d79b4;color:#fff}.level.level-B{background:#b92530;color:#fff}.level.level-S{background:#f2d04b;color:#101820}.level.level-D{background:#70a35b;color:#fff}
.incident-heading-copy{flex:1;min-width:0}
.incident-title{line-height:1.08;font-weight:850;overflow-wrap:break-word;margin:0}
.incident-rule{height:3px;margin-top:clamp(12px,1.5vw,26px);background:#a4b1bd;width:100%}
.incident-information{overflow-wrap:anywhere}
.incident-information p{margin:0}
.incident-address{font-weight:740;color:#111b28}
.incident-comment{font-weight:650;color:#24374b;white-space:pre-line}
.incident-object{color:#34485d;white-space:pre-line}
.incident-time{color:#526277;font-variant-numeric:tabular-nums}
/* Default: BASIC. Die gesamte Bildschirmfläche gehört den Einsatzdaten. */
body:not(.is-detail) .incident-main{height:100%;display:flex;flex-direction:column;justify-content:center;padding:clamp(28px,4vw,80px) clamp(32px,5vw,100px)}
body:not(.is-detail) .incident-heading{flex-direction:column;gap:clamp(24px,2.9vh,44px)}
body:not(.is-detail) .level{width:clamp(160px,13vw,280px);height:clamp(145px,17vh,205px);font-size:clamp(5rem,8.5vw,9rem)}
body:not(.is-detail) .incident-title{font-size:clamp(3.4rem,5.5vw,7rem)}
body:not(.is-detail) .incident-information{padding-top:clamp(14px,2.5vh,40px)}
body:not(.is-detail) .incident-address{font-size:clamp(2.3rem,3.15vw,4.2rem);margin-bottom:clamp(10px,1.8vh,22px)}
body:not(.is-detail) .incident-comment{font-size:clamp(1.6rem,2.3vw,3.2rem);margin-bottom:clamp(9px,1.5vh,20px)}
body:not(.is-detail) .incident-object{font-size:clamp(1.5rem,1.9vw,2.6rem);margin-bottom:clamp(12px,2vh,26px)}
body:not(.is-detail) .incident-time{font-size:clamp(1.2rem,1.4vw,1.7rem);font-weight:500}
/* Nur bei ?detail=1: Einsatzinformationen oben, Karte und Disposition unten */
body.is-detail .incident-main{padding:clamp(15px,1.55vw,27px) clamp(16px,2vw,38px) clamp(8px,1vw,16px);flex:0 0 auto;max-height:49%;overflow:auto}
body.is-detail .incident-heading{gap:clamp(12px,1.3vw,22px)}
body.is-detail .level{min-width:clamp(70px,6vw,100px);height:clamp(62px,7vh,85px);font-size:clamp(2.3rem,3.1vw,4.2rem);padding:0 12px;border-radius:12px}
body.is-detail .incident-title{font-size:clamp(2.1rem,3.15vw,4.2rem)}
body.is-detail .incident-rule{margin-top:9px;height:2px}
body.is-detail .incident-information{padding:10px 0 0 calc(clamp(70px,6vw,100px) + clamp(12px,1.3vw,22px))}
body.is-detail .incident-address{font-size:clamp(1.3rem,1.6vw,2.3rem);margin-bottom:3px}
body.is-detail .incident-comment{font-size:clamp(1.18rem,1.36vw,2rem);margin-bottom:4px}
body.is-detail .incident-object{font-size:clamp(1rem,1.15vw,1.65rem);margin-bottom:5px}
body.is-detail .incident-time{font-size:clamp(.82rem,.95vw,1.25rem)}
.detail-panels{display:grid;grid-template-columns:minmax(0,2fr) minmax(330px,1fr);gap:clamp(10px,1.2vw,20px);padding:0 clamp(16px,2vw,38px) clamp(15px,2vw,34px);flex:1;min-height:0}
.panel{min-width:0;min-height:0;overflow:hidden;background:#fff;border:1px solid #d2dbe4;border-radius:16px;box-shadow:0 1px 6px rgba(16,34,51,.05);display:flex;flex-direction:column}
.panel-title{font-weight:750;color:#21364b;margin:0;font-size:clamp(1rem,1.2vw,1.4rem);padding:11px 16px;border-bottom:1px solid #e2e8ee;background:#fff}
.map-viewport{position:relative;flex:1;min-height:100px;background:#e5edf1}
#map.leaflet-container{background:#e5edf1}
.map-message{position:absolute;z-index:400;left:50%;top:50%;transform:translate(-50%,-50%);font-size:1.05rem;max-width:80%;text-align:center;background:#fff;padding:12px 18px;border-radius:10px;box-shadow:0 2px 8px #0002;color:#34475a}
.route-status{padding:5px 12px;min-height:27px;color:#566b7e;font-size:.82rem}
.disposition-list{padding:12px;overflow:auto;min-height:0;display:flex;flex-direction:column;gap:10px}
.dispo-card{border:1px solid #d8e0e7;border-left:7px solid #d3b040;background:#fff;border-radius:11px;padding:12px 12px;box-shadow:0 1px 4px #1e33430b}
.dispo-card.state-AG{border-left-color:#a62d36;background:#fff8f8}
.dispo-card.state-EG{border-left-color:#639453;background:#f8fdf5}
.dispo-header{display:flex;gap:10px;align-items:flex-start;justify-content:space-between}
.dispo-name{font-size:clamp(1rem,1.15vw,1.4rem);font-weight:750;min-width:0;overflow-wrap:anywhere}
.dispo-status{font-size:.9rem;font-weight:700;white-space:nowrap;color:#3e5264}
.dispo-times{font-size:clamp(.79rem,.87vw,1rem);color:#425467;display:flex;flex-wrap:wrap;gap:3px 13px;margin-top:5px}
.dispo-times strong{color:#1f3447}
.dispo-divider{height:1px;background:#b2c0cb;margin:6px 0}
.panel-empty{margin:16px 0;text-align:center;color:#66788a;font-weight:600}
.connection-warning{position:fixed;z-index:900;right:18px;bottom:18px;border-radius:10px;padding:10px 16px;color:#fff;background:#9e2a34;font-size:clamp(.88rem,1.05vw,1.2rem);box-shadow:0 4px 16px #0002;max-width:calc(100vw - 36px)}
@media(max-width:1000px){.detail-panels{grid-template-columns:1.35fr 1fr}.panel-title{padding:8px 10px}.disposition-list{padding:8px}}
@media(max-width:700px){body.is-detail .incident-main{max-height:40%}.detail-panels{grid-template-columns:1fr;grid-template-rows:1.1fr 1fr;gap:8px}.incident-heading{gap:12px}.incident-main{padding:18px}.level{border-radius:12px}body:not(.is-detail) .incident-title{font-size:clamp(2rem,7vw,4rem)}body:not(.is-detail) .incident-address{font-size:clamp(1.4rem,4vw,2.8rem)}.idle-time{font-size:clamp(3rem,11vw,6rem)}}
@media(max-height:650px){body:not(.is-detail) .incident-main{padding-top:20px;padding-bottom:20px}body:not(.is-detail) .level{height:100px;font-size:4.5rem}body:not(.is-detail) .incident-heading{gap:12px}body:not(.is-detail) .incident-information{padding-top:8px}body.is-detail .incident-main{max-height:45%}}
