:root{
  --color-charcoal:#16232b;
  --color-charcoal-2:#20333e;
  --color-charcoal-3:#2c424e;
  --color-safety:#f5c518;
  --color-safety-strong:#ddb000;
  --color-paper:#fffdf8;
  --color-paper-warm:#f4f0e8;
  --color-paper-deep:#ebe4d8;
  --color-ink:#172126;
  --color-muted:#687178;
  --color-line:#d8d2c7;
  --color-line-strong:#b8afa1;
  --color-danger:#a92c28;
  --color-danger-soft:#fff0ed;
  --color-info:#285c75;
  --color-success:#27643b;
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:24px;
  --space-6:32px;
  --radius-control:8px;
  --radius-panel:8px;
  --shadow-panel:0 1px 0 rgba(22,35,43,.08),0 10px 30px rgba(22,35,43,.07);
  --shadow-raised:0 14px 44px rgba(8,20,27,.22);
  --focus-ring:0 0 0 3px rgba(245,197,24,.55),0 0 0 5px var(--color-charcoal);
  --dunkel:var(--color-charcoal);
  --gelb:var(--color-safety);
  --linie:var(--color-line);
  --grau:var(--color-muted);
  --bg:var(--color-paper-warm);
  --weiss:var(--color-paper);
  --rot:var(--color-danger);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{min-height:100%;background:var(--color-charcoal);-webkit-text-size-adjust:100%;overscroll-behavior:none}
body{margin:0;min-height:100svh;min-height:100dvh;background:
  linear-gradient(180deg,var(--color-charcoal) 0 132px,var(--color-paper-warm) 132px 100%);
  color:var(--color-ink);font:15px/1.5 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  padding-bottom:env(safe-area-inset-bottom,0px);overscroll-behavior:none}
#app,.app-shell{min-height:100svh;min-height:100dvh}
.app-shell{position:relative}
button,input,select,textarea{font:inherit;color:inherit}
input,select,textarea{font-size:16px}
button,a,[role="button"],input,select,textarea{touch-action:manipulation}
button,[role="button"],.tab,.chip{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
button{cursor:pointer}
button:disabled{cursor:not-allowed}
svg{display:block;flex:none}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.wrap{width:min(100%,920px);margin:0 auto;padding:var(--space-4) max(var(--space-4),env(safe-area-inset-left,0px)) calc(104px + env(safe-area-inset-bottom,0px)) max(var(--space-4),env(safe-area-inset-right,0px))}
.screen-title{margin:0 0 var(--space-4);font-size:clamp(24px,5vw,34px);line-height:1.08;letter-spacing:-.025em;color:var(--color-charcoal)}

/* Instrumentenkopf */
header.top{position:sticky;top:0;z-index:20;color:#fff;background:rgba(22,35,43,.97);padding-top:env(safe-area-inset-top,0px);box-shadow:0 8px 28px rgba(7,18,24,.22);backdrop-filter:blur(18px) saturate(120%)}
.topbar{width:min(100%,920px);min-height:64px;margin:0 auto;display:flex;align-items:center;gap:var(--space-3);padding:0 max(var(--space-4),env(safe-area-inset-left,0px)) 0 max(var(--space-4),env(safe-area-inset-right,0px))}
.marke{display:flex;align-items:center;gap:10px;color:#fff;font-size:18px;font-weight:760;letter-spacing:-.025em;min-width:0}
.marke i{display:block;width:32px;height:32px;border:2px solid var(--color-safety);border-radius:7px;background:
  linear-gradient(90deg,transparent 0 23%,var(--color-charcoal) 23% 29%,transparent 29% 47%,var(--color-charcoal) 47% 53%,transparent 53% 71%,var(--color-charcoal) 71% 77%,transparent 77%),
  var(--color-safety);box-shadow:inset 0 0 0 3px rgba(255,255,255,.12)}
.zaehler{margin-left:auto;color:rgba(255,255,255,.58);font-size:12px;font-variant-numeric:tabular-nums}
.zurueck{min-height:44px;background:none;border:0;color:#fff;display:inline-flex;align-items:center;gap:var(--space-2);font-size:14px;font-weight:650;padding:0 var(--space-2) 0 0}
.zurueck .symbol{color:var(--color-safety)}
.zurueckleiste{position:fixed;top:calc(env(safe-area-inset-top,0px) + 10px);left:0;right:0;z-index:70;color:#fff;background:transparent;box-shadow:none;pointer-events:none}
.zurueckleiste>div{width:min(100%,920px);min-height:44px;margin:0 auto;display:flex;align-items:center;padding:0 max(var(--space-4),env(safe-area-inset-left,0px))}
.zurueckleiste .zurueck{pointer-events:auto;min-height:44px;padding:0 15px 0 11px;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:rgba(22,35,43,.92);box-shadow:0 7px 20px rgba(3,11,15,.28);backdrop-filter:blur(14px) saturate(130%);transition:transform .1s ease,background .14s ease,border-color .14s ease}
.zurueckleiste .zurueck:active{transform:scale(.97);background:var(--color-charcoal-2);border-color:rgba(245,197,24,.62)}
.oeff-update{position:fixed;left:50%;bottom:calc(12px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:60;max-width:calc(100vw - 24px);display:flex;align-items:center;gap:10px;padding:6px 7px 6px 13px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(22,35,43,.94);color:#fff;box-shadow:0 9px 28px rgba(3,11,15,.32);backdrop-filter:blur(14px) saturate(130%)}
.oeff-update span{font-size:11.5px;color:rgba(255,255,255,.72);white-space:nowrap}
.oeff-update button{min-height:40px;padding:0 13px;border:1px solid var(--color-safety-strong);border-radius:999px;background:var(--color-safety);color:var(--color-charcoal);font-size:12px;font-weight:760;white-space:nowrap}
.oeff-update button:active{transform:scale(.97)}
.oeff-update button:disabled{opacity:.62;transform:none}
.userbar{margin-left:auto;display:flex;align-items:center;gap:var(--space-2);min-width:0}
.userbar span{color:rgba(255,255,255,.68);font-size:12px;max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.userbar button{min-height:40px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.22);color:#fff;border-radius:var(--radius-control);font-size:12px;padding:0 12px}
.userbar .speichern-kopf{background:#e7c35b;border-color:#e7c35b;color:#211f1a;font-weight:700;padding:0 9px}
.dokument-zeile{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;min-width:0}
.dokument-zeile>span{min-width:0;overflow-wrap:anywhere}
.dokument-zeile small{display:block;color:#6b7280;font-size:11px;margin-top:3px}
.ocr-position{border:1px solid #e6e1d5;border-radius:10px;padding:10px;margin:10px 0;min-width:0}
.ocr-position legend{font-weight:700;font-size:12px;padding:0 5px}
.ocr-position>small{display:block;color:#6b7280;font-size:11px;margin:0 0 8px;overflow-wrap:anywhere}
#material-ocr-status{font-size:12px;color:#514d43}
nav.tabs{width:min(100%,920px);margin:0 auto;display:flex;gap:var(--space-1);overflow-x:auto;scrollbar-width:none;padding:0 max(var(--space-3),env(safe-area-inset-left,0px))}
nav.tabs::-webkit-scrollbar{display:none}
nav.tabs button{position:relative;flex:1;min-width:max-content;min-height:48px;background:none;border:0;color:rgba(255,255,255,.62);padding:0 14px;font-size:13px;font-weight:680;white-space:nowrap}
nav.tabs button.an{color:var(--color-charcoal);background:var(--color-safety);border-radius:8px 8px 0 0}
nav.tabs button.an::after{content:"";position:absolute;left:12px;right:12px;bottom:4px;height:2px;background:var(--color-charcoal);border-radius:2px;opacity:.32}

/* Sektionen: Papierbögen statt identischer Standardkarten */
.karte{position:relative;background:var(--color-paper);border:0;border-radius:var(--radius-panel);margin:0 0 var(--space-4);box-shadow:inset 0 0 0 1px rgba(86,75,59,.13),var(--shadow-panel);overflow:clip}
.karte:nth-of-type(even){background:#fbf8f1}
.karte>h3{margin:0;padding:14px var(--space-4) 12px;border-bottom:1px solid rgba(86,75,59,.12);font-size:14px;line-height:1.25;font-weight:760;letter-spacing:.01em;display:flex;align-items:center;gap:var(--space-2);color:var(--color-charcoal)}
.karte>h3::before{content:"";width:4px;height:18px;border-radius:2px;background:var(--color-charcoal-3)}
.karte>h3 .rechts{margin-left:auto;display:flex;gap:var(--space-2);flex-wrap:wrap;justify-content:flex-end}
.karte--focus{box-shadow:inset 4px 0 0 var(--color-safety),var(--shadow-panel)}
.karte--quiet{box-shadow:inset 0 0 0 1px rgba(86,75,59,.12)}
.inhalt{padding:var(--space-4)}
.leer{text-align:center;color:var(--color-muted);font-size:13px;padding:var(--space-6) var(--space-3)}
.leer button{margin-top:var(--space-3)}

/* Formulare */
label.f{display:block;min-width:0}
label.f>span{display:block;font-size:12px;line-height:1.25;color:#586269;font-weight:680;margin-bottom:6px;letter-spacing:.01em}
input[type=text],input[type=date],input[type=email],input[type=password],select,textarea{
  width:100%;min-height:48px;padding:10px 12px;border:1px solid var(--color-line-strong);border-radius:var(--radius-control);background:#fffefa;font-size:16px;line-height:1.35;box-shadow:inset 0 1px 2px rgba(22,35,43,.05);transition:border-color .14s ease,box-shadow .14s ease,background .14s ease}
textarea{min-height:104px;resize:vertical}
input::placeholder,textarea::placeholder{color:#91979a;opacity:1}
input:hover,select:hover,textarea:hover{border-color:#8e938f}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--color-charcoal);background:#fff}
input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible,a:focus-visible,[role="button"]:focus-visible{outline:3px solid var(--color-safety);outline-offset:3px;box-shadow:0 0 0 1px var(--color-charcoal)}
.zahl{text-align:right;font-variant-numeric:tabular-nums}
.reihe{display:flex;gap:var(--space-2)}
.reihe>*{flex:1;min-width:0}
.g2,.signaturen{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}
.g5{display:grid;grid-template-columns:repeat(5,minmax(64px,1fr));gap:var(--space-2)}
.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-2);align-items:end}
.create-grid{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:var(--space-2);margin-bottom:var(--space-4)}
.report-type-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-2);margin-bottom:var(--space-4);padding:var(--space-1);border-radius:10px;background:var(--color-paper-deep)}
.report-type-grid .btn.dark{box-shadow:0 4px 14px rgba(22,35,43,.2)}
.mini{min-height:40px;padding:7px 9px;font-size:16px}
.fehlt{border-color:#cf5c50!important;background:#fff7f5}

/* Buttons */
.btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:9px 14px;border-radius:var(--radius-control);border:1px solid var(--color-line-strong);background:#fffefa;color:var(--color-charcoal);font-size:14px;font-weight:720;line-height:1.15;box-shadow:0 1px 1px rgba(22,35,43,.06);transition:transform .1s ease,background .14s ease,border-color .14s ease,box-shadow .14s ease}
.btn:active,.icon:active,.rand:active,.eintrag:active,.userbtn:active,.pickzeile:active{transform:scale(.975)}
.btn.gelb{background:var(--color-safety);border-color:var(--color-safety-strong);color:var(--color-charcoal);box-shadow:0 3px 0 #b28c00,0 7px 18px rgba(83,66,0,.18)}
.btn.dark{background:var(--color-charcoal);border-color:var(--color-charcoal);color:#fff}
.btn.rot{color:var(--color-danger);border-color:#dcaaa5;background:var(--color-danger-soft)}
.btn.klein{min-height:40px;padding:7px 10px;font-size:12px}
.btn.voll{width:100%}
.btn.gross{min-height:48px;padding:12px 16px}
.btn[disabled]{opacity:.45;box-shadow:none;transform:none}
.icon{width:40px;height:40px;display:inline-grid;place-items:center;flex:none;background:transparent;border:0;border-radius:var(--radius-control);color:#6d7477;padding:0}
.icon.rot{color:var(--color-danger)}
.symbol{width:20px;height:20px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.aktionen{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-2)}

/* Listen und Berichtzeilen */
ul.liste,ul.zeilen{list-style:none;margin:0;padding:0}
ul.liste>li{position:relative;background:var(--color-paper);border:0;border-radius:var(--radius-panel);margin-bottom:var(--space-2);display:flex;min-width:0;box-shadow:inset 0 0 0 1px rgba(86,75,59,.15),0 5px 18px rgba(22,35,43,.055);overflow:hidden}
ul.liste>li::before{content:"";width:5px;background:var(--color-charcoal-3);flex:none}
.eintrag{flex:1;min-width:0;text-align:left;background:none;border:0;padding:13px 12px 13px 14px}
.eintrag .kopfz{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-1);min-width:0;flex-wrap:wrap}
.eintrag .nr{font-weight:780;font-size:14px;font-variant-numeric:tabular-nums;letter-spacing:.015em}
.eintrag .datum{margin-left:auto;font-size:12px;color:var(--color-muted);font-variant-numeric:tabular-nums}
.eintrag .zeile{display:block;min-width:0;font-size:14px;white-space:normal;overflow-wrap:anywhere;word-break:break-word}
.eintrag .sub{display:block;font-size:12px;color:var(--color-muted);font-variant-numeric:tabular-nums;margin-top:var(--space-1);overflow-wrap:anywhere}
.tag,.status,.rolle,.pille{display:inline-flex;align-items:center;min-height:22px;font-size:10.5px;padding:2px 7px;border-radius:999px;font-weight:760;line-height:1;white-space:nowrap;border:1px solid transparent;text-transform:uppercase;letter-spacing:.035em}
.tag.am{background:var(--color-safety);color:var(--color-charcoal)}
.tag.rb,.rolle.chef{background:var(--color-charcoal);color:#fff}
.tag.bt{background:#e1eef3;color:#194d65;border-color:#9fc1cf}
.status{color:#646b6e;border-color:#c9c5bd;background:#f5f1e9}
.status.ein,.pille.gruen{background:#e6f3e8;border-color:#9bc5a5;color:#205a34}
.pille.rot{background:#fae8e5;border-color:#e1aaa4;color:#8d2825}
.pille.gelb{background:#fff3bf;border-color:#dfc45b;color:#695000}
.rand{width:52px;display:grid;place-items:center;flex:none;border:0;border-left:1px solid rgba(86,75,59,.13);background:#f7f3eb;color:var(--color-charcoal);padding:0}
.zeilen>li{position:relative;background:#fffefa;border:1px solid var(--color-line);border-radius:var(--radius-control);padding:var(--space-3);margin-bottom:var(--space-2);min-width:0}
.rowbez{width:100%}
.mrow{display:grid;grid-template-columns:68px 42px 72px minmax(56px,1fr) 40px;gap:var(--space-1);align-items:center;margin-top:var(--space-2)}
.grow{display:grid;grid-template-columns:66px 80px 66px minmax(56px,1fr) 40px;gap:var(--space-1);align-items:center;margin-top:var(--space-2)}
.brow{display:grid;grid-template-columns:minmax(0,1fr) 82px 74px 40px;gap:var(--space-1);align-items:center;margin-top:var(--space-2)}
.mrow2{display:grid;grid-template-columns:90px minmax(0,1fr) 40px;gap:var(--space-1);align-items:center;margin-top:var(--space-2)}
.grow2{display:grid;grid-template-columns:86px minmax(0,1fr) 40px;gap:var(--space-1);align-items:center;margin-top:var(--space-2)}
.mengeanz{text-align:right;font-variant-numeric:tabular-nums;font-weight:760}
.betrag{font-size:12px;font-variant-numeric:tabular-nums;color:#4f585d;text-align:right;overflow-wrap:anywhere}

/* Auswahl, Summen, Signaturen */
.picker{border:1px solid var(--color-line);border-radius:var(--radius-panel);margin-bottom:var(--space-3);overflow:hidden;background:#fff}
.picker .kopf{display:flex;gap:var(--space-2);padding:var(--space-2);border-bottom:1px solid var(--color-line);background:#f7f3eb}
.picker ul{list-style:none;margin:0;padding:0;max-height:300px;overflow:auto;overscroll-behavior:contain}
.picker li button,.pickzeile{width:100%;min-height:48px;display:flex;align-items:center;gap:10px;background:none;border:0;border-bottom:1px solid #ede8df;padding:9px 10px;text-align:left}
.box{width:24px;height:24px;border:1px solid var(--color-line-strong);border-radius:6px;flex:none;display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--color-charcoal)}
.box.an{background:var(--color-safety);border-color:var(--color-safety-strong)}
.pname{flex:1;min-width:0}
.pname b{display:block;font-weight:650;font-size:14px;overflow-wrap:anywhere}
.pname s{display:block;text-decoration:none;font-size:12px;color:var(--color-muted);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
dl.summe{margin:0;font-variant-numeric:tabular-nums;font-size:14px}
dl.summe div{display:flex;justify-content:space-between;gap:var(--space-4);padding:6px 0}
dl.summe dt{color:#515a5e;overflow-wrap:anywhere}
dl.summe dd{margin:0;text-align:right;font-weight:650;overflow-wrap:anywhere}
dl.summe .gesamt{border-top:2px solid var(--color-charcoal);margin-top:var(--space-2);padding-top:var(--space-3);font-weight:800;font-size:18px;color:var(--color-charcoal)}
dl.summe .gesamt dt{color:inherit}
canvas.sig{width:100%;height:112px;border:1px dashed var(--color-line-strong);border-radius:var(--radius-control);background:linear-gradient(#fffefa,#fff);touch-action:none;display:block}
.sigkopf{display:flex;justify-content:space-between;align-items:center;min-height:32px;margin-bottom:var(--space-1)}
.sigkopf span{font-size:12px;color:var(--color-muted);font-weight:680}
.sigkopf button{min-height:32px;background:none;border:0;font-size:12px;color:var(--color-danger);padding:0 4px}

/* Hinweise, Status, Fotos */
.hinweis{font-size:13px;color:#465158;background:#f4f1ea;border:0;border-left:4px solid #8b989e;border-radius:0 var(--radius-panel) var(--radius-panel) 0;padding:11px 12px;margin-bottom:var(--space-3)}
.warn{background:#fff3d8;border-left-color:var(--color-safety-strong);color:#654b00}
.mono,.schluessel{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px;letter-spacing:.025em}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(24px + env(safe-area-inset-bottom,0px));max-width:min(92vw,520px);background:var(--color-charcoal);color:#fff;padding:12px 18px;border-radius:var(--radius-control);font-size:14px;font-weight:650;z-index:80;box-shadow:var(--shadow-raised);border-left:5px solid var(--color-safety)}
.lzbalken{background:#fff2c8;border:0;border-bottom:1px solid #d8b83e;color:#5f4800;font-size:13px;padding:10px max(var(--space-4),env(safe-area-inset-left,0px));display:flex;align-items:center;gap:var(--space-3)}
.lzbalken.rot{background:#fbe7e4;border-color:#d78379;color:#842923}
.lzbalken button{margin-left:auto;flex:none}
.fotoliste{list-style:none;margin:0;padding:0}
.fotoliste li{display:grid;grid-template-columns:72px minmax(0,1fr) 40px;gap:var(--space-2);align-items:center;margin-bottom:var(--space-2)}
.thumb{width:72px;height:72px;flex:none;border:2px solid #fff;border-radius:var(--radius-control);overflow:hidden;padding:0;background:#e8e3da;box-shadow:0 0 0 1px var(--color-line-strong),0 4px 12px rgba(22,35,43,.12)}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.zoom{position:fixed;inset:0;background:rgba(9,19,24,.96);z-index:70;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:max(20px,env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) max(20px,env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));backdrop-filter:blur(12px)}
.zoom img{max-width:min(100%,980px);max-height:74dvh;border-radius:var(--radius-panel);box-shadow:0 24px 70px rgba(0,0,0,.45)}
.zoom p{color:#fff;font-size:14px;margin:14px 0 0;text-align:center;max-width:620px;overflow-wrap:anywhere}
.zoom .btn{margin-top:var(--space-4)}
.speicherbalken{height:8px;background:#ded8cd;border-radius:999px;overflow:hidden;margin:8px 0 6px}
.speicherbalken i{display:block;height:100%;background:var(--color-charcoal)}

/* Login */
.login{min-height:100svh;min-height:100dvh;background:
  radial-gradient(circle at 22% 12%,rgba(245,197,24,.12),transparent 32%),
  linear-gradient(145deg,#101b21,var(--color-charcoal) 55%,#1d333f);display:flex;align-items:center;justify-content:center;padding:max(24px,env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) max(24px,env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
.app-shell.hat-zurueck .login{padding-top:max(76px,calc(env(safe-area-inset-top,0px) + 66px))}
.app-shell .login{padding-bottom:max(88px,calc(env(safe-area-inset-bottom,0px) + 76px))}
.loginbox{width:100%;max-width:420px}
.loginbox>.marke{justify-content:center;margin-bottom:var(--space-5);font-size:24px}
.lcard{position:relative;background:var(--color-paper);border-radius:12px;padding:var(--space-5);box-shadow:0 24px 70px rgba(3,11,15,.32),inset 0 0 0 1px rgba(255,255,255,.55)}
.lcard::before{content:"";position:absolute;left:24px;right:24px;top:0;height:4px;background:var(--color-safety);border-radius:0 0 4px 4px}
.anmeldung-merken{display:flex;align-items:center;gap:9px;margin:12px 0 4px;color:#374047;font-size:14px;font-weight:650;cursor:pointer}
.anmeldung-merken input{width:20px;height:20px;margin:0;accent-color:var(--color-safety);flex:none}
.anmeldung-merken span{line-height:1.3}
.qr-aktionen{display:grid;grid-template-columns:1fr;gap:8px;margin:0 0 12px}
.qr-scanner{position:fixed;inset:0;z-index:90;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:max(20px,env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) max(20px,env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));background:rgba(5,14,19,.97);color:#fff;backdrop-filter:blur(12px)}
.qr-kamera{position:relative;width:min(100%,520px);overflow:hidden;border:1px solid rgba(255,255,255,.3);border-radius:16px;background:#000;box-shadow:0 22px 70px rgba(0,0,0,.5)}
.qr-kamera video{display:block;width:100%;height:min(66dvh,620px);object-fit:cover}
.qr-ziel{position:absolute;left:50%;top:50%;width:min(68%,290px);aspect-ratio:1;transform:translate(-50%,-50%);border:3px solid var(--color-safety);border-radius:16px;box-shadow:0 0 0 999px rgba(0,0,0,.22),0 0 24px rgba(245,197,24,.3);pointer-events:none}
.qr-scanner p{max-width:420px;margin:0;text-align:center;color:rgba(255,255,255,.82);font-size:14px}
.qr-scanner>.btn{width:min(100%,420px);background:#fff;color:var(--color-charcoal);border-color:#fff}
.lcard h3{margin:0 0 6px;font-size:21px;line-height:1.2;letter-spacing:-.02em;color:var(--color-charcoal)}
.lcard p{margin:0 0 var(--space-4);font-size:13px;color:#526067}
.userbtn{width:100%;min-height:60px;display:flex;align-items:center;gap:var(--space-3);background:#fffefa;border:1px solid var(--color-line);border-radius:var(--radius-control);padding:10px 12px;margin-bottom:var(--space-2);text-align:left}
.avatar{width:40px;height:40px;border-radius:8px;background:var(--color-charcoal);color:#fff;flex:none;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px}
.avatar.m{background:var(--color-safety);color:var(--color-charcoal)}
.upname{flex:1;min-width:0}
.upname b{display:block;font-size:15px;overflow-wrap:anywhere}
.upname s{display:block;text-decoration:none;font-size:12px;color:var(--color-muted);overflow-wrap:anywhere}
.pad{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-2);margin-top:var(--space-3)}
.pad button{min-height:56px;font-size:20px;font-weight:760;border:1px solid var(--color-line);border-radius:var(--radius-control);background:#fffefa}
.pad button.leer2{border-color:transparent;background:none;font-size:14px;color:var(--color-muted);font-weight:500}
.punkte{display:flex;justify-content:center;gap:13px;margin:18px 0 2px}
.punkte i{width:13px;height:13px;border-radius:50%;border:2px solid #9ba0a2}
.punkte i.voll{background:var(--color-charcoal);border-color:var(--color-charcoal)}
.pinfehler{text-align:center;color:var(--color-danger);font-size:13px;min-height:20px;margin-top:6px;font-weight:650}
.anbieterlink{display:block;width:100%;min-height:44px;background:none;border:0;color:rgba(255,255,255,.55);font-size:12px;text-align:center;margin-top:var(--space-3);padding:6px}

/* Tabellen, DA11 und Anbieter */
.lztabelle{width:100%;border-collapse:collapse;font-size:13px;table-layout:fixed}
.lztabelle th{text-align:left;font-weight:700;color:var(--color-muted);font-size:11px;padding:7px 6px;border-bottom:1px solid var(--color-line)}
.lztabelle td{padding:9px 6px;border-bottom:1px solid #ece7de;vertical-align:top;overflow-wrap:anywhere}
.lztabelle tr.klick:active{background:#f2eee6}
.da11vorschau{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:10px;line-height:1.55;white-space:pre;overflow-x:auto;background:#f5f1e9;border:1px solid var(--color-line);border-radius:var(--radius-control);padding:10px;overscroll-behavior:contain}

/* Druckansicht */
.dtop{position:sticky;top:0;background:var(--color-charcoal);display:flex;align-items:center;gap:var(--space-2);padding:8px max(12px,env(safe-area-inset-right,0px)) 8px max(12px,env(safe-area-inset-left,0px));z-index:5}
.dtop .zurueck{margin-right:auto}
.blatt{--design-accent:#16232b;background:#fff;max-width:820px;margin:18px auto;padding:32px 28px;font-size:13px;line-height:1.5;box-shadow:0 10px 40px rgba(0,0,0,.2);position:relative}
.dokument-inhalt{position:relative;z-index:1}
.design-mit-vorlage{box-sizing:border-box;width:min(210mm,calc(100% - 24px));aspect-ratio:210/297;min-height:297mm;padding:var(--vorlage-oben-prozent) 6.67% var(--vorlage-unten-prozent);overflow:hidden}
.design-papier{position:absolute;inset:0 auto auto 0;width:100%;aspect-ratio:210/297;z-index:0;pointer-events:none;user-select:none}
.design-papier img{display:block;width:100%;height:100%;object-fit:fill}
.design-papier .vorlage-maske{position:absolute;top:var(--vorlage-kopf-prozent,22%);left:0;right:0;bottom:0;background:#fff}
.design-mit-vorlage .vorlage-kopf{border-bottom:0;padding:0;margin-bottom:16px;background:transparent;color:inherit;border-radius:0}
.design-mit-vorlage .vorlage-kopf small{color:#4f585d}
.design-anthrazit{--design-accent:#16232b}.design-blau{--design-accent:#1f5f82}.design-gruen{--design-accent:#2f6d4f}.design-rot{--design-accent:#8f342e}
.bkopf{display:flex;justify-content:space-between;gap:16px;border-bottom:3px solid var(--design-accent);padding-bottom:12px;margin-bottom:16px}
.firmenkopf{display:flex;align-items:flex-start;gap:13px;min-width:0}.firmenkopf>div{min-width:0}
.firmenlogo{display:block;width:auto;max-width:150px;height:auto;max-height:62px;object-fit:contain;object-position:left top;flex:none}
.bkopf .r{text-align:right;flex:none}.bkopf b{font-size:16px}.bkopf small{color:#4f585d;font-size:11.5px;line-height:1.4;display:block}
.blatt.design-modern .bkopf{background:var(--design-accent);color:#fff;border:0;border-radius:6px;padding:14px 16px}
.blatt.design-modern .bkopf small{color:rgba(255,255,255,.82)}
.blatt.design-modern h4{color:var(--design-accent);border-bottom:2px solid var(--design-accent)}
.blatt.design-kompakt{font-size:11.5px;line-height:1.35;padding:24px 22px}
.blatt.design-kompakt .bkopf{padding-bottom:8px;margin-bottom:10px;border-bottom-width:2px}
.blatt.design-kompakt .firmenlogo{max-height:46px;max-width:120px}
.blatt.design-kompakt .bmeta{margin-bottom:10px}.blatt.design-kompakt h4{margin:10px 0 4px}
.bmeta{display:grid;grid-template-columns:1fr 1fr;gap:8px 20px;margin-bottom:16px;font-size:12.5px}
.bmeta em{font-style:normal;color:var(--color-muted);font-size:11px;display:block}
.blatt h4{margin:16px 0 6px;font-size:13px;border-bottom:1px solid var(--color-line);padding-bottom:4px}
.blatt table{width:100%;border-collapse:collapse;font-size:12px;font-variant-numeric:tabular-nums}
.blatt th{text-align:right;font-weight:600;color:var(--color-muted);font-size:11px;border-bottom:1px solid var(--color-line);padding:4px 0}
.blatt th:nth-child(1),.blatt th:nth-child(2),.blatt td:nth-child(1),.blatt td:nth-child(2){text-align:left}
.blatt td{text-align:right;padding:4px 0;border-bottom:1px solid #eeeae3;vertical-align:top;overflow-wrap:anywhere}
.zl{display:flex;justify-content:space-between;gap:14px;padding:3px 0;font-variant-numeric:tabular-nums;font-size:12.5px;overflow-wrap:anywhere}
.zl>*{min-width:0}.zl.f{font-weight:760}.gesamtz{border-top:2px solid var(--color-charcoal);margin-top:14px;padding-top:8px;font-size:15px}
.unter{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:36px}
.unter .feld{border-top:1px solid #999;padding-top:4px;font-size:11.5px}.unter .feld em{font-style:normal;color:var(--color-muted);display:block}.unter img{max-height:58px;display:block}.unter .platz{height:60px;display:flex;align-items:flex-end}
.pdf-hinweis{margin:8px 0;padding:9px 11px;border-left:3px solid #1f5f82;background:#eef4f7;color:#33454e;font-size:11.5px}
.pfotos{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}.pfotos figure{margin:0}.pfotos img{width:100%;border:1px solid var(--color-line);display:block}.pfotos figcaption{font-size:11px;color:#4f585d;margin-top:3px}
.dokument-fuss{margin-top:28px;padding-top:8px;border-top:1px solid var(--design-accent);color:#596166;font-size:10.5px;text-align:center;white-space:pre-wrap;overflow-wrap:anywhere}

/* Aufmaß-Designvorlage */
.design-hinweis{font-size:13px;color:#526067;margin:0 0 14px}
.logo-einstellung{display:grid;grid-template-columns:minmax(150px,210px) minmax(0,1fr);gap:14px;align-items:center;margin-bottom:16px}
.logo-flaeche{min-height:104px;display:grid;place-items:center;border:1px dashed var(--color-line-strong);border-radius:var(--radius-control);background:#fff;color:var(--color-muted);padding:12px;text-align:center}
.logo-flaeche img{display:block;max-width:100%;max-height:88px;object-fit:contain}
.logo-aktionen{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.logo-aktionen small{flex:1 1 100%;color:var(--color-muted);line-height:1.4}
.briefpapier-einstellung{margin-top:18px;padding-top:16px;border-top:1px solid var(--color-line)}
.briefpapier-einstellung>h4{margin:0 0 6px;font-size:15px;color:var(--color-charcoal)}
.briefpapier-zeile{display:grid;grid-template-columns:minmax(150px,210px) minmax(0,1fr);gap:14px;align-items:center;margin-bottom:12px}
.briefpapier-mini{aspect-ratio:210/297;max-height:190px;display:grid;place-items:center;overflow:hidden;border:1px dashed var(--color-line-strong);border-radius:var(--radius-control);background:#fff;color:var(--color-muted);padding:8px;text-align:center}
.briefpapier-mini img{display:block;width:100%;height:100%;object-fit:contain}
.vorlage-direktvorschau{padding:12px;background:var(--color-paper);border:1px solid var(--color-line);border-radius:var(--radius-card)}
.druck-formularvorschau{max-width:1100px;margin:0 auto;padding:16px;background:var(--color-paper);border:1px solid var(--color-line);border-radius:var(--radius-card)}
.druck-formularvorschau .vorlage-seiten-vorschau{grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr))}
.druck-formularvorschau .design-hinweis{margin:12px 0 0;font-size:13px;color:var(--color-muted)}
.vorlage-seiten-vorschau{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:14px;align-items:start}
.vorlage-seiten-vorschau figure{margin:0;min-width:0}
.vorlage-seiten-vorschau figcaption{margin:0 0 6px;font-size:12px;font-weight:700;color:var(--color-charcoal);overflow-wrap:anywhere}
.vorlage-seite-bild{position:relative;width:100%;aspect-ratio:210/297;overflow:hidden;background:#fff;border:1px solid var(--color-line-strong);box-shadow:0 4px 12px rgba(22,35,43,.12)}
.vorlage-seite-bild>img{display:block;width:100%;height:100%;object-fit:fill}
.vorlage-feld-markierung{position:absolute;box-sizing:border-box;border:1.5px dashed #d47b00;background:rgba(255,196,0,.08);pointer-events:none}
.vorlage-direktvorschau>.design-hinweis{margin:10px 2px 0;font-size:12px}
.scan-ergebnis{margin:8px 0;font-size:12px}
.foto-modus-dialog{width:min(92vw,440px);padding:22px;border:1px solid var(--color-line-strong);border-radius:16px;background:var(--color-paper);color:var(--color-charcoal);box-shadow:0 16px 50px rgba(22,35,43,.28)}
.foto-modus-dialog::backdrop{background:rgba(10,20,26,.68)}
.foto-modus-dialog h2{margin:0 0 10px;font-size:20px}
.foto-modus-dialog p{font-size:14px;line-height:1.45;color:#465158}
.foto-modus-aktionen{display:grid;gap:8px;margin-top:16px}
.design-felder{margin-top:4px}.vorschau-titel{margin:18px 0 8px;font-size:12px;color:var(--color-muted);text-transform:uppercase;letter-spacing:.06em}
.design-vorschau.blatt{max-width:none;margin:0;padding:20px 18px;font-size:10.5px;line-height:1.35;box-shadow:inset 0 0 0 1px var(--color-line),0 8px 24px rgba(22,35,43,.08);overflow:hidden}
.design-vorschau.blatt.design-mit-vorlage{width:100%;min-height:0;aspect-ratio:210/297;padding:var(--vorlage-oben-prozent) 6.67% var(--vorlage-unten-prozent)}
.design-vorschau .bkopf{margin-bottom:10px}.design-vorschau .bkopf b{font-size:13px}.design-vorschau .bkopf small{font-size:9.5px}.design-vorschau .firmenlogo{max-width:105px;max-height:45px}
.design-vorschau .bmeta{font-size:10px;margin-bottom:8px;gap:6px 14px}.design-vorschau .bmeta em{font-size:9px}.design-vorschau h4{margin:8px 0 4px;font-size:10.5px}
.design-vorschau table{font-size:9.5px}.design-vorschau .dokument-fuss{margin-top:16px;font-size:9px}

@media (hover:hover) and (pointer:fine){
  .btn:hover{border-color:#7e8584;background:#fff;box-shadow:0 4px 12px rgba(22,35,43,.1)}
  .btn.gelb:hover{background:#ffd52f;border-color:#d6aa00}
  .btn.dark:hover{background:var(--color-charcoal-2)}
  nav.tabs button:not(.an):hover{color:#fff;background:rgba(255,255,255,.06)}
  .eintrag:hover,.rand:hover,.icon:hover,.userbtn:hover,.pickzeile:hover{background:#f2eee5}
  .icon:hover{color:var(--color-danger)}
}
@media (max-width:640px){
  body{background:var(--color-paper-warm)}
  .topbar{min-height:58px}.marke{font-size:16px}.marke i{width:28px;height:28px}
  .userbar span{display:none}
  .wrap{padding:var(--space-3) var(--space-3) calc(92px + env(safe-area-inset-bottom,0px))}
  .screen-title{font-size:25px;margin-bottom:var(--space-3)}
  .create-grid{grid-template-columns:1fr 1fr}.create-grid .btn:first-child{grid-column:1/-1}
  .report-type-grid{grid-template-columns:repeat(3,minmax(88px,1fr));overflow-x:auto;overscroll-behavior:contain}
  .g2{grid-template-columns:1fr}
  .signaturen{grid-template-columns:1fr;gap:var(--space-5)}
  .g5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .g3{grid-template-columns:repeat(2,minmax(0,1fr))}.g3>*:last-child{grid-column:1/-1}
  .aktionen{grid-template-columns:1fr}
  .karte>h3{align-items:flex-start;flex-wrap:wrap}.karte>h3 .rechts{width:100%;margin-left:12px;justify-content:flex-start}
  .mrow{grid-template-columns:62px 38px 64px minmax(46px,1fr) 40px}
  .grow{grid-template-columns:58px 72px 60px minmax(46px,1fr) 40px}
  .brow{grid-template-columns:minmax(0,1fr) 74px 66px 40px}
  .mrow2{grid-template-columns:86px minmax(0,1fr) 40px}.grow2{grid-template-columns:80px minmax(0,1fr) 40px}
  .blatt{padding:18px 14px;margin:8px}.unter{gap:16px}.bmeta{grid-template-columns:1fr}
  .logo-einstellung,.briefpapier-zeile{grid-template-columns:1fr}.logo-flaeche{min-height:92px}.briefpapier-mini{max-height:220px}
  .blatt.design-mit-vorlage{width:calc(100% - 16px);padding:var(--vorlage-oben-prozent) 6.67% var(--vorlage-unten-prozent)}
  .design-vorschau .bmeta{grid-template-columns:1fr 1fr}
  .fotoliste li{grid-template-columns:64px minmax(0,1fr) 40px}.thumb{width:64px;height:64px}
  .lcard{padding:20px 16px}
  .zurueckleiste{top:calc(env(safe-area-inset-top,0px) + 8px)}
  .zurueckleiste>div{padding-inline:max(12px,env(safe-area-inset-left,0px)) max(12px,env(safe-area-inset-right,0px))}
}
@media (max-width:390px){
  .mrow,.grow{grid-template-columns:1fr 1fr 40px}.mrow>*:nth-child(4),.grow>*:nth-child(4){grid-column:1/3}.mrow>*:last-child,.grow>*:last-child{grid-column:3;grid-row:1}
  .brow{grid-template-columns:1fr 1fr 40px}.brow>*:first-child{grid-column:1/-1}.brow>*:last-child{grid-column:3;grid-row:2}
  nav.tabs button{padding-inline:12px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
  .btn:active,.icon:active,.rand:active,.eintrag:active,.userbtn:active,.pickzeile:active{transform:none}
}
@media (prefers-reduced-transparency:reduce){header.top,.zoom{backdrop-filter:none}}
@media print{
  html,body{background:#fff;min-height:auto}.pfotos figure,.unter,tr{break-inside:avoid;page-break-inside:avoid}thead{display:table-header-group}.np,.screen-title{display:none!important}.blatt{box-shadow:none;margin:0;padding:0;max-width:none;font-size:10.5pt;-webkit-print-color-adjust:exact;print-color-adjust:exact}.blatt.design-mit-vorlage{width:auto;aspect-ratio:auto;min-height:auto;overflow:visible}.blatt.design-mit-vorlage .design-papier{position:fixed;top:0;left:-14mm;width:210mm;height:297mm}.blatt.design-mit-vorlage .dokument-inhalt{padding-top:var(--vorlage-oben);padding-bottom:var(--vorlage-unten);box-decoration-break:clone;-webkit-box-decoration-break:clone}.app-shell{min-height:auto}@page{size:A4 portrait;margin:14mm}
}

/* Field-book responsive redesign: a precise, quiet workbench */
@media screen{
:root{
  --radius-control:7px;
  --radius-panel:10px;
  --shadow-panel:0 1px 2px rgba(22,35,43,.035),0 5px 16px rgba(22,35,43,.045);
  --color-muted:#5d676c;
  --color-line:#d7d2c9;
}
body{background:linear-gradient(180deg,var(--color-charcoal) 0 112px,var(--color-paper-warm) 112px 100%)}
.wrap{width:min(100%,960px);padding-top:24px}
.screen-title{font-size:clamp(27px,3vw,36px);letter-spacing:-.035em;margin-bottom:20px}
header.top{background:var(--color-charcoal);box-shadow:0 2px 0 rgba(245,197,24,.75)}
.topbar{width:min(100%,960px);min-height:66px}
nav.tabs{width:min(100%,960px);gap:4px}
nav.tabs button{min-height:50px;transition:color .14s ease,background .14s ease}
nav.tabs button.an{border-radius:6px 6px 0 0}
.karte{border-radius:10px;box-shadow:var(--shadow-panel);overflow:hidden}
.karte:nth-of-type(even){background:var(--color-paper)}
.karte>h3{padding:15px 18px 13px;font-size:14px;border-bottom-color:#e8e3d9}
.karte>h3::before{width:3px;height:16px;background:var(--color-safety-strong)}
.inhalt{padding:18px}
ul.liste>li{box-shadow:inset 0 0 0 1px rgba(86,75,59,.13),0 2px 7px rgba(22,35,43,.035)}
.btn{box-shadow:none}
.btn.gelb{box-shadow:inset 0 -2px 0 rgba(120,91,0,.25)}
.btn.dark{box-shadow:inset 0 -2px 0 rgba(0,0,0,.2)}
.btn:focus-visible,.icon:focus-visible,.rand:focus-visible,.userbtn:focus-visible,.pickzeile:focus-visible{
  outline:3px solid var(--color-safety-strong);outline-offset:2px
}
input[type=text],input[type=date],input[type=email],input[type=password],select,textarea{
  box-shadow:none;border-color:#bbb4a8;background:#fff
}
input:focus,select:focus,textarea:focus{box-shadow:0 0 0 3px rgba(245,197,24,.25)}
.login{
  background-color:var(--color-charcoal);
  background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
    radial-gradient(ellipse at 14% 18%,rgba(245,197,24,.12),transparent 32%),
    linear-gradient(145deg,#101b21,var(--color-charcoal) 58%,#203641);
  background-size:32px 32px,32px 32px,auto,auto;
}
.loginbox{max-width:440px}
.loginbox>.marke{justify-content:flex-start;margin:0 0 18px 2px;font-size:21px;letter-spacing:-.03em}
.loginbox>.marke i{width:34px;height:34px;border-radius:5px}
.lcard{border-radius:12px;padding:28px;background:var(--color-paper);box-shadow:0 20px 54px rgba(3,11,15,.25),inset 0 0 0 1px rgba(255,255,255,.6)}
.lcard::before{left:28px;right:auto;width:48px;height:4px;border-radius:0 0 3px 3px}
.lcard h3{font-size:23px;letter-spacing:-.025em}
.lcard p{font-size:14px;line-height:1.5}
.loginbox .btn{min-height:50px;justify-content:flex-start;text-align:left;padding-inline:16px}
.loginbox .btn.gelb{justify-content:center}
.userbtn{border-color:#d8d2c7;box-shadow:none}
.lzbalken{line-height:1.45}
@media (min-width:1000px){
  .wrap{padding-inline:24px}
}
@media (max-width:640px){
  body{background:var(--color-paper-warm)}
  .topbar{min-height:58px;flex-wrap:wrap;gap:6px 10px;padding-block:8px}
  .topbar>.marke{font-size:16px}
  .userbar{gap:6px}
  .userbar button{min-height:42px;padding-inline:9px}
  nav.tabs{padding-inline:12px;justify-content:flex-start;gap:2px}
  nav.tabs button{flex:0 0 auto;min-height:48px;padding-inline:13px}
  .wrap{padding:16px 12px calc(92px + env(safe-area-inset-bottom,0px))}
  .screen-title{font-size:27px;margin-bottom:16px}
  .karte{margin-bottom:12px}
  .karte>h3{padding:13px 14px 11px}
  .inhalt{padding:14px}
  .login{align-items:flex-start;justify-content:center;padding:clamp(28px,9vh,72px) max(16px,env(safe-area-inset-right,0px)) max(28px,env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
  .app-shell .login{padding-bottom:max(88px,calc(env(safe-area-inset-bottom,0px) + 76px))}
  .loginbox>.marke{font-size:19px;margin-bottom:16px}
  .lcard{padding:24px 20px}
  .loginbox .btn{min-height:48px}
}
@media (max-width:390px){
  .topbar{gap:4px 7px}
  .userbar button{padding-inline:7px;font-size:11px}
  nav.tabs button{padding-inline:11px}
  .lcard{padding:22px 16px}
}
@media (prefers-reduced-motion:reduce){
  nav.tabs button{transition:none}
}
} /* screen: preserve the existing report-print cascade */