@font-face{font-family:"Bricolage Display";src:url("../fonts/bricolage-display.woff") format("woff");font-weight:500 800;font-display:swap}
@font-face{font-family:"Bricolage";src:url("../fonts/bricolage-text.woff") format("woff");font-weight:400 700;font-display:swap}
/* Vereinli – Oberfläche nach dem Vereinli Design System */

:root {
  --brand: #1E1B4B;
  --brand-strong: #13113A;
  --brand-text: #1E1B4B;
  --brand-subtle: #EEF0FF;
  --accent: #E11D48;
  --ink: #111827;
  --ink-muted: #4B5563;
  --surface-000: #FFFFFF;
  --surface-100: #F7F8FC;
  --surface-200: #EEF0F6;
  --border: #E5E7EB;
  --border-strong: #9CA3AF;
  --success: #047857;
  --success-bg: #ECFDF5;
  --warning: #B45309;
  --warning-bg: #FFFBEB;
  --danger: #B91C1C;
  --danger-bg: #FEF2F2;
  --info: #1D4ED8;
  --info-bg: #EFF6FF;
  --r-sm: 0; --r-md: 0; --r-lg: 0; --r-xl: 0; --r-full: 0;
  --shadow: 0 1px 2px rgba(17, 24, 39, .06), 0 1px 3px rgba(17, 24, 39, .08);
  --font: "Bricolage", "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root {
    --brand: #5B50E8;
    --brand-strong: #6D63F0;
    --brand-text: #A5A0FA;
    --brand-subtle: #23214A;
    --ink: #F3F4F6;
    --ink-muted: #A1A8B5;
    --surface-000: #171A23;
    --surface-100: #0F1117;
    --surface-200: #232734;
    --border: #2C3140;
    --border-strong: #4B5263;
    --success: #34D399; --success-bg: #0F2A22;
    --warning: #FBBF24; --warning-bg: #2A2110;
    --danger: #F87171; --danger-bg: #2D1517;
    --info: #93C5FD; --info-bg: #172036;
    --shadow: none;
    color-scheme: dark;
  }
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--surface-100); color: var(--ink);
  font-family: var(--font); font-size: 15px; line-height: 22px;
}
a { color: var(--brand-text); text-underline-offset: 2px; }
a:hover { color: var(--brand-strong); }
h1, h2, h3 { margin: 0; line-height: 1.25; }
h1 { font-size: 26px; font-weight: 800; letter-spacing: -.01em; }
h2 { font-size: 17px; font-weight: 700; }
h3 { font-size: 15px; font-weight: 700; }
p { margin: 0 0 12px; }
:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; border-radius: 0; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.muted { color: var(--ink-muted); }
.text-danger { color: var(--danger); }
.small { font-size: 13px; line-height: 18px; }
[hidden] { display: none !important; }
.mt-8 { margin-top: 8px; } .mt-16 { margin-top: 16px; } .mt-24 { margin-top: 24px; } .mb-0 { margin-bottom: 0; }

