/* curveguard.de — die eine Stilquelle der Webseite (UMSETZUNG-WEB § 0 Nr. 1).
   Erzeugt von tools/web/bau.py aus server/cloud/web/teile/stil.css.
   Klassen und Maße 1:1 aus docs/design/vorschlag/web/Webseite.dc.html
   (Stilblock „.ph.web“ ff.); Farben als Rollen, Hell-Fassung aus
   Webseite.hell.dc.html (gleiche Zuordnung je Eigenschaft).
   Hell/Dunkel nur über prefers-color-scheme (§ 0 Nr. 2), kein Umschalter.
   Telefon über Container-Regeln (§ 0 Nr. 3), keine zweite Seite. */
@font-face{font-family:'Inter';src:url('/fonts/inter-400.woff2') format('woff2');font-weight:400 500;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('/fonts/inter-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('/fonts/inter-700.woff2') format('woff2');font-weight:700 800;font-style:normal;font-display:swap}

:root{
  color-scheme:dark;
  --grund:#1A1B17; --blatt:#1F201A; --flaeche:#26271F; --linie:#33342A; --linie-fl:#33342A;
  --linie2:#4A4B3E; --rand3:#8B8878;
  --text:#E8E8DC; --sub:#C4C4B8; --leise:#9A978A; --titel:#F5DEB8;
  --taupe:#B5906A; --taupe-hell:#D4B892; --knopftext:#1A1B17;
  --salbei:#9DC9AC; --warm:#D9BE8C; --amber:#E3B93B; --terra:#D1614A;
  --warm-rand:#5A4E2E; --warm-fl:#2C2820; --gut-rand:#3C4A3F; --alarm-rand:#5A2A20;
  --geraet:#0A0A07; --geraet-rand:#4A4B3E; --schatten:0 24px 60px rgba(0,0,0,.55);
  --qr-hell:#E8E8DC; --qr-dunkel:#1A1B17;
}
@media (prefers-color-scheme: light){
  :root{
    color-scheme:light;
    --grund:#F2EEE4; --blatt:#F9F7F1; --flaeche:#FFFFFF; --linie:#D9D3C4; --linie-fl:#E6E1D5;
    --linie2:#BDB5A3; --rand3:#6B6A5E;
    --text:#1A1B17; --sub:#4A4B3E; --leise:#6B6A5E; --titel:#1A1B17;
    --taupe:#B5906A; --taupe-hell:#5C3F12; --knopftext:#1A1B17;
    --salbei:#4F8A63; --warm:#8A6A2E; --amber:#A67C00; --terra:#C4513A;
    --warm-rand:#E3CFA5; --warm-fl:#FBF3E2; --gut-rand:#B9D6C2; --alarm-rand:#E8B7AA;
    --geraet:#3A3528; --geraet-rand:#BDB5A3;
    --qr-hell:#FFFFFF; --qr-dunkel:#1A1B17;
  }
}

html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--grund);color:var(--text);font-family:'Inter',-apple-system,system-ui,'Segoe UI',sans-serif;font-size:16px;line-height:1.5}
a{color:inherit;text-decoration:none}
a:focus-visible,summary:focus-visible{outline:2px solid var(--taupe);outline-offset:2px;border-radius:6px}
.seite{container-type:inline-size;position:relative;min-height:100vh}
.w{max-width:1180px;margin:0 auto;padding:0 32px;box-sizing:border-box}
.unsichtbar{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Kopf */
.kopfw{display:flex;align-items:center;gap:14px;height:64px;border-bottom:1px solid var(--linie);position:relative}
.kopfw .logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:17px;color:var(--text)}
.kopfw .logo svg{border-radius:8px;flex:none}
.navw{display:flex;gap:4px;margin-left:auto;align-items:center}
.navw a{color:var(--sub);font-size:15px;padding:8px 12px;border-radius:10px;white-space:nowrap}
.navw a.an{color:var(--text);font-weight:600}
.navw .cta{background:var(--taupe);color:var(--knopftext);font-weight:700;padding:9px 16px;border-radius:12px}
.navw .spr{color:var(--leise)}
.burger{display:none;width:44px;height:44px;border:1px solid var(--linie);border-radius:12px;align-items:center;justify-content:center;margin-left:auto;box-sizing:border-box}

