:root{--g:#145a37;--gd:#0b3f26;--gl:#edf5ef;--sun:#edc851;--bg:#f4f7f5;--paper:#fff;--ink:#15261d;--muted:#69776d;--line:#dde7df;--soft:#f8faf8;--shadow:0 9px 32px #153f2510;--danger:#b72e2e;--warning:#a0671f}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;font-size:14px}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}input,select,textarea{width:100%;padding:12px 13px;border:1px solid #cedbd1;border-radius:10px;background:#fff;color:var(--ink);min-height:43px;outline:none;transition:border .15s,box-shadow .15s}textarea{resize:vertical}input:focus,select:focus,textarea:focus{border-color:#28754b;box-shadow:0 0 0 3px #2f86551e}label{font-weight:640;font-size:12px;color:#405747;display:block;margin-bottom:7px}[hidden]{display:none!important}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(28px,3vw,36px);letter-spacing:-.04em;margin-bottom:9px;font-weight:770}h2{font-size:19px;letter-spacing:-.03em;margin-bottom:10px}p{line-height:1.6}.muted,.subtext{color:var(--muted)}.small{font-size:12px}.smallLabel{font-size:12px;color:var(--muted);margin-top:18px}.eyebrow{font-size:11px;letter-spacing:.13em;text-transform:uppercase;font-weight:770;color:var(--g);margin-bottom:9px}.btn{display:inline-flex;justify-content:center;align-items:center;gap:9px;padding:11px 19px;border-radius:10px;font-weight:700;border:1px solid transparent;min-height:44px;transition:background .2s,transform .2s}.btn:hover:not(:disabled){transform:translateY(-1px)}.primary{background:var(--g);color:white}.primary:hover{background:#0b4529}.secondary{background:#edf3ee;color:#1e5b37}.outline{border-color:#c2d4c7;background:white;color:var(--g)}.wide{width:100%}.errorLine{color:#b42318;background:#fff0ed;padding:12px;border-radius:10px;margin-top:14px;font-size:13px}.notice{border-radius:11px;padding:14px 17px;margin-bottom:20px;background:#e8f4ec;color:#18572f;font-weight:650;border:1px solid #b5ddc2}.notice.error{background:#fff1f1;color:#a62727;border-color:#f1cece}.warning{border:1px solid #e4c795;background:#fff8ec;color:#875b1a;padding:15px 17px;border-radius:12px;margin:0 0 18px}
/* Login */
.authShell{min-height:100dvh;display:flex;flex-direction:column;background:linear-gradient(115deg,#f3f7f4 0%,#eff5f1 54%,#f9fbf9 100%)}.authMain{flex:1;min-height:0;display:flex;width:100%;max-width:1180px;margin:0 auto;padding:clamp(10px,3vh,40px) 16px;padding-top:max(clamp(10px,3vh,40px),env(safe-area-inset-top))}.authBrand img{display:block;width:180px;max-width:100%;height:clamp(48px,10vh,90px);object-fit:contain;margin:0 auto clamp(8px,2vh,20px)}.authBrand h1{font-size:clamp(22px,min(3.2vw,4.6vh),36px);line-height:1.13;letter-spacing:-.05em;margin-bottom:clamp(6px,1.6vh,16px)}.authBrand em{font-style:normal;color:var(--g)}.authCard{margin:auto;width:min(440px,100%);background:white;border:1px solid #e4ebe5;border-radius:20px;box-shadow:0 22px 75px #294e3220;padding:28px 34px 29px}.authSwitch{text-align:center;margin:22px 0 0}.authCard h2{font-size:23px}.authCard p{font-size:13px}.authCard label{margin-top:17px}.authCard .btn{margin-top:22px}.authFoot{color:#7b8980;padding-top:17px;border-top:1px solid var(--line);margin:25px 0 0;text-align:center;font-size:11px!important}
/* App layout */
.workShell{min-height:100vh}.topbar{height:76px;background:linear-gradient(120deg,#145a37,#0c4229);color:white;display:flex;justify-content:space-between;align-items:center;padding:0 34px;position:sticky;top:0;z-index:30;box-shadow:0 2px 12px #153f252b}.headBrand{display:flex;gap:14px;align-items:center}.headBrand img{width:76px;height:42px;object-fit:contain}.headBrand strong{display:block;font-size:16px}.headBrand small,.headNames small{display:block;opacity:.78;font-size:11px;margin-top:3px}.headProfile{display:flex;align-items:center;gap:18px}.headNames{text-align:right}.headNames strong{font-size:13px}.rolePill{display:inline-block;padding:7px 12px;border-radius:30px;background:#ffffff1f;border:1px solid #ffffff30;font-weight:700;font-size:11px;letter-spacing:.03em}.iconButton{border:1px solid #ffffff35;border-radius:10px;background:#ffffff17;color:white;font-size:23px;height:41px;width:41px}.workspace{display:grid;grid-template-columns:235px minmax(0,1fr);max-width:1680px;min-height:calc(100vh - 76px);margin:auto}.sidebar{padding:25px 16px;background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:8px}.sidebar button{display:flex;gap:13px;align-items:center;width:100%;text-align:left;border:0;background:transparent;border-radius:11px;color:#5e6e63;font-weight:700;padding:13px 14px}.sidebar button span{font-size:20px;min-width:23px;text-align:center;font-weight:450}.sidebar button:hover{background:#f3f8f4;color:#185633}.sidebar button.active{background:#eaf3ed;color:#145a37}.sidebarFoot{font-size:10px;letter-spacing:.08em;margin-top:auto;padding:20px 12px;color:#9aa8a0}.content{padding:38px clamp(23px,4vw,68px) 60px;min-width:0}.page{max-width:1250px}.pagehead{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:25px}.subtext{font-size:14px;margin-bottom:0}.filters{display:flex;gap:15px;align-items:flex-end;margin-bottom:23px;flex-wrap:wrap}.filters label{min-width:185px;margin-bottom:0}.filters input,.filters select{margin-top:7px}.filters .statusPill{margin-left:auto}.statusPill{padding:9px 13px;color:#257344;background:#e7f4ea;border:1px solid #cce7d4;border-radius:30px;font-size:12px;font-weight:730}.statusPill.closed{color:#715326;background:#fff2d8;border-color:#efd8a8}.metricGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:17px;margin-bottom:24px}.metric{border:1px solid var(--line);background:white;border-radius:15px;padding:22px 20px;box-shadow:var(--shadow);min-width:0}.metric strong{display:block;letter-spacing:-.05em;font-size:clamp(23px,2.7vw,33px);margin:15px 0 5px;font-weight:780;white-space:nowrap}.metricLabel{color:#56705e;font-weight:700;font-size:12px}.metric span{font-size:11px;color:#87978a}.twoCols{display:grid;grid-template-columns:1.5fr 1fr;gap:20px}.panel{background:white;border:1px solid var(--line);border-radius:15px;padding:24px;box-shadow:var(--shadow);margin-bottom:22px;min-width:0}.panelHead{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:15px}.panelHead h2{margin-bottom:0}.linkButton{border:0;background:transparent;color:var(--g);font-weight:760}.stack{display:flex;flex-direction:column;gap:2px}.smallEntry{display:flex;align-items:center;gap:14px;border-top:1px solid #eef1ed;padding:14px 0}.smallEntry:first-child{border-top:0}.entryIcon{height:39px;width:39px;flex-shrink:0;border-radius:11px;background:#e7f2e9;color:#1e663b;display:grid;place-items:center;font-size:19px}.entryMain{flex:1;min-width:0}.entryMain strong,.entryMain small{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.entryMain strong{font-size:13px}.entryMain small{color:var(--muted);margin-top:4px;font-size:11px}.entryValue{font-weight:760;color:#1a5836;font-size:13px}.statusBody{padding:14px;background:#f3f8f4;border-radius:10px;color:#255d39;line-height:1.65}.muted.small{overflow-wrap:anywhere}
/* Forms */
.formPanel{max-width:900px}.formGrid{display:grid;grid-template-columns:1fr 1fr;gap:22px 24px}.field{min-width:0}.full{grid-column:1/-1}fieldset{border:1px solid #e1e9e1;padding:14px 17px;border-radius:10px;margin:0}fieldset legend{font-size:12px;font-weight:750;color:#48614e;padding:0 6px}.checks{display:flex;gap:25px;flex-wrap:wrap}.checks label{display:flex;align-items:center;gap:8px;margin:0;font-weight:560}.checks input{width:17px;height:17px;min-height:auto}.formButtons{display:flex;gap:11px;flex-wrap:wrap;margin-top:24px}.pendingFeature{color:#86641a;background:#fff9e9;border:1px solid #f0e6ce;padding:12px 14px;border-radius:9px;margin-top:22px;font-size:12px}.entryList{overflow:auto}.entryLine{display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid var(--line);padding:17px 0}.entryLine:last-child{border:0}.entryLine strong{font-size:14px}.entryLine .entryDetails{color:var(--muted);font-size:12px;margin-top:6px;line-height:1.5}.entryLine .actions{display:flex;gap:6px}.miniButton{padding:7px 9px;border:1px solid #cdded0;border-radius:8px;background:#f8fbf8;color:#1d5f3a;font-weight:680}.miniButton.delete{color:#b13d33;border-color:#f3d4d0}.empty{color:#7a8b7e;padding:30px 14px;text-align:center}.reopenBox{border-top:1px solid var(--line);margin-top:24px;padding-top:22px}.reopenBox .btn{margin-top:12px}.adminCols{grid-template-columns:1.05fr .95fr}.formStack{display:grid;gap:15px}.formStack label{margin-bottom:6px}.formStack .btn{margin-top:8px}.userList{margin-top:16px}.userRow{padding:16px 0;border-bottom:1px solid var(--line)}.userRow:last-child{border:0}.userRowHead{display:flex;align-items:center;justify-content:space-between;gap:10px}.userRow small{display:block;color:var(--muted);margin:6px 0 10px}.tinyStatus{font-size:10px;padding:5px 9px;border-radius:20px;background:#edf7ee;color:#297547;font-weight:800}.tinyStatus.pending{background:#fff6e4;color:#a77922}.tinyStatus.blocked{background:#fff1f1;color:#bc4b4b}.userActions{display:flex;gap:7px;flex-wrap:wrap}.activationResult{margin-top:24px;border:1px solid #badaba;padding:18px;border-radius:12px;background:#f1f9f1}.activationResult strong{display:block;color:var(--g)}.activationResult code{display:block;background:white;font-size:15px;letter-spacing:.08em;word-break:break-all;padding:10px;border-radius:8px;margin:12px 0;border:1px dashed #b0cdb4}.activationResult p{font-size:12px}.inlineForm{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap}.inlineForm input{flex:1;min-width:220px}.profileTable{display:grid;grid-template-columns:170px 1fr;gap:16px;max-width:650px}.profileTable dt{color:#849187}.profileTable dd{margin:0;font-weight:730}.mobileNav{display:none}
@media(max-width:1180px){.metricGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.twoCols{grid-template-columns:1fr}.adminCols{grid-template-columns:1fr}}
@media(max-width:780px){.authMain{padding:14px 12px;padding-top:max(14px,env(safe-area-inset-top))}.authBrand{text-align:center}.authBrand img{width:150px;height:clamp(44px,9vh,75px);margin-bottom:10px}.authBrand h1{font-size:min(28px,4.6vh);margin-bottom:8px}.authCard{max-width:440px;margin:auto;width:100%}.topbar{height:63px;padding:0 14px}.headBrand img{width:51px;height:36px}.headBrand strong{font-size:14px}.headBrand small{display:none}.headNames{display:none}.headProfile{gap:8px}.rolePill{font-size:10px}.workspace{display:block;min-height:calc(100vh - 63px)}.sidebar{display:none}.content{padding:27px 17px 125px}.mobileNav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-around;align-items:center;height:calc(68px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:#fff;box-shadow:0 -3px 20px #12392016;border-top:1px solid var(--line);z-index:40}.mobileNav button{display:flex;flex-direction:column;align-items:center;gap:4px;background:none;border:0;color:#748076;font-size:22px;min-width:53px}.mobileNav button.active{color:#145a37}.mobileNav button small{font-weight:680;font-size:10px}.pagehead h1{font-size:27px}.pagehead>.btn{padding:10px 12px;font-size:12px}.filters{align-items:end}.filters label{min-width:125px;flex:1}.filters .statusPill{margin-left:0}.formGrid{gap:16px}.panel{padding:18px}.metricGrid{gap:10px}.metric{padding:16px 14px}.metric strong{font-size:25px}.metricLabel{font-size:11px}.metric span{font-size:10px}}
@media(max-width:420px){.authCard{padding:23px 18px}.authMain{padding:10px 8px;padding-top:max(10px,env(safe-area-inset-top))}.authBrand h1{font-size:min(26px,4.4vh)}.formGrid{grid-template-columns:1fr}.field,.timeField{grid-column:1/-1}.metricGrid{grid-template-columns:1fr 1fr}.metric strong{font-size:21px}.entryLine{flex-wrap:wrap}.entryLine .actions{margin-left:auto}}

.staffDialog{width:min(92vw,510px);max-height:88dvh;overflow:auto;border:1px solid #d2e5d8;border-radius:18px;padding:27px 28px;box-shadow:0 20px 80px #07391f38}.staffDialog::backdrop{background:#102b20a6}.staffDialog .field label{margin:0 0 6px}.staffDialog .formButtons{margin-top:12px}
/* v0.3: Fast staff search and confidential one-time QR activation. */
.staffSearchTools{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(145px,.9fr);gap:12px;align-items:end;margin:13px 0 0}.staffSearchTools .field label{margin-bottom:7px}.searchInput{position:relative}.searchInput span{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:#548065;font-size:22px;pointer-events:none}.searchInput input{padding-left:39px;padding-right:34px}.searchInput .clearSearch{position:absolute;right:5px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:#5c7463;font-size:24px;width:31px;height:31px;border-radius:7px}.searchInput .clearSearch:hover{background:#edf5ef}.resultCount{margin:13px 0 0;color:#6b8071;font-size:12px;font-weight:650}.formHint{color:#65786a;font-size:11px!important;margin:5px 0 0}.activationGrid{display:grid;grid-template-columns:215px minmax(0,1fr);gap:18px;align-items:start;margin:14px 0}.qrPanel{display:flex;flex-direction:column;align-items:center;background:white;padding:10px 8px;border-radius:12px;border:1px solid #d7e7da}.qrPanel img{max-width:100%;height:auto;aspect-ratio:1;image-rendering:pixelated;background:#fff}.qrPanel span{font-size:11px;color:#5f7967;font-weight:700;margin-top:7px}.activationDetails{min-width:0}.activationDetails input{font-size:12px;background:#fff;overflow:hidden;text-overflow:ellipsis}.activationDetails code{font-size:12px;letter-spacing:.04em;white-space:normal;overflow-wrap:anywhere;padding:8px;margin:5px 0 0}.activationDetails .inlineLabel{display:inline;color:#295a36;font-size:12px}.activationActions{display:flex;flex-wrap:wrap;gap:9px}.activationActions .btn{font-size:12px;padding:10px 12px}.activationWarning{margin:14px 0 0;color:#6a6343;font-size:12px!important;line-height:1.5}.activationResult[hidden]{display:none}
@media(max-width:680px){.staffSearchTools{grid-template-columns:1fr}.activationGrid{grid-template-columns:1fr}.qrPanel{max-width:250px;margin:auto}.activationDetails input{max-width:100%}.activationActions .btn{flex:1 1 140px}}

.archiveRow{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:12px 0;border-bottom:1px solid #e3e9e5}.archiveRow:last-child{border-bottom:0}.archiveRow strong{min-width:150px}.archiveRow .muted{flex:1}
.archiveCrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:-4px 0 14px;font-weight:700;color:var(--muted)}.archiveCrumbs:empty{display:none}
.archiveCrumbs .linkButton{font-weight:700;padding:0}.archiveCrumbs .current{color:var(--ink)}
.archiveTiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.archiveTile{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:16px 16px 14px;border:1px solid #e1eae3;border-radius:16px;background:linear-gradient(180deg,#fff,#f5f9f6);color:var(--ink);text-align:left;box-shadow:inset 0 1px 0 #fff,0 1px 2px #153f2514,0 4px 12px #153f250d;transition:transform .15s,box-shadow .2s}
.archiveTile strong{font-size:18px}.archiveTile small{color:var(--muted);font-weight:600}
.archiveTile:hover:not(:disabled){transform:translateY(-1px);box-shadow:inset 0 1px 0 #fff,0 2px 4px #153f251a,0 8px 18px #153f2516}
.archiveTile:disabled{opacity:.5;cursor:default;box-shadow:none}
.archiveRow .actions{display:flex;gap:8px;flex-wrap:wrap}.archiveRow .btn{margin:0}
.scanBox{margin:6px 0 10px}#scanVideo{display:block;width:100%;max-width:340px;border-radius:12px;margin:10px 0;background:#000}

.receiptBox{border:1px solid #cfdad3;border-radius:12px;padding:14px;background:#f7faf8}
.receiptActions{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0}
.receiptStatus{font-size:14px;color:#33493d;min-height:1.2em}.receiptStatus.error{color:#9a1c1c;font-weight:600}
#receiptPreview{display:block;max-width:260px;max-height:340px;width:auto;height:auto;border:1px solid #cfdad3;border-radius:8px;margin:8px 0;background:#fff}
a.btn{display:inline-flex;align-items:center;text-decoration:none}
.receiptBadge{display:inline-block;margin-left:8px;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:600;text-decoration:none;background:#e3f1e8;color:#145a37}
.receiptBadge.missing{background:#fde7e7;color:#9a1c1c}
.receiptActions .btn{margin-top:0}
/* Superadmin: Filialübersicht */
.overviewPanel{margin-bottom:24px}
.overviewSummary{padding:12px 14px;background:#f3f8f4;border-radius:10px;color:#255d39;font-weight:650;margin-bottom:12px}
.overviewPanel .warning .linkButton{display:inline;padding:0;font:inherit;text-decoration:underline}
.branchBlock{border:1px solid var(--line);border-radius:12px;background:var(--soft)}
.branchBlock.overdue{border-color:#f0c9c9}
.branchHead{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:13px 15px;cursor:pointer}
.branchHead strong{min-width:140px}
.branchHead .muted{flex:1;text-align:right}
.branchBlock[open] .branchHead{border-bottom:1px solid var(--line)}
.closeBadge{font-size:11px;padding:5px 10px;border-radius:20px;font-weight:800;white-space:nowrap}
.closeBadge.closed{background:#e3f1e8;color:#145a37}
.closeBadge.running{background:#eef2f7;color:#47607a}
.closeBadge.due{background:#fff2d8;color:#875b1a}
.closeBadge.overdue{background:#fde7e7;color:#9a1c1c}
.closeBadge.submitted{background:#e4eefc;color:#1d4f91}
.closeBadge.review{background:#fff2d8;color:#875b1a}
.returnedNote{background:#fff2d8;color:#6b4712;border-radius:10px;padding:8px 12px}
.driverLine{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:11px 15px;border-bottom:1px solid var(--line);background:white}
.driverLine:last-child{border-bottom:0;border-radius:0 0 12px 12px}
.driverLine small{display:block;color:var(--muted);margin-top:4px}
.driverLine .actions{display:flex;gap:8px}
@media(max-width:640px){.branchHead .muted{flex-basis:100%;text-align:left}}
.totalPill{margin-left:auto;font-size:14px;padding:10px 16px}
.filters .statusPill[hidden]{display:none}
.branchHead .branchExport{white-space:nowrap}
.branchList{margin-bottom:18px}
.branchList .actions{display:flex;gap:8px}
#superPanel h3{margin:6px 0 10px;font-size:15px}
.dangerZone{margin-top:22px;padding-top:16px;border-top:1px solid #f3d4d0}
.dangerButton{background:#fff;color:var(--danger);border-color:#efc2bd}
.dangerButton:hover{background:#fdf1f0}

/* PWA-Installationshinweis */
.installBanner{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:80;max-width:520px;margin:0 auto;display:flex;align-items:center;gap:12px;background:#fff;border:1px solid #cfe0d3;border-radius:14px;box-shadow:0 10px 40px #0b3f2638;padding:12px 12px 12px 16px}
.installText{flex:1;min-width:0}.installText strong{display:block;font-size:13px;color:var(--g)}.installText span{display:block;font-size:12px;color:var(--muted);line-height:1.45;margin-top:3px}
.installBanner .btn{min-height:40px;padding:8px 14px;white-space:nowrap}.installClose{border:0;background:transparent;font-size:26px;line-height:1;color:#7b8980;width:36px;height:36px;border-radius:8px}
.checkInline{display:flex;align-items:center;gap:9px;margin:12px 0 4px;font-weight:600}.checkInline input{width:18px;height:18px;min-height:auto}

/* Fingerabdruck / Passkeys */
.orLine{display:flex;align-items:center;gap:12px;color:#7b8980;font-size:12px;margin:22px 0 4px}.orLine:before,.orLine:after{content:"";flex:1;border-top:1px solid var(--line)}
.passkeyBox .btn{margin-top:10px}.passkeyBox .formHint{text-align:center;margin-top:8px}
.passkeyPanel{margin-top:30px;border-top:1px solid var(--line);padding-top:22px;max-width:650px}.passkeyPanel h2{font-size:17px}.passkeyRow{display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid var(--line);padding:12px 0}.passkeyRow small{display:block;color:var(--muted);margin-top:4px}.passkeyPanel .btn{margin-top:14px}
.filters .infoPill{margin-left:0;color:#2f4a63;background:#eef2f7;border-color:#d5dee8}
.filters .infoPill.done{color:#257344;background:#e7f4ea;border-color:#cce7d4}
.noClaims{background:#fafcfa}
.noClaims small{margin-top:2px}
.closeBadge.inline{margin-left:8px;font-size:10px;padding:3px 8px}
.cropDialog{width:min(96vw,780px);max-width:96vw;max-height:96vh;border:0;border-radius:14px;padding:14px 16px;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.cropDialog::backdrop{background:rgba(10,20,15,.6)}
.cropDialog h2{margin:0 0 4px;font-size:18px}
.cropDialog .error{color:#9a1c1c}
.cropStage{display:flex;justify-content:center;background:#16201b;border-radius:10px;padding:6px;margin:10px 0}
#cropCanvas{display:block;touch-action:none;cursor:crosshair}
.cropDialog .formButtons{margin-top:6px}
button.receiptBadge{border:0;font-family:inherit;cursor:pointer}
/* Zwei-Faktor-Anmeldung */
.mfaSetup{margin:6px 0 14px}
.mfaSetup .qrPanel{max-width:230px;margin:10px auto}
.mfaSteps{padding-left:20px;margin:0 0 8px;font-size:14px}
.mfaSteps li{margin-bottom:4px}
.mfaSecret{display:inline-block;margin-top:4px;font-size:14px;letter-spacing:.5px;word-break:break-all;background:#f1f6f2;padding:4px 7px;border-radius:6px}
#mfaForm .btn.secondary{margin-top:8px}
.recoveryBox h2{margin-top:0}
.recoveryList{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:14px 0}
.recoveryList code{font-size:15px;text-align:center;background:#f1f6f2;border:1px dashed #b9d0bf;border-radius:8px;padding:8px 4px;letter-spacing:1px}
.recoveryBox .btn{margin-top:8px}
.mfaPanel .mfaSetup{max-width:420px}
/* iPhone: Kopfzeilen nicht unter Statusleiste/Dynamic Island bzw. abgerundete Ecken schieben.
   Der Abstand kommt zur normalen Höhe hinzu (content-box), auf Geräten ohne Aussparung ist er 0. */
.topbar{box-sizing:content-box;padding-top:env(safe-area-inset-top)}
/* Installationshinweis im Portal über der unteren Menüleiste (Handy), damit Start/Neu/Abschluss erreichbar bleiben */
@media(max-width:1180px){body:has(#workShell:not([hidden])) .installBanner{bottom:calc(80px + env(safe-area-inset-bottom))}}
/* Anmeldeseite: Hinweis oben im normalen Seitenfluss – verdeckt so nie die Anmelde-/Aktivieren-Knöpfe */
body:has(#authShell:not([hidden])) .installBanner{position:static;margin:calc(10px + env(safe-area-inset-top)) 12px 0;max-width:none}
/* Anmeldeseite füllt genau das Browserfenster (abzüglich Installationshinweis); app.js verkleinert das Anmeldefenster bei Bedarf per zoom */
body:has(#authShell:not([hidden])){display:flex;flex-direction:column;height:100dvh}body:has(#authShell:not([hidden])) .authShell{flex:1;min-height:0}
.fpDialog{max-width:440px}.fpDialog .errorLine:empty{display:none}.reviewLead{font-weight:700;margin:14px 0 10px}
/* Zurück-Link über der Seitenüberschrift (nur PC; am Handy gibt es die Zurück-Taste bzw. Wischgeste) */
.backLink{display:inline-flex;align-items:center;gap:6px;margin:-16px 0 12px;padding:4px 10px 4px 6px;border:0;border-radius:8px;background:transparent;color:var(--g);font-weight:700;font-size:13px;cursor:pointer}
.backLink:hover{background:#145a3710}.backLink[hidden]{display:none}
@media(max-width:780px){.backLink{display:none!important}}
/* Smartphone: Profilwerte nicht über den Rand, Knöpfe der Personenzeilen im Raster statt abgeschnitten */
.profileTable{grid-template-columns:170px minmax(0,1fr)}.profileTable dd{min-width:0;overflow-wrap:anywhere}
@media(max-width:560px){.profileTable{grid-template-columns:minmax(0,1fr);gap:2px}.profileTable dd{margin-bottom:12px}}
@media(max-width:780px){.driverLine>div:first-child{min-width:0;flex:1 1 100%}.driverLine .actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:8px;width:100%}.driverLine .actions .miniButton{white-space:nowrap;text-align:center;padding:9px 8px}}.reviewChecks{gap:12px 22px;margin-bottom:12px}.reviewChecks label{font-size:14px}
/* Startprüfung (compat.js): Hinweis bei zu altem Gerät bzw. ausgeschaltetem JavaScript */
.compatHinweis{background:#fde7e7;color:#7a1a1a;border:1px solid #f0c9c9;border-left:5px solid #b3261e;border-radius:10px;padding:12px 14px;margin:0 0 18px;font-size:15px;line-height:1.4;font-weight:600}
/* „In der App öffnen“ nur auf Handys/Tablets sinnvoll */
@media (hover:hover) and (pointer:fine){.mfaSetup a[href^="otpauth"]{display:none}}
/* Beleg ansehen: passt in den Dialog; Antippen zeigt ihn in voller Größe (scrollbar) */
.receiptView{max-height:72vh;overflow:auto;background:#fff;border:1px solid #d6dfd9}
.receiptView img{display:block;max-width:100%;max-height:70vh;object-fit:contain;cursor:zoom-in}
.receiptView.zoom{display:block}
.receiptView.zoom img{max-width:none;max-height:none;width:200%;cursor:zoom-out}
/* Anmeldeseite mit Showroom-Foto. Das Foto liegt immer als CSS-Hintergrund dahinter;
   login-fx.js blendet darüber dieselbe Szene als 3D-Fenster ein (Klasse fxOn, sobald WebGL und Foto bereit sind). */
.authShell{position:relative;isolation:isolate;background:#0d1512}.authShell>.authMain{position:relative;z-index:1}
.authShell::before{content:"";position:fixed;inset:0;z-index:0;background:linear-gradient(#0a141040,#0a141040),url(/assets/login-empfang.webp) 32% 50%/cover no-repeat}
.fxHost{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity .6s ease}.fxCanvas{display:block;width:100%;height:100%}
.authShell.fxOn .fxHost{opacity:1}

/* Ein einziges dunkles Glasfenster links: Logo, Überschrift und darunter die Anmeldefelder */
.authShell .authCard{background:#0d1512b8;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid #ffffff1a;border-radius:20px;padding:26px 30px;box-shadow:0 20px 60px #00000073;color:#e3ede7}
.authShell .authBrand h1{color:#f1f6f3;text-shadow:0 2px 18px #0009}.authShell .authBrand em{color:#7fd1a3}
.authShell .authCard h2{color:#f1f6f3}.authShell .authCard label{color:#c4d3ca}.authShell .authCard .muted,.authShell .authCard p{color:#c4d3ca}.authShell .authCard .formHint{color:#a9bcb0}
.authShell .authCard .outline{background:#ffffff14;border-color:#ffffff40;color:#e3f0e8}.authShell .authCard .secondary{background:#ffffff1f;color:#e3f0e8}
.authShell .authCard .linkButton{color:#7fd1a3;font-size:13px}.authShell .orLine{color:#a9bcb0}.authShell .orLine:before,.authShell .orLine:after{border-top-color:#ffffff26}
.authShell .authCard .errorLine{color:#b42318}.authShell .authCard .compatHinweis{color:#7a1a1a}.authShell .mfaSecret,.authShell .recoveryList code{color:var(--ink)}
.authShell .authCard .authFoot{color:#9fb2a6;border-top-color:#ffffff1f}
body:has(#authShell:not([hidden])) .installBanner{position:relative;z-index:3}
.fxToggle{position:fixed;z-index:2;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));display:flex;gap:8px;align-items:center;background:#0d1512bf;color:#dfe8e3;border:1px solid #ffffff26;border-radius:999px;padding:8px 14px;font-size:13px;cursor:pointer}
.fxToggle .dot{width:8px;height:8px;border-radius:50%;background:#e0b84f}
.fxHint{position:fixed;z-index:2;left:16px;right:16px;bottom:calc(64px + env(safe-area-inset-bottom));margin:auto;max-width:420px;text-align:center;color:#f3d9a4;font-size:13px}
@media(max-width:780px){.authShell .authCard{padding:22px 18px}}
/* Niedrige Fenster (Laptop mit Skalierung, Handy quer): alles enger, damit das Anmeldefenster ohne Scrollen passt */
@media(max-height:640px){.authShell .authCard{padding:16px 24px}.authCard label{margin-top:10px}.authCard .btn{margin-top:14px}.authBrand img{margin-bottom:6px}.authSwitch{margin-top:10px}.authShell .authCard .authFoot{display:none}}
@media(prefers-reduced-motion:reduce){.fxHost,.fxToggle,.fxHint{display:none!important}}
/* Offene Aufgaben auf der Startseite (gleiche Zahl wie am App-Symbol) */
.todoBox{background:#fff8e8;border:1px solid #f0d9a6;border-radius:14px;padding:14px 18px;margin:0 0 20px;color:#5a4214}
.todoBox strong{display:block;font-size:14px;margin-bottom:4px}.todoBox ul{margin:0;padding-left:18px}.todoBox li{margin:4px 0}
.todoBox .linkButton{text-align:left;font-size:14px;padding:2px 0;color:#145a37}.todoBox .linkButton.overdue{color:var(--danger);font-weight:700}
.reminderPanel .btn{margin-top:10px}
/* Smartphone: Anmeldefenster kleiner und kompakter */
@media(max-width:600px){.authCard{max-width:340px}.authShell .authCard{padding:18px 18px 16px;border-radius:16px}.authBrand img{width:115px;height:clamp(34px,6.5vh,52px);margin-bottom:6px}.authBrand h1{font-size:min(21px,3.8vh);margin-bottom:2px}.authCard label{margin-top:11px;margin-bottom:5px;font-size:11.5px}.authCard input{min-height:40px;padding:9px 12px}.authCard .btn{margin-top:15px;min-height:42px}.authCard .orLine{margin:14px 0 2px}.authSwitch{margin-top:12px}.authShell .authCard .linkButton{font-size:12.5px}.authShell .authCard .authFoot{margin-top:14px;padding-top:10px}.authCard h2{font-size:20px}}
/* Seitenleiste: helles Milchglas passend zum übrigen Stil; mit Maus eingeklappt (nur Symbole), beim Darüberfahren ausgeklappt */
@media(min-width:781px){
.workspace{grid-template-columns:260px minmax(0,1fr)}
.sidebar{position:sticky;top:88px;align-self:start;z-index:25;box-sizing:border-box;width:236px;min-height:calc(100vh - 100px);margin:12px 0 12px 12px;padding:16px 10px;gap:6px;overflow:hidden;isolation:isolate;border:1px solid #ffffffb3;border-radius:20px;background:#ffffffc7;backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);box-shadow:0 12px 40px #153f2518,inset 0 1px 0 #fff;transition:width .22s ease,box-shadow .22s ease}
.sidebar button{color:#5e6e63;padding:12px 11px;white-space:nowrap;gap:15px}
.sidebar button b{font-weight:inherit;transition:opacity .18s ease}
.sidebar button:hover{background:#f3f8f4cc;color:#185633}
.sidebar button.active{background:#eaf3ed;color:#145a37;box-shadow:inset 0 0 0 1px #145a3714}
.sidebarFoot{color:#9aa8a0;white-space:nowrap;padding:16px 12px 4px}
.sidebarFoot b{font-weight:inherit;transition:opacity .18s ease}
}
@media(min-width:781px) and (hover:hover) and (pointer:fine){
.workspace{grid-template-columns:92px minmax(0,1fr)}
.sidebar{width:68px}
.sidebar:hover,.sidebar:focus-within{width:236px;box-shadow:0 20px 60px #153f2526,inset 0 1px 0 #fff}
.sidebar:not(:hover):not(:focus-within) button b,.sidebar:not(:hover):not(:focus-within) .sidebarFoot b{opacity:0}
}
/* Etwas Tiefe statt flach: Licht von oben, gestaffelte weiche Schatten, Knöpfe heben sich ab und geben beim Drücken nach */
:root{--shadow:0 1px 2px #153f250f,0 4px 10px #153f250d,0 14px 34px #153f2512;--shadowHi:0 2px 4px #153f2514,0 10px 22px #153f2514,0 26px 50px #153f251c}
.topbar{background:linear-gradient(180deg,#ffffff17,#fff0 55%),linear-gradient(120deg,#17643d,#0c4229);box-shadow:inset 0 -1px 0 #0000002e,0 6px 22px #0b3f2638}
.panel,.metric{background:linear-gradient(180deg,#fff 0%,#fbfdfc 100%);border-color:#e1eae3;box-shadow:var(--shadow),inset 0 1px 0 #fff}
.metric{transition:transform .2s ease,box-shadow .2s ease}
.metric:hover{transform:translateY(-2px);box-shadow:var(--shadowHi),inset 0 1px 0 #fff}
.todoBox{box-shadow:var(--shadow),inset 0 1px 0 #fffc}
.btn{transition:background .2s,transform .15s ease,box-shadow .2s ease}
.btn:active{transform:translateY(1px)}
.primary{background:linear-gradient(180deg,#1f7149,#125032);box-shadow:inset 0 1px 0 #ffffff30,inset 0 -1px 0 #00000026,0 1px 2px #0b3f2633,0 4px 12px #145a3730;text-shadow:0 1px 0 #00000026}
.primary:hover{background:linear-gradient(180deg,#23794f,#145a37);box-shadow:inset 0 1px 0 #ffffff38,inset 0 -1px 0 #00000026,0 2px 4px #0b3f2633,0 8px 20px #145a3740;transform:translateY(-1px)}
.primary:active{box-shadow:inset 0 2px 4px #00000033;transform:translateY(1px)}
.outline,.secondary,.dangerButton{box-shadow:inset 0 1px 0 #fff,0 1px 2px #153f2514,0 2px 6px #153f250d}
.outline{background:linear-gradient(180deg,#fff,#f4f8f5)}
.outline:hover,.secondary:hover,.dangerButton:hover{box-shadow:inset 0 1px 0 #fff,0 2px 4px #153f251a,0 6px 14px #153f2514;transform:translateY(-1px)}
input,select,textarea{box-shadow:inset 0 1px 2px #153f2512}
input:focus,select:focus,textarea:focus{box-shadow:inset 0 1px 2px #153f2512,0 0 0 3px #2f86551e}
.statusPill{box-shadow:inset 0 1px 0 #ffffffb3,0 1px 2px #153f2512}
.iconButton{box-shadow:inset 0 1px 0 #ffffff26,0 2px 6px #00000026}
.sidebar button.active{box-shadow:inset 0 1px 0 #fff,0 1px 3px #153f251f,0 0 0 1px #145a3714}
.mobileNav{background:linear-gradient(180deg,#fff,#f7faf8);box-shadow:inset 0 1px 0 #fff,0 -6px 24px #1239201c}
.authShell .authCard .outline,.authShell .authCard .secondary{box-shadow:none}
@media(prefers-reduced-motion:reduce){.btn,.metric{transition:none}.btn:hover,.btn:active,.metric:hover{transform:none}}
/* Kacheln wie das Anmeldefenster, aber in Weiß: leicht durchsichtiges Milchglas */
.panel,.metric,.installBanner{background:linear-gradient(180deg,#ffffffc7,#ffffffa8);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);border:1px solid #ffffffcc;border-radius:20px;box-shadow:0 1px 2px #153f2510,0 12px 32px #153f251a,0 24px 60px #153f2512,inset 0 1px 0 #fff}
.metric:hover{box-shadow:0 2px 4px #153f2514,0 16px 40px #153f2522,0 30px 70px #153f2516,inset 0 1px 0 #fff}
.branchBlock,.receiptBox{background:#ffffff8c;border-color:#ffffffd9;box-shadow:inset 0 1px 0 #fff}
.driverLine{background:transparent}
.statusBody,.overviewSummary{background:#eaf4edb3;box-shadow:inset 0 1px 0 #ffffffb3}
.noClaims{background:#ffffff66}