/* Kopfzeile in Vereinsfarbe */
.topbar {
  background: var(--club-primary, var(--brand)); color: var(--club-on-primary, #fff);
  padding: 10px 24px; display: flex; align-items: center; gap: 16px; min-height: 64px;
}
.topbar a { color: inherit; text-decoration: none; }
.club { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; }
.club-logo { width: 44px; height: 44px; border-radius: 0; background: #fff; padding: 2px; object-fit: contain; flex: none; }
.club-mono { width: 44px; height: 44px; border-radius: 0; background: rgba(255,255,255,.2); display: grid; place-items: center; font-weight: 800; flex: none; }
.club-name { display: flex; flex-direction: column; min-width: 0; }
.club-name strong { font-size: 16px; line-height: 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.club-name span { font-size: 13px; line-height: 18px; opacity: .9; }
.usermenu { display: flex; align-items: center; gap: 8px; }
.usermenu form { margin: 0; }
.viewswitch { display: inline-flex; align-items: center; gap: 2px; padding: 3px; margin: 0 4px 0 0; border-radius: 0; background: rgba(255,255,255,.14); font-size: 13px; font-weight: 600; }
.viewswitch > a, .viewswitch > button, .viewswitch .vs-on { display: inline-flex; align-items: center; min-height: 30px; padding: 0 12px; border-radius: 0; border: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; text-decoration: none; }
.viewswitch > a:hover, .viewswitch > button:hover { background: rgba(255,255,255,.16); }
.viewswitch .vs-on { background: #fff; color: var(--club-primary, var(--brand)); cursor: default; }
.viewswitch-nav { display: none; }
@media (max-width: 760px) {
  .viewswitch-top { display: none; }
  .viewswitch-nav { display: flex; margin: 4px 12px 16px; background: var(--surface-200); color: inherit; font-size: 14px; }
  .viewswitch-nav > button, .viewswitch-nav .vs-on { flex: 1; justify-content: center; min-height: 40px; }
  .viewswitch-nav .vs-on { background: var(--club-primary, var(--brand)); color: var(--club-on-primary, #fff); }
}
@media (max-width: 520px) { .viewswitch { font-size: 12px; } .viewswitch > a, .viewswitch > button, .viewswitch .vs-on { padding: 0 9px; min-height: 28px; } .viewswitch-nav { font-size: 14px; } .viewswitch-nav > button, .viewswitch-nav .vs-on { min-height: 40px; } }
.iconbtn {
  min-width: 44px; height: 44px; border-radius: 0; border: 0; background: transparent;
  color: inherit; display: inline-flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer; font: inherit; padding: 0 10px;
}
.iconbtn:hover { background: rgba(255,255,255,.14); }
.me-avatar { width: 32px; height: 32px; border-radius: 0; background: rgba(255,255,255,.22); display: grid; place-items: center; font-size: 13px; font-weight: 700; }

/* Gerüst */
.shell { display: flex; min-height: calc(100vh - 64px); }
.sidenav { width: 240px; flex: none; padding: 20px 12px; display: flex; flex-direction: column; gap: 2px; border-right: 1px solid var(--border); background: var(--surface-000); }
.sidenav a, .sidenav .soon {
  display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 0 12px; border-radius: 0;
  color: var(--ink); text-decoration: none; font-weight: 500;
}
.sidenav a svg, .sidenav .soon svg { color: var(--ink-muted); flex: none; }
.sidenav a:hover { background: var(--surface-200); color: var(--ink); }
.sidenav a[aria-current="page"] { background: var(--brand-subtle); color: var(--brand-text); font-weight: 700; }
.sidenav a[aria-current="page"] svg { color: var(--brand-text); }
.sidenav .soon { color: var(--ink-muted); cursor: default; }
.sidenav .soon .badge { margin-left: auto; }
.sidenav .sep { height: 1px; background: var(--border); margin: 10px 12px; }
.powered { margin-top: auto; padding: 16px 12px 0; display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--ink-muted); }
.powered img { width: 18px; height: 18px; align-self: flex-start; margin-top: 2px; }
.powered .credit { font-size: 11px; opacity: .85; }
.credit-line { margin-top: 4px; font-size: 12px; }
.auth-foot.credit-line { display: block; line-height: 1.6; }
.nowrap { white-space: nowrap; }
@media (max-width: 520px) { .credit-sep { display: none; } .credit-line .nowrap { display: block; } }
.lead { font-size: 17px; font-weight: 600; }
code { font-size: 13px; background: var(--surface-200); padding: 1px 6px; border-radius: 0; }
main.content { flex: 1; min-width: 0; padding: 28px 32px 48px; }
/* Volle Breite für Tabellen und Pläne; Formulare und Fließtext bleiben gut lesbar */
main.content > .form:not(:has(table)), main.content > form > .form:not(:has(table)), main.content > .narrow-form, .form-narrow { max-width: 980px; }
.card p, .pagehead p, .field .hint { max-width: 100ch; }
.field input[type=number]:not(.input-mini) { max-width: 200px; }
.field input[type=date], .field input[type=time], .field input[type=month] { max-width: 240px; }
.survey-more summary { cursor: pointer; color: var(--brand-text); font-weight: 600; margin-top: 4px; }
.survey-detail { margin-top: 8px; padding: 10px 12px; background: var(--surface-100, #f6f7f9); border-radius: 0; max-width: 520px; white-space: normal; }
.survey-detail p { margin: 0 0 8px; }
.survey-hint .badge { margin-bottom: 4px; }

.pagehead { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.pagehead p { margin: 4px 0 0; color: var(--ink-muted); }

/* Karten und Raster */
.grid { display: grid; gap: 20px; grid-template-columns: minmax(0, 2fr) minmax(min(300px, 100%), 1fr); align-items: start; }
.grid-2 { display: grid; gap: 20px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.stack { display: flex; flex-direction: column; gap: 20px; }
.card { background: var(--surface-000); border: 1px solid var(--border); border-radius: 0; padding: 20px; box-shadow: var(--shadow); }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.card-head a { font-size: 14px; font-weight: 600; }
.empty { padding: 20px; border: 1px dashed var(--border-strong); border-radius: 0; color: var(--ink-muted); text-align: center; }

/* Schaltflächen */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 18px;
  border-radius: 0; border: 1px solid transparent; font: inherit; font-weight: 700; cursor: pointer; text-decoration: none;
  background: var(--brand); color: #fff;
}
.btn:hover { background: var(--brand-strong); color: #fff; }
.btn-secondary { background: var(--surface-000); color: var(--ink); border-color: var(--border-strong); }
.btn-secondary:hover { background: var(--surface-200); color: var(--ink); }
.btn-ghost { background: var(--surface-000); color: var(--brand-text); border-color: var(--border); }
.btn-ghost:hover { background: var(--brand-subtle); color: var(--brand-text); }
.btn-danger { background: var(--danger); }
.btn-danger:hover { background: #991B1B; }
.btn-sm { min-height: 36px; padding: 0 12px; font-size: 14px; }
.btn:disabled { background: var(--ink-muted); cursor: not-allowed; }
.btn-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }

/* Formulare */
.form { display: flex; flex-direction: column; gap: 16px; }
.field { display: flex; flex-direction: column; gap: 6px; }
.field label, .label { font-weight: 600; font-size: 14px; }
.field .hint { font-size: 13px; color: var(--ink-muted); }
.input, input:not([type]), input[type=text], input[type=email], input[type=tel], input[type=url], input[type=password], input[type=date], input[type=time], input[type=datetime-local], input[type=number], input[type=search], select, textarea {
  width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid var(--border-strong); border-radius: 0;
  background: var(--surface-000); color: var(--ink); font: inherit;
}
textarea { min-height: 96px; resize: vertical; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--brand); outline-offset: 0; border-color: var(--brand); }
input[type=color] { width: 56px; height: 44px; padding: 2px; border: 1px solid var(--border-strong); border-radius: 0; background: var(--surface-000); }
.check { display: flex; gap: 10px; align-items: flex-start; }
.check input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--brand); flex: none; }
.row { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.row-plz { display: grid; gap: 16px; grid-template-columns: minmax(90px, 1fr) minmax(0, 3fr); }
.row-iban { display: grid; gap: 16px; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
legend .small { font-weight: 400; }
.card fieldset + fieldset { border-top: 1px solid var(--border); padding-top: 16px; margin-top: 4px; }
.row-3 { display: grid; gap: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
fieldset { border: 0; padding: 0; margin: 0; }
legend { font-weight: 700; margin-bottom: 8px; padding: 0; }

/* Hinweise */
.flash { border-radius: 0; padding: 12px 16px; margin-bottom: 20px; display: flex; gap: 10px; align-items: flex-start; border: 1px solid; }
.flash-success { background: var(--success-bg); color: var(--success); border-color: currentColor; }
.flash-error { background: var(--danger-bg); color: var(--danger); border-color: currentColor; }
.flash-info { background: var(--info-bg); color: var(--info); border-color: currentColor; }
.flash-warning { background: var(--warning-bg); color: var(--warning); border-color: currentColor; }
.copybox { display: flex; gap: 8px; margin-top: 8px; }
.copybox input { font-size: 13px; }
.copybox-code { align-items: flex-start; }
.copybox-code textarea { flex: 1; font: 13px/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; resize: none; white-space: pre; overflow-x: auto; min-height: 0; height: auto; }
.tariff-table .sort-input { width: 64px; padding-left: 8px; padding-right: 4px; }
.tariff-table th, .tariff-table td { padding-left: 6px; padding-right: 6px; }
.tariff-table th { white-space: normal; }
.table.tariff-table td { vertical-align: middle; }
.tariff-table .check { margin: 0; }
.tariff-table td input[type=text]:not(.money-input) { min-width: 90px; width: 100%; }
.occasion-list li { gap: 12px; align-items: center; }
.occasion-list li.is-round { background: var(--brand-subtle); margin: 0 -12px; padding-left: 12px; padding-right: 12px; border-radius: 0; }
.occ-date { display: flex; flex-direction: column; align-items: center; min-width: 34px; line-height: 1.1; }
.occ-date strong { font-size: 18px; }
.occ-age { min-width: 44px; text-align: center; font-weight: 700; }
.occ-age.badge { font-size: 15px; padding: 4px 10px; }
.rule-card + .rule-card { margin-top: 16px; }
.rule-card textarea { font-size: 14px; }
.placeholder-list { display: flex; flex-wrap: wrap; gap: 6px; }
.placeholder-list code { font-size: 12px; }
@media print { .no-print, .sidebar, .topbar, nav.tabs { display: none !important; } }
.confetti { position: fixed; inset: 0; width: 100vw; height: 100vh; pointer-events: none; z-index: 9999; }
.is-celebrating { animation: vl-pop .6s cubic-bezier(.2, 1.6, .4, 1) 1; }
@keyframes vl-pop { 0% { transform: scale(.6); } 100% { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .is-celebrating { animation: none; } }
.tabs a[aria-current="page"] .muted { color: inherit; opacity: .8; }
.ranking .btn-row { flex-wrap: nowrap; gap: 4px; }
.ranking .lk { white-space: nowrap; }
.table td.nowrap, .table td .nowrap { white-space: nowrap; }
.steps-list { margin: 8px 0; padding-left: 22px; display: grid; gap: 6px; }

/* Abzeichen, Avatare */
.badge { display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px; border-radius: 0; font-size: 12px; font-weight: 700; line-height: 20px; background: var(--surface-200); color: var(--ink-muted); white-space: nowrap; }
.badge-brand { background: var(--brand-subtle); color: var(--brand-text); }
.badge-success { background: var(--success-bg); color: var(--success); }
.badge-warning { background: var(--warning-bg); color: var(--warning); }
.badge-danger { background: var(--danger-bg); color: var(--danger); }
.dot { width: 10px; height: 10px; border-radius: 0; display: inline-block; flex: none; }
.dot-r1 { background: #2563EB; } .dot-r2 { background: #047857; } .dot-r3 { background: #D97706; } .dot-r4 { background: #7C3AED; } .dot-r5 { background: #DB2777; } .dot-r0 { background: var(--border-strong); }
.avatar { position: relative; width: 36px; height: 36px; border-radius: 0; background: var(--brand-subtle); color: var(--brand-text); display: grid; place-items: center; font-weight: 700; font-size: 13px; flex: none; }
.avatar .on { position: absolute; right: -1px; bottom: -1px; width: 11px; height: 11px; border-radius: 0; background: var(--accent); border: 2px solid var(--surface-000); }

.online { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; padding: 12px 16px; background: var(--surface-000); border: 1px solid var(--border); border-radius: 0; margin-bottom: 20px; }
.online-label { font-size: 13px; font-weight: 700; color: var(--ink-muted); }
.online-person { display: flex; align-items: center; gap: 8px; font-size: 14px; }

.changes-banner { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 16px; border-radius: 0; background: var(--brand-subtle); color: var(--ink); margin-bottom: 20px; border: 1px solid var(--brand); }
.changes-banner .pulse { width: 10px; height: 10px; border-radius: 0; background: var(--accent); }
.changes-banner span.text { flex: 1; min-width: 200px; }

/* Listen */
.list { list-style: none; margin: 0; padding: 0; }
.list > li { display: flex; gap: 12px; align-items: center; padding: 12px 0; border-top: 1px solid var(--border); }
.list > li:first-child { border-top: 0; padding-top: 0; }
.list .grow { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.list .grow > .badge, .list .grow > .newpill { align-self: flex-start; margin: 2px 0; }
.list .meta { font-size: 13px; color: var(--ink-muted); }
.checklist li a { font-weight: 600; }
.checklist .tick { width: 24px; height: 24px; border-radius: 0; border: 2px solid var(--border-strong); display: grid; place-items: center; flex: none; }
.checklist .done .tick { background: var(--success); border-color: var(--success); color: #fff; }
.checklist .done a { color: var(--ink-muted); text-decoration: line-through; }

/* Tabellen */
.table-wrap { overflow-x: auto; }
table.table { width: 100%; border-collapse: collapse; font-size: 14px; }
.table th { text-align: left; font-size: 13px; color: var(--ink-muted); font-weight: 700; padding: 8px 10px; border-bottom: 1px solid var(--border); }
.table td { padding: 10px; border-bottom: 1px solid var(--border); vertical-align: top; }

/* Ressort-Karten */
.ressort { display: flex; flex-direction: column; gap: 10px; }
.ressort-title { display: flex; align-items: center; gap: 10px; }
.ressort .person { display: flex; align-items: center; gap: 10px; }
.ressort .person .grow { display: flex; flex-direction: column; min-width: 0; }

/* Aufgaben und Termine */
.mb-20 { margin-bottom: 20px; }
.row-4 { display: grid; gap: 16px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.quickadd { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.quickadd .grow { flex: 1 1 260px; }
.quickadd .field { flex: 0 1 180px; }
.quickadd .field.grow { flex: 1 1 280px; }
.toolbar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 8px; }
.tabs { display: flex; flex-wrap: wrap; gap: 4px; }
.tabs a { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 12px; border-radius: 0; color: var(--ink); text-decoration: none; font-size: 14px; font-weight: 600; border: 1px solid var(--border); background: var(--surface-000); }
.tabs a:hover { background: var(--surface-200); }
.tabs a[aria-current="page"] { background: var(--brand); border-color: var(--brand); color: #fff; }
.search { display: flex; gap: 12px; align-items: center; }
.search input[type=search] { width: 200px; min-height: 36px; padding: 6px 12px; }
.taskgroup { margin-top: 20px; }
.taskgroup-title { font-size: 14px; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-muted); margin-bottom: 8px; display: flex; gap: 8px; align-items: center; }
.taskgroup-title.is-danger { color: var(--danger); }
.taskgroup-title .count { background: var(--surface-200); color: var(--ink-muted); border-radius: 0; padding: 0 8px; font-size: 12px; }
.tasklist, .eventlist { list-style: none; margin: 0; padding: 0; background: var(--surface-000); border: 1px solid var(--border); border-radius: 0; overflow: hidden; }
.task, .event { display: flex; align-items: center; gap: 12px; padding: 10px 16px; border-top: 1px solid var(--border); }
.task:first-child, .event:first-child { border-top: 0; }
.task-toggle { margin: 0; }
.tick-btn { width: 28px; height: 28px; border-radius: 0; border: 2px solid var(--border-strong); background: transparent; color: #fff; display: grid; place-items: center; cursor: pointer; padding: 0; }
.tick-btn:hover { border-color: var(--success); }
.task.is-done .tick-btn { background: var(--success); border-color: var(--success); }
.task.is-done .task-title { text-decoration: line-through; color: var(--ink-muted); }
.task-main { flex: 1; min-width: 0; display: flex; flex-direction: column; text-decoration: none; color: var(--ink); padding: 4px 0; }
.task-main:hover .task-title { color: var(--brand-text); }
.task-title { font-weight: 600; }
.task-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 13px; color: var(--ink-muted); align-items: center; }
.task-due { font-size: 13px; color: var(--ink-muted); white-space: nowrap; }
.task-due.is-danger { color: var(--danger); font-weight: 700; }
.event-date { width: 48px; flex: none; display: flex; flex-direction: column; align-items: center; border-radius: 0; background: var(--surface-200); padding: 4px 0; }
.event-date .d { font-size: 18px; font-weight: 800; line-height: 1.1; }
.event-date .w { font-size: 12px; color: var(--ink-muted); }
.event-frist .event-date { background: var(--warning-bg); color: var(--warning); }
.event-sitzung .event-date { background: var(--brand-subtle); color: var(--brand-text); }
.conflict { margin-top: 6px; padding: 10px 12px; border-radius: 0; background: var(--warning-bg); color: var(--ink); border: 1px solid var(--warning); font-size: 14px; }
.conflict.is-resolved { opacity: .6; }
.comment-body { white-space: normal; overflow-wrap: anywhere; }
.list > li.comment { align-items: flex-start; }
.avatar-photo { overflow: hidden; padding: 0; background: var(--surface-200); }
.avatar-photo img, .me-photo img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; display: block; }
.me-photo { overflow: hidden; }
.passbild { border-radius: 0; border: 1px solid var(--border); max-width: 160px; height: auto; }
.signature { max-width: 240px; height: auto; background: #fff; border-radius: 0; padding: 8px; border: 1px solid var(--border); }
.dash-list li .task-main { padding: 0; }

/* Mitglieder, Einsätze, Stunden */
.filterbar { justify-content: flex-start; }
.filterbar input[type=search] { max-width: 320px; min-height: 40px; }
.filterbar select { width: auto; min-height: 40px; padding: 6px 12px; }
.meter { display: block; height: 8px; border-radius: 0; background: var(--surface-200); overflow: hidden; }
.meter-fill { display: block; height: 100%; width: 0; background: var(--accent); border-radius: 0; transition: width .3s; }
.stat { display: flex; flex-direction: column; gap: 4px; }
.stat-num { font-size: 26px; font-weight: 800; line-height: 1.2; }
.steps { margin: 0; padding-left: 20px; }
.steps li { margin-bottom: 6px; }
.checklist-plain { margin: 0 0 12px; padding-left: 18px; }
.householdlist li { padding: 8px 0; }
.householdlist .check > span { display: flex; flex-direction: column; }
.workcard { display: flex; align-items: center; gap: 16px; text-decoration: none; color: var(--ink); }
.workcard:hover { border-color: var(--brand); }
.workcard .grow { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.workcard .fill { width: 160px; display: flex; flex-direction: column; gap: 4px; text-align: right; }
.shiftlist { list-style: none; padding: 0; margin: 16px 0 0; border: 1px solid var(--border); border-radius: 0; }
.shiftlist li { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-top: 1px solid var(--border); }
.shiftlist li:first-child { border-top: 0; }
.shiftlist .grow { flex: 1; }
.shiftbar { display: flex; justify-content: space-between; margin-top: 8px; }
.mb-8 { margin-bottom: 8px; }
/* Formulare, die erst nach Klick auf „Eintragen“ erscheinen (#neu) */
.collapsible:not(:target) { display: none; }
.collapsible:target { scroll-margin-top: 16px; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Live-Hinweis unten */
.toast-area { position: fixed; right: 16px; bottom: 16px; display: flex; flex-direction: column; gap: 8px; z-index: 50; max-width: min(380px, calc(100vw - 32px)); }
.toast { background: var(--ink); color: var(--surface-000); border-radius: 0; padding: 12px 14px; font-size: 14px; box-shadow: 0 8px 24px rgba(0,0,0,.18); }

/* Anmeldeseiten */
.auth { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1fr); place-items: center; padding: 24px 16px; }
.auth-card { width: 100%; max-width: 440px; background: var(--surface-000); border: 1px solid var(--border); border-radius: 0; padding: 32px; box-shadow: var(--shadow); }
.auth-brand { display: flex; align-items: center; gap: 14px; margin-bottom: 24px; }
.auth-brand img.club-logo { width: 56px; height: 56px; border: 1px solid var(--border); }
.auth-brand .club-mono { width: 56px; height: 56px; background: var(--club-primary, var(--brand)); color: var(--club-on-primary, #fff); }
.auth-foot { margin-top: 20px; text-align: center; font-size: 13px; color: var(--ink-muted); display: flex; justify-content: center; align-items: center; gap: 8px; }
.auth-foot img { height: 20px; }
.auth-wide { max-width: 640px; }

/* Plattform */
.platform-top { background: var(--ink); color: #fff; }
@media (prefers-color-scheme: dark) { .platform-top { background: #000; } }
.platform-nav { position: sticky; top: 0; z-index: 20; display: flex; gap: 4px; overflow-x: auto; padding: 8px 24px; background: var(--surface-000); border-bottom: 1px solid var(--border); }
.platform-nav a { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 0; color: var(--ink-muted); font-weight: 600; font-size: 14px; text-decoration: none; white-space: nowrap; }
.platform-nav a:hover { background: var(--surface-200); color: var(--ink); }
.platform-nav a.is-active { background: var(--brand-subtle); color: var(--brand-text); }

/* Mobil */
@media (max-width: 960px) {
  .grid, .grid-2 { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .topbar { padding: 8px 16px; }
  .club-name span { display: none; }
  .usermenu .name { display: none; }
  .shell { flex-direction: column; }
  .sidenav { width: 100%; flex-direction: row; overflow-x: auto; padding: 8px 12px; border-right: 0; border-bottom: 1px solid var(--border); gap: 4px; }
  .sidenav a, .sidenav .soon { flex: none; padding: 0 12px; }
  .sidenav .soon, .sidenav .sep, .powered { display: none; }
  main.content { padding: 20px 16px 40px; }
  .row, .row-3, .row-iban, .row-4 { grid-template-columns: minmax(0, 1fr); }
  .search { width: 100%; }
  .workcard { flex-wrap: wrap; }
  .workcard .fill { width: 100%; text-align: left; }
  .search input[type=search] { flex: 1; width: auto; }
  h1 { font-size: 22px; }
  .auth-card { padding: 24px 20px; }
}
@media print {
  .topbar, .sidenav, .toast-area, .changes-banner, .online { display: none !important; }
  main.content { padding: 0; }
}

/* Mitgliederbereich, Check-in, Aushang (0.4) */
.member-content { max-width: 760px; margin: 0 auto; }
.narrow { max-width: 480px; margin-left: auto; margin-right: auto; }
.center { text-align: center; }
.left { text-align: left; }
.lead { font-size: 18px; }
.facts { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0; }
.facts dt { color: var(--ink-muted); font-size: 14px; }
.facts dd { margin: 0; font-weight: 600; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid var(--border); border-radius: 0; font-size: 14px; cursor: pointer; }
.chip input { accent-color: var(--brand); }
.chip:has(input:checked) { background: var(--brand-subtle); border-color: var(--brand); color: var(--brand-text); }
.share .copybox { flex-wrap: wrap; }
.share .copybox input { flex: 1 1 220px; min-width: 0; }

.bigbtn { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; width: 100%; min-height: 168px; margin: 24px 0 8px;
  border: 0; border-radius: 0; color: #fff; font: inherit; font-size: 34px; font-weight: 800; letter-spacing: -0.01em; cursor: pointer;
  box-shadow: 0 10px 28px -10px rgba(0,0,0,.45); transition: transform .08s ease, filter .15s ease; -webkit-tap-highlight-color: transparent; }
.bigbtn span { font-size: 15px; font-weight: 600; opacity: .9; }
.bigbtn:active { transform: scale(.98); }
.bigbtn:hover { filter: brightness(1.06); }
.bigbtn-arrive { background: linear-gradient(160deg, #22C55E, #15803D); }
.bigbtn-leave { background: linear-gradient(160deg, #F87171, #B91C1C); }
.thanks { margin: 24px 0; padding: 28px 20px; border-radius: 0; background: var(--success-bg); color: var(--success); border: 1px solid currentColor; }
.thanks-big { font-size: 26px; font-weight: 800; line-height: 1.25; margin: 0 0 8px; }
.thanks p { color: inherit; }
.dot-green, .dot-red { display: inline-block; width: 14px; height: 14px; border-radius: 0; vertical-align: -1px; }
.dot-green { background: #16A34A; }
.dot-red { background: #DC2626; }

.hourcard .decide { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; margin-top: 12px; }
.hourcard .decide .field { flex: 1 1 120px; }
.btn-ok { background: #15803D; }
.btn-ok:hover { background: #166534; }

.poster-body { background: #fff; color: #111; }
.poster-tools { display: flex; gap: 8px; justify-content: center; padding: 16px; }
.poster { max-width: 720px; margin: 0 auto; padding: 24px 32px 40px; text-align: center; font-family: inherit; }
.poster-head { display: flex; align-items: center; justify-content: center; gap: 16px; }
.poster-logo { width: 88px; height: 88px; object-fit: contain; }
.poster-club { font-size: 22px; font-weight: 700; color: #333; }
.poster-kicker { margin: 28px 0 0; font-size: 20px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--club-primary, #4338CA); }
.poster-title { margin: 4px 0 0; font-size: 52px; line-height: 1.05; font-weight: 900; color: #111; }
.poster-date { margin: 10px 0 0; font-size: 26px; font-weight: 600; color: #333; }
.poster-qr { position: relative; margin: 28px auto 0; width: 380px; max-width: 80vw; }
.poster-qr-logo { position: absolute; left: 50%; top: 50%; width: 22%; aspect-ratio: 1; transform: translate(-50%, -50%);
  display: flex; align-items: center; justify-content: center; background: #fff; border-radius: 0; padding: 3%; box-sizing: border-box; }
.poster-qr-logo img { width: 100%; height: 100%; object-fit: contain; }
.poster-sign { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 28px; padding-top: 14px; border-top: 1px solid #e5e7eb; font-size: 13px; color: #6b7280; }
.poster-sign strong { color: #374151; }
.poster-qr svg { width: 100%; height: auto; display: block; }
.poster-welcome { margin: 24px 0 0; font-size: 38px; font-weight: 800; color: var(--club-primary, #4338CA); }
.poster-steps { display: inline-block; text-align: left; margin: 20px auto 0; padding-left: 28px; font-size: 20px; line-height: 1.7; color: #222; }
.poster-foot { margin: 20px 0 0; font-size: 15px; color: #555; }
.poster-url { margin: 12px 0 0; font-size: 13px; color: #777; word-break: break-all; }
@media print {
  @page { size: A4 portrait; margin: 12mm; }
  .noprint { display: none !important; }
  .poster { padding: 0; }
  .poster-body { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

.howto { border: 1px solid var(--border); border-radius: 0; padding: 10px 14px; margin-bottom: 8px; }
.howto summary { cursor: pointer; }
.howto p { margin: 8px 0 0; }
.mapping select { min-width: 220px; max-width: 100%; }
.mapping th[scope="row"] { font-weight: 600; white-space: nowrap; }
.backbtn { gap: 6px; }
.smtplog { margin-top: 12px; padding: 12px; background: var(--surface-200); border-radius: 0; font-size: 12px; line-height: 18px; white-space: pre-wrap; word-break: break-all; max-height: 360px; overflow: auto; }
.totp-qr { width: 220px; margin: 8px auto; }
.totp-qr svg { width: 100%; height: auto; display: block; }
.totp-key { font-size: 14px; letter-spacing: .05em; word-break: break-all; }
.codeinput { font-size: 22px; letter-spacing: .2em; font-variant-numeric: tabular-nums; max-width: 220px; }
.recovery { columns: 2; font-size: 16px; line-height: 28px; padding: 12px 16px; background: var(--surface-200); border-radius: 0; }
.topbtn { display: inline-flex; align-items: center; min-height: 34px; padding: 0 12px; border: 1px solid rgba(255,255,255,.35); border-radius: 0; color: #fff; font-weight: 700; font-size: 14px; text-decoration: none; }
.topbtn:hover { background: rgba(255,255,255,.14); color: #fff; }

/* Sitzungen & Protokoll */
.top .card-head h3 { margin: 0; font-size: 17px; }
.topno { display: inline-block; min-width: 54px; padding: 2px 8px; margin-right: 6px; border-radius: 0; background: var(--brand-subtle); color: var(--brand-text); font-size: 13px; font-weight: 800; text-align: center; }
.topnotes { margin: 10px 0 0; padding: 10px 12px; background: var(--surface-100); border-radius: 0; }
.top-editing { outline: 2px solid var(--brand); }
.minutes { margin-top: 14px; }
.minutes-text { white-space: normal; line-height: 1.6; padding: 4px 0; }
.minutes textarea { min-height: 160px; font-size: 15px; line-height: 1.55; }
.lockinfo { margin: 10px 0 0; }
.decision { margin-top: 12px; padding: 12px 14px; background: var(--surface-100); border-left: 4px solid var(--brand); border-radius: 0; }
.decision-head { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 6px; }
.decision form { margin-top: 6px; }
.topactions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border); }
.topactions details { flex: 1 1 100%; }
.topactions details:not([open]) { flex: 0 0 auto; }
.topactions summary { list-style: none; cursor: pointer; }
.topactions summary::-webkit-details-marker { display: none; }
.select-sm { min-height: 36px; padding: 4px 8px; font-size: 14px; width: auto; }
.brandfoot { display: flex; flex-direction: column; align-items: center; gap: 4px; margin: 28px 0 8px; font-size: 12px; color: var(--ink-muted); text-align: center; }
.brandfoot-line { display: inline-flex; align-items: center; gap: 6px; }
.brandfoot img { width: 18px; height: 18px; flex: none; }
@media (max-width: 760px) { .desktop-only { display: none; } }
.brandfoot strong { color: var(--brand-text); }
.mobile-only { display: none; }
@media (max-width: 760px) { .mobile-only { display: flex; } }
.votebtns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.votebtn { position: relative; display: flex; align-items: center; justify-content: center; min-height: 64px; border: 2px solid var(--border); border-radius: 0; font-weight: 800; font-size: 17px; cursor: pointer; }
.votebtn input { position: absolute; opacity: 0; pointer-events: none; }
.votebtn:has(input:focus-visible) { outline: 2px solid var(--brand); outline-offset: 2px; }
.vote-ja:has(input:checked) { background: #DCFCE7; border-color: #16A34A; color: #166534; }
.vote-nein:has(input:checked) { background: #FEE2E2; border-color: #DC2626; color: #991B1B; }
.vote-enthaltung:has(input:checked) { background: var(--surface-200); border-color: var(--border-strong); }

/* Mitgliederversammlung */
.poll { padding: 14px 16px; border: 1px solid var(--border); border-radius: 0; }
.poll-offen { border: 2px solid #D97706; background: var(--warning-bg); }
.poll-geschlossen { background: var(--surface-100); }
.votebtns-list { grid-template-columns: minmax(0, 1fr); }
.livepoll .votebtn { min-height: 72px; font-size: 20px; }
.beamer { background: #0F172A; color: #F8FAFC; min-height: 100vh; display: flex; flex-direction: column; }
.beamer-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; padding: 32px 48px 0; }
.beamer-head h1 { margin: 4px 0 0; font-size: 32px; color: #fff; }
.beamer-club { font-size: 18px; color: #94A3B8; }
.beamer-stats { display: flex; gap: 32px; font-size: 22px; color: #CBD5E1; }
.beamer-stats strong { font-size: 40px; color: #fff; margin-right: 6px; }
.beamer-main { flex: 1; display: flex; align-items: center; justify-content: center; padding: 32px 48px; }
.beamer-poll { width: 100%; max-width: 1200px; text-align: center; }
.beamer-kicker { font-size: 24px; letter-spacing: .15em; text-transform: uppercase; color: #FBBF24; font-weight: 800; margin: 0; }
.beamer-poll h2 { font-size: 64px; line-height: 1.1; margin: 12px 0 0; color: #fff; }
.beamer-text { font-size: 28px; line-height: 1.35; color: #CBD5E1; margin: 16px auto 0; max-width: 1000px; }
.beamer-count { font-size: 36px; margin: 40px 0 12px; color: #E2E8F0; }
.beamer-count strong { font-size: 72px; color: #fff; }
.beamer-meter { height: 20px; max-width: 900px; margin: 0 auto; background: #1E293B; }
.beamer-results { display: flex; justify-content: center; gap: 48px; margin-top: 40px; flex-wrap: wrap; }
.beamer-results div { display: flex; flex-direction: column; min-width: 180px; padding: 20px 28px; border-radius: 0; background: #1E293B; }
.beamer-results strong { font-size: 96px; line-height: 1; color: #fff; }
.beamer-results span { font-size: 26px; color: #CBD5E1; margin-top: 8px; }
.beamer-results .r-ja { background: #14532D; } .beamer-results .r-nein { background: #7F1D1D; }
.beamer-result { font-size: 34px; line-height: 1.4; margin: 56px auto 0; max-width: 1000px; padding: 0 24px; color: #FDE68A; font-weight: 700; text-wrap: balance; }
.beamer-foot { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 16px; color: #64748B; font-size: 14px; }
@media (max-width: 480px) { .votebtns { grid-template-columns: minmax(0, 1fr); } .livepoll .votebtn { min-height: 60px; } }

/* ---- Lizenzen & Paket --------------------------------------------------- */
.mb-16 { margin-bottom: 16px; }
.section-title { margin: 28px 0 12px; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted); }
.package-summary { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); align-items: end; }
.package-summary > div { display: flex; flex-direction: column; gap: 2px; }
.package-status { font-size: 20px; }
.package-total { background: var(--brand-subtle); border-radius: 0; padding: 14px 16px; }
.package-total strong { font-size: 30px; line-height: 1.1; color: var(--brand-text); font-variant-numeric: tabular-nums; }
.package-total strong span, .modcard-price span { font-size: 13px; font-weight: 600; color: var(--ink-muted); }
.modgrid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.modcard { display: flex; flex-direction: column; gap: 6px; background: var(--surface-000); border: 1px solid var(--border); border-radius: 0; padding: 18px; box-shadow: var(--shadow); scroll-margin-top: 80px; }
.modcard:target { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-subtle); }
.modcard h3 { margin: 6px 0 0; }
.modcard p { margin: 0; }
.modcard-top { display: flex; align-items: center; justify-content: space-between; }
.modcard-icon { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 0; background: var(--brand-subtle); color: var(--brand-text); }
.modcard-foot { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.modcard-foot form { margin: 0; }
.modcard-price { font-weight: 800; font-size: 17px; font-variant-numeric: tabular-nums; }
.modcard-more { border-style: dashed; }
.modcard-soon { background: var(--surface-100); box-shadow: none; }
.modcard-soon .modcard-icon { background: var(--surface-200); color: var(--ink-muted); }
.locked { max-width: 560px; margin: 24px auto; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 36px 28px; }
.locked h1 { margin: 4px 0 0; }
.locked .btn-row { justify-content: center; }
.locked-icon { display: inline-grid; place-items: center; width: 72px; height: 72px; border-radius: 0; background: var(--brand-subtle); color: var(--brand-text); }
.upsell { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 1px dashed var(--border-strong); border-radius: 0; background: var(--surface-000); }
.upsell > span:nth-child(2) { flex: 1; }
.upsell-icon { display: inline-grid; place-items: center; width: 40px; height: 40px; flex: none; border-radius: 0; background: var(--brand-subtle); color: var(--brand-text); }
/* Masterbereich */
.kpis { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); margin-bottom: 20px; }
.kpi { display: flex; flex-direction: column; gap: 4px; }
.kpi strong { font-size: 28px; line-height: 1.1; font-variant-numeric: tabular-nums; }
.kpi.is-brand { background: var(--brand-subtle); }
.kpi.is-brand strong { color: var(--brand-text); }
.kpi.is-warn strong { color: var(--warning); }
.light { display: inline-block; width: 10px; height: 10px; border-radius: 0; margin-right: 8px; vertical-align: middle; background: var(--success); }
.light-warn { background: var(--warning); }
.light-danger { background: var(--danger); }
.light-off { background: var(--border-strong); }
.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.lic-table input[type="date"] { min-width: 140px; }
.lic-table input[inputmode="decimal"] { max-width: 110px; text-align: right; }
.lic-sum td { font-weight: 800; border-top: 2px solid var(--border-strong); }
@media (max-width: 640px) { .upsell { flex-wrap: wrap; } }
.lic-table input[inputmode="decimal"] { min-width: 88px; max-width: 110px; }
.lic-table input[type="date"] { min-width: 0; width: 150px; }
.lic-group td { padding-top: 22px; font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-muted); }
.lic-soon td { opacity: .72; }
.lic-soon td .small { display: none; }
/* Pakete */
.bundlegrid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.bundlecard { display: flex; flex-direction: column; gap: 8px; background: var(--surface-000); border: 1px solid var(--border); border-radius: 0; padding: 20px; box-shadow: var(--shadow); scroll-margin-top: 80px; }
.bundlecard h3, .bundlecard p { margin: 0; }
.bundlecard.is-booked { border-color: var(--brand); background: linear-gradient(180deg, var(--brand-subtle), var(--surface-000) 70%); }
.bundlecard.is-highlight { border: 2px solid var(--brand); }
.bundlecard:target { box-shadow: 0 0 0 3px var(--brand-subtle); }
.chips { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.chips li { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: 0; background: var(--surface-200); font-size: 13px; font-weight: 600; }
.chips li svg { color: var(--success); }
.save { font-size: 12px; font-weight: 700; color: var(--success); }
.text-success { color: var(--success); }
.checkgrid { display: grid; gap: 10px 16px; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.bundle-edit.is-off { opacity: .75; }
.newbundle { padding: 12px; }
.newbundle > summary { list-style: none; cursor: pointer; width: 100%; }
.newbundle > summary::-webkit-details-marker { display: none; }
.newbundle[open] > summary { margin-bottom: 12px; }
.newbundle .bundle-edit { box-shadow: none; border: 0; padding: 8px; }
.demo-access { background: var(--surface-100); border-radius: 0; padding: 12px 14px; }
.demo-access dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 12px; margin: 0; font-size: 13px; }
.demo-access dt { font-weight: 700; }
.demo-access dd { margin: 0; word-break: break-all; }
.demo-banner { display: flex; gap: 10px; align-items: center; justify-content: center; padding: 8px 16px; background: var(--warning-bg); color: var(--warning); font-size: 13px; font-weight: 600; text-align: center; }
.checklist-plain { margin: 8px 0 12px; padding-left: 20px; display: grid; gap: 4px; }
.address-card.is-ok .checklist-plain { display: none; }
/* ---- Live-Sitzung: Beamer, Fernbedienung ------------------------------------- */
.beamer-is-slides .beamer-head { padding-top: 16px; }
.beamer-is-slides .beamer-head h1 { font-size: 22px; }
.beamer-is-slides .beamer-main { padding: 12px 24px; }
.beamer-slide { width: 100%; height: calc(100vh - 150px); display: flex; align-items: center; justify-content: center; }
.beamer-slide canvas { background: #fff; border-radius: 0; box-shadow: 0 10px 40px rgba(0, 0, 0, .45); }
.beamer-titleslide .beamer-logo { width: 120px; height: 120px; object-fit: contain; border-radius: 0; background: #fff; padding: 10px; margin-bottom: 28px; }
.beamer-agenda { width: 100%; max-width: 1200px; }
.beamer-agenda > h2 { font-size: 56px; line-height: 1.1; margin: 12px 0 0; color: #fff; }
.beamer-agenda .beamer-text { margin-left: 0; }
.beamer-toplist { list-style: none; margin: 40px 0 0; padding: 0; display: grid; gap: 10px; font-size: 26px; color: #CBD5E1; columns: 1; }
.beamer-toplist li { display: flex; align-items: center; gap: 18px; padding: 10px 16px; border-radius: 0; }
.beamer-toplist .no { flex: none; width: 44px; height: 44px; border-radius: 0; display: grid; place-items: center; background: #1E293B; font-weight: 800; font-size: 20px; color: #E2E8F0; }
.beamer-toplist li.is-done { color: #64748B; }
.beamer-toplist li.is-done .no { background: #14532D; color: #BBF7D0; }
.beamer-toplist li.is-current { background: rgba(var(--club-primary-rgb, 67, 56, 202), .28); color: #fff; font-weight: 800; }
.beamer-toplist li.is-current .no { background: var(--club-primary, #4338CA); color: var(--club-on-primary, #fff); }
.beamer-timer { font-size: 26px; font-variant-numeric: tabular-nums; color: #CBD5E1; }
.beamer-timer.is-over { color: #FCA5A5; }
.live-card.is-live { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-subtle); }
.live-card .pulse { display: inline-block; width: 10px; height: 10px; border-radius: 0; background: var(--danger); margin-right: 6px; vertical-align: middle; animation: vl-pulse 1.6s infinite; }
@keyframes vl-pulse { 50% { opacity: .3; } }
[data-timer-since].is-over { color: var(--danger); }
.livevote { border: 2px solid var(--brand); border-radius: 0; padding: 14px 16px; background: var(--brand-subtle); }
.livevote-text { font-size: 17px; font-weight: 600; margin: 6px 0 10px; }
.votebtn-inline { min-width: 92px; background: var(--surface-000); color: var(--ink); border: 1px solid var(--border-strong); }
.votebtn-inline.vote-ja.is-chosen { background: var(--success); color: #fff; border-color: var(--success); }
.votebtn-inline.vote-nein.is-chosen { background: var(--danger); color: #fff; border-color: var(--danger); }
.votebtn-inline.vote-enthaltung.is-chosen { background: var(--ink-muted); color: #fff; }
.topactions form { display: inline; }
.remote { background: var(--surface-100); min-height: 100vh; }
.remote-main { max-width: 520px; margin: 0 auto; padding: 16px 16px 40px; }
.remote-title { font-size: 24px; margin: 8px 0 4px; }
.remote-timer { font-size: 20px; font-variant-numeric: tabular-nums; margin: 0 0 8px; color: var(--ink-muted); }
.remote-slides { margin-top: 12px; }
.remote-preview { height: 220px; display: flex; align-items: center; justify-content: center; background: #0F172A; border-radius: 0; overflow: hidden; }
.remote-preview canvas { background: #fff; }
.remote-counter { text-align: center; font-weight: 700; margin: 10px 0; }
.remote-pad { display: grid; grid-template-columns: 1fr 2fr; gap: 12px; }
.remote-pad form { display: block; }
.remote-btn { width: 100%; height: 120px; border-radius: 0; border: 1px solid var(--border-strong); background: var(--surface-000); color: var(--ink); font-size: 44px; font-weight: 800; cursor: pointer; }
.remote-btn-main { background: var(--brand); border-color: var(--brand); color: #fff; }
.remote-next { width: 100%; min-height: 56px; font-size: 18px; }
.remote .stack form, .remote .stack .btn { width: 100%; }
.center-row { justify-content: center; margin-top: 12px; }
.nowtop { border-left: 4px solid var(--brand); }
.member-slide { height: 56vw; max-height: 420px; display: flex; align-items: center; justify-content: center; background: #0F172A; border-radius: 0; overflow: hidden; }
.member-slide canvas { background: #fff; }
.env-banner { background: repeating-linear-gradient(45deg, #B45309, #B45309 14px, #92400E 14px, #92400E 28px); color: #fff; text-align: center; font-weight: 800; letter-spacing: .12em; font-size: 13px; padding: 6px 12px; text-transform: uppercase; }
.update-hero { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; }
.update-hero .ver { font-size: 34px; font-weight: 800; font-variant-numeric: tabular-nums; }
.update-hero .arrow { font-size: 28px; color: var(--ink-muted); }
.tests { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.tests li::before { content: '✓'; display: inline-block; width: 22px; color: var(--success); font-weight: 800; }
.tests li.bad::before { content: '✕'; color: var(--danger); }
.changes { margin: 8px 0 0; padding-left: 0; list-style: none; display: grid; gap: 6px; }
.changes strong { display: inline-block; min-width: 64px; }
.beamer-toplist li.is-more { color: #64748B; font-size: 20px; padding: 2px 16px 2px 78px; }
.beamer-agenda > h2 { font-size: clamp(36px, 5vw, 56px); }
.beamer-toplist { font-size: clamp(18px, 2.2vw, 26px); margin-top: 28px; gap: 6px; }

/* Datenexport */
.export-status { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border-radius: 0; background: var(--brand-subtle); }
.export-status .pulse { flex: none; width: 12px; height: 12px; margin-top: 5px; border-radius: 0; background: var(--brand); animation: vl-pulse 1.6s infinite; }
.export-status.is-ready { background: var(--success-bg, #E8F5EE); }
.export-status .dot { flex: none; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 0; background: var(--success); color: var(--success-bg); }
.export-status .dot svg { width: 14px; height: 14px; }
.checklist-plain li + li { margin-top: 4px; }

/* Zwei-Faktor */
fieldset.choices { border: 0; padding: 0; margin: 0; display: grid; gap: 8px; }
.mfa-options { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); margin-top: 8px; }
.mfa-option { border: 1px solid var(--border); border-radius: 0; padding: 16px; display: flex; flex-direction: column; gap: 8px; }
.mfa-option h3 { margin: 0; display: flex; gap: 8px; align-items: center; }
.mfa-option p { flex: 1; margin: 0; }

/* Suche */
.topsearch { position: relative; display: flex; align-items: center; width: min(360px, 34vw); }
.topsearch svg { position: absolute; left: 12px; width: 18px; height: 18px; opacity: .8; pointer-events: none; }
.topsearch input { width: 100%; height: 40px; border-radius: 0; border: 1px solid rgba(255,255,255,.28); background: rgba(255,255,255,.14); color: inherit; padding: 0 14px 0 38px; font: inherit; font-size: 15px; }
.topsearch input::placeholder { color: inherit; opacity: .75; }
.topsearch input:focus { outline: 2px solid rgba(255,255,255,.8); outline-offset: 1px; background: rgba(255,255,255,.22); }
.topsearch-mobile { display: none; }
@media (max-width: 760px) { .topsearch { display: none; } .topsearch-mobile { display: inline-flex; } }
.searchbig { display: flex; gap: 8px; }
.searchbig input { flex: 1; min-width: 0; height: 48px; font-size: 17px; padding: 0 16px; border-radius: 0; border: 1px solid var(--border-strong); background: var(--surface-000); color: var(--ink); }
.searchbig .btn { height: 48px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 12px; border-radius: 0; border: 1px solid var(--border); text-decoration: none; color: var(--ink); background: var(--surface-000); }
.chip:hover { border-color: var(--brand); }
.hits { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 0; }
.hits li { padding: 12px 0; border-top: 1px solid var(--border); }
.hits li:first-child { border-top: 0; padding-top: 0; }
.hit-title { font-weight: 650; font-size: 16px; color: var(--brand-text); text-decoration: none; }
.hit-title:hover { text-decoration: underline; }
.hit-extra { margin-left: 8px; }
.hits .meta { font-size: 13px; color: var(--ink-muted); margin-top: 2px; }
.hit-snippet { margin: 6px 0 0; font-size: 14px; line-height: 21px; color: var(--ink); }
mark { background: color-mix(in srgb, var(--brand) 22%, transparent); color: inherit; border-radius: 0; padding: 0; }

/* Dokumente */
.doclist li { gap: 12px; }
.docicon { flex: none; width: 40px; height: 44px; border-radius: 0; display: grid; place-items: center; font-size: 10px; font-weight: 800; letter-spacing: .04em; background: var(--brand-subtle); color: var(--brand-text); }

/* KI-Assistent */
.ai-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin: 6px 0 2px; }
.ai-label { font-size: 13px; font-weight: 700; color: var(--brand-text); margin-right: 4px; }
.ai-suggest, .ai-box { margin-top: 8px; padding: 12px 14px; border-radius: 0; background: var(--brand-subtle); border-left: 4px solid var(--brand); display: grid; gap: 10px; }
.ai-suggest-head { font-size: 13px; font-weight: 700; color: var(--brand-text); }
.ai-suggest textarea { width: 100%; background: var(--surface-000); }
.ai-wait { margin: 0; font-size: 14px; color: var(--brand-text); animation: vl-pulse 1.6s infinite; }
.ai-error { margin: 0; font-size: 14px; color: var(--danger); }
.ai-list { display: grid; gap: 10px; }
.ai-row { display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(140px, 200px) 150px; gap: 8px; align-items: start; }
.ai-row-agenda { grid-template-columns: auto minmax(0, 1fr) minmax(140px, 200px) 90px; }
.ai-row input[type=checkbox] { width: 20px; height: 20px; margin-top: 12px; }
.ai-col { display: grid; gap: 2px; }
.ai-privacy { padding: 10px 12px; border-radius: 0; background: var(--surface-100, var(--brand-subtle)); }
.ai-agenda { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.ai-agenda .ai-box { flex-basis: 100%; }
@media (max-width: 760px) { .ai-row, .ai-row-agenda { grid-template-columns: auto minmax(0, 1fr); } .ai-row > select, .ai-row > input[type=date], .ai-row > input[type=number] { grid-column: 2; } }

/* Mannschaften */
.season-stats { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-bottom: 12px; font-size: 14px; color: var(--ink-muted); }
.season-stats strong { color: var(--ink); font-size: 18px; margin-right: 4px; }
.answers li { flex-wrap: wrap; }
.inline-form { display: flex; gap: 6px; align-items: center; margin: 0; }
.inline-form select { min-height: 36px; padding: 4px 8px; max-width: 200px; }
.answers li { flex-wrap: wrap; }
.answers li > .grow { flex: 1 1 280px; min-width: 0; }
.answers .grow > .badge { align-self: flex-start; }
.answer-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: flex-end; }
.ranking { list-style: none; margin: 0 0 12px; padding: 0; }
.ranking li { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid var(--border); }
.ranking li:first-child { border-top: 0; }
.ranking .rank { flex: none; width: 32px; height: 32px; border-radius: 0; display: grid; place-items: center; background: var(--brand-subtle); color: var(--brand-text); font-weight: 700; }
.ranking .has-warn .rank { background: var(--warning-bg, #FEF3C7); color: var(--warning, #92400E); }
.ranking .lk { flex: none; font-weight: 700; font-variant-numeric: tabular-nums; min-width: 64px; text-align: right; }
.ranking .meta { display: block; font-size: 13px; color: var(--ink-muted); }
.ranking .grow { flex: 1; min-width: 0; overflow-wrap: anywhere; hyphens: auto; }
.ranking-compact .lk { min-width: 0; }
.ranking-compact li { gap: 10px; }
.ranking .badge { margin-top: 4px; }
.lk-pill { display: inline-flex; align-items: center; padding: 2px 10px; border-radius: 0; background: var(--brand-subtle); color: var(--brand-text); font-weight: 800; font-size: 14px; line-height: 22px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.lk-pill-lg { font-size: 20px; line-height: 30px; padding: 3px 14px; vertical-align: middle; margin-left: 10px; }
.lk-pill:empty { display: none; }
a.lk-pill { text-decoration: none; }
a.lk-pill:hover { background: var(--brand); color: #fff; }
.ranking .lk.lk-pill { justify-content: center; min-width: 72px; }
.level-row { display: grid; grid-template-columns: 56px minmax(0, 420px) auto; align-items: center; gap: 12px; }
.level-row label { margin: 0; }
.lk-pill-none { background: var(--surface-200); color: var(--ink-muted); font-weight: 600; }
.lk-table input { width: 100%; min-width: 0; padding: 6px 8px; min-height: 36px; }
.lk-table td { vertical-align: middle; }
.lk-report { margin-top: 12px; padding: 10px 12px; border-radius: 0; background: var(--surface-100); }
.choices-sub { display: grid; gap: 6px; padding-left: 30px; }
.big-choices .check { font-size: 17px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 0; }
.big-choices .check:has(input:checked) { border-color: var(--brand); background: var(--brand-subtle); }
.season-answer form:has(input[name=plays][value=nein]:checked) .season-more { display: none; }
.date-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 6px; }
.season-answer { max-width: 640px; }
.season-more { display: grid; gap: 24px; margin-top: 8px; }
.season-more fieldset + fieldset { border-top: 0; padding-top: 0; margin-top: 0; }
.season-more legend { margin-bottom: 8px; }
details.card > summary { cursor: pointer; list-style: none; }
details.card > summary h2 { margin: 0; }

/* Beiträge & SEPA */
.tariff-table .money-input { width: 84px; text-align: right; font-variant-numeric: tabular-nums; }
.fee-table td { vertical-align: top; }
.fee-table .num { font-variant-numeric: tabular-nums; }
.inline-form input[type="date"] { width: auto; }
.iban-mask { font-variant-numeric: tabular-nums; letter-spacing: .02em; }
@media (max-width: 640px) {
  .fee-table thead { display: none; }
  .fee-table tr { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "who sum" "items items" "way status"; gap: 6px 12px; padding: 12px 0; border-bottom: 1px solid var(--border); }
  .fee-table td { display: block; border: 0; padding: 0; }
  .fee-table .fee-who { grid-area: who; } .fee-table .fee-sum { grid-area: sum; }
  .fee-table .fee-items { grid-area: items; } .fee-table .fee-way { grid-area: way; align-self: center; }
  .fee-table .fee-status { grid-area: status; justify-self: end; }
}
@media (max-width: 640px) { .kpi strong { font-size: 22px; white-space: nowrap; } .inline-form .btn { white-space: nowrap; } }

/* Mannschaftsbereich */
.matchlist li { align-items: flex-start; }
.matchlist .event-date { font-size: 12px; color: var(--ink-muted); text-transform: uppercase; }
.matchlist .event-date strong { font-size: 18px; color: var(--ink); line-height: 1.2; }
.matchlist li.is-cancelled .grow > a { text-decoration: line-through; }
.answer-buttons { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.answer-buttons .btn { min-height: 36px; }
.answer-big .btn { flex: 1 1 0; min-height: 48px; font-size: 16px; }
.answer-buttons .answer-ja.is-chosen { background: var(--success); border-color: var(--success); color: #fff; }
.answer-buttons .answer-vielleicht.is-chosen { background: var(--warning); border-color: var(--warning); color: #fff; }
.answer-buttons .answer-nein.is-chosen { background: var(--danger); border-color: var(--danger); color: #fff; }
.answer-tag { display: inline-block; padding: 1px 8px; border-radius: 0; font-size: 12px; font-weight: 700; background: var(--surface-200); color: var(--ink-muted); }
.answer-tag.answer-ja { background: var(--success-bg); color: var(--success); }
.answer-tag.answer-vielleicht { background: var(--warning-bg); color: var(--warning); }
.answer-tag.answer-nein { color: var(--danger); }
.list-tight li { padding: 6px 0; }
.ranking-compact li { padding: 6px 0; }
.ranking-compact .rank { width: 22px; text-align: right; color: var(--ink-muted); font-variant-numeric: tabular-nums; }
.sub-list { max-height: 320px; overflow: auto; display: grid; gap: 4px; }
.post-body { display: block; margin: 4px 0; }
li.is-done .post-body { color: var(--ink-muted); }
.lineup-table td { vertical-align: middle; }
.lineup-table tr.muted td { opacity: .6; }
.matchlist .answer-buttons { flex-wrap: nowrap; gap: 6px; }
.matchlist .answer-buttons .btn { flex: 1 1 0; padding-left: 6px; padding-right: 6px; white-space: nowrap; }
.answer-big .btn { white-space: nowrap; padding-left: 8px; padding-right: 8px; }
.duty-list li { flex-wrap: wrap; }
@media (max-width: 640px) { .duty-list li .grow { flex: 1 1 100%; } .answer-big .btn { font-size: 15px; } }
.ranking-compact .grow { flex: 1; }
#dienste > .inline-form { flex-wrap: wrap; }
#dienste > .inline-form input { flex: 1 1 200px; }

/* Folien-Editor */
.slide-editor { max-width: 860px; }
.slide-card .card-head h2 { font-size: 17px; }
.slide-savebar { position: sticky; bottom: 0; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 0; background: var(--bg, var(--surface-100)); }

/* Online-Aufnahmeantrag */
.apply h1 { margin-top: 0; }
.apply-section { border: 0; border-top: 1px solid var(--border); margin: 20px 0 0; padding: 18px 0 0; display: grid; gap: 14px; min-width: 0; }
.apply-section legend { font-weight: 700; font-size: 17px; padding: 0; margin-bottom: 4px; display: flex; align-items: center; gap: 10px; }
.apply-no { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 0; background: var(--brand); color: var(--brand-ink, #fff); font-size: 14px; }
.tariff-choices { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.tariff-choice { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--border-strong); border-radius: 0; cursor: pointer; }
.tariff-choice:has(input:checked) { border-color: var(--brand); background: var(--brand-subtle); }
.tariff-choice > span { display: flex; flex-direction: column; }
.tariff-choice input { margin-top: 3px; }
.apply-person { padding: 10px 0; border-top: 1px dashed var(--border); }
.mandate-text { background: var(--surface-200); border-radius: 0; padding: 10px 12px; margin-bottom: 8px; }
.mandate-text p { margin: 0 0 6px; }
.field-error { display: block; color: var(--danger); font-size: 14px; margin-top: 4px; }
.signature-pad { display: grid; gap: 8px; justify-items: start; }
.signature-pad canvas { width: 100%; max-width: 560px; height: 170px; border: 1px dashed var(--border-strong); border-radius: 0; background: #fff; touch-action: none; cursor: crosshair; }
.signature-img { max-width: 320px; background: #fff; border: 1px solid var(--border); border-radius: 0; padding: 6px; }
@media (max-width: 640px) { .row-4 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.auth-wide:has(.apply) { max-width: 780px; }
.apply-qr svg { width: 160px; height: auto; }
.apply-person.is-spare { display: none; }
.narrow-form { max-width: 720px; }
.tariff-desc { display: block; margin-top: 4px; color: var(--ink-muted); }
.tariff-public-table td { vertical-align: top; }
.tariff-notes { border-top: 1px solid var(--border); padding-top: 12px; margin-top: 16px; }
@media print { .auth-foot, .tariff-public .btn { display: none; } .auth-card { box-shadow: none; border: 0; } }

/* Trainingsplanung */
table.availability { border-collapse: collapse; width: 100%; min-width: 320px; }
table.availability th, table.availability td { border: 1px solid var(--line, #dfe6e8); padding: 7px; text-align: center; }
table.availability .slot { display: flex; justify-content: center; align-items: center; margin: 0; }
.availability-wrap { overflow-x: auto; margin-top: 12px; max-width: 100%; -webkit-overflow-scrolling: touch; }
.d-short { display: none; }
@media (max-width: 520px) { .d-long { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } .d-short { display: inline; } .auth-card { padding: 22px 16px; } table.availability th, table.availability td { padding: 5px 3px; font-size: 13px; } table.availability.av-paint td input { margin: 8px 4px; } }
table.availability.av-paint td { cursor: pointer; user-select: none; -webkit-user-select: none; padding: 0; }
table.availability.av-paint td:has(input:checked) { background: color-mix(in srgb, var(--brand, #2f7d5b) 25%, transparent); }
table.availability.av-paint td input { pointer-events: none; margin: 9px; }
table.availability.av-paint th { cursor: pointer; }
table.availability.av-paint thead th:first-child, table.availability.av-paint th[scope] { cursor: default; }
body.av-dragging { user-select: none; -webkit-user-select: none; cursor: crosshair; }
table.availability.av-paint th:focus-visible, table.availability.av-paint td:has(input:focus-visible) { outline: 2px solid var(--ink, #142a3a); outline-offset: -2px; }
.tp-hint-discreet { border-left: 4px solid #b45309; padding-left: 10px; }
.tp-narrow { width: 5.5rem !important; flex: none; }
.tp-scroll { overflow-x: auto; }
.tp-balls { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.tp-parent { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; max-width: 520px; }

/* Trainingsplanung: Gruppenplaner */
.tp-planner { --tp-green: #5aa63a; --tp-orange: #e8a53a; --tp-red: #d86a6a; --tp-grey: #b8c1c4; }
.tp-planner .grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.tp-planner .stat { padding: 9px 12px; display: flex; align-items: baseline; gap: 8px; background: var(--surface-2, #f4f7f9); border-radius: 0; }
.tp-planner .stat strong { font-size: 1.25rem; }
.tp-planner .stat span, .tp-planner .muted { color: var(--ink-muted, #667681); font-size: .88rem; }
.tp-planner .actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin: 14px 0; }
.tp-planner .panel { background: var(--surface-000, #fff); border: 1px solid var(--line, #e1e8e8); border-radius: 0; padding: 16px 18px; margin: 14px 0; }
.tp-planner .panel h2 { font-size: 1.05rem; }
.tp-m0 { margin: 0; } .tp-m004 { margin: 0 0 4px; } .tp-m008 { margin: 0 0 8px; } .tp-m0010 { margin: 0 0 10px; } .tp-m1000 { margin: 10px 0 0; } .tp-m600 { margin: 6px 0 0; } .tp-m800 { margin: 8px 0 0; } .tp-mb16 { margin-bottom: 16px; }
.tp-warn { color: #a03a1f; } .tp-big { font-size: 1.6rem; }
.tp-ovgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.tp-ov { border-radius: 0; padding: 12px; } .tp-ov-need { background: #f4f7fa; } .tp-ov-done { background: #eaf7e6; } .tp-ov-open { background: #fff4df; }
progress.tp-bar, progress.art-bar { width: 100%; height: 8px; border: 0; border-radius: 0; overflow: hidden; background: #e6edf2; margin: 10px 0; appearance: none; -webkit-appearance: none; }
progress.tp-bar::-webkit-progress-bar, progress.art-bar::-webkit-progress-bar { background: #e6edf2; border-radius: 0; }
progress.tp-bar::-webkit-progress-value { background: #7bb33a; border-radius: 0; } progress.tp-bar::-moz-progress-bar { background: #7bb33a; }
progress.art-bar-1::-webkit-progress-value { background: #4c9a2a; } progress.art-bar-2::-webkit-progress-value { background: #2f7fb8; } progress.art-bar-3::-webkit-progress-value { background: #b8742f; }
progress.art-bar-1::-moz-progress-bar { background: #4c9a2a; } progress.art-bar-2::-moz-progress-bar { background: #2f7fb8; } progress.art-bar-3::-moz-progress-bar { background: #b8742f; }
.tp-planner .art-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; }
.tp-planner .art-card { border: 1px solid var(--line, #e1e8e8); border-radius: 0; padding: 10px; }
.tp-planner .art-top { display: flex; gap: 8px; align-items: center; } .tp-planner .art-no { background: #142a3a; color: #fff; border-radius: 0; width: 20px; height: 20px; display: inline-grid; place-items: center; font-size: .75rem; }
.tp-planner .art-open { margin-left: auto; font-size: .8rem; color: #a03a1f; } .tp-planner .art-open.done { color: #3d7f26; }
.tp-planner .art-nums { display: flex; gap: 10px; font-size: .8rem; color: var(--ink-muted, #667681); }
.tp-planner .gp-layout { display: grid; grid-template-columns: minmax(290px, 350px) minmax(0, 1fr); gap: 16px; align-items: start; }
.tp-planner .gp-side { max-height: calc(100vh - 40px); overflow: auto; position: sticky; top: 12px; }
.tp-planner .gp-main { min-width: 0; }
.tp-planner .groups { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; align-items: start; }
.tp-planner .group { background: var(--surface-000, #fff); border: 1px solid var(--line, #e1e8e8); border-left: 4px solid var(--tp-grey); border-radius: 0; padding: 12px 14px; min-width: 0; overflow-wrap: anywhere; }
.tp-planner .group.fit-green { border-left-color: var(--tp-green); background: #f0fbf4; }
.tp-planner .group.fit-orange { border-left-color: var(--tp-orange); background: #fff8ec; }
.tp-planner .group.fit-red { border-left-color: var(--tp-red); background: #fff1f1; }
.tp-planner .group.already-planned { background: #f2f4f4; border-left-color: var(--tp-grey); color: #59656a; }
.tp-planner .gc-head { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; } .tp-planner .gc-head h2 { margin: 0 4px 0 0; font-size: 1.05rem; }
.tp-planner .gc-fit { display: flex; align-items: center; gap: 7px; margin: 6px 0 0; font-size: .85rem; }
.tp-planner .gc-dot { width: 9px; height: 9px; border-radius: 0; background: var(--tp-grey); flex: none; }
.tp-planner .fit-green .gc-dot { background: var(--tp-green); } .tp-planner .fit-orange .gc-dot { background: var(--tp-orange); } .tp-planner .fit-red .gc-dot { background: var(--tp-red); }
.tp-planner .fit-reason { font-size: .8rem; color: var(--ink-muted, #667681); margin: 2px 0 8px; }
.tp-planner .hint-notes { list-style: none; margin: 0 0 8px; padding: 0; font-size: .82rem; }
.tp-planner .hint-notes li { padding: 3px 8px; border-radius: 0; margin-bottom: 3px; }
.tp-planner .hn-red { background: #ffe3e3; color: #8e2b1e; } .tp-planner .hn-yellow { background: #fff1cf; color: #7a5200; } .tp-planner .hn-green { background: #e3f5e1; color: #2b5d1d; }
.tp-planner .members { border-top: 1px solid var(--line, #edf0f0); }
.tp-planner .child-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 0; flex-wrap: wrap; border-bottom: 1px solid var(--line, #edf0f0); }
.tp-planner .child-row:last-child { border-bottom: 0; }
.tp-planner .m-line { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; min-width: 0; } .tp-planner .m-name { font-size: .9rem; }
.tp-planner .dnd-card:not(.already-planned *) { cursor: grab; }
.tp-planner .yp-badge { display: inline-block; background: #eef5e0; border-radius: 0; padding: 2px 6px; font-size: .75rem; white-space: nowrap; }
.tp-planner .yp-badge-l { background: #e3eefb; }
.tp-planner .ball-rot { background: #fde0e0; } .tp-planner .ball-orange { background: #ffe9cf; } .tp-planner .ball-gruen { background: #def3d4; } .tp-planner .ball-gelb { background: #fbf3c0; }
.tp-planner .hint-badge { background: #fff1cf; } .tp-planner .hint-disc { background: #ffd9b0; font-weight: 600; }
.tp-planner .gc-actions { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin: 0 0 8px; }
.tp-planner .gc-trainer { display: flex; align-items: center; gap: 6px; font-size: .8rem; }
.tp-planner .alternate-slot-box, .tp-planner .alt-panel { display: grid; gap: 8px; padding: 8px; margin: 6px 0; border: 1px solid var(--tp-orange); border-radius: 0; background: #fffaf0; }
.tp-planner .alt-item { display: flex; justify-content: space-between; gap: 8px; align-items: center; border-top: 1px solid #f0e2c4; padding-top: 6px; }
.tp-planner .ua-item { border: 1px solid var(--line, #e1e8e8); border-radius: 0; padding: 10px; margin-bottom: 10px; background: var(--surface-000, #fff); }
.tp-planner .ua-head { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.tp-planner .ua-line { margin: 4px 0; font-size: .85rem; } .tp-planner .ua-miss { color: #a03a1f; } .tp-planner .ua-note { font-size: .82rem; color: #8a5a00; }
.tp-planner .ua-opt { display: flex; justify-content: space-between; gap: 8px; align-items: center; background: #f4f9ee; border-radius: 0; padding: 8px; margin-top: 6px; font-size: .85rem; }
.tp-planner .dnd-new { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 10px 0; }
.tp-planner .dnd-zone { border: 2px dashed var(--tp-grey); border-radius: 0; padding: 10px; text-align: center; font-size: .85rem; }
.tp-planner .dz-key { padding: 1px 6px; border-radius: 0; }
.tp-planner .dnd-green, .tp-planner .dz-key.dnd-green { outline: 3px solid var(--tp-green); background-color: #e6f7df; }
.tp-planner .dnd-yellow, .tp-planner .dz-key.dnd-yellow { outline: 3px solid var(--tp-orange); background-color: #fff3d6; }
.tp-planner .dnd-red, .tp-planner .dz-key.dnd-red { outline: 3px solid var(--tp-red); background-color: #ffe6e6; }
.tp-planner .dnd-gray { outline: 2px dashed var(--tp-grey); }
.tp-planner .dnd-over { box-shadow: 0 0 0 4px rgba(20, 42, 58, .35); }
.tp-planner .mk-green { background: #e6f7df; } .tp-planner .mk-yellow { background: #fff3d6; } .tp-planner .mk-red { background: #ffe6e6; }
.tp-planner .dragging { opacity: .4; } .tp-planner .just-moved { background: #fffbd1; transition: background 1.4s; }
.dnd-ghost-chip { position: fixed; left: 0; top: 0; z-index: 9999; pointer-events: none; background: #142a3a; color: #fff; padding: 6px 10px; border-radius: 0; font-size: .85rem; box-shadow: 0 6px 18px rgba(0, 0, 0, .25); }
#dnd-hint { position: fixed; left: 50%; bottom: 20px; transform: translateX(-50%); z-index: 9998; max-width: min(92vw, 640px); background: #3a2a14; color: #fff; padding: 10px 14px; border-radius: 0; display: none; }
#dnd-hint.ok { background: #1f4d2b; }
body.dnd-active { user-select: none; cursor: grabbing; }
.tp-planner .success { padding: 6px 10px; border-radius: 0; background: #eef5e0; color: #38531a; margin: 0 0 8px; }
/* Gruppenplanung kompakt (0.35.9): Wann zuerst, Grünes ohne Erklärtext, Knöpfe im App-Stil, Verschieben klein */
.tp-planner .tp-ovbox { padding: 12px 16px; }
.tp-planner .tp-ovsum { display: flex; align-items: center; gap: 14px; cursor: pointer; list-style: none; }
.tp-planner .tp-ovsum::-webkit-details-marker { display: none; }
.tp-planner .tp-ovline { white-space: nowrap; font-size: .95rem; }
.tp-planner .tp-ovsum .tp-bar { flex: 1; margin: 0; min-width: 80px; }
.tp-planner .tp-ovmore { font-size: .85rem; color: var(--brand); white-space: nowrap; }
.tp-planner .tp-ovbox[open] .tp-ovmore { visibility: hidden; }
@media (max-width: 700px) {
  .tp-planner .tp-ovsum { flex-wrap: wrap; gap: 6px 12px; }
  .tp-planner .tp-ovline { white-space: normal; }
  .tp-planner .tp-ovsum .tp-bar { flex-basis: 100%; order: 3; }
  .tp-planner .gp-main { order: -1; }
  .tp-planner .gc-trainer select { max-width: 100%; }
}
.tp-planner .tp-ovbox[open] .tp-ovsum { margin-bottom: 12px; }
.tp-planner .gc-when { margin: 0 0 2px; font-weight: 800; font-size: 1rem; letter-spacing: -.01em; }
.tp-planner .gc-head h2 { font-size: .95rem; font-weight: 600; color: var(--ink-muted); }
.tp-planner .group.fit-green .gc-fit, .tp-planner .group.fit-green .fit-reason { display: none; }
.tp-planner .group { padding: 10px 12px; }
.tp-planner .groups { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.tp-planner .child-row { flex-wrap: nowrap; padding: 4px 0; }
.tp-planner .m-move select { min-height: 30px; font-size: .9rem; }
.tp-planner .child-row { position: relative; }
.tp-planner .grid3 { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-bottom: 4px; }
.tp-planner .grid3 .stat { background: none; padding: 0; gap: 5px; }
.tp-planner .grid3 .stat strong { font-size: .95rem; }
.tp-planner .m-line { flex: 1; }
.tp-planner .m-move { flex: none; }
.tp-planner .m-move select { width: 44px; max-width: 44px; padding: 2px 4px; text-overflow: clip; color: var(--ink-muted); background-image: none; text-align: center; }
@media (max-width: 700px) { .tp-planner .dnd-new { display: none; } }
}
.tp-planner .gc-trainer span { white-space: nowrap; }
.tp-planner .gc-trainer select { min-height: 32px; font-size: .82rem; max-width: 190px; }
.tp-planner button:not(.btn):not(.cw-btn) { display: inline-flex; align-items: center; gap: 4px; min-height: 30px; padding: 0 10px; border-radius: 0; border: 1px solid var(--border); background: var(--surface-000); color: var(--ink); font: inherit; font-size: .8rem; font-weight: 600; cursor: pointer; }
.tp-planner button:not(.btn):not(.cw-btn):hover { border-color: var(--brand); color: var(--brand); }
.tp-planner .accept-group, .tp-planner .ua-apply { background: var(--brand) !important; border-color: var(--brand) !important; color: #fff !important; }
.tp-planner .gc-dot-green { background: var(--tp-green); display: inline-block; } .tp-planner .gc-dot-orange { background: var(--tp-orange); display: inline-block; } .tp-planner .gc-dot-red { background: var(--tp-red); display: inline-block; }
.tp-planner .tp-howto { margin: 0 0 4px; } .tp-planner .tp-howto-more { margin: 0 0 8px; font-size: .85rem; } .tp-planner .tp-howto-more summary { cursor: pointer; color: var(--brand); }
@media (prefers-color-scheme: dark) {
  .tp-planner .group.fit-green { background: color-mix(in srgb, var(--tp-green) 12%, var(--surface-000)); }
  .tp-planner .group.fit-orange { background: color-mix(in srgb, var(--tp-orange) 12%, var(--surface-000)); }
  .tp-planner .group.fit-red { background: color-mix(in srgb, var(--tp-red) 12%, var(--surface-000)); }
  .tp-planner .group.already-planned { background: var(--surface-100, #1c1f26); color: var(--ink-muted); }
  .tp-planner .yp-badge { background: color-mix(in srgb, #8bc34a 18%, var(--surface-000)); color: var(--ink); }
  .tp-planner .yp-badge-l { background: color-mix(in srgb, #3b82f6 20%, var(--surface-000)); }
  .tp-planner .ball-rot { background: color-mix(in srgb, #ef4444 25%, var(--surface-000)); } .tp-planner .ball-orange { background: color-mix(in srgb, #f97316 25%, var(--surface-000)); }
  .tp-planner .ball-gruen { background: color-mix(in srgb, #22c55e 25%, var(--surface-000)); } .tp-planner .ball-gelb { background: color-mix(in srgb, #eab308 25%, var(--surface-000)); }
  .tp-planner .hint-badge, .tp-planner .hint-disc { background: color-mix(in srgb, #f59e0b 25%, var(--surface-000)); }
  .tp-planner .ua-opt, .tp-planner .success { background: color-mix(in srgb, #8bc34a 14%, var(--surface-000)); color: var(--ink); }
  .tp-planner .tp-ov-need { background: var(--surface-100, #1c1f26); } .tp-planner .tp-ov-done { background: color-mix(in srgb, #22c55e 14%, var(--surface-000)); } .tp-planner .tp-ov-open { background: color-mix(in srgb, #f59e0b 14%, var(--surface-000)); }
  .tp-planner .alternate-slot-box, .tp-planner .alt-panel { background: color-mix(in srgb, var(--tp-orange) 10%, var(--surface-000)); }
}
@media (max-width: 900px) { .tp-planner .gp-layout { grid-template-columns: 1fr; } .tp-planner .gp-side { position: static; max-height: none; } .tp-planner .grid3, .tp-planner .dnd-new { grid-template-columns: 1fr; } }

/* Trainingsplanung: Wochenplan */
.tp-sched .legend { display: flex; gap: 10px; flex-wrap: wrap; font-size: .85rem; margin-bottom: 12px; }
.tp-sched .legend span { padding: 4px 9px; border-radius: 0; }
.tp-sched .lg { background: #ECFDF5; } .tp-sched .lo { background: #FFFBEB; } .tp-sched .lr { background: #FEF2F2; }
.tp-sched .layout { display: grid; grid-template-columns: minmax(280px, 26%) minmax(0, 1fr); gap: 14px; align-items: start; margin-bottom: 14px; }
.tp-sched .layout > section:first-child { position: sticky; top: 14px; max-height: calc(100vh - 28px); overflow-y: auto; }
.tp-sched .pool { display: flex; flex-direction: column; gap: 8px; }
.tp-sched .group-card { position: relative; border: 1px solid var(--border); border-left: 4px solid var(--border-strong); border-radius: 0; padding: 10px 30px 10px 12px; background: var(--surface-000); font-size: .85rem; cursor: grab; touch-action: pan-y; }
.tp-sched .group-card.green, .tp-sched .placed.fit-green { border-left-color: #4caf6f; }
.tp-sched .group-card.orange, .tp-sched .placed.fit-orange { border-left-color: #e9a63a; }
.tp-sched .group-card.red, .tp-sched .placed.fit-red { border-left-color: #d86a6a; }
.tp-sched .gc-head { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.tp-sched .gc-slot { display: block; color: var(--ink-muted); margin: 3px 0 5px; font-size: .78rem; }
.tp-sched .m-row { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; padding: 2px 0; line-height: 1.3; }
.tp-sched .m-name { font-weight: 700; }
.tp-sched .yp-badge { padding: 1px 7px; font-size: .7rem; border-radius: 0; background: var(--surface-200); }
.tp-sched .recommend-line { margin: 6px 0 4px; font-size: .78rem; color: var(--ink-muted); }
.tp-sched .group-actions { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.tp-sched .pool-return { position: absolute; top: 6px; right: 6px; width: 22px; height: 22px; padding: 0; border: 0; border-radius: 0; background: var(--surface-200); cursor: pointer; line-height: 1; }
.tp-sched .weekdays { display: grid; gap: 14px; }
.tp-sched .day { border: 1px solid var(--border); border-radius: 0; padding: 10px; background: var(--surface-100); overflow-x: auto; }
.tp-sched .day summary { cursor: pointer; font-weight: 800; font-size: 1.05rem; padding: 6px 4px 10px; }
.tp-sched .day-grid { display: grid; grid-template-columns: 54px repeat(var(--trainer-count, 1), minmax(140px, 1fr)); min-width: max-content; }
.tp-sched .grid-head { background: var(--surface-200); padding: 8px; font-weight: 700; border: 1px solid var(--border); font-size: .82rem; }
.tp-sched .time-label { font-size: .76rem; color: var(--ink-muted); padding: 8px 4px; border-bottom: 1px solid var(--border); }
.tp-sched .dropzone { padding: 3px; height: 36px; box-sizing: border-box; border: 1px solid var(--border); position: relative; }
.tp-sched .dropzone.fit-green { background: #ECFDF5; outline: 2px solid #4caf6f; }
.tp-sched .dropzone.fit-orange { background: #FFFBEB; outline: 2px solid #e5a43c; }
.tp-sched .dropzone.fit-red { background: #FEF2F2; outline: 2px solid #d75a5a; }
.tp-sched .dropzone.busy { background: var(--surface-200); }
.tp-sched .slot-hint { font-size: .68rem; line-height: 1.25; padding: 3px; white-space: normal; position: relative; z-index: 5; background: var(--surface-000); }
.tp-sched .empty { font-size: .75rem; color: var(--border-strong); padding: 4px; }
.tp-sched .placed { position: absolute; left: 3px; right: 3px; top: 2px; z-index: 3; box-sizing: border-box; background: var(--success-bg); border: 1px solid var(--border); border-left: 4px solid #4caf6f; border-radius: 0; padding: 5px 24px 4px 7px; font-size: .75rem; overflow: hidden; cursor: grab; touch-action: pan-y; }
.tp-sched .placed.fit-orange { background: var(--warning-bg); } .tp-sched .placed.fit-red { background: var(--danger-bg); }
.tp-sched .placed:hover { height: auto !important; z-index: 30; box-shadow: 0 8px 22px rgba(20, 42, 58, .18); }
.tp-sched .placed .edit { position: absolute; top: 3px; right: 3px; width: 20px; height: 20px; padding: 0; border: 0; border-radius: 0; background: rgba(20, 42, 58, .08); font-size: 0; cursor: pointer; }
.tp-sched .placed .edit::before { content: "×"; font-size: 1rem; line-height: 20px; display: block; text-align: center; color: var(--ink); }
.tp-sched .fit-note { margin-top: 4px; font-size: .7rem; line-height: 1.3; border-radius: 0; padding: 3px 6px; background: rgba(0, 0, 0, .05); }
body.dnd-active { user-select: none; cursor: grabbing; }
.dnd-source { opacity: .35; }
.dnd-ghost { position: fixed; left: 0; top: 0; z-index: 10000; pointer-events: none; margin: 0; box-shadow: 0 14px 34px rgba(20, 42, 58, .28); opacity: .97; max-height: 240px; overflow: hidden; border-radius: 0; background: var(--surface-000); border: 1px solid var(--border); padding: 10px; box-sizing: border-box; }
.dnd-ghost.dnd-return { transition: opacity .2s; opacity: 0; }
.dnd-ghost .group-actions, .dnd-ghost .recommend-line, .dnd-ghost select, .dnd-ghost .pool-return { display: none; }
.dnd-preview { position: fixed; left: 0; top: 0; z-index: 9990; pointer-events: none; border-radius: 0; border: 2px dashed #4caf6f; background: rgba(76, 175, 111, .16); transition: transform .11s, width .11s, height .11s, opacity .1s; opacity: 0; box-sizing: border-box; font-size: .7rem; font-weight: 800; padding: 3px 6px; overflow: hidden; }
.dnd-preview.on { opacity: 1; }
.dnd-preview.orange { border-color: #e5a43c; background: rgba(229, 164, 60, .18); }
.dnd-preview.red { border-color: #d75a5a; background: rgba(215, 90, 90, .16); }
.dnd-preview.blocked { border-style: solid; border-color: var(--border-strong); background: rgba(120, 130, 135, .2); }
@media (max-width: 900px) { .tp-sched .layout { grid-template-columns: minmax(0, 1fr); } .tp-sched .layout > section:first-child { position: static; max-height: none; } }
/* Finanzen */
.kpi-link { text-decoration: none; color: inherit; }
.kpi-link:hover { border-color: var(--brand); }
.money.is-in { color: var(--success); }
.money.is-out { color: var(--ink); }
.booking-list li { display: block; }
.booking-main { display: flex; gap: 12px; align-items: flex-start; }
.booking-cat { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 6px; }
.booking-cat .select-sm { max-width: 280px; }
.booking-cat .select-sm.is-missing { border-color: var(--warning); }
.booking-more { flex: 0 0 auto; }
.booking-more[open] { flex: 1 1 100%; }
.booking-more > summary { list-style: none; display: inline-flex; }
.booking-more > summary::-webkit-details-marker { display: none; }
.booking-list li.is-cancelled .booking-main { opacity: .6; text-decoration: line-through; }
.compact-table td { padding: 6px 4px; }
.choices-inline { display: flex; gap: 16px; flex-wrap: wrap; border: 0; padding: 0; margin: 0; }
.meter-fill.is-warn { background: var(--warning); }
.meter-fill.is-danger { background: var(--danger); }
.count-table input { width: 80px; text-align: right; }
.count-table td, .count-table th { padding: 4px 6px; }
.entity-switch a[aria-current="page"] { background: var(--brand); color: #fff; border-color: var(--brand); }
@media (min-width: 1100px) { .fin-grid { grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr); } }
.count-grid { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); }
.count-cell { display: flex; flex-direction: column; gap: 2px; font-size: 13px; color: var(--ink-muted); }
.count-cell input { text-align: right; min-height: 38px; }
.cat-form { flex-wrap: wrap; }
.cat-form input[type=text] { flex: 1 1 180px; min-height: 36px; padding: 4px 8px; }
.cat-form select { max-width: 230px; }
.acc-item { border-bottom: 1px solid var(--border); padding: 10px 0; }
.acc-item:last-of-type { border-bottom: 0; }
.acc-item > summary { cursor: pointer; }
.user-choices { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 4px 12px; }
.table td .meta { display: block; }
.cat-item { display: block; }
.cat-item > details > summary { display: flex; gap: 12px; align-items: center; cursor: pointer; list-style: none; }
.cat-item > details > summary::-webkit-details-marker { display: none; }
.cat-item.is-inactive .grow > span:first-child { color: var(--ink-muted); text-decoration: line-through; }
.cat-item summary .grow { flex: 1; display: flex; flex-direction: column; }
.donor-pick select { max-width: none; flex: 1 1 220px; }
.donor-item > details > summary { display: flex; gap: 10px; align-items: center; cursor: pointer; list-style: none; }
.donor-item > details > summary::-webkit-details-marker { display: none; }
.donor-item summary .grow, .allow-item .grow { flex: 1; display: flex; flex-direction: column; }
.donor-item, .allow-item { display: block; }
.compact-list li { padding: 6px 0; }
.steps-list { padding-left: 18px; margin: 0 0 12px; }
li.is-cancelled .grow { opacity: .6; text-decoration: line-through; }
.list > li.donor-item, .list > li.allow-item, .list > li.cat-item, .booking-list > li { display: block; }
.donor-item > details, .cat-item > details { width: 100%; }

/* Navigation in Gruppen */
.navgroup { display: flex; flex-direction: column; gap: 2px; }
.navgroup + .navgroup { margin-top: 10px; }
.navgroup-items { display: flex; flex-direction: column; gap: 2px; }
.navgroup-head { display: flex; align-items: center; justify-content: space-between; width: 100%; background: none; border: 0; cursor: pointer;
  padding: 4px 12px; font: inherit; font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted); border-radius: 0; }
.navgroup-head:hover { color: var(--ink); background: var(--surface-200); }
.navgroup-head svg { width: 14px; height: 14px; transition: transform .15s; }
.navgroup-head[aria-expanded="false"] svg { transform: rotate(-90deg); }
.navgroup-head[aria-expanded="false"] + .navgroup-items { display: none; }
.navtoggle { display: none; }
@media (max-width: 760px) {
  .navtoggle { display: inline-flex; order: -1; margin: 0 4px 0 -6px; }
  .sidenav { display: none; flex-direction: column; overflow: visible; padding: 12px; border-bottom: 1px solid var(--border); box-shadow: 0 8px 16px rgba(0,0,0,.06); }
  body.nav-open .sidenav { display: flex; }
  .sidenav a { padding: 0 12px; }
  .navgroup + .navgroup { margin-top: 6px; }
}
.count-mode { display: flex; gap: 6px; }
.count-mode[hidden] { display: none; }
.count-mode [aria-pressed="true"] { background: var(--brand); color: #fff; border-color: var(--brand); }
.count-wizard { text-align: center; padding: 8px 0; }
.cw-question { font-size: 22px; font-weight: 700; margin: 6px 0 12px; }
.cw-stepper { display: flex; justify-content: center; align-items: center; gap: 10px; }
.cw-btn { min-width: 64px; min-height: 64px; font-size: 28px; line-height: 1; }
.cw-input { width: 110px; min-height: 64px; font-size: 30px; text-align: center; font-variant-numeric: tabular-nums; }
.cw-nav { justify-content: center; margin-top: 12px; }
.count-form.is-wizard .count-grid { display: none; }
.count-form.is-wizard:not(.at-end) .count-final { display: none; }
.count-form.is-wizard .count-total { text-align: center; font-size: 18px; }
.stack-sm { display: flex; flex-direction: column; gap: 12px; }
.input-datev { width: 120px; min-height: 36px; padding: 4px 8px; }
.table tr.is-current td { background: var(--brand-subtle); }
.summary-head { cursor: pointer; list-style: none; margin-bottom: 0; }
.summary-head::-webkit-details-marker { display: none; }
.summary-head h2 { color: var(--brand-text); }
.demo-locked { text-align: center; max-width: 520px; margin: 8vh auto; }
.demo-locked h1 { margin: 16px 0 8px; }
.demo-locked .lead { font-size: 18px; }

/* Einrichtungs-Assistenten */
.setup-list { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.setup-card { display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: inherit; }
.setup-card:hover { border-color: var(--brand); }
.setup-card-head { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.setup-banner { display: flex; align-items: center; gap: 16px; text-decoration: none; color: inherit; border-left: 4px solid var(--brand); }
.setup-banner-text { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.setup-banner-meter { width: 120px; flex: none; }
.setup-progress { display: flex; align-items: center; gap: 12px; }
.setup-progress .meter { flex: 1; max-width: 360px; }
.setup-grid { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 24px; align-items: start; }
.setup-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.setup-steps a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 0; text-decoration: none; color: var(--ink); }
.setup-steps a:hover { background: var(--surface-200); }
.setup-steps .is-current a { background: var(--brand-subtle); font-weight: 700; }
.setup-dot { width: 26px; height: 26px; border-radius: 0; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; border: 2px solid var(--border-strong); flex: none; }
.setup-steps .is-done .setup-dot { background: var(--success); border-color: var(--success); color: #fff; }
.setup-card-step h2 { margin-top: 4px; }
.setup-acc { border: 1px solid var(--border); border-radius: 0; padding: 12px; margin: 0 0 12px; }
.setup-acc legend { font-size: 13px; color: var(--ink-muted); padding: 0 4px; }
.field-inline { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.field-inline label { margin: 0; }
.setup-actions { margin-top: 8px; }
@media (max-width: 760px) {
  .setup-grid { grid-template-columns: minmax(0, 1fr); }
  .setup-steps { flex-direction: row; overflow-x: auto; }
  .setup-steps a span:last-child { white-space: nowrap; }
  .setup-banner { flex-wrap: wrap; }
}
.og-preview img { border-radius: 0; border: 1px solid var(--border); max-width: 100%; height: auto; display: block; margin-bottom: 8px; }
.sidenav a.is-open { font-weight: 700; }
.subnav { display: flex; flex-direction: column; gap: 1px; margin: 0 0 6px 30px; padding-left: 10px; border-left: 2px solid var(--border); }
.sidenav .subnav a { min-height: 34px; font-size: 14px; padding: 0 10px; font-weight: 500; }
.sidenav .subnav a[aria-current="page"] { font-weight: 700; }
.statbars { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.statbars li { display: grid; grid-template-columns: minmax(90px, 160px) minmax(0, 1fr) auto; gap: 10px; align-items: center; font-size: 14px; }
.statbars-n { font-variant-numeric: tabular-nums; white-space: nowrap; }
.tday-row { display: grid; grid-template-columns: minmax(110px, 1fr) minmax(0, 1fr) minmax(0, 1fr); gap: 8px; align-items: center; margin-bottom: 6px; }
.input-mini { width: 72px !important; min-height: 34px; padding: 2px 6px; display: inline-block; margin: 0 4px; }
.duration-field .check { align-items: center; }
.duration-field .check span { line-height: 2.2; }

/* Tipps an Fachbegriffen */
button.tip, .tip-demo { display: inline-grid; place-items: center; width: 17px; height: 17px; margin: 0 2px 0 4px; padding: 0; border: 1px solid var(--border-strong); border-radius: 0; background: var(--surface-000); color: var(--ink-muted); font: 700 11px/1 inherit; vertical-align: 2px; cursor: help; text-transform: none; letter-spacing: 0; }
button.tip:hover, button.tip:focus-visible, button.tip[aria-expanded="true"] { background: var(--brand); border-color: var(--brand); color: #fff; outline: none; }
.tip-pop { position: absolute; z-index: 9990; background: #1F2937; color: #fff; border: 1px solid #374151; border-radius: 0; padding: 10px 12px; box-shadow: 0 8px 24px rgba(0,0,0,.25); font-size: 14px; line-height: 1.45; font-weight: 400; text-align: left; }
.tip-pop strong { display: block; margin-bottom: 2px; }
.tip-pop p { margin: 0 0 6px; }
.tip-pop .tip-off { background: none; border: 0; padding: 0; color: #cbd5e1; font-size: 12px; text-decoration: underline; cursor: pointer; }
@media print { button.tip, .tip-pop { display: none !important; } }
.dl-grid { display: grid; grid-template-columns: minmax(120px, max-content) minmax(0, 1fr); gap: 6px 16px; margin: 0; }
.dl-grid dt { color: var(--ink-muted); font-size: 14px; }
.dl-grid dd { margin: 0; }
table.availability-view td { padding: 4px; font-weight: 700; color: var(--brand-text); }
table.availability-view td.is-yes { background: var(--brand-subtle); }
/* Trainer verwalten */
.kpis-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.kpi-tile { background: var(--surface-100, #f3f5f7); border-radius: 0; padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; }
.kpi-tile strong { font-size: 22px; }
.kpi-tile.is-brand { background: var(--brand-subtle); }
.tr-filter { display: grid; grid-template-columns: minmax(0, 1fr) 220px 220px; gap: 10px; }
.trainer-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.trainer-card { display: flex; align-items: center; gap: 14px; border: 1px solid var(--border); border-radius: 0; padding: 14px 16px; }
.trainer-card.is-inactive { opacity: .6; }
.trainer-card .chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
@media (max-width: 760px) { .kpis-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .tr-filter { grid-template-columns: 1fr; } .trainer-card { flex-wrap: wrap; } .trainer-card .btn { margin-left: 50px; } }
.trainer-card .grow { flex: 1; min-width: 0; }
.trainer-card .btn-row { flex: none; }
.tp-filters { display: flex; flex-wrap: wrap; gap: 12px 24px; align-items: flex-end; }
.tp-filters input[type=search] { max-width: 260px; }
.tp-filters fieldset { border: 0; padding: 0; margin: 0; }
.tp-filters .chips { display: flex; flex-wrap: wrap; gap: 6px; }
.tp-filters .chip { padding: 4px 10px; font-size: 13px; }
.take-list { max-height: 320px; overflow-y: auto; display: flex; flex-direction: column; gap: 4px; border: 1px solid var(--border); border-radius: 0; padding: 8px 12px; }
.tp-filters fieldset + fieldset { border-top: 0; padding-top: 0; margin-top: 0; }
.card .row > fieldset + fieldset { border-top: 0; padding-top: 0; margin-top: 0; }

/* Postfach */
.inbox { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 16px; align-items: start; }
.inbox-read { grid-template-columns: minmax(0, 1fr) 300px; }
.inbox-read .mail-reply { grid-column: 1; }
.inbox-side { display: flex; flex-direction: column; gap: 8px; position: sticky; top: 16px; }
.inbox-side select { width: 100%; }
.inbox-new { justify-content: center; }
.inbox-folders { display: flex; flex-direction: column; gap: 2px; }
.inbox-folders a { padding: 8px 12px; border-radius: 0; color: var(--ink); text-decoration: none; font-size: 14px; }
.inbox-folders a:hover { background: var(--surface-100); }
.inbox-folders a[aria-current="page"] { background: var(--brand-subtle); color: var(--brand-text); font-weight: 600; }
.inbox-folders hr { border: 0; border-top: 1px solid var(--border); margin: 6px 0; width: 100%; }
.inbox-list { padding: 0; overflow: hidden; }
.inbox-list > .empty, .inbox-list > .alert, .inbox-list > .hint, .inbox-list > nav { margin: 16px; }
.mail-rows { list-style: none; margin: 0; padding: 0; }
.mail-row + .mail-row { border-top: 1px solid var(--border); }
.mail-row a { display: grid; grid-template-columns: minmax(120px, 220px) minmax(0, 1fr) auto 70px; gap: 12px; align-items: center; padding: 11px 16px; color: var(--ink); text-decoration: none; }
.mail-row a:hover { background: var(--surface-100); }
.mail-row.is-unread a { font-weight: 700; }
.mail-row.is-unread .mail-from::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 0; background: var(--brand); margin-right: 8px; vertical-align: 1px; }
.mail-from, .mail-subj { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mail-date { color: var(--ink-muted); font-size: 13px; text-align: right; font-weight: 400; }
.mail-tags { display: flex; gap: 4px; font-weight: 400; }
.mail-head { display: grid; gap: 4px; margin: 0 0 12px; font-size: 14px; }
.mail-head div { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 8px; }
.mail-head dt { color: var(--ink-muted); }
.mail-head dd { margin: 0; overflow-wrap: anywhere; }
.mail-files { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; padding: 0; margin: 0 0 12px; }
.mail-body { border-top: 1px solid var(--border); padding-top: 14px; line-height: 1.6; overflow-wrap: anywhere; }
.mail-frame { width: 100%; height: 70vh; border: 1px solid var(--border); border-radius: 0; background: #fff; }
@media (max-width: 900px) {
  .inbox, .inbox-read { grid-template-columns: minmax(0, 1fr); }
  .inbox-side { position: static; }
  .inbox-folders { flex-direction: row; overflow-x: auto; gap: 4px; }
  .inbox-folders a { white-space: nowrap; padding: 6px 10px; }
  .inbox-folders hr, .inbox-side > p { display: none; }
  .mail-row a { gap: 2px 12px; }
  .mail-row a { grid-template-columns: minmax(0, 1fr) auto; }
  .mail-row .mail-subj { grid-column: 1 / -1; grid-row: 2; }
  .mail-row .mail-tags { grid-column: 1 / -1; grid-row: 3; }
  .mail-row .mail-tags:empty { display: none; }
}
.check-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 6px 16px; }
.rm-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 16px; align-items: start; }
.rm-grid details summary { cursor: pointer; font-weight: 600; padding: 4px 0; }
.rm-list { max-height: 260px; overflow: auto; }
.rm-list li { padding: 3px 0; }
@media (max-width: 1000px) { .rm-grid { grid-template-columns: minmax(0, 1fr); } }
.list-plain { list-style: none; margin: 0; padding: 0; }
.row-between { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 6px 0; }
.row-between + .row-between { border-top: 1px solid var(--border); }
.spam-box summary { cursor: pointer; font-size: 14px; color: var(--ink-muted); padding: 4px 0; }
.inbox-note { margin: 12px 16px 0; }
.inbox-read .mail-actions { grid-column: 2; grid-row: 1 / span 2; }
.spam-box .check, .spam-box input[type=text] { font-size: 14px; }
@media (max-width: 900px) { .inbox-read .mail-actions { grid-column: auto; grid-row: auto; } }
/* Hilfe */
.help-row { display: flex; gap: 8px; }
.help-row input { flex: 1; min-width: 0; font-size: 17px; }
.help-answer { display: grid; gap: 12px; }
.help-ai { background: var(--brand-subtle); border-radius: 0; padding: 14px 16px; }
.help-ai p { margin: 8px 0 0; line-height: 1.6; }
.help-topics, .help-docs { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.help-topics > li, .help-docs > li { border: 1px solid var(--border); border-radius: 0; padding: 12px 14px; }
.help-topics > li > p { margin: 4px 0 8px; color: var(--ink-muted); font-size: 14px; line-height: 1.5; }
.help-docs blockquote { margin: 6px 0 0; padding-left: 10px; border-left: 3px solid var(--border-strong); color: var(--ink-muted); font-size: 14px; white-space: pre-line; }
.help-all summary { cursor: pointer; }
.help-all .help-topics { margin-top: 12px; }
.kpis-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 800px) { .kpis-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.kpi-tile.is-warning { background: var(--warning-bg); }
.input-num { max-width: 110px; text-align: right; }
.mail-head.wide div { grid-template-columns: 130px minmax(0, 1fr); }
.legal-doc { max-width: 900px; line-height: 1.6; }
.legal-doc h3 { margin: 18px 0 6px; font-size: 16px; }
@media print { .legal-doc { box-shadow: none; border: 0; max-width: none; } }

/* Impressum und Datenschutz in jedem Fuß */
.legalfoot { display: block; font-size: 13px; }
.legalfoot a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.brandfoot .legalfoot { margin: 2px 0; }

/* Passbild: Ausschnitt wählen (verschieben, zoomen) */
.passbild-round { border-radius: 0; width: 120px; height: 120px; object-fit: cover; }
.cropper-form { gap: 10px; }
.cropper { position: relative; width: 240px; height: 240px; border-radius: 0; overflow: hidden; background: var(--surface-200); touch-action: none; cursor: grab; box-shadow: 0 0 0 3px var(--surface-200); }
.cropper.is-dragging { cursor: grabbing; }
.cropper img { position: absolute; left: 0; top: 0; max-width: none; transform-origin: 0 0; user-select: none; pointer-events: none; }
.cropper-zoom { display: flex; align-items: center; gap: 10px; max-width: 240px; font-size: 14px; }
.cropper-zoom input { flex: 1; }

/* Lange Formulare: Speichern-Leiste bleibt unten am Bildschirm stehen */
.savebar { position: sticky; bottom: 0; z-index: 6; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 0 -20px -20px; padding: 12px 20px; background: var(--surface-000); border-top: 1px solid var(--border); border-radius: 0; box-shadow: 0 -10px 16px -12px rgba(0,0,0,.18); }
form:not(.card) > .savebar { margin: 0; border-radius: 0; border: 1px solid var(--border); }
.savebar-note { font-size: 13px; color: var(--ink-muted); }
.savebar.is-dirty .savebar-note { color: var(--warning, #92400E); font-weight: 600; }
@media (max-width: 760px) { .savebar { padding-bottom: calc(12px + env(safe-area-inset-bottom)); } }

/* Postfach-Assistent */
.step-head { display: flex; align-items: center; gap: 10px; margin: 18px 0 2px; font-weight: 700; }
.step-head:first-of-type { margin-top: 4px; }
.step-no { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 0; background: var(--brand-subtle); color: var(--brand-text); font-size: 14px; }
.mp-details { border: 1px solid var(--border); border-radius: 0; padding: 10px 14px; }
.mp-details summary { cursor: pointer; font-weight: 600; }
.mp-note { padding: 10px 12px; border-radius: 0; background: var(--brand-subtle); color: var(--ink); }

/* Mail-Signatur */
.sig-frame { width: 100%; height: 520px; border: 1px solid var(--border); border-radius: 0; background: #fff; margin: 12px 0 8px; }
.sig-preview .tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.banner-list li { display: grid; gap: 10px; padding: 14px 0; border-top: 1px solid var(--border); }
.banner-list li:first-child { border-top: 0; }
.banner-thumb { width: 100%; max-width: 480px; height: auto; border-radius: 0; border: 1px solid var(--border); }

/* Anhänge in Mails */
.attach-box { border: 1px solid var(--line, #e5e7eb); border-radius: 0; padding: 12px 14px; margin: 0; }
.attach-box legend { font-weight: 600; padding: 0 6px; }
.attach-docs summary { cursor: pointer; font-weight: 600; margin: 4px 0; }
.attach-docs .check { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }

/* Badges: neue Mails, neue Aufgaben */
.navbadge { margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 0; background: var(--danger, #dc2626); color: #fff; font-size: 12px; font-weight: 700; line-height: 20px; text-align: center; }
.navbadge[hidden], .navdot[hidden] { display: none; }
.navtoggle { position: relative; }
.navdot { position: absolute; top: 6px; right: 6px; width: 10px; height: 10px; border-radius: 0; background: var(--danger, #dc2626); box-shadow: 0 0 0 2px var(--surface-000, #fff); }
.newbox { margin: 0 0 20px; padding: 14px 18px; border-radius: 0; background: color-mix(in srgb, var(--brand, #0f766e) 9%, var(--surface-000, #fff)); border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 30%, transparent); }
.newbox-head { display: flex; align-items: center; gap: 10px; font-size: 1rem; margin: 0 0 8px; }
.newbox-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.newbox-list a { display: inline-flex; gap: 8px; align-items: center; text-decoration: none; color: inherit; }
.newbox-list a:hover span { text-decoration: underline; }
.newbox .pulse { width: 10px; height: 10px; border-radius: 0; background: var(--danger, #dc2626); animation: vl-pulse 1.6s ease-out infinite; }
@keyframes vl-pulse { 0% { box-shadow: 0 0 0 0 rgba(220, 38, 38, .5); } 100% { box-shadow: 0 0 0 10px rgba(220, 38, 38, 0); } }
@media (prefers-reduced-motion: reduce) { .newbox .pulse { animation: none; } }
.check-hint { align-items: flex-start; }
.check-hint > span { display: flex; flex-direction: column; gap: 1px; }
.check-hint .hint { font-weight: 400; }

/* Kassenprüfung */
.audit-figs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.audit-figs > div { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 0; background: var(--surface-100, #f8fafc); }
.audit-figs strong { font-size: 1.05rem; }
@media (max-width: 640px) { .audit-figs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.audit-checks > li { display: block; }
.audit-facts { margin: 6px 0 0; padding: 6px 10px 6px 26px; border-radius: 0; background: var(--surface-100, #f8fafc); font-size: 13px; }
.audit-facts.is-warn { background: var(--warning-bg); color: var(--warning); }
.audit-check-form { display: flex; flex-direction: row; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 8px; }
.member-content:has(.audit-grid), .member-content:has(.audit-bookings) { max-width: 1180px; }
.audit-check-form input[type=text] { flex: 1 1 220px; min-height: 36px; }
.seg { display: inline-flex; border: 1px solid var(--border); border-radius: 0; overflow: hidden; }
.seg-opt { position: relative; cursor: pointer; }
.seg-opt input { position: absolute; opacity: 0; pointer-events: none; }
.seg-opt span { display: inline-flex; align-items: center; min-height: 34px; padding: 0 12px; font-size: 13px; font-weight: 600; }
.seg-opt + .seg-opt span { border-left: 1px solid var(--border); }
.seg-opt input:focus-visible + span { outline: 2px solid var(--brand); outline-offset: -2px; }
.seg-ok input:checked + span { background: var(--success-bg); color: var(--success); }
.seg-hinweis input:checked + span { background: var(--warning-bg); color: var(--warning); }
.seg-mangel input:checked + span { background: var(--danger-bg); color: var(--danger); }
.audit-questions li.is-done { opacity: .7; }
.audit-answer { margin: 8px 0 0; padding: 8px 12px; border-left: 3px solid var(--brand); background: var(--surface-100, #f8fafc); border-radius: 0; }
.audit-summary { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0; }
.audit-summary dt { color: var(--ink-muted); }
.audit-summary dd { margin: 0; }
.audit-row-actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 6px; }
.audit-row-actions form { margin: 0; }
.audit-bookings li.is-sample { border-left: 3px solid var(--brand); padding-left: 10px; }
.audit-draw .row { align-items: end; }
.field-end { display: flex; align-items: flex-end; }
.steps-plain { margin: 0; padding-left: 20px; display: grid; gap: 6px; }
.tabs-sm a { min-height: 32px; font-size: 13px; }
.audit-toolbar { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; justify-content: space-between; }
.audit-filter { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.audit-filter select, .audit-filter input { min-height: 38px; width: auto; }
.audit-draw .row { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.audit-draw .row > .field { flex: 1 1 160px; }
.audit-draw .row > .field-end { flex: 0 0 auto; }

/* Kiosk */
.kiosk-group { margin: 12px 0 8px; font-size: 14px; color: var(--ink-muted); text-transform: uppercase; letter-spacing: .04em; }
.kiosk-cats { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.kiosk-cat { min-height: 40px; padding: 0 16px; border-radius: 0; border: 1px solid var(--border); background: var(--surface-000); color: var(--ink); font: inherit; font-weight: 600; cursor: pointer; }
.kiosk-cat[aria-pressed="true"] { background: var(--brand); border-color: var(--brand); color: #fff; }
.theke-main .kiosk-cat { min-height: 52px; font-size: 18px; padding: 0 20px; }
.kiosk-tile[hidden] { display: none; }
.input-prefix { display: flex; align-items: stretch; }
.input-prefix > span { display: inline-flex; align-items: center; padding: 0 10px; border: 1px solid var(--border); border-right: 0; border-radius: 0; background: var(--surface-100, #f8fafc); color: var(--ink-muted); font-size: 14px; }
.input-prefix > input { border-top-left-radius: 0; border-bottom-left-radius: 0; flex: 1; min-width: 0; }
.row-inline, .list .grow.row-inline { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
.row-inline .is-placeholder { visibility: hidden; }
.receipt-lines select { min-width: 190px; }
.receipt-lines td:first-child { min-width: 170px; }
.row-inline input:not([type=checkbox]) { flex: 1 1 160px; min-width: 0; min-height: 36px; }
.kiosk-items .kiosk-group-head { display: block; padding: 14px 0 4px; border: 0; font-size: 13px; font-weight: 700; color: var(--ink-muted); text-transform: uppercase; letter-spacing: .04em; }
.kiosk-items .kiosk-group-head:first-child { padding-top: 0; }
.receipt-lines td { vertical-align: middle; }
.receipt-lines input, .receipt-lines select { min-height: 36px; }
.receipt-lines .num input { max-width: 90px; text-align: right; }
.receipt-lines tr.is-skip td:not(:first-child) { opacity: .45; }
.receipt-doc img { max-width: 100%; border: 1px solid var(--border); border-radius: 0; }
.receipt-src { font-size: 13px; color: var(--ink-muted); }
.cr-result { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 16px; padding: 12px 16px; border-radius: 0; background: var(--brand-subtle, #e6f2f5); }
.cr-result span { font-size: 13px; color: var(--ink-muted); }
.cr-result strong { font-size: 24px; }
.cr-result strong.is-neg { color: var(--danger, #b91c1c); }
.doc-print { background: #fff; }
.cr-doc { max-width: 720px; margin: 0 auto; padding: 32px 24px; }
.cr-doc h1 { font-size: 26px; margin: 4px 0 20px; }
.cr-doc h2 { font-size: 18px; margin-top: 28px; }
.cr-table { max-width: 520px; }
.cr-table .cr-sum td { border-top: 2px solid var(--ink); }
.cr-sign { margin-top: 64px; width: 280px; border-top: 1px solid var(--ink); padding-top: 4px; font-size: 12px; color: var(--ink-muted); }
@media print { .noprint { display: none !important; } .cr-doc { padding: 0; } }
.allergen-row { border-left: 5px solid var(--gc, var(--border)); display: grid; grid-template-columns: minmax(160px, 1fr) auto auto auto; gap: 8px 16px; align-items: center; padding: 12px 16px; }
.allergen-row.is-suggested { background: #fffbeb; }
@media (max-width: 1100px) { .allergen-row { grid-template-columns: 1fr; } }
.allergen-head .meta { display: block; }
.code-chips { display: flex; flex-wrap: wrap; gap: 4px; border: 0; margin: 0; padding: 0; }
.code-chip { position: relative; cursor: pointer; }
.code-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.code-chip span { display: inline-flex; align-items: center; justify-content: center; min-width: 30px; height: 30px; border-radius: 0; border: 1px solid var(--border); background: var(--surface-000); font-weight: 700; font-size: 13px; color: var(--ink-muted); }
.code-chips.is-num .code-chip span { border-radius: 0; }
.code-chip input:checked + span { background: var(--ink); border-color: var(--ink); color: #fff; }
.code-chip input:focus-visible + span { outline: 2px solid var(--brand); outline-offset: 2px; }
.allergen-ok { white-space: nowrap; }
.legend-list { list-style: none; padding: 0; margin: 6px 0 0; columns: 2; }
.legend-list li { margin-bottom: 2px; }
.offer-list li .check { align-items: flex-start; }
.hint-box { margin: 8px 0 12px; padding: 10px 14px; border-radius: 0; background: var(--surface-100, #f8fafc); border: 1px solid var(--border); }
.hint-box summary { cursor: pointer; font-weight: 600; font-size: 14px; }
.hint-box ul { margin: 8px 0 0; padding-left: 18px; }
.pay-qr { display: inline-block; padding: 12px; background: #fff; border-radius: 0; border: 1px solid var(--border); }
.pay-qr svg { display: block; width: 260px; height: 260px; }
.theke-main .pay-qr svg { width: 320px; height: 320px; }
.kiosk-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.gc-1 { --gc: #2563eb; --gc-bg: #eff5ff; } .gc-2 { --gc: #16a34a; --gc-bg: #effaf2; } .gc-3 { --gc: #ea580c; --gc-bg: #fff4ec; } .gc-4 { --gc: #dc2626; --gc-bg: #fef1f1; }
.gc-5 { --gc: #7c3aed; --gc-bg: #f5f0ff; } .gc-6 { --gc: #0d9488; --gc-bg: #ecfaf8; } .gc-7 { --gc: #db2777; --gc-bg: #fdf0f6; } .gc-8 { --gc: #475569; --gc-bg: #f2f4f7; }
/* Dunkler Modus: Tönung aus der Gruppenfarbe auf dem dunklen Hintergrund, hellere Akzente – sonst helle Schrift auf heller Kachel */
@media (prefers-color-scheme: dark) {
  .gc-1 { --gc: #60a5fa; } .gc-2 { --gc: #4ade80; } .gc-3 { --gc: #fb923c; } .gc-4 { --gc: #f87171; } .gc-5 { --gc: #a78bfa; } .gc-6 { --gc: #2dd4bf; } .gc-7 { --gc: #f472b6; } .gc-8 { --gc: #94a3b8; }
  [class*="gc-"] { --gc-bg: var(--surface-000); }
  @supports (background: color-mix(in srgb, red 10%, white)) { [class*="gc-"] { --gc-bg: color-mix(in srgb, var(--gc) 14%, var(--surface-000)); } }
  .kiosk-cat[class*="gc-"][aria-pressed="true"], .kiosk-count { color: #0b0f19; }
  .allergen-row.is-suggested { background: color-mix(in srgb, #f59e0b 14%, var(--surface-000)); }
}
.kiosk-cat.gc-1, .kiosk-cat.gc-2, .kiosk-cat.gc-3, .kiosk-cat.gc-4, .kiosk-cat.gc-5, .kiosk-cat.gc-6, .kiosk-cat.gc-7, .kiosk-cat.gc-8 { border-color: var(--gc); color: var(--gc); background: var(--gc-bg); }
.kiosk-cat[class*="gc-"][aria-pressed="true"] { background: var(--gc); color: #fff; }
.gc-dot { display: inline-block; width: 12px; height: 12px; border-radius: 0; background: var(--gc); flex: none; margin-right: 6px; vertical-align: -1px; }
.gc-select { max-width: 110px; min-height: 36px; }
.kiosk-items .kiosk-group-head { color: var(--gc, var(--ink-muted)); }
.kiosk-tile { position: relative; display: flex; flex-direction: column; border: 1px solid var(--border); border-top: 6px solid var(--gc, var(--brand)); border-radius: 0; background: var(--gc-bg, var(--surface-000)); overflow: hidden; transition: border-color .15s, box-shadow .15s, transform .08s; -webkit-tap-highlight-color: transparent; user-select: none; }
.kiosk-tile.is-picked { border-color: var(--gc, var(--brand)); box-shadow: 0 0 0 3px var(--gc, var(--brand)); }
.kiosk-tile.is-bump { animation: kiosk-bump .18s ease-out; }
@keyframes kiosk-bump { 50% { transform: scale(.96); } }
@media (prefers-reduced-motion: reduce) { .kiosk-tile.is-bump { animation: none; } }
.kiosk-tile.is-empty { opacity: .55; }
.kiosk-tap { display: flex; flex: 1; flex-direction: column; align-items: flex-start; gap: 2px; padding: 12px 14px 14px; border: 0; background: none; text-align: left; cursor: pointer; font: inherit; color: inherit; min-height: 112px; touch-action: manipulation; }
.kiosk-tap:active { background: rgba(0, 0, 0, .04); }
.kiosk-gname { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--gc, var(--ink-muted)); }
.kiosk-offer { display: inline-block; padding: 1px 6px; border-radius: 0; background: #f59e0b; color: #fff; font-size: 10px; letter-spacing: .03em; }
.kiosk-name { font-weight: 700; line-height: 1.2; padding-right: 44px; }
.kiosk-unit, .kiosk-dep { font-size: 12px; color: var(--ink-muted); }
.kiosk-price { font-weight: 700; color: var(--ink); margin-top: auto; padding-top: 6px; }
.kiosk-count { position: absolute; top: 8px; right: 8px; min-width: 40px; height: 40px; padding: 0 8px; border-radius: 0; background: var(--gc, var(--brand)); color: #fff; font-weight: 800; font-size: 18px; display: none; align-items: center; justify-content: center; pointer-events: none; }
.kiosk-tile.is-picked .kiosk-count { display: inline-flex; }
.kiosk-minus { position: absolute; right: 8px; bottom: 8px; width: 40px; height: 40px; border-radius: 0; border: 1px solid var(--border); background: var(--surface-000); color: var(--ink); font-size: 22px; font-weight: 700; line-height: 1; cursor: pointer; display: none; touch-action: manipulation; }
.kiosk-tile.is-picked .kiosk-minus { display: inline-flex; align-items: center; justify-content: center; }
.kiosk-submit { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.kiosk-total { font-size: 18px; }
.kiosk-total strong { font-size: 22px; }
.kiosk-entries li.is-cancelled .grow { opacity: .55; text-decoration: line-through; }
.kiosk-buyrow { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.kiosk-buyrow label { font-weight: 500; }
.kiosk-buyrow input, .input-sm { max-width: 110px; min-height: 36px; }
.list li.is-muted { opacity: .6; }
.copyline code { display: block; padding: 10px 12px; border-radius: 0; background: var(--surface-200); word-break: break-all; user-select: all; }
/* Theken-Tablet */
.theke-body { background: var(--surface-100, #f8fafc); }
.theke-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 20px; background: var(--brand); color: #fff; }
.theke-top .btn { background: #fff; }
.theke-club { display: flex; align-items: center; gap: 12px; color: #fff; text-decoration: none; }
.theke-club img { border-radius: 0; background: #fff; }
.theke-club span { display: flex; flex-direction: column; line-height: 1.2; }
.theke-club span span { font-size: 13px; opacity: .85; }
.theke-main { max-width: 1100px; margin: 0 auto; padding: 20px 20px 60px; }
.theke-title { font-size: clamp(26px, 4vw, 38px); margin: 8px 0 12px; }
.theke-sub { font-size: 18px; margin-top: -4px; }
.theke-search { width: 100%; min-height: 56px; font-size: 20px; padding: 0 16px; border-radius: 0; border: 1px solid var(--border-strong, var(--border)); margin: 12px 0 16px; }
.theke-names { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
.theke-name { display: flex; align-items: center; justify-content: space-between; gap: 6px; min-height: 64px; padding: 10px 16px; border-radius: 0; background: var(--surface-000); border: 1px solid var(--border); color: var(--ink); text-decoration: none; font-size: 18px; font-weight: 600; }
.theke-name:active, .theke-name:hover { border-color: var(--brand); }
.theke-name small { font-size: 12px; color: var(--ink-muted); font-weight: 500; }
.theke-quick { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; }
.theke-note { margin: 0; font-size: 18px; color: var(--ink-muted); }
.theke-note small { font-size: 14px; }
.theke-btn { display: inline-flex; align-items: center; min-height: 56px; padding: 0 20px; border-radius: 0; background: var(--surface-000); border: 1px solid var(--border); font-size: 18px; font-weight: 700; color: var(--ink); text-decoration: none; }
.theke-main .kiosk-tiles { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
.theke-main .kiosk-tap { min-height: 132px; font-size: 19px; }
.theke-main .kiosk-count { min-width: 48px; height: 48px; border-radius: 0; font-size: 22px; }
.theke-main .kiosk-minus { width: 48px; height: 48px; border-radius: 0; }
.theke-go { min-width: 220px; min-height: 60px; font-size: 20px; }
.theke-pin input, .theke-given input { max-width: 220px; min-height: 52px; font-size: 22px; letter-spacing: .2em; }
.theke-check { font-size: 17px; }
.theke-deposit, .theke-staff-login, .theke-staff { margin-top: 24px; padding: 16px; border-radius: 0; background: var(--surface-000); border: 1px solid var(--border); }
.theke-deposit summary, .theke-staff-login summary { cursor: pointer; font-weight: 700; font-size: 17px; }
.theke-done { text-align: center; padding: 40px 0; }
.theke-check-big { font-size: 72px; line-height: 1; color: var(--success); margin: 0; }
.theke-done-row { justify-content: center; margin: 20px 0; }
.btn-lg { min-height: 52px; padding: 0 24px; font-size: 17px; }
.tablet-qr { display: flex; justify-content: center; padding: 16px; margin: 12px 0; background: #fff; border: 1px solid var(--border); border-radius: 0; }
.tablet-qr svg { width: 240px; height: 240px; }

/* Handbuch und Anleitungen in der Hilfe */
.hb-layout { display: grid; grid-template-columns: minmax(220px, 280px) minmax(0, 1fr); gap: 20px; align-items: start; }
.hb-toc { position: sticky; top: 12px; max-height: calc(100vh - 24px); overflow: auto; font-size: 14px; }
.hb-toc input { width: 100%; margin-bottom: 10px; }
.hb-toc ol { list-style: none; margin: 0; padding: 0; }
.hb-toc > ol > li { margin-bottom: 10px; }
.hb-toc ul { list-style: none; margin: 4px 0 0; padding: 0 0 0 10px; border-left: 2px solid var(--border); }
.hb-toc ul li { margin: 3px 0; }
.hb-toc a { color: var(--ink); text-decoration: none; }
.hb-toc a:hover { color: var(--brand); }
.hb-main { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.hb-ch { display: flex; align-items: center; gap: 10px; font-size: 1.35rem; margin: 0 0 4px; }
.hb-no { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 0; background: var(--brand); color: #fff; font-size: 15px; }
.hb-topic { padding: 16px 0; border-top: 1px solid var(--border); scroll-margin-top: 16px; }
.hb-chapter .hb-topic:first-of-type { border-top: 0; }
.hb-title { margin: 0 0 6px; font-size: 1.08rem; }
.hb-intro { margin: 0 0 8px; color: var(--ink-muted); }
.hb-steps { margin: 0 0 10px; padding-left: 0; list-style: none; counter-reset: hb; }
.hb-steps li { counter-increment: hb; position: relative; padding: 4px 0 4px 36px; line-height: 1.45; }
.hb-steps li::before { content: counter(hb); position: absolute; left: 0; top: 3px; width: 24px; height: 24px; border-radius: 0; background: var(--brand-subtle, #e6f2f5); color: var(--brand); font-weight: 700; font-size: 13px; display: grid; place-items: center; }
.hb-then { margin: 0 0 10px; padding: 10px 14px; border-radius: 0; background: var(--surface-100, #f8fafc); border: 1px solid var(--border); }
.hb-then ul { margin: 6px 0 0; padding-left: 18px; }
.hb-links { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin: 0; font-size: 14px; }
.hb-see { color: var(--ink-muted); }
.hb-results .hb-topic { border-top: 0; padding-top: 4px; }
.hb-more { border-top: 1px solid var(--border); padding: 10px 0; }
.hb-more summary { cursor: pointer; font-weight: 600; }
.hb-toc li[hidden], .hb-topic[hidden], .hb-chapter[hidden] { display: none; }
@media (max-width: 900px) { .hb-layout { grid-template-columns: 1fr; } .hb-toc { position: static; max-height: none; } }
@media print { .hb-toc, .pagehead .btn-row, .nav, .sidebar, header { display: none !important; } .hb-layout { display: block; } .hb-chapter { break-before: page; box-shadow: none; border: 0; } }

/* Mitgliederbereich: Training meiner Kinder */
.train-family { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; margin-bottom: 10px; }
.train-kid { border: 1px solid var(--border); border-radius: 0; padding: 12px 14px; }
.train-kid-name { margin: 0 0 6px; }
.train-kid-name .meta { display: block; }
.train-slots { list-style: none; margin: 0; padding: 0; }
.train-slots li { padding: 6px 0; border-top: 1px solid var(--border); }
.train-slots li:first-child { border-top: 0; }
.train-when { display: block; font-weight: 700; }

/* Einladung zur Mitgliederversammlung */
.mv-late { color: var(--danger, #b91c1c); }
.mv-letter { max-width: 700px; margin: 0 auto; padding: 40px 24px; break-after: page; }
.mv-letter h1 { font-size: 20px; margin: 24px 0 16px; }
.mv-sender { color: var(--ink-muted); border-bottom: 1px solid var(--border); padding-bottom: 4px; margin-bottom: 8px; }
.mv-addr { font-style: normal; min-height: 4.5em; margin: 8px 0 24px; }
.mv-date { text-align: right; }
.mv-top { margin: 0 0 12px; }
@media print { .mv-letter { padding: 20mm 0 0; } }

/* Kiosk: Buchungen eingeklappt */
.kiosk-hist > summary { cursor: pointer; padding: 10px 0; font-weight: 600; color: var(--primary, #0e7490); list-style: none; display: flex; align-items: center; gap: 6px; min-height: 44px; }
.kiosk-hist > summary::-webkit-details-marker { display: none; }
.kiosk-hist > summary::before { content: "▸"; transition: transform .15s; }
.kiosk-hist[open] > summary::before { transform: rotate(90deg); }

/* Kiosk-Assistent */
.wiz-steps { list-style: none; margin: 0 0 16px; padding: 0; display: flex; gap: 6px; flex-wrap: wrap; }
.wiz-steps a { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 12px 0 4px; border-radius: 0; border: 1px solid var(--border); background: var(--surface-000); color: var(--ink); text-decoration: none; font-size: 14px; }
.wiz-n { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 0; background: var(--surface-200); font-weight: 700; font-size: 13px; }
.wiz-steps .is-current a { border-color: var(--brand); font-weight: 600; }
.wiz-steps .is-current .wiz-n { background: var(--brand); color: #fff; }
.wiz-steps .is-done .wiz-n { background: var(--success); color: #fff; }
@media (max-width: 720px) { .wiz-steps li:not(.is-current) .wiz-l { display: none; } .wiz-steps a { padding-right: 4px; } .wiz-steps .is-current a { padding-right: 12px; } }
.wiz-card { max-width: 760px; }
.wiz-nav { margin-top: 16px; }
.wiz-choices { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); margin: 8px 0 12px; }
.wiz-choices form { display: contents; }
.wiz-choice { display: flex; flex-direction: column; gap: 4px; padding: 14px; border: 1px solid var(--border); border-radius: 0; background: var(--surface-000); color: var(--ink); text-decoration: none; text-align: left; font: inherit; cursor: pointer; min-height: 44px; }
.wiz-choice:hover { border-color: var(--brand); }
.wiz-choice span { font-size: 14px; color: var(--ink-muted); }
.kiosk-ask .chips { margin: 4px 0 10px; }
.kiosk-ask .chip { font: inherit; font-size: 14px; cursor: pointer; }
.kiosk-answer { margin-bottom: 14px; padding: 12px 14px; border-radius: 0; background: var(--surface-100); }
.kiosk-answer .ai-answer { margin: 8px 0; line-height: 1.5; }
.kiosk-ck { display: block; flex: 1; min-width: 0; }

/* Trainingsplaner am Handy: gedrückt halten zum Ziehen – kein Markieren, kein iOS-Kontextmenü */
.tp-sched .group-card, .tp-sched .placed, .tp-planner .dnd-card { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; }
.tp-sched .group-card select, .tp-planner .dnd-card select { -webkit-user-select: auto; user-select: auto; }
.dnd-armed { transition: transform .35s ease, box-shadow .35s ease; transform: scale(.98); box-shadow: 0 0 0 2px var(--brand) inset; }
body.dnd-active { -webkit-user-select: none; -webkit-touch-callout: none; touch-action: none; }
.tp-sched .dnd-handle { display: none; }
@media (pointer: coarse) {
  .tp-sched .dnd-handle { display: grid; place-items: center; position: absolute; right: 2px; bottom: 2px; width: 36px; height: 36px; border-radius: 0; background: rgba(20, 42, 58, .08); color: var(--ink); font-size: 20px; line-height: 1; touch-action: none; cursor: grab; z-index: 2; }
  .tp-sched .placed { padding-bottom: 8px; min-height: 40px; }
  .tp-sched .placed .fit-note, .tp-sched .group-card .group-actions { margin-right: 38px; }
}

/* Theken-Tablet: offene Beträge rot, heute bezahlt grün */
.theke-name.is-open { border-color: var(--danger, #d14343); border-left-width: 6px; background: var(--danger-bg); }
.theke-name.is-paid { border-color: var(--success, #2f9e5a); border-left-width: 6px; background: var(--success-bg); }
.theke-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; margin: 4px 0 10px; font-size: 14px; color: var(--ink-muted); }
.tl-dot { display: inline-block; width: 12px; height: 12px; border-radius: 0; margin-right: 4px; vertical-align: -1px; }
.tl-open { background: var(--danger, #d14343); } .tl-paid { background: var(--success, #2f9e5a); }
.theke-more { margin-top: 12px; text-align: center; }

/* Kiosk: Einkauf als Seitenleiste (Tablet quer, Rechner) – auf dem Handy darunter */
.kiosk-pos { display: grid; gap: 16px; }
.kiosk-pos-main { min-width: 0; }
.kiosk-cart-h { font-size: 18px; margin: 0 0 8px; }
.kiosk-cart { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 4px; }
.kiosk-cart li { display: flex; justify-content: space-between; gap: 10px; font-size: 15px; }
.kiosk-cart-box { padding: 16px; border: 1px solid var(--border); border-radius: 0; background: var(--surface-000); }
.kiosk-pos-side .kiosk-submit { flex-direction: column; align-items: stretch; gap: 10px; }
.kiosk-pos-side .kiosk-submit .btn { width: 100%; }
.kiosk-pos-side .kiosk-total { order: -1; font-size: 18px; text-align: right; }
.kiosk-pos-side details { margin-top: 12px; }
@media (min-width: 900px) {
  .kiosk-pos { grid-template-columns: minmax(0, 1fr) 320px; align-items: start; }
  .kiosk-pos-side { position: sticky; top: 12px; max-height: calc(100vh - 24px); overflow-y: auto; }
}
@media (max-width: 899px) {
  .kiosk-cart, .kiosk-cart-h { display: none; }
}
.theke-paybox { max-width: 560px; padding: 20px; border: 1px solid var(--border); border-radius: 0; background: var(--surface-000); }
.theke-paybox .pay-qr { max-width: 280px; margin: 0 auto 12px; }

/* Theken-Tablet: Zahlenfeld */
.numpad { position: fixed; left: 50%; bottom: 12px; transform: translateX(-50%); z-index: 1000; width: min(360px, calc(100vw - 24px)); padding: 12px; border-radius: 0; background: var(--surface-000); border: 1px solid var(--border); box-shadow: 0 14px 40px rgba(15, 23, 42, .28); }
.numpad-quick { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.numpad-quick:empty { display: none; }
.numpad-chip { flex: 1; min-height: 44px; border-radius: 0; border: 1px solid var(--border); background: var(--surface-100); color: var(--ink); font: inherit; font-weight: 700; cursor: pointer; }
.numpad-keys { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.numpad-key { min-height: 60px; border-radius: 0; border: 1px solid var(--border); background: var(--surface-100); color: var(--ink); font: inherit; font-size: 26px; font-weight: 700; cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent; user-select: none; }
.numpad-key:active, .numpad-chip:active { background: var(--surface-200); transform: scale(.97); }
.numpad-key:disabled { opacity: .25; }
.numpad-foot { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
.numpad-foot .btn { min-height: 52px; font-size: 18px; }
body.numpad-open { padding-bottom: 420px; }

/* Theken-Tablet: Bezahlen-Fenster */
.theke-modal { position: fixed; inset: 0; z-index: 900; display: grid; place-items: start center; padding: 24px 16px 16px; background: rgba(15, 23, 42, .5); }
.theke-modal[hidden] { display: none; }
.theke-modal-box { position: relative; width: min(520px, 100%); max-height: calc(100vh - 32px); overflow-y: auto; padding: 22px; border-radius: 0; background: var(--surface-000); color: var(--ink); box-shadow: 0 20px 60px rgba(15, 23, 42, .35); }
.theke-modal-box h2 { margin: 0 0 8px; font-size: 24px; }
.theke-modal-x { position: absolute; top: 10px; right: 10px; width: 44px; height: 44px; border-radius: 0; border: 0; background: var(--surface-100); color: var(--ink); font-size: 26px; line-height: 1; cursor: pointer; }
.pm-sum { font-size: 20px; margin: 4px 0 6px; } .pm-sum strong { font-size: 30px; }
.pm-methods { display: grid; gap: 10px; margin-top: 12px; }
.pm-method { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; min-height: 64px; padding: 12px 16px; border-radius: 0; border: 1px solid var(--border); background: var(--surface-000); color: var(--ink); font: inherit; font-size: 20px; font-weight: 700; text-align: left; cursor: pointer; }
.pm-method small { flex-basis: 100%; font-size: 13px; font-weight: 500; color: var(--ink-muted); padding-left: 34px; }
.pm-method:active { background: var(--surface-100); }
.pm-wide { width: 100%; min-height: 60px; font-size: 20px; margin-top: 8px; }
.pm-change { margin: 18px 0 20px; padding: 0; font-size: 34px; font-weight: 800; line-height: 1.2; color: var(--success); }
.pm-change:not(:empty) { padding: 14px 16px; border-radius: 0; background: var(--success-bg); text-align: center; }
.pm-change.is-short { color: var(--danger); background: var(--danger-bg); }
.theke-change { margin: 18px auto 22px; padding: 16px 28px; border-radius: 0; background: var(--success-bg); color: var(--success); font-size: 40px; font-weight: 800; display: inline-block; }
.theke-change small { display: block; font-size: 16px; font-weight: 600; color: var(--ink-muted); }
.theke-modal #pm-pin { font-size: 32px; letter-spacing: 10px; text-align: center; }
body.modal-open { overflow: hidden; }
.kiosk-total.is-bump { animation: kbump .35s; }
@keyframes kbump { 30% { transform: scale(1.08); color: var(--danger); } }
.theke-quick-big { display: flex; flex-wrap: wrap; gap: 12px; }
.theke-quick-big .theke-btn { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 2px; min-height: 72px; padding: 12px 22px; font-size: 22px; }
.theke-quick-big .theke-btn small { display: block; font-size: 14px; font-weight: 500; color: var(--ink-muted); }
.theke-btn-bar { border-color: var(--success); }
.theke-change { line-height: 1.15; } .theke-change small { margin-bottom: 6px; line-height: 1.3; }
.theke-modal #pm-given { font-size: 28px; font-weight: 700; padding: 10px 14px; height: auto; }
.theke-donate { margin: 0 0 18px; } .theke-donate .btn { border-color: var(--success); color: var(--success); }
.guest-mode { border: 0; padding: 0; margin: 8px 0 12px; display: grid; gap: 10px; }
.guest-mode legend { font-weight: 700; margin-bottom: 8px; }
.guest-opt { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border: 1px solid var(--border); border-radius: 0; background: var(--surface-000); cursor: pointer; }
.guest-opt input { width: 22px; height: 22px; margin-top: 3px; accent-color: var(--brand); }
.guest-opt strong { display: block; font-size: 18px; } .guest-opt small { display: block; color: var(--ink-muted); font-size: 14px; }
.guest-opt:has(input:checked) { border-color: var(--brand); box-shadow: 0 0 0 2px var(--brand) inset; }

/* Kasse zählen am Tablet */
.tcount { display: grid; gap: 16px; }
@media (min-width: 900px) { .tcount { grid-template-columns: minmax(0, 1fr) 340px; align-items: start; } .tcount-side { position: sticky; top: 12px; } }
.tcount-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 10px; }
.tcount-cell { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 0; background: var(--surface-000); cursor: pointer; }
.tcount-cell span { font-weight: 800; font-size: 18px; } .tcount-cell.is-note span { color: var(--brand); }
.tcount-cell input { font-size: 26px; font-weight: 700; text-align: center; padding: 8px; }
.tcount-cell.is-set { border-color: var(--success); background: var(--success-bg); }
.tcount-side { padding: 16px; border: 1px solid var(--border); border-radius: 0; background: var(--surface-000); }
.theke-staff-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 28px; padding-top: 16px; border-top: 1px solid var(--border); }
.tcount-side .pm-change { font-size: 22px; }
.fs-plain { border: 0; padding: 0; margin: 0; min-width: 0; } .fs-plain[disabled] input, .fs-plain[disabled] select, .fs-plain[disabled] textarea { background: var(--surface-100); color: var(--ink-muted); border-style: dashed; cursor: not-allowed; }
.form > .fs-plain { display: grid; gap: 16px; }

/* Zähl-Assistent am Theken-Tablet: je Schein/Münze ein Schritt */
.twiz { padding: 18px; border: 1px solid var(--border); border-radius: 0; background: var(--surface-000); margin-bottom: 16px; }
.twiz-top { display: flex; justify-content: space-between; gap: 12px; color: var(--ink-muted); font-size: 16px; } .twiz-top strong { color: var(--ink); font-size: 20px; }
.twiz-bar { width: 100%; height: 8px; margin: 10px 0 18px; accent-color: var(--brand); }
.twiz-kind { margin: 0; color: var(--ink-muted); font-weight: 600; } .twiz-q { margin: 2px 0 14px; font-size: 28px; }
.twiz-main { display: grid; gap: 20px; } @media (min-width: 700px) { .twiz-main { grid-template-columns: minmax(0, 1fr) 300px; align-items: start; } }
.twiz-money { display: inline-flex; align-items: center; justify-content: center; width: 96px; height: 96px; border-radius: 0; background: var(--warning-bg); color: var(--warning); font-size: 24px; font-weight: 800; border: 2px solid currentColor; }
.twiz-money.is-note { width: 170px; height: 88px; border-radius: 0; background: var(--success-bg); color: var(--success); }
.twiz-count { margin: 16px 0 0; font-size: 18px; color: var(--ink-muted); } .twiz-count strong { font-size: 48px; color: var(--ink); margin-right: 6px; }
.twiz-pad { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.twiz-pad button { min-height: 64px; font-size: 26px; font-weight: 700; border-radius: 0; border: 1px solid var(--border-strong); background: var(--surface-100); color: var(--ink); cursor: pointer; }
.twiz-pad button.is-small { font-size: 17px; }
.twiz-nav { display: flex; gap: 12px; margin-top: 20px; } .twiz-nav .btn { min-height: 60px; font-size: 19px; } .twiz-nav .is-next { flex: 1; }
.twiz-list { list-style: none; margin: 0 0 8px; padding: 0; }
.twiz-list button { display: flex; justify-content: space-between; width: 100%; padding: 12px 4px; border: 0; border-bottom: 1px solid var(--border); background: none; color: var(--ink); font-size: 19px; cursor: pointer; text-align: left; }
.twiz-list button span:last-child { color: var(--ink-muted); }
.twiz-on .tcount-grid { display: none; } .twiz-on.twiz-steps .tcount { display: none; }
.twiz-on .tcount { grid-template-columns: minmax(0, 1fr); max-width: 560px; } .twiz-on .tcount-side { position: static; }
.twiz-toggle { margin-left: 8px; }
.sign-public .sign-done { font-size: 56px; color: var(--success); margin: 8px 0; }
.navbadge-inline { margin: 0 8px 0 0; display: inline-block; }
/* Website-Verwaltung */
.ws-thumb { display: block; max-width: 320px; height: auto; border-radius: 0; margin-bottom: 8px; }
.ws-gallery { display: flex; flex-wrap: wrap; gap: 8px; } .ws-gallery img { width: 120px; height: 90px; object-fit: cover; border-radius: 0; }
.ws-add { display: flex; flex-wrap: wrap; gap: 8px; }
.ws-editor .sticky-save { position: sticky; bottom: 0; background: var(--surface-100); padding: 12px 0; z-index: 5; }
.field-end { align-self: end; }
/* Turnierbaum */
.tb-scroll { overflow-x: auto; padding-bottom: 8px; }
.tb { display: flex; gap: 22px; align-items: stretch; min-width: max-content; }
.tb-round { display: flex; flex-direction: column; min-width: 210px; }
.tb-col { flex: 1; display: flex; flex-direction: column; justify-content: space-around; gap: 12px; }
.tb-round h4 { margin: 0 0 4px; font-size: 13px; color: var(--ink-muted); text-transform: uppercase; letter-spacing: .04em; }
.tb-match { border: 1px solid var(--border); border-radius: 0; background: var(--surface-000); overflow: hidden; }
.tb-match.is-bye { opacity: .6; }
.tb-line { padding: 6px 10px; font-size: 14px; border-bottom: 1px solid var(--border); }
.tb-line:last-of-type { border-bottom: 0; }
.tb-line.is-win, .is-win { font-weight: 700; }
.tb-seed { color: var(--ink-muted); font-weight: 400; font-size: 12px; }
.tb-score { padding: 4px 10px; font-size: 12px; color: var(--ink-muted); background: var(--surface-100); }
.tb-edit summary { padding: 4px 10px; font-size: 12px; cursor: pointer; color: var(--brand-text); }
.tb-edit form { padding: 8px 10px; }
.tourn-groups { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.tourn-group tr.is-adv td { font-weight: 600; }
.tourn-gm li { font-size: 14px; flex-wrap: wrap; }
/* Forderungsbaum */
.pyramid { display: flex; flex-direction: column; gap: 8px; align-items: center; overflow-x: auto; }
.pyr-row { display: flex; gap: 8px; justify-content: center; }
.pyr-cell { position: relative; min-width: 140px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 0; background: var(--surface-000); font-size: 14px; text-align: center; }
.pyr-cell.is-busy, .ladder-list li.is-busy { border-color: var(--danger); box-shadow: 0 0 0 1px var(--danger) inset; }
.pyr-tools { display: flex; justify-content: center; gap: 2px; margin-top: 4px; }
.btn-xs { padding: 0 6px; min-height: 22px; font-size: 12px; }
.ladder-pos { display: inline-block; min-width: 26px; font-weight: 700; color: var(--brand-text); margin-right: 6px; }
.ladder-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.ladder-list li { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 0; }
.list li.ladder-ch { display: block; }
.ladder-ch .grow { display: grid; gap: 6px; }
.ladder-ch .btn-row { margin-top: 8px; }
@media print { .tb-edit, .pyr-tools { display: none; } }
.pyr-cell.is-me, .ladder-list li.is-me { background: var(--success-bg); border-color: var(--success); font-weight: 600; }
/* Meine Spiele & Terminabsprache */
.mymatch { padding: 14px 16px; border: 1px solid var(--border); border-radius: 0; background: var(--surface-100); }
.mymatch + .mymatch { margin-top: 12px; }
.mymatch-meta { margin: 0; font-size: 13px; color: var(--ink-muted); }
.mymatch-vs { margin: 2px 0 10px; font-size: 18px; }
.ap { display: grid; gap: 8px; margin-bottom: 8px; }
.ap-fixed { margin: 0; padding: 8px 12px; border-radius: 0; background: var(--success-bg); color: var(--success); }
.ap-fixed strong { color: inherit; }
.ap-slots { display: grid; gap: 8px; }
.ap-slot { display: flex; justify-content: space-between; align-items: center; gap: 12px; width: 100%; min-height: 48px; text-align: left; }
.ap-wait { margin: 0 0 4px; padding-left: 20px; }
.ap-new > summary { cursor: pointer; font-weight: 600; color: var(--brand-text); padding: 6px 0; }
.ap-new[open] > summary { margin-bottom: 8px; }
.ap-row .field:last-child { max-width: 160px; }
.su-item { flex-wrap: wrap; }
.su-form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
/* Ablauf-Assistent je Konkurrenz */
.flow { margin: 4px 0 16px; padding: 12px 14px; border-radius: 0; background: var(--surface-100); border: 1px solid var(--border); }
.flow-steps { list-style: none; margin: 0 0 10px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; }
.flow-steps li { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ink-muted); }
.flow-steps li span { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 0; border: 1px solid var(--border-strong); font-size: 12px; font-weight: 700; }
.flow-steps li.is-done span { background: var(--success-bg); color: var(--success); border-color: var(--success); }
.flow-steps li.is-now { color: var(--ink); font-weight: 700; }
.flow-steps li.is-now span { background: var(--brand); color: #fff; border-color: var(--brand); }
.flow-todo { margin: 0; }
.champ { margin: 0 0 12px; padding: 10px 14px; border-radius: 0; background: var(--warning-bg); color: var(--ink); font-size: 16px; }
/* Schritt-Assistent (Turnier, Forderungsbaum) */
.swiz fieldset[data-swiz-step] { border: 0; padding: 0; margin: 0 0 20px; min-width: 0; }
.swiz h2 { font-size: 22px; margin: 0 0 14px; }
.swiz-top { color: var(--ink-muted); font-weight: 600; }
.swiz-bar { width: 100%; height: 8px; margin: 8px 0 18px; accent-color: var(--brand); }
.swiz:not(.is-swiz) .swiz-top, .swiz:not(.is-swiz) .swiz-bar { display: none; }
.swiz-nav { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; }
.swiz-sum { display: grid; grid-template-columns: max-content 1fr; gap: 8px 16px; margin: 0 0 12px; }
.swiz-sum dt { font-weight: 700; } .swiz-sum dd { margin: 0; }
@media (max-width: 600px) { .swiz-sum { grid-template-columns: 1fr; } .swiz-sum dd { margin-bottom: 6px; } }
.modecards { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.modecard { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 16px; border: 2px solid var(--border); border-radius: 0; cursor: pointer; background: var(--surface-000); }
.modecard:hover { border-color: var(--border-strong); }
.modecard:has(input:checked) { border-color: var(--brand); background: var(--surface-100); }
.modecard input { position: absolute; top: 14px; right: 14px; }
.modecard svg { width: 120px; height: 60px; color: var(--brand-text); }
.modecard strong { font-size: 17px; }
.modecard span { font-size: 14px; color: var(--ink-muted); }
.modecard em { font-style: normal; color: var(--ink); font-weight: 600; }
.modecard .modecard-tag { align-self: flex-start; margin-top: auto; padding: 2px 10px; border-radius: 0; background: var(--surface-200); font-size: 12px; font-weight: 700; }
.wizcta { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; padding: 14px 16px; border-radius: 0; background: var(--surface-100); border: 1px solid var(--border); }
.wizcta p { margin: 0; }
.ap-new:not([open]) > summary { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border: 1px solid var(--border-strong); border-radius: 0; background: var(--surface-000); list-style: none; }
.ap-new:not([open]) > summary::-webkit-details-marker { display: none; }
.ap-slot strong { white-space: nowrap; }
/* Filter über Spielerlisten */
.pfilter { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 8px; }
.pfilter input[type=search] { flex: 1 1 180px; min-width: 0; }
.pfilter select { flex: 0 1 auto; width: auto; max-width: 100%; }
.pfilter-count { flex-basis: 100%; }
@media (min-width: 900px) { .pfilter-count { flex-basis: auto; } }
.kgroup { border: 1px solid var(--border); border-radius: 0; padding: 4px 12px; margin-bottom: 10px; }
.kgroup > summary { cursor: pointer; font-weight: 700; padding: 8px 0; }
.ktable td, .ktable th { padding: 6px 8px; }
.ktable .num { width: 90px; text-align: center; }
.kcheck { display: inline-flex; padding: 6px; cursor: pointer; }
.kcheck input { width: 20px; height: 20px; }
/* Turniertag-Planer, Spielplan, Ehrentafel */
.table-scroll { overflow-x: auto; }
.plan-grid td { min-width: 180px; vertical-align: top; font-size: 14px; }
.plan-grid td .meta { display: block; color: var(--ink-muted); font-size: 12px; }
.sched td:first-child { font-weight: 700; white-space: nowrap; }
.honor-years { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.honor-y { margin: 0 0 8px; font-size: 28px; color: var(--brand-text); }
.honor-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.honor-list li { display: grid; gap: 2px; position: relative; padding-right: 28px; }
.honor-list li form { position: absolute; right: 0; top: 0; }
.honor-t { font-size: 13px; color: var(--ink-muted); text-transform: uppercase; letter-spacing: .03em; }
@media print { .sched-day { break-inside: avoid; } .honor-year { break-inside: avoid; } }
.flow-frist { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 10px; font-size: 14px; }
.flow-frist input { width: auto; }
.ev-tools { display: grid; gap: 6px; margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--border); }
.list li:has(> .list-tools) { flex-wrap: wrap; }
.list-tools { flex-wrap: nowrap; align-items: flex-start; margin-left: auto; }
.list li:has(> .list-tools) > .grow { flex: 1 1 180px; min-width: 0; overflow-wrap: anywhere; }
.pop { position: relative; }
.pop > summary { list-style: none; }
.pop > summary::-webkit-details-marker { display: none; }
.pop[open] > .pop-body { position: absolute; right: 0; z-index: 20; width: 300px; margin-top: 6px; padding: 14px; border: 1px solid var(--border); border-radius: 0; background: var(--surface-000); box-shadow: 0 10px 30px rgba(0,0,0,.12); }
@media (max-width: 600px) { .list-tools { flex-wrap: wrap; } .pop[open] > .pop-body { position: static; width: auto; } }
/* Turniere & Forderung: volle Breite (auch im Mitgliederbereich) */
.member-content:has(.sport-full) { max-width: none; }
.mymatch-list { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 380px), 1fr)); align-items: start; }
.mymatch-list .mymatch + .mymatch { margin-top: 0; }
.sport-full ~ .grid, .sport-full ~ form.card { width: 100%; }
/* Vorschau beim Teilen (Open Graph) */
.ogcard { margin: 0 0 14px; max-width: 460px; border: 1px solid var(--border); border-radius: 0; overflow: hidden; background: var(--surface-100); }
.ogcard img { display: block; width: 100%; height: auto; aspect-ratio: 1200 / 630; object-fit: cover; }
.ogcard-noimg { aspect-ratio: 1200 / 630; display: flex; align-items: center; justify-content: center; padding: 16px; text-align: center; color: var(--ink-muted); font-size: 13px; background: var(--surface-200); }
.ogcard figcaption { display: grid; gap: 2px; padding: 10px 12px; font-size: 14px; }
.ogcard-host { font-size: 11px; color: var(--ink-muted); letter-spacing: .04em; }
.ogcard figcaption span[data-og-desc] { color: var(--ink-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.og-edit { display: grid; gap: 16px; } @media (min-width: 900px) { .og-edit { grid-template-columns: minmax(0, 1fr) 360px; align-items: start; } }

/* Veranstaltungen */
.d-block { display: block; }
.d-inline { display: inline; }
.ce-kinds .modecard { align-items: flex-start; }
.ce-emoji { font-size: 30px; line-height: 1; }
.ce-list .ce-day, .ce-mine .ce-day { font-size: 26px; width: 40px; text-align: center; flex: 0 0 auto; }
.ce-stats { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.ce-stat { background: var(--surface-000); border: 1px solid var(--border); border-radius: 0; padding: 14px 16px; display: flex; flex-direction: column; gap: 2px; }
.ce-stat strong { font-size: 26px; line-height: 1.1; }
.ce-stat strong small { font-size: 16px; color: var(--ink-muted); font-weight: 600; }
.ce-stat span { color: var(--ink-muted); font-size: 14px; }
.ce-count li { padding: 3px 0; }
.ce-count strong { display: inline-block; min-width: 2.6em; }
.ce-table tr.ce-wait td { background: var(--surface-100); }
.ce-fold > summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ce-fold > summary::-webkit-details-marker { display: none; }
.ce-fold > summary::before { content: '▸'; color: var(--ink-muted); }
.ce-fold[open] > summary::before { content: '▾'; }
.ce-settings { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
.ce-settings > fieldset { margin: 0; min-width: 0; }
.ce-settings > .btn-row { grid-column: 1 / -1; }
.ce-settings legend.card-head { float: left; width: 100%; font-size: 17px; font-weight: 700; padding: 0; margin-bottom: 8px; }
.ce-settings legend.card-head + * { clear: both; }
.ce-public .ce-kicker { margin: 0 0 6px; font-weight: 700; color: var(--brand-text); }
.ce-public .ce-kicker a { text-decoration: none; }
.ce-public h1 { margin-bottom: 6px; }
.ce-desc { margin: 12px 0; line-height: 1.55; }
.ce-facts { list-style: none; padding: 0; margin: 12px 0; display: grid; gap: 6px; }
.ce-facts li { padding: 8px 12px; border-radius: 0; background: var(--surface-100); }
.ce-people .field label .muted { font-weight: 400; }
.ce-meals { display: grid; gap: 8px; }
.ce-meal { display: flex; align-items: center; gap: 10px; }
.ce-meal input { width: 72px; flex: 0 0 auto; }
.ce-help { padding: 12px 14px; border-radius: 0; background: var(--surface-100); border: 1px solid var(--border); }
.ce-ticket { display: grid; gap: 10px; padding: 16px; border: 2px dashed var(--border-strong); border-radius: 0; margin: 16px 0; }
.ce-pay { display: flex; gap: 16px; align-items: center; padding: 14px; border-radius: 0; background: var(--surface-100); }
.ce-giro { flex: 0 0 140px; background: #fff; padding: 6px; border-radius: 0; }
.ce-giro svg { width: 100%; height: auto; display: block; }
.ce-print h1 { font-size: 24px; margin: 4px 0; }
.ce-print-table td, .ce-print-table th { padding: 6px 8px; vertical-align: top; }
.ce-tick { width: 28px; text-align: center; }
.ce-poster-where { margin-top: 4px; font-size: 22px; }
.ce-poster-text { font-size: 18px; max-width: 520px; margin: 0 auto 8px; text-align: center; }
.ce-letter-qr { display: flex; gap: 16px; align-items: center; margin-top: 24px; }
.ce-letter-qr svg { width: 110px; height: 110px; }
@media (max-width: 760px) { .ce-settings { grid-template-columns: 1fr; } .ce-pay { flex-direction: column; align-items: flex-start; } }

/* „Neu“-Hinweise */
.newpill { display: inline-block; vertical-align: middle; margin-left: 6px; padding: 1px 7px; border-radius: 0; background: #F59E0B; color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .02em; line-height: 16px; text-transform: uppercase; }
.newpill-nav { margin-left: auto; }
.btn .newpill, a .newpill { margin-left: 8px; }
.navbadge-new { background: #F59E0B; }
[data-new].has-new { box-shadow: 0 0 0 3px rgba(245, 158, 11, .45); }
.news-list li.is-seen { opacity: .75; }
.news-state { width: 22px; text-align: center; color: #F59E0B; font-weight: 800; }
.news-list li.is-seen .news-state { color: var(--success, #16a34a); }
@media print { .newpill { display: none !important; } }

/* Clubheim */
.ch-cal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.ch-wd { font-size: 12px; font-weight: 700; color: var(--ink-muted); text-align: center; padding: 4px 0; }
.ch-day { min-height: 92px; border: 1px solid var(--border); border-radius: 0; padding: 4px; display: flex; flex-direction: column; gap: 3px; background: var(--surface-000); min-width: 0; }
.ch-day.is-out { opacity: .45; }
.ch-day.is-today { border-color: var(--brand); box-shadow: 0 0 0 1px var(--brand) inset; }
.ch-num { font-size: 12px; font-weight: 700; color: var(--ink-muted); }
.ch-item { display: block; font-size: 12px; line-height: 1.3; padding: 2px 5px; border-radius: 0; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: #DBEAFE; color: #1E3A8A; }
.ch-item.ch-anfrage { background: #FEF3C7; color: #92400E; }
.ch-item.ch-verein { background: #DCFCE7; color: #14532D; }
.ch-item.ch-event { background: #F3E8FF; color: #581C87; }
.ch-item.ch-abgeschlossen { opacity: .7; }
.ch-legend { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.ch-legend .ch-item { display: inline-block; }
.ch-sug { padding: 12px 0; border-bottom: 1px solid var(--border); }
.ch-sug:last-of-type { border-bottom: 0; }
.ch-sug h3 { margin: 0 0 6px; font-size: 16px; }
.ch-inline { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.ch-inline select { width: auto; min-width: 220px; }
.ch-items input, .ch-items select { min-width: 70px; max-width: 160px; }
.ch-items tr.ch-low td { background: #FEF3C7; }
.ch-line { display: flex; gap: 10px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--border); }
.ch-line input { width: 76px; flex: 0 0 auto; }
.ch-loan { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 4px; font-size: 14px; }
.ch-date { width: 150px; }
.ch-contract h1 { font-size: 24px; margin: 8px 0 12px; }
.ch-contract h2 { font-size: 16px; margin: 16px 0 6px; }
.ch-rules { margin: 0; padding-left: 20px; }
.ch-sign { display: grid; grid-template-columns: 1fr 1fr; gap: 40px 32px; margin-top: 40px; }
.ch-sign div { border-top: 1px solid #111; padding-top: 4px; font-size: 13px; }
.text-danger { color: var(--danger, #dc2626); font-weight: 700; }
@media (max-width: 760px) { .ch-day { min-height: 64px; } .ch-item { font-size: 10px; padding: 1px 3px; } }

/* Zum Home-Bildschirm */
.a2hs { display: flex; gap: 16px; align-items: flex-start; border-color: var(--brand); }
.a2hs[hidden] { display: none; }
.a2hs-icon { width: 64px; height: 64px; border-radius: 0; flex: 0 0 auto; box-shadow: 0 2px 8px rgba(0,0,0,.15); background: #fff; }
.a2hs h2 { font-size: 17px; margin: 0 0 4px; }
.a2hs-steps { margin: 10px 0 0; padding-left: 20px; }
.a2hs-steps li { margin: 3px 0; }
.a2hs-share { display: inline-block; padding: 0 5px; border: 1px solid var(--border-strong); border-radius: 0; font-size: 12px; }
/* Schriftverkehr */
.seg-pick input:checked + span { background: var(--brand); color: #fff; }
.sv-pick { max-width: 560px; }
.sv-grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 16px; }
@media (max-width: 860px) { .sv-grid { grid-template-columns: 1fr; } .seg-pick { flex-wrap: wrap; border-radius: 0; } }
.sv-ph { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.sv-ph .chip { padding: 3px 9px; font-size: 12.5px; font-family: var(--font-mono, ui-monospace, monospace); background: var(--surface-000); }
.sv-letter { white-space: pre-wrap; padding: 14px 16px; border: 1px solid var(--border); border-radius: 0; background: var(--surface-000); font-size: 14px; max-height: 360px; overflow: auto; }
.sv-recips td, .sv-recips th { vertical-align: top; }
.sv-batch { border-left: 3px solid var(--brand); }
.card-head-row { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; justify-content: space-between; margin-bottom: 12px; } .card-head-row .card-head { margin: 0; } .card-head-row form { margin: 0; } .card-head-row input[type=search] { min-height: 34px; width: auto; }
.sv-recips-wrap { max-height: 560px; overflow: auto; }
ul.plain { list-style: none; margin: 6px 0 0; padding: 0; display: grid; gap: 3px; }
.sv-outbox { min-width: 0; max-width: 100%; } .sv-outbox .table-wrap { position: relative; }
.sv-series { margin: 4px 0 8px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 0; background: var(--surface-100, #f8fafc); }
.rm-att { display: grid; gap: 4px; margin: 2px 0 6px; } .rm-att li { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
/* Platzbuchung: Belegungsraster */
.cg-days { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.cg-strip { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: thin; }
.cg-strip a { display: flex; flex-direction: column; align-items: center; min-width: 44px; padding: 4px 6px; border: 1px solid var(--border); border-radius: 0; text-decoration: none; color: inherit; font-size: 12px; line-height: 1.2; }
.cg-strip a strong { font-size: 15px; }
.cg-strip a[aria-current] { background: var(--brand); border-color: var(--brand); color: #fff; }
.cg-pick input { min-height: 34px; width: auto; }
.cg-date { font-size: 17px; margin: 6px 0 10px; }
.cg-wrap { overflow-x: auto; position: relative; border: 1px solid var(--border); border-radius: 0; }
.cg { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13px; table-layout: fixed; min-width: 520px; }
.cg th, .cg td { border-bottom: 1px solid var(--border); border-right: 1px solid var(--border); padding: 0; vertical-align: top; }
.cg thead th { position: sticky; top: 0; background: var(--surface-000); padding: 8px 6px; font-size: 13px; text-align: center; z-index: 1; }
.cg .cg-time { width: 58px; position: sticky; left: 0; background: var(--surface-000); padding: 6px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--ink-muted); z-index: 1; }
.cg tr.is-past td, .cg tr.is-past .cg-time { opacity: .45; }
.cg td.cg-free a, .cg td.cg-free .cg-frei { display: block; min-height: 38px; padding: 9px 6px; text-align: center; color: var(--success); text-decoration: none; font-weight: 600; font-size: 12px; }
.cg td.cg-free .cg-frei { color: var(--ink-muted); font-weight: 400; }
.cg td.cg-free a:hover, .cg td.cg-free a:focus-visible { background: var(--success-bg); outline: 2px solid var(--success); outline-offset: -2px; }
.cg td.cg-busy { padding: 6px 7px; background: var(--surface-100, #f8fafc); border-left: 3px solid var(--border); }
.cg td.cg-busy a { display: block; color: inherit; text-decoration: none; }
.cg .cg-lbl { display: block; font-weight: 600; overflow: hidden; text-overflow: ellipsis; }
.cg .cg-sub { display: block; font-size: 11px; color: var(--ink-muted); font-weight: 400; }
.cg td.is-member, .cg-legend .is-member { border-left-color: var(--brand); background: var(--brand-subtle); }
.cg td.is-guest, .cg-legend .is-guest { border-left-color: #0E9F6E; background: var(--success-bg); }
.cg td.is-training, .cg-legend .is-training { border-left-color: #D97706; background: var(--warning-bg); }
.cg td.is-match, .cg-legend .is-match { border-left-color: #DC2626; background: var(--danger-bg); }
.cg td.is-abo, .cg-legend .is-abo { border-left-color: #7C3AED; background: var(--info-bg); }
.cg td.is-blocked, .cg-legend .is-blocked, .cg td.is-tournament { border-left-color: #6B7280; background: repeating-linear-gradient(135deg, var(--surface-100, #f3f4f6) 0 6px, transparent 6px 12px); }
.cg td.is-mine, .cg-legend .is-mine { outline: 2px solid var(--brand); outline-offset: -2px; }
.cg-legend { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; margin: 10px 0 0; color: var(--ink-muted); }
.cg-legend span { padding: 2px 8px; border-left: 3px solid var(--border); border-radius: 0; color: var(--ink); }
.cg-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
.cg-stats .stat { padding: 12px 14px; border: 1px solid var(--border); border-radius: 0; background: var(--surface-000); }
.cg-stats .stat span { color: var(--ink-muted); font-size: 13px; }
.cg-stats .stat strong { font-size: 22px; }
.cg-filter { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.cg-filter .field { margin: 0; }
.cg-courts input[type=text], .cg-courts input:not([type]) { min-width: 110px; }
.cg-num { width: 70px; }
.cg-money { width: 110px; display: inline-block; }
.cg-public .cg { font-size: 14px; }
/* Tablet am Clubheim */
.cg-tablet-body { margin: 0; background: var(--surface-000); padding: 18px; }
.cg-tablet-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 14px; }
.cg-tablet-head strong { display: block; font-size: 26px; }
.cg-tablet-head span { color: var(--ink-muted); font-size: 18px; }
.cg-tablet-qr { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--ink-muted); }
.cg-tablet-qr svg { width: 92px; height: 92px; }
.cg-tablet .cg-lbl { font-size: 16px; }
.cg-tablet { font-size: 16px; }
.cg-tablet .cg-time { font-size: 16px; }
/* Kiosk: Artikelliste */
.ki-tools { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; padding: 12px 14px; }
.ki-tools input[type=search] { flex: 1 1 220px; max-width: 320px; min-height: 38px; }
.ki-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ki-chips .chip { padding: 4px 10px; font-size: 13px; background: var(--surface-000); }
.ki-chips .chip.is-on { background: var(--brand-subtle); border-color: var(--brand); color: var(--brand-text, var(--brand)); }
.ki-group-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.ki-group-head h2 { font-size: 16px; margin: 0; display: flex; align-items: center; gap: 8px; }
.ki-table td, .ki-table th { vertical-align: middle; }
.ki-table td.num input { width: 78px; min-height: 34px; text-align: right; padding: 4px 8px; }
.ki-table .ki-on { width: 74px; text-align: center; }
.ki-table .ki-name { min-width: 220px; }
.ki-table tr.is-muted td { opacity: .55; }
.ki-switch { position: relative; display: inline-block; width: 40px; height: 22px; cursor: pointer; }
.ki-switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.ki-switch span { position: absolute; inset: 0; border-radius: 0; background: var(--border); transition: background .15s; }
.ki-switch span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 0; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: transform .15s; }
.ki-switch input:checked + span { background: var(--success); }
.ki-switch input:checked + span::after { transform: translateX(18px); }
.ki-switch input:focus-visible + span { outline: 2px solid var(--brand); outline-offset: 2px; }
.ki-grow { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ki-grow input[name=name] { flex: 1 1 180px; min-height: 34px; }
.ki-grow select { width: auto; min-height: 34px; }
.ki-offer { border: 0; padding: 0; margin: 0 0 14px; }
.ki-offer legend { display: flex; width: 100%; justify-content: space-between; align-items: center; font-weight: 700; padding: 0 0 4px; border-bottom: 1px solid var(--border); margin-bottom: 6px; }
.ki-offer-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 4px 14px; }
.ki-edit { max-width: 860px; }
.ki-table { table-layout: fixed; min-width: 680px; }
.ki-table col.c-on { width: 76px; } .ki-table col.c-p { width: 104px; } .ki-table col.c-s { width: 84px; } .ki-table col.c-e { width: 108px; }
.ki-table .ki-name { min-width: 0; overflow-wrap: anywhere; }
.ki-ph { display: inline-block; width: 30px; }
.sign-pick { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 14px; }
.seg-pick a.seg-opt { text-decoration: none; color: inherit; }
.seg-pick a.seg-opt.is-on span { background: var(--brand); color: #fff; }
p:has(> .backbtn) { margin-bottom: 14px !important; }
.honor-form { display: grid; grid-template-columns: 110px repeat(4, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 900px) { .honor-form { grid-template-columns: 1fr 1fr; } }
.honor-score { font-variant-numeric: tabular-nums; font-weight: 600; color: var(--ink); }
.honor-edit { margin-top: 2px; }
.honor-edit summary { cursor: pointer; list-style: none; display: inline-block; font-size: 13px; color: var(--ink-muted); padding: 0 4px; }
.honor-edit summary::-webkit-details-marker { display: none; }
.honor-edit[open] .form { margin-top: 6px; padding: 10px; border: 1px solid var(--border); border-radius: 0; background: var(--surface-100, #f8fafc); gap: 8px; }
.honor-list li form { position: static; }
.honor-list li .honor-edit > summary { position: absolute; right: 0; top: 0; }
/* Mitgliederbereich: Bereiche ein-/ausblenden */
.mv-areas { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px 20px; }
.mv-areas .check.is-muted { opacity: .5; }
/* Turnier: Meldeliste im Mitgliederbereich */
.su-list { margin-top: 4px; }
.su-list summary { cursor: pointer; font-size: .85rem; color: var(--primary); }
.su-list ol { margin: 6px 0 0; padding-left: 22px; columns: 2; column-gap: 24px; }
@media (max-width: 600px) { .su-list ol { columns: 1; } }
/* Turnier: Modus nach Meldeschluss, Zusammenlegen, Ausschreibung */
.modecards-sm { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); margin-bottom: 12px; }
.modecards-sm .modecard { padding: 12px 14px; }
.modecards-sm .modecard strong { font-size: 15px; padding-right: 22px; }
.mode-pick { margin: 0 0 12px; padding: 10px 14px; border: 1px solid var(--border); border-radius: 0; background: var(--surface-100); }
.mode-pick > summary { cursor: pointer; font-weight: 600; }
.mode-pick[open] > summary { margin-bottom: 10px; }
.tourn-invite > summary { cursor: pointer; display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: baseline; list-style: none; }
.tourn-invite > summary::-webkit-details-marker { display: none; }
.tourn-invite > summary h2 { margin: 0; }
.tourn-invite[open] > summary { margin-bottom: 12px; }
/* Sport-Übersicht: beide Assistenten gleich groß nebeneinander */
.sport-start .wizcta { flex-direction: column; align-items: flex-start; justify-content: space-between; height: 100%; background: var(--surface-000); }
.pb-fix { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: var(--ink-muted); }
.pb-fix .input-num { width: 72px; }
/* Trainingsteilnehmer wie Trainer */
.kpi-tile.is-warn strong { color: var(--warning); }
.text-warning { color: var(--warning); }
.tp-filter { grid-template-columns: minmax(0, 1fr) auto auto auto auto; align-items: center; }
.tp-pop .pop-body { display: flex; flex-wrap: wrap; gap: 6px; min-width: 240px; }
.tp-pop .chip { padding: 4px 10px; font-size: 13px; }
@media (max-width: 760px) { .tp-filter { grid-template-columns: 1fr 1fr; } .tp-filter input[type=search] { grid-column: 1 / -1; } .kpis-4 { grid-template-columns: 1fr 1fr; } }
/* Mehrseitige Assistenten (Kiosk, Trainingsplanung) im Look der Veranstaltungs-Assistenten */
.swiz-top-srv { display: flex; flex-wrap: wrap; gap: 8px 16px; justify-content: space-between; align-items: center; }
.swiz-jump { display: inline-flex; gap: 4px; }
.swiz-jump a { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 0; border: 1px solid var(--border); text-decoration: none; color: var(--ink-muted); font-weight: 700; font-size: 12px; }
.swiz-jump a.is-done { background: var(--surface-200); color: var(--ink); }
.swiz-jump a[aria-current] { background: var(--brand); border-color: var(--brand); color: #fff; }
.swiz .swiz-bar-srv { display: block; }
/* Sponsoring: Logo, Foto-Nachweis, Beamer */
.sp-logo { max-width: 260px; max-height: 120px; object-fit: contain; background: #fff; border: 1px solid var(--border); border-radius: 0; padding: 10px; }
.sp-proof { max-width: 100%; max-height: 260px; border-radius: 0; border: 1px solid var(--border); }
body.beamer { margin: 0; min-height: 100vh; background: #fff; color: #111; display: flex; flex-direction: column; }
.beamer-head { display: flex; align-items: center; justify-content: center; gap: 18px; padding: 24px 40px; background: var(--brand); color: #fff; font-size: clamp(22px, 3vw, 40px); font-weight: 800; }
.beamer-club { height: 1.6em; width: auto; background: #fff; border-radius: 0; padding: 4px; }
.beamer-stage { flex: 1; position: relative; }
.beamer-slide { position: absolute; inset: 0; margin: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 28px; opacity: 0; transition: opacity .8s; }
.beamer-slide.is-on { opacity: 1; }
.beamer-slide img { max-width: 70vw; max-height: 55vh; object-fit: contain; }
.beamer-slide figcaption { font-size: clamp(22px, 3.2vw, 48px); font-weight: 700; }
.beamer-empty { text-align: center; margin-top: 30vh; font-size: 28px; }
.beamer-hint { margin: 0; padding: 8px 16px; font-size: 12px; color: #888; text-align: right; }
.cr-doc .cr-table td:first-child { min-width: 170px; }
.cr-doc:has(.cr-table th:nth-child(7)) { max-width: 980px; }

/* Haushaltsplan (0.57.0) */
.hh-table td, .hh-table th { vertical-align: middle; }
.hh-in { width: 110px; text-align: right; padding: 4px 8px; }
.hh-bar-col { width: 150px; }
.hh-bar-col > .small { margin-left: 6px; }
.hh-bar { position: relative; display: inline-block; width: 90px; vertical-align: middle; }
.hh-mark { position: absolute; top: -3px; bottom: -3px; width: 2px; background: var(--text-muted, #6b7280); border-radius: 0; }
.hh-sum td { border-top: 1px solid var(--border, #e5e7eb); }
@media (max-width: 640px) { .hh-bar-col { width: auto; } .hh-bar { display: none; } .hh-bar-col > .small { margin-left: 0; } .hh-in { width: 84px; } }

/* Kiosk-Artikelbilder (0.57.0) */
.kiosk-tap.has-img { padding-top: 0; }
.kiosk-img { display: block; width: calc(100% + 28px); max-width: none; height: 92px; margin: 0 -14px 8px; object-fit: contain; background: #fff; border-bottom: 1px solid var(--border); }
.theke-main .kiosk-img { height: 110px; }
.ki-photo { display: flex; gap: 16px; align-items: flex-start; }
.ki-photo .field { flex: 1; }
.ki-photo-img { width: 120px; height: 120px; object-fit: contain; background: #fff; border: 1px solid var(--border); border-radius: 0; }
.ki-thumb { width: 28px; height: 28px; object-fit: contain; vertical-align: middle; margin-right: 8px; border-radius: 0; background: #fff; border: 1px solid var(--border); }

/* „⚖ Ist das so richtig?“ (0.59.0) */
.legal-btn { display: inline-flex; align-items: center; gap: 4px; padding: 2px 10px; border: 1px solid var(--brand-subtle, #cfe3ea); border-radius: 0; background: var(--surface-000, #fff); color: var(--brand-text, #0f6e8c); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap; vertical-align: middle; }
.legal-btn:hover { background: var(--brand-subtle, #e6f2f6); }
.card-head .legal-btn { margin-left: auto; }
.legal-dlg { position: fixed; inset: 0 0 0 auto; margin: 0; width: min(480px, 100vw); max-width: 100vw; height: 100dvh; max-height: 100dvh; padding: 20px 22px; border: 0; border-left: 1px solid var(--border); background: var(--surface-000, #fff); color: var(--ink, #111827); box-shadow: -12px 0 40px rgba(0,0,0,.18); overflow-y: auto; }
.legal-dlg::backdrop { background: rgba(15, 23, 42, .35); }
.legal-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.legal-head h2 { font-size: 20px; margin: 2px 0 0; }
.legal-office { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-muted, #6b7280); }
.legal-short { font-size: 16px; font-weight: 600; background: var(--brand-subtle, #e6f2f6); border-radius: 0; padding: 12px 14px; margin: 14px 0; }
.legal-dlg h3 { font-size: 14px; margin: 16px 0 6px; }
.legal-dlg ol, .legal-dlg ul { padding-left: 20px; margin: 0; }
.legal-dlg li { margin: 4px 0; line-height: 1.45; }
.legal-ask { margin: 14px 0 0; font-size: 14px; }
.legal-src { margin-top: 12px; font-size: 14px; }
.legal-src summary { cursor: pointer; font-weight: 600; }
.legal-q { display: flex; gap: 8px; margin-top: 16px; }
.legal-q input { flex: 1; min-width: 0; }
.legal-foot { font-size: 12px; color: var(--ink-muted, #6b7280); margin: 14px 0 0; }

/* Kiosk: PayPal mit Bestätigung (0.60.0) */
.theke-wait { display: flex; align-items: center; justify-content: center; gap: 10px; font-size: 20px; font-weight: 600; color: var(--ink-muted); margin: 12px 0; }
.theke-wait.is-paid { color: var(--success); font-size: 26px; }
.paypal-done { text-align: center; }
.paypal-done h1 { margin: 4px 0 8px; }
.theke-wait .pulse { display: inline-block; width: 12px; height: 12px; border-radius: 0; background: var(--accent); animation: vl-pulse 1.6s infinite; }

/* Bildschirme (0.62.0) */
.screen-bar { position: sticky; top: 0; z-index: 50; display: flex; gap: 6px; justify-content: center; padding: 6px; background: rgba(15, 23, 42, .85); }
.screen-bar a { color: #fff; text-decoration: none; padding: 6px 16px; border-radius: 0; font-weight: 600; font-size: 15px; }
.screen-bar a[aria-current="page"] { background: #fff; color: #0f172a; }
.screen-bar.is-auto { opacity: .55; }
.screen-body { margin: 0; min-height: 100vh; background: var(--surface-50, #f6f7f9); color: var(--ink, #111827); }
.screen-head { display: flex; align-items: center; gap: 18px; padding: 24px 40px; background: var(--brand, #0f6e8c); color: #fff; }
.screen-head strong { display: block; font-size: 30px; }
.screen-head span { font-size: 20px; opacity: .85; }
.screen-logo { width: 72px; height: 72px; border-radius: 0; background: #fff; }
.screen-main { padding: 24px 40px; }
.screen-list { list-style: none; margin: 0; padding: 0; }
.screen-day { margin: 18px 0 6px; font-size: 22px; font-weight: 700; color: var(--brand, #0f6e8c); }
.screen-item { display: grid; grid-template-columns: 90px 1fr auto; gap: 16px; align-items: baseline; padding: 12px 16px; margin-bottom: 6px; background: #fff; border-radius: 0; font-size: 24px; border-left: 6px solid var(--brand, #0f6e8c); }
.screen-item.is-auswaerts { border-left-color: #94a3b8; }
.screen-item.is-fest { border-left-color: #f59e0b; }
.screen-time { font-weight: 700; }
.screen-title { font-weight: 600; }
.screen-meta { color: var(--ink-muted, #4b5563); font-size: 18px; }
.screen-empty { font-size: 26px; text-align: center; margin-top: 80px; color: var(--ink-muted); }
.screen-new .tablet-qr { max-width: 200px; }
@media (max-width: 700px) { .screen-item { grid-template-columns: 60px 1fr; font-size: 18px; } .screen-meta { grid-column: 2; } .screen-head, .screen-main { padding: 16px; } }

/* Theken-Tablet: Status in Schrift statt nur Farbe, großer Hilfe-Knopf (0.62.0) */
.theke-name { flex-direction: column; align-items: flex-start; justify-content: center; }
.theke-name .tn-name { display: block; }
.tn-state { display: block; margin-top: 4px; font-size: 16px; font-weight: 700; }
.tn-state.is-open { color: #9b1c1c; }
.tn-state.is-paid { color: #14532d; }
.theke-help { margin: 18px 0 8px; }
.theke-help > summary { list-style: none; display: inline-flex; align-items: center; gap: 8px; font-size: 22px; padding: 14px 24px; cursor: pointer; }
.theke-help > summary::-webkit-details-marker { display: none; }
.theke-help-text { margin-top: 10px; padding: 16px 20px; border-radius: 0; background: var(--surface-000, #fff); border: 2px solid var(--brand, #0f6e8c); font-size: 20px; line-height: 1.5; max-width: 720px; }
.theke-help-text p { margin: 0 0 8px; }

/* Suche: Vorschlag „Möchtest du …?“ und Einstellungen */
.assist-card{display:flex;align-items:center;gap:14px;padding:14px 16px;border:2px solid var(--accent, #2563eb);border-radius: 0;background:var(--surface, #fff);flex-wrap:wrap}
.assist-icon{font-size:1.6rem;line-height:1}
.assist-body{flex:1 1 220px;display:flex;flex-direction:column;gap:2px;font-size:1.05rem}
.set-where{display:inline-block;font-size:.8rem;padding:1px 8px;border-radius: 0;background:var(--muted-bg, #eef2f7);color:var(--muted, #556);margin-left:4px;white-space:nowrap}
.topsearch input{min-width:0}

/* Mitgliederbereich: Dokumente eingeklappt */
.portal-fold > summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;font-size:1.1rem;font-weight:700;min-height:44px}
.portal-fold > summary::-webkit-details-marker{display:none}
.portal-fold-hint{margin-left:auto;font-size:.9rem;font-weight:600;color:var(--primary,#0e7490)}
.portal-fold-hint::after{content:" ▾"}
.portal-fold[open] .portal-fold-hint{font-size:0}
.portal-fold[open] .portal-fold-hint::after{content:"einklappen ▴";font-size:.9rem}

/* Kopfzeile immer sichtbar, Speichern-Leisten unten festhalten */
.topbar { position: sticky; top: 0; z-index: 30; }
html { scroll-padding-top: calc(var(--tb, 64px) + 12px); }
@media (min-width: 761px) {
  .shell > .sidenav { position: sticky; top: var(--tb, 64px); align-self: flex-start; height: calc(100vh - var(--tb, 64px)); overflow-y: auto; }
}
@media (max-width: 760px) {
  body.nav-open .shell > .sidenav { position: sticky; top: var(--tb, 56px); z-index: 25; max-height: calc(100vh - var(--tb, 56px)); overflow-y: auto; }
}
form:not(.inline-form):not([role="search"]) > .btn-row:last-child:not(:first-child):has(button[type="submit"], button:not([type])) {
  position: sticky; bottom: -1px; z-index: 6; background: var(--surface-000); padding-top: 10px; padding-bottom: 11px; margin-bottom: 0;
}
.btn-row.is-stuck, .savebar.is-stuck, .slide-savebar.is-stuck { box-shadow: 0 -10px 16px -12px rgba(0,0,0,.25); border-top: 1px solid var(--border); }
@media print { .topbar, .shell > .sidenav, form > .btn-row:last-child { position: static !important; } }
.name-icon { display: none; }
@media (max-width: 760px) { .name-icon { display: inline-flex; } }
.portal-fold-title { flex: 1 1 auto; min-width: 0; }
.portal-fold-hint { margin-left: 0; white-space: nowrap; }

/* Kiosk am Handy: Stand oben, Artikel als kompakte Liste, Warenkorb unten fest */
.kiosk-status { display: flex; align-items: center; gap: 8px 16px; flex-wrap: wrap; }
.kiosk-state { margin: 0; font-size: 24px; font-weight: 800; flex: 1 1 auto; }
.kiosk-state.is-open { color: var(--danger, #b91c1c); }
.kiosk-state.is-paid { color: var(--success, #15803d); }
.copy-row { display: flex; gap: 8px; }
.copy-row input { flex: 1; min-width: 0; font-variant-numeric: tabular-nums; }
.pm-methods-phone { display: grid; gap: 8px; margin: 8px 0; }
.pm-methods-phone .pm-method { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; width: 100%; min-height: 54px; padding: 10px 14px; border: 1px solid var(--border); border-radius: 0; background: var(--surface-000); color: var(--ink); font: inherit; font-size: 17px; font-weight: 700; text-align: left; cursor: pointer; }
.pm-methods-phone .pm-method:hover { border-color: var(--brand); }
.pm-methods-phone .pm-method small { flex-basis: 100%; font-size: 13px; font-weight: 400; color: var(--ink-muted); padding-left: 34px; }
@media (max-width: 760px) {
  .pay-qr-desktop { display: none; }
  .kiosk-mine, .kiosk-mine .kiosk-pos-main { min-width: 0; max-width: 100%; }
  .kiosk-mine .kiosk-tiles { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .kiosk-mine .kiosk-tile { flex-direction: row; align-items: center; min-width: 0; border-top-width: 1px; border-left: 6px solid var(--gc, var(--brand)); }
  .kiosk-mine .kiosk-tap { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; column-gap: 10px; align-items: center; min-width: 0; min-height: 52px; padding: 8px 10px; }
  .kiosk-mine .kiosk-tap.has-img { padding-top: 8px; }
  .kiosk-mine .kiosk-img { grid-column: 1; grid-row: 1 / span 3; width: 40px; height: 40px; margin: 0; object-fit: contain; border: 1px solid var(--border); border-radius: 0; }
  .kiosk-mine .kiosk-gname { display: none; }
  .kiosk-mine .kiosk-name { grid-column: 2; padding-right: 0; overflow-wrap: anywhere; }
  .kiosk-mine .kiosk-unit, .kiosk-mine .kiosk-dep { grid-column: 2; font-size: 12px; line-height: 1.2; }
  .kiosk-mine .kiosk-price { grid-column: 3; grid-row: 1 / span 2; margin: 0; padding: 0; white-space: nowrap; }
  .kiosk-mine .kiosk-count { position: static; min-width: 32px; height: 32px; font-size: 15px; margin-right: 4px; flex: none; }
  .kiosk-mine .kiosk-minus { position: static; width: 38px; height: 38px; margin-right: 8px; flex: none; }
  .kiosk-mine .kiosk-pos-side { position: sticky; bottom: 0; z-index: 8; padding: 10px 12px; border-radius: 0; box-shadow: 0 -8px 18px -10px rgba(0,0,0,.3); }
  .kiosk-mine .kiosk-pos-side .kiosk-submit { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px; }
  .kiosk-mine .kiosk-pos-side .kiosk-submit .btn { width: auto; flex: 1 1 40%; min-height: 48px; }
  .kiosk-mine .kiosk-pos-side .kiosk-total { flex-basis: 100%; text-align: left; font-size: 16px; }
  .kiosk-mine .kiosk-pos-side .kiosk-total strong { font-size: 20px; }
  .kiosk-mine .kiosk-guestcheck { margin: 0 0 4px; font-size: 14px; min-height: 0; }
  .kiosk-mine .kiosk-guestcheck .hint { display: none; }
}
/* Gruppen zum Aufklappen (Handy-Kiosk) */
.kiosk-group { border: 1px solid var(--border); border-left: 6px solid var(--gc, var(--brand)); border-radius: 0; background: var(--gc-bg, var(--surface-000)); margin: 0 0 8px; }
.kiosk-group > summary { list-style: none; display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 8px 14px; cursor: pointer; font-weight: 800; font-size: 17px; }
.kiosk-group > summary::-webkit-details-marker { display: none; }
.kiosk-group > summary::after { content: "▾"; margin-left: 4px; color: var(--ink-muted); transition: transform .15s; }
.kiosk-group[open] > summary::after { transform: rotate(180deg); }
.kiosk-group-name { flex: 1 1 auto; min-width: 0; }
.kiosk-group-n { font-size: 13px; font-weight: 600; color: var(--ink-muted); }
.kiosk-group-n::after { content: " Artikel"; }
.kiosk-group-picked:not(:empty) { padding: 2px 10px; border-radius: 0; background: var(--gc, var(--brand)); color: #fff; font-size: 13px; font-weight: 800; }
.kiosk-group .kiosk-tiles { padding: 0 8px 8px; }
.kiosk-group .kiosk-tile { border-left-width: 1px; background: var(--surface-000); }
.kiosk-phone-done { max-width: 560px; margin: 0 auto; text-align: center; }
  .kiosk-mine .kiosk-pos-side .kiosk-total strong { font-size: 20px; }
}
/* App-Hinweis am Handy: Symbol klein neben der Überschrift, Text darunter über die volle Breite – keine Lücke unter dem Symbol */
@media (max-width: 760px) {
  .a2hs { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 0 12px; align-items: center; }
  .a2hs-text { display: contents; }
  .a2hs-icon { width: 48px; height: 48px; border-radius: 0; grid-column: 1; grid-row: 1; }
  .a2hs h2 { grid-column: 2; grid-row: 1; margin: 0; }
  .a2hs-text > :not(h2) { grid-column: 1 / -1; }
  .a2hs-text > p { margin-top: 10px; }
}
.kiosk-fav { --gc: #d97706; --gc-bg: #fffbeb; }
@media (prefers-color-scheme: dark) { .kiosk-fav { --gc: #fbbf24; --gc-bg: var(--surface-000); } }
/* Handy-Kiosk: Umschalter „Meine Favoriten“ / „Alle Artikel“ */
.kiosk-views { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; margin: 0 0 12px; border-radius: 0; background: var(--surface-200); position: sticky; top: calc(var(--tb, 56px) + 4px); z-index: 4; }
.kiosk-view-btn { min-height: 44px; border: 0; border-radius: 0; background: transparent; color: var(--ink); font: inherit; font-size: 16px; font-weight: 700; cursor: pointer; }
.kiosk-view-btn[aria-selected="true"] { background: var(--surface-000); box-shadow: 0 1px 4px rgba(0,0,0,.15); }
.kiosk-favs { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.kiosk-group > summary { text-transform: none; letter-spacing: normal; color: var(--ink); flex-wrap: wrap; }
.kiosk-group-name { flex: 1 1 auto; min-width: 0; overflow-wrap: break-word; }
.kiosk-group-picked:not(:empty) { white-space: nowrap; font-size: 12px; padding: 2px 8px; }
.kiosk-group-n { white-space: nowrap; }
@media (max-width: 760px) { .kiosk-mine .kiosk-name { overflow-wrap: break-word; hyphens: auto; } .kiosk-mine .kiosk-tile.is-picked .kiosk-dep { display: none; } }
/* Theken-Tablet: Umschalter Anschreiben / Sofort bezahlen */
.theke-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 6px; margin: 0 0 16px; border-radius: 0; background: var(--surface-200); }
.theke-switch-btn { display: flex; align-items: center; justify-content: center; min-height: 60px; border-radius: 0; color: var(--ink); text-decoration: none; font-size: 22px; font-weight: 800; }
.theke-switch-btn[aria-current="page"] { background: var(--surface-000); box-shadow: 0 2px 6px rgba(0,0,0,.15); }
/* Theken-Tablet: letzte Stunde bezahlt */
.theke-recent { margin-top: 14px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 0; background: var(--surface-000); }
.theke-recent > summary { cursor: pointer; font-weight: 800; font-size: 17px; display: flex; align-items: center; gap: 8px; min-height: 40px; }
.theke-recent-list { list-style: none; margin: 8px 0; padding: 0; display: grid; gap: 6px; max-height: 360px; overflow-y: auto; }
.theke-recent-list li { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 8px; align-items: start; padding: 6px 0; border-top: 1px solid var(--border); }
.tr-time { font-variant-numeric: tabular-nums; color: var(--ink-muted); font-weight: 700; }
.tr-what small, .tr-amt small { display: block; font-size: 12px; color: var(--ink-muted); }
.tr-what small { overflow-wrap: anywhere; }
.tr-amt { text-align: right; white-space: nowrap; }
.guest-qr { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; margin: 10px 0 14px; padding: 12px; border: 1px dashed var(--border-strong, var(--border)); border-radius: 0; }
.guest-qr-code { width: 120px; flex: none; background: #fff; border-radius: 0; padding: 4px; }
.guest-qr-code svg { width: 100%; height: auto; display: block; }
.guest-qr > div:last-child { flex: 1 1 220px; min-width: 0; }
.poster-welcome { line-height: 1.15; }
/* Handy: Seite nicht seitlich verschiebbar – iOS zoomt bei Eingabefeldern unter 16 px hinein, danach lässt sich die Seite herumschieben */
html, body { overflow-x: clip; }
@media (max-width: 760px) {
  .input, input:not([type]), input[type=text], input[type=email], input[type=tel], input[type=url], input[type=password], input[type=date], input[type=time], input[type=datetime-local], input[type=number], input[type=search], select, textarea { font-size: 16px; }
  .cg-public .cg { min-width: 0; font-size: 12px; }
  .cg-public .cg thead th { padding: 6px 2px; font-size: 12px; overflow-wrap: anywhere; }
  .cg-public .cg .cg-time { width: 46px; padding: 6px 2px; }
}
.cg-wrap { overscroll-behavior-x: contain; }
.ws-logo-dark { display: inline-grid; place-items: center; width: 80px; height: 80px; border-radius: 0; background: #0F1117; margin-bottom: 6px; }
.ws-logo-dark img { max-width: 64px; max-height: 64px; }
/* Haken mit fetter Beschriftung und Hinweis: Hinweis immer in eigener Zeile – auch ohne „check-hint“ */
.check > span > strong + .hint { display: block; font-weight: 400; }

/* Office: Kunden, Aufträge, Zeiten */
.office-stats { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.office-stats .stat { background: var(--surface-000); border: 1px solid var(--border); border-radius: 0; padding: 14px 16px; }
.stat-label { font-size: 13px; color: var(--ink-muted); font-weight: 600; }
.stat-value { font-size: 24px; font-weight: 800; line-height: 1.2; font-variant-numeric: tabular-nums; }
.stat-note { font-size: 13px; color: var(--ink-muted); }
.jobboard { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); align-items: start; }
.jobcol { background: var(--surface-200); border-radius: 0; padding: 10px; display: flex; flex-direction: column; gap: 10px; min-height: 120px; }
.jobcol-head { font-size: 14px; margin: 2px 4px 0; display: flex; justify-content: space-between; align-items: center; }
.jobcard { padding: 12px 14px; }
.jobcard h3 { font-size: 15px; line-height: 1.3; }
.list li.done { opacity: .65; }
.list .iconbtn { min-width: 32px; height: 32px; padding: 0; border: 1px solid var(--border); border-radius: 0; }
.list .iconbtn:hover { background: var(--surface-200); }
.weekbar { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.weekbar a { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 4px; border: 1px solid var(--border); border-radius: 0; text-decoration: none; color: var(--ink); font-size: 13px; }
.weekbar a strong { font-size: 16px; font-variant-numeric: tabular-nums; }
.weekbar a[aria-current] { border-color: var(--brand); box-shadow: inset 0 0 0 1px var(--brand); }
.weekbar a.is-empty strong { color: var(--ink-muted); font-weight: 500; }
.timer-run { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.timer-run .pulse { flex: none; }
a.stat.card-link { text-decoration: none; color: var(--ink); }
a.stat.card-link:hover { border-color: var(--brand); }

/* STAR-MEDIEN CI: Indigo, Rot als einziges Akzent-Detail, Bricolage, Ecken */
:root { --display: "Bricolage Display", "Bricolage", system-ui, sans-serif; --accent-text: #BE123C; }
@media (prefers-color-scheme: dark) { :root { --accent: #FB7185; --accent-text: #FB7185; } }
h1, h2, h3, .stat-value, .page-title { font-family: var(--display); letter-spacing: -.015em; }
h1 { font-weight: 800; }
.navbadge-new, .newpill, .newpill-nav { background: var(--accent); color: #fff; }
.sidenav a[aria-current="page"] { box-shadow: inset 3px 0 0 var(--accent); }

/* Rechnungen & Angebote */
p.hint, span.hint { font-size: 13px; color: var(--ink-muted); }
.docitems td { vertical-align: top; }
.docitems input[type=text], .docitems select, .docitems textarea { width: 100%; }
.docitems textarea { margin-top: 6px; font-size: 13px; resize: vertical; }
.docitems td:first-child { min-width: 190px; }
.docitems .input-num { min-width: 64px; max-width: 90px; }
.doctotals { margin: 16px 0 0 auto; max-width: 340px; display: grid; gap: 6px; }
.doctotals > div { display: flex; justify-content: space-between; gap: 16px; font-variant-numeric: tabular-nums; }
.doctotals .doctotal { border-top: 2px solid var(--brand); padding-top: 8px; font-size: 18px; }
.doctotals .doctotal strong { font-family: var(--display); }
.fieldset-plain { border: 0; padding: 0; margin: 0 0 12px; }
.fieldset-plain legend { margin-bottom: 6px; }
.pre { white-space: pre-line; }
.docitems textarea { min-height: 38px; height: auto; }
.docitems select { min-width: 92px; }
.docitems td:nth-child(5) select { min-width: 78px; }
.docitems th, .docitems td { padding-left: 6px; padding-right: 6px; }
progress.kubar { display: block; width: 100%; height: 10px; border: 0; background: var(--surface-200); appearance: none; -webkit-appearance: none; }
progress.kubar::-webkit-progress-bar { background: var(--surface-200); }
progress.kubar::-webkit-progress-value { background: var(--brand); }
progress.kubar::-moz-progress-bar { background: var(--brand); }
progress.kubar-danger::-webkit-progress-value { background: var(--accent); }
progress.kubar-danger::-moz-progress-bar { background: var(--accent); }

/* Projektplanung */
.grid-planung { grid-template-columns: minmax(0, 3fr) minmax(min(260px, 100%), 1fr); }
.tl-wrap { overflow-x: auto; }
svg.timeline { width: 100%; min-width: 760px; height: auto; display: block; font-family: var(--font); }
.timeline .tl-grid { stroke: var(--border); stroke-width: 1; }
.timeline .tl-week { font-size: 14px; font-weight: 700; fill: var(--ink); }
.timeline .tl-date { font-size: 12.5px; fill: var(--ink-muted); }
.timeline .tl-zebra { fill: var(--surface-100); }
.timeline .tl-label { font-size: 15px; font-weight: 700; fill: var(--brand-text); }
.timeline a:hover .tl-label { text-decoration: underline; }
.timeline .tl-sub { font-size: 12.5px; fill: var(--ink-muted); }
.timeline .tl-bar { fill: var(--brand); }
.timeline .tl-bar.tl-late { fill: var(--accent); }
.timeline .tl-bar.tl-paused { fill: var(--border-strong); }
.timeline .tl-bar.tl-open { opacity: .55; }
.timeline .tl-ms { fill: var(--surface-000); stroke: var(--brand); stroke-width: 2.5; }
.timeline .tl-ms-done { fill: var(--border-strong); stroke: var(--border-strong); }
.timeline .tl-ms-late { stroke: var(--accent); }
.timeline .tl-today { stroke: var(--accent); stroke-width: 2; }
.timeline .tl-today-label { font-size: 12.5px; font-weight: 700; fill: var(--accent); }
.tl-key { display: inline-block; width: 18px; height: 8px; vertical-align: middle; }
.tl-key-bar { background: var(--brand); }
.tl-key-late { background: var(--accent); }
.loadtable td { min-width: 92px; vertical-align: top; }
.loadtable td progress { margin: 4px 0 2px; }
.loadtable td.load-over strong { color: var(--accent-text, var(--danger)); }
.inline-form { display: flex; gap: 6px; align-items: center; }
.inline-form .input-num { max-width: 70px; }
.grid-beleg { grid-template-columns: minmax(0, 3fr) minmax(min(280px, 100%), 2fr); }
.belegvorschau img { display: block; max-width: 100%; height: auto; border: 1px solid var(--border); }
fieldset[disabled] { opacity: .75; }

/* Kundenportal */
body.portal { background: var(--surface-100); }
.portal-wrap { max-width: 960px; margin: 0 auto; padding: 0 20px; }
.portal-head { background: var(--surface-000); border-bottom: 3px solid var(--brand); }
.portal-head .portal-wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 72px; }
.portal-logo { height: 44px; width: auto; }
.portal-name { font-family: var(--display); font-size: 22px; color: var(--brand-text); }
.portal-label { font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted); }
.portal-main { padding-top: 32px; padding-bottom: 24px; }
.portal-title { font-family: var(--display); font-size: 32px; margin: 0 0 8px; }
.portal-intro { color: var(--ink-muted); margin: 0 0 24px; max-width: 70ch; }
.portal-job { padding: 16px 0; border-top: 1px solid var(--border); }
.portal-job:first-of-type { border-top: 0; padding-top: 0; }
.portal-job-head { display: flex; gap: 12px; align-items: center; justify-content: space-between; }
.portal-job-head h3 { margin: 0; font-size: 18px; }
.portal-ms { list-style: none; padding: 0; margin: 0; display: grid; gap: 4px; }
.portal-ms li.done { color: var(--ink-muted); }
.portal-ms li span[aria-hidden] { color: var(--brand); }
.portal-accept summary { list-style: none; cursor: pointer; }
.portal-accept summary::-webkit-details-marker { display: none; }
.portal-accept[open] { flex-basis: 100%; }
.portal-foot { padding-top: 8px; padding-bottom: 40px; }
@media (max-width: 600px) { .portal-title { font-size: 26px; } .portal .office-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; } .portal .office-stats .stat { padding: 12px; } .portal .stat-value { font-size: 20px; } .portal .stat-note { display: none; } }