:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f4f7fb;background:#09101a;--glass:rgba(26,35,49,.68);--line:rgba(255,255,255,.12);--muted:#aeb9c8;--accent:#78d8ff;--good:#8be0b0;--bad:#ff9d9d}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 10% 10%,#183757 0,transparent 36%),radial-gradient(circle at 90% 20%,#263753 0,transparent 38%),linear-gradient(145deg,#07101b,#111a27 62%,#090f18);background-attachment:fixed}button,input,select,textarea{font:inherit}.hidden{display:none!important}.glass{background:var(--glass);backdrop-filter:blur(24px) saturate(135%);-webkit-backdrop-filter:blur(24px) saturate(135%);border:1px solid var(--line);box-shadow:0 20px 70px rgba(0,0,0,.28)}.splash{position:fixed;inset:0;display:grid;place-content:center;gap:12px;text-align:center;background:#09101a;z-index:20}.splash span,.muted{color:var(--muted)}.mark{width:44px;height:44px;border-radius:15px;display:grid;place-items:center;font-weight:900;background:linear-gradient(145deg,rgba(120,216,255,.95),rgba(138,126,255,.92));box-shadow:inset 0 1px rgba(255,255,255,.55),0 8px 26px rgba(69,153,255,.25)}.login{min-height:100vh;display:grid;place-items:center;padding:24px}.auth{width:min(420px,100%);padding:30px;border-radius:28px}.auth h1{margin-bottom:4px}.auth label:not(.check),.form label{display:grid;gap:7px;margin-top:16px;color:var(--muted)}input,select,textarea{width:100%;color:#fff;background:rgba(3,8,14,.58);border:1px solid var(--line);border-radius:13px;padding:12px 13px;outline:none}input:focus,select:focus,textarea:focus{border-color:rgba(120,216,255,.65);box-shadow:0 0 0 3px rgba(120,216,255,.12)}button{border:0;border-radius:13px;padding:11px 15px;color:#07101a;font-weight:750;background:#b6eaff;cursor:pointer}.auth button{width:100%;margin-top:20px}.check{display:flex;gap:9px;align-items:center;margin-top:16px}.check input{width:auto}.error{color:var(--bad);min-height:1.2em}.shell{min-height:100vh;display:grid;grid-template-columns:240px 1fr;gap:18px;padding:18px}.sidebar{border-radius:26px;padding:18px;display:flex;flex-direction:column;position:sticky;top:18px;height:calc(100vh - 36px)}.brand{display:flex;align-items:center;gap:11px;margin-bottom:22px}.sidebar nav{display:grid;gap:7px}.sidebar nav button,.ghost{background:transparent;color:var(--muted);text-align:left}.sidebar nav button.active,.sidebar nav button:hover{background:rgba(255,255,255,.1);color:#fff}.sidebar .ghost{margin-top:auto}.content{padding:8px 6px 30px;min-width:0}.content header{display:flex;align-items:center;justify-content:space-between;margin:0 4px 20px}.content header h1{margin:2px 0}.content header small{color:var(--muted)}.pill{border:1px solid var(--line);background:rgba(255,255,255,.06);padding:9px 12px;border-radius:999px;color:var(--muted)}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.card{border-radius:22px;padding:20px;background:rgba(24,34,48,.66);border:1px solid var(--line);box-shadow:0 16px 50px rgba(0,0,0,.18)}.card h2,.card h3{margin-top:0}.metric span{color:var(--muted)}.metric strong{display:block;font-size:clamp(1.5rem,3vw,2.5rem);margin-top:8px}.good{color:var(--good)}.bad{color:var(--bad)}.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}.toolbar input{max-width:320px}.table{overflow:auto;border-radius:20px;border:1px solid var(--line)}table{width:100%;border-collapse:collapse;min-width:640px;background:rgba(15,23,34,.65)}th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line)}th{color:var(--muted);font-size:.8rem}.tag{display:inline-block;padding:3px 7px;margin:2px;border-radius:999px;background:rgba(120,216,255,.13);color:#c8f1ff;font-size:.78rem}.form{display:grid;grid-template-columns:repeat(2,1fr);gap:0 14px}.form .wide{grid-column:1/-1}.form button{margin-top:18px;align-self:end}.actions{display:flex;gap:8px}.camera{display:block;border:1px dashed rgba(120,216,255,.5);padding:24px;border-radius:18px;text-align:center;cursor:pointer;background:rgba(120,216,255,.06)}.camera input{display:none}.toast{position:fixed;right:22px;bottom:22px;z-index:30;padding:12px 16px;border-radius:14px;background:#d8f5ff;color:#07101a;font-weight:700;box-shadow:0 12px 40px #0008}.stack{display:grid;gap:12px}.task{display:flex;justify-content:space-between;gap:12px;align-items:center}.task.done{opacity:.55}.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}@media(max-width:900px){.shell{grid-template-columns:1fr;padding:10px}.sidebar{height:auto;position:static;display:block;border-radius:20px}.brand{margin-bottom:10px}.sidebar nav{display:flex;overflow:auto}.sidebar nav button{white-space:nowrap}.sidebar .ghost{margin-top:10px}.grid,.admin-grid{grid-template-columns:1fr}.content{padding:4px}.content header{align-items:flex-start}.pill{max-width:45vw;overflow:hidden;text-overflow:ellipsis}.form{grid-template-columns:1fr}.form .wide{grid-column:auto}}@media(prefers-reduced-motion:no-preference){.splash .mark{animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{50%{transform:scale(1.06);filter:brightness(1.14)}}}
/* Shared touch defaults; compact screens are the primary application layout. */
:root { --safe-top: env(safe-area-inset-top, 0px); --safe-right: env(safe-area-inset-right, 0px); --safe-bottom: env(safe-area-inset-bottom, 0px); --safe-left: env(safe-area-inset-left, 0px); --home-clearance: max(20px, var(--safe-bottom)); }
html { color-scheme: dark; -webkit-text-size-adjust: 100%; scroll-padding-block: calc(var(--safe-top) + 16px) calc(100px + var(--home-clearance)); }
body { min-height: 100dvh; }
button, input, select, textarea { min-height: 48px; font-size: 16px; }
button { touch-action: manipulation; }
button:disabled { opacity: .55; cursor: wait; }
button:focus-visible, summary:focus-visible, .camera:focus-within { outline: 3px solid var(--accent); outline-offset: 3px; }
input, select, textarea, .form, .form > *, .grid > *, .admin-grid > *, .task > * { min-width: 0; }
textarea { min-height: 112px; resize: vertical; }
input[type=checkbox] { width: 24px; height: 24px; min-height: 24px; flex: 0 0 24px; accent-color: var(--accent); }
.form label.check { display: flex; align-items: center; min-height: 48px; }
.check { min-height: 48px; }
.card, .task, td, .pill, .muted { overflow-wrap: anywhere; }
.actions { flex-wrap: wrap; }
.actions > button { flex: 1 1 auto; }
.toolbar > * { min-width: 0; }
.nav-primary, .nav-secondary { display: grid; gap: 7px; }
.sidebar nav .nav-more { display: none; }
.nav-icon { display: none; }
.cell-label { display: none; }
.empty-cell { text-align: center; padding: 24px; }
.pwa-update { position: fixed; z-index: 25; bottom: 24px; right: 24px; max-width: 420px; padding: 14px; border-radius: 18px; background: #19364b; border: 1px solid var(--accent); box-shadow: 0 8px 24px #0008; }
.pwa-update button { margin-top: 8px; width: 100%; }
.form-actions { display: flex; flex-wrap: wrap; gap: 8px; grid-column: 1 / -1; margin: 16px 0; }
.form-actions button { margin: 0; flex: 1; }
.admin-section > summary { cursor: pointer; padding: 8px 0; min-height: 48px; font-size: 1.2rem; font-weight: 700; }
.admin-section[open] > summary { margin-bottom: 12px; }
.camera { min-height: 100px; display: flex; align-items: center; justify-content: center; }
.receipt-sources { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.receipt-sources button { width: 100%; margin: 0; }
.receipt-sources .ghost { border: 1px solid var(--line); background: rgba(120,216,255,.06); }
.ocr-text { margin: 14px 0; }
.ocr-text summary { min-height: 48px; cursor: pointer; }
.ocr-text pre { white-space: pre-wrap; overflow-wrap: anywhere; font-size: .875rem; max-height: 50dvh; overflow: auto; padding: 12px; background: #0b1420; border-radius: 12px; }
.camera input { display: block; position: absolute; width: 1px; height: 1px; min-height: 0; opacity: 0; }
#offlineStatus { max-width: 100%; margin-bottom: 14px; white-space: normal; text-align: left; }
.content header .pill { max-width: 100%; }
.content header h1:focus { outline: none; }
.login { min-height: 100dvh; padding: calc(16px + var(--safe-top)) calc(16px + var(--safe-right)) calc(16px + var(--safe-bottom)) calc(16px + var(--safe-left)); }
@media (max-width: 1024px), (hover: none) and (pointer: coarse) {
  body { background: #0b1420; }
  .shell { display: block; width: 100%; min-height: 100dvh; padding: calc(12px + var(--safe-top)) calc(12px + var(--safe-right)) calc(96px + var(--home-clearance)) calc(12px + var(--safe-left)); }
  .content { padding: 0; }
  .content header { margin: 0 0 14px; gap: 10px; flex-wrap: wrap; }
  .content header h1 { font-size: 1.65rem; }
  .content header .pill { font-size: .8rem; padding: 8px 12px; max-width: 100%; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .sidebar { position: fixed; display: flex; flex-direction: column; top: auto; bottom: 0; left: 0; right: 0; z-index: 15; height: auto; max-height: calc(100dvh - var(--safe-top) - 16px); overflow-y: auto; border-radius: 20px 20px 0 0; padding: 10px calc(8px + var(--safe-right)) calc(8px + var(--home-clearance)) calc(8px + var(--safe-left)); background: #142132; box-shadow: 0 -6px 24px #0004; }
  .sidebar .brand { display: none; }
  .sidebar nav { display: contents; }
  .nav-primary { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 2px; order: 3; flex: 0 0 auto; }
  .sidebar nav button { white-space: normal; text-align: center; min-width: 0; padding: 7px 2px; font-size: .75rem; border-radius: 12px; min-height: 58px; }
  .sidebar nav .nav-primary button { font-size: 11px; font-weight: 500; }
  .nav-primary .nav-label { display: block; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.3; }
  .sidebar nav .nav-more { display: block; }
  .nav-icon { display: block; font-size: 1.3rem; line-height: 1.3; margin-bottom: 3px; }
  .nav-icon svg { display: block; margin: 0 auto; }
  .nav-secondary { display: none; }
  .sidebar[data-open=true] .nav-secondary { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; padding: 8px 4px 12px; order: 1; overflow-y: auto; min-height: 0; }
  .sidebar[data-open=true] .nav-secondary button { font-size: 1rem; text-align: left; padding: 12px; }
  .sidebar .ghost { display: none; margin: 0; }
  .sidebar[data-open=true] > .ghost { display: block; width: 100%; padding: 12px; border-top: 1px solid var(--line); order: 2; flex: 0 0 auto; }
  .card { border-radius: 18px; padding: 16px; }
  .card .card { padding: 12px; }
  .grid, .admin-grid, .form { grid-template-columns: minmax(0,1fr); gap: 12px; }
  .form label { margin-top: 4px; }
  .form .wide { grid-column: 1; }
  .form button { width: 100%; }
  .toolbar { display: grid; grid-template-columns: minmax(0,1fr); }
  .toolbar input { max-width: none; }
  .toolbar button { width: 100%; }
  .receipt-sources { grid-template-columns: minmax(0,1fr); }
  .task { align-items: stretch; flex-direction: column; border-bottom: 1px solid var(--line); padding: 12px 0; }
  .task .actions { width: 100%; }
  .auth { padding: 22px 18px; border-radius: 22px; }
  .table { border: 0; overflow: visible; border-radius: 0; }
  table { display: block; min-width: 0; background: transparent; }
  /* Keep column headings available to assistive technology. */
  thead { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  tbody { display: grid; gap: 12px; }
  tbody tr { display: block; border: 1px solid var(--line); border-radius: 14px; padding: 10px 12px; background: rgba(15,23,34,.65); min-width: 0; }
  tbody td { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: 8px; padding: 8px 0; min-width: 0; border: 0; align-items: start; }
  .cell-label { display: block; color: var(--muted); font-size: .875rem; }
  .cell-value { min-width: 0; overflow-wrap: anywhere; }
  tbody td[data-label=Aktion] { display: block; }
  tbody td[data-label=Aktion] .cell-label { display: none; }
  tbody td.empty-cell { display: block; }
  tbody td.empty-cell .cell-label { display: none; }
  .toast { left: calc(12px + var(--safe-left)); right: calc(12px + var(--safe-right)); bottom: calc(96px + var(--home-clearance)); max-height: 40dvh; overflow-y: auto; }
  .pwa-update { left: calc(12px + var(--safe-left)); right: calc(12px + var(--safe-right)); bottom: calc(96px + var(--home-clearance)); max-width: none; }
  .keyboard-open .sidebar { display: none; }
  .keyboard-open .shell { padding-bottom: 24px; }
  .keyboard-open .toast, .keyboard-open .pwa-update { bottom: 12px; }
}
@media (max-width: 360px) {
  .card { padding: 12px; }
  tbody td { grid-template-columns: minmax(0,1fr); gap: 3px; }
  .actions { flex-direction: column; }
}
@media (min-width: 1025px) and (hover: hover) and (pointer: fine) {
  .admin-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}