:root{
  --bg:#F1F2F4; --surface:#FFFFFF; --surface-2:#F6F7F8; --ink:#1C1F23; --ink-2:#5B636B; --ink-3:#8A939B;
  --line:#E2E5E8; --line-2:#CBD0D5;
  --plate:#23272B; --on-plate:#F2F3F4; --on-plate-2:#A3AAB1; --plate-line:rgba(255,255,255,.14);
  --primary:#23272B; --on-primary:#FFFFFF;
  --ok:#1F7A4B; --on-ok:#FFFFFF; --ok-tint:#E4F1E9;
  --dev:#F2A100; --on-dev:#1C1F23; --dev-tint:#FFF6DF; --dev-line:#E09600;
  --na:#9AA2A9; --on-na:#FFFFFF;
  --err:#C2361B; --err-tint:#FCEDE9;
  --focus:#1C1F23;
  --r:4px; --r-m:6px;
  --font:"Barlow","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
  --font-c:"Barlow Semi Condensed","Barlow","Arial Narrow",system-ui,sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#121417; --surface:#1A1D21; --surface-2:#22262B; --ink:#E8EBED; --ink-2:#9CA4AC; --ink-3:#6C757D;
    --line:#2A2F35; --line-2:#3A4047;
    --plate:#0B0D0F; --on-plate:#E8EBED; --on-plate-2:#8E979F; --plate-line:rgba(255,255,255,.10);
    --primary:#E8EBED; --on-primary:#121417;
    --ok:#3DB27A; --on-ok:#0B0D0F; --ok-tint:#15261D;
    --dev:#F2A100; --on-dev:#121417; --dev-tint:#2A2310; --dev-line:#B37800;
    --na:#6C757D; --on-na:#0B0D0F;
    --err:#FF7A5C; --err-tint:#331A14;
    --focus:#E8EBED;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#121417; --surface:#1A1D21; --surface-2:#22262B; --ink:#E8EBED; --ink-2:#9CA4AC; --ink-3:#6C757D;
  --line:#2A2F35; --line-2:#3A4047;
  --plate:#0B0D0F; --on-plate:#E8EBED; --on-plate-2:#8E979F; --plate-line:rgba(255,255,255,.10);
  --primary:#E8EBED; --on-primary:#121417;
  --ok:#3DB27A; --on-ok:#0B0D0F; --ok-tint:#15261D;
  --dev:#F2A100; --on-dev:#121417; --dev-tint:#2A2310; --dev-line:#B37800;
  --na:#6C757D; --on-na:#0B0D0F;
  --err:#FF7A5C; --err-tint:#331A14;
  --focus:#E8EBED;
  color-scheme:dark;
}
/* Vom Nutzer gewählter Modus (Tag/Nacht) hat Vorrang vor System- und Viewer-Einstellung */
html:root[data-ui="light"]{
--bg:#F1F2F4; --surface:#FFFFFF; --surface-2:#F6F7F8; --ink:#1C1F23; --ink-2:#5B636B; --ink-3:#8A939B;
  --line:#E2E5E8; --line-2:#CBD0D5;
  --plate:#23272B; --on-plate:#F2F3F4; --on-plate-2:#A3AAB1; --plate-line:rgba(255,255,255,.14);
  --primary:#23272B; --on-primary:#FFFFFF;
  --ok:#1F7A4B; --on-ok:#FFFFFF; --ok-tint:#E4F1E9;
  --dev:#F2A100; --on-dev:#1C1F23; --dev-tint:#FFF6DF; --dev-line:#E09600;
  --na:#9AA2A9; --on-na:#FFFFFF;
  --err:#C2361B; --err-tint:#FCEDE9;
  --focus:#1C1F23;
  color-scheme:light;
}
html:root[data-ui="dark"]{
  --bg:#121417; --surface:#1A1D21; --surface-2:#22262B; --ink:#E8EBED; --ink-2:#9CA4AC; --ink-3:#6C757D;
  --line:#2A2F35; --line-2:#3A4047;
  --plate:#0B0D0F; --on-plate:#E8EBED; --on-plate-2:#8E979F; --plate-line:rgba(255,255,255,.10);
  --primary:#E8EBED; --on-primary:#121417;
  --ok:#3DB27A; --on-ok:#0B0D0F; --ok-tint:#15261D;
  --dev:#F2A100; --on-dev:#121417; --dev-tint:#2A2310; --dev-line:#B37800;
  --na:#6C757D; --on-na:#0B0D0F;
  --err:#FF7A5C; --err-tint:#331A14;
  --focus:#E8EBED;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(env(safe-area-inset-top,0px) + var(--ph-h,0px) + 8px)}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font-family:var(--font);font-size:15px;line-height:1.45;min-height:100%}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;-webkit-tap-highlight-color:transparent}
button:disabled{cursor:not-allowed}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
[hidden]{display:none !important}
img{max-width:100%}
.wrap{max-width:900px;margin:0 auto;padding:0 16px 72px}
.ic{display:inline-flex;width:18px;height:18px;flex:0 0 auto}
.ic svg{width:100%;height:100%}
input[type=text],input[type=date],input[type=number],select,textarea{width:100%;min-height:40px;padding:8px 10px;border:1px solid var(--line-2);border-radius:var(--r);background:var(--surface);color:var(--ink)}
textarea{resize:vertical;line-height:1.4}
input:disabled,select:disabled,textarea:disabled{background:var(--surface-2);color:var(--ink-2)}

/* Kopfzeile */
.topbar{background:var(--plate);color:var(--on-plate)}
.topbar-in{max-width:900px;margin:0 auto;padding:0 16px;height:52px;display:flex;align-items:center;gap:12px}
.brand{background:none;border:0;padding:0;color:inherit;display:flex;align-items:baseline;gap:8px}
.brand b{font-family:var(--font-c);font-weight:700;font-size:18px}
.brand span{font-size:13px;color:var(--on-plate-2)}
.topright{margin-left:auto;display:flex;align-items:center;gap:10px}
.tb-btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 10px;border-radius:var(--r);border:1px solid var(--plate-line);background:transparent;color:var(--on-plate);font-weight:600;font-size:14px}
.me{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--on-plate-2)}
.me img{width:26px;height:26px;border-radius:50%}
body[data-view="protocol"] .topbar,body[data-view="day"] .topbar,body[data-view="print"] .topbar{display:none}
.subnav{background:var(--surface);border-bottom:1px solid var(--line)}
.subnav-in{max-width:900px;margin:0 auto;padding:0 12px;display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.sn{height:44px;padding:0 12px;border:0;border-bottom:2px solid transparent;background:none;font-weight:600;font-size:14px;color:var(--ink-2);white-space:nowrap}
.sn:hover{color:var(--ink)}
.sn[aria-current="true"]{color:var(--ink);border-bottom-color:var(--ink)}
body[data-view="protocol"] .subnav,body[data-view="day"] .subnav,body[data-view="print"] .subnav{display:none}
@media (max-width:520px){.me-n,.tb-l,.brand span{display:none}}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:44px;padding:0 16px;border-radius:var(--r);border:1px solid var(--line-2);background:var(--surface);color:var(--ink);font-weight:600;font-size:15px}
.btn:hover:not(:disabled){border-color:var(--ink-3)}
.btn.primary{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
.btn.primary:disabled{opacity:.5}
.btn.small{height:36px;padding:0 12px;font-size:14px}
.btn.ghost{background:transparent;border-color:transparent}
.btn.armed{background:var(--err);border-color:var(--err);color:#fff}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.row.end{justify-content:flex-end}
.linkbtn{background:none;border:0;padding:10px 0;color:var(--ink);font-weight:600;font-size:14px;display:inline-flex;gap:6px;align-items:center}
.linkbtn span{text-decoration:underline;text-underline-offset:3px}

/* Übersicht */
.lh{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:24px 0 10px;flex-wrap:wrap}
.lh h2{font-family:var(--font-c);font-weight:700;font-size:20px;margin:0}
.lh p{margin:0;color:var(--ink-2);font-size:14px}
.shifts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden}
@media (max-width:640px){.shifts{grid-template-columns:1fr}}
.shift{background:var(--surface);border:0;text-align:left;padding:12px 14px 14px;display:grid;gap:8px;color:var(--ink)}
.shift:hover:not(:disabled){background:var(--surface-2)}
.shift.now{box-shadow:inset 3px 0 0 var(--ok)}
.shift-t{display:flex;align-items:center;justify-content:space-between;gap:8px}
.shift-t b{font-family:var(--font-c);font-weight:700;font-size:19px;line-height:1.1}
.live{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--ok)}
.live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px var(--ok-tint)}
.shift-m{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:14px;color:var(--ink-2);min-height:20px}
.pbar{display:flex;height:4px;background:var(--line);border-radius:2px;overflow:hidden}
.pbar i,.ph-bar i{display:block;height:100%}
.pbar .ok,.ph-bar .ok{background:var(--ok)}
.pbar .dev,.ph-bar .dev{background:var(--dev)}
.pbar .na,.ph-bar .na{background:var(--na)}
.st{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--ink-2);white-space:nowrap}
.st::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--line-2)}
.st.open::before{background:var(--ink-3)}
.st.wait::before{background:var(--dev)}
.st.done::before{background:var(--ok)}
.tag{font-size:12px;font-weight:600;padding:1px 6px;border-radius:3px;background:var(--surface-2);color:var(--ink-2);white-space:nowrap;font-variant-numeric:tabular-nums}
.tag.dev{background:var(--dev-tint);color:var(--ink);box-shadow:inset 0 0 0 1px var(--dev-line)}
.tag.time{display:inline-flex;align-items:center;gap:4px}
.tag .ic{width:13px;height:13px}
.tag.over{background:var(--dev-tint);color:var(--ink);box-shadow:inset 0 0 0 1px var(--dev-line)}
.seg2{display:inline-flex;border:1px solid var(--line-2);border-radius:var(--r);overflow:hidden;background:var(--surface)}
.seg2 button{border:0;background:transparent;height:32px;padding:0 12px;font-size:13px;font-weight:600;color:var(--ink-2)}
.seg2 button+button{border-left:1px solid var(--line-2)}
.seg2 button[aria-pressed="true"]{background:var(--primary);color:var(--on-primary)}
.hist{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden}
.hday{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;min-height:44px;padding:8px 14px;background:var(--surface-2);border:0;border-top:1px solid var(--line);font-weight:700;font-size:14px;text-align:left;color:var(--ink);font-variant-numeric:tabular-nums}
.hday:first-child{border-top:0}
.hday:hover{background:var(--line)}
.hday .go{display:inline-flex;align-items:center;gap:2px;font-weight:600;font-size:13px;color:var(--ink-2)}
.hday .go .ic{width:16px;height:16px}
.hrow{display:flex;align-items:center;border-top:1px solid var(--line)}
.hrow:hover{background:var(--surface-2)}
.hrow-main{flex:1;min-width:0;display:grid;grid-template-columns:130px 1fr auto;gap:12px;align-items:center;text-align:left;padding:10px 14px 10px 24px;background:none;border:0;font-size:14px;color:var(--ink)}
.hrow .s{font-weight:600}
.hrow .l{color:var(--ink-2)}
.hrow .l small{display:block;font-size:12px;font-variant-numeric:tabular-nums}
.hrow .c{display:flex;gap:6px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.hrow .pdfb{margin-right:12px;flex:0 0 auto;height:34px}
@media (max-width:640px){.hrow-main{grid-template-columns:1fr auto;row-gap:2px;padding-left:18px}.hrow .l{grid-row:2;grid-column:1}.hrow .c{grid-row:1/3;grid-column:2;flex-direction:column;align-items:flex-end;gap:4px}.hrow .pdfb{margin-right:8px}}
.empty{padding:18px 14px;color:var(--ink-2);margin:0}
.note-bar{margin:12px 0 0;padding:10px 12px;border-radius:var(--r);font-size:14px;background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--ink-3)}
.note-bar.ok{border-left-color:var(--ok)}
.note-bar.wait{border-left-color:var(--dev)}
.note-bar a{color:inherit;font-weight:600}
.loading{padding:40px 0;color:var(--ink-2)}
.msg h2{font-family:var(--font-c);font-size:20px;margin:28px 0 6px}
.msg p{color:var(--ink-2);margin:0}

