/* erzeugt von bau-rechner.mjs, nicht von Hand ändern */
:root {
  color-scheme: light;
  --mt-font: 'Geist', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --mt-font-display: var(--mt-font);
  --mt-font-mono: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  --mt-bg: #ffffff;
  --mt-surface: #ffffff;
  --mt-surface-2: #f5f6f8;
  --mt-border: #e4e6eb;
  --mt-border-strong: #c8ccd4;
  --mt-text: #15171c;
  --mt-muted: #5a6170;
  --mt-faint: #6f7685;
  --mt-accent: #1a4fd6;
  --mt-accent-hover: #143fae;
  --mt-accent-soft: #e8eefc;
  --mt-accent-ink: #ffffff;
  --farbe: var(--mt-accent);
  --farbe-knopf: var(--mt-accent);
  --mt-gruen: #0f6b3f;
  --mt-gruen-soft: #e6f4ec;
  --mt-warn: #7a4a00;
  --mt-warn-soft: #fff4e0;
  --mt-fehler: #b3261e;
  --mt-fehler-soft: #fdecec;
  --mt-radius: 10px;
  --mt-radius-s: 6px;
  --mt-shadow: none;
  --mt-shadow-hoch: 0 8px 24px rgba(21, 23, 28, .12);
  --mt-breite: 1200px;
  --mt-lese: 72ch;
  --mt-rand: clamp(16px, 4vw, 32px);
  --mt-kopf-h: 64px;
  --mt-s1: 4px; --mt-s2: 8px; --mt-s3: 12px; --mt-s4: 16px; --mt-s5: 24px; --mt-s6: 32px; --mt-s7: 48px; --mt-s8: 64px;
  --mt-ease-out: cubic-bezier(.23, 1, .32, 1);
  --mt-dauer-kurz: 120ms;
  --mt-dauer: 180ms;
  /* Redesign Agentur (25.10.2026): Bühnenfarben der Startseite, zweiter Tonbandton */
  --mt-buehne: #1a4fd6;
  --mt-buehne-2: #15171c;
  --mt-ton-2: #eceef2;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;padding:6px;background:transparent;color:var(--mt-text);font:400 1rem/1.6 var(--mt-font)}
:root{--farbe:#0fa5a0;--farbe-knopf:color-mix(in srgb,var(--farbe) 65%,#000)}
.sr-nur{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
h2,h3{font-family:var(--mt-font-display)}
.mt-w-raster { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: start; }
.mt-w-karte { min-width: 0; background: var(--mt-surface); border: 1px solid var(--mt-border); border-radius: var(--mt-radius); padding: 24px; }
.mt-w-karte > h2 { font-size: 1.0625rem; line-height: 1.35; margin: 0 0 4px; }
.mt-w-karte > .mt-w-hinweis { margin: 0 0 16px; }
.mt-w-karte p { color: var(--mt-text); }   /* Fließtext; Meta-Angaben setzen --mt-muted über eigene Klassen weiter unten */
.mt-w-feld { display: grid; gap: 6px; margin-bottom: 14px; min-width: 0; }
.mt-w-feld > span { font-weight: 500; font-size: .875rem; }
.mt-w-feld small { color: var(--mt-muted); font-size: .8125rem; font-weight: 400; }
.mt-w-feld input, .mt-w-feld select, .mt-w-feld textarea { width: 100%; min-width: 0; min-height: 40px; padding: 8px 12px; border: 1px solid var(--mt-border-strong); border-radius: var(--mt-radius-s); background: var(--mt-surface); font: inherit; font-size: 16px; color: var(--mt-text); font-variant-numeric: tabular-nums; transition: border-color var(--mt-dauer-kurz) var(--mt-ease-out); }
.mt-w-feld textarea { min-height: 120px; resize: vertical; }
.mt-w-feld input:focus, .mt-w-feld select:focus, .mt-w-feld textarea:focus { border-color: var(--mt-accent); }
.mt-w-feld input::placeholder, .mt-w-feld textarea::placeholder { color: var(--mt-faint); }
.mt-w-feld input:disabled, .mt-w-feld select:disabled, .mt-w-feld textarea:disabled { opacity: .5; cursor: not-allowed; }
.mt-w-feld[data-fehler] input, .mt-w-feld[data-fehler] select, .mt-w-feld[data-fehler] textarea { border-color: var(--mt-fehler); }
.mt-w-wahl-titel { font-weight: 500; font-size: .875rem; color: var(--mt-text); }
.mt-w-wahl { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; }
.mt-w-wahl button { min-height: 40px; padding: 0 14px; border-radius: var(--mt-radius-s); border: 1px solid var(--mt-border-strong); background: var(--mt-surface); font: inherit; font-weight: 500; font-size: .875rem; cursor: pointer; color: var(--mt-text); touch-action: manipulation; user-select: none; -webkit-user-select: none; transition: background-color var(--mt-dauer-kurz) var(--mt-ease-out), border-color var(--mt-dauer-kurz) var(--mt-ease-out), transform var(--mt-dauer-kurz) var(--mt-ease-out); }
.mt-w-wahl button:active { transform: scale(.97); }
.mt-w-wahl button[aria-pressed='true'] { background: var(--farbe-knopf, var(--mt-accent)); border-color: var(--farbe-knopf, var(--mt-accent)); color: var(--mt-accent-ink); }
.mt-w-wahl button:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.mt-w-wahl--gleich { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
.mt-w-wahl--gleich button { padding: 6px 10px; line-height: 1.2; }
.mt-w-knopf { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 0 16px; border-radius: var(--mt-radius-s); border: 1px solid var(--farbe-knopf, var(--mt-accent)); background: var(--farbe-knopf, var(--mt-accent)); color: var(--mt-accent-ink); font: inherit; font-size: .9375rem; font-weight: 500; line-height: 1.2; cursor: pointer; touch-action: manipulation; user-select: none; -webkit-user-select: none; transition: background-color var(--mt-dauer-kurz) var(--mt-ease-out), border-color var(--mt-dauer-kurz) var(--mt-ease-out), transform var(--mt-dauer-kurz) var(--mt-ease-out); }
.mt-w-knopf:active { transform: scale(.97); }
.mt-w-knopf:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.mt-w-knopf--leise { background: var(--mt-surface); color: var(--mt-text); border-color: var(--mt-border-strong); }
.mt-w-knoepfe { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; min-width: 0; }
.mt-w-ablage { position: relative; display: grid; place-items: center; align-content: center; gap: 8px; min-height: 190px; padding: 24px; border: 1.5px dashed var(--mt-border-strong); border-radius: var(--mt-radius); background: var(--mt-surface-2); text-align: center; cursor: pointer; min-width: 0; overflow-wrap: anywhere; transition: background-color var(--mt-dauer-kurz) var(--mt-ease-out), border-color var(--mt-dauer-kurz) var(--mt-ease-out); }
.mt-w-ablage[data-ueber] { background: var(--mt-accent-soft); border-color: var(--mt-accent); }
.mt-w-ablage strong { font-size: 1rem; font-weight: 600; }
.mt-w-ablage span { color: var(--mt-muted); font-size: .875rem; }
.mt-w-ablage svg { color: var(--mt-accent); }
.mt-w-ablage input { position: absolute; inset: 0; width: 100%; opacity: 0; cursor: pointer; }
.mt-w-ablage:focus-within { outline: 2px solid var(--mt-accent); outline-offset: 2px; }   /* Fokus der unsichtbaren Datei-Auswahl am Rahmen zeigen */
.mt-w-ergebnis { font-variant-numeric: tabular-nums; position: relative; min-width: 0; overflow: hidden; border-radius: var(--mt-radius); padding: 20px; background: var(--mt-surface-2); overflow-wrap: anywhere; transition: opacity var(--mt-dauer) var(--mt-ease-out); }
.mt-w-wert { font-family: var(--mt-font-display); font-size: 1.75rem; font-weight: 600; letter-spacing: 0; line-height: 1.1; color: var(--mt-text); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.mt-w-wert-label { color: var(--mt-muted); font-size: .8125rem; font-weight: 500; }
.mt-w-tabelle { width: 100%; border-collapse: collapse; margin-top: 16px; font-size: .9375rem; font-variant-numeric: tabular-nums; }
.mt-w-tabelle th, .mt-w-tabelle td { text-align: left; padding: 8px 6px; border-bottom: 1px solid var(--mt-border); overflow-wrap: anywhere; }
.mt-w-tabelle th { font-size: .75rem; font-weight: 500; color: var(--mt-muted); hyphens: manual; overflow-wrap: normal; word-break: normal; }   /* Kopf bricht nur an Leerzeichen, nie mitten im Wort */
.mt-w-tabelle td { font-variant-numeric: tabular-nums; hyphens: auto; overflow-wrap: break-word; }   /* schmale Spalten: Silbentrennung statt Bruch mitten im Wort */
.mt-w-tabelle td:last-child, .mt-w-tabelle th:last-child { text-align: right; }
.mt-w-tabelle tfoot th, .mt-w-tabelle tfoot td, .mt-w-tabelle .mt-w-summe th, .mt-w-tabelle .mt-w-summe td { font-size: .9375rem; font-weight: 600; color: var(--mt-text); border-top: 2px solid var(--mt-border-strong); }
.mt-w-tabelle-wrap { max-width: 100%; overflow-x: auto; }   /* Wrapper für breite Tabellen */
.mt-w-leer { display: grid; place-items: center; min-height: 220px; text-align: center; color: var(--mt-muted); border: 1px dashed var(--mt-border-strong); border-radius: var(--mt-radius); padding: 20px; min-width: 0; }
.mt-w-hinweis { color: var(--mt-text); font-size: .875rem; }
.mt-w-warnung, .mt-w-info, .mt-w-fehler { margin: 12px 0 0; padding: 10px 12px; border-radius: var(--mt-radius-s); border: 1px solid; font-size: .875rem; line-height: 1.5; overflow-wrap: anywhere; }
.mt-w-warnung { background: var(--mt-warn-soft); border-color: color-mix(in srgb, var(--mt-warn) 30%, transparent); color: var(--mt-warn); }
.mt-w-info { background: var(--mt-accent-soft); border-color: color-mix(in srgb, var(--mt-accent) 30%, transparent); color: var(--mt-accent-hover); }
.mt-w-fehler { background: var(--mt-fehler-soft); border-color: color-mix(in srgb, var(--mt-fehler) 30%, transparent); color: var(--mt-fehler); }
.mt-w-warnung a, .mt-w-info a, .mt-w-fehler a { color: inherit; text-decoration: underline; }
.mt-w-fortschritt { height: 6px; border-radius: var(--mt-radius-s); background: var(--mt-surface-2); overflow: hidden; }
.mt-w-fortschritt > i { display: block; height: 100%; background: var(--mt-accent); border-radius: inherit; transition: width var(--mt-dauer) var(--mt-ease-out); }
.mt-w-schritte { display: flex; gap: 8px 16px; margin: 0 0 16px; padding: 0; counter-reset: s; flex-wrap: wrap; }
.mt-w-schritte li { list-style: none; counter-increment: s; display: inline-flex; align-items: center; gap: 8px; font-size: .875rem; color: var(--mt-muted); font-weight: 500; }
.mt-w-schritte li::before { content: counter(s); display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--mt-surface-2); font-size: .75rem; font-variant-numeric: tabular-nums; }
.mt-w-schritte li[data-aktiv]::before { background: var(--farbe-knopf, var(--mt-accent)); color: var(--mt-accent-ink); }
.mt-w-schritte li[data-aktiv] { color: var(--mt-text); }
.mt-w-ohne-rand.mt-w-ohne-rand { margin: 0; }  /* vor abstand/unten: Kombination ergibt z. B. margin N 0 0 */
.mt-w-abstand-1.mt-w-abstand-1 { margin-top: 8px; }
.mt-w-abstand-2.mt-w-abstand-2 { margin-top: 16px; }
.mt-w-abstand-3.mt-w-abstand-3 { margin-top: 24px; }
.mt-w-abstand-4.mt-w-abstand-4 { margin-top: 32px; }
.mt-w-unten-1.mt-w-unten-1 { margin-bottom: 8px; }
.mt-w-unten-2.mt-w-unten-2 { margin-bottom: 16px; }
.mt-w-unten-3.mt-w-unten-3 { margin-bottom: 24px; }
.mt-w-ohne-oben.mt-w-ohne-oben { margin-top: 0; }
.mt-w-ohne-unten.mt-w-ohne-unten { margin-bottom: 0; }
.mt-w-rechts.mt-w-rechts { text-align: right; }
.mt-w-links.mt-w-links { text-align: left; }
.mt-w-mitte.mt-w-mitte { text-align: center; }
.mt-w-klapp.mt-w-klapp { cursor: pointer; font-weight: 600; }
.mt-w-mono.mt-w-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.mt-w-zeile { display: flex; gap: 12px; min-width: 0; flex-wrap: wrap; align-items: center; }
.mt-w-zeile--eng.mt-w-zeile--eng { gap: 8px; flex-wrap: nowrap; }
.mt-w-hakenzeile { display: flex; gap: 10px; align-items: flex-start; min-width: 0; cursor: pointer; }
.mt-w-hakenzeile--mitte.mt-w-hakenzeile--mitte { align-items: center; }
.mt-w-sr-nur { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.mt-w-knopf:not(.mt-w-knopf--leise){background:#0b7c78}
.mt-w-wahl button[aria-pressed='true']{background:#0b7c78;border-color:#0b7c78}
.mt-med-kopf{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.mt-med-eintrag{border:1px solid var(--mt-border-strong);border-radius: 10px;padding:14px;margin-top:12px;background:var(--mt-surface)}
.mt-med-eintrag h3{margin:0 0 10px;font-size:.95rem}
.mt-med-gitter{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px 12px}
.mt-med-gitter .mt-w-feld{margin:0}
.mt-med-dosis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:10px}
.mt-med-dosis .mt-w-feld{margin:0}
.mt-med-dosis input{text-align:center}
.mt-med-lab{font-weight:600;font-size:.9rem}
.mt-med-lab small{color:var(--mt-muted);font-weight:400}
.mt-med-zaehler{font-size:.78rem;color:var(--mt-muted);font-weight:400;text-align:right}
.mt-med-zaehler[data-rot]{color:#b3202a;font-weight:700}
.mt-med-warnung{font-size:.84rem;color:#7a4a00}
.mt-med-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mt-med-leiste{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.mt-med-leiste button{min-height:40px}
.mt-med-klein{font-size:.85rem}
.mt-med-warn{margin:8px 0 0}
.mt-med-gruppe-kopf{display:flex;flex-wrap:wrap;gap:10px;align-items:end;justify-content:space-between}
.mt-med-check{display:flex;align-items:center;gap:10px;margin:10px 0}
.mt-med-check input{width:22px;height:22px;flex:none}
.mt-med-zusammen{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:.92rem;margin:0 0 6px}
@media (max-width:560px){.mt-med-dosis{grid-template-columns:repeat(2,minmax(0,1fr))}.mt-med-gitter{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media (max-width:380px){.mt-med-gitter{grid-template-columns:minmax(0,1fr)}}
