/*
 * HTMX-Oberfläche nach Runde 3 (E1). Farben ausschließlich aus den Tokens
 * (ui/shared/tokens.css, Hell = :root, Dunkel = [data-theme="Dark"]); keine festen Farbwerte.
 * Rahmen wie die React-UI (Seitenleiste 248 px, Kopfzeile, Statusampel), Schrift Inter (lokal).
 */

:root {
  --radius: 10px;
  --shadow: 0 1px 2px color-mix(in srgb, var(--fg-default) 6%, transparent);
  --font-sans: 'Inter Variable', Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'DejaVu Sans Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  /* Fokusring (WCAG 2.4.7/2.4.11): 2 px in der Fokusfarbe des Themes */
  --focus-ring: 2px solid var(--border-focus);
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 1.5;
  color: var(--fg-default);
  background: var(--bg-canvas);
  color-scheme: light;
}
:root[data-theme='Dark'] { --shadow: none; color-scheme: dark; }

* { box-sizing: border-box; }
body { margin: 0; background: var(--bg-canvas); color: var(--fg-default); }
a { color: var(--fg-link); text-decoration: none; }
a:hover { text-decoration: underline; }
h1 { font-size: 1.5rem; margin: .5rem 0 1rem; }
h2 { font-size: 1.2rem; }
h3 { font-size: 1.05rem; }
small, .hint { color: var(--fg-muted); }
.small { font-size: .85rem; }
pre, code { font-family: var(--font-mono); }

/* Sichtbarer Fokus für alles Bedienbare (Tastatur), nicht bei Mausklick */
:focus-visible { outline: var(--focus-ring); outline-offset: 2px; }

.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* --- Formulare und Knöpfe ------------------------------------------------------------- */
input, select, textarea, button {
  font: inherit; padding: .4rem .55rem; border: 1px solid var(--border-strong); border-radius: 6px;
  background: var(--bg-surface); color: var(--fg-default);
}
input[type='checkbox'], input[type='radio'] { accent-color: var(--accent-default); }
button { background: var(--accent-default); color: var(--fg-on-accent); border-color: var(--accent-default); cursor: pointer; }
button:hover:not(:disabled) { background: var(--accent-hover); border-color: var(--accent-hover); }
button:disabled { opacity: .55; cursor: not-allowed; }
button.secondary { background: var(--bg-surface); color: var(--fg-link); border-color: var(--border-strong); }
button.secondary:hover:not(:disabled) { background: var(--bg-subtle); }
button.danger { background: var(--bg-surface); color: var(--danger-fg); border-color: var(--danger-fg); }
button.danger:hover:not(:disabled) { background: var(--danger-subtle); }
button.small { padding: .2rem .5rem; font-size: .8rem; }
a.button { display: inline-block; font: inherit; padding: .4rem .7rem; border: 1px solid var(--accent-default); border-radius: 6px;
  background: var(--accent-default); color: var(--fg-on-accent); }
a.button.secondary { background: var(--bg-surface); color: var(--fg-link); border-color: var(--border-strong); }
a.button:hover { text-decoration: none; background: var(--accent-hover); }
a.button.secondary:hover { background: var(--bg-subtle); }
.htmx-indicator { display: none; color: var(--fg-muted); }
.htmx-request .htmx-indicator, .htmx-request.htmx-indicator { display: inline; }
/* Speichern-Knopf mit „Wird gespeichert …“ während des Sendens (Käufe, docs/29 §1.4) */
.busy-button .busy-active { display: none; }
.busy-button.htmx-request .busy-idle { display: none; }
.busy-button.htmx-request .busy-active { display: inline; }
.exists-box { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; }
.exists-box p { margin: .2rem 0 0; }

/* --- Rahmen: Seitenleiste, Kopfzeile, Inhalt ------------------------------------------- */
.shell { display: grid; grid-template-columns: 248px minmax(0, 1fr); min-height: 100vh; background: var(--bg-canvas); }
.skip { position: absolute; left: .75rem; top: -3rem; z-index: 100; padding: .5rem .9rem; border-radius: 8px;
  background: var(--accent-default); color: var(--fg-on-accent); }
.skip:focus { top: .75rem; }

.sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; gap: 1.25rem;
  padding: 1rem .75rem .75rem; background: var(--bg-sidebar); border-right: 1px solid var(--border-default); overflow-y: auto; }
.brand-row { display: flex; align-items: center; justify-content: space-between; padding: .25rem .25rem 0; }
.brand { display: flex; align-items: center; gap: .6rem; color: var(--fg-default); text-decoration: none; margin: 0; }
.brand:hover { text-decoration: none; }
.logo { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 8px; flex: none;
  background: var(--accent-default); color: var(--fg-on-accent); }
.brand-name { display: block; font-weight: 650; font-size: 1rem; line-height: 1.2; }
.brand-tagline { display: block; font-size: .75rem; color: var(--fg-muted); line-height: 1.2; }

.nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .25rem; }
.nav-link { display: flex; align-items: center; gap: .75rem; min-height: 2.5rem; padding: .45rem .75rem; border-radius: 8px;
  color: var(--fg-default); text-decoration: none; }
.nav-link:hover { background: var(--bg-subtle); text-decoration: none; }
.nav-link[aria-current='page'] { background: var(--bg-nav-active); color: var(--accent-fg); font-weight: 600; }
.nav-label { flex: 1; }
.nav-badge { display: inline-block; min-width: 1.4rem; padding: 0 .4rem; border-radius: 999px; text-align: center;
  background: var(--danger-subtle); color: var(--danger-fg); font-size: .75rem; font-weight: 600; }
/* Gruppenüberschrift: --fg-muted statt --fg-subtle (Kontrast ≥ 4,5:1 bei kleiner Schrift) */
.nav-group { margin: 1.25rem 0 .4rem; padding: 0 .75rem; font-size: .7rem; font-weight: 600; letter-spacing: .06em;
  text-transform: uppercase; color: var(--fg-muted); }

.sidebar-bottom { margin-top: auto; display: flex; flex-direction: column; gap: .75rem; }
.switches { display: flex; align-items: flex-start; justify-content: space-between; gap: .5rem;
  padding: 0 .25rem .75rem; border-bottom: 1px solid var(--border-default); }
.segmented { display: inline-flex; gap: .15rem; margin: 0; padding: .2rem; border: 1px solid var(--border-default);
  border-radius: 8px; background: var(--bg-subtle); }
.segment { position: relative; display: grid; place-items: center; width: 2rem; height: 1.75rem; border-radius: 6px;
  color: var(--fg-muted); cursor: pointer; }
.segment input { position: absolute; inset: 0; margin: 0; opacity: 0; cursor: pointer; }
.segment:has(input:checked) { background: var(--bg-surface); color: var(--fg-default); box-shadow: var(--shadow); }
.segment:has(input:focus-visible) { outline: var(--focus-ring); outline-offset: 1px; }
.language { display: flex; flex-direction: column; align-items: flex-end; margin: 0; }
.language-pill { display: inline-flex; align-items: center; gap: .3rem; padding: 0 .25rem 0 .55rem;
  border: 1px solid var(--border-default); border-radius: 8px; background: var(--bg-surface); color: var(--fg-muted); }
.language-pill select { width: auto; border: none; background: transparent; padding: .3rem .25rem; font-size: .8rem;
  font-weight: 600; color: var(--fg-default); cursor: pointer; }
.language-pill:has(select:focus-visible) { outline: var(--focus-ring); outline-offset: 1px; }
.language-pill select:focus-visible { outline: none; }
.language-error { margin: .3rem 0 0; font-size: .75rem; color: var(--danger-fg); max-width: 9rem; text-align: right; }

/* knapp, damit „Einstellungen · Abmelden“ wie im Entwurf in eine Zeile passt (E2E-Sichtprüfung) */
.user { display: flex; align-items: center; gap: .5rem; padding: 0; }
.avatar { display: grid; place-items: center; width: 2.1rem; height: 2.1rem; border-radius: 50%; flex: none;
  background: var(--accent-subtle); color: var(--accent-fg); font-size: .8rem; font-weight: 600; }
.user-text { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.user-name { font-weight: 600; font-size: .9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-links { font-size: .78rem; color: var(--fg-muted); }
.user-links a { color: var(--fg-muted); }
.user-links a:hover { color: var(--fg-link); }

.icon-button { display: inline-grid; place-items: center; width: 2.25rem; height: 2.25rem; padding: 0; border: none;
  border-radius: 8px; background: transparent; color: var(--fg-muted); cursor: pointer; flex: none; }
.icon-button:hover, button.icon-button:hover:not(:disabled) { background: var(--bg-subtle); color: var(--fg-default); text-decoration: none; }
.menu-button, .menu-close { display: none; }

.column { display: flex; flex-direction: column; min-width: 0; }
.header { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 1rem; min-height: 4.5rem;
  padding: .75rem 2.5rem; background: var(--bg-canvas); }
.search { display: flex; align-items: center; gap: .5rem; flex: 0 1 32rem; min-width: 0; padding: 0 .6rem 0 .85rem;
  border: 1px solid var(--border-default); border-radius: 10px; background: var(--bg-surface); color: var(--fg-muted); }
.search:focus-within { outline: var(--focus-ring); outline-offset: 1px; }
.search input { flex: 1; border: none; background: transparent; padding: .55rem 0; min-width: 0; }
.search input:focus-visible { outline: none; }
.kbd { flex: none; padding: .05rem .4rem; border: 1px solid var(--border-default); border-radius: 5px;
  background: var(--bg-subtle); color: var(--fg-muted); font: inherit; font-size: .72rem; }
.header-right { margin-left: auto; display: flex; align-items: center; gap: .5rem; min-width: 0; }

/* Statusampel: Symbol + Text, nie nur Farbe */
.status-wrap { position: relative; min-width: 0; }
.status { display: inline-flex; align-items: center; gap: .45rem; max-width: 34rem; padding: .35rem .8rem;
  border: 1px solid transparent; border-radius: 999px; font: inherit; font-size: .82rem; cursor: pointer; }
.status svg { flex: none; }
.status-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.status-pending { cursor: default; color: var(--fg-muted); background: transparent; }
button.status-ok, .status-ok { background: var(--success-subtle); color: var(--success-fg); border-color: transparent; }
button.status-degraded, .status-degraded { background: var(--warning-subtle); color: var(--warning-fg); border-color: transparent; }
button.status-down, .status-down { background: var(--danger-subtle); color: var(--danger-fg); border-color: transparent; }
button.status:hover:not(:disabled) { border-color: currentColor; }
button.status-ok:hover:not(:disabled) { background: var(--success-subtle); }
button.status-degraded:hover:not(:disabled) { background: var(--warning-subtle); }
button.status-down:hover:not(:disabled) { background: var(--danger-subtle); }
.status-panel { position: absolute; right: 0; top: calc(100% + .5rem); z-index: 30; width: min(26rem, 90vw); padding: 1rem;
  border: 1px solid var(--border-default); border-radius: var(--radius); background: var(--bg-surface);
  box-shadow: 0 8px 24px color-mix(in srgb, var(--fg-default) 12%, transparent);
  display: flex; flex-direction: column; gap: .6rem; }
.status-panel[hidden] { display: none; }
.status-head { display: flex; justify-content: space-between; gap: .5rem; margin: 0; }
.status-sub { margin: .25rem 0 0; font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--fg-muted); }
.status-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .4rem; font-size: .875rem; }
.status-list li { display: flex; gap: .45rem; align-items: baseline; }
.status-list li svg { flex: none; position: relative; top: 2px; }
.issue-ok { color: var(--fg-muted); }
.issue-degraded { color: var(--warning-fg); }
.issue-down { color: var(--danger-fg); }

.main { padding: .5rem 2.5rem 3rem; max-width: 1440px; width: 100%; }
.main:focus { outline: none; }
.footer { color: var(--fg-muted); font-size: .8rem; padding: 1rem 2.5rem; margin-top: auto; }
.backdrop[hidden] { display: none; }

/* Seitenkopf und Reiter */
.page-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap; margin: .5rem 0 1.5rem; }
.page-title { font-size: 1.75rem; font-weight: 650; letter-spacing: -.01em; margin: 0; }
.page-subtitle { margin: .35rem 0 0; color: var(--fg-muted); }
.tabs { display: flex; gap: 1.5rem; margin: 0 0 1.5rem; border-bottom: 1px solid var(--border-default); overflow-x: auto; }
.tab { padding: .6rem .1rem; margin-bottom: -1px; border-bottom: 2px solid transparent; color: var(--fg-muted); white-space: nowrap; }
.tab:hover { color: var(--fg-default); text-decoration: none; }
.tab[aria-current='page'] { color: var(--fg-default); font-weight: 600; border-bottom-color: var(--accent-default); }

/* Anmeldeseite */
.login { min-height: 100vh; display: grid; place-items: center; padding: 1rem; }
.login:focus { outline: none; }
.login-card { width: min(26rem, 100%); padding: 2rem; border: 1px solid var(--border-default); border-radius: var(--radius);
  background: var(--bg-surface); box-shadow: var(--shadow); display: flex; flex-direction: column; gap: .5rem; }
.login-card h1 { margin: 1rem 0 0; }
.login-card .switches { border-bottom: none; padding: 1rem 0 0; border-top: 1px solid var(--border-default); }

@media (max-width: 960px) {
  .shell { grid-template-columns: minmax(0, 1fr); }
  .sidebar { position: fixed; inset: 0 auto 0 0; z-index: 50; width: min(18rem, 85vw); transform: translateX(-100%);
    visibility: hidden; transition: transform .2s ease, visibility .2s; }
  .sidebar-open { transform: none; visibility: visible; }
  .backdrop { display: block; position: fixed; inset: 0; z-index: 40; background: var(--bg-overlay); }
  .menu-button, .menu-close { display: inline-grid; }
  .header { padding: .6rem 1rem; gap: .5rem; }
  .main { padding: .5rem 1rem 2.5rem; }
  .footer { padding: 1rem; }
  .kbd { display: none; }
  .status { max-width: 2.4rem; padding: .45rem; justify-content: center; }
  .status-text { display: none; }
}
@media (prefers-reduced-motion: reduce) { .sidebar { transition: none; } }

/* --- Seiteninhalte (unverändert, nur auf Tokens umgestellt) ------------------------------ */
.filters { display: flex; flex-wrap: wrap; gap: .5rem .75rem; align-items: center;
  background: var(--bg-surface); padding: .75rem; border: 1px solid var(--border-default); border-radius: var(--radius); }