/* Protokollkopf */
.ph{position:sticky;top:env(safe-area-inset-top,0px);z-index:10;background:var(--plate);color:var(--on-plate)}
.ph-in{max-width:900px;margin:0 auto;padding:4px 12px 0 4px}
.ph-row{display:flex;align-items:center;gap:4px;min-height:54px}
.ph-back{width:44px;height:44px;flex:0 0 auto;border:0;background:none;color:var(--on-plate);display:grid;place-items:center;border-radius:var(--r)}
.ph-back .ic{width:22px;height:22px}
.ph-t{flex:1;min-width:0}
.ph-t h1{margin:0;font-family:var(--font-c);font-weight:700;font-size:21px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ph-t p{margin:1px 0 0;font-size:13px;color:var(--on-plate-2);display:flex;gap:12px;white-space:nowrap;overflow:hidden}
.ph-t p b{font-weight:600;color:var(--on-plate);overflow:hidden;text-overflow:ellipsis}
.ph-n{flex:0 0 auto;border:1px solid var(--plate-line);background:transparent;color:var(--on-plate-2);height:38px;padding:0 10px;border-radius:var(--r);display:inline-flex;align-items:center;gap:6px;font-variant-numeric:tabular-nums;font-size:14px}
.ph-n b{font-size:17px;color:var(--on-plate)}
.ph-n .ic{width:16px;height:16px}
.tabs{position:relative;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:2px 0 10px 8px}
.tabs::-webkit-scrollbar{display:none}
.tab{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border-radius:var(--r);border:1px solid var(--plate-line);background:transparent;color:var(--on-plate-2);font-size:13px;font-weight:600;white-space:nowrap}
.tab .c{font-variant-numeric:tabular-nums;font-weight:500;opacity:.85}
.tab.done{color:var(--on-plate)}
.tab.done .c{color:#57C990;opacity:1}
.tab.has-dev::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--dev)}
.tab[aria-current="true"]{background:var(--on-plate);border-color:var(--on-plate);color:var(--plate)}
.tab[aria-current="true"] .c{color:var(--plate)}
.ph-bar{display:flex;height:3px;background:rgba(255,255,255,.12)}
.intro{margin-top:10px;font-size:14px;color:var(--ink-2)}
.intro summary{cursor:pointer;display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--ink);list-style:none;padding:6px 0;min-height:36px}
.intro summary::-webkit-details-marker{display:none}
.intro summary::before{content:"";width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg);transition:transform .15s}
.intro[open] summary::before{transform:rotate(45deg)}
.intro p{margin:2px 0 4px;max-width:75ch;line-height:1.5}

