:root{
  --bg:#101418; --panel:#181d23; --line:#2a323b; --txt:#e9eef3; --dim:#93a1b0;
  --acker:#4d97ff; --gruen:#f2dd00; --brache:#b06cf5; --unbek:#c3ccd6;
  --ok:#3ddc97;
}
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;background:var(--bg);color:var(--txt);
  font:15px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  overscroll-behavior:none}
#map{position:fixed;inset:0;background:#0b0e11}

/* ---------- Freischaltung ---------- */
#gate{position:fixed;inset:0;z-index:2000;background:radial-gradient(120% 90% at 50% 0%,#1b2530,#0c0f13);
  display:flex;align-items:center;justify-content:center;padding:24px}
#gateBox{width:100%;max-width:330px;text-align:center}
.gate-logo{font-size:46px;line-height:1}
#gateBox h1{margin:.35em 0 .1em;font-size:26px;letter-spacing:-.02em}
.gate-sub{margin:0 0 28px;color:var(--dim);font-size:14px}
#gateBox label{display:block;text-align:left;font-size:12px;color:var(--dim);
  text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}
#code{width:100%;padding:14px;border-radius:12px;border:1px solid var(--line);
  background:#0d1116;color:var(--txt);font-size:20px;text-align:center;
  letter-spacing:.14em;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
#code:focus{outline:none;border-color:var(--acker)}
.chk{display:flex!important;align-items:center;gap:8px;margin:14px 0 18px;
  text-transform:none!important;letter-spacing:0!important;font-size:13px!important}
.chk input{width:16px;height:16px;accent-color:var(--acker)}
#gateBtn{width:100%;padding:14px;border:0;border-radius:12px;background:var(--acker);
  color:#fff;font-size:16px;font-weight:600}
#gateBtn:disabled{opacity:.55}
#gateMsg{min-height:20px;margin:14px 0 0;font-size:13px;color:#ff8080}
#gateMsg.warten{color:var(--dim)}

/* ---------- Bedienleiste ---------- */
#topbar{position:fixed;z-index:900;top:calc(env(safe-area-inset-top) + 10px);left:10px;right:10px;
  display:flex;gap:8px;align-items:center}
#spacer{flex:1}
.pill{width:42px;height:42px;flex:none;border:0;border-radius:12px;background:rgba(16,20,24,.86);
  color:var(--txt);font-size:18px;backdrop-filter:blur(8px);
  box-shadow:0 2px 10px rgba(0,0,0,.45)}
.pill.an{background:var(--acker);color:#fff}
#suche{flex:1;min-width:0;height:42px;padding:0 14px;border-radius:12px;border:0;
  background:rgba(16,20,24,.92);color:var(--txt);font-size:15px;backdrop-filter:blur(8px)}
#suche:focus{outline:1px solid var(--acker)}
#trefferliste{position:fixed;z-index:900;top:calc(env(safe-area-inset-top) + 60px);left:10px;right:10px;
  max-height:52vh;overflow:auto;background:rgba(16,20,24,.96);border-radius:12px;
  backdrop-filter:blur(8px);box-shadow:0 6px 24px rgba(0,0,0,.5)}
#trefferliste div{padding:11px 14px;border-bottom:1px solid var(--line);display:flex;gap:10px}
#trefferliste div:last-child{border:0}
#trefferliste b{font-weight:600}
#trefferliste span{margin-left:auto;color:var(--dim);font-size:13px;white-space:nowrap}

.fab{position:fixed;z-index:900;right:12px;bottom:calc(env(safe-area-inset-bottom) + 20px);
  width:50px;height:50px;border:0;border-radius:50%;background:rgba(16,20,24,.88);
  color:var(--txt);font-size:20px;box-shadow:0 3px 14px rgba(0,0,0,.5)}
.fab.an{background:var(--acker);color:#fff}

/* ---------- Menü ---------- */
#menu{position:fixed;z-index:950;top:calc(env(safe-area-inset-top) + 60px);right:10px;width:250px;
  background:rgba(20,25,31,.97);border-radius:14px;padding:14px 16px;
  box-shadow:0 8px 30px rgba(0,0,0,.55);backdrop-filter:blur(10px)}
#menu h3{margin:4px 0 8px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
#menu h3+label{margin-top:0}
#menu label{display:flex;align-items:center;gap:9px;padding:5px 0;font-size:14px}
#menu input{width:17px;height:17px;accent-color:var(--acker)}
.leg{display:flex;align-items:center;gap:9px;padding:3px 0;font-size:13px;color:var(--dim)}
.leg i{width:17px;height:13px;border-radius:3px;flex:none}
.l-acker{border:2px solid var(--acker);background:rgba(77,151,255,.18)}
.l-gruen{border:2px solid #f2dd00;background:rgba(242,221,0,.55)}
.l-brache{border:2px solid #b06cf5;background:rgba(176,108,245,.55)}
.l-unbek{border:2px dashed #c3ccd6;background:transparent}
.menu-foot{margin-top:12px;padding-top:10px;border-top:1px solid var(--line);
  font-size:11px;color:var(--dim);line-height:1.6}
.linkbtn{margin-top:8px;background:none;border:0;color:var(--acker);font-size:13px;padding:0}

/* ---------- Schlag-Infofenster ---------- */
#sheet{position:fixed;z-index:960;left:0;right:0;bottom:0;background:var(--panel);
  border-radius:18px 18px 0 0;padding:8px 18px calc(env(safe-area-inset-bottom) + 18px);
  box-shadow:0 -6px 30px rgba(0,0,0,.6);animation:auf .18s ease-out}
@keyframes auf{from{transform:translateY(100%)}to{transform:translateY(0)}}
#sheetGriff{width:38px;height:4px;border-radius:2px;background:var(--line);margin:2px auto 10px}
#sheetZu{position:absolute;top:10px;right:12px;width:32px;height:32px;border:0;border-radius:50%;
  background:#222a32;color:var(--dim);font-size:14px}
#sheet h2{margin:0 6px 8px 0;font-size:20px;letter-spacing:-.01em;padding-right:34px;
  overflow-wrap:anywhere}
#sBadge{display:inline-block;font-size:11px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;padding:3px 9px;border-radius:20px;margin-bottom:12px}
.kpi{display:flex;gap:10px}
.kpi>div{flex:1;background:#12171c;border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.kpi-l{display:block;font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:.07em}
.kpi-v{display:block;font-size:19px;font-weight:600;margin-top:3px;
  font-variant-numeric:tabular-nums}
.hint{font-size:12px;color:var(--dim);margin-top:9px}
.wide{width:100%;margin-top:14px;padding:12px;border:0;border-radius:12px;
  background:#222a32;color:var(--txt);font-size:15px}

/* ---------- Karten-Beschriftung ---------- */
.schlaglabel{background:none;border:0;box-shadow:none;padding:0;
  font-weight:600;font-size:11px;color:#fff;white-space:nowrap;
  text-shadow:0 0 3px #000,0 0 3px #000,0 1px 2px #000}
.schlaglabel:before{display:none}
.leaflet-container{background:#0b0e11}
.leaflet-control-attribution{background:rgba(16,20,24,.8)!important;color:var(--dim)!important;
  font-size:10px!important}
.leaflet-control-attribution a{color:var(--dim)!important}
.gps-punkt{border-radius:50%;background:#2f8fff;border:2px solid #fff;
  box-shadow:0 0 0 2px rgba(47,143,255,.5)}