/* Typografie */
.held{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;padding:64px 0 56px}
.h1{font-size:56px;font-weight:800;line-height:1.02;letter-spacing:-.02em;color:var(--titel);margin:14px 0 18px}
.h1 span{display:block}
.h1 .rot{color:var(--terra)}
.h2{font-size:34px;font-weight:800;line-height:1.15;letter-spacing:-.015em;color:var(--titel);margin:0 0 10px}
.h3{font-size:20px;font-weight:700;color:var(--text);margin:0 0 6px}
.lead{font-size:19px;color:var(--sub);line-height:1.55;max-width:56ch;margin:0 0 24px}
.mk{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--leise);font-weight:600;display:block}
/* Rahmen: die Marke steht als Zeile (inline) im 16/1.5-Block der Seite = 24 px; in Karten (Flex) 20 px */
.w>.mk,#c-da>.mk,#c-fehler>.mk{line-height:24px}
.pille{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--linie);border-radius:999px;padding:6px 12px;font-size:14px;color:var(--sub);background:var(--blatt)}
.pille i{width:8px;height:8px;border-radius:4px;background:var(--salbei);display:inline-block}
.text{margin:0;color:var(--sub);line-height:1.5}
.text-l{margin:0;color:var(--sub);line-height:1.55}
.klein{color:var(--leise);font-size:14px}