/* Abschnitte */
.sec{margin-top:20px}
.sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:0 2px 6px;border-bottom:2px solid var(--ink)}
.sec-h h2{margin:0;font-family:var(--font-c);font-weight:700;font-size:17px;line-height:1.2}
.sec-h .c{font-size:13px;color:var(--ink-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.sec-h .c.full{color:var(--ok);font-weight:600}
.items{list-style:none;margin:0;padding:0;background:var(--surface);border:1px solid var(--line);border-top:0;border-radius:0 0 var(--r-m) var(--r-m)}
.blk{background:var(--surface);border:1px solid var(--line);border-top:0;border-radius:0 0 var(--r-m) var(--r-m);padding:12px}

/* Prüfpunkte */
.it{display:grid;grid-template-columns:48px minmax(0,1fr) auto;grid-template-areas:"ck txt act" ". x x";border-top:1px solid var(--line);transition:background-color .15s}
.it:first-child{border-top:0}
.ck{grid-area:ck;width:48px;height:48px;border:0;background:none;display:grid;place-items:center;padding:0;color:inherit}
.box{width:24px;height:24px;border:2px solid var(--ink-3);border-radius:3px;display:grid;place-items:center;background:var(--surface);transition:background-color .12s,border-color .12s}
.box svg{width:16px;height:16px}
.ck:hover:not(:disabled) .box{border-color:var(--ink)}
.ck:disabled{cursor:default}
.ck:disabled .box{opacity:.85}
.it[data-s="ok"] .box{background:var(--ok);border-color:var(--ok);color:var(--on-ok)}
.it[data-s="dev"] .box{background:var(--dev);border-color:var(--dev);color:var(--on-dev)}
.it[data-s="na"] .box{background:var(--na);border-color:var(--na);color:var(--on-na)}
.it-t{grid-area:txt;margin:0;padding:13px 10px 13px 0;line-height:1.4;min-width:0}
.it[data-s="ok"] .it-t{color:var(--ink-2)}
.it[data-s="na"] .it-t{color:var(--ink-3)}
.it[data-s="dev"]{background:var(--dev-tint);box-shadow:inset 3px 0 0 var(--dev-line)}
.req{display:inline-flex;align-items:center;gap:3px;margin-left:8px;font-size:12px;font-weight:600;color:var(--ink-2);vertical-align:1px;white-space:nowrap}
.req .ic{width:14px;height:14px}
.it-a{grid-area:act;display:flex;gap:4px;align-items:center;padding:8px 10px 8px 0}
.ab{height:32px;padding:0 10px;border:1px solid var(--line-2);border-radius:var(--r);background:var(--surface);font-size:13px;font-weight:600;color:var(--ink-2);display:inline-flex;align-items:center;justify-content:center;gap:4px;white-space:nowrap}
.ab:hover:not(:disabled){border-color:var(--ink-3);color:var(--ink)}
.ab.icon{min-width:32px;padding:0 7px}
.ab .n{font-size:12px;font-variant-numeric:tabular-nums}
.ab .n:empty{display:none}
.it .ab-dev[aria-pressed="true"]{background:var(--dev);border-color:var(--dev);color:var(--on-dev)}
.it .ab-na[aria-pressed="true"]{background:var(--na);border-color:var(--na);color:var(--on-na)}
.it .ab-note[aria-pressed="true"],.it .ab-cam.has{color:var(--ink);border-color:var(--ink-3);background:var(--surface)}
@media (hover:hover) and (min-width:721px){
  .it .ab{border-color:transparent;background:transparent;color:var(--ink-3)}
  .it:hover .ab:not([aria-pressed="true"]):not(.has),.it:focus-within .ab:not([aria-pressed="true"]):not(.has){border-color:var(--line-2);background:var(--surface);color:var(--ink-2)}
}
.more{grid-area:more;display:none;width:44px;height:48px;border:0;background:none;place-items:center;color:var(--ink-2)}
.more .ic{width:20px;height:20px}
.it-x{grid-area:x;display:grid;gap:8px;padding:0 12px 12px 0;min-width:0}
.fv{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--ink-2);flex-wrap:wrap}
.fv input{width:120px;min-height:36px;height:36px;padding:0 10px;font-variant-numeric:tabular-nums}
.fv.wide input{width:200px}
.fv.missing input{border-color:var(--err);box-shadow:0 0 0 1px var(--err)}
.it-x textarea{min-height:56px;font-size:14px}
.it.needs-note .it-x textarea{border-color:var(--err);box-shadow:0 0 0 1px var(--err)}
.thumbs{display:flex;flex-wrap:wrap;gap:6px}
.thumbs:empty{display:none}
.thumb{width:64px;height:64px;border:1px solid var(--line-2);border-radius:var(--r);overflow:hidden;padding:0;background:var(--surface-2);display:grid;place-items:center;cursor:zoom-in}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.thumb.missing::after{content:"fehlt";font-size:11px;color:var(--ink-2)}
.thumb.missing img{display:none}
.spin{width:18px;height:18px;border-radius:50%;border:2px solid var(--line-2);border-top-color:var(--ink);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.it.drop{outline:2px dashed var(--ink-2);outline-offset:-4px;background:var(--surface-2)}
.it.flash{animation:flash 1.4s ease}
@keyframes flash{0%,45%{background:var(--err-tint)}100%{background:transparent}}
@media (max-width:720px){
  .it{grid-template-columns:48px minmax(0,1fr) 44px;grid-template-areas:"ck txt more" ". act act" ". x x"}
  .more{display:grid}
  .it-a{display:none;flex-wrap:wrap;gap:6px;padding:0 12px 12px 0}
  .it.open .it-a{display:flex}
  .it .ab{height:40px;padding:0 12px;font-size:14px}
  .it .ab.icon{min-width:42px}
  .it.open .more{color:var(--ink)}
}

/* Anlagenstatus */
.lines{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:6px}
.line{display:grid;gap:4px;border:1px solid var(--line);border-radius:var(--r);padding:6px;background:var(--surface-2)}
.line b{font-family:var(--font-c);font-size:16px;line-height:1}
.line select{min-height:34px;padding:2px 4px;font-size:14px}
.line[data-s="run"]{box-shadow:inset 0 3px 0 var(--ok)}
.line[data-s="stop"]{box-shadow:inset 0 3px 0 var(--err)}
.line[data-s="setup"],.line[data-s="maint"]{box-shadow:inset 0 3px 0 var(--dev)}

/* Unterschriften */
.confirm{margin:0 0 14px;font-size:14px;color:var(--ink-2);max-width:80ch}
.sigs{display:grid;gap:18px}
@media (min-width:760px){.sigs{grid-template-columns:1fr 1fr}}
.sigcol{display:grid;gap:10px;align-content:start}
.sigcol h3{margin:0;font-family:var(--font-c);font-weight:700;font-size:16px}
.sigcol.waiting{border:1px dashed var(--line-2);border-radius:var(--r);padding:12px;align-self:start}
.fld{display:grid;gap:4px}
.fld>span{font-size:13px;font-weight:600;color:var(--ink-2)}
.pad{position:relative;height:150px;border:1px solid var(--line-2);border-radius:var(--r);background:#FFFFFF;touch-action:none;overflow:hidden}
.pad canvas{width:100%;height:100%;display:block;touch-action:none;cursor:crosshair}
.pad .base{position:absolute;left:14px;right:14px;bottom:36px;border-bottom:1px solid #C9CED3;pointer-events:none}
.pad .pad-ph{position:absolute;left:14px;bottom:12px;font-size:13px;color:#737C84;pointer-events:none}
.pad.has .pad-ph{display:none}
.pad.off{opacity:.6}
.pad .clr{position:absolute;top:6px;right:6px;height:30px;padding:0 10px;border:1px solid #D2D7DB;border-radius:var(--r);background:#FFFFFF;color:#444B52;font-size:13px;font-weight:600}
.problems{border:1px solid var(--err);background:var(--err-tint);border-radius:var(--r);padding:10px 12px;font-size:14px}
.problems ul{margin:6px 0 0;padding-left:18px}
.problems a{color:inherit;font-weight:600}
.signed{display:grid;gap:2px}
.signed .sigimg{width:min(320px,100%);background:#FFFFFF;border:1px solid var(--line);border-radius:var(--r);padding:4px;margin-bottom:6px}
.signed p{margin:0}
.signed .nm{font-weight:700;font-size:16px}
.hint{font-size:13px;color:var(--ink-2);margin:0}

/* Unterschriften: Fußzeile */
.sigcol .hint{margin-top:-6px}
.sign-foot{display:grid;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}

/* Tagesansicht */
.ph-in.solo{padding-bottom:6px}
.ph-nav{width:40px;height:40px;flex:0 0 auto;border:1px solid var(--plate-line);border-radius:var(--r);background:transparent;color:var(--on-plate);display:grid;place-items:center}
.ph-nav .ic{width:18px;height:18px}
.ph-nav .tb-l{display:none}
.ph-nav.theme-btn{margin-right:6px}
.dtool{display:flex;gap:10px;align-items:flex-end;margin-top:14px;flex-wrap:wrap}
.dpick{display:grid;gap:4px}
.dpick span{font-size:13px;font-weight:600;color:var(--ink-2)}
.dpick input{width:auto;min-width:170px}
.kpis{display:flex;flex-wrap:wrap;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden;margin-top:14px}
.kpi{flex:1 1 160px;background:var(--surface);padding:10px 12px 12px;display:grid;gap:2px;align-content:start;min-width:0}
.kpi b{font-family:var(--font-c);font-weight:700;font-size:24px;line-height:1.15;font-variant-numeric:tabular-nums}
.kpi span{font-size:13px;line-height:1.3;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.kpi.dev{box-shadow:inset 0 3px 0 var(--dev)}
.dgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px;align-items:start}
@media (max-width:860px){.dgrid{grid-template-columns:1fr}}
.dcard{background:var(--surface);border:1px solid var(--line);border-top:2px solid var(--ink);border-radius:0 0 var(--r-m) var(--r-m);padding:12px;display:grid;gap:12px;min-width:0}
.dcard.none{border-top-color:var(--line-2)}
.dcard-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px;flex-wrap:wrap}
.dcard-h h3{margin:0;font-family:var(--font-c);font-weight:700;font-size:18px}
.dmeta{margin:-6px 0 0;font-size:14px;color:var(--ink-2)}
.dmeta b{color:var(--ink);font-weight:600}
.dprog{display:grid;gap:4px;font-size:13px;color:var(--ink-2)}
.dsec{display:grid;gap:6px}
.dsec h4{margin:0;font-size:13px;font-weight:600;color:var(--ink-2)}
.dlist{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.dlist li{font-size:14px;line-height:1.35;padding-left:10px;border-left:3px solid var(--dev-line)}
.dlist li small{display:block;font-size:13px;color:var(--ink-2);margin-top:2px}
.dkv{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;margin:0;font-size:14px}
.dkv dt{color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dkv dd{margin:0;font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.dnote{margin:0;font-size:14px;white-space:pre-wrap}
.dhand{display:grid;gap:2px;font-size:13px;color:var(--ink-2);border-top:1px solid var(--line);padding-top:10px}
.dhand b{color:var(--ink);font-weight:600}
.dhand .over{color:var(--ink);box-shadow:inset 3px 0 0 var(--dev-line);padding-left:8px}

/* Admin-Bearbeitung, Verweigerung, Historie */
.note-bar.admin{border-left-color:var(--err);background:var(--err-tint)}
.note-bar{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.note-bar .nb-btn{flex:0 0 auto}
.hint.rule{margin:-6px 0 14px}
.chk.refuse{color:var(--ink-2);font-weight:600;font-size:13px;min-height:32px}
.signed.refused .nm{margin-top:4px}
.log{list-style:none;margin:0;padding:0;display:grid;gap:0}
.log li{display:grid;grid-template-columns:130px 1fr;gap:10px;padding:7px 0;border-top:1px solid var(--line);font-size:13.5px}
.log li:first-child{border-top:0}
.log li.hint{display:block}
.log time{color:var(--ink-2);font-variant-numeric:tabular-nums}
.log small{display:block;color:var(--ink-2);font-size:12px}
.log li.adm{box-shadow:inset 3px 0 0 var(--err);padding-left:8px}
@media (max-width:520px){.log li{grid-template-columns:1fr;gap:2px}}

/* Kopf-Aktionen */
.ph-act{height:40px;flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;padding:0 12px;border:1px solid var(--plate-line);border-radius:var(--r);background:transparent;color:var(--on-plate);font-weight:600;font-size:14px;margin-left:6px}
.ph-act.primary{background:var(--on-plate);color:var(--plate);border-color:var(--on-plate)}
.ph-act:disabled{opacity:.6}
@media (max-width:560px){.ph-act span{display:none}.ph-act{padding:0 10px}}

/* Auswertung */
.xfilter{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-top:6px}
.xfilter .fld input{width:auto;min-width:160px}
.xact{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 10px}
.xtable-wrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m)}
.xtable{width:100%;border-collapse:collapse;font-size:13.5px;white-space:nowrap}
.xtable th{position:sticky;top:0;background:var(--surface-2);text-align:left;font-weight:600;color:var(--ink-2);padding:8px 10px;border-bottom:1px solid var(--line-2);font-size:12.5px;white-space:normal;vertical-align:bottom;min-width:40px}
.xtable td{padding:6px 10px;border-top:1px solid var(--line);vertical-align:middle}
.xtable tr:hover td{background:var(--surface-2)}
.xtable .num{text-align:right;font-variant-numeric:tabular-nums}
.xtable th.num{min-width:96px}
body[data-view="export"] .wrap{max-width:1240px}
.xtable td.over,.xtable td.devc{background:var(--dev-tint);font-weight:600}
.xtable .c-cb{width:36px;text-align:center}
.xtable .c-cb input{width:18px;height:18px;accent-color:var(--ink)}
.xtable .c-act{display:flex;gap:4px}
.xtable .tag{margin-left:4px}
.linkcell{background:none;border:0;padding:4px 0;font-weight:600;color:var(--ink);text-decoration:underline;text-underline-offset:3px;font-variant-numeric:tabular-nums}

/* Druckansicht A4 (immer hell, wie Papier) */
.a4wrap{padding:16px 8px 56px;overflow-x:auto}
.a4{width:210mm;min-height:297mm;margin:0 auto;background:#FFFFFF;color:#1C1F23;padding:13mm 12mm;box-shadow:0 1px 4px rgba(0,0,0,.25);font-size:9.5pt;line-height:1.35;color-scheme:light}
@media (max-width:840px){.a4{width:auto;min-height:0;padding:16px;font-size:13px}}
.a4-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;border-bottom:1.5pt solid #1C1F23;padding-bottom:6px}
.a4-head h1{margin:0;font-family:var(--font-c);font-size:16pt;line-height:1.15}
.a4-head p{margin:2px 0 0;color:#5B636B;font-size:8.5pt}
.a4-id{color:#5B636B;font-size:8.5pt;white-space:nowrap}
.a4-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:6px 14px;margin:10px 0 4px}
.a4-meta div{min-width:0}
.a4-meta dt{color:#5B636B;font-size:7.5pt}
.a4-meta dd{margin:0;font-weight:600}
.a4-t{width:100%;border-collapse:collapse;margin-top:9px;table-layout:fixed}
.a4-t col.w-mk{width:20px}
.a4-t col.w-st{width:76px}
.a4-t col.w-note{width:34%}
.a4-t td{overflow-wrap:anywhere}
.a4-t th{background:#23272B;color:#FFFFFF;text-align:left;font-family:var(--font-c);font-size:10pt;padding:3px 6px}
.a4-t td{border-bottom:.5pt solid #D5DADE;padding:3px 5px;vertical-align:top}
.a4-t tr{break-inside:avoid;page-break-inside:avoid}
.a4-t tr.dev td{background:#FFF6DF}
.a4-t .c-mk{width:16px}
.a4-t .c-st{width:64px;white-space:nowrap}
.a4-t tr.dev .c-st{font-weight:700;color:#8A5A00}
.a4-t .c-note{width:34%}
.a4-t small,.a4 .val{color:#5B636B;font-size:8pt}
.a4 .mk{display:inline-grid;place-items:center;width:11px;height:11px;border:1.2pt solid #5B636B;border-radius:2px;margin-top:2px}
.a4 .mk svg{width:9px;height:9px}
.a4 .mk.ok{background:#1F7A4B;border-color:#1F7A4B;color:#FFFFFF}
.a4 .mk.dev{background:#F2A100;border-color:#F2A100;color:#1C1F23}
.a4 .mk.na{background:#9AA2A9;border-color:#9AA2A9;color:#FFFFFF}
.a4-blk{margin-top:12px}
.a4-blk h2{font-size:10.5pt;margin:0 0 4px}
.a4 .pre{white-space:pre-wrap;margin:0}
.a4 .confirm{color:#1C1F23;font-size:9pt;margin:0 0 8px}
.a4-sigs{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.a4-sig{border-top:.5pt solid #D5DADE;padding-top:6px}
.a4-sig h3{margin:0 0 4px;font-size:9.5pt}
.a4-sig img{width:62mm;max-width:100%;display:block;margin:2px 0}
.a4-sig p{margin:0}
.a4-sig .nm{font-weight:700}
.a4-sig .ref{font-weight:700;color:#8A5A00}
.a4 .mut{color:#5B636B;font-size:8pt}
.a4-log{width:100%;border-collapse:collapse;font-size:8pt}
.a4-log td{border-bottom:.5pt solid #D5DADE;padding:2px 4px;vertical-align:top}
.a4-log td:first-child{white-space:nowrap;width:26mm}
.a4-log td:nth-child(2){width:30mm}
.a4-photos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.a4-photos figure{margin:0;break-inside:avoid}
.a4-photos img{width:100%;height:42mm;object-fit:cover;border:.5pt solid #D5DADE}
.a4-photos figcaption{font-size:7.5pt;color:#5B636B}
.a4-foot{margin:14px 0 0;color:#5B636B;font-size:7.5pt;border-top:.5pt solid #D5DADE;padding-top:4px}
.keep{break-inside:avoid;page-break-inside:avoid}
@media print{
  @page{size:A4;margin:10mm}
  :root{padding:0 !important}
  html,body{background:#FFFFFF !important}
  .topbar,.subnav,.ph,#toast,.overlay{display:none !important}
  .a4wrap{padding:0;overflow:visible}
  .a4{width:auto;min-height:0;margin:0;padding:0;box-shadow:none;font-size:9.5pt}
}

/* Benutzerverwaltung */
.roles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden;margin-top:6px}
@media (max-width:760px){.roles{grid-template-columns:1fr}}
.role{background:var(--surface);padding:10px 12px;display:grid;gap:2px;font-size:13.5px}
.role span{color:var(--ink-2)}
.sub-h{margin:0;font-family:var(--font-c);font-size:17px}
.ugrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
@media (max-width:760px){.ugrid{grid-template-columns:1fr 1fr}}
@media (max-width:460px){.ugrid{grid-template-columns:1fr}}
.xtable tr.inactive td{color:var(--ink-3)}
.xtable select{min-height:34px;padding:2px 6px;width:auto}
.cred{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0;padding:12px;border:1px solid var(--line-2);border-radius:var(--r);background:var(--surface-2)}
.cred dt{color:var(--ink-2);font-size:13px}
.cred dd{margin:0;font-weight:700;font-size:17px;font-variant-numeric:tabular-nums;letter-spacing:.02em;user-select:all}
.me-btn img{width:22px;height:22px;border-radius:50%}
body[data-view="users"] .wrap{max-width:1100px}

/* Overlays */
.overlay{position:fixed;inset:0;background:rgba(10,12,14,.6);display:flex;align-items:flex-end;justify-content:center;z-index:50;padding:12px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));padding-top:calc(12px + env(safe-area-inset-top,0px))}
@media (min-width:640px){.overlay{align-items:center}}
.sheet{background:var(--surface);color:var(--ink);border-radius:var(--r-m);width:100%;max-width:440px;padding:18px;max-height:100%;overflow:auto;display:grid;gap:12px}
.sheet-h{font-family:var(--font-c);font-weight:700;font-size:21px;margin:0}
.err{margin:0;color:var(--err);font-weight:600;font-size:14px}
.lb{max-width:960px;background:var(--plate);color:var(--on-plate)}
.lb-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.lb-cap{margin:0;font-weight:600}
.lb img{max-height:68vh;width:auto;max-width:100%;margin:0 auto;display:block;border-radius:var(--r);background:#000}
.lb .hint{color:var(--on-plate-2)}
.lb .ab,.lb .btn{background:transparent;color:var(--on-plate);border-color:var(--plate-line)}
.lb .btn.armed{background:var(--err);border-color:var(--err);color:#fff}

/* Vorlage */
.tpl-sec{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);margin-top:12px;padding:12px;display:grid;gap:10px}
.tpl-sec-h{display:flex;gap:4px;align-items:center}
.tpl-sec-h input{font-family:var(--font-c);font-weight:700;font-size:17px}
.tpl-item{display:grid;grid-template-columns:1fr auto;gap:6px;align-items:center;padding-top:10px;border-top:1px solid var(--line)}
.tpl-tools{display:flex;gap:4px;align-items:center}
.tpl-field{grid-column:1/-1;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.tpl-field select{width:auto;min-width:150px}
.tpl-field input[type=text]{flex:1 1 200px;width:auto}
.chk{display:inline-flex;align-items:center;gap:6px;font-size:14px;white-space:nowrap;min-height:36px}
.chk input{width:18px;height:18px;accent-color:var(--ink)}
@media (max-width:640px){.tpl-item{grid-template-columns:1fr}.tpl-tools{justify-content:flex-end}}
.savebar{position:sticky;bottom:0;z-index:5;background:var(--bg);padding:12px 0 calc(12px + env(safe-area-inset-bottom,0px));margin-top:18px;border-top:1px solid var(--line)}
.shift-starts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.backlink{display:inline-flex;align-items:center;gap:2px;height:40px;margin-top:8px;padding:0;border:0;background:none;color:var(--ink-2);font-weight:600}

#toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translate(-50%,16px);background:var(--primary);color:var(--on-primary);padding:10px 16px;border-radius:var(--r);font-weight:600;font-size:14px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:60;max-width:calc(100% - 32px)}
#toast.show{opacity:1;transform:translate(-50%,0)}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation:none !important;transition:none !important}}