*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--txt);
font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-decoration:none}
/* CI §2: klar sichtbarer, kontraststarker Fokus-Ring auf interaktiven Elementen */
button:focus-visible,a:focus-visible,nav a:focus-visible,.theme-btn:focus-visible,
.imark:focus-visible,input:focus-visible,select:focus-visible{
outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
.app{display:grid;grid-template-columns:236px 1fr;min-height:100vh;transition:grid-template-columns .18s ease}
/* Sidebar */
aside{background:var(--side-bg);border-right:1px solid var(--line);
padding:20px 14px;position:sticky;top:0;height:100vh;overflow:auto;
display:flex;flex-direction:column}
.brand{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.brand .logo{width:32px;height:32px;border-radius:9px;background:var(--accent);
display:grid;place-items:center;font-weight:800;color:#fff;font-size:13px}
.brand h1{font-size:15px;margin:0}
.brand small{color:var(--muted2);font-size:11px}
nav{margin-top:22px;display:flex;flex-direction:column;gap:3px}
nav a{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:9px;color:var(--muted);
font-weight:600;transition:background .12s,color .12s}
nav a:hover{background:var(--hover);color:var(--txt)}
nav a.active{background:var(--accent);color:var(--on-accent)}
nav a .ico{width:18px;text-align:center;opacity:.9}
nav .nav-h{font-size:10px;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);
opacity:.65;font-weight:700;margin:15px 12px 3px}
nav .nav-h:first-of-type{margin-top:10px}
/* Disponieren: 3-Spalten-Arbeitsplatz (Touren | Karte | Detail) */
.pl-wrap{display:grid;grid-template-columns:280px 1fr 340px;gap:12px;height:calc(100vh - 248px);min-height:470px}
.pl-left,.pl-right{overflow-y:auto;background:var(--card);border:1px solid var(--border);border-radius:12px}
.pl-left{padding:8px}
.pl-right{padding:13px}
.pl-map-wrap{border:1px solid var(--border);border-radius:12px;overflow:hidden;position:relative}
#planmap{height:100%;width:100%;background:var(--hover)}
.trow2{display:flex;align-items:center;gap:8px;padding:8px 9px;border-radius:9px;cursor:pointer;font-size:12.5px}
.trow2:hover{background:var(--hover)}
.trow2.on{background:var(--accent);color:var(--on-accent)}
.trow2.on .muted,.trow2.on .capn2{color:rgba(255,255,255,.8)}
.adot{width:9px;height:9px;border-radius:50%;flex:0 0 auto}
.capm{flex:1;max-width:64px;background:var(--hover);height:6px;border-radius:4px;overflow:hidden}
.trow2.on .capm{background:rgba(255,255,255,.25)}
.capm i{display:block;height:100%}
.capn2{font-size:10.5px;color:var(--muted);white-space:nowrap}
.pr-card{border:1px solid var(--border);border-radius:10px;padding:9px 11px;margin-bottom:8px;font-size:12.5px}
.pr-card .why{color:var(--muted);font-size:11px;margin:3px 0 7px}
.btn-take{border:0;border-radius:7px;padding:5px 11px;cursor:pointer;font-size:11.5px;background:var(--accent);color:var(--on-accent);font-weight:600}
.btn-mini{border:1px solid var(--border);border-radius:7px;padding:4px 9px;cursor:pointer;font-size:11px;background:var(--card);color:var(--txt)}
/* Werkstatt: Pool | Touren-Container | Assistenz */
.ws-wrap{display:grid;grid-template-columns:240px 1fr 260px;gap:12px;height:calc(100vh - 250px);min-height:460px}
.ws-col{overflow-y:auto;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:10px}
.ws-grp{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700;margin:12px 4px 5px}
.ws-grp:first-child{margin-top:2px}
.ws-pool.over{outline:2px dashed var(--accent);outline-offset:-4px}
.ws-chip{border:1px solid var(--border);border-radius:8px;padding:6px 8px;margin-bottom:5px;background:var(--card);cursor:grab;font-size:12px}
.ws-chip:hover{box-shadow:0 2px 7px rgba(0,0,0,.09)}
.ws-chip.drag{opacity:.4}
.ws-chip.prop{border-style:dashed}
.ws-chip b{font-size:12px}
.ws-chip .sub{color:var(--muted);font-size:10.5px}
.ws-mid{overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px;align-content:start;padding-right:2px}
.ws-tour{background:var(--card);border:1.5px solid var(--border);border-radius:11px;padding:9px 10px;min-height:120px}
.ws-tour.over{border-color:var(--accent);background:#fff8f8}
.ws-tour.over2{border-color:var(--accent)}
.ws-th{display:flex;align-items:baseline;gap:6px;margin-bottom:5px}
.ws-th b{font-size:13.5px}
.ws-bar{background:var(--hover);height:7px;border-radius:4px;overflow:hidden;margin:3px 0}
.ws-bar i{display:block;height:100%}
.ws-cn{font-size:10px;color:var(--muted);display:flex;justify-content:space-between}
.ws-drop{margin-top:6px;min-height:20px}
.ws-badge{font-size:9px;padding:0 4px;border-radius:6px;margin-left:3px}
.side-foot{margin-top:auto;padding-top:18px;display:flex;flex-direction:column;gap:12px}
.ro-badge{padding:9px 12px;border:1px solid var(--ro-line);background:var(--ro-bg);border-radius:10px;
color:var(--ro-fg);font-size:12px;display:flex;gap:8px;align-items:center}
.legend{font-size:11px;color:var(--muted2)}
.legend .row{display:flex;align-items:center;gap:8px;margin:5px 0}
.dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto}
.theme-btn{display:flex;align-items:center;gap:9px;width:100%;padding:9px 12px;border-radius:9px;
background:var(--panel);border:1px solid var(--line);color:var(--muted);font:inherit;font-weight:600;
font-size:13px;cursor:pointer;transition:background .12s,color .12s}
.theme-btn:hover{background:var(--hover);color:var(--txt)}
/* Main */
main{padding:26px 30px;max-width:1240px}
.head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.head h2{margin:0;font-size:21px;letter-spacing:-.2px}
.head .sub{color:var(--muted);font-size:13px}
.sync{color:var(--muted);font-size:12px}
/* KPI cards */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px}
.card{background:var(--card-grad);border:1px solid var(--line);
border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}
.kpi .label{color:var(--muted);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;min-height:30px}
.kpi .val{font-size:32px;font-weight:800;margin:8px 0 8px;letter-spacing:-.5px;line-height:1.1;
font-variant-numeric:tabular-nums}
.kpi .val.val-sm{font-size:20px}
.kpi .hint{color:var(--muted2);font-size:11.5px;margin-bottom:12px}
.kpi-foot{display:flex;margin-top:auto}
.card.kpi{display:flex;flex-direction:column;min-height:168px}
.badge{flex-shrink:0;max-width:100%}
/* Badges */
.badge{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:999px;font-size:11px;
font-weight:700;border:1px solid transparent;white-space:nowrap}
.badge .dot{width:7px;height:7px}
.prov-live{background:var(--ok-bg);color:var(--ok-fg);border-color:var(--ok-line)}
.prov-not_connected{background:var(--warn-bg);color:var(--warn-fg);border-color:var(--warn-line)}
.prov-planned{background:var(--info-bg);color:var(--info-fg);border-color:var(--info-line)}
.prov-calculated{background:var(--blue-bg);color:var(--blue-fg)}
.status{padding:2px 9px;border-radius:6px;font-size:11px;font-weight:700}
.st-Aktiv{background:var(--blue-bg);color:var(--blue-fg)}
.st-Abgenommen{background:var(--ok-bg);color:var(--ok-fg)}
.st-Unbekannt{background:var(--chip);color:var(--muted)}
.tag{padding:2px 7px;border-radius:6px;font-size:11px;font-weight:700;background:var(--chip);color:var(--muted)}
.ttag{display:inline-block;padding:1px 7px;border-radius:6px;font-size:10.5px;font-weight:700;
background:var(--warn-bg);color:var(--warn-fg);border:1px solid var(--warn-line);vertical-align:middle;margin-left:6px}
.tag-AUTO{background:var(--ok-bg);color:var(--ok-fg)}
.tag-REVIEW{background:var(--warn-bg);color:var(--warn-fg)}
.tag-MANUAL{background:var(--bad-bg);color:var(--bad-fg)}
/* Tables */
table{width:100%;border-collapse:collapse;font-size:13px}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
th{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.4px;font-weight:700}
tbody tr{transition:background .12s}
tbody tr:last-child td{border-bottom:none}
tbody tr.clickable{cursor:pointer}
tbody tr.clickable:hover{background:var(--hover)}
td.num{text-align:right;font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}
.nc-cell{color:var(--warn-fg);font-size:12px;font-style:italic}
.section-title{display:flex;align-items:center;gap:10px;margin:26px 0 12px;font-size:15px;font-weight:700}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.kv{display:grid;grid-template-columns:150px 1fr;gap:6px 12px;font-size:13px}
.kv .k{color:var(--muted)}
.back{cursor:pointer;color:var(--muted);font-size:13px;margin-bottom:10px;display:inline-flex;gap:6px}
.back:hover{color:var(--txt)}
.placeholder{border:1px dashed var(--line);border-radius:12px;padding:20px;color:var(--muted);background:var(--panel2)}
.raw{margin-top:6px;background:var(--code-bg);border:1px solid var(--line);border-radius:8px;padding:10px;
font:12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted);white-space:pre-wrap;max-height:260px;overflow:auto}
details summary{cursor:pointer;color:var(--accent);font-size:12px;list-style:none}
details summary::-webkit-details-marker{display:none}
.pill{font-size:11px;color:var(--muted2)}
button.pill{background:var(--chip);color:var(--muted);border:1px solid var(--line);border-radius:999px;
padding:4px 12px;font-weight:700;cursor:pointer;font-family:inherit;transition:background .12s,color .12s}
button.pill:hover{background:var(--hover);color:var(--txt)}
.empty{color:var(--muted);padding:24px;text-align:center}
.spin{color:var(--muted);padding:44px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px}
.spin::before{content:"";width:30px;height:30px;border-radius:50%;border:3px solid var(--line);
border-top-color:var(--accent);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){ .spin::before{animation:none} }
.err{background:var(--bad-bg);border:1px solid var(--bad-line);color:var(--bad-fg);padding:14px;border-radius:10px}
.count-chip{background:var(--chip);color:var(--muted);border-radius:999px;padding:1px 9px;font-size:12px;font-weight:700}
.daybar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.daychip{background:var(--panel);border:1px solid var(--line);color:var(--muted);border-radius:10px;
padding:7px 12px;font-size:13px;font-weight:600;cursor:pointer;display:inline-flex;gap:7px;align-items:center;font-family:inherit}
.daychip:hover{color:var(--txt);border-color:var(--accent)}
.daychip.on{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.daychip .c{background:rgba(127,127,127,.22);border-radius:999px;padding:0 7px;font-size:11px}
.daychip.on .c{background:rgba(255,255,255,.25)}
.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.toolbar input[type=search]{background:var(--panel);border:1px solid var(--line);color:var(--txt);border-radius:9px;
padding:8px 12px;font-size:13px;min-width:230px;font-family:inherit}
.toolbar input[type=search]:focus{outline:2px solid var(--accent);border-color:var(--accent)}
.toggle{background:var(--panel);border:1px solid var(--line);color:var(--muted);border-radius:9px;
padding:8px 12px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit}
.toggle.on{background:var(--warn-bg);color:var(--warn-fg);border-color:var(--warn-line)}
.rollup{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}
.rollup .r{font-size:12px;font-weight:700;padding:4px 10px;border-radius:8px;background:var(--panel);border:1px solid var(--line)}
/* Dokument-Chips */
.doc-grp{margin-bottom:14px}
.doc-grp:last-child{margin-bottom:0}
.doc-grp-t{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:8px}
.doc-row{display:flex;gap:8px;flex-wrap:wrap}
.doc-chip{display:inline-flex;align-items:center;gap:7px;background:var(--chip);border:1px solid var(--line);
border-radius:9px;padding:7px 12px;font-size:12.5px;font-weight:600;color:var(--txt);transition:border-color .12s,background .12s}
.doc-chip:hover{border-color:var(--accent);background:var(--hover)}
.doc-chip .dl{color:var(--txt)}
/* Disposition */
.seg{display:inline-flex;background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.seg button{background:transparent;border:none;color:var(--muted);padding:8px 16px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit}
.seg button.on{background:var(--accent);color:var(--on-accent)}
#dmap{height:calc(100vh - 210px);min-height:420px;border-radius:14px;border:1px solid var(--line);overflow:hidden;z-index:1}
.leaflet-popup-content{font:13px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
/* Dunkle Karte aus hellen OSM-Kacheln (keyless): Invert + Farbdrehung */
.osm-dark{filter:invert(1) hue-rotate(180deg) brightness(.92) contrast(.95)}
.board{display:flex;gap:14px;overflow-x:auto;padding-bottom:12px}
.lane{flex:0 0 260px;background:var(--card-grad);border:1px solid var(--line);border-radius:14px;display:flex;flex-direction:column;max-height:calc(100vh - 230px)}
.lane-h{padding:12px 14px;border-bottom:1px solid var(--line);position:sticky;top:0}
.lane-h .t{display:flex;align-items:center;gap:8px;font-weight:800;font-size:15px}
.lane-h .swatch{width:12px;height:12px;border-radius:3px;flex:0 0 auto}
.lane-h .meta{color:var(--muted);font-size:11.5px;margin-top:4px}
.lane-body{overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:6px}
.scard{background:var(--panel2);border:1px solid var(--line);border-radius:9px;padding:8px 10px;font-size:12.5px;cursor:pointer}
.scard:hover{border-color:var(--accent)}
.scard .nm{font-weight:700}
.scard .lo{color:var(--muted);font-size:11.5px;margin-top:2px;display:flex;justify-content:space-between;gap:8px}
.scard .st{font-size:10px;font-weight:700;padding:1px 6px;border-radius:5px;background:var(--chip);color:var(--muted)}
.dlegend{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.dlegend .li{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:3px 9px;cursor:pointer}
.dlegend .sw{width:10px;height:10px;border-radius:50%}
/* Tourfahrplan */
.dispo-grid{display:grid;grid-template-columns:290px 1fr;gap:16px;align-items:start}
.tourlist{display:flex;flex-direction:column;gap:6px;max-height:calc(100vh - 210px);overflow-y:auto;padding-right:4px}
.trow{display:flex;gap:10px;align-items:center;background:var(--card-grad);border:1px solid var(--line);border-radius:11px;padding:10px 12px;cursor:pointer;transition:border-color .12s}
.trow:hover{border-color:var(--accent)}
.trow.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.trow .sw{width:12px;height:34px;border-radius:4px;flex:0 0 auto}
.trow .ti{flex:1;min-width:0}
.trow .tt{font-weight:700;font-size:13.5px}
.trow .cap{display:flex;align-items:center;gap:8px;margin-top:4px}
.capbar{flex:1;height:6px;background:var(--chip);border-radius:999px;overflow:hidden}
.capbar i{display:block;height:100%;border-radius:999px}
.capn{color:var(--muted);font-size:11px;white-space:nowrap;font-variant-numeric:tabular-nums}
.tourhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.th-t{display:flex;align-items:center;gap:9px;font-size:18px;font-weight:800}
.th-t .sw{width:14px;height:14px;border-radius:4px}
.th-cap{font-size:17px;font-weight:800;font-variant-numeric:tabular-nums;display:flex;gap:8px;align-items:baseline}
.th-cap span{color:var(--muted);font-weight:400}
.dispo-2col{display:grid;grid-template-columns:1fr 340px;gap:18px;align-items:start}
.timeline{position:relative;padding-left:4px}
.timeline::before{content:"";position:absolute;left:63px;top:10px;bottom:10px;width:2px;background:var(--line)}
.tl-row{display:grid;grid-template-columns:52px 16px 1fr;gap:0 10px;align-items:start;padding:7px 0;cursor:pointer;position:relative}
.tl-row:hover .tl-nm{color:var(--accent)}
.tl-row.anchor{cursor:default}
.tl-time{text-align:right;font-variant-numeric:tabular-nums;font-size:12.5px;color:var(--muted);font-weight:600;padding-top:1px}
.tl-dot{width:11px;height:11px;border-radius:50%;border:2px solid var(--bg);margin-top:2px;z-index:1;box-shadow:0 0 0 1px var(--line)}
.tl-body{min-width:0}
.tl-nm{font-weight:700;font-size:13px}
.tl-sub{color:var(--muted);font-size:11.5px;margin-top:1px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.tl-st{font-size:10px;font-weight:700;padding:0 6px;border-radius:5px;background:var(--chip);color:var(--muted)}
.tourmap{height:340px;border-radius:12px;border:1px solid var(--line);overflow:hidden;z-index:1;position:sticky;top:20px}
@media (max-width:1100px){ .dispo-2col{grid-template-columns:1fr} .tourmap{height:260px} }
/* Controlling */
.ctrl-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:20px}
.ktile{background:var(--card-grad);border:1px solid var(--line);border-radius:14px;padding:16px 18px;box-shadow:var(--shadow)}
.ktile .kl{color:var(--muted);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.4px}
.ktile .kv{font-size:27px;font-weight:800;margin-top:6px;letter-spacing:-.5px;font-variant-numeric:tabular-nums}
.ktile .kv .u{font-size:15px;font-weight:600;color:var(--muted);margin-left:3px}
.ktile .kt{margin-top:6px;font-size:12px;font-weight:700;display:inline-flex;align-items:center;gap:4px}
.ktile .khint{margin-top:5px;font-size:11.5px;color:var(--muted2)}
/* Alois-Briefing / Prüf-Panel */
.brief{background:var(--card-grad);border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px;box-shadow:var(--shadow)}
.brief-h{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.brief-av{width:38px;height:38px;border-radius:10px;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:800;flex:0 0 auto}
.brief-h .n{font-weight:700;font-size:15px}
.brief-h .r{color:var(--muted);font-size:12px}
.brief-say{font-size:14px;line-height:1.62;color:var(--txt)}
.brow{display:flex;gap:10px;padding:11px 0;border-top:1px solid var(--line)}
.bdot{width:9px;height:9px;border-radius:50%;margin-top:5px;flex:0 0 auto}
.bdot.warn{background:var(--warn-fg)} .bdot.chance{background:var(--ok-fg)}
.bdot.info{background:var(--info-fg)} .bdot.ok{background:var(--muted2)}
.bcat{font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted2);font-weight:700}
.btitle{font-weight:700;font-size:13.5px;margin-top:2px}
.bdetail{font-size:13px;color:var(--muted);margin-top:3px;line-height:1.5}
.breco{font-size:13px;margin-top:5px;line-height:1.5}
.brief-foot{margin-top:12px;font-size:11.5px;color:var(--muted2)}
/* Bedarfs-Forecast / Vorschau */
.fc-list{display:flex;flex-direction:column}
.fc-row{display:grid;grid-template-columns:190px 1fr 120px;align-items:center;gap:14px;padding:9px 0;border-top:1px solid var(--line)}
.fc-row:first-child{border-top:none}
.fc-day{font-size:13px}
.fc-bars{display:flex;flex-direction:column;gap:4px}
.fc-bar{height:18px;border-radius:5px;display:flex;align-items:center;min-width:2px}
.fc-bar span{font-size:10.5px;color:#fff;padding:0 7px;white-space:nowrap;font-weight:600}
.fc-bar.exp{background:var(--muted2)}
.fc-bar.pl{background:var(--accent)}
.fc-gap{font-size:11.5px;text-align:right}
.fc-ok{color:var(--ok-fg);font-weight:700}
.fc-open{color:var(--warn-fg);font-weight:700}
.fc-legend{margin-top:12px;font-size:11.5px;color:var(--muted2);display:flex;align-items:center;gap:6px}
.fc-key{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:middle}
.fc-key.exp{background:var(--muted2)} .fc-key.pl{background:var(--accent)}
/* Controlling-Zeitfilter */
.ctrl-filter{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.chip{background:var(--panel);border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:6px 14px;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;transition:background .12s,color .12s,border-color .12s}
.chip:hover{color:var(--txt);border-color:var(--accent)}
.chip.active{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.cf-sep{width:1px;height:22px;background:var(--line);margin:0 4px}
.cf-date{background:var(--bg);border:1px solid var(--line);color:var(--txt);border-radius:8px;padding:5px 10px;font:inherit;font-size:12.5px}
.cf-date:focus{outline:none;border-color:var(--accent)}
.cf-hint{color:var(--muted2);font-size:11.5px;margin-left:auto}
.kt.up{color:var(--ok-fg)} .kt.down{color:var(--bad-fg)} .kt.flat{color:var(--muted)}
.ctrl-2{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px}
@media (max-width:900px){ .ctrl-2{grid-template-columns:1fr} }
.chartcard{background:var(--card-grad);border:1px solid var(--line);border-radius:14px;padding:16px 18px;box-shadow:var(--shadow)}
.chartcard h3{margin:0 0 12px;font-size:14px;font-weight:700}
.chartcard svg{width:100%;height:auto;display:block}
.barcell{fill:var(--accent);transition:opacity .12s}
.barcell:hover{opacity:.75}
.axislbl{fill:var(--muted2);font-size:9px;font-variant-numeric:tabular-nums}
.gridln{stroke:var(--line);stroke-width:1}
.valbar{height:7px;background:var(--chip);border-radius:999px;overflow:hidden;flex:1}
.valbar i{display:block;height:100%;border-radius:999px;background:var(--accent)}
/* Alois */
.alois{background:var(--card-grad);border:1px solid var(--line);border-radius:16px;padding:18px 20px;margin-bottom:20px;box-shadow:var(--shadow)}
.alois-h{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.alois-av{width:40px;height:40px;border-radius:50%;background:var(--accent);display:grid;place-items:center;color:#fff;font-weight:800;font-size:17px;flex:0 0 auto}
.alois-h .n{font-weight:800;font-size:15px}
.alois-h .r{color:var(--muted);font-size:12px}
.alois-say{font-size:14px;line-height:1.6;background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:14px}
.find{display:flex;gap:11px;padding:11px 0;border-top:1px solid var(--line)}
.find .fi{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;flex:0 0 auto;font-size:13px}
.fi.warn{background:var(--warn-bg);color:var(--warn-fg)} .fi.info{background:var(--info-bg);color:var(--info-fg)} .fi.ok{background:var(--ok-bg);color:var(--ok-fg)}
.find .ft{font-weight:700;font-size:13.5px}
.find .fcat{font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
.find .fd{color:var(--muted);font-size:12.5px;margin-top:3px}
.find .fr{font-size:12.5px;margin-top:5px;padding:6px 10px;background:var(--panel2);border-radius:8px;border-left:3px solid var(--accent)}
.bar-inc{opacity:.35}
.alois-mini{padding:12px 14px;border-bottom:1px solid var(--line);background:var(--panel2)}
.alois-mini .t{font-weight:700;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:8px}
.alois-mini .fm{font-size:12.5px;padding:7px 0;border-top:1px solid var(--line);display:flex;gap:8px}
.alois-mini .fm:first-of-type{border-top:none}
/* Kontextueller Insight-Marker (nur wo Alois etwas sieht) */
.imark{position:relative;display:inline-flex;align-items:center;justify-content:center;
width:17px;height:17px;border-radius:50%;font-size:11px;font-weight:800;cursor:help;
vertical-align:middle;margin-left:7px;outline:none}
.imark.warn{background:var(--warn-bg);color:var(--warn-fg);border:1px solid var(--warn-line)}
.imark.info{background:var(--info-bg);color:var(--info-fg);border:1px solid var(--info-line)}
.imark.chance{background:var(--ok-bg);color:var(--ok-fg);border:1px solid var(--ok-line)}
/* Alois – Controller-Briefing (seriös, kompakt) */
.imark-pop{position:absolute;z-index:40;top:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(-4px);
width:280px;background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow-pop);
padding:12px 13px;text-align:left;opacity:0;pointer-events:none;transition:opacity .13s,transform .13s;font-weight:400}
.imark:hover .imark-pop,.imark:focus-visible .imark-pop{opacity:1;transform:translateX(-50%) translateY(0);pointer-events:auto}
.imark-pop::before{content:"";position:absolute;bottom:100%;left:50%;transform:translateX(-50%);
border:6px solid transparent;border-bottom-color:var(--line)}
.imark-pop .pc{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
.imark-pop .pt{font-size:13px;font-weight:700;margin:3px 0 4px}
.imark-pop .pd{font-size:12px;color:var(--muted);line-height:1.5}
.imark-pop .pr{font-size:12px;margin-top:8px;padding:7px 9px;background:var(--panel2);border-radius:7px;border-left:2px solid var(--accent);line-height:1.5}
.imark-pop .more{font-size:11px;color:var(--muted2);margin-top:8px}
.imark-pop .pbtn{margin-top:10px;width:100%;padding:8px 10px;font:inherit;font-size:12px;font-weight:600;
cursor:pointer;color:#fff;background:var(--accent);border:none;border-radius:8px;transition:filter .12s}
.imark-pop .pbtn:hover{filter:brightness(1.08)}
.imark-pop + .imark-pop{margin-top:6px}
.trow .imark{margin-left:0}
/* ============ Chat-Widget (unten rechts) ============ */
#chatfab{position:fixed;right:22px;bottom:22px;width:54px;height:54px;border-radius:50%;z-index:1100;
background:var(--accent);color:#fff;border:none;cursor:pointer;
font-size:22px;display:grid;place-items:center;box-shadow:var(--shadow-pop);
transition:transform .15s ease}
#chatfab:hover{transform:scale(1.07)}
/* Vollhoher rechter Drawer statt kleiner Bubble */
#chatpanel{position:fixed;top:0;right:0;bottom:0;width:440px;max-width:calc(100vw - 24px);
height:100vh;z-index:61;display:flex;flex-direction:column;
background:var(--panel);border-left:1px solid var(--line);box-shadow:var(--shadow-pop);
overflow:hidden;transition:transform .2s ease,opacity .2s ease}
#chatpanel.hidden{transform:translateX(24px);opacity:0;pointer-events:none}
.chat-head{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid var(--line);
background:var(--accent);color:#fff}
.chat-head b{font-size:15px}
.chat-head .sub{font-size:11px;opacity:.85}
.chat-head .x{margin-left:auto;background:rgba(255,255,255,.18);border:none;color:#fff;border-radius:8px;
width:30px;height:30px;cursor:pointer;font-size:15px}
#chatlog{flex:1;overflow:auto;padding:18px;display:flex;flex-direction:column;gap:12px}
.cmsg-u{align-self:flex-end;max-width:80%;background:var(--accent);color:var(--on-accent);
padding:9px 13px;border-radius:14px 14px 4px 14px;font-size:13.5px;line-height:1.5}
.cmsg-a{align-self:flex-start;max-width:94%;background:var(--panel2);border:1px solid var(--line);
color:var(--txt);padding:13px 15px;border-radius:14px 14px 14px 4px;font-size:14px;line-height:1.62}
.cmsg-a .ans strong{font-weight:700}
.cmsg-a table{font-size:12px;margin-top:10px}
.cmsg-a th,.cmsg-a td{padding:5px 8px}
.cmsg-a .cnote{color:var(--muted2);font-size:11.5px;margin-top:8px}
.chat-suggest{display:flex;gap:6px;flex-wrap:wrap;padding:0 14px 8px}
.chat-suggest button{background:var(--chip);border:1px solid var(--line);color:var(--muted);border-radius:999px;
padding:4px 10px;font-size:11.5px;cursor:pointer;font-family:inherit}
.chat-suggest button:hover{color:var(--txt);border-color:var(--accent)}
.chat-input{display:flex;gap:8px;padding:12px 14px;border-top:1px solid var(--line);background:var(--panel2)}
.chat-input input{flex:1;background:var(--bg);border:1px solid var(--line);color:var(--txt);
border-radius:10px;padding:9px 12px;font-size:13px;font-family:inherit;outline:none}
.chat-input input:focus{border-color:var(--accent)}
.chat-input button{background:var(--accent);color:var(--on-accent);border:none;border-radius:10px;
padding:0 16px;font-weight:700;cursor:pointer;font-family:inherit}
@media (max-width:720px){
.app{grid-template-columns:1fr !important} /* schlaegt auch body.nav-zu */
/* Sidebar als Off-Canvas-Schublade: standardmaessig ZU, ☰ oeffnet (Handy-Test 26.08.) */
aside{position:fixed;top:0;left:0;height:100dvh;width:min(84vw,290px);z-index:1400;
padding:20px 14px;transform:translateX(-100%);transition:transform .2s ease;
box-shadow:2px 0 22px rgba(0,0,0,.4)}
body.nav-offen aside{transform:translateX(0)}
aside>*{opacity:1 !important} /* Desktop-Collapse-Fading neutralisieren */
.brand .navtoggle{display:none} /* im Drawer schliesst der Backdrop */
#navbackdrop{display:block;position:fixed;inset:0;z-index:1300;background:rgba(0,0,0,.45);
opacity:0;pointer-events:none;transition:opacity .2s}
body.nav-offen #navbackdrop{opacity:1;pointer-events:auto}
#navopen{display:grid !important} /* ☰ immer sichtbar */
main{padding:58px 14px 20px;max-width:none} /* Platz fuer den ☰-Button oben */
/* Tages-Chips: horizontal wischen statt senkrecht stapeln */
.daybar{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;-webkit-overflow-scrolling:touch}
.daychip{flex:0 0 auto;white-space:nowrap}
.head h2{font-size:18px}
.head .sub{font-size:12px}
.pl-werkbank{grid-template-columns:1fr;height:auto;min-height:0}
.pl-spalte{overflow:visible}
.pl-spalte > div[id]{overflow:visible;max-height:none}
.pl-karte{height:56vh;min-height:300px}
.kv{grid-template-columns:110px 1fr}
#chatpanel{left:0;right:0;width:auto;max-width:none}
}
/* ============ E3: Handlungsbedarf-Zeilen (Heute) — Zustandsfarben aus Tokens ============ */
.hb-row{display:flex;align-items:center;gap:14px;padding:13px 16px;border-radius:11px;margin-bottom:8px}
.hb-rot{background:var(--bad-bg)}
.hb-gelb{background:var(--warn-bg)}
.hb-dot{width:10px;height:10px;border-radius:50%;flex:0 0 auto}
.hb-rot .hb-dot{background:var(--bad-fg)}
.hb-gelb .hb-dot{background:var(--warn-fg)}
.hb-count{font-size:20px;min-width:44px;text-align:right;font-variant-numeric:tabular-nums}
.hb-rot .hb-count{color:var(--bad-fg)}
.hb-gelb .hb-count{color:var(--warn-fg)}
.hb-text{flex:1}
/* ---- Abnahme-Prüfblick: Ampel ---- */
.ampel{display:inline-block;width:11px;height:11px;border-radius:50%;vertical-align:middle;flex:0 0 auto}
.a-rot{background:var(--bad-fg)}
.a-gelb{background:var(--warn-fg)}
.a-gruen{background:var(--ok-fg)}
.chip .ampel{margin-right:6px}
/* ---- Karten-Legende (Disponieren): welche Farbe ist welche Tour ---- */
.map-legende{position:absolute;left:10px;bottom:10px;z-index:400;display:flex;flex-wrap:wrap;
gap:4px;max-width:calc(100% - 92px);max-height:96px;overflow:auto;
background:color-mix(in srgb, var(--panel) 88%, transparent);
border:1px solid var(--line);border-radius:10px;padding:7px 8px;backdrop-filter:blur(6px)}
.ml-item{display:inline-flex;align-items:center;gap:5px;font:inherit;font-size:11px;font-weight:600;
background:transparent;border:1px solid transparent;border-radius:7px;padding:2px 7px;
color:var(--txt);cursor:pointer;white-space:nowrap}
.ml-item:hover{background:var(--hover)}
.ml-item.on{border-color:var(--accent);background:var(--hover)}
.ml-sw{width:9px;height:9px;border-radius:50%;flex:0 0 auto}
/* ---- Disponieren: Werkbank (Arbeit | Ziele | Kontext) ---- */
.pl-werkbank{display:grid;grid-template-columns:300px 380px minmax(520px,1fr);gap:14px;
height:calc(100vh - 210px);min-height:520px}
/* Disponieren darf die volle Breite nutzen (sonst deckelt main:max-width die Karte). */
main:has(.pl-werkbank){max-width:none;padding-right:24px}
.pl-spalte{display:flex;flex-direction:column;min-width:0;overflow:hidden}
.pl-spalte > div[id]{overflow-y:auto;flex:1;padding-right:4px}
.pl-titel{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;
color:var(--muted);margin-bottom:9px;display:flex;align-items:center;gap:8px;flex:0 0 auto}
.pl-tourgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
gap:9px;align-content:start}
.pl-karte{border:1px solid var(--line);border-radius:12px;overflow:hidden;position:relative}
.pl-hilfe{flex:0 0 auto;margin-top:8px;border-top:1px solid var(--line);padding-top:8px}
.pl-hilfe summary{color:var(--muted);font-size:11.5px}
.pl-hilfe div{font-size:11px;color:var(--muted2);line-height:1.6;margin-top:6px}
@media (max-width:1400px){
.pl-werkbank{grid-template-columns:300px minmax(0,1fr);}
.pl-karte{grid-column:1 / -1;height:340px}
.pl-werkbank{height:auto}
.pl-spalte{max-height:560px}
}
/* ---- Ehrlichkeits-Band: was hier passiert und was NICHT ---- */
.umsetz-band{display:flex;gap:10px;align-items:flex-start;margin:0 0 14px;padding:10px 14px;
border:1px solid var(--ro-line);background:var(--ro-bg);color:var(--ro-fg);
border-radius:10px;font-size:12.5px;line-height:1.55}
.umsetz-band b{color:var(--ro-fg)}
.ub-ico{flex:0 0 auto}
/* Banner-Abstufung: "nicht aktuell" ist eine Information, kein Alarm */
#healthbar.healthbar-info{background:var(--info-bg);color:var(--info-fg);
border-bottom:1px solid var(--info-line)}
/* ---- Zugänge: Formularzeilen ---- */
.zug-form{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}
.zug-form input,.zug-form select{background:var(--bg);border:1px solid var(--line);color:var(--txt);
border-radius:8px;padding:8px 11px;font:inherit;font-size:13px;min-width:170px}
.zug-form input:focus,.zug-form select:focus{outline:2px solid var(--accent);outline-offset:1px}
.zug-form button{cursor:pointer}
/* ---- MEDEA-Ist-Stand im Abnahme-Prüfblick ---- */
.medea-band{margin:0 0 12px;padding:9px 14px;border:1px solid var(--info-line);
background:var(--info-bg);color:var(--info-fg);border-radius:10px;font-size:12.5px}
.me-ok{color:var(--ok-fg);font-weight:700}
.me-warn{color:var(--warn-fg);font-weight:700}
.me-open{color:var(--muted);font-weight:600}
/* ---- Sidebar ein-/ausklappbar ---- */
/* position:fixed -> nie ein Grid-Element (kann das Desktop-Layout nicht verschieben);
auf Desktop dauerhaft unsichtbar, nur auf dem Handy bei offener Schublade sichtbar. */
#navbackdrop{position:fixed;inset:0;z-index:1300;background:rgba(0,0,0,.45);
opacity:0;pointer-events:none;transition:opacity .2s}
body.nav-zu .app{grid-template-columns:0 1fr}
body.nav-zu main{padding-left:58px} /* Platz fuer den ☰-Button, sonst ueberdeckt er die Ueberschrift */
body.nav-zu aside{border-right:0;overflow:hidden;padding-left:0;padding-right:0}
body.nav-zu aside>*{opacity:0;transition:opacity .1s}
.navtoggle{margin-left:auto;background:transparent;border:0;color:var(--muted);cursor:pointer;font-size:17px;line-height:1;padding:3px 7px;border-radius:7px}
.navtoggle:hover{background:var(--hover);color:var(--txt)}
#navopen{position:fixed;top:10px;left:10px;z-index:1500;display:none;place-items:center;width:38px;height:38px;border-radius:10px;background:var(--panel);border:1px solid var(--line);color:var(--txt);cursor:pointer;font-size:17px;box-shadow:0 2px 10px rgba(0,0,0,.22)}
#navopen:hover{background:var(--hover)}
body.nav-zu #navopen{display:grid}