/* Stundenmeldung — Gestaltung nach James' Vorschau „Stundenmeldung Baustelle“ (16.09.2026) */
:root{--ground:#E8E6E1;--surface:#FFFFFF;--surface-2:#F4F2EE;--sunk:#DEDBD4;--ink:#1C1A17;--ink-soft:#5E5950;--ink-faint:#8C867B;
  --rule:#CFCAC1;--rule-soft:#E2DED7;--anchor:#2B3A42;--signal:#B4651A;--signal-soft:#F6E7D6;--signal-line:#D9A06B;
  --ok:#2F6B4F;--ok-soft:#DFEDE5;--warn:#96581A;--warn-soft:#F7ECDC;--off:#6E6A63;--off-soft:#E4E1DB;
  --schatten:0 1px 2px rgba(28,26,23,.06),0 10px 28px -20px rgba(28,26,23,.35)}
@media (prefers-color-scheme:dark){:root{--ground:#16181A;--surface:#1F2326;--surface-2:#262B2F;--sunk:#14171A;--ink:#E9E6E0;--ink-soft:#A8A299;
  --ink-faint:#7C766D;--rule:#343A3F;--rule-soft:#2A3034;--anchor:#9DB4C0;--signal:#E0913F;--signal-soft:#312415;--signal-line:#7A5322;
  --ok:#77B795;--ok-soft:#1B2C23;--warn:#D6A05A;--warn-soft:#2B2113;--off:#8B857C;--off-soft:#262A2D;
  --schatten:0 1px 2px rgba(0,0,0,.5),0 10px 28px -20px rgba(0,0,0,.8)}}
*{box-sizing:border-box}
body{background:var(--ground);color:var(--ink);font:14px/1.45 -apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;margin:0;padding-inline:16px;padding-block:0 40px}
.wrap{max-width:760px;margin:0 auto}
a{color:var(--signal)}
.vorschau{background:var(--warn-soft);border:1px solid var(--signal-line);border-radius:8px;padding:12px 14px;margin-block:16px;font-size:13.5px}
header.kopf{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 14px;padding-block:18px 14px;border-bottom:2px solid var(--anchor)}
h1{font-weight:700;font-size:23px;margin:0;letter-spacing:-.01em}
.firma{font-family:ui-monospace,Menlo,monospace;font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-faint)}
.wer{margin-left:auto;font-size:13px;color:var(--ink-soft);text-align:right}.wer b{color:var(--ink);font-weight:600}
.kopfzeile{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-block:16px}
@media(max-width:520px){.kopfzeile{grid-template-columns:1fr}}
label.feld{display:flex;flex-direction:column;gap:5px}
label.feld span{font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-soft);font-weight:600}
input,select,textarea{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--rule);border-radius:7px;padding:10px 11px;min-height:44px;width:100%}
input:focus-visible,select:focus-visible,button:focus-visible{outline:2.5px solid var(--signal);outline-offset:2px}
h2{font-size:13px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-soft);margin:26px 0 10px;font-weight:600}
.leute{display:flex;flex-direction:column;gap:10px}
.person{background:var(--surface);border:1px solid var(--rule-soft);border-radius:10px;box-shadow:var(--schatten);overflow:hidden}
.person.aus{opacity:.6}
.pkopf{display:flex;align-items:center;gap:10px;padding:11px 13px;background:var(--surface-2);border-bottom:1px solid var(--rule-soft)}
.name{font-weight:600;font-size:15.5px}
.marke{font-family:ui-monospace,Menlo,monospace;font-size:10.5px;letter-spacing:.06em;padding:2px 7px;border-radius:999px;background:var(--off-soft);color:var(--off);text-transform:uppercase}
.marke.sub{background:var(--signal-soft);color:var(--warn)}
.da{margin-left:auto;display:flex;align-items:center;gap:7px;font-size:13px;color:var(--ink-soft);cursor:pointer;user-select:none}
.da input{width:20px;height:20px;min-height:0;accent-color:var(--signal)}
.zeilen{padding:11px 13px 13px;display:flex;flex-direction:column;gap:9px}
.zeile{display:grid;grid-template-columns:86px 1fr 1fr auto;gap:8px;align-items:end}
@media(max-width:620px){.zeile{grid-template-columns:86px 1fr;grid-template-areas:"std ort" "tat tat" "weg weg"}
  .zeile .c-std{grid-area:std}.zeile .c-ort{grid-area:ort}.zeile .c-tat{grid-area:tat}.zeile .c-weg{grid-area:weg}}
.zeile input[type=number]{font-family:ui-monospace,Menlo,monospace;font-variant-numeric:tabular-nums;text-align:right}
.klein{font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-faint);display:block;margin-bottom:4px;font-weight:600}
button{font:inherit;cursor:pointer;border-radius:7px;border:1px solid var(--rule);background:var(--surface);color:var(--ink);padding:9px 13px;min-height:44px}
button.still{background:transparent;color:var(--ink-soft);min-height:38px;padding:6px 11px;font-size:13px}
button.weg{border:none;background:transparent;color:var(--ink-faint);min-height:38px;padding:6px 9px;font-size:18px;line-height:1}
button.weg:hover{color:var(--warn)}
.plus{margin-top:2px;align-self:flex-start}
.summe{margin-top:22px;background:var(--surface);border:1px solid var(--rule);border-radius:10px;box-shadow:var(--schatten);padding:15px 16px}
.summe .zahlen{display:flex;flex-wrap:wrap;gap:22px 34px;align-items:baseline}
.zahl{display:flex;flex-direction:column;gap:2px}
.zahl b{font-family:ui-monospace,Menlo,monospace;font-size:27px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--anchor);line-height:1}
.zahl span{font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-faint);font-weight:600}
.pruef{margin-top:13px;padding-top:12px;border-top:1px solid var(--rule-soft);font-size:13.5px;color:var(--ink-soft)}
.pruef.fehlt{color:var(--warn)}.pruef.gut{color:var(--ok)}
#tag-hinweis,#login-fehler{border:1px solid var(--signal-line);border-radius:8px;padding:10px 12px;margin-top:8px;background:var(--warn-soft)}
.senden{margin-top:16px;display:flex;flex-wrap:wrap;gap:12px;align-items:center}
button.ab{background:var(--signal);border-color:var(--signal);color:#fff;font-weight:600;font-size:16px;padding:13px 24px}
button.ab:disabled{opacity:.45;cursor:not-allowed}
.hinweis{font-size:13px;color:var(--ink-faint);max-width:42ch}
.ergebnis{margin-top:22px;border:1px solid var(--signal-line);border-radius:10px;background:var(--surface);box-shadow:var(--schatten);overflow:hidden}
.ergebnis h3{font-size:13px;letter-spacing:.07em;text-transform:uppercase;margin:0;padding:12px 15px;background:var(--signal-soft);color:var(--warn);border-bottom:1px solid var(--signal-line)}
.ergebnis .inhalt{padding:6px 0 10px}
table{width:100%;border-collapse:collapse;font-size:13.5px}
th{font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-faint);text-align:left;padding:8px 15px;border-bottom:1px solid var(--rule-soft);font-weight:600}
td{padding:9px 15px;border-bottom:1px solid var(--rule-soft);vertical-align:top}
tr:last-child td{border-bottom:none}
td.n{font-family:ui-monospace,Menlo,monospace;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.tbl{overflow-x:auto}
.fuss{padding:11px 15px;font-size:12.5px;color:var(--ink-soft);background:var(--surface-2);border-top:1px solid var(--rule-soft)}
.fuss code{font-family:ui-monospace,Menlo,monospace;font-size:12px;color:var(--ink)}
