/* Layout: mobile-first, eine Spalte (max 560px), Kopfzeile oben, Tab-Leiste unten, Karten nur für Prüfpunkte und Maßnahmen */
:root{
  --bg:#EEF2F1; --surface:#FFFFFF; --ink:#14211F; --muted:#586966; --line:#D3DBD9; --soft:#E5ECEA;
  --accent:#0E5A66; --accent-ink:#FFFFFF;
  --ok:#1E7A46; --ok-bg:#DDF1E5; --warn:#8F5A06; --warn-bg:#FBEACB; --bad:#B3261E; --bad-bg:#FADAD6; --na:#5E6D6A; --na-bg:#E3E9E7;
  --f-display:"Arial Narrow","Roboto Condensed","Helvetica Neue",Arial,sans-serif;
  --f-body:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#0E1514; --surface:#16211F; --ink:#E5EEEC; --muted:#93A5A1; --line:#2A3A37; --soft:#1F2D2B;
  --accent:#5CC0CF; --accent-ink:#06262B;
  --ok:#5BCB8B; --ok-bg:#17382A; --warn:#E8B04A; --warn-bg:#3A2D10; --bad:#FF8F85; --bad-bg:#401D1A; --na:#9AABA7; --na-bg:#233230; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0E1514; --surface:#16211F; --ink:#E5EEEC; --muted:#93A5A1; --line:#2A3A37; --soft:#1F2D2B;
  --accent:#5CC0CF; --accent-ink:#06262B;
  --ok:#5BCB8B; --ok-bg:#17382A; --warn:#E8B04A; --warn-bg:#3A2D10; --bad:#FF8F85; --bad-bg:#401D1A; --na:#9AABA7; --na-bg:#233230; color-scheme:dark}
*{box-sizing:border-box}
html,body{min-height:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:16px;line-height:1.4;padding-inline:0}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
h1,h2,h3{font-family:var(--f-display);margin:0;text-wrap:balance;line-height:1.15}
h2{font-size:1.45rem;font-weight:700}
h1{font-size:1.7rem;font-weight:700}
h3{font-size:1.1rem;font-weight:600}
.wrap{max-width:560px;margin-inline:auto;padding-inline:16px}
header.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--accent);color:var(--accent-ink)}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-block:10px}
.brand{font-family:var(--f-display);font-weight:700;font-size:1.15rem;letter-spacing:.02em;line-height:1.1}
.brand small{display:block;font-family:var(--f-body);font-weight:500;font-size:.72rem;opacity:.85;letter-spacing:.04em}
.who{display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-size:.7rem;min-width:0}
.who select{background:transparent;border:1px solid color-mix(in srgb,var(--accent-ink) 55%,transparent);color:var(--accent-ink);border-radius:6px;padding:4px 6px;font-size:.85rem;max-width:170px}
.who select option{color:#14211F}
main{padding-block:16px 110px;display:flex;flex-direction:column;gap:14px}
nav.tabs{position:fixed;inset-inline:0;bottom:0;z-index:20;background:var(--surface);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px)}
nav.tabs .wrap{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:4px;padding-block:6px}
nav.tabs button{background:none;border:0;border-radius:8px;padding:8px 2px;font-family:var(--f-display);font-weight:600;font-size:.95rem;color:var(--muted);position:relative}
nav.tabs button[aria-current="true"]{color:var(--accent);background:var(--soft)}
.badge{display:inline-block;min-width:1.35em;padding:0 6px;border-radius:99px;background:var(--bad);color:#fff;font-size:.72rem;line-height:1.35em;margin-left:4px}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:12px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.row.sp{justify-content:space-between}
.muted{color:var(--muted)}
.small{font-size:.85rem}
.label{font-family:var(--f-display);font-weight:600;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.btn{border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:12px 16px;font-weight:600;min-height:48px}
.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.btn.block{width:100%}
.btn.ghost{background:transparent}
.btn.sm{min-height:40px;padding:8px 12px;font-size:.92rem}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.btn.danger{color:var(--bad);border-color:var(--bad)}
input[type=text],input[type=email],input[type=password],input[type=date],select.f,textarea{width:100%;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:11px 12px;min-height:46px}
textarea{min-height:84px;resize:vertical}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{border:1px solid var(--line);background:var(--surface);border-radius:99px;padding:8px 14px;font-weight:500;min-height:40px}
.chip[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.yn{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.yn button{border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:10px;font-weight:600;min-height:46px}
.yn button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
/* Prüfpunkte */
.steps{display:flex;gap:6px}
.steps button{flex:1;border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:6px 0;font-family:var(--f-display);font-weight:700;font-size:1rem;position:relative;min-height:44px}
.steps button[aria-current="true"]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.steps button i{display:block;font-style:normal;font-family:var(--f-body);font-weight:500;font-size:.68rem;opacity:.8}
.point{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:10px}
.point.missing{border-color:var(--bad)}
.point p{margin:0;font-weight:500}
.rate{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.rate button{border:2px solid var(--line);background:var(--surface);border-radius:10px;min-height:54px;font-size:1.5rem;font-weight:700;line-height:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.rate button span{font-size:.62rem;font-weight:500;font-family:var(--f-body);color:var(--muted)}
.rate button[aria-pressed="true"]{color:#fff}
.rate .ok[aria-pressed="true"]{background:var(--ok);border-color:var(--ok)}
.rate .warn[aria-pressed="true"]{background:var(--warn);border-color:var(--warn)}
.rate .bad[aria-pressed="true"]{background:var(--bad);border-color:var(--bad)}
.rate .na[aria-pressed="true"]{background:var(--na);border-color:var(--na)}
.rate button[aria-pressed="true"] span{color:#fff}
:root[data-theme="dark"] .rate button[aria-pressed="true"]{color:#06120E}
:root[data-theme="dark"] .rate button[aria-pressed="true"] span{color:#06120E}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .rate button[aria-pressed="true"],:root:not([data-theme="light"]) .rate button[aria-pressed="true"] span{color:#06120E}}
.pill{display:inline-flex;align-items:center;gap:6px;border-radius:99px;padding:3px 10px;font-size:.8rem;font-weight:600;white-space:nowrap}
.pill.ok{background:var(--ok-bg);color:var(--ok)}
.pill.warn{background:var(--warn-bg);color:var(--warn)}
.pill.bad{background:var(--bad-bg);color:var(--bad)}
.pill.na{background:var(--na-bg);color:var(--na)}
.pill.acc{background:var(--soft);color:var(--accent)}
.thumbs{display:flex;gap:8px;flex-wrap:wrap}
.thumbs img{width:72px;height:72px;object-fit:cover;border-radius:8px;border:1px solid var(--line)}
.thumbs .x{position:relative}
.thumbs .x button{position:absolute;top:-6px;right:-6px;width:24px;height:24px;border-radius:99px;border:0;background:var(--bad);color:#fff;font-size:.85rem;line-height:1;padding:0}
.photo-btn{border:1px dashed var(--muted);background:transparent;border-radius:8px;min-height:44px;padding:8px 12px;font-weight:500;color:var(--muted)}
/* Sheet */
#sheet{position:fixed;inset:0;z-index:50;background:rgba(5,12,11,.55);display:none;align-items:flex-end;justify-content:center}
#sheet.open{display:flex}
.sheet{background:var(--bg);width:100%;max-width:560px;max-height:92%;overflow:auto;border-radius:16px 16px 0 0;padding:16px 16px calc(24px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:14px}
/* Zusammenfassung */
.sumline{font-family:var(--f-display);font-weight:700;font-size:1.3rem;line-height:1.25}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.stat{background:var(--soft);border-radius:10px;padding:10px 6px;text-align:center}
.stat b{display:block;font-family:var(--f-display);font-size:1.6rem;line-height:1;font-variant-numeric:tabular-nums}
.stat span{font-size:.7rem;color:var(--muted)}
.stat.bad b{color:var(--bad)}.stat.warn b{color:var(--warn)}
/* Maßnahmen */
.mcard{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:8px;text-align:left;width:100%;border-left-width:6px}
.mcard.warn{border-left-color:var(--warn)}.mcard.bad{border-left-color:var(--bad)}.mcard.done{border-left-color:var(--ok)}
.mcard b{font-weight:600}
.overdue{color:var(--bad);font-weight:600}
.quote{background:var(--soft);border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:6px}
.timeline{display:flex;flex-direction:column;gap:0;margin:0;padding:0;list-style:none}
.timeline li{padding:0 0 14px 18px;border-left:2px solid var(--line);position:relative;display:flex;flex-direction:column;gap:4px}
.timeline li::before{content:"";position:absolute;left:-6px;top:4px;width:10px;height:10px;border-radius:99px;background:var(--accent)}
.timeline li:last-child{border-left-color:transparent}
/* Protokoll */
.doc{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:14px}
.doc table{width:100%;border-collapse:collapse;font-size:.92rem}
.doc td,.doc th{padding:6px 4px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.doc th{font-family:var(--f-display);font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.scroll-x{overflow-x:auto}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(86px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:10px;z-index:80;max-width:90%;text-align:center;font-weight:500}
.demo{font-size:.72rem;font-weight:600;background:var(--warn-bg);color:var(--warn);border-radius:6px;padding:2px 6px;letter-spacing:.04em}
.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:0}
.kv dt{color:var(--muted)}.kv dd{margin:0;min-width:0;overflow-wrap:anywhere}
.notice{border:1px solid var(--warn);background:var(--warn-bg);color:var(--warn);border-radius:10px;padding:10px 12px;font-size:.9rem}
.switch{display:flex;align-items:center;justify-content:space-between;gap:12px}
@media (prefers-reduced-motion:no-preference){.btn,.chip{transition:background .12s}}

.login{min-height:70vh;display:flex;flex-direction:column;justify-content:center;gap:16px;padding-block:32px}
.err{background:var(--bad-bg);color:var(--bad);border-radius:10px;padding:10px 12px;font-size:.92rem}
.sitebar{display:flex;gap:8px;align-items:center}
.sitebar select{flex:1;min-width:0}
.hdr-btn{background:transparent;border:1px solid color-mix(in srgb,var(--accent-ink) 55%,transparent);color:var(--accent-ink);border-radius:6px;padding:4px 8px;font-size:.8rem}
.tabs-sm{display:flex;gap:6px;flex-wrap:wrap}
.tempbox{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:1.1rem;background:var(--soft);padding:10px 12px;border-radius:8px;user-select:all;overflow-wrap:anywhere}
.item-edit{display:flex;flex-direction:column;gap:6px;border-top:1px solid var(--line);padding-top:10px}
.check{display:flex;align-items:center;gap:8px}
.check input{width:22px;height:22px}
.sr{position:absolute;left:-9999px}
a.btn{display:block;text-align:center;text-decoration:none;color:inherit;padding-top:13px}
a.btn.primary{color:var(--accent-ink)}
nav.tabs .wrap{padding-inline:8px}
nav.tabs button{font-size:.85rem;padding:8px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}