:root{
  --bg:#0E1320; --surface:#1E2536; --surface-2:#2A3145;
  --border:rgba(255,255,255,0.08);
  --text:#ECF0F8; --text-muted:#A8B2C4; --text-dim:#7D8399;
  --score:#5EEAD4; --warning:#FBBF24; --danger:#F87171;
  --indigo:#818CF8; --orange:#FB923C; --green:#22c55e; --purple:#8b5cf6;
}
:root[data-theme="light"]{
  --bg:#F4F6FA; --surface:#FFFFFF; --surface-2:#EDF1F7;
  --border:rgba(0,0,0,0.09);
  --text:#0E1320; --text-muted:#59637A; --text-dim:#8790A3;
  --score:#0E9E86;
}
:root[data-theme="light"] .pill.active{color:#fff}
:root[data-theme="light"] .badge.dist{background:rgba(14,158,134,0.14)}
*{box-sizing:border-box}
html,body{
  margin:0; padding:0; min-height:100vh;
  background:var(--bg); color:var(--text);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Arial,sans-serif;
  font-size:15px; line-height:1.55; letter-spacing:-0.01em;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  padding-bottom:calc(64px + env(safe-area-inset-bottom,0px));
}
a{color:inherit; text-decoration:none}

/* Header */
.app-header{
  position:sticky; top:0; z-index:1000; background:var(--bg);
  padding:calc(12px + env(safe-area-inset-top,0px)) 16px 10px;
  display:flex; align-items:center; gap:11px; border-bottom:0.5px solid var(--border);
}
.logo-icon{
  width:34px; height:34px; flex-shrink:0; background:var(--surface);
  border:1px solid rgba(94,234,212,0.25); border-radius:9px;
  display:flex; align-items:center; justify-content:center; font-size:18px;
}
.app-header-left{flex:1; min-width:0}
.app-title{font-size:18px; font-weight:600; margin:0}
.app-sub{font-size:12px; color:var(--text-muted); margin:1px 0 0}
.updated{font-size:10px; color:var(--text-dim); white-space:nowrap}
.theme-btn{
  flex-shrink:0; width:36px; height:36px; border-radius:9px; cursor:pointer;
  background:var(--surface); border:0.5px solid var(--border); font-size:16px; line-height:1;
}

/* Filter-Pills */
.filters{
  position:sticky; top:0; background:var(--bg); z-index:900;
  padding:11px 16px 9px; border-bottom:0.5px solid var(--border);
}
.pills{display:flex; gap:7px; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none}
.pills::-webkit-scrollbar{display:none}
.pill{
  white-space:nowrap; padding:7px 13px; border-radius:999px;
  background:var(--surface); border:0.5px solid var(--border);
  color:var(--text-muted); font-size:13px; font-weight:500; cursor:pointer;
  transition:all .15s;
}
.pill.active{background:var(--score); color:#04211a; border-color:var(--score); font-weight:600}
.pill.studi.active{background:var(--indigo); color:#0a0f1e; border-color:var(--indigo)}

/* View-Umschalter */
.viewbar{display:flex; gap:6px; padding:10px 16px 2px}
.vbtn{
  flex:1; padding:8px; border-radius:10px; cursor:pointer; font-family:inherit;
  background:var(--surface); border:0.5px solid var(--border); color:var(--text-muted);
  font-size:13px; font-weight:500;
}
.vbtn.active{background:var(--surface-2); color:var(--text); border-color:var(--score)}

/* Kalender */
.calendar{padding:8px 16px 4px}
.cal-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px}
.cal-title{font-size:15px; font-weight:600}
.cal-nav{
  width:34px; height:34px; border-radius:9px; cursor:pointer; font-size:18px;
  background:var(--surface); border:0.5px solid var(--border); color:var(--text);
}
.cal-grid{display:grid; grid-template-columns:repeat(7,1fr); gap:5px}
.cal-dow{text-align:center; font-size:10px; font-weight:600; color:var(--text-dim); padding-bottom:2px; text-transform:uppercase; letter-spacing:0.05em}
.cal-cell{
  position:relative; aspect-ratio:1; border-radius:10px; cursor:default;
  background:transparent; border:0.5px solid transparent; color:var(--text-dim);
  display:flex; align-items:center; justify-content:center; font-size:13px; font-family:inherit;
}
.cal-cell.empty{border:none}
.cal-cell.has{background:var(--surface); border-color:var(--border); color:var(--text); cursor:pointer; font-weight:500}
.cal-cell.today .cd{color:var(--score); font-weight:700}
.cal-cell.sel{background:var(--score); border-color:var(--score)}
.cal-cell.sel .cd,.cal-cell.sel .cdot{color:#04211a}
.cal-cell .cdot{
  position:absolute; bottom:3px; right:4px; min-width:14px; height:14px; padding:0 3px;
  background:var(--score); color:#04211a; border-radius:7px; font-size:9px; font-weight:700;
  display:flex; align-items:center; justify-content:center;
}
.cal-cell.sel .cdot{background:#04211a; color:var(--score)}

/* Umkreis */
.radius{padding:11px 16px 4px; font-size:12px; color:var(--text-muted); display:flex; align-items:center; gap:12px}
.radius label{white-space:nowrap}
.radius b{color:var(--text)}
.radius input{flex:1; accent-color:var(--score)}

/* Karte */
.map-wrap{padding:8px 16px 4px}
#map{height:200px; width:100%; border-radius:14px; border:0.5px solid var(--border); background:#0a0d16; overflow:hidden}

.status{padding:12px 16px 4px; color:var(--text-muted); font-size:13px}

/* Liste */
.list{padding:8px 16px 24px; display:flex; flex-direction:column; gap:10px}
.evt{
  display:flex; gap:12px; background:var(--surface); border:0.5px solid var(--border);
  border-radius:14px; overflow:hidden; transition:border-color .15s;
}
.evt:active{border-color:var(--score)}
.evt .thumb{
  width:84px; min-width:84px; align-self:stretch;
  background:linear-gradient(135deg,var(--surface-2),#39406b);
  display:flex; align-items:center; justify-content:center; font-size:26px;
  background-size:cover; background-position:center;
}
.evt .body{padding:11px 12px 11px 2px; flex:1; min-width:0}
.evt .name{font-weight:600; font-size:15px; line-height:1.3; margin-bottom:3px}
.evt .meta{font-size:12.5px; color:var(--text-muted); line-height:1.5}
.evt .when{color:var(--score); font-weight:500}
.evt .desc{
  font-size:12px; color:var(--text-dim); line-height:1.45; margin-top:5px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.evt .badges{margin-top:7px; display:flex; gap:6px; flex-wrap:wrap; align-items:center}
.badge{font-size:10.5px; padding:2px 8px; border-radius:999px; font-weight:600}
.badge.seg{background:var(--surface-2); color:var(--text-muted)}
.badge.dist{background:rgba(94,234,212,0.14); color:var(--score)}
.badge.studi{background:rgba(129,140,248,0.18); color:var(--indigo)}
.badge.price{background:var(--surface-2); color:var(--text-dim)}

/* Bottom-Nav (Orte) */
.bottom-nav{
  position:fixed; left:0; right:0; bottom:0; z-index:1100;
  display:flex; background:var(--surface); border-top:0.5px solid var(--border);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
.nav-item{
  flex:1; padding:9px 4px 8px; background:none; border:none; cursor:pointer;
  display:flex; flex-direction:column; align-items:center; gap:3px;
  color:var(--text-dim); font-size:10.5px; font-weight:500; font-family:inherit;
}
.nav-item .ico{font-size:19px; line-height:1}
.nav-item.active{color:var(--score)}

.foot{padding:6px 16px 14px; font-size:10.5px; color:var(--text-dim); text-align:center}
.leaflet-container{font:inherit}
.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:var(--surface); color:var(--text)}
.leaflet-popup-content{font-size:12.5px}