/* lagebild.at – bewusst schlicht (Platzhalter) */
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{display:flex;flex-direction:column;background:#0b0d10;color:#e8ebef;font:16px/1.6 "Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif}
main{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:40px 20px}
h1{font-size:clamp(40px,7vw,72px);font-weight:600;letter-spacing:-.02em;margin:0}
main p{color:#8a929c;font-size:18px;margin:12px 0 0}
footer{text-align:center;padding:24px;font-size:13px;color:#6b737d}
a{color:inherit}

/* Impressum / Datenschutz */
.recht{display:block;text-align:left;max-width:760px;margin:0 auto;padding:56px 20px 64px}
.recht h1{font-size:40px;margin-bottom:8px}
.recht h2{font-size:20px;font-weight:600;margin:36px 0 8px;padding-top:18px;border-top:1px solid #20252c}
.recht p,.recht li,.recht dd{color:#b4bac2;font-size:15.5px}
.recht .mut{color:#8a929c;font-size:14px}
.recht a{color:#e8ebef}
.recht dl{display:grid;grid-template-columns:minmax(150px,220px) 1fr;gap:6px 24px;margin:0}
.recht dt{font-size:13px;color:#8a929c;line-height:2.2}
.recht dd{margin:0}
.zurueck{display:inline-block;margin-bottom:32px;font-size:14px;color:#8a929c;text-decoration:none}
@media(max-width:560px){.recht dl{grid-template-columns:1fr}}

/* Startseite: dieselbe animierte Lagekarte wie auf situs.lagebild.at (Abschnitt aus webseite/design.css, Zeilen 154–224) */
:root{--mono:Consolas,"Cascadia Mono",monospace}
body.start{position:relative;overflow-x:hidden;background:radial-gradient(ellipse 80% 65% at 50% 0%,#233b5140,transparent 80%),linear-gradient(180deg,#101a26,#080e16) fixed}
.buehne{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}
body.start main,body.start footer{position:relative;z-index:1}
body.start h1{text-shadow:0 4px 30px rgba(0,0,0,.6)}
body.start main p{color:#aeb6c0}
.operational-map{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;background:none center/100% 100% no-repeat;opacity:.65;mask-image:linear-gradient(90deg,#000 0%,#000 20%,#0002 38%,#0002 62%,#000 80%,#000 100%)}
.map-tracks{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#8cb9da;stroke-width:1;stroke-dasharray:4 7;opacity:.25}.map-tracks circle{fill:#9dbed4;stroke:none}
.map-unit{position:absolute;color:#b4d1e5;display:flex;align-items:center;gap:8px;padding:6px 8px;background:#122331b3;border:1px solid #9fbed93d;border-radius:3px;box-shadow:0 0 18px #8fb7d209}.map-unit svg{width:24px;height:22px;stroke:currentColor;stroke-width:1.4;fill:none;stroke-linecap:round;stroke-linejoin:round}.map-unit span{font:8px var(--mono);letter-spacing:.08em;white-space:nowrap}.unit-one{animation:rtw-one 34s linear infinite alternate}.unit-two{animation:rtw-two 42s linear infinite alternate;color:#aabfca}.helicopter{animation:heli-route 48s ease-in-out infinite alternate}.helicopter svg{width:28px}
@keyframes rtw-one{0%{left:7.5%;top:25.5%}65%{left:27%;top:25.5%}100%{left:31.5%;top:25.5%}}
@keyframes rtw-two{0%{left:81.9%;top:75%}70%{left:81.9%;top:26.5%}100%{left:69%;top:26.5%}}
@keyframes heli-route{from{left:12%;top:66%}to{left:28%;top:48%}}
.map-point{position:absolute;width:6px;height:6px;border-radius:50%;background:#a7c9df;box-shadow:0 0 0 5px #a7c9df12}.point-one{left:18.75%;top:75%;animation:map-beacon 4s ease-out infinite}.point-two{left:81.9%;top:26.5%;animation:map-beacon 4s 2s ease-out infinite}
@keyframes map-beacon{0%,100%{box-shadow:0 0 0 3px #a7c9df18}70%{box-shadow:0 0 0 14px #a7c9df00}}
.map-demo{position:absolute;bottom:65px;right:64px;font:8px var(--mono);letter-spacing:.06em;color:#7891a6;z-index:1}
@media(max-width:560px){.map-unit span{display:none}.map-unit{padding:4px}.map-unit svg{width:18px;height:18px}.operational-map{opacity:.42}.map-demo{right:24px;bottom:62px;font-size:7px}}
@media(prefers-reduced-motion:reduce){.map-unit,.map-point{animation:none}.unit-one{left:12%;top:25.5%}.unit-two{left:81.9%;top:55%}.helicopter{left:18%;top:66%}}
/* Terrain and settlements remain readable around the quiet central title. */
.operational-map{background-image:none;opacity:.64;mask-image:linear-gradient(90deg,#000 0%,#000 24%,#0002 40%,#0002 60%,#000 76%,#000 100%)}
.map-tracks{display:none}
@keyframes rtw-one{0%{left:5%;top:49%}50%{left:18%;top:48%}100%{left:26%;top:51%}}
@keyframes rtw-two{0%{left:68%;top:76%}50%{left:67%;top:64%}100%{left:69%;top:42%}}
.point-one{left:27%;top:47%}.point-two{left:72%;top:47%}
@media(max-width:560px){.operational-map{opacity:.5;background-size:auto 100%}}
/* Intermittent simulated updates, rather than a constant stream of effects. */
.operational-map{opacity:.5}
.map-event{position:absolute;display:flex;gap:10px;align-items:flex-start;max-width:180px;padding:10px 12px;background:#12202de8;border:1px solid #b8ccdc25;border-radius:3px;color:#c0d1df;font:9px/1.5 var(--mono);opacity:0;pointer-events:none;animation:map-update 24s ease-in-out infinite}
.map-event i{width:4px;height:4px;border-radius:50%;background:#a7c9be;margin-top:4px;box-shadow:0 0 0 3px #a7c9be12}.map-event small{display:block;color:#8ca3b7;font:9px/1.6 "Segoe UI",sans-serif;margin-top:3px}
.event-position{left:12%;top:39%;animation-delay:1s}.event-status{left:16%;top:69%;animation-delay:9s}.event-report{right:10%;top:34%;animation-delay:17s}
@keyframes map-update{0%,2%{opacity:0;transform:translateY(5px)}5%,19%{opacity:1;transform:translateY(0)}23%,100%{opacity:0;transform:translateY(-3px)}}
.map-point{animation-duration:7s}.map-unit{background:#12233180;border-color:#9fbed92b}.map-demo{color:#91a7b9}
@media(max-width:560px){.operational-map{opacity:.42}.map-event{padding:7px 8px;max-width:130px;font-size:7px;gap:7px}.map-event small{font-size:8px}.event-position{left:3%;top:27%}.event-status{left:4%;top:74%}.event-report{right:3%;top:66%}}
@media(prefers-reduced-motion:reduce){.map-event{animation:none;display:none}}
/* Asymmetric terrain, incidental updates and a softer overall presence. */
.operational-map{opacity:.29;mask-image:linear-gradient(90deg,#000 0%,#000 18%,#0001 43%,#0002 65%,#000 90%)}
.map-unit{border-color:#9fbed91c;background:#12233145;box-shadow:none;color:#a4bccc}.map-unit svg{stroke-width:1.2}
.map-event{padding:7px 9px;border-color:#b8ccdc1c;background:#12202d99;font-size:8px;animation-duration:36s;color:#b1c5d4;box-shadow:none}.map-event small{font-size:8px;color:#91a8b9}.map-event i{box-shadow:none;width:3px;height:3px}
.event-position{left:9%;top:33%;animation-delay:0s}.event-status{left:21%;top:74%;animation-delay:6s}.event-report{right:8%;top:28%;animation-delay:12s}.event-four{right:14%;top:68%;animation-delay:18s}.event-five{left:7%;top:57%;animation-delay:24s}.event-six{right:6%;top:49%;animation-delay:30s}
@keyframes map-update{0%,2%{opacity:0;transform:translateY(3px)}4%,12%{opacity:1;transform:translateY(0)}15%,100%{opacity:0;transform:translateY(-2px)}}
.map-point{width:4px;height:4px;opacity:.7;animation:none;box-shadow:0 0 0 3px #a7c9df0a}
@media(max-width:560px){.operational-map{opacity:.23}.map-event{font-size:7px;padding:6px;max-width:110px}.map-event small{font-size:7px}.event-position{left:4%;top:22%}.event-status{left:5%;top:78%}.event-report{right:4%;top:28%}.event-four{right:4%;top:73%}.event-five{left:3%;top:62%}.event-six{right:3%;top:43%}}
@media(prefers-reduced-motion:reduce){.map-event{animation:none;display:none}}
/* Real geography replaces the hand-drawn map. Tiles are browser-cached. */
.operational-map{background:none;opacity:.3;mask-image:linear-gradient(90deg,#000,#000 20%,#0002 43%,#0002 62%,#000 85%)}
.real-map-tiles{position:absolute;left:50%;top:50%;width:max(100%,133.333svh);height:auto;aspect-ratio:4/3;transform:translate(-50%,-50%);display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(3,1fr);filter:grayscale(1) invert(1) sepia(.25) saturate(.7) hue-rotate(160deg) brightness(.8)}
.real-map-tiles img{width:100%;height:100%;max-width:none;display:block}
.map-demo{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px 14px;max-width:75%;font:8px/1.6 var(--mono);color:#9cafc0}.map-demo a{text-decoration:underline;text-underline-offset:2px}
@media(max-width:560px){.operational-map{opacity:.24}.map-demo{font-size:7px;max-width:85%}}

/* Abstract cartographic structure, fully local and without place labels. */
.operational-map{background:url('bilder/karte-abstrakt.svg?v=4') center/cover no-repeat;opacity:.34;mask-image:linear-gradient(90deg,#000,#000 22%,#0001 42%,#0001 62%,#000 83%);}
@media(max-width:560px){.operational-map{background-size:auto 100%;opacity:.26}}
/* Additional incident resources and staggered simulated reports. */
.fire-unit{animation:fire-route 49s ease-in-out infinite alternate;color:#c5afb1}.police-unit{animation:police-route 55s ease-in-out infinite alternate;color:#a6bddb}.drone-unit{animation:drone-route 62s ease-in-out infinite alternate;color:#b9c8bd}
@keyframes fire-route{from{left:10%;top:73%}to{left:25%;top:65%}}
@keyframes police-route{from{left:82%;top:18%}to{left:73%;top:29%}}
@keyframes drone-route{0%{left:76%;top:73%}50%{left:85%;top:59%}100%{left:79%;top:44%}}
.map-event{animation-duration:40s}.event-position{animation-delay:0s}.event-status{animation-delay:4s}.event-report{animation-delay:8s}.event-four{animation-delay:12s}.event-five{animation-delay:16s}.event-six{animation-delay:20s}
.event-seven{left:12%;top:81%;animation-delay:24s}.event-eight{right:9%;top:22%;animation-delay:28s}.event-nine{right:7%;top:76%;animation-delay:32s}.event-ten{left:6%;top:44%;animation-delay:36s}
@keyframes map-update{0%,1%{opacity:0;transform:translateY(3px)}3%,9%{opacity:1;transform:translateY(0)}12%,100%{opacity:0;transform:translateY(-2px)}}
@media(max-width:560px){.event-seven{left:3%;top:82%}.event-eight{right:3%;top:19%}.event-nine{right:3%;top:79%}.event-ten{left:3%;top:38%}}
@media(prefers-reduced-motion:reduce){.fire-unit,.police-unit,.drone-unit{animation:none}.fire-unit{left:12%;top:73%}.police-unit{left:82%;top:18%}.drone-unit{left:79%;top:70%}.map-event{animation:none;display:none}}

/* Random scheduling is controlled by JS, not repeating CSS sequences. */
.map-event{animation:none;opacity:0;transform:translateY(3px);transition:opacity .7s ease,transform .7s ease;max-width:145px}
.map-event.is-visible{opacity:1;transform:translateY(0)}
@media(max-width:560px){.map-event{max-width:100px}}
@media(prefers-reduced-motion:reduce){.map-event{display:none;transition:none}}
/* Discreet simulated incident, with a slow alert radius. */
.map-incident{position:absolute;left:17%;top:44%;display:flex;align-items:center;gap:8px;color:#d9a17a}
.map-incident>svg{position:relative;width:16px;height:19px;fill:#d39a6b;fill-opacity:.65;stroke:#e8b58d;stroke-width:.7;filter:drop-shadow(0 0 6px #d17c4526)}
.incident-label{font:8px/1.6 var(--mono);letter-spacing:.07em;color:#c7a58a}
.incident-ring{position:absolute;left:8px;top:9px;width:34px;height:34px;border:1px solid #d39a6b55;border-radius:50%;transform:translate(-50%,-50%);animation:incident-pulse 5s ease-out infinite;pointer-events:none}
@keyframes incident-pulse{0%{transform:translate(-50%,-50%) scale(.55);opacity:.7}85%,100%{transform:translate(-50%,-50%) scale(1.8);opacity:0}}
@media(max-width:560px){.map-incident{left:9%;top:34%}.incident-label{font-size:6px}.map-incident>svg{width:13px;height:16px}}
@media(prefers-reduced-motion:reduce){.incident-ring{animation:none;opacity:.3}}

/* Knopf und Fenster „Testcode“ */
.knopf{display:inline-flex;align-items:center;justify-content:center;gap:10px;margin-top:34px;padding:14px 24px;border:1px solid #b2d4f3;border-radius:3px;
  background:#b2d4f3;color:#0b1520;font:600 14px/1.4 "Segoe UI",system-ui,sans-serif;cursor:pointer;transition:background .2s}
.knopf:hover{background:#cfe4f7}
.testdlg{width:min(520px,calc(100vw - 32px));max-height:calc(100vh - 32px);padding:34px;border:1px solid #b7cce033;border-radius:4px;
  background:#0d1620;color:#e8ebef;box-shadow:0 30px 90px #000a}
.testdlg::backdrop{background:rgba(3,8,14,.72);backdrop-filter:blur(6px)}
.testdlg[open]{animation:dlgein .25s ease}
@keyframes dlgein{from{opacity:0;transform:translateY(12px)}}
.testdlg h2{font-size:30px;font-weight:450;letter-spacing:-.03em;margin:8px 0 10px}
.testdlg .tag{font:10px/1.5 var(--mono);letter-spacing:.15em;text-transform:uppercase;color:#b2d4f3}
.testdlg p{color:#a2b4c4;font-size:15px;line-height:1.7;margin:0}
.dlgzu{position:absolute;top:14px;right:14px;width:36px;height:36px;border:1px solid #b7cce033;border-radius:50%;background:none;color:#e8ebef;font-size:16px;cursor:pointer}
.codeform{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.codeform input{flex:1 1 180px;min-width:0;padding:13px;background:#09101677;border:1px solid #ffffff25;border-radius:5px;color:#e8ebef;font:28px var(--mono);letter-spacing:.16em;text-align:center}
.codeform .knopf{margin:0}
.meldung{margin-top:12px;min-height:24px;font-size:14px}.meldung.fehler{color:#ffb0a5}.meldung.ok{color:#b2d4f3}
.testdlg .dlghinweis{font-size:12.5px;color:#7f97ad;margin-top:16px}
@media(max-width:480px){.testdlg{padding:26px 20px}.testdlg h2{font-size:26px}.codeform .knopf{flex:1 1 100%}}