/* Knöpfe */
.knoepfe{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 18px}
.knoepfe.ohne{margin:0}
.kn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;padding:0 20px;border-radius:14px;font-weight:700;font-size:16px;white-space:nowrap;box-sizing:border-box}
.kn svg{flex:none}
.kn.haupt{background:var(--taupe);color:var(--knopftext)}
.kn.rand{border:1px solid var(--linie2);color:var(--text)}
.kn.store{background:#000000;color:#FFFFFF;border:1px solid #4A4B3E}
.kn.store small{font-weight:500;color:#C4C4B8;font-size:13px}
.kn.anfang{align-self:flex-start}
.fakten{display:flex;flex-wrap:wrap;gap:8px 20px;color:var(--sub);font-size:14px}
.fakten span{display:inline-flex;align-items:center;gap:6px}
.fakten svg{flex:none;stroke:var(--salbei)}

/* Flächen */
.karte{background:var(--flaeche);border:1px solid var(--linie);border-radius:18px}
.band{background:var(--blatt);border-top:1px solid var(--linie);border-bottom:1px solid var(--linie);padding:20px 0}
.band .w{color:var(--sub);line-height:1.55}
.band b{color:var(--text)}
.drei{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:20px}
.drei .karte{padding:22px;display:flex;flex-direction:column;gap:12px}
.zwei{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.raster2{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.abschnitt{padding-top:56px;padding-bottom:56px}
.tafel{padding:22px;display:flex;flex-direction:column;gap:12px}
.tafel.reihe{flex-direction:row;align-items:center;gap:24px;flex-wrap:wrap}
.warm{border-color:var(--warm-rand);background:var(--warm-fl)}
.warm .h3{color:var(--warm)}
.gut{border-color:var(--gut-rand)}
.alarm{border-color:var(--alarm-rand)}
.haken{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.haken li{display:flex;gap:10px;color:var(--sub);font-size:15px;line-height:1.45}
.haken li:before{content:'';width:16px;height:16px;flex:none;margin-top:3px;border-radius:4px;background:var(--salbei)}
.schmal{max-width:820px}

/* Telefone mit Bildschirmfoto (Maße aus den Rahmen) */
.mitte{display:flex;justify-content:center}
.geraet{background:var(--geraet);border:1px solid var(--geraet-rand);padding:8px;box-sizing:border-box;flex:none;box-shadow:var(--schatten)}
.geraet img{display:block;width:100%;height:100%;object-fit:cover}
.geraet .schirm{overflow:hidden;width:100%;height:100%}
.tel-gross{width:316px;height:665px;border-radius:43px}
.tel-gross .schirm{border-radius:35px}
.tel-mittel{width:236px;height:492px;border-radius:34px}
.tel-mittel .schirm{border-radius:26px}
.tel-klein{width:216px;height:449px;border-radius:32px}
.tel-klein .schirm{border-radius:24px}
.drei .mitte{padding:6px 0 4px}
.lizenz{font-size:12px;color:var(--leise);text-align:center;margin:6px 0 0}
.funktion{display:grid;grid-template-columns:240px 1fr;gap:20px;padding:22px;align-items:center}
.funktionen{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:16px}

/* Preise */
.preis{display:flex;flex-direction:column;gap:6px;padding:22px}
.preis .betrag{font-size:40px;font-weight:800;color:var(--titel);letter-spacing:-.02em}
.preis .betrag small{font-size:16px;color:var(--leise);font-weight:500;margin-left:6px}
.preis.premium{border-color:var(--taupe)}
.preis.premium .mk{color:var(--taupe-hell)}
.preis .dauer{color:var(--leise)}
.preis .monat{color:var(--text);font-size:17px;font-weight:600}
.preis .monat small{color:var(--leise);font-weight:500;font-size:14px}
.preis .appkauf{color:var(--leise);font-size:14px;font-weight:400;margin-top:8px}
.tabkarte{margin-top:20px;padding:6px 10px 10px}
.tabelle{width:100%;border-collapse:collapse;font-size:15px}
.tabelle th,.tabelle td{padding:12px 14px;border-top:1px solid var(--linie);text-align:left;vertical-align:top}
.tabelle th.g{color:var(--leise);font-size:13px;letter-spacing:.06em;text-transform:uppercase;padding-top:20px}
.tabelle th.z{font-weight:500;color:var(--text)}
.tabelle .m{text-align:center;color:var(--sub)}
.tabelle .p{text-align:center;color:var(--taupe-hell);font-weight:700}
.tabelle thead .m{color:var(--leise)}
.ja{display:inline-block;width:14px;height:14px;border-radius:4px;background:var(--salbei)}
.nein{display:inline-block;width:14px;height:2px;background:var(--linie2);vertical-align:middle}
.unter{color:var(--leise);font-size:14px;margin-top:12px}

/* Rechtsseiten (W-07): Titel 34, Abschnitte Kopf 17 / Text 16 */
.recht{max-width:860px}
.recht .pillen{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 16px}
.recht .hinweis{color:var(--warm);font-size:15px;margin:0 0 12px}
.recht .abschn{display:flex;flex-direction:column;gap:18px}
.recht .abschn h2,.recht .abschn h3{font-size:17px;font-weight:700;color:var(--text);margin:0;line-height:1.4;scroll-margin-top:16px}
.recht .abschn h3{color:var(--sub)}
.recht .abschn section{display:flex;flex-direction:column;gap:4px}
.recht .abschn p,.recht .abschn li{margin:0;color:var(--sub);line-height:1.55}
.recht .abschn p+p{margin-top:8px}
.recht .abschn ul{margin:4px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:6px}
.recht .abschn a{color:var(--taupe-hell)}
.recht .stand{color:var(--leise);font-size:14px;margin:0}
.recht .tab{overflow-x:auto;margin:6px 0 2px}
.recht table{border-collapse:collapse;font-size:15px;width:100%}
.recht th,.recht td{border-top:1px solid var(--linie);padding:8px 10px 8px 0;text-align:left;vertical-align:top;color:var(--sub);line-height:1.45}
.recht th{color:var(--text);font-weight:600}

/* Status (W-13) */
.status-liste{display:flex;flex-direction:column;gap:8px;margin:12px 0 0;padding:0;list-style:none}
.status-liste li{padding:14px 16px;display:flex;align-items:center;gap:12px}
.status-liste .punkt{width:10px;height:10px;border-radius:5px;background:var(--salbei);flex:none}
.status-liste .punkt.warm{background:var(--warm)}
.status-liste .name{flex:1;color:var(--text)}
.status-liste .wert{color:var(--leise);font-size:14px}
.status-leer{color:var(--leise)}

/* App laden (W-14): QR lokal als SVG */
.qr{width:96px;height:96px;flex:none;border-radius:8px;background:var(--qr-hell);display:block}
.qr rect{fill:var(--qr-dunkel)}
.qrtext{display:flex;flex-direction:column;gap:10px}
.qrtext b{color:var(--text)}

/* Fuß */
.fuss{text-align:center;border-top:1px solid var(--linie);padding:28px 0 36px;display:flex;flex-wrap:wrap;gap:12px 28px;color:var(--leise);font-size:14px;align-items:center}
.fuss a{color:var(--taupe-hell)}
.fuss .kuend{margin-left:auto;border:1px solid var(--rand3);background:var(--linie-fl);color:var(--text);border-radius:10px;padding:8px 14px;font-weight:600}

/* Sprachwahl L-01 und Menü — ohne Skript über :target */
.ebene{display:none}
.ebene:target{display:block}
#sprache.ebene{position:absolute;right:32px;top:60px;width:720px;padding:16px 18px 18px;box-shadow:0 24px 60px rgba(0,0,0,.55);z-index:2;box-sizing:border-box}
.ebene .eb-kopf{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;gap:12px}
.ebene .eb-titel{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--leise);font-weight:600;margin:0}
.ebene .eb-satz{color:var(--leise);font-size:13px}
.ebene .eb-zu{display:none;height:40px;padding:0 12px;font-size:14px}
.sprachen{display:grid;grid-template-columns:repeat(4,1fr);gap:6px 14px;font-size:15px}
.sprachen a{color:var(--sub);padding:6px 8px;border-radius:8px}
.sprachen a.an{color:var(--text);font-weight:700;background:var(--flaeche)}
/* W-01mT: Karte unter dem Kopf über dem Inhalt (links/rechts 12, oben 5 unter dem Kopf);
   Tipp daneben (.menue-weg, ganze Fläche) oder ✕ schließt. Kein Hintergrund — der Inhalt bleibt sichtbar. */
#menue.ebene{position:absolute;left:0;right:0;top:65px;z-index:3;min-height:100vh}
#menue .menue-weg{position:absolute;inset:0}
#menue .menuekarte{position:absolute;left:12px;right:12px;top:5px;z-index:1;padding:8px 0;display:flex;flex-direction:column}
#menue .menueliste{display:flex;flex-direction:column}
#menue .menueliste a{display:block;padding:13px 20px;font-size:17px;font-weight:600;color:var(--text)}
#menue .menueliste a[href="#sprache"]{font-size:16px;font-weight:400;color:var(--sub)}
#menue .menue-store{padding:8px 16px 12px}
#menue .menue-store .kn{padding:0 10px;gap:6px}
#menue .menue-store .kn small{font-size:11px}

/* Zustandsseiten (W-10b/c/d, W-12b, W-16): .w mit 24/40, Spalte 560 mit Abstand 12 */
.w.zustand{padding-top:24px;padding-bottom:40px}
.spalte560{max-width:560px;display:flex;flex-direction:column;gap:12px}
.saetze,.saetze li{display:inline}
.saetze{list-style:none;padding:0;margin:0}
/* W-10e: das Datumsfeld erscheint nur bei „Zu einem Datum“ (ohne Skript) */
.feld input.datum{display:none}
/* W-11d: eigene Seite „Kopie deiner Daten“ — ohne Marke, Rahmenbreite wie W-12b/W-16 */
.konto:has(#tafel-daten:not([hidden])),.konto:has(#tafel-daten-fertig:not([hidden])){max-width:1180px;padding-top:24px;padding-bottom:40px}
.konto:has(#tafel-daten:not([hidden])) > .mk,.konto:has(#tafel-daten-fertig:not([hidden])) > .mk{display:none}
/* W-12b: Einladung gilt nicht mehr */
#crew:has(#c-weg:not([hidden])){max-width:1180px;padding-top:24px;padding-bottom:40px}
.formular:has(#k-zum:checked) .feld input.datum{display:block}

@container (max-width: 700px){
  .w{padding:0 16px}
  .navw{display:none} .burger{display:flex}
  .held{grid-template-columns:1fr;gap:24px;padding:28px 0 32px}
  .h1{font-size:40px} .h2{font-size:28px} .lead{font-size:17px}
  .drei,.zwei,.raster2,.funktionen{grid-template-columns:1fr}
  .funktion{grid-template-columns:1fr}
  .tel-gross{width:266px;height:557px;border-radius:37px}
  .tel-gross .schirm{border-radius:29px}
  .fuss .kuend{margin-left:0}
  /* BB2 E3: Tippflächen im Fuß auf dem Telefon — Polster, nicht größere Schrift:
     Zeile 21 (Schrift 14 × 1,5) + 2 × 12 = 45 px, zwischen zwei Zeilen 8 px (Rand 4 + 4), neben
     einander bleibt der Abstand des Trenners (≥ 8 px, kein seitliches Polster). */
  .fuss a{display:inline-block;padding:12px 0;margin:4px 0}
  .fuss .kuend{padding:11px 14px;margin:4px 0}
  .abschnitt{padding-top:32px;padding-bottom:32px}
  .tabelle{font-size:14px} .tabelle th,.tabelle td{padding:10px 8px}
  .sprachen{grid-template-columns:1fr 1fr}
  #sprache.ebene{position:absolute;left:0;right:0;top:65px;width:auto;min-height:100vh;background:var(--grund);border:0;border-top:1px solid var(--linie);border-radius:0;box-shadow:none;padding:20px 16px 30px}
  .ebene .eb-titel{font-size:24px;font-weight:800;letter-spacing:-.015em;text-transform:none;color:var(--titel)}
  .ebene .eb-kopf{margin-bottom:12px}
  .ebene .eb-zu{display:inline-flex}
  .ebene .eb-satz{display:block;margin-bottom:12px}
  #sprache .eb-kopf .eb-satz{display:none}
}
@container (min-width: 701px){
  #sprache .eb-unten{display:none}
}

/* Hilfsklassen statt Stilattributen (CSP style-src 'self') */
.oben12{margin-top:12px} .oben16{margin-top:16px} .oben20{margin-top:20px}
.unten40{padding-bottom:40px}
.zwei.oben20{align-items:start}
.spalte16{display:flex;flex-direction:column;gap:16px}
.schmal620{max-width:620px} .schmal720{max-width:720px}
.kn-anfang{align-self:flex-start}
/* Auf/Zu ohne Skript: der offene Zustand ist :target, der Knopf wechselt mit */
.spr-zu,.burger-zu{display:none}
.seite:has(#sprache:target) .spr-auf{display:none}
.seite:has(#sprache:target) .spr-zu{display:inline-block}
.seite:has(#menue:target) .burger-auf{display:none}
@container (max-width: 700px){
  .seite:has(#menue:target) .burger-zu{display:flex}
}
.recht .vorspann{margin-bottom:18px}
.drei .lizenz{order:9;margin-top:auto;text-align:left}
.recht .abschn h3{margin-top:10px}

/* Formulare (W-10, W-11) — Maße aus .feld/.in/.kn.frage der Rahmen.
   Ohne Skript: die Wahl-Chips sind Radioknöpfe mit Etikett (:checked). */
.formular{gap:12px}
.feld{display:flex;flex-direction:column;gap:6px;border:0;margin:0;padding:0;min-width:0}
.feld>label,.feld>legend{font-size:14px;color:var(--taupe-hell);padding:0}
.feld>legend{margin-bottom:6px}
.feld .in{min-height:52px;border:1px solid var(--linie2);border-radius:12px;background:var(--grund);padding:0 14px;color:var(--text);font:inherit;font-size:16px;box-sizing:border-box;width:100%}
.feld textarea.in{height:94px;min-height:94px;padding-top:12px;padding-bottom:0;resize:vertical}
.feld .in::placeholder{color:var(--leise)}
.feld input[type=date].in{height:52px}
.feld .in:focus{outline:2px solid var(--taupe);outline-offset:1px}
.wahl{display:flex;gap:8px;flex-wrap:wrap}
.wahl input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.wahl label{cursor:pointer;font-weight:700}
.wahl input:checked+label{border-color:var(--taupe);color:var(--text)}
.wahl input:focus-visible+label{outline:2px solid var(--taupe);outline-offset:2px}
button.kn{font:inherit;font-weight:700;font-size:16px;cursor:pointer;border:0}
.kn.frage{background:var(--linie-fl);border:1px solid var(--rand3);color:var(--text)}
.breit200{min-width:200px}
.hinweis-k{margin:0;color:var(--leise);font-size:14px;line-height:1.5}
.angaben{margin:0;display:flex;flex-direction:column;gap:10px}
.angaben div{display:grid;grid-template-columns:180px 1fr;gap:12px}
.angaben dt{color:var(--leise);font-size:14px;padding-top:2px}
.angaben dd{margin:0;color:var(--text);white-space:pre-wrap;overflow-wrap:anywhere}
.liste{margin:0;padding-left:20px;color:var(--text);display:flex;flex-direction:column;gap:6px}
@container (max-width: 700px){
  .angaben div{grid-template-columns:1fr;gap:2px}
  .wahl label{white-space:normal;text-align:center;height:auto;min-height:52px;padding-top:10px;padding-bottom:10px}
}

/* Konto (W-11a–c, WB3–WB5): Maße aus den Rahmen */
.schmal560{max-width:560px}
.englisch{color:var(--rand3);font-size:14px;margin:14px 0 0;border-top:1px solid var(--linie);padding-top:10px}
.reihe10{display:flex;gap:10px;align-items:center}
.reihe10 b{color:var(--text)}
.hinweis-k.laut{color:var(--text)}
button.kn:disabled{opacity:.55;cursor:default}
.konto .knoepfe.ohne{gap:10px}
[hidden]{display:none !important}

/* Geteilt (W-15a–e): Maße aus .kartew/.card/.kachel der Rahmen */
.geteilt{padding-top:24px;padding-bottom:40px}
.teiler{display:flex;align-items:center;gap:10px}
.teiler .kreis{width:40px;height:40px;border-radius:50%;background:var(--grund);border:1px solid var(--linie);display:flex;align-items:center;justify-content:center;flex:none}
.teiler .kreis svg{width:22px;height:22px}
.teiler b{color:var(--text)}
.t14{font-size:14px} .leise{color:var(--leise)} .sub{color:var(--sub)}
.g-titel{margin:12px 0 4px}
.g-unter{margin:0 0 12px}
.g-raster{display:grid;grid-template-columns:1.2fr .8fr;gap:20px;align-items:start}
.spalte12{display:flex;flex-direction:column;gap:12px;min-width:0}
.kartew{position:relative;overflow:hidden;border-radius:18px;border:1px solid var(--linie);background:var(--grund)}
.g-karte{height:460px}
.g-lizenz{margin:-6px 0 0}
.card{background:var(--flaeche);border:1px solid var(--linie);border-radius:16px}
.zahlen{display:flex;padding:0 2px;flex:none}
.kachel{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 4px}
.kachel b{font-size:20px;font-weight:800;color:var(--titel);font-variant-numeric:tabular-nums}
.kachel span{font-size:14px;color:var(--leise)}
.zeilen15{line-height:1.5;margin:0}
.zahlkreis{width:36px;height:36px;border-radius:50%;background:var(--flaeche);border:1px solid var(--linie);display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--sub);flex:none}
.g-app{flex-direction:row;align-items:center;gap:16px;flex-wrap:wrap}
.g-app-text{flex:1;min-width:220px}
.g-app-text b{color:var(--text)}
@container (max-width: 700px){
  .g-raster{grid-template-columns:1fr}
  .g-karte{height:300px}
}

/* Crew-Einladung (W-12) */
.reihe12{display:flex;gap:12px;align-items:center}
.spalte2{display:flex;flex-direction:column;gap:2px;min-width:0}
.spalte2 b{color:var(--text)}