/* min-width/flex-wrap: Fieldsets sind sonst mindestens so breit wie ihr Inhalt und laufen aus dem Kasten */
.filters fieldset { border: 0; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .25rem .75rem; min-width: 0; }
.count { color: var(--fg-muted); margin: 1rem 0 .5rem; }
.table-wrap { overflow-x: auto; background: var(--bg-surface); border: 1px solid var(--border-default); border-radius: var(--radius); }
table { width: 100%; border-collapse: collapse; background: var(--bg-surface); }
.table-wrap > table { border: 0; }
th, td { text-align: left; padding: .5rem; border-bottom: 1px solid var(--border-default); vertical-align: top; }
th { background: var(--bg-subtle); font-size: .85rem; color: var(--fg-muted); font-weight: 600; }
tbody tr:last-child td { border-bottom: none; }
td.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
th.num { text-align: right; }
td.thumb img { width: 64px; height: 48px; object-fit: cover; border-radius: 4px; }
.watch { margin: 0; }
.star { background: none; border: 0; color: var(--warning-fg); font-size: 1.4rem; padding: 0 .25rem; line-height: 1; }
button.star:hover:not(:disabled) { background: none; border: 0; color: var(--warning-fg); }
/* .pager: siehe „Seitenwechsel aller Listen“ unten */
.empty { color: var(--fg-muted); padding: 1rem 0; }
.detail-head { display: flex; align-items: center; gap: .5rem; }
.detail { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.gallery { display: grid; grid-template-columns: repeat(2, 1fr); gap: .5rem; align-content: start; }
.gallery img { width: 100%; border-radius: 6px; background: var(--bg-muted); }
.facts dl { display: grid; grid-template-columns: max-content 1fr; gap: .4rem 1rem; margin: 0; }
.facts dt { color: var(--fg-muted); }
.facts dd { margin: 0; }
.big { font-size: 1.3rem; font-weight: 600; }
.description { white-space: pre-line; background: var(--bg-surface); padding: 1rem; border-radius: var(--radius); border: 1px solid var(--border-default); }
.stack { display: grid; gap: .75rem; max-width: 420px; }
.stack label { display: grid; gap: .25rem; }
.ok { color: var(--success-fg); } .error { color: var(--danger-fg); }
.error-box { background: var(--danger-subtle); color: var(--danger-fg); padding: .75rem; border-radius: 6px; }
tr.has-error td { background: var(--danger-subtle); }
form.inline { display: flex; gap: .4rem; align-items: center; margin: 0; }
@media (max-width: 800px) {
  .detail { grid-template-columns: 1fr; }
  table.lots th:nth-child(6), table.lots td:nth-child(6), table.lots th:nth-child(8), table.lots td:nth-child(8),
  table.lots th:nth-child(11), table.lots td:nth-child(11) { display: none; }
}
/* Phase 4: KI, generische Formulare */
.card { background: var(--bg-surface); border: 1px solid var(--border-default); border-radius: var(--radius); padding: 1rem; }
.card h2, .card h3 { font-size: 1.1rem; margin: 0 0 .75rem; }
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.forms { display: grid; gap: 1rem; margin-top: 1.5rem; max-width: 640px; }
.form-card .stack { max-width: none; }
.field { display: grid; gap: .25rem; }
.field > label { font-weight: 500; }
.field label.check { display: flex; gap: .4rem; align-items: center; }
.field.has-error input, .field.has-error select, .field.has-error textarea { border-color: var(--danger-fg); }
.input-row { display: flex; gap: .4rem; align-items: center; }
.input-row input, .input-row select, .input-row textarea { flex: 1; }
.unit { color: var(--fg-muted); white-space: nowrap; }
.form-buttons { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.action-result p { margin: .25rem 0; }
.kv { display: grid; grid-template-columns: fit-content(55%) minmax(0, 1fr); gap: .3rem 1rem; margin: 0; }
.kv dt { color: var(--fg-muted); } .kv dd { margin: 0; overflow-wrap: anywhere; }
progress { width: 100%; height: .8rem; accent-color: var(--accent-default); }
.product { margin-top: 1rem; }
.chips { display: flex; flex-wrap: wrap; gap: .35rem; }
.chip { background: var(--accent-subtle); color: var(--accent-fg); border-radius: 999px; padding: .15rem .6rem; font-size: .85rem; }
.ki { font-size: .9rem; color: var(--accent-fg); }
.filters fieldset.conditions, .filters fieldset.recommendations { align-items: center; }
.filters legend { float: left; color: var(--fg-muted); margin-right: .25rem; }
p.inline { display: flex; gap: .5rem; align-items: center; }
/* Phase 5: Marktpreise */
.market { margin-top: 1rem; }
.market-offers { margin-top: 1.5rem; }
table.offers tr.weak td { opacity: .6; }
table.offers td a { overflow-wrap: anywhere; }
/* docs/27 §6: aussortiert (Grund), „Passt nicht“ – Status bleibt lesbar */
table.offers tr.weak td.offer-status { opacity: 1; }
td.offer-status { text-align: right; }
td.offer-status form { display: inline; margin: 0; }
td.offer-status small { display: block; }
.ex-badge { display: inline-flex; align-items: center; gap: .3rem; padding: .1rem .5rem; border-radius: 999px; background: var(--bg-muted); color: var(--fg-muted); font-size: .78rem; font-weight: 500; white-space: nowrap; }
.ex-badge.ex-user { background: var(--warning-subtle); color: var(--warning-fg); }
.ex-badge.ex-info { background: var(--info-subtle); color: var(--info-fg); }
.offers-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem; }
.offers-summary { font-weight: 600; margin: 0; }
.offers-toggle { display: inline-flex; align-items: center; gap: .45rem; color: var(--fg-muted); text-decoration: none; }
.offers-toggle .switch { width: 2rem; height: 1.1rem; border-radius: 999px; background: var(--border-strong); position: relative; }
.offers-toggle .switch::after { content: ''; position: absolute; top: .15rem; left: .15rem; width: .8rem; height: .8rem; border-radius: 50%; background: var(--bg-surface); transition: left .15s; }
.offers-toggle[aria-pressed="true"] .switch { background: var(--accent-default); }
.offers-toggle[aria-pressed="true"] .switch::after { left: 1.05rem; }
details.feedback-menu { display: inline-block; position: relative; text-align: left; }
details.feedback-menu > summary { list-style: none; margin: 0; color: var(--fg-link); background: var(--bg-surface); border: 1px solid var(--border-strong); border-radius: 6px; padding: .2rem .5rem; font-size: .8rem; display: inline-block; }
details.feedback-menu > summary::-webkit-details-marker { display: none; }
.feedback-panel { position: absolute; right: 0; top: calc(100% + .35rem); z-index: 30; width: min(22rem, 90vw); padding: .85rem; background: var(--bg-surface); border: 1px solid var(--border-default); border-radius: 12px; box-shadow: 0 12px 32px color-mix(in srgb, var(--fg-default) 18%, transparent); white-space: normal; }
.feedback-panel fieldset { border: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.feedback-panel legend { font-weight: 600; float: none; color: var(--fg-default); margin: 0; }
.feedback-reason { display: flex; align-items: center; gap: .5rem; min-height: 2.1rem; padding: 0 .4rem; border-radius: 8px; cursor: pointer; }
.feedback-reason:has(input:checked) { background: var(--bg-subtle); }
.feedback-hints { list-style: none; margin: .5rem 0; padding: .5rem 0 0; border-top: 1px solid var(--border-default); font-size: .78rem; color: var(--fg-muted); display: flex; flex-direction: column; gap: .3rem; }
.feedback-actions { display: flex; justify-content: flex-end; gap: .5rem; }
.offers-toggle-form { margin: 0; }
button.offers-toggle { background: none; border: none; padding: 0; font: inherit; }
button.offers-toggle:hover:not(:disabled) { background: none; }
.step-excluded { display: block; margin-top: .15rem; }
@media (max-width: 640px) {
  details.feedback-menu[open]::before { content: ''; position: fixed; inset: 0; background: var(--bg-overlay); z-index: 29; }
  .feedback-panel { position: fixed; left: 0; right: 0; top: auto; bottom: 0; width: auto; max-height: 85vh; overflow-y: auto; border-radius: 20px 20px 0 0; padding: 1rem 1rem 1.5rem; }
  .feedback-reason { min-height: 2.6rem; }
  .feedback-actions > * { flex: 1; text-align: center; }
}
.vehicle { color: var(--fg-default); }
.source-error { margin: .25rem 0; }
details > summary { cursor: pointer; color: var(--fg-link); margin: .75rem 0; }
td.error, dd.error { font-weight: 600; }
.bar-label { display: flex; justify-content: space-between; margin-top: .5rem; }
/* System: Job-Queue, Systemtest */
.system-intro p { margin: .25rem 0; }
.job-actions { list-style: none; padding: 0; display: grid; gap: .5rem; }
.job-actions li { display: flex; gap: .5rem; align-items: center; }
.job-actions .action-result p { display: inline; }
.job-status { font-weight: 500; }
.status-doing { color: var(--info-fg); }
.status-failed { color: var(--danger-fg); }
.status-succeeded, .status-sent { color: var(--success-fg); }
.status-todo, .status-cancelled, .status-aborted { color: var(--fg-muted); }
#system-jobs section, .system-diagnostics { margin-top: 1.5rem; }
/* Phase 6: Bewertung */
.pos { color: var(--success-fg); } .neg { color: var(--danger-fg); }
.valuation { margin-top: 1rem; border-left: 4px solid var(--accent-default); }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: .75rem; margin-bottom: .75rem; }
.kpi { display: grid; gap: .15rem; }
.kpi-label { color: var(--fg-muted); font-size: .8rem; }
.kpi-value { font-size: 1.4rem; font-weight: 700; white-space: nowrap; }
.kpi-value.rule { font-size: 1.6rem; }
.note { margin: .25rem 0; }
table.steps { border: 0; margin-top: .25rem; }
table.steps td, table.steps th { padding: .3rem .4rem; }
table.steps tr.kind-head th { background: none; padding-top: .6rem; text-transform: uppercase; letter-spacing: .03em; font-size: .75rem; }
table.steps tr.kind-revenue td.num { color: var(--success-fg); }
table.steps tfoot td { font-weight: 600; border-bottom: 0; }
table.steps tfoot tr.total td { border-top: 2px solid var(--fg-default); font-size: 1.05rem; }
.assessment { margin-top: 1rem; padding-top: .75rem; border-top: 1px solid var(--border-default); }
.assessment h3 { font-size: 1rem; margin: 0 0 .5rem; }
.rec-line { display: flex; gap: .75rem; align-items: center; }
.badge { display: inline-block; border-radius: 999px; padding: .15rem .65rem; font-size: .85rem; font-weight: 600; white-space: nowrap;
  background: var(--bg-subtle); color: var(--fg-muted); }
.rec-buy { background: var(--success-subtle); color: var(--success-fg); }
.rec-watch { background: var(--warning-subtle); color: var(--warning-fg); }
.rec-ignore { background: var(--bg-subtle); color: var(--fg-muted); }
.badge.in-person { background: var(--accent-default); color: var(--fg-on-accent); }
.assessment .summary { font-weight: 500; }
.risks-title { margin: .75rem 0 .25rem; color: var(--fg-muted); }
.risks { margin: 0; padding-left: 1.2rem; }
.stale { margin: 0 0 .5rem; }
.form-group-title { margin: 1.2rem 0 .4rem; font-size: 1rem; border-bottom: 1px solid var(--border-default); }
/* Phase 7: Benachrichtigungen, Export, Käufe */
.export-links { margin-left: 1rem; }
.form-description:empty { display: none; }
.notification-log, .forms + section { margin-top: 1.5rem; }
.purchase-tools { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.row-actions { white-space: nowrap; }
.row-actions button { padding: .2rem .5rem; font-size: .85rem; }
table.purchases, table.notifications { font-size: .95rem; }
/* KI-Aufrufe (Transparenz-Ansicht) */
.explain { background: var(--bg-surface); border: 1px solid var(--border-default); border-radius: var(--radius); padding: .5rem 1rem; }
.explain li { margin: .25rem 0; }
table.llm-calls { font-size: .9rem; }
table.llm-calls tfoot td, table.llm-daily tfoot td { font-weight: 600; }
pre.llm-text { white-space: pre-wrap; overflow-wrap: anywhere; background: var(--bg-code); border: 1px solid var(--border-default);
  border-radius: var(--radius); padding: .75rem; font-size: .85rem; max-height: 40rem; overflow: auto; }

/* --- Los-Detail „Entscheidung zuerst“ (E4, wie React components/lot/*) --------------------- */
.lot-page { display: flex; flex-direction: column; gap: 1.25rem; }
.lot-back { margin: 0; }
.lot-header { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; }
.lot-title { min-width: 0; }
.lot-header h1 { margin: 0; font-size: clamp(1.35rem, 3vw, 1.85rem); line-height: 1.2; overflow-wrap: anywhere; }
.lot-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .5rem; margin: .35rem 0 0; color: var(--fg-muted); font-size: .9rem; }
.lot-head-actions { display: flex; align-items: center; gap: .6rem; flex: none; }
/* „Neu abrufen“ (docs/28): Knopf im Kopf (mobil in der Karte „Endet in“), Hinweis unter dem Kopf */
.lot-refresh { display: inline-flex; margin: 0; }
.lot-refresh .lot-refresh-busy { display: none; }
.lot-refresh.htmx-request .lot-refresh-idle { display: none; }
.lot-refresh.htmx-request .lot-refresh-busy { display: inline; }
.lot-refresh.htmx-request .lot-refresh-icon { animation: lot-refresh-spin .8s linear infinite; }
.lot-refresh-icon { display: inline-flex; }
.lot-refresh-wide, .lot-refresh-wide button { width: 100%; }
.lot-refresh-mobile { display: none; margin-top: .5rem; flex-direction: column; gap: .5rem; }
.lot-refresh-region:empty { display: none; }
.lot-refresh-notice { display: flex; align-items: flex-start; gap: .75rem; padding: .75rem 1rem; border-radius: 10px;
  background: var(--bg-subtle); color: var(--fg-default); }
.lot-refresh-notice.tone-success { background: var(--success-subtle); color: var(--success-fg); }
.lot-refresh-notice.tone-warning { background: var(--warning-subtle); color: var(--warning-fg); }
.lot-refresh-notice.tone-danger { background: var(--danger-subtle); color: var(--danger-fg); }
.lot-refresh-body { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.lot-refresh-reason { margin: 0; }
@keyframes lot-refresh-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .lot-refresh.htmx-request .lot-refresh-icon { animation: none; } }
.lot-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, 22rem); gap: 1.25rem; align-items: start; }
.lot-main { min-width: 0; }
.lot-aside { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
.lot-bar { display: none; }
#purchase-form:empty { display: none; }
#purchase-form { margin-top: 0; }
.muted { color: var(--fg-muted); }
.lot-page a.button, .lot-page button { display: inline-flex; align-items: center; gap: .4rem; }
.lot-page a.button svg, .lot-page button svg { flex: none; }
.watch-labeled .star { gap: .35rem; font-size: 1rem; padding: .4rem .5rem; color: var(--fg-default); border-radius: 6px; }
.watch-labeled .star > span[aria-hidden] { color: var(--warning-fg); font-size: 1.15rem; line-height: 1; }
.watch-labeled button.star:hover:not(:disabled) { background: var(--bg-subtle); color: var(--fg-default); }

/* Entscheidungs-Karte: Rand und Überschrift im Ton des Urteils */
.decision { display: flex; flex-direction: column; gap: .85rem; background: var(--bg-surface); border: 2px solid var(--border-strong);
  border-radius: 12px; padding: 1.4rem 1.5rem; }
.decision.tone-good { border-color: var(--success-solid); }
.decision.tone-warn { border-color: var(--warning-solid); }
.decision.tone-bad { border-color: var(--danger-solid); }
.decision.tone-info { border-color: var(--info-solid); }
.decision-headline { margin: 0; font-size: 1.6rem; line-height: 1.25; letter-spacing: -.01em; }
.tone-good .decision-headline { color: var(--success-fg); }
.tone-warn .decision-headline { color: var(--warning-fg); }
.tone-info .decision-headline { color: var(--info-fg); }
.decision-figures { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .6rem; margin: -.35rem 0 0; }
.decision-profit { font-size: 1.15rem; font-variant-numeric: tabular-nums; margin-right: .25rem; }
.decision-chip { display: inline-flex; align-items: center; gap: .3rem; padding: .1rem .55rem; border-radius: 999px; font-size: .8rem;
  background: var(--bg-subtle); color: var(--fg-muted); border: 1px solid var(--border-default); }
.decision-chip.chip-good { background: var(--success-subtle); color: var(--success-fg); border-color: transparent; }
.decision-chip.chip-warn { background: var(--warning-subtle); color: var(--warning-fg); border-color: transparent; }
.decision-chip.chip-bad { background: var(--danger-subtle); color: var(--danger-fg); border-color: transparent; }
.decision-chip .dot { width: .45rem; height: .45rem; border-radius: 50%; background: currentColor; }
.decision-sub { margin: -.5rem 0 0; font-size: .8rem; color: var(--fg-muted); }
.decision-explain p { margin: 0 0 .25rem; color: var(--fg-muted); font-size: .9rem; }
.decision-actions-wrap { display: flex; flex-direction: column; gap: .35rem; }
.decision-actions { display: flex; flex-wrap: wrap; gap: .6rem; }
.decision-actions .button, .decision-actions button { padding: .5rem .9rem; }
a.button.decision-primary { font-weight: 600; }
.decision-hint { margin: 0; font-size: .78rem; color: var(--fg-muted); }
.decision-facts { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.decision-facts li { display: inline-flex; align-items: center; gap: .35rem; padding: .15rem .55rem; border-radius: 6px;
  background: var(--bg-subtle); border: 1px solid var(--border-default); font-size: .8rem; color: var(--fg-muted); }
.decision-facts li { max-width: 100%; }
.decision-facts li span { min-width: 0; overflow-wrap: anywhere; }
.decision-facts li.detected { background: var(--warning-subtle); color: var(--warning-fg); border-color: transparent; }
.decision-stale { background: var(--danger-subtle); color: var(--danger-fg); border-radius: 8px; padding: .75rem 1rem; }
.decision-stale p { margin: 0 0 .25rem; font-size: .9rem; }
.decision-damage { background: var(--warning-subtle); color: var(--warning-fg); border-radius: 8px; padding: .75rem 1rem; }
.decision-damage p { margin: 0 0 .25rem; font-size: .9rem; }
.decision-stale-title { display: flex; align-items: center; gap: .4rem; font-weight: 700; font-size: 1rem !important; }
.decision-stale-last { display: flex; align-items: center; gap: .35rem; opacity: .9; }

/* Regler „Was wäre, wenn …“ */
.bid-slider { display: flex; flex-direction: column; gap: .6rem; padding-top: .35rem; }
.bid-slider-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.bid-slider-title { font-size: 1rem; margin: 0; }
.bid-amount { display: inline-flex; align-items: center; gap: .35rem; border: 2px solid var(--accent-default); border-radius: 8px;
  padding: .15rem .6rem; background: var(--bg-surface); color: var(--fg-muted); }
.bid-amount input { border: none; padding: .2rem 0; width: 6.5rem; text-align: right; font-variant-numeric: tabular-nums; background: transparent; }
.bid-amount input:focus-visible { outline: none; }
.bid-amount:focus-within { outline: var(--focus-ring); outline-offset: 2px; }
.bid-track-wrap { position: relative; padding-top: .6rem; height: 3.2rem; }
.bid-track { position: absolute; left: 0; right: 0; top: 1.2rem; height: 6px; border-radius: 3px; background: var(--bg-muted); }
.bid-track .seg { position: absolute; top: 0; height: 100%; }
.bid-track .seg:first-child { border-radius: 3px 0 0 3px; }
.seg-below-min { background: var(--border-strong); }
.seg-rule-met { background: var(--success-solid); }
.seg-below-rule { background: var(--warning-solid); }
.seg-neutral { background: var(--fg-subtle); }
.seg-band { background: var(--info-solid); }
.bid-track .band { position: absolute; top: -.6rem; height: 3px; border-radius: 2px; background: var(--info-solid); }
.bid-track .mark { position: absolute; top: -4px; width: 2px; height: 14px; margin-left: -1px; background: var(--fg-default); }
.bid-range { position: absolute; left: 0; right: 0; top: .75rem; width: 100%; height: 1rem; margin: 0; padding: 0; border: none;
  background: transparent; appearance: none; -webkit-appearance: none; cursor: pointer; }
.bid-range::-webkit-slider-runnable-track { height: 1rem; background: transparent; }
.bid-range::-moz-range-track { height: 1rem; background: transparent; }
.bid-range::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 1.2rem; height: 1.2rem; margin-top: -.1rem;
  border-radius: 50%; border: 3px solid var(--accent-default); background: var(--bg-surface); }
.bid-range::-moz-range-thumb { width: 1rem; height: 1rem; border-radius: 50%; border: 3px solid var(--accent-default); background: var(--bg-surface); }
.bid-range:focus-visible { outline: none; }
.bid-range:focus-visible::-webkit-slider-thumb { outline: var(--focus-ring); outline-offset: 2px; }
.bid-range:focus-visible::-moz-range-thumb { outline: var(--focus-ring); outline-offset: 2px; }
.bid-ticks { position: absolute; left: 0; right: 0; top: 2.05rem; font-size: .75rem; color: var(--fg-muted); }
.bid-ticks span { position: absolute; white-space: nowrap; }
.bid-ticks .limit-tick { color: var(--success-fg); }
.bid-legend { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .35rem 1rem; font-size: .8rem; color: var(--fg-muted); }
.bid-legend li { display: inline-flex; align-items: center; gap: .35rem; }
.bid-legend .swatch { display: inline-block; width: .65rem; height: .65rem; border-radius: 2px; }
.whatif:empty { display: none; }
.whatif-text { display: flex; align-items: flex-start; gap: .5rem; margin: 0; padding: .6rem .85rem; border-radius: 8px; font-size: .9rem; }
.whatif-text svg { flex: none; margin-top: .15rem; }
.whatif-text.tone-good { background: var(--success-subtle); color: var(--success-fg); }
.whatif-text.tone-warn { background: var(--warning-subtle); color: var(--warning-fg); }
.whatif-text.tone-bad { background: var(--danger-subtle); color: var(--danger-fg); }
.whatif-text.tone-neutral { background: var(--bg-subtle); color: var(--fg-muted); }

/* „Warum diese Zahlen?“ */
.why { border-top: 1px solid var(--border-default); padding-top: .75rem; }
.why > summary { display: inline-flex; align-items: center; gap: .45rem; font-weight: 600; cursor: pointer; list-style: none;
  color: var(--fg-default); margin: 0; }
.why > summary::-webkit-details-marker { display: none; }
.why > summary svg { transform: rotate(-90deg); transition: transform .15s; }
.why[open] > summary svg { transform: none; }
.why-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.25rem; margin-top: .75rem; }
.why-list { margin: 0; }
.why-list > div { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: .75rem; padding: .45rem 0;
  border-bottom: 1px solid var(--border-default); font-size: .85rem; }
