:root{
  --panel:#ffffff;
  --panel-soft:#f4f6f8;
  --line:#dbe1e7;
  --text:#17202a;
  --muted:#687382;
  --accent:#0f62fe;
  --danger:#d61f1f;
  --warning:#f5a623;
  --shadow:0 8px 30px rgba(0,0,0,.12);
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--text);background:#eef2f6}
button,input,select,textarea{font:inherit}
.app-shell{display:grid;grid-template-columns:390px 1fr;height:100%;overflow:hidden}
.sidebar{z-index:500;background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;min-width:0;box-shadow:var(--shadow)}
.brand{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line);background:#fff}
.brand strong{display:block;font-size:22px;line-height:1;color:#003c7a}.brand span{display:block;font-size:13px;color:var(--muted);margin-top:3px}.admin-link{font-size:13px;color:var(--accent);text-decoration:none}
.time-panel,.filter-panel{padding:12px 16px;border-bottom:1px solid var(--line);background:var(--panel-soft)}
.time-panel label,.filter-panel label{display:flex;align-items:center;gap:8px;margin:7px 0;font-size:14px}.time-panel input[type="radio"],.filter-panel input[type="checkbox"]{width:18px;height:18px}
.time-inputs{display:grid;grid-template-columns:1fr;gap:8px;margin-top:10px}.time-inputs input{display:none;width:100%;border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:#fff}
.time-mode-point #timeAt{display:block}.time-mode-range #timeFrom,.time-mode-range #timeTo{display:block}
.list-panel{display:flex;flex-direction:column;min-height:0;flex:1}.list-header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line)}.list-header h1{font-size:18px;margin:0}.list-header button,.mobile-toggle,.small-button{border:1px solid var(--line);border-radius:8px;background:#fff;padding:7px 10px;cursor:pointer}.status-line{padding:8px 16px;margin:0;color:var(--muted);font-size:13px;border-bottom:1px solid var(--line)}
.message-list{overflow:auto;min-height:0}.message-card{display:grid;grid-template-columns:38px 1fr;gap:10px;padding:13px 16px;border-bottom:1px solid var(--line);cursor:pointer;background:#fff}.message-card:hover{background:#f9fbff}.message-card.active{background:#eaf2ff}.message-icon{width:32px;height:32px;object-fit:contain}.message-title{font-weight:700;font-size:14px;line-height:1.25}.message-meta{font-size:12px;color:var(--muted);margin-top:4px}.message-description{font-size:13px;color:#394554;margin-top:6px;line-height:1.35}.badge{display:inline-flex;align-items:center;border-radius:999px;padding:2px 7px;font-size:11px;background:#edf2f7;color:#465465;margin-right:4px}.badge.manual{background:#e6f4ea;color:#146c2e}.badge.external{background:#fff4dc;color:#8a5a00}
.map-wrap{position:relative;min-width:0}.map{height:100%;width:100%}.mobile-toggle{display:none;position:absolute;z-index:700;top:12px;left:12px;background:#fff}.leaflet-popup-content{min-width:260px}.popup-title{font-size:17px;font-weight:800;margin:0 0 6px}.popup-meta{color:var(--muted);font-size:12px;margin-bottom:8px}.popup-section{border-top:1px solid var(--line);margin-top:10px;padding-top:8px}.popup-lanes{display:flex;gap:7px;flex-wrap:wrap}.lane-chip{border:1px solid var(--line);border-radius:8px;padding:4px 7px;font-size:12px;background:#f8fafc}.lane-chip.closed{background:#ffebeb;border-color:#ffc3c3;color:#9f1111}.lane-chip.open{background:#eaf8ee;border-color:#bce6c8;color:#126428}
.polyline-hint{background:#ffffff;border:1px solid var(--line);border-radius:8px;padding:8px 10px;box-shadow:var(--shadow);font-size:13px}
.embed-mode{grid-template-columns:340px 1fr}.embed-mode .brand{padding-top:10px;padding-bottom:10px}.embed-mode .admin-link{display:none}
.admin-body{height:auto;min-height:100%;overflow:auto;background:#f2f5f8}.admin-layout{max-width:1180px;margin:0 auto;padding:22px}.admin-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}.admin-nav{display:flex;gap:8px;flex-wrap:wrap}.admin-nav a,.button{display:inline-flex;align-items:center;justify-content:center;gap:6px;text-decoration:none;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--text);padding:9px 12px;cursor:pointer}.button.primary{background:var(--accent);border-color:var(--accent);color:#fff}.button.danger{background:#fff;border-color:#ffc3c3;color:#a40000}.card{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 4px 16px rgba(0,0,0,.04);padding:18px;margin-bottom:16px}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form-row{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}.form-row label{font-weight:650;font-size:14px}.form-row input,.form-row select,.form-row textarea{border:1px solid var(--line);border-radius:9px;padding:10px 12px;background:#fff;width:100%}.form-row textarea{min-height:96px}.help{font-size:12px;color:var(--muted);line-height:1.35}.table-wrap{overflow:auto}.admin-table{width:100%;border-collapse:collapse;background:#fff}.admin-table th,.admin-table td{border-bottom:1px solid var(--line);padding:10px;text-align:left;font-size:14px;vertical-align:top}.admin-table th{font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);background:#f8fafc}.admin-map{height:460px;border:1px solid var(--line);border-radius:12px;overflow:hidden}.login-box{max-width:440px;margin:12vh auto;background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:var(--shadow)}.notice{border-radius:10px;padding:10px 12px;background:#fff4dc;border:1px solid #f8d799;color:#705000;margin-bottom:12px}.notice.ok{background:#eaf8ee;border-color:#bce6c8;color:#126428}.notice.error{background:#ffebeb;border-color:#ffc3c3;color:#9f1111}
@media (max-width:900px){.app-shell,.embed-mode{grid-template-columns:1fr}.sidebar{position:absolute;inset:0 auto 0 0;width:min(92vw,390px);transform:translateX(-105%);transition:transform .2s ease}.sidebar.open{transform:translateX(0)}.mobile-toggle{display:block}.grid{grid-template-columns:1fr}.admin-layout{padding:14px}.admin-top{align-items:flex-start;flex-direction:column}.map{height:100vh}}
.admin-link{display:none!important}
.popup-lanes-symbols{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}.lane-symbol{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);border-radius:10px;padding:4px 8px;background:#f8fafc;font-size:13px}.lane-symbol .lane-symbol-icon{font-weight:800;font-size:18px;line-height:1}.lane-symbol .lane-symbol-number{font-weight:700;font-size:12px;line-height:1}.lane-symbol .lane-symbol-label{font-size:12px;line-height:1;color:#405060}.lane-symbol.open{background:#eaf8ee;border-color:#bce6c8;color:#126428}.lane-symbol.closed{background:#ffebeb;border-color:#ffc3c3;color:#a40000}.lane-symbol.contraflow{background:#eef4ff;border-color:#b8cffd;color:#0b47a1}.lane-symbol.shoulder{background:#f1f5f9;border-color:#cbd5e1;color:#334155}
.google-traffic-map{position:absolute;inset:0;z-index:0}.google-traffic-active .map{background:transparent}.google-traffic-active .leaflet-container{background:transparent}.google-traffic-active .leaflet-map-pane{z-index:100}.google-traffic-active .leaflet-control-container{z-index:400;position:relative}.route-arrow-marker{background:transparent;border:0}.route-arrow-marker span{display:flex;align-items:center;justify-content:center;width:24px;height:24px;font-size:20px;font-weight:900;text-shadow:0 1px 3px rgba(255,255,255,.95)}.route-arrow-marker.standard-diversion span{color:#7b2cff}.route-arrow-marker.custom-diversion span{color:#0f62fe}
.popup-contra-road{display:grid;gap:6px;margin-top:6px}.popup-contra-side{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 0}.popup-contra-side>span{font-size:12px;color:var(--muted)}.lane-mini{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:7px;margin-left:3px;border:1px solid var(--line);font-weight:800}.lane-mini.open{background:#eaf8ee;border-color:#bce6c8;color:#126428}.lane-mini.closed{background:#ffebeb;border-color:#ffc3c3;color:#a40000}.lane-mini.contraflow{background:#eef4ff;border-color:#b8cffd;color:#0b47a1}.lane-mini.shoulder{background:#f1f5f9;border-color:#cbd5e1;color:#334155}
.check-row{display:flex;align-items:center;gap:8px;margin:10px 0;font-weight:650}.check-row input{width:18px;height:18px}.lane-config-card{border:1px solid var(--line);border-radius:14px;background:#f8fafc;padding:14px;margin:16px 0}.lane-config-card h2,.lane-config-card h3{margin:0 0 8px}.lane-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0}.lane-toolbar input[type="number"]{width:80px;border:1px solid var(--line);border-radius:8px;padding:7px 9px}.lane-palette{display:flex;gap:7px;flex-wrap:wrap}.lane-drag-token{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);border-radius:999px;background:#fff;padding:7px 10px;cursor:grab;user-select:none}.lane-drag-token.open{background:#eaf8ee;border-color:#bce6c8;color:#126428}.lane-drag-token.closed{background:#ffebeb;border-color:#ffc3c3;color:#a40000}.lane-drag-token.contraflow{background:#eef4ff;border-color:#b8cffd;color:#0b47a1}.lane-drag-token.shoulder{background:#f1f5f9;border-color:#cbd5e1;color:#334155}.lane-editor{display:grid;gap:8px}.lane-editor-row{display:grid;grid-template-columns:70px minmax(180px,1fr) minmax(160px,220px);gap:8px;align-items:center}.lane-editor-label{font-weight:700}.lane-editor-cell,.contra-cell{border:1px solid var(--line);border-radius:10px;background:#fff;padding:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px}.lane-editor-cell:hover,.contra-cell:hover{outline:2px solid rgba(15,98,254,.18)}.lane-editor-symbol{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:8px;font-size:20px;font-weight:900}.lane-editor-symbol.open{background:#eaf8ee;color:#126428}.lane-editor-symbol.closed{background:#ffebeb;color:#a40000}.lane-editor-symbol.contraflow{background:#eef4ff;color:#0b47a1}.lane-editor-symbol.shoulder{background:#f1f5f9;color:#334155}.lane-width-input{border:1px solid var(--line);border-radius:9px;padding:10px 12px;width:100%}.contra-flow-editor-wrap{display:none;margin-top:14px;border-top:1px solid var(--line);padding-top:14px}.contra-flow-editor{display:grid;gap:12px}.contra-side-title{font-weight:700;margin-bottom:6px}.contra-road{display:grid;grid-template-columns:repeat(3,minmax(120px,1fr));gap:8px;padding:10px;border:1px solid var(--line);border-radius:12px;background:#fff}.contra-lane-id{font-weight:700;margin-right:4px;color:var(--muted)}
@media (max-width:900px){.lane-editor-row{grid-template-columns:1fr}.contra-road{grid-template-columns:1fr}}
.google-traffic-map{pointer-events:none}
.traffic-toggle{position:absolute;z-index:710;top:12px;right:12px;border:1px solid var(--line);border-radius:999px;background:#fff;padding:8px 12px;box-shadow:var(--shadow);cursor:pointer;font-weight:700}.traffic-toggle.active{background:#eaf8ee;border-color:#bce6c8;color:#126428}.traffic-google-enabled .leaflet-tile-pane{display:none}.route-arrow-marker.custom-diversion-a span,.route-arrow-marker.custom-diversion-b span{color:#0f62fe}.route-arrow-marker.custom-diversion-b span{filter:drop-shadow(0 0 2px #fff)}.checkbox-group{display:flex;gap:14px;flex-wrap:wrap;align-items:center}.checkbox-group label{display:flex;align-items:center;gap:7px;font-weight:600}.checkbox-group input[type="checkbox"]{width:18px;height:18px}.contra-flow-toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;padding:10px;border:1px solid var(--line);border-radius:12px;background:#fff}.contra-flow-toolbar label{display:flex;flex-direction:column;gap:5px;font-size:13px;font-weight:700}.contra-flow-toolbar input,.contra-flow-toolbar select{border:1px solid var(--line);border-radius:8px;padding:7px 9px;background:#fff}.contra-flow-toolbar input{width:90px}.contra-cell{display:flex;flex-direction:column;align-items:stretch;gap:8px;cursor:default}.contra-state-button{border:0;background:transparent;display:flex;align-items:center;justify-content:center;gap:8px;min-height:36px;cursor:pointer}.contra-direction-label{display:flex!important;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}.contra-direction-label select{border:1px solid var(--line);border-radius:8px;padding:6px 8px;background:#fff}.popup-contra-side{align-items:flex-start}.lane-mini{width:auto;min-width:28px;height:auto;min-height:26px;gap:4px;padding:3px 6px}.lane-mini small{font-size:10px;font-weight:700;color:inherit;opacity:.9}@media (max-width:900px){.traffic-toggle{top:12px;right:12px}.mobile-toggle+.traffic-toggle{top:52px}.contra-flow-toolbar{align-items:stretch}.contra-flow-toolbar label,.contra-flow-toolbar .button{width:100%}.contra-flow-toolbar input{width:100%}}

/* Patch 2C: Umleitungspfeile näher an der Polyline und neue Fahrstreifengrafik */
.route-arrow-marker{background:transparent!important;border:0!important;pointer-events:none!important}
.route-arrow-marker span{width:18px!important;height:18px!important;font-size:15px!important;line-height:18px!important;color:#0f62fe;text-shadow:0 0 2px #fff,0 1px 3px rgba(255,255,255,.95)!important;filter:drop-shadow(0 1px 1px rgba(0,0,0,.22))}
.route-arrow-marker.standard-diversion span{color:#7b2cff!important}.route-arrow-marker.custom-diversion-a span,.route-arrow-marker.custom-diversion-b span{color:#0f62fe!important}
.leaflet-popup-content{min-width:300px;max-width:min(420px,80vw)}
.traffic-flow-graphic{margin-top:8px;overflow:auto;max-width:100%;padding:4px 0}.traffic-flow-road{display:inline-flex;align-items:stretch;gap:0;max-width:100%}.traffic-flow-road.single-road{display:block}.traffic-flow-side-wrap{display:flex;flex-direction:column;min-width:0}.traffic-flow-side-title{text-align:center;font-size:10px;line-height:1.1;font-weight:700;color:#1f2937;margin:0 0 2px}.traffic-flow-side{display:flex;align-items:stretch;border:1px solid #111;border-radius:5px;overflow:hidden;background:#fff}.traffic-flow-side.opposite{background:#eef9f0}.traffic-flow-side.own{background:#fff1ed}.traffic-flow-side.single{background:#f8fafc}.traffic-flow-lane{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:34px;min-height:44px;padding:3px 4px;background:rgba(255,255,255,.55)}.traffic-flow-lane+.traffic-flow-lane{border-left:2px solid #111}.traffic-flow-lane.closed{background:repeating-linear-gradient(135deg,#fff2f0 0,#fff2f0 7px,#ffe1dc 7px,#ffe1dc 14px)}.traffic-flow-lane.shoulder{background:#eef2f7}.traffic-flow-lane-icon{width:17px;height:17px;object-fit:contain;display:block}.traffic-lane-id{font-size:9px;font-weight:800;color:#334155;white-space:nowrap}.traffic-lane-direction{font-size:9px;line-height:1;white-space:nowrap;color:#111827}.traffic-lane-width{font-size:9px;line-height:1;color:#475569;white-space:nowrap}.traffic-flow-median{width:9px;min-width:9px;margin:13px 3px 0;background:linear-gradient(to right,#111 0 2px,transparent 2px 5px,#111 5px 7px,transparent 7px 9px);border-radius:1px}.traffic-flow-empty{display:flex;align-items:center;justify-content:center;min-width:52px;min-height:44px;padding:4px 6px;font-size:10px;color:#64748b;background:#f8fafc;border:1px dashed #cbd5e1;border-radius:5px}.traffic-flow-graphic.normal .traffic-flow-side-title{text-align:left;padding-left:2px}.traffic-flow-graphic.normal .traffic-flow-road{display:inline-block}.traffic-flow-graphic.normal .traffic-flow-side{display:inline-flex}@media (max-width:600px){.leaflet-popup-content{min-width:260px}.traffic-flow-lane{min-width:30px}.traffic-flow-lane-icon{width:15px;height:15px}.traffic-lane-direction,.traffic-lane-width{display:none}}
.contra-flow-graphic-editor{padding:8px 0 2px}.contra-flow-graphic-editor .traffic-flow-road{display:inline-flex;max-width:100%;overflow:auto;padding-bottom:4px}.contra-flow-graphic-editor .traffic-flow-lane{min-width:96px;min-height:94px;padding:7px 8px;gap:5px}.contra-flow-graphic-editor .contra-state-button{border:0;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer;width:100%;min-height:48px}.contra-flow-graphic-editor .traffic-lane-icon{width:26px;height:26px}.contra-flow-graphic-editor .traffic-lane-direction{font-size:11px;font-weight:700}.contra-flow-graphic-editor .contra-direction-label{width:100%;font-size:11px}.contra-flow-graphic-editor .contra-direction-label select{width:100%;font-size:12px;padding:5px 6px}.contra-flow-graphic-editor .traffic-flow-median{margin-top:22px;height:72px}.contra-flow-graphic-editor .traffic-flow-side-title{font-size:12px;margin-bottom:4px}

/* Patch 2D: kompakte Fahrbahngrafik und robuste Icon-Skalierung */
img.traffic-lane-icon,
.traffic-flow-lane img.traffic-lane-icon,
.leaflet-popup-content img.traffic-lane-icon{
  width:18px!important;
  height:18px!important;
  max-width:18px!important;
  max-height:18px!important;
  min-width:18px!important;
  min-height:18px!important;
  object-fit:contain!important;
  display:block!important;
  flex:0 0 18px!important;
}
.traffic-flow-graphic{
  --lane-w:34px;
  --lane-h:58px;
  --median-w:9px;
  margin-top:8px!important;
  max-width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  padding:4px 0!important;
}
.traffic-flow-graphic .traffic-flow-road{
  display:inline-flex!important;
  align-items:flex-start!important;
  gap:0!important;
  max-width:100%!important;
}
.traffic-flow-graphic .traffic-flow-side-wrap{
  display:flex!important;
  flex-direction:column!important;
  flex:0 0 auto!important;
  min-width:0!important;
}
.traffic-flow-graphic .traffic-flow-side-title{
  height:13px!important;
  margin:0 0 2px!important;
  text-align:center!important;
  font-size:9px!important;
  line-height:12px!important;
  font-weight:800!important;
  color:#1f2937!important;
}
.traffic-flow-graphic .traffic-flow-side{
  display:inline-flex!important;
  align-items:stretch!important;
  width:auto!important;
  min-height:var(--lane-h)!important;
  border:2px solid #111!important;
  border-radius:3px!important;
  overflow:hidden!important;
  box-shadow:none!important;
}
.traffic-flow-graphic .traffic-flow-side.opposite{
  background:#effaf2!important;
}
.traffic-flow-graphic .traffic-flow-side.own{
  background:repeating-linear-gradient(135deg,#fff5f2 0,#fff5f2 7px,#ffe1dc 7px,#ffe1dc 13px)!important;
}
.traffic-flow-graphic .traffic-flow-side.single{
  background:#f8fafc!important;
}
.traffic-flow-graphic .traffic-flow-lane{
  box-sizing:border-box!important;
  width:var(--lane-w)!important;
  min-width:var(--lane-w)!important;
  max-width:var(--lane-w)!important;
  height:var(--lane-h)!important;
  min-height:var(--lane-h)!important;
  max-height:var(--lane-h)!important;
  padding:2px 2px 3px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:1px!important;
  overflow:hidden!important;
  background:rgba(255,255,255,.42)!important;
}
.traffic-flow-graphic .traffic-flow-lane+.traffic-flow-lane{
  border-left:2px solid #111!important;
}
.traffic-flow-graphic .traffic-flow-lane.closed{
  background:repeating-linear-gradient(135deg,#fff5f2 0,#fff5f2 7px,#ffe1dc 7px,#ffe1dc 13px)!important;
}
.traffic-flow-graphic .traffic-flow-lane.shoulder{
  background:#eef2f7!important;
}
.traffic-flow-graphic .traffic-lane-id{
  display:block!important;
  align-self:stretch!important;
  text-align:center!important;
  font-size:8px!important;
  line-height:10px!important;
  font-weight:800!important;
  color:#334155!important;
  white-space:nowrap!important;
}
.traffic-flow-graphic .traffic-lane-direction,
.traffic-flow-graphic .traffic-lane-width{
  display:block!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-align:center!important;
  font-size:7.5px!important;
  line-height:9px!important;
  color:#111827!important;
  white-space:nowrap!important;
}
.traffic-flow-graphic .traffic-lane-width{
  color:#475569!important;
}
.traffic-flow-graphic .traffic-flow-median{
  width:var(--median-w)!important;
  min-width:var(--median-w)!important;
  max-width:var(--median-w)!important;
  height:var(--lane-h)!important;
  min-height:var(--lane-h)!important;
  margin:15px 3px 0!important;
  background:linear-gradient(to right,#111 0 2px,transparent 2px 5px,#111 5px 7px,transparent 7px 100%)!important;
  border-radius:1px!important;
}
.traffic-flow-graphic.normal{
  --lane-w:38px;
  --lane-h:50px;
}
.traffic-flow-graphic.normal .traffic-flow-road,
.traffic-flow-graphic.normal .traffic-flow-side{
  display:inline-flex!important;
}
.contra-flow-graphic-editor.traffic-flow-graphic{
  --lane-w:92px;
  --lane-h:86px;
  --median-w:10px;
}
.contra-flow-graphic-editor img.traffic-lane-icon,
.contra-flow-graphic-editor .traffic-flow-lane img.traffic-lane-icon{
  width:24px!important;
  height:24px!important;
  max-width:24px!important;
  max-height:24px!important;
  min-width:24px!important;
  min-height:24px!important;
  flex:0 0 24px!important;
}
.contra-flow-graphic-editor .traffic-flow-lane{
  width:var(--lane-w)!important;
  min-width:var(--lane-w)!important;
  max-width:var(--lane-w)!important;
  height:var(--lane-h)!important;
  min-height:var(--lane-h)!important;
  max-height:var(--lane-h)!important;
  padding:6px!important;
}
.contra-flow-graphic-editor .contra-state-button{
  min-height:44px!important;
  max-height:56px!important;
  overflow:hidden!important;
}
.contra-flow-graphic-editor .traffic-lane-direction{
  font-size:10px!important;
  line-height:12px!important;
}
.contra-flow-graphic-editor .traffic-flow-median{
  height:var(--lane-h)!important;
  margin-top:15px!important;
}
@media (max-width:600px){
  .traffic-flow-graphic{--lane-w:31px;--lane-h:52px}
  img.traffic-lane-icon,.traffic-flow-lane img.traffic-lane-icon{width:16px!important;height:16px!important;max-width:16px!important;max-height:16px!important;min-width:16px!important;min-height:16px!important;flex-basis:16px!important}
}

/* Patch 2F: finaler Feinschliff Fahrstreifen-/Gegenfahrbahn-Grafik */
.route-arrow-marker{width:14px!important;height:14px!important;background:transparent!important;border:0!important;pointer-events:none!important}
.route-arrow-marker .route-arrow-svg{display:block;width:14px!important;height:14px!important;line-height:0;color:#0f62fe;transform:translateZ(0)}
.route-arrow-marker.standard-diversion .route-arrow-svg{color:#7b2cff!important}
.route-arrow-marker.custom-diversion-a .route-arrow-svg,.route-arrow-marker.custom-diversion-b .route-arrow-svg{color:#0f62fe!important}
.route-arrow-marker span{width:auto!important;height:auto!important;font-size:0!important;line-height:0!important;text-shadow:none!important;filter:none!important}

.lane-editor-row{grid-template-columns:70px minmax(180px,1fr) minmax(160px,220px) minmax(180px,230px)!important;align-items:end!important}
.lane-width-input:disabled,.contra-width-label input:disabled{background:#f3f4f6!important;color:#94a3b8!important}
.lane-divider-select-wrap,.contra-divider-label,.contra-width-label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:700;color:var(--muted)}
.lane-divider-select-wrap select,.contra-divider-label select,.contra-width-label input{border:1px solid var(--line);border-radius:8px;padding:7px 8px;background:#fff;width:100%}
.lane-divider-select-wrap.disabled,.contra-divider-label.disabled{opacity:.45}

.contra-flow-toolbar.refined{display:grid!important;grid-template-columns:minmax(250px,1.2fr) minmax(220px,1fr) minmax(220px,1fr)!important;gap:12px!important;align-items:stretch!important;padding:0!important;border:0!important;background:transparent!important}
.contra-toolbar-card{border:1px solid var(--line);border-radius:12px;background:#fff;padding:12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-content:start}
.contra-toolbar-card.setup{grid-template-columns:repeat(2,minmax(0,1fr))}
.contra-toolbar-card h4{grid-column:1/-1;margin:0 0 2px;font-size:14px}.contra-toolbar-card .button{align-self:end}.contra-toolbar-card label{display:flex!important;flex-direction:column!important;gap:5px!important;font-size:12px!important;font-weight:800!important;color:#334155!important}.contra-toolbar-card input,.contra-toolbar-card select{width:100%!important;border:1px solid var(--line)!important;border-radius:8px!important;padding:8px 9px!important;background:#fff!important}

.traffic-flow-graphic .traffic-flow-side-title{height:auto!important;min-height:22px!important;display:flex!important;flex-direction:column!important;justify-content:flex-end!important;gap:1px!important;margin-bottom:4px!important;text-align:center!important}
.traffic-flow-side-title-main{display:block;font-weight:800;color:#1f2937}.traffic-flow-side-direction-top{display:block;font-size:10px;font-weight:700;color:#475569;line-height:1.1}
.traffic-flow-graphic .traffic-flow-side{align-items:stretch!important;border:2px solid #111!important;border-radius:4px!important;overflow:hidden!important}
.traffic-flow-graphic .traffic-flow-lane+.traffic-flow-lane{border-left:0!important}
.traffic-flow-divider{align-self:stretch;box-sizing:border-box;flex:0 0 auto;min-height:var(--lane-h)}
.traffic-flow-divider.barrier{width:3px;background:#111}
.traffic-flow-divider.marking{width:7px;background:linear-gradient(to right, transparent 0 2px, #111 2px 4px, transparent 4px 7px);background-size:7px 13px;background-repeat:repeat-y}
.traffic-flow-graphic .traffic-flow-lane.frontend-simple{justify-content:center!important;gap:2px!important;padding:4px 2px!important}
.traffic-flow-graphic .traffic-flow-lane.frontend-simple .traffic-lane-id,.traffic-flow-graphic .traffic-flow-lane.frontend-simple .traffic-lane-direction{display:none!important}
.traffic-flow-graphic .traffic-flow-lane.frontend-simple .traffic-lane-width{display:block!important;font-size:9px!important;line-height:11px!important;white-space:nowrap!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;color:#334155!important;font-weight:700!important;text-align:center!important}
.traffic-flow-graphic.normal{--lane-w:40px;--lane-h:56px}.traffic-flow-graphic.contra{--lane-w:44px;--lane-h:62px}.traffic-flow-graphic .traffic-flow-empty{min-height:var(--lane-h)!important}.traffic-flow-graphic .traffic-flow-median{margin-top:26px!important;height:calc(var(--lane-h) + 2px)!important}
.traffic-flow-graphic .traffic-flow-side.opposite{background:#effaf2!important}.traffic-flow-graphic .traffic-flow-side.own{background:repeating-linear-gradient(135deg,#fff5f2 0,#fff5f2 7px,#ffe1dc 7px,#ffe1dc 13px)!important}

.contra-flow-graphic-editor.traffic-flow-graphic{--lane-w:136px;--lane-h:176px;--median-w:10px}
.contra-flow-graphic-editor .traffic-flow-side-title{min-height:36px!important}.contra-flow-graphic-editor .traffic-flow-lane{width:var(--lane-w)!important;min-width:var(--lane-w)!important;max-width:var(--lane-w)!important;height:var(--lane-h)!important;min-height:var(--lane-h)!important;max-height:var(--lane-h)!important;padding:8px 8px 10px!important;gap:7px!important;justify-content:flex-start!important}
.contra-flow-graphic-editor .traffic-lane-id{display:block!important;font-size:14px!important;line-height:16px!important;margin-bottom:2px!important;font-weight:900!important}.contra-flow-graphic-editor .contra-state-button{min-height:50px!important;gap:6px!important}.contra-flow-graphic-editor .traffic-lane-direction{display:block!important;font-size:13px!important;line-height:15px!important;font-weight:700!important;max-width:100%!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.contra-flow-graphic-editor .traffic-flow-divider.barrier{width:4px}.contra-flow-graphic-editor .traffic-flow-divider.marking{width:8px;background:linear-gradient(to right, transparent 0 2px, #111 2px 4px, transparent 4px 8px);background-size:8px 16px;background-repeat:repeat-y}.contra-flow-graphic-editor .traffic-flow-median{height:calc(var(--lane-h) + 4px)!important;margin-top:38px!important}.contra-flow-graphic-editor .contra-direction-label,.contra-flow-graphic-editor .contra-divider-label,.contra-flow-graphic-editor .contra-width-label{width:100%;font-size:12px!important}.contra-flow-graphic-editor .contra-direction-label select,.contra-flow-graphic-editor .contra-divider-label select,.contra-flow-graphic-editor .contra-width-label input{width:100%;font-size:12px;padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:#fff}

@media (max-width:900px){.contra-flow-toolbar.refined{grid-template-columns:1fr!important}.contra-toolbar-card{grid-template-columns:1fr!important}.lane-editor-row{grid-template-columns:1fr!important}.contra-flow-graphic-editor.traffic-flow-graphic{--lane-w:116px;--lane-h:166px}}

/* Patch 2G: bessere Lesbarkeit, eindeutige Trennung und nur Pfeil/Kreuz */
.leaflet-popup-content{
  min-width:360px!important;
  max-width:min(760px,92vw)!important;
}
.leaflet-popup-content-wrapper{max-width:min(800px,96vw)!important}

.lane-drag-token.contraflow,
.lane-drag-token.shoulder{display:none!important}
.lane-drag-token.open{background:#effaf2!important;border-color:#b7e4c2!important;color:#126428!important}
.lane-drag-token.closed{background:repeating-linear-gradient(135deg,#fff5f2 0,#fff5f2 7px,#ffe1dc 7px,#ffe1dc 13px)!important;border-color:#ffc3c3!important;color:#a40000!important}

.lane-config-card{overflow-x:auto!important}
.lane-editor{gap:10px!important;min-width:720px!important}
.lane-editor-row{grid-template-columns:70px minmax(250px,1fr) minmax(180px,240px) minmax(220px,280px)!important;gap:10px!important;align-items:center!important}
.lane-editor-cell{min-height:54px!important;font-weight:700!important}
.lane-editor-row.state-open .lane-editor-cell{background:#effaf2!important;border-color:#b7e4c2!important}
.lane-editor-row.state-closed .lane-editor-cell{background:repeating-linear-gradient(135deg,#fff5f2 0,#fff5f2 7px,#ffe1dc 7px,#ffe1dc 13px)!important;border-color:#ffc3c3!important}
.lane-width-input{min-height:44px!important}
.lane-divider-select-wrap,.contra-divider-label{display:flex!important;flex-direction:column!important;gap:5px!important;font-size:12px!important;font-weight:800!important;color:#475569!important}
.lane-divider-select-wrap select,.contra-divider-label select{border:1px solid var(--line)!important;border-radius:8px!important;padding:8px 9px!important;background:#fff!important;min-height:40px!important}
.lane-divider-select-wrap.disabled,.contra-divider-label.disabled{opacity:.45!important}

.traffic-flow-graphic .traffic-flow-side.opposite,
.traffic-flow-graphic .traffic-flow-side.own,
.traffic-flow-graphic .traffic-flow-side.single{background:#fff!important}
.traffic-flow-graphic .traffic-flow-lane.open,
.traffic-flow-graphic .traffic-flow-lane.contraflow,
.traffic-flow-graphic .traffic-flow-lane.shoulder{background:#effaf2!important}
.traffic-flow-graphic .traffic-flow-lane.closed{background:repeating-linear-gradient(135deg,#fff5f2 0,#fff5f2 7px,#ffe1dc 7px,#ffe1dc 13px)!important}
.traffic-flow-graphic .traffic-flow-lane.frontend-simple{justify-content:center!important;gap:4px!important;padding:5px 3px!important}
.traffic-flow-graphic .traffic-flow-lane.frontend-simple .traffic-lane-id,
.traffic-flow-graphic .traffic-flow-lane.frontend-simple .traffic-lane-direction{display:none!important}
.traffic-flow-graphic .traffic-flow-lane.frontend-simple .traffic-lane-width{display:block!important;font-size:10.5px!important;line-height:12px!important;white-space:nowrap!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;color:#111827!important;font-weight:800!important;text-align:center!important;margin-top:2px!important;background:rgba(255,255,255,.78)!important;border-radius:4px!important;padding:1px 3px!important}
.traffic-flow-graphic.normal{--lane-w:56px!important;--lane-h:76px!important}
.traffic-flow-graphic.contra{--lane-w:56px!important;--lane-h:80px!important}
.traffic-flow-graphic .traffic-flow-side-title{min-height:25px!important;height:auto!important;margin-bottom:5px!important;display:flex!important;flex-direction:column!important;justify-content:flex-end!important;gap:1px!important}
.traffic-flow-side-title-main{font-size:10.5px!important;line-height:11px!important;font-weight:900!important}
.traffic-flow-side-direction-top{font-size:11px!important;line-height:12px!important;font-weight:900!important;color:#111827!important}
.traffic-flow-graphic .traffic-flow-median{margin-top:30px!important;height:var(--lane-h)!important}
.traffic-flow-divider.barrier{width:4px!important;background:#111!important;align-self:stretch!important;flex:0 0 4px!important}
.traffic-flow-divider.marking{width:8px!important;align-self:stretch!important;flex:0 0 8px!important;background:linear-gradient(to right,transparent 0 2px,#111 2px 4px,transparent 4px 8px)!important;background-size:8px 16px!important;background-repeat:repeat-y!important}

.contra-flow-toolbar{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))!important;gap:12px!important;align-items:end!important}
.contra-toolbar-card{border:1px solid var(--line)!important;border-radius:12px!important;background:#fff!important;padding:12px!important;display:grid!important;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))!important;gap:10px!important;align-items:end!important}
.contra-toolbar-card h4{grid-column:1/-1!important;margin:0 0 2px!important;font-size:14px!important}
.contra-flow-graphic-editor.traffic-flow-graphic{--lane-w:158px!important;--lane-h:215px!important;--median-w:12px!important;overflow-x:auto!important;overflow-y:visible!important;padding-bottom:10px!important}
.contra-flow-graphic-editor .traffic-flow-side-title{min-height:38px!important}
.contra-flow-graphic-editor .traffic-flow-lane{width:var(--lane-w)!important;min-width:var(--lane-w)!important;max-width:var(--lane-w)!important;height:var(--lane-h)!important;min-height:var(--lane-h)!important;max-height:var(--lane-h)!important;padding:10px!important;gap:9px!important;justify-content:flex-start!important;overflow:visible!important}
.contra-flow-graphic-editor .traffic-lane-id{display:block!important;font-size:15px!important;line-height:17px!important;font-weight:900!important;margin-bottom:2px!important}
.contra-flow-graphic-editor .contra-state-button{min-height:58px!important;gap:6px!important}
.contra-flow-graphic-editor .traffic-lane-direction{display:block!important;font-size:13px!important;line-height:15px!important;font-weight:800!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:100%!important}
.contra-flow-graphic-editor .contra-direction-label,
.contra-flow-graphic-editor .contra-divider-label{width:100%!important;font-size:12px!important;line-height:14px!important}
.contra-flow-graphic-editor .contra-direction-label select,
.contra-flow-graphic-editor .contra-divider-label select{width:100%!important;font-size:12px!important;padding:7px 8px!important;min-height:38px!important}
.contra-flow-graphic-editor .traffic-flow-median{height:var(--lane-h)!important;margin-top:38px!important}
.contra-flow-graphic-editor .traffic-flow-divider.barrier{width:5px!important;flex-basis:5px!important}
.contra-flow-graphic-editor .traffic-flow-divider.marking{width:9px!important;flex-basis:9px!important;background:linear-gradient(to right,transparent 0 2px,#111 2px 5px,transparent 5px 9px)!important;background-size:9px 17px!important;background-repeat:repeat-y!important}

@media (max-width:700px){
  .leaflet-popup-content{min-width:300px!important;max-width:92vw!important}
  .traffic-flow-graphic.normal{--lane-w:48px!important;--lane-h:70px!important}
  .traffic-flow-graphic.contra{--lane-w:48px!important;--lane-h:74px!important}
  .lane-editor{min-width:0!important}
  .lane-editor-row{grid-template-columns:1fr!important}
  .contra-flow-graphic-editor.traffic-flow-graphic{--lane-w:138px!important;--lane-h:205px!important}
}

/* Patch 2G: Fahrstreifen-Editor/Frontend nach Feinschliff */
.leaflet-popup-content{min-width:360px!important;max-width:min(560px,88vw)!important}
.lane-drag-token.contraflow,.lane-drag-token.shoulder{display:none!important}
.lane-drag-token.open{background:#effaf2!important;border-color:#bce6c8!important;color:#126428!important}
.lane-drag-token.closed{background:repeating-linear-gradient(135deg,#fff5f2 0,#fff5f2 7px,#ffe1dc 7px,#ffe1dc 13px)!important;border-color:#ffc3c3!important;color:#a40000!important}
.lane-editor-row{grid-template-columns:70px minmax(220px,1fr) minmax(180px,240px) minmax(210px,270px)!important;gap:10px!important;align-items:end!important}
.lane-editor-cell{min-height:54px!important}.lane-editor-cell,.contra-cell{border-color:#cbd5e1!important}
.lane-divider-select-wrap{font-size:13px!important;color:#334155!important}.lane-divider-select-wrap select{min-height:38px!important}

.traffic-flow-graphic{overflow-x:auto!important;overflow-y:visible!important;padding:5px 0 7px!important}.traffic-flow-graphic .traffic-flow-road{align-items:flex-start!important}.traffic-flow-graphic .traffic-flow-side{overflow:visible!important;background:transparent!important}.traffic-flow-graphic .traffic-flow-side-title{min-height:24px!important;margin-bottom:5px!important;font-size:11px!important;line-height:1.15!important}.traffic-flow-side-direction-top{font-size:11px!important;color:#111827!important;font-weight:800!important}.traffic-flow-side-title-main{font-size:11px!important;color:#111827!important;font-weight:900!important}
.traffic-flow-graphic.normal{--lane-w:58px!important;--lane-h:76px!important}.traffic-flow-graphic.contra{--lane-w:58px!important;--lane-h:82px!important}.traffic-flow-graphic .traffic-flow-lane{width:var(--lane-w)!important;min-width:var(--lane-w)!important;max-width:var(--lane-w)!important;height:var(--lane-h)!important;min-height:var(--lane-h)!important;max-height:var(--lane-h)!important;border:0!important;overflow:hidden!important}.traffic-flow-graphic .traffic-flow-lane.open,.traffic-flow-graphic .traffic-flow-lane.contraflow,.traffic-flow-graphic .traffic-flow-lane.shoulder{background:#effaf2!important}.traffic-flow-graphic .traffic-flow-lane.closed{background:repeating-linear-gradient(135deg,#fff5f2 0,#fff5f2 7px,#ffe1dc 7px,#ffe1dc 13px)!important}.traffic-flow-graphic .traffic-flow-lane.frontend-simple{justify-content:center!important;gap:5px!important;padding:6px 3px!important}.traffic-flow-graphic .traffic-flow-lane.frontend-simple .traffic-lane-id,.traffic-flow-graphic .traffic-flow-lane.frontend-simple .traffic-lane-direction{display:none!important}.traffic-flow-graphic .traffic-flow-lane.frontend-simple .traffic-lane-width{display:block!important;font-size:10.5px!important;line-height:12px!important;font-weight:800!important;color:#334155!important;text-align:center!important;white-space:nowrap!important;max-width:100%!important;overflow:visible!important;text-overflow:clip!important}.traffic-flow-graphic .traffic-flow-divider{min-height:var(--lane-h)!important}.traffic-flow-divider.barrier{width:4px!important;background:#111!important}.traffic-flow-divider.marking{width:8px!important;background:linear-gradient(to bottom,#111 0 8px,transparent 8px 15px)!important;background-size:8px 15px!important;background-repeat:repeat-y!important}.traffic-flow-graphic .traffic-flow-median{height:calc(var(--lane-h) + 2px)!important;margin-top:29px!important;width:10px!important;min-width:10px!important;background:linear-gradient(to right,#111 0 3px,transparent 3px 6px,#111 6px 9px,transparent 9px 100%)!important}.traffic-flow-graphic img.traffic-lane-icon,.leaflet-popup-content img.traffic-lane-icon{width:20px!important;height:20px!important;max-width:20px!important;max-height:20px!important;min-width:20px!important;min-height:20px!important;flex:0 0 20px!important}

.contra-flow-toolbar.refined{grid-template-columns:minmax(280px,1fr) minmax(240px,1fr) minmax(260px,1fr)!important}.contra-toolbar-card{gap:12px!important}.contra-toolbar-card h4{font-size:15px!important}.contra-toolbar-card label{font-size:13px!important}.contra-toolbar-card input,.contra-toolbar-card select{min-height:38px!important}.contra-flow-graphic-editor.traffic-flow-graphic{--lane-w:168px!important;--lane-h:auto!important;--median-w:12px!important;padding-bottom:14px!important}.contra-flow-graphic-editor .traffic-flow-road{overflow-x:auto!important;overflow-y:visible!important;padding:0 0 10px!important}.contra-flow-graphic-editor .traffic-flow-side{overflow:visible!important}.contra-flow-graphic-editor .traffic-flow-side-title{min-height:40px!important;margin-bottom:7px!important}.contra-flow-graphic-editor .traffic-flow-lane{width:var(--lane-w)!important;min-width:var(--lane-w)!important;max-width:var(--lane-w)!important;height:auto!important;min-height:238px!important;max-height:none!important;padding:10px!important;gap:8px!important;overflow:visible!important}.contra-flow-graphic-editor .traffic-flow-lane.open,.contra-flow-graphic-editor .traffic-flow-lane.contraflow,.contra-flow-graphic-editor .traffic-flow-lane.shoulder{background:#effaf2!important}.contra-flow-graphic-editor .traffic-flow-lane.closed{background:repeating-linear-gradient(135deg,#fff5f2 0,#fff5f2 7px,#ffe1dc 7px,#ffe1dc 13px)!important}.contra-flow-graphic-editor .traffic-lane-id{font-size:15px!important;line-height:18px!important;margin-bottom:4px!important}.contra-flow-graphic-editor .traffic-lane-direction{font-size:14px!important;line-height:16px!important}.contra-flow-graphic-editor .contra-state-button{min-height:62px!important;max-height:none!important;border-radius:10px!important}.contra-flow-graphic-editor .contra-width-label,.contra-flow-graphic-editor .contra-direction-label,.contra-flow-graphic-editor .contra-divider-label{font-size:13px!important;color:#334155!important;gap:5px!important}.contra-flow-graphic-editor .contra-width-label input,.contra-flow-graphic-editor .contra-direction-label select,.contra-flow-graphic-editor .contra-divider-label select{min-height:38px!important;font-size:13px!important}.contra-flow-graphic-editor .traffic-flow-divider{min-height:238px!important}.contra-flow-graphic-editor .traffic-flow-divider.barrier{width:5px!important}.contra-flow-graphic-editor .traffic-flow-divider.marking{width:10px!important;background:linear-gradient(to bottom,#111 0 10px,transparent 10px 18px)!important;background-size:10px 18px!important;background-repeat:repeat-y!important}.contra-flow-graphic-editor .traffic-flow-median{height:240px!important;margin-top:47px!important;width:12px!important;min-width:12px!important;background:linear-gradient(to right,#111 0 3px,transparent 3px 7px,#111 7px 10px,transparent 10px 100%)!important}.contra-flow-graphic-editor img.traffic-lane-icon{width:28px!important;height:28px!important;max-width:28px!important;max-height:28px!important;min-width:28px!important;min-height:28px!important;flex:0 0 28px!important}

@media (max-width:900px){.leaflet-popup-content{min-width:300px!important}.traffic-flow-graphic.contra{--lane-w:52px!important}.traffic-flow-graphic.normal{--lane-w:52px!important}.contra-flow-toolbar.refined{grid-template-columns:1fr!important}.lane-editor-row{grid-template-columns:1fr!important}.contra-flow-graphic-editor.traffic-flow-graphic{--lane-w:150px!important}.contra-flow-graphic-editor .traffic-flow-lane{min-height:230px!important}}

/* Patch 2G: finale Korrekturen Fahrstreifengrafik / Editor */
.leaflet-popup-content{min-width:340px!important;max-width:min(520px,92vw)!important}
.traffic-flow-graphic{padding:6px 0 8px!important}
.traffic-flow-graphic.normal{--lane-w:52px!important;--lane-h:76px!important}
.traffic-flow-graphic.contra{--lane-w:54px!important;--lane-h:82px!important}
.traffic-flow-graphic .traffic-flow-side{background:#fff!important}
.traffic-flow-graphic .traffic-flow-side.opposite,.traffic-flow-graphic .traffic-flow-side.own,.traffic-flow-graphic .traffic-flow-side.single{background:#fff!important}
.traffic-flow-graphic .traffic-flow-lane{justify-content:center!important;background:#eaf8ee!important;border-color:#111!important}
.traffic-flow-graphic .traffic-flow-lane.open{background:#eaf8ee!important}
.traffic-flow-graphic .traffic-flow-lane.closed{background:repeating-linear-gradient(135deg,#fff5f2 0,#fff5f2 7px,#ffd9d2 7px,#ffd9d2 14px)!important}
.traffic-flow-graphic .traffic-flow-lane.frontend-simple{gap:4px!important;padding:5px 3px!important}
.traffic-flow-graphic .traffic-flow-lane.frontend-simple .traffic-lane-width{display:block!important;font-size:10px!important;line-height:12px!important;font-weight:800!important;color:#17202a!important;max-width:100%!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;margin-top:2px!important}
.traffic-flow-graphic .traffic-flow-lane.frontend-simple.closed .traffic-lane-width{display:none!important}
.traffic-flow-graphic .traffic-flow-side-title{min-height:28px!important;font-size:11px!important;line-height:1.05!important;margin-bottom:5px!important}
.traffic-flow-side-direction-top{font-size:10px!important;line-height:1.05!important;color:#111827!important;font-weight:800!important}
.traffic-flow-divider{min-height:var(--lane-h)!important}
.traffic-flow-divider.barrier{width:4px!important;background:#111!important}
.traffic-flow-divider.marking{width:9px!important;background:linear-gradient(to right,transparent 0 3px,#111 3px 5px,transparent 5px 9px)!important;background-size:9px 16px!important;background-repeat:repeat-y!important}
.traffic-flow-median{margin-top:33px!important;height:calc(var(--lane-h) + 4px)!important}

.lane-config-card{overflow:visible!important}.lane-editor{gap:11px!important}.lane-editor-row{grid-template-columns:72px minmax(220px,1.2fr) minmax(170px,220px) minmax(220px,270px)!important;gap:10px!important;align-items:end!important}.lane-editor-cell{min-height:56px!important;font-weight:800!important}.lane-editor-row.state-open .lane-editor-cell{background:#eaf8ee!important;border-color:#bce6c8!important}.lane-editor-row.state-closed .lane-editor-cell{background:repeating-linear-gradient(135deg,#fff5f2 0,#fff5f2 7px,#ffd9d2 7px,#ffd9d2 14px)!important;border-color:#ffc3c3!important}.lane-drag-token.contraflow,.lane-drag-token.shoulder{display:none!important}.lane-divider-help{background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 10px;margin:8px 0 12px!important}.lane-divider-select-wrap select,.contra-divider-label select{font-weight:700}.lane-width-input{min-height:42px!important}

.contra-flow-toolbar.refined{grid-template-columns:minmax(300px,1fr) minmax(260px,1fr) minmax(280px,1fr)!important;gap:14px!important;margin-bottom:14px!important}.contra-toolbar-card{padding:14px!important;gap:12px!important}.contra-toolbar-card h4{font-size:15px!important;margin-bottom:3px!important}.contra-toolbar-card label{font-size:13px!important}.contra-toolbar-card input,.contra-toolbar-card select{min-height:40px!important}.contra-flow-graphic-editor.traffic-flow-graphic{--lane-w:168px!important;--lane-h:236px!important;--median-w:12px!important;overflow-x:auto!important;overflow-y:visible!important}.contra-flow-graphic-editor .traffic-flow-road{overflow:visible!important;align-items:flex-start!important}.contra-flow-graphic-editor .traffic-flow-side-title{min-height:42px!important;font-size:13px!important;margin-bottom:6px!important}.contra-flow-graphic-editor .traffic-flow-side-direction-top{font-size:12px!important}.contra-flow-graphic-editor .traffic-flow-lane{width:var(--lane-w)!important;min-width:var(--lane-w)!important;max-width:var(--lane-w)!important;height:auto!important;min-height:var(--lane-h)!important;max-height:none!important;padding:11px 10px 12px!important;gap:9px!important;overflow:visible!important;background:#eaf8ee!important}.contra-flow-graphic-editor .traffic-flow-lane.open{background:#eaf8ee!important}.contra-flow-graphic-editor .traffic-flow-lane.closed{background:repeating-linear-gradient(135deg,#fff5f2 0,#fff5f2 8px,#ffd9d2 8px,#ffd9d2 16px)!important}.contra-flow-graphic-editor .traffic-lane-id{font-size:15px!important;line-height:18px!important;margin-bottom:4px!important}.contra-flow-graphic-editor .traffic-lane-icon{width:28px!important;height:28px!important;max-width:28px!important;max-height:28px!important}.contra-flow-graphic-editor .contra-state-button{min-height:66px!important;max-height:none!important;gap:7px!important;overflow:visible!important}.contra-flow-graphic-editor .traffic-lane-direction{font-size:14px!important;line-height:18px!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}.contra-flow-graphic-editor .contra-width-label,.contra-flow-graphic-editor .contra-direction-label,.contra-flow-graphic-editor .contra-divider-label{font-size:13px!important;gap:5px!important}.contra-flow-graphic-editor .contra-width-label input,.contra-flow-graphic-editor .contra-direction-label select,.contra-flow-graphic-editor .contra-divider-label select{min-height:39px!important;font-size:13px!important}.contra-flow-graphic-editor .traffic-flow-divider{min-height:var(--lane-h)!important}.contra-flow-graphic-editor .traffic-flow-divider.barrier{width:5px!important}.contra-flow-graphic-editor .traffic-flow-divider.marking{width:10px!important;background:linear-gradient(to right,transparent 0 3px,#111 3px 5px,transparent 5px 10px)!important;background-size:10px 18px!important;background-repeat:repeat-y!important}.contra-flow-graphic-editor .traffic-flow-median{height:calc(var(--lane-h) + 8px)!important;margin-top:48px!important;width:12px!important;min-width:12px!important;max-width:12px!important;background:linear-gradient(to right,#111 0 3px,transparent 3px 7px,#111 7px 10px,transparent 10px 100%)!important}

@media (max-width:900px){.leaflet-popup-content{min-width:300px!important}.traffic-flow-graphic.contra{--lane-w:50px!important;--lane-h:78px!important}.contra-flow-toolbar.refined{grid-template-columns:1fr!important}.lane-editor-row{grid-template-columns:1fr!important}.contra-flow-graphic-editor.traffic-flow-graphic{--lane-w:150px!important;--lane-h:224px!important}}
.lane-editor-row.state-closed .lane-width-input{visibility:hidden!important}
.contra-flow-graphic-editor .traffic-flow-lane.closed .contra-width-label,
.contra-flow-graphic-editor .traffic-flow-lane.closed .contra-direction-label{display:none!important}

/* Patch 2H: mobile-sichere Fahrbahngrafik, echte gestrichelte Trennlinie, Seitenstreifen-Option */
.leaflet-popup-content{
  min-width:260px!important;
  width:auto!important;
  max-width:min(360px, calc(100vw - 52px))!important;
  overflow:visible!important;
}
.leaflet-popup-content-wrapper{max-width:calc(100vw - 28px)!important;overflow:visible!important}
.leaflet-popup-content .traffic-flow-graphic{max-width:100%!important;overflow:visible!important;padding:5px 0 4px!important}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-road{max-width:100%!important;overflow:visible!important;transform:none!important}
.leaflet-popup-content .traffic-flow-graphic.contra{--lane-w:34px!important;--lane-h:62px!important}
.leaflet-popup-content .traffic-flow-graphic.normal{--lane-w:40px!important;--lane-h:62px!important}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-side{border-width:2px!important;border-radius:4px!important;overflow:hidden!important}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane{width:var(--lane-w)!important;min-width:var(--lane-w)!important;max-width:var(--lane-w)!important;height:var(--lane-h)!important;min-height:var(--lane-h)!important;max-height:var(--lane-h)!important;padding:3px 2px!important;gap:3px!important;background:#eaf8ee!important}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane.closed{background:repeating-linear-gradient(135deg,#fff5f2 0,#fff5f2 7px,#ffd9d2 7px,#ffd9d2 14px)!important}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane.shoulder{background:#eaf8ee!important}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane-icon{width:17px!important;height:17px!important;min-width:17px!important;min-height:17px!important;max-width:17px!important;max-height:17px!important;flex:0 0 17px!important}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane.frontend-simple .traffic-lane-width{display:block!important;font-size:8.5px!important;line-height:10px!important;font-weight:800!important;letter-spacing:-.02em!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;margin-top:0!important}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane.frontend-simple.closed .traffic-lane-width{display:none!important}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-side-title{min-height:24px!important;max-width:100%!important;font-size:9px!important;line-height:1.05!important;margin-bottom:4px!important;overflow:hidden!important;text-overflow:ellipsis!important}
.leaflet-popup-content .traffic-flow-side-direction-top{font-size:9px!important;line-height:1.05!important}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-median{width:8px!important;min-width:8px!important;max-width:8px!important;height:calc(var(--lane-h) + 2px)!important;margin:28px 2px 0!important;background:linear-gradient(to right,#111 0 2px,transparent 2px 4px,#111 4px 6px,transparent 6px 100%)!important}
.traffic-flow-divider.marking,.traffic-flow-divider.marking.editor{
  width:6px!important;
  min-width:6px!important;
  max-width:6px!important;
  background:transparent!important;
  border-left:2px dashed #111!important;
}
.traffic-flow-divider.barrier,.traffic-flow-divider.barrier.editor{
  width:3px!important;
  min-width:3px!important;
  max-width:3px!important;
  background:#111!important;
  border-left:0!important;
}
.leaflet-popup-content .traffic-flow-divider.marking{width:5px!important;min-width:5px!important;max-width:5px!important;border-left:2px dashed #111!important;background:transparent!important}
.leaflet-popup-content .traffic-flow-divider.barrier{width:3px!important;min-width:3px!important;max-width:3px!important;background:#111!important}
.lane-drag-token.shoulder{background:#eaf8ee!important;border-color:#bce6c8!important;color:#126428!important}
.lane-editor-symbol.shoulder{background:#eaf8ee!important;color:#126428!important}
.lane-editor-row.state-shoulder .lane-editor-cell{background:#eaf8ee!important;border-color:#bce6c8!important}
.shoulder-heavy-row{margin-top:2px!important;margin-bottom:12px!important}
.contra-flow-graphic-editor .traffic-flow-divider.marking{border-left:2px dashed #111!important;background:transparent!important;width:10px!important;min-width:10px!important;max-width:10px!important}
.contra-flow-graphic-editor .traffic-flow-divider.barrier{background:#111!important;border-left:0!important;width:5px!important;min-width:5px!important;max-width:5px!important}
@media (max-width:420px){
  .leaflet-popup-content{min-width:250px!important;max-width:calc(100vw - 48px)!important;margin:10px 14px!important}
  .leaflet-popup-content .traffic-flow-graphic.contra{--lane-w:30px!important;--lane-h:58px!important}
  .leaflet-popup-content .traffic-flow-graphic.normal{--lane-w:34px!important;--lane-h:58px!important}
  .leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane-icon{width:15px!important;height:15px!important;min-width:15px!important;min-height:15px!important;max-width:15px!important;max-height:15px!important;flex-basis:15px!important}
  .leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane.frontend-simple .traffic-lane-width{font-size:8px!important;line-height:9px!important}
  .leaflet-popup-content .traffic-flow-graphic .traffic-flow-side-title{font-size:8px!important;min-height:22px!important}
  .leaflet-popup-content .traffic-flow-side-direction-top{font-size:8px!important}
}


/* Patch 2I: lesbare Breiten, kein leerer Weißblock, echte gestrichelte Trennlinie */
.leaflet-popup-content-wrapper,
.leaflet-popup-content{
  overflow:visible!important;
}
.leaflet-popup-content{
  min-width:286px!important;
  max-width:min(390px, calc(100vw - 42px))!important;
}
.leaflet-popup-content .traffic-flow-graphic{
  max-width:100%!important;
  overflow-x:auto!important;
  overflow-y:visible!important;
  padding:5px 0 6px!important;
}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-road{
  width:max-content!important;
  max-width:none!important;
  overflow:visible!important;
}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-side-wrap{
  align-items:center!important;
  flex:0 0 auto!important;
  width:auto!important;
  max-width:none!important;
}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-side{
  align-self:center!important;
  flex:0 0 auto!important;
  width:max-content!important;
  max-width:none!important;
}
.leaflet-popup-content .traffic-flow-graphic.contra{
  --lane-w:42px!important;
  --lane-h:64px!important;
}
.leaflet-popup-content .traffic-flow-graphic.normal{
  --lane-w:44px!important;
  --lane-h:64px!important;
}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane{
  width:var(--lane-w)!important;
  min-width:var(--lane-w)!important;
  max-width:var(--lane-w)!important;
  height:var(--lane-h)!important;
  min-height:var(--lane-h)!important;
  max-height:var(--lane-h)!important;
  padding:3px 2px!important;
  gap:3px!important;
}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane.frontend-simple .traffic-lane-width{
  display:block!important;
  max-width:none!important;
  width:auto!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:nowrap!important;
  font-size:8.5px!important;
  line-height:10px!important;
  letter-spacing:-.055em!important;
  font-weight:900!important;
  color:#111827!important;
  margin-top:0!important;
}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane.frontend-simple.closed .traffic-lane-width{
  display:none!important;
}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane-icon{
  width:16px!important;
  height:16px!important;
  min-width:16px!important;
  min-height:16px!important;
  max-width:16px!important;
  max-height:16px!important;
  flex:0 0 16px!important;
}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-side-title{
  min-height:24px!important;
  max-width:none!important;
  width:max-content!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:nowrap!important;
  font-size:9px!important;
  line-height:1.05!important;
  margin-bottom:4px!important;
}
.leaflet-popup-content .traffic-flow-side-direction-top{
  font-size:9px!important;
  line-height:1.05!important;
  white-space:nowrap!important;
}
.traffic-flow-divider.marking,
.traffic-flow-divider.marking.editor,
.leaflet-popup-content .traffic-flow-divider.marking,
.contra-flow-graphic-editor .traffic-flow-divider.marking{
  border-left:0!important;
  background:repeating-linear-gradient(to bottom,#111 0 4px,transparent 4px 9px)!important;
  background-position:center top!important;
  background-repeat:repeat-y!important;
  background-size:2px 9px!important;
  width:7px!important;
  min-width:7px!important;
  max-width:7px!important;
}
.traffic-flow-divider.barrier,
.traffic-flow-divider.barrier.editor,
.leaflet-popup-content .traffic-flow-divider.barrier,
.contra-flow-graphic-editor .traffic-flow-divider.barrier{
  border-left:0!important;
  background:#111!important;
  width:3px!important;
  min-width:3px!important;
  max-width:3px!important;
}
@media (max-width:420px){
  .leaflet-popup-content{
    min-width:260px!important;
    max-width:calc(100vw - 42px)!important;
  }
  .leaflet-popup-content .traffic-flow-graphic.contra{--lane-w:38px!important;--lane-h:62px!important}
  .leaflet-popup-content .traffic-flow-graphic.normal{--lane-w:40px!important;--lane-h:62px!important}
  .leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane.frontend-simple .traffic-lane-width{font-size:8px!important;letter-spacing:-.07em!important}
}

/* Patch 2I: Breiten lesbar, keine Stretch-Leerflächen, echte Strich-Markierung */
.leaflet-popup-content{
  min-width:280px!important;
  max-width:min(390px, calc(100vw - 44px))!important;
}
.leaflet-popup-content-wrapper{
  max-width:calc(100vw - 24px)!important;
  overflow:visible!important;
}
.leaflet-popup-content .traffic-flow-graphic{
  max-width:100%!important;
  overflow-x:auto!important;
  overflow-y:visible!important;
  padding:5px 0 7px!important;
}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-road{
  max-width:none!important;
  width:max-content!important;
  overflow:visible!important;
  align-items:flex-start!important;
}
.leaflet-popup-content .traffic-flow-side-wrap{
  align-items:center!important;
  width:max-content!important;
  max-width:none!important;
  flex:0 0 auto!important;
}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-side{
  align-self:center!important;
  width:max-content!important;
  max-width:none!important;
  flex:0 0 auto!important;
  display:inline-flex!important;
  overflow:hidden!important;
  background:transparent!important;
}
.leaflet-popup-content .traffic-flow-graphic.contra{
  --lane-w:44px!important;
  --lane-h:64px!important;
}
.leaflet-popup-content .traffic-flow-graphic.normal{
  --lane-w:46px!important;
  --lane-h:64px!important;
}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane{
  width:var(--lane-w)!important;
  min-width:var(--lane-w)!important;
  max-width:var(--lane-w)!important;
  height:var(--lane-h)!important;
  min-height:var(--lane-h)!important;
  max-height:var(--lane-h)!important;
  padding:4px 3px!important;
  gap:4px!important;
  overflow:hidden!important;
  background:#eaf8ee!important;
}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane.closed{
  background:repeating-linear-gradient(135deg,#fff5f2 0,#fff5f2 7px,#ffd9d2 7px,#ffd9d2 14px)!important;
}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane-icon{
  width:17px!important;
  height:17px!important;
  min-width:17px!important;
  min-height:17px!important;
  max-width:17px!important;
  max-height:17px!important;
  flex:0 0 17px!important;
}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane.frontend-simple .traffic-lane-width{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  font-size:8.8px!important;
  line-height:9.6px!important;
  font-weight:900!important;
  letter-spacing:-.02em!important;
  color:#111827!important;
  text-align:center!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane.frontend-simple.closed .traffic-lane-width{
  display:none!important;
}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-side-title{
  width:100%!important;
  min-height:22px!important;
  max-width:none!important;
  margin-bottom:4px!important;
  overflow:visible!important;
  white-space:normal!important;
  text-overflow:clip!important;
  font-size:9px!important;
  line-height:1.05!important;
}
.leaflet-popup-content .traffic-flow-side-title-main,
.leaflet-popup-content .traffic-flow-side-direction-top{
  display:block!important;
  overflow:visible!important;
  white-space:normal!important;
  text-overflow:clip!important;
}
.leaflet-popup-content .traffic-flow-side-direction-top{
  font-size:9px!important;
  line-height:1.05!important;
}
.leaflet-popup-content .traffic-flow-graphic .traffic-flow-median{
  width:6px!important;
  min-width:6px!important;
  max-width:6px!important;
  height:calc(var(--lane-h) + 2px)!important;
  margin:26px 0 0!important;
  background:linear-gradient(to right,#111 0 2px,transparent 2px 4px,#111 4px 6px)!important;
  align-self:center!important;
}
.leaflet-popup-content .traffic-flow-divider.marking,
.traffic-flow-divider.marking{
  width:6px!important;
  min-width:6px!important;
  max-width:6px!important;
  border-left:0!important;
  background:repeating-linear-gradient(to bottom,#111 0 5px,transparent 5px 10px)!important;
  background-size:2px 10px!important;
  background-position:center top!important;
  background-repeat:repeat-y!important;
}
.leaflet-popup-content .traffic-flow-divider.barrier,
.traffic-flow-divider.barrier{
  width:3px!important;
  min-width:3px!important;
  max-width:3px!important;
  border-left:0!important;
  background:#111!important;
}
.contra-flow-graphic-editor .traffic-flow-divider.marking{
  width:10px!important;
  min-width:10px!important;
  max-width:10px!important;
  border-left:0!important;
  background:repeating-linear-gradient(to bottom,#111 0 8px,transparent 8px 16px)!important;
  background-size:2px 16px!important;
  background-position:center top!important;
  background-repeat:repeat-y!important;
}
@media (max-width:420px){
  .leaflet-popup-content{min-width:260px!important;max-width:calc(100vw - 42px)!important;margin:10px 12px!important}
  .leaflet-popup-content .traffic-flow-graphic.contra{--lane-w:40px!important;--lane-h:62px!important}
  .leaflet-popup-content .traffic-flow-graphic.normal{--lane-w:42px!important;--lane-h:62px!important}
  .leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane-icon{width:15px!important;height:15px!important;min-width:15px!important;min-height:15px!important;max-width:15px!important;max-height:15px!important;flex-basis:15px!important}
  .leaflet-popup-content .traffic-flow-graphic .traffic-flow-lane.frontend-simple .traffic-lane-width{font-size:8.3px!important;line-height:9px!important}
}

/* Patch 2M: Frontend-Fahrbahngrafik wie Backend ausrichten
   Die Überschrift beeinflusst die Breite des Fahrbahnblocks nicht mehr.
   Dadurch sitzt die Mittelschutzplanke zwischen den tatsächlichen Fahrbahnkästen. */
.leaflet-popup-content .traffic-flow-graphic.contra .traffic-flow-road{
  align-items:flex-start!important;
  gap:0!important;
}
.leaflet-popup-content .traffic-flow-graphic.contra .traffic-flow-side-wrap{
  position:relative!important;
  display:block!important;
  flex:0 0 auto!important;
  width:max-content!important;
  min-width:max-content!important;
  max-width:none!important;
  padding-top:25px!important;
  overflow:visible!important;
}
.leaflet-popup-content .traffic-flow-graphic.contra .traffic-flow-side-title{
  position:absolute!important;
  top:0!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:max-content!important;
  min-width:0!important;
  max-width:118px!important;
  height:auto!important;
  min-height:21px!important;
  margin:0!important;
  padding:0!important;
  text-align:center!important;
  overflow:visible!important;
  white-space:normal!important;
  text-overflow:clip!important;
  z-index:1!important;
}
.leaflet-popup-content .traffic-flow-graphic.contra .traffic-flow-side{
  display:inline-flex!important;
  width:max-content!important;
  min-width:0!important;
  max-width:none!important;
  align-self:flex-start!important;
}
.leaflet-popup-content .traffic-flow-graphic.contra .traffic-flow-median{
  width:10px!important;
  min-width:10px!important;
  max-width:10px!important;
  height:var(--lane-h)!important;
  margin:25px 2px 0!important;
  align-self:flex-start!important;
  background:linear-gradient(to right,#111 0 3px,transparent 3px 7px,#111 7px 10px)!important;
  border-radius:0!important;
}
.leaflet-popup-content .traffic-flow-graphic.contra .traffic-flow-lane.frontend-simple .traffic-lane-width{
  font-size:9px!important;
  line-height:10px!important;
  letter-spacing:-.015em!important;
}
@media (max-width:420px){
  .leaflet-popup-content .traffic-flow-graphic.contra .traffic-flow-side-title{max-width:105px!important;font-size:8px!important}
  .leaflet-popup-content .traffic-flow-graphic.contra .traffic-flow-median{width:8px!important;min-width:8px!important;max-width:8px!important;margin-left:2px!important;margin-right:2px!important;background:linear-gradient(to right,#111 0 2px,transparent 2px 6px,#111 6px 8px)!important}
}

/* Patch 2N: manuell-Badge im öffentlichen Frontend ausblenden */
.badge.manual{display:none!important}

/* Patch 3L: sichtbare Stützpunkte für manuelle Polyline-Bearbeitung */
.map-edit-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:8px 0 10px}
.polyline-vertex-editor-marker{background:transparent!important;border:0!important}
.polyline-vertex-editor-marker span{display:block;width:14px;height:14px;border-radius:50%;background:#ffffff;border:3px solid #0f62fe;box-shadow:0 1px 5px rgba(0,0,0,.35);box-sizing:border-box}
.leaflet-marker-draggable.polyline-vertex-editor-marker span{cursor:move}

/* Patch 3M: Zwischenpunkte für bestehende Polylines einfügen */
.polyline-vertex-insert-marker{background:transparent!important;border:0!important;pointer-events:auto!important}
.polyline-vertex-insert-marker span{display:flex!important;align-items:center!important;justify-content:center!important;width:16px!important;height:16px!important;border-radius:50%!important;background:#16a34a!important;color:#fff!important;border:2px solid #fff!important;box-shadow:0 1px 5px rgba(0,0,0,.35)!important;font-size:13px!important;font-weight:900!important;line-height:1!important;box-sizing:border-box!important;cursor:pointer!important}
.leaflet-marker-draggable.polyline-vertex-insert-marker span{cursor:grab!important}

/* Patch 3M: Plus zum Einfügen neuer Polyline-Stützpunkte deutlicher darstellen */
.polyline-vertex-edit-active .leaflet-interactive{cursor:crosshair!important}
.polyline-vertex-insert-marker{z-index:3200!important}

/* Patch 3O: Übernahme alter Meldungsgeometrien auf aktuelle OSM-Segmente */
.legacy-geometry-tools{
  border:1px solid #facc15;
  background:#fffbea;
  border-radius:12px;
  padding:12px 14px;
  margin:10px 0 12px;
}
.legacy-geometry-tools strong{display:block;margin-bottom:4px;color:#713f12}
.legacy-geometry-grid{display:grid;grid-template-columns:160px minmax(220px,1fr) minmax(220px,1fr);gap:10px;align-items:end;margin:10px 0}
.legacy-geometry-grid label{display:flex;flex-direction:column;gap:5px;font-size:13px;font-weight:700;color:#374151}
.legacy-geometry-grid label.check-row{flex-direction:row;align-items:center;font-weight:700;margin:0}
.legacy-geometry-grid input[type="number"],.legacy-geometry-grid select{border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:#fff}
@media (max-width:800px){.legacy-geometry-grid{grid-template-columns:1fr}}

/* Patch 3P: Anschlussstellen-Beschriftung aus OSM motorway_junction */
.junction-label-marker{
  background:transparent!important;
  border:0!important;
  pointer-events:none!important;
  z-index:620!important;
}
.junction-label-marker span{
  display:inline-block;
  transform:translate(-50%,-125%);
  max-width:190px;
  padding:2px 6px;
  border:1px solid rgba(17,24,39,.35);
  border-radius:4px;
  background:rgba(255,255,255,.92);
  color:#111827;
  font-size:11px;
  line-height:1.15;
  font-weight:800;
  white-space:nowrap;
  box-shadow:0 1px 3px rgba(0,0,0,.16);
}
.leaflet-container .junction-label-marker span{
  user-select:none;
}
@media (max-width:700px){
  .junction-label-marker span{
    font-size:10px;
    padding:1px 5px;
    max-width:150px;
  }
}


/* Patch 3Q: manuelle Anschlussstellen-Labels */
.manual-junction-label-edit-marker{
  background:transparent!important;
  border:0!important;
  cursor:move!important;
  z-index:760!important;
}
.manual-junction-label-edit-marker span{
  display:inline-block;
  transform:translate(-50%,-125%);
  max-width:220px;
  padding:3px 7px;
  border:2px solid #0f62fe;
  border-radius:5px;
  background:rgba(255,255,255,.96);
  color:#111827;
  font-size:12px;
  line-height:1.15;
  font-weight:900;
  white-space:nowrap;
  box-shadow:0 2px 6px rgba(0,0,0,.22);
}
#osmManualJunctionMap.is-adding-label{
  cursor:crosshair;
}
#manualJunctionAddToggle.active{
  background:#eaf8ee;
  border-color:#bce6c8;
  color:#126428;
}
.manual-junction-popup{
  min-width:220px;
}
.manual-junction-popup input{
  width:100%;
  border:1px solid var(--line);
  border-radius:8px;
  padding:8px 9px;
  margin-top:4px;
}
.manual-junction-popup .popup-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:10px;
}

/* Patch 4A: Bedarfsumleitungen, Umleitungspfeile, Hybrid-Luftbild */
.route-arrow-marker.custom-diversion-a,
.route-arrow-marker.custom-diversion-b{
  width:24px!important;
  height:24px!important;
}
.route-arrow-marker.standard-diversion{
  width:18px!important;
  height:18px!important;
}
.route-arrow-marker.custom-diversion-a .route-arrow-svg,
.route-arrow-marker.custom-diversion-b .route-arrow-svg{
  width:24px!important;
  height:24px!important;
  color:#0f62fe!important;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.28)) drop-shadow(0 0 2px #fff)!important;
}
.route-arrow-marker.standard-diversion .route-arrow-svg{
  width:18px!important;
  height:18px!important;
  color:#0f62fe!important;
  filter:drop-shadow(0 0 2px #fff)!important;
}
.standard-diversion-sign-marker{
  background:transparent!important;
  border:0!important;
  pointer-events:none!important;
}
.standard-diversion-sign{
  box-sizing:border-box;
  width:42px;
  height:56px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:3px;
  padding-top:5px;
  border-radius:6px;
  border:3px solid #fff;
  outline:2px solid #111;
  background:#174f91;
  color:#fff;
  box-shadow:0 1px 4px rgba(0,0,0,.34);
  font-family:"DIN 1452", "DIN 1451", "Bahnschrift", "Arial Narrow", Arial, sans-serif;
  font-weight:700;
  line-height:1;
}
.standard-diversion-sign .u-ref{
  display:block;
  font-size:17px;
  letter-spacing:.02em;
  white-space:nowrap;
}
.standard-diversion-sign .u-arrow{
  display:block;
  font-size:29px;
  line-height:28px;
  font-weight:900;
}
@media (max-width:700px){
  .standard-diversion-sign{transform:scale(.88);transform-origin:bottom center}
}

/* Patch 4B: Bedarfsumleitungsschild nur in Meldung, farbige Umleitungslinien */
.color-chip{display:inline-block;width:22px;height:14px;border-radius:4px;border:1px solid #94a3b8;vertical-align:middle;margin-right:6px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.45)}
.color-picker-inline{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}.color-picker-inline input[type="color"]{width:38px;height:30px;padding:1px;border:1px solid var(--line);border-radius:6px;background:#fff}
.form-row input[type="color"]{width:58px;height:40px;padding:2px;border:1px solid var(--line);border-radius:8px;background:#fff}
.route-arrow-marker.custom-diversion-a,.route-arrow-marker.custom-diversion-b{width:30px!important;height:30px!important}.route-arrow-marker.custom-diversion-a .route-arrow-svg,.route-arrow-marker.custom-diversion-b .route-arrow-svg{width:30px!important;height:30px!important;filter:drop-shadow(0 1px 1px rgba(0,0,0,.28)) drop-shadow(0 0 2px #fff)!important}.route-arrow-marker.standard-diversion .route-arrow-svg{filter:drop-shadow(0 0 2px #fff)!important}
.popup-standard-diversion{display:flex;align-items:center;gap:10px;margin-top:8px}.standard-diversion-description{font-size:13px;color:#334155;line-height:1.25}.standard-diversion-sign{box-sizing:border-box;display:inline-flex;flex:0 0 auto;flex-direction:column;align-items:center;justify-content:flex-start;gap:3px;border-radius:6px;border:3px solid #fff;outline:2px solid #111;background:#174f91;color:#fff;box-shadow:0 1px 4px rgba(0,0,0,.34);font-family:"DIN 1452", "DIN 1451", "Bahnschrift", "Arial Narrow", Arial, sans-serif;font-weight:700;line-height:1}.standard-diversion-sign .u-ref{display:block;letter-spacing:.02em;white-space:nowrap}.standard-diversion-sign .u-arrow{display:block;font-weight:900}.standard-diversion-sign-popup{width:42px;height:56px;padding-top:5px}.standard-diversion-sign-popup .u-ref{font-size:17px}.standard-diversion-sign-popup .u-arrow{font-size:29px;line-height:28px}.standard-diversion-sign-list{width:28px;height:38px;padding-top:3px;border-width:2px;outline-width:1.5px;border-radius:5px;box-shadow:0 1px 2px rgba(0,0,0,.25)}.standard-diversion-sign-list .u-ref{font-size:11px}.standard-diversion-sign-list .u-arrow{font-size:19px;line-height:18px}.message-standard-diversion{display:flex;align-items:center;gap:8px;margin-top:7px;font-size:12px;font-weight:700;color:#334155}.standard-diversion-sign-marker{display:none!important}
@media (max-width:700px){.popup-standard-diversion{align-items:flex-start}.standard-diversion-sign-popup{transform:scale(.9);transform-origin:top left}}

/* Patch 4C: modifizierte Bedarfsumleitungen und Hinweistafeln */
.notice-image-admin-preview{display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap;margin-top:8px}
.notice-image-admin-preview img{display:block;max-width:220px;max-height:160px;object-fit:contain;border:1px solid var(--line);border-radius:10px;background:#fff;padding:4px;box-shadow:0 1px 4px rgba(0,0,0,.08)}
.diversion-notice-image-wrap{margin-top:10px;max-width:100%}
.diversion-notice-image-button{display:block;border:0;background:transparent;padding:0;margin:0;cursor:zoom-in;max-width:100%;text-align:left}
.diversion-notice-image{display:block;max-width:min(100%, 260px);max-height:150px;width:auto;height:auto;object-fit:contain;border:1px solid var(--line);border-radius:10px;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.message-card .message-standard-diversion .standard-diversion-sign-list{flex:0 0 auto}
.diversion-lightbox{position:fixed;inset:0;z-index:5000;display:none;align-items:center;justify-content:center;background:rgba(15,23,42,.82);padding:18px}
.diversion-lightbox.open{display:flex}
.diversion-lightbox img{display:block;max-width:min(96vw,980px);max-height:92vh;width:auto;height:auto;object-fit:contain;border-radius:12px;background:#fff;box-shadow:0 12px 45px rgba(0,0,0,.45)}
.diversion-lightbox-close{position:fixed;top:12px;right:16px;width:42px;height:42px;border:1px solid rgba(255,255,255,.55);border-radius:999px;background:rgba(255,255,255,.96);font-size:30px;line-height:38px;cursor:pointer;color:#111827}
.standard-diversion-admin-route{display:flex;align-items:center;gap:10px}.standard-diversion-sign-mini{width:34px;height:44px;padding-top:3px;border-width:2px;outline-width:1.5px;border-radius:5px}.standard-diversion-sign-mini .u-ref{font-size:13px}.standard-diversion-sign-mini .u-arrow{font-size:22px;line-height:20px}
@media (max-width:700px){.diversion-notice-image{max-width:100%;max-height:150px}.diversion-lightbox{padding:10px}.diversion-lightbox-close{top:8px;right:8px}}

/* Patch 4D: robustere Stützpunkt-Bearbeitung */
.polyline-vertex-editor-marker{background:transparent!important;border:0!important;pointer-events:auto!important}
.polyline-vertex-editor-marker .polyline-vertex-dot{display:block!important;position:absolute!important;left:7px!important;top:7px!important;width:16px!important;height:16px!important;border-radius:50%!important;background:#fff!important;border:3px solid #0f62fe!important;box-shadow:0 1px 5px rgba(0,0,0,.35)!important;box-sizing:border-box!important;cursor:move!important}
.polyline-vertex-editor-marker .polyline-vertex-delete{display:flex!important;align-items:center!important;justify-content:center!important;position:absolute!important;right:-4px!important;top:-4px!important;width:16px!important;height:16px!important;border-radius:50%!important;border:2px solid #fff!important;background:#dc2626!important;color:#fff!important;font-size:13px!important;font-weight:900!important;line-height:1!important;padding:0!important;margin:0!important;box-shadow:0 1px 5px rgba(0,0,0,.35)!important;cursor:pointer!important;z-index:2!important}
.polyline-vertex-editor-marker .polyline-vertex-delete:hover{background:#991b1b!important}
.polyline-vertex-edit-active .leaflet-interactive{cursor:crosshair!important}


/* Patch 4F: Hinweistafel auch in der Meldungsliste, kompaktere Anzeige */
.message-diversion-notice{margin-top:8px;max-width:100%}
.message-diversion-notice-button{display:inline-block;border:0;background:transparent;padding:0;margin:0;cursor:zoom-in;text-align:left;max-width:100%}
.message-diversion-notice-image{display:block;max-width:110px;max-height:74px;width:auto;height:auto;object-fit:contain;border:1px solid var(--line);border-radius:8px;background:#fff;box-shadow:0 1px 5px rgba(0,0,0,.16)}
@media (max-width:700px){.message-diversion-notice-image{max-width:96px;max-height:70px}}


/* Patch 4G: Meldungsliste scrollbar, Listenvorschau ohne Lightbox, große Umleitungspfeile */
.sidebar{height:100vh!important;max-height:100vh!important;overflow:hidden!important}
.list-panel{min-height:0!important;flex:1 1 auto!important;overflow:hidden!important}
.message-list{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain!important;-webkit-overflow-scrolling:touch!important}
.message-diversion-notice{margin-top:8px;max-width:100%;pointer-events:none!important}
.message-diversion-notice-button{cursor:default!important;pointer-events:none!important}
.message-diversion-notice-image{display:block;max-width:96px!important;max-height:64px!important;width:auto;height:auto;object-fit:contain;border:1px solid var(--line);border-radius:8px;background:#fff;box-shadow:0 1px 5px rgba(0,0,0,.16)}
.route-arrow-marker.custom-diversion-a,
.route-arrow-marker.custom-diversion-b,
.route-arrow-marker.standard-diversion{width:30px!important;height:30px!important}
.route-arrow-marker.custom-diversion-a .route-arrow-svg,
.route-arrow-marker.custom-diversion-b .route-arrow-svg,
.route-arrow-marker.standard-diversion .route-arrow-svg{width:30px!important;height:30px!important;filter:drop-shadow(0 1px 1px rgba(0,0,0,.28)) drop-shadow(0 0 2px #fff)!important}
@media (max-width:900px){.sidebar{height:100vh!important;max-height:100vh!important}.message-list{padding-bottom:18px!important}}


/* Patch 4H: parallele Pfeilspuren für bidirektionale Umleitungen */
.route-arrow-marker.custom-diversion-a,
.route-arrow-marker.custom-diversion-b,
.route-arrow-marker.standard-diversion{width:30px!important;height:30px!important}
.route-arrow-marker.custom-diversion-a .route-arrow-svg,
.route-arrow-marker.custom-diversion-b .route-arrow-svg,
.route-arrow-marker.standard-diversion .route-arrow-svg{width:30px!important;height:30px!important}

/* Patch 5: Bearbeitungsstatus und Historie */
.notice.warning{background:#fff7e6;border-color:#ffd37a;color:#624000}.edit-meta-box{display:grid;gap:6px;border:1px solid #d8e1ee;background:#f8fafc;border-radius:12px;padding:10px 12px;margin:8px 0 16px}.edit-lock-badge{display:inline-flex;align-items:center;gap:6px;border:1px solid #ffb347;background:#fff3d6;color:#6b3d00;border-radius:999px;padding:3px 8px;font-size:12px;font-weight:800}.row-edit-locked{background:#fff9ed}.row-edit-locked td:first-child{box-shadow:inset 4px 0 #ffb347}.history-box{border-top:1px solid var(--line);margin-top:18px;padding-top:14px}.history-box h2{font-size:20px;margin:0 0 10px}.admin-table.compact th,.admin-table.compact td{padding:7px 9px}.edit-lock-notice{margin:0 0 12px}.admin-table td .edit-lock-badge{white-space:nowrap}

/* Patch 5B: Kartenstartpunkt in Einstellungen */
.settings-map{
  height:360px!important;
  min-height:320px!important;
  margin:10px 0 22px!important;
  border:1px solid var(--line)!important;
  border-radius:12px!important;
  overflow:hidden!important;
}
@media (max-width:700px){.settings-map{height:300px!important;min-height:280px!important}}

/* Patch 5C: kompakter Frontend-Filter als Dropdown */
.filter-dropdown-panel{
  position:relative!important;
  z-index:650!important;
  padding:9px 16px!important;
  background:var(--panel-soft)!important;
}
.filter-dropdown{
  position:relative!important;
}
.filter-dropdown-button{
  width:100%!important;
  min-height:38px!important;
  border:1px solid var(--line)!important;
  border-radius:10px!important;
  background:#fff!important;
  display:grid!important;
  grid-template-columns:auto 1fr auto!important;
  align-items:center!important;
  gap:8px!important;
  padding:8px 10px!important;
  cursor:pointer!important;
  box-shadow:0 1px 3px rgba(0,0,0,.04)!important;
  text-align:left!important;
}
.filter-dropdown-button:hover,
.filter-dropdown.open .filter-dropdown-button{
  border-color:#b9c7d6!important;
  box-shadow:0 2px 8px rgba(0,0,0,.08)!important;
}
.filter-dropdown-title{
  font-size:13px!important;
  font-weight:800!important;
  color:var(--text)!important;
}
.filter-dropdown-summary{
  font-size:13px!important;
  color:var(--muted)!important;
  overflow:hidden!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
  min-width:0!important;
}
.filter-dropdown-arrow{
  color:var(--muted)!important;
  transition:transform .16s ease!important;
}
.filter-dropdown.open .filter-dropdown-arrow{
  transform:rotate(180deg)!important;
}
.filter-dropdown-menu{
  position:absolute!important;
  left:0!important;
  right:0!important;
  top:calc(100% + 6px)!important;
  z-index:900!important;
  background:#fff!important;
  border:1px solid var(--line)!important;
  border-radius:12px!important;
  box-shadow:var(--shadow)!important;
  padding:8px 10px!important;
}
.filter-dropdown-menu label{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  margin:0!important;
  padding:8px 4px!important;
  border-radius:8px!important;
  font-size:14px!important;
  cursor:pointer!important;
}
.filter-dropdown-menu label:hover{
  background:#f4f7fb!important;
}
.filter-dropdown-menu input[type="checkbox"]{
  width:18px!important;
  height:18px!important;
  margin:0!important;
  flex:0 0 18px!important;
}
@media (max-width:900px){
  .filter-dropdown-panel{padding:8px 14px!important}
  .filter-dropdown-button{min-height:40px!important}
  .filter-dropdown-menu{max-height:48vh!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important}
}

/* Patch 5D: allgemeiner Hinweis, Wiederholungszeiten, Datenschutz/Frontend ohne Persistenz */
.general-notice{position:absolute;right:28px;top:34%;z-index:650;width:min(320px,calc(100vw - 92px));max-width:calc(100vw - 92px);max-height:calc(100vh - 120px);overflow:auto;background:#fff;border:4px solid #df001b;box-shadow:0 6px 18px rgba(0,0,0,.14);padding:18px 20px 22px;color:#111;line-height:1.45;white-space:normal;overflow-wrap:anywhere}.general-notice h2{font-size:19px;line-height:1.2;margin:0 34px 16px 0;text-decoration:underline;font-weight:900}.general-notice-body{font-size:15px;font-weight:700}.general-notice-close{position:absolute;right:-16px;top:-18px;width:30px;height:30px;border:2px solid #df001b;border-radius:50%;background:#fff;color:#df001b;font-size:24px;line-height:24px;font-weight:700;cursor:pointer}.general-notice-tab{position:absolute;right:0;top:42%;z-index:650;border:0;background:#df001b;color:#fff;font-weight:900;font-size:17px;line-height:1;box-shadow:0 3px 10px rgba(0,0,0,.2);padding:14px 7px;writing-mode:vertical-rl;text-orientation:mixed;cursor:pointer}.general-notice-tab::before{content:"";position:absolute;left:-31px;top:50%;transform:translateY(-50%);border-top:20px solid transparent;border-bottom:20px solid transparent;border-right:32px solid #df001b}.general-notice-tab span{display:block;letter-spacing:.02em}.recurrence-card{border:1px solid var(--line);border-radius:14px;background:#f8fafc;padding:12px 14px;margin:12px 0 16px}.recurrence-options[hidden]{display:none!important}.weekday-picker{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.weekday-picker label{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);border-radius:999px;background:#fff;padding:7px 10px;font-weight:700}.weekday-picker input{width:16px;height:16px}.recurrence-meta{display:inline-block;color:#334155;font-weight:700;margin-top:2px}.message-meta .recurrence-meta{font-size:12px;color:#4b5b70}.privacy-note{border:1px solid #dbe4ef;background:#f8fafc;border-radius:10px;padding:10px 12px;color:#405060}.privacy-note code{background:#eef2f7;border-radius:4px;padding:1px 4px}
@media (max-width:700px){.general-notice{right:16px;left:16px;top:auto;bottom:18px;width:auto;max-width:none;max-height:45vh;padding:14px 16px}.general-notice h2{font-size:16px}.general-notice-body{font-size:14px}.general-notice-tab{top:auto;bottom:88px}.general-notice-close{right:-10px;top:-14px}}


/* Patch 5E: Hinweisfeld standardmäßig eingeklappt, kompakter ohne Scrollbar */
.general-notice,
.general-notice-panel{
  right:24px!important;
  top:30%!important;
  width:min(285px,calc(100vw - 78px))!important;
  max-width:calc(100vw - 78px)!important;
  max-height:none!important;
  overflow:visible!important;
  padding:13px 15px 15px!important;
  border-width:3px!important;
  line-height:1.34!important;
  box-sizing:border-box!important;
  white-space:normal!important;
  overflow-wrap:break-word!important;
  word-break:normal!important;
  hyphens:auto!important;
}
.general-notice h2,
.general-notice-panel h2{
  font-size:16px!important;
  line-height:1.15!important;
  margin:0 30px 10px 0!important;
}
.general-notice-body,
.general-notice-text{
  font-size:13px!important;
  line-height:1.36!important;
  font-weight:700!important;
  max-height:none!important;
  overflow:visible!important;
}
.general-notice-close{
  right:6px!important;
  top:6px!important;
  z-index:5!important;
  width:24px!important;
  height:24px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:#fff!important;
  color:#df001b!important;
  border:2px solid #df001b!important;
  border-radius:50%!important;
  font-size:18px!important;
  line-height:1!important;
  box-shadow:0 2px 7px rgba(0,0,0,.16)!important;
}
.general-notice-tab{
  right:0!important;
  top:42%!important;
  font-size:15px!important;
  padding:12px 6px!important;
}
.general-notice-tab span{font-size:15px!important;line-height:1!important}
.general-notice-tab::before{
  left:-27px!important;
  border-top-width:17px!important;
  border-bottom-width:17px!important;
  border-right-width:28px!important;
}
@media (max-width:700px){
  .general-notice,
  .general-notice-panel{
    right:12px!important;
    left:12px!important;
    bottom:14px!important;
    top:auto!important;
    width:auto!important;
    max-width:none!important;
    max-height:none!important;
    padding:12px 14px 14px!important;
    overflow:visible!important;
  }
  .general-notice h2,
  .general-notice-panel h2{font-size:15px!important;margin-right:28px!important}
  .general-notice-body,
  .general-notice-text{font-size:12.5px!important;line-height:1.34!important}
  .general-notice-close{right:6px!important;top:6px!important;width:23px!important;height:23px!important;font-size:17px!important}
  .general-notice-tab{top:auto!important;bottom:84px!important;font-size:14px!important}
  .general-notice-tab span{font-size:14px!important;padding:10px 6px!important}
}

/* Patch 5F: Rechtliches, Geschwindigkeitsanzeige, incident4partner-Polylinefilter */
.frontend-legal-links{
  position:absolute;
  right:10px;
  bottom:38px;
  z-index:900;
  display:flex;
  gap:8px;
  align-items:center;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(0,0,0,.12);
  border-radius:8px;
  padding:5px 8px;
  box-shadow:0 1px 5px rgba(0,0,0,.12);
  font-size:12px;
}
.frontend-legal-links a{color:#334155;text-decoration:none;font-weight:650}.frontend-legal-links a:hover{text-decoration:underline}
.legal-page-body{margin:0;background:#eef2f7;color:#17202a;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.legal-page-card{max-width:880px;margin:28px auto;padding:28px;background:#fff;border:1px solid #d7dee8;border-radius:14px;box-shadow:0 8px 28px rgba(15,23,42,.08)}.legal-page-card h1{margin-top:0}.legal-page-content{white-space:normal;line-height:1.55;font-size:15px}.legal-page-content p{margin:0 0 12px}
.speed-limit-section{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.speed-limit-sign{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:4px solid #c91523;border-radius:50%;background:#fff;color:#111;font-weight:900;font-size:16px;line-height:1;box-sizing:border-box}.speed-limit-sign.small{width:28px;height:28px;border-width:3px;font-size:12px}.speed-limit-text{font-weight:700;color:#334155}.message-speed-limit{display:flex;align-items:center;gap:5px;margin-top:6px;font-size:12px;font-weight:700;color:#334155}.settings-details{border:1px solid var(--line);border-radius:12px;background:#f8fafc;padding:10px 12px;margin:12px 0}.settings-details summary{font-weight:800;cursor:pointer}.settings-map{min-height:360px}.privacy-note p{margin:.4rem 0}
@media (max-width:640px){.frontend-legal-links{right:8px;bottom:38px;font-size:11px;padding:4px 6px}.legal-page-card{margin:10px;padding:18px;border-radius:10px}.speed-limit-sign{width:34px;height:34px;font-size:15px;border-width:3px}}


/* Patch 5G: Formularlayout, Fahrstreifen-Tempo, Footer-Abstand */
.grid .form-row.wide{grid-column:1 / -1}
.lane-editor-row{grid-template-columns:72px minmax(200px,1fr) minmax(150px,190px) minmax(140px,180px) minmax(220px,270px)!important;align-items:end!important}
.lane-speed-input{border:1px solid var(--line);border-radius:9px;padding:10px 12px;width:100%;min-height:42px!important;background:#fff}
.lane-speed-input:disabled{background:#f3f4f6!important;color:#94a3b8!important}
.contra-flow-graphic-editor.traffic-flow-graphic{--lane-w:178px!important}
.contra-flow-graphic-editor .traffic-flow-lane{min-height:276px!important}
.contra-flow-graphic-editor .contra-speed-label{width:100%;font-size:13px!important;color:#334155!important;gap:5px!important;display:flex;flex-direction:column;font-weight:700}
.contra-flow-graphic-editor .contra-speed-label input{width:100%;min-height:39px!important;font-size:13px;padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:#fff}
.contra-flow-graphic-editor .contra-speed-label input:disabled{background:#f3f4f6!important;color:#94a3b8!important}
.traffic-lane-speed{display:flex;align-items:center;justify-content:center;margin-top:1px;line-height:1}
.speed-limit-sign.mini{width:25px!important;height:25px!important;border-width:3px!important;font-size:10px!important;font-weight:900!important;line-height:1!important;background:#fff!important;color:#111!important;box-sizing:border-box!important}
.traffic-flow-graphic.has-lane-speed.normal{--lane-h:88px!important}
.traffic-flow-graphic.has-lane-speed.contra{--lane-h:94px!important}
.traffic-flow-graphic.has-lane-speed .traffic-flow-median{height:var(--lane-h)!important}
.leaflet-popup-content .traffic-flow-graphic.has-lane-speed.normal{--lane-h:78px!important}
.leaflet-popup-content .traffic-flow-graphic.has-lane-speed.contra{--lane-h:84px!important}
.leaflet-popup-content .traffic-flow-graphic.has-lane-speed .traffic-flow-lane.frontend-simple{gap:2px!important;padding-top:4px!important;padding-bottom:4px!important}
.leaflet-popup-content .speed-limit-sign.mini{width:23px!important;height:23px!important;font-size:9px!important;border-width:3px!important}
@media (max-width:900px){.lane-editor-row{grid-template-columns:1fr!important}.contra-flow-graphic-editor.traffic-flow-graphic{--lane-w:158px!important}.contra-flow-graphic-editor .traffic-flow-lane{min-height:268px!important}}
@media (max-width:640px){.frontend-legal-links{bottom:38px!important}}


/* Patch 5H: Rechtliche Links sauber oberhalb Leaflet-Attribution, Rechtseiten-Button oben rechts */
.leaflet-bottom{
  padding-bottom:0!important;
}
.leaflet-control-attribution{
  margin-bottom:0!important;
}
.frontend-legal-links{
  bottom:42px!important;
  right:10px!important;
  z-index:910!important;
}
.legal-page-card{
  position:relative!important;
}
.legal-page-header{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:18px!important;
  margin-bottom:18px!important;
}
.legal-page-header h1{
  margin:0!important;
  flex:1 1 auto!important;
  padding-right:12px!important;
}
.legal-back-button{
  flex:0 0 auto!important;
  white-space:nowrap!important;
  align-self:flex-start!important;
}
@media (max-width:640px){
  .frontend-legal-links{
    bottom:42px!important;
    right:8px!important;
  }
  .legal-page-header{
    align-items:flex-start!important;
    gap:10px!important;
  }
  .legal-page-header h1{
    font-size:28px!important;
    line-height:1.15!important;
  }
  .legal-back-button{
    padding:9px 11px!important;
  }
}

.legal-page-back,.legal-back-button{flex:0 0 auto!important;white-space:nowrap!important;align-self:flex-start!important}

/* Patch 5I: Abstand Rechtliches-Linkbox zur Leaflet-Attribution */
.frontend-legal-links{
  bottom:30px!important;
}
@media (max-width:640px){
  .frontend-legal-links{bottom:30px!important;}
}


/* Patch 5I: Position der Impressum-/Datenschutz-Zeile */
.frontend-legal-links{
  bottom:30px!important;
}
@media (max-width:640px){
  .frontend-legal-links{
    bottom:30px!important;
  }
}


/* Patch 5I: Rechtliche Links exakt positionieren */
.frontend-legal-links{
  bottom:30px!important;
}
@media (max-width:640px){
  .frontend-legal-links{bottom:30px!important;}
}


/* Patch 5I: Abstand Impressum/Datenschutz-Zeile */
.frontend-legal-links{
  bottom:30px!important;
}
@media (max-width:640px){
  .frontend-legal-links{bottom:30px!important}
}

/* Patch 6A language switch and translations backend */
.language-switch{display:flex;gap:4px;align-items:center;margin-left:auto}
.language-switch a{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:28px;border:1px solid var(--line);border-radius:8px;background:#fff;color:#1f2937;text-decoration:none;font-weight:800;font-size:12px}
.language-switch a.active{background:#0f62fe;border-color:#0f62fe;color:#fff}
.translations-table input{width:100%;min-width:180px;border:1px solid var(--line);border-radius:8px;padding:8px 10px}
.translations-table code{font-size:12px}
.settings-details{border:1px solid var(--line);border-radius:12px;background:#f8fafc;padding:10px 12px;margin:10px 0 18px}
.settings-details summary{font-weight:800;cursor:pointer}
@media(max-width:760px){.brand{gap:10px}.language-switch{margin-left:0}.language-switch a{min-width:32px;height:26px}}

/* Patch 6C custom translation terms */
.translations-custom-card{border:1px solid var(--line);border-radius:14px;background:#f8fafc;padding:14px 16px;margin:18px 0}.translations-custom-card h2{margin-top:0}.button.small{padding:5px 8px;font-size:12px}.translations-table .button.danger{border-color:#ffc3c3;background:#fff;color:#a40000}

/* Patch 7A: HERE Traffic API v7 Aktivierung und Darstellung */
.traffic-toggle.loading{opacity:.75;cursor:progress}
.traffic-consent-backdrop{position:fixed;inset:0;z-index:5000;background:rgba(15,23,42,.42);display:flex;align-items:center;justify-content:center;padding:18px}
.traffic-consent-dialog{width:min(520px,calc(100vw - 36px));background:#fff;border-radius:16px;border:1px solid var(--line);box-shadow:0 18px 48px rgba(0,0,0,.25);padding:22px 24px;color:#17202a}
.traffic-consent-dialog h2{margin:0 0 12px;font-size:22px;line-height:1.2}
.traffic-consent-dialog p{font-size:15px;line-height:1.48;margin:0 0 18px;color:#334155}
.traffic-consent-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.traffic-consent-actions .button{border:1px solid var(--line);border-radius:10px;background:#fff;padding:10px 14px;font-weight:800;cursor:pointer}
.traffic-consent-actions .button.primary{background:var(--accent);border-color:var(--accent);color:#fff}
@media(max-width:520px){.traffic-consent-actions{justify-content:stretch}.traffic-consent-actions .button{width:100%}}


/* Patch 7D: Live-Traffic-Button neben Layer-Control und HERE unter Baustellen-Polylines */
.traffic-toggle{
  right:75px!important;
}
@media (max-width:900px){
  .traffic-toggle{right:70px!important;}
}
@media (max-width:640px){
  .traffic-toggle{right:12px!important;top:60px!important;max-width:calc(100vw - 24px);}
}
.leaflet-pane.leaflet-hereTrafficPane{z-index:430!important}
.leaflet-pane.leaflet-messageLinePane{z-index:520!important}

/* Patch 8A: API-Budgetverwaltung */
.api-budget-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px;margin:10px 0 22px}.api-budget-card{border:1px solid var(--line);border-radius:14px;background:#fff;padding:16px}.api-budget-card.warning{border-color:#f5a623;background:#fffaf0}.api-budget-card.limit-reached{border-color:#dc2626;background:#fff5f5}.api-budget-card h3{margin:0 0 12px;font-size:18px}.api-budget-status{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin:12px 0}.api-budget-status>div{background:#f8fafc;border:1px solid var(--line);border-radius:12px;padding:10px}.api-budget-card.warning .api-budget-status>div{background:#fff7ed}.api-budget-card.limit-reached .api-budget-status>div{background:#fee2e2}.api-budget-status strong{display:block;font-size:20px;line-height:1.1}.api-budget-status span{display:block;margin-top:4px;color:var(--muted);font-size:12px;line-height:1.25}@media (max-width:700px){.api-budget-grid{grid-template-columns:1fr}.api-budget-status{grid-template-columns:1fr 1fr}}

/* Patch 8B: Reisezeiten-Grundmodul */
.page-headline-row{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:14px}.page-headline-row h1{margin-top:0}.travel-time-stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:14px 0 18px}.travel-time-stats>div{border:1px solid var(--line);border-radius:12px;background:#f8fafc;padding:12px}.travel-time-stats strong{display:block;font-size:24px;line-height:1;color:#0f172a}.travel-time-stats span{display:block;margin-top:6px;font-size:12px;color:var(--muted)}.travel-time-note{line-height:1.45}.travel-chain-card{border:1px solid var(--line);border-radius:14px;background:#fff;margin:18px 0;padding:14px}.travel-chain-card>header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}.travel-chain-card h2{margin:0 0 4px;font-size:20px}.travel-routes-table td{vertical-align:top}.travel-routes-table input{border:1px solid var(--line);border-radius:8px;padding:8px 9px;width:100%;background:#fff}.travel-routes-table .sort-input{width:86px}.travel-route-active{margin:0 0 8px!important}.travel-disabled-reason{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:700;color:var(--muted)}.coord-pair{font-size:12px;line-height:1.45;color:#334155}.route-disabled{background:#f8fafc;color:#64748b}.route-disabled strong{color:#64748b}.route-disabled td:first-child{border-left:4px solid #94a3b8}.sticky-savebar{position:sticky;bottom:10px;z-index:20;background:rgba(255,255,255,.94);border:1px solid var(--line);border-radius:12px;padding:10px 12px;box-shadow:0 8px 24px rgba(15,23,42,.12);display:flex;gap:12px;align-items:center;margin-top:18px}@media(max-width:900px){.page-headline-row{flex-direction:column}.travel-time-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.sticky-savebar{flex-direction:column;align-items:stretch}.travel-routes-table{min-width:980px}}@media(max-width:520px){.travel-time-stats{grid-template-columns:1fr}}

/* Patch 8D/8E: Reisezeiten-Cronstatus */
.travel-time-status-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:14px 0 18px}
.metric-card{border:1px solid var(--line,#d8e1ee);border-radius:12px;background:#fff;padding:14px 16px;box-shadow:0 2px 8px rgba(15,23,42,.04)}
.metric-card strong{display:block;font-size:1.15rem;margin-bottom:4px;color:#17202b}
.metric-card span{display:block;color:var(--muted,#64748b);font-size:.9rem}
.text-danger{color:#b91c1c}
.notice.ok{background:#eaf8ee;border:1px solid #bce6c8;color:#126428;padding:12px;border-radius:10px;margin-bottom:14px}
.notice.error{background:#ffebeb;border:1px solid #ffc3c3;color:#9f1111;padding:12px;border-radius:10px;margin-bottom:14px}

/* Patch 8F: Frontend-Reisezeitenbox */
.travel-times-panel{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff;padding:10px 14px}
.travel-times-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--line);border-radius:10px;background:#f8fafc;padding:9px 11px;font-weight:800;color:#17202a;cursor:pointer;box-shadow:0 1px 2px rgba(15,23,42,.04)}
.travel-times-toggle:hover{background:#f1f5f9}.travel-times-toggle-icon{transition:transform .16s ease}.travel-times-toggle.collapsed .travel-times-toggle-icon{transform:rotate(-90deg)}
.travel-times-content{padding-top:10px}.travel-times-status{display:flex;flex-direction:column;gap:3px;margin:0 0 9px;font-size:11.5px;color:var(--muted);line-height:1.35}.travel-times-list{display:flex;flex-direction:column;gap:9px;max-height:min(42vh,470px);overflow:auto;padding-right:2px;overscroll-behavior:contain}
.travel-time-group{border:1px solid var(--line);border-radius:12px;background:#f8fafc;overflow:hidden}.travel-time-group summary{cursor:pointer;padding:8px 10px;font-weight:850;font-size:13px;line-height:1.25;background:#f1f5f9;color:#17202a}.travel-time-row{display:grid;grid-template-columns:48px 1fr;gap:10px;padding:10px;border-top:1px solid var(--line);background:#fff}.travel-time-row:first-of-type{border-top:0}.travel-time-road-badge{align-self:start;display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:28px;border-radius:5px;background:#1f4fbf;color:#fff;font-weight:900;font-size:15px;letter-spacing:.02em;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}.travel-time-name{font-weight:760;font-size:13.5px;line-height:1.25;color:#1f2937;margin-bottom:7px}.travel-time-values{display:grid;grid-template-columns:1fr 1.05fr 1.2fr;gap:8px}.travel-time-values>div{min-width:0}.travel-time-values strong{display:block;font-size:15px;line-height:1.1;color:#1f2937;white-space:nowrap}.travel-time-values span{display:block;margin-top:3px;font-size:11px;color:#7a8594;line-height:1.05}.travel-time-values .delay small{font-size:10px;font-weight:800}.travel-time-values .delay.good strong,.travel-time-values .delay.good small{color:#2f8c29}.travel-time-values .delay.warn strong,.travel-time-values .delay.warn small{color:#e09a18}.travel-time-values .delay.bad strong,.travel-time-values .delay.bad small{color:#c82020}.travel-time-row.disabled,.travel-time-row.invalid{background:#f3f4f6;color:#7a8594}.travel-time-row.disabled .travel-time-road-badge,.travel-time-row.invalid .travel-time-road-badge{background:#94a3b8}.travel-time-row.disabled .travel-time-name,.travel-time-row.invalid .travel-time-name{color:#64748b}.travel-time-state{display:inline-flex;border-radius:999px;background:#e2e8f0;color:#475569;font-size:11px;font-weight:800;padding:3px 7px}.travel-time-empty{padding:10px;border:1px dashed var(--line);border-radius:10px;color:var(--muted);font-size:13px;background:#f8fafc}
@media(max-width:900px){.travel-times-panel{padding:9px 12px}.travel-times-list{max-height:34vh}.travel-time-row{grid-template-columns:44px 1fr}.travel-time-values{grid-template-columns:1fr 1fr 1fr}.travel-time-values strong{font-size:14px}}
@media(max-width:430px){.travel-time-values{grid-template-columns:1fr 1fr}.travel-time-values .delay{grid-column:1 / -1}.travel-times-list{max-height:32vh}}

/* Patch 8F: Frontend-Reisezeitenbox */
.travel-times-panel{border-bottom:1px solid var(--line);background:#fff;flex:0 0 auto}
.travel-times-toggle{width:100%;border:0;background:#fff;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 16px;font-weight:800;color:#17202a;cursor:pointer;text-align:left;border-bottom:1px solid var(--line)}
.travel-times-toggle:hover{background:#f8fafc}.travel-times-toggle-icon{font-size:14px;color:#64748b;transition:transform .15s ease}.travel-times-toggle.collapsed .travel-times-toggle-icon{transform:rotate(-90deg)}
.travel-times-content{padding:10px 0 12px;background:#f8fafc;max-height:360px;overflow:auto}.travel-times-status{font-size:12px;color:#64748b;line-height:1.35;margin:0 16px 9px}.travel-times-status span{display:block;margin-top:2px}.travel-times-list{display:grid;gap:8px;padding:0 10px}.travel-times-group{border:1px solid var(--line);border-radius:12px;background:#fff;overflow:hidden}.travel-times-group>summary,.travel-time-group>summary{cursor:pointer;list-style:none;padding:9px 10px;font-size:13px;font-weight:800;color:#334155;background:#f3f6fa;border-bottom:1px solid var(--line)}.travel-times-group>summary::-webkit-details-marker,.travel-time-group>summary::-webkit-details-marker{display:none}.travel-time-row{display:grid;grid-template-columns:56px 1fr;gap:10px;padding:10px;border-bottom:1px solid #edf1f5;background:#fff}.travel-time-row:last-child{border-bottom:0}.travel-time-row.disabled,.travel-time-row.invalid{opacity:.72;background:#f8fafc}.travel-time-road-badge,.travel-road-badge{display:inline-flex;align-items:center;justify-content:center;align-self:start;background:#164bb7;color:#fff;border-radius:7px;min-width:48px;height:30px;padding:0 8px;font-weight:900;font-size:15px;letter-spacing:.02em}.travel-time-name,.travel-route-name{font-weight:750;font-size:14px;line-height:1.25;color:#222;margin-bottom:7px}.travel-time-state{display:inline-flex;border-radius:999px;background:#e5e7eb;color:#475569;font-size:12px;font-weight:800;padding:2px 8px;margin-bottom:6px}.travel-time-values,.travel-time-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.travel-time-values>div,.travel-time-metrics>span{min-width:0}.travel-time-values strong,.travel-time-metrics strong{display:block;font-size:18px;line-height:1.05;color:#2f343b;font-weight:900;white-space:normal}.travel-time-values span,.travel-time-metrics small{display:block;font-size:11px;color:#7b8794;margin-top:3px;line-height:1.1}.travel-time-values .delay strong,.travel-time-metrics .delay strong{font-size:17px}.travel-time-values .delay.good strong,.travel-time-metrics .delay.good strong{color:#2e8b2e}.travel-time-values .delay.warn strong,.travel-time-metrics .delay.warn strong{color:#d7961e}.travel-time-values .delay.bad strong,.travel-time-metrics .delay.bad strong{color:#bd1f1f}.travel-time-values .delay small,.travel-time-metrics .delay small{display:inline;color:inherit;font-size:11px;font-weight:700;margin:0 2px 0 0}.travel-time-empty,.travel-times-empty{font-size:13px;color:#64748b;padding:10px 16px;background:#fff;border:1px dashed var(--line);border-radius:10px}
@media(max-width:600px){.travel-times-content{max-height:300px}.travel-time-row{grid-template-columns:48px 1fr;padding:9px}.travel-time-road-badge,.travel-road-badge{min-width:42px;height:28px;font-size:14px}.travel-time-values,.travel-time-metrics{grid-template-columns:1fr 1fr;gap:6px}.travel-time-values .delay,.travel-time-metrics .delay{grid-column:1 / -1}.travel-time-values strong,.travel-time-metrics strong{font-size:16px}}


/* Patch 8F1: Fahrzeiten als eigenes Karten-Dropdown */
.travel-times-map-panel{
  position:absolute!important;
  z-index:760!important;
  top:12px!important;
  left:56px!important;
  width:min(470px, calc(100vw - 430px))!important;
  max-width:470px!important;
  border:1px solid rgba(15,23,42,.16)!important;
  border-radius:14px!important;
  background:#fff!important;
  box-shadow:0 10px 28px rgba(15,23,42,.18)!important;
  overflow:hidden!important;
  padding:0!important;
  flex:none!important;
}
.travel-times-map-panel[hidden]{display:none!important}
.travel-times-map-panel .travel-times-toggle{
  border:0!important;
  border-bottom:0!important;
  background:#fff!important;
  padding:10px 13px!important;
  font-size:15px!important;
  line-height:1.15!important;
}
.travel-times-map-panel .travel-times-toggle:hover{background:#f8fafc!important}
.travel-times-map-panel .travel-times-toggle-icon{font-size:13px!important;color:#334155!important}
.travel-times-map-panel .travel-times-toggle.collapsed .travel-times-toggle-icon{transform:rotate(-90deg)!important}
.travel-times-map-panel .travel-times-content{
  border-top:1px solid var(--line)!important;
  background:#f8fafc!important;
  max-height:min(58vh,620px)!important;
  overflow:auto!important;
  padding:10px!important;
  overscroll-behavior:contain!important;
}
.travel-times-map-panel .travel-times-status{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:6px 12px!important;
  align-items:center!important;
  margin:0 0 9px!important;
  padding:0 2px!important;
  font-size:11.5px!important;
  color:#64748b!important;
}
.travel-times-map-panel .travel-times-status span{display:inline!important;margin:0!important}
.travel-times-map-panel .travel-times-list{display:grid!important;gap:9px!important;padding:0!important;max-height:none!important;overflow:visible!important}
.travel-times-map-panel .travel-time-group{
  border:1px solid var(--line)!important;
  border-radius:12px!important;
  background:#fff!important;
  overflow:hidden!important;
  box-shadow:0 1px 2px rgba(15,23,42,.04)!important;
}
.travel-times-map-panel .travel-time-group>summary{
  padding:8px 10px!important;
  font-size:12.5px!important;
  font-weight:850!important;
  color:#17202a!important;
  background:#eef3f8!important;
  border-bottom:1px solid var(--line)!important;
}
.travel-times-map-panel .travel-time-row{
  display:grid!important;
  grid-template-columns:54px minmax(0,1fr)!important;
  gap:9px!important;
  padding:9px 10px!important;
  background:#fff!important;
  border-top:0!important;
  border-bottom:1px solid #edf1f5!important;
}
.travel-times-map-panel .travel-time-row:last-child{border-bottom:0!important}
.travel-times-map-panel .travel-time-road-badge{
  min-width:46px!important;
  height:30px!important;
  border-radius:6px!important;
  font-size:15px!important;
  background:#0b55c8!important;
}
.travel-times-map-panel .travel-time-name{
  font-size:13.5px!important;
  line-height:1.22!important;
  margin:0 0 6px!important;
  color:#1f2937!important;
}
.travel-times-map-panel .travel-time-values{
  display:grid!important;
  grid-template-columns:.9fr 1fr 1.15fr!important;
  gap:8px!important;
}
.travel-times-map-panel .travel-time-values strong{font-size:17px!important;line-height:1.05!important;color:#252b33!important;font-weight:900!important}
.travel-times-map-panel .travel-time-values span{font-size:10.5px!important;color:#7b8794!important;margin-top:2px!important}
.travel-times-map-panel .travel-time-values .delay strong{font-size:17px!important}
.travel-times-map-panel .travel-time-state{font-size:11px!important;margin-top:2px!important}
.travel-times-map-panel .travel-time-row.disabled,.travel-times-map-panel .travel-time-row.invalid{opacity:.78!important;background:#f8fafc!important}
.travel-times-map-panel .travel-time-row.disabled .travel-time-road-badge,.travel-times-map-panel .travel-time-row.invalid .travel-time-road-badge{background:#94a3b8!important}
@media(max-width:1100px){
  .travel-times-map-panel{width:min(430px, calc(100vw - 92px))!important;left:56px!important;right:auto!important}
}
@media(max-width:900px){
  .travel-times-map-panel{top:104px!important;left:12px!important;right:12px!important;width:auto!important;max-width:none!important}
  .travel-times-map-panel .travel-times-content{max-height:42vh!important}
}
@media(max-width:520px){
  .travel-times-map-panel{top:102px!important;border-radius:12px!important}
  .travel-times-map-panel .travel-time-row{grid-template-columns:46px minmax(0,1fr)!important;padding:8px!important}
  .travel-times-map-panel .travel-time-road-badge{min-width:42px!important;height:27px!important;font-size:14px!important}
  .travel-times-map-panel .travel-time-values{grid-template-columns:1fr 1fr!important;gap:6px!important}
  .travel-times-map-panel .travel-time-values .delay{grid-column:1 / -1!important}
  .travel-times-map-panel .travel-time-values strong{font-size:15.5px!important}
}

/* Patch 8F3: editierbare Fahrzeiten-Wegpunkte */
.travel-waypoint-editor{display:flex;flex-direction:column;gap:6px;min-width:420px}
.travel-waypoint-edit-row{display:grid;grid-template-columns:34px minmax(130px,1.2fr) minmax(120px,1fr) minmax(120px,1fr);gap:6px;align-items:center}
.travel-waypoint-no{font-weight:800;color:#64748b;text-align:center}
.travel-waypoint-edit-row input{min-width:0;font-size:13px;padding:7px 8px}
@media (max-width:800px){.travel-waypoint-editor{min-width:0}.travel-waypoint-edit-row{grid-template-columns:1fr}.travel-waypoint-no{text-align:left}}

/* Patch 8F4: Fahrzeiten-Validierungsdiagnose */
.validation-debug-map{
  min-height:420px;
  height:52vh;
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
  background:#f8fafc;
}
@media (max-width:700px){
  .validation-debug-map{height:360px;min-height:320px}
}

/* Patch 8F5 */
.text-warning{color:#b45309}


/* Patch 8F6: Fahrzeiten-Frontend-Feinschliff */
.travel-times-map-panel .travel-time-values .delay strong,
.travel-times-map-panel .travel-time-values .delay small,
.travel-time-values .delay strong,
.travel-time-values .delay small{
  color:var(--delay-color, currentColor)!important;
}
.travel-times-map-panel .travel-time-values .delay strong,
.travel-time-values .delay strong{
  display:block!important;
  line-height:1.05!important;
}
.travel-times-map-panel .travel-time-values .delay small,
.travel-time-values .delay small{
  display:inline!important;
  font-size:.62em!important;
  font-weight:850!important;
  margin:0 3px 0 0!important;
  vertical-align:baseline!important;
}
.travel-times-map-panel .travel-time-values .delay span,
.travel-time-values .delay span{
  color:#7b8794!important;
}
.delay-color-settings input[type="color"]{height:42px;min-height:42px;padding:4px;max-width:160px}
.leaflet-top.leaflet-right .leaflet-control-zoom{margin-top:58px!important}
@media(max-width:900px){.leaflet-top.leaflet-right .leaflet-control-zoom{margin-top:82px!important}}
@media(max-width:640px){.leaflet-top.leaflet-right .leaflet-control-zoom{margin-top:8px!important}}

/* Patch 8F6: Fahrzeiten-Design, Verzögerungsfarben und Zoom rechts */
.travel-times-map-panel{
  left:12px!important;
  width:min(470px, calc(100vw - 430px))!important;
}
@media(max-width:1100px){
  .travel-times-map-panel{left:12px!important;width:min(430px, calc(100vw - 92px))!important;right:auto!important}
}
.travel-time-values .delay,
.travel-time-metrics .delay{
  color:var(--delay-color, #15803d)!important;
}
.travel-time-values .delay .travel-delay-value,
.travel-time-metrics .delay .travel-delay-value{
  display:flex!important;
  align-items:baseline!important;
  gap:4px!important;
  min-height:20px!important;
  line-height:1.05!important;
  color:var(--delay-color, #15803d)!important;
}
.travel-time-values .delay .travel-delay-value small,
.travel-time-metrics .delay .travel-delay-value small{
  display:inline-block!important;
  color:var(--delay-color, #15803d)!important;
  font-size:10.5px!important;
  line-height:1!important;
  font-weight:850!important;
  margin:0!important;
}
.travel-time-values .delay .travel-delay-value strong,
.travel-time-metrics .delay .travel-delay-value strong{
  display:inline-block!important;
  color:var(--delay-color, #15803d)!important;
  font-size:18px!important;
  line-height:1.05!important;
  font-weight:900!important;
  margin:0!important;
  white-space:nowrap!important;
}
.travel-times-map-panel .travel-time-values .delay .travel-delay-value strong{font-size:17px!important}
.travel-times-map-panel .travel-time-values .delay>span{margin-top:3px!important}
.delay-threshold-grid input[type="color"]{height:42px;padding:4px;max-width:120px}

/* Patch 8G-8J: Fahrzeiten-Reports / Prognose */
.travel-time-prediction{margin-top:10px;padding:10px;border:1px solid var(--line);border-radius:12px;background:#fff}
.travel-prediction-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:8px;font-size:12px;color:#334155}
.travel-prediction-head strong{font-size:13px;color:#17202a}.travel-prediction-head span{color:#64748b;font-size:11px}
.travel-prediction-select{width:100%;border:1px solid var(--line);border-radius:9px;padding:7px 9px;background:#fff;font-size:12px;margin-bottom:8px}
.travel-prediction-cols{display:grid;grid-template-columns:1fr 1fr;gap:9px}.travel-prediction-cols h4{font-size:11px;margin:0 0 5px;color:#334155}
.travel-prediction-cols ul{list-style:none;margin:0;padding:0;display:grid;gap:5px}.travel-prediction-cols li{display:grid;gap:1px;border-radius:9px;background:#f8fafc;border:1px solid #edf1f5;padding:6px}
.travel-prediction-cols li span{font-size:10.5px;color:#64748b}.travel-prediction-cols li strong{font-size:13px;color:#17202a}.travel-prediction-cols li small{font-size:10px;color:#64748b}
.travel-prediction-cols .best strong{color:#15803d}.travel-prediction-cols .worst strong{color:#c91515}.travel-prediction-empty{font-size:12px;color:#64748b;background:#f8fafc;border-radius:9px;padding:7px}
.travel-time-report-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.travel-time-report-grid .metric-card strong{font-size:18px}.travel-analysis-run-list{display:grid;gap:7px}.travel-analysis-run{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 10px;border:1px solid var(--line);border-radius:10px;background:#fff}.travel-analysis-run code{font-size:12px}.travel-report-table small{display:block;color:#64748b;line-height:1.25}
@media(max-width:760px){.travel-prediction-cols{grid-template-columns:1fr}.travel-time-report-grid{grid-template-columns:1fr 1fr}.travel-analysis-run{display:block}.travel-analysis-run>*{display:block;margin:2px 0}}

/* Patch 8K: Fahrzeiten-Frontend kompakter + Kalender-Prognose */
.travel-times-map-panel{
  width:min(520px, calc(100vw - 440px))!important;
  left:14px!important;
  top:12px!important;
  border-radius:14px!important;
  box-shadow:0 8px 28px rgba(15,23,42,.18)!important;
  overflow:hidden!important;
}
.travel-times-map-panel .travel-times-toggle{
  min-height:42px!important;
  padding:11px 14px!important;
  font-size:16px!important;
  font-weight:900!important;
  background:rgba(255,255,255,.96)!important;
}
.travel-times-map-panel .travel-times-content{
  padding:10px!important;
  max-height:min(68vh,720px)!important;
  background:rgba(248,250,252,.96)!important;
}
.travel-times-section-head,
.travel-prognosis-head h3{
  margin:0 0 7px!important;
  font-size:13px!important;
  line-height:1.2!important;
  font-weight:900!important;
  color:#17202a!important;
  letter-spacing:.01em!important;
}
.travel-times-map-panel .travel-times-status{
  margin:0 0 8px!important;
  padding:7px 9px!important;
  border:1px solid #e4ebf3!important;
  border-radius:10px!important;
  background:#fff!important;
  font-size:11.5px!important;
}
.travel-times-map-panel .travel-time-group{
  border-radius:11px!important;
  margin:0!important;
}
.travel-times-map-panel .travel-time-group>summary{
  padding:8px 10px!important;
  font-size:12.5px!important;
  background:#edf3f8!important;
}
.travel-times-map-panel .travel-time-row{
  grid-template-columns:52px minmax(0,1fr)!important;
  gap:9px!important;
  padding:8px 10px!important;
}
.travel-times-map-panel .travel-time-road-badge{
  min-width:46px!important;
  height:29px!important;
  border-radius:6px!important;
}
.travel-times-map-panel .travel-time-name{
  font-size:13.25px!important;
  margin-bottom:5px!important;
}
.travel-times-map-panel .travel-time-values{
  align-items:start!important;
  grid-template-columns:.85fr .9fr 1.25fr!important;
}
.travel-times-map-panel .travel-time-values strong{
  font-size:16.5px!important;
}
.travel-times-map-panel .travel-time-values .delay .travel-delay-value{
  min-height:18px!important;
}
.travel-times-map-panel .travel-time-values .delay .travel-delay-value strong{
  font-size:16.5px!important;
}
.travel-prognosis-box{
  margin-top:10px!important;
  padding:10px!important;
  border:1px solid #dce6f0!important;
  border-radius:12px!important;
  background:#fff!important;
}
.travel-prognosis-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
}
.travel-prognosis-controls{
  grid-template-columns:minmax(0,1fr) minmax(176px,.8fr) auto!important;
  gap:7px!important;
  align-items:center!important;
}
.travel-datetime-control{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  min-width:0!important;
}
.travel-datetime-control input[type="datetime-local"]{
  width:100%!important;
  min-width:0!important;
  height:36px!important;
  padding:7px 9px 7px 34px!important;
  border:1px solid var(--line)!important;
  border-radius:9px!important;
  background:#fff!important;
  font-size:12.5px!important;
  color:#17202a!important;
}
.travel-calendar-icon{
  position:absolute!important;
  left:9px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  z-index:2!important;
  font-size:16px!important;
  line-height:1!important;
  cursor:pointer!important;
}
.travel-prognosis-selected{
  border:1px solid #dbe7f2!important;
  border-radius:11px!important;
  background:#f8fbff!important;
  padding:9px!important;
  margin:8px 0!important;
}
.travel-prognosis-selected.empty em{
  display:block!important;
  margin-top:6px!important;
  color:#64748b!important;
  font-style:normal!important;
  font-weight:700!important;
}
.travel-prognosis-selected-head{
  display:flex!important;
  justify-content:space-between!important;
  gap:8px!important;
  align-items:flex-start!important;
  margin-bottom:5px!important;
}
.travel-prognosis-selected-head strong{
  font-size:12.5px!important;
  color:#17202a!important;
}
.travel-prognosis-selected-head span{
  font-size:11px!important;
  color:#64748b!important;
  text-align:right!important;
}
.travel-prognosis-selected-route{
  font-size:12px!important;
  font-weight:800!important;
  color:#334155!important;
  margin-bottom:7px!important;
}
.travel-prognosis-selected-values{
  display:grid!important;
  grid-template-columns:1.2fr .9fr .9fr .9fr!important;
  gap:7px!important;
}
.travel-prognosis-selected-values strong,
.travel-prognosis-item strong{
  font-size:13px!important;
  line-height:1.1!important;
  color:#17202a!important;
}
.travel-prognosis-selected-values small,
.travel-prognosis-item small{
  display:block!important;
  margin-top:2px!important;
  font-size:10.5px!important;
  color:#64748b!important;
}
.travel-prognosis-comparison{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:8px!important;
  margin-top:8px!important;
}
.travel-prognosis-list{
  margin-top:0!important;
}
.travel-prognosis-list>strong{
  display:block!important;
  margin-bottom:5px!important;
  font-size:12px!important;
  color:#17202a!important;
}
.travel-prognosis-item{
  grid-template-columns:1fr!important;
  gap:3px!important;
  padding:6px 7px!important;
}
@media(max-width:1100px){
  .travel-times-map-panel{width:min(500px, calc(100vw - 92px))!important;left:56px!important;right:auto!important}
}
@media(max-width:900px){
  .travel-times-map-panel{top:104px!important;left:12px!important;right:12px!important;width:auto!important;max-width:none!important}
  .travel-times-map-panel .travel-times-content{max-height:54vh!important}
  .travel-prognosis-controls{grid-template-columns:1fr!important}
  .travel-prognosis-selected-values{grid-template-columns:1fr 1fr!important}
  .travel-prognosis-comparison{grid-template-columns:1fr!important}
}
@media(max-width:520px){
  .travel-times-map-panel .travel-time-values{grid-template-columns:1fr 1fr!important}
  .travel-times-map-panel .travel-time-values .delay{grid-column:1 / -1!important}
  .travel-prognosis-selected-head{display:block!important}
  .travel-prognosis-selected-head span{text-align:left!important;display:block!important;margin-top:2px!important}
}

/* Patch 8K: Fahrzeiten / Prognose im Kartenbereich */
.travel-map-panels{
  position:absolute!important;
  z-index:760!important;
  top:12px!important;
  left:12px!important;
  right:92px!important;
  display:flex!important;
  align-items:flex-start!important;
  gap:12px!important;
  pointer-events:none!important;
}
.travel-map-panels[hidden]{display:none!important}
.travel-map-panels .travel-times-panel{
  position:static!important;
  top:auto!important;
  left:auto!important;
  right:auto!important;
  width:min(430px, calc((100vw - 520px) / 2))!important;
  min-width:320px!important;
  max-width:430px!important;
  pointer-events:auto!important;
  border-radius:13px!important;
  background:rgba(255,255,255,.96)!important;
  box-shadow:0 8px 24px rgba(15,23,42,.14)!important;
  border:1px solid rgba(203,213,225,.92)!important;
  overflow:hidden!important;
}
.travel-map-panels .travel-times-toggle{
  height:42px!important;
  padding:0 14px!important;
  border:0!important;
  border-radius:0!important;
  background:rgba(255,255,255,.98)!important;
  font-size:15px!important;
  font-weight:900!important;
  box-shadow:none!important;
}
.travel-map-panels .travel-times-content{
  padding:10px!important;
  background:#f8fafc!important;
  max-height:min(58vh,620px)!important;
  overflow:auto!important;
}
.travel-map-panels .travel-times-status{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:2px!important;
  margin:0 0 9px!important;
  padding:0 2px!important;
  font-size:12px!important;
}
.travel-map-panels .travel-times-list{gap:8px!important;padding:0!important;max-height:none!important;overflow:visible!important}
.travel-map-panels .travel-time-group{border-radius:12px!important;background:#fff!important;border:1px solid #d9e1ea!important;overflow:hidden!important}
.travel-map-panels .travel-time-group>summary{padding:9px 10px!important;background:#eef3f8!important;font-size:13px!important;color:#17202a!important}
.travel-map-panels .travel-time-row{grid-template-columns:52px minmax(0,1fr)!important;gap:10px!important;padding:9px 10px!important;background:#fff!important}
.travel-map-panels .travel-time-road-badge{min-width:48px!important;height:30px!important;border-radius:7px!important;font-size:15px!important;background:#164bb7!important}
.travel-map-panels .travel-time-name{font-size:13.5px!important;line-height:1.22!important;margin-bottom:8px!important;color:#17202a!important;font-weight:850!important}
.travel-map-panels .travel-time-values{display:grid!important;grid-template-columns:.95fr 1.05fr 1.25fr!important;align-items:start!important;gap:10px!important}
.travel-map-panels .travel-time-values>div{display:flex!important;flex-direction:column!important;justify-content:flex-start!important;min-height:38px!important}
.travel-map-panels .travel-time-values strong{font-size:18px!important;line-height:1!important;font-weight:950!important;color:#202834!important;white-space:nowrap!important}
.travel-map-panels .travel-time-values span{font-size:10.5px!important;line-height:1.1!important;color:#6b7280!important;margin-top:3px!important}
.travel-map-panels .travel-time-values .delay{display:flex!important;align-items:flex-start!important;justify-content:flex-start!important;color:var(--delay-color)!important}
.travel-map-panels .travel-time-values .delay .travel-delay-value{display:flex!important;align-items:baseline!important;gap:4px!important;min-height:18px!important;line-height:1!important}
.travel-map-panels .travel-time-values .delay .travel-delay-value small{font-size:10px!important;font-weight:900!important;color:var(--delay-color)!important;margin:0!important;line-height:1!important}
.travel-map-panels .travel-time-values .delay .travel-delay-value strong{font-size:18px!important;color:var(--delay-color)!important;line-height:1!important}
.travel-map-panels .travel-time-values .delay>span{margin-top:3px!important;color:#6b7280!important}
.travel-map-panels .travel-time-state{font-size:11.5px!important;padding:3px 8px!important}
.travel-prediction-map-panel .travel-times-content{max-height:min(58vh,620px)!important}
.travel-prognosis-box{border:0!important;margin:0!important;padding:0!important}
.travel-prognosis-controls{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(190px,.9fr) auto!important;gap:8px!important;align-items:center!important;margin-bottom:9px!important}
.travel-prognosis-controls select,.travel-prognosis-date input{
  width:100%!important;
  height:36px!important;
  border:1px solid #cbd5e1!important;
  border-radius:9px!important;
  background:#fff!important;
  font-size:12.5px!important;
  color:#17202a!important;
  padding:0 9px!important;
}
.travel-prognosis-date{position:relative!important;display:block!important;margin:0!important}
.travel-prognosis-date input{padding-left:34px!important}
.travel-calendar-icon{position:absolute!important;left:10px!important;top:50%!important;transform:translateY(-50%)!important;color:#1d4ed8!important;font-size:17px!important;line-height:1!important;z-index:1!important;pointer-events:none!important}
.travel-prognosis-controls .button{height:36px!important;white-space:nowrap!important;padding:0 12px!important}
.travel-prognosis-result{font-size:12px!important;color:#334155!important;line-height:1.35!important}
.travel-prognosis-selected{display:grid!important;grid-template-columns:1.4fr .8fr .8fr .9fr!important;gap:7px!important;background:#fff!important;border:1px solid #dbe4ee!important;border-radius:11px!important;padding:8px!important;margin-bottom:9px!important;align-items:start!important}
.travel-prognosis-selected.muted{display:block!important;color:#64748b!important;background:#f8fafc!important}
.travel-prognosis-selected strong{display:block!important;font-size:13px!important;color:#17202a!important;line-height:1.1!important}
.travel-prognosis-selected span,.travel-prognosis-selected small{display:block!important;color:#64748b!important;font-size:10.5px!important;margin-top:3px!important}
.travel-prognosis-list{display:grid!important;gap:6px!important;margin-top:8px!important}
.travel-prognosis-list>strong{font-size:12.5px!important;color:#17202a!important}
.travel-prognosis-item{display:grid!important;grid-template-columns:78px 1fr 1fr!important;gap:7px!important;border:1px solid #e5eaf0!important;border-radius:9px!important;background:#fff!important;padding:7px!important}
.travel-prognosis-item strong{font-size:13px!important;line-height:1.1!important}.travel-prognosis-item small{font-size:10.5px!important;color:#64748b!important}
@media(max-width:1100px){
  .travel-map-panels{right:72px!important;gap:8px!important}
  .travel-map-panels .travel-times-panel{width:min(390px, calc((100vw - 450px) / 2))!important;min-width:286px!important}
  .travel-prognosis-controls{grid-template-columns:1fr!important}
  .travel-prognosis-selected{grid-template-columns:1fr 1fr!important}
}
@media(max-width:760px){
  .travel-map-panels{top:72px!important;left:10px!important;right:10px!important;flex-direction:column!important}
  .travel-map-panels .travel-times-panel{width:100%!important;max-width:none!important;min-width:0!important}
  .travel-map-panels .travel-times-content{max-height:38vh!important}
  .travel-map-panels .travel-time-values{grid-template-columns:1fr 1fr!important}
  .travel-map-panels .travel-time-values .delay{grid-column:1 / -1!important}
}
@media(max-width:480px){
  .travel-map-panels{top:68px!important}
  .travel-map-panels .travel-time-row{grid-template-columns:44px minmax(0,1fr)!important;padding:8px!important}
  .travel-map-panels .travel-time-road-badge{min-width:40px!important;height:27px!important;font-size:13px!important}
  .travel-prognosis-selected,.travel-prognosis-item{grid-template-columns:1fr!important}
}

/* Patch 8K4: Fahrzeiten-Boxen gleich breit, weißer Hintergrund, Prognose-API-Fix */
.travel-map-panels .travel-times-panel,
.travel-map-panels .travel-times-panel.travel-times-map-panel,
.travel-map-panels .travel-times-panel.travel-prediction-map-panel{
  flex:0 0 clamp(320px, calc((100vw - 580px) / 2), 430px)!important;
  width:clamp(320px, calc((100vw - 580px) / 2), 430px)!important;
  min-width:320px!important;
  max-width:430px!important;
  background:#fff!important;
  border:1px solid #cbd5e1!important;
  box-shadow:0 8px 24px rgba(15,23,42,.12)!important;
  opacity:1!important;
}
.travel-map-panels .travel-times-toggle,
.travel-map-panels .travel-times-toggle:hover,
.travel-map-panels .travel-times-content,
.travel-map-panels .travel-prognosis-box{
  background:#fff!important;
  opacity:1!important;
}
.travel-map-panels .travel-times-content{
  border-top:1px solid #e5eaf0!important;
}
.travel-prediction-map-panel .travel-times-toggle,
.travel-times-map-panel .travel-times-toggle{
  min-height:42px!important;
}
@media(max-width:1100px){
  .travel-map-panels .travel-times-panel,
  .travel-map-panels .travel-times-panel.travel-times-map-panel,
  .travel-map-panels .travel-times-panel.travel-prediction-map-panel{
    flex:1 1 calc(50% - 6px)!important;
    width:calc(50% - 6px)!important;
    min-width:286px!important;
    max-width:none!important;
  }
}
@media(max-width:760px){
  .travel-map-panels .travel-times-panel,
  .travel-map-panels .travel-times-panel.travel-times-map-panel,
  .travel-map-panels .travel-times-panel.travel-prediction-map-panel{
    flex:0 0 auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
  }
}

/* Patch 8K5: Prognose-API-Fix + kompaktere, gleich breite Fahrzeiten-Headerboxen */
.travel-map-panels .travel-times-panel,
.travel-map-panels .travel-times-panel.travel-times-map-panel,
.travel-map-panels .travel-times-panel.travel-prediction-map-panel{
  flex:0 0 clamp(300px, calc((100vw - 610px) / 2), 400px)!important;
  width:clamp(300px, calc((100vw - 610px) / 2), 400px)!important;
  min-width:300px!important;
  max-width:400px!important;
  background:#fff!important;
  opacity:1!important;
}
.travel-map-panels .travel-times-toggle{
  min-height:40px!important;
  height:40px!important;
  background:#fff!important;
  opacity:1!important;
}
.travel-map-panels .travel-times-content,
.travel-map-panels .travel-prognosis-box{
  background:#fff!important;
  opacity:1!important;
}
@media(max-width:1100px){
  .travel-map-panels .travel-times-panel,
  .travel-map-panels .travel-times-panel.travel-times-map-panel,
  .travel-map-panels .travel-times-panel.travel-prediction-map-panel{
    flex:1 1 calc(50% - 6px)!important;
    width:calc(50% - 6px)!important;
    min-width:280px!important;
    max-width:none!important;
  }
}
@media(max-width:760px){
  .travel-map-panels .travel-times-panel,
  .travel-map-panels .travel-times-panel.travel-times-map-panel,
  .travel-map-panels .travel-times-panel.travel-prediction-map-panel{
    flex:0 0 auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
  }
}


/* Patch 8K6: Fahrzeiten-Prognose wieder im gewünschten Design, ohne Prozent-/Datenbasisanzeige */
.travel-map-panels{
  align-items:flex-start!important;
}
.travel-map-panels .travel-times-panel,
.travel-map-panels .travel-times-panel.travel-times-map-panel,
.travel-map-panels .travel-times-panel.travel-prediction-map-panel{
  flex:0 0 clamp(320px, calc((100vw - 610px) / 2), 410px)!important;
  width:clamp(320px, calc((100vw - 610px) / 2), 410px)!important;
  min-width:320px!important;
  max-width:410px!important;
  background:#fff!important;
  border:1px solid #cbd5e1!important;
  opacity:1!important;
}
.travel-map-panels .travel-times-toggle,
.travel-map-panels .travel-times-toggle:hover{
  height:42px!important;
  min-height:42px!important;
  max-height:42px!important;
  padding:0 14px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  background:#fff!important;
  opacity:1!important;
  line-height:1!important;
  font-size:15px!important;
}
.travel-map-panels .travel-times-toggle span:first-child{
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.travel-map-panels .travel-times-content,
.travel-map-panels .travel-prognosis-box{
  background:#fff!important;
  opacity:1!important;
}
.travel-prediction-map-panel .travel-times-content{
  padding:10px 12px 12px!important;
  max-height:min(62vh,640px)!important;
}
.travel-prognosis-controls{
  display:grid!important;
  grid-template-columns:minmax(0,1.2fr) minmax(178px,1fr) auto!important;
  gap:8px!important;
  align-items:end!important;
  margin:0 0 10px!important;
}
.travel-prognosis-controls select,
.travel-prognosis-date input{
  height:38px!important;
  border-radius:9px!important;
  background:#fff!important;
}
.travel-prognosis-controls .button{
  height:38px!important;
}
.travel-prognosis-result{
  font-size:12px!important;
  color:#334155!important;
}
.travel-prognosis-current{
  border:1px solid #dbe4ee!important;
  background:#f8fafc!important;
  border-radius:11px!important;
  padding:8px 10px!important;
  margin:0 0 10px!important;
}
.travel-prognosis-current-head{
  display:flex!important;
  justify-content:space-between!important;
  align-items:baseline!important;
  gap:10px!important;
  margin-bottom:6px!important;
}
.travel-prognosis-current-head strong{
  font-size:12px!important;
  color:#334155!important;
  font-weight:900!important;
}
.travel-prognosis-current-head span{
  font-size:10.5px!important;
  color:#64748b!important;
  white-space:nowrap!important;
}
.travel-prognosis-current-grid{
  display:grid!important;
  grid-template-columns:minmax(0,1.7fr) .8fr .8fr!important;
  gap:10px!important;
  align-items:start!important;
}
.travel-prognosis-current-grid strong{
  display:block!important;
  font-size:17px!important;
  line-height:1.1!important;
  color:#17202a!important;
  font-weight:950!important;
}
.travel-prognosis-current-grid small,
.travel-prognosis-card small{
  display:block!important;
  font-size:10.5px!important;
  color:#64748b!important;
  margin-top:3px!important;
}
.travel-prognosis-empty{
  border:1px solid #dbe4ee!important;
  background:#f8fafc!important;
  border-radius:10px!important;
  padding:8px 10px!important;
  color:#475569!important;
}
.travel-prognosis-comparison{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:10px!important;
}
.travel-prognosis-list{
  display:block!important;
  margin:0!important;
}
.travel-prognosis-list>strong{
  display:block!important;
  font-size:12.5px!important;
  color:#17202a!important;
  margin:0 0 6px!important;
  font-weight:900!important;
}
.travel-prognosis-card-grid{
  display:grid!important;
  gap:7px!important;
}
.travel-prognosis-card{
  display:grid!important;
  grid-template-columns:minmax(0,1.15fr) .75fr .9fr!important;
  gap:8px!important;
  align-items:start!important;
  border:1px solid #e0e7ef!important;
  background:#fff!important;
  border-radius:10px!important;
  padding:8px!important;
}
.travel-prognosis-card strong{
  display:block!important;
  font-size:15px!important;
  color:#17202a!important;
  line-height:1.1!important;
  font-weight:950!important;
}
.travel-prognosis-list.best .travel-prognosis-card strong:nth-child(1),
.travel-prognosis-list.best .travel-prognosis-card>div:nth-child(2) strong{
  color:#15803d!important;
}
.travel-prognosis-list.worst .travel-prognosis-card>div:nth-child(2) strong{
  color:#c91515!important;
}
.travel-prognosis-card>div:first-child strong{
  color:#334155!important;
  font-size:13px!important;
}
@media(max-width:1100px){
  .travel-map-panels .travel-times-panel,
  .travel-map-panels .travel-times-panel.travel-times-map-panel,
  .travel-map-panels .travel-times-panel.travel-prediction-map-panel{
    flex:1 1 calc(50% - 6px)!important;
    width:calc(50% - 6px)!important;
    min-width:280px!important;
    max-width:none!important;
  }
  .travel-prognosis-controls{grid-template-columns:1fr!important;align-items:stretch!important}
  .travel-prognosis-comparison{grid-template-columns:1fr!important}
  .travel-prognosis-current-grid{grid-template-columns:1fr 1fr!important}
  .travel-prognosis-current-grid>div:first-child{grid-column:1 / -1!important}
}
@media(max-width:760px){
  .travel-map-panels .travel-times-panel,
  .travel-map-panels .travel-times-panel.travel-times-map-panel,
  .travel-map-panels .travel-times-panel.travel-prediction-map-panel{
    flex:0 0 auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
  }
  .travel-prognosis-card{grid-template-columns:1fr 1fr!important}
  .travel-prognosis-card>div:first-child{grid-column:1 / -1!important}
}

/* Patch 8K7: nur Designkorrektur der beiden Fahrzeiten-Boxen + Prognose-Darstellung aus 8K */
.travel-map-panels{
  top:10px!important;
  left:12px!important;
  right:75px!important;
  display:flex!important;
  align-items:flex-start!important;
  gap:12px!important;
  z-index:760!important;
  pointer-events:none!important;
}
.travel-map-panels[hidden]{display:none!important}
.travel-map-panels .travel-times-panel,
.travel-map-panels .travel-times-panel.travel-times-map-panel,
.travel-map-panels .travel-times-panel.travel-prediction-map-panel{
  box-sizing:border-box!important;
  flex:0 0 clamp(320px, calc((100vw - 625px) / 2), 430px)!important;
  width:clamp(320px, calc((100vw - 625px) / 2), 430px)!important;
  min-width:320px!important;
  max-width:430px!important;
  margin:0!important;
  padding:0!important;
  background:#fff!important;
  opacity:1!important;
  backdrop-filter:none!important;
  border:1px solid #cbd5e1!important;
  border-radius:12px!important;
  box-shadow:0 2px 10px rgba(15,23,42,.16)!important;
  overflow:hidden!important;
  pointer-events:auto!important;
}
.travel-map-panels .travel-times-toggle,
.travel-map-panels .travel-times-toggle:hover,
.travel-prediction-map-panel .travel-times-toggle,
.travel-times-map-panel .travel-times-toggle{
  box-sizing:border-box!important;
  width:100%!important;
  height:42px!important;
  min-height:42px!important;
  max-height:42px!important;
  margin:0!important;
  padding:0 14px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  background:#fff!important;
  opacity:1!important;
  border:0!important;
  border-radius:0!important;
  line-height:1!important;
  font-size:14px!important;
  font-weight:900!important;
  color:#17202a!important;
}
.travel-map-panels .travel-times-toggle span:first-child{
  display:block!important;
  min-width:0!important;
  overflow:hidden!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
}
.travel-map-panels .travel-times-toggle-icon{
  flex:0 0 auto!important;
  line-height:1!important;
}
.travel-map-panels .travel-times-content,
.travel-map-panels .travel-prognosis-box,
.travel-map-panels .travel-prediction-content{
  background:#fff!important;
  opacity:1!important;
  backdrop-filter:none!important;
}
.travel-map-panels .travel-times-content{
  padding:10px 12px 12px!important;
  max-height:min(64vh,660px)!important;
  overflow:auto!important;
}
.travel-prediction-map-panel .travel-times-content{
  max-height:min(64vh,660px)!important;
}
.travel-prediction-head{
  display:flex!important;
  align-items:baseline!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin:0 0 9px!important;
  padding:0!important;
  color:#334155!important;
}
.travel-prediction-head strong{
  font-size:13.5px!important;
  font-weight:950!important;
  color:#17202a!important;
}
.travel-prediction-head span{
  font-size:10.5px!important;
  color:#64748b!important;
  white-space:nowrap!important;
}
.travel-prediction-controls{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(176px,.86fr) auto!important;
  gap:8px!important;
  align-items:end!important;
  margin:0 0 9px!important;
}
.travel-prediction-field{
  display:grid!important;
  gap:4px!important;
  margin:0!important;
}
.travel-prediction-field>span:first-child{
  font-size:11px!important;
  font-weight:800!important;
  color:#64748b!important;
}
.travel-prediction-select,
.travel-prediction-datewrap input,
.travel-prediction-show{
  box-sizing:border-box!important;
  height:36px!important;
  border:1px solid #cfd8e3!important;
  border-radius:9px!important;
  background:#fff!important;
  font-size:12px!important;
}
.travel-prediction-select{width:100%!important;padding:0 8px!important}
.travel-prediction-datewrap{
  display:block!important;
  position:relative!important;
}
.travel-prediction-datewrap input{
  width:100%!important;
  padding:0 8px 0 34px!important;
}
.travel-prediction-calendar-icon{
  position:absolute!important;
  left:10px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  z-index:1!important;
  font-size:15px!important;
  line-height:1!important;
}
.travel-prediction-show{
  padding:0 12px!important;
  color:#17202a!important;
}
.travel-prediction-result{
  font-size:12px!important;
  line-height:1.35!important;
  color:#334155!important;
}
.travel-prediction-selected{
  display:grid!important;
  grid-template-columns:minmax(0,1.45fr) minmax(90px,.75fr)!important;
  gap:10px!important;
  align-items:start!important;
  border:1px solid #dbe4ee!important;
  background:#f8fafc!important;
  border-radius:11px!important;
  padding:9px 10px!important;
  margin:0 0 10px!important;
}
.travel-prediction-selected.no-data{
  display:block!important;
  color:#475569!important;
}
.travel-prediction-selected span{
  display:block!important;
  font-size:10.5px!important;
  color:#64748b!important;
  font-weight:800!important;
}
.travel-prediction-selected strong{
  display:block!important;
  font-size:16px!important;
  line-height:1.1!important;
  font-weight:950!important;
  color:#17202a!important;
  margin-top:2px!important;
}
.travel-prediction-selected.has-data>div:last-child strong{
  color:#0b55c8!important;
}
.travel-prediction-selected small{
  display:block!important;
  font-size:10.5px!important;
  color:#64748b!important;
  margin-top:3px!important;
}
.travel-prediction-cols{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:10px!important;
}
.travel-prediction-cols h4{
  margin:0 0 6px!important;
  font-size:12px!important;
  line-height:1.15!important;
  color:#17202a!important;
  font-weight:900!important;
}
.travel-prediction-cols ul{
  list-style:none!important;
  margin:0!important;
  padding:0!important;
  display:grid!important;
  gap:7px!important;
}
.travel-prediction-cols li{
  display:grid!important;
  gap:2px!important;
  border:1px solid #e0e7ef!important;
  border-radius:10px!important;
  background:#fff!important;
  padding:8px!important;
}
.travel-prediction-cols li span{
  font-size:10.5px!important;
  color:#64748b!important;
}
.travel-prediction-cols li strong{
  font-size:16px!important;
  line-height:1.1!important;
  font-weight:950!important;
  color:#17202a!important;
}
.travel-prediction-cols li small{
  font-size:10.5px!important;
  color:#64748b!important;
}
.travel-prediction-cols .best li strong{color:#15803d!important}
.travel-prediction-cols .worst li strong{color:#c91515!important}
@media(max-width:1150px){
  .travel-map-panels{right:72px!important;gap:8px!important}
  .travel-map-panels .travel-times-panel,
  .travel-map-panels .travel-times-panel.travel-times-map-panel,
  .travel-map-panels .travel-times-panel.travel-prediction-map-panel{
    flex:1 1 calc(50% - 6px)!important;
    width:calc(50% - 6px)!important;
    min-width:280px!important;
    max-width:none!important;
  }
  .travel-prediction-controls{grid-template-columns:1fr!important}
}
@media(max-width:760px){
  .travel-map-panels{top:72px!important;left:10px!important;right:10px!important;flex-direction:column!important}
  .travel-map-panels .travel-times-panel,
  .travel-map-panels .travel-times-panel.travel-times-map-panel,
  .travel-map-panels .travel-times-panel.travel-prediction-map-panel{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    flex:0 0 auto!important;
  }
  .travel-prediction-selected,.travel-prediction-cols{grid-template-columns:1fr!important}
}

/* Patch 8K7: Prognose wie Patch 8K, aber als getrennte Box; nur Box-CSS bereinigt */
.travel-map-panels{
  top:12px!important;
  left:12px!important;
  right:92px!important;
  gap:12px!important;
  align-items:flex-start!important;
}
.travel-map-panels .travel-times-panel,
.travel-map-panels .travel-times-panel.travel-times-map-panel,
.travel-map-panels .travel-times-panel.travel-prediction-map-panel{
  flex:0 0 clamp(320px, calc((100vw - 610px) / 2), 410px)!important;
  width:clamp(320px, calc((100vw - 610px) / 2), 410px)!important;
  min-width:320px!important;
  max-width:410px!important;
  padding:0!important;
  margin:0!important;
  background:#fff!important;
  border:1px solid #cbd5e1!important;
  border-radius:13px!important;
  box-shadow:0 8px 24px rgba(15,23,42,.12)!important;
  opacity:1!important;
  overflow:hidden!important;
}
.travel-map-panels .travel-times-toggle,
.travel-map-panels .travel-times-panel.travel-times-map-panel .travel-times-toggle,
.travel-map-panels .travel-times-panel.travel-prediction-map-panel .travel-times-toggle,
.travel-map-panels .travel-times-toggle:hover{
  box-sizing:border-box!important;
  width:100%!important;
  height:42px!important;
  min-height:42px!important;
  max-height:42px!important;
  padding:0 14px!important;
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  line-height:1!important;
  font-size:15px!important;
  font-weight:900!important;
  background:#fff!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  opacity:1!important;
}
.travel-map-panels .travel-times-toggle span:first-child{
  display:block!important;
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.travel-map-panels .travel-times-toggle-icon{
  flex:0 0 auto!important;
  font-size:12px!important;
  line-height:1!important;
  color:#334155!important;
}
.travel-map-panels .travel-times-content,
.travel-map-panels .travel-prediction-content{
  background:#fff!important;
  border-top:1px solid #e5eaf0!important;
  padding:10px!important;
  opacity:1!important;
  max-height:min(62vh,640px)!important;
  overflow:auto!important;
}
.travel-time-prediction-standalone,
.travel-prediction-map-panel .travel-time-prediction{
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:#fff!important;
}
.travel-prediction-head{
  display:flex!important;
  justify-content:space-between!important;
  align-items:baseline!important;
  gap:10px!important;
  margin:0 0 8px!important;
  color:#334155!important;
}
.travel-prediction-head strong{
  font-size:13px!important;
  font-weight:900!important;
  color:#17202a!important;
}
.travel-prediction-head span{
  font-size:10.5px!important;
  color:#64748b!important;
  white-space:nowrap!important;
}
.travel-prediction-controls{
  display:grid!important;
  grid-template-columns:minmax(0,1.15fr) minmax(175px,1fr)!important;
  gap:8px!important;
  align-items:end!important;
  margin:0 0 9px!important;
}
.travel-prediction-field{
  display:block!important;
  margin:0!important;
}
.travel-prediction-field>span:first-child{
  display:block!important;
  font-size:11px!important;
  font-weight:800!important;
  color:#64748b!important;
  margin:0 0 3px!important;
}
.travel-prediction-select,
.travel-prediction-datewrap input{
  box-sizing:border-box!important;
  width:100%!important;
  height:36px!important;
  border:1px solid #cbd5e1!important;
  border-radius:9px!important;
  background:#fff!important;
  font-size:12.5px!important;
  color:#17202a!important;
  padding:0 9px!important;
  margin:0!important;
}
.travel-prediction-datewrap{
  position:relative!important;
  display:block!important;
}
.travel-prediction-calendar-icon{
  position:absolute!important;
  left:10px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  z-index:1!important;
  color:#1d4ed8!important;
  pointer-events:none!important;
}
.travel-prediction-datewrap input{
  padding-left:34px!important;
}
.travel-prediction-selected{
  display:grid!important;
  grid-template-columns:minmax(0,1.45fr) minmax(0,.85fr)!important;
  gap:10px!important;
  align-items:start!important;
  border:1px solid #dbe4ee!important;
  background:#f8fafc!important;
  border-radius:11px!important;
  padding:8px 10px!important;
  margin:0 0 10px!important;
}
.travel-prediction-selected.no-data{
  display:block!important;
}
.travel-prediction-selected span{
  display:block!important;
  font-size:10.5px!important;
  color:#64748b!important;
  margin:0 0 2px!important;
  font-weight:800!important;
}
.travel-prediction-selected strong{
  display:block!important;
  font-size:16px!important;
  color:#17202a!important;
  line-height:1.12!important;
  font-weight:950!important;
}
.travel-prediction-selected small{
  display:block!important;
  color:#64748b!important;
  font-size:10.5px!important;
  margin-top:3px!important;
}
.travel-prediction-selected.has-data>div:last-child strong{
  color:#0b55c8!important;
}
.travel-prediction-loading,
.travel-prediction-empty{
  font-size:12px!important;
  color:#64748b!important;
  background:#f8fafc!important;
  border:1px solid #e5eaf0!important;
  border-radius:10px!important;
  padding:8px 10px!important;
  margin-bottom:9px!important;
}
.travel-prediction-cols{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:10px!important;
}
.travel-prediction-cols h4{
  font-size:12.5px!important;
  color:#17202a!important;
  margin:0 0 6px!important;
  font-weight:900!important;
}
.travel-prediction-cols ul{
  list-style:none!important;
  margin:0!important;
  padding:0!important;
  display:grid!important;
  gap:7px!important;
}
.travel-prediction-cols li{
  display:grid!important;
  gap:2px!important;
  border:1px solid #e0e7ef!important;
  background:#fff!important;
  border-radius:10px!important;
  padding:8px!important;
}
.travel-prediction-cols li span{
  font-size:10.5px!important;
  color:#64748b!important;
}
.travel-prediction-cols li strong{
  font-size:15px!important;
  line-height:1.1!important;
  color:#17202a!important;
  font-weight:950!important;
}
.travel-prediction-cols li small{
  font-size:10.5px!important;
  color:#64748b!important;
}
.travel-prediction-cols .best strong{color:#15803d!important}
.travel-prediction-cols .worst strong{color:#c91515!important}
@media(max-width:1100px){
  .travel-map-panels{right:72px!important;gap:8px!important}
  .travel-map-panels .travel-times-panel,
  .travel-map-panels .travel-times-panel.travel-times-map-panel,
  .travel-map-panels .travel-times-panel.travel-prediction-map-panel{
    flex:1 1 calc(50% - 6px)!important;
    width:calc(50% - 6px)!important;
    min-width:280px!important;
    max-width:none!important;
  }
  .travel-prediction-controls{grid-template-columns:1fr!important}
  .travel-prediction-selected{grid-template-columns:1fr!important}
  .travel-prediction-cols{grid-template-columns:1fr!important}
}
@media(max-width:760px){
  .travel-map-panels{top:72px!important;left:10px!important;right:10px!important;flex-direction:column!important}
  .travel-map-panels .travel-times-panel,
  .travel-map-panels .travel-times-panel.travel-times-map-panel,
  .travel-map-panels .travel-times-panel.travel-prediction-map-panel{
    flex:0 0 auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
  }
  .travel-map-panels .travel-times-content,
  .travel-map-panels .travel-prediction-content{max-height:42vh!important}
}

/* Patch 8L: Hinweis-X zentrieren, Fahrstreifen-Tempo kompakter */
.general-notice-close,
.general-notice-panel .general-notice-close{
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  line-height:1!important;
  font-family:Arial,Helvetica,sans-serif!important;
}
.traffic-lane-speed .speed-limit-sign.lane,
.leaflet-popup-content .traffic-lane-speed .speed-limit-sign.lane{
  width:21px!important;
  height:21px!important;
  min-width:21px!important;
  min-height:21px!important;
  border-width:3px!important;
  font-size:9px!important;
  line-height:1!important;
  font-weight:900!important;
  padding:0!important;
}
.traffic-flow-graphic.has-lane-speed .traffic-flow-lane.frontend-simple{
  gap:1px!important;
}

/* Patch 8M */
.map-behaviour-grid{margin-top:12px}.message-date-grid{margin-top:12px}.message-speed-row{max-width:520px}.admin-table td .route-direction-cell{white-space:normal}.travel-prediction-map-panel[hidden]{display:none!important}


/* Patch 8O: Zeilenumbrüche in Meldungsliste und HERE Traffic Vergleichshinweise */
.message-description{white-space:pre-line!important;}
.here-traffic-meta{font-size:12px;color:#64748b;margin-top:4px;}
.here-traffic-note{font-size:11px;color:#64748b;margin-top:6px;line-height:1.25;}

/* Patch 8P: Backend-only HERE Traffic diagnostics */
.here-diagnosis-status{margin-top:12px}
.here-diagnosis-summary>div{border:1px solid var(--line);border-radius:12px;background:#f8fafc;padding:12px}
.here-diagnosis-summary h3{margin:0 0 8px;font-size:15px}
.here-diagnosis-summary p{margin:4px 0;color:#334155}
.table-scroll{overflow:auto;max-width:100%}
.table-scroll table{min-width:900px}

/* Patch 8R: individuelle Fahrtrichtung je Fahrstreifen per Klick */
.lane-editor-row{
  grid-template-columns:72px minmax(150px,1fr) minmax(130px,180px) minmax(150px,220px) minmax(130px,180px) minmax(190px,240px)!important;
  align-items:end!important;
}
.lane-direction-toggle,
.contra-direction-toggle{
  border:1px solid var(--line);
  border-radius:10px;
  background:#eaf8ee;
  color:#111827;
  padding:8px 10px;
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-weight:800;
  cursor:pointer;
}
.lane-direction-toggle:hover,
.contra-direction-toggle:hover{
  outline:2px solid rgba(15,98,254,.18);
}
.lane-direction-toggle[disabled],
.contra-direction-toggle[disabled]{
  cursor:not-allowed;
  opacity:.45;
  background:#f3f4f6;
}
.lane-direction-toggle .traffic-lane-icon,
.contra-direction-toggle .traffic-lane-icon{
  width:24px!important;
  height:24px!important;
  min-width:24px!important;
  min-height:24px!important;
  max-width:24px!important;
  max-height:24px!important;
}
.contra-flow-graphic-editor .contra-direction-toggle{
  width:100%;
  min-height:46px;
  gap:8px;
}
.contra-flow-graphic-editor .contra-direction-toggle .traffic-lane-icon{
  width:28px!important;
  height:28px!important;
  min-width:28px!important;
  min-height:28px!important;
  max-width:28px!important;
  max-height:28px!important;
}
@media (max-width:900px){
  .lane-editor-row{grid-template-columns:1fr!important}
}


/* Patch 8S: Pfeilrichtung getrennt von Fahrtrichtung pflegen */
.lane-editor-row{
  grid-template-columns:72px minmax(140px,1fr) minmax(130px,170px) minmax(145px,210px) minmax(120px,160px) minmax(150px,190px) minmax(190px,240px)!important;
  align-items:end!important;
}
.lane-arrow-toggle,
.contra-arrow-toggle,
.lane-direction-toggle,
.contra-direction-toggle{
  border:1px solid var(--line);
  border-radius:10px;
  background:#eaf8ee;
  color:#111827;
  padding:8px 10px;
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-weight:800;
  cursor:pointer;
}
.lane-arrow-toggle:hover,
.contra-arrow-toggle:hover,
.lane-direction-toggle:hover,
.contra-direction-toggle:hover{
  outline:2px solid rgba(15,98,254,.18);
}
.lane-arrow-toggle[disabled],
.contra-arrow-toggle[disabled],
.lane-direction-toggle[disabled],
.contra-direction-toggle[disabled]{
  cursor:not-allowed;
  opacity:.45;
  background:#f3f4f6;
}
.lane-arrow-toggle .traffic-lane-icon,
.contra-arrow-toggle .traffic-lane-icon,
.lane-direction-toggle .traffic-lane-icon,
.contra-direction-toggle .traffic-lane-icon{
  width:24px!important;
  height:24px!important;
  min-width:24px!important;
  min-height:24px!important;
  max-width:24px!important;
  max-height:24px!important;
}
.lane-direction-select-wrap{
  display:flex;
  flex-direction:column;
  gap:4px;
  font-size:12px;
  font-weight:700;
  color:var(--muted);
}
.lane-direction-select-wrap select{
  border:1px solid var(--line);
  border-radius:8px;
  padding:7px 8px;
  background:#fff;
  font-weight:700;
  min-height:42px;
}
.contra-flow-graphic-editor .contra-arrow-toggle{
  width:100%;
  min-height:46px;
  gap:8px;
}
.contra-flow-graphic-editor .contra-arrow-toggle .traffic-lane-icon{
  width:28px!important;
  height:28px!important;
  min-width:28px!important;
  min-height:28px!important;
  max-width:28px!important;
  max-height:28px!important;
}
@media (max-width:900px){
  .lane-editor-row{grid-template-columns:1fr!important}
}

/* Patch 8T: Popup-Fahrbahngrafik etwas zur Mitte schieben, damit lange Seitentitel nicht abgeschnitten werden */
.leaflet-popup-content .traffic-flow-graphic.contra{
  padding-left:12px!important;
  box-sizing:border-box!important;
}
.leaflet-popup-content .traffic-flow-graphic.contra .traffic-flow-road{
  margin-left:4px!important;
}
.leaflet-popup-content .traffic-flow-graphic.contra .traffic-flow-side-title{
  font-size:8.7px!important;
  line-height:1.02!important;
  max-width:124px!important;
}
@media (max-width:420px){
  .leaflet-popup-content .traffic-flow-graphic.contra{
    padding-left:8px!important;
  }
  .leaflet-popup-content .traffic-flow-graphic.contra .traffic-flow-road{
    margin-left:2px!important;
  }
  .leaflet-popup-content .traffic-flow-graphic.contra .traffic-flow-side-title{
    font-size:7.8px!important;
    max-width:112px!important;
  }
}

/* Patch 9A: PDF-Handout / Export */
.handout-panel{border-top:1px solid var(--line);padding:12px 14px 16px;background:#fff;display:grid;gap:8px;flex:0 0 auto}
.handout-export-button,.handout-link-button{display:inline-flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;font-weight:800;border-radius:10px;border:1px solid var(--line);padding:9px 10px;background:#fff;color:#16202c;cursor:pointer}
.handout-export-button{background:#0f62fe;color:#fff;border-color:#0f62fe}
.handout-export-button:disabled{opacity:.65;cursor:progress}
.handout-downloads{display:grid;gap:4px;font-size:13px}.handout-downloads a{color:#0f62fe;text-decoration:none}.handout-downloads a:hover{text-decoration:underline}.handout-help{font-size:12px;color:var(--muted);margin:0}.handout-admin-preview,.handout-admin-files{border:1px solid var(--line);background:#f8fafc;border-radius:12px;padding:10px 12px;margin:8px 0}.check-row.inline{display:inline-flex;margin-left:12px}.list-panel{min-height:0}
@media (max-width: 700px){.handout-panel{padding:10px 12px}.handout-export-button,.handout-link-button{font-size:14px}}

/* Patch 9Q: Handout-Container 240px breit, kompakt und mit 20px Abstand */
.map-wrap .handout-panel{
  position:absolute!important;
  left:20px!important;
  right:auto!important;
  bottom:20px!important;
  bottom:max(20px, env(safe-area-inset-bottom))!important;
  z-index:620!important;
  width:min(240px, calc(100% - 40px))!important;
  max-width:calc(100% - 40px)!important;
  border:1px solid var(--line)!important;
  border-radius:10px!important;
  box-shadow:0 5px 14px rgba(15,23,42,.12)!important;
  padding:7px!important;
  background:#fff!important;
  display:grid!important;
  gap:5px!important;
}
.map-wrap .handout-export-button,
.map-wrap .handout-link-button{
  min-height:32px!important;
  padding:6px 7px!important;
  border-radius:8px!important;
  font-size:12.5px!important;
  line-height:1.15!important;
  font-weight:800!important;
  white-space:normal!important;
  letter-spacing:0!important;
}
.map-wrap .handout-downloads{
  max-height:84px!important;
  overflow:auto;
  padding-right:1px!important;
  font-size:11.2px!important;
  line-height:1.2!important;
  gap:2px!important;
}
.map-wrap .handout-downloads strong{
  font-size:10.8px!important;
  line-height:1.16!important;
  margin-bottom:1px!important;
  color:#526170;
}
.map-wrap .handout-downloads a{
  font-size:11.2px!important;
  line-height:1.2!important;
  overflow-wrap:anywhere;
}
.map-wrap .handout-help{
  font-size:10.8px!important;
  line-height:1.2!important;
  color:#526170;
}
.sidebar>.handout-panel{display:none!important}
.handout-map-select-overlay{position:absolute;inset:0;z-index:9000;cursor:crosshair;background:rgba(15,23,42,.08);pointer-events:auto;user-select:none}.handout-map-select-hint{position:absolute;left:50%;top:16px;transform:translateX(-50%);background:#fff;border:1px solid var(--line);border-radius:12px;padding:9px 13px;font-weight:800;box-shadow:0 8px 24px rgba(15,23,42,.18);white-space:nowrap}.handout-map-select-rect{position:absolute;border:3px solid #0f62fe;background:rgba(15,98,254,.10);box-shadow:0 0 0 9999px rgba(255,255,255,.05)}
@media (max-width:900px){.map-wrap .handout-panel{left:16px!important;bottom:20px!important;bottom:max(20px, env(safe-area-inset-bottom))!important;width:min(240px, calc(100% - 32px))!important;max-width:calc(100% - 32px)!important}}
@media (max-width:700px){.map-wrap .handout-panel{right:auto!important;left:12px!important;bottom:20px!important;bottom:max(20px, env(safe-area-inset-bottom))!important;width:min(240px, calc(100% - 24px))!important;max-width:calc(100% - 24px)!important;padding:7px!important}.map-wrap .handout-export-button,.map-wrap .handout-link-button{min-height:31px!important;padding:5px 6px!important;font-size:12px!important}.handout-map-select-hint{max-width:calc(100vw - 30px);white-space:normal;text-align:center}}

/* Patch 9H: preserve manually entered line breaks */
.popup-text-preline,.popup-description,.popup-description-text,.message-description{white-space:pre-line!important;}

.handout-admin-file-row{border-top:1px solid var(--line);padding-top:10px;margin-top:10px}.handout-admin-file-row:first-child{border-top:0;padding-top:0;margin-top:0}.compact-grid{gap:8px}

/* Backend 2FA */
.twofa-login-box{max-width:440px}.twofa-card h1{margin-top:0}.twofa-status-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:12px 0 18px}.twofa-status-grid>div{border:1px solid var(--line);border-radius:12px;background:#f8fafc;padding:12px}.twofa-status-grid strong{display:block;font-size:14px;margin-bottom:4px}.twofa-status-grid span{display:block;color:#526170}.twofa-setup-grid{display:grid;grid-template-columns:240px minmax(0,1fr);gap:20px;align-items:start;margin:12px 0 18px}.twofa-qr{width:220px;height:220px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:10px}.twofa-secret{display:block;border:1px solid var(--line);border-radius:12px;background:#f8fafc;padding:10px 12px;font-size:17px;line-height:1.45;letter-spacing:.08em;word-break:break-all}.twofa-steps{margin:8px 0 18px 22px;padding:0;line-height:1.5}.twofa-confirm-form{margin-top:14px;max-width:440px}.twofa-recovery-box{border:1px solid #bce6c8;background:#eaf8ee;border-radius:14px;padding:14px 16px;margin:16px 0}.twofa-recovery-box h2{margin-top:0}.twofa-recovery-codes{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;max-width:620px}.twofa-recovery-codes code{display:block;border:1px solid #bce6c8;border-radius:9px;background:#fff;padding:8px 10px;text-align:center;font-weight:800;letter-spacing:.08em}.inline-form{display:inline-block;margin-top:10px}@media(max-width:720px){.twofa-setup-grid{grid-template-columns:1fr}.twofa-qr{width:200px;height:200px}.twofa-recovery-codes{grid-template-columns:1fr 1fr}}@media(max-width:420px){.twofa-recovery-codes{grid-template-columns:1fr}}

/* Patch 10A: Backend 2FA / Microsoft Authenticator */
.twofa-qr-wrap{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:14px;background:#fff;padding:12px;box-shadow:0 4px 14px rgba(15,23,42,.06)}
.twofa-qr-wrap svg{display:block;width:220px;height:220px;max-width:100%}
.twofa-inline-form{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:8px 0 16px}
.twofa-inline-form input{border:1px solid var(--line);border-radius:9px;padding:9px 11px;min-width:160px}
.twofa-recovery-box pre{white-space:pre-wrap;display:inline-block;min-width:220px;border:1px solid #bce6c8;border-radius:12px;background:#fff;padding:12px 16px;font-size:16px;line-height:1.6;letter-spacing:.08em;font-weight:800}
.twofa-card ol{padding-left:20px;line-height:1.55}.twofa-card code{word-break:break-all}
@media(max-width:720px){.twofa-qr-wrap svg{width:200px;height:200px}.twofa-inline-form{display:grid}.twofa-inline-form input{min-width:0;width:100%}}

/* Patch 10A: Backend-2FA / Microsoft Authenticator */
.twofa-card .twofa-setup-grid{display:grid;grid-template-columns:auto minmax(220px,1fr);gap:18px;align-items:start;margin:14px 0}
.twofa-qr{display:block;width:245px;max-width:100%;height:auto;border:1px solid var(--line);border-radius:12px;background:#fff;padding:10px;box-sizing:border-box}
.twofa-secret{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;font-weight:800;letter-spacing:.08em;line-height:1.7;border:1px dashed var(--line);background:#f8fafc;border-radius:10px;padding:10px 12px;word-break:break-word}
.twofa-recovery-codes{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;font-size:16px;font-weight:800;line-height:1.55;background:#0f172a;color:#fff;border-radius:12px;padding:14px 16px;white-space:pre-wrap;letter-spacing:.05em;max-width:360px}
.twofa-status{border:1px solid var(--line);background:#f8fafc;border-radius:12px;padding:12px 14px;margin:10px 0 14px}
.twofa-status.ok{border-color:#bbf7d0;background:#f0fdf4;color:#14532d}
.twofa-steps{margin:8px 0 14px;padding-left:22px}.twofa-steps li{margin:4px 0}.twofa-login-box{max-width:760px}.login-box .twofa-card{box-shadow:none;border:0;padding:0;margin:0;background:transparent}.login-box .twofa-card h1{margin-top:0}
@media (max-width:700px){.twofa-card .twofa-setup-grid{grid-template-columns:1fr}.twofa-qr{width:220px}.twofa-recovery-codes{font-size:14px;max-width:100%}}

/* Patch 10B: 2FA-Ansichten konsistent stylen */
.twofa-standalone{max-width:980px;margin:32px auto;padding:0 16px}
.twofa-secret-box{border:1px dashed var(--line);background:#f8fafc;border-radius:12px;padding:12px 14px;margin:12px 0;display:grid;gap:4px;max-width:520px}
.twofa-secret-box code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;font-weight:800;letter-spacing:.08em;line-height:1.6;word-break:break-all;color:#0f172a}
.twofa-recovery-card{border-color:#bbf7d0;background:#f0fdf4}
.twofa-recovery-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:8px;max-width:620px;margin-top:10px}
.twofa-recovery-list code{display:block;border:1px solid #bbf7d0;border-radius:9px;background:#fff;padding:8px 10px;text-align:center;font-weight:800;letter-spacing:.08em;color:#0f172a}

/* Admin safety/backups + legal follow links */
.backup-counter{min-width:120px;text-align:center;border:1px solid var(--line);border-radius:12px;background:#f8fafc;padding:10px 12px}.admin-table.compact td,.admin-table.compact th{padding:8px 10px}.legal-page-content a{color:#0b63ce;text-decoration:underline;font-weight:700;overflow-wrap:anywhere}.legal-page-content a:hover{text-decoration-thickness:2px}

/* Patch: Backend-Vorschau für Kartenmittelpunkt und Start-Zoom */
.settings-map-preview-card{
  border:1px solid var(--line)!important;
  border-radius:14px!important;
  background:#f8fafc!important;
  padding:12px!important;
  margin:4px 0 18px!important;
}
.settings-map-preview-head{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:14px!important;
  margin-bottom:10px!important;
}
.settings-map-preview-head strong{
  display:block!important;
  font-size:15px!important;
  margin-bottom:3px!important;
}
.settings-start-preview-map{
  height:430px!important;
  min-height:360px!important;
  margin:0!important;
  background:#e8eef5!important;
}
.settings-map-status{
  margin:8px 2px 0!important;
}
.settings-center-marker{
  width:28px!important;
  height:28px!important;
  border:3px solid #0f62fe!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.86)!important;
  box-shadow:0 2px 8px rgba(15,23,42,.28)!important;
}
.settings-center-marker::before,
.settings-center-marker::after{
  content:"";
  position:absolute;
  background:#0f62fe;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}
.settings-center-marker::before{width:17px;height:3px;border-radius:3px}
.settings-center-marker::after{width:3px;height:17px;border-radius:3px}
.settings-center-marker span{
  position:absolute;
  left:50%;
  top:50%;
  width:5px;
  height:5px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:#fff;
  z-index:2;
}
@media (max-width:760px){
  .settings-map-preview-head{display:block!important}
  .settings-map-preview-head .button{width:100%;margin-top:10px!important}
  .settings-start-preview-map{height:330px!important;min-height:300px!important}
}

/* Patch 10C: Mobile Web-Version + PDF-Fallback-Kartenausschnitt */
.mobile-page,
.mobile-bottom-nav{display:none}
.handout-fallback-map-preview-card{margin-top:12px!important}
.handout-fallback-preview-map{height:380px!important;min-height:280px!important;background:#e8eef5!important}

@media (max-width:900px){
  body.app-shell,
  body.embed-mode{
    display:block!important;
    height:100dvh!important;
    min-height:100vh!important;
    overflow:hidden!important;
    background:#eef2f6!important;
  }
  body.app-shell .map-wrap,
  body.embed-mode .map-wrap{
    position:relative!important;
    width:100%!important;
    height:100dvh!important;
    min-height:100vh!important;
    overflow:hidden!important;
  }
  body.app-shell .map,
  body.embed-mode .map{
    height:100dvh!important;
    min-height:100vh!important;
    width:100%!important;
  }
  body.app-shell .mobile-toggle,
  body.embed-mode .mobile-toggle{display:none!important}

  body.app-shell .sidebar,
  body.embed-mode .sidebar{
    position:absolute!important;
    inset:auto!important;
    top:env(safe-area-inset-top,0)!important;
    left:50%!important;
    width:min(88vw,430px)!important;
    height:auto!important;
    min-height:0!important;
    max-height:calc(100dvh - 88px)!important;
    transform:translateX(-50%)!important;
    transition:none!important;
    border:0!important;
    border-radius:0 0 4px 4px!important;
    box-shadow:0 4px 16px rgba(15,23,42,.18)!important;
    background:#fff!important;
    z-index:680!important;
    overflow:visible!important;
  }
  body.app-shell .sidebar.open,
  body.embed-mode .sidebar.open{transform:translateX(-50%)!important}
  body.app-shell.mobile-view-travel .sidebar,
  body.app-shell.mobile-view-info .sidebar,
  body.embed-mode.mobile-view-travel .sidebar,
  body.embed-mode.mobile-view-info .sidebar{display:none!important}

  body.app-shell .brand,
  body.embed-mode .brand{
    padding:10px 12px!important;
    border-bottom:1px solid #e7ebef!important;
    background:#fff!important;
    min-height:54px!important;
  }
  body.app-shell .brand strong,
  body.embed-mode .brand strong{font-size:16px!important;line-height:1.05!important;color:#003c7a!important}
  body.app-shell .brand span,
  body.embed-mode .brand span{font-size:10px!important;margin-top:2px!important;color:#687382!important}
  body.app-shell .language-switch,
  body.embed-mode .language-switch{gap:4px!important;align-items:center!important}
  body.app-shell .language-switch a,
  body.embed-mode .language-switch a{padding:5px 7px!important;border-radius:8px!important;font-size:10px!important;font-weight:900!important;text-decoration:none!important}

  body.app-shell .time-panel,
  body.embed-mode .time-panel{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:8px!important;
    padding:10px 12px!important;
    border-bottom:1px solid #edf0f3!important;
    background:#fff!important;
    white-space:nowrap!important;
  }
  body.app-shell .time-panel label,
  body.embed-mode .time-panel label{
    margin:0!important;
    gap:6px!important;
    font-size:14px!important;
    color:#29313b!important;
  }
  body.app-shell .time-panel input[type="radio"],
  body.embed-mode .time-panel input[type="radio"]{width:20px!important;height:20px!important;accent-color:#0f62fe!important}
  body.app-shell .time-inputs,
  body.embed-mode .time-inputs{
    position:absolute!important;
    top:100%!important;
    left:0!important;
    right:0!important;
    z-index:3!important;
    margin:0!important;
    padding:9px 12px!important;
    border-top:1px solid var(--line)!important;
    background:#fff!important;
    box-shadow:0 8px 18px rgba(15,23,42,.14)!important;
    display:none!important;
    grid-template-columns:1fr!important;
    gap:7px!important;
  }
  body.app-shell .time-inputs.time-mode-point,
  body.app-shell .time-inputs.time-mode-range,
  body.embed-mode .time-inputs.time-mode-point,
  body.embed-mode .time-inputs.time-mode-range{display:grid!important}

  body.app-shell .filter-panel,
  body.embed-mode .filter-panel{
    padding:0!important;
    border-bottom:0!important;
    background:#f1f3f5!important;
  }
  body.app-shell .filter-dropdown-button,
  body.embed-mode .filter-dropdown-button{
    min-height:48px!important;
    width:100%!important;
    border:0!important;
    border-radius:0!important;
    background:#f1f3f5!important;
    box-shadow:none!important;
    justify-content:flex-start!important;
    gap:8px!important;
    padding:12px 14px!important;
    color:#29313b!important;
  }
  body.app-shell .filter-dropdown-title,
  body.embed-mode .filter-dropdown-title{font-size:0!important}
  body.app-shell .filter-dropdown-title::before,
  body.embed-mode .filter-dropdown-title::before{
    content:attr(data-mobile-label);
    font-size:14px!important;
    font-weight:900!important;
    color:#29313b!important;
  }
  body.app-shell .filter-dropdown-summary,
  body.embed-mode .filter-dropdown-summary{
    color:#0b63ce!important;
    font-weight:900!important;
    font-size:14px!important;
    text-transform:lowercase!important;
  }
  body.app-shell .filter-dropdown-arrow,
  body.embed-mode .filter-dropdown-arrow{margin-left:auto!important;color:#687382!important}
  body.app-shell .filter-dropdown-menu,
  body.embed-mode .filter-dropdown-menu{
    left:10px!important;
    right:10px!important;
    top:calc(100% + 2px)!important;
    border-radius:12px!important;
    box-shadow:0 10px 28px rgba(15,23,42,.20)!important;
    z-index:8!important;
  }
  body.app-shell .list-panel,
  body.embed-mode .list-panel,
  body.app-shell .travel-map-panels,
  body.embed-mode .travel-map-panels,
  body.app-shell .map-wrap .handout-panel,
  body.embed-mode .map-wrap .handout-panel,
  body.app-shell .frontend-legal-links,
  body.embed-mode .frontend-legal-links{display:none!important}

  body.app-shell .traffic-toggle,
  body.embed-mode .traffic-toggle{
    top:calc(165px + env(safe-area-inset-top,0px))!important;
    right:12px!important;
    z-index:620!important;
    font-size:12px!important;
    padding:7px 10px!important;
  }
  body.app-shell .leaflet-top.leaflet-right,
  body.embed-mode .leaflet-top.leaflet-right{top:calc(160px + env(safe-area-inset-top,0px))!important}
  body.app-shell .leaflet-bottom.leaflet-left,
  body.embed-mode .leaflet-bottom.leaflet-left,
  body.app-shell .leaflet-bottom.leaflet-right,
  body.embed-mode .leaflet-bottom.leaflet-right{bottom:calc(78px + env(safe-area-inset-bottom,0px))!important}

  body.app-shell .mobile-page,
  body.embed-mode .mobile-page{
    position:absolute!important;
    inset:0!important;
    z-index:660!important;
    display:none!important;
    background:#fff!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
    padding-bottom:calc(88px + env(safe-area-inset-bottom,0px))!important;
  }
  body.app-shell .mobile-page.is-active,
  body.embed-mode .mobile-page.is-active{display:block!important}
  body.app-shell .mobile-page[hidden],
  body.embed-mode .mobile-page[hidden]{display:none!important}

  .mobile-page-brand{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    width:min(86vw,430px)!important;
    margin:0 auto!important;
    padding:16px 0 12px!important;
    border-bottom:1px solid #e5e9ee!important;
    background:#fff!important;
  }
  .mobile-page-brand strong{display:block!important;font-size:17px!important;line-height:1.05!important;color:#003c7a!important}
  .mobile-page-brand span{display:block!important;font-size:10px!important;color:#687382!important;margin-top:2px!important}
  .mobile-page-content{width:min(86vw,430px)!important;margin:0 auto!important;padding:16px 0 24px!important}

  .mobile-travel-content h1{
    margin:0 0 14px!important;
    font-size:22px!important;
    line-height:1.15!important;
    color:#1f2937!important;
  }
  .mobile-travel-page .travel-times-status{
    display:grid!important;
    gap:2px!important;
    margin:0 0 12px!important;
    padding:9px 10px!important;
    border:1px solid #e1e7ee!important;
    border-radius:11px!important;
    background:#fff!important;
    color:#7b8794!important;
    font-size:12px!important;
    line-height:1.35!important;
  }
  .mobile-travel-page .travel-times-list{
    display:grid!important;
    gap:10px!important;
    max-height:none!important;
    overflow:visible!important;
    padding:0!important;
  }
  .mobile-travel-page .travel-time-group{
    border:1px solid #d9e1ea!important;
    border-radius:12px!important;
    overflow:hidden!important;
    background:#fff!important;
  }
  .mobile-travel-page .travel-time-group>summary{
    padding:10px 12px!important;
    background:#eef3f8!important;
    color:#1f2937!important;
    font-size:14px!important;
    line-height:1.25!important;
    font-weight:900!important;
  }
  .mobile-travel-page .travel-time-row{
    grid-template-columns:54px minmax(0,1fr)!important;
    gap:10px!important;
    padding:12px 10px!important;
    background:#fff!important;
    border-top:1px solid #edf0f3!important;
  }
  .mobile-travel-page .travel-time-road-badge{
    min-width:50px!important;
    height:32px!important;
    border-radius:7px!important;
    font-size:16px!important;
    background:#164bb7!important;
  }
  .mobile-travel-page .travel-time-name{font-size:15px!important;line-height:1.24!important;font-weight:900!important;margin-bottom:9px!important;color:#202834!important}
  .mobile-travel-page .travel-time-values{grid-template-columns:1fr 1fr!important;gap:8px 12px!important}
  .mobile-travel-page .travel-time-values .delay{grid-column:1 / -1!important}
  .mobile-travel-page .travel-time-values strong{font-size:20px!important;line-height:1.05!important;font-weight:950!important;color:#202834!important}
  .mobile-travel-page .travel-time-values span{font-size:11px!important;color:#7b8794!important;margin-top:3px!important}
  .mobile-travel-page .travel-time-values .delay .travel-delay-value{display:flex!important;align-items:baseline!important;gap:4px!important;color:var(--delay-color)!important}
  .mobile-travel-page .travel-time-values .delay .travel-delay-value small,
  .mobile-travel-page .travel-time-values .delay .travel-delay-value strong{color:var(--delay-color)!important}

  .mobile-info-content{padding-top:34px!important}
  .mobile-info-links{display:grid!important;gap:0!important;border-top:1px solid #e5e9ee!important;margin-bottom:28px!important}
  .mobile-info-links a{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:16px!important;
    min-height:56px!important;
    border-bottom:1px solid #e5e9ee!important;
    color:#5b6470!important;
    text-decoration:none!important;
    font-size:15px!important;
    font-weight:800!important;
    padding:0 0 0 20px!important;
  }
  .mobile-info-links a span{font-size:38px!important;line-height:1!important;color:#2f3338!important;font-weight:400!important}
  .mobile-info-content h2{
    margin:0 0 12px 20px!important;
    color:#69717c!important;
    font-size:18px!important;
    font-weight:900!important;
  }
  .mobile-info-downloads{margin-left:20px!important;display:grid!important;gap:8px!important}
  .mobile-info-downloads a{color:#0b63ce!important;font-weight:800!important;text-decoration:none!important;overflow-wrap:anywhere!important}
  .mobile-info-downloads .help{margin:0!important;color:#8a94a3!important;font-size:13px!important}

  .mobile-bottom-nav{
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    z-index:820!important;
    min-height:72px!important;
    padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px))!important;
    display:grid!important;
    grid-auto-flow:column!important;
    grid-auto-columns:1fr!important;
    gap:2px!important;
    background:#fff!important;
    border-top:1px solid #e4e8ee!important;
    box-shadow:0 -5px 18px rgba(15,23,42,.10)!important;
  }
  .mobile-bottom-nav button{
    min-width:0!important;
    border:0!important;
    background:transparent!important;
    color:#666d76!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:4px!important;
    padding:4px 2px!important;
    border-radius:14px!important;
    font-size:13px!important;
    line-height:1.05!important;
    cursor:pointer!important;
  }
  .mobile-bottom-nav button.active{color:#0066b3!important;background:#f5f9ff!important}
  .mobile-bottom-nav button[disabled]{opacity:.55!important;cursor:progress!important}
  .mobile-nav-icon{display:flex!important;align-items:center!important;justify-content:center!important;width:28px!important;height:28px!important;color:currentColor!important}
  .mobile-nav-icon svg{display:block!important;width:28px!important;height:28px!important;fill:currentColor!important}
  .mobile-bottom-nav button span:last-child{display:block!important;max-width:100%!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
}

@media (max-width:420px){
  .mobile-page-brand,
  .mobile-page-content{width:min(86vw,390px)!important}
  .mobile-bottom-nav button{font-size:12px!important}
  .mobile-nav-icon,
  .mobile-nav-icon svg{width:26px!important;height:26px!important}
  body.app-shell .time-panel label,
  body.embed-mode .time-panel label{font-size:13px!important;gap:5px!important}
}
@media (max-width:900px){
  body.app-shell .time-panel,
  body.embed-mode .time-panel{position:relative!important}
}

/* Patch 10D: Mobile-Korrektur nach Konzept/Video */
@media (max-width:900px){
  body.app-shell .leaflet-control-zoom,
  body.embed-mode .leaflet-control-zoom{
    display:none!important;
  }

  body.app-shell .leaflet-bottom.leaflet-right,
  body.embed-mode .leaflet-bottom.leaflet-right{
    right:14px!important;
    bottom:calc(100px + env(safe-area-inset-bottom,0px))!important;
  }
  body.app-shell .leaflet-bottom.leaflet-right .leaflet-control,
  body.embed-mode .leaflet-bottom.leaflet-right .leaflet-control{
    margin:0!important;
  }
  body.app-shell .leaflet-control-layers,
  body.embed-mode .leaflet-control-layers{
    border:0!important;
    border-radius:4px!important;
    box-shadow:0 2px 8px rgba(15,23,42,.20)!important;
  }
  body.app-shell .leaflet-control-layers-toggle,
  body.embed-mode .leaflet-control-layers-toggle{
    width:42px!important;
    height:42px!important;
    background-size:24px 24px!important;
  }

  body.app-shell.mobile-view-travel .leaflet-control-container,
  body.app-shell.mobile-view-info .leaflet-control-container,
  body.embed-mode.mobile-view-travel .leaflet-control-container,
  body.embed-mode.mobile-view-info .leaflet-control-container,
  body.app-shell.mobile-view-travel .traffic-toggle,
  body.app-shell.mobile-view-info .traffic-toggle,
  body.embed-mode.mobile-view-travel .traffic-toggle,
  body.embed-mode.mobile-view-info .traffic-toggle,
  body.app-shell.mobile-view-travel .general-notice-tab,
  body.app-shell.mobile-view-info .general-notice-tab,
  body.embed-mode.mobile-view-travel .general-notice-tab,
  body.embed-mode.mobile-view-info .general-notice-tab{
    display:none!important;
  }

  body.app-shell .mobile-page,
  body.embed-mode .mobile-page{
    z-index:1040!important;
  }
  body.app-shell .mobile-bottom-nav,
  body.embed-mode .mobile-bottom-nav{
    z-index:1200!important;
    min-height:76px!important;
    padding:6px 8px calc(7px + env(safe-area-inset-bottom,0px))!important;
    box-shadow:none!important;
  }
  body.app-shell .mobile-bottom-nav button,
  body.embed-mode .mobile-bottom-nav button{
    gap:3px!important;
    border-radius:0!important;
    background:transparent!important;
    color:#5f6670!important;
    font-weight:500!important;
  }
  body.app-shell .mobile-bottom-nav button.active,
  body.embed-mode .mobile-bottom-nav button.active{
    color:#0066b3!important;
    background:transparent!important;
  }
  body.app-shell .mobile-nav-icon,
  body.embed-mode .mobile-nav-icon{
    width:31px!important;
    height:31px!important;
    position:relative!important;
  }
  body.app-shell .mobile-nav-icon-img,
  body.embed-mode .mobile-nav-icon-img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
  }
  body.app-shell .mobile-nav-icon-active,
  body.embed-mode .mobile-nav-icon-active{
    display:none!important;
  }
  body.app-shell .mobile-bottom-nav button.active .mobile-nav-icon-default,
  body.embed-mode .mobile-bottom-nav button.active .mobile-nav-icon-default{
    display:none!important;
  }
  body.app-shell .mobile-bottom-nav button.active .mobile-nav-icon-active,
  body.embed-mode .mobile-bottom-nav button.active .mobile-nav-icon-active{
    display:block!important;
  }

  body.app-shell .general-notice-tab,
  body.embed-mode .general-notice-tab{
    left:14px!important;
    right:auto!important;
    top:auto!important;
    bottom:calc(92px + env(safe-area-inset-bottom,0px))!important;
    width:62px!important;
    min-height:54px!important;
    box-sizing:border-box!important;
    padding:8px 7px!important;
    border-radius:8px!important;
    writing-mode:horizontal-tb!important;
    text-orientation:mixed!important;
    text-align:center!important;
    font-size:12px!important;
    line-height:1.05!important;
    box-shadow:0 2px 8px rgba(15,23,42,.22)!important;
  }
  body.app-shell .general-notice-tab::before,
  body.embed-mode .general-notice-tab::before{
    display:none!important;
  }
  body.app-shell .general-notice-tab span,
  body.embed-mode .general-notice-tab span{
    display:block!important;
    padding:0!important;
    font-size:12px!important;
    line-height:1.05!important;
    white-space:normal!important;
    letter-spacing:0!important;
  }

  body.app-shell .time-inputs,
  body.embed-mode .time-inputs{
    max-height:40vh!important;
    overflow:auto!important;
  }
  body.app-shell .time-inputs input,
  body.embed-mode .time-inputs input{
    min-height:41px!important;
    box-sizing:border-box!important;
  }
}

@media (max-width:420px){
  body.app-shell .mobile-nav-icon,
  body.embed-mode .mobile-nav-icon{
    width:30px!important;
    height:30px!important;
  }
}

@media (max-width:900px){
  body.app-shell .leaflet-bottom.leaflet-right,
  body.embed-mode .leaflet-bottom.leaflet-right{
    bottom:calc(78px + env(safe-area-inset-bottom,0px))!important;
  }
  body.app-shell .leaflet-control-layers,
  body.embed-mode .leaflet-control-layers{
    position:fixed!important;
    right:14px!important;
    bottom:calc(102px + env(safe-area-inset-bottom,0px))!important;
    margin:0!important;
  }
}

/* Patch 10E: Mobile Feinschliff, mobiler Startausschnitt */
.time-input-field{
  display:none;
  gap:4px;
  min-width:0;
  color:#526170;
  font-size:12px;
  font-weight:800;
}
.time-input-field span{display:block;line-height:1.2}
.time-input-field input{width:100%;min-width:0}
.settings-mobile-map-preview-card{max-width:520px!important}
.settings-mobile-preview-map{
  width:min(390px,100%)!important;
  height:560px!important;
  min-height:460px!important;
  max-height:70vh!important;
  margin:0 auto!important;
  background:#e8eef5!important;
}

@media (max-width:900px){
  body.app-shell .time-panel,
  body.embed-mode .time-panel{
    flex-wrap:wrap!important;
    align-items:flex-start!important;
    row-gap:8px!important;
    padding-bottom:10px!important;
  }
  body.app-shell .time-panel>label,
  body.embed-mode .time-panel>label{
    flex:1 1 0!important;
    min-width:0!important;
  }
  body.app-shell .time-inputs,
  body.embed-mode .time-inputs{
    position:static!important;
    inset:auto!important;
    flex:0 0 100%!important;
    width:100%!important;
    margin:2px 0 0!important;
    padding:9px 0 0!important;
    border-top:1px solid #edf0f3!important;
    background:#fff!important;
    box-shadow:none!important;
    z-index:auto!important;
    max-height:none!important;
    overflow:visible!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
  }
  body.app-shell .time-inputs.time-mode-current,
  body.embed-mode .time-inputs.time-mode-current{
    display:none!important;
  }
  body.app-shell .time-input-field,
  body.embed-mode .time-input-field{
    display:none!important;
    gap:4px!important;
    color:#526170!important;
    font-size:11px!important;
    font-weight:900!important;
    letter-spacing:.01em!important;
  }
  body.app-shell .time-inputs.time-mode-point .time-input-at,
  body.embed-mode .time-inputs.time-mode-point .time-input-at,
  body.app-shell .time-inputs.time-mode-range .time-input-from,
  body.embed-mode .time-inputs.time-mode-range .time-input-from,
  body.app-shell .time-inputs.time-mode-range .time-input-to,
  body.embed-mode .time-inputs.time-mode-range .time-input-to{
    display:grid!important;
  }
  body.app-shell .time-input-field input,
  body.embed-mode .time-input-field input{
    display:block!important;
    width:100%!important;
    min-height:42px!important;
    border:1px solid #cfd8e3!important;
    border-radius:10px!important;
    background:#fff!important;
    box-sizing:border-box!important;
    padding:8px 10px!important;
    color:#1f2937!important;
    font-size:14px!important;
    line-height:1.2!important;
  }

  body.app-shell .filter-dropdown-menu,
  body.embed-mode .filter-dropdown-menu{
    z-index:1260!important;
  }

  body.app-shell .leaflet-bottom.leaflet-left,
  body.embed-mode .leaflet-bottom.leaflet-left{
    bottom:calc(78px + env(safe-area-inset-bottom,0px))!important;
    left:4px!important;
    max-width:calc(100vw - 104px)!important;
    z-index:730!important;
  }
  body.app-shell .leaflet-control-attribution,
  body.embed-mode .leaflet-control-attribution{
    max-width:calc(100vw - 104px)!important;
    max-height:18px!important;
    overflow:hidden!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
    box-sizing:border-box!important;
    margin:0!important;
    padding:1px 4px!important;
    font-size:10px!important;
    line-height:16px!important;
    background:rgba(255,255,255,.82)!important;
  }
  body.app-shell .leaflet-control-layers,
  body.embed-mode .leaflet-control-layers{
    z-index:1160!important;
    right:14px!important;
    bottom:calc(108px + env(safe-area-inset-bottom,0px))!important;
  }
  body.app-shell .leaflet-control-layers-expanded,
  body.embed-mode .leaflet-control-layers-expanded{
    max-width:calc(100vw - 32px)!important;
    background:rgba(255,255,255,.95)!important;
  }

  body.app-shell .general-notice-tab,
  body.embed-mode .general-notice-tab{
    left:14px!important;
    bottom:calc(110px + env(safe-area-inset-bottom,0px))!important;
    width:68px!important;
    min-height:58px!important;
    padding:7px 8px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
    z-index:1150!important;
  }
  body.app-shell .general-notice-tab span,
  body.embed-mode .general-notice-tab span{
    display:block!important;
    padding:0!important;
    margin:0!important;
    font-size:12px!important;
    line-height:1.02!important;
    text-align:center!important;
    white-space:normal!important;
    word-break:normal!important;
    hyphens:auto!important;
  }
  body.app-shell .general-notice,
  body.embed-mode .general-notice,
  body.app-shell .general-notice-panel,
  body.embed-mode .general-notice-panel{
    left:12px!important;
    right:12px!important;
    bottom:calc(110px + env(safe-area-inset-bottom,0px))!important;
    top:auto!important;
    width:auto!important;
    max-width:none!important;
    max-height:calc(100dvh - 245px)!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
    z-index:1145!important;
  }
}

@media (max-width:380px){
  body.app-shell .time-panel label,
  body.embed-mode .time-panel label{font-size:12px!important}
  body.app-shell .general-notice-tab,
  body.embed-mode .general-notice-tab{width:64px!important;min-height:56px!important}
}


/* Patch 10F: Mobile Feinkorrektur */
@media (max-width:900px){
  body.app-shell .time-panel,
  body.embed-mode .time-panel{
    position:relative!important;
    overflow:visible!important;
    flex-wrap:wrap!important;
    align-items:center!important;
    gap:8px!important;
  }
  body.app-shell .time-panel>label,
  body.embed-mode .time-panel>label{
    flex:1 1 0!important;
    min-width:max-content!important;
  }
  body.app-shell .time-inputs,
  body.embed-mode .time-inputs{
    position:static!important;
    flex:0 0 100%!important;
    width:100%!important;
    margin:2px 0 0!important;
    padding:9px!important;
    border:1px solid #dce5ef!important;
    border-radius:12px!important;
    background:#f8fafc!important;
    box-shadow:none!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    z-index:3!important;
  }
  body.app-shell .time-inputs.time-mode-current,
  body.embed-mode .time-inputs.time-mode-current{
    display:none!important;
  }
  body.app-shell .time-inputs.time-mode-point,
  body.app-shell .time-inputs.time-mode-range,
  body.embed-mode .time-inputs.time-mode-point,
  body.embed-mode .time-inputs.time-mode-range{
    display:grid!important;
  }
  body.app-shell .time-inputs.time-mode-point .time-input-at,
  body.embed-mode .time-inputs.time-mode-point .time-input-at,
  body.app-shell .time-inputs.time-mode-range .time-input-from,
  body.embed-mode .time-inputs.time-mode-range .time-input-from,
  body.app-shell .time-inputs.time-mode-range .time-input-to,
  body.embed-mode .time-inputs.time-mode-range .time-input-to{
    display:grid!important;
  }
  body.app-shell .time-input-field,
  body.embed-mode .time-input-field{
    width:100%!important;
    margin:0!important;
    gap:4px!important;
    color:#526170!important;
    font-size:11px!important;
    font-weight:900!important;
    line-height:1.15!important;
    letter-spacing:.01em!important;
  }
  body.app-shell .time-input-field span,
  body.embed-mode .time-input-field span{
    display:block!important;
  }
  body.app-shell .time-input-field input,
  body.embed-mode .time-input-field input{
    display:block!important;
    width:100%!important;
    min-height:42px!important;
    border:1px solid #cfd8e3!important;
    border-radius:10px!important;
    background:#fff!important;
    box-sizing:border-box!important;
    padding:8px 10px!important;
    color:#1f2937!important;
    font-size:14px!important;
    line-height:1.2!important;
  }

  body.app-shell .general-notice-tab,
  body.embed-mode .general-notice-tab{
    left:14px!important;
    right:auto!important;
    top:auto!important;
    bottom:calc(122px + env(safe-area-inset-bottom,0px))!important;
    width:70px!important;
    min-width:70px!important;
    max-width:70px!important;
    min-height:50px!important;
    padding:6px 7px!important;
    border-radius:8px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
    writing-mode:horizontal-tb!important;
    text-orientation:mixed!important;
    z-index:1350!important;
    box-shadow:0 2px 8px rgba(15,23,42,.22)!important;
  }
  body.app-shell .general-notice-tab span,
  body.embed-mode .general-notice-tab span{
    display:block!important;
    padding:0!important;
    margin:0!important;
    font-size:0!important;
    line-height:0!important;
    white-space:normal!important;
  }
  body.app-shell .general-notice-tab span::before,
  body.embed-mode .general-notice-tab span::before{
    content:attr(data-mobile-label)!important;
    display:block!important;
    color:#fff!important;
    font-size:10.5px!important;
    line-height:1.05!important;
    font-weight:900!important;
    text-align:center!important;
    white-space:normal!important;
  }
  body.app-shell .general-notice,
  body.embed-mode .general-notice,
  body.app-shell .general-notice-panel,
  body.embed-mode .general-notice-panel{
    left:12px!important;
    right:12px!important;
    bottom:calc(178px + env(safe-area-inset-bottom,0px))!important;
    top:auto!important;
    width:auto!important;
    max-width:none!important;
    max-height:calc(100dvh - 330px)!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
    z-index:1360!important;
  }

  body.app-shell .leaflet-control-container,
  body.embed-mode .leaflet-control-container{
    z-index:1000!important;
  }
  body.app-shell .leaflet-bottom.leaflet-left,
  body.embed-mode .leaflet-bottom.leaflet-left{
    left:4px!important;
    bottom:calc(82px + env(safe-area-inset-bottom,0px))!important;
    max-width:calc(100vw - 128px)!important;
    z-index:720!important;
  }
  body.app-shell .leaflet-control-attribution,
  body.embed-mode .leaflet-control-attribution{
    max-width:calc(100vw - 128px)!important;
    max-height:16px!important;
    overflow:hidden!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
    margin:0!important;
    padding:1px 4px!important;
    font-size:9px!important;
    line-height:14px!important;
    background:rgba(255,255,255,.78)!important;
    box-shadow:none!important;
    pointer-events:auto!important;
  }
  body.app-shell .leaflet-bottom.leaflet-right,
  body.embed-mode .leaflet-bottom.leaflet-right{
    right:14px!important;
    bottom:calc(122px + env(safe-area-inset-bottom,0px))!important;
    z-index:1340!important;
  }
  body.app-shell .leaflet-control-layers,
  body.embed-mode .leaflet-control-layers{
    position:relative!important;
    right:auto!important;
    bottom:auto!important;
    margin:0!important;
    z-index:1340!important;
    box-shadow:0 2px 8px rgba(15,23,42,.22)!important;
  }
  body.app-shell .leaflet-control-layers-expanded,
  body.embed-mode .leaflet-control-layers-expanded{
    max-width:calc(100vw - 36px)!important;
    background:rgba(255,255,255,.97)!important;
  }
}

@media (max-width:380px){
  body.app-shell .general-notice-tab,
  body.embed-mode .general-notice-tab{
    width:66px!important;
    min-width:66px!important;
    max-width:66px!important;
  }
  body.app-shell .general-notice-tab span::before,
  body.embed-mode .general-notice-tab span::before{
    font-size:10px!important;
  }
  body.app-shell .time-panel>label,
  body.embed-mode .time-panel>label{
    font-size:12px!important;
  }
}

/* Patch 10F: Mobile Feinschliff zweite Runde */
@media (max-width:900px){
  body.app-shell .time-inputs.time-mode-point,
  body.app-shell .time-inputs.time-mode-range,
  body.embed-mode .time-inputs.time-mode-point,
  body.embed-mode .time-inputs.time-mode-range{
    display:grid!important;
  }
  body.app-shell .time-inputs.time-mode-range,
  body.embed-mode .time-inputs.time-mode-range{
    grid-template-columns:1fr 1fr!important;
    column-gap:8px!important;
  }
  body.app-shell .time-inputs.time-mode-point,
  body.embed-mode .time-inputs.time-mode-point{
    grid-template-columns:1fr!important;
  }
  body.app-shell .time-inputs.time-mode-range .time-input-field,
  body.embed-mode .time-inputs.time-mode-range .time-input-field{
    min-width:0!important;
  }
  body.app-shell .general-notice-tab,
  body.embed-mode .general-notice-tab{
    position:fixed!important;
    left:14px!important;
    top:auto!important;
    bottom:calc(118px + env(safe-area-inset-bottom,0px))!important;
    border-radius:0!important;
    background:#df001b!important;
    color:#fff!important;
    z-index:1320!important;
  }
  body.app-shell .general-notice,
  body.embed-mode .general-notice,
  body.app-shell .general-notice-panel,
  body.embed-mode .general-notice-panel{
    position:fixed!important;
    left:12px!important;
    right:12px!important;
    top:auto!important;
    bottom:calc(184px + env(safe-area-inset-bottom,0px))!important;
    max-height:calc(100dvh - 315px)!important;
    z-index:1330!important;
  }
  body.app-shell .leaflet-control-layers,
  body.embed-mode .leaflet-control-layers{
    position:fixed!important;
    right:14px!important;
    bottom:calc(118px + env(safe-area-inset-bottom,0px))!important;
    z-index:1325!important;
  }
  body.app-shell .leaflet-bottom.leaflet-left,
  body.embed-mode .leaflet-bottom.leaflet-left{
    left:86px!important;
    bottom:calc(84px + env(safe-area-inset-bottom,0px))!important;
    max-width:calc(100vw - 176px)!important;
    z-index:700!important;
  }
  body.app-shell .leaflet-control-attribution,
  body.embed-mode .leaflet-control-attribution,
  body.app-shell .maplibregl-ctrl-attrib,
  body.embed-mode .maplibregl-ctrl-attrib{
    max-width:calc(100vw - 176px)!important;
    max-height:18px!important;
    overflow:hidden!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
    pointer-events:none!important;
  }
}
@media (max-width:420px){
  body.app-shell .time-inputs.time-mode-range,
  body.embed-mode .time-inputs.time-mode-range{
    grid-template-columns:1fr!important;
  }
  body.app-shell .general-notice,
  body.embed-mode .general-notice,
  body.app-shell .general-notice-panel,
  body.embed-mode .general-notice-panel{
    max-height:calc(100dvh - 300px)!important;
  }
}


/* Patch 10G: Quellenangabe der Karte mobil sichtbar halten */
@media (max-width:900px){
  body.app-shell.mobile-view-roadworks .leaflet-control-container,
  body.embed-mode.mobile-view-roadworks .leaflet-control-container{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
  }
  body.app-shell .leaflet-bottom.leaflet-left,
  body.embed-mode .leaflet-bottom.leaflet-left{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    left:4px!important;
    bottom:calc(82px + env(safe-area-inset-bottom,0px))!important;
    max-width:calc(100vw - 112px)!important;
    z-index:1322!important;
    pointer-events:auto!important;
  }
  body.app-shell .leaflet-control-attribution,
  body.embed-mode .leaflet-control-attribution{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    max-width:calc(100vw - 112px)!important;
    max-height:18px!important;
    overflow:hidden!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
    box-sizing:border-box!important;
    margin:0!important;
    padding:1px 4px!important;
    font-size:9px!important;
    line-height:15px!important;
    background:rgba(255,255,255,.84)!important;
    color:#475569!important;
    box-shadow:none!important;
    pointer-events:auto!important;
  }
  body.app-shell .leaflet-control-attribution a,
  body.embed-mode .leaflet-control-attribution a{
    color:#2563eb!important;
    text-decoration:none!important;
  }
  body.app-shell.mobile-view-travel .leaflet-bottom.leaflet-left,
  body.app-shell.mobile-view-info .leaflet-bottom.leaflet-left,
  body.embed-mode.mobile-view-travel .leaflet-bottom.leaflet-left,
  body.embed-mode.mobile-view-info .leaflet-bottom.leaflet-left,
  body.app-shell.mobile-view-travel .leaflet-control-attribution,
  body.app-shell.mobile-view-info .leaflet-control-attribution,
  body.embed-mode.mobile-view-travel .leaflet-control-attribution,
  body.embed-mode.mobile-view-info .leaflet-control-attribution,
  body.app-shell.mobile-view-travel .maplibregl-ctrl-attrib,
  body.app-shell.mobile-view-info .maplibregl-ctrl-attrib,
  body.embed-mode.mobile-view-travel .maplibregl-ctrl-attrib,
  body.embed-mode.mobile-view-info .maplibregl-ctrl-attrib{
    display:none!important;
  }
  body.app-shell .maplibregl-ctrl-bottom-left,
  body.embed-mode .maplibregl-ctrl-bottom-left,
  body.app-shell .maplibregl-ctrl-bottom-right,
  body.embed-mode .maplibregl-ctrl-bottom-right{
    bottom:calc(82px + env(safe-area-inset-bottom,0px))!important;
    left:4px!important;
    right:auto!important;
    max-width:calc(100vw - 112px)!important;
    z-index:1322!important;
  }
  body.app-shell .maplibregl-ctrl-attrib,
  body.embed-mode .maplibregl-ctrl-attrib{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    max-width:calc(100vw - 112px)!important;
    max-height:18px!important;
    overflow:hidden!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
    padding:1px 4px!important;
    font-size:9px!important;
    line-height:15px!important;
    background:rgba(255,255,255,.84)!important;
  }
}
@media (max-width:420px){
  body.app-shell .leaflet-bottom.leaflet-left,
  body.embed-mode .leaflet-bottom.leaflet-left,
  body.app-shell .leaflet-control-attribution,
  body.embed-mode .leaflet-control-attribution,
  body.app-shell .maplibregl-ctrl-attrib,
  body.embed-mode .maplibregl-ctrl-attrib{
    max-width:calc(100vw - 104px)!important;
  }
}
@media (max-width:360px){
  body.app-shell .leaflet-bottom.leaflet-left,
  body.embed-mode .leaflet-bottom.leaflet-left,
  body.app-shell .leaflet-control-attribution,
  body.embed-mode .leaflet-control-attribution,
  body.app-shell .maplibregl-ctrl-attrib,
  body.embed-mode .maplibregl-ctrl-attrib{
    max-width:calc(100vw - 96px)!important;
    font-size:8px!important;
  }
}


/* Patch 10H: Mobile Attribution, einklappbarer Zeitfilter, kompakter Hinweisbutton, Bottom-Sheet-Popup */
.mobile-brand-actions{display:flex;align-items:center;gap:6px;margin-left:auto}
.mobile-time-collapse-toggle,
.mobile-message-popup{display:none}

@media (max-width:900px){
  body.app-shell .brand,
  body.embed-mode .brand{position:relative!important}
  body.app-shell .mobile-brand-actions,
  body.embed-mode .mobile-brand-actions{
    display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:6px!important;margin-left:auto!important
  }
  body.app-shell .mobile-time-collapse-toggle,
  body.embed-mode .mobile-time-collapse-toggle{
    display:inline-flex!important;align-items:center!important;justify-content:center!important;width:30px!important;height:30px!important;min-width:30px!important;border:1px solid #dbe3ec!important;border-radius:9px!important;background:#fff!important;color:#526170!important;box-shadow:none!important;cursor:pointer!important;font-size:18px!important;line-height:1!important;padding:0!important
  }
  body.app-shell .mobile-time-collapse-toggle .mobile-time-collapse-icon,
  body.embed-mode .mobile-time-collapse-toggle .mobile-time-collapse-icon{display:block!important;transform:translateY(-1px)!important;line-height:1!important}
  body.app-shell.mobile-time-collapsed .mobile-time-collapse-toggle .mobile-time-collapse-icon,
  body.embed-mode.mobile-time-collapsed .mobile-time-collapse-toggle .mobile-time-collapse-icon{transform:translateY(1px) rotate(180deg)!important}
  body.app-shell.mobile-time-collapsed .time-panel,
  body.embed-mode.mobile-time-collapsed .time-panel{display:none!important}

  body.app-shell .general-notice-tab,
  body.embed-mode .general-notice-tab{bottom:calc(90px + env(safe-area-inset-bottom,0px))!important;z-index:1325!important}
  body.app-shell .general-notice,
  body.embed-mode .general-notice,
  body.app-shell .general-notice-panel,
  body.embed-mode .general-notice-panel{bottom:calc(154px + env(safe-area-inset-bottom,0px))!important;max-height:calc(100dvh - 285px)!important;z-index:1360!important}
  body.app-shell .leaflet-control-layers,
  body.embed-mode .leaflet-control-layers{bottom:calc(90px + env(safe-area-inset-bottom,0px))!important;z-index:1330!important}

  body.app-shell .leaflet-bottom.leaflet-left,
  body.embed-mode .leaflet-bottom.leaflet-left,
  body.app-shell .maplibregl-ctrl-bottom-left,
  body.embed-mode .maplibregl-ctrl-bottom-left,
  body.app-shell .maplibregl-ctrl-bottom-right,
  body.embed-mode .maplibregl-ctrl-bottom-right{left:92px!important;right:74px!important;bottom:calc(var(--mobile-bottom-nav-height,72px) + 28px + env(safe-area-inset-bottom,0px))!important;width:auto!important;max-width:calc(100vw - 184px)!important;z-index:1190!important;pointer-events:none!important}
  body.app-shell .leaflet-control-attribution,
  body.embed-mode .leaflet-control-attribution{position:fixed!important;left:92px!important;right:74px!important;bottom:calc(var(--mobile-bottom-nav-height,72px) + 28px + env(safe-area-inset-bottom,0px))!important;width:auto!important;max-width:none!important;max-height:16px!important;display:block!important;visibility:visible!important;opacity:1!important;overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important;box-sizing:border-box!important;margin:0!important;padding:1px 4px!important;border-radius:3px!important;background:rgba(255,255,255,.88)!important;color:#475569!important;box-shadow:none!important;font-size:8.5px!important;line-height:14px!important;pointer-events:auto!important;z-index:1190!important}
  body.app-shell .leaflet-control-attribution a,
  body.embed-mode .leaflet-control-attribution a,
  body.app-shell .maplibregl-ctrl-attrib a,
  body.embed-mode .maplibregl-ctrl-attrib a{color:#2563eb!important;text-decoration:none!important}
  body.app-shell .maplibregl-ctrl-attrib,
  body.embed-mode .maplibregl-ctrl-attrib,
  body.app-shell .maplibregl-ctrl-attrib-inner,
  body.embed-mode .maplibregl-ctrl-attrib-inner{position:fixed!important;left:92px!important;right:74px!important;bottom:calc(var(--mobile-bottom-nav-height,72px) + 28px + env(safe-area-inset-bottom,0px))!important;width:auto!important;max-width:none!important;max-height:16px!important;display:block!important;visibility:visible!important;opacity:1!important;overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important;box-sizing:border-box!important;margin:0!important;padding:1px 4px!important;border-radius:3px!important;background:rgba(255,255,255,.88)!important;color:#475569!important;box-shadow:none!important;font-size:8.5px!important;line-height:14px!important;pointer-events:none!important;z-index:1190!important}
  body.app-shell.mobile-view-travel .leaflet-bottom.leaflet-left,
  body.app-shell.mobile-view-info .leaflet-bottom.leaflet-left,
  body.embed-mode.mobile-view-travel .leaflet-bottom.leaflet-left,
  body.embed-mode.mobile-view-info .leaflet-bottom.leaflet-left,
  body.app-shell.mobile-view-travel .maplibregl-ctrl-bottom-left,
  body.app-shell.mobile-view-info .maplibregl-ctrl-bottom-left,
  body.embed-mode.mobile-view-travel .maplibregl-ctrl-bottom-left,
  body.embed-mode.mobile-view-info .maplibregl-ctrl-bottom-left,
  body.app-shell.mobile-view-travel .maplibregl-ctrl-bottom-right,
  body.app-shell.mobile-view-info .maplibregl-ctrl-bottom-right,
  body.embed-mode.mobile-view-travel .maplibregl-ctrl-bottom-right,
  body.embed-mode.mobile-view-info .maplibregl-ctrl-bottom-right,
  body.app-shell.mobile-view-travel .leaflet-control-attribution,
  body.app-shell.mobile-view-info .leaflet-control-attribution,
  body.embed-mode.mobile-view-travel .leaflet-control-attribution,
  body.embed-mode.mobile-view-info .leaflet-control-attribution,
  body.app-shell.mobile-view-travel .maplibregl-ctrl-attrib,
  body.app-shell.mobile-view-info .maplibregl-ctrl-attrib,
  body.embed-mode.mobile-view-travel .maplibregl-ctrl-attrib,
  body.embed-mode.mobile-view-info .maplibregl-ctrl-attrib{display:none!important}

  body.app-shell .mobile-message-popup,
  body.embed-mode .mobile-message-popup{position:fixed!important;left:0!important;right:0!important;bottom:calc(76px + env(safe-area-inset-bottom,0px))!important;z-index:1390!important;display:block!important;width:100%!important;max-height:min(44dvh,390px)!important;overflow:auto!important;-webkit-overflow-scrolling:touch!important;box-sizing:border-box!important;padding:16px 18px 18px!important;background:#fff!important;border:1px solid #dbe1e7!important;border-bottom:0!important;border-radius:18px 18px 0 0!important;box-shadow:0 -8px 28px rgba(15,23,42,.22)!important;color:#1f2937!important}
  body.app-shell .mobile-message-popup[hidden],
  body.embed-mode .mobile-message-popup[hidden]{display:none!important}
  body.app-shell .mobile-message-popup-close,
  body.embed-mode .mobile-message-popup-close{position:absolute!important;top:8px!important;right:12px!important;width:34px!important;height:34px!important;border:0!important;border-radius:50%!important;background:transparent!important;color:#5f6670!important;font-size:32px!important;line-height:30px!important;cursor:pointer!important;padding:0!important}
  body.app-shell .mobile-message-popup-content,
  body.embed-mode .mobile-message-popup-content{padding-right:18px!important;color:#202833!important;font-size:14px!important;line-height:1.36!important}
  body.app-shell .mobile-message-popup .popup-title,
  body.embed-mode .mobile-message-popup .popup-title{font-size:18px!important;line-height:1.22!important;margin:0 36px 8px 0!important}
  body.app-shell .mobile-message-popup .popup-meta,
  body.embed-mode .mobile-message-popup .popup-meta{font-size:12px!important;line-height:1.35!important;margin:0 0 10px!important}
  body.app-shell .mobile-message-popup .popup-description-text,
  body.embed-mode .mobile-message-popup .popup-description-text{font-size:14px!important;line-height:1.38!important;margin-bottom:8px!important}
  body.app-shell .mobile-message-popup .popup-section,
  body.embed-mode .mobile-message-popup .popup-section{margin-top:9px!important;padding-top:8px!important}
  body.app-shell .mobile-message-popup .popup-section strong,
  body.embed-mode .mobile-message-popup .popup-section strong{font-size:13px!important}
  body.app-shell .mobile-message-popup .traffic-flow-graphic,
  body.embed-mode .mobile-message-popup .traffic-flow-graphic{max-width:100%!important;overflow:auto!important}
  body.app-shell.mobile-message-sheet-open .leaflet-popup,
  body.embed-mode.mobile-message-sheet-open .leaflet-popup,
  body.app-shell.mobile-message-sheet-open .leaflet-control-attribution,
  body.embed-mode.mobile-message-sheet-open .leaflet-control-attribution,
  body.app-shell.mobile-message-sheet-open .maplibregl-ctrl-attrib,
  body.embed-mode.mobile-message-sheet-open .maplibregl-ctrl-attrib{display:none!important}
}
@media (max-width:420px){
  body.app-shell .leaflet-bottom.leaflet-left,
  body.embed-mode .leaflet-bottom.leaflet-left,
  body.app-shell .maplibregl-ctrl-bottom-left,
  body.embed-mode .maplibregl-ctrl-bottom-left,
  body.app-shell .maplibregl-ctrl-bottom-right,
  body.embed-mode .maplibregl-ctrl-bottom-right,
  body.app-shell .leaflet-control-attribution,
  body.embed-mode .leaflet-control-attribution,
  body.app-shell .maplibregl-ctrl-attrib,
  body.embed-mode .maplibregl-ctrl-attrib,
  body.app-shell .maplibregl-ctrl-attrib-inner,
  body.embed-mode .maplibregl-ctrl-attrib-inner{left:84px!important;right:70px!important;max-width:calc(100vw - 154px)!important;font-size:8px!important}
  body.app-shell .mobile-message-popup,
  body.embed-mode .mobile-message-popup{max-height:42dvh!important;padding:14px 16px 16px!important}
}
@media (max-width:360px){
  body.app-shell .leaflet-bottom.leaflet-left,
  body.embed-mode .leaflet-bottom.leaflet-left,
  body.app-shell .maplibregl-ctrl-bottom-left,
  body.embed-mode .maplibregl-ctrl-bottom-left,
  body.app-shell .maplibregl-ctrl-bottom-right,
  body.embed-mode .maplibregl-ctrl-bottom-right,
  body.app-shell .leaflet-control-attribution,
  body.embed-mode .leaflet-control-attribution,
  body.app-shell .maplibregl-ctrl-attrib,
  body.embed-mode .maplibregl-ctrl-attrib,
  body.app-shell .maplibregl-ctrl-attrib-inner,
  body.embed-mode .maplibregl-ctrl-attrib-inner{left:78px!important;right:64px!important;max-width:calc(100vw - 142px)!important}
}

/* Patch 10I: Mobile Attribution oberhalb Navigation, Popup-Z-Ebene, fixer Kopfbereich */
.mobile-time-summary-toggle,
.mobile-map-attribution{display:none}

@media (max-width:900px){
  html:has(body.app-shell),
  html:has(body.embed-mode){
    height:100%!important;
    overflow:hidden!important;
  }
  body.app-shell,
  body.embed-mode{
    position:fixed!important;
    inset:0!important;
    width:100%!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
    overflow:hidden!important;
    overscroll-behavior:none!important;
    -webkit-overflow-scrolling:auto!important;
  }
  body.app-shell .map-wrap,
  body.embed-mode .map-wrap,
  body.app-shell .map,
  body.embed-mode .map{
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
  }

  body.app-shell .sidebar,
  body.embed-mode .sidebar{
    position:fixed!important;
    top:0!important;
    top:env(safe-area-inset-top,0px)!important;
    left:50%!important;
    right:auto!important;
    width:min(88vw,430px)!important;
    transform:translateX(-50%)!important;
    max-height:calc(100dvh - 94px - env(safe-area-inset-bottom,0px))!important;
    overflow:visible!important;
    overscroll-behavior:contain!important;
    z-index:1500!important;
  }
  body.app-shell .sidebar.open,
  body.embed-mode .sidebar.open{transform:translateX(-50%)!important}

  body.app-shell .brand,
  body.embed-mode .brand{
    position:relative!important;
    top:0!important;
    z-index:2!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    min-height:58px!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
  body.app-shell .brand>div:first-child,
  body.embed-mode .brand>div:first-child{
    min-width:0!important;
    flex:1 1 auto!important;
    overflow:visible!important;
  }
  body.app-shell .brand strong,
  body.embed-mode .brand strong{
    display:block!important;
    line-height:1.18!important;
    overflow:visible!important;
    white-space:nowrap!important;
  }
  body.app-shell .brand span,
  body.embed-mode .brand span{
    display:block!important;
    line-height:1.22!important;
    overflow:visible!important;
    white-space:nowrap!important;
  }
  body.app-shell .mobile-brand-actions,
  body.embed-mode .mobile-brand-actions{
    flex:0 0 auto!important;
    min-width:max-content!important;
  }
  body.app-shell .language-switch,
  body.embed-mode .language-switch{
    flex:0 0 auto!important;
    overflow:visible!important;
  }

  body.app-shell .mobile-page-brand,
  body.embed-mode .mobile-page-brand{
    position:sticky!important;
    top:0!important;
    z-index:4!important;
    background:#fff!important;
  }

  body.app-shell .mobile-time-summary-toggle,
  body.embed-mode .mobile-time-summary-toggle{
    width:100%!important;
    min-height:48px!important;
    border:0!important;
    border-top:1px solid #edf0f3!important;
    border-bottom:1px solid #edf0f3!important;
    background:#fff!important;
    color:#29313b!important;
    display:none!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    padding:10px 14px!important;
    box-sizing:border-box!important;
    font:inherit!important;
    cursor:pointer!important;
  }
  body.app-shell .mobile-time-summary-toggle span:first-child,
  body.embed-mode .mobile-time-summary-toggle span:first-child{
    min-width:0!important;
    overflow:hidden!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
    font-size:14px!important;
    line-height:1.2!important;
    font-weight:900!important;
    color:#29313b!important;
  }
  body.app-shell .mobile-time-summary-icon,
  body.embed-mode .mobile-time-summary-icon{
    flex:0 0 auto!important;
    color:#687382!important;
    font-size:14px!important;
    line-height:1!important;
  }
  body.app-shell.mobile-time-collapsed .mobile-time-summary-toggle,
  body.embed-mode.mobile-time-collapsed .mobile-time-summary-toggle{
    display:flex!important;
  }
  body.app-shell.mobile-time-collapsed .mobile-time-collapse-toggle,
  body.embed-mode.mobile-time-collapsed .mobile-time-collapse-toggle{
    display:none!important;
  }
  body.app-shell:not(.mobile-time-collapsed) .time-panel,
  body.embed-mode:not(.mobile-time-collapsed) .time-panel{
    display:flex!important;
  }

  body.app-shell .mobile-map-attribution,
  body.embed-mode .mobile-map-attribution{
    position:fixed!important;
    left:10px!important;
    right:10px!important;
    bottom:calc(var(--mobile-bottom-nav-height,72px) + 4px + env(safe-area-inset-bottom,0px))!important;
    z-index:830!important;
    display:block!important;
    height:19px!important;
    max-height:19px!important;
    box-sizing:border-box!important;
    padding:2px 7px!important;
    border:1px solid rgba(226,232,240,.92)!important;
    border-radius:6px!important;
    background:rgba(255,255,255,.96)!important;
    box-shadow:0 1px 7px rgba(15,23,42,.14)!important;
    color:#334155!important;
    font-size:10px!important;
    line-height:14px!important;
    text-align:center!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    pointer-events:auto!important;
  }
  body.app-shell .mobile-map-attribution a,
  body.embed-mode .mobile-map-attribution a{
    color:#0b63ce!important;
    text-decoration:none!important;
  }
  body.app-shell.mobile-view-travel .mobile-map-attribution,
  body.app-shell.mobile-view-info .mobile-map-attribution,
  body.embed-mode.mobile-view-travel .mobile-map-attribution,
  body.embed-mode.mobile-view-info .mobile-map-attribution{
    display:none!important;
  }

  body.app-shell .leaflet-control-attribution,
  body.embed-mode .leaflet-control-attribution,
  body.app-shell .maplibregl-ctrl-attrib,
  body.embed-mode .maplibregl-ctrl-attrib,
  body.app-shell .maplibregl-ctrl-attrib-inner,
  body.embed-mode .maplibregl-ctrl-attrib-inner{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
  }

  body.app-shell .general-notice-tab,
  body.embed-mode .general-notice-tab{
    bottom:calc(var(--mobile-bottom-nav-height,72px) + 28px + env(safe-area-inset-bottom,0px))!important;
    z-index:1320!important;
  }
  body.app-shell .leaflet-bottom.leaflet-right,
  body.embed-mode .leaflet-bottom.leaflet-right{
    right:14px!important;
    bottom:calc(var(--mobile-bottom-nav-height,72px) + 28px + env(safe-area-inset-bottom,0px))!important;
    z-index:1325!important;
  }
  body.app-shell .leaflet-control-layers,
  body.embed-mode .leaflet-control-layers{
    position:fixed!important;
    right:14px!important;
    bottom:calc(var(--mobile-bottom-nav-height,72px) + 28px + env(safe-area-inset-bottom,0px))!important;
    z-index:1325!important;
  }

  body.app-shell .mobile-message-popup,
  body.embed-mode .mobile-message-popup{
    bottom:calc(var(--mobile-bottom-nav-height,72px) + env(safe-area-inset-bottom,0px))!important;
    z-index:5000!important;
    max-height:min(50dvh,440px)!important;
  }
  body.app-shell .mobile-message-popup.open,
  body.embed-mode .mobile-message-popup.open{
    z-index:5000!important;
  }
  body.app-shell.mobile-message-sheet-open .mobile-map-attribution,
  body.embed-mode.mobile-message-sheet-open .mobile-map-attribution{
    z-index:700!important;
  }
  body.app-shell.mobile-message-sheet-open .leaflet-control-layers,
  body.embed-mode.mobile-message-sheet-open .leaflet-control-layers,
  body.app-shell.mobile-message-sheet-open .general-notice-tab,
  body.embed-mode.mobile-message-sheet-open .general-notice-tab{
    display:none!important;
  }
}

@media (max-width:380px){
  body.app-shell .mobile-map-attribution,
  body.embed-mode .mobile-map-attribution{
    left:8px!important;
    right:8px!important;
    font-size:9px!important;
  }
}


/* Patch 10J: Desktop-Attribution wieder rechts; mobile Darstellung unverändert */
@media (min-width:901px){
  body.app-shell .mobile-map-attribution,
  body.embed-mode .mobile-map-attribution{
    display:none!important;
  }

  body.app-shell .leaflet-bottom.leaflet-right,
  body.embed-mode .leaflet-bottom.leaflet-right{
    right:8px!important;
    left:auto!important;
    bottom:0!important;
    z-index:910!important;
  }

  body.app-shell .leaflet-bottom.leaflet-right .leaflet-control-attribution,
  body.embed-mode .leaflet-bottom.leaflet-right .leaflet-control-attribution{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    max-width:min(760px,calc(100vw - 420px))!important;
    margin:0 0 4px 0!important;
    padding:1px 5px!important;
    background:rgba(255,255,255,.85)!important;
    color:#334155!important;
    font-size:11px!important;
    line-height:16px!important;
    text-align:right!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  /* Fallback, falls ein Browser/Cache den Leaflet-Control noch in der linken Ecke hält. */
  body.app-shell .leaflet-bottom.leaflet-left .leaflet-control-attribution,
  body.embed-mode .leaflet-bottom.leaflet-left .leaflet-control-attribution{
    position:fixed!important;
    right:8px!important;
    left:auto!important;
    bottom:0!important;
    z-index:910!important;
    max-width:min(760px,calc(100vw - 420px))!important;
    margin:0 0 4px 0!important;
    text-align:right!important;
  }
}

/* Patch 10L: Mobile - kompletter Filter-/Meldungssteuerungsbereich per Kopf-Pfeil einklappbar */
@media (max-width:900px){
  body.app-shell .mobile-time-summary-toggle,
  body.embed-mode .mobile-time-summary-toggle,
  body.app-shell.mobile-time-collapsed .mobile-time-summary-toggle,
  body.embed-mode.mobile-time-collapsed .mobile-time-summary-toggle,
  body.app-shell.mobile-controls-collapsed .mobile-time-summary-toggle,
  body.embed-mode.mobile-controls-collapsed .mobile-time-summary-toggle{
    display:none!important;
  }
  body.app-shell.mobile-time-collapsed .mobile-time-collapse-toggle,
  body.embed-mode.mobile-time-collapsed .mobile-time-collapse-toggle,
  body.app-shell.mobile-controls-collapsed .mobile-time-collapse-toggle,
  body.embed-mode.mobile-controls-collapsed .mobile-time-collapse-toggle{
    display:inline-flex!important;
  }
  body.app-shell.mobile-time-collapsed .time-panel,
  body.embed-mode.mobile-time-collapsed .time-panel,
  body.app-shell.mobile-time-collapsed .filter-panel,
  body.embed-mode.mobile-time-collapsed .filter-panel,
  body.app-shell.mobile-controls-collapsed .time-panel,
  body.embed-mode.mobile-controls-collapsed .time-panel,
  body.app-shell.mobile-controls-collapsed .filter-panel,
  body.embed-mode.mobile-controls-collapsed .filter-panel{
    display:none!important;
  }
  body.app-shell.mobile-time-collapsed .mobile-time-collapse-toggle .mobile-time-collapse-icon,
  body.embed-mode.mobile-time-collapsed .mobile-time-collapse-toggle .mobile-time-collapse-icon,
  body.app-shell.mobile-controls-collapsed .mobile-time-collapse-toggle .mobile-time-collapse-icon,
  body.embed-mode.mobile-controls-collapsed .mobile-time-collapse-toggle .mobile-time-collapse-icon{
    transform:translateY(1px) rotate(180deg)!important;
  }
}

/* Patch 16A: Backend-Farbkonfiguration / Corporate Design */
.settings-color-grid{align-items:start;margin-bottom:8px}
.color-setting-row{min-width:0}
.color-setting-control{display:grid;grid-template-columns:46px minmax(120px,1fr) auto;gap:8px;align-items:center}
.color-setting-control input[type="color"]{width:46px;height:42px;min-height:42px;padding:3px;border-radius:9px;cursor:pointer}
.color-setting-control input[data-theme-color-key]{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;text-transform:uppercase}
.color-setting-control code{display:inline-flex;align-items:center;justify-content:center;min-height:34px;border:1px solid var(--line);border-radius:8px;background:#f8fafc;color:#334155;padding:4px 8px;font-size:12px;white-space:nowrap}
@media(max-width:640px){.color-setting-control{grid-template-columns:42px minmax(0,1fr)}.color-setting-control code{grid-column:1 / -1;justify-content:flex-start}}


/* Patch 16C: Farbsteuerung für mobile Aktiv-Icons der unteren Menüleiste */
@supports ((-webkit-mask-image: linear-gradient(#000,#000)) or (mask-image: linear-gradient(#000,#000))) {
  @media (max-width:900px){
    body.app-shell .mobile-bottom-nav button.active .mobile-nav-icon,
    body.embed-mode .mobile-bottom-nav button.active .mobile-nav-icon{
      position:relative!important;
      color:var(--tool-mobile-nav-active-icon,var(--tool-primary))!important;
    }
    body.app-shell .mobile-bottom-nav button.active .mobile-nav-icon-img,
    body.embed-mode .mobile-bottom-nav button.active .mobile-nav-icon-img{
      position:relative!important;
      z-index:1!important;
    }
    body.app-shell .mobile-bottom-nav button.active .mobile-nav-icon-active,
    body.embed-mode .mobile-bottom-nav button.active .mobile-nav-icon-active{
      opacity:0!important;
    }
    body.app-shell .mobile-bottom-nav button.active .mobile-nav-icon::after,
    body.embed-mode .mobile-bottom-nav button.active .mobile-nav-icon::after{
      content:""!important;
      position:absolute!important;
      inset:0!important;
      z-index:2!important;
      display:block!important;
      pointer-events:none!important;
      background:var(--tool-mobile-nav-active-icon,var(--tool-primary))!important;
      -webkit-mask-repeat:no-repeat!important;
      mask-repeat:no-repeat!important;
      -webkit-mask-position:center!important;
      mask-position:center!important;
      -webkit-mask-size:contain!important;
      mask-size:contain!important;
    }
    body.app-shell .mobile-bottom-nav button.active[data-mobile-tab="roadworks"] .mobile-nav-icon::after,
    body.embed-mode .mobile-bottom-nav button.active[data-mobile-tab="roadworks"] .mobile-nav-icon::after{
      -webkit-mask-image:url("../icons/mobile/Button_Baustellen_active.PNG")!important;
      mask-image:url("../icons/mobile/Button_Baustellen_active.PNG")!important;
    }
    body.app-shell .mobile-bottom-nav button.active[data-mobile-tab="travel"] .mobile-nav-icon::after,
    body.embed-mode .mobile-bottom-nav button.active[data-mobile-tab="travel"] .mobile-nav-icon::after{
      -webkit-mask-image:url("../icons/mobile/Button_Fahrzeiten_active.PNG")!important;
      mask-image:url("../icons/mobile/Button_Fahrzeiten_active.PNG")!important;
    }
    body.app-shell .mobile-bottom-nav button.active[data-mobile-action="pdf"] .mobile-nav-icon::after,
    body.embed-mode .mobile-bottom-nav button.active[data-mobile-action="pdf"] .mobile-nav-icon::after{
      -webkit-mask-image:url("../icons/mobile/Button_PDF-Export_active.PNG")!important;
      mask-image:url("../icons/mobile/Button_PDF-Export_active.PNG")!important;
    }
    body.app-shell .mobile-bottom-nav button.active[data-mobile-tab="info"] .mobile-nav-icon::after,
    body.embed-mode .mobile-bottom-nav button.active[data-mobile-tab="info"] .mobile-nav-icon::after{
      -webkit-mask-image:url("../icons/mobile/Button_Info_active.PNG")!important;
      mask-image:url("../icons/mobile/Button_Info_active.PNG")!important;
    }
  }
}


/* Patch 16D: Mobile PDF-Export behält Aktivfarbe während der Erstellung */
@media (max-width:900px){
  body.app-shell .mobile-bottom-nav button.active[disabled],
  body.embed-mode .mobile-bottom-nav button.active[disabled],
  body.app-shell .mobile-bottom-nav button.active[aria-busy="true"],
  body.embed-mode .mobile-bottom-nav button.active[aria-busy="true"]{
    opacity:1!important;
    filter:none!important;
    -webkit-appearance:none!important;
    appearance:none!important;
    background:var(--tool-mobile-nav-active-background,transparent)!important;
    color:var(--tool-mobile-nav-active-text,var(--tool-primary,#0066b3))!important;
    -webkit-text-fill-color:var(--tool-mobile-nav-active-text,var(--tool-primary,#0066b3))!important;
  }
  body.app-shell .mobile-bottom-nav button.active[disabled] .mobile-nav-icon,
  body.embed-mode .mobile-bottom-nav button.active[disabled] .mobile-nav-icon,
  body.app-shell .mobile-bottom-nav button.active[aria-busy="true"] .mobile-nav-icon,
  body.embed-mode .mobile-bottom-nav button.active[aria-busy="true"] .mobile-nav-icon{
    color:var(--tool-mobile-nav-active-icon,var(--tool-mobile-nav-active-text,var(--tool-primary,#0066b3)))!important;
    -webkit-text-fill-color:var(--tool-mobile-nav-active-icon,var(--tool-mobile-nav-active-text,var(--tool-primary,#0066b3)))!important;
  }
}
