/* Fahrtenbuch – Oberfläche (mobil zuerst, hell und dunkel) */
:root {
  --bg:#f4f4f5; --card:#ffffff; --card2:#ededef; --line:#e1e1e5; --text:#18181b; --muted:#6a6a74;
  --accent:#6c5ce7; --accent-soft:#ece9ff; --accent2:#ff7eb3;
  --ok:#17a56a; --ok-soft:#dcf5e8; --warn:#d98a0f; --warn-soft:#fff1d6; --err:#e5484d; --err-soft:#ffe3e4;
  --audi:#ff4d6d; --fiat:#2ec4b6; --other:#8b93a7;
  --shadow:0 0.5rem 1.5rem rgba(0,0,0,.08); --shadow-sm:0 1px 0.25rem rgba(0,0,0,.06);
  --r:1.25rem; --nav-h:4.125rem; --tap:2.875rem;
  color-scheme:light;
}
:root[data-theme="dark"] {
  --bg:#0c0c0e; --card:#17171a; --card2:#212125; --line:#2c2c32; --text:#f1f1f3; --muted:#9a9aa4;
  --accent:#8b7cff; --accent-soft:#2a2650; --ok-soft:#14382a; --warn:#f0a93a; --warn-soft:#3b2f12; --err-soft:#3f1c20;
  --shadow:0 0.5rem 1.5rem rgba(0,0,0,.5); --shadow-sm:0 1px 0.25rem rgba(0,0,0,.4);
  color-scheme:dark;
}
* { box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
/* Kein Pinch-Zoom, kein seitliches Scrollen der Seite; Karten regeln Gesten selbst. */
html { height:100%; overflow-x:hidden; overscroll-behavior-x:none; touch-action:manipulation; }
body { overflow-x:hidden; overscroll-behavior-x:none; max-width:100vw; }
.leaflet-container { touch-action:none; }
body { margin:0; background:var(--bg); color:var(--text); font:0.9375rem/1.45 system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; padding-bottom:calc(var(--nav-h) + env(safe-area-inset-bottom) + 1.25rem); -webkit-font-smoothing:antialiased; }
body.locked { overflow:hidden; }
button, input, select, textarea { font:inherit; color:inherit; }
button { cursor:pointer; border:0; background:none; padding:0; }
a { color:var(--accent); text-decoration:none; }
h1, h2, h3 { margin:0; font-weight:800; letter-spacing:-.01em; }
.muted { color:var(--muted); }
.help { color:var(--muted); font-size:0.8125rem; line-height:1.5; margin:0.375rem 0; }
.wrap { max-width:45rem; margin:0 auto; padding:0 0.875rem; }
[hidden] { display:none !important; }

/* Kopf */
.top { display:flex; align-items:center; justify-content:space-between; gap:0.75rem; padding:calc(0.875rem + env(safe-area-inset-top)) 1rem 0.375rem; max-width:45rem; margin:0 auto; }
.hello { display:flex; align-items:center; gap:0.75rem; min-width:0; }
.avatar { width:2.875rem; height:2.875rem; border-radius:1rem; background:linear-gradient(135deg, var(--accent), var(--accent2)); color:#fff; display:grid; place-items:center; font-weight:800; font-size:1.25rem; box-shadow:var(--shadow-sm); flex:none; }
.hi { font-size:1.25rem; font-weight:800; letter-spacing:-.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sub { font-size:0.8125rem; color:var(--muted); }
.icon-btn { width:2.5rem; height:2.5rem; border-radius:0.875rem; background:var(--card); box-shadow:var(--shadow-sm); display:grid; place-items:center; font-size:1.0625rem; color:var(--text); flex:none; }
.icon-btn:active { transform:scale(.94); }

/* Fahrzeugleiste */
.vehbar { display:flex; gap:0.5rem; overflow-x:auto; padding:0.5rem 1rem 0.25rem; max-width:45rem; margin:0 auto; scrollbar-width:none; }
.vehbar::-webkit-scrollbar { display:none; }
.vpill { display:flex; align-items:center; gap:0.5625rem; padding:0.4375rem 0.875rem 0.4375rem 0.6875rem; border-radius:62.4375rem; background:var(--card); box-shadow:var(--shadow-sm); border:0.125rem solid transparent; color:var(--text); text-align:left; flex:none; min-height:var(--tap); }
.vdot { width:0.75rem; height:0.75rem; border-radius:50%; background:var(--c, var(--accent)); box-shadow:0 0 0 0.25rem color-mix(in srgb, var(--c, var(--accent)) 22%, transparent); flex:none; }
.vpill b { display:block; font-size:0.875rem; line-height:1.15; }
.vpill small { display:block; color:var(--muted); font-size:0.7188rem; }
.vpill.on { border-color:var(--c); background:color-mix(in srgb, var(--c) 10%, var(--card)); }
.vpill:active { transform:scale(.97); }

/* Hero */
.hero { margin:0.625rem 0 0.75rem; padding:1rem 1.125rem; border-radius:1.5rem; color:#fff; background:linear-gradient(135deg, #6c5ce7 0%, #8e7bff 45%, #ff7eb3 100%); box-shadow:0 0.5rem 1.25rem rgba(0,0,0,.18); position:relative; overflow:hidden; }
.hero::after { content:""; position:absolute; right:-2.5rem; top:-3.125rem; width:11.25rem; height:11.25rem; border-radius:50%; background:rgba(255,255,255,.14); pointer-events:none; }
.hero-top { display:flex; align-items:center; justify-content:space-between; gap:0.75rem; position:relative; }
.hero-km { font-size:2.375rem; font-weight:800; letter-spacing:-.03em; line-height:1; font-variant-numeric:tabular-nums; }
.hero-km small { font-size:1rem; font-weight:600; opacity:.85; }
.hero-sub { opacity:.9; font-size:0.8438rem; margin-top:0.3125rem; }
.ring { position:relative; width:4.5rem; height:4.5rem; flex:none; }
.ring svg { width:4.5rem; height:4.5rem; transform:rotate(-90deg); }
.ring circle { fill:none; stroke-width:7; stroke-linecap:round; }
.ring .bg { stroke:rgba(255,255,255,.25); }
.ring .fg { stroke:#fff; transition:stroke-dashoffset .8s cubic-bezier(.2,.8,.2,1); }
.ring span { position:absolute; inset:0; display:grid; place-items:center; font-weight:800; font-size:0.875rem; }
.hero .btn.primary { margin-top:0.875rem; background:#fff; color:#4b3fd6; box-shadow:0 0.375rem 1.125rem rgba(0,0,0,.15); }
.hero-done { margin-top:0.75rem; font-weight:700; background:rgba(255,255,255,.18); padding:0.625rem 0.75rem; border-radius:0.875rem; display:inline-block; position:relative; }

/* Chips */
.chipbar { display:flex; gap:0.5rem; overflow-x:auto; padding:0.25rem 0.875rem 0.5rem; scrollbar-width:none; margin:0 -0.875rem; }
.chipbar::-webkit-scrollbar { display:none; }
.chip { display:inline-flex; align-items:center; gap:0.375rem; padding:0.5rem 0.875rem; border-radius:62.4375rem; background:var(--card); box-shadow:var(--shadow-sm); color:var(--text); font-size:0.8438rem; font-weight:600; white-space:nowrap; border:0.125rem solid transparent; min-height:2.5rem; flex:none; }
.chip.on { background:var(--accent); color:#fff; border-color:var(--accent); }
.chip.ghost { background:transparent; box-shadow:none; border:0.125rem dashed var(--line); color:var(--muted); }
.chip.tpl { border-color:color-mix(in srgb, var(--c, var(--accent)) 45%, transparent); background:color-mix(in srgb, var(--c, var(--accent)) 12%, var(--card)); }
.chip.recent { background:var(--card2); box-shadow:none; }
.chip:active { transform:scale(.96); }
.chips { display:flex; flex-wrap:wrap; gap:0.5rem; }
.chips.scroll { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; padding:0.125rem 1.125rem 0.375rem; margin:0 -1.125rem; }
.chips.scroll::-webkit-scrollbar { display:none; }

/* Tagesgruppen und Fahrten */
.day { margin-bottom:0.375rem; }
.dayhead { position:sticky; top:0; z-index:3; display:flex; justify-content:space-between; align-items:center; padding:0.625rem 0.25rem 0.5rem; font-weight:800; font-size:0.875rem; background:linear-gradient(var(--bg) 75%, transparent); }
.daykm { font-weight:600; color:var(--muted); font-size:0.8125rem; font-variant-numeric:tabular-nums; }
.trip { display:grid; grid-template-columns:auto auto 1fr auto; gap:0 0.75rem; align-items:center; background:var(--card); border-radius:var(--r); padding:0.8125rem 0.875rem 0.8125rem 1rem; margin-bottom:0.625rem; box-shadow:var(--shadow-sm); position:relative; border:0.125rem solid transparent; animation:pop .35s both; user-select:none; -webkit-user-select:none; cursor:pointer; }
.trip::before { content:""; position:absolute; left:0; top:1rem; bottom:1rem; width:0.25rem; border-radius:0 0.25rem 0.25rem 0; background:var(--vc); }
.trip.open { border-style:dashed; border-color:color-mix(in srgb, var(--warn) 55%, transparent); }
.trip:active { transform:scale(.985); }
.t-check { display:none; width:1.625rem; height:1.625rem; border-radius:50%; border:0.125rem solid var(--line); place-items:center; }
.t-check span { width:0.875rem; height:0.875rem; border-radius:50%; background:var(--accent); transform:scale(0); transition:transform .15s; }
body.selecting .t-check { display:grid; }
body.selecting .fab { display:none; }
.trip.sel { border-color:var(--accent); background:color-mix(in srgb, var(--accent) 8%, var(--card)); }
.trip.sel .t-check span { transform:scale(1); }
.t-time { display:flex; flex-direction:column; min-width:3.125rem; font-size:0.7188rem; color:var(--muted); line-height:1.3; }
.t-time b { font-size:1rem; color:var(--text); font-variant-numeric:tabular-nums; }
.t-main { min-width:0; }
.t-route { font-weight:650; font-size:0.9062rem; line-height:1.35; display:flex; flex-wrap:wrap; align-items:center; gap:0.1875rem 0.375rem; word-break:break-word; }
.pin { width:0.5625rem; height:0.5625rem; border-radius:50%; display:inline-block; flex:none; background:var(--vc); }
.pin.a { opacity:.5; }
.arr { color:var(--muted); font-weight:400; }
.t-tags { display:flex; flex-wrap:wrap; gap:0.3125rem; margin-top:0.375rem; }
.tag { font-size:0.7188rem; font-weight:650; padding:0.1875rem 0.5rem; border-radius:62.4375rem; background:var(--card2); color:var(--muted); }
.tag.cat { background:color-mix(in srgb, var(--c) 16%, var(--card)); color:color-mix(in srgb, var(--c) 75%, var(--text)); }
.tag.veh { background:color-mix(in srgb, var(--c) 14%, var(--card)); color:color-mix(in srgb, var(--c) 70%, var(--text)); }
.tag.todo { background:var(--warn-soft); color:var(--warn); }
.tag.soft { font-weight:500; }
.t-note { margin-top:0.3125rem; font-size:0.8125rem; color:var(--muted); white-space:pre-line; }
.t-km { text-align:right; line-height:1; }
.t-km b { font-size:1.1875rem; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.t-km span { display:block; font-size:0.6875rem; color:var(--muted); margin-top:0.1875rem; }
@keyframes pop { from { opacity:0; transform:translateY(0.5rem); } to { opacity:1; transform:none; } }
.empty { text-align:center; padding:2.5rem 1rem; color:var(--muted); }
.empty .big { font-size:3rem; margin-bottom:0.5rem; }

/* Schaltflächen */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:0.5rem; min-height:var(--tap); padding:0 1.125rem; border-radius:1rem; font-weight:700; background:var(--card2); color:var(--text); border:0.125rem solid transparent; }
.btn.primary { background:var(--accent); color:#fff; box-shadow:0 0.125rem 0.5rem rgba(0,0,0,.15); }
.btn.ghost { background:transparent; border-color:var(--line); }
.btn.small { min-height:2.375rem; padding:0 0.75rem; font-size:0.8125rem; border-radius:0.75rem; }
.btn.wide { width:100%; }
.btn.danger { color:var(--err); border-color:color-mix(in srgb, var(--err) 40%, transparent); }
.btn:disabled { opacity:.45; pointer-events:none; }
.btn:active { transform:scale(.97); }
.row-actions { display:flex; gap:0.625rem; flex-wrap:wrap; justify-content:center; margin:0.875rem 0; }

/* Schwebeknopf, Tabs, Auswahl-Leiste */
.fab { position:fixed; right:1.125rem; bottom:calc(var(--nav-h) + env(safe-area-inset-bottom) + 0.875rem); width:3.5rem; height:3.5rem; border-radius:1.25rem; background:linear-gradient(135deg, var(--accent), var(--accent2)); color:#fff; font-size:1.875rem; line-height:1; display:grid; place-items:center; box-shadow:0 0.5rem 1.25rem rgba(0,0,0,.3); z-index:7; }
.fab:active { transform:scale(.94); }
.tabs { position:fixed; left:0; right:0; bottom:0; z-index:8; display:flex; justify-content:space-around; background:color-mix(in srgb, var(--card) 92%, transparent); backdrop-filter:blur(0.875rem); -webkit-backdrop-filter:blur(0.875rem); border-top:1px solid var(--line); padding:0.375rem 0.5rem calc(0.375rem + env(safe-area-inset-bottom)); height:calc(var(--nav-h) + env(safe-area-inset-bottom)); }
.tabs button { flex:1; display:flex; flex-direction:column; align-items:center; gap:0.125rem; font-size:0.7188rem; font-weight:600; color:var(--muted); border-radius:0.875rem; padding:0.3125rem 0.125rem; position:relative; max-width:7.5rem; }
.tabs button .ico { font-size:1.3125rem; line-height:1.1; transition:transform .2s; }
.tabs button.on { color:var(--accent); }
.tabs button.on .ico { transform:translateY(-0.125rem) scale(1.12); }
.tabs .badge { position:absolute; top:1px; right:calc(50% - 1.5rem); background:var(--err); color:#fff; font-size:0.625rem; font-weight:800; border-radius:62.4375rem; padding:1px 0.3125rem; min-width:1.0625rem; text-align:center; }
.bulkbar { position:fixed; left:0.75rem; right:0.75rem; bottom:calc(var(--nav-h) + env(safe-area-inset-bottom) + 0.625rem); z-index:9; display:none; align-items:center; gap:0.5rem; background:var(--text); color:var(--bg); padding:0.625rem 0.75rem; border-radius:1.125rem; box-shadow:var(--shadow); overflow-x:auto; max-width:45rem; margin:0 auto; }
.bulkbar.on { display:flex; }
.bulkbar .btn { min-height:2.375rem; padding:0 0.75rem; font-size:0.8125rem; background:rgba(128,128,160,.25); color:inherit; border-radius:0.75rem; flex:none; }
.bulkbar .info { flex:1; font-weight:700; white-space:nowrap; }

/* Bottom-Sheet */
.sheet-wrap { position:fixed; inset:0; z-index:20; }
.backdrop { position:absolute; inset:0; background:rgba(0,0,0,.5); opacity:0; transition:opacity .25s; }
.sheet { position:absolute; left:0; right:0; bottom:0; max-height:94dvh; background:var(--card); border-radius:1.625rem 1.625rem 0 0; box-shadow:0 -0.625rem 2.5rem rgba(0,0,0,.25); transform:translateY(100%); transition:transform .28s cubic-bezier(.2,.8,.2,1); display:flex; flex-direction:column; max-width:45rem; margin:0 auto; }
.sheet-wrap.open .backdrop { opacity:1; }
.sheet-wrap.open .sheet { transform:none; }
.grip { width:2.75rem; height:0.3125rem; border-radius:0.1875rem; background:var(--line); margin:0.625rem auto 0.125rem; flex:none; }
.grip-area { padding:0.375rem 0; cursor:grab; touch-action:none; }
.sheet-body { overflow-y:auto; padding:0.25rem 1.125rem calc(1rem + env(safe-area-inset-bottom)); -webkit-overflow-scrolling:touch; position:relative; }
.sheet-body.swap { animation:swap .25s both; }
@keyframes swap { from { opacity:0; transform:translateX(0.875rem); } to { opacity:1; transform:none; } }
.sh-head { display:grid; grid-template-columns:1fr auto; gap:0.125rem 0.625rem; align-items:center; padding:0.25rem 2.75rem 0.5rem 0; }
.sh-veh { display:flex; align-items:center; gap:0.5rem; font-weight:700; font-size:0.8125rem; color:var(--muted); grid-column:1; }
.sh-veh .vdot { width:0.625rem; height:0.625rem; box-shadow:none; background:var(--vc); }
.sh-title { font-size:1.1875rem; font-weight:800; grid-column:1; }
.sh-km { grid-column:2; grid-row:1 / 3; font-size:1.375rem; font-weight:800; letter-spacing:-.02em; align-self:center; font-variant-numeric:tabular-nums; }
.sh-close { position:absolute; right:0.875rem; top:0.5rem; }
.sh-route { font-size:0.875rem; color:var(--muted); margin-bottom:0.25rem; display:flex; flex-wrap:wrap; gap:0.25rem 0.375rem; align-items:center; }
.sh-foot { position:sticky; bottom:0; display:flex; gap:0.625rem; padding:0.875rem 0 0; background:linear-gradient(transparent, var(--card) 35%); margin-top:0.625rem; }
.sh-foot .btn { flex:1; }

/* Formular */
.f-label { font-size:0.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin:0.875rem 0 0.5rem; }
.tiles { display:grid; grid-template-columns:repeat(auto-fill, minmax(6rem, 1fr)); gap:0.5rem; }
.tile { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:0.25rem; padding:0.625rem 0.375rem; border-radius:1rem; background:var(--card2); border:0.125rem solid transparent; font-size:0.75rem; font-weight:650; color:var(--text); min-height:4.625rem; text-align:center; line-height:1.2; transition:transform .12s, background .15s; }
.tile .ico { font-size:1.5rem; }
.tile.on { background:color-mix(in srgb, var(--c) 18%, var(--card)); border-color:var(--c); transform:scale(1.03); }
.tile:active { transform:scale(.95); }
.tiles.small { grid-template-columns:repeat(auto-fill, minmax(5.125rem, 1fr)); }
.tiles.small .tile { min-height:3.75rem; font-size:0.6875rem; padding:0.5rem 0.25rem; }
.tiles.small .tile .ico { font-size:1.1875rem; }
.input { width:100%; background:var(--card2); border:0.125rem solid transparent; border-radius:0.875rem; padding:0.6875rem 0.8125rem; min-height:var(--tap); outline:none; color:var(--text); }
.input:focus { border-color:var(--accent); background:var(--card); }
textarea.input { min-height:4.75rem; resize:vertical; }
label.fld { display:block; font-size:0.75rem; color:var(--muted); font-weight:700; margin-top:0.5rem; }
label.fld .input { margin-top:0.25rem; }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:0.625rem; }
.grid2 .span { grid-column:1 / -1; }
.f-details { margin-top:0.875rem; border:0.125rem solid var(--line); border-radius:1rem; padding:0 0.75rem; }
.f-details summary { padding:0.75rem 0; font-weight:700; cursor:pointer; list-style:none; display:flex; justify-content:space-between; }
.f-details summary::-webkit-details-marker { display:none; }
.f-details summary::after { content:"▾"; color:var(--muted); }
.f-details[open] summary::after { content:"▴"; }
.f-details .grid2 { padding-bottom:0.75rem; }
.tools { display:flex; flex-wrap:wrap; gap:0.5rem; margin-top:0.875rem; }
.f-tplbtn { margin-top:0.625rem; }

/* Bewerten-Assistent */
.wiz-top { display:flex; align-items:center; gap:0.75rem; padding:0.375rem 2.75rem 0.625rem 0; }
.wiz-progress { flex:1; height:0.5rem; border-radius:0.25rem; background:var(--card2); overflow:hidden; }
.wiz-progress span { display:block; height:100%; background:linear-gradient(90deg, var(--accent), var(--accent2)); transition:width .4s; }
.wiz-count { font-size:0.75rem; font-weight:700; color:var(--muted); white-space:nowrap; }
.wiz-card { border-radius:1.25rem; padding:0.875rem 1rem; background:color-mix(in srgb, var(--vc) 12%, var(--card2)); border-left:0.3125rem solid var(--vc); }
.wiz-when { font-weight:800; font-size:0.9375rem; }
.wiz-time { font-size:0.8125rem; color:var(--muted); margin-top:0.125rem; }
.wiz-route { margin-top:0.5rem; font-weight:650; display:flex; flex-wrap:wrap; gap:0.25rem 0.375rem; align-items:center; }
.wiz-km { font-size:1.625rem; font-weight:800; letter-spacing:-.02em; margin-top:0.375rem; font-variant-numeric:tabular-nums; }
.party { text-align:center; padding:1.25rem 0 0.625rem; }
.party-emoji { font-size:4rem; animation:bounce 1s infinite alternate; }
.party h2 { font-size:1.5rem; margin:0.5rem 0; }
@keyframes bounce { to { transform:translateY(-0.625rem); } }
.confetti { position:fixed; inset:0; pointer-events:none; z-index:30; overflow:hidden; }
.confetti i { position:absolute; top:-0.875rem; width:0.625rem; height:0.875rem; border-radius:0.1875rem; animation:fall linear both; }
@keyframes fall { to { transform:translateY(110vh) rotate(720deg); opacity:.8; } }

/* Aufteilen */
.split { padding:0.625rem 0; }
.split-vals { display:flex; justify-content:space-between; margin-bottom:0.625rem; }
.split-vals b { font-size:1.375rem; display:block; font-variant-numeric:tabular-nums; }
.split-vals small { color:var(--muted); font-weight:700; font-size:0.75rem; }
input[type=range] { width:100%; accent-color:var(--accent); height:2.5rem; margin:0; }

/* Karten, Schalter, Listen */
.card { background:var(--card); border-radius:var(--r); padding:1rem; margin:0.75rem 0; box-shadow:var(--shadow-sm); }
.card h2 { font-size:1.0625rem; margin-bottom:0.25rem; }
.switch { display:flex; align-items:center; justify-content:space-between; gap:0.75rem; padding:0.75rem 0 0.25rem; min-height:var(--tap); font-size:0.875rem; }
.switch input { appearance:none; -webkit-appearance:none; width:3.125rem; height:1.875rem; border-radius:0.9375rem; background:var(--line); position:relative; flex:none; transition:background .2s; margin:0; cursor:pointer; }
.switch input::after { content:""; position:absolute; top:0.1875rem; left:0.1875rem; width:1.5rem; height:1.5rem; border-radius:50%; background:#fff; box-shadow:0 0.125rem 0.375rem rgba(0,0,0,.25); transition:transform .2s; }
.switch input:checked { background:var(--ok); }
.switch input:checked::after { transform:translateX(1.25rem); }
.seg { display:flex; background:var(--card2); border-radius:0.875rem; padding:0.25rem; gap:0.25rem; }
.seg button { flex:1; min-height:2.375rem; border-radius:0.6875rem; font-weight:700; color:var(--muted); }
.seg button.on { background:var(--card); color:var(--text); box-shadow:var(--shadow-sm); }
.steps { counter-reset:s; list-style:none; padding:0; margin:0.625rem 0 0; }
.steps li { display:flex; gap:0.75rem; padding:0.625rem 0; border-top:1px solid var(--line); align-items:flex-start; line-height:1.45; }
.steps li::before { counter-increment:s; content:counter(s); width:1.75rem; height:1.75rem; border-radius:50%; background:var(--accent-soft); color:var(--accent); display:grid; place-items:center; font-weight:800; flex:none; }
.steps li > div { flex:1; }
.steps .btn { margin-top:0.5rem; }
.ok-box { background:var(--ok-soft); color:var(--ok); padding:0.75rem 0.875rem; border-radius:0.875rem; font-weight:700; }
.warn-box { background:var(--warn-soft); color:var(--warn); padding:0.75rem 0.875rem; border-radius:0.875rem; font-weight:600; }
.kbd { font-family:ui-monospace, monospace; font-size:0.75rem; background:var(--card2); padding:1px 0.375rem; border-radius:0.375rem; }
.stat-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(8.125rem, 1fr)); gap:0.5rem; margin:0.625rem 0; }
.stat { background:var(--card2); border-radius:0.875rem; padding:0.625rem 0.75rem; }
.stat b { display:block; font-size:1.25rem; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.stat small { color:var(--muted); font-weight:600; }
.mini { font-size:0.75rem; color:var(--muted); word-break:break-all; }
details.plain summary { cursor:pointer; font-weight:700; padding:0.5rem 0; list-style:none; }
details.plain summary::-webkit-details-marker { display:none; }
details.plain summary::before { content:"▸ "; color:var(--muted); }
details.plain[open] summary::before { content:"▾ "; }

/* Vorlagen */
.tpl-card { display:grid; grid-template-columns:auto 1fr auto auto; gap:0.75rem; align-items:center; background:var(--card); border-radius:var(--r); padding:0.75rem 0.875rem; margin-bottom:0.625rem; box-shadow:var(--shadow-sm); border-left:0.3125rem solid var(--c, var(--accent)); animation:pop .3s both; }
.tpl-ico { font-size:1.625rem; }
.tpl-main { min-width:0; }
.tpl-main b { font-size:0.9375rem; }
.tpl-sub { font-size:0.7812rem; color:var(--muted); margin-top:0.125rem; }
.tpl-uses { font-size:0.75rem; font-weight:700; color:var(--muted); background:var(--card2); padding:0.25rem 0.5rem; border-radius:62.4375rem; white-space:nowrap; }

/* Nachweis */
.rp-filters { display:grid; grid-template-columns:1fr 1fr; gap:0.5rem; margin:0.5rem 0; }
select.input { appearance:none; -webkit-appearance:none; background-image:linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%); background-position:calc(100% - 1.125rem) 50%, calc(100% - 0.8125rem) 50%; background-size:0.3125rem 0.3125rem, 0.3125rem 0.3125rem; background-repeat:no-repeat; padding-right:2.125rem; }
table { width:100%; border-collapse:collapse; font-size:0.8125rem; }
th, td { text-align:left; padding:0.4375rem 0.375rem; border-bottom:1px solid var(--line); vertical-align:top; }
th { color:var(--muted); font-size:0.6875rem; text-transform:uppercase; letter-spacing:.04em; }
td.num, th.num { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.table-wrap { overflow:auto; margin:0 -1rem; padding:0 1rem; }

/* Hinweis */
.updatebar { position:fixed; left:0; right:0; top:0; z-index:45; display:flex; align-items:center; justify-content:center; gap:0.75rem; padding:calc(0.6rem + env(safe-area-inset-top)) 1rem 0.6rem; background:var(--accent); color:#fff; font-weight:700; box-shadow:var(--shadow); }
.updatebar button { background:#fff; color:var(--accent); border-radius:999px; padding:0.4rem 0.9rem; font-weight:800; }
.toast { position:fixed; left:50%; bottom:calc(var(--nav-h) + env(safe-area-inset-bottom) + 1.125rem); transform:translateX(-50%) translateY(1.25rem); background:var(--text); color:var(--bg); padding:0.6875rem 1rem; border-radius:1rem; z-index:40; opacity:0; pointer-events:none; transition:all .25s; max-width:92vw; font-weight:600; display:flex; gap:0.75rem; align-items:center; box-shadow:var(--shadow); }
.toast.show { opacity:1; transform:translateX(-50%); pointer-events:auto; }
.toast.err { background:var(--err); color:#fff; }
.toast.warn { background:var(--warn); color:#fff; }
.toast.ok { background:var(--ok); color:#fff; }
.toast button { color:inherit; font-weight:800; text-decoration:underline; }

/* Anmeldung, Geräte */
.login { text-align:center; padding:3rem 0 1.25rem; max-width:26.25rem; margin:0 auto; }
.login img { width:6rem; height:6rem; border-radius:1.75rem; box-shadow:var(--shadow); }
.login h1 { font-size:1.75rem; margin:0.875rem 0 0.25rem; }
.login .btn { margin-top:0.625rem; }
.login form { text-align:left; margin-top:0.625rem; }
.login .fld { text-align:left; }
.code-input { font-family:ui-monospace, monospace; font-size:1.375rem; letter-spacing:.14em; text-align:center; text-transform:uppercase; }
body.anon .top, body.anon .vehbar, body.anon .tabs, body.anon .fab, body.anon .bulkbar { display:none !important; }
body.anon { padding-bottom:1.25rem; }
.device { display:flex; align-items:center; gap:0.625rem; padding:0.625rem 0; border-top:1px solid var(--line); }
.device b { display:block; }
.device small { color:var(--muted); }
.code-box { font-family:ui-monospace, monospace; font-size:1.875rem; letter-spacing:.14em; font-weight:800; text-align:center; padding:0.875rem; border-radius:1rem; background:var(--card2); margin:0.625rem 0 0.25rem; user-select:all; }

/* Kompakte Kategorien, Schnell übernehmen, Stationen, Karte, Verbinden, Orte */
.tiles.compact { grid-template-columns:repeat(5, 1fr); gap:0.375rem; }
.tiles.compact .tile { min-height:3.375rem; padding:0.375rem 0.125rem; font-size:0.6562rem; border-radius:0.75rem; gap:0.125rem; }
.tiles.compact .tile .ico { font-size:1.1875rem; }
.quick { display:flex; gap:0.5rem; overflow-x:auto; scrollbar-width:none; padding:0.125rem 1.125rem 0.375rem; margin:0 -1.125rem; }
.quick::-webkit-scrollbar { display:none; }
.quick.expanded { flex-wrap:wrap; overflow:visible; }
.qcard { display:flex; align-items:center; gap:0.5rem; padding:0.4375rem 0.75rem 0.4375rem 0.4375rem; border-radius:0.875rem; background:var(--card2); border:0.125rem solid transparent; flex:none; max-width:14.375rem; text-align:left; color:var(--text); position:relative; min-height:3.125rem; }
.qcard .qico { width:2.125rem; height:2.125rem; border-radius:0.6875rem; background:color-mix(in srgb, var(--c, var(--accent)) 20%, var(--card)); display:grid; place-items:center; font-size:1.125rem; flex:none; }
.qcard .qbadge { position:absolute; left:1.875rem; top:0.1875rem; font-size:0.6875rem; }
.qcard b { display:block; font-size:0.8125rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:9.375rem; }
.qcard small { display:block; color:var(--muted); font-size:0.6875rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:9.375rem; }
.qcard.more { background:transparent; border:0.125rem dashed var(--line); color:var(--muted); font-weight:700; justify-content:center; }
.qcard:active { transform:scale(.97); }
.stations { display:flex; flex-wrap:wrap; gap:0.375rem; align-items:center; margin:0.25rem 0 0.5rem; }
.station { display:inline-flex; align-items:center; gap:0.25rem; padding:0.375rem 0.625rem; border-radius:62.4375rem; background:var(--card2); font-size:0.8125rem; font-weight:600; border:0.125rem solid transparent; color:var(--text); }
.station.place { border-color:color-mix(in srgb, var(--accent) 40%, transparent); }
.station:active { transform:scale(.97); }
.map { height:13.75rem; border-radius:1rem; overflow:hidden; margin:0.5rem 0; position:relative; z-index:0; isolation:isolate; background:var(--card2); }
.map.big { height:60vh; }
.join { border:0.125rem solid var(--line); border-radius:1rem; padding:0.25rem 0.75rem; }
.jrow { display:flex; align-items:center; gap:0.625rem; padding:0.5rem 0; border-top:1px solid var(--line); }
.jrow:first-child, .parts + .jrow { border-top:0; }
.parts { border-bottom:0.125rem dashed var(--line); margin-bottom:0.25rem; }
.jrow .jmain { flex:1; min-width:0; font-size:0.8125rem; }
.jrow .jmain small { color:var(--muted); display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.jrow.current { background:color-mix(in srgb, var(--accent) 8%, transparent); margin:0 -0.75rem; padding:0.5rem 0.75rem; }
.jrow.part .jmain::before { content:"↳ "; color:var(--muted); }
.dayright { display:flex; align-items:center; gap:0.5rem; }
.daymap { width:1.875rem; height:1.875rem; border-radius:0.625rem; background:var(--card); box-shadow:var(--shadow-sm); font-size:0.9375rem; }
.place-row { display:flex; align-items:center; gap:0.75rem; background:var(--card); border-radius:var(--r); padding:0.75rem 0.875rem; margin-bottom:0.625rem; box-shadow:var(--shadow-sm); }
.place-row .pico { font-size:1.625rem; }
.place-row .pmain { flex:1; min-width:0; }
.place-row .pmain b { font-size:0.9375rem; }
.place-row .pmain small { color:var(--muted); display:block; }
.place-row .vcount { font-size:0.8125rem; font-weight:800; color:var(--accent); background:var(--accent-soft); border-radius:999px; padding:0.25rem 0.5rem; white-space:nowrap; }
.icon-pick { display:flex; flex-wrap:wrap; gap:0.375rem; }
.icon-pick button { width:2.75rem; height:2.75rem; border-radius:0.75rem; background:var(--card2); font-size:1.375rem; border:0.125rem solid transparent; }
.icon-pick button.on { border-color:var(--accent); background:var(--accent-soft); }
.range-row { display:flex; align-items:center; gap:0.625rem; }
.range-row input { flex:1; }
.range-row b { min-width:3.25rem; text-align:right; font-variant-numeric:tabular-nums; }
.scale-a { font-weight:800; font-size:0.8125rem; color:var(--muted); }
.scale-a.big { font-size:1.25rem; }
.geo-results { display:flex; flex-direction:column; gap:0.375rem; margin-top:0.5rem; }
.geo-results button { text-align:left; padding:0.625rem 0.75rem; border-radius:0.75rem; background:var(--card2); font-size:0.8125rem; color:var(--text); }
.mini-form { background:var(--card2); border-radius:0.875rem; padding:0.625rem 0.75rem; margin:0.375rem 0 0.625rem; }
.mini-form .input { background:var(--card); }

.view { display:none; }
.view.on { display:block; animation:pop .25s both; }
@media (min-width: 720px) { .tiles { grid-template-columns:repeat(5, 1fr); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation:none !important; transition:none !important; } }
@media print {
  body { background:#fff; color:#000; padding:0; font-size:0.75rem; }
  .top, .vehbar, .tabs, .fab, .no-print, .toast, .bulkbar, .sheet-wrap { display:none !important; }
  .view { display:none; }
  #view-report { display:block; }
  .card { box-shadow:none; border:0; padding:0; }
  table { font-size:0.6875rem; }
  th, td { border-bottom:1px solid #ccc; }
  .stat { border:1px solid #ccc; }
}