/* Wasserzeichen: freigestelltes Logo fest im Hintergrund, mittig, nicht klickbar */
body::before{content:"";position:fixed;inset:0;background:var(--wmimg, url(api/logo)) right 12px bottom 12px/min(28vw,200px) auto no-repeat;opacity:.06;pointer-events:none;z-index:-1}
img.logo{height:60px;width:auto;max-width:84px;object-fit:contain}
.biglogo{display:block;margin:4px auto 16px;width:min(64vw,250px);height:auto}

@media print{header.top,.tabs,#bar,.noprint,button,.lang,.banner{display:none!important}body::before{display:none}body,body.homeview{background:#fff!important;color:#000!important}.item{break-inside:avoid;border:1px solid #bbb;background:#fff}.rp h3{margin-top:14px}input,textarea{border:1px solid #bbb;background:#fff;color:#000}}
body.homeview .item{color:#14263a}

/* Bereiche je Rolle */
.areas{display:grid;gap:14px;margin:16px 0}
.area,.areahead{display:flex;align-items:center;gap:16px;border-radius:24px;border:2px solid rgba(255,255,255,.28);color:#fff;text-align:left;padding:16px;font-size:1rem;width:100%}
.area{min-height:118px;cursor:pointer}.areahead{margin:12px 0;padding:12px 16px;border-radius:20px}
.area .ic,.areahead .ic{width:54px;height:54px;flex:none}.areahead .ic{width:42px;height:42px}
.atxt{flex:1}.atxt b{font-size:1.4rem;display:block;line-height:1.15}.atxt small{display:block;font-size:.95rem;opacity:.96;margin-top:3px}
.a-guard{background:#1f8a57}.a-sup{background:#2b6cb0}.a-cus{background:#b7791f}.a-co{background:#6b46c1}
.tile.a-guard,.tile.a-sup,.tile.a-cus,.tile.a-co{border-width:2px;background:rgba(255,255,255,.1)}
.tile.a-guard{border-color:#34c27f}.tile.a-sup{border-color:#5aa0e6}.tile.a-cus{border-color:#e0a73c}.tile.a-co{border-color:#a78bfa}
.tile.ok{background:var(--ok)}.tile.alarm{background:var(--alarm)}
.tile{min-height:140px}.areahead .btn{margin-left:auto;flex:none}
@media(min-width:700px){.areas{grid-template-columns:1fr 1fr}}

.brandcard{text-align:center}.brandimg{max-width:100%;max-height:320px;object-fit:contain;cursor:zoom-in;margin-bottom:8px}
.lightbox{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;cursor:zoom-out}
.lightbox.dark{background:#0b1830}.lightbox.light{background:#f6f1e6}
.lightbox img{max-width:94vw;max-height:84vh;object-fit:contain}
.lbbar{position:absolute;bottom:16px;left:0;right:0;text-align:center}

/* Skin "red" (aus den Farben der Logo-Varianten: Anthrazit, Silber, Rot) */
html[data-skin="red"]{--navy:#23242a;--navy2:#3a3b44;--steel:#c4c7ce;--bg:#f3f1f1;--warm:#f6f2f0;--ink:#1f1f24;--line:#ddd3d3}
html[data-skin="red"] header.top{background:#eeeff2;color:#1f1f24;border-bottom:3px solid #c1121f}
html[data-skin="red"] .brand,html[data-skin="red"] .brand span,html[data-skin="red"] .brandtxt,html[data-skin="red"] .brandtxt small{color:#1f1f24}
html[data-skin="red"] .lang button{border-color:#8b8e97;color:#1f1f24;background:transparent}
html[data-skin="red"] .lang button.on{background:#c1121f;color:#fff;border-color:#c1121f}
html[data-skin="red"] .btn.dark,html[data-skin="red"] .tabs button.on{background:#c1121f;color:#fff}
html[data-skin="red"] body.homeview{background:linear-gradient(180deg,#17171a 0%,#3b0f14 100%)}
html[data-skin="red"] a{color:#9b111b}
html[data-skin="red"] .chip{background:#9b111b}
html[data-skin="red"] .back{background:#23242a}
html[data-skin="red"] body::before{opacity:.13}
.brandcard .chip{display:inline-block;padding:3px 10px;font-size:.8rem;border-radius:12px}

.greetbox{margin:10px 0 14px;padding:12px;border-radius:18px;background:rgba(255,255,255,.1);color:inherit}
.greetbox h2{color:inherit;margin:0 0 8px}.greetbox h3{color:inherit;margin:10px 0 6px}
.greetbox .item{color:#14263a}.how summary{cursor:pointer;font-weight:700;padding:8px 0}
.quick{margin:12px 0;padding:12px;border-radius:18px;border:2px solid #e0a73c;background:rgba(224,167,60,.14)}.quick h3{margin:0 0 4px;color:inherit}
.qbtn{margin:4px 4px 4px 0;min-height:52px;font-size:1.05rem}
.clogo{height:54px;width:auto;max-width:120px;object-fit:contain;background:#fff;border-radius:10px;padding:4px;margin-right:12px}
.ccard .clogo{display:block;height:80px;max-width:200px;margin:0 0 8px}
.companyhead{text-align:center;margin:8px 0}.companyhead .biglogo{width:min(46vw,190px)}

.orgsmall{height:22px;width:auto;vertical-align:middle;margin-left:6px}

.setup{margin:12px 0;padding:12px;border-radius:18px;background:rgba(255,255,255,.12);border:2px solid #34c27f;color:inherit}.setup h3{margin:0 0 6px;color:inherit}
.pbar{height:10px;border-radius:6px;background:rgba(255,255,255,.25);margin-bottom:8px;overflow:hidden}.pbar i{display:block;height:100%;background:#34c27f}
.sstep{padding:6px 0;border-top:1px solid rgba(255,255,255,.2)}.sstep.done{opacity:.65}.intro{margin:2px 0 10px;opacity:.85}
.org{background:#fff;border-radius:12px;padding:3px}

.avatar{width:46px;height:46px;border-radius:50%;object-fit:cover;vertical-align:middle;margin-right:10px;background:#e7e2d8}.avatar.big{width:72px;height:72px}

.chip{display:inline-block;color:#123a5a;background:#e7e2d8;border-radius:12px;padding:2px 10px;margin:2px 2px 2px 0}.chip a{text-decoration:none;margin-left:4px}

html[data-skin="client"]{--navy:#2b2620;--navy2:#4a4137;--steel:#d6cfc2;--bg:#f6f1e7;--warm:#f6f1e7;--ink:#201c17;--line:#ddd3c0}
html[data-skin="client"] header.top{background:#f6f1e7;color:#201c17;border-bottom:3px solid #5b4a32}
html[data-skin="client"] .brand,html[data-skin="client"] .brand span,html[data-skin="client"] .brandtxt,html[data-skin="client"] .brandtxt small{color:#201c17}
html[data-skin="client"] .lang button{border-color:#8a7e6a;color:#201c17;background:transparent}
html[data-skin="client"] .lang button.on{background:#5b4a32;color:#fff;border-color:#5b4a32}
html[data-skin="client"] .btn.dark,html[data-skin="client"] .tabs button.on{background:#5b4a32;color:#fff}
html[data-skin="client"] body.homeview{background:linear-gradient(180deg,#2b2620 0%,#4a3f31 100%)}
html[data-skin="client"] a{color:#5b4a32}
html[data-skin="client"] .chip{background:#5b4a32}
html[data-skin="client"] .back{background:#2b2620}
html[data-skin="client"] body::before{opacity:.13}

/* Schnellmeldungen: Raster mit Icon + Dringlichkeit */
.quick h4{margin:10px 0 4px;font-size:.95rem}
.qgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.qbtn{display:flex;flex-direction:column;align-items:flex-start;gap:2px;margin:0;min-height:64px;text-align:left;color:#fff;background:#1f3550;border:0}
.qbtn .ic{width:26px;height:26px}.qbtn span{font-weight:700;line-height:1.15}.qbtn small{opacity:.85;font-size:.75rem;text-transform:uppercase;letter-spacing:.03em}
.qbtn.q-urgent{background:#b3261e}.qbtn.q-high{background:#a35a00}.qbtn.q-normal{background:#37474f}
.qph{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-size:.9rem;cursor:pointer}.qph .ic{width:22px;height:22px}.qph input{max-width:190px}

/* Duty roster: mobil Tagesansicht, ab 900 px volles Wochenraster */
.rnav{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:4px 0 10px}
.rkpi{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:6px 0 10px}
.rkpi div{background:#fff;border:1px solid #d9dee5;border-radius:12px;padding:8px;text-align:center;color:#1b2430}
.rkpi b{display:block;font-size:1.35rem}.rkpi small{font-size:.72rem;opacity:.8}
.rkpi .warn{border-color:#e0a73c;background:#fff6e5}.rkpi .bad{border-color:#c0392b;background:#fdecea}.rkpi .good{border-color:#3c9a5f;background:#ecf7ef}
.ract{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:6px 0}
.ropen{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px}
.ropen .rb{min-width:140px;flex:0 0 auto;text-align:left}
.rpal{display:none;margin:8px 0;gap:6px;flex-wrap:wrap;align-items:center}
.rg{display:inline-block;padding:6px 10px;border-radius:999px;background:#1f3550;color:#fff;cursor:grab;font-size:.85rem;margin:2px}
.rb{position:relative;display:block;border-radius:8px;padding:5px 7px;margin:3px 0;font-size:.8rem;line-height:1.2;color:#fff;border:2px solid transparent;cursor:pointer;width:100%;box-sizing:border-box}
.rb small{display:block;opacity:.85;font-size:.7rem}.rb b{display:block;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rb em{font-size:.65rem;font-style:normal;text-transform:uppercase;opacity:.85}
.rb-day{background:#b7791f}.rb-eve{background:#2c7a7b}.rb-night{background:#1f2f57}
.rb-open{background:repeating-linear-gradient(135deg,#fff,#fff 6px,#f3f4f6 6px,#f3f4f6 12px);color:#8a5a00;border:2px dashed #d89a2b}
.rb-draft{opacity:.78;background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.18) 0 6px,transparent 6px 12px)}
.rb-conf{border-color:#e0a800}.rb-conf.red{border-color:#e53935;box-shadow:0 0 0 2px rgba(229,57,53,.35)}
.rbw{position:absolute;top:-7px;right:-7px;width:18px;height:18px;border-radius:50%;background:#e53935;color:#fff;font-style:normal;font-weight:800;text-align:center;line-height:18px;font-size:.75rem}
.rbt{display:block;font-size:.66rem;margin-top:2px;white-space:normal;color:#ffe3e0}
.rb-open .rbt{color:#a32}
.rb.over{outline:3px solid #4caf50}
.rb.mini{display:inline-block;width:14px;height:14px;padding:0;margin:0 4px -2px 0}
.rleg{font-size:.75rem;display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center}.rleg .rb{display:inline-block;width:14px;height:14px;padding:0;margin:0 2px 0 0;cursor:default}
.rnone{color:#9aa3ad}
.rgrid-wrap{display:none}
.rmob .rdays{display:flex;gap:4px;overflow-x:auto;margin:6px 0}
.rmob .rdays button{flex:0 0 auto;border:1px solid #c9d1db;background:#fff;border-radius:10px;padding:8px 10px;font-size:.8rem;color:#1b2430}
.rmob .rdays button.on{background:#1f3550;color:#fff;border-color:#1f3550}.rmob .rdays button.today{font-weight:800}
.rpost{background:#fff;border:1px solid #d9dee5;border-radius:12px;padding:8px 10px;margin:6px 0;color:#1b2430}
.rph{display:flex;justify-content:space-between;gap:6px;align-items:center}.gaptxt{color:#a35a00;font-weight:700}
.rcov{height:6px;background:#f1d6a8;border-radius:3px;margin:4px 0 2px;overflow:hidden}.rcov i{display:block;height:100%;background:#3c9a5f}.rcov.full{background:#cfe9d7}
.trybadge{display:inline-block;background:#6a1b9a;color:#fff;border-radius:999px;padding:2px 9px;font-size:.75rem;font-weight:700;letter-spacing:.02em;vertical-align:middle}
.trybadge.sm{font-size:.65rem;padding:1px 7px}
.rset{margin-top:14px}.rset summary{cursor:pointer;font-weight:700;padding:8px 0}
@media (min-width:900px){
  .rgrid-wrap{display:block;overflow-x:auto}.rmob{display:none}.rpal{display:flex}
  .rgrid{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed;background:#fff;border:1px solid #d9dee5;border-radius:12px;color:#1b2430}
  .rgrid th,.rgrid td{border-bottom:1px solid #e5e9ef;border-right:1px solid #eef1f5;padding:5px;vertical-align:top;text-align:left}
  .rgrid thead th{font-size:.8rem;background:#f5f7fa;position:sticky;top:0}
  .rgrid tbody th{width:190px;font-size:.82rem}.rgrid tbody th small{font-size:.7rem}
  .rgrid .today{background:#fffbe9}
  .rkpi{grid-template-columns:repeat(4,minmax(120px,180px))}
}

/* Kundenstammkarte + Sichtbarkeits-Kennzeichen (einheitlich: Kunde gruen, Wachen blau, nur AfriShield violett) */
.vis{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:2px 9px 2px 6px;font-size:.7rem;font-weight:700;vertical-align:middle;letter-spacing:.01em}
.vis .ic{width:14px;height:14px}
.vis-client{background:#e3f4ea;color:#1b6b3a;border:1px solid #9fd3b2}.vis-guards{background:#e4eefb;color:#1f4f8a;border:1px solid #a9c4ea}.vis-auth{background:#f1e6f7;color:#5e2a7e;border:1px solid #cfb0e0}
.cphead{display:flex;gap:12px;align-items:center}.cphead .biglogo{width:72px;height:72px;object-fit:contain;border-radius:12px;background:#fff}.cphead h2{margin:0}
.cpchk{background:#fff;border:1px solid #d9dee5;border-radius:12px;padding:10px;margin:10px 0;color:#1b2430}
.ck{display:inline-block;margin:3px 8px 3px 0;font-size:.82rem}.ck.ok{color:#1b6b3a}.ck.no{color:#a35a00}
.cpv{white-space:pre-wrap;padding:4px 0}
.chip.okc{background:#1b7f3b;cursor:default}.chip.grey{background:#5b6670;cursor:default}.chip.warnc{background:#a35a00;cursor:default}
table.inv{width:100%;border-collapse:collapse;background:#fff;color:#1b2430;border-radius:10px;overflow:hidden}table.inv th,table.inv td{padding:6px;border-bottom:1px solid #e5e9ef;text-align:left;font-size:.85rem}
.item.intern{border-left:4px solid #8e4bb0}

/* Login: kein Wasserzeichen hinter den Feldern (Johannes 20.10.) */
body.loginview::before{display:none}
.brandtxt small{display:block}
.stc{display:inline-block;border-radius:999px;padding:3px 10px;font-size:.75rem;font-weight:700;color:#fff;margin:2px 4px 2px 0}.stc.okc{background:#1b7f3b}.stc.grey{background:#6b7480}.stc.warnc{background:#a35a00}
/* Desktop: Stammkarte zweispaltig, Dienstplan volle Breite (bis 1200 px) */
.intq{color:#8a5a00;font-style:italic}
@media (min-width:900px){
  main.wrap:has(.cpgrid),main.wrap:has(.rgrid-wrap){max-width:1200px}
  .cpgrid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:22px;align-items:start}
  .cpr{position:sticky;top:70px}
}
#login{margin:0 auto}
/* Regeln als Karten */
.rcard{background:#fff;border:1px solid #d9dee5;border-radius:12px;margin:8px 0;color:#1b2430}
.rcard>summary{padding:12px 14px;cursor:pointer;font-size:1.02rem;list-style:none}.rcard>summary::-webkit-details-marker{display:none}
.rcard>summary small{background:#e8ecf1;border-radius:999px;padding:1px 8px;margin-left:6px}
.rline{border-top:1px solid #eef1f5}.rline>summary{padding:10px 14px;cursor:pointer;font-size:.92rem}
.rline .rule{padding:0 14px 10px}
/* Ausruestung/Waffen: Quellen-Kennzeichen */
.lt{display:inline-block;border-radius:6px;padding:1px 6px;font-size:.66rem;margin:1px 2px;vertical-align:middle;border:1px solid}
.lt-law{background:#eef3fb;color:#1f3f73;border-color:#b9cbe8}.lt-house{background:#f6f1e6;color:#6a4a12;border-color:#e0cfa7}.lt-open{background:#fdecea;color:#8a1f17;border-color:#f0b5ae}
details.more>summary{cursor:pointer;color:#5b6670;font-size:.85rem;margin:4px 0}.wf{padding:2px 0}.wact{margin-top:6px}
.callbtn{display:flex;align-items:center;justify-content:center;gap:10px;margin:14px 0 8px;padding:18px;font-size:1.25rem;font-weight:800;background:#0b6b3a;color:#fff;border-radius:16px;text-decoration:none}
.callbtn .ic{width:30px;height:30px}.smsbtn{display:block;text-align:center;padding:12px;border-radius:12px;background:#fff;color:#7a2e00;border:2px solid #7a2e00;font-weight:700;text-decoration:none}
.offq{position:fixed;left:8px;right:8px;bottom:8px;z-index:50;background:#7a2e00;color:#fff;padding:8px 12px;border-radius:10px;font-size:.9em;text-align:center}.offq.bad{background:#8a1f17}.offq a{color:#fff;text-decoration:underline}.offq .callbtn{margin:8px 0 4px;padding:12px;font-size:1rem}
/* Modus Einfach */
.modesw{display:flex;gap:0;margin:8px 0 12px;border:2px solid #1f3550;border-radius:999px;overflow:hidden;width:max-content}
.modesw button{border:0;background:#fff;color:#1f3550;padding:8px 18px;font-weight:700;font-size:.95rem}.modesw button.on{background:#1f3550;color:#fff}
.sasa{background:#fff;color:#1b2430;border-radius:18px;padding:16px 18px;margin:8px 0 14px;border-left:8px solid #2e7d32}.sasa.late{border-left-color:#c62828;background:#fff1f0}.sasa.good{border-left-color:#2e7d32}
.sasa small{display:block;font-weight:800;letter-spacing:.08em;color:#5b6670}.sasa b{display:block;font-size:1.45rem;line-height:1.25;margin:2px 0}.sasa span{display:block;font-size:1rem;color:#3c4652}
.sbig{display:flex;align-items:center;gap:14px;width:100%;margin:0 0 12px;padding:20px 18px;border:0;border-radius:18px;font-size:1.4rem;font-weight:800;color:#fff;text-align:left;cursor:pointer}
.sbig .ic{width:40px;height:40px}.sbig small{display:block;font-size:.8rem;font-weight:600;opacity:.9;margin-left:auto}
.sbig.ok{background:#2e7d32}.sbig.rep{background:#1f3550}.sbig.alarm{background:#c62828;flex-wrap:wrap}.sbig.alarm.holding{outline:6px solid #ffcdd2}
.sgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:8px 0 12px}.stile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:120px;border:0;border-radius:18px;background:#1f3550;color:#fff;font-size:1.1rem;font-weight:800;padding:12px;text-align:center}.stile .ic{width:44px;height:44px}
.smsg{font-size:1.1rem}
.sitrow{display:flex;justify-content:space-between;gap:8px;align-items:center;background:#fff;color:#1b2430;border-radius:12px;padding:10px 12px;margin:6px 0;border-left:8px solid #2e7d32}.sitrow.l-yellow{border-left-color:#e0a800}.sitrow.l-red{border-left-color:#c62828}.sitb{white-space:nowrap}
.needs{background:#fff1f0;border:2px solid #c62828;border-radius:12px;padding:10px 12px;color:#1b2430;margin:6px 0}.needs div{margin:4px 0}
.opn{cursor:pointer}.opn.o-alarm,.opn.o-urgent{border-left:6px solid #c62828}.opn.o-high{border-left:6px solid #a35a00}
.prsw{display:block;margin:10px 0;color:inherit}
a.callbtn,a.callbtn:visited{color:#fff !important}
body.homeview .sith,body.homeview h3{color:#fff}.sitlinks a{color:#ffd8a8}
/* Kontrast (WCAG AA) Einfach-Modus + Schalter eindeutig */
.modesw{border-color:#ffffff}
.modesw button{background:transparent;color:#ffffff;border:0}
.modesw button.on{background:#ffffff;color:#14202e;box-shadow:inset 0 0 0 2px #ffffff}
body:not(.homeview) .modesw{border-color:#1f3550}body:not(.homeview) .modesw button{color:#1f3550}body:not(.homeview) .modesw button.on{background:#1f3550;color:#fff}
body.homeview h2,body.homeview h3,body.homeview .sith{color:#ffffff}
.sitlinks{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}.sitlinks .btn{background:#ffffff;color:#14202e;border:0;font-weight:700}
.prsw{display:flex;align-items:center;gap:10px;margin:12px 0;color:#fff;font-weight:600}
.prsw input{appearance:none;-webkit-appearance:none;width:46px !important;height:26px;border-radius:999px;background:#6b7480;position:relative;cursor:pointer;flex:0 0 auto;margin:0 !important}
.prsw input::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:left .15s}
.prsw input:checked{background:#2e7d32}.prsw input:checked::after{left:23px}
.status .trybadge{display:inline-block;width:auto;margin-left:6px}
.ferr{color:#b3261e;font-size:.85rem;min-height:2px;margin:2px 0 6px}.shsel{display:flex;gap:14px;flex-wrap:wrap;margin:6px 0 10px}.shsel label{display:flex;align-items:center;gap:6px}.shsel input{width:auto}.pwonce{background:#fff8e1;border:2px solid #e0a800;border-radius:10px;padding:10px;margin-top:8px;color:#1b2430}.pwonce code{font-size:1.1rem}.cadm{border-left:4px solid #8e4bb0}
.vimg{display:block;width:100%;max-width:360px;border-radius:10px;margin:4px 0}.srcnote{color:#5b6670}
.polbtn{display:flex;align-items:center;justify-content:center;gap:10px;margin:8px 0;padding:14px;border-radius:14px;background:#0d2a5c;color:#fff !important;font-weight:800;text-decoration:none}.polbtn .ic{width:24px;height:24px}
.url{display:block;font-size:.72rem;color:#5b6670;overflow-wrap:anywhere;word-break:break-word}.item,.cpv,.item small{overflow-wrap:anywhere}
/* Hilfe-Agent unten rechts (klein, verdeckt nichts Wichtiges) */
#hlpbtn{position:fixed;right:14px;bottom:14px;z-index:60;width:48px;height:48px;border-radius:50%;border:0;background:#1f3550;color:#fff;font-size:1.5rem;font-weight:800;box-shadow:0 3px 10px rgba(0,0,0,.35)}
#hlpbox{position:fixed;right:10px;bottom:72px;z-index:61;width:min(360px,calc(100vw - 20px));max-height:70vh;display:flex;flex-direction:column;background:#fff;color:#1b2430;border-radius:14px;box-shadow:0 8px 28px rgba(0,0,0,.4);overflow:hidden}
#hlpbox.hide{display:none}.hlphead{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:#1f3550;color:#fff}.hlphead button{background:none;border:0;color:#fff;font-size:1.4rem}
#hlplog{padding:10px 12px;overflow:auto;flex:1}.hq{background:#e8ecf1;border-radius:10px;padding:6px 10px;margin:6px 0 6px 30px}.ha{background:#f6f1e7;border-radius:10px;padding:6px 10px;margin:6px 30px 6px 0}.ha ol{margin:4px 0 6px 18px;padding:0}
#hlpf{display:flex;gap:6px;padding:8px;border-top:1px solid #e5e9ef}#hlpf input{flex:1;min-width:0}

/* 21.10.: Foto-Vorschau mit Sende-Knopf; Platz unten fuer die feste Hilfe-Taste */
.qpbar{display:flex;gap:10px;align-items:center;margin:10px 0;padding:8px;border:2px solid #1f3550;border-radius:12px;background:#fff}.qpbar.hide{display:none}
.qpprev{width:84px;height:84px;object-fit:cover;border-radius:8px;flex:none}.qpr{display:flex;flex-direction:column;gap:6px;flex:1;min-width:0}.qpsend{width:100%;min-height:48px;font-size:1.05rem}
body{padding-bottom:84px}
/* 21.10.: lange URLs/Adressen/Woerter brechen nicht mehr aus 390 px */
.item,.kv,.kv b,.news,.msg,.row>div,p,li,td,th,h2,h3,small,label,.stcard,.sitrow,.opn,#hlpbox{overflow-wrap:anywhere;word-break:break-word}
a{overflow-wrap:anywhere}
img,video,iframe,table,pre,textarea,select,input{max-width:100%}
pre{white-space:pre-wrap}
table{display:block;overflow-x:auto}
html,body{overflow-wrap:anywhere;word-break:break-word}
/* QA 21.10.: Daumen-Groesse 44 px fuer Kopfknoepfe und Modus-Schalter, gruene Check-in-Bestaetigung, Statusleiste lesbarer */
.lang button{min-height:44px;min-width:44px}
.modesw button{min-height:44px}
.banner.ok{background:#1b7f3b;color:#fff;font-size:1.2rem;font-weight:700;text-align:center}
.status small{font-size:15px}
.sittop{margin:10px 0 4px}.sittop .btn{margin:4px 6px 4px 0}
.prbox{margin:28px 0 8px;padding-top:12px;border-top:1px solid #ddd6c8}
.sbrief summary{cursor:pointer;padding:6px 0}

.rb-add{background:#fff;color:#1f3a6e;border:2px dashed #1f3a6e;text-align:center}.rb-add small{display:block;color:#5b6670}.redit .rein>b{margin-top:4px}.inl{display:inline-flex!important;grid-template-columns:none!important;gap:4px;align-items:center}
.item img.vimg{width:auto;height:auto;max-width:min(100%,520px);max-height:300px;object-fit:contain;border-radius:10px;background:transparent}

.askov{position:fixed;inset:0;background:rgba(14,42,71,.55);z-index:200;display:flex;align-items:center;justify-content:center}.askb{background:#fff;color:#14263a;border-radius:14px;padding:18px;max-width:420px;width:calc(100% - 32px);box-shadow:0 8px 30px rgba(0,0,0,.35)}.askb p{margin:0 0 12px;font-size:1.05rem;line-height:1.35}.askb .aski{width:100%;font-size:1em;padding:10px;margin-bottom:12px}.aska{display:flex;gap:8px;justify-content:flex-end}

/* 22.10. Kundenportal: Sprachwahl mit 5 Sprachen, deutlich sichtbar */
.lang.multi button[data-l]{display:none}
.langsel{display:inline-flex;align-items:center;gap:6px;border:2px solid currentColor;border-radius:10px;padding:2px 4px 2px 8px;font-weight:700;margin-right:6px;cursor:pointer}
.langsel.hide{display:none}
.langsel svg{width:22px;height:22px;flex:0 0 22px}
.langsel select{font:inherit;font-weight:700;font-size:1rem;background:transparent;color:inherit;border:0;padding:8px 4px;min-height:40px;cursor:pointer;max-width:9.5em}
.langsel option{color:#111;background:#fff}
/* 22.10. Johannes: Ansicht Everything (Supervisor) nicht lesbar - Ursache: allgemeine .chip-Regel oben (dunkle Schrift #123a5a) traf die Navigations-Knoepfe auf rotem/blauem Grund. Knoepfe jetzt weisse Schrift, groesser, Fokus sichtbar. */
button.chip{color:#fff;padding:8px 14px;font-size:.95rem;line-height:1.3;border-radius:20px;margin:0;text-decoration:none;min-height:40px}
button.chip:hover{filter:brightness(1.15)}
button.chip:focus-visible{outline:3px solid #ffbf47;outline-offset:2px}
html[data-skin="red"] button.chip{background:#9b111b;color:#fff}
.chips{gap:8px}
/* Paket B: Demo-Streifen (nur CSS sticky, immer sichtbar) */
.demobar{position:sticky;top:0;z-index:50;background:repeating-linear-gradient(135deg,#ffd54a 0 14px,#2f3338 14px 28px);color:#111;text-align:center;font-weight:700;padding:0;min-height:36px;display:flex;align-items:center;justify-content:center}
.demobar::before{content:"";position:absolute;inset:4px 8px;background:#ffd54a;border-radius:4px;z-index:-1}
.demobar{isolation:isolate;font-size:.95rem;line-height:1.25;padding:6px 12px}
.demobar.hide{display:none}
/* Paket G: App installieren / neue Version */
.pwacard{border-left:4px solid #2f9e63}.pwacard .btn{min-height:44px}.pwaios{margin:.4em 0 0}
.pwaupd{position:fixed;left:12px;right:12px;bottom:12px;z-index:60;background:#0b2545;color:#fff;border-radius:12px;padding:10px 14px;display:flex;gap:10px;align-items:center;justify-content:space-between;box-shadow:0 4px 16px rgba(0,0,0,.3)}
.pwaupd .btn{min-height:44px}
/* Paket H: Website-Editor */
.wsck{display:flex;gap:8px;align-items:center;min-height:44px}.wsprev{display:flex;flex-wrap:wrap;gap:6px}
/* Paket D: Probezeit-Hinweis */
.trialbar{position:sticky;top:0;z-index:49;background:#fff4d6;color:#4a3500;border-bottom:3px solid #b36b00;padding:8px 14px;font-weight:700;text-align:center}
.trialbar.red{background:#fde7e7;color:#7f1d1d;border-color:#b3261e}.trialbar.hide{display:none}
/* Paket E: Bearbeiten-Sperre, Sortierung, Fahrt, Protokoll */
.editbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:6px 0 12px}.editbar .btn{min-height:44px}
input.locked,select.locked,textarea.locked{background:#eef0f2!important;color:#5b6670!important;border-style:dashed!important}
.sortbar{margin:6px 0 10px}.sortbar select{width:auto;min-height:44px}.sortarr{float:right;display:inline-flex;gap:4px;margin-left:6px}.sortarr .btn{min-width:44px;min-height:44px;padding:0}
.tripcard{border-left:4px solid #2b6cb0}.proto.handover{border-left:4px solid #6b46c1}.proto.patrol{border-left:4px solid #1b7f3b}

/* Fahrzeuge: Karte, Detailzeilen, Grossansicht (22.10.) */
.vitem .vfig{display:block;width:100%;max-width:520px;padding:0;margin:4px 0;border:0;border-radius:10px;background:#0d1a26;overflow:hidden;cursor:zoom-in}
.vitem .vfig img.vimg{display:block;width:100%;height:auto;max-width:none;max-height:none;object-fit:contain;border-radius:0;margin:0}
.vitem h3.vt{margin:8px 0 4px}
.vdet{display:grid;grid-template-columns:minmax(120px,max-content) 1fr;gap:2px 12px;margin:6px 0;font-size:.92em}.vdet dt{color:#5b6670}.vdet dd{margin:0;word-break:break-word}.vnone{color:#8a949c;font-style:italic}
ul.vsee{margin:2px 0 4px 18px;padding:0;font-size:.9em}
@media(max-width:480px){.vdet{grid-template-columns:1fr}.vdet dt{margin-top:4px}}
.vlb{position:fixed;inset:0;z-index:9999;background:rgba(5,10,16,.92);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px;cursor:zoom-out}
.vlb img{max-width:96vw;max-height:84vh;width:auto;height:auto;object-fit:contain;border-radius:6px}
.vlbc{color:#fff;margin-top:8px;text-align:center;font-size:.95em}
.vlbx{position:absolute;top:8px;right:12px;width:48px;height:48px;border:0;border-radius:50%;background:rgba(255,255,255,.15);color:#fff;font-size:32px;line-height:1;cursor:pointer}