.why-list dt { color: var(--fg-muted); }
.why-list dd { margin: 0; text-align: right; overflow-wrap: anywhere; }
.why-notes { list-style: none; margin: 0 0 .5rem; padding: 0; display: flex; flex-direction: column; gap: .5rem; font-size: .85rem; }
.why-notes li { display: flex; gap: .5rem; }
.why-notes svg { flex: none; color: var(--warning-fg); margin-top: .1rem; }

/* Rechte Spalte */
.lot-gallery { display: flex; flex-direction: column; gap: .5rem; }
.lot-gallery-main { aspect-ratio: 4 / 3; background: var(--bg-subtle); border-radius: var(--radius); overflow: hidden; }
.lot-gallery-main img { width: 100%; height: 100%; object-fit: contain; display: block; }
.img-placeholder { display: grid; place-items: center; width: 100%; height: 100%; color: var(--fg-subtle); }
.lot-thumbs { list-style: none; margin: 0; padding: 0; display: flex; gap: .4rem; overflow-x: auto; }
.lot-thumbs .thumb { width: 4.5rem; height: 3.5rem; padding: 0; border: 2px solid transparent; border-radius: 6px; overflow: hidden;
  background: var(--bg-subtle); }
.lot-thumbs .thumb[aria-current='true'] { border-color: var(--accent-default); }
button.thumb:hover:not(:disabled) { background: var(--bg-subtle); border-color: var(--border-strong); }
.lot-thumbs img { width: 100%; height: 100%; object-fit: cover; }
.lot-box { display: flex; flex-direction: column; gap: .5rem; background: var(--bg-surface); border: 1px solid var(--border-default);
  border-radius: 12px; padding: 1.1rem 1.25rem; }
.lot-box-label { margin: 0; font-size: .8rem; color: var(--fg-muted); }
.countdown { margin: 0; font-size: 2rem; font-weight: 700; line-height: 1.15; font-variant-numeric: tabular-nums; }
.countdown.urgent { color: var(--warning-fg); }
.lot-date { margin: 0; font-size: 1.2rem; font-weight: 700; }
.lot-fresh { display: flex; gap: .4rem; margin: 0; font-size: .75rem; color: var(--fg-muted); }
.lot-fresh svg { flex: none; margin-top: .1rem; }
.lot-line { margin: 0; font-size: .85rem; }
.lot-box-title { margin: 0; font-size: 1rem; }
.lot-box-text { margin: 0; font-size: .82rem; color: var(--fg-muted); }
.lot-full { width: 100%; justify-content: center; }
.lot-later { margin: 0; font-size: .75rem; color: var(--fg-muted); }

/* Reiter */
.lot-tabs { background: var(--bg-surface); border: 1px solid var(--border-default); border-radius: 12px; padding: .75rem 1.25rem 1.25rem; }
.lot-tablist { display: flex; gap: .25rem 1.25rem; overflow-x: auto; border-bottom: 1px solid var(--border-default); margin-bottom: 1rem; }
.lot-tab { display: inline-flex; align-items: center; gap: .4rem; padding: .65rem .1rem; border-bottom: 2px solid transparent;
  color: var(--fg-muted); white-space: nowrap; }
.lot-tab:hover { color: var(--fg-default); text-decoration: none; }
.lot-tab[aria-selected='true'] { color: var(--fg-default); font-weight: 600; border-bottom-color: var(--accent-default); }
.lot-tab-count { font-size: .72rem; padding: 0 .4rem; border-radius: 999px; background: var(--bg-muted); color: var(--fg-muted); font-weight: 600; }
.lot-panel { min-height: 6rem; }
.lot-panel:focus-visible { outline-offset: 4px; }
.lot-panel-stack { display: flex; flex-direction: column; gap: 1.5rem; }
.lot-panel-stack .card, .lot-panel-stack .market-offers { margin-top: 0; }
.lot-panel .card h2, .lot-panel h2 { font-size: 1rem; margin: 0 0 .75rem; }
.lot-panel .assessment { margin-top: 0; padding-top: 0; border-top: 0; }
.lot-steps .step-result th, .lot-steps .step-result td { font-weight: 700; background: transparent; color: var(--fg-default);
  border-top: 1px solid var(--border-strong); }
.lot-steps .step-result th { font-size: inherit; text-align: left; }
.lot-steps tbody tr:last-child th { border-bottom: none; }
.lot-steps .step-result td.muted { color: var(--fg-muted); }
.lot-steps .step-result td.pos { color: var(--success-fg); }
.lot-steps .step-result td.neg { color: var(--danger-fg); }
.lot-steps-footer { display: flex; flex-wrap: wrap; gap: .5rem 1rem; justify-content: space-between; margin: .6rem 0 0; }
.lot-description { white-space: pre-line; overflow-wrap: anywhere; margin-top: 0; }
.lot-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.info-list { margin: 0; display: flex; flex-direction: column; }
.info-list > div { display: grid; grid-template-columns: minmax(8rem, 40%) 1fr; gap: .75rem; padding: .4rem 0; border-bottom: 1px solid var(--border-default); }
.info-list dt { color: var(--fg-muted); }
.info-list dd { margin: 0; overflow-wrap: anywhere; }

/* Immobilie */
.re-tag { align-self: flex-start; display: inline-flex; align-items: center; gap: .35rem; margin: 0; padding: .15rem .6rem; border-radius: 999px;
  background: var(--bg-subtle); color: var(--fg-muted); font-size: .8rem; }
.real-estate .decision-headline { font-size: 1.5rem; }
.re-text { margin: -.4rem 0 0; color: var(--fg-muted); font-size: .9rem; }
.re-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.re-tile { display: flex; flex-direction: column; gap: .15rem; padding: .75rem .9rem; border-radius: 8px; background: var(--bg-subtle);
  border: 1px solid var(--border-default); min-width: 0; }
.re-tile.wide { grid-column: 1 / -1; }
.re-label { font-size: .8rem; color: var(--fg-muted); }
.re-value { font-size: 1.3rem; font-variant-numeric: tabular-nums; }
.re-value-small { font-size: 1.05rem; }
.re-hint { font-size: .8rem; color: var(--fg-muted); }
.re-tile-text { margin: 0; }
.re-note { font-size: .78rem; color: var(--fg-muted); font-style: italic; }
.re-attribution { display: flex; flex-wrap: wrap; gap: .2rem .75rem; margin: .35rem 0 0; font-size: .75rem; color: var(--fg-muted); }
.re-attribution a { text-decoration: underline; }
.re-mini { margin-top: .4rem; font-size: .8rem; background: transparent; }
.re-mini th, .re-mini td { padding: .2rem .4rem; background: transparent; }
.re-more > summary { font-size: .85rem; margin: 0; }
.re-subhead { font-size: .95rem; margin: 0 0 .5rem; }
.re-checklist { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .35rem 1.25rem; font-size: .85rem; }
.re-checklist li { display: flex; gap: .45rem; }
.re-checklist svg { flex: none; color: var(--fg-muted); margin-top: .1rem; }
.re-hint-line { margin: .4rem 0 0; font-size: .75rem; color: var(--fg-muted); }
.re-disclaimer { margin: 0; font-size: .78rem; color: var(--fg-muted); }

@media (prefers-reduced-motion: reduce) { .why > summary svg { transition: none; } }
@media (max-width: 1100px) {
  .lot-layout { grid-template-columns: minmax(0, 1fr); }
  .lot-aside { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); align-items: start; }
}
@media (max-width: 720px) {
  .lot-page { padding-bottom: 5rem; }
  .lot-header { flex-direction: column; align-items: stretch; }
  /* Merken/Original stehen unten in der Leiste */
  .lot-head-actions { display: none; }
  .lot-refresh-mobile { display: flex; }
  /* Hinweis mobil direkt unter dem Knopf (Entwurf 19c) */
  .lot-refresh-region-head { display: none; }
  .lot-aside { display: flex; }
  .decision { padding: 1rem; }
  .decision-headline { font-size: 1.3rem; }
  .why-body, .lot-columns, .re-tiles, .re-checklist { grid-template-columns: 1fr; }
  .lot-tabs { padding: .5rem .9rem 1rem; }
  .lot-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; display: flex; align-items: center; gap: .6rem;
    padding: .75rem 1rem calc(.75rem + env(safe-area-inset-bottom)); background: var(--bg-surface);
    border-top: 1px solid var(--border-default); box-shadow: 0 -2px 8px color-mix(in srgb, var(--fg-default) 8%, transparent); }
  a.button.lot-bar-main { flex: 1; justify-content: center; font-weight: 600; }
}

/* --- Heute (E6) und Deals (E5): Werte wie die React-CSS-Module, nur Tokens ------------------- */
.live { margin: 0 0 .75rem; font-size: .9rem; color: var(--fg-muted); }
.live:empty { display: none; }
.page-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; flex: none; }
.page-head:has(.page-actions) > div:first-child { flex: 1 1 24rem; min-width: 0; }
.page-actions button.secondary { color: var(--fg-default); }
.page-actions button, .page-actions a.button { display: inline-flex; align-items: center; gap: .4rem; }
button.link-button, .link-button { background: none; border: none; padding: 0; color: var(--fg-link); font: inherit; cursor: pointer; text-align: left; }
button.link-button:hover:not(:disabled) { background: none; border: none; text-decoration: underline; }
.t-good { color: var(--success-fg); } .t-warn { color: var(--warning-fg); } .t-bad { color: var(--danger-fg); }
.t-info { color: var(--info-fg); } .t-neutral { color: var(--fg-muted); } .t-accent { color: var(--accent-fg); }
.badge.chip-good { background: var(--success-subtle); color: var(--success-fg); }
.badge.chip-warn { background: var(--warning-subtle); color: var(--warning-fg); }
.badge.chip-bad { background: var(--danger-subtle); color: var(--danger-fg); }
.badge.chip-neutral { background: var(--bg-muted); color: var(--fg-muted); }
.badge { font-size: .75rem; }
a.button.small { padding: .2rem .5rem; font-size: .8rem; }
button.small, a.button.small { display: inline-flex; align-items: center; gap: .3rem; }

/* Kennzahl-Kacheln (React StatTile) */
.stat-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.stat-tile { display: flex; flex-direction: column; gap: .35rem; padding: 1rem 1.15rem; min-width: 0;
  background: var(--bg-surface); border: 1px solid var(--border-default); border-radius: 12px; }
.stat-label { display: flex; align-items: center; gap: .45rem; margin: 0; font-size: .875rem; color: var(--fg-muted); }
.stat-label-text { flex: 1; }
.stat-icon { display: inline-flex; color: var(--fg-muted); }
.stat-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.dot-good { background: var(--success-solid); } .dot-warn { background: var(--warning-solid); }
.dot-bad { background: var(--danger-solid); } .dot-info { background: var(--info-solid); }
.stat-value { margin: 0; font-size: 1.6rem; font-weight: 650; letter-spacing: -.01em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.stat-sub { margin: 0; font-size: .8rem; color: var(--fg-muted); }
.stat-sub.t-good { color: var(--success-fg); } .stat-sub.t-bad { color: var(--danger-fg); } .stat-sub.t-warn { color: var(--warning-fg); }
.td-budget-slot { align-self: flex-start; }
.td-budget-form { display: flex; flex-wrap: wrap; gap: 6px; }
.td-budget-form input { flex: 1 1 7rem; min-width: 0; }
.td-budget-form p { flex-basis: 100%; margin: 0; }

/* Heute: Aufbau */
.td-error { margin: 0 0 .75rem; }
.td-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 20px; align-items: start; }
.td-main, .td-side { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.td-card { display: flex; flex-direction: column; gap: 12px; padding: 20px; background: var(--bg-surface);
  border: 1px solid var(--border-default); border-radius: 12px; }
.td-start { display: inline-flex; align-items: center; gap: .4rem; }
.td-new-head, .td-side-head { display: flex; align-items: flex-start; gap: 12px; }
.td-head-icon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px;
  border-radius: 8px; background: var(--bg-subtle); color: var(--fg-muted); }
.td-new-title { flex: 1; min-width: 0; }
.td-new-head h2, .td-side-head h2 { margin: 0; font-size: 1rem; font-weight: 600; }
.td-new-title p, .td-side-head p { margin: .15rem 0 0; font-size: .85rem; color: var(--fg-muted); }
.td-tabs { display: inline-flex; flex: none; padding: 3px; gap: 2px; background: var(--bg-subtle);
  border: 1px solid var(--border-default); border-radius: 9px; }
.td-tabs a { display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .7rem; border-radius: 7px;
  color: var(--fg-muted); font-size: .875rem; white-space: nowrap; }
.td-tabs a:hover { text-decoration: none; color: var(--fg-default); }
.td-tabs a[aria-current='true'] { background: var(--bg-surface); color: var(--fg-default); font-weight: 600; box-shadow: var(--shadow); }
.td-tab-count { padding: 0 .4rem; border-radius: 999px; background: var(--bg-muted); font-size: .75rem; font-weight: 600; }
.td-tabs a[aria-current='true'] .td-tab-count { background: var(--accent-subtle); color: var(--accent-fg); }
@media (max-width: 1440px) { .td-new-head { flex-wrap: wrap; } }
.td-tab-empty { margin: 0; padding: 1.5rem 0; text-align: center; color: var(--fg-muted); }

/* Heute: Zeilen */
.td-rows { list-style: none; margin: 0; padding: 0; container-type: inline-size; }
.td-rows > li + li { border-top: 1px solid var(--border-default); }
.td-row { display: grid; grid-template-columns: 78px 64px minmax(0, 1fr) 156px auto;
  grid-template-areas: 'ev thumb text figures actions'; align-items: center; gap: 10px;
  padding: 10px 10px 10px 8px; border: 1.5px solid transparent; border-radius: 10px; }
.td-row:focus { outline: none; }
.td-row:focus-visible { outline: 2px solid var(--border-focus); outline-offset: 2px; }
.td-row.is-selected { background: var(--bg-subtle); border-color: var(--border-focus); }
.td-ev { grid-area: ev; justify-self: start; display: inline-flex; align-items: center; padding: .2rem .45rem;
  border: 1px solid var(--border-default); border-radius: 8px; background: var(--bg-surface); color: var(--fg-muted);
  font-size: .72rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.td-thumb { grid-area: thumb; width: 64px; height: 52px; border-radius: 8px; object-fit: cover; background: var(--bg-muted); }
.td-thumb-empty { display: inline-flex; align-items: center; justify-content: center; color: var(--fg-muted); }
.td-row-text { grid-area: text; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.td-badges { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0; font-size: .72rem; min-width: 0; }
.td-badge-new, .td-badge-source { padding: .05rem .45rem; border-radius: 999px; font-weight: 500; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.td-badge-new { background: var(--accent-subtle); color: var(--accent-fg); }
.td-badge-source { background: var(--bg-muted); color: var(--fg-muted); }
.td-category { flex: 1 1 6rem; min-width: 0; color: var(--fg-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.td-row-title { margin: 0; font-size: .92rem; font-weight: 600; line-height: 1.3; overflow-wrap: break-word;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.td-facts { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: 0; font-size: .78rem; color: var(--fg-muted); }
.td-facts > span { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.td-facts > span.t-warn { color: var(--warning-fg); }
.td-confidence { padding: .05rem .5rem; border-radius: 999px; background: var(--bg-muted); }
.td-figures { grid-area: figures; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; text-align: right; min-width: 0; }
.td-headline { margin: 0; font-size: .92rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.td-limit { margin: 0; font-size: .75rem; line-height: 1.35; font-variant-numeric: tabular-nums; }
.td-row-actions { grid-area: actions; display: flex; gap: 6px; }
.td-row-actions button, .td-row-actions a.button { display: inline-flex; align-items: center; gap: .3rem; padding: .4rem .65rem; font-size: .875rem; }
.td-row-actions .td-icon-btn { padding: .4rem; color: var(--fg-default); }
@container (max-width: 640px) {
  .td-row { grid-template-columns: 78px 64px minmax(0, 1fr) 140px; grid-template-areas: 'ev thumb text figures' '. . actions actions'; }
  .td-row-actions { justify-content: flex-end; }
}

/* Heute: Verwerfen-Leiste, Kürzel */
.td-undo-bar { display: flex; flex-direction: column; gap: 8px; padding: 10px 14px 12px; background: var(--bg-subtle);
  border: 1px solid var(--border-default); border-radius: 10px; }
.td-undo-head { display: flex; align-items: center; gap: 10px; color: var(--fg-muted); }
.td-undo-head p { flex: 1; margin: 0; font-size: .875rem; font-weight: 500; color: var(--fg-default); }
.td-reasons { display: flex; flex-wrap: wrap; gap: 6px; }
button.td-chip { padding: .25rem .7rem; border: 1px solid var(--border-strong); border-radius: 999px; background: var(--bg-surface);
  color: var(--fg-default); font-size: .85rem; }
button.td-chip:hover:not(:disabled) { background: var(--bg-subtle); border-color: var(--border-strong); }
button.td-chip[aria-pressed='true'] { background: var(--accent-subtle); border-color: var(--accent-default); color: var(--accent-fg); font-weight: 600; }
.td-hint { margin: 0; font-size: .8rem; color: var(--fg-muted); }
.td-keys { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding-top: 8px; font-size: .8rem; color: var(--fg-muted); }
.td-key-list { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 0; padding: 0; list-style: none; }
.td-key-list[hidden] { display: none; }
.td-keys kbd, .td-key-table kbd { display: inline-block; min-width: 1.4rem; padding: 0 .35rem; border: 1px solid var(--border-default);
  border-radius: 4px; background: var(--bg-subtle); font: inherit; font-size: .75rem; text-align: center; color: var(--fg-default); }
button.td-key-button { border: none; background: none; padding: 0; color: var(--fg-muted); font-size: .8rem; }
button.td-key-button:hover:not(:disabled) { background: none; border: none; color: var(--fg-default); }
.td-more { margin-left: auto; font-weight: 500; }

/* Heute: Kürzelhilfe (Dialog) */
.td-dialog { width: min(460px, calc(100% - 32px)); max-height: calc(100vh - 32px); padding: 20px 22px; color: var(--fg-default);
  background: var(--bg-surface); border: 1px solid var(--border-default); border-radius: 12px;
  box-shadow: 0 16px 40px color-mix(in srgb, var(--fg-default) 25%, transparent); }
.td-dialog::backdrop { background: var(--bg-overlay); }
.td-dialog h2 { margin: 0 0 .25rem; font-size: 1.1rem; }
.td-key-table { width: 100%; margin: .75rem 0; }
.td-key-table th { width: 4rem; background: none; text-align: left; }
.td-toggle { display: flex; align-items: center; gap: .5rem; font-weight: 600; }
.td-dialog-buttons { display: flex; justify-content: flex-end; }

/* Heute: rechte Spalte */
.td-result { display: flex; flex-direction: column; gap: 10px; padding: 16px; background: var(--info-subtle); color: var(--info-fg); border-radius: 12px; }
.td-result-title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: .95rem; font-weight: 600; }
.td-result-item p { margin: 0 0 8px; font-size: .875rem; line-height: 1.45; }
.td-act-item { display: flex; flex-direction: column; gap: 6px; padding: 12px; background: var(--bg-subtle); border-radius: 10px; }
.td-act-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.td-act-row h3 { margin: 0; font-size: .875rem; font-weight: 600; }
.td-act-row h3 a { color: inherit; }
.td-act-item p { margin: 0; }
.td-remaining { font-size: .85rem; font-weight: 600; color: var(--warning-fg); white-space: nowrap; font-variant-numeric: tabular-nums; }
.td-act-buttons { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.td-act-buttons form { flex-basis: 100%; }
.td-dates { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.td-date-item { display: flex; gap: 12px; align-items: flex-start; }
.td-date-item p { margin: .1rem 0 0; }
.td-date-tile { flex: none; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; width: 44px; height: 44px;
  border-radius: 8px; background: var(--info-subtle); color: var(--info-fg); font-size: .65rem; font-weight: 600; line-height: 1.1; }
.td-date-tile strong { font-size: 1rem; }
.td-date-title { font-size: .875rem; font-weight: 600; color: var(--fg-default); }
.td-ics { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; }

/* Heute: Zustände (Entwurf 06-zustaende) */
.td-state { align-items: center; text-align: center; padding: 32px 24px; }
.td-state h2 { margin: 0; font-size: 1.15rem; }
.td-state p { margin: 0; }
.td-state-icon { display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 50%; }
.td-state-good { background: var(--success-subtle); color: var(--success-fg); }
.td-state-accent { background: var(--accent-subtle); color: var(--accent-fg); }
.td-state-buttons { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.td-state-buttons a.button { display: inline-flex; align-items: center; gap: .4rem; }
.td-progress { width: min(480px, 100%); height: 8px; }

/* Heute: mobile Triage-Karte (Entwurf 13-mobil), nur ≤ 720 px */
.td-mobile { display: none; flex-direction: column; gap: 12px; }
.td-mobile-head { display: flex; justify-content: space-between; font-size: .875rem; color: var(--fg-muted); }
.td-mobile-card { display: flex; flex-direction: column; gap: 10px; padding: 14px; background: var(--bg-surface);
  border: 1px solid var(--border-default); border-radius: 16px; box-shadow: 0 4px 16px color-mix(in srgb, var(--fg-default) 8%, transparent);
  touch-action: pan-y; user-select: none; transition: transform .15s ease-out; }
.td-mobile-image { width: 100%; height: 180px; border-radius: 10px; object-fit: cover; background: var(--bg-muted); }
.td-mobile-title { margin: 0; font-size: 1.15rem; line-height: 1.3; }
.td-mobile-title a { color: inherit; }
.td-mobile-figures { display: flex; justify-content: space-between; gap: 12px; padding: 12px; border-radius: 10px;
  background: var(--success-subtle); color: var(--success-fg); }
.td-mobile-figures.is-warn { background: var(--warning-subtle); color: var(--warning-fg); }
.td-mobile-figures div { display: flex; flex-direction: column; gap: 2px; font-size: .8rem; }
.td-mobile-figures strong { font-size: 1.5rem; font-variant-numeric: tabular-nums; }
.td-mobile-profit { align-items: flex-end; text-align: right; }
.td-mobile-chance { align-self: flex-start; margin: 0; }
.td-mobile-buttons { display: flex; justify-content: center; gap: 24px; }
button.td-round { display: flex; flex-direction: column; align-items: center; gap: 6px; border: none; background: none;
  color: var(--fg-default); font-size: .8rem; padding: 0; }
button.td-round:hover:not(:disabled) { background: none; border: none; }
.td-round svg { box-sizing: content-box; padding: 14px; border: 2px solid currentColor; border-radius: 50%; background: var(--bg-surface); }
.td-round-bad svg { color: var(--danger-fg); } .td-round-accent svg { color: var(--accent-fg); } .td-round-warn svg { color: var(--warning-fg); }
.td-swipe-hint { margin: 0; text-align: center; font-size: .75rem; color: var(--fg-muted); }
@media (prefers-reduced-motion: reduce) { .td-mobile-card { transition: none; } }
@media (max-width: 1100px) {
  .td-layout { grid-template-columns: minmax(0, 1fr); }
  .stat-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .td-kpis, .page-actions .td-start { display: none; }
  .td-new { padding: 0; border: none; background: none; }
  .td-new-head, .td-rows, .td-keys, .td-tab-empty { display: none; }
  .td-mobile { display: flex; }
}
@media (max-width: 520px) {
  .stat-row { gap: .6rem; }
  .stat-tile { padding: .75rem .85rem; }
  .stat-value { font-size: 1.2rem; }
}

/* Deals: Kopf, Board */
.dl-view { display: inline-flex; padding: 3px; gap: 2px; background: var(--bg-subtle); border: 1px solid var(--border-default); border-radius: 9px; }
.dl-view a { padding: .3rem .85rem; border-radius: 7px; color: var(--fg-muted); font-size: .9rem; }
.dl-view a:hover { text-decoration: none; color: var(--fg-default); }
.dl-view a[aria-current='page'] { background: var(--bg-surface); color: var(--fg-default); font-weight: 600; box-shadow: var(--shadow); }
.dl-editor { margin: 0 0 1.25rem; }
.dl-editor:empty { display: none; }
.dl-board { display: flex; gap: 14px; align-items: flex-start; overflow-x: auto; padding-bottom: .75rem; }
.dl-column { flex: 0 0 224px; display: flex; flex-direction: column; gap: 10px; padding: 10px; min-height: 120px;
  background: var(--bg-subtle); border: 1px solid var(--border-default); border-radius: 12px; }
.dl-column-lost { flex-basis: 196px; }
.dl-column.is-droppable { border-style: dashed; border-color: var(--border-focus); }
.dl-column.is-over { background: var(--accent-subtle); }
.dl-column-head { padding: 2px 4px 0; }
.dl-column-title { display: flex; align-items: center; gap: 6px; margin: 0; font-size: .875rem; font-weight: 600; }
.dl-count { margin-left: auto; min-width: 1.4rem; padding: 0 .4rem; border-radius: 999px; background: var(--bg-muted);
  color: var(--fg-muted); font-size: .75rem; font-weight: 600; text-align: center; }
.dl-column-sum { margin: .2rem 0 0; padding: 0 4px; font-size: .8rem; color: var(--fg-muted); }
.dl-column-empty { margin: 0; padding: .75rem 4px; font-size: .8rem; color: var(--fg-muted); text-align: center; }
.dl-insight { display: flex; flex-direction: column; gap: .35rem; padding: 10px; background: var(--bg-surface);
  border: 1px solid var(--border-default); border-radius: 10px; color: var(--accent-fg); font-size: .8rem; line-height: 1.4; }
.dl-insight p { margin: 0; color: var(--fg-default); }
.dl-lost > summary { margin: 0; display: inline-flex; align-items: center; gap: .3rem; font-size: .85rem; padding: .2rem .5rem;
  border: 1px solid var(--border-strong); border-radius: 6px; background: var(--bg-surface); color: var(--fg-default); list-style: none; }
.dl-lost > summary::-webkit-details-marker { display: none; }
.dl-lost [data-open], .dl-lost[open] [data-closed] { display: none; }
.dl-lost[open] [data-open] { display: inline; }
.dl-lost-cards { display: flex; flex-direction: column; gap: 10px; margin-top: 10px; }

/* Deals: Karte */
.dl-card { display: flex; flex-direction: column; gap: 8px; padding: 12px; background: var(--bg-surface);
  border: 1px solid var(--border-default); border-radius: 10px; box-shadow: var(--shadow); cursor: grab; }
.dl-card:active { cursor: grabbing; }
.dl-card.is-warn { border-color: var(--danger-solid); }
.dl-card-head { display: flex; gap: 10px; align-items: flex-start; }
.dl-thumb { flex: none; width: 40px; height: 40px; border-radius: 6px; object-fit: cover; background: var(--bg-muted); }
.dl-thumb-empty { display: inline-flex; align-items: center; justify-content: center; color: var(--fg-muted); }
.dl-card-title-block { min-width: 0; }
.dl-card-title { margin: 0; font-size: .875rem; font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
.dl-card-title a { color: inherit; }
.dl-card-meta { margin: .1rem 0 0; font-size: .78rem; color: var(--fg-muted); }
.dl-amount { margin: 0; font-size: .85rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.dl-amount-sub { margin: -4px 0 0; font-size: .78rem; font-variant-numeric: tabular-nums; }
.dl-step { display: flex; align-items: flex-start; gap: 6px; padding: 6px 8px; border-radius: 7px; font-size: .8rem; font-weight: 500; line-height: 1.35; }
.dl-step svg { flex: none; margin-top: 1px; }
.dl-step-neutral { background: var(--bg-subtle); color: var(--fg-muted); }
.dl-step-info { background: var(--info-subtle); color: var(--info-fg); }
.dl-step-warn { background: var(--warning-subtle); color: var(--warning-fg); }
.dl-step-bad { background: var(--danger-subtle); color: var(--danger-fg); }
.dl-step-good { background: var(--success-subtle); color: var(--success-fg); }
.dl-step-accent { background: var(--accent-subtle); color: var(--accent-fg); }
.dl-flags { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; }
.dl-slot:empty { display: none; }
.dl-action-row { display: flex; flex-wrap: wrap; gap: 6px; }
.dl-card-foot { display: flex; align-items: center; gap: 6px; padding-top: 6px; border-top: 1px solid var(--border-default); }
.dl-card-foot button { display: inline-flex; align-items: center; gap: .25rem; }
.dl-grip { margin-left: auto; display: inline-flex; color: var(--fg-muted); }

/* Deals: Menü „Status“ */
.dl-menu-root { position: relative; }
.dl-menu-button { white-space: nowrap; }
.dl-menu { z-index: 40; min-width: 190px; margin: 0; padding: 4px; list-style: none; background: var(--bg-surface);
  border: 1px solid var(--border-strong); border-radius: 10px; box-shadow: 0 8px 24px color-mix(in srgb, var(--fg-default) 16%, transparent); }
.dl-menu[hidden] { display: none; }
button.dl-menu-item { display: flex; align-items: center; gap: .4rem; width: 100%; padding: .4rem .6rem; border: none; border-radius: 6px;
  background: none; color: var(--fg-default); font-size: .875rem; text-align: left; }
button.dl-menu-item:hover:not(:disabled), button.dl-menu-item:focus-visible { background: var(--bg-subtle); border: none; }
button.dl-menu-item.dl-danger { color: var(--danger-fg); }
.dl-menu-sep { height: 1px; margin: 4px 0; background: var(--border-default); }

/* Deals: Formulare in der Karte */
.dl-inline-form { display: flex; flex-direction: column; gap: 4px; padding: 8px; background: var(--bg-subtle); border-radius: 8px; }
.dl-inline-form input { width: 100%; min-width: 0; }
.dl-inline-form p { margin: 0; }
.dl-form-label { font-size: .8rem; font-weight: 600; }
.dl-form-hint { margin: 0 0 4px; font-size: .75rem; color: var(--fg-muted); }
.dl-form-buttons { display: flex; gap: 6px; margin-top: 4px; }

/* Deals: Tabelle, Leerzustand, DAC7 */
.dl-table-tools { display: flex; justify-content: flex-end; margin: 0 0 .5rem; }
.dl-table td { vertical-align: top; }
.dl-empty { padding: 2rem; text-align: center; background: var(--bg-surface); border: 1px solid var(--border-default); border-radius: 12px; }
.dl-empty h2 { margin: 0 0 .5rem; font-size: 1.15rem; }
.dl-dac7 { display: flex; align-items: flex-start; gap: .75rem; margin-top: 1.5rem; padding: 1rem 1.25rem; background: var(--info-subtle);
  color: var(--info-fg); border-radius: 12px; }
.dl-dac7 > svg { flex: none; margin-top: 2px; }
.dl-dac7-text { flex: 1; }
.dl-dac7-text p { margin: 0; font-size: .9rem; }
.dl-dac7-title { font-weight: 600; }
@media (max-width: 720px) { .dl-dac7 { flex-wrap: wrap; } }

/* Los-Detail ↔ Deals */
.save-limit { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.lot-deal { display: flex; flex-direction: column; gap: .5rem; }
.lot-deal p { margin: 0; }
.lot-bid-form { display: flex; flex-direction: column; gap: .35rem; }
.lot-bid-buttons { display: flex; gap: .5rem; }
.lot-deal .ok:empty { display: none; }

/* --- Suchaufträge (E7, Entwurf 07-suchauftraege; nur Tokens) ---------------------------------- */
.sa-layout { display: grid; grid-template-columns: minmax(260px, 380px) minmax(0, 1fr); gap: 20px; align-items: start; }
.sa-list { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.sa-items { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.sa-item { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 14px 16px; background: var(--bg-surface);
  border: 1px solid var(--border-default); border-radius: 12px; }
.sa-item:hover { border-color: var(--border-strong); }
.sa-item.is-selected { border: 2px solid var(--accent-default); padding: 13px 15px; }
.sa-item-head { display: flex; align-items: center; gap: 8px; }
.sa-item-link { flex: 1; min-width: 0; color: var(--fg-default); font-weight: 500; overflow-wrap: anywhere; }
.sa-item-link:hover { text-decoration: none; }
/* ganze Karte klickbar, Schalter liegt darüber */
.sa-item-link::after { content: ''; position: absolute; inset: 0; border-radius: inherit; }
.sa-item.is-paused .sa-item-link, .sa-item.is-paused .sa-summary { color: var(--fg-muted); }
.sa-new { flex: none; padding: .05rem .5rem; border-radius: 999px; background: var(--accent-subtle); color: var(--accent-fg); font-size: .75rem; }
.sa-toggle { position: relative; z-index: 1; margin: 0; flex: none; }
.sa-switch, button.sa-switch { position: relative; width: 38px; height: 22px; padding: 0; border-radius: 999px;
  background: var(--bg-muted); border: 1px solid var(--border-strong); }
.sa-switch[aria-checked='true'], button.sa-switch[aria-checked='true']:hover:not(:disabled) { background: var(--accent-default); border-color: var(--accent-default); }
button.sa-switch[aria-checked='false']:hover:not(:disabled) { background: var(--bg-subtle); border-color: var(--border-strong); }
.sa-knob { position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: var(--bg-surface);
  box-shadow: var(--shadow); transition: left .15s; }
.sa-switch[aria-checked='true'] .sa-knob { left: 18px; }
@media (prefers-reduced-motion: reduce) { .sa-knob { transition: none; } }
.sa-summary, .sa-delivery { margin: 0; font-size: .85rem; }
.sa-summary { color: var(--fg-default); }
.sa-delivery { display: flex; align-items: center; gap: .35rem; color: var(--fg-muted); }
.sa-empty { margin: 0; padding: 16px; border: 1px dashed var(--border-strong); border-radius: 12px; color: var(--fg-muted); }

.sa-editor { display: flex; flex-direction: column; min-width: 0; padding: 20px; background: var(--bg-surface);
  border: 1px solid var(--border-default); border-radius: 12px; }
.sa-head { display: flex; align-items: flex-start; gap: 12px; padding-bottom: 8px; }
.sa-head-icon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px;
  border-radius: 8px; background: var(--bg-subtle); color: var(--fg-muted); }
.sa-head-text { flex: 1; min-width: 0; }
.sa-name { width: 100%; padding: .15rem .35rem; margin-left: -.35rem; border: 1px solid transparent; background: transparent;
  font-size: 1.05rem; font-weight: 500; color: var(--fg-default); }
.sa-name:hover { border-color: var(--border-default); }
.sa-meta { margin: 0; color: var(--fg-muted); font-size: .85rem; }
.sa-error { margin: 8px 0; padding: .6rem .75rem; border-radius: 8px; background: var(--danger-subtle); color: var(--danger-fg); }
.sa-error p { margin: 0; }
.sa-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 16px 0;
  border-bottom: 1px solid var(--border-default); }
.sa-row-text { flex: 0 1 220px; min-width: 0; }
.sa-row-wide { flex: 1 1 auto; }
.sa-row-text h3 { margin: 0 0 4px; font-size: .95rem; font-weight: 500; }
.sa-row-text p { margin: 0; color: var(--fg-muted); font-size: .85rem; }
.sa-row-chips { flex: 1; display: flex; align-items: flex-start; justify-content: flex-end; gap: 8px; min-width: 0; }
.sa-chip-box { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; min-width: 0; }
.sa-field-error { margin: 0; color: var(--danger-fg); font-size: .85rem; text-align: right; }
.sa-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.sa-chip { display: inline-flex; align-items: center; gap: 4px; padding: .2rem .25rem .2rem .7rem; border-radius: 999px;
  border: 1px solid var(--accent-default); background: var(--accent-subtle); color: var(--accent-fg); font-size: .85rem; }
button.sa-chip-remove { display: inline-grid; place-items: center; width: 20px; height: 20px; padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: var(--accent-fg); }
button.sa-chip-remove:hover:not(:disabled) { background: var(--bg-surface); border: 0; }
.sa-channels { flex: 0 1 auto; flex-wrap: wrap; max-width: 55%; }
.sa-chip.sa-channel { gap: .35rem; padding: .2rem .7rem; }
.sa-chip-none { padding: .2rem 0; color: var(--fg-muted); font-size: .85rem; }
.sa-add, .sa-delete { position: relative; flex: none; }
.sa-add > summary, .sa-delete > summary { list-style: none; cursor: pointer; }
.sa-add > summary::-webkit-details-marker, .sa-delete > summary::-webkit-details-marker { display: none; }
.sa-plus { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--border-strong);
  color: var(--fg-default); background: var(--bg-surface); }
.sa-plus:hover { background: var(--bg-subtle); }
.sa-pop { position: absolute; z-index: 20; top: calc(100% + 6px); width: min(320px, 80vw); padding: 14px; display: flex; flex-direction: column;
  gap: 6px; background: var(--bg-surface); border: 1px solid var(--border-strong); border-radius: 10px; box-shadow: var(--shadow); }
.sa-pop-right { right: 0; }
.sa-pop p { margin: 0 0 6px; }
.sa-fields label { font-size: .85rem; color: var(--fg-muted); }
.sa-fields input[type='text'], .sa-fields input[type='number'], .sa-fields select { width: 100%; }
.sa-fields .sa-check, .sa-checks label { color: var(--fg-default); display: flex; align-items: center; gap: .4rem; }
.sa-checks { display: flex; flex-direction: column; gap: 4px; margin: 4px 0; padding: 6px 8px; min-width: 0;
  border: 1px solid var(--border-default); border-radius: 8px; }
.sa-checks legend { font-size: .85rem; color: var(--fg-muted); padding: 0 4px; }
.sa-fields > button { align-self: flex-end; margin-top: 6px; }
.sa-segment { display: inline-flex; flex-wrap: wrap; gap: 2px; margin: 0; padding: 3px; min-width: 0; border: 1px solid var(--border-default);
  border-radius: 8px; background: var(--bg-subtle); }
.sa-segment label { position: relative; cursor: pointer; }
.sa-segment input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.sa-segment span { display: inline-block; padding: .3rem .8rem; border-radius: 6px; color: var(--fg-muted); font-size: .9rem; }
.sa-segment input:checked + span { background: var(--bg-surface); color: var(--fg-default); box-shadow: var(--shadow); }
.sa-segment input:focus-visible + span { outline: 2px solid var(--focus-ring); outline-offset: 1px; }
.sa-channels-link { flex: none; display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .8rem; border-radius: 999px;
  border: 1px solid var(--accent-default); color: var(--accent-fg); font-size: .85rem; }
.sa-channels-link:hover { background: var(--accent-subtle); text-decoration: none; }

.sa-preview { margin-top: 16px; padding: 16px; border-radius: 10px; background: var(--bg-subtle); }
.sa-preview-head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.sa-preview-head h3 { display: inline-flex; align-items: center; gap: .4rem; margin: 0; font-size: .95rem; font-weight: 500; }
.sa-preview-figures { margin: 0; color: var(--accent-fg); font-size: .85rem; }
.sa-bars { display: flex; align-items: flex-end; gap: 3px; height: 56px; margin: 14px 0 10px; }
.sa-bar { flex: 1; min-height: 2px; height: var(--h); border-radius: 2px 2px 0 0; background: var(--accent-default); }
.sa-bar.is-busy { background: var(--warning-solid); }
.sa-preview-text { margin: 0; color: var(--fg-muted); font-size: .85rem; }

.sa-savebar { position: sticky; bottom: 12px; z-index: 5; display: flex; align-items: center; gap: 12px; margin-top: 20px;
  padding: 10px 12px 10px 16px; background: var(--bg-surface); border: 1px solid var(--border-default); border-radius: 12px; box-shadow: var(--shadow); }
.sa-savestate { flex: 1; display: flex; align-items: center; gap: .5rem; margin: 0; }
.sa-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--warning-solid); }
.sa-savebar #sa-save { display: inline-flex; align-items: center; gap: .35rem; }
.sa-savebar-plain { justify-content: flex-end; }
.sa-back { display: none; align-items: center; gap: .25rem; align-self: flex-start; margin: -4px 0 8px; color: var(--fg-muted); font-size: .9rem; }
.td-from-search { display: flex; align-items: center; gap: .3rem; margin: 2px 0 0; color: var(--fg-muted); font-size: .8rem; }

/* Mobil: Liste und Editor untereinander */
@media (max-width: 1100px) {
  .sa-layout { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
  /* zwei Ansichten wie React: Liste – oder (nach Auswahl/„Neu“) nur der Editor mit „Zurück“ */
  .sa-layout:not(.is-editing) .sa-editor, .sa-layout.is-editing .sa-list { display: none; }
  .sa-layout.is-editing .sa-back { display: inline-flex; }
  .sa-row { flex-direction: column; gap: 10px; }
  .sa-row-text { flex: none; }
  .sa-row-chips, .sa-chips { justify-content: flex-start; width: 100%; }
  .sa-row-chips { flex-wrap: wrap; }
  .sa-channels { max-width: none; }
  .sa-chip-box { align-items: flex-start; flex: 1; }
  .sa-field-error { text-align: left; }
  .sa-pop-right { right: auto; left: 0; }
  .sa-add .sa-pop-right { right: 0; left: auto; }
  .sa-savebar { gap: 8px; padding: 8px 8px 8px 12px; }
  .sa-savestate { font-size: .85rem; min-width: 0; }
  .sa-savebar .button, .sa-savebar button { padding: .35rem .6rem; }
}

/* --- Einstellungen „Regeln & Kosten“ (E16a, Entwurf 11-einstellungen, 11b, 13c; wie React
       Settings.module.css, nur Tokens) ------------------------------------------------------------ */
.st-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(18rem, 23.75rem); gap: 1.25rem; align-items: start; }
.st-main, .st-aside { display: flex; flex-direction: column; gap: 1.25rem; min-width: 0; }
.st-aside { position: sticky; top: 1rem; }
.st-card { display: flex; flex-direction: column; padding: 1.25rem; background: var(--bg-surface); border: 1px solid var(--border-default);
  border-radius: var(--radius); box-shadow: var(--shadow); min-width: 0; }
.st-card-head { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; margin-bottom: .5rem; }
.st-card-icon { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; flex: none;
  border-radius: 8px; background: var(--bg-subtle); color: var(--fg-muted); }
.st-card-titles { flex: 1 1 14rem; min-width: 0; }
.st-card-title { margin: 0; font-size: 1rem; font-weight: 600; }
.st-card-sub { margin: .1rem 0 0; font-size: .875rem; color: var(--fg-muted); }
.st-card-action { flex: none; }
.st-error { margin: 0 0 1rem; padding: .6rem .75rem; border-radius: 8px; background: var(--danger-subtle); color: var(--danger-fg); }
.st-error p { margin: 0; }

.st-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .35rem 1.5rem; align-items: center; padding: .85rem 0;
  border-bottom: 1px solid var(--border-default); min-width: 0; }
.st-row:last-child { border-bottom: none; }
.st-row-label { min-width: 0; }
.st-row-title { display: block; margin: 0; font-weight: 500; }
.st-row-hint { display: block; margin: .15rem 0 0; font-size: .875rem; color: var(--fg-muted); }
.st-row-value { display: flex; gap: .5rem; justify-content: flex-end; align-items: center; }
.st-row-extra { grid-column: 1 / -1; display: flex; align-items: center; gap: .35rem; margin: 0; font-size: .8rem; color: var(--fg-subtle); }
.st-link-row { grid-column: 1 / -1; margin: 0; font-size: .875rem; }
.st-field-error { grid-column: 1 / -1; display: flex; align-items: center; gap: .35rem; margin: 0; color: var(--danger-fg);
  font-size: .875rem; font-weight: 500; }
.st-field-error:empty { display: none; }
.st-note { margin: .4rem 0 .25rem; font-size: .8rem; color: var(--fg-subtle); }

.st-number { display: inline-flex; align-items: center; gap: .35rem; width: 7rem; padding: 0 .6rem; background: var(--bg-surface);
  border: 1px solid var(--border-strong); border-radius: 8px; }
.st-number-narrow { width: 5.75rem; }
.st-number-wide { width: 9rem; }
.st-number:focus-within { outline: var(--focus-ring); outline-offset: 1px; }
.st-number input { width: 100%; min-width: 0; border: none; padding: .45rem 0; text-align: right; font-variant-numeric: tabular-nums;
  background: transparent; }
.st-number input:focus-visible { outline: none; }
/* Platzhalter (Standard bzw. „wie Hauptregel“) nicht wie ein eingetragener Wert */
.st-number input::placeholder { color: var(--fg-muted); font-style: italic; opacity: 1; }
.st-number span { color: var(--fg-subtle); font-size: .85rem; white-space: nowrap; }
.st-number.is-invalid { border-color: var(--danger-solid); }

.st-segment { display: inline-flex; flex-wrap: wrap; padding: 3px; gap: 2px; margin: 0; background: var(--bg-subtle);
  border: 1px solid var(--border-default); border-radius: 9px; }
.st-segment-option { position: relative; }
.st-segment-option input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.st-segment-option span { display: block; padding: .3rem .8rem; border-radius: 7px; color: var(--fg-muted); font-size: .9rem; }
.st-segment-option input:checked + span { background: var(--bg-surface); color: var(--fg-default); font-weight: 600;
  box-shadow: 0 1px 2px color-mix(in srgb, var(--fg-default) 10%, transparent); }
.st-segment-option input:focus-visible + span { outline: var(--focus-ring); outline-offset: 1px; }
.st-preset-row { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; padding: .25rem 0 0; }
.st-preset-legend { font-size: .875rem; font-weight: 500; color: var(--fg-muted); }
.st-stacked { display: flex; flex-direction: column; align-items: flex-start; gap: .5rem; padding: .85rem 0;
  border-bottom: 1px solid var(--border-default); }
.st-select, .st-tax-select { width: 100%; }
.st-tax-select { display: none; }
/* Verkaufsgebühr nur bei Gewerblich und Kleinunternehmer (bei Privat gespeichert, wirkt aber nicht) */
@media (min-width: 1024px) {
  .st-costs:has(.st-tax-segment input[value='private']:checked) .st-fee { display: none; }
}
@media (max-width: 1023px) {
  .st-costs:has(.st-tax-select option[value='private']:checked) .st-fee { display: none; }
}
.st-more:has(#st-storage_enabled:not(:checked)) #st-row-storage_per_lot,
.st-more:has(#st-other_enabled:not(:checked)) #st-row-other_per_lot { display: none; }

/* Schalter: Checkbox mit role=switch */
.st-switch { appearance: none; position: relative; width: 2.5rem; height: 1.4rem; flex: none; margin: 0; padding: 0;
  border: 1px solid transparent; border-radius: 999px; background: var(--toggle-off, var(--bg-muted)); cursor: pointer; }
.st-switch::after { content: ''; position: absolute; top: 2px; left: 2px; width: calc(1.4rem - 6px); height: calc(1.4rem - 6px);
  border-radius: 50%; background: var(--bg-surface); box-shadow: 0 1px 2px color-mix(in srgb, var(--fg-default) 25%, transparent);
  transition: transform .15s ease; }
.st-switch:checked { background: var(--accent-default); }
.st-switch:checked::after { transform: translateX(1.1rem); }
.st-check { display: flex; align-items: center; gap: .5rem; padding: .5rem 0; }

/* Kategorie-Tabelle */
.st-table-wrap { overflow-x: auto; }
.st-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.st-table th { text-align: left; white-space: nowrap; font-weight: 500; font-size: .8rem; color: var(--fg-muted);
  background: var(--bg-subtle); padding: .5rem 1rem; }
.st-table td { padding: .6rem 1rem; border-top: 1px solid var(--border-default); vertical-align: middle; }
.st-table td .st-field-error { margin-top: .2rem; }
.st-table td.st-actions { text-align: right; white-space: nowrap; }
.st-edit-row td { background: var(--accent-subtle); }
.st-edit-fields { display: flex; gap: .5rem; flex-wrap: wrap; align-items: flex-end; }
.st-edit-fields select { min-width: 10rem; }
.st-edit-field { display: flex; flex-direction: column; gap: .2rem; font-size: .8rem; color: var(--fg-muted); }
.st-edit-actions { display: inline-flex; gap: .5rem; margin-left: auto; }
.st-real-estate { display: flex; align-items: center; gap: .5rem; margin: 0; padding: .6rem 1rem; background: var(--bg-subtle);
  color: var(--fg-subtle); font-size: .875rem; border-top: 1px solid var(--border-default); }
button.st-icon-button { display: inline-flex; align-items: center; justify-content: center; width: 1.9rem; height: 1.9rem; padding: 0;
  background: none; border: none; border-radius: 6px; color: var(--fg-muted); }
button.st-icon-button:hover:not(:disabled) { background: var(--bg-subtle); border: none; color: var(--fg-default); }
.st-card button.small, .st-card a.button.small { display: inline-flex; align-items: center; gap: .3rem; }

/* Aufklappbar „Weitere Kosten“, „Fahrzeuge“ */
.st-details { border-bottom: 1px solid var(--border-default); }
.st-details:last-child { border-bottom: none; }
.st-details > summary { display: flex; align-items: center; gap: .6rem; padding: .75rem 0; cursor: pointer; list-style: none; }
.st-details > summary::-webkit-details-marker { display: none; }
.st-details > summary svg { flex: none; color: var(--fg-muted); transition: transform .15s ease; }
.st-details[open] > summary svg { transform: rotate(90deg); }
.st-details-body { padding: 0 0 .5rem 1.6rem; }

/* Beispielrechnung */
.st-example-main { transition: opacity .15s; }
#st-form.htmx-request .st-example-main { opacity: .6; }
.st-example-lot { display: flex; align-items: center; gap: .6rem; padding: .35rem 0 .5rem; }
.st-example-image { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 40px; height: 34px;
  border-radius: 6px; object-fit: cover; background: var(--bg-subtle); color: var(--fg-subtle); }
.st-example-lot-text { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.st-example-title { font-weight: 600; font-size: .9rem; color: var(--fg-default); overflow-wrap: anywhere; }
.st-example-meta { color: var(--fg-subtle); font-size: .8rem; }
.st-example-table { width: 100%; border-collapse: collapse; font-size: .875rem; }
.st-example-table th, .st-example-table td { padding: .45rem 0; background: none; border-bottom: 1px solid var(--border-default);
  font-weight: 400; text-align: left; vertical-align: top; white-space: normal; color: var(--fg-muted); }
.st-example-table td { text-align: right; color: var(--fg-default); font-weight: 500; font-variant-numeric: tabular-nums; padding-left: .75rem; }
.st-example-table tbody tr:last-child th, .st-example-table tbody tr:last-child td { border-bottom: none; }
.st-example-table tr.is-strong th { color: var(--fg-default); font-weight: 500; }
.st-example-table tr.is-sum th, .st-example-table tr.is-sum td { border-top: 1px solid var(--border-strong); }
.st-example-table td.is-changed { color: var(--accent-fg); font-weight: 600; }
.st-example-texts { list-style: none; margin: .6rem 0 0; padding: 0; display: flex; flex-direction: column; gap: .35rem;
  font-size: .8rem; color: var(--fg-muted); }
.st-example-texts:empty { display: none; }
.st-example-texts li { display: flex; gap: .4rem; align-items: flex-start; }
.st-example-texts svg { flex: none; margin-top: .1rem; }
.st-example-toggle { display: none; }
.st-example-toggle > summary { list-style: none; }
.st-example-toggle > summary::-webkit-details-marker { display: none; }
.st-example-summary { display: flex; align-items: center; gap: .6rem; cursor: pointer; color: var(--fg-muted); }
.st-example-summary-text { display: flex; flex: 1; flex-direction: column; gap: .1rem; min-width: 0; color: var(--fg-default); }
.st-example-toggle[open] #st-example-m-hint { display: none; }
.st-example-toggle[open] > .st-example-summary > svg:last-child { transform: rotate(180deg); }
.st-example-toggle > .st-card-sub { margin: .6rem 0 .25rem; }

/* Speicherleiste (schwebend unten) */
.st-savebar { position: sticky; bottom: 1rem; z-index: 5; display: flex; align-items: center; gap: .75rem 1rem; flex-wrap: wrap;
  margin-top: 1.25rem; padding: .65rem .75rem .65rem 1rem; background: var(--bg-surface); border: 1px solid var(--border-default);
  border-radius: var(--radius); box-shadow: 0 4px 16px color-mix(in srgb, var(--fg-default) 12%, transparent); }
.st-savebar-plain { justify-content: flex-end; }
.st-save-text { display: flex; align-items: flex-start; gap: .6rem; flex: 1 1 18rem; min-width: 0; }
.st-save-lines { display: flex; flex-direction: column; gap: .1rem; }
.st-save-main { font-weight: 500; }
.st-save-sub { font-size: .875rem; color: var(--fg-muted); }
.st-save-sub.is-error { color: var(--danger-fg); }
.st-dot { width: .5rem; height: .5rem; flex: none; margin-top: .45rem; border-radius: 50%; background: var(--warning-solid); }
.st-dot-danger { background: var(--danger-solid); }
.st-dot-accent { background: var(--accent-default); }
.st-save-actions { display: flex; gap: .5rem; margin-left: auto; }
.st-save-actions:empty { display: none; }
.st-savebar #st-save, .st-savebar .st-reload { display: inline-flex; align-items: center; gap: .35rem; }
.st-profile .forms { margin-top: 1rem; }

/* Mobil (< 1024 px, Entwurf 13c): einspaltig, Beispiel eingeklappt unter der Regel-Karte,
   Steuerstatus als Auswahlliste */
@media (max-width: 1023px) {
  .st-layout { grid-template-columns: minmax(0, 1fr); }
  .st-aside { position: static; }
  .st-example { display: none; }
  .st-example-toggle { display: flex; flex-direction: column; }
  .st-tax-segment { display: none; }
  .st-tax-select { display: block; }
}
@media (max-width: 767px) {
  .st-row { gap: .35rem .75rem; }
  .st-row-stack { grid-template-columns: minmax(0, 1fr); }
  .st-row-stack .st-row-value { justify-content: flex-start; }
  .st-number { width: 6rem; }
  .st-number-wide { width: 8rem; }
  .st-segment { flex-wrap: nowrap; max-width: 100%; overflow-x: auto; }
  .st-segment-option span { padding: .3rem .55rem; font-size: .85rem; white-space: nowrap; }
  .st-card { padding: 1rem; }
  .st-savebar { bottom: .5rem; }
  .st-edit-actions { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .st-switch::after, .st-details > summary svg, .st-example-main { transition: none; }
}

/* Systemzustand › KI: Kontingente und Ausweichkette (Entwurf 14/14b/14c, docs/21 2.7) */
.llm-card { display: flex; flex-direction: column; gap: .75rem; margin-bottom: 1.25rem; min-width: 0; }
.llm-head { display: flex; align-items: flex-start; gap: .75rem; }
.llm-head h3 { margin: 0; font-size: .95rem; }
.llm-head p { margin: .15rem 0 0; }
.llm-headtext { flex: 1 1 auto; min-width: 0; }
.llm-iconbox { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; flex: none;
  border-radius: .5rem; background: var(--bg-subtle); color: var(--fg-muted); }
.llm-push { margin-left: auto; }
.llm-warn { color: var(--warning-fg); }
.llm-danger { color: var(--danger-fg); }
.llm-alert { display: flex; gap: .6rem; padding: .75rem .9rem; border-radius: .6rem; background: var(--warning-subtle); color: var(--warning-fg); }
.llm-alert p { margin: .15rem 0 0; font-size: .875rem; }
.llm-account { display: flex; flex-direction: column; gap: .6rem; padding: .9rem; border-radius: .6rem; background: var(--bg-subtle); }
.llm-account-head { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.llm-group { display: grid; grid-template-columns: minmax(10rem, 1fr) 10rem 10rem; gap: .5rem 1rem; align-items: start; }
.llm-group > .badge { grid-column: 2 / -1; justify-self: start; }
.llm-group-name { font-size: .875rem; font-weight: 500; }
.llm-window { display: flex; flex-direction: column; gap: .2rem; }
.llm-window-head { display: flex; justify-content: space-between; }
.llm-bar { display: block; height: 6px; border-radius: 999px; background: var(--bg-muted); overflow: hidden; }
.llm-bar > span { display: block; height: 100%; border-radius: 999px; }
.llm-fill-good { background: var(--success-solid); } .llm-fill-warn { background: var(--warning-solid); }
.llm-fill-bad { background: var(--danger-solid); } .llm-fill-none { background: transparent; }
.badge.chip-accent { background: var(--accent-subtle); color: var(--accent-fg); }
.llm-chain td { vertical-align: middle; }
.llm-chain select, .llm-model { min-width: 7rem; }
.llm-model { width: 13rem; }
.llm-unit { display: inline-flex; align-items: center; gap: .3rem; }
.llm-unit input { width: 4.5rem; text-align: right; }
.llm-unit input.is-invalid { border-color: var(--danger-solid); }
.llm-rest { display: flex; flex-direction: column; gap: .2rem; min-width: 6rem; }
.llm-move { white-space: nowrap; }
.llm-move-btn { min-width: 1.9rem; font-weight: 600; }
.llm-warnings { margin: 0; padding: 0; list-style: none; font-size: .85rem; color: var(--warning-fg); }
.llm-api { display: flex; align-items: center; gap: .6rem; padding: .6rem .75rem; border-radius: .5rem; background: var(--bg-subtle); }
.llm-api p { margin: 0; }
.llm-actions { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.llm-dot-ok { background: var(--success-solid); }
@media (max-width: 720px) {
  .llm-group { grid-template-columns: 1fr 1fr; }
  .llm-group-name { grid-column: 1 / -1; }
  .llm-chain thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .llm-chain, .llm-chain tbody { display: block; width: 100%; }
  .llm-chain tr { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .6rem; padding: .65rem .5rem;
    border-bottom: 1px solid var(--border-default); }
  .llm-chain td { display: block; padding: 0; border: 0; }
  .llm-chain td:nth-child(1) { width: 1.2rem; color: var(--fg-subtle); }
  .llm-chain td:nth-child(3) { flex: 1 1 10rem; }
  .llm-chain td:nth-child(3) .llm-model { width: 100%; }
  .llm-chain td:nth-child(5) { flex: 1 1 5rem; }
  .llm-chain td:nth-child(6) { flex: 1 1 100%; order: 9; }
  .llm-chain td:nth-child(7) { margin-left: auto; }
}

/* --- Entdecken / Losliste (Wunsch A, docs/23 §10, Entwurf 15–15e) -------------------------------
   Filterspalte als <details> (eingeklappt bei offener Vorschau); Liste < 1400 px ohne Seitenspalte;
   Vorschau ≥ 1400 px als Spalte, schmaler unter der Liste (ohne JavaScript) bzw. als modales Blatt
   (`.is-sheet`, Skript). Fokusring (Rahmen) getrennt von „Vorschau offen“ (Akzentfläche). */
.en-head { margin-bottom: 1rem; }
.en-head-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; }
.en-export { display: inline-flex; align-items: center; gap: .35rem; color: var(--fg-muted); font-size: .9rem; }
.en-export a.button.small, .en-results a.button.small { padding: .2rem .55rem; font-size: .85rem; }
.en-flash { margin: 0 0 .75rem; color: var(--fg-muted); }
.en-inline { display: inline-flex; margin: 0; }
.en-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem 1.5rem; align-items: start; }
.en-layout:has(> .en-filter[open]) { grid-template-columns: 17rem minmax(0, 1fr); }
.en-layout { position: relative; }
/* eingeklappt: „Filter (n)“ links in der Zeile der Werkzeugleiste (Entwurf 15), Leiste rückt ein */
.en-filter:not([open]) { position: absolute; top: 0; left: 0; z-index: 1; }
.en-filter:not([open]) > .en-filter-toggle { min-width: 7.25rem; justify-content: center; }
.en-layout:has(> .en-filter:not([open])) .en-toolbar { min-height: 2.4rem; }
.en-layout:has(> .en-filter:not([open])) .en-count { margin-left: 8rem; }
.en-filter { position: sticky; top: 5rem; max-height: calc(100vh - 6rem); overflow-y: auto; }
.en-filter:not([open]) { max-height: none; overflow: visible; }
.en-filter[open] { background: var(--bg-surface); border: 1px solid var(--border-default); border-radius: 12px; padding: .75rem .9rem; }
.en-filter-toggle { display: inline-flex; align-items: center; gap: .4rem; cursor: pointer; font-weight: 600; list-style: none;
  padding: .35rem .7rem; border: 1px solid var(--border-strong); border-radius: 8px; background: var(--bg-surface); }
.en-filter-toggle::-webkit-details-marker { display: none; }
.en-filter[open] > .en-filter-toggle { border: 0; padding: 0 0 .5rem; background: none; }
.en-filter-form { display: flex; flex-direction: column; gap: .75rem; font-size: .9rem; }
.en-field { display: flex; flex-direction: column; gap: .25rem; }
.en-field select, .en-field input { width: 100%; }
.en-checks { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.en-checks legend { font-weight: 600; font-size: .8rem; color: var(--fg-muted); margin-bottom: .2rem; padding: 0; }
.en-checks label { display: flex; align-items: flex-start; gap: .4rem; }
.en-checks label > input[type='checkbox'] { margin: .2rem 0 0; flex: none; }
.en-price input { width: 6.5rem; }
.en-results { min-width: 0; display: flex; flex-direction: column; gap: .75rem; }
.en-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: .75rem; }
.en-count { font-weight: 600; }
.en-count:focus-visible { outline: var(--focus-ring); outline-offset: 2px; border-radius: 4px; }
.en-tools { margin-left: auto; display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; }
.en-views { display: inline-flex; padding: .2rem; gap: .15rem; border: 1px solid var(--border-default); border-radius: 10px; background: var(--bg-subtle); }
button.en-view { display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .6rem; border: 0; border-radius: 7px;
  background: none; color: var(--fg-muted); font-size: .9rem; }
button.en-view:hover:not(:disabled) { background: var(--bg-surface); border: 0; color: var(--fg-default); }
button.en-view[aria-pressed='true'] { background: var(--bg-surface); color: var(--fg-default); font-weight: 600; box-shadow: var(--shadow); }
button.en-preset { display: inline-flex; align-items: center; gap: .35rem; }
button.en-preset[aria-pressed='true'] { border-color: var(--accent-default); color: var(--fg-link); background: var(--accent-subtle); }
.en-selects { display: inline-flex; flex-wrap: wrap; gap: .5rem; margin: 0; }
.en-select select { min-width: 8rem; }
.en-chips { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; font-size: .85rem; }
.en-chip { display: inline-flex; align-items: center; gap: .25rem; padding: .1rem .25rem .1rem .6rem; border: 1px solid var(--accent-default);
  border-radius: 999px; color: var(--fg-link); background: var(--accent-subtle); }
.en-chip button { display: inline-grid; place-items: center; min-width: 24px; min-height: 24px; padding: 0; border: 0; border-radius: 50%;
  background: none; color: inherit; }
.en-chip button:hover:not(:disabled) { background: var(--bg-surface); border: 0; }
.en-hint, .en-notice { margin: 0; display: flex; align-items: center; gap: .35rem; font-size: .85rem; color: var(--fg-muted); }
.en-notice { color: var(--warning-fg); }
.en-undo-bar { margin: 0; }
.en-dismiss { border-color: transparent; background: none; }
.en-empty { text-align: center; padding: 2rem 1rem; background: var(--bg-surface); border: 1px solid var(--border-default); border-radius: 12px; }
.en-empty h2 { margin: .5rem 0 .25rem; font-size: 1.1rem; }
.en-empty-icon { display: inline-grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--bg-subtle); color: var(--fg-muted); }
.en-ways { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; }
.en-ways button { display: inline-flex; align-items: center; gap: .3rem; }
.pager.en-pager { margin: 0; justify-content: flex-end; }

.en-keys { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem; font-size: .8rem; color: var(--fg-muted); }
.en-keys[hidden] { display: none; }
.en-keys ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .25rem 1rem; }
.en-keys kbd { font-family: inherit; font-size: .75rem; padding: .05rem .35rem; border: 1px solid var(--border-default); border-radius: 4px; background: var(--bg-surface); }
.en-key-toggle { display: inline-flex; align-items: center; gap: .35rem; }

/* gemeinsame Teile je Los */
.en-pill { display: inline-flex; align-items: center; gap: .3rem; border-radius: 999px; padding: .1rem .5rem; font-size: .75rem;
  font-weight: 500; background: var(--bg-subtle); color: var(--fg-muted); white-space: nowrap; }
.en-pill-good { background: var(--success-subtle); color: var(--success-fg); }
.en-pill-warn { background: var(--warning-subtle); color: var(--warning-fg); }
.en-pill-image { box-shadow: 0 0 0 1px var(--bg-surface); }
.en-dot { display: inline-block; width: .45rem; height: .45rem; border-radius: 50%; background: currentColor; flex: none; }
.en-dot.dot-good { background: var(--success-solid); } .en-dot.dot-warn { background: var(--warning-solid); }
.en-dot.dot-neutral { background: var(--fg-subtle); } .en-dot.dot-bad { background: var(--danger-solid); }
.en-meta { display: block; margin: 0; font-size: .8rem; color: var(--fg-muted); }
.en-sub { display: flex; align-items: center; justify-content: inherit; gap: .2rem; font-size: .75rem; color: var(--fg-muted); }
.en-limit { display: inline-flex; align-items: center; gap: .35rem; color: var(--fg-link); font-weight: 600; font-variant-numeric: tabular-nums; }
.en-icon-btn { display: inline-grid; place-items: center; min-width: 2rem; min-height: 2rem; padding: .3rem; }
a.button.en-icon-btn { padding: .3rem; }
.en-plain, a.button.en-plain { border-color: transparent; background: none; }
.en-img-empty { display: grid; place-items: center; background: var(--bg-subtle); color: var(--fg-subtle); }
.en-above { position: relative; z-index: 1; }
[data-lot-item]:focus-visible { outline: var(--focus-ring); outline-offset: 2px; }

/* Liste als Tabelle */
.en-table-wrap { background: var(--bg-surface); border: 1px solid var(--border-default); border-radius: 12px; overflow-x: auto; }
.en-table { width: 100%; border-collapse: collapse; font-size: .9rem; background: none; }
.en-table th { text-align: left; font-weight: 500; font-size: .8rem; color: var(--fg-muted); background: var(--bg-subtle); padding: .6rem .75rem; white-space: nowrap; border: 0; }
.en-table td { padding: .6rem .75rem; border: 0; border-top: 1px solid var(--border-default); vertical-align: middle; }
.en-table .num { text-align: right; }
.en-table td.num { white-space: nowrap; font-variant-numeric: tabular-nums; }
.en-table td.num .en-sub { justify-content: flex-end; }
.en-row { cursor: pointer; }
.en-row:hover { background: var(--bg-subtle); }
.en-row:focus-visible { outline-offset: -2px; }
.en-row.is-open, .en-row.is-open:hover, .en-mobile-item.is-open { background: var(--accent-subtle); }
.en-ev { display: inline-block; border: 1px solid var(--border-default); border-radius: 8px; padding: .2rem .45rem; font-size: .75rem;
  color: var(--fg-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.en-lot-cell { display: flex; align-items: center; gap: .75rem; min-width: 13rem; }
.en-thumb { flex: none; width: 2.75rem; height: 2.75rem; border-radius: 8px; object-fit: cover; }
.en-title { font-weight: 500; }

/* Liste mobil (eigenes Markup) – erst unter 720 px sichtbar */
.en-mobile-list { display: none; list-style: none; margin: 0; padding: 0; flex-direction: column; gap: .6rem; }
.en-mobile-item { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr) auto; gap: .6rem; align-items: start; padding: .6rem;
  background: var(--bg-surface); border: 1px solid var(--border-default); border-radius: 12px; }
.en-mobile-thumb { width: 3.5rem; height: 3.5rem; border-radius: 8px; object-fit: cover; }
.en-mobile-body { min-width: 0; display: flex; flex-direction: column; gap: .25rem; }
.en-mobile-title { margin: 0; font-size: .95rem; line-height: 1.3; }
.en-mobile-meta { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; }
.en-mobile-facts { margin: 0; display: flex; flex-wrap: wrap; gap: .1rem .9rem; font-size: .85rem; }
.en-mobile-facts div { display: flex; gap: .3rem; align-items: baseline; }
.en-mobile-facts dt { color: var(--fg-muted); font-size: .75rem; }
.en-mobile-facts dd { margin: 0; font-variant-numeric: tabular-nums; }

/* Kacheln und Galerie (gestreckte Fläche) */
.en-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 1rem; }
.en-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: 1rem; }
.en-tiles > div, .en-gallery > div { display: flex; }
.en-tiles > div > *, .en-gallery > div > * { flex: 1; }
.en-card, .en-gallery-item { position: relative; display: flex; flex-direction: column; background: var(--bg-surface);
  border: 1px solid var(--border-default); border-radius: 12px; overflow: hidden; cursor: pointer; }
.en-card { box-shadow: var(--shadow); }
.en-card.is-open, .en-gallery-item.is-open { border-color: var(--accent-default); background: var(--accent-subtle); }
.en-card-media { aspect-ratio: 16 / 9; background: var(--bg-subtle); }
.en-card-image, .en-gallery-image { width: 100%; height: 100%; object-fit: cover; }
.en-card-body { display: flex; flex-direction: column; gap: .5rem; padding: .75rem .9rem .9rem; flex: 1; }
.en-card-top { display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.en-badges { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; }
.en-source { font-size: .75rem; color: var(--fg-muted); background: var(--bg-subtle); border-radius: 999px; padding: .1rem .5rem; }
.en-card-title { font-size: 1rem; margin: 0; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3;
  -webkit-box-orient: vertical; overflow: hidden; }
.en-figures { display: flex; justify-content: space-between; align-items: flex-start; gap: .5rem; padding-top: .5rem; border-top: 1px solid var(--border-default); }
.en-figures > div { display: flex; flex-direction: column; gap: .1rem; }
.en-card-limit { color: var(--fg-link); font-weight: 600; font-size: .9rem; font-variant-numeric: tabular-nums; }
.en-card-profit { align-items: flex-end; text-align: right; }
.en-card-profit strong { font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.en-card-facts { margin: auto 0 0; display: flex; flex-wrap: wrap; gap: .25rem .9rem; font-size: .85rem; color: var(--fg-muted); }
.en-card-facts span { display: inline-flex; align-items: center; gap: .25rem; }
.en-star-form, .en-card .en-inline { display: inline-flex; }
button.en-star { display: inline-grid; place-items: center; padding: .2rem; min-width: 28px; min-height: 28px; border: 0; background: none; color: var(--fg-muted); }
button.en-star:hover:not(:disabled) { background: var(--bg-subtle); border: 0; color: var(--warning-fg); }
button.en-star.is-on { color: var(--warning-fg); }
button.en-star.is-on svg { fill: currentColor; }
.en-gallery-media { position: relative; aspect-ratio: 4 / 3; background: var(--bg-subtle); }
.en-gallery-verdict { position: absolute; top: .6rem; left: .6rem; }
.en-gallery-body { display: flex; flex-direction: column; gap: .2rem; padding: .6rem .75rem .75rem; }
.en-gallery-title { margin: 0; font-size: .9rem; line-height: 1.3; }
.en-stretch { position: static; display: block; width: 0; height: 0; padding: 0; overflow: hidden; }
.en-stretch::after { content: ''; position: absolute; inset: 0; border-radius: 12px; cursor: pointer; }
.en-stretch:focus-visible { outline: none; }
.en-stretch:focus-visible::after { outline: var(--focus-ring); outline-offset: -2px; }

/* Vorschau */
.en-preview { display: flex; flex-direction: column; gap: .75rem; padding: 1rem 1.1rem 1.1rem; background: var(--bg-surface);
  border: 1px solid var(--border-default); border-radius: 12px; grid-column: 1 / -1; scroll-margin-top: 5rem; min-width: 0; }
.en-preview-head { display: flex; justify-content: space-between; align-items: center; }
.en-preview-label { font-size: .8rem; color: var(--fg-muted); }
.en-preview-nav { display: flex; gap: .35rem; }
.en-not-in-list { display: flex; gap: .5rem; padding: .6rem .75rem; border-radius: 8px; background: var(--info-subtle); color: var(--info-fg); font-size: .85rem; }
.en-not-in-list p { margin: .1rem 0 0; }
.en-preview-image { aspect-ratio: 16 / 10; border-radius: 8px; overflow: hidden; background: var(--bg-subtle); }
.en-preview-image img, .en-preview-image .en-img-empty { width: 100%; height: 100%; object-fit: cover; }
.en-preview-title { margin: 0; font-size: 1.15rem; line-height: 1.3; }
.en-preview-title:focus-visible { outline: var(--focus-ring); outline-offset: 2px; border-radius: 4px; }
.en-details-link { display: inline-flex; align-items: center; gap: .2rem; margin-top: -.5rem; font-size: .9rem; }
.en-ended { align-self: flex-start; }
.en-decision { display: flex; flex-direction: column; gap: .2rem; padding: .8rem .9rem; border-radius: 10px; background: var(--bg-subtle); }
.en-decision p { margin: 0; }
.en-decision-good { background: var(--success-subtle); } .en-decision-warn { background: var(--warning-subtle); }
.en-decision-top { display: flex; justify-content: space-between; gap: .5rem; font-size: .8rem; }
.en-verdict { display: inline-flex; align-items: center; gap: .3rem; font-weight: 500; }
.en-decision-head { font-size: 1.3rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.en-decision-profit { font-weight: 600; font-size: .9rem; }
.en-decision-sub { font-size: .8rem; color: var(--fg-muted); }
.en-preview-facts { margin: 0; display: flex; flex-direction: column; font-size: .9rem; }
.en-preview-facts div { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem 0; border-bottom: 1px solid var(--border-default); }
.en-preview-facts dt { color: var(--fg-muted); }
.en-preview-facts dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
.en-preview-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.en-preview-actions button { display: inline-flex; align-items: center; gap: .3rem; }
button.en-watch.is-on svg { fill: currentColor; color: var(--warning-fg); }
.en-preview .en-undo-bar { margin-top: .25rem; }
.en-error { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; padding: .6rem .8rem; border-radius: 8px;
  background: var(--danger-subtle); color: var(--danger-fg); }
.en-error p { margin: 0; flex: 1; }
.en-original { display: inline-flex; align-items: center; gap: .3rem; font-size: .9rem; color: var(--fg-default); }
.en-backdrop { position: fixed; inset: 0; z-index: 40; background: var(--bg-overlay); }
.en-backdrop[hidden] { display: none; }
/* Blatt (nur mit JavaScript, < 1400 px): rechts, mobil von unten */
.en-preview.is-sheet { position: fixed; z-index: 50; top: 0; right: 0; bottom: 0; width: min(26rem, 100%); overflow-y: auto;
  border-radius: 12px 0 0 12px; box-shadow: var(--shadow); }

@media (min-width: 1400px) {
  .en-layout.with-preview { grid-template-columns: minmax(0, 1fr) 24rem; }
  .en-layout.with-preview:has(> .en-filter[open]) { grid-template-columns: 17rem minmax(0, 1fr) 24rem; }
  .en-layout.with-preview > .en-preview { grid-column: auto; position: sticky; top: 5rem; max-height: calc(100vh - 6rem); overflow-y: auto; }
  /* offene Vorschau-Spalte: Ansicht-Knöpfe nur als Symbole, Tabelle ohne „Erw. Zuschlag“ */
  .en-layout.with-preview .en-view-name { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .en-layout.with-preview .en-col-hammer { display: none; }
}
@media (max-width: 1399.98px) {
  /* Liste: Filterspalte nicht neben der Tabelle (kein waagerechtes Scrollen), sondern darüber */
  .en-layout.view-liste:has(> .en-filter[open]) { grid-template-columns: minmax(0, 1fr); }
  .en-layout.view-liste > .en-filter[open] { position: static; max-height: none; overflow: visible; }
  .en-layout.view-liste > .en-filter[open] .en-filter-form { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); align-items: start; }
  .en-layout:has(> .en-filter[open]) .en-col-hammer { display: none; }
}
@media (max-width: 1299.98px) {
  .en-col-hammer { display: none; }
}
@media (max-width: 719.98px) {
  .en-layout, .en-layout:has(> .en-filter[open]) { grid-template-columns: minmax(0, 1fr); }
  .en-filter[open] { position: static; max-height: none; }
  .en-head-actions { flex: 1 1 100%; min-width: 0; }
  .en-tools { margin-left: 0; width: 100%; }
  .en-views { flex: 1 1 100%; }
  .en-views > form { flex: 1; }
  .en-views button.en-view { flex: 1; justify-content: center; width: 100%; }
  .en-selects { flex: 1 1 100%; }
  .en-select { flex: 1; }
  .en-select select { width: 100%; min-width: 0; }
  .en-sort { flex: 1 1 100%; order: -1; }
  .en-table-wrap { display: none; }
  .en-mobile-list { display: flex; }
  .pager.en-pager { justify-content: center; }
  .en-preview.is-sheet { top: auto; left: 0; width: 100%; max-height: 85vh; border-radius: 16px 16px 0 0; }
}

/* Seitenwechsel aller Listen (docs/23 §14, Entwurf 15d/15e) */
.pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .375rem .5rem; margin: 1rem 0; font-size: .85rem; color: var(--fg-muted); }
.pager-pages { display: flex; flex-wrap: wrap; align-items: center; gap: .375rem; margin: 0; padding: 0; list-style: none; }
.pager .button, .pager button { display: inline-flex; align-items: center; justify-content: center; gap: .2rem; }
.pager-num { min-width: 2rem; }
.pager-gap { padding-inline: .1rem; }
.pager-jump { display: inline-flex; align-items: center; gap: .375rem; margin: 0 0 0 .25rem; }
.pager-jump input[type='text'] { width: 4rem; padding: .2rem .4rem; }
@media (max-width: 720px) {
  .pager-edge-text { display: none; }
}

/* Grund ohne Bewertung (Wunsch F 1a, docs/24; Entwurf 06-zustaende, 15d) */
.gap-reason { display: grid; gap: .25rem; }
.gap-text { display: flex; gap: .4rem; align-items: flex-start; margin: 0; color: var(--fg-default); font-size: .9rem; line-height: 1.45; }
.gap-text svg { flex: none; margin-top: .15rem; color: var(--fg-muted); }
.gap-hint { margin: 0; padding-left: 1.4rem; color: var(--fg-muted); font-size: .85rem; line-height: 1.45; }
.en-decision .gap-text { font-size: .8rem; }
.en-decision .gap-hint { font-size: .8rem; }
.gap-line { display: inline-flex; gap: .3rem; align-items: flex-start; margin-top: .2rem; color: var(--fg-default); font-size: .8rem; font-weight: 500; line-height: 1.35; }
.gap-line svg { flex: none; margin-top: .1rem; color: var(--fg-muted); }

/* Erinnerung vor Schluss (D2, docs/25 Abschnitt 5) */
.lot-rule { width: 100%; margin: .4rem 0; border: 0; border-top: 1px solid var(--border-default); }
.reminder { display: flex; flex-direction: column; gap: .5rem; }
.reminder-title { display: flex; align-items: center; gap: .4rem; margin: 0; font-weight: 500; }
.reminder-title svg { color: var(--fg-muted); }
.reminder.compact .reminder-title { font-size: .85rem; }
.reminder-steps { display: flex; flex-wrap: wrap; gap: 6px; }
.reminder-chip { padding: .25rem .7rem; border: 1px solid var(--border-strong); border-radius: 999px;
  background: var(--bg-surface); color: var(--fg-default); font: inherit; font-size: .85rem; cursor: pointer; }
.reminder-chip[aria-pressed='true'] { background: var(--accent-subtle); border-color: var(--accent-default);
  color: var(--accent-fg); font-weight: 600; }
.reminder-hint { margin: 0; font-size: .75rem; color: var(--fg-subtle); }
.reminder-check { display: flex; align-items: center; gap: .5rem; font-size: .9rem; }
.reminder-toggle { align-self: flex-start; }
.dl-flags .badge svg { vertical-align: -2px; }
.reminder-chip:hover:not(:disabled) { background: var(--bg-subtle); color: var(--fg-default); border-color: var(--border-strong); }
.reminder-chip[aria-pressed='true']:hover:not(:disabled) { background: var(--accent-subtle); color: var(--accent-fg); border-color: var(--accent-default); }

/* Reparaturkosten im Rechenweg (Wunsch F Schritt 2, Entwurf r3_lot_vehicle) */
.lot-repair { display: grid; gap: .4rem; margin-bottom: 1rem; }
.lot-repair h3 { margin: 0; font-size: 1rem; }
.reminder-warn { display: flex; gap: .5rem; padding: .6rem .75rem; border-radius: 10px; background: var(--warning-subtle);
  color: var(--warning-fg); font-size: .8rem; }
.reminder-warn p { margin: 0; }
.reminder-warn svg { flex: none; margin-top: .1rem; }
.reminder-last { margin: 0; font-size: .75rem; color: var(--warning-fg); }
.reminder-chip:disabled:not([aria-pressed='true']) { opacity: .45; cursor: not-allowed; }
.reminder-disclosure { display: flex; flex-direction: column; gap: .5rem; }
.dl-flags-wrap { display: contents; }

/* Automatisch bieten (D1): Einstellungen › Bieten, Kasten am Los */
.switch { position: relative; width: 2.5rem; height: 1.4rem; flex: none; padding: 0; border: 1px solid transparent;
  border-radius: 999px; background: var(--toggle-off); cursor: pointer; }
.switch:hover:not(:disabled) { background: var(--toggle-off); }
.switch[aria-checked='true'], .switch[aria-checked='true']:hover:not(:disabled) { background: var(--accent-default); }
.switch:disabled { opacity: .5; cursor: not-allowed; }
.switch-knob { position: absolute; top: 2px; left: 2px; width: calc(1.4rem - 6px); height: calc(1.4rem - 6px); border-radius: 50%;
  background: var(--white); box-shadow: var(--shadow); transition: transform .15s ease; }
.switch[aria-checked='true'] .switch-knob { transform: translateX(1.1rem); }
.autobid-row, .bid-row { display: flex; align-items: center; justify-content: space-between; gap: .75rem; font-size: .9rem; }
.autobid-go { display: flex; flex-direction: column; gap: .4rem; }
.bid-layout { display: grid; grid-template-columns: minmax(0, 1fr) 24rem; gap: 1.25rem; align-items: start; }
@media (max-width: 1100px) { .bid-layout { grid-template-columns: 1fr; } }
.bid-main, .bid-aside { display: flex; flex-direction: column; gap: 1.25rem; min-width: 0; }
.bid-note { display: flex; gap: .6rem; padding: .8rem 1rem; border-radius: 12px; background: var(--info-subtle); }
.bid-note p { margin: 0; font-size: .85rem; }
.bid-card { display: flex; flex-direction: column; gap: .5rem; }
.bid-head { display: flex; align-items: center; gap: .5rem; }
.bid-head h2 { flex: 1; margin: 0; }
.bid-hint { margin: 0; font-size: .8rem; color: var(--fg-subtle); }
.bid-warn { display: flex; gap: .5rem; margin: 0; padding: .6rem .75rem; border-radius: 10px; background: var(--warning-subtle);
  color: var(--warning-fg); font-size: .8rem; }
.bid-warn p { margin: 0 0 .4rem; }
.bid-warn svg { flex: none; margin-top: .1rem; }
.bid-check { display: flex; align-items: center; gap: .5rem; color: var(--fg-default); }
.bid-credentials { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .6rem; }
.bid-credentials label { display: flex; flex: 1 1 12rem; flex-direction: column; gap: .25rem; font-size: .8rem; color: var(--fg-muted); }
.bid-buttons { display: flex; gap: .4rem; }
.bid-mode { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; }
.bid-mode fieldset { display: flex; gap: 1rem; margin: 0; padding: 0; border: 0; }
.bid-mode legend { float: left; margin-right: .75rem; font-weight: 500; }
.bid-lead { display: flex; align-items: center; gap: .5rem; }
.bid-lead input { width: 5rem; }
.bid-info { display: flex; gap: .4rem; margin: 0; font-size: .8rem; color: var(--fg-subtle); }
.bid-table { width: 100%; font-size: .85rem; border-collapse: collapse; }
.bid-table th, .bid-table td { text-align: left; padding: .35rem .25rem; border-bottom: 1px solid var(--border-default); }
/* Kritikrunde 4 (D1): gesperrt (Notbremse), Zustand der Bremse */
.bid-note.bid-blocked, .reminder-warn.reminder-danger { background: var(--danger-subtle); color: var(--danger-fg); }
.bid-stop-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; }

/* --- Systemzustand › KI › Zugänge (E1, docs/26 §11, Entwurf 15/15b/15c) --- */
.la-page { display: flex; flex-direction: column; gap: 1rem; }
.la-head { display: flex; align-items: flex-end; gap: 1rem; flex-wrap: wrap; }
.la-head h2 { margin: 0 0 .25rem; }
.la-head p { margin: 0; }
.la-push { margin-left: auto; }
.la-page a.button, .la-page button { display: inline-flex; align-items: center; gap: .4rem; }
a.button.ghost { background: transparent; border-color: transparent; color: var(--fg-muted); }
a.button.ghost:hover { background: var(--bg-subtle); }
a.button.small { padding: .25rem .55rem; font-size: .85rem; }
.la-mono { font-family: ui-monospace, "DejaVu Sans Mono", monospace; }
.la-info { background: var(--info-subtle); color: var(--info-fg); }
.la-limit { margin-top: .25rem; }
.la-limit p { margin: .15rem 0 0; }
.la-notice { display: flex; gap: .6rem; padding: .75rem .9rem; border-radius: .6rem; }
.la-notice p { margin: .1rem 0; }
.la-good { background: var(--success-subtle); color: var(--success-fg); }
.la-warn { background: var(--warning-subtle); color: var(--warning-fg); }
.la-bad { background: var(--danger-subtle); color: var(--danger-fg); }
.la-body { display: grid; grid-template-columns: minmax(0, 1fr) 22rem; gap: 1.25rem; align-items: start; }
.la-main, .la-aside { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
.la-provider { display: flex; flex-direction: column; gap: .75rem; }
.la-access { display: flex; flex-direction: column; gap: .6rem; padding: .9rem; border-radius: .6rem; background: var(--bg-subtle); }
.la-access-head { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.la-facts { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin: 0; }
.la-facts > div { min-width: 6rem; }
.la-facts dt { font-size: .8rem; color: var(--fg-muted); }
.la-facts dd { margin: .1rem 0 0; font-size: .9rem; overflow-wrap: anywhere; }
.la-grow { flex: 1 1 12rem; }
.la-budget { width: 11rem; }
.la-budget .llm-bar { margin-top: .3rem; }
.la-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.la-actions form { margin: 0; }
.la-big { font-size: 1.5rem; font-weight: 600; margin: 0 0 .4rem; }
.la-kv { margin: 0; }
.la-kv > div { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem 0; border-bottom: 1px solid var(--border-default); }
.la-kv > div:last-child { border-bottom: 0; }
.la-kv dt { color: var(--fg-muted); font-size: .85rem; }
.la-kv dd { margin: 0; font-size: .85rem; text-align: right; }
.la-events { list-style: none; margin: 0; padding: 0; }
.la-events li { display: flex; flex-direction: column; padding: .4rem 0; }
.la-dialog { border-color: var(--accent-default); box-shadow: var(--shadow); display: flex; flex-direction: column; gap: .75rem; max-width: 40rem; }
.la-dialog-head { display: flex; align-items: center; gap: .5rem; }
.la-dialog-head h3 { margin: 0; }
.la-form { display: flex; flex-direction: column; gap: .75rem; }
.la-form .field { display: flex; flex-direction: column; gap: .25rem; }
.la-form input:not([type='checkbox']), .la-form select { width: 100%; }
.la-pair { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.la-label { font-weight: 500; }
.la-dialog-actions { display: flex; justify-content: flex-end; gap: .5rem; flex-wrap: wrap; margin: 0; }
.llm-api-links { display: flex; flex-direction: column; align-items: flex-end; gap: .2rem; }
select.llm-access { max-width: 12rem; }
@media (max-width: 900px) {
  .la-body { grid-template-columns: 1fr; }
  .la-pair { grid-template-columns: 1fr; }
  .la-budget { width: 100%; }
}

/* --- agy-Konten (E2, docs/26 §21.10, Entwurf 15f–15i) --- */
.la-agy-service { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.la-steps { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 .5rem; padding: 0; list-style: none; }
.la-steps li { padding: .1rem .5rem; border-radius: 999px; background: var(--bg-subtle); color: var(--fg-muted); font-size: .75rem; }
.la-steps li.la-step-on { background: var(--info-subtle); color: var(--info-fg); font-weight: 600; }
.la-login { display: flex; flex-direction: column; gap: .6rem; }
.la-google { justify-content: center; }

/* agy: viele Konten filtern (Nutzerwunsch 2026-11-03) */
.la-agy-filter { flex: 0 1 260px; min-width: 0; }
