/* Saunasplash · Calma Ritualsauna – öffentliche Seite und Aushang
   Baut auf basis.css auf. Handy zuerst (390 px), breit ab 1000 px. */

/* ===== Kopf der Seite: Titel mittig, darunter wann · wo ===== */
.kopf{text-align:center;padding-block:22px 18px}
.kopf h1{font-size:38px;line-height:1.04;font-weight:600;letter-spacing:-.012em}
.kopf-zeile{margin-block-start:8px;font-size:16px;font-weight:400;color:var(--ink-stoff-2)}
.laden{padding:48px 0;text-align:center;color:var(--ink-stoff-2)}
.hinweis{display:flex;align-items:flex-start;gap:10px;margin-block-start:14px;padding:12px 14px;border-radius:16px;background:var(--surface);font-size:15px}
.hinweis.warn{box-shadow:inset 0 0 0 1.5px var(--warnung);color:var(--warnung)}

/* ===== Läuft gerade | Als Nächstes ===== */
.jetzt-reihe{display:grid;gap:20px}
.jetzt-spalte{display:grid;grid-template-rows:auto 1fr;gap:8px;min-inline-size:0}
.bereich{display:flex;align-items:center;gap:8px;font-size:17px;line-height:1.3;font-weight:500;color:var(--ink-stoff-2)}
.jetzt-spalte.laeuft .bereich{color:var(--ink)}
.jetzt-spalte > .box,.jetzt-spalte > .ruhe-karte{block-size:100%}
.box.gross{border-radius:28px;padding:18px 20px 20px}
.box.gross .zeit{font-size:28px}
.box.gross .zeit .bis{font-size:22px}
.box.gross .box-kopf{padding-inline-end:72px}
.box.gross .stueck{inline-size:62px;inset-block-start:20px;inset-inline-end:18px}
.box.gross .name{font-size:29px;line-height:1.12;font-weight:600;margin-block-start:10px}
.box.gross .wer{font-size:17px}
.box.gross .text{font-size:17px}
.box.gross .zutaten{max-block-size:48px}
.box.gross .zutaten li{block-size:48px;font-size:16px}
.box.gross .zutat-bild{inline-size:42px;block-size:42px}
.jetzt-spalte.naechster .box .name{font-size:23px}
.ruhe-karte{display:flex;align-items:center;gap:16px;min-block-size:150px;padding:22px 20px 24px;border-radius:24px;
  background:var(--surface);border:1px solid var(--line);box-shadow:var(--schatten)}
.ruhe-inhalt{flex:1;display:grid;justify-items:start;gap:8px;min-inline-size:0}
.ruhe-kuppel{inline-size:64px;flex:none;align-self:flex-start}
.ruhe-kuppel .f{stroke-width:.7px}
.ruhe-symbol{display:grid;place-items:center;inline-size:48px;block-size:48px;border-radius:50%;background:var(--tonal);color:var(--ink)}
.ruhe-text{font-size:21px;line-height:1.28;font-weight:500;text-wrap:balance}
.ruhe-text.lang{font-size:18px;line-height:1.4;font-weight:500;text-wrap:pretty}
.ruhe-unter{font-size:16px;color:var(--ink-2);font-weight:500;font-variant-numeric:tabular-nums}

/* ===== Band mit den Eckdaten – über die ganze Breite ===== */
.info-band{margin-block-start:20px;padding:12px 16px;border-radius:22px;background:var(--tonal);color:var(--ink);box-shadow:var(--kante)}
.info-band ul{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 22px}
.info-band li{display:inline-flex;align-items:center;gap:8px;min-block-size:36px;font-size:16px;font-weight:500}
.info-band .ic{color:var(--dome)}

/* ===== Plan ===== */
.plan{margin-block-start:40px}
.abschnitt-titel{font-size:28px;line-height:1.15;font-weight:600}
.plan-hinweis{display:flex;align-items:center;gap:8px;margin-block-start:6px;font-size:15px;color:var(--ink-stoff-2)}
/* Handy: Reiter für die Tage – das Wort relativ zu heute steht im Reiter */
.tage-reiter{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-block-start:14px}
.reiter{position:relative;display:grid;justify-items:start;align-content:start;min-block-size:104px;padding:10px 12px 10px;border:1.5px solid var(--line);
  border-radius:20px;background:var(--surface);text-align:start;color:var(--ink)}
.reiter .kuppel-svg{inline-size:42px;margin-block-end:6px}
.reiter .f{stroke-width:.65px}
.reiter-rel{font-size:13px;line-height:1.2;font-weight:500;color:var(--ink-2)}
.reiter.heute .reiter-rel{color:var(--accent-ink)}
.reiter-tag{font-size:19px;line-height:1.2;font-weight:500}
.reiter-datum{font-size:14px;color:var(--ink-2);font-weight:400}
.reiter:not([aria-selected="true"]):hover{background:var(--surface-2)}
.reiter[aria-selected="true"]{background:var(--primary);border-color:var(--primary);color:var(--on-primary);
  --dome:var(--on-primary);--dome-past:color-mix(in srgb,var(--on-primary) 30%,var(--primary));--line:transparent}
.reiter[aria-selected="true"] .reiter-rel,.reiter[aria-selected="true"] .reiter-datum{color:var(--on-primary)}
.reiter.heute::after{content:"";position:absolute;inset-block-start:12px;inset-inline-end:12px;inline-size:9px;block-size:9px;border-radius:50%;background:var(--orange)}

/* Die große Tages-Box, darin die Aufguss-Boxen – alle gleich hoch (1fr) */
.tages-box{margin-block-start:14px;margin-inline:-6px;padding:16px 12px 14px;border-radius:32px;background:var(--surface-2);border:1.5px solid var(--line);box-shadow:var(--kante)}
.tages-box.heute{border:2.5px solid var(--orange);box-shadow:none}   /* kein Glow-Rest über der Box (Design-Prüfung) */
.tages-box.vorbei{background:var(--schleier);border:1.5px dashed var(--linie-vorbei)}
.tages-kopf{display:flex;align-items:center;gap:12px;padding-inline:6px}
.tages-kopf h3{font-size:22px;line-height:1.2;font-weight:500}
.boxen{display:grid;grid-auto-rows:1fr;gap:12px;margin-block-start:12px}
.boxen > li{display:grid;min-inline-size:0}
.boxen > li > .box{block-size:100%}
.vorbei-gruppe{margin-block-start:12px}
.vorbei-knopf{display:flex;align-items:center;gap:10px;inline-size:100%;min-block-size:56px;padding:8px 16px;border:1.5px dashed var(--linie-vorbei);border-radius:20px;
  background:transparent;text-align:start;font-size:16px;font-weight:500;color:var(--ink-3)}
.vorbei-knopf .vg-text{flex:1}
.vg-mehr{display:inline-flex;align-items:center;gap:4px;color:var(--accent-ink);font-weight:500;white-space:nowrap}
.vorbei-knopf .vg-zeit{white-space:nowrap}   /* „13:30 – 15:42" nie über zwei Zeilen (wie im Team) */
.ic.auf{transform:rotate(180deg)}

/* ===== Calma Ritualsauna (unten): Kuppel-Uhr, Foto, Text, Anfahrt ===== */
.calma{margin-block-start:48px}
.calma-raster{display:grid;gap:22px;margin-block-start:14px}
.kuppel-figur{margin:0;padding:18px 16px 16px;border-radius:28px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--schatten)}
.kuppel-figur .kuppel-rahmen{max-inline-size:560px;margin-inline:auto}
.kuppel-figur figcaption{display:grid;gap:2px;margin-block-start:10px}
.cap-tag{font-size:14px;font-weight:500;color:var(--ink-2)}
.cap-haupt{font-size:17px;font-weight:500}
.calma-text{display:grid;gap:18px;align-content:start}
.foto{display:block;inline-size:100%;block-size:auto;aspect-ratio:1000/594;object-fit:cover;border-radius:28px;background:var(--surface-2)}
.lead{font-size:17px;line-height:1.55;max-inline-size:60ch}
.calma-hinweis{padding:14px 16px;border-radius:18px;background:var(--surface);border-inline-start:5px solid var(--orange);font-weight:500}
.ort-karte{padding:20px;border-radius:28px;background:var(--tonal)}
.ort-karte h3{font-size:20px;font-weight:500;margin-block-end:8px}
address{font-style:normal;font-size:17px;line-height:1.45}
.knoepfe{display:flex;flex-wrap:wrap;gap:10px;margin-block-start:16px}
.links{display:grid;gap:2px}
.links .textlink{font-size:17px}

/* ===== Fußzeile ===== */
.fuss-zeile{margin-block-start:40px;padding-block:20px calc(40px + env(safe-area-inset-bottom));border-block-start:1px solid var(--line-stoff);
  display:grid;gap:10px;font-size:15px;color:var(--ink-stoff-2)}
.fuss-links{display:flex;flex-wrap:wrap;gap:0 20px}
.fuss-links .textlink{font-size:15px;color:var(--ink)}
.demo{white-space:nowrap}

/* ===== Detail-Blatt ===== */
.detail-status{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
.detail-dauer{display:inline-flex;align-items:center;gap:6px;font-size:15px;color:var(--ink-2);font-weight:500}
.platte-inhalt .ober{margin:0}
.detail-wer{font-size:17px;color:var(--ink-2);margin-block-start:-8px}
.detail-text{font-size:17px;line-height:1.55;text-wrap:pretty}
.detail-text.leise{color:var(--ink-2)}
.detail-lauf{margin:0;padding:12px 14px;border-radius:16px;background:linear-gradient(162deg,#FEDFBB,var(--amber) 50%,var(--orange));color:var(--on-fire)}
.detail-teil h3,.fb h3{font-size:18px;font-weight:500;margin-block-end:10px}
.zutaten-gross{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:14px 10px}
.zutaten-gross li{display:grid;justify-items:center;gap:6px;text-align:center;font-size:15px;font-weight:500;line-height:1.25}
.zutaten-gross .zutat-bild{inline-size:88px;block-size:88px}
.zutaten-gross .zutat-bild.ohne{font-size:30px}
.detail-intens{display:grid;gap:4px;justify-items:start}
.detail-intens .intens{margin:0;font-size:17px;color:var(--ink)}
.detail-intens .int-flamme{inline-size:24px;block-size:24px}
.ds section h3{font-size:17px;font-weight:500;margin-block-end:4px}
.ds p{font-size:16px;line-height:1.55}
.ds-loeschen{display:grid;gap:10px;justify-items:start;padding:16px;border-radius:18px;background:var(--surface-2)}

/* Feedback – Sterne mit halben Schritten, sichtbar als 5 Sterne */
.fb{display:grid;gap:12px;padding:18px 16px 20px;border-radius:22px;background:var(--surface-2)}
.fb h3{margin:0}
.fb .hilfe{display:flex;align-items:flex-start;gap:6px}
.fb .hilfe .ic{margin-block-start:2px}
.fb form{display:grid;gap:16px}
.fb .eingabe{background:var(--surface)}
.sterne-feld{border:0;margin:0;padding:0;min-inline-size:0}
/* Die Sterne füllen die Reihe: jede Hälfte so breit wie möglich (bis 28 px),
   56 px hoch; dazu wertet oeffentlich.js Tippen/Ziehen über die GANZE Reihe aus
   (die nächste Hälfte unter dem Finger). Der Abstand zum nächsten Stern ist
   Innenabstand der rechten Hälfte, KEINE Lücke – sonst fällt die Vorschau beim
   Überfahren zwischen zwei Sternen weg. Ganz schmal (400 % Zoom) ohne Abstand,
   damit jede Hälfte ≥ 24 px bleibt. Alles logisch (inline) – Rechts-nach-links
   spiegelt von selbst (keine Sonderregel, die hatte die Hälften vertauscht). */
.sterne{--luecke:8px;display:flex;align-items:center;touch-action:pan-y}
@media (max-width:359px){ .sterne{--luecke:0px} }
.halb{display:block;flex:none;inline-size:min(28px,calc((100% - 4 * var(--luecke)) / 10));block-size:56px;overflow:hidden;cursor:pointer;box-sizing:content-box}
.halb.b{padding-inline-end:var(--luecke)}
.halb:last-of-type{padding-inline-end:0}
.halb svg{display:block;box-sizing:border-box;inline-size:200%;block-size:100%;padding-block:2px;fill:var(--stern-leer);stroke:none}
.halb.b svg{margin-inline-start:-100%}
.halb.an svg{fill:var(--stern)}
/* Leere Sterne als Bedienelement ≥ 3:1 gegen die Feedback-Fläche */
.fb{--stern-leer:rgba(41,34,26,.55)}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) .fb{--stern-leer:rgba(249,240,231,.45)} }
:root[data-theme="dark"] .fb{--stern-leer:rgba(249,240,231,.45)}
/* Das Feedback steht im Blatt „vorbei" – das ist in BEIDEN Themen dunkel: dort leere
   Sterne hell (#F8F1EA 45 % auf #1D160F ≈ 4,1:1; die Hell-Regel oben gab 1,1:1) */
:root:not(#_) #blatt .platte.detail:is(.ist-vorbei,.ist-kommt,.ist-naechster,.ist-ausfall) .fb{--stern-leer:rgba(248,241,234,.45)}
/* Vorschau beim Überfahren: alle Hälften bis zum Zeiger (die davor per :has) */
@media (hover:hover){
  .sterne:has(.halb:hover) .halb svg{fill:var(--stern-leer)}
  /* :has() zählt wie sein Argument – die Hälfte unter dem Zeiger braucht denselben Vorrang */
  .sterne:has(.halb:hover) .halb:hover svg,.sterne .halb:has(~ .halb:hover) svg{fill:color-mix(in srgb,var(--stern) 72%,transparent)}
}
.sterne input:focus-visible + .halb{outline:3px solid var(--focus);outline-offset:-3px;border-radius:8px}
.sterne-wert{margin-block-start:4px;font-size:15px;font-weight:500;color:var(--ink-2);font-variant-numeric:tabular-nums}
.zaehler{justify-self:end;font-variant-numeric:tabular-nums}
.fb-knoepfe{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.platte.frage .platte-inhalt p{font-size:16px;line-height:1.55}

/* Bildnachweise */
.bn-liste{display:grid;gap:10px}
.bn-liste li{display:flex;align-items:center;gap:12px}
.bn-liste img,.bn-liste .zutat-bild{inline-size:56px;block-size:56px;border-radius:50%;object-fit:cover;flex:none}
.bn-liste b{display:block;font-weight:500}
.bn-liste small{display:block;color:var(--ink-2);font-size:14px;overflow-wrap:anywhere}
.bn-liste a{color:inherit;text-underline-offset:3px;padding-block:4px}   /* Tippfläche ≥ 24 px hoch */
.ds-text{display:grid;gap:20px}

/* ===== Breit: ab 1000px ===== */
@media (min-width:1000px){
  .kopf{padding-block:34px 30px}
  .kopf h1{font-size:64px;letter-spacing:-.02em}
  .kopf-zeile{font-size:19px;margin-block-start:10px}
  .jetzt-reihe{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:28px;align-items:stretch}
  .box.gross .name{font-size:36px}
  .ruhe-karte{padding:28px 32px;gap:28px}
  .ruhe-kuppel{inline-size:150px;align-self:center}
  .ruhe-text{font-size:24px}
  .ruhe-text.lang{font-size:19px}
  .jetzt-spalte.naechster .box .name{font-size:27px}
  .info-band{margin-block-start:24px;padding:14px 24px}
  .info-band ul{gap:6px 40px}
  .info-band li{font-size:17px}
  .plan{margin-block-start:64px}
  .abschnitt-titel{font-size:34px}
  /* Drei Tages-Boxen; jede ist ein Subgrid über alle Zeilen: Überschrift · Kopf · n gleich hohe Zeilen */
  /* Die letzte, feste Zeile ist der Innenabstand unten der Tages-Box: im Subgrid
     zählt deren Padding sonst zur letzten 1fr-Zeile, und die 21:30-Boxen werden
     um so viel niedriger (6 px + 12 px Zeilenabstand = 18 px wie vorher) */
  .raster{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto auto repeat(var(--zeilen),1fr) 6px;
    column-gap:18px;row-gap:12px;margin-block-start:20px}
  .tag-spalte{grid-row:1 / -1;display:grid;grid-template-rows:subgrid;min-inline-size:0}
  .tag-ueber{grid-row:1;align-self:end;padding-inline:18px;font-size:16px;font-weight:500;color:var(--ink-stoff-2)}
  .tag-ueber.heute{color:var(--ink)}
  .tag-ueber.heute::before{content:"";display:inline-block;inline-size:9px;block-size:9px;margin-inline-end:8px;border-radius:50%;background:var(--orange);vertical-align:.08em}
  .tag-ueber.vorbei{color:var(--ink-stoff-2)}
  .tag-spalte > .tages-box{grid-row:2 / -1;display:grid;grid-template-rows:subgrid;margin:0;padding:16px 14px 0;border-radius:34px;min-inline-size:0}
  .tag-spalte .tages-kopf{padding:0 4px 2px}
  .tag-spalte .tages-kopf .kuppel-svg{inline-size:58px;flex:none}
  .tag-spalte .tages-kopf .f{stroke-width:.7px}
  .tag-spalte .tages-kopf h3{display:grid;font-size:24px;line-height:1.15;font-weight:600}
  .tag-spalte .tages-kopf h3 span{font-size:15px;font-weight:400;color:var(--ink-2)}
  .zelle{display:grid;min-inline-size:0}
  .zelle > .box{block-size:100%}
  .raster .name{font-size:19px}
  .raster .zeit{font-size:22px}
  .raster .box{padding:14px 16px 14px}
  .calma{margin-block-start:72px}
  .calma-raster{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px;align-items:start;margin-block-start:20px}
  .kuppel-figur{position:sticky;inset-block-start:calc(var(--kopf-h) + 20px)}
  .kuppel-figur .kuppel-rahmen{max-inline-size:680px}
  /* Die Uhr ist breit größer – Ziffern in SVG-Einheiten kleiner halten */
  .kuppel-figur .ziffer,.kuppel-figur .ziffer.laeuft text{font-size:9.5px}
  .kuppel-figur .ziffer.laeuft rect{transform:scale(.82);transform-box:fill-box;transform-origin:center}
  .cap-haupt{font-size:18px}
  .fuss-zeile{grid-template-columns:1fr auto;align-items:center}
}

/* ===== Aushang (Bauplan 33) – ein A4-Blatt hoch, schwarz-weiß, in der Form der Seite =====
   Das Papier hat am Bildschirm die echten Druckmaße (mm/pt): Vorschau = Druck.
   Nur Schwarz, Weiß und Grau, keine Farbflächen (druckerfreundlich), feine
   Ränder (0,75 pt), runde Ecken wie im Plan. Die Zeilen der drei Tage liegen
   auf einer Höhe (Subgrid) und sind gleich hoch; läuft etwas über, setzt
   oeffentlich.js das Blatt dichter (.dicht, .eng). Grau #393229 auf Weiß ≈ 12,6:1. */
.aushang{display:grid;justify-items:center;gap:22px;padding:24px 16px 48px}
/* Die Körnung des Seitengrunds liegt sonst auch auf dem Papier */
body.im-aushang::after{display:none}
@media screen{ .papier-buehne{zoom:var(--papier-zoom,1)} }
.papier{--a-ink:#000;--a-ink-2:#393229;--a-fein:.75pt solid #000;color-scheme:light;
  display:grid;grid-template-rows:auto minmax(0,1fr) auto;row-gap:3.5mm;
  inline-size:210mm;block-size:296.5mm;padding:8mm 10mm 6mm;overflow:hidden;
  background:#FFFFFF;color:var(--a-ink);font-size:9pt;line-height:1.25;
  box-shadow:0 1px 2px rgba(0,0,0,.18),0 22px 60px -24px rgba(0,0,0,.6)}
/* Kopf: Kuppel · Titel · QR */
.a-kopf{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;column-gap:6mm}
.a-marke{inline-size:28mm}
.a-marke svg{display:block;inline-size:100%;block-size:auto}
:root:not(#_) .papier .a-marke .f{fill:none;stroke:#000;stroke-width:.8px}
.a-titel h1{font-size:24pt;line-height:1.02;font-weight:450;letter-spacing:-.01em}
.a-wann{margin-block-start:1.6mm;font-size:10.5pt;color:var(--a-ink-2)}
.a-plan{margin-block-start:1.6mm;font-size:14pt;line-height:1.1;font-weight:450}
/* QR rechts, das Wort daneben (nicht darunter – spart Höhe für die Boxen) */
.a-qr{display:flex;flex-direction:row-reverse;align-items:center;gap:3mm;text-align:end;font-size:8pt;line-height:1.25;font-weight:500}
.a-qr p{inline-size:24mm;text-wrap:balance}
.a-qr .code{flex:none;inline-size:21mm;block-size:21mm}
.a-qr svg{display:block;inline-size:100%;block-size:100%}
/* Die Tage: Überschrift, darunter je Uhrzeit eine Zeile – so hoch wie ihr Inhalt,
   der Rest des Blatts verteilt sich gleich auf alle Zeilen (align-content:stretch) */
.a-tage{display:grid;grid-template-columns:repeat(var(--spalten,3),minmax(0,1fr));grid-template-rows:max-content repeat(var(--zeilen,9),auto);
  align-content:stretch;column-gap:4mm;row-gap:1.2mm;min-block-size:0;overflow:hidden}
.a-tag{grid-row:1 / -1;display:grid;grid-template-rows:subgrid;min-inline-size:0;min-block-size:0}
.a-tag > h2{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:2mm;padding-inline:1mm;font-size:15pt;line-height:1.1;font-weight:500}
.a-datum{font-size:9.5pt;font-weight:400;color:var(--a-ink-2)}
.a-boxen{grid-row:2 / -1;display:grid;grid-template-rows:subgrid;min-block-size:0}
/* Box wie im Plan: Pille · Zeit · Name · „mit … · Intensität" · Düfte; die
   letzten beiden hängen unten (gleiche Linie in gleich hohen Boxen) */
.a-box{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto auto 1fr auto;
  grid-template-areas:"status status" "zeit zeit" "name name" "wer wer" "duft duft";
  min-block-size:min-content;min-inline-size:0;overflow:hidden;padding:1.8mm 2.6mm 1.5mm;
  border:var(--a-fein);border-radius:3.2mm;break-inside:avoid}
.a-status{grid-area:status;display:flex;min-block-size:3.6mm;margin-block-end:.6mm}
.a-pille{display:inline-flex;align-items:center;padding:.3mm 1.9mm;border:var(--a-fein);border-radius:99px;
  font-size:7pt;line-height:1.1;font-weight:600;letter-spacing:.06em;text-transform:uppercase;font-variant-numeric:tabular-nums;white-space:nowrap}
.a-zeit{grid-area:zeit;font-size:9pt;line-height:1.15;font-weight:700;font-variant-numeric:tabular-nums}
.a-zeit .bis-strich{margin-inline:.25em;font-weight:500}
.a-name{grid-area:name;margin-block-start:.3mm;font-size:12pt;line-height:1.1;font-weight:500;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere}
.a-box.aus .a-name{text-decoration:line-through;text-decoration-thickness:.9pt}
.a-wer{grid-area:wer;align-self:end;display:flex;flex-wrap:wrap;align-items:center;column-gap:1.2mm;padding-block-start:.6mm;
  font-size:8pt;line-height:1.25;color:var(--a-ink-2)}
.a-duft{grid-area:duft;margin-block-start:.4mm;font-size:8pt;line-height:1.25;color:var(--a-ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* ar/fa/he: die Zeile hat ihre eigene Richtung (dir="auto") – lateinische Namen werden
   am ENDE gekürzt, nicht ihr Anfang; sie steht trotzdem rechtsbündig wie die Spalte */
[dir="rtl"] .a-duft{text-align:right}
/* Intensität: Flammen gefüllt schwarz, leer nur als Umriss */
:root:not(#_) .papier .a-wer .intens.etikett{display:inline-flex;align-items:center;gap:.4mm;margin:0;font:inherit;color:inherit}
:root:not(#_) .papier .a-wer .intens.etikett > .i-wort{margin:0;margin-inline-end:.8mm}
:root:not(#_) .papier .a-wer .int-flamme{inline-size:3.4mm;block-size:3.4mm;fill:none;stroke:#000;stroke-width:1.7;filter:none}
:root:not(#_) .papier .a-wer .int-flamme.voll{fill:#000;stroke:#000}
.a-fuss{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1mm 4mm;font-size:7.5pt;color:var(--a-ink-2)}
/* Dichter, wenn etwas überläuft (oeffentlich.js papierPruefen): erst rückt die
   Pille neben die Zeit, dann wird die Schrift kleiner (Namen bis 2 Zeilen, Rest „…") */
.papier.dicht .a-box{grid-template-rows:auto auto 1fr auto;grid-template-areas:"zeit status" "name name" "wer wer" "duft duft";padding-block:1.5mm 1.3mm}
.papier.dicht .a-status{margin:0;min-block-size:0;align-self:center}
.papier.dicht .a-pille{font-size:6.5pt}
.papier.eng .a-name{font-size:10.5pt}
.papier.eng .a-wer,.papier.eng .a-duft{font-size:7.5pt}
/* Ein Tag groß (?aushang&tag=sa): eine Spalte, jede Box quer –
   links Zeit und Dauer, rechts Name, „mit …", Düfte */
.papier.einer .a-box,.papier.einer.dicht .a-box{grid-template-columns:40mm minmax(0,1fr);grid-template-rows:auto auto auto;
  grid-template-areas:"zeit name" "status wer" "status duft";column-gap:5mm;align-content:center;padding:2.2mm 4mm}
.papier.einer .a-zeit{font-size:15pt}
.papier.einer .a-status{align-self:start;margin:1.2mm 0 0}
.papier.einer .a-pille{font-size:8pt;padding:.6mm 2.4mm}
.papier.einer .a-name{margin:0;font-size:17pt;-webkit-line-clamp:1}
.papier.einer .a-wer{align-self:start;padding-block-start:.8mm;font-size:10pt}
.papier.einer .a-duft{font-size:10pt}
:root:not(#_) .papier.einer .a-wer .int-flamme{inline-size:4mm;block-size:4mm}
.papier.einer .a-tag > h2{font-size:22pt}
.papier.einer .a-datum{font-size:13pt}
.aushang-knoepfe{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
@media print{
  @page{size:A4 portrait;margin:0}
  html,body{background:#FFFFFF!important}
  html::before,body::before,body::after{display:none!important}
  #vorlader,#blatt,#meldung,.aushang-knoepfe{display:none!important}
  .aushang{display:block;padding:0;margin:0}
  .papier{box-shadow:none}
}

/* „Läuft gerade" / „Als Nächstes" als Reiter, der an seiner Box hängt:
   der Reiter oben links und rechts rund, die Box darunter oben links eckig –
   beides wird ein Stück. Farben so, dass die Naht verschwindet:
   läuft = Anfang des Glut-Verlaufs (#FEDFBB), als Nächstes = das Orange des Rands. */
.jetzt-spalte{gap:0}
.jetzt-spalte > .bereich{justify-self:start;position:relative;z-index:1;margin:0;padding:9px 18px 8px;
  border-radius:18px 18px 0 0;background:var(--glas-klein);color:var(--ink);
  border:1px solid rgba(var(--glas-ton),.14);border-block-end:0;margin-block-end:-1px}
.jetzt-spalte > .box,.jetzt-spalte > .ruhe-karte{border-start-start-radius:0}
.jetzt-spalte.laeuft > .bereich{background:#FEDFBB;color:var(--on-fire);border:0;margin-block-end:0;
  box-shadow:0 0 0 1.5px rgba(169,109,13,.5);clip-path:inset(-3px -3px 0 -3px)}
.jetzt-spalte.laeuft > .bereich .punkt{background:var(--on-fire)}
.jetzt-spalte.naechster > .bereich{background:var(--orange);color:var(--on-fire);border:0;margin-block-end:-2px}

/* Gleiche Linien in gleich hohen Boxen: Zutaten, Stärke und der Balken hängen
   am unteren Rand. Zwei Boxen nebeneinander (oben Läuft gerade | Als Nächstes,
   im Plan jede Zeile) haben sie damit auf derselben Höhe. */
.box > .zutaten{margin-block-start:auto}
.box > .zutaten ~ .fuss{margin-block-start:0}
.box > :has(+ .zutaten){margin-block-end:12px}
/* „Als Nächstes" oben: derselbe Balken wie „läuft", leer – noch nicht angefangen */
.box.naechster .balken{background:rgba(249,240,231,.18)}
.box.naechster .lauf .rest{color:var(--ink-2)}

@media (min-width:1000px){
  /* „Aufgüsse" mittig; Vorbei / Heute / Morgen als Reiter an ihrer Tages-Box
     (wie oben: Reiter oben rund, Box oben links eckig). Der Reiter überbrückt
     den Zeilenabstand des Rasters (12 px) und den Rand. */
  .plan > .abschnitt-titel{text-align:center}
  .tag-ueber{justify-self:start;position:relative;z-index:1;margin:0 0 -13px;padding:9px 18px 8px;border-radius:18px 18px 0 0;
    background:var(--glas-fill);-webkit-backdrop-filter:blur(22px) saturate(1.4);backdrop-filter:blur(22px) saturate(1.4);
    border:1px solid rgba(var(--glas-ton),.14);border-block-end:0;color:var(--ink);font-weight:500}
  .tag-ueber.heute{background:var(--orange);color:var(--on-fire);border:0;margin-block-end:-14px;-webkit-backdrop-filter:none;backdrop-filter:none}
  .tag-ueber.heute::before{background:var(--on-fire)}
  .tag-ueber.vorbei{color:var(--ink-2)}
  .tag-spalte > .tages-box{border-start-start-radius:0}
}

/* ===== Reiter oben, zweite Fassung (Nutzer-Feedback) =====
   Ein Rand läuft um Reiter UND Box: der Reiter trägt denselben Ring (unten
   abgeschnitten) und deckt mit 4 px Überlappung die Kante der Box unter sich
   zu – so entsteht zwischen beiden keine Linie, auch nicht durch das
   wandernde Licht. „Läuft gerade" in Orange; „Als Nächstes" + „in 53 Min."
   als zwei Reiter, Rand und Reiter weiß statt orange. */
.jetzt-spalte > .bereich,.jetzt-spalte > .reiter-paar{position:relative;z-index:3}
.jetzt-spalte.laeuft > .bereich{background:var(--orange);color:var(--on-fire);margin-block-end:-4px;padding-block-end:12px;
  box-shadow:0 0 0 1.5px rgba(169,109,13,.55),0 0 26px -6px var(--glow);clip-path:inset(-40px -40px 4px -40px)}
.jetzt-spalte.laeuft > .bereich .punkt{background:var(--on-fire)}
.reiter-paar{display:flex;align-items:flex-end;gap:6px;justify-self:start;margin-block-end:-4px}
.reiter-paar > .bereich{margin:0;padding:9px 18px 12px;border-radius:18px 18px 0 0}
.jetzt-spalte.naechster .reiter-paar > .bereich:first-child{background:#FFFFFF;color:#29221A;border:0;
  box-shadow:0 0 0 1.5px rgba(255,255,255,.9);clip-path:inset(-10px -10px 4px -10px)}
.jetzt-spalte.naechster .reiter-paar > .bereich.zweit{background:#484037;color:#FBF2E9;font-size:15px;font-weight:500;
  box-shadow:0 0 0 1.5px rgba(255,255,255,.9);clip-path:inset(-10px -10px 4px -10px);font-variant-numeric:tabular-nums}
/* Die Box beginnt unter dem ersten Reiter eckig; der Rand ist weiß statt orange */
:root .jetzt-spalte.naechster > .box.naechster{border:2px solid rgba(255,255,255,.92);border-start-start-radius:0;
  box-shadow:inset 0 1px 0 rgba(249,240,231,.10),0 12px 32px -14px rgba(25,18,10,.55)}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) .jetzt-spalte.naechster > .box.naechster{border-color:rgba(249,240,231,.78)} }
:root[data-theme="dark"] .jetzt-spalte.naechster > .box.naechster{border-color:rgba(249,240,231,.78)}
/* „Läuft gerade" wie die kleine Plakette: schwarzer Grund, orange Schrift,
   oranger Punkt (pulsiert). #DD9C49 auf #1A130C ≈ 7,6:1. Der Schnitt sitzt
   jetzt genau an der Reiter-Unterkante – die 4 px Überlappung decken die
   Kante der Box wirklich zu (vorher wurden sie mit abgeschnitten). */
.jetzt-spalte.laeuft > .bereich{background:#1A130C;color:var(--orange);clip-path:inset(-40px -40px 0 -40px)}
.jetzt-spalte.laeuft > .bereich .punkt{background:var(--orange)}
.jetzt-spalte.naechster .reiter-paar > .bereich:first-child,
.jetzt-spalte.naechster .reiter-paar > .bereich.zweit{clip-path:inset(-10px -10px 0 -10px)}

/* ===== Oben, dritte Fassung (Nutzer-Feedback): Pillen statt Reiter =====
   Keine Reiter, keine dicken Ränder. Der Zustand steht als Pille neben der Zeit:
   „Läuft gerade" (tiefes Orange, hebt sich vom Gelb ab: #FEF5EC auf #925D08 ≈ 5,3:1),
   „Als Nächstes" + „in 54 Min." als zwei Pillen. Zeit „16:30 bis 16:45",
   beide Zahlen gleich groß. */
.jetzt-spalte{grid-template-rows:auto 1fr;gap:8px}
.jetzt-spalte > .bereich{all:unset;display:flex;align-items:center;gap:8px;font-size:17px;line-height:1.3;font-weight:500;
  color:var(--ink-stoff-2);padding-inline:2px}
.jetzt-spalte > .box,.jetzt-spalte > .ruhe-karte{border-start-start-radius:28px}
.jetzt-spalte > .box.naechster{border-start-start-radius:28px}
:root .jetzt-spalte.naechster > .box.naechster{border:1px solid rgba(214,183,148,.35);
  box-shadow:inset 0 1px 0 rgba(249,240,231,.10),0 12px 32px -14px rgba(25,18,10,.55)}
.box.gross .zeit .bis-wort{font-size:.62em;font-weight:400;margin-inline:.35em;opacity:.85}
.box.gross .zeit .bis.gleich{font-size:inherit;font-weight:inherit;margin:0}

/* Fortschritt als fließende Lava: Glutrot–Orange–Gelb, wandert langsam */
@keyframes lava{to{background-position:-200% 0}}
.box.laeuft .balken{background:rgba(26,19,12,.20);box-shadow:inset 0 1px 2px rgba(26,19,12,.25)}
.box.laeuft .balken > span{background:linear-gradient(90deg,#6B4200 0%,#A96D0D 18%,#D2891E 34%,#FDC078 50%,#D2891E 66%,#A96D0D 82%,#6B4200 100%);
  background-size:200% 100%;animation:lava 3.6s linear infinite;box-shadow:0 0 10px rgba(210,137,30,.55)}
@media (prefers-reduced-motion:reduce){ .box.laeuft .balken > span{animation:none} }
/* Oben wieder gleich hohe Boxen: beide Spalten teilen sich die Zeilen
   (Überschrift · Box) als Subgrid – auch wenn links eine sichtbare Überschrift
   steht (Pause) und rechts nur eine für Bildschirmleser. */
@media (min-width:1000px){
  .jetzt-reihe{grid-template-rows:auto 1fr;row-gap:0}
  .jetzt-spalte{grid-row:span 2;grid-template-rows:subgrid;row-gap:8px}
  .jetzt-spalte > .box,.jetzt-spalte > .ruhe-karte{grid-row:2}
}
/* Zeit: Strich statt „bis", gleich groß, etwas kräftiger */
.box.gross .zeit,.box.gross .zeit .bis.gleich{font-weight:600}
.box.gross .zeit,.box.gross .zeit time,.box.gross .zeit .bis.gleich{font-weight:700}
/* Luft zwischen Beschreibung und Zutaten: der Abstand hängt am Text selbst
   (die unsichtbare „mehr …"-Zeile dazwischen zählte vorher mit – dann klebte
   die Zutatenreihe am Text). Ist „mehr …" sichtbar, hält sie den Abstand. */
.box > .text{margin-block-end:16px}
.box > .text.gekappt{margin-block-end:0}
.box > .text.gekappt + .mehr-hinweis{margin-block-end:16px}
.box > :has(+ .zutaten){margin-block-end:16px}
.box > .mehr-hinweis:not(:is(.text.gekappt + .mehr-hinweis)){margin-block-end:0}

/* ===== Oben, vierte Fassung (Nutzer-Feedback) =====
   Die Pillen stehen in einer eigenen Zeile ÜBER der Uhrzeit, nicht daneben.
   Beide Boxen oben sind wieder an allen Ecken rund (die alte Reiter-Regel
   :root .jetzt-spalte.naechster > .box.naechster hatte die Ecke oben links
   noch eckig gehalten). Die Pillen-Farben selbst stehen in basis.css
   („Pillen überall gleich"), weil das Team-Backend sie auch braucht. */
.box.gross .box-status{margin-block-end:12px;padding-inline-end:72px}
:root .jetzt-spalte > .box,:root .jetzt-spalte > .ruhe-karte,
:root .jetzt-spalte.laeuft > .box.laeuft,:root .jetzt-spalte.naechster > .box.naechster{border-radius:28px}

/* ===== Plan: Überschrift „Aufgussplan" groß, Tage als Pillen (Nutzer-Feedback 01.10.) =====
   Vorbei / Heute / Morgen stehen als eigene Pille über ihrer Tages-Box,
   nicht mehr als angehängter Reiter – die Box ist wieder an allen Ecken rund.
   Datum und Ort stehen über „Calma Ritualsauna". */
:root .kopf-zeile{margin-block:0 10px}
:root .plan > .abschnitt-titel{font-size:34px;margin-block-end:20px}
@media (min-width:1000px){
  :root .plan > .abschnitt-titel{font-size:50px;line-height:1.05;letter-spacing:-.015em;margin-block-end:40px}
  /* Pillen Vorbei / Heute / Morgen: in basis.css (gilt auch im Team-Plan) */
}

/* Slot-Titel über dem Namen („Team-Slot · Heimaufguss") öffentlich ausblenden
   (Nutzer-Feedback) – im Team-Bereich bleibt er sichtbar. Hat ein Slot keinen
   Aufguss, ist der Titel selbst der Name und bleibt. */
.box .ober,#blatt .detail .ober,#blatt .platte .ober{display:none}

/* ===== Detail-Blatt: Teilen · Merken · Kalender (Bauplan 25) =====
   Drei gleich breite, tonale Knöpfe ohne Rand direkt unter der Status-Zeile,
   Symbol + Wort, ≥ 48 px hoch. „Gemerkt" (aria-pressed) mit zartem Rosa und
   gefülltem Herz – dasselbe Herz steht als Marke an der Box.
   Kontraste (nachgerechnet, scratchpad r6/bau/farben.mjs):
   hell   #29221A auf #EFE8E1 ≈ 13:1 · gemerkt #29221A auf #EEE7E0 ≈ 13:1, Herz #696157 ≈ 5,5:1
   dunkel #F8F1EA auf #403830 ≈ 10:1 · gemerkt #F8F1EA auf #3A332A ≈ 11,6:1, Herz #EDBE86 ≈ 6:1
   Im Blatt des laufenden Aufgusses (orange umrandet) ist der Grund derselbe. */
:root{--akt-grund:#EFE8E1;--akt-hover:#F3EADF;--akt-an:#EEE7E0;--akt-an-hover:#E4DBD2;--akt-herz:#696157}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){--akt-grund:#403830;--akt-hover:#4D453C;--akt-an:#3A332A;--akt-an-hover:#433B33;--akt-herz:#EDBE86} }
:root[data-theme="dark"]{--akt-grund:#403830;--akt-hover:#4D453C;--akt-an:#3A332A;--akt-an-hover:#433B33;--akt-herz:#EDBE86}
.aktionen{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:8px;margin-block-start:-4px}
.aktion{position:relative;display:flex;align-items:center;justify-content:center;gap:7px;min-inline-size:0;min-block-size:48px;padding:8px 10px;
  border:0;border-radius:16px;background:var(--akt-grund);color:var(--ink);font-size:15px;font-weight:500;line-height:1.2;
  text-decoration:none;text-align:center;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s}
.aktion .ic{inline-size:20px;block-size:20px}
.aktion-wort{min-inline-size:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (hover:hover){
  .aktion:hover{background:var(--akt-hover)}
  .aktion[aria-pressed="true"]:hover{background:var(--akt-an-hover)}
}
.aktion[aria-pressed="true"]{background:var(--akt-an)}
.aktion[aria-pressed="true"] .herz{fill:var(--akt-herz);stroke:var(--akt-herz)}
.aktion[aria-busy="true"]{opacity:.6}
/* Lange Wörter (oeffentlich.js misst): Symbol über Wort – in allen Knöpfen gleich */
.aktionen.gestapelt .aktion{flex-direction:column;gap:3px;padding:8px 6px 7px;min-block-size:62px}
/* Umbruch nur zwischen Wörtern – ein zu langes Wort macht oeffentlich.js aktionenMessen kleiner */
.aktionen.gestapelt .aktion-wort{max-inline-size:100%;white-space:normal;overflow:visible;overflow-wrap:normal;font-size:14px}
@media (prefers-reduced-motion:reduce){ .aktion{transition:none} }
/* Datenschutz: der Zusatz zu „Auf deinem Gerät" (gemerkte Aufgüsse) als eigener Absatz */
.ds section p + p{margin-block-start:8px}

/* Herz-Marke gemerkter Aufgüsse in der Pillen-Zeile der Box (Plan und oben) –
   so hoch wie die Pillen. Die Boxen im Plan liegen alle auf dunklem Grund:
   #EDBE86 auf dem rosa Hauch über #1E1810 ≈ 6:1, über #272018 ≈ 5,5:1;
   auf der gelben Läuft-Box eine schwarze Marke wie die Pille „Läuft gerade"
   (#EDBE86 auf #1A130C ≈ 8,6:1); vorbei gedämpft (#D5AC84 auf #2E271E ≈ 7:1). */
.herz-marke{display:inline-flex;align-items:center;justify-content:center;flex:none;min-block-size:32px;padding-inline:10px;border-radius:99px;
  background:var(--herz-grund,rgba(224,171,107,.18));color:var(--herz-farbe,#EDBE86)}
.herz-marke .ic{inline-size:17px;block-size:17px;fill:currentColor;stroke:currentColor}
.box.laeuft .herz-marke{--herz-grund:#1A130C;--herz-farbe:#EDBE86}
.box.vorbei .herz-marke{--herz-grund:#2E271E;--herz-farbe:#D5AC84}

/* ===== Heute breit: Vergangenes eingeklappt (Bauplan 36) =====
   Wie am Handy: Kopf, Vorbei-Gruppe, dann die übrigen Boxen. Die Spalte ist
   kein Subgrid mehr (sonst bliebe für jede eingeklappte Box eine leere Zeile);
   Wort und Kasten oben stehen weiter auf einer Höhe mit den anderen Tagen, die
   Boxen darin sind untereinander gleich hoch. */
@media (min-width:1000px){
  :root:not(#_) .tag-spalte.frei > .tages-box{display:flex;flex-direction:column;align-self:start;padding:16px 14px 14px}
  .tag-spalte.frei .vorbei-gruppe{margin-block-start:12px}
  .tag-spalte.frei .boxen{margin-block-start:12px;gap:12px}
  /* Aufgeklappt: „ausblenden" klein rechts im Tageskopf (gleiche Zeilenhöhe wie die anderen) */
  .tages-kopf.mit-knopf{justify-content:space-between}
}
:root:not(#_) .boxen{grid-auto-rows:auto}   /* untereinander keine angeglichenen Höhen (Nachtrag 36) */
.vorbei-zu{display:inline-flex;align-items:center;gap:4px;min-block-size:44px;padding:0 12px;border:0;border-radius:99px;
  background:none;color:var(--accent-ink);font-size:15px;font-weight:500;white-space:nowrap;cursor:pointer}
@media (hover:hover){ .vorbei-zu:hover{background:color-mix(in srgb,var(--ink) 8%,transparent)} }

/* ===== Gemerkte Aufgüsse in der Kopfleiste (Bauplan 34) =====
   Herz-Knopf tonal wie QR und Sprache, rotes Herz + kleine Zahl.
   Herz hell #696157 auf #FED09C ≈ 4,8:1 und auf #FDFAF8 ≈ 6,6:1,
   dunkel #EDBE86 auf #3D352C ≈ 5,7:1 und auf #29221A ≈ 6,5:1 (Symbol ≥ 3:1). */
:root{--merk-herz:#696157}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){--merk-herz:#EDBE86} }
:root[data-theme="dark"]{--merk-herz:#EDBE86}
/* Der Knopf selbst (rund, nur Herz, keine Zahl) steht in basis.css (Nachtrag 34) */
.merk-anker{position:relative;display:flex;flex:none}
/* Schmale Handys (≤ 359 px): mit dem Herz passt die Kopfleiste nur knapp in EINE
   Zeile – Sprache ohne Pfeil (bleibt ein Knopf), Kuppel und Abstände kleiner */
@media (max-width:359px){
  :root:not(#_) .leiste-in:has(.merk-anker){column-gap:3px}
  :root:not(#_) .leiste-in:has(.merk-anker) .sprach-knopf > .ic.klein{display:none}
  :root:not(#_) .leiste .leiste-in:has(.merk-anker) > .marke .marke-kuppel{inline-size:40px}
}
/* Dropdown unter dem Knopf (breit) – Liste gleich wie im Blatt am Handy */
.merk-pop{position:absolute;inset-block-start:calc(100% + 10px);inset-inline-start:0;z-index:45;inline-size:min(380px,calc(100vw - 32px));
  max-block-size:min(70vh,560px);overflow:auto;padding:14px 8px 12px;border-radius:22px;background:var(--surface);color:var(--ink);
  border:1px solid var(--line-2);box-shadow:0 22px 50px -18px rgba(25,18,10,.55),0 2px 8px rgba(25,18,10,.14)}
.merk-pop-titel{padding:0 12px 8px;font-size:15px;font-weight:600;color:var(--ink-2)}
.merk-liste{display:grid;gap:2px}
.merk-eintrag{display:flex;align-items:flex-start;gap:12px;inline-size:100%;min-block-size:48px;padding:10px 12px;border:0;border-radius:14px;
  background:none;color:var(--ink);text-align:start;cursor:pointer;-webkit-tap-highlight-color:transparent}
.merk-eintrag .herz{inline-size:18px;block-size:18px;margin-block-start:2px;fill:var(--merk-herz);stroke:var(--merk-herz)}
.me-text{display:grid;gap:3px;min-inline-size:0}
.me-wann{font-size:14px;line-height:1.3;color:var(--ink-2);font-variant-numeric:tabular-nums}
.me-name{font-size:17px;line-height:1.25;font-weight:500;overflow-wrap:anywhere}
.me-marke{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;line-height:1.3;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}
.merk-eintrag.laeuft .me-marke{color:var(--accent-ink)}
/* vergangene gedämpft (hell #50473F auf #FDFAF8 ≈ 8,7:1, dunkel #CAC1B6 auf #29221A ≈ 7,8:1),
   ausgefallene durchgestrichen */
.merk-liste{--me-vorbei:var(--ink-3)}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) .merk-liste{--me-vorbei:#CAC1B6} }
:root[data-theme="dark"] .merk-liste{--me-vorbei:#CAC1B6}
.merk-eintrag.vorbei,.merk-eintrag.vorbei .me-wann,.merk-eintrag.vorbei .me-marke{color:var(--me-vorbei)}
.merk-eintrag.vorbei .me-name{font-weight:400}
.merk-eintrag.ausfall .me-name{text-decoration:line-through}
.merk-eintrag.ausfall .me-marke{color:var(--warnung)}
@media (hover:hover){ .merk-eintrag:hover{background:color-mix(in srgb,var(--ink) 7%,transparent)} }
.merk-eintrag:focus-visible{outline-offset:-3px}
.merk-hinweis{padding:8px 12px 0;font-size:13px;color:var(--ink-2)}
.merk-blatt .merk-liste{margin-inline:-12px}
.merk-blatt .merk-hinweis{padding-block-start:0}

/* ===== Hinweis über dem Plan, solange Texte des Teams noch nicht in der Sprache
   da sind (Bauplan 35a; ersetzt „Aufguss-Texte auf Deutsch"): mittig unter „Aufgussplan" ===== */
.plan > .plan-hinweis{display:block;text-align:center;max-inline-size:60ch;margin:-6px auto 18px;line-height:1.45;text-wrap:balance}
.plan > .plan-hinweis .ic{display:inline-block;inline-size:16px;block-size:16px;vertical-align:-3px;margin-inline-end:6px}
@media (min-width:1000px){ .plan > .plan-hinweis{margin:-40px auto 32px} }
/* Bildnachweise: Düfte & Kräuter und Klänge & Instrumente getrennt (Bauplan 28) */
.bn-teil{display:grid;gap:10px}
.bn-teil h3{margin:0;font-size:17px;font-weight:500}

/* ===== BAUPLAN 131: /live – TV-Ansicht ===== */
html:has(> body.im-live),body.im-live{overflow:hidden;cursor:none;scrollbar-width:none}
html:has(> body.im-live)::-webkit-scrollbar{display:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #root{position:fixed;inset:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-buehne{position:absolute;inset-block-start:0;inset-inline-start:0;inline-size:1920px;block-size:1080px;transform-origin:0 0;
  display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding:36px 72px 40px;box-sizing:border-box;direction:ltr;overflow:hidden}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-laden{margin:auto;font-size:40px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-kopf{display:grid;grid-template-columns:auto 1fr;align-items:center;margin-block-start:-14px;padding-block-end:46px}
/* Dampf am TV kräftiger (Nutzer ~03:30: „draußen wird es hell“) – Hintergrund, vorn und die Hülle um den laufenden */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #dampf{filter:saturate(1.35)}   /* BAUPLAN 132: Dichte statt Aufhellen */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #dampf-vorn{filter:saturate(1.3)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .dampf-huelle{filter:saturate(1.4);-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent),linear-gradient(180deg,transparent,#000 6%,#000 94%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent),linear-gradient(180deg,transparent,#000 6%,#000 94%,transparent);mask-composite:intersect}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-rechts{justify-self:end;display:flex;align-items:center;gap:44px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-wetter{display:inline-flex;align-items:center;gap:12px;font-size:44px;font-weight:500;color:var(--ink-2,#D7C6B5);background:none;border:0;padding:0;min-block-size:0;font-variant-numeric:tabular-nums}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-wetter .ic{inline-size:50px;block-size:50px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-wetter.ohne{visibility:hidden}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-uhr{font-size:56px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--ink-2,#D7C6B5)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-tag{font-size:40px;font-weight:500;color:var(--ink-2,#D7C6B5)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-marke{display:flex;align-items:center;gap:20px;font-size:56px;letter-spacing:-.01em}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-marke .marke-kuppel svg{inline-size:110px;block-size:auto}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte.ein{animation:liveEin .9s cubic-bezier(.2,.7,.2,1) both}
@keyframes liveEin{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte.ein{animation:none} }
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte{display:flex;align-items:stretch;min-block-size:0;overflow:hidden}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .jetzt-reihe{inline-size:100%;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:stretch}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .jetzt-spalte{min-inline-size:0;display:flex;flex-direction:column}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .jetzt-spalte > .box,.im-live .live-mitte .ruhe-karte{flex:1}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box{max-block-size:100%;overflow:hidden}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box{padding:40px 44px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .name{font-size:84px;line-height:1.05;letter-spacing:-.015em;font-weight:560}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .ober{font-size:30px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .zeit{font-size:48px;font-weight:550}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .zeit :is(time,.bis){font-weight:550}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .wer{font-size:36px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .box-status .pille{font-size:24px;padding:12px 20px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .box-status{margin-block-end:30px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .zutaten{max-block-size:calc(2 * 66px + 14px);overflow:hidden;flex-wrap:wrap;gap:14px;margin-block-start:auto}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .zutaten li{display:inline-flex;align-items:center;gap:14px;block-size:66px;min-block-size:66px;padding:4px 24px 4px 4px;font-size:28px;border-radius:99px;box-sizing:border-box}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .zutaten li > :is(img,.zutat-bild,.zutat-kreis){flex:none;inline-size:58px;block-size:58px;border-radius:50%;object-fit:cover}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .zutaten li > .zutat-bild.ohne{display:inline-grid;place-items:center}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box :is(.text,.mehr-hinweis,.box-auf,.merk-marke,.herz,[data-tu="merken"],.fuss){display:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .stueck{inline-size:96px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .bis-strich{margin-inline:.3em}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .zeit > .zeit-int .int-flamme{inline-size:1em;block-size:1em}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-marke .marke-kuppel{display:block;flex:none;inline-size:110px;position:static;margin:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-marke b{display:block;white-space:nowrap;font-weight:400}
/* Logo-Hitze (wie .marke in basis.css, feste Farbe #F6C690 → #BC7908) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-marke .f{--hitze:color-mix(in oklab,#F6C690,#BC7908 calc(var(--h,.5) * 100%));--glut-spitze:color-mix(in srgb,var(--hitze) calc((.16 + var(--h,.5) * .7) * 100%),transparent)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-marke .marke-kuppel.glut .f{animation:logoHitze 1.1s ease-in-out forwards;animation-delay:calc(var(--h,.5) * .45s)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-band{position:relative;block-size:210px;margin-block-start:32px;overflow:hidden;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 220px,#000 calc(100% - 220px),transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 220px,#000 calc(100% - 220px),transparent 100%)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-band.leer{visibility:hidden}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .band-spur{display:flex;gap:22px;inline-size:max-content;block-size:100%;will-change:transform}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .band-kachel{flex:none;display:grid;align-content:center;gap:8px;inline-size:624px;padding:20px 32px;box-sizing:border-box;border-radius:24px;
  background:color-mix(in srgb,var(--ink,#FFFFFF) 7%,transparent);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--ink,#FFFFFF) 18%,transparent)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .bk-oben{display:flex;align-items:center;gap:16px;font-size:34px;color:var(--ink-2,#D7C6B5);white-space:nowrap}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .bk-zeit{font-weight:650;color:var(--ink,#FFFFFF);font-variant-numeric:tabular-nums}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .bk-tag{font-weight:600;text-transform:uppercase;letter-spacing:.06em;font-size:22px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .bk-dauer{padding:4px 12px;border-radius:99px;font-size:20px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;box-shadow:inset 0 0 0 1.5px currentColor}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .bk-flammen{display:inline-flex}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .bk-flammen .int-flamme{inline-size:36px;block-size:36px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .bk-flammen .int-flamme + .int-flamme{margin-inline-start:-5px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .bk-name{margin:0;font-size:42px;font-weight:600;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink,#FFFFFF)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .bk-wer{margin:0;font-size:27px;color:var(--ink-2,#D7C6B5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (prefers-reduced-motion:reduce){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .band-spur{overflow-x:auto} }
/* BAUPLAN 133: Rand-Maske der Hülle 6 % */
/* ===== Ende BAUPLAN 131 ===== */

/* ===== BAUPLAN 134: Aufguss-Blatt auf dem Handy eine Stufe größer ===== */
@media (max-width:699px){
  :root:not(#_):not(#_) #blatt .platte.detail .platte-kopf h2{font-size:32px}
  :root:not(#_):not(#_) #blatt .platte.detail .platte-kopf .auge{font-size:19px;line-height:1.3;row-gap:6px;margin-block-end:8px}   /* BAUPLAN 135 */
  :root:not(#_):not(#_) #blatt .platte.detail .platte-kopf [data-tu=blattzu] .ic{inline-size:28px;block-size:28px}
  :root:not(#_):not(#_) #blatt .platte.detail .detail-status .pille{font-size:16px;padding:10px 16px}
  :root:not(#_):not(#_) #blatt .platte.detail .aktion{min-block-size:54px;font-size:17px;border-radius:18px}
  :root:not(#_):not(#_) #blatt .platte.detail .aktion .ic{inline-size:23px;block-size:23px}
  :root:not(#_):not(#_) #blatt .platte.detail .aktionen.gestapelt .aktion{min-block-size:68px}
  :root:not(#_):not(#_) #blatt .platte.detail .aktionen.gestapelt .aktion-wort{font-size:16px}
  :root:not(#_):not(#_) #blatt .platte.detail .detail-wer,:root:not(#_):not(#_) #blatt .platte.detail .detail-wer-zeile{font-size:20px}
  :root:not(#_):not(#_) #blatt .platte.detail .detail-text{font-size:21px}
  :root:not(#_):not(#_) #blatt .platte.detail .runde-text{font-size:19px}
  :root:not(#_):not(#_) #blatt .platte.detail .inhalt-hinweis{font-size:15px}
  :root:not(#_):not(#_) #blatt .platte.detail .detail-teil h3{font-size:23px}
  :root:not(#_):not(#_) #blatt .platte.detail .zutaten-gross li,:root:not(#_):not(#_) #blatt .platte.detail .zutaten-gross.runde-kreise li{min-block-size:54px;padding:3px 17px 3px 3px;border-radius:27px;font-size:19px}
  :root:not(#_):not(#_) #blatt .platte.detail .zutaten-gross .zutat-bild,:root:not(#_):not(#_) #blatt .platte.detail .zutaten-gross.runde-kreise .zutat-bild{inline-size:48px;block-size:48px}
  :root:not(#_):not(#_) #blatt .platte.detail .zutaten-gross .zutat-bild.ohne,:root:not(#_):not(#_) #blatt .platte.detail .zutaten-gross.runde-kreise .zutat-bild.ohne{font-size:21px}
}
/* ===== Ende BAUPLAN 134 ===== */

/* ===== BAUPLAN 135: Handy – Kacheln Fließtext/„mit …“ größer, Blatt mehr Luft ===== */
@media (max-width:699px){
  :root:not(#_):not(#_) .box .text{font-size:18px;line-height:1.65}
  :root:not(#_):not(#_) .box.gross .text{font-size:19px}
  :root:not(#_):not(#_) .box .wer-zeile,:root:not(#_):not(#_) .box .wer{font-size:18px}
  :root:not(#_):not(#_) .box.gross .wer-zeile,:root:not(#_):not(#_) .box.gross .wer{font-size:19px}
  /* Blatt: „mit …“ so groß wie der Fließtext (21 px), mehr Luft zwischen Kopf und dem Rest */
  :root:not(#_):not(#_) #blatt .platte.detail .detail-wer,:root:not(#_):not(#_) #blatt .platte.detail .detail-wer-zeile{font-size:21px}
  :root:not(#_):not(#_) #blatt .platte.detail .detail-oben{padding-block:14px 24px;gap:18px}
  :root:not(#_):not(#_) #blatt .platte.detail .platte-inhalt{gap:22px}
}
/* ===== Ende BAUPLAN 135 ===== */

/* ===== BAUPLAN 136: Handy – „Weiterlesen“ = Fließtext, Blatt Uhrzeit größer + Luft oben ===== */
@media (max-width:699px){
  :root:not(#_):not(#_) .box .mehr-hinweis{font-size:18px}
  :root:not(#_):not(#_) .box.gross .mehr-hinweis{font-size:19px}
  /* Blatt: Uhrzeit-Zeile 19 → 23 px (Flammen wachsen mit), oben mehr Luft (Kopf-Polster 12 → 22 px) */
  :root:not(#_):not(#_) #blatt .platte.detail .platte-kopf .auge-zeit{font-size:min(23px,5.94vw)}   /* 320 px → 19 px, ab 387 px → 23 px */
  :root:not(#_):not(#_) #blatt .platte.detail .platte-kopf h2{min-inline-size:0}   /* nie das X hinausschieben */
  :root:not(#_):not(#_) #blatt .platte.detail .platte-kopf{padding-block-start:22px}
}
/* Knöpfe Teilen/Merken/Kalender: nie auf zwei Zeilen – auch gestapelt bleibt das Wort einzeilig, oeffentlich.js
   (aktionenMessen) macht es dann kleiner, bis es passt („В избранное“ bei 320 px) */
@media (max-width:699px){
  :root:not(#_):not(#_) .aktionen.gestapelt .aktion-wort{white-space:nowrap}
}
/* 320-Stufe: auf ganz kleinen Handys (< 360 px) alles eine Stufe zurück, damit nichts riesig wirkt oder bricht */
@media (max-width:359px){
  :root:not(#_):not(#_) #blatt .platte.detail .platte-kopf h2{font-size:28px}
  :root:not(#_):not(#_) #blatt .platte.detail .platte-kopf .auge{font-size:17px}
  :root:not(#_):not(#_) #blatt .platte.detail .detail-status .pille{font-size:15px;padding:9px 14px}
  :root:not(#_):not(#_) #blatt .platte.detail .detail-wer,:root:not(#_):not(#_) #blatt .platte.detail .detail-wer-zeile,:root:not(#_):not(#_) #blatt .platte.detail .detail-text{font-size:19px}
  :root:not(#_):not(#_) #blatt .platte.detail .runde-text{font-size:18px}
  :root:not(#_):not(#_) #blatt .platte.detail .detail-teil h3{font-size:21px}
  :root:not(#_):not(#_) #blatt .platte.detail .zutaten-gross li,:root:not(#_):not(#_) #blatt .platte.detail .zutaten-gross.runde-kreise li{min-block-size:48px;border-radius:24px;font-size:17px}
  :root:not(#_):not(#_) #blatt .platte.detail .zutaten-gross .zutat-bild,:root:not(#_):not(#_) #blatt .platte.detail .zutaten-gross.runde-kreise .zutat-bild{inline-size:42px;block-size:42px}
  :root:not(#_):not(#_) .box .text,:root:not(#_):not(#_) .box.gross .text,:root:not(#_):not(#_) .box .mehr-hinweis,:root:not(#_):not(#_) .box.gross .mehr-hinweis{font-size:17px}
  :root:not(#_):not(#_) .box .wer-zeile,:root:not(#_):not(#_) .box .wer,:root:not(#_):not(#_) .box.gross .wer-zeile,:root:not(#_):not(#_) .box.gross .wer{font-size:17px}
}
/* ===== Ende BAUPLAN 136 ===== */

/* ===== BAUPLAN 137: Handy – übrige Blätter größer, Kacheln gleich groß, Reiter kleiner ===== */
@media (max-width:699px){
  /* Kopf aller Blätter (Aufguss-Blatt .detail hat eigene, höhere Regeln aus 134–136) */
  :root:not(#_):not(#_) #blatt .platte .platte-kopf h2{font-size:30px}
  :root:not(#_):not(#_) #blatt .platte .platte-kopf .auge{font-size:17px}
  :root:not(#_):not(#_) #blatt .platte .platte-kopf [data-tu=blattzu] .ic{inline-size:28px;block-size:28px}
  :root:not(#_):not(#_) #blatt .platte .platte-kopf{padding-block-start:22px}
  /* Uhr-Blatt (Kopfzeile → „Als Nächstes / Demnächst“) */
  :root:not(#_):not(#_) #blatt .platte.uhr-blatt .pille{font-size:15px;padding:9px 14px}
  :root:not(#_):not(#_) #blatt .platte.uhr-blatt .uk-zeit{font-size:19px}
  :root:not(#_):not(#_) #blatt .platte.uhr-blatt .uk-zeit .int-flamme{inline-size:20px;block-size:20px}
  :root:not(#_):not(#_) #blatt .platte.uhr-blatt .uk-name{font-size:25px}
  :root:not(#_):not(#_) #blatt .platte.uhr-blatt .uk-wer{font-size:19px}
  :root:not(#_):not(#_) #blatt .platte.uhr-blatt .kp-plan,:root:not(#_):not(#_) #blatt .platte.uhr-blatt .kp-plan span{font-size:18px}
  :root:not(#_):not(#_) #blatt .platte.uhr-blatt .kp-plan{margin-block-start:20px}
  /* Sprache */
  :root:not(#_):not(#_) #blatt .platte .sprache{min-block-size:64px}
  :root:not(#_):not(#_) #blatt .platte .sprache .nativ{font-size:20px}
  :root:not(#_):not(#_) #blatt .platte .sprache .uebersetzt{font-size:16px}
  :root:not(#_):not(#_) #blatt .platte .sprache .ic{inline-size:22px;block-size:22px}
  /* Teilen */
  :root:not(#_):not(#_) #blatt .platte.teilen-blatt .hilfe{font-size:17px}
  :root:not(#_):not(#_) #blatt .platte.teilen-blatt .fehlertext{font-size:16px}
  :root:not(#_):not(#_) #blatt .platte.teilen-blatt .link-feld .link-text{font-size:17px}
  :root:not(#_):not(#_) #blatt .platte.teilen-blatt .link-feld .link-kopie .ic{inline-size:24px;block-size:24px}
  :root:not(#_):not(#_) #blatt .platte.teilen-blatt .teilen-liste a,:root:not(#_):not(#_) #blatt .platte.teilen-blatt .teilen-liste button{font-size:20px;min-block-size:66px}
  :root:not(#_):not(#_) #blatt .platte.teilen-blatt .teilen-liste small{font-size:16px}
  :root:not(#_):not(#_) #blatt .platte.teilen-blatt .teilen-kreis{inline-size:46px;block-size:46px}
  :root:not(#_):not(#_) #blatt .platte.teilen-blatt .teilen-kreis .ic{inline-size:22px;block-size:22px}
  /* Wetter */
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-jetzt .wx-zahl{font-size:56px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-wort{font-size:22px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-ort{font-size:16px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-ort .ic{inline-size:17px;block-size:17px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-wert .k{font-size:15px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-wert .k .ic{inline-size:17px;block-size:17px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-wert .v{font-size:20px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .kp-h{font-size:17px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-tag b{font-size:18px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-tag small{font-size:14px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-tag .wx-zahl{font-size:18px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-tag .wx-regen{font-size:15px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-tag .wx-regen .ic{inline-size:15px;block-size:15px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-std{inline-size:68px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-std time{font-size:15px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-std-t{font-size:19px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-std .wx-r{font-size:14px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-quelle{font-size:14px}
  /* Plan-Kacheln: kleine wie große */
  :root:not(#_):not(#_) .box:not(.gross) .zeit{font-size:20px}
  :root:not(#_):not(#_) .box:not(.gross) .name{font-size:29px}
  :root:not(#_):not(#_) .box .wer-zeile,:root:not(#_):not(#_) .box .wer,:root:not(#_):not(#_) .box .text,:root:not(#_):not(#_) .box .mehr-hinweis{font-size:19px}
  :root:not(#_):not(#_) .box .zutaten li{font-size:16px}
  :root:not(#_):not(#_) .box .zutaten .zutat-bild{inline-size:42px;block-size:42px}
  :root:not(#_):not(#_) .box .intens .int-flamme{inline-size:20px;block-size:20px}
  /* Reiter kleiner, mehr Luft unter „Aufgussplan“ */
  :root:not(#_):not(#_) .reiter-rel{font-size:17px}
  :root:not(#_):not(#_) .reiter.heute .reiter-rel{font-size:21px}
  :root:not(#_):not(#_) #plan-h{margin-block-end:28px}
}
/* 320-Stufe (< 360 px): wie in 136, nach den neuen Regeln noch einmal gesetzt */
@media (max-width:359px){
  :root:not(#_):not(#_) #blatt .platte .platte-kopf h2{font-size:26px}
  :root:not(#_):not(#_) .box:not(.gross) .zeit{font-size:18px}
  :root:not(#_):not(#_) .box:not(.gross) .name{font-size:25px}
  :root:not(#_):not(#_) .box .wer-zeile,:root:not(#_):not(#_) .box .wer,:root:not(#_):not(#_) .box .text,:root:not(#_):not(#_) .box .mehr-hinweis{font-size:17px}
  :root:not(#_):not(#_) .box .zutaten li{font-size:15px}
  :root:not(#_):not(#_) .box .zutaten .zutat-bild{inline-size:36px;block-size:36px}
  :root:not(#_):not(#_) #blatt .platte.uhr-blatt .uk-name{font-size:22px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-jetzt .wx-zahl{font-size:48px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-tag b,:root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-tag .wx-zahl{font-size:16px}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-std{inline-size:60px}
}
/* ===== Ende BAUPLAN 137 ===== */

/* ===== BAUPLAN 138: Handy – Wischen zwischen den Tagen + Hand-Hinweise ===== */
@media (max-width:999px){
  .tages-box.wisch-neu{animation:wischNeu .26s cubic-bezier(.2,.8,.2,1) both}
  .tages-box.wisch-neu.von-links{animation-name:wischNeuL}
}
@keyframes wischNeu{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}
@keyframes wischNeuL{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:none}}
.hand-hinweis{position:absolute;z-index:60;inline-size:190px;block-size:100px;   /* BAUPLAN 140: größer */transform:translate(-50%,-50%);pointer-events:none;color:var(--ink);
  animation:handEin .3s ease-out both}
.hand-hinweis.geht{animation:handAus .28s ease-in forwards}
.hand-hinweis .hand{position:absolute;inset-block-start:50%;inset-inline-start:50%;inline-size:74px;block-size:74px;margin:-37px 0 0 -37px;display:grid;place-items:center;
  border-radius:50%;background:color-mix(in srgb,var(--ink) 24%,transparent)}
.hand-hinweis .hand svg{inline-size:44px;block-size:44px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.hand-hinweis.wisch .hand{animation:handWisch 1.3s cubic-bezier(.45,.05,.55,.95) 3}
.hand-hinweis .hand-pfeil{position:absolute;inset-block-start:50%;inline-size:16px;block-size:16px;margin-block-start:-8px;
  border:3px solid color-mix(in srgb,var(--ink) 60%,transparent);border-inline-end:0;border-block-start:0}
.hand-hinweis .hand-pfeil.links{inset-inline-start:8px;transform:rotate(45deg)}
.hand-hinweis .hand-pfeil.rechts{inset-inline-end:8px;transform:rotate(-135deg)}
.hand-hinweis.tipp .hand{animation:handTipp .95s ease-in-out 3}
.hand-hinweis .hand-welle{position:absolute;inset-block-start:50%;inset-inline-start:50%;inline-size:74px;block-size:74px;margin:-37px 0 0 -37px;border-radius:50%;
  border:2px solid color-mix(in srgb,var(--ink) 65%,transparent);opacity:0;animation:handWelle .95s ease-out 3}
@keyframes handEin{from{opacity:0}to{opacity:1}}
@keyframes handAus{to{opacity:0}}
@keyframes handWisch{0%{transform:translateX(48px)}50%{transform:translateX(-48px)}100%{transform:translateX(48px)}}
@keyframes handTipp{0%,100%{transform:scale(1)}40%{transform:scale(.8) translateY(3px)}}
@keyframes handWelle{0%,35%{opacity:0;transform:scale(.6)}45%{opacity:.85;transform:scale(.7)}100%{opacity:0;transform:scale(1.8)}}
/* ===== Ende BAUPLAN 138 ===== */

/* ===== BAUPLAN 139: /live auf dem Handy hochkant (Bühne 480 Einheiten breit) ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-buehne{padding:16px 20px 18px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-kopf{margin-block-start:0;padding-block-end:16px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-marke{gap:10px;font-size:26px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-marke .marke-kuppel,:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-marke .marke-kuppel svg{inline-size:52px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-rechts{gap:16px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-tag{display:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-wetter{font-size:22px;gap:6px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-wetter .ic{inline-size:26px;block-size:26px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-uhr{font-size:34px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .jetzt-reihe{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) minmax(0,1fr);gap:14px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .jetzt-spalte{min-block-size:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box{padding:18px 20px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .name{font-size:44px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .ober{font-size:17px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .zeit{font-size:26px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .wer{font-size:22px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .box-status .pille{font-size:14px;padding:8px 12px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .box-status{margin-block-end:12px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .zutaten{max-block-size:calc(2 * 40px + 8px);gap:8px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .zutaten li{block-size:40px;min-block-size:40px;padding:3px 14px 3px 3px;font-size:17px;gap:8px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .zutaten li > :is(img,.zutat-bild,.zutat-kreis){inline-size:34px;block-size:34px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .stueck{inline-size:56px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-band{block-size:124px;margin-block-start:16px;-webkit-mask-image:linear-gradient(to right,transparent 0,#000 24px,#000 calc(100% - 24px),transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 24px,#000 calc(100% - 24px),transparent 100%)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .band-spur{gap:14px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .band-kachel{inline-size:440px;padding:14px 20px;gap:4px;border-radius:18px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .bk-oben{font-size:21px;gap:10px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .bk-tag{font-size:13px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .bk-dauer{font-size:12px;padding:3px 8px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .bk-flammen .int-flamme{inline-size:22px;block-size:22px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .bk-name{font-size:28px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .bk-wer{font-size:18px}
/* ===== Ende BAUPLAN 139 ===== */

/* ===== BAUPLAN 141: Handy – Aufguss-Blatt scrollt als Ganzes (Kopf nicht mehr sticky) ===== */
@media (max-width:999px){
  :root:not(#_):not(#_) #blatt .platte.detail{overflow:auto;overscroll-behavior:contain}
  :root:not(#_):not(#_) #blatt .platte.detail .platte-inhalt{overflow:visible;flex:none;overscroll-behavior:auto}
}
/* ===== Ende BAUPLAN 141 ===== */

/* ===== BAUPLAN 142: Tag-Reiter – Text senkrecht mittig (Polster 12/12 statt 10/14) ===== */
@media (max-width:999px){
  :root:not(#_):not(#_) .reiter{padding-block:12px}
}
/* ===== Ende BAUPLAN 142 ===== */

/* ===== BAUPLAN 144: Wetter-Tageszeile auf ganz kleinen Handys einzeilig ===== */
@media (max-width:359px){
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-tag{gap:6px;grid-template-columns:auto 20px minmax(16px,1fr) auto auto}
  :root:not(#_):not(#_) #blatt .platte.wetter-blatt .wx-tag .wx-wt small{white-space:nowrap}
}
/* ===== Ende BAUPLAN 144 ===== */
/* ===== BAUPLAN 152: Sauna-Blatt – zwei gleich breite Kacheln (Luftfeuchtigkeit, Temperatur genau) ===== */
:root:not(#_):not(#_) .wx-werte.sauna152-werte{grid-template-columns:repeat(2,minmax(0,1fr))}
/* ===== Ende BAUPLAN 152 ===== */
/* ===== BAUPLAN 154: „Calma Saunagarten“ – am Handy einzeilig, füllt die Breite ===== */
@media (max-width:999px){ :root:not(#_):not(#_):not(#_):not(#_) .kopf h1{font-size:min(calc((100vw - 40px) / 9.1),56px)} }
/* ===== Ende BAUPLAN 154 ===== */
/* ===== BAUPLAN 155: oben klein „Calma Saunagarten“, groß „Aufgussplan“ ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .kopf .kopf-marke{font-size:19px;font-weight:500;letter-spacing:.01em}
@media (min-width:1000px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_) .kopf .kopf-marke{font-size:24px} }
@media (max-width:999px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_) .kopf h1{font-size:min(calc((100vw - 40px) / 6.4),56px)} }
/* ===== Ende BAUPLAN 155 ===== */
/* ===== BAUPLAN 156: leere Zellen (Uhrzeit ohne Termin an diesem Tag) ===== */
.a-boxen > .a-leer{visibility:hidden}
/* ===== Ende BAUPLAN 156 ===== */
/* ===== BAUPLAN 159: /live – Unterlängen nicht abschneiden, Sauna-Werte im Kopf, Hinweis „Antippen für Vollbild“ ===== */
html:has(> body.im-live),body.im-live{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:pan-x pan-y}
body.im-live *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
body.im-live :is(img,svg){-webkit-user-drag:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .name{line-height:1.15}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .box-auf{display:block}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .band-kachel{cursor:pointer}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #blatt :is(.aktionen,.fb){display:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #blatt a{pointer-events:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-sauna{display:flex;align-items:center;gap:44px;color:var(--ink-2,#D7C6B5)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-sauna .ls-wert{display:inline-flex;align-items:center;gap:14px;white-space:nowrap}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-sauna .ic{flex:none;inline-size:44px;block-size:44px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-sauna .ls-k{font-size:32px;font-weight:500}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-sauna b{font-size:50px;font-weight:600;color:var(--ink,#FFFFFF);font-variant-numeric:tabular-nums}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-sauna{gap:14px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-sauna .ls-wert{gap:5px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-sauna .ls-k{display:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-sauna .ic{inline-size:24px;block-size:24px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-sauna b{font-size:26px}
.live-vollbild-hinweis{position:fixed;inset-block-end:28px;inset-inline-start:50%;transform:translateX(-50%);z-index:100;padding:12px 22px;
  border-radius:99px;background:rgba(0,0,0,.62);color:#FFFFFF;font-size:18px;font-weight:500;line-height:1.2;white-space:nowrap;pointer-events:none;
  animation:handEin .3s ease-out both}
.live-vollbild-hinweis.geht{animation:handAus .3s ease-in forwards}
/* ===== Ende BAUPLAN 159 ===== */
/* ===== BAUPLAN 160: /live – nur EINE große Kachel (läuft gerade, sonst als Nächstes), volle Breite ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .jetzt-reihe{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .jetzt-reihe > .jetzt-spalte ~ .jetzt-spalte{display:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .name{font-size:100px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .zeit{font-size:56px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .wer{font-size:42px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .box-status .pille{font-size:26px;padding:13px 22px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .zutaten{max-block-size:calc(2 * 76px + 14px)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .zutaten li{block-size:76px;min-block-size:76px;padding:5px 28px 5px 5px;font-size:32px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .zutaten li > :is(img,.zutat-bild,.zutat-kreis){inline-size:66px;block-size:66px}
/* Beschreibung: bis zu drei Zeilen (Absätze laufen als eine Zeile durch, dann „…“) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .text{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;max-block-size:none!important;
  -webkit-mask-image:none;mask-image:none;margin-block-start:22px;max-inline-size:62ch;font-size:36px;line-height:1.45}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .text :is(.md-absatz,.md-liste,.md-liste > li){display:inline;margin:0;padding:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .text :is(.md-absatz,.md-liste > li) + :is(.md-absatz,.md-liste,.md-liste > li)::before{content:" · "}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .jetzt-reihe{grid-template-rows:minmax(0,1fr)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .name{font-size:48px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .zeit{font-size:28px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .wer{font-size:24px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .text{margin-block-start:12px;font-size:21px;-webkit-line-clamp:4;line-clamp:4}
/* Handy/Tablet hochkant: Kopf passt in eine Zeile – Kuppel ohne Schriftzug, Werte und Uhr etwas kleiner */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-marke b{display:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-sauna b{font-size:24px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-uhr{font-size:32px}
/* ===== Ende BAUPLAN 160 ===== */
/* ===== BAUPLAN 162: /live – Info-Blatt groß (aus Abstand lesbar) ===== */
@media (min-width:1000px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #blatt .platte{inline-size:min(1080px,82vw)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #blatt .platte > :is(.platte-kopf,.detail-oben,.platte-inhalt){zoom:1.6}
}
@media (min-width:700px) and (max-width:999px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #blatt .platte > :is(.platte-kopf,.detail-oben,.platte-inhalt){zoom:1.45}
}
/* ===== Ende BAUPLAN 162 ===== */
/* ===== BAUPLAN 163: /live – Sauna-Werte und Uhr größer, Kopf etwas tiefer, Beschreibung in ganzen Zeilen, „Weiterlesen …“, Doppelpunkt blinkt ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-kopf{margin-block-start:6px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-sauna b{font-size:66px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-sauna .ls-k{font-size:34px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-sauna .ic{inline-size:52px;block-size:52px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-uhr{font-size:76px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-kopf{margin-block-start:8px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-sauna b{font-size:30px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-sauna .ic{inline-size:28px;block-size:28px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-uhr{font-size:40px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box > *{flex-shrink:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box > .zutaten{overflow:hidden}
/* mehr Platz für die Beschreibung (TV 16:9): weniger Luft unter dem Kopf, schmaleres Band, etwas weniger Innenrand, kleinere Zutaten */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-kopf{padding-block-end:26px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-band{block-size:190px;margin-block-start:22px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box{padding-block:30px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .zutaten{max-block-size:calc(2 * 68px + 12px);gap:12px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .zutaten li{block-size:68px;min-block-size:68px;font-size:30px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .zutaten li > :is(img,.zutat-bild,.zutat-kreis){inline-size:58px;block-size:58px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box.weiter163 > .mehr-hinweis{display:block;margin-block:6px 0;font-size:30px;font-weight:500;line-height:1.3}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .box-status{margin-block-end:18px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box :is(.wer-zeile,.wer){line-height:1.25}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box.weiter163 > .mehr-hinweis{font-size:20px;margin-block-start:6px}
/* hochkant (Bühne 480): die TV-Größen oben gelten nicht – kleine Pillen/Zutaten/Ränder wie BAUPLAN 139 */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-kopf{padding-block-end:16px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-band{block-size:124px;margin-block-start:16px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box{padding-block:18px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .box-status{margin-block-end:12px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .box-status .pille{font-size:14px;padding:8px 12px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .zutaten{max-block-size:calc(2 * 40px + 8px);gap:8px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .zutaten li{block-size:40px;min-block-size:40px;padding:3px 14px 3px 3px;font-size:17px;gap:8px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box .zutaten li > :is(img,.zutat-bild,.zutat-kreis){inline-size:34px;block-size:34px}
.dp163{animation:dp163 1s steps(1,end) infinite}
@keyframes dp163{50%{opacity:.15}}
@media (prefers-reduced-motion:reduce){ .dp163{animation:none} }
/* ===== Ende BAUPLAN 163 ===== */
/* ===== BAUPLAN 164: /live – Kopf ohne Wörter, Zahlen so groß wie die Uhr, mehr Luft, Symbole füllen sich; Doppelpunkt blinkt immer;
   letzte Zeile der Beschreibung blendet aus; Laufband ohne abgeschnittene Unterlängen; Blatt-Kopf wie die große Kachel + Schatten ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-rechts{gap:76px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-sauna{gap:76px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-sauna .ls-wert{gap:16px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-sauna .ls-k{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-sauna b{font-size:76px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-sauna .ic{inline-size:70px;block-size:70px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-rechts{gap:22px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-sauna{gap:22px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-sauna .ls-wert{gap:6px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-sauna b{font-size:40px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-sauna .ic{inline-size:38px;block-size:38px}
/* Doppelpunkt: blinkt auch bei „Bewegung reduzieren“ (Tablet mit ausgeschalteten Animationen) – ausdrücklicher Wunsch */
@media (prefers-reduced-motion:reduce){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .dp163{animation:dp163 1s steps(1,end) infinite} }
/* Beschreibung gekürzt: letzte Zeile blendet aus (wie im Plan); nur eine Zeile: nach hinten aus */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .text.blende164{-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 1.45em),rgba(0,0,0,.06));mask-image:linear-gradient(to bottom,#000 calc(100% - 1.45em),rgba(0,0,0,.06))}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .text.blende164.eins164{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 6em),rgba(0,0,0,.06));mask-image:linear-gradient(to right,#000 calc(100% - 6em),rgba(0,0,0,.06))}
:root[dir="rtl"]:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box .text.blende164.eins164{-webkit-mask-image:linear-gradient(to left,#000 calc(100% - 6em),rgba(0,0,0,.06));mask-image:linear-gradient(to left,#000 calc(100% - 6em),rgba(0,0,0,.06))}
/* Laufband: alles passt in die Kachel – nichts wird gestaucht, das „g“ bleibt ganz */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .bk-oben{line-height:1.2}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .bk-name{line-height:1.2}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .bk-wer{line-height:1.3}
/* Detail-Blatt: Titel = Name der großen Kachel, Datum · Zeit · Flammen = ihre Zeit, X größer (Blatt ist gezoomt: 1,6 bzw. 1,45) */
@media (min-width:1000px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #blatt .platte.detail .platte-kopf h2{font-size:calc(var(--bn164,66px) / 1.6)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #blatt .platte.detail .platte-kopf .auge{font-size:calc(var(--bz164,37px) / 1.6);margin-block-end:.3em}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #blatt .platte.detail .platte-kopf .auge-zeit > .zeit-int .int-flamme{inline-size:1em;block-size:1em}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #blatt .platte.detail .platte-kopf [data-tu=blattzu]{flex:none;inline-size:calc(var(--bn164,66px) * 1.3 / 1.6);block-size:calc(var(--bn164,66px) * 1.3 / 1.6)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #blatt .platte.detail .platte-kopf [data-tu=blattzu] .ic{inline-size:calc(var(--bn164,66px) * .72 / 1.6);block-size:calc(var(--bn164,66px) * .72 / 1.6)}
}
@media (min-width:700px) and (max-width:999px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #blatt .platte.detail .platte-kopf h2{font-size:calc(var(--bn164,66px) / 1.45)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #blatt .platte.detail .platte-kopf .auge{font-size:calc(var(--bz164,37px) / 1.45);margin-block-end:.3em}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #blatt .platte.detail .platte-kopf .auge-zeit > .zeit-int .int-flamme{inline-size:1em;block-size:1em}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #blatt .platte.detail .platte-kopf [data-tu=blattzu]{flex:none;inline-size:calc(var(--bn164,66px) * 1.3 / 1.45);block-size:calc(var(--bn164,66px) * 1.3 / 1.45)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #blatt .platte.detail .platte-kopf [data-tu=blattzu] .ic{inline-size:calc(var(--bn164,66px) * .72 / 1.45);block-size:calc(var(--bn164,66px) * .72 / 1.45)}
}
/* Schatten unter dem stehenden Blatt-Kopf, sobald der Text darunter gescrollt ist (JS setzt .schatten164) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #blatt .platte > :is(.platte-kopf,.detail-oben){position:relative;z-index:3;transition:box-shadow .25s ease}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live #blatt .platte > .schatten164{box-shadow:0 14px 22px -12px rgba(0,0,0,.85),0 1px 0 color-mix(in srgb,var(--ink,#FFFFFF) 12%,transparent)}
/* ===== Ende BAUPLAN 164 ===== */
/* ===== BAUPLAN 168: nach dem Festival – Dank + Herz, Zwischenüberschriften, Location-Knöpfe, Rückblick, Feedback-Knopf, neutraler
   Dunkelmodus; vergangene Boxen dezent im Ton ihres Aufgusses ===== */
/* neutraler Dunkelmodus wie im Team (Schwarz / Grau / Weiß) – die Farben der vergangenen Aufgüsse tragen die Seite.
   Auch dort, wo basis.css die blauen Werte eigens setzt: Kopfleiste, Tageskasten, Detail-Blatt */
:root.grau178:not(#_),:root.grau178:not(#_) .leiste,:root.grau178:not(#_) .tages-box,:root.grau178:not(#_) #blatt .platte.detail:is(.ist-naechster,.ist-kommt,.ist-vorbei,.ist-ausfall){
  --stoff:hsl(220 8% 4%); --licht-warm:rgba(255,255,255,.035); --licht-kalt:rgba(255,255,255,.025); --licht-rand:rgba(255,255,255,.02);
  --glas-fill:color-mix(in srgb,hsl(225 6% 9%) 62%,transparent); --glas-klein:color-mix(in srgb,hsl(225 6% 9%) 82%,transparent); --glas-kante:rgba(255,255,255,.08);
  --surface:hsl(225 6% 9%); --surface-2:hsl(225 6% 6.5%); --surface-3:hsl(225 6% 12%); --feld:hsl(220 8% 3%);
  --schleier:color-mix(in srgb,hsl(225 6% 6.5%) 45%,transparent);
  --ink:hsl(220 6% 95.5%); --ink-2:hsl(220 6% 80%); --ink-3:hsl(220 5% 68%); --ink-stoff-2:hsl(220 6% 84%);
  --line:rgba(255,255,255,.10); --line-2:rgba(255,255,255,.26); --line-stoff:rgba(255,255,255,.16);
  --dome:hsl(220 6% 88%); --dome-past:hsl(220 5% 52%); --wood:hsl(220 5% 60%); --tonal:hsl(225 5% 14.5%); --tonal-hover:hsl(225 5% 19%);
  --linie-vorbei:rgba(255,255,255,.24); --glut-hoch:hsl(220 7% 93%);
  --primary:hsl(220 7% 93%); --on-primary:hsl(220 8% 6%); --accent-ink:hsl(220 6% 92%); --focus:hsl(220 7% 93%);
  --kante:inset 0 1px 0 rgba(255,255,255,.06); --stern-leer:rgba(255,255,255,.26); --meldung-knopf:hsl(220 7% 93%);
}
:root.grau178:not(#_):not(#_):not(#_) .tages-box.vorbei{background:hsl(225 6% 6.5%)}
:root.grau178:not(#_) #blatt .platte.detail.ist-vorbei{background:var(--rausch-fein),linear-gradient(hsl(225 6% 7.5%),hsl(225 6% 7.5%))}
:root.nachher168:not(#_) .kopf-zeile{color:var(--ink-2)}
:root.grau178:not(#_) .pille.still,:root.grau178:not(#_) .tages-box.vorbei .pille.still,:root.grau178:not(#_) #blatt .platte.detail .pille.still{background:hsl(225 5% 14.5%);color:hsl(220 5% 74%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
/* vergangene Boxen: ein Hauch der Farbe ihres Aufgusses (aus den Zutaten, wie die Stimmung) – Hintergrund und Rand, sonst ruhig */
:root:not(#_):not(#_) body:not(.im-live) .box.vorbei[style*="--ton-h"]{
  background-image:linear-gradient(160deg,oklch(.66 .11 calc(var(--ton-h) * 1deg) / .17),oklch(.6 .09 calc(var(--ton-h) * 1deg) / .07));
  border-color:oklch(.74 .09 calc(var(--ton-h) * 1deg) / .42)}
/* „Feedback geben“ in vergangenen Boxen (die ganze Box öffnet das Blatt) */
:root:not(#_):not(#_) .box .fb-knopf168{display:inline-flex;align-items:center;gap:8px;min-block-size:40px;padding:0 16px 0 13px;border-radius:20px;
  background:color-mix(in srgb,var(--ink) 13%,transparent);color:var(--ink);font-size:15px;font-weight:600;line-height:1;white-space:nowrap}
:root:not(#_):not(#_) .box .fb-knopf168 .ic{inline-size:18px;block-size:18px}
:root:not(#_):not(#_) .box.vorbei:has(> .box-auf:hover) .fb-knopf168{background:color-mix(in srgb,var(--ink) 20%,transparent)}
/* Zwischenüberschriften der oberen Reihe (Nach dem Festival, Wie war’s?, Gerade Pause …) mittig und größer */
:root:not(#_):not(#_) body:not(.im-live) .jetzt-spalte:not(.laeuft):not(.naechster) > .bereich{justify-self:center;justify-content:center;text-align:center;
  font-size:24px;font-weight:600;line-height:1.25;color:var(--ink);padding:2px 8px 12px}
@media (min-width:700px){ :root:not(#_):not(#_) body:not(.im-live) .jetzt-spalte:not(.laeuft):not(.naechster) > .bereich{font-size:28px} }
/* Kopf nach dem Festival: Logo in der Mitte (wird zum Herz), darunter der Name und groß der Dank */
:root:not(#_):not(#_) .kopf-danke168 .kopf-logo168{display:grid;place-items:center;inline-size:min(150px,40vw);min-block-size:0;margin:0 auto 10px;flex:none;gap:0}
:root:not(#_):not(#_) .kopf-danke168 .kopf-logo168 .marke-kuppel{inline-size:100%}
:root:not(#_):not(#_) .kopf-danke168 .kopf-logo168 svg{display:block;inline-size:100%;block-size:auto;overflow:visible}
/* Karte „zieht weiter“: ganz antippbar (://about blank), Knöpfe darüber */
:root:not(#_):not(#_) .ruhe-karte.mit-link168{position:relative}
:root:not(#_):not(#_) .ruhe-ganz168{position:absolute;inset:0;z-index:1;border-radius:inherit}
:root:not(#_):not(#_) .ruhe-karte.mit-link168:has(> .ruhe-ganz168:hover){background-color:color-mix(in srgb,var(--ink) 6%,var(--glas-fill,transparent))}
:root:not(#_):not(#_) .ruhe-knoepfe168{position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:10px;margin-block-start:18px}
:root:not(#_):not(#_) .ruhe-knoepfe168 .knopf{white-space:nowrap}
:root:not(#_):not(#_) .ruhe-adresse168{position:relative;z-index:2;margin:12px 0 0;font-size:15px;line-height:1.4;color:var(--ink-2)}
:root:not(#_):not(#_) .ab-knopf168{background:#C9301A;color:#FFFFFF;border-color:transparent}
:root:not(#_):not(#_) .ab-knopf168:hover{background:#DC3A22}
:root:not(#_):not(#_) .ab-knopf168 .ab-logo{display:inline-flex;inline-size:20px;block-size:20px}
:root:not(#_):not(#_) .ab-knopf168 .ab-logo svg{inline-size:100%;block-size:100%;fill:currentColor}
:root:not(#_):not(#_) #blatt .ruhe-knoepfe168.uhr{display:grid;gap:12px;margin-block-start:16px}
:root:not(#_):not(#_) #blatt .ruhe-knoepfe168.uhr .knopf{inline-size:100%;justify-content:center}
:root:not(#_):not(#_) body.im-live :is(.ruhe-knoepfe168,.ruhe-adresse168,.ruhe-ganz168){display:none}
/* Rückblick: alle Tage untereinander (breit nebeneinander), je Tag nach Aufgießern */
:root:not(#_):not(#_) .rueck-tage168{display:grid;gap:24px;margin-block-start:20px}
@media (min-width:1000px){ :root:not(#_):not(#_) .rueck-tage168{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start} }
:root:not(#_):not(#_) .rueck-person168 + .rueck-person168{margin-block-start:8px}
:root:not(#_):not(#_) .rueck-name168{display:flex;align-items:center;gap:12px;margin:18px 2px 12px;font-size:19px;font-weight:600;line-height:1.25;color:var(--ink)}
:root:not(#_):not(#_) .rueck-name168::after{content:"";flex:1;block-size:1px;background:var(--linie-vorbei)}
:root:not(#_):not(#_) .rueck-person168 > .boxen{display:grid;gap:14px;margin:0;padding:0;list-style:none}
:root:not(#_):not(#_) .rueck168 .box h5.name{margin-block-end:0}   /* h5 (Ebene unter Tag und Aufgießer) – ohne den Standard-Abstand des Browsers */
/* ===== Ende BAUPLAN 168 ===== */
/* ===== BAUPLAN 169: /live – Ruhe-Karte (nach dem Festival, Pause, vorher) groß lesbar ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .jetzt-spalte > .bereich{font-size:52px;font-weight:600;line-height:1.2;margin-block-end:24px;padding:0 4px;color:var(--ink)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .ruhe-karte{padding:56px 72px;align-items:center;gap:48px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .ruhe-inhalt{row-gap:28px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .ruhe-symbol{inline-size:112px;block-size:112px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .ruhe-symbol .ic{inline-size:60px;block-size:60px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .ruhe-text,:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .ruhe-text.lang{font-size:68px;line-height:1.22;font-weight:500;max-inline-size:24ch;color:var(--ink)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .ruhe-unter{font-size:40px;line-height:1.3}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .ruhe-kuppel{inline-size:320px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .jetzt-spalte > .bereich{font-size:30px;margin-block-end:14px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .ruhe-karte{padding:32px 28px;gap:20px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .ruhe-inhalt{row-gap:16px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .ruhe-symbol{inline-size:64px;block-size:64px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .ruhe-symbol .ic{inline-size:34px;block-size:34px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .ruhe-text,:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .ruhe-text.lang{font-size:26px;max-inline-size:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .ruhe-unter{font-size:22px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .ruhe-kuppel{inline-size:140px}
/* ===== Ende BAUPLAN 169 ===== */
/* ===== BAUPLAN 170: ://about-blank-Knopf pink mit schwarzer Schrift, das Zeichen ohne Kreis ===== */
:root:not(#_):not(#_) .ab-knopf168{background:#E6AA63;color:#0F0904;border-color:transparent}
:root:not(#_):not(#_) .ab-knopf168:hover{background:#D9A361}
:root:not(#_):not(#_) .ab-knopf168 .ab-zeichen168{display:inline-flex;flex:none;inline-size:22px;block-size:22px}
:root:not(#_):not(#_) .ab-knopf168 .ab-zeichen168 svg{inline-size:100%;block-size:100%;fill:currentColor}
/* calma-saunagarten.de: hell mit schwarzer Schrift, vor dem pinken ://about blank */
:root:not(#_):not(#_) .calma-knopf170{background:#F2ECE5;color:#0F0904;border-color:transparent}
:root:not(#_):not(#_) .calma-knopf170:hover{background:#FFFFFF}
:root:not(#_):not(#_) .ruhe-text .datum170{white-space:nowrap}
/* nach dem Festival: beide Karten oben gleich breit; Ruhe-Karten: Inhalt oben links, Kuppel oben rechts (Nutzer) */
@media (min-width:1000px){ :root.nachher168:not(#_):not(#_) body:not(.im-live) .jetzt-reihe{grid-template-columns:repeat(2,minmax(0,1fr))} }
:root:not(#_):not(#_) body:not(.im-live) .jetzt-spalte > .ruhe-karte{align-items:flex-start}
:root:not(#_):not(#_) body:not(.im-live) .jetzt-spalte > .ruhe-karte .ruhe-kuppel{align-self:flex-start}
:root:not(#_):not(#_) .rueck168 .box > .fuss{margin-block-start:auto}
/* ===== Ende BAUPLAN 170 ===== */
/* ===== BAUPLAN 171: Detail-Blatt – Sterne und Flammen im Ton des Aufgusses, Sterne kleiner, Kopf größer ===== */
:root:not(#_):not(#_):not(#_) body:not(.im-live) #blatt[style*="--ton-h"] .platte.detail{--stern:oklch(.82 .15 calc(var(--ton-h) * 1deg));--stern-leer:oklch(.82 .05 calc(var(--ton-h) * 1deg) / .3)}
:root:not(#_):not(#_):not(#_) body:not(.im-live) #blatt[style*="--ton-h"] .platte.detail:not(.ist-laeuft) .platte-kopf .int-flamme.voll{fill:oklch(.78 .15 calc(var(--ton-h) * 1deg));stroke:oklch(.52 .1 calc(var(--ton-h) * 1deg));stroke-width:1.1}
:root:not(#_):not(#_):not(#_) body:not(.im-live) #blatt[style*="--ton-h"] .platte.detail:not(.ist-laeuft) .platte-kopf .int-flamme:not(.voll){fill:oklch(.8 .05 calc(var(--ton-h) * 1deg) / .32)}
:root:not(#_):not(#_):not(#_) .box[style*="--ton-h"] .fb-marke .stern-klein{fill:oklch(.82 .15 calc(var(--ton-h) * 1deg))}
/* Sterne etwas kleiner (44 statt 56 px) */
:root:not(#_):not(#_):not(#_) body:not(.im-live) #blatt .platte.detail .halb{inline-size:min(22px,calc((100% - 4 * var(--luecke)) / 10));block-size:44px}
/* oben: Überschrift, Uhrzeit, Flammen größer – breit */
@media (min-width:700px){
  :root:not(#_):not(#_):not(#_) body:not(.im-live) #blatt .platte.detail .platte-kopf h2{font-size:32px}
  :root:not(#_):not(#_):not(#_) body:not(.im-live) #blatt .platte.detail .platte-kopf .auge{font-size:18px}
  :root:not(#_):not(#_):not(#_) body:not(.im-live) #blatt .platte.detail .platte-kopf .auge-zeit > .zeit-int .int-flamme{inline-size:1.3em;block-size:1.3em}
}
/* … und am Handy (vorher 32 px / Uhrzeit bis 23 px) */
@media (max-width:699px){
  :root:not(#_):not(#_):not(#_) body:not(.im-live) #blatt .platte.detail .platte-kopf h2{font-size:36px}
  :root:not(#_):not(#_):not(#_) body:not(.im-live) #blatt .platte.detail .platte-kopf .auge-zeit{font-size:min(27px,6.9vw)}
  :root:not(#_):not(#_):not(#_) body:not(.im-live) #blatt .platte.detail .platte-kopf .auge-zeit > .zeit-int .int-flamme{inline-size:1.2em;block-size:1.2em}
}
/* Rückblick: die Namen der Aufgießer ohne Linie, größer (Nutzer) */
:root:not(#_):not(#_):not(#_) .rueck-name168{font-size:26px;margin-block:22px 14px}
:root:not(#_):not(#_):not(#_) .rueck-name168::after{content:none}
@media (min-width:1000px){ :root:not(#_):not(#_):not(#_) .rueck-name168{font-size:28px} }
/* ===== Ende BAUPLAN 171 ===== */
/* ===== BAUPLAN 172: Herz ohne Rest der Mittellinie – gerade Linienenden im Kopf-Logo (an den Strich-Enden keine Punkte) ===== */
:root:not(#_):not(#_):not(#_) .kopf-logo168 .facetten polygon{stroke-linecap:butt}
/* ===== Ende BAUPLAN 172 ===== */
/* ===== BAUPLAN 173: Rückblick als kurze Liste nach Aufgießern ===== */
:root:not(#_):not(#_):not(#_) .rueck173 .rk173{display:grid;gap:6px;max-inline-size:820px;margin:18px auto 0}
:root:not(#_):not(#_):not(#_) .rueck173 .rp173-name{margin-block:24px 12px}
:root:not(#_):not(#_):not(#_) .rueck173 .rp173:first-child .rp173-name{margin-block-start:6px}
:root:not(#_):not(#_):not(#_) .rueck173 .rl173{display:grid;gap:10px;margin:0;padding:0;list-style:none}
:root:not(#_):not(#_):not(#_) .rueck173 .rz173{position:relative;display:flex;align-items:center;gap:12px;min-block-size:68px;padding:12px 12px 12px 18px;border-radius:20px;
  background:color-mix(in srgb,var(--ink) 4%,transparent);border:1.5px dashed var(--linie-vorbei)}
:root:not(#_):not(#_):not(#_) .rueck173 .rz173[style*="--ton-h"]{background-image:linear-gradient(160deg,oklch(.66 .11 calc(var(--ton-h) * 1deg) / .17),oklch(.6 .09 calc(var(--ton-h) * 1deg) / .07));border-color:oklch(.74 .09 calc(var(--ton-h) * 1deg) / .42)}
:root:not(#_):not(#_):not(#_) .rueck173 .rz173-text{flex:1;min-inline-size:0;display:grid;gap:3px}
:root:not(#_):not(#_):not(#_) .rueck173 .rz173-name{font-size:19px;font-weight:600;line-height:1.25;color:var(--ink);overflow-wrap:anywhere}
:root:not(#_):not(#_):not(#_) .rueck173 .rz173-tag{font-size:14px;line-height:1.3;color:var(--ink-3)}
:root:not(#_):not(#_):not(#_) .rueck173 .rz173 .fb-marke{flex:none}
:root:not(#_):not(#_):not(#_) .rueck173 .rz173[style*="--ton-h"] .fb-marke .stern-klein{fill:oklch(.82 .15 calc(var(--ton-h) * 1deg))}
:root:not(#_):not(#_):not(#_) .rueck173 .rz173-knopf{flex:none;display:inline-flex;align-items:center;gap:8px;min-block-size:40px;padding:0 15px 0 12px;border-radius:20px;
  background:color-mix(in srgb,var(--ink) 13%,transparent);color:var(--ink);font-size:15px;font-weight:600;line-height:1;white-space:nowrap}
:root:not(#_):not(#_):not(#_) .rueck173 .rz173-knopf .ic{inline-size:17px;block-size:17px}
:root:not(#_):not(#_):not(#_) .rueck173 .rz173-auf{position:absolute;inset:0;margin:0;padding:0;border:0;border-radius:inherit;background:transparent;cursor:pointer}
:root:not(#_):not(#_):not(#_) .rueck173 .rz173-auf:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
:root:not(#_):not(#_):not(#_) .rueck173 .rz173:has(> .rz173-auf:hover){background-color:color-mix(in srgb,var(--ink) 7%,transparent)}
:root:not(#_):not(#_):not(#_) .rueck173 .rz173:has(> .rz173-auf:hover) .rz173-knopf{background:color-mix(in srgb,var(--ink) 20%,transparent)}
@media (min-width:700px){ :root:not(#_):not(#_):not(#_) .rueck173 .rz173-name{font-size:21px} :root:not(#_):not(#_):not(#_) .rueck173 .rz173{padding-inline-start:22px} }
@media (max-width:359px){ :root:not(#_):not(#_):not(#_) .rueck173 .rz173{gap:8px;padding-inline-start:14px} :root:not(#_):not(#_):not(#_) .rueck173 .rz173-name{font-size:17px} :root:not(#_):not(#_):not(#_) .rueck173 .rz173-knopf{font-size:14px;padding:0 12px 0 10px} }
/* ===== Ende BAUPLAN 173 ===== */
/* ===== BAUPLAN 174: ganze Sterne – Fokus und Hover über beide Hälften eines Sterns ===== */
:root:not(#_):not(#_) .sterne input:focus-visible + .halb.a + .halb.b{outline:3px solid var(--focus);outline-offset:-3px;border-radius:8px}
@media (hover:hover){ :root:not(#_):not(#_) .sterne .halb.a:hover + .halb.b svg{fill:color-mix(in srgb,var(--stern) 72%,transparent)} }
/* ===== Ende BAUPLAN 174 ===== */

/* ===== BAUPLAN 147: Kachel-Überschriften auf dem Handy 29 → 27 px (lange Namen in einer Zeile) ===== */
@media (max-width:699px){
  :root:not(#_):not(#_) .box:not(.gross) .name,:root:not(#_):not(#_) .box.gross .name{font-size:27px}
}
@media (max-width:359px){
  :root:not(#_):not(#_) .box:not(.gross) .name,:root:not(#_):not(#_) .box.gross .name{font-size:25px}
}
/* ===== Ende BAUPLAN 147 ===== */
/* ===== BAUPLAN 176: Liste mit Avatar + Name mittig, Zeilen ohne gestrichelten Rand, neutrale Tooltips/Fenster nach dem Festival ===== */
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rp176{display:flex;flex-direction:column;align-items:center;gap:12px;margin-block:52px 16px;text-align:center}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rp173:first-child .rp176{margin-block-start:10px}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rp176-name{display:block;max-inline-size:100%;overflow-wrap:anywhere}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .av176-reihe{display:flex;justify-content:center}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .av176{display:grid;place-items:center;flex:none;inline-size:88px;block-size:88px;border-radius:50%;overflow:hidden;
  background:var(--surface-3,#352D25);color:var(--ink);font-size:36px;font-weight:600;line-height:1;box-shadow:inset 0 0 0 1.5px var(--line-2,rgba(249,240,231,.3))}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .av176 + .av176{margin-inline-start:-16px;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.14),0 0 0 3px var(--stoff,#110A04)}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .av176 > img{display:block;inline-size:100%;block-size:100%;object-fit:cover}
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_) .rueck173 .av176{inline-size:76px;block-size:76px;font-size:31px} :root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rp176{margin-block-start:44px} }
/* Zeilen: feiner durchgehender Rand statt gestrichelt (Nutzer) */
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz173{border:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz173[style*="--ton-h"]{border-color:oklch(.74 .09 calc(var(--ton-h) * 1deg) / .26)}
/* „Switch die Boxen“ (Nutzer): „Wie war’s?“ mit „Feedback geben“ zuerst, „Nach dem Festival“ danach (nicht auf /live) */
:root.nachher168:not(#_):not(#_):not(#_) body:not(.im-live) .jetzt-reihe > .jetzt-spalte:has(> #jk-r){order:-1}
/* Uhr-Fenster: Datum zusammen */
:root:not(#_):not(#_):not(#_):not(#_) .kp-ruhe .datum170{white-space:nowrap}
/* Tooltips, Uhr-/Temperatur-Fenster, Link-Feld: neutral dunkel wie der Rest nach dem Festival (vorher blau) */
:root.grau178:not(#_){--pop-grund:hsl(225 6% 11%);--pop-rand:rgba(255,255,255,.12);--glas-ton:255,255,255;--akt-grund:hsl(225 5% 15%);--akt-hover:hsl(225 5% 19%);--auf-dome:hsl(220 8% 6%)}
:root.grau178:not(#_):not(#_) .kopf-tip{color:hsl(220 6% 95.5%);background:hsl(225 5% 17% / .96);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 12px 28px -12px rgba(0,0,0,.7)}
:root.grau178:not(#_):not(#_) .kopf-tip::before{border-bottom-color:hsl(225 5% 17% / .96)}
:root.grau178:not(#_):not(#_) .kopf-pop{box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 24px 54px -20px rgba(0,0,0,.7),0 2px 8px rgba(0,0,0,.2)}
/* ===== Ende BAUPLAN 176 ===== */
/* ===== BAUPLAN 178: nach dem Festival wieder das blaue, warme Grund-Design (Nutzer) – die grauen Regeln aus 168/176 hängen an html.grau178
   (nicht gesetzt); zurück zum Grau: Klasse grau178 auf <html> setzen ===== */
/* Wichtige Knöpfe weiß mit blauer Schrift (Nutzer: „Buttons würde ich weiß machen, neutraler ist besser, Schrift kann blau sein“ –
   „nicht alle, die, die wichtig sind; andere können so wie Route sein“): Feedback geben/senden, calma-saunagarten.de. Die vielen
   „Feedback geben“ in der Liste = Umriss wie „Route“. ://about blank bleibt pink. */
:root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) :is(.knopf.voll,.calma-knopf170){background:#FBF5EE;color:#3D352C;border-color:transparent;box-shadow:none;filter:none}
:root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) .rueck173 .rz173-knopf{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--rand178)}
@media (hover:hover){ :root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) :is(.knopf.voll,.calma-knopf170):hover{background:#FFFFFF;color:#3D352C}
  :root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) .rueck173 .rz173:has(> .rz173-auf:hover) .rz173-knopf{background:color-mix(in srgb,var(--ink) 8%,transparent);color:var(--ink)} }
/* Fokus (Rahmen beim Hineinklicken, Tastatur) hellblau statt Gelb (Nutzer: „es muss blau sein, helleres, nicht gelb“) */
:root.nachher168:not(#_):not(#_),:root.nachher168:not(#_):not(#_) :is(.box,.tages-box),:root.nachher168:not(#_):not(#_) #blatt .platte.detail{--focus:#D6B794}   /* Blatt und Kacheln setzen --focus selbst (basis.css) */
/* Sterne weiß statt im Aufguss-Ton (Nutzer: „Sterne muss Farbe weiß sein“, „man sieht die Sterne kaum, mach weiß“) – die Flammen bleiben im Ton */
:root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) #blatt .platte.detail{--stern:#FFFFFF;--stern-leer:rgba(235,229,221,.28)}
@media (hover:hover){ :root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) #blatt :is(.sterne:has(.halb:hover) .halb:hover,.sterne .halb:has(~ .halb:hover),.sterne .halb.a:hover + .halb.b) svg{fill:rgba(255,255,255,.9)} }
:root.nachher168:not(#_):not(#_):not(#_):not(#_) :is(.box,.rueck173 .rz173) .fb-marke .stern-klein{fill:#FFFFFF}
/* ://about blank ohne Zeichen vorne – nur der Name (Nutzer: „mache ohne das Logo vorne“) */
:root:not(#_):not(#_):not(#_) .ab-knopf168 .ab-zeichen168{display:none}
/* Umrandung der Umriss-Knöpfe (Route, Teilen, Feedback geben in der Liste) hellblau statt blass (Nutzer: „der Rand weiß bzw. hellblau“) */
:root.nachher168:not(#_):not(#_){--rand178:rgba(214,206,196,.68)}
:root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) .knopf.tonal{box-shadow:inset 0 0 0 1.5px var(--rand178)}
/* Teilen-Knopf im Detail-Blatt wie „Route“: Pille mit Umrandung statt grauer Fläche; allein (nach dem Festival) so breit wie sein Text */
:root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) #blatt .platte.detail .aktion{background:var(--surface);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--rand178);border-radius:999px}
@media (hover:hover){ :root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) #blatt .platte.detail .aktion:hover{background:color-mix(in srgb,var(--ink) 8%,var(--surface))} }
:root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) #blatt .platte.detail .aktionen:has(> .aktion:only-child){display:flex}
:root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) #blatt .platte.detail .aktionen > .aktion:only-child{padding-inline:18px 22px}
/* Glas-Knöpfe wie die Karten (Nutzer: „die Buttons auch den Effekt – leichtes Grain“, „sind alle zu clean“, „glassig, liquidish“):
   Korn (--rausch-fein), zarte Lichtkante oben, KEIN Verlauf (Nutzer: „der Verlauf ist komisch – ohne bitte“); Korn weicher (s. u.); Umriss-Knöpfe halbdurchsichtig mit Weichzeichner. Kein Glow. */
:root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) :is(.knopf.voll,.calma-knopf170){background-color:#F8F1EA;
  background-image:linear-gradient(#FBF5EE,#FBF5EE),var(--rausch-fein);
  background-blend-mode:normal,multiply;
  box-shadow:inset 0 1px 0 #FFFFFF,inset 0 -1.5px 0 rgba(61,53,44,.20),inset 0 0 0 1px rgba(255,255,255,.5),0 8px 18px -12px rgba(0,0,0,.7)}
:root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) .ab-knopf168{background-color:#E6AA63;
  background-image:linear-gradient(#E6AA63,#E6AA63),var(--rausch-fein);
  background-blend-mode:normal,soft-light;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -1px 0 rgba(64,57,48,.18),0 8px 18px -12px rgba(0,0,0,.7)}
:root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) :is(.knopf.tonal,.rueck173 .rz173-knopf),:root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) #blatt .platte.detail .aktion{background-color:rgba(221,213,203,.07);
  background-image:linear-gradient(180deg,rgba(255,255,255,.13) 0%,rgba(255,255,255,.02) 100%),var(--rausch-fein);background-blend-mode:normal,soft-light;
  -webkit-backdrop-filter:blur(10px) saturate(150%);backdrop-filter:blur(10px) saturate(150%);
  box-shadow:inset 0 0 0 1.5px var(--rand178),inset 0 1px 0 rgba(255,255,255,.22)}
@media (hover:hover){
  :root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) :is(.knopf.voll,.calma-knopf170):hover{background-color:#FDF7F0;
    background-image:linear-gradient(#FFFFFF,#FFFFFF),var(--rausch-fein)}
  :root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) .ab-knopf168:hover{background-image:linear-gradient(#E6AD68,#E6AD68),var(--rausch-fein)}
  :root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) :is(.knopf.tonal,.rueck173 .rz173:has(> .rz173-auf:hover) .rz173-knopf),:root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) #blatt .platte.detail .aktion:hover{background-color:rgba(221,213,203,.13)}
}
/* Korn weicher und schwächer (Nutzer: „der Grain überall ist zu stark – er muss smoother sein, der ist zu feinkörnig“): niedrigere
   Frequenz, nahtlos gekachelt, weniger deckend – auf der ganzen Seite (Überlagerung) und auf Karten/Knöpfen */
:root.nachher168:not(#_):not(#_){--grain:.035;
  --rausch:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.5' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
  --rausch-fein:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.45' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='.07'/%3E%3C/svg%3E")}
/* Karten oben (Wie war’s? / Nach dem Festival): ohne die runden Symbole (Nutzer: „hier keine Icons“) */
:root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) .jetzt-reihe .ruhe-karte .ruhe-symbol{display:none}
/* kleine Kuppel in der Karte „Nach dem Festival“ dezenter (Nutzer: „das Icon farblich nicht so hell“) */
:root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) .ruhe-karte .ruhe-kuppel .f{stroke:color-mix(in srgb,var(--dome) 40%,transparent)}
:root.nachher168:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) .ruhe-karte .ruhe-kuppel .f.vorbei{fill:color-mix(in srgb,var(--dome-past) 34%,transparent)}
/* ===== Ende BAUPLAN 178 ===== */
/* ===== BAUPLAN 179: Liste mit Uhrzeit, Stärke und Zutaten ===== */
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz173-tag{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz179-int{display:inline-flex;align-items:center;gap:1px}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz179-int .int-flamme{inline-size:15px;block-size:15px}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz173[style*="--ton-h"] .rz179-int .int-flamme.voll{fill:oklch(.78 .15 calc(var(--ton-h) * 1deg));stroke:oklch(.52 .1 calc(var(--ton-h) * 1deg));stroke-width:.6px}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz173[style*="--ton-h"] .rz179-int .int-flamme:not(.voll){fill:oklch(.8 .05 calc(var(--ton-h) * 1deg) / .3)}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz179-zut{display:flex;flex-wrap:wrap;gap:6px;margin-block-start:7px}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz179-chip{display:inline-flex;align-items:center;gap:6px;min-inline-size:0;max-inline-size:100%;padding:2px 10px 2px 2px;border-radius:999px;
  background:color-mix(in srgb,var(--ink) 9%,transparent);color:var(--ink-2);font-size:13px;font-weight:500;line-height:1.2}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz179-chip > span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz179-chip .zutat-bild{inline-size:24px;block-size:24px;flex:none;border-radius:50%;object-fit:cover}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz179-chip .zutat-bild.ohne{display:grid;place-items:center;background:color-mix(in srgb,var(--ink) 12%,transparent)}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz179-chip .zutat-bild.ohne svg{inline-size:15px;block-size:15px}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz179-mehr{padding-inline:10px}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz173{padding-block:14px}
@media (max-width:599px){
  :root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz173{flex-wrap:wrap;row-gap:10px}
  :root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz173-text{flex:1 1 100%}
  :root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz173 > .fb-marke{margin-inline-end:auto}
  :root:not(#_):not(#_):not(#_):not(#_) .rueck173 .rz173-knopf{margin-inline-start:auto}
}
/* ===== Ende BAUPLAN 179 ===== */
/* ===== BAUPLAN 180: Kommentarfeld höher, Zieh-Ecke unten rechts gut sichtbar (Nutzer) ===== */
:root:not(#_):not(#_):not(#_) #fb-k{min-block-size:12em;resize:vertical}
:root:not(#_):not(#_):not(#_) .fb .eingabe:focus::placeholder{color:transparent}   /* Platzhalter weg beim Hineinklicken (Nutzer) */
:root:not(#_):not(#_):not(#_) #fb-k::-webkit-resizer{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M16 3 3 16M16 8.5 8.5 16M16 13.5 13.5 16' stroke='%23DDE2F0' stroke-width='1.8' stroke-linecap='round' fill='none'/%3E%3C/svg%3E") no-repeat right 3px bottom 3px / 18px 18px}
/* ===== Ende BAUPLAN 180 ===== */
/* ===== BAUPLAN 181: Knöpfe in einer Reihe über die ganze Karte, Adresse als 4. Textzeile ===== */
:root:not(#_):not(#_):not(#_) .ruhe-karte:has(> .ruhe-knoepfe168.karte){flex-wrap:wrap}
:root:not(#_):not(#_):not(#_) .ruhe-karte > .ruhe-knoepfe168.karte{flex:1 1 100%;min-inline-size:0;margin-block-start:6px}
:root:not(#_):not(#_):not(#_) .ruhe-text .adresse181 > span{white-space:nowrap}
:root:not(#_):not(#_):not(#_) body.im-live .adresse181{display:none}
/* Kopf-Logo (Kuppel ↔ Herz) mit der feinen Linie der entfernten kleinen Kuppel: 0,7 px statt 1 px (Nutzer) */
:root:not(#_):not(#_):not(#_) .kopf-logo168 .facetten polygon{stroke-width:.7px}
/* Nutzer: „die Buttons sollen unten aligned sein“, „beide Boxen gleich“, „den Dome auch weg“ – beide Karten oben: Text oben, Knöpfe unten auf
   gleicher Höhe, gleich hoch, ohne Kuppel */
:root:not(#_):not(#_):not(#_) body:not(.im-live) .jetzt-reihe .jetzt-spalte:has(> .ruhe-karte > .ruhe-knoepfe168.karte){display:flex;flex-direction:column}
:root:not(#_):not(#_):not(#_) body:not(.im-live) .jetzt-reihe .jetzt-spalte > .ruhe-karte:has(> .ruhe-knoepfe168.karte){flex:1 1 auto;align-content:space-between}
:root:not(#_):not(#_):not(#_) body:not(.im-live) .jetzt-reihe .ruhe-karte:has(> .ruhe-knoepfe168.karte) > .ruhe-kuppel{display:none}
/* ===== Ende BAUPLAN 181 ===== */
/* ===== BAUPLAN 182: Beschreibung + Konten unter Avatar und Name ===== */
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .pr182{display:grid;justify-items:center;gap:12px;max-inline-size:560px;margin:-4px auto 18px;text-align:center}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .pr182-bio{margin:0;font-size:16px;line-height:1.5;color:var(--ink-2);overflow-wrap:anywhere}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .pr182-links{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .pr182-link{display:grid;place-items:center;inline-size:46px;block-size:46px;border-radius:50%;color:var(--ink);
  background-color:rgba(221,213,203,.07);background-image:linear-gradient(180deg,rgba(255,255,255,.13) 0%,rgba(255,255,255,.02) 100%),var(--rausch-fein);background-blend-mode:normal,soft-light;
  -webkit-backdrop-filter:blur(10px) saturate(150%);backdrop-filter:blur(10px) saturate(150%);
  box-shadow:inset 0 0 0 1.5px var(--rand178,rgba(248,241,234,.3)),inset 0 1px 0 rgba(255,255,255,.22)}
@media (hover:hover){ :root:not(#_):not(#_):not(#_):not(#_) .rueck173 .pr182-link:hover{background-color:rgba(221,213,203,.14)} }
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .pr182-link:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .pr182-link svg{inline-size:21px;block-size:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .pr182-link svg .voll{fill:currentColor;stroke:none}
/* ===== Ende BAUPLAN 182 ===== */
/* ===== BAUPLAN 183: /live-Laufband – das runde Profilfoto passt in die Zeile (Nachprüfung 175: wurde unten abgeschnitten) ===== */
:root:not(#_):not(#_) body.im-live .bk-wer .wer-bild175{inline-size:1.1em;block-size:1.1em;margin-block:-.05em}
/* ===== Ende BAUPLAN 183 ===== */
/* ===== BAUPLAN 192: Hover ohne „invers“ (Glas + Korn bleiben, etwas heller), Korn in Knöpfen schwächer, Person oben im Detail-Blatt ===== */
/* Korn in Knöpfen halb so stark – eigener Wert nur für die Knöpfe (Karten/Seite bleiben) */
:root.nachher168:not(#_):not(#_):not(#_):not(#_):not(#_) body:not(.im-live) :is(.knopf.voll,.calma-knopf170,.ab-knopf168,.knopf.tonal,.rz173-knopf,#blatt .platte.detail .aktion){--rausch-fein:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.45' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='.03'/%3E%3C/svg%3E")}
@media (hover:hover){
  :root.nachher168:not(#_):not(#_):not(#_):not(#_):not(#_) body:not(.im-live) :is(.knopf.tonal,.rz173-knopf):hover,
  :root.nachher168:not(#_):not(#_):not(#_):not(#_):not(#_) body:not(.im-live) .rueck173 .rz173:has(> .rz173-auf:hover) .rz173-knopf,
  :root.nachher168:not(#_):not(#_):not(#_):not(#_):not(#_) body:not(.im-live) #blatt .platte.detail .aktion:hover{background-color:rgba(221,213,203,.12);
    background-image:linear-gradient(180deg,rgba(255,255,255,.2) 0%,rgba(255,255,255,.06) 100%),var(--rausch-fein);background-blend-mode:normal,soft-light}
}
/* Detail-Blatt: Person oben – BAUPLAN 254: auch während eines Events (vorher nur nach dem Festival: ungestaltet + doppelt „mit …“) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail .gast192{display:flex;flex-wrap:wrap;gap:14px 24px;margin-block:2px 20px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail .gast192-p{display:flex;align-items:center;gap:14px;min-inline-size:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail .gast192 .av176-reihe{display:flex;flex:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail .gast192 .av176{display:grid;place-items:center;flex:none;inline-size:64px;block-size:64px;border-radius:50%;overflow:hidden;
  background:var(--surface-3,#352D25);color:var(--ink);font-size:26px;font-weight:600;line-height:1;box-shadow:inset 0 0 0 1.5px var(--line-2,rgba(249,240,231,.3))}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail .gast192 .av176 > img{display:block;inline-size:100%;block-size:100%;object-fit:cover}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail .gast192-name{font-size:24px;font-weight:600;line-height:1.2;color:var(--ink);overflow-wrap:anywhere}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail:has(.gast192) .detail-wer-zeile{display:none}
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail .gast192 .av176{inline-size:56px;block-size:56px;font-size:23px} :root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail .gast192-name{font-size:21px} }
/* ===== Ende BAUPLAN 192 ===== */
/* ===== BAUPLAN 190: „Über dich“ – Absätze, 5 Zeilen + „Weiterlesen“ ===== */
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .pr182-bio{white-space:pre-line}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .pr182-bio.lang190:not(.offen){display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:5;line-clamp:5;overflow:hidden}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .pr190-mehr{margin-block-start:-6px;padding:6px 10px;border:0;background:none;color:var(--ink);font:inherit;font-size:15px;font-weight:600;
  text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;cursor:pointer;border-radius:8px}
:root:not(#_):not(#_):not(#_):not(#_) .rueck173 .pr190-mehr:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
/* ===== Ende BAUPLAN 190 ===== */
/* ===== BAUPLAN 199: Sauna-Klima ===== */
:root:not(#_):not(#_):not(#_):not(#_) .kl199{display:inline-flex;align-items:center;gap:1px;margin-inline-start:8px;font-variant-numeric:tabular-nums;white-space:nowrap}
:root:not(#_):not(#_):not(#_):not(#_) .kl199-ic{inline-size:1.05em;block-size:1.05em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
:root:not(#_):not(#_):not(#_):not(#_) .kl199-pille{display:inline-flex;align-items:center;gap:4px;font-variant-numeric:tabular-nums;white-space:nowrap}
:root:not(#_):not(#_):not(#_):not(#_) .detail-status:has(.kl199-pille){display:flex;flex-wrap:wrap;gap:8px}
/* ===== Ende BAUPLAN 199 ===== */
/* ===== BAUPLAN 207: Rückblick-Kopf (Bild links, Konten oben rechts), Spitzname, Überschriften wie „Calma Rituals“ ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .av176 + .av176{box-shadow:inset 0 0 0 1.5px var(--line-2,rgba(249,240,231,.3))}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"bild name konten";column-gap:20px;row-gap:14px;
  align-items:center;margin-block:52px 18px;text-align:start}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207.mit-bio207{grid-template-areas:"bild name konten" "bild bio bio";grid-template-rows:auto 1fr;align-items:start}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp173:first-child .rp207{margin-block-start:10px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207 > .av176-reihe{grid-area:bild;justify-content:flex-start}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207-kopf{grid-area:name;display:grid;gap:4px;min-inline-size:0;align-self:center}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207.mit-bio207 .rp207-kopf{align-self:end}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207-name{margin:0;font-size:28px;font-weight:600;line-height:1.2;color:var(--ink);overflow-wrap:anywhere}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207-spitz{margin:0;font-size:17px;line-height:1.35;color:var(--ink-2);overflow-wrap:anywhere}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207 > .pr182-links{grid-area:konten;align-self:start;justify-content:flex-end;flex-wrap:nowrap;gap:6px;margin:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207-bio{grid-area:bio;display:grid;justify-items:start;gap:8px;max-inline-size:none;margin:0;text-align:start}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207-bio .pr182-bio{font-size:17px;line-height:1.55}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .unter207{max-inline-size:34em;margin:-22px auto 34px;font-size:18px;line-height:1.5;text-align:center;color:var(--ink-2);text-wrap:balance}
@media (min-width:1000px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .unter207{margin-block:-26px 44px;font-size:20px} }
@media (max-width:999px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .unter207{margin-block:-6px 30px;font-size:17px} }
@media (max-width:599px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207{column-gap:14px;margin-block-start:40px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207.mit-bio207{grid-template-areas:"bild name konten" "bio bio bio";grid-template-rows:auto auto;align-items:center}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207.mit-bio207 .rp207-kopf{align-self:center}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207 .av176{inline-size:68px;block-size:68px;font-size:28px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207 .av176 + .av176{margin-inline-start:-14px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207-name{font-size:24px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207-spitz{font-size:16px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207 > .pr182-links{gap:2px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207 > .pr182-links .pr182-link{inline-size:38px;block-size:38px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207 > .pr182-links .pr182-link svg{inline-size:19px;block-size:19px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207.gruppe207{grid-template-columns:minmax(0,1fr);grid-template-areas:"bild" "name";row-gap:12px}
}
@media (max-width:359px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207 .av176{inline-size:60px;block-size:60px;font-size:25px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207-name{font-size:22px}
}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail .gast207{display:grid;gap:2px;min-inline-size:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail .spitz207{font-size:16px;line-height:1.35;color:var(--ink-2);overflow-wrap:anywhere}
:root.nachher168:not(#_):not(#_):not(#_) body:not(.im-live) .jetzt-spalte > .bereich{font-size:28px;font-weight:450;line-height:1.15}
@media (min-width:1000px){ :root.nachher168:not(#_):not(#_):not(#_) body:not(.im-live) .jetzt-spalte > .bereich{font-size:34px} }
/* ===== Ende BAUPLAN 207 ===== */
/* ===== BAUPLAN 210: Konten-Symbole im Rückblick-Kopf vertikal mittig zum Namen ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207 > .pr182-links{align-self:center}
/* ===== Ende BAUPLAN 210 ===== */
/* ===== BAUPLAN 211: Profil-Seitenblatt, Rückblick-Kopf anklickbar, Name/Spitzname enger ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207-kopf{gap:2px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .av176 + .av176{margin-inline-start:-30px}
@media (max-width:599px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207 .av176 + .av176{margin-inline-start:-24px} }
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207-name{line-height:1.15}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207[data-pf211]{position:relative}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp211-auf{position:absolute;inset:-10px -12px;z-index:0;border:0;border-radius:22px;background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent}
@media (hover:hover){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp211-auf:hover{background:rgba(221,213,203,.06)} }
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp211-auf:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207[data-pf211] > :not(.rp211-auf){position:relative;z-index:1;pointer-events:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207[data-pf211] :is(.pr182-links,.pr182-link,.pr190-mehr){pointer-events:auto}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail button.gast192-p{border:0;padding:6px 10px 6px 6px;margin:-6px -10px -6px -6px;border-radius:999px;background:none;color:inherit;font:inherit;text-align:start;cursor:pointer}
@media (hover:hover){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail button.gast192-p:hover{background:rgba(221,213,203,.08)} }
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail button.gast192-p:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte.profil211 .platte-inhalt{display:grid;gap:22px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-kopf{display:flex;align-items:center;gap:18px;min-inline-size:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-kopf .av176-reihe{display:flex;flex:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-kopf .av176{display:grid;place-items:center;flex:none;inline-size:96px;block-size:96px;border-radius:50%;overflow:hidden;background:var(--surface-3,#352D25);
  color:var(--ink);font-size:38px;font-weight:600;box-shadow:inset 0 0 0 1.5px var(--line-2,rgba(249,240,231,.3))}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-kopf .av176 > img{display:block;inline-size:100%;block-size:100%;object-fit:cover}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-namen{display:grid;gap:2px;min-inline-size:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-namen p{margin:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-name{font-size:30px;font-weight:600;line-height:1.15;overflow-wrap:anywhere}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-spitz{font-size:17px;line-height:1.35;color:var(--ink-2);overflow-wrap:anywhere}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-links .pr182-links{display:flex;flex-wrap:wrap;gap:8px;margin:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-links .pr182-link{display:grid;place-items:center;inline-size:46px;block-size:46px;border-radius:50%;color:var(--ink);box-shadow:inset 0 0 0 1.5px rgba(221,213,203,.45)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-links .pr182-link svg{inline-size:21px;block-size:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-links .pr182-link svg .voll{fill:currentColor;stroke:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-bio{margin:0;font-size:17px;line-height:1.55;white-space:pre-line;color:var(--ink-2);overflow-wrap:anywhere}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-zahlen{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-zahl{display:grid;gap:3px;align-content:start;padding:14px 16px;border-radius:18px;background:rgba(221,213,203,.07);box-shadow:inset 0 0 0 1px rgba(221,213,203,.14)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-zahl b{font-size:28px;font-weight:600;line-height:1.1;font-variant-numeric:tabular-nums}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-zahl small{font-size:14px;color:var(--ink-2)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-zahl span{font-size:13px;line-height:1.35;color:var(--ink-2);overflow-wrap:anywhere}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-flammen{display:inline-flex;gap:2px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-flammen svg{inline-size:22px;block-size:22px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-liebling{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0;font-size:17px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-liebling small{flex-basis:100%;font-size:14px;color:var(--ink-2)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-liebling span{color:var(--ink-2)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-teil{display:grid;gap:10px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-teil h3{margin:0;font-size:19px;font-weight:600}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-chip{display:inline-flex;align-items:center;gap:7px;padding:5px 12px;border-radius:999px;background:rgba(221,213,203,.08);font-size:15px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-chip .av176-reihe{display:flex}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-chip .av176{display:grid;place-items:center;inline-size:26px;block-size:26px;margin-inline-start:-7px;border-radius:50%;overflow:hidden;background:var(--surface-3,#352D25);font-size:12px;font-weight:600}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-chip .av176 > img{inline-size:100%;block-size:100%;object-fit:cover}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-chip em{font-style:normal;color:var(--ink-2);font-size:13px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-liste{list-style:none;margin:0;padding:0;display:grid;gap:6px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-zeile{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;inline-size:100%;padding:10px 14px;border:0;border-radius:14px;
  background:rgba(221,213,203,.05);color:inherit;font:inherit;text-align:start}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt button.pf211-zeile{cursor:pointer}
@media (hover:hover){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt button.pf211-zeile:hover{background:rgba(221,213,203,.1)} }
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-wann{font-size:14px;color:var(--ink-2);font-variant-numeric:tabular-nums;white-space:nowrap}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-was{display:grid;min-inline-size:0;font-size:16px;font-weight:500;overflow-wrap:anywhere}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-was small{font-size:12px;font-weight:400;color:var(--ink-2)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-grad{font-size:15px;color:var(--ink-2);font-variant-numeric:tabular-nums}
@media (max-width:599px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-zeile{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"wann grad" "was grad";row-gap:2px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-wann{grid-area:wann} :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-was{grid-area:was} :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-grad{grid-area:grad}
}
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-kopf .av176{inline-size:76px;block-size:76px;font-size:30px} :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-name{font-size:25px} :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-zahlen{grid-template-columns:1fr 1fr} }
/* ===== Ende BAUPLAN 211 ===== */
/* ===== BAUPLAN 216: Rückblick-Kopf – Profil-Symbol, Konten am Handy unter dem Namen ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 button.pr182-link{border:0;padding:0;font:inherit;cursor:pointer;background-color:transparent}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207[data-pf211] > *{pointer-events:auto}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .pf216-klick{cursor:pointer}
@media (max-width:599px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"bild name" "bild konten";row-gap:8px;align-items:center}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207 > .pr182-links{justify-content:flex-start;flex-wrap:wrap;gap:6px;align-self:start}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207-kopf{align-self:end}
}
/* ===== Ende BAUPLAN 216 ===== */
/* ===== BAUPLAN 218: Profil – Aufguss-Farben, Zurück-Pfeil; Lichtebene über den Scrollbalken-Platz ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-zeile[style*="--ton-h"]{background:oklch(.62 .1 calc(var(--ton-h) * 1deg) / .16);box-shadow:inset 0 0 0 1px oklch(.74 .09 calc(var(--ton-h) * 1deg) / .4)}
@media (hover:hover){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt button.pf211-zeile[style*="--ton-h"]:hover{background:oklch(.62 .1 calc(var(--ton-h) * 1deg) / .26)} }
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte-kopf.mit-zurueck218{display:flex;align-items:center;gap:8px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte-kopf.mit-zurueck218 > h2{flex:1;min-inline-size:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .zurueck218{flex:none;order:-1}
:root body::after{inset-inline-end:auto;inline-size:100vw}
/* ===== Ende BAUPLAN 218 ===== */
/* ===== BAUPLAN 221: Rückblick-Kopf – nur Name (so breit wie der Text), Bild und Symbole sind klickbar ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207-name.pf216-klick{justify-self:start;inline-size:fit-content;max-inline-size:100%}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .av176-reihe.pf216-klick{justify-self:start;inline-size:fit-content}
/* ===== Ende BAUPLAN 221 ===== */
/* ===== BAUPLAN 237: Zoomstufe öffentlich ===== */
html.tz228 #root,html.tz228 #blatt,html.tz228 #meldung{zoom:var(--tz228,1)}
html.tz228 #aa237-pop > *{zoom:var(--tz228,1)}
.leiste .aa237 span{font-size:17px;font-weight:500;letter-spacing:-.01em;line-height:1}
.leiste .aa237[aria-expanded="true"]{background:color-mix(in srgb,var(--ink,#F8F1EA) 12%,transparent)}
#aa237-pop{position:fixed;z-index:60;padding:6px;border-radius:999px;background:var(--pop-grund,#251E16);color:var(--ink,#F8F1EA);
  box-shadow:inset 0 0 0 1px var(--pop-rand,rgba(214,183,148,.22)),0 12px 32px rgba(0,0,0,.45);-webkit-user-select:none;user-select:none}
#aa237-pop[hidden]{display:none}
#aa237-pop .aa237-reihe{display:flex;align-items:center;gap:6px}
#aa237-pop .aa237-k{display:grid;place-items:center;inline-size:44px;block-size:44px;padding:0;border:0;border-radius:50%;font:inherit;font-size:24px;font-weight:500;
  cursor:pointer;color:inherit;background:color-mix(in srgb,currentColor 10%,transparent)}
#aa237-pop .aa237-k:disabled{opacity:.35;cursor:default}
@media (hover:hover){ #aa237-pop .aa237-k:not(:disabled):hover{background:color-mix(in srgb,currentColor 18%,transparent)} }
#aa237-pop .aa237-k:focus-visible{outline:2px solid currentColor;outline-offset:2px}
#aa237-pop .aa237-wert{min-inline-size:64px;text-align:center;font-size:16px;font-weight:500;font-variant-numeric:tabular-nums}
/* ===== Ende BAUPLAN 237 ===== */
/* ===== BAUPLAN 234: Profil-Seitenblatt – Foto oben bündig (Nutzer: „oben ausrichten, nicht mittig“) ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .pf211-kopf{align-items:flex-start}
/* ===== Ende BAUPLAN 234 ===== */
/* ===== BAUPLAN 244: Rückblick-Kopf – Foto oben bündig (auch am Handy) ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207 > .av176-reihe{align-self:start}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207.mit-bio207 .rp207-kopf{align-self:start}
@media (max-width:599px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck173 .rp207 .rp207-kopf{align-self:start} }
/* ===== Ende BAUPLAN 244 ===== */
/* ===== BAUPLAN 259: nichts ragt aus Karten – Adresse bricht zwischen Straße und PLZ um, Textspalten dürfen schrumpfen ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .ruhe-karte > .ruhe-inhalt{min-inline-size:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .ruhe-karte .ruhe-text{overflow-wrap:break-word}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .ruhe-text .adresse181 > span{white-space:normal}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .ruhe-text .nw259{white-space:nowrap}
/* ===== Ende BAUPLAN 259 ===== */
/* ===== BAUPLAN 260: Team-Chip (Kachel/Uhr) und Team-Box (Detail-Blatt) ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-zeile{display:flex;flex-wrap:wrap;gap:6px 8px;margin-block-start:8px;white-space:normal}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260{display:inline-flex;align-items:center;gap:7px;max-inline-size:100%;min-inline-size:0;padding:3px 11px 3px 3px;border-radius:999px;
  background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.12);font-size:.82em;line-height:1.25;font-weight:500}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260:not(:has(img)){padding-inline-start:11px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-bild{inline-size:1.75em;block-size:1.75em;border-radius:50%;object-fit:cover;flex:none;display:block}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-name{min-inline-size:0;overflow-wrap:anywhere}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-boxen{display:grid;gap:12px;margin-block:6px 18px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-box{display:flex;align-items:flex-start;gap:14px;padding:14px;border-radius:18px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);min-inline-size:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-gross{inline-size:76px;block-size:76px;flex:none;border-radius:16px;overflow:hidden;display:block}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-gross img{inline-size:100%;block-size:100%;object-fit:cover;display:block}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-text{flex:1;min-inline-size:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-titel{margin:0 0 4px;font-size:1.12em;font-weight:500;line-height:1.3;overflow-wrap:anywhere}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-info{margin:0 0 8px;white-space:pre-line;overflow-wrap:anywhere;opacity:.88;text-wrap:pretty}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-links{display:flex;flex-wrap:wrap;gap:4px 16px;margin:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-links a{display:inline-flex;align-items:center;gap:7px;min-block-size:36px;min-inline-size:0;color:inherit;text-decoration:underline;
  text-decoration-thickness:1px;text-underline-offset:3px;overflow-wrap:anywhere}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-links a:focus-visible{outline:2px solid var(--focus,#DEB78C);outline-offset:2px;border-radius:6px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-links svg{inline-size:19px;block-size:19px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-links svg .voll{fill:currentColor;stroke:none}
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-gross{inline-size:60px;block-size:60px;border-radius:14px} :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-box{gap:11px;padding:12px} }
/* ===== Ende BAUPLAN 260 ===== */
/* ===== BAUPLAN 261: Impressum ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .imp261 .imp261-hinweis{margin:0 0 14px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .imp261 .ds-text p{overflow-wrap:break-word}
/* ===== Ende BAUPLAN 261 ===== */
/* ===== BAUPLAN 263: Team-Bild rund (wie Profilbild) ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-gross, :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team260-gross img{border-radius:50%}
/* ===== Ende BAUPLAN 263 ===== */
/* ===== BAUPLAN 264: Teams im Detail-Blatt + Team-Blatt ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264{margin-block:8px 18px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-titel{margin:0 0 10px;font-size:1.08em;font-weight:500;letter-spacing:.01em;opacity:.8}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-liste,:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-leute{list-style:none;margin:0;padding:0;display:grid;gap:10px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-zeile{display:flex;align-items:center;gap:14px;inline-size:100%;min-inline-size:0;padding:12px 14px;border-radius:18px;text-align:start;
  font:inherit;color:inherit;cursor:pointer;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1)}
@media (hover:hover){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-zeile:hover{background:rgba(255,255,255,.1)} }
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-zeile:focus-visible,:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-person:focus-visible{outline:2px solid var(--focus,#DEB78C);outline-offset:2px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-bild,:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-gross{display:grid;place-items:center;flex:none;border-radius:50%;overflow:hidden;background:rgba(255,255,255,.1);font-weight:500}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-bild{inline-size:60px;block-size:60px;font-size:24px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-bild img,:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-gross img{inline-size:100%;block-size:100%;object-fit:cover;display:block;border-radius:50%}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-text{flex:1;min-inline-size:0;display:grid;gap:3px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-name{font-size:1.12em;font-weight:500;line-height:1.3;overflow-wrap:anywhere}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-info{opacity:.78;line-height:1.4;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-pfeil{inline-size:22px;block-size:22px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:.6}
[dir="rtl"] :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-pfeil{transform:scaleX(-1)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-kopf{display:flex;justify-content:center;margin:4px 0 18px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-gross{inline-size:min(176px,46vw);block-size:min(176px,46vw);font-size:64px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-voll{margin:0 0 14px;white-space:pre-line;overflow-wrap:anywhere;text-wrap:pretty;line-height:1.55}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-inhalt .team260-links{margin:0 0 20px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-inhalt .team264-titel{margin-block-start:6px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-person{display:flex;align-items:center;gap:12px;inline-size:100%;padding:6px 8px;border-radius:14px;font:inherit;color:inherit;text-align:start;background:none;border:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) button.team264-person{cursor:pointer}
@media (hover:hover){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) button.team264-person:hover{background:rgba(255,255,255,.07)} }
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-person .av176-reihe{flex:none;display:flex;inline-size:auto;block-size:auto;margin:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-person .av176{inline-size:48px;block-size:48px;min-inline-size:0;font-size:19px;border-radius:50%;overflow:hidden;margin:0;display:grid;place-items:center}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-person .av176 img{inline-size:100%;block-size:100%;object-fit:cover;border-radius:50%;display:block}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-person > span:last-child{font-size:1.06em;overflow-wrap:anywhere}
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-zeile{gap:11px;padding:10px 12px} :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team264-bild{inline-size:50px;block-size:50px} }
/* ===== Ende BAUPLAN 264 ===== */
/* ===== BAUPLAN 265: Startseite Calma Saunagarten, Rückblick-Übersicht, Burger-Menü, about-blank-Rosa (html.rosa265) =====
   Rosa = #E6AA63 (wie der ://about-blank-Knopf seit 170) mit schwarzer Schrift; Karten schwarz mit hellrosa Schrift; Blätter (#blatt)
   behalten ihre dunklen Farben (die Tokens gelten nur für #root und das Menü). Kein Glow, keine Verläufe auf Knöpfen. */
:root.rosa265:not(#_):not(#_):not(#_){--stoff:#E6AA63;--bg:#E6AA63;--licht-warm:rgba(254,223,188,.38);--licht-kalt:rgba(149,108,57,.32);--licht-rand:rgba(255,255,255,.16);
  --grain:.05;color-scheme:light}
:root.rosa265:not(#_):not(#_):not(#_) #root{--ink:#0C0602;--ink-2:#282119;--ink-3:#312921;--ink-stoff-2:#1B150D;--line:rgba(12,6,2,.16);--line-2:rgba(12,6,2,.32);
  --line-stoff:rgba(12,6,2,.22);--dome:#0C0602;--dome-past:#0C0602;--focus:#0C0602;--tonal-hover:rgba(12,6,2,.10);color:var(--ink)}
:root.rosa265:not(#_):not(#_):not(#_) body{background:#E6AA63;min-block-size:100dvh}
:root.rosa265:not(#_):not(#_):not(#_) #root .leiste{background:color-mix(in srgb,#E6AA63 82%,transparent)}
:root.rosa265:not(#_):not(#_):not(#_) #root .leiste .marke-kuppel :is(.f,polygon,path,line){stroke:#0C0602}
:root.rosa265:not(#_):not(#_):not(#_) #root .leiste :is(.icon-knopf,.sprach-knopf){color:#0C0602;background:transparent;box-shadow:inset 0 0 0 1.5px rgba(12,6,2,.55)}
:root.rosa265:not(#_):not(#_):not(#_) #root .leiste :is(.icon-knopf,.sprach-knopf):hover{background:rgba(12,6,2,.10)}
:root.rosa265:not(#_):not(#_):not(#_) #root .leiste .burger265[aria-expanded="true"]{background:#0C0602;color:#E9B372;box-shadow:none}
:root.rosa265:not(#_):not(#_):not(#_) #root .fuss-zeile{color:#0C0602}
:root.rosa265:not(#_):not(#_):not(#_) #root .fuss-zeile :is(.textlink,a){color:#0C0602}
/* --- Knöpfe --- */
.k265{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-block-size:48px;padding:10px 20px;border-radius:999px;border:0;
  font:inherit;font-size:17px;font-weight:500;line-height:1.2;text-decoration:none;white-space:nowrap;cursor:pointer;flex:none}
.k265 .ic{inline-size:20px;block-size:20px}
.k265.voll{background:#0C0602;color:#E9B372}
.k265.voll:hover{background:#1B150D}
.k265.rand{background:transparent;color:inherit;box-shadow:inset 0 0 0 1.5px currentColor}
.k265.rand:hover{background:rgba(12,6,2,.08)}
.karte265 .k265.voll{background:#E6AA63;color:#0C0602}
.karte265 .k265.voll:hover{background:#E6AD68}
.karte265 .k265.rand:hover{background:rgba(217,162,97,.12)}
.nw265{white-space:nowrap;unicode-bidi:isolate}
/* --- Kopf der Startseite --- */
.seite265{max-inline-size:1080px}
.held265{display:flex;flex-direction:column;align-items:center;text-align:center;padding:28px 0 36px;color:#0C0602}
.held265-kuppel{inline-size:150px;margin-block-end:14px}
.held265-kuppel svg{inline-size:100%;block-size:auto;display:block}
.held265-kuppel svg :is(.f,polygon,path,line){stroke:#0C0602}
.held265-kicker{font-size:19px;font-weight:500;letter-spacing:.01em}
.held265 h1{font-size:min(16vw,88px);line-height:1;font-weight:500;letter-spacing:-.02em;margin-block:6px 16px;overflow-wrap:break-word;hyphens:manual}
.held265.betrieb265 h1{font-size:min(12vw,80px)}
.held265-wann{font-size:23px;line-height:1.35;font-weight:500}
.held265-wo{font-size:18px;margin-block-start:8px;max-inline-size:34ch}
.held265-status{display:inline-flex;align-items:center;gap:10px;margin-block-start:18px;padding:8px 16px;border-radius:999px;background:#0C0602;color:#E9B372;font-size:17px;font-weight:500}
.punkt265{inline-size:10px;block-size:10px;border-radius:50%;background:currentColor;flex:none}
.held265-status.offen .punkt265{background:#7CFFB2;animation:puls265 2s ease-in-out infinite}
@keyframes puls265{50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){ .held265-status.offen .punkt265{animation:none} }
.held265-knoepfe{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-block-start:22px}
.held265.klein265{padding-block:22px 26px}
.held265.klein265 h1{font-size:min(13vw,64px)}
/* --- Karten --- */
.karten265{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr));gap:16px;align-items:start}
.karte265{background:#0C0602;color:#F8F0E6;border-radius:28px;padding:22px 22px 24px;min-inline-size:0;scroll-margin-block-start:var(--kopf-h,80px)}
.karte265 h2{font-size:26px;font-weight:500;color:#E9B372;margin-block-end:14px;line-height:1.2}
.karte265 h3,.karte265-unter{font-size:18px;font-weight:500;color:#E9B372;margin-block:18px 8px}
.karte265-knoepfe{display:flex;flex-wrap:wrap;gap:10px;margin-block-start:16px}
.hilfe265{font-size:15px;line-height:1.45;color:#DED6CC;margin-block-start:12px}
.karte265 address{font-style:normal;font-size:18px;line-height:1.45}
.prog265{display:grid;gap:12px}
.prog265 li{display:grid;gap:4px;padding-block-end:12px;border-block-end:1px solid rgba(217,162,97,.22)}
.prog265 li:last-child{border:0;padding:0}
.prog265-name{font-size:19px;font-weight:500}
.prog265-text{font-size:16px;line-height:1.45;color:#DED6CC}
.prog265-info{font-size:16px;font-weight:500;color:#E9B372}
.preis265{inline-size:100%;border-collapse:collapse;font-size:17px}
.preis265 :is(th,td){padding:9px 4px;text-align:end;border-block-end:1px solid rgba(217,162,97,.22);font-variant-numeric:tabular-nums}
.preis265 thead th{font-size:14px;font-weight:500;color:#DED6CC}
.preis265 tbody th{text-align:start;font-weight:400}
.preis265 tbody td{font-weight:500;white-space:nowrap}
.preis265 tbody tr:last-child :is(th,td){border:0}
.friend265{display:grid;gap:2px;margin-block-start:14px;padding:12px 14px;border-radius:18px;background:rgba(201,148,83,.14)}
.friend265 b{font-weight:500;color:#E9B372}
.friend265 span{font-size:15px;line-height:1.45;color:#DED6CC}
.preis265-liste{display:grid;gap:0;margin:0}
.preis265-liste div{display:flex;justify-content:space-between;gap:12px;padding-block:9px;border-block-end:1px solid rgba(217,162,97,.22)}
.preis265-liste div:last-child{border:0}
.preis265-liste dd{margin:0;font-weight:500;white-space:nowrap}
.zeile265{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-block:10px;border-block-end:1px solid rgba(217,162,97,.22)}
.zeile265-was{display:grid;gap:2px;min-inline-size:0}
.zeile265-was b{font-weight:500}
.zeile265-was small{font-size:15px;color:#DED6CC}
.zeile265-zeit{font-weight:500;flex:none}
.ueber265-text{font-size:17px;line-height:1.55}
.rund265-reihe{display:flex;flex-wrap:wrap;gap:10px}
.rund265{display:inline-grid;place-items:center;inline-size:48px;block-size:48px;border-radius:50%;color:#F8F0E6;box-shadow:inset 0 0 0 1.5px rgba(217,162,97,.6)}
.rund265:hover{background:rgba(217,162,97,.14)}
.rund265 svg{inline-size:22px;block-size:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.rund265 svg .voll{fill:currentColor;stroke:none}
.helfer265{display:grid;gap:2px;margin-block-start:16px;padding:12px 14px;border-radius:18px;background:rgba(201,148,83,.14);color:#F8F0E6;text-decoration:none}
.helfer265 b{font-weight:500;color:#E9B372}
.helfer265 span{display:inline-flex;align-items:center;gap:6px;font-size:15px;color:#DED6CC}
.helfer265:hover{background:rgba(201,148,83,.22)}
/* --- Rückblick-Karten --- */
.rk265-liste{display:grid;gap:10px}
.rueck265 .rk265-liste{grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr));gap:16px}
.rk265{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:22px;text-decoration:none;color:#F8F0E6;background:rgba(201,148,83,.12)}
.rk265:hover{background:rgba(201,148,83,.2)}
.rueck265 .rk265{background:#0C0602;padding:20px;border-radius:28px}
.rueck265 .rk265:hover{background:#1B150D}
.rk265-kuppel{inline-size:54px;flex:none}
.rk265-kuppel svg{inline-size:100%;block-size:auto;display:block}
.rk265-kuppel svg :is(.f,polygon,path,line){stroke:#E9B372}
.rk265-text{display:grid;gap:3px;min-inline-size:0;flex:1}
.rk265-name{font-size:20px;font-weight:500;line-height:1.25}
.rk265-wann{font-size:15px;color:#DED6CC}
.rk265-zahlen{display:flex;gap:14px;font-size:15px;color:#E9B372}
.rk265-zahlen span{display:inline-flex;align-items:center;gap:5px}
.rk265-pfeil{flex:none;color:#E9B372}
.zurueck265-start{display:flex;justify-content:center;margin-block:26px 8px}
.zurueck265-ic{transform:scaleX(-1)}
[dir="rtl"] .zurueck265-ic{transform:none}
.zurueck265{margin-block:14px 0}
.zurueck265-link{display:inline-flex;align-items:center;gap:6px;min-block-size:44px;padding:6px 14px 6px 10px;border-radius:999px;text-decoration:none;font-weight:500;box-shadow:inset 0 0 0 1.5px var(--rand178,rgba(214,206,196,.68))}
.zurueck265-link:hover{background:rgba(221,213,203,.10)}
/* --- Burger + Menü (Dropdown wie Uhr/Wetter, in Schwarz-Rosa) --- */
.menue265{position:fixed;z-index:46;inline-size:min(340px,calc(100vw - 16px));max-block-size:calc(100dvh - 90px);overflow:hidden auto;overscroll-behavior:contain;
  padding:10px;border-radius:24px;background:#0C0602;color:#F8F0E6;box-shadow:inset 0 0 0 1px rgba(217,162,97,.28),0 24px 54px -20px rgba(0,0,0,.7);
  font-size:17px;line-height:1.3;animation:kopfPopEin .18s cubic-bezier(.2,.8,.2,1)}
@media (prefers-reduced-motion:reduce){ .menue265{animation:none} }
.menue265 :focus-visible{outline:3px solid #E9B372;outline-offset:2px}
.m265-nav{display:grid;gap:2px;padding-block-end:8px;margin-block-end:8px;border-block-end:1px solid rgba(217,162,97,.22)}
.m265-link{display:flex;align-items:center;min-block-size:46px;padding:8px 14px;border-radius:14px;text-decoration:none;color:inherit;font-weight:500}
.m265-link:hover{background:rgba(217,162,97,.12)}
.m265-link.an{background:#E6AA63;color:#0C0602}
.m265-reihe,.m265-zeile{display:flex;align-items:center;gap:12px;min-block-size:48px;padding:6px 8px 6px 14px;border-radius:14px}
.m265-wort{flex:1}
.m265-zoom{display:inline-flex;align-items:center;gap:4px}
.m265-k{inline-size:40px;block-size:40px;border-radius:50%;border:0;background:rgba(217,162,97,.14);color:inherit;font-size:22px;line-height:1}
.m265-k:hover:not(:disabled){background:rgba(217,162,97,.26)}
.m265-k:disabled{opacity:.35;cursor:default}
.m265-wert{min-inline-size:58px;text-align:center;font-variant-numeric:tabular-nums}
.m265-zeile{inline-size:100%;border:0;background:transparent;color:inherit;font:inherit;text-align:start;padding-inline-end:14px}
.m265-zeile:hover{background:rgba(217,162,97,.12)}
.m265-zeile .ic{color:#E9B372}
.m265-zeile > span:first-of-type{flex:1}
.m265-rechts{color:#DED6CC;font-size:15px}
.m265-klein{display:flex;flex-wrap:wrap;gap:4px 16px;padding:10px 14px 4px;margin-block-start:8px;border-block-start:1px solid rgba(217,162,97,.22)}
.m265-klein .textlink{font-size:15px;color:#DED6CC;background:none;border:0;padding:6px 0;min-block-size:36px}
html.tz228:not(#_) .menue265 > *{zoom:var(--tz228,1)}
html.tz228:not(#_) .menue265{inline-size:min(calc(340px * var(--tz228,1)),calc(100vw - 16px));padding:calc(10px * var(--tz228,1))}
@media (max-width:420px){
  .held265{padding-block:16px 28px}
  .held265-kuppel{inline-size:120px}
  .held265-wann{font-size:21px}
  .karte265{padding:20px 18px 22px;border-radius:24px}
  .karte265 h2{font-size:24px}
}
@media (max-width:359px){ .held265-wann{font-size:19px} .k265{padding-inline:16px;font-size:16px} }
@media print{ .menue265{display:none} }
/* ===== Ende BAUPLAN 265 ===== */
/* ===== BAUPLAN 268: kein flaches Pink (Nutzer 14.10.: „es hieß nicht, dass es pink wird“ – „es ging darum, dass es die Farbe einnimmt,
   rosig, wie auch andere Aufgüsse“). Startseite/Rückblick/Menü aus 265 jetzt im Glas-Design der Seite mit ihren Farbwerten – die
   Stimmung (serve.mjs/stimmung.js) färbt alles rosig um, solange kein Plan läuft. Akzent = Hellblau #D6B794 (wird mit umgefärbt). ===== */
:root:not(#_) .held265{color:var(--ink)}
:root:not(#_) :is(.held265-kuppel,.rk265-kuppel) svg :is(.f,polygon,path,line){stroke:var(--dome)}
:root:not(#_) .held265-status{background:color-mix(in srgb,var(--tonal) 80%,transparent);color:var(--ink);box-shadow:inset 0 0 0 1px rgba(var(--glas-ton),.14)}
:root:not(#_) .held265-status:not(.offen) .punkt265{background:#D6B794}
:root:not(#_) :is(.k265.voll,.karte265 .k265.voll){background-color:#F8F1EA;color:#3D352C;
  background-image:linear-gradient(#FBF5EE,#FBF5EE),var(--rausch-fein);background-blend-mode:normal,multiply;
  box-shadow:inset 0 1px 0 #FFFFFF,inset 0 -1.5px 0 rgba(61,53,44,.20),0 8px 18px -12px rgba(0,0,0,.7)}
:root:not(#_) :is(.k265.voll,.karte265 .k265.voll):hover{background-image:linear-gradient(#FFFFFF,#FFFFFF),var(--rausch-fein)}
:root:not(#_) :is(.k265.rand,.karte265 .k265.rand){color:var(--ink);background-color:rgba(221,213,203,.07);
  background-image:linear-gradient(180deg,rgba(255,255,255,.13) 0%,rgba(255,255,255,.02) 100%),var(--rausch-fein);background-blend-mode:normal,soft-light;
  -webkit-backdrop-filter:blur(10px) saturate(150%);backdrop-filter:blur(10px) saturate(150%);
  box-shadow:inset 0 0 0 1.5px var(--rand178,rgba(214,206,196,.68)),inset 0 1px 0 rgba(255,255,255,.22)}
:root:not(#_) :is(.k265.rand,.karte265 .k265.rand):hover{background-color:rgba(221,213,203,.13)}
/* Karten = Glas wie die Tages-Boxen */
:root:not(#_) :is(.karte265,.rueck265 .rk265){color:var(--ink);background-color:var(--glas-fill);
  background-image:linear-gradient(157deg,rgba(var(--glas-ton),.10) 0%,rgba(255,255,255,0) 38%,rgba(0,0,0,.05) 100%),var(--rausch-fein);
  background-blend-mode:normal,var(--rausch-mix);-webkit-backdrop-filter:blur(22px) saturate(1.4);backdrop-filter:blur(22px) saturate(1.4);
  border:1px solid rgba(var(--glas-ton),.14);box-shadow:inset 0 1px 0 var(--glas-kante),inset 0 -1px 0 rgba(0,0,0,.06),0 10px 30px -14px rgba(25,18,10,.35)}
:root:not(#_) .rueck265 .rk265:hover{background-color:color-mix(in srgb,var(--glas-fill) 80%,rgba(221,213,203,.3))}
:root:not(#_) :is(.karte265 h2,.karte265 h3,.karte265-unter){color:var(--ink)}
:root:not(#_) :is(.hilfe265,.prog265-text,.friend265 span,.helfer265 span,.zeile265-was small,.preis265 thead th,.rk265-wann,.m265-rechts){color:var(--ink-2)}
:root:not(#_) :is(.prog265-info,.friend265 b,.helfer265 b,.rk265-zahlen,.rk265-pfeil){color:#D6B794}
:root:not(#_) :is(.prog265 li,.preis265 th,.preis265 td,.preis265-liste div,.zeile265){border-color:var(--line)}
:root:not(#_) :is(.friend265,.helfer265,.rk265){background:rgba(221,213,203,.07);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
:root:not(#_) :is(.helfer265,.rk265):hover{background:rgba(221,213,203,.13)}
:root:not(#_) .rund265{color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--rand178,rgba(214,206,196,.68))}
:root:not(#_) .rund265:hover{background:rgba(221,213,203,.13)}
/* Menü wie die Dropdowns unter Uhr/Wetter, aktiver Punkt weiß (wie im Team) */
:root:not(#_) .menue265{background-color:color-mix(in srgb,var(--pop-grund) 97%,transparent);color:var(--ink);
  background-image:linear-gradient(157deg,rgba(var(--glas-ton),.08) 0%,rgba(255,255,255,0) 40%),var(--rausch-fein);background-blend-mode:normal,var(--rausch-mix);
  box-shadow:inset 0 0 0 1px var(--pop-rand),inset 0 1px 0 var(--glas-kante),0 24px 54px -20px rgba(16,10,4,.6),0 2px 8px rgba(16,10,4,.16)}
:root:not(#_) .menue265 :focus-visible{outline-color:var(--focus)}
:root:not(#_) :is(.m265-nav,.m265-klein){border-color:var(--line)}
:root:not(#_) :is(.m265-link,.m265-zeile):hover{background:rgba(221,213,203,.10)}
:root:not(#_) .m265-link.an{background:#FBF5EE;color:#3D352C}
:root:not(#_) .m265-zeile .ic{color:#D6B794}
:root:not(#_) .m265-k{background:rgba(221,213,203,.12)}
:root:not(#_) .m265-k:hover:not(:disabled){background:rgba(221,213,203,.22)}
:root:not(#_) .m265-klein .textlink{color:var(--ink-2)}
:root:not(#_) .m265-klein{flex-wrap:nowrap;justify-content:space-between;gap:12px;overflow:hidden}
:root:not(#_) .m265-klein li{flex:none}
:root:not(#_) .m265-klein.umbruch268{flex-wrap:wrap;justify-content:flex-start;gap:4px 16px}
:root:not(#_) .m265-klein .textlink{white-space:nowrap}
/* ===== Ende BAUPLAN 268 ===== */
/* ===== BAUPLAN 269: Startseite hell, warm, freundlich (html.hell269 + data-theme light) – Marketing-Aufbau =====
   Warme Farben, die die Stimmung NICHT umfärbt (Koralle/Pink, Ton < 38° bzw. Rosa): Grund #FFE2DA, Akzent #8C6435,
   Knopf #9B6F3A (weiße Schrift 4,9:1), Koralle #FF7F6E. Schrift = --ink der Seite (dunkles Rosé aus der Stimmung). */
:root.hell269:not(#_):not(#_){--stoff:#FFE2DA;--bg:#FFE2DA;--licht-warm:rgba(255,140,110,.42);--licht-kalt:rgba(209,155,89,.30);--licht-rand:rgba(230,195,156,.36);--grain:.04;color-scheme:light}
:root.hell269:not(#_):not(#_) body{background:#FFE2DA}
:root.hell269:not(#_):not(#_) #root .leiste{background:color-mix(in srgb,#FFE2DA 78%,transparent)}
:root.hell269:not(#_):not(#_) #root .leiste :is(.icon-knopf,.sprach-knopf){background:rgba(255,255,255,.62);color:var(--ink)}
:root.hell269:not(#_):not(#_) #root .leiste :is(.icon-knopf,.sprach-knopf):hover{background:rgba(255,255,255,.92)}
:root.hell269:not(#_):not(#_) #root .leiste .burger265[aria-expanded="true"]{background:#9B6F3A;color:#FFFFFF}
/* Knöpfe */
:root.hell269:not(#_):not(#_) :is(.k265.voll,.karte265 .k265.voll){background:#9B6F3A;background-image:none;color:#FFFFFF;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 10px 22px -14px rgba(57,50,41,.55)}
:root.hell269:not(#_):not(#_) :is(.k265.voll,.karte265 .k265.voll):hover{background:#8C6434}
:root.hell269:not(#_):not(#_) :is(.k265.rand,.karte265 .k265.rand){background:rgba(255,255,255,.55);background-image:none;color:var(--ink);
  -webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--ink) 40%,transparent)}
:root.hell269:not(#_):not(#_) :is(.k265.rand,.karte265 .k265.rand):hover{background:rgba(255,255,255,.9)}
.gross269{min-block-size:56px;padding-inline:28px;font-size:18px}
/* Kopf */
.h269{display:flex;flex-direction:column;align-items:center;text-align:center;padding:18px 0 34px;color:var(--ink)}
.h269 .held265-kuppel{inline-size:132px;margin-block-end:8px}
.h269-kicker{font-size:18px;font-weight:500;color:var(--ink-2);letter-spacing:.01em}
.h269 h1{font-size:min(17vw,108px);line-height:1;font-weight:500;letter-spacing:-.03em;margin-block:6px 10px;overflow-wrap:break-word}
.h269-wo{font-size:18px;max-inline-size:32ch;color:var(--ink-2)}
.h269-tage{display:flex;align-items:center;justify-content:center;gap:10px;margin-block-start:20px}
.tag269{display:grid;justify-items:center;min-inline-size:96px;padding:12px 16px 12px;border-radius:24px;background:rgba(255,255,255,.72);
  box-shadow:0 14px 30px -22px rgba(70,63,54,.5)}
.tag269-wt{font-size:15px;font-weight:500;color:var(--ink-2);text-transform:uppercase;letter-spacing:.06em}
.tag269-d{font-size:46px;line-height:1.05;font-weight:500;color:#8C6435;font-variant-numeric:tabular-nums}
.tag269-m{font-size:15px;color:var(--ink-2)}
.h269-plus{font-size:24px;color:#8C6435}
.h269-zeit{font-size:22px;font-weight:500;margin-block-start:14px}
.cd269{display:flex;justify-content:center;gap:8px;margin-block-start:18px}
.cd269-k{display:grid;justify-items:center;min-inline-size:70px;padding:8px 12px;border-radius:18px;background:rgba(255,255,255,.5);box-shadow:inset 0 0 0 1px rgba(255,255,255,.7)}
.cd269-k b{font-size:30px;line-height:1.1;font-weight:500;font-variant-numeric:tabular-nums}
.cd269-k small{font-size:13px;color:var(--ink-2)}
.h269-knoepfe{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-block-start:24px}
.h269-prog{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-block-start:20px;inline-size:100%;max-inline-size:560px;text-align:start}
.h269-prog li{display:flex;align-items:center;gap:8px;min-inline-size:0;padding:8px 12px 8px 8px;border-radius:18px;background:rgba(255,255,255,.7);font-size:14px;font-weight:500;line-height:1.2;overflow-wrap:break-word;hyphens:auto}
.h269-prog li > span:last-child{min-inline-size:0}
.h269-pic{display:grid;place-items:center;inline-size:30px;block-size:30px;border-radius:50%;background:#F8F0E6;color:#8C6435;flex:none}
.h269-pic svg{inline-size:18px;block-size:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.h269-preis{display:inline-flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 8px;margin-block-start:16px;font-size:17px;font-weight:500;color:#574E46}
.h269-preis b{font-size:22px;font-weight:500;color:#8C6435}
.h269-punkt{color:#8C6435}
.herz269 svg{inline-size:17px;block-size:17px;fill:#FF7F6E;display:block}
:root.hell269:not(#_):not(#_) .h269 .held265-kuppel svg :is(.f,polygon,path,line){stroke:#8C6435}
:root.hell269:not(#_):not(#_) .held265-status{background:rgba(255,255,255,.62);color:var(--ink);box-shadow:none;margin-block-start:16px}
:root.hell269:not(#_):not(#_) .held265-status:not(.offen) .punkt265{background:#FF7F6E}
:root.hell269:not(#_):not(#_) .held265-status.offen .punkt265{background:#1F9D55}
/* Abschnitte */
.s269{margin-block:40px;scroll-margin-block-start:var(--kopf-h,80px)}
.s269-titel{text-align:center;font-size:34px;font-weight:500;line-height:1.15;margin-block-end:18px;color:var(--ink)}
/* Programm */
.prog269{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.p269{display:grid;align-content:start;gap:12px;padding:18px;border-radius:26px;background:rgba(255,255,255,.72);box-shadow:0 16px 34px -26px rgba(70,63,54,.55);color:var(--ink)}
.p269-ic{display:grid;place-items:center;inline-size:54px;block-size:54px;border-radius:50%;background:#F8F0E6;color:#8C6435}
.p269-ic svg{inline-size:28px;block-size:28px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.p269-text{display:grid;gap:8px;min-inline-size:0}
.p269-name{font-size:18px;font-weight:500;line-height:1.25;overflow-wrap:break-word}
.p269.breit{grid-column:1/-1;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:16px}
.p269.breit:has(.p269-info){align-items:start}
.p269-info{font-size:16px;line-height:1.45;color:var(--ink-2)}
.p269-chips{display:flex;flex-wrap:wrap;gap:6px}
.chip269{display:inline-flex;align-items:center;padding:5px 12px;border-radius:999px;background:#F8F0E6;color:#574E46;font-size:15px;font-weight:500}
.p269-klein{font-size:14px;line-height:1.4;color:var(--ink-2)}
/* Tickets */
.tixe269{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.tix269{position:relative;display:grid;justify-items:center;text-align:center;gap:2px;padding:20px 14px 18px;border-radius:24px;background:rgba(255,255,255,.85);color:var(--ink);
  box-shadow:0 16px 34px -26px rgba(70,63,54,.55);
  -webkit-mask:radial-gradient(circle 11px at 0 68%,#0000 97%,#000) left/51% 100% no-repeat,radial-gradient(circle 11px at 100% 68%,#0000 97%,#000) right/51% 100% no-repeat;
  mask:radial-gradient(circle 11px at 0 68%,#0000 97%,#000) left/51% 100% no-repeat,radial-gradient(circle 11px at 100% 68%,#0000 97%,#000) right/51% 100% no-repeat}
.tix269::after{content:"";position:absolute;inset-inline:18px;inset-block-start:68%;border-block-start:2px dashed rgba(155,111,58,.28)}
.tix269-art{font-size:16px;font-weight:500;color:var(--ink-2);overflow-wrap:anywhere}
.tix269-preis{font-size:48px;line-height:1.1;font-weight:500;color:#8C6435;font-variant-numeric:tabular-nums}
.tix269-vvk{font-size:14px;color:var(--ink-2)}
.tix269-ak{font-size:15px;margin-block-start:22px;white-space:nowrap}
.friend269{display:flex;align-items:center;gap:14px;margin-block-start:14px;padding:14px 18px;border-radius:24px;background:#F8F0E6}
.friend269-badge{flex:none;display:grid;place-items:center;inline-size:58px;block-size:58px;border-radius:50%;background:#FF7F6E;color:#261E17;font-size:18px;font-weight:600;white-space:nowrap}
.friend269-text{display:grid;gap:2px;min-inline-size:0}
.friend269-text b{font-size:17px;font-weight:500;color:#574E46}
.friend269-text > span{font-size:15px;line-height:1.4;color:var(--ink-2)}
.s269-knopf{display:flex;justify-content:center;margin-block-start:18px}
/* Danach */
.danach269{display:grid;justify-items:center;text-align:center;padding:22px 18px;border-radius:26px;background:rgba(255,255,255,.6);color:var(--ink)}
.woche269{display:flex;justify-content:center;gap:6px;flex-wrap:nowrap}
.woche269 li{display:grid;place-items:center;inline-size:42px;block-size:42px;border-radius:50%;font-size:14px;font-weight:500}
.woche269 li.an{background:#9B6F3A;color:#FFFFFF}
.woche269 li.zu{color:var(--ink-3);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--ink) 22%,transparent);text-decoration:line-through}
.h269 .woche269{margin-block-start:20px}
.preis269{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;inline-size:100%;margin-block-start:16px}
.preis269 div{display:grid;gap:2px;padding:14px 10px;border-radius:20px;background:rgba(255,255,255,.85)}
.preis269 b{font-size:36px;line-height:1.1;font-weight:500;color:#8C6435;font-variant-numeric:tabular-nums}
.preis269 span{font-size:15px;color:var(--ink-2)}
.danach269 .hilfe265{color:var(--ink-2);max-inline-size:44ch}
/* Karten unten (Anfahrt, Über Calma, Rückblick) hell */
:root.hell269:not(#_):not(#_) :is(.karte265,.rueck265 .rk265){background:rgba(255,255,255,.72);background-image:none;-webkit-backdrop-filter:none;backdrop-filter:none;
  border:0;box-shadow:0 16px 34px -26px rgba(70,63,54,.55);color:var(--ink)}
:root.hell269:not(#_):not(#_) .rueck265 .rk265:hover{background:rgba(255,255,255,.92)}
:root.hell269:not(#_):not(#_) .karte265 h2{font-size:26px}
:root.hell269:not(#_):not(#_) :is(.prog265-info,.friend265 b,.helfer265 b,.rk265-zahlen,.rk265-pfeil){color:#8C6435}
:root.hell269:not(#_):not(#_) :is(.friend265,.helfer265,.rk265){background:#F8F0E6;box-shadow:none;color:var(--ink)}
:root.hell269:not(#_):not(#_) :is(.helfer265,.rk265):hover{background:#E7DFD5}
:root.hell269:not(#_):not(#_) .rund265{color:#8C6435;background:#F8F0E6;box-shadow:none}
:root.hell269:not(#_):not(#_) .rund265:hover{background:#E7DFD5}
:root.hell269:not(#_):not(#_) .rk265-kuppel svg :is(.f,polygon,path,line){stroke:#8C6435}
:root.hell269:not(#_):not(#_) .rueck265 .rk265{background:rgba(255,255,255,.72)}
/* Menü hell */
:root.hell269:not(#_):not(#_) .menue265{background:rgba(253,250,248,.97);background-image:none;color:var(--ink);box-shadow:0 0 0 1px rgba(155,111,58,.14),0 24px 54px -22px rgba(57,50,41,.45)}
:root.hell269:not(#_):not(#_) :is(.m265-link,.m265-zeile):hover{background:rgba(155,111,58,.08)}
:root.hell269:not(#_):not(#_) .m265-link.an{background:#9B6F3A;color:#FFFFFF}
:root.hell269:not(#_):not(#_) .m265-zeile .ic{color:#8C6435}
:root.hell269:not(#_):not(#_) .m265-k{background:rgba(155,111,58,.10)}
:root.hell269:not(#_):not(#_) .m265-k:hover:not(:disabled){background:rgba(155,111,58,.18)}
:root.hell269:not(#_):not(#_) :is(.m265-nav,.m265-klein){border-color:rgba(155,111,58,.16)}
/* Tickets-Leiste unten am Handy */
.cta269{position:fixed;inset-inline:12px;inset-block-end:calc(12px + env(safe-area-inset-bottom));z-index:40;display:flex;
  transform:translateY(calc(100% + 30px));transition:transform .3s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.cta269.an{transform:none;pointer-events:auto}
.cta269 .k265{inline-size:100%;min-block-size:54px;font-size:18px}
@media (min-width:700px){ .cta269{display:none} }
@media (prefers-reduced-motion:reduce){ .cta269{transition:none} }
/* Abschnitte gleiten beim Scrollen herein (nur wo der Browser das kann, nicht bei reduzierter Bewegung) */
@keyframes rein269{from{opacity:0;transform:translateY(26px)}}
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    .m269 :is(.s269,.karte265){animation:rein269 linear both;animation-timeline:view();animation-range:entry 0% entry 35%}
  }
}
/* breit */
@media (min-width:900px){
  .prog269{grid-template-columns:repeat(2,minmax(0,1fr))}
  .h269-prog{grid-template-columns:repeat(4,minmax(0,1fr));max-inline-size:860px}
  .s269{max-inline-size:900px;margin-inline:auto;margin-block:56px}
  .s269-titel{font-size:40px}
  .tixe269{max-inline-size:640px;margin-inline:auto}
  .friend269{max-inline-size:640px;margin-inline:auto}
  .danach269{max-inline-size:640px;margin-inline:auto}
}
@media (max-width:420px){ .h269 .held265-kuppel{inline-size:112px} .s269-titel{font-size:30px} .tix269-preis{font-size:42px} }
@media (max-width:419px){ .cd269{gap:6px} .cd269-k{min-inline-size:62px;padding-inline:6px} .cd269-k b{font-size:26px} .cd269-k small{font-size:12px} }
@media (max-width:359px){
  .tag269{min-inline-size:84px;padding-inline:12px} .tag269-d{font-size:40px}
  .cd269-k{min-inline-size:58px;padding-inline:4px} .cd269-k b{font-size:23px} .cd269-k small{font-size:11px}
  .h269-prog li{font-size:13px;padding-inline-end:8px} .h269-pic{inline-size:26px;block-size:26px}
  .prog269{grid-template-columns:minmax(0,1fr)}
  .tixe269{grid-template-columns:minmax(0,1fr)}
  .woche269{gap:4px} .woche269 li{inline-size:36px;block-size:36px;font-size:13px}
  .gross269{padding-inline:20px;font-size:17px}
}
/* ===== Ende BAUPLAN 269 ===== */
/* ===== BAUPLAN 270: KEIN Light-Mode (Nutzer 14.10.: „warum hast du es jetzt Lightmode gemacht, davon war nicht die Rede“) – Startseite und
   Rückblick-Übersicht bleiben dunkel, nur wärmer und freundlicher (html.warm270): tiefes Beeren-Rosé #181109 statt fast schwarz, warme
   Lichter in Koralle/Pink, Akzent Rosa #E9B372, Knopf #E6AA63 mit dunkler Schrift. Diese Werte färbt die Stimmung nicht um. ===== */
:root.warm270:not(#_):not(#_){--stoff:#181109;--bg:#181109;--licht-warm:rgba(255,120,90,.30);--licht-kalt:rgba(192,138,73,.24);--licht-rand:rgba(219,169,109,.18)}
:root.warm270:not(#_):not(#_) body{background:transparent}
:root.warm270:not(#_):not(#_) #root .leiste .marke-kuppel :is(.f,polygon){stroke:#E9B372}
:root.warm270:not(#_):not(#_) #root .leiste{background:color-mix(in srgb,#181109 82%,transparent)}
:root.warm270:not(#_):not(#_) #root .leiste :is(.icon-knopf,.sprach-knopf){background:rgba(255,255,255,.08);color:var(--ink)}
:root.warm270:not(#_):not(#_) #root .leiste :is(.icon-knopf,.sprach-knopf):hover{background:rgba(255,255,255,.15)}
:root.warm270:not(#_):not(#_) #root .leiste .burger265[aria-expanded="true"]{background:#E6AA63;color:#19120B}
:root.warm270:not(#_):not(#_) :is(.k265.voll,.karte265 .k265.voll){background:#E6AA63;background-image:none;color:#19120B;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 10px 22px -14px rgba(0,0,0,.65)}
:root.warm270:not(#_):not(#_) :is(.k265.voll,.karte265 .k265.voll):hover{background:#E6AD68}
:root.warm270:not(#_):not(#_) :is(.k265.rand,.karte265 .k265.rand){background:rgba(255,255,255,.06);background-image:none;color:var(--ink);
  -webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:inset 0 0 0 1.5px rgba(236,204,170,.45)}
:root.warm270:not(#_):not(#_) :is(.k265.rand,.karte265 .k265.rand):hover{background:rgba(255,255,255,.12)}
/* Kacheln/Karten: dasselbe Glas wie die Rückblick-Boxen (Nutzer: „es muss unseren Stil haben wie Rückblick“) */
:root.warm270:not(#_):not(#_) :is(.karte265,.rueck265 .rk265,.held265-status){
  background-color:var(--glas-fill);
  background-image:linear-gradient(157deg,rgba(var(--glas-ton),.10) 0%,rgba(255,255,255,0) 38%,rgba(0,0,0,.05) 100%),var(--rausch-fein);
  background-blend-mode:normal,var(--rausch-mix);-webkit-backdrop-filter:blur(22px) saturate(1.4);backdrop-filter:blur(22px) saturate(1.4);
  border:1px solid rgba(var(--glas-ton),.14);color:var(--ink);
  box-shadow:inset 0 1px 0 var(--glas-kante),inset 0 -1px 0 rgba(0,0,0,.06),0 10px 30px -14px rgba(25,18,10,.35)}
:root.warm270:not(#_):not(#_) :is(.karte265,.rueck265 .rk265){border-radius:28px}
:root.warm270:not(#_):not(#_) .rueck265 .rk265:hover{background-color:color-mix(in srgb,var(--glas-fill) 80%,rgba(255,255,255,.2))}
/* Akzente in Rosa (about blank) */
:root.warm270:not(#_):not(#_) :is(.tix270-preis b,.info270-zeit,.info270-preis b,.pt270,.prog265-info,.friend265 b,.helfer265 b,.rk265-zahlen,.rk265-pfeil,.m265-zeile .ic){color:#E9B372}
:root.warm270:not(#_):not(#_) :is(.info270-preis,.friend269-text b){color:#E9E1D7}
:root.warm270:not(#_):not(#_) :is(.p269-ic,.rund265){background:rgba(201,148,83,.16);color:#E9B372;box-shadow:none}
:root.warm270:not(#_):not(#_) .chip269{background:rgba(201,148,83,.16);color:#E9E1D7}
:root.warm270:not(#_):not(#_) :is(.friend265,.helfer265,.karte265 .rk265){background:rgba(201,148,83,.12);box-shadow:none;color:var(--ink)}
:root.warm270:not(#_):not(#_) :is(.helfer265,.karte265 .rk265,.rund265):hover{background:rgba(201,148,83,.2)}
:root.warm270:not(#_):not(#_) .friend269-badge{background:#E6AA63;color:#19120B}
:root.warm270:not(#_):not(#_) .friend269-text > span{color:var(--ink-2)}
:root.warm270:not(#_):not(#_) .woche269 li.an{background:#E6AA63;color:#19120B}
:root.warm270:not(#_):not(#_) .woche269 li.zu{color:var(--ink-3);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.18)}
:root.warm270:not(#_):not(#_) :is(.h269 .held265-kuppel,.rk265-kuppel) svg :is(.f,polygon,path,line){stroke:#E9B372}
:root.warm270:not(#_):not(#_) .held265-status:not(.offen) .punkt265{background:#E6AA63}
:root.warm270:not(#_):not(#_) .held265-status.offen .punkt265{background:#5BE39A}
:root.warm270:not(#_):not(#_) .karte265 h2{color:var(--ink)}
/* alles gleich breit: die Box oben so breit wie die Karten darunter */
:root.warm270:not(#_):not(#_) .info270{max-inline-size:none}
:root.warm270:not(#_):not(#_) .herz269 svg{fill:#E6AA63}
/* Datum · Uhrzeit · Ort nebeneinander (Nutzer) */
.info270-wann{display:grid;gap:4px;inline-size:100%;justify-items:center}
@media (min-width:700px){
  .info270-wann{grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:0}
  .info270-wann > p{padding-inline:14px;margin:0}
  .info270-wann > p + p{border-inline-start:1px solid var(--line)}
  .info270-wann .info270-datum{font-size:24px}
  .info270-wann .info270-zeit{font-size:24px}
  .info270-wann .info270-ort{font-size:17px}
}
/* Hauptmenü im Kopf wie im Team (ab 1000 px) */
.reiter270{display:none}
@media (min-width:1000px){
  .kopf-legende:has(> .reiter270){display:flex;justify-content:center;flex:1;min-inline-size:0}
  .reiter270{display:flex;align-items:center;gap:10px;min-inline-size:0;max-inline-size:100%}
  .reiter270 ul{display:flex;gap:4px;margin:0;padding:4px;list-style:none;border-radius:999px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);min-inline-size:0}
  .reiter270 li{flex:none}
  .reiter270-k{display:inline-flex;align-items:center;gap:7px;min-block-size:40px;padding:4px 14px;border-radius:999px;font-size:15px;font-weight:500;color:var(--ink);text-decoration:none;white-space:nowrap}
  .reiter270-k .ic{inline-size:18px;block-size:18px}
  .reiter270-k[aria-current="page"]{background:#FAF3EC;color:#1A130B}
  .reiter270-k:not([aria-current="page"]):hover{background:rgba(255,255,255,.07)}
  .reiter270 .reiter270-cta{flex:none;min-block-size:48px}
  /* oben im Kopf steht schon „Tickets kaufen“ und das Menü – die Knöpfe unter der Box braucht es am Rechner nicht (Nutzer) */
  .m269 .h269-knoepfe{display:none}
  .reiter270.nur-ic270 .reiter270-k > span:not(.reiter270-kuppel){position:absolute!important;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .reiter270.nur-ic270 .reiter270-k{padding-inline:12px}
}

/* Übersicht: eine Box oben, je Thema eine Box */
.info270{display:grid;justify-items:center;gap:6px;inline-size:100%;max-inline-size:560px;margin-block-start:22px;padding:20px 18px;text-align:center}
.info270-datum{font-size:28px;font-weight:500;line-height:1.2}
.info270-zeit{font-size:26px;font-weight:500;color:#E9B372}
.info270-ort{font-size:18px;color:var(--ink-2)}
.info270-prog{font-size:17px;line-height:1.55;color:var(--ink);margin-block-start:6px;padding-block-start:12px;border-block-start:1px solid var(--line);inline-size:100%}
.info270-preis{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 8px;font-size:16px;font-weight:500;color:#E9E1D7}
.info270-preis b{font-size:24px;font-weight:500;color:#E9B372}
.info270-friend{display:flex;align-items:center;gap:14px;inline-size:100%;margin-block-start:8px;padding:12px 14px;border-radius:20px;background:rgba(201,148,83,.14);text-align:start}
.info270 .woche269{margin-block-end:6px}
.pt270{color:#E9B372}
.karten270{align-items:stretch}
.liste270{display:grid}
.liste270 li{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:14px;padding-block:12px;border-block-end:1px solid var(--line)}
.liste270 li:first-child{padding-block-start:2px}
.liste270 li:last-child{border:0;padding-block-end:0;align-items:start}
.liste270 .p269-ic{inline-size:46px;block-size:46px}
.liste270 .p269-ic svg{inline-size:24px;block-size:24px}
.liste270-text{display:grid;gap:6px;min-inline-size:0}
.liste270-name{font-size:18px;font-weight:500;line-height:1.25}
.liste270-klein{font-size:15px;line-height:1.45;color:var(--ink-2)}
.tix270-kopf{font-size:14px;color:var(--ink-2);text-align:end;margin-block-end:2px}
.tix270{display:grid}
.tix270 li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-block:12px;border-block-end:1px solid var(--line)}
.tix270 li:last-child{border:0}
.tix270-art{font-size:18px;font-weight:500}
.tix270-preis{display:grid;justify-items:end;gap:2px;text-align:end}
.tix270-preis b{font-size:32px;line-height:1.05;font-weight:500;color:#E9B372;font-variant-numeric:tabular-nums}
.tix270-preis small{font-size:13px;color:var(--ink-2);white-space:nowrap}
.friend270{display:flex;align-items:center;gap:14px;margin-block-start:10px;padding:12px 14px;border-radius:20px;background:rgba(201,148,83,.12)}
.danach270{display:grid;justify-items:center;gap:8px;text-align:center}
.danach270 .hilfe265{margin:0;color:var(--ink-2)}
/* Countdown als Klapp-Uhr – zwei Hälften, obere Klappe fällt, untere klappt herunter */
.cd270{display:flex;justify-content:center;gap:8px;margin-block-start:22px}
.cd270-k{display:grid;justify-items:center;gap:7px}
.kl270{--kh:72px;--kb:80px;position:relative;display:block;inline-size:var(--kb);block-size:var(--kh);font-size:48px;font-weight:500;line-height:1;
  font-variant-numeric:tabular-nums;color:#F8F2EB;perspective:280px;border-radius:14px;box-shadow:0 12px 24px -14px rgba(0,0,0,.75)}
.kl270-o,.kl270-u,.kl270-ko,.kl270-ku{position:absolute;inset-inline:0;block-size:50%;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.kl270-o,.kl270-ko{inset-block-start:0;border-radius:14px 14px 0 0;background:#393229;box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.kl270-u,.kl270-ku{inset-block-end:0;border-radius:0 0 14px 14px;background:#302920}
.kl270-o > span,.kl270-u > span,.kl270-ko > span,.kl270-ku > span{position:absolute;inset-inline:0;block-size:var(--kh);display:grid;place-items:center}
.kl270-o > span,.kl270-ko > span{inset-block-start:0}
.kl270-u > span,.kl270-ku > span{inset-block-end:0}
.kl270::after{content:"";position:absolute;inset-inline:0;inset-block-start:calc(50% - 1px);block-size:2px;background:rgba(14,8,3,.85);z-index:3}
.kl270::before{content:"";position:absolute;z-index:4;inset-block-start:calc(50% - 4px);inset-inline:-3px;block-size:8px;
  background:radial-gradient(circle 3px at 3px 50%,rgba(14,8,3,.9) 98%,#0000) left/50% 100% no-repeat,radial-gradient(circle 3px at calc(100% - 3px) 50%,rgba(14,8,3,.9) 98%,#0000) right/50% 100% no-repeat}
.kl270-ko{z-index:2;transform-origin:50% 100%;animation:klappO270 .3s ease-in forwards}
.kl270-ku{z-index:2;transform-origin:50% 0;transform:rotateX(90deg);animation:klappU270 .3s ease-out .3s forwards}
@keyframes klappO270{0%{transform:rotateX(0);filter:brightness(1)}100%{transform:rotateX(-90deg);filter:brightness(.55)}}
@keyframes klappU270{0%{transform:rotateX(90deg);filter:brightness(1.5)}100%{transform:rotateX(0);filter:brightness(1)}}
.cd270-k small{font-size:13px;color:var(--ink-2)}
@media (max-width:419px){ .cd270{gap:6px} .kl270{--kh:66px;--kb:74px;font-size:44px} }
@media (max-width:359px){ .cd270{gap:5px} .kl270{--kh:56px;--kb:62px;font-size:36px} .cd270-k small{font-size:11px} }
@media (min-width:900px){ .kl270{--kh:88px;--kb:98px;font-size:60px} .cd270{gap:12px} }
/* Menü */
:root.warm270:not(#_):not(#_) .menue265{background:rgba(34,27,20,.97);background-image:none;color:var(--ink);box-shadow:0 0 0 1px rgba(217,162,97,.2),0 24px 54px -22px rgba(0,0,0,.7)}
:root.warm270:not(#_):not(#_) :is(.m265-link,.m265-zeile):hover{background:rgba(217,162,97,.10)}
:root.warm270:not(#_):not(#_) .m265-link.an{background:#E6AA63;color:#19120B}
:root.warm270:not(#_):not(#_) .m265-k{background:rgba(217,162,97,.12)}
:root.warm270:not(#_):not(#_) .m265-k:hover:not(:disabled){background:rgba(217,162,97,.22)}
:root.warm270:not(#_):not(#_) :is(.m265-nav,.m265-klein){border-color:rgba(217,162,97,.18)}
/* ===== Ende BAUPLAN 270 ===== */
/* ===== BAUPLAN 271: „Opening Weekend“ etwas kleiner; Hintergrund-Lichter nur Rosa, kein Orange (Nutzer: „wir hatten da kein Orange“) ===== */
.m269 .h269 h1{font-size:min(12vw,78px);letter-spacing:-.02em}
:root.warm270:not(#_):not(#_):not(#_){--licht-warm:rgba(201,148,83,.20);--licht-kalt:rgba(146,105,54,.22);--licht-rand:rgba(217,162,97,.12)}
.boxen271{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;inline-size:100%;margin-block-start:22px}
.b271{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;gap:14px;aspect-ratio:1;min-block-size:0;padding:16px;text-align:start}
.w271-ic{display:grid;place-items:center;inline-size:42px;block-size:42px;border-radius:50%;background:rgba(201,148,83,.16);color:#E9B372;flex:none}
.w271-ic .ic{inline-size:21px;block-size:21px}
.b271-text{display:grid;gap:4px;min-inline-size:0}
.b271-gross{font-size:23px;font-weight:500;line-height:1.2;overflow-wrap:break-word}
.b271-klein{font-size:15px;line-height:1.35;color:var(--ink-2)}
.friend271-badge{display:grid;place-items:center;min-inline-size:42px;block-size:42px;padding-inline:8px;border-radius:999px;background:#E6AA63;color:#19120B;font-size:15px;font-weight:600;white-space:nowrap}
.friend271b .w271-ic{background:none;inline-size:auto}
.friend271b .b271-gross{color:#E9E1D7;font-size:20px}
.friend271b .b271-klein{font-size:13px}
@media (min-width:760px){ .boxen271{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px} .b271{aspect-ratio:1;padding:20px} .b271-gross{font-size:26px} .friend271b .b271-gross{font-size:21px} .friend271b .b271-klein{font-size:14px} }
@media (max-width:359px){ .b271{padding:12px} .b271-gross{font-size:19px} .b271-klein{font-size:13px} .friend271b .b271-gross{font-size:17px} .friend271b .b271-klein{font-size:12px} }
.prog271{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;inline-size:100%;margin-block-start:18px}
.prog271 li{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 6px;border-radius:999px;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);font-size:15px;font-weight:500}
.prog271-ic{display:grid;place-items:center;inline-size:28px;block-size:28px;border-radius:50%;background:rgba(201,148,83,.16);color:#E9B372;flex:none}
.prog271-ic svg{inline-size:16px;block-size:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.vvk271{margin-block-start:16px;font-size:18px;line-height:1.5;color:var(--ink)}
.vvk271-wort{color:var(--ink-2)}
.vvk271 b{font-weight:500;color:#E9B372}
@media (max-width:359px){ .b271-oben,.b271:first-child .b271-unten{font-size:18px} .prog271 li{font-size:13px} .vvk271{font-size:16px} }
/* Klapp-Uhr: Fuge und Scharniere im Ton der Seite statt schwarz (Nutzer: „nicht so schwarz schwarz – muss farblich reinpassen“) */
:root:not(#_) .kl270::after{block-size:1.5px;inset-block-start:calc(50% - .75px);background:rgba(34,27,20,.75)}
:root:not(#_) .kl270::before{background:radial-gradient(circle 2.5px at 3px 50%,rgba(34,27,20,.8) 98%,#0000) left/50% 100% no-repeat,radial-gradient(circle 2.5px at calc(100% - 3px) 50%,rgba(34,27,20,.8) 98%,#0000) right/50% 100% no-repeat}
/* Luft (Nutzer: „alles so eng oben“, „Abstand zwischen den Boxen gleich“, „zwischen Head und Content mehr Platz – überall“) */
.m269 .h269{padding-block:44px 30px}
.m269 .h269 .held265-kuppel{margin-block-end:18px}
.m269 .h269 h1{margin-block:8px 6px}
.m269 .cd270{margin-block-start:30px}
.m269 .boxen271{margin-block-start:32px;gap:16px}
.m269 .karten270{gap:16px;margin-block-start:8px}
:root:not(#_) .m269 .karte265 h2,:root:not(#_) .m269 .karte265 > h3{margin-block-end:22px}
:root:not(#_) .seite265 .karte265 h2{margin-block-end:22px}
/* die vier Boxen oben: mehr Pink im Grund – grenzen sich von den Karten darunter ab */
:root.warm270:not(#_):not(#_):not(#_) .b271{background-color:rgba(201,148,83,.14);border-color:rgba(217,162,97,.26)}
@media (max-width:419px){ .m269 .h269{padding-block:30px 24px} .m269 .boxen271{gap:12px} .m269 .karten270{gap:12px} }
/* „Ab 19. Oktober“ geordnet (Nutzer: „ist ein Gemisch an Text“): Wochentage, drei kleine Felder, Hinweis */
.danach271{display:grid;gap:12px}
.danach271 .woche269{justify-content:flex-start;flex-wrap:wrap}
.minis271{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.mini271{display:flex;flex-direction:column;justify-content:space-between;gap:12px;min-block-size:118px;padding:14px;border-radius:20px;
  background:rgba(201,148,83,.10);box-shadow:inset 0 0 0 1px rgba(217,162,97,.18)}
.mini271 .w271-ic{inline-size:36px;block-size:36px}
.mini271 .w271-ic .ic{inline-size:18px;block-size:18px}
.mini271-gross{font-size:22px;font-weight:500;line-height:1.15;white-space:nowrap}
.mini271-klein{font-size:14px;color:var(--ink-2)}
.danach271 .hilfe265{margin:0;color:var(--ink-2)}
@media (max-width:419px){ .mini271{padding:12px;min-block-size:104px} .mini271-gross{font-size:19px} }
@media (max-width:359px){ .minis271{grid-template-columns:minmax(0,1fr)} .mini271{min-block-size:0;flex-direction:row;align-items:center;justify-content:flex-start} }
/* Symbole heller, Kreis sichtbarer; „Bring a friend“ weiß, „2 × 1“ groß darüber (Nutzer) */
:root:not(#_) .m269 .w271-ic{background:rgba(201,148,83,.30);color:#E9E1D7}
:root:not(#_) .m269 .friend271b .w271-ic{background:rgba(201,148,83,.30);inline-size:42px}
:root:not(#_) .m269 .friend271b .b271-gross{color:var(--ink)}
.zwei271{display:block;font-size:30px;line-height:1.1;font-weight:500;color:#E9B372;margin-block-end:4px}
@media (max-width:359px){ .zwei271{font-size:24px} }
.friend271b{cursor:help}
@media (max-width:599px){
  .minis271{grid-template-columns:repeat(2,minmax(0,1fr))}
  .minis271 .mini271:first-child{grid-column:1/-1}
  .mini271{min-block-size:96px}
  .danach271 .woche269{gap:4px;flex-wrap:nowrap}
  .danach271 .woche269 li{inline-size:38px;block-size:38px;font-size:13px}
}
@media (max-width:359px){ .danach271 .woche269 li{inline-size:32px;block-size:32px;font-size:12px} }
.mini271-klein{overflow-wrap:normal}
/* Programm-Chips größer, volle Breite (Nutzer) */
.m269 .prog271{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-block-start:16px}
.m269 .prog271 li{min-block-size:58px;padding:8px 16px 8px 8px;border-radius:999px;font-size:17px;background:rgba(201,148,83,.10);box-shadow:inset 0 0 0 1px rgba(217,162,97,.18)}
.m269 .prog271-ic{inline-size:40px;block-size:40px;background:rgba(201,148,83,.30);color:#E9E1D7}
.m269 .prog271-ic svg{inline-size:21px;block-size:21px}
@media (min-width:760px){ .m269 .prog271{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px} }
@media (max-width:419px){ .m269 .prog271 li{font-size:15px;min-block-size:52px;border-radius:26px} .m269 .prog271-ic{inline-size:34px;block-size:34px} }
/* Countdown größer, mehr Luft (Nutzer) */
.m269 .cd270{margin-block:40px 14px;gap:12px}
.m269 .kl270{--kh:86px;--kb:94px;font-size:58px}
@media (min-width:900px){ .m269 .kl270{--kh:110px;--kb:120px;font-size:76px} .m269 .cd270{gap:16px;margin-block:48px 20px} }
@media (max-width:419px){ .m269 .cd270{gap:8px} .m269 .kl270{--kh:72px;--kb:78px;font-size:48px} }
@media (max-width:359px){ .m269 .cd270{gap:5px} .m269 .kl270{--kh:60px;--kb:64px;font-size:38px} }
/* ===== Ende BAUPLAN 271 ===== */
/* ===== BAUPLAN 272: Programm-Chips oben wieder in der vorigen Farbe (dezentes Glas, Symbol-Kreis rosa), nur größer und einzeilig
   (Nutzer: „Farbe wie unten, nicht rosa – nicht wie die anderen Boxen – davor war besser, nur größer – aber nicht zweizeilig“) ===== */
:root:not(#_) .m269 .prog271{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin-block-start:16px;padding:6px;border-radius:28px;
  background-color:var(--glas-fill);background-image:linear-gradient(157deg,rgba(var(--glas-ton),.10) 0%,rgba(255,255,255,0) 38%,rgba(0,0,0,.05) 100%),var(--rausch-fein);
  background-blend-mode:normal,var(--rausch-mix);border:1px solid rgba(var(--glas-ton),.14);box-shadow:inset 0 1px 0 var(--glas-kante),0 10px 30px -14px rgba(25,18,10,.35)}
:root:not(#_) .m269 .prog271 li{display:flex;align-items:center;gap:12px;min-inline-size:0;min-block-size:64px;padding:10px 14px;border-radius:22px;font-size:17px;font-weight:500;
  background:none;box-shadow:none;white-space:normal;line-height:1.25}
:root:not(#_) .m269 .prog271-ic{inline-size:42px;block-size:42px;background:rgba(201,148,83,.30);color:#E9E1D7}
:root:not(#_) .m269 .prog271-ic svg{inline-size:21px;block-size:21px}
@media (min-width:760px){ :root:not(#_) .m269 .prog271{grid-template-columns:repeat(4,minmax(0,1fr))}
  :root:not(#_) .m269 .prog271 li + li{box-shadow:inset 1px 0 0 var(--line)} }
@media (max-width:759px){ :root:not(#_) .m269 .prog271 li:nth-child(even){box-shadow:inset 1px 0 0 var(--line)}
  :root:not(#_) .m269 .prog271 li:nth-child(n+3){border-start-start-radius:0;border-start-end-radius:0} }
@media (max-width:419px){ :root:not(#_) .m269 .prog271 li{font-size:15px;gap:10px;padding:10px} :root:not(#_) .m269 .prog271-ic{inline-size:34px;block-size:34px} }
@media (max-width:359px){ :root:not(#_) .m269 .prog271{grid-template-columns:minmax(0,1fr)} :root:not(#_) .m269 .prog271 li:nth-child(even){box-shadow:none} }
/* Unser Knopf-Stil (Nutzer: „noch nicht unser Button-Stil“): Pink = der ://about-blank-Knopf aus dem Rückblick (BAUPLAN 178, Korn + Lichtkante),
   alles andere = Glas-Umriss-Knopf (178 .knopf.tonal). Gilt für Knöpfe, Wochentage, Symbol-Kreise, Chips, Social-Kreise, Helfer-Hinweis. */
:root.warm270:not(#_):not(#_):not(#_) :is(.k265.voll,.karte265 .k265.voll,.woche269 li.an,.friend269-badge,.friend271-badge){
  background-color:#E6AA63;background-image:linear-gradient(#E6AA63,#E6AA63),var(--rausch-fein);background-blend-mode:normal,soft-light;color:#19120B;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -1px 0 rgba(64,57,48,.18),0 8px 18px -12px rgba(0,0,0,.7)}
@media (hover:hover){ :root.warm270:not(#_):not(#_):not(#_) :is(.k265.voll,.karte265 .k265.voll):hover{background-image:linear-gradient(#E6AD68,#E6AD68),var(--rausch-fein)} }
:root.warm270:not(#_):not(#_):not(#_) :is(.k265.rand,.karte265 .k265.rand,#anfahrt265 .k265.voll,.woche269 li.zu,.p269-ic,.w271-ic,.prog271-ic,.chip269,.rund265,.helfer265){
  background-color:rgba(221,213,203,.07);background-image:linear-gradient(180deg,rgba(255,255,255,.13) 0%,rgba(255,255,255,.02) 100%),var(--rausch-fein);
  background-blend-mode:normal,soft-light;-webkit-backdrop-filter:blur(10px) saturate(150%);backdrop-filter:blur(10px) saturate(150%);
  box-shadow:inset 0 0 0 1.5px var(--rand178,rgba(214,206,196,.68)),inset 0 1px 0 rgba(255,255,255,.22)}
:root.warm270:not(#_):not(#_):not(#_) :is(.k265.rand,.karte265 .k265.rand,#anfahrt265 .k265.voll,.chip269,.helfer265){color:var(--ink)}
:root.warm270:not(#_):not(#_):not(#_) .woche269 li.zu{color:var(--ink-2)}
:root.warm270:not(#_):not(#_):not(#_) :is(.p269-ic,.w271-ic,.prog271-ic,.rund265){color:#E9B372}
@media (hover:hover){ :root.warm270:not(#_):not(#_):not(#_) :is(.k265.rand,.karte265 .k265.rand,#anfahrt265 .k265.voll,.rund265,.helfer265):hover{background-color:rgba(221,213,203,.13)} }
:root.warm270:not(#_):not(#_):not(#_) .helfer265 b{color:#E9B372}
/* ===== Ende BAUPLAN 272 ===== */
/* ===== BAUPLAN 273: Symbol-Kreise wieder gefüllt, ohne Umriss-Ring (Nutzer: „das sieht kacke aus“) – heller Kreis, helles Symbol ===== */
:root.warm270:not(#_):not(#_):not(#_):not(#_) :is(.p269-ic,.w271-ic,.prog271-ic){background:rgba(201,148,83,.30);background-image:none;
  -webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;color:#E9E1D7}
/* ===== Ende BAUPLAN 273 ===== */
/* ===== BAUPLAN 274: Social-Kreise, Helfer-Hinweis und Chips wieder gefüllt ohne Ring (Nutzer: „nicht gut!“) – Ring nur bei echten Umriss-Knöpfen ===== */
:root.warm270:not(#_):not(#_):not(#_):not(#_) .rund265{background:rgba(201,148,83,.30);background-image:none;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;color:#E9E1D7}
:root.warm270:not(#_):not(#_):not(#_):not(#_) .helfer265{background:rgba(201,148,83,.14);background-image:none;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;color:var(--ink)}
:root.warm270:not(#_):not(#_):not(#_):not(#_) .chip269{background:rgba(201,148,83,.18);background-image:none;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;color:#E9E1D7}
@media (hover:hover){
  :root.warm270:not(#_):not(#_):not(#_):not(#_) .rund265:hover{background:rgba(201,148,83,.42)}
  :root.warm270:not(#_):not(#_):not(#_):not(#_) .helfer265:hover{background:rgba(201,148,83,.22)}
}
/* ===== Ende BAUPLAN 274 ===== */
/* ===== BAUPLAN 276: Symbol-Kreise im Knopf-Stil (wie „Tickets kaufen“: Korn, Lichtkante, weicher Schatten), aber gedecktes Rosé statt Pink,
   ohne Rand (Nutzer: „Icons bitte auch in dem Stil – nicht pink – die jetzigen sind viel zu krass mit dem Rand“). 273/274 griffen nicht:
   die Regel aus 272 war durch #anfahrt265 in :is() stärker – darum hier mit eindeutig höherem Rang (6× :not(#_)). ===== */
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) :is(.p269-ic,.w271-ic,.prog271-ic,.rund265){
  background-color:#574E46;background-image:linear-gradient(#574E46,#574E46),var(--rausch-fein);background-blend-mode:normal,soft-light;
  -webkit-backdrop-filter:none;backdrop-filter:none;color:#EAE1D8;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),inset 0 -1px 0 rgba(0,0,0,.25),0 8px 18px -12px rgba(0,0,0,.7)}
@media (hover:hover){ :root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rund265:hover{background-image:linear-gradient(#635A51,#635A51),var(--rausch-fein)} }
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .chip269{background:rgba(201,148,83,.18);background-image:none;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;color:#E9E1D7}
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .helfer265{background:rgba(201,148,83,.14);background-image:none;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;color:var(--ink)}
@media (hover:hover){ :root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .helfer265:hover{background:rgba(201,148,83,.22)} }
/* ===== Ende BAUPLAN 276 ===== */
/* ===== BAUPLAN 277: pinkes Feuer unten, Ton-Knopf, Ticket-Karten dunkel, Kopf am Handy ohne Linie, Überschrift am Handy größer ===== */
#feuer277{position:fixed;inset:0;inline-size:100vw;block-size:100vh;z-index:-1;pointer-events:none}
@media print{ #feuer277{display:none} }
/* Kopf am Handy: der (dort leere) Menü-Bereich bekam eine eigene Zeile mit Trennlinie (Nutzer: „warum ist da so eine Linie?“) */
@media (max-width:999px){ :root:not(#_):not(#_) .kopf-legende:has(> .reiter270){display:none} }
/* Überschrift am Handy größer, mehr Luft und Zeilenhöhe (Nutzer) */
@media (max-width:699px){ :root:not(#_):not(#_) .m269 .h269 h1{font-size:min(15vw,64px);line-height:1.1;margin-block:14px 6px} }
/* Ticket-Karten (Kerben + Abreiß-Linie) im dunklen Glas */
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .tix277{background-color:var(--glas-fill);
  background-image:linear-gradient(157deg,rgba(var(--glas-ton),.12) 0%,rgba(255,255,255,0) 40%),var(--rausch-fein);background-blend-mode:normal,var(--rausch-mix);
  color:var(--ink);box-shadow:inset 0 1px 0 var(--glas-kante),0 12px 28px -16px rgba(0,0,0,.6)}
:root.warm270:not(#_):not(#_) .tix277 .tix269-preis{color:#E9B372}
:root.warm270:not(#_):not(#_) .tix277 :is(.tix269-art,.tix269-vvk){color:var(--ink-2)}
:root.warm270:not(#_):not(#_) .tix277 .tix269-ak{color:var(--ink)}
:root.warm270:not(#_):not(#_) .tix277::after{border-block-start-color:rgba(217,162,97,.38)}
.kat275-box .tixe269,.karte265 .tixe269{margin-block-end:4px}
/* ===== Ende BAUPLAN 277 ===== */
/* ===== BAUPLAN 277: Glut-Rand beim Drüberfahren wie bei Teamwellness (?glut=2: gleichmäßiger Schein rundum, atmet langsam, ohne Dampf) – in Pink;
   nur mit Maus/Trackpad, in Ruhe unsichtbar (wird nicht gemalt), bei „weniger Bewegung“ stehend ===== */
@media (hover:hover) and (pointer:fine){
  :root.warm270:not(#_):not(#_) .m269 :is(.b271,.kat275-box){position:relative}
  :root.warm270:not(#_):not(#_) .m269 :is(.b271,.kat275-box)::before{content:"";position:absolute;z-index:-1;inset:-2px;border-radius:inherit;pointer-events:none;
    background:radial-gradient(60% 80% at 50% 100%,#DBD3C9 0,transparent 70%),#E6AA63;filter:blur(11px);transform-origin:50% 100%;
    opacity:0;visibility:hidden;transition:opacity .55s ease,visibility 0s linear .55s;animation:glut277 3.4s ease-in-out infinite alternate paused}
  :root.warm270:not(#_):not(#_) .m269 .b271:hover::before{opacity:.55;visibility:visible;transition:opacity .45s ease,visibility 0s;animation-play-state:running}
  :root.warm270:not(#_):not(#_) .m269 .kat275-box:hover::before{opacity:.32;visibility:visible;transition:opacity .45s ease,visibility 0s;animation-play-state:running}
  :root.warm270:not(#_):not(#_) .m269 .b271:nth-child(2n)::before{animation-delay:-1.3s}
  :root.warm270:not(#_):not(#_) .m269 .b271:nth-child(3n)::before{animation-delay:-2.1s}
}
@keyframes glut277{0%{scale:1 1}40%{scale:1.008 1.04}70%{scale:1.003 1.015}100%{scale:1.01 1.05}}
@media (prefers-reduced-motion:reduce){ :root.warm270:not(#_):not(#_) .m269 :is(.b271,.kat275-box)::before{animation:none!important} }
/* ===== Ende BAUPLAN 277 (Glut) ===== */
/* ===== BAUPLAN 279: Retro-Kinokarten ===== */
.kinos279{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin-block-end:6px}
.kino279{--kerbe:10px;--ecke:12px;--riss:74%;display:grid;grid-template-columns:var(--riss) minmax(0,1fr);min-block-size:132px;color:#19120B;
  filter:drop-shadow(0 10px 14px rgba(0,0,0,.35));transform:rotate(-.6deg)}
.kino279:nth-child(2){transform:rotate(.5deg)}
.kino279 > div{position:relative;display:grid;align-content:center;gap:2px;padding:14px 16px;
  background-color:#E6AA63;background-image:linear-gradient(#E6AA63,#E6AA63),var(--rausch-fein);background-blend-mode:normal,soft-light}
.kino279 .kino279-abriss{background-color:#BC884A;background-image:linear-gradient(#BC884A,#BC884A),var(--rausch-fein);justify-items:center;text-align:center;
  box-shadow:inset 2px 0 0 0 transparent}
/* Perforation */
.kino279-abriss::before{content:"";position:absolute;inset-block:12px;inset-inline-start:-1px;border-inline-start:2px dashed rgba(15,9,4,.38)}
/* Ecken nach innen gerundet + Kerben an der Perforation (Masken je Teil) */
.kino279-haupt{-webkit-mask:radial-gradient(circle var(--ecke) at 0 0,#0000 98%,#000) top left/51% 51% no-repeat,
    radial-gradient(circle var(--ecke) at 0 100%,#0000 98%,#000) bottom left/51% 51% no-repeat,
    radial-gradient(circle var(--kerbe) at 100% 0,#0000 98%,#000) top right/51% 51% no-repeat,
    radial-gradient(circle var(--kerbe) at 100% 100%,#0000 98%,#000) bottom right/51% 51% no-repeat;
  mask:radial-gradient(circle var(--ecke) at 0 0,#0000 98%,#000) top left/51% 51% no-repeat,
    radial-gradient(circle var(--ecke) at 0 100%,#0000 98%,#000) bottom left/51% 51% no-repeat,
    radial-gradient(circle var(--kerbe) at 100% 0,#0000 98%,#000) top right/51% 51% no-repeat,
    radial-gradient(circle var(--kerbe) at 100% 100%,#0000 98%,#000) bottom right/51% 51% no-repeat}
.kino279-abriss{-webkit-mask:radial-gradient(circle var(--kerbe) at 0 0,#0000 98%,#000) top left/51% 51% no-repeat,
    radial-gradient(circle var(--kerbe) at 0 100%,#0000 98%,#000) bottom left/51% 51% no-repeat,
    radial-gradient(circle var(--ecke) at 100% 0,#0000 98%,#000) top right/51% 51% no-repeat,
    radial-gradient(circle var(--ecke) at 100% 100%,#0000 98%,#000) bottom right/51% 51% no-repeat;
  mask:radial-gradient(circle var(--kerbe) at 0 0,#0000 98%,#000) top left/51% 51% no-repeat,
    radial-gradient(circle var(--kerbe) at 0 100%,#0000 98%,#000) bottom left/51% 51% no-repeat,
    radial-gradient(circle var(--ecke) at 100% 0,#0000 98%,#000) top right/51% 51% no-repeat,
    radial-gradient(circle var(--ecke) at 100% 100%,#0000 98%,#000) bottom right/51% 51% no-repeat}
.kino279-kopf{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;opacity:.72}
.kino279-art{font-size:15px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;margin-block-start:4px}
.kino279-preis{font-size:44px;line-height:1.02;font-weight:600;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.kino279-unten{font-size:13px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;opacity:.8}
.kino279-abriss-wort{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;opacity:.8;overflow-wrap:anywhere}
.kino279-abriss b{font-size:24px;font-weight:600;font-variant-numeric:tabular-nums}
.kinos279{grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr))}
@media (min-width:760px){ .kinos279{gap:20px} }
@media (max-width:359px){ .kino279{--riss:70%} .kino279-preis{font-size:36px} .kino279 > div{padding:12px} }
@media (prefers-reduced-motion:reduce){ .kino279,.kino279:nth-child(2){transform:none} }
/* ===== Ende BAUPLAN 279 ===== */
/* ===== BAUPLAN 280: Kinokarten nicht pink (Nutzer: „besser, aber nicht pink bitte“) – gedecktes Rosé mit Korn wie die Symbol-Kreise, helle Schrift;
   „Abendkasse“ ohne Umbruch im Abriss ===== */
:root:not(#_):not(#_) .kino279{color:#F8F2EB;--riss:68%}
:root:not(#_):not(#_) .kino279 > div{background-color:#574E46;background-image:linear-gradient(#574E46,#574E46),var(--rausch-fein);background-blend-mode:normal,soft-light}
:root:not(#_):not(#_) .kino279 .kino279-abriss{background-color:#4C453C;background-image:linear-gradient(#4C453C,#4C453C),var(--rausch-fein);padding-inline:8px}
:root:not(#_):not(#_) .kino279-abriss::before{border-inline-start-color:rgba(234,225,216,.35)}
:root:not(#_):not(#_) .kino279-preis{color:#DBD3C9}
:root:not(#_):not(#_) .kino279-abriss-wort{overflow-wrap:normal;white-space:nowrap;letter-spacing:.05em;font-size:10.5px}
@media (max-width:359px){ :root:not(#_):not(#_) .kino279{--riss:66%} :root:not(#_):not(#_) .kino279-abriss-wort{font-size:9.5px;letter-spacing:.02em} }
/* kein Glut-Schein beim Drüberfahren auf den Boxen (Nutzer: „kein Hover hier“) */
:root:not(#_):not(#_):not(#_):not(#_) .m269 :is(.b271,.kat275-box)::before{content:none}
/* ===== Ende BAUPLAN 280 ===== */
/* ===== BAUPLAN 281: ganz leichter Glut-Schein hinter dem Countdown (Nutzer: „der Countdown kann so einen Effekt haben, aber viel weniger – so leicht“) ===== */
.m269 .cd270{position:relative}
.m269 .cd270 > *{position:relative;z-index:1}
.m269 .cd270::before{content:"";position:absolute;z-index:0;inset:-6% -5% 18%;pointer-events:none;border-radius:40px;
  background:radial-gradient(closest-side,rgba(201,148,83,.42),rgba(201,148,83,.14) 60%,transparent);filter:blur(22px);opacity:.8;
  transform-origin:50% 100%;animation:glut277 3.6s ease-in-out infinite alternate}
@media (prefers-reduced-motion:reduce){ .m269 .cd270::before{animation:none} }
/* ===== Ende BAUPLAN 281 ===== */
/* ===== BAUPLAN 281: Kinokarten dunkel (Nutzer: „so Darkmode war geiler“) – Retro-Form bleibt, Papier dunkel mit Korn, Preis rosa ===== */
:root:not(#_):not(#_):not(#_) .kino279 > div{background-color:#302920;background-image:linear-gradient(157deg,rgba(255,255,255,.07) 0%,rgba(255,255,255,0) 45%),var(--rausch-fein);background-blend-mode:normal,soft-light}
:root:not(#_):not(#_):not(#_) .kino279 .kino279-abriss{background-color:#29221A;background-image:linear-gradient(157deg,rgba(255,255,255,.05) 0%,rgba(255,255,255,0) 45%),var(--rausch-fein)}
:root:not(#_):not(#_):not(#_) .kino279{color:var(--ink)}
:root:not(#_):not(#_):not(#_) .kino279-preis{color:#E9B372}
:root:not(#_):not(#_):not(#_) .kino279-abriss b{color:#DBD3C9}
:root:not(#_):not(#_):not(#_) .kino279-abriss::before{border-inline-start-color:rgba(234,225,216,.28)}
/* ===== Ende BAUPLAN 281 (Kinokarten) ===== */
/* ===== BAUPLAN 281: Countdown etwas breiter, heller, mit leichtem Glühen innen (Nutzer) ===== */
:root:not(#_):not(#_) .m269 .kl270{--kb:136px}
:root:not(#_):not(#_) .m269 :is(.kl270-o,.kl270-ko){background:#453D35;box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 0 22px rgba(201,148,83,.26)}
:root:not(#_):not(#_) .m269 :is(.kl270-u,.kl270-ku){background:#3F372F;box-shadow:inset 0 0 22px rgba(201,148,83,.22)}
@media (max-width:899px){ :root:not(#_):not(#_) .m269 .kl270{--kb:104px} }
@media (max-width:419px){ :root:not(#_):not(#_) .m269 .kl270{--kb:84px} }
@media (max-width:359px){ :root:not(#_):not(#_) .m269 .kl270{--kb:68px} }
/* ===== Ende BAUPLAN 281 (Countdown) ===== */
/* ===== BAUPLAN 282: Countdown-Glühen nur ein bisschen; Abendkasse-Abschnitt pinker, damit er sich abhebt (Nutzer) ===== */
:root:not(#_):not(#_):not(#_) .m269 :is(.kl270-o,.kl270-ko){box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 0 18px rgba(201,148,83,.14)}
:root:not(#_):not(#_):not(#_) .m269 :is(.kl270-u,.kl270-ku){box-shadow:inset 0 0 18px rgba(201,148,83,.12)}
:root:not(#_):not(#_):not(#_):not(#_) .kino279 .kino279-abriss{background-color:#4B443B;background-image:linear-gradient(157deg,rgba(255,255,255,.07) 0%,rgba(255,255,255,0) 45%),var(--rausch-fein)}
/* ===== Ende BAUPLAN 282 ===== */
/* ===== BAUPLAN 283: „Vorverkauf“ präsenter – senkrecht im Ticket neben dem Preis (Nutzer: „vertikal daneben, präsenter – aber in der Box“) ===== */
:root:not(#_):not(#_) .kino279-haupt{grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto auto;column-gap:14px;align-items:center}
:root:not(#_):not(#_) .kino279-haupt > :not(.kino279-unten){grid-column:2}
:root:not(#_):not(#_) .kino279-unten{grid-column:1;grid-row:1/-1;align-self:stretch;display:grid;place-items:center;
  writing-mode:vertical-rl;transform:rotate(180deg);padding:8px 5px;border-radius:8px;opacity:1;
  font-size:12px;font-weight:700;letter-spacing:.18em;color:#19120B;background:#E9B372}
@media (max-width:359px){ :root:not(#_):not(#_) .kino279-unten{font-size:10px;letter-spacing:.12em;padding-inline:4px} :root:not(#_):not(#_) .kino279-haupt{column-gap:10px} }
:root:not(#_):not(#_) .kino279-art{overflow-wrap:anywhere;hyphens:auto}
@media (max-width:459px){ :root:not(#_):not(#_) .kino279-art{font-size:13px;letter-spacing:.05em} :root:not(#_):not(#_) .kino279-kopf{font-size:10px;letter-spacing:.08em}
  :root:not(#_):not(#_) .kino279{--riss:72%} :root:not(#_):not(#_) .kino279 > div{padding-inline:12px} }
/* Umriss-Knöpfe dezenter (Nutzer: „die Buttons sind noch extrem“): feinerer, blasserer Rand, kaum Glas */
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) :is(.k265.rand,.karte265 .k265.rand,#anfahrt265 .k265.voll){
  background-color:rgba(255,255,255,.05);background-image:none;-webkit-backdrop-filter:none;backdrop-filter:none;
  box-shadow:inset 0 0 0 1px rgba(234,225,216,.22)}
@media (hover:hover){ :root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) :is(.k265.rand,.karte265 .k265.rand,#anfahrt265 .k265.voll):hover{background-color:rgba(255,255,255,.10)} }
/* ===== Ende BAUPLAN 283 ===== */
/* ===== BAUPLAN 284: klickbare Tickets mit Knopf im Abriss ===== */
a.kino284{text-decoration:none;cursor:pointer;transition:transform .2s cubic-bezier(.2,.8,.2,1),filter .2s ease}
a.kino284:focus-visible{outline:3px solid #E9B372;outline-offset:4px;border-radius:14px}
@media (hover:hover){ a.kino284:hover{transform:rotate(0) translateY(-4px);filter:drop-shadow(0 16px 20px rgba(0,0,0,.45)) brightness(1.08)} }
:root:not(#_):not(#_) .kino284 .kino279-abriss{gap:6px}
.cta284{display:inline-flex;align-items:center;gap:5px;margin-block-start:6px;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:600;line-height:1.15;
  text-align:center;color:#19120B;background-color:#E6AA63;background-image:linear-gradient(#E6AA63,#E6AA63),var(--rausch-fein);background-blend-mode:normal,soft-light;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 6px 12px -8px rgba(0,0,0,.7)}
.cta284 .ic{inline-size:14px;block-size:14px;flex:none}
@media (hover:hover){ a.kino284:hover .cta284{background-image:linear-gradient(#E6AD68,#E6AD68),var(--rausch-fein)} }
@media (max-width:459px){ .cta284{font-size:11px;padding:5px 8px} .cta284 .ic{display:none} }
@media (prefers-reduced-motion:reduce){ a.kino284{transition:none} a.kino284:hover{transform:none} }
/* ===== Ende BAUPLAN 284 ===== */
/* ===== BAUPLAN 275: große Überschrift je Kategorie mittig, darunter die Box über die volle Breite; Anfahrt + Über Calma nebeneinander ===== */
.karten275{display:grid;gap:0;margin-block-start:8px}
.kat275{display:flex;flex-direction:column;min-inline-size:0;scroll-margin-block-start:var(--kopf-h,80px)}
.kat275-titel{text-align:center;font-size:51px;font-weight:500;line-height:1.15;margin-block:52px 20px;color:var(--ink)}
:root:not(#_) .m269 .kat275-box{flex:1;padding:24px}
:root:not(#_) .m269 .kat275-box > h2{display:none}
.kat275-unter{font-size:22px;font-weight:500;margin:0 0 16px;color:var(--ink)}
.paar275{display:grid;grid-template-columns:minmax(0,1fr);column-gap:16px}
.text275{display:grid;gap:14px;max-inline-size:68ch;margin-inline:auto}
.text275 p{font-size:18px;line-height:1.6}
.schluss275{font-weight:500;color:#E9E1D7}
.zwei275{display:grid;gap:4px 28px}
.zwei275 .karte265-unter{margin-block-start:4px}
@media (min-width:900px){
  .kat275-titel{font-size:66px;margin-block:72px 28px}
  :root:not(#_) .m269 .kat275-box{padding:32px}
  .paar275{grid-template-columns:repeat(2,minmax(0,1fr))}
  .liste275{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px}
  .liste275 li:last-child{grid-column:1/-1}
  .liste275 li:nth-child(3){border-block-end:1px solid var(--line)}
  .zwei275{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:419px){ .kat275-titel{font-size:42px;margin-block:44px 18px} :root:not(#_) .m269 .kat275-box{padding:20px} .text275 p{font-size:17px} }
.kat275-titel{line-height:1.08;letter-spacing:-.02em}
@media (max-width:359px){ .kat275-titel{font-size:36px} }
/* Programm-Boxen wie die Aufguss-Boxen im Plan: Pille oben, Symbol rechts, Name groß, Text */
:root:not(#_) .m269 #programm265 .kat275-box{background:none;border:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;padding:0}
.pbs275{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.pb275{display:grid;align-content:start;gap:10px;padding:20px;border-radius:28px;color:var(--ink);
  background-color:var(--glas-fill);background-image:linear-gradient(157deg,rgba(var(--glas-ton),.10) 0%,rgba(255,255,255,0) 38%,rgba(0,0,0,.05) 100%),var(--rausch-fein);
  background-blend-mode:normal,var(--rausch-mix);border:1px solid rgba(var(--glas-ton),.14);box-shadow:inset 0 1px 0 var(--glas-kante),0 10px 30px -14px rgba(25,18,10,.35)}
.pb275-oben{display:flex;align-items:center;justify-content:space-between;gap:10px}
.pp275{display:inline-flex;align-items:center;min-block-size:30px;padding:4px 12px;border-radius:999px;background:rgba(201,148,83,.18);color:#DBD3C9;font-size:14px;font-weight:500;white-space:nowrap}
.pb275-name{font-size:26px;font-weight:500;line-height:1.2}
.pb275-text{font-size:17px;line-height:1.55;color:var(--ink-2)}
.pb275-klein{font-size:15px;line-height:1.5;color:var(--ink-2)}
.pb275 .p269-chips{margin-block-start:2px}
@media (min-width:760px){ .pbs275{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px} .pb275:last-child{grid-column:1/-1} .pb275-name{font-size:28px} }
@media (max-width:419px){ .pb275{padding:18px} .pb275-name{font-size:23px} }
/* Countdown im Grund der dunklen Boxen (Nutzer) */
:root:not(#_):not(#_):not(#_):not(#_) .m269 :is(.kl270-o,.kl270-ko){background:#302920;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 0 18px rgba(201,148,83,.10)}
:root:not(#_):not(#_):not(#_):not(#_) .m269 :is(.kl270-u,.kl270-ku){background:#2A231B;box-shadow:inset 0 0 18px rgba(201,148,83,.08)}
/* „Vorverkauf“ als durchgehender senkrechter Streifen am linken Ticketrand (Nutzer: „full vertikal, nicht in Pill“) */
:root:not(#_):not(#_):not(#_) .kino279-haupt{padding-inline-start:0;column-gap:16px}
:root:not(#_):not(#_):not(#_) .kino279-unten{margin-block:-14px;border-radius:0;padding-inline:9px;align-self:stretch}
@media (max-width:459px){ :root:not(#_):not(#_):not(#_) .kino279-unten{padding-inline:7px} :root:not(#_):not(#_):not(#_) .kino279-haupt{column-gap:12px} }
/* ===== Ende BAUPLAN 275 ===== */
/* ===== BAUPLAN 285: Vorverkauf-Streifen repariert – in vertical-rl sind margin-/padding-block waagerecht; jetzt feste Seiten (oben/unten -14px, links/rechts Polster) ===== */
:root:not(#_):not(#_):not(#_):not(#_) .kino279-unten{margin:-14px 0;padding:10px 9px;border-radius:0}
@media (max-width:459px){ :root:not(#_):not(#_):not(#_):not(#_) .kino279-unten{padding:8px 7px} }
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_) .kino279-unten{padding:8px 5px} }
/* ===== Ende BAUPLAN 285 ===== */
/* ===== BAUPLAN 285: Abendkasse klein links, Abriss = Kauf-Knopf ===== */
.ak285{font-size:13px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);margin-block-start:2px}
:root:not(#_):not(#_):not(#_) .kino285{--riss:70%}
:root:not(#_):not(#_):not(#_) .kino285 .kino279-abriss{background-color:#E6AA63;background-image:linear-gradient(#E6AA63,#E6AA63),var(--rausch-fein);background-blend-mode:normal,soft-light;color:#19120B}
:root:not(#_):not(#_):not(#_) .kino285 .kino279-abriss::before{border-inline-start-color:rgba(15,9,4,.35)}
.cta285{display:grid;justify-items:center;gap:8px;text-align:center;font-size:15px;font-weight:600;line-height:1.2}
.cta285 .ic{inline-size:28px;block-size:28px;stroke-width:1.7}
@media (hover:hover){ :root:not(#_):not(#_):not(#_) a.kino285:hover .kino279-abriss{background-image:linear-gradient(#E6AD68,#E6AD68),var(--rausch-fein)} }
@media (max-width:459px){ .cta285{font-size:13px} .cta285 .ic{inline-size:22px;block-size:22px} .ak285{font-size:11px} }
/* ===== Ende BAUPLAN 285 (Abriss) ===== */
/* ===== BAUPLAN 285: Vorverkauf-Streifen über die volle Höhe und etwas weiter rechts (frei von der Eck-Rundung) ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-haupt{position:relative;display:grid;grid-template-columns:minmax(0,1fr);padding-inline-start:66px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-haupt > :not(.kino279-unten){grid-column:1}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-unten{position:absolute;top:0;bottom:0;left:16px;right:auto;width:auto;height:auto;margin:0;padding:0 9px;grid-row:auto}
@media (max-width:459px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-haupt{padding-inline-start:54px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-unten{left:13px;padding:0 7px}
}
@media (max-width:359px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-haupt{padding-inline-start:46px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-unten{left:12px;padding:0 5px}
}
/* ===== Ende BAUPLAN 285 (Streifen) ===== */
/* ===== BAUPLAN 285: Kauf-Knopf im Abriss zweizeilig, Symbol größer und dünner; kein Schein hinter dem Countdown (Nutzer: „der Gradient ist strange“) ===== */
.cta285 .ic{inline-size:34px;block-size:34px;stroke-width:1.4}
.cta285 > span{display:grid;line-height:1.15}
@media (max-width:459px){ .cta285 .ic{inline-size:28px;block-size:28px} }
:root:not(#_):not(#_) .m269 .cd270::before{content:none}
/* ===== Ende BAUPLAN 285 (Knopf) ===== */
/* ===== BAUPLAN 285: Überschriften weniger Luft oben, mehr unten; Programm ohne äußere Box ===== */
:root:not(#_):not(#_) .kat275-titel{margin-block:40px 30px}
@media (min-width:900px){ :root:not(#_):not(#_) .kat275-titel{margin-block:52px 38px} }
@media (max-width:419px){ :root:not(#_):not(#_) .kat275-titel{margin-block:30px 24px} }
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 #programm265 .kat275-box{background:none;background-image:none;border:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;padding:0}
.pb275 > .p269-ic{margin-block-end:6px}
/* ===== Ende BAUPLAN 285 (Überschriften/Programm) ===== */
/* ===== BAUPLAN 285: Feinschliff ===== */
/* Streifen: absolute Lage bezieht sich sonst auf die Grid-Spalte (grid-column aus 283) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-unten{grid-column:auto;grid-row:auto}
/* Abriss: helle Schrift und helles Symbol (Nutzer: „dunkle Font und Icon? warum?“) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .kino285 .kino279-abriss{color:#F8F2EB}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .kino285 .kino279-abriss::before{border-inline-start-color:rgba(234,225,216,.32)}
/* Programm-Titel größer */
:root:not(#_):not(#_) .pb275-name{font-size:30px}
@media (max-width:419px){ :root:not(#_):not(#_) .pb275-name{font-size:25px} }
/* Chips im Knopf-Stil (gedecktes Rosé mit Korn und Lichtkante), größer */
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .chip269{min-block-size:38px;padding:7px 16px;font-size:16px;font-weight:500;color:#F8F2EB;
  background-color:#574E46;background-image:linear-gradient(#574E46,#574E46),var(--rausch-fein);background-blend-mode:normal,soft-light;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),inset 0 -1px 0 rgba(0,0,0,.25),0 8px 18px -12px rgba(0,0,0,.7)}
/* Kategorie-Überschriften etwas größer */
:root:not(#_):not(#_) .kat275-titel{font-size:58px}
@media (min-width:900px){ :root:not(#_):not(#_) .kat275-titel{font-size:76px} }
@media (max-width:419px){ :root:not(#_):not(#_) .kat275-titel{font-size:46px} }
@media (max-width:359px){ :root:not(#_):not(#_) .kat275-titel{font-size:38px} }
/* ===== Ende BAUPLAN 285 (Feinschliff) ===== */
/* ===== BAUPLAN 285: „Was dich erwartet“ – Intro, about blank, Gruß ===== */
.text275 .intro285{font-size:23px;line-height:1.45;font-weight:500;color:var(--ink);margin-block-end:6px}
.ab285{font-weight:600;color:#E9B372;white-space:nowrap}
.gruss285{font-size:19px;font-weight:600;color:#E9B372;margin-block-start:4px}
@media (max-width:419px){ .text275 .intro285{font-size:20px} }
/* ===== Ende BAUPLAN 285 (Text) ===== */
/* ===== BAUPLAN 285: Überschriften 20 % kleiner, mehr Luft oben, weniger unten; Vorverkauf-Streifen ganz am linken Rand (mit den Ecken) ===== */
:root:not(#_):not(#_):not(#_) .kat275-titel{font-size:46px;margin-block:52px 20px}
@media (min-width:900px){ :root:not(#_):not(#_):not(#_) .kat275-titel{font-size:61px;margin-block:68px 24px} }
@media (max-width:419px){ :root:not(#_):not(#_):not(#_) .kat275-titel{font-size:37px;margin-block:40px 16px} }
@media (max-width:359px){ :root:not(#_):not(#_):not(#_) .kat275-titel{font-size:31px} }
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-unten{left:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-haupt{padding-inline-start:52px}
@media (max-width:459px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-haupt{padding-inline-start:44px} }
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-haupt{padding-inline-start:36px} }
/* ===== Ende BAUPLAN 285 (Maße) ===== */
/* ===== BAUPLAN 285: Ticketart oben groß (ohne Datum), Abriss ohne Symbol, „Jetzt / Tickets / kaufen“ größer ===== */
:root:not(#_):not(#_):not(#_) .art285{font-size:19px;letter-spacing:.1em;margin-block-start:0}
:root:not(#_):not(#_):not(#_) .cta285{font-size:19px;line-height:1.2}
:root:not(#_):not(#_):not(#_) .cta285 > span{display:grid;gap:1px}
@media (max-width:459px){ :root:not(#_):not(#_):not(#_) .art285{font-size:15px;letter-spacing:.06em} :root:not(#_):not(#_):not(#_) .cta285{font-size:15px} }
/* ===== Ende BAUPLAN 285 (Abriss) ===== */
/* ===== BAUPLAN 285: „Was dich erwartet“ zweispaltig, „Über Calma“ einspaltig ===== */
.zwei285{display:grid;gap:18px}
.zwei285 .rechts285{max-inline-size:none;margin:0}
.zwei285 .intro285{margin:0}
@media (min-width:900px){
  .zwei285{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:56px;align-items:start}
  :root:not(#_):not(#_):not(#_) .zwei285 .intro285{font-size:30px;line-height:1.35}
}
:root:not(#_):not(#_) .zwei275{grid-template-columns:minmax(0,1fr)}
/* ===== Ende BAUPLAN 285 (Spalten) ===== */
/* ===== BAUPLAN 285: Text-Effekt „Verschmelzen“ (PLURI-Kopf) – feste Höhe einer Zeile, Wörter übereinander, mittig ===== */
.m269 .h269 h1:has(.goo285){align-self:stretch;inline-size:100%}
.goo285{position:relative;display:block;block-size:1.14em}
.goo285-wort{position:absolute;inset-block-start:0;inset-inline:0;text-align:center;white-space:nowrap;line-height:1.14}
.goo285-t{display:inline-block}
@media (max-width:699px){ :root:not(#_):not(#_):not(#_) .m269 .h269 h1:has(.goo285){font-size:min(13vw,64px)} }
/* ===== Ende BAUPLAN 285 (Verschmelzen) ===== */
/* ===== BAUPLAN 287: Countdown-Täfelchen mit ganz leichtem Korn wie die Boxen (Nutzer) ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .m269 :is(.kl270-o,.kl270-ko){background-color:#302920;
  background-image:linear-gradient(157deg,rgba(255,255,255,.05) 0%,rgba(255,255,255,0) 45%),var(--rausch-fein);background-blend-mode:normal,soft-light}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .m269 :is(.kl270-u,.kl270-ku){background-color:#2A231B;
  background-image:var(--rausch-fein);background-blend-mode:soft-light}
/* ===== Ende BAUPLAN 287 ===== */
/* ===== BAUPLAN 288: Ticket-Auswahl (Blatt), Programm-Chips zweizeilig ===== */
.t288{display:grid;gap:16px;align-content:start}
.t288-liste{display:grid;gap:10px}
.t288-z{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"name stepper" "preis stepper";align-items:center;gap:2px 14px;
  padding:14px 16px;border-radius:20px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(234,225,216,.14)}
.t288-z.an{box-shadow:inset 0 0 0 1.5px rgba(201,148,83,.7);background:rgba(201,148,83,.10)}
.t288-z.aus{opacity:.55}
.t288-name{grid-area:name;font-size:17px;font-weight:500;line-height:1.3}
.t288-preis{grid-area:preis;font-size:20px;font-weight:600;color:#E9B372;font-variant-numeric:tabular-nums}
.t288-aus,.t288-stepper{grid-area:stepper}
.t288-aus{font-size:14px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.t288-stepper{display:inline-flex;align-items:center;gap:6px}
.t288-k{inline-size:44px;block-size:44px;border-radius:50%;border:0;font-size:24px;line-height:1;color:#F8F2EB;cursor:pointer;
  background-color:#574E46;background-image:linear-gradient(#574E46,#574E46),var(--rausch-fein);background-blend-mode:normal,soft-light;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),inset 0 -1px 0 rgba(0,0,0,.25)}
.t288-k:disabled{opacity:.35;cursor:default}
.t288-n{min-inline-size:28px;text-align:center;font-size:21px;font-weight:600;font-variant-numeric:tabular-nums}
.t288-friend{display:flex;align-items:center;gap:12px;font-size:15px;color:var(--ink-2)}
.t288-friend .friend269-badge{inline-size:46px;block-size:46px;font-size:14px;background:#E6AA63;color:#19120B}
.t288-kasse{inline-size:100%;block-size:auto;min-block-size:56px;max-block-size:64px;align-self:start;font-size:18px;background:#E6AA63;color:#19120B;border:0}
.t288-kasse:disabled{opacity:.45;cursor:default}
.t288-kasse .ic{inline-size:22px;block-size:22px}
.t288-hinweis{margin:0}
/* Programm-Chips: alle zweizeilig, linksbündig */
:root:not(#_):not(#_):not(#_) .m269 .prog271 li{text-align:start;line-height:1.2}
/* Bring-a-friend-Box: großer und kleiner Text */
.friend271b .b271-klein{font-size:15px}
/* ===== Ende BAUPLAN 288 ===== */
/* ===== BAUPLAN 290: Ticket-Auswahl als Kinokarten, Zähler im Abriss ===== */
.t290-intro{font-size:17px;line-height:1.5;color:var(--ink-2);margin:0}
.t290-liste{display:grid;gap:14px;padding:4px 2px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .t290-k{--riss:66%;min-block-size:128px;transform:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .t290-k .kino279-haupt{padding:14px 16px;align-content:center;gap:6px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .t290-k .t290-name{font-size:14px;letter-spacing:.06em;line-height:1.3;white-space:normal}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .t290-k .kino279-preis{font-size:36px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .t290-k.an .kino279-abriss{background-color:#4B443B}
.t290-k.aus{opacity:.55}
.t290-ab{display:grid;place-items:center;padding:8px}
.t290-zaehler{display:flex;align-items:center;justify-content:center;gap:6px}
.t290-zaehler .t288-n{font-size:28px;line-height:1.1}
.t290-zaehler .t288-k{inline-size:42px;block-size:42px}
.t290-gratis{display:inline-flex;align-items:center;gap:6px;font-size:15px;font-weight:600;color:#F8F2EB}
.t290-gratis b{display:inline-grid;place-items:center;min-block-size:26px;padding:2px 9px;border-radius:999px;background:#E6AA63;color:#19120B;font-size:12px;font-weight:700;white-space:nowrap}
:root:not(#_):not(#_):not(#_) #blatt .t288-kasse{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;
  inline-size:100%;block-size:auto;min-block-size:54px;max-block-size:none;padding:12px 20px;flex:none;align-self:start}
.t290-voll{font-size:14px;font-weight:500;opacity:.65}
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .t290-k .kino279-preis{font-size:30px} .t290-zaehler .t288-k{inline-size:38px;block-size:38px} }
/* Kopf größer, mehr Abstand zu den Tickets; Zähler-Knöpfe deutlicher; Freunde mitbringen */
:root:not(#_):not(#_):not(#_) #blatt .tickets288-blatt .platte-kopf h2{font-size:34px;line-height:1.15}
:root:not(#_):not(#_):not(#_) #blatt .tickets288-blatt .platte-kopf h2 .auge{font-size:16px}
.t290-intro{margin-block:6px 10px}
:root:not(#_):not(#_):not(#_) .t290-zaehler .t288-k{inline-size:40px;block-size:40px;font-size:24px;font-weight:500;color:#19120B;background-color:#E9B372;
  background-image:linear-gradient(#E9B372,#E9B372),var(--rausch-fein);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 6px 12px -8px rgba(0,0,0,.7)}
:root:not(#_):not(#_):not(#_) .t290-zaehler .t288-k:disabled{opacity:.3}
.t290-zaehler .t288-n{min-inline-size:26px;font-size:26px}
.t290-friend-t{display:grid;gap:2px}
.t290-friend-t b{font-size:17px;font-weight:600;color:var(--ink)}
@media (max-width:419px){ :root:not(#_):not(#_):not(#_) #blatt .tickets288-blatt .platte-kopf h2{font-size:28px} :root:not(#_):not(#_):not(#_) .t290-zaehler .t288-k{inline-size:34px;block-size:34px;font-size:21px} .t290-zaehler{gap:4px} .t290-zaehler .t288-n{font-size:22px;min-inline-size:20px} }
/* Zähler größer, Abriss breiter (passt auch bei 320 px), Aufleuchten beim Antippen */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .t290-k{--riss:58%}
:root:not(#_):not(#_):not(#_):not(#_) .t290-zaehler .t288-k{inline-size:46px;block-size:46px;font-size:27px}
:root:not(#_):not(#_):not(#_):not(#_) .t290-zaehler{gap:8px}
:root:not(#_):not(#_):not(#_):not(#_) .t290-zaehler .t288-n{font-size:28px;min-inline-size:28px}
@keyframes blitz290{0%{background-color:#F3ECE5;background-image:none;transform:scale(1.08)}100%{transform:none}}
:root:not(#_):not(#_):not(#_):not(#_) .t290-zaehler .t288-k.blitz290{animation:blitz290 .45s ease-out}
@media (prefers-reduced-motion:reduce){ :root:not(#_):not(#_):not(#_):not(#_) .t290-zaehler .t288-k.blitz290{animation-duration:.01s} }
@media (max-width:459px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .t290-k{--riss:54%}
  :root:not(#_):not(#_):not(#_):not(#_) .t290-zaehler .t288-k{inline-size:42px;block-size:42px;font-size:25px}
  :root:not(#_):not(#_):not(#_):not(#_) .t290-zaehler{gap:5px}
  :root:not(#_):not(#_):not(#_):not(#_) .t290-zaehler .t288-n{font-size:24px;min-inline-size:22px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .t290-k .kino279-preis{font-size:30px}
}
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_) .t290-zaehler .t288-k{inline-size:36px;block-size:36px;font-size:22px} :root:not(#_):not(#_):not(#_):not(#_) .t290-zaehler{gap:3px} }
/* Kopf des Blatts größer – auch am Handy */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .tickets288-blatt .platte-kopf h2{font-size:34px;line-height:1.15}
@media (max-width:459px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .tickets288-blatt .platte-kopf h2{font-size:30px} }
/* Kasse-Knopf höher, Anzahl als Ticket mit Zahl */
:root:not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse{min-block-size:68px;padding:14px 22px;font-size:19px;gap:14px}
.t290-anz{display:inline-flex;align-items:center;gap:6px;padding:4px 12px 4px 10px;border-radius:999px;background:rgba(15,9,4,.14)}
.t290-anz .ic{inline-size:22px;block-size:22px}
.t290-anz b{font-weight:700;font-size:19px}
.t290-summe{font-weight:600}
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse{font-size:17px;gap:8px;padding-inline:14px} }
/* Zahl im Zähler größer, mehr Luft links/rechts (Nutzer) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .t290-zaehler{gap:14px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .t290-zaehler .t288-n{font-size:34px;min-inline-size:34px}
@media (max-width:459px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_) .t290-zaehler{gap:10px} :root:not(#_):not(#_):not(#_):not(#_):not(#_) .t290-zaehler .t288-n{font-size:30px;min-inline-size:26px} }
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_) .t290-zaehler{gap:5px} :root:not(#_):not(#_):not(#_):not(#_):not(#_) .t290-zaehler .t288-n{font-size:26px;min-inline-size:20px} }
/* Preiszeile: Preis links, Rabatt rechts auf gleicher Linie */
.t290-pz{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:nowrap;min-inline-size:0}
.t290-pz .t290-gratis{flex:none;gap:5px}
.t290-gic{display:grid;place-items:center;inline-size:30px;block-size:30px;border-radius:50%;background:rgba(201,148,83,.30);color:#E9E1D7}
.t290-gic .ic{inline-size:17px;block-size:17px}
@media (max-width:459px){ .t290-gic{inline-size:26px;block-size:26px} .t290-pz .t290-gratis{font-size:13px} .t290-gratis b{padding-inline:6px;font-size:11px} }
@media (max-width:359px){ .t290-gic,.t290-pz .t290-gratis b{display:none} }
/* Kasse-Knopf: links Tickets, mittig „Zur Kasse“, rechts Preis (größer) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;flex-wrap:nowrap}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse .t290-anz{justify-self:start}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse:disabled .t290-anz{visibility:hidden}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse .t290-kw{justify-self:center;white-space:nowrap}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse .t290-summe{justify-self:end;font-size:22px;font-weight:700;white-space:nowrap}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse .t290-voll{font-size:13px;font-weight:500}
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse .t290-summe{font-size:18px} :root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse .t290-voll{display:none} }
/* Zähler-Knöpfe dezenter, Zeichen weiß (Nutzer) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .t290-zaehler .t288-k{color:#FFFFFF;background-color:rgba(255,255,255,.12);background-image:var(--rausch-fein);
  background-blend-mode:soft-light;box-shadow:inset 0 0 0 1px rgba(234,225,216,.22),inset 0 1px 0 rgba(255,255,255,.14)}
@media (hover:hover){ :root:not(#_):not(#_):not(#_):not(#_):not(#_) .t290-zaehler .t288-k:not(:disabled):hover{background-color:rgba(255,255,255,.2)} }
@keyframes blitz291{0%{background-color:rgba(255,255,255,.55);transform:scale(1.08)}100%{transform:none}}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .t290-zaehler .t288-k.blitz290{animation:blitz291 .45s ease-out}
.t290-gratis[data-tip]{cursor:help}
/* ===== Ende BAUPLAN 290 ===== */
/* ===== BAUPLAN 291: Zerfließen auch bei den Kategorie-Überschriften; Intro ===== */
.kat275-titel:has(.goo285){inline-size:100%}
.kat275-titel .goo285{block-size:1.12em}
.goo285-wort.rosa291{color:#E9B372}
.calma291{font-weight:700;color:#E9B372;white-space:nowrap}
:root:not(#_):not(#_):not(#_):not(#_) .zwei285 .intro285{font-size:25px;line-height:1.38;font-weight:600;letter-spacing:-.005em;text-wrap:balance;hyphens:manual}
@media (max-width:899px){ :root:not(#_):not(#_):not(#_):not(#_) .zwei285 .intro285{font-size:21px} }
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_) .zwei285 .intro285{font-size:19px} }
/* Countdown-Ziffern als eine Ebene über den (leeren) Täfelchen */
.zf291k .cdz291{position:absolute;inset:0;z-index:2}
.zf291k .cdz291 .goo285-wort{position:absolute;inset:0;display:grid;place-items:center;line-height:1}
/* ===== Ende BAUPLAN 291 ===== */
/* ===== BAUPLAN 292: Countdown ohne Klapp-Fuge (Nutzer: „ohne diese Linien dazwischen“) – eine durchgehende Fläche je Täfelchen ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .zf291k::after,:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .zf291k::before{content:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .zf291k :is(.kl270-o,.kl270-u){display:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .zf291k{border-radius:16px;background-color:#302920;
  background-image:linear-gradient(157deg,rgba(255,255,255,.06) 0%,rgba(255,255,255,0) 45%),var(--rausch-fein);background-blend-mode:normal,soft-light;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 0 18px rgba(201,148,83,.10),0 12px 24px -14px rgba(0,0,0,.75)}
/* ===== Ende BAUPLAN 292 ===== */
/* ===== BAUPLAN 293: Countdown-Ziffern einzeln ===== */
.zf291k .cdz293{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center}
.zz293{position:relative;display:inline-block;inline-size:.6em;block-size:1.1em}
.zz293 .goo285-wort{position:absolute;inset:0;display:grid;place-items:center;line-height:1}
/* nicht markierbar: Countdown und Wechsel-Überschriften (Nutzer) */
.m269 :is(.cd270,.h269 h1,.kat275-titel){-webkit-user-select:none;user-select:none}
/* ===== Ende BAUPLAN 293 ===== */
/* ===== BAUPLAN 294: Markierfarbe = Farbe der Seite (Nutzer: „wenn markieren, immer die richtige dynamische Farbe – auch auf allen anderen
   Seiten, wenn es Aufgüsse gibt und die Seite sich farblich ändert“). Grundwert im Seitenblau – die Stimmung (serve.mjs umfaerben) färbt ihn
   wie alle Blautöne in den Ton des Aufgusses um; Startseite (warm270) rosa. Dazu: Boxen und Programm-Zeile oben nicht markierbar. ===== */
::selection{background:rgba(134,97,51,.55);color:#FFFFFF}
:root.warm270 ::selection{background:rgba(201,148,83,.45);color:#FFFFFF}
.m269 :is(.boxen271,.prog271){-webkit-user-select:none;user-select:none}
/* ===== Ende BAUPLAN 294 ===== */
/* ===== BAUPLAN 296: alle großen Texte der vier Boxen gleich groß (Nutzer), lange Uhrzeiten (z. B. englisch) dürfen umbrechen ===== */
:root:not(#_):not(#_):not(#_) .m269 .b271 .b271-gross{font-size:23px;line-height:1.2;color:var(--ink)}
@media (min-width:760px){ :root:not(#_):not(#_):not(#_) .m269 .b271 .b271-gross{font-size:26px} }
@media (max-width:359px){ :root:not(#_):not(#_):not(#_) .m269 .b271 .b271-gross{font-size:19px} }
:root:not(#_):not(#_):not(#_) .m269 .b271 .b271-klein{font-size:15px}
@media (max-width:359px){ :root:not(#_):not(#_):not(#_) .m269 .b271 .b271-klein{font-size:13px} }
.m269 .b271 .nw265{white-space:normal}
/* am Handy wachsen die Boxen mit dem Inhalt (statt fest quadratisch) */
@media (max-width:759px){ :root:not(#_):not(#_):not(#_) .m269 .b271{aspect-ratio:auto;min-block-size:168px} }
@media (max-width:359px){ :root:not(#_):not(#_):not(#_) .m269 .b271{min-block-size:140px} }
/* ===== Ende BAUPLAN 296 ===== */
/* ===== BAUPLAN 297: Ticket-Blatt – „Zur Kasse“ erst sichtbar, wenn Tickets gewählt sind; Knopf höher, Schrift größer; Freunde-Zeile weg (Nutzer) ===== */
#blatt .t290-friend{display:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse:disabled{display:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse{min-block-size:78px;padding:16px 24px;font-size:22px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse .t290-kw{font-size:23px;font-weight:600}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse .t290-summe{font-size:25px}
@keyframes kasse297{from{opacity:0;transform:translateY(10px)}}
@media (prefers-reduced-motion:no-preference){ #blatt .t288-kasse:not(:disabled){animation:kasse297 .3s ease-out} }
@media (max-width:459px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse{min-block-size:70px;font-size:19px;padding-inline:16px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse .t290-kw{font-size:19px} :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse .t290-summe{font-size:21px} }
/* Inhalts-Boxen im Grund der Countdown-Täfelchen (Nutzer) */
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 :is(.kat275-box:not(#programm265 > .kat275-box),.pb275){
  background-color:#302920;background-image:linear-gradient(157deg,rgba(255,255,255,.06) 0%,rgba(255,255,255,0) 45%),var(--rausch-fein);
  background-blend-mode:normal,soft-light;-webkit-backdrop-filter:none;backdrop-filter:none;border:0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 0 18px rgba(201,148,83,.10),0 12px 24px -14px rgba(0,0,0,.75)}
/* ===== Ende BAUPLAN 297 ===== */
/* ===== BAUPLAN 297: Links im Text ===== */
a.link297{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:.18em;text-decoration-color:rgba(217,162,97,.45)}
@media (hover:hover){ a.link297:hover{text-decoration-color:currentColor} }
/* ===== Ende BAUPLAN 297 (Links) ===== */
/* ===== BAUPLAN 298: Gruß weiß, Herz pink ===== */
:root:not(#_):not(#_):not(#_) .gruss285{color:var(--ink);display:inline-flex;align-items:center;gap:8px}
.herz298 svg{display:block;inline-size:20px;block-size:20px;fill:#E9B372}
/* ===== Ende BAUPLAN 298 ===== */
/* ===== BAUPLAN 298: andersherum (Nutzer: „der Countdown sollte wie die Boxen sein“) – Boxen wieder Glas wie vor 297, Countdown-Täfelchen im selben Glas ===== */
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 :is(.kat275-box:not(#programm265 > .kat275-box),.pb275),
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .zf291k{
  background-color:var(--glas-fill);
  background-image:linear-gradient(157deg,rgba(var(--glas-ton),.10) 0%,rgba(255,255,255,0) 38%,rgba(0,0,0,.05) 100%),var(--rausch-fein);
  background-blend-mode:normal,var(--rausch-mix);-webkit-backdrop-filter:blur(22px) saturate(1.4);backdrop-filter:blur(22px) saturate(1.4);
  border:1px solid rgba(var(--glas-ton),.14);
  box-shadow:inset 0 1px 0 var(--glas-kante),inset 0 -1px 0 rgba(0,0,0,.06),0 10px 30px -14px rgba(25,18,10,.35)}
/* ===== Ende BAUPLAN 298 (Glas) ===== */
/* ===== BAUPLAN 298: Kicker „Calma Saunagarten“ über der Überschrift weg (steht im Wechsel), mehr Luft zwischen Herz und Überschrift (Nutzer) ===== */
:root:not(#_):not(#_):not(#_) .m269 .h269 .h269-kicker{display:none}
:root:not(#_):not(#_):not(#_) .m269 .h269 .held265-kuppel{margin-block-end:34px}
@media (max-width:419px){ :root:not(#_):not(#_):not(#_) .m269 .h269 .held265-kuppel{margin-block-end:24px} }
/* ===== Ende BAUPLAN 298 (Kopf) ===== */
/* ===== BAUPLAN 298: ein kleines Stück mehr Abstand unter den Kategorie-Überschriften (Nutzer: „nur bisschen“) ===== */
:root:not(#_):not(#_):not(#_):not(#_) .kat275-titel{margin-block-end:28px}
@media (min-width:900px){ :root:not(#_):not(#_):not(#_):not(#_) .kat275-titel{margin-block-end:32px} }
@media (max-width:419px){ :root:not(#_):not(#_):not(#_):not(#_) .kat275-titel{margin-block-end:22px} }
/* ===== Ende BAUPLAN 298 (Abstand) ===== */
/* ===== BAUPLAN 298: „Zur Kasse“ blinkt beim Zählen nicht mehr (die Einblend-Animation startete bei jedem Neuzeichnen neu) ===== */
:root:not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse:not(:disabled){animation:none}
/* ===== Ende BAUPLAN 298 (Kasse) ===== */
/* ===== BAUPLAN 299: Vorverkauf-Streifen – Schrift etwas nach rechts (Box bleibt), mehr Abstand zum Inhalt; about blank rosa ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-unten{padding:0 7px 0 11px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-haupt{padding-inline-start:60px}
@media (max-width:459px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-unten{padding:0 5px 0 9px} :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-haupt{padding-inline-start:50px} }
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-unten{padding:0 4px 0 7px} :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .kino279-haupt{padding-inline-start:42px} }
.ab299{color:#E9B372}
/* ===== Ende BAUPLAN 299 ===== */
/* ===== BAUPLAN 300: Wegskizze + Feinschliff ===== */
.karte300-rahmen{position:relative;inline-size:100%;aspect-ratio:1;margin-block-end:20px;border-radius:26px;overflow:hidden;
  background-color:#302920;background-image:linear-gradient(157deg,rgba(255,255,255,.06) 0%,rgba(255,255,255,0) 45%),var(--rausch-fein);background-blend-mode:normal,soft-light;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 0 0 1px rgba(234,225,216,.10)}
.karte300{display:block;inline-size:100%;block-size:100%}
.karte300 path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.karte300 .k300-wasser{fill:rgba(201,148,83,.10);stroke:rgba(217,162,97,.22);stroke-width:.8}
.karte300 .k300-neben{stroke:rgba(243,236,229,.16);stroke-width:2}
.karte300 .k300-haupt{stroke:rgba(243,236,229,.30);stroke-width:4.2}
.karte300 .k300-gleis{stroke:rgba(243,236,229,.20);stroke-width:3.2}
.karte300 .k300-gleis2{stroke:#302920;stroke-width:1.4;stroke-dasharray:2.4 2.4}
.karte300 .k300-weg-grund{stroke:rgba(201,148,83,.28);stroke-width:9}
.karte300 .k300-weg{stroke:#E9B372;stroke-width:3.2;stroke-dasharray:.1 7;animation:weg300 1.6s linear infinite}
@keyframes weg300{to{stroke-dashoffset:-7.1}}
.karte300 .k300-bhf circle{fill:#F8F2EB}
.karte300 .k300-bhf text{fill:#302920;font-size:13px;font-weight:700;font-family:inherit}
.karte300 .k300-ab > circle:not(.k300-puls){fill:#E6AA63}
.karte300 .k300-ab g > *{fill:#19120B}
.karte300 .k300-puls{fill:#E6AA63;transform-box:fill-box;transform-origin:center;animation:puls300 2.4s ease-out infinite}
@keyframes puls300{from{opacity:.55;transform:scale(1)}to{opacity:0;transform:scale(2.4)}}
.karte300 .k300-label{fill:#F8F2EB;font-size:11.5px;font-weight:600;font-family:inherit;paint-order:stroke;stroke:#302920;stroke-width:3px;stroke-linejoin:round}
.karte300 .k300-label-ab{fill:#E9B372}
.karte300 .k300-zeit rect{fill:#F8F2EB}
.karte300 .k300-zeit text{fill:#19120B;font-size:11px;font-weight:700;font-family:inherit}
.karte300 .k300-geh{stroke:#19120B;stroke-width:2.2;fill:none}
.karte300-osm{position:absolute;inset-inline-end:12px;inset-block-end:9px;font-size:10px;color:rgba(243,236,229,.45);pointer-events:none}
@media (prefers-reduced-motion:reduce){ .karte300 :is(.k300-weg,.k300-puls){animation:none} }
/* geschlossene Tage (Mi, Sa) ohne weißen Rand (Nutzer) */
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .woche269 li.zu{box-shadow:none;background:rgba(255,255,255,.06);background-image:none}
/* „Bring a friend“-Box im Chip-Stil (Nutzer: „wir haben ja den Style“) */
:root:not(#_):not(#_):not(#_):not(#_) :is(.friend270,.friend265){background-color:#443D34;background-image:linear-gradient(#443D34,#443D34),var(--rausch-fein);background-blend-mode:normal,soft-light;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),inset 0 -1px 0 rgba(0,0,0,.25),0 8px 18px -12px rgba(0,0,0,.7)}
/* Tickets: ganz feine Lichtkante und leichtes Korn wie die Boxen (Nutzer: „ganz fein, bisschen“) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .kino279 > div{box-shadow:inset 0 1px 0 rgba(255,255,255,.10),inset 0 0 0 1px rgba(234,225,216,.07)}
/* Überschrift ein bisschen näher ans Logo (Nutzer: „nur bisschen“) */
:root:not(#_):not(#_):not(#_):not(#_) .m269 .h269 .held265-kuppel{margin-block-end:24px}
@media (max-width:419px){ :root:not(#_):not(#_):not(#_):not(#_) .m269 .h269 .held265-kuppel{margin-block-end:18px} }
/* Kopf-Überschrift am Handy: zwei Zeilen, etwas größer */
@media (max-width:699px){
  :root:not(#_):not(#_):not(#_):not(#_) .m269 .h269 h1#titel .goo285{block-size:2.24em}
  :root:not(#_):not(#_):not(#_):not(#_) .m269 .h269 h1#titel .goo285-wort{white-space:pre-line;line-height:1.12}
  :root:not(#_):not(#_):not(#_):not(#_) .m269 .h269 h1:has(.goo285){font-size:min(15vw,72px)}
}
/* Programm-Box oben: gerade Trennlinien statt runder Einzelfelder (Nutzer: „da ist etwas abgeschnitten“) */
:root:not(#_):not(#_):not(#_):not(#_) .m269 .prog271 li{border-radius:0;box-shadow:none;background:none}
@media (max-width:759px){
  :root:not(#_):not(#_):not(#_):not(#_) .m269 .prog271 li:nth-child(even){border-inline-start:1px solid var(--line)}
  :root:not(#_):not(#_):not(#_):not(#_) .m269 .prog271 li:nth-child(n+3){border-block-start:1px solid var(--line)}
}
@media (min-width:760px){ :root:not(#_):not(#_):not(#_):not(#_) .m269 .prog271 li + li{border-inline-start:1px solid var(--line)} }
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_) .m269 .prog271 li{border-inline-start:0}
  :root:not(#_):not(#_):not(#_):not(#_) .m269 .prog271 li + li{border-block-start:1px solid var(--line)} }
/* kein „Tickets kaufen“ in der Preis-Box – oben (Rechner) bzw. unten (Handy) klebt immer einer (Nutzer) */
#preise265 .karte265-knoepfe{display:none}
/* Kategorie-Überschriften am Handy etwas größer (Nutzer) – zu lange Wechseltexte passt gooEinpassen285 weiter ein */
@media (max-width:419px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_) .kat275-titel{font-size:44px} }
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_) .kat275-titel{font-size:37px} }
/* ===== Ende BAUPLAN 300 ===== */
/* ===== BAUPLAN 304: Workshop-Karten; Knöpfe & Social-Kreise im Glas-Umriss, Hover pink mit schwarzer Schrift (Nutzer) ===== */
.t304-liste{margin-block-start:4px}
.t304-unter{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .t304-k .kino279-preis{font-size:28px}
.t304-liste.zu304{opacity:.5}
.t304-hilfe{margin:0;color:var(--ink-2)}
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rund265{background-color:rgba(255,255,255,.05);background-image:none;
  -webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:inset 0 0 0 1px rgba(234,225,216,.22);color:var(--ink)}
@media (hover:hover){
  :root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) :is(.rund265,.k265.rand,.karte265 .k265.rand,#anfahrt265 .k265.voll):hover{
    background-color:#E6AA63;background-image:none;color:#19120B;box-shadow:none}
}
/* ===== Ende BAUPLAN 304 ===== */
/* ===== BAUPLAN 305: Workshop-Kopf im Ticket-Blatt; „Zur Kasse“ klebt unten (Nutzer: „wenn weniger Auflösung, muss Zur Kasse sticky unten“) ===== */
.t305-kopf{display:grid;gap:6px;margin-block:14px 2px}
.t305-titel{font-size:22px;font-weight:600;line-height:1.2}
.t305-text{font-size:16px;line-height:1.5;color:var(--ink-2)}
.t305-info{display:inline-flex;align-items:center;gap:8px;justify-self:start;padding:6px 14px;border-radius:999px;font-size:14px;font-weight:500;color:#F8F2EB;
  background-color:#443D34;background-image:linear-gradient(#443D34,#443D34),var(--rausch-fein);background-blend-mode:normal,soft-light;box-shadow:inset 0 1px 0 rgba(255,255,255,.16)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288 .t288-kasse{position:sticky;inset-block-end:12px;z-index:3;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 -14px 24px -6px rgba(20,14,7,.85),0 10px 22px -12px rgba(0,0,0,.7)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288 .t288-kasse{margin-block-end:14px}
.t305-info{border-radius:16px;line-height:1.35}
/* ===== Ende BAUPLAN 305 ===== */
/* ===== BAUPLAN 306: Ticket-Blatt bei wenig Höhe kompakter (Nutzer: „wenn die Auflösung kleiner wird, müssen die Tickets kleiner werden“) ===== */
@media (max-height:900px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-k{min-block-size:96px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-k .kino279-haupt{padding-block:10px;gap:3px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-k .kino279-preis{font-size:30px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t304-k .kino279-preis{font-size:24px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-zaehler .t288-k{inline-size:36px;block-size:36px;font-size:22px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-zaehler .t288-n{font-size:26px}
  #blatt .t290-liste{gap:10px}
  #blatt .t290-intro{font-size:15px;margin-block:2px 4px}
  #blatt .t305-kopf{margin-block:8px 0;gap:4px}
  #blatt .t305-titel{font-size:19px}
  #blatt .t305-text{font-size:14.5px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288 .t288-kasse{min-block-size:60px;padding-block:10px}
}
@media (max-height:720px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-k{min-block-size:80px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-k .kino279-haupt{padding-block:8px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-k .t290-name{font-size:12px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-k .kino279-preis{font-size:26px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t304-k .kino279-preis{font-size:21px}
  #blatt .t304-unter{font-size:11.5px}
  #blatt .t290-liste{gap:8px}
  #blatt .t305-text{display:none}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288 .t288-kasse{min-block-size:54px}
}
/* Info nur rosa Text, ohne Pille (Nutzer) */
:root:not(#_):not(#_):not(#_) #blatt .t305-info{display:block;padding:0;background:none;box-shadow:none;border-radius:0;color:#E9B372;font-size:15px;font-weight:600}
/* kein Sprung, wenn der Scrollbalken erscheint (Nutzer): Platz dafür immer frei halten */
#blatt .tickets288-blatt,#blatt .tickets288-blatt .platte-inhalt{scrollbar-gutter:stable}
/* Workshop-Zeiten passen auch am schmalen Handy */
@media (max-width:419px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t304-k .kino279-preis{font-size:min(22px,5.4vw)} }
/* ===== Ende BAUPLAN 306 ===== */
/* ===== BAUPLAN 307: bei wenig Höhe Ticket-Namen kleiner; mehr Luft zwischen Preis/Rabatt und der Perforation (Nutzer) ===== */
@media (max-height:900px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-k .t290-name{font-size:12.5px;letter-spacing:.05em}
  #blatt .t304-unter{font-size:12px}
}
:root:not(#_):not(#_):not(#_):not(#_) #blatt .t290-pz{gap:14px}
:root:not(#_):not(#_):not(#_):not(#_) #blatt .t290-pz .t290-gratis{margin-inline-end:10px}
@media (max-width:419px){ :root:not(#_):not(#_):not(#_):not(#_) #blatt .t290-pz .t290-gratis{margin-inline-end:4px} }
/* links etwas mehr Platz für Name und Preis (Nutzer) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-k .kino279-haupt{padding-inline-start:24px}
@media (max-width:419px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-k .kino279-haupt{padding-inline-start:18px} }
@media (max-width:379px){ :root:not(#_):not(#_):not(#_):not(#_) #blatt .t290-pz .t290-gratis{margin-inline-end:0} :root:not(#_):not(#_):not(#_):not(#_) #blatt .t290-pz .t290-gic{display:none} :root:not(#_):not(#_):not(#_):not(#_) #blatt .t290-pz{gap:6px} }
/* ===== Ende BAUPLAN 307 ===== */
/* ===== BAUPLAN 308: Burger aus zwei Linien → X (Nutzer: „die beiden gehen zusammen und werden zum X“); Mauszeiger wie bei Teamwellness (Pfeil + Hand,
   gleiche Form, der versetzte Schatten in unserem Pink statt Orange); Calma-Vorlader im Ticket-Blatt in der Farbe der Seite ===== */
:root{--pfeil308:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2229%22%20height%3D%2232%22%20viewBox%3D%220%200%2044%2048%22%3E%3Cg%20stroke-linejoin%3D%22round%22%20stroke-linecap%3D%22round%22%3E%3Cpath%20transform%3D%22translate(2.5%202.5)%22%20fill%3D%22%23FF5CA8%22%20d%3D%22M7%205L7%2036.5L14.8%2029.2L20.4%2041.6L26.6%2038.8L21%2026.7L31.6%2026.3Z%22%2F%3E%3Cpath%20fill%3D%22%23fffdf3%22%20stroke%3D%22%231e1b18%22%20stroke-width%3D%222.6%22%20d%3D%22M7%205L7%2036.5L14.8%2029.2L20.4%2041.6L26.6%2038.8L21%2026.7L31.6%2026.3Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") 5 3, auto;--hand308:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cg%20stroke-linejoin%3D%22round%22%20stroke-linecap%3D%22round%22%3E%3Cpath%20transform%3D%22translate(2.5%202.5)%22%20fill%3D%22%23FF5CA8%22%20d%3D%22M14%2026V8.5C14%204.5%2021.5%204.5%2021.5%208.5V21C21.5%2017.5%2028.5%2017.5%2028.5%2021V23C28.5%2019.5%2035%2019.5%2035%2023V25C35%2021.5%2041.5%2022%2041.5%2026V33C41.5%2040.5%2036%2045%2028.5%2045H23.5C18.5%2045%2015.5%2043%2013%2039.5L5.5%2029.5C3.5%2026.5%207.5%2022.5%2010.8%2025.5L14%2028.5Z%22%2F%3E%3Cpath%20fill%3D%22%23fffdf3%22%20stroke%3D%22%231e1b18%22%20stroke-width%3D%222.6%22%20d%3D%22M14%2026V8.5C14%204.5%2021.5%204.5%2021.5%208.5V21C21.5%2017.5%2028.5%2017.5%2028.5%2021V23C28.5%2019.5%2035%2019.5%2035%2023V25C35%2021.5%2041.5%2022%2041.5%2026V33C41.5%2040.5%2036%2045%2028.5%2045H23.5C18.5%2045%2015.5%2043%2013%2039.5L5.5%2029.5C3.5%2026.5%207.5%2022.5%2010.8%2025.5L14%2028.5Z%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%231e1b18%22%20stroke-width%3D%222%22%20d%3D%22M21.5%2021v6M28.5%2023v5.5M35%2025v4.5%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") 12 3, pointer}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body,:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #menue265,:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt{cursor:var(--pfeil308)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) :is(a[href],button:not(:disabled),label,summary,select,[role="button"],[data-tu],[tabindex="0"][data-tip],.kino284,.karte300-rahmen),
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) :is(a[href],button:not(:disabled),[data-tu]) *{cursor:var(--hand308)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) button:disabled,:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) button:disabled *{cursor:var(--pfeil308)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) :is(input:not([type="button"],[type="submit"],[type="checkbox"],[type="radio"],[type="range"]),textarea,[contenteditable="true"]){cursor:text}
/* Burger: zwei Linien (y 9 und 15), offen ein X – beim Wechsel gehen sie erst zusammen, dann drehen sie */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .burger265 .b308 path{transform-box:view-box;transform-origin:12px 12px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .burger265[aria-expanded="true"] .b308-o{transform:rotate(45deg) translateY(3px)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .burger265[aria-expanded="true"] .b308-u{transform:rotate(-45deg) translateY(-3px)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .burger265.an308[aria-expanded="true"] .b308-o{animation:o308zu .44s cubic-bezier(.45,0,.25,1) both}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .burger265.an308[aria-expanded="true"] .b308-u{animation:u308zu .44s cubic-bezier(.45,0,.25,1) both}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .burger265.an308[aria-expanded="false"] .b308-o{animation:o308auf .44s cubic-bezier(.45,0,.25,1) both}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .burger265.an308[aria-expanded="false"] .b308-u{animation:u308auf .44s cubic-bezier(.45,0,.25,1) both}
@keyframes o308zu{0%{transform:rotate(0) translateY(0)}45%{transform:rotate(0) translateY(3px)}100%{transform:rotate(45deg) translateY(3px)}}
@keyframes u308zu{0%{transform:rotate(0) translateY(0)}45%{transform:rotate(0) translateY(-3px)}100%{transform:rotate(-45deg) translateY(-3px)}}
@keyframes o308auf{0%{transform:rotate(45deg) translateY(3px)}55%{transform:rotate(0) translateY(3px)}100%{transform:rotate(0) translateY(0)}}
@keyframes u308auf{0%{transform:rotate(-45deg) translateY(-3px)}55%{transform:rotate(0) translateY(-3px)}100%{transform:rotate(0) translateY(0)}}
@media (prefers-reduced-motion:reduce){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .burger265.an308 .b308 path{animation:none} }
/* Vorlader (Kuppel baut sich auf) in der Farbe der Seite: Linie und Glut aus --dome (folgt der Stimmung), oben ins Pink – kein Orange */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .blatt-lader polygon{stroke:color-mix(in srgb,var(--dome) 60%,transparent);
  --hitze:color-mix(in oklab,color-mix(in oklab,var(--dome),#FFFFFF 30%),color-mix(in oklab,var(--dome) 35%,#E6AA63) calc(var(--h,.5) * 100%));
  --glut-spitze:color-mix(in srgb,var(--hitze) calc((.16 + var(--h,.5) * .7) * 100%),transparent);
  --glut-rest:color-mix(in srgb,var(--hitze) calc((.06 + var(--h,.5) * .3) * 100%),transparent)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .blatt-lader .vl-name{color:color-mix(in srgb,var(--ink) 78%,transparent)}
/* im Ticket-Blatt an Stelle der Liste; kommt erst nach 250 ms (schnelles Laden: gar keine Kuppel) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .t308-lader{display:grid;place-items:center;min-block-size:min(52vh,420px)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .t308-lader .blatt-lader{position:relative;inset:auto;z-index:auto;padding:0;background:none;opacity:0;transition:none;animation:t308ein .45s ease .25s forwards}
@keyframes t308ein{to{opacity:1}}
@media (prefers-reduced-motion:reduce){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .t308-lader .blatt-lader{animation:none;opacity:1} }
/* Rückblick-Übersicht: jede Event-Box über die volle Breite (Nutzer), oben mehr Luft unter dem Kopf */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rueck265 .rk265-liste{grid-template-columns:minmax(0,1fr)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .held265.klein265{padding-block-start:clamp(44px,7vw,84px)}
/* Event-Rückblick: der Knopf „‹ Rückblick“ oben entfällt (Nutzer: „mach den ganz weg, oben steht ja Programm und co“) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) p.zurueck265{display:none}
/* Herz/Kuppel oben auf der Startseite 10 % größer (Nutzer) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .h269 .held265-kuppel{inline-size:145px}
@media (max-width:420px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .h269 .held265-kuppel{inline-size:123px} }
/* Kopf-Knöpfe (Ton · Sprache · Menü): beim Überfahren Pink wie die Social-Icons (Nutzer); stumm = dezenter (Nutzer: „wenn muted, weniger zu sehen“) */
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #root .leiste .ton277[aria-pressed="false"]{background:rgba(255,255,255,.035);color:color-mix(in srgb,var(--ink) 50%,transparent)}
@media (hover:hover){
  :root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #root .leiste :is(.icon-knopf,.sprach-knopf):hover{background-color:#E6AA63;background-image:none;color:#19120B;box-shadow:none}
}
/* ===== Ende BAUPLAN 308 ===== */
/* ===== BAUPLAN 309: aktiver Menüpunkt
   bleibt hell hinterlegt – oben in der Pille wie beim Überfahren, im Burger dezent (die Seite selbst bleibt pink) ===== */
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #leiste .reiter270-k[aria-current="true"]{background:rgba(255,255,255,.13);color:var(--ink)}
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #menue265 .m265-link[aria-current="true"]:not(.an){background:rgba(255,255,255,.1)}
/* Tickets gerade wie im Ticket-Blatt, kein Drehen/Heben beim Überfahren – nur dezent heller (Nutzer: „gerade, kein Hover-Drehen, nur etwas heller“) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) :is(.kino279,.kino279:nth-child(2),a.kino284,a.kino284:hover){transform:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) a.kino284{transition:filter .25s ease}
@media (hover:hover){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) a.kino284:hover{filter:drop-shadow(0 10px 14px rgba(0,0,0,.35)) brightness(1.1)} }
/* Intro: „Herausgekommen?“ und „Calma Saunagarten“ je eigene Zeile */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .intro285 .z309{display:block}
/* ===== Ende BAUPLAN 309 ===== */
/* ===== BAUPLAN 311: Mitmachen-Box über die volle Breite, so hoch wie der Workshop – Symbol oben links, unten Titel, Text und Knopf;
   Ticket-Vorlader blendet nach dem ganzen Aufbau aus, die Glut bleibt dabei sichtbar stehen ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .mit311{display:flex;flex-direction:column;gap:18px;min-block-size:340px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .mit311-ic{flex:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .mit311-unten{margin-block-start:auto;display:grid;gap:10px;max-inline-size:62ch}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .mit311-name{margin:0;font-size:30px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .mit311-text{margin:0;font-size:17px;line-height:1.55}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .mit311-knoepfe{margin-block-start:8px;justify-content:flex-start}
@media (max-width:759px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .mit311{min-block-size:300px} :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .mit311-name{font-size:25px} }
@media (max-width:419px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .mit311{min-block-size:0} :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .mit311-name{font-size:23px} }
/* Vorlader: Glut bleibt nach dem Aufbau stehen (kräftiger als das Verglimmen), Ausblenden erst danach */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .blatt-lader polygon{--glut-rest:color-mix(in srgb,var(--hitze) calc((.1 + var(--h,.5) * .42) * 100%),transparent)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .t308-lader .blatt-lader.aus311{animation:none;opacity:0;transition:opacity .3s ease}
/* ===== Ende BAUPLAN 311 ===== */
/* ===== BAUPLAN 312: Handy ganz genau ===== */
/* Kopf-Überschrift am Handy: genau die zwei gesetzten Zeilen (kein dritter Umbruch – sonst lag sie über dem Countdown); die Größe passt JS an */
@media (max-width:699px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .h269 h1#titel .goo285-wort{white-space:pre} }
/* Abschnitts-Überschriften am Handy: Kasten für zwei Zeilen, einzeilige Wörter mittig darin */
@media (max-width:699px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .kat275-titel .goo285{block-size:2.24em}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .kat275-titel .goo285-wort{white-space:pre;line-height:1.12;inset-block-end:0;display:flex;align-items:center;justify-content:center}
}
/* Countdown fließend: vier Kästen + drei Lücken passen immer in die Breite des Kopfs (auch mit Zoom), Größen wachsen mit */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .h269{container-type:inline-size}
@media (max-width:899px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .cd270{gap:8px;inline-size:100%;justify-content:center}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .cd270 .kl270{--kb:clamp(54px,calc((100cqi - 24px) / 4),104px);--kh:calc(var(--kb) * .86);font-size:calc(var(--kb) * .57)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .cd270-k small{font-size:clamp(11px,calc(var(--kb, 80px) * .16),14px)}
}
/* Info-Boxen am Handy untereinander (Nutzer: „1 × 1 × 1, nicht 2 × 2“), Text nie abgeschnitten */
@media (max-width:599px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .boxen271{grid-template-columns:minmax(0,1fr)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .b271{aspect-ratio:auto;min-block-size:0;block-size:auto;overflow:visible}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .b271 .b271-text{overflow:visible}
}
/* Programm am Handy: eine Spalte mit Linien dazwischen (statt 2 × 2) */
@media (max-width:599px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .prog271{grid-template-columns:minmax(0,1fr)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .prog271 li{border-inline-start:0;border-block-start:0}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .prog271 li + li{border-block-start:1px solid var(--line)}
}
/* Öffnungszeiten am Handy: Wochentage teilen sich die Breite (nie breiter als die Box), kleine Kästen untereinander als Zeilen */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .danach271{container-type:inline-size}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .danach271 .woche269{display:flex;flex-wrap:nowrap;gap:clamp(3px,1.6cqi,8px);justify-content:flex-start}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .danach271 .woche269 li{flex:1 1 0;min-inline-size:0;max-inline-size:48px;inline-size:auto;block-size:auto;aspect-ratio:1;font-size:clamp(11px,4.6cqi,15px)}
@media (max-width:479px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .minis271{grid-template-columns:minmax(0,1fr)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .minis271 .mini271{min-block-size:0;flex-direction:row;align-items:center;justify-content:flex-start;gap:14px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .mini271 .w271-ic{flex:none}
}
/* Tickets: Schrift wächst mit der Kartenbreite – „WOCHENENDTICKET“ bleibt ein Wort in einer Zeile */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .kinos279 .kino279{container-type:inline-size}
@media (max-width:479px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .kino279-art{font-size:clamp(10.5px,5.2cqi,15px);overflow-wrap:normal;word-break:normal;hyphens:manual}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .kino279-preis{font-size:clamp(28px,14cqi,44px)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .kino279-unten{font-size:clamp(9.5px,4.2cqi,12px)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .kino279-abriss{font-size:clamp(11px,5cqi,15px)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .friend270 b{font-size:16px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .friend270 .friend269-text span{font-size:14px}
}
/* Burger-Menü: am Handy volle Breite (16 px Rand), kaum durchsichtig, dahinter unscharf */
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #menue265{background-color:rgba(32,25,18,.985);-webkit-backdrop-filter:blur(28px) saturate(1.15);backdrop-filter:blur(28px) saturate(1.15)}
@media (max-width:699px){ :root:not(#_):not(#_):not(#_) #menue265{left:16px!important;right:16px!important;inline-size:auto!important} }
/* Logo-Schrift: JS verkleinert, nie Auslassungspunkte */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #leiste .marke b{text-overflow:clip}
/* ===== Ende BAUPLAN 312 ===== */
/* ===== BAUPLAN 313: Handy – Überschriften eine Größe (--kat313 aus JS), Kasten ein- oder zweizeilig je Überschrift; Kopf nur Kuppel, größer ===== */
@media (max-width:699px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .kat275-titel[data-z313]{font-size:var(--kat313,36px)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .kat275-titel[data-z313="1"] .goo285{block-size:1.12em}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .kat275-titel[data-z313="2"] .goo285{block-size:2.24em}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .cd270{margin-block-start:26px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #leiste .marke > :not(.marke-kuppel){position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #leiste .marke-kuppel{inline-size:58px;block-size:35px;flex:none}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #leiste .marke-kuppel svg{inline-size:58px;block-size:35px}
}
/* kein blauer Tipp-Schimmer am Handy (z. B. Freunde-Box mit Tooltip) – Fokusrahmen nur bei Tastatur */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 :is(a,button,[tabindex],label,summary){-webkit-tap-highlight-color:transparent}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 [tabindex]:focus:not(:focus-visible){outline:none}
/* ===== Ende BAUPLAN 313 ===== */
/* ===== BAUPLAN 314: Ticket-Blatt am Handy luftiger (Nutzer: „Plus/Minus etwas kleiner, Freunde-Symbol kleiner, nicht so gedrungen“) –
   kleinere Kreise, schmalerer Abriss, Namen brechen nur an Leerzeichen (nie „WOCHENEND-TI-CKET“), Freunde-Rabatt schlank ===== */
@media (max-width:459px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-k{--riss:63%}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-zaehler{gap:6px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-zaehler .t288-k{inline-size:30px;block-size:30px;font-size:18px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-zaehler .t288-n{font-size:22px;min-inline-size:16px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-k .t290-name{font-size:12px;letter-spacing:.06em;hyphens:manual;overflow-wrap:normal;word-break:normal}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-k .kino279-preis{font-size:28px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-pz{gap:8px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-pz .t290-gratis{gap:3px;font-size:12px;margin-inline-end:0}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-pz .t290-gic{display:grid;inline-size:18px;block-size:18px;background:none;color:#E9E1D7}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-pz .t290-gic .ic{inline-size:15px;block-size:15px}
}
@media (max-width:359px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-k{--riss:60%}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-zaehler{gap:4px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-zaehler .t288-k{inline-size:28px;block-size:28px;font-size:17px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-zaehler .t288-n{font-size:20px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-k .t290-name{font-size:11px;letter-spacing:.05em}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-k .kino279-preis{font-size:25px}
}
/* ===== Ende BAUPLAN 314 ===== */
/* ===== BAUPLAN 315: Symbol-Leiste wie im Team (< 1000 px), Kopf geht beim Runterscrollen weg; Kuppel/Herz oben am Handy kleiner;
   Kanal-Symbole immer in einer Reihe ===== */
#reiter315{display:none}
@media (max-width:999px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #reiter315{display:block;position:sticky;inset-block-start:var(--top315,0px);z-index:29;background:transparent;
    border-block-end:1px solid transparent;transition:inset-block-start .25s ease,background-color .2s,border-color .2s}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #reiter315.klebt315{background:rgba(34,27,20,.86);border-block-end-color:rgba(234,225,216,.12);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .reiter315-in{padding-block:10px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .leiste315{display:flex;align-items:center;gap:10px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .leiste315 > ul{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:4px;margin:0;padding:4px;list-style:none;border-radius:24px;
    background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(234,225,216,.18)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .leiste315 > ul:not(.cta315){flex:1 1 auto;min-inline-size:0}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .leiste315 > ul.cta315{flex:none;display:flex}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) a.k315{position:relative;display:flex;align-items:center;justify-content:center;gap:7px;inline-size:100%;min-block-size:46px;padding:8px 10px;
    border-radius:20px;color:var(--ink);font-size:15px;font-weight:500;white-space:nowrap;text-decoration:none;-webkit-tap-highlight-color:transparent}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) a.k315 .ic{inline-size:22px;block-size:22px;flex:none}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .leiste315.ikon315 a.k315{padding:8px 2px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .leiste315.ikon315 a.k315 > span{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) a.k315[aria-current="true"]{background:#F5EFE7;color:#19120B}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) a.cta315-k{min-inline-size:52px;padding-inline:14px;background:#E6AA63;color:#19120B}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .leiste315.ikon315 a.cta315-k{padding-inline:14px}
  @media (hover:hover){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) a.k315:not([aria-current="true"]):not(.cta315-k):hover{background:rgba(255,255,255,.075)} :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) a.cta315-k:hover{background:#D59E5D} }
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) a.k315:focus-visible{outline:2px solid #E9B372;outline-offset:2px}
  /* Kopf geht beim Runterscrollen weg, kommt beim Hochscrollen zuerst zurück */
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #leiste{transition:transform .25s ease}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #leiste.weg315{transform:translateY(-100%)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) :is(#leiste,#reiter315).ohne315{transition:none!important}
}
@media (prefers-reduced-motion:reduce){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) :is(#leiste,#reiter315){transition:none!important} }
/* Kuppel/Herz oben am Handy etwas kleiner (Nutzer) */
@media (max-width:420px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .h269 .held265-kuppel{inline-size:104px} }
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .h269 .held265-kuppel{inline-size:92px} }
/* Kanal-Symbole (Folge uns) immer in einer Reihe – werden bei wenig Platz gleichmäßig kleiner (Nutzer) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rund265-reihe{flex-wrap:nowrap;gap:clamp(6px,2.4vw,12px)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .rund265-reihe > .rund265{flex:0 1 52px;min-inline-size:0;inline-size:auto;block-size:auto;aspect-ratio:1}
/* Burger-Menü am Handy: Hintergrund dunkel + unscharf, auch über dem Kopf; der Burger (✕) bleibt sichtbar und antippbar */
#schleier315{display:none}
@media (max-width:999px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.menue315-an #schleier315{display:block;position:fixed;inset:0;z-index:40;background:rgba(13,7,3,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:ein315 .18s ease-out}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.menue315-an #leiste{z-index:41}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.menue315-an #leiste .kopfschleier315{display:block;position:absolute;inset:0;z-index:5;background:rgba(13,7,3,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:none}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.menue315-an #leiste .burger265{position:relative;z-index:6}
}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #leiste .kopfschleier315{display:none}
@keyframes ein315{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.menue315-an #schleier315{animation:none} }
/* Ticket-Blatt: Zähler mit festem Platz für zwei Ziffern, Rabatt mit festem Platz – nichts verschiebt sich bei 10 oder „−110 €“ (Nutzer);
   Plus/Minus etwas kleiner und mit mehr Abstand */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-zaehler .t288-n{min-inline-size:2.2ch;text-align:center;font-variant-numeric:tabular-nums}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-pz .t290-gratis{font-variant-numeric:tabular-nums;min-inline-size:6.2ch;justify-content:flex-end}
@media (max-width:459px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-zaehler{gap:8px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-zaehler .t288-k{inline-size:28px;block-size:28px;font-size:17px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-zaehler .t288-n{font-size:21px}
}
@media (max-width:359px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-zaehler{gap:5px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-zaehler .t288-k{inline-size:26px;block-size:26px;font-size:16px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t290-zaehler .t288-n{font-size:19px}
}
/* Überschriften am Handy: einzeilige Wörter in einem zweizeiligen Kasten sitzen unten (direkt über der Box), nicht schwebend in der Mitte */
@media (max-width:699px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .kat275-titel[data-z313="2"] .goo285-wort{align-items:flex-end}
}
/* Kopf-Knöpfe am Handy größer (Ton · Sprache · Menü) mit mehr Abstand (Nutzer) */
@media (max-width:999px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #leiste .leiste-in{column-gap:10px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #root #leiste :is(.icon-knopf,.sprach-knopf){inline-size:46px;block-size:46px;min-inline-size:46px;min-block-size:46px;padding:0;flex:none}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #root #leiste :is(.icon-knopf,.sprach-knopf) .ic{inline-size:24px;block-size:24px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #root #leiste .sprach-knopf .sprache-kurz{font-size:17px}
}
@media (max-width:339px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #leiste .leiste-in{column-gap:7px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #root #leiste :is(.icon-knopf,.sprach-knopf){inline-size:42px;block-size:42px;min-inline-size:42px;min-block-size:42px}
}
/* Programm-Zeilen am Handy etwas größer (Nutzer) */
@media (max-width:599px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .prog271 li{font-size:18px;line-height:1.25} }
@media (max-width:359px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .prog271 li{font-size:16px} }
/* offenes Menü am Handy: Tickets-Leiste unten ausblenden */
@media (max-width:999px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.menue315-an .cta269{visibility:hidden} }
/* Menü am Handy: Schrift größer (Nutzer) */
@media (max-width:999px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #menue265 .m265-link{font-size:20px;min-block-size:52px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #menue265 :is(.m265-zeile,.m265-wort){font-size:19px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #menue265 .m265-rechts{font-size:17px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #menue265 .m265-wert{font-size:19px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #menue265 .m265-klein .textlink{font-size:16px}
}
/* ===== Ende BAUPLAN 315 ===== */
/* ===== BAUPLAN 316: Vorlader überall nur die Kuppel (ohne Schriftzug) und in der Seitenfarbe – Linie und Glut aus --dome, das der Stimmung folgt
   (Nutzer-Regel 14.10.: „der Preloader muss immer dynamisch farblich richtig sein … ohne Text, nur das Icon … überall“); Info-Boxen am Handy größer ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) :is(#vorlader,.blatt-lader) .vl-name{display:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) :is(#vorlader,.blatt-lader) polygon{stroke:color-mix(in srgb,var(--dome) 60%,transparent);
  --hitze:color-mix(in oklab,color-mix(in oklab,var(--dome),#FFFFFF 30%),color-mix(in oklab,var(--dome) 35%,#E6AA63) calc(var(--h,.5) * 100%));
  --glut-spitze:color-mix(in srgb,var(--hitze) calc((.16 + var(--h,.5) * .7) * 100%),transparent);
  --glut-rest:color-mix(in srgb,var(--hitze) calc((.1 + var(--h,.5) * .42) * 100%),transparent)}
/* Info-Boxen am Handy (volle Breite): Texte größer (Nutzer) */
@media (max-width:599px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .b271 .b271-gross{font-size:28px;line-height:1.15}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .b271 .b271-klein{font-size:17px}
}
@media (max-width:339px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .b271 .b271-gross{font-size:25px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .b271 .b271-klein{font-size:16px}
}
/* Zug-Symbol in der Wegskizze */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .karte300 .k300-bhf .k316-zug{fill:none;stroke:#FFFFFF;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}
/* ===== Ende BAUPLAN 316 ===== */
/* ===== BAUPLAN 317: kein Spalt zwischen Kopf und Symbol-Leiste (Nutzer) – die Leiste klebt 1 px unter der Kopf-Unterkante (Kopfhöhe ist gerundet,
   der Kopf liegt darüber); ist der Kopf weg, bleibt sie bei 0 ===== */
@media (max-width:999px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #reiter315{inset-block-start:max(0px,calc(var(--top315,0px) - 1px))} }
/* ===== Ende BAUPLAN 317 ===== */
/* ===== BAUPLAN 318: Hinweis über „Zur Kasse“ ===== */
#blatt .t318-hinweis{margin:0;padding:10px 14px;border-radius:14px;font-size:15px;font-weight:600;line-height:1.4;color:#E9B372;background:rgba(201,148,83,.10)}
#blatt .t318-hinweis.rot318{color:#E5DDD3;background:rgba(186,136,73,.18)}
/* ===== Ende BAUPLAN 318 ===== */
/* ===== BAUPLAN 319: Ticket-Blatt passt immer (Zähler-Stufen, Karten nie breiter als das Blatt, Kasse mittig, kein Sprung) ===== */
#blatt .t288 .t290-liste{grid-template-columns:minmax(0,1fr)}
#blatt .t288 .t290-liste > li,#blatt .t288 .t290-k > div,#blatt .t288 .t290-pz{min-inline-size:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288 .t288-kasse{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);max-inline-size:100%;min-inline-size:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288 .t288-kasse :is(.t290-summe,.t290-anz b){font-variant-numeric:tabular-nums}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288 .t288-kasse.ohnevoll319 .t290-voll{display:none}
/* „Zur Kasse“ verschwindet ohne Auswahl, behält aber seinen Platz – sonst springt der Inhalt, wenn das letzte Ticket weg ist */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288-kasse:disabled{display:grid;visibility:hidden;pointer-events:none}
/* Zähler-Stufen (JS misst: passt er nicht in den Abriss, eine Stufe kleiner) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288.eng319 .t290-zaehler{gap:4px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288.eng319 .t290-zaehler .t288-k{inline-size:26px;block-size:26px;font-size:16px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288.eng319 .t290-zaehler .t288-n{font-size:19px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288.enger319 .t290-ab{padding-inline:4px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288.enger319 .t290-zaehler{gap:2px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288.enger319 .t290-zaehler .t288-k{inline-size:24px;block-size:24px;font-size:15px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .t288.enger319 .t290-zaehler .t288-n{font-size:17px;min-inline-size:1.9ch}
/* ===== Ende BAUPLAN 319 ===== */
/* ===== BAUPLAN 320: offenes Menü am Handy – Seite dahinter fest, Kopf-Knöpfe gesperrt; Menü-Zeilen einzeilig, dichter bei wenig Höhe ===== */
/* wie beim offenen Blatt (body.blatt-offen): body sperrt – html selbst nicht, sonst klebt der Kopf nicht mehr (Sticky braucht den Viewport-Scroller) */
html.menue320{overscroll-behavior:none}
html.menue320 body{overflow:hidden}
html.menue320 :is(#schleier315,#leiste .kopfschleier315){touch-action:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.menue315-an #leiste .kopfschleier315{pointer-events:auto}
.menue265 :is(.m265-wort,.m265-rechts){white-space:nowrap;min-inline-size:0}
.menue265 .m265-rechts{flex:none}
.menue265.dicht320 :is(.m265-reihe,.m265-zeile){min-block-size:42px;padding-block:3px}
.menue265.dicht320 .m265-klein{gap:2px 12px;padding-block:6px 2px;margin-block-start:4px}
.menue265.dicht320 .m265-klein .textlink{min-block-size:32px;padding-block:4px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #menue265.dicht320 .m265-link{min-block-size:44px;padding-block:4px}
#menue265.dicht320 .m265-nav{padding-block-end:4px;margin-block-end:4px}
#menue265.dicht320 .m265-klein.umbruch268{gap:0 14px}
#menue265.dicht320 .m265-klein.umbruch268 .textlink{font-size:13px !important}
/* ===== Ende BAUPLAN 320 ===== */
/* ===== BAUPLAN 321: Mitmachen-Karte nie breiter als die Box, Titel/Abstand wie die Programm-Karten; Anfahrt-Knöpfe am Handy gleich breit ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .mit311-unten{grid-template-columns:minmax(0,1fr)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .mit311-knoepfe a.k265{max-inline-size:100%;min-inline-size:0}
@media (max-width:419px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .mit311-name{font-size:25px;margin-block-start:16px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 #anfahrt265 .karte265-knoepfe .k265{flex:1 1 100%}
}
/* Öffnungszeiten-Kästchen: Text bekommt nur die Breite des Kästchens (sonst wuchs die Spalte mit der Uhrzeit) – JS verkleinert, wenn nötig */
.m269 .mini271 .b271-text{grid-template-columns:minmax(0,1fr)}
.m269 .mini271 .mini271-gross{min-inline-size:0}
/* ===== Ende BAUPLAN 321 ===== */
/* ===== BAUPLAN 323: ausgebuchte Workshop-Zeitfenster in der Programm-Box durchgestrichen, „Ausverkauft“ als eigener Chip ===== */
.chip269.voll323{text-decoration:line-through;opacity:.55}
.chip269.aus323{text-transform:uppercase;letter-spacing:.06em;font-weight:600}
/* ===== Ende BAUPLAN 323 ===== */
/* ===== BAUPLAN 324: Wegskizze – Calma-Kuppel als Ziel (pulsiert), ://about blank klein ===== */
.karte324 .k324-calma .k324-grund{fill:#E6AA63}
.karte324 .k324-calma .k324-kuppel{fill:none;stroke:#19120B;stroke-width:1.1;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.karte324 .k324-ab > circle{fill:#E6AA63;opacity:.9}
.karte324 .k324-label-ab{font-size:10px;font-weight:600}
.karte324 .k324-label{font-size:12.5px;font-weight:700}
/* ===== Ende BAUPLAN 324 ===== */
/* ===== BAUPLAN 325: Cookie-Hinweis unten – dunkle Karte im Stil der Seite, über „Tickets kaufen“ (Handy), unter Blättern und Menü ===== */
.hinweis325{position:fixed;z-index:39;inset-inline:12px;inset-block-end:calc(12px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:14px;
  padding:14px 14px 14px 18px;border-radius:20px;background:rgba(25,18,10,.985);border:1px solid rgba(217,162,97,.28);color:#F8F2EB;
  box-shadow:0 10px 30px rgba(0,0,0,.35);opacity:0;transform:translateY(12px);transition:opacity .25s ease,transform .25s ease;pointer-events:none}
.hinweis325.da{opacity:1;transform:none;pointer-events:auto}
.hinweis325-text{margin:0;flex:1 1 auto;min-inline-size:0;font-size:15px;line-height:1.45;text-wrap:pretty}
.hinweis325-ds{display:inline;padding:0;font:inherit;color:#E9B372;text-decoration:underline;text-underline-offset:3px;background:none;border:0;cursor:pointer}
:root:not(#_):not(#_) .hinweis325 .hinweis325-ok{flex:0 0 auto;inline-size:auto;min-inline-size:72px;min-block-size:46px;padding:0 20px;font-size:16px}
/* Handy: über der klebenden „Tickets kaufen“-Leiste */
:root:has(.cta269.an) .hinweis325{inset-block-end:calc(12px + 54px + 10px + env(safe-area-inset-bottom))}
@media (min-width:700px){ .hinweis325{inset-inline:auto auto;inset-inline-start:20px;inset-block-end:20px;max-inline-size:460px} }
@media (prefers-reduced-motion:reduce){ .hinweis325{transition:none} }
@media print{ .hinweis325{display:none} }
/* ===== Ende BAUPLAN 325 ===== */
/* ===== BAUPLAN 329: Willkommens-Fenster in der Mitte, Seite abgedunkelt; Abriss-Text der Kinokarten am Rechner größer ===== */
.hinweis329{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:16px;opacity:0;transition:opacity .28s ease;touch-action:none;overscroll-behavior:contain}
.hinweis329.da{opacity:1}
.hinweis329-grund{position:absolute;inset:0;background:rgba(13,7,3,.64);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);cursor:pointer}
.hinweis329-karte{position:relative;inline-size:min(440px,100%);max-block-size:calc(100dvh - 32px);overflow:auto;padding:28px 24px 22px;border-radius:28px;
  background:rgba(26,19,12,.985);border:1px solid rgba(217,162,97,.3);color:#F8F2EB;box-shadow:0 22px 60px rgba(0,0,0,.5);text-align:center;
  transform:translateY(12px) scale(.98);transition:transform .28s ease}
.hinweis329.da .hinweis329-karte{transform:none}
.hinweis329-logo{display:block;inline-size:76px;block-size:auto;margin:0 auto 14px}
.hinweis329-logo path{fill:none;stroke:#E9B372;stroke-width:.8;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.hinweis329-titel{margin:0 0 14px;font-size:28px;line-height:1.15;font-weight:500;text-wrap:balance}
.hinweis329-tags{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 0 18px}
.hinweis329-tag{display:inline-flex;align-items:center;padding:6px 13px;border-radius:999px;background:rgba(201,148,83,.18);color:#E9E1D7;font-size:15px;font-weight:500;white-space:nowrap}
.hinweis329-text{margin:0 0 20px;font-size:15px;line-height:1.5;color:rgba(243,236,229,.82);text-wrap:pretty}
:root:not(#_):not(#_):not(#_) .hinweis329 .hinweis329-ds{display:inline;min-block-size:0;min-inline-size:0;padding:0;margin:0;font:inherit;line-height:inherit;vertical-align:baseline;color:#E9B372;text-decoration:underline;text-underline-offset:3px;background:none;border:0;cursor:pointer}
:root:not(#_):not(#_) .hinweis329 .hinweis329-ok{inline-size:100%;min-block-size:54px;font-size:18px}
body.hinweis329-an{overflow:hidden}
@media (max-width:359px){ .hinweis329-karte{padding:22px 18px 18px} .hinweis329-titel{font-size:24px} .hinweis329-tag{font-size:14px;padding:5px 11px} }
@media (prefers-reduced-motion:reduce){ .hinweis329,.hinweis329-karte{transition:none} }
@media print{ .hinweis329{display:none} }
/* Kinokarten am Rechner: „Jetzt Tickets kaufen“ im Abriss größer (Nutzer: „bei dieser Auflösung ein bisschen klein“) – startPassen321 verkleinert bei Bedarf */
@media (min-width:700px){ :root:not(#_):not(#_):not(#_):not(#_) .kinos279 .cta285{font-size:clamp(20px, 1.55vw, 26px);line-height:1.15} }
/* ===== Ende BAUPLAN 329 ===== */
/* ===== BAUPLAN 330: Titel im Willkommens-Fenster zweizeilig ===== */
.hinweis329-titel.h330{display:grid;gap:4px;margin-block-end:16px}
.h330-klein{font-size:17px;font-weight:500;letter-spacing:.02em;color:#E6B47B}
.h330-name{font-size:clamp(24px, 7.6vw, 32px);line-height:1.1;font-weight:500;text-wrap:balance}
/* Abriss „Jetzt Tickets kaufen“ am Rechner: 26 px war zu groß (Nutzer) – feste 20 px (Einpassung verkleinert nur, wenn nötig) */
@media (min-width:700px){ :root:not(#_):not(#_):not(#_):not(#_) .kinos279 .cta285{font-size:20px} }
/* ===== Ende BAUPLAN 330 ===== */
/* ===== BAUPLAN 337: Die Saunen – wie das Programm (keine äußere Box, je Sauna eine Box im Glas), oben das Mesh-Symbol in der Seitenfarbe
   (feine Linien aus 334, keine Hitze, kein Glow), darunter Name, kleine Pille (Aufgüsse / ohne / Chillen) und Text. Am Rechner 2 × 2. ===== */
.sa337-box{display:block}
@media (min-width:760px){
  :root:not(#_):not(#_):not(#_) .sa337-liste{grid-template-columns:repeat(2,minmax(0,1fr))}
  :root:not(#_):not(#_):not(#_) .sa337-liste > .pb275:last-child{grid-column:auto}
}
.sa337-sym{display:block;line-height:0;color:var(--dome);margin-block-end:6px}
:root.warm270 .sa337-sym{color:#E9B372}
.sa337-sym .sym334{inline-size:96px}
:root:not(#_):not(#_) .sa337-tag{justify-self:start;max-inline-size:100%;white-space:normal;line-height:1.25;padding-block:6px}
.sa337-name{overflow-wrap:anywhere}
@media (max-width:359px){ .sa337-sym .sym334{inline-size:84px} }
/* ===== Ende BAUPLAN 337 ===== */
/* ===== BAUPLAN 338: Aufgussplan eines Sauna-Events – Zwischenüberschriften je Sauna, Reiter „Läuft gerade / Als Nächstes“ je Sauna, Sauna-Pille,
   Saunen + Anfahrt unten, großer Knopf „Aufgussplan“ auf der Startseite ===== */
/* Gruppen je Sauna in der Tages-Box: Symbol + Name, dann die Boxen */
.sauna-gruppe338{display:grid;gap:0;margin-block-start:18px}
.sauna-gruppe338 + .sauna-gruppe338{margin-block-start:26px}
.sauna-kopf338{display:flex;align-items:center;gap:12px;margin:0 4px;font-size:20px;font-weight:600;line-height:1.25;color:var(--ink)}
.sauna-kopf338 .sym334{inline-size:48px;color:var(--dome)}
:root:not(#_):not(#_) .sauna-gruppe338 > .boxen{display:grid;gap:12px;margin:12px 0 0;padding:0;list-style:none}
@media (min-width:1000px){ .sauna-kopf338{font-size:21px} .tag-spalte.frei .sauna-gruppe338:first-of-type{margin-block-start:14px} }
/* Kopf der Plan-Seite am Handy: „Teilen“ steht im Burger-Menü (Platz für die Uhr) */
@media (max-width:999px){ :root:not(#_):not(#_) #leiste .plan338-kopf > [data-tu="teilen"]{display:none} }
/* breit: so viele Spalten wie Tage (inline), keine leeren Zeilen */
@media (min-width:1000px){ :root:not(#_):not(#_) .raster338{grid-template-rows:auto auto 1fr} }
/* h5 (Ebene unter Tag und Sauna) – ohne den Standard-Abstand des Browsers (wie .rueck168) */
:root:not(#_):not(#_) .sauna-gruppe338 .box h5.name{margin-block-end:0}
/* über den großen Boxen oben: Symbol + Saunaname */
.sa338-jk{display:flex;align-items:center;gap:10px;margin:0 4px 10px;font-size:19px;font-weight:600;line-height:1.25;color:var(--ink)}
.sa338-jk .sym334{inline-size:42px;color:var(--dome)}
/* Pille im Detail-Blatt – der Name bleibt, wie er ist (Eigenname, nicht in Großbuchstaben) */
:root:not(#_):not(#_) .sa338-pille{gap:7px;text-transform:none;letter-spacing:normal}
.sa338-pille .sym334{inline-size:1.75em;color:currentColor}
/* unten: Saunen + Anfahrt */
.calma338 .sa337-liste{margin-block-start:20px}
.calma338 .pb275-name{font-size:24px}
:root:not(#_):not(#_):not(#_) .calma338 .sa337-tag{background:rgba(var(--glas-ton),.14);color:var(--ink)}
.calma338-unten{display:grid;gap:18px;margin-block-start:22px;align-items:start}
.calma338-start{margin:0}
@media (min-width:760px){ .calma338-unten{grid-template-columns:minmax(0,1fr) auto;align-items:end} }
/* Startseite: großer Knopf „Aufgussplan“ – volle Breite gleich unter Countdown/Status (vor den Info-Boxen), im Glas mit rosa Rand */
.plan338{display:flex;align-items:center;gap:16px;inline-size:100%;max-inline-size:1100px;margin:22px auto 0;padding:16px 22px 16px 16px;border-radius:28px;
  text-decoration:none;color:var(--ink);background:rgba(201,148,83,.16);border:1.5px solid rgba(217,162,97,.55);box-sizing:border-box}
@media (hover:hover){ .plan338:hover{background:rgba(201,148,83,.24)} }
.plan338:focus-visible{outline:2px solid #E9B372;outline-offset:3px}
:root:not(#_):not(#_):not(#_) .plan338-ic{flex:none;inline-size:52px;block-size:52px;display:grid;place-items:center;border-radius:50%}
.plan338-ic .ic{inline-size:26px;block-size:26px}
.plan338-text{display:grid;gap:2px;flex:1 1 auto;min-inline-size:0;text-align:start}
.plan338-titel{font-size:26px;font-weight:500;line-height:1.15;overflow-wrap:anywhere}
.plan338-unter{font-size:15px;color:var(--ink-2);line-height:1.3}
.plan338-pfeil{flex:none;display:grid;place-items:center}
.plan338-pfeil .ic{inline-size:24px;block-size:24px}
@media (max-width:419px){ .plan338{gap:12px;padding:12px 16px 12px 12px;border-radius:24px} :root:not(#_):not(#_):not(#_) .plan338-ic{inline-size:44px;block-size:44px}
  .plan338-titel{font-size:22px} .plan338-unter{font-size:14px} }
/* ===== Ende BAUPLAN 338 ===== */
/* ===== BAUPLAN 339: /live und Aushang je Sauna – nur bei Events mit Saunen (Klassen .sauna339/.zwei339/.papier339 kommen nur dort vor) =====
   /live: Symbol + Name rechts in der Pillen-Zeile der großen Kachel (statt Kuppel-Stück), zwei große Kacheln nebeneinander (TV) bzw.
   untereinander (hochkant), Symbol + Name im Laufband. Aushang: Zwischenüberschrift je Sauna (schwarz auf weiß, feine Linien). */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box.sauna339 > .stueck{display:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box.sauna339 > :is(.box-status,.box-kopf){padding-inline-end:0}
/* rechts in der Pillen-Zeile; ist sie zu schmal (lange Pillen-Wörter, hochkant), rutscht die Marke rechts in eine eigene Zeile */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box-status > .sa339-marke{margin-inline-start:auto;display:inline-flex;align-items:center;gap:18px;flex:none;
  max-inline-size:100%;min-inline-size:0;font-size:36px;line-height:1.15;font-weight:500;white-space:nowrap}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .box-status > .sa339-marke .sym334{inline-size:2.5em}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .sa339-name{min-inline-size:0;overflow:hidden;text-overflow:ellipsis}
/* zwei große Kacheln: TV nebeneinander, etwas kleiner gesetzt */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .jetzt-reihe.zwei339{grid-template-columns:repeat(var(--n339,2),minmax(0,1fr));grid-template-rows:minmax(0,1fr);gap:36px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .jetzt-reihe.zwei339 > .jetzt-spalte{display:flex;min-block-size:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .zwei339 .box{padding:28px 36px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .zwei339 .box .name{font-size:70px;line-height:1.12}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .zwei339 .box .zeit{font-size:46px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .zwei339 .box .wer{font-size:34px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .zwei339 .box .box-status{margin-block-end:14px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .zwei339 .box .box-status .pille{font-size:22px;padding:11px 18px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .zwei339 .box-status > .sa339-marke{font-size:30px;gap:14px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .zwei339 .box .text{margin-block-start:16px;font-size:30px;line-height:1.45}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .zwei339 .box.weiter163 > .mehr-hinweis{font-size:26px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .zwei339 .box .zutaten{max-block-size:calc(2 * 58px + 10px);gap:10px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .zwei339 .box .zutaten li{block-size:58px;min-block-size:58px;padding:4px 22px 4px 4px;font-size:25px;gap:12px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-mitte .zwei339 .box .zutaten li > :is(img,.zutat-bild,.zutat-kreis){inline-size:50px;block-size:50px}
/* hochkant (Bühne 480): Symbol kleiner; zwei Kacheln untereinander, Größen wie BAUPLAN 139 */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box-status > .sa339-marke{font-size:17px;gap:7px}
/* hochkant ist die Bühne immer 480 breit – „Zeit │ Flammen“ passt dort in eine Zeile (zeitZeileEinpassen misst bei vergrößerter Bühne
   zu breit und setzt sonst zz-flammen); der Tag (zz-tag) darf weiter eine eigene Zeile bekommen */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box.sauna339 .zeit.zz-flammen > .zi-strich{flex-basis:auto;block-size:.84em;margin-block:-.1em 0;margin-inline:.48em .3em;opacity:.5}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .box.sauna339 .zeit.zz-flammen > .zeit-int{margin-block-start:-.3em}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .jetzt-reihe.zwei339{grid-template-columns:minmax(0,1fr);grid-template-rows:repeat(var(--n339,2),minmax(0,1fr));gap:10px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339 .box{padding:12px 16px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339 .box .name{font-size:31px;line-height:1.1}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339 .box .zeit{font-size:22px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339 .box .wer{font-size:18px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339 .box .box-status{margin-block-end:6px;row-gap:4px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339 .box .box-status .pille{font-size:12px;padding:6px 10px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339 .box-status > .sa339-marke{font-size:15px;gap:6px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339 .box .text{margin-block-start:6px;font-size:17px;line-height:1.45;-webkit-line-clamp:3;line-clamp:3}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339 .box.weiter163 > .mehr-hinweis{font-size:17px;margin-block-start:4px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339 .box .zutaten{max-block-size:calc(2 * 34px + 6px);gap:6px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339 .box .zutaten li{block-size:34px;min-block-size:34px;padding:2px 12px 2px 2px;font-size:15px;gap:7px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339 .box .zutaten li > :is(img,.zutat-bild,.zutat-kreis){inline-size:30px;block-size:30px}
/* Laufband: Symbol + Name rechts in der oberen Zeile (passt der Name nicht ganz, bleibt nur das Symbol – .ohne339, oeffentlich.js) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .bk-oben:has(> .bk-sauna339){min-inline-size:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .bk-oben > .bk-sauna339{margin-inline-start:auto;display:inline-flex;align-items:center;gap:10px;min-inline-size:0;
  font-size:22px;font-weight:500;color:var(--ink-2,#D7C6B5)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .bk-oben > .bk-sauna339 .sym334{inline-size:2.2em}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .bk-oben > .bk-sauna339.ohne339 .sa339-name{display:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .bk-oben > .bk-sauna339{font-size:15px;gap:6px}
/* Aushang: Zwischenüberschrift je Sauna (Symbol in feinen schwarzen Linien) */
.papier339 .a-sauna339{display:flex;align-items:center;gap:2.4mm;min-inline-size:0;margin:0;padding:1.6mm 1mm .2mm;font-size:11.5pt;line-height:1.15;font-weight:600;color:#000}
.papier339 .a-sauna339 > span{min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.papier339 .a-sauna339.leer339{visibility:hidden}
:root:not(#_) .papier339 .a-sauna339 .sym334{inline-size:10mm;color:#000}
:root:not(#_) .papier339 .a-sauna339 .sym334 .f{stroke:#000;stroke-width:.8px}
.papier339.einer .a-sauna339{font-size:15pt;gap:3mm;padding-block-start:2mm}
:root:not(#_) .papier339.einer .a-sauna339 .sym334{inline-size:14mm}
.papier339.eng .a-sauna339{font-size:10.5pt;padding-block-start:1.2mm}
/* Kästen wachsen mit ihrem Inhalt (Name bis 2 Zeilen, Düfte 1 Zeile): Name und Düfte haben overflow:hidden – ohne Mindesthöhe zählen sie
   bei der Zeilenhöhe als 0 und wurden abgeschnitten; wird das Blatt zu voll, setzt papierPruefen es dichter (.dicht, .eng) */
.papier339 :is(.a-name,.a-duft){min-block-size:min-content}
/* quer339: zwei breite Spalten – Zeit und Dauer links, Name, „mit …“ und Düfte rechts (wie ein Tag groß, nur kleiner) */
.papier339.quer339:not(.einer) .a-box{grid-template-columns:24mm minmax(0,1fr);grid-template-rows:auto auto auto;grid-template-areas:"zeit name" "status wer" "status duft";
  column-gap:2.6mm;align-content:center;padding:1.5mm 2.6mm 1.3mm}
.papier339.quer339:not(.einer) .a-zeit{align-self:start;padding-block-start:.5mm}
.papier339.quer339:not(.einer) .a-status{align-self:start;margin:.8mm 0 0;min-block-size:0}
.papier339.quer339:not(.einer) .a-name{margin:0}
.papier339.quer339:not(.einer) .a-wer{align-self:start;padding-block-start:.3mm}
.papier339.knapp339 .a-duft{display:none}
/* ein Tag, Saunen nebeneinander: Tag oben über die ganze Breite, je Sauna eine Spalte (Zeilen per Subgrid auf einer Höhe) */
.papier339.saeulen339 .a-tag339{grid-column:1 / -1;grid-row:1;display:flex;flex-wrap:wrap;align-items:baseline;column-gap:2.5mm;padding-inline:1mm;
  font-size:20pt;line-height:1.1;font-weight:500}
.papier339.saeulen339 .a-tag339 .a-datum{font-size:12pt}
.papier339.saeulen339 .a-saeule339{grid-row:2 / -1}
.papier339.saeulen339 .a-saeule339 > .a-sauna339{grid-row:1}
/* je Tag ein Blatt: am Bildschirm mit Abstand, gedruckt jedes auf eine eigene Seite */
@media screen{ .papier339 + .papier339{margin-block-start:22px} }
@media print{ .papier339:not(:last-child){break-after:page} .papier339{break-inside:avoid} }
/* klein339: ein Tag groß, aber viele Termine – eine Stufe kleiner (wie die Kästen bei zwei Tagen, nur breiter) */
.papier339.einer.klein339 .a-box{grid-template-columns:30mm minmax(0,1fr);column-gap:4mm;padding:1.5mm 3.2mm}
.papier339.einer.klein339 .a-zeit{font-size:12pt}
.papier339.einer.klein339 .a-name{font-size:13pt}
.papier339.einer.klein339 :is(.a-wer,.a-duft){font-size:8.5pt}
.papier339.einer.klein339 .a-pille{font-size:7pt;padding:.4mm 2mm}
.papier339.einer.klein339 .a-tag > h2{font-size:18pt}
.papier339.einer.klein339 .a-sauna339{font-size:12pt;padding-block-start:1.4mm}
:root:not(#_) .papier339.einer.klein339 .a-sauna339 .sym334{inline-size:11mm}
:root:not(#_) .papier339.einer.klein339 .a-wer .int-flamme{inline-size:3.4mm;block-size:3.4mm}
/* ===== Ende BAUPLAN 339 ===== */
/* ===== BAUPLAN 340: schwaches Gerät (Stufe ≥ 2) – Wechsel-Überschriften und Countdown nur überblenden (ohne Schmelz-Filter) ===== */
html.spar340 :is(.goo285, .cdz291, .cdz293, .zz293){filter:none!important}
/* ===== Ende BAUPLAN 340 ===== */
/* ===== BAUPLAN 343: Willkommens-Fenster blendet weich ein (Nutzer 15.10.: „der Blur im Hintergrund ist abrupt … sieht buggy aus“). Vorher wurde das
   ganze Fenster über opacity eingeblendet – solange ein Vorfahre opacity < 1 hat, rechnet der Browser backdrop-filter nicht (Backdrop-Root), die
   Unschärfe sprang am Ende auf einmal an. Jetzt bleibt das Fenster deckend; Abdunkeln + Unschärfe laufen von 0 auf voll, die Karte kommt kurz danach.
   Schließen in 0,24 s (das Fenster wird nach 260 ms entfernt). ===== */
:root:not(#_):not(#_) .hinweis329{opacity:1;transition:none}
:root:not(#_):not(#_) .hinweis329-grund{background-color:rgba(13,7,3,0);-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px);
  transition:background-color .55s ease,-webkit-backdrop-filter .55s ease,backdrop-filter .55s ease}
:root:not(#_):not(#_) .hinweis329.da .hinweis329-grund{background-color:rgba(13,7,3,.64);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
:root:not(#_):not(#_) .hinweis329-karte{opacity:0;transition:opacity .38s ease .16s,transform .38s ease .16s}
:root:not(#_):not(#_) .hinweis329.da .hinweis329-karte{opacity:1}
:root:not(#_):not(#_) .hinweis329:not(.da) .hinweis329-grund{transition-duration:.24s}
:root:not(#_):not(#_) .hinweis329:not(.da) .hinweis329-karte{transition:opacity .16s ease,transform .16s ease}
@media (prefers-reduced-motion:reduce){ :root:not(#_):not(#_) .hinweis329-grund, :root:not(#_):not(#_) .hinweis329-karte{transition:none} }
/* ===== Ende BAUPLAN 343 ===== */
/* ===== BAUPLAN 344: Willkommens-Fenster – oben klein „Calma Saunagarten“, darunter groß „Willkommen“; „Ausverkauft“ im Abriss mittig ===== */
.h344-ort{font-size:17px;font-weight:500;letter-spacing:.02em;color:#E6B47B}
.h344-gross{font-size:clamp(26px, 8.4vw, 36px);line-height:1.1;font-weight:500;text-wrap:balance;overflow-wrap:anywhere}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .t290-ab > .t288-aus{grid-area:auto;justify-self:center;align-self:center;text-align:center;white-space:nowrap;
  max-inline-size:100%;overflow-wrap:normal}
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .chip269.voll344{text-decoration:none;opacity:1;gap:0;white-space:nowrap;max-inline-size:100%}
.voll344-strich{align-self:stretch;inline-size:1px;margin:-7px 11px;background:currentColor;opacity:.32;flex:none}
.voll344-aus{font-size:.8em;font-weight:600;letter-spacing:.05em;text-transform:uppercase;opacity:.82}
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .chip269.voll344.zwei344{flex-direction:column;align-items:center;gap:2px;white-space:normal;
  border-radius:18px;padding-block:6px;text-align:center}
.chip269.zwei344 .voll344-strich{display:none}
.p269-chips{min-inline-size:0;max-inline-size:100%}
/* ===== Ende BAUPLAN 344 ===== */
/* ===== BAUPLAN 348: Willkommens-Fenster liegt schon fertig unter dem Vorlader – ohne Übergang (sonst schien beim Ausblenden des Vorladers kurz die helle,
   scharfe Seite durch und dunkelte erst danach ab – Nutzer: „kurzer Aufblitzer im Hintergrund … buggy“) ===== */
:root:not(#_):not(#_):not(#_) .hinweis329.sofort348 .hinweis329-grund, :root:not(#_):not(#_):not(#_) .hinweis329.sofort348 .hinweis329-karte{transition:none}
/* ===== Ende BAUPLAN 348 ===== */
/* ===== BAUPLAN 341: Die Saunen (Karten 337, auch unter dem Plan 338) – Fass und kleine Kuppel bündig links wie Name und Text =====
   Die Symbole stehen mittig im viewBox der Kuppel (208 breit, Kuppel ±100): das Fass reicht nur bis ±65,94, die kleine Kuppel (70 %) bis ±70.
   In den linksbündigen Karten rücken sie um den leeren Rand an die Kante wie die Kuppel: (100 − 65,94) / 208 = 16,375 % und
   (100 − 70) / 208 = 14,423 % der eigenen Breite (gilt bei 96 und 84 px), RTL spiegelbildlich. Reihen (Überschriften, Pillen, /live)
   bleiben mittig, damit die Namen untereinander in einer Flucht stehen. ===== */
.sa337-sym .sym334-rolle{transform:translateX(-16.375%)}
.sa337-sym .sym334-hoch13{transform:translateX(-14.423%)}
:root[dir=rtl] .sa337-sym .sym334-rolle{transform:translateX(16.375%)}
:root[dir=rtl] .sa337-sym .sym334-hoch13{transform:translateX(14.423%)}
/* ===== Ende BAUPLAN 341 ===== */
/* ===== BAUPLAN 350: UHU Sunday im Programm, Saunen-Symbol, Menü-Punkte einzeln als Symbol ===== */
@media (min-width:760px){ .pbs275 > .pb275.breit350{grid-column:1/-1} }
.uhu350-logo{display:block;inline-size:clamp(150px,34%,210px);color:var(--ink);margin-block-end:8px}
.uhu350-svg{display:block;inline-size:100%;block-size:auto;fill:currentColor}
.uhu350-knoepfe{margin-block-start:2px}
.uhu350-fun{font-size:15px;font-weight:600;letter-spacing:.14em;color:#E9B372;margin-block-start:6px}
.ic350-kuppel .ic350-netz{stroke-width:1.35}
.reiter270 li.ic350 .reiter270-k > span:not(.reiter270-kuppel){position:absolute!important;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.reiter270 li.ic350 .reiter270-k{padding-inline:12px}
/* ===== Ende BAUPLAN 350 ===== */
/* ===== BAUPLAN 352: Logo in „Über Calma“ und auf /live ===== */
.ueber352-logo{display:block;inline-size:min(320px,72%);margin-block-end:22px;color:var(--ink)}
.ueber352-logo .logo352{inline-size:100%;block-size:auto}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-marke b:has(> .logo352){font-size:56px;line-height:1}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-marke .logo352{block-size:1.75em}
/* ===== Ende BAUPLAN 352 ===== */
/* ===== BAUPLAN 353: UHU-Schriftzug kleiner (Nutzer: „das Logo vom Uhu ist zu groß“) – etwa so hoch wie die Symbol-Kreise der anderen
   Programm-Boxen (≈ 50 px); vorher am Handy 150 px breit (≈ 69 px hoch) ===== */
:root:not(#_) .uhu350-logo{inline-size:108px;margin-block-end:6px}
@media (min-width:760px){ :root:not(#_) .uhu350-logo{inline-size:124px} }
/* ===== Ende BAUPLAN 353 ===== */
/* ===== BAUPLAN 354: Calma-Logo in „Über Calma“ kleiner (Nutzer: „das Calma-Logo ist auch zu groß“) – wie der UHU-Schriftzug (353) etwa so
   hoch wie die Symbol-Kreise der Boxen (≈ 50 px); vorher bis 320 px breit ===== */
:root:not(#_) .ueber352-logo{inline-size:150px;margin-block-end:14px}
@media (min-width:760px){ :root:not(#_) .ueber352-logo{inline-size:170px} }
/* ===== Ende BAUPLAN 354 ===== */
/* ===== BAUPLAN 355: UHU-Box mit Namens-Boxen, Programm-Leiste mit 5 Punkten, Logo auf /live ohne Schatten ===== */
.lu355{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-block:6px 2px}
@media (min-width:760px){ .lu355{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px} }
@media (max-width:519px){ .lu355{grid-template-columns:minmax(0,1fr);gap:8px} .lu355-k{gap:8px;padding:12px 14px 14px} }
.lu355-k{display:grid;align-content:start;gap:12px;min-inline-size:0;padding:14px 14px 16px;border-radius:20px;background:rgba(201,148,83,.10);box-shadow:inset 0 0 0 1px rgba(217,162,97,.18)}
.lu355-kopf{display:flex;align-items:center;gap:10px;min-inline-size:0;font-size:14px;line-height:1.3;color:var(--ink-2)}
.lu355-ic{display:grid;place-items:center;inline-size:34px;block-size:34px;border-radius:50%;background:rgba(201,148,83,.30);color:#E9E1D7;flex:none}
.lu355-ic svg{inline-size:18px;block-size:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.lu355-namen{font-size:19px;font-weight:500;line-height:1.3;letter-spacing:.02em;color:var(--ink);overflow-wrap:anywhere}
@media (max-width:419px){ .lu355-namen{font-size:17px} }
.uhu355-tipp{margin-block-start:2px}
/* Programm-Leiste oben: am Rechner 5 Spalten; in zwei Spalten steht UHU Sunday allein über die volle Breite */
@media (min-width:760px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .prog271:has(> li.prog355){grid-template-columns:repeat(5,minmax(0,1fr))} }
@media (min-width:600px) and (max-width:759px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_) .m269 .prog271 > li.prog355{grid-column:1/-1;border-inline-start:0} }
/* /live: Logo neben der Kuppel etwas kleiner als die Kuppel, ohne Schatten (wie im Kopf, 355 basis.css) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live .live-marke .logo352{block-size:58px}
/* Willkommens-Fenster: Logo statt „Willkommen“ */
:root:not(#_):not(#_) .hinweis329-titel.h355{display:block;margin:0 0 18px;font-size:0;line-height:0}
:root:not(#_):not(#_) .hinweis329-titel.h355 .logo352{display:block;margin:0 auto;inline-size:min(220px,72%);block-size:auto;color:var(--ink)}
:root:not(#_):not(#_) .hinweis329-titel.h355 .logo352-schatten{display:none}
/* ===== Ende BAUPLAN 355 ===== */
/* ===== BAUPLAN 357: Eule (UHU) mit etwas dünneren Linien (Nutzer: „mach den Uhu dünner – die Linien, etwas“) – mit Augen und Pupillen wirkte sie
   bei derselben Strichstärke dichter als Hut und Noten; jetzt so fein wie die kleinen Symbole in den Namens-Boxen (Nutzer: „die sind auch dünner“) ===== */
:root:not(#_):not(#_) .uhu355 > .p269-ic svg{stroke-width:1.2}
:root:not(#_):not(#_) .prog355 .prog271-ic svg{stroke-width:1.5}
/* ===== Ende BAUPLAN 357 ===== */
/* ===== BAUPLAN 358: drei Namens-Boxen – ab 760 px drei Spalten, darunter untereinander ===== */
@media (min-width:760px){ :root:not(#_):not(#_) .lu355{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:759px){ :root:not(#_):not(#_) .lu355{grid-template-columns:minmax(0,1fr)} }
.lu355-kopf > span:last-child{text-wrap:balance}
/* ===== Ende BAUPLAN 358 ===== */
/* ===== BAUPLAN 359: Logo im Willkommens-Fenster fast halb so groß (Nutzer: „muss kleiner, fast 2 Mal“) ===== */
:root:not(#_):not(#_):not(#_) .hinweis329-titel.h355 .logo352{inline-size:124px}
/* Logo statt Überschrift „Über Calma“, mittig */
:root:not(#_):not(#_):not(#_) .kat275-titel.ueber359{display:flex;justify-content:center;align-items:center}
:root:not(#_):not(#_):not(#_) .kat275-titel.ueber359 .logo352{display:block;inline-size:200px;block-size:auto;color:var(--ink)}
@media (max-width:599px){ :root:not(#_):not(#_):not(#_) .kat275-titel.ueber359 .logo352{inline-size:170px} }
/* ===== Ende BAUPLAN 359 ===== */
/* ===== BAUPLAN 360: Saunen-Boxen höher, mehr Luft zwischen Pille und Text, jeder Text zwei Zeilen (Nutzer 15.10.: „Boxen etwas höher, ein bisschen
   mehr Abstand zu den Fließtexten … so, dass zwei Zeilen Text haben“) – Text höchstens 24 em breit und ausgewogen umbrochen, mindestens zwei Zeilen hoch ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .sa337-liste > .pb275.sa337{padding:32px 30px 34px;gap:12px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .sa337-liste > .pb275.sa337 > .pb275-text{margin-block-start:4px;max-inline-size:24em;text-wrap:balance;min-block-size:3.1em}
@media (max-width:419px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .sa337-liste > .pb275.sa337{padding:26px 22px 28px} }
.sa360-pillen{display:flex;flex-wrap:wrap;gap:8px;margin-block-start:6px}
.sa360-pillen > .sa337-tag{margin:0}
/* Programm-Boxen: Name zweizeilig, Text darunter beginnt in allen drei Boxen auf gleicher Höhe */
#programm265 .pb275-name[data-z360]{text-wrap:nowrap}
/* ===== Ende BAUPLAN 360 ===== */
/* ===== BAUPLAN 362: Überschriften der Programm- und Saunen-Boxen ~12 % größer (30 → 34 px, Handy 25 → 28 px); SUNDAY FUNDAY rechts neben dem Link ===== */
:root:not(#_):not(#_):not(#_) :is(#programm265,#saunen265) .pb275-name{font-size:34px}
@media (max-width:419px){ :root:not(#_):not(#_):not(#_) :is(#programm265,#saunen265) .pb275-name{font-size:28px} }
.uhu362-fuss{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-block-start:2px}
.uhu362-fuss > .uhu350-knoepfe{margin:0}
:root:not(#_):not(#_) .uhu362-fuss > .uhu350-fun{margin:0 0 0 auto}
@media (max-width:519px){ :root:not(#_):not(#_) .uhu362-fuss{gap:8px} :root:not(#_):not(#_) .uhu362-fuss > .uhu350-fun{font-size:12px;letter-spacing:.045em;white-space:nowrap} }
/* Boxen wachsen nicht mit einem langen Wort mit (sonst ragten sie aus dem Raster) – das Einpassen (JS) verkleinert dann die Köpfe */
#programm265 .pbs275 > .pb275{min-inline-size:0;grid-template-columns:minmax(0,1fr)}
/* ===== Ende BAUPLAN 362 ===== */
/* ===== BAUPLAN 363: Feuer am Handy fest am unteren Rand (Nutzer: „es müsste doch unten fixed sein“) – unten verankert, so hoch wie der große Viewport
   (Adressleiste ein/aus verschiebt es nicht mehr) ===== */
#feuer277{inset:auto 0 0 0;block-size:100vh;block-size:100lvh}
/* ===== Ende BAUPLAN 363 ===== */
/* ===== BAUPLAN 365: Namens-Boxen höher, SoundCloud-Link in der Line-Up-Box ===== */
:root:not(#_):not(#_) .lu355-k{padding:20px 18px 22px;gap:14px;min-block-size:150px}
@media (max-width:759px){ :root:not(#_):not(#_) .lu355-k{min-block-size:0;padding:18px 16px 20px} }
.lu365-link{justify-self:start;align-self:end;display:inline-flex;align-items:center;gap:7px;min-block-size:36px;padding:4px 14px 4px 10px;border-radius:999px;
  font-size:14px;font-weight:500;color:var(--ink);text-decoration:none;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(217,162,97,.28);white-space:nowrap}
.lu365-link:hover{background:rgba(255,255,255,.11)}
.lu365-link .ic{inline-size:18px;block-size:18px}
.lu365-link .ic.klein{inline-size:14px;block-size:14px}
/* ===== Ende BAUPLAN 365 ===== */
/* ===== BAUPLAN 366: Team-Box im öffentlichen Plan ===== */
.team366-gruppe{display:grid;gap:12px;padding:12px;border-radius:30px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(217,162,97,.24)}
.team366-kopf{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding:4px 8px 0}
.team366-name{display:inline-flex;align-items:center;gap:10px;min-inline-size:0;font-size:18px;font-weight:500;color:var(--ink)}
.team366-name img{inline-size:34px;block-size:34px;border-radius:50%;object-fit:cover;flex:none}
.team366-boxen{margin:0}
/* in der Team-Box steht das Team schon darüber – der Chip je Kachel entfällt dort (Detail-Blatt zeigt ihn weiter) */
.team366-boxen .team260{display:none}
/* ===== Ende BAUPLAN 366 ===== */
/* ===== BAUPLAN 368: Namens-Boxen mit mehr Luft (Nutzer: „Boxen etwas höher, die Namen weiter vom oberen Bereich“); SoundCloud-Knopf mit Name ===== */
:root:not(#_):not(#_):not(#_) .lu355-k{padding:24px 20px 26px;gap:22px;min-block-size:176px;align-content:start}
@media (max-width:759px){ :root:not(#_):not(#_):not(#_) .lu355-k{min-block-size:0;padding:20px 18px 22px;gap:18px} }
:root:not(#_):not(#_) .lu365-link{white-space:normal;text-align:start;line-height:1.2}
.lu368-wer{font-weight:600;letter-spacing:.02em}
@media (max-width:419px){ :root:not(#_):not(#_) .lu365-link{font-size:13px;gap:6px;padding:4px 12px 4px 9px} }
/* breite Programm-Boxen am Rechner: Texte in zwei Spalten (Nutzer: „zwei Spalten bei den Texten, dass es nicht so lang ist“) –
   UHU: beide Absätze nebeneinander; Workshop: Beschreibung links, Buchungshinweis rechts, darunter Pillen und Plätze */
@media (min-width:900px){
  :root:not(#_):not(#_):not(#_) #programm265 .pb275.uhu355{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:36px}
  :root:not(#_):not(#_):not(#_) #programm265 .pb275.uhu355 > *{grid-column:1/-1}
  :root:not(#_):not(#_):not(#_) #programm265 .pb275.uhu355 > .pb275-text:not(.uhu355-tipp){grid-column:auto}
  :root:not(#_):not(#_):not(#_) #programm265 .pb275.breit350{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:36px}
  :root:not(#_):not(#_):not(#_) #programm265 .pb275.breit350 > *{grid-column:1/-1}
  :root:not(#_):not(#_):not(#_) #programm265 .pb275.breit350 > .pb275-text{grid-column:1;order:1}
  :root:not(#_):not(#_):not(#_) #programm265 .pb275.breit350 > .pb275-klein:last-child{grid-column:2;order:1;align-self:start}
  :root:not(#_):not(#_):not(#_) #programm265 .pb275.breit350 > .p269-chips{order:2}
  :root:not(#_):not(#_):not(#_) #programm265 .pb275.breit350 > .pb275-klein:not(:last-child){order:3}
}
/* ===== Ende BAUPLAN 368 ===== */
/* ===== BAUPLAN 371: SoundCloud-Knopf ohne Pfeil-Symbol hinten (Nutzer: „das Icon weg hinten“) ===== */
:root:not(#_):not(#_):not(#_) .lu365-link > .ic.klein{display:none}
:root:not(#_):not(#_):not(#_) .lu365-link{padding-inline-end:16px}
/* ===== Ende BAUPLAN 371 ===== */
/* ===== BAUPLAN 372: Willkommens-Fenster – mehr Luft zwischen Logo und Pillen (Nutzer) ===== */
:root:not(#_):not(#_):not(#_) .hinweis329-titel.h355{margin-block-end:30px}
/* ===== Ende BAUPLAN 372 ===== */
/* ===== BAUPLAN 373: Datum/Zeit/Preis-Boxen (UHU vier Boxen, Workshop drei Boxen), „If you don’t know“ größer ===== */
@media (min-width:1180px){ :root:not(#_):not(#_):not(#_):not(#_) .lu355.lu373{grid-template-columns:repeat(4,minmax(0,1fr))} }
@media (min-width:760px) and (max-width:1179px){ :root:not(#_):not(#_):not(#_):not(#_) .lu355.lu373{grid-template-columns:repeat(2,minmax(0,1fr))} }
.ib373-wert{font-variant-numeric:tabular-nums}
@media (min-width:760px){ :root:not(#_):not(#_):not(#_):not(#_) .lu355.ws373{grid-template-columns:repeat(3,minmax(0,1fr))} }
:root:not(#_):not(#_):not(#_):not(#_) .lu355.ws373 > .lu355-k{min-block-size:0}
:root:not(#_):not(#_):not(#_):not(#_) #programm265 .pb275.breit350 > .ws373{order:2;grid-column:1/-1;margin-block:2px}
.ws373-zeiten .lu355-namen{display:grid;gap:8px}
.ws373-slot{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px}
.ws373-slot.voll > .nw265{color:var(--ink-2)}
.ws373-aus{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#E9B372;white-space:nowrap}
:root:not(#_):not(#_):not(#_) .uhu350-wissen{font-size:17px;color:var(--ink)}
@media (max-width:419px){ :root:not(#_):not(#_):not(#_) .uhu350-wissen{font-size:16px} }
.ws373-mit{color:#E9B372}
@media (min-width:1180px){ :root:not(#_):not(#_):not(#_):not(#_) .lu373 .lu365-link{font-size:13px;white-space:nowrap;padding-inline:9px 13px;gap:6px} }
/* ===== Ende BAUPLAN 373 ===== */
/* ===== BAUPLAN 379: Kacheln in den Programm-Boxen (UHU + Workshop) – Nutzer: „Schrift größer“, „die kleinen Wörter nicht bei den Icons, sondern in der
   Box über den Heads, ganz klein“, „hier genauso“, „mehr Luft zwischen Fließtext und Kacheln“; „Ausverkauft“ als Pille; SoundCloud-Pille: Rand nicht so
   rosa, beim Überfahren pink (wie uhu.space); ein Rosa im Fließtext (#E9B372 wie ://about blank); Workshop-Satz „Je Zeitfenster …“ rechts als Absatz. ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .lu355{margin-block-start:20px}
:root:not(#_):not(#_):not(#_):not(#_) .lu355 > .lu355-k{grid-template-columns:auto minmax(0,1fr);align-content:center;align-items:center;column-gap:16px;row-gap:5px;
  min-block-size:0;padding:22px 22px 22px 20px}
:root:not(#_):not(#_):not(#_):not(#_) .lu355 .lu355-kopf{display:contents}
:root:not(#_):not(#_):not(#_):not(#_) .lu355 .lu355-ic{grid-column:1;grid-row:1 / span 2;inline-size:44px;block-size:44px}
:root:not(#_):not(#_):not(#_):not(#_) .lu355 .lu355-ic svg{inline-size:22px;block-size:22px}
:root:not(#_):not(#_):not(#_):not(#_) .lu355 .lu355-kopf > span:last-child{grid-column:2;grid-row:1;align-self:end;font-size:11px;font-weight:600;line-height:1.3;
  letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
:root:not(#_):not(#_):not(#_):not(#_) .lu355 .lu355-namen{grid-column:2;grid-row:2;align-self:start;font-size:22px;line-height:1.25;letter-spacing:.01em}
:root:not(#_):not(#_):not(#_):not(#_) .lu355.ws373 .lu355-namen{font-size:24px}
/* UHU ab 1180 px: vier schmale Kacheln – Symbol oben, darunter das kleine Wort und die Namen (sonst brechen die Namen dreizeilig) */
@media (min-width:1180px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .lu355.lu373 > .lu355-k{grid-template-columns:minmax(0,1fr);align-content:start;row-gap:6px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .lu355.lu373 .lu355-ic{grid-row:1;justify-self:start;margin-block-end:10px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .lu355.lu373 .lu355-kopf > span:last-child{grid-column:1;grid-row:2;align-self:start}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .lu355.lu373 .lu355-namen{grid-column:1;grid-row:3;font-size:20px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .lu355.lu373 .lu365-link{grid-row:4}
}
/* Workshop: Zeitfenster; „Ausverkauft“ als Pille */
:root:not(#_):not(#_):not(#_):not(#_) .ws373-zeiten .lu355-namen{gap:14px}
:root:not(#_):not(#_):not(#_):not(#_) .ws373-slot{align-items:center;gap:3px 8px}
:root:not(#_):not(#_):not(#_):not(#_) .ws373-aus{display:inline-flex;align-items:center;padding:2px 8px 1px;border-radius:999px;background:rgba(201,148,83,.18);
  color:#E9B372;font-size:10px;font-weight:600;line-height:1.4;letter-spacing:.06em}
@media (min-width:760px) and (max-width:999px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .lu355.ws373{grid-template-columns:repeat(2,minmax(0,1fr))}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .lu355.ws373 > .ws373-zeiten{grid-column:1/-1}
}
/* SoundCloud: unter den Namen über die ganze Kachel, Rand wie uhu.space, beim Überfahren pink */
:root:not(#_):not(#_):not(#_):not(#_) .lu355 .lu365-link{grid-column:1 / -1;grid-row:3;justify-self:start;margin-block-start:10px;background:rgba(255,255,255,.05);
  box-shadow:inset 0 0 0 1px rgba(234,225,216,.22);transition:background-color .18s,color .18s,box-shadow .18s}
@media (hover:hover){ :root:not(#_):not(#_):not(#_):not(#_) .lu355 .lu365-link:hover{background:#E6AA63;color:#19120B;box-shadow:none} }
:root:not(#_):not(#_):not(#_):not(#_) .lu355 .lu365-link:focus-visible{background:#E6AA63;color:#19120B;box-shadow:none}
@media (max-width:759px){
  :root:not(#_):not(#_):not(#_):not(#_) .lu355 > .lu355-k{padding:18px 18px 18px 16px;column-gap:14px}
  :root:not(#_):not(#_):not(#_):not(#_) .lu355 .lu355-namen{font-size:21px}
  :root:not(#_):not(#_):not(#_):not(#_) .lu355.ws373 .lu355-namen{font-size:22px}
}
@media (max-width:419px){
  :root:not(#_):not(#_):not(#_):not(#_) .lu355 .lu355-ic{inline-size:40px;block-size:40px}
  :root:not(#_):not(#_):not(#_):not(#_) .lu355 .lu355-ic svg{inline-size:20px;block-size:20px}
  :root:not(#_):not(#_):not(#_):not(#_) .lu355 .lu355-namen, :root:not(#_):not(#_):not(#_):not(#_) .lu355.ws373 .lu355-namen{font-size:19px}
}
/* ein Rosa im Fließtext: „Kommt vorbei …“ wie ://about blank und der Workshop-Satz */
:root:not(#_):not(#_):not(#_):not(#_) .schluss275{color:#E9B372}
/* Workshop: Buchungshinweis + „Je Zeitfenster …“ rechts untereinander */
.ws379-rechts{display:grid;gap:10px;min-inline-size:0}
:root:not(#_):not(#_):not(#_):not(#_) .ws379-mit{margin:0;color:#E9B372}
@media (min-width:900px){ :root:not(#_):not(#_):not(#_):not(#_) #programm265 .pb275.breit350 > .ws379-rechts{grid-column:2;order:1;align-self:start} }
/* ===== Ende BAUPLAN 379 ===== */
/* ===== BAUPLAN 382: „Team“ oben rechts in der Team-Box – passt es nicht neben den Namen, steht es in der Ecke über ihm (wrap-reverse), der Name bleibt ganz ===== */
:root:not(#_):not(#_) .team366-gruppe{grid-template-columns:minmax(0,1fr)}
:root:not(#_):not(#_) .team366-kopf{flex-wrap:wrap-reverse;align-items:center;gap:8px 12px;min-inline-size:0}
.team382-namen{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;flex:1 1 auto;min-inline-size:0}
:root:not(#_):not(#_) .team382-namen > .team366-name{max-inline-size:100%}
:root:not(#_):not(#_) .team382-namen > .team366-name > span{min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.team382-tag{flex:none;margin-inline-start:auto;padding:5px 12px;border-radius:999px;font-size:12px;line-height:16px;
  font-weight:600;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;color:var(--ink);box-shadow:inset 0 0 0 1px rgba(217,162,97,.4)}
@media (max-width:419px){
  :root:not(#_):not(#_) .team366-kopf{gap:8px}
  :root:not(#_):not(#_) .team382-tag{padding:5px 10px;letter-spacing:.06em}
}
@media (max-width:359px){ :root:not(#_):not(#_) .team382-tag{padding:4px 8px;font-size:11px;letter-spacing:.04em} }
/* in der Team-Box steht das Team schon darüber – die Team-Zeile je Kachel war gemeint, aus (366), unterlag aber der starken Regel aus 260 */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .team366-boxen .team260-zeile{display:none}
/* ===== Ende BAUPLAN 382 ===== */
/* ===== BAUPLAN 384: Schriftzug CALMA SAUNAGARTEN im Willkommens-Fenster etwas kleiner (Nutzer 16.10.) ===== */
:root:not(#_):not(#_):not(#_):not(#_) .hinweis329-titel.h355 .logo352{inline-size:104px}
/* ===== Ende BAUPLAN 384 ===== */
/* ===== BAUPLAN 400: Programm-Orte – /live hochkant (jede Kachel bekommt ihre Zeile, JS reihen400 setzt die Mindesthöhen), Abstand zwischen den
   Reihen von „Läuft gerade / Als Nächstes“, Ort in den Karten des Uhr-Fensters ===== */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .jetzt-reihe.zwei339 > .jetzt-spalte{grid-row:auto}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339.eng400 .box{padding-block:9px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339.eng400 .box .name{font-size:26px;line-height:1.08}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339.eng400 .box .zeit{font-size:19px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339.eng400 .box .wer{font-size:16px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339.eng400 .box .box-status{margin-block-end:4px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .jetzt-reihe.zwei339.enger400{row-gap:6px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339.enger400 .box{padding-block:7px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339.enger400 .box .name{margin-block-start:2px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339.einzeilig400 .box .name{-webkit-line-clamp:1;line-clamp:1}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339.enger400 .box .box-status{margin-block-end:2px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) body.im-live.live-hoch .live-mitte .zwei339.enger400 .box .wer{margin-block-start:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .jetzt-reihe.sa338-reihe{row-gap:28px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .uk .uk-ort400{display:inline-flex;align-items:center;gap:8px;margin-block-start:3px;font-size:14px;line-height:1.3;font-weight:500;color:var(--ink-2)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .uk .uk-ort400 .sym334{inline-size:30px;color:currentColor}
/* ===== Ende BAUPLAN 400 ===== */
/* ===== BAUPLAN 415: Programm-Seite – Menü der Orte + runder Zurück-Knopf (Rechner im Kopf, Handy als Leiste), Sauna-Überschriften größer mit mehr
   Luft darüber, Sauna-Pille im Blatt größer, Zutaten der Kacheln etwas kleiner, Mauszeiger-Schatten in der Seitenfarbe ===== */
/* Mauszeiger: Blau = Grundfarbe der Seite (die Stimmung färbt es in den Ton des Aufgusses), Startseite/Rückblick-Übersicht rosa */
:root{--zeiger415:#D3A168}
:root.warm270,:root.rosa265{--zeiger415:#E6AA63}
/* Rechner: Zurück-Knopf rund für sich, daneben die Orte als Pille */
@media (min-width:1000px){
  .kopf-legende:has(> .kopf415){display:flex;justify-content:center;flex:1;min-inline-size:0}
  .kopf415{display:flex;align-items:center;gap:12px;min-inline-size:0;max-inline-size:100%}
  .zurueck415{flex:none;display:grid;place-items:center;inline-size:48px;block-size:48px;border-radius:50%;color:var(--ink);text-decoration:none;
    background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
  .zurueck415 .ic{inline-size:20px;block-size:20px}
  .zurueck415:hover{background:rgba(255,255,255,.08)}
  .zurueck415:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
  :root:not(#_):not(#_) .reiter415 .reiter270-k{gap:9px}
  :root:not(#_):not(#_) .reiter415 .reiter270-k .sym334{inline-size:34px;color:currentColor}
  :root:not(#_):not(#_) .reiter415 .reiter270-k.an415{background:rgba(255,255,255,.13)}
}
@media (max-width:999px){ :root:not(#_):not(#_) .kopf-legende:has(> .kopf415){display:none} }
/* Handy/Tablet: Leiste unter dem Kopf (Verhalten wie auf der Startseite, 315) – Grund wie der Kopf, Zurück-Knopf rund davor */
@media (max-width:999px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #reiter315.reiter415m.klebt315{background:color-mix(in srgb,var(--stoff) 86%,transparent);
    border-block-end-color:rgba(255,255,255,.08)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .reiter415m .leiste315 > ul{box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .reiter415m .leiste315 > ul.zurueck415-ul{flex:none;display:flex;padding:0;background:transparent;box-shadow:none}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .reiter415m a.k315.zurueck415m{inline-size:54px;block-size:54px;min-block-size:54px;padding:0;border-radius:50%;
    background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .reiter415m a.k315.zurueck415m > span{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .reiter415m a.k315 .sym334{inline-size:34px;color:currentColor}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .reiter415m a.k315.an415{background:#F5EFE7;color:#19120B}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .reiter415m .leiste315:not(.ikon315) ul:not(.zurueck415-ul) a.k315{flex-direction:column;gap:3px;min-block-size:46px;padding:5px 4px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .reiter415m .leiste315:not(.ikon315) ul:not(.zurueck415-ul) a.k315 > span{max-inline-size:100%;min-inline-size:0;overflow:hidden;font-size:12.5px;line-height:1.15}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .reiter415m .leiste315:not(.ikon315) ul:not(.zurueck415-ul) a.k315 .sym334{inline-size:30px}
@media (min-width:700px){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .reiter415m .leiste315:not(.ikon315) ul:not(.zurueck415-ul) a.k315{flex-direction:row;gap:8px;padding-inline:10px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .reiter415m .leiste315:not(.ikon315) ul:not(.zurueck415-ul) a.k315 > span{font-size:15px} :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .reiter415m .leiste315:not(.ikon315) ul:not(.zurueck415-ul) a.k315 .sym334{inline-size:34px} }
}
/* Sauna-Überschriften im Plan: größer, mehr Luft darüber (Nutzer: „man muss es besser sehen“) */
:root:not(#_):not(#_):not(#_) .sauna-kopf338{gap:14px;font-size:26px;line-height:1.2}
:root:not(#_):not(#_):not(#_) .sauna-kopf338 .sym334{inline-size:62px}
:root:not(#_):not(#_):not(#_) .sauna-gruppe338{margin-block-start:26px}
:root:not(#_):not(#_):not(#_) .sauna-gruppe338 + .sauna-gruppe338{margin-block-start:52px}
:root:not(#_):not(#_):not(#_) .sauna-gruppe338 > .boxen{margin-block-start:16px}
:root:not(#_):not(#_):not(#_) .sa338-jk{gap:14px;margin-block-end:16px;font-size:25px;line-height:1.2}
:root:not(#_):not(#_):not(#_) .sa338-jk .sym334{inline-size:56px}
@media (min-width:1000px){
  :root:not(#_):not(#_):not(#_) .sauna-kopf338{font-size:28px}
  :root:not(#_):not(#_):not(#_) .tag-spalte.frei .sauna-gruppe338:first-of-type{margin-block-start:22px}
  :root:not(#_):not(#_):not(#_) .sa338-jk{font-size:26px}
}
@media (max-width:999px){ :root:not(#_):not(#_):not(#_) .sa338-reihe > .sa338-spalte + .sa338-spalte{margin-block-start:28px} }
@media (max-width:419px){
  :root:not(#_):not(#_):not(#_) .sauna-kopf338{font-size:24px}
  :root:not(#_):not(#_):not(#_) .sauna-kopf338 .sym334{inline-size:56px}
  :root:not(#_):not(#_):not(#_) .sauna-gruppe338 + .sauna-gruppe338{margin-block-start:44px}
  :root:not(#_):not(#_):not(#_) .sa338-jk{font-size:23px}
  :root:not(#_):not(#_):not(#_) .sa338-jk .sym334{inline-size:52px}
}
@media (max-width:359px){
  :root:not(#_):not(#_):not(#_) .sauna-kopf338,:root:not(#_):not(#_):not(#_) .sa338-jk{font-size:22px}
  :root:not(#_):not(#_):not(#_) .sauna-kopf338 .sym334,:root:not(#_):not(#_):not(#_) .sa338-jk .sym334{inline-size:48px}
}
/* Sauna-Pille im Detail-Blatt: Name und Symbol größer */
:root:not(#_):not(#_):not(#_) .sa338-pille{gap:9px;font-size:16px}
:root:not(#_):not(#_):not(#_) .sa338-pille .sym334{inline-size:2.2em}
/* Zutaten in den Kacheln etwas kleiner (nicht /live, nicht im Blatt) */
:root:not(#_):not(#_):not(#_) body:not(.im-live) .box .zutaten li{block-size:40px;gap:7px;padding-inline:3px 12px;font-size:14.5px}
:root:not(#_):not(#_):not(#_) body:not(.im-live) .box .zutaten .zutat-bild{inline-size:34px;block-size:34px}
:root:not(#_):not(#_):not(#_) body:not(.im-live) .box .zutaten li.zutat-mehr{min-inline-size:40px;padding-inline:9px}
@media (max-width:359px){
  :root:not(#_):not(#_):not(#_) body:not(.im-live) .box .zutaten li{block-size:38px;font-size:14px}
  :root:not(#_):not(#_):not(#_) body:not(.im-live) .box .zutaten .zutat-bild{inline-size:32px;block-size:32px}
}
/* ===== Ende BAUPLAN 415 ===== */
/* ===== BAUPLAN 417: „Gemerkt“ in der Farbe der Seite (Nutzer: „das Merken ist nicht dynamisch?“) – vorher fest Weinrot/Magenta; jetzt aus --zeiger415
   (Blau, das die Stimmung in den Ton des Aufgusses färbt; Startseite rosa): gedrückt gefüllt im Ton, Herz und Schrift dunkel ===== */
:root:not(#_):not(#_),:root:not(#_):not(#_) #blatt .platte.detail,:root:not(#_):not(#_) #blatt .platte.detail.ist-laeuft{
  --akt-an:var(--zeiger415,#D3A168);--akt-an-hover:color-mix(in oklab,var(--zeiger415,#D3A168) 86%,#FFFFFF);--akt-herz:#181109}
:root:not(#_):not(#_) #blatt .platte.detail .aktion[aria-pressed="true"],:root:not(#_):not(#_) #blatt .platte.detail.ist-laeuft .aktion[aria-pressed="true"],
:root:not(#_):not(#_) .aktion[aria-pressed="true"]{color:#181109}
/* ===== Ende BAUPLAN 417 ===== */
/* ===== BAUPLAN 419: Blatt des LAUFENDEN Aufgusses wieder farbig wie die laufende Kachel (Nutzer: „den aktuellen farbig machen – Farben und Kontrast
   müssen stimmen“), dazu das Glühen der Kachel, Flammen genau wie in der Kachel (dunkel im Stimmungston statt Aufguss-Ton mit Rand), „Gemerkt“ dunkel mit
   Herz in der Seitenfarbe (Kontrast auf dem hellen Grund) ===== */
:root:not(#_):not(#_):not(#_) #blatt .platte.detail.ist-laeuft{
  box-shadow:0 0 0 1.5px rgba(169,109,13,.5),0 0 46px 4px rgba(220,157,79,.32),0 0 120px 10px rgba(169,109,13,.18);
  background:radial-gradient(85% 45% at 18% 108%,rgba(169,109,13,.5),transparent 68%),radial-gradient(80% 40% at 88% 104%,rgba(210,137,30,.42),transparent 68%),
    radial-gradient(70% 30% at 70% -6%,rgba(251,242,232,.45),transparent 70%),var(--rausch-fein),linear-gradient(170deg,#FEDFBB 0%,var(--amber) 48%,var(--orange) 100%);
  background-blend-mode:normal,normal,normal,multiply,normal}
:root:not(#_):not(#_):not(#_) #blatt .platte.detail.ist-laeuft .int-flamme.voll{stroke:none;filter:none}
:root:not(#_):not(#_):not(#_) #blatt .platte.detail.ist-laeuft .int-flamme:not(.voll){fill:rgba(26,19,12,.18)}
:root:not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail.ist-laeuft{--akt-an:#1A130C;--akt-an-hover:#2C2310;--akt-herz:var(--zeiger415,#EDBE86)}
:root:not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail.ist-laeuft .aktion[aria-pressed="true"]{color:color-mix(in oklab,var(--zeiger415,#EDBE86) 40%,#FFFFFF)}
/* ===== Ende BAUPLAN 419 ===== */
/* ===== BAUPLAN 420: Herzen in der Farbe der Seite (Nutzer: „das Merken ist nicht dynamisch?“) – Herz an der Kachel, Herz-Knopf oben, Merkliste; vorher fest #EDBE86.
   --zeiger415 = Seitenfarbe (Stimmung färbt sie, Startseite rosa) ===== */
:root:not(#_):not(#_){--merk-herz:var(--zeiger415,#EDBE86)}
:root:not(#_):not(#_) .herz-marke{--herz-grund:color-mix(in oklab,var(--zeiger415,#EDBE86) 20%,transparent);--herz-farbe:var(--zeiger415,#EDBE86)}
:root:not(#_):not(#_) .box.laeuft .herz-marke{--herz-grund:#1A130C;--herz-farbe:var(--zeiger415,#EDBE86)}
:root:not(#_):not(#_) .box.vorbei .herz-marke{--herz-grund:#2E271E;--herz-farbe:color-mix(in oklab,var(--zeiger415,#EDBE86) 75%,#B5ABA1)}
/* Leiste am Handy: Symbole wie auf der Startseite (Ort-Symbole etwas größer, alle passen) */
@media (max-width:699px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .reiter415m .leiste315.ikon315 ul:not(.zurueck415-ul) a.k315{flex-direction:row;padding:8px 2px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .reiter415m .leiste315.ikon315 a.k315 .sym334{inline-size:min(36px,100%)}
}
/* ===== Ende BAUPLAN 420 ===== */
/* ===== BAUPLAN 421: Wetter auf der Programm-Seite – Knopf im Kopf nur am Rechner mit Platz (sonst Zeile im Burger-Menü), Farben aus den Variablen
   der Kopf-Knöpfe bzw. Menüzeilen (Stimmung färbt mit) ===== */
:root:not(#_) .leiste .wx421-knopf.ohne{padding-inline:0}
:root:not(#_):not(#_) .leiste .wx421-anker.weg421{display:none}
@media (max-width:999.98px){ :root:not(#_):not(#_) .leiste .wx421-anker{display:none} }
/* nur während reiterPassen270 misst: offene Dropdowns 0 breit, damit sie nicht als Überlauf der Leiste zählen */
:root:not(#_):not(#_) .leiste .kopf-pop.mess421{inline-size:0 !important;min-inline-size:0 !important;max-inline-size:0 !important;padding:0 !important;border:0 !important;overflow:hidden !important}
.menue265 .wx421-zeile > span:first-of-type{min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.menue265 .wx421-wert{display:inline-flex;align-items:baseline;white-space:nowrap;min-inline-size:0}
.menue265 .wx421-zeile.kurz421 .wx421-wort{display:none}
/* Werte-Kacheln im Wetter: Wörter nie mitten durchbrechen; passt eins nicht, Zeilen untereinander (werte421) */
:is(#wx421-pop,.wx421-blatt) .wx-wert .k{overflow-wrap:normal;word-break:normal}
:is(#wx421-pop,.wx421-blatt) .wx-werte.zeilen421{grid-template-columns:minmax(0,1fr);gap:6px}
:is(#wx421-pop,.wx421-blatt) .wx-werte.zeilen421 .wx-wert{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-block:8px}
:is(#wx421-pop,.wx421-blatt) .wx-werte.zeilen421 .wx-wert .k{flex-wrap:nowrap;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Stunden-Streifen: Bezugsrahmen für die Bildschirmleser-Texte (.sr, position:absolute) – sonst zählten sie zur Breite des ganzen Blatts/Dropdowns
   (398 px: Blatt seitlich wischbar, danach fast leer); die Fläche des Blatts selbst ist nie seitlich verschiebbar */
:is(#wx421-pop,.wx421-blatt) .wx-stunden{position:relative}
:root:not(#_) #blatt .wx421-blatt .platte-inhalt{overflow-x:hidden}
/* Wetterwort passt nicht neben die Zahl (jetzt421): darunter über die volle Breite */
:is(#wx421-pop,.wx421-blatt) .wx-jetzt.um421{flex-wrap:wrap;row-gap:4px}
:is(#wx421-pop,.wx421-blatt) .wx-jetzt.um421 .wx-txt{flex:1 0 100%}
:is(#wx421-pop,.wx421-blatt) .wx-wort{overflow-wrap:normal;word-break:normal;hyphens:manual}
/* Wetter-Dropdown deckend – auf /programm schienen die großen Überschriften durch */
:root:not(#_):not(#_):not(#_) #wx421-pop{background-color:var(--pop-grund)}
/* Tipp-Hand (138) nie über dem offenen Burger-Menü */
body:has(> #menue265:not([hidden])) > .hand-hinweis{visibility:hidden}
/* ===== Ende BAUPLAN 421 ===== */
/* ===== BAUPLAN 422: Strich oben im Handy-Blatt bleibt stehen; Zutaten-Leiste unten; Startseite Knopf zum Programm; „Gemerkt“ umgekehrt – dunkler Grund, Herz und
   Schrift im hellen Seitenton (Nutzer: „wenn markiert andersherum, mit dem hellen Ton“), wie das Herz an der Kachel ===== */
@media (max-width:999px){
  :root:not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail > .griff{position:sticky;inset-block-start:10px;z-index:8;background:color-mix(in srgb,var(--ink) 55%,transparent);transition:box-shadow .2s ease}
  /* gescrollt: Strich in einer dunklen Kapsel, der Text läuft darunter nicht wie durchgestrichen durch */
  :root:not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail.ab422 > .griff{box-shadow:0 0 0 9px rgba(15,9,4,.62)}
  /* helles Blatt (läuft gerade): helle Kapsel im Blattton */
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail.ist-laeuft.ab422 > .griff{box-shadow:0 0 0 9px rgba(254,247,240,.82)}
}
@media (min-width:1000px){ :root:not(#_):not(#_) .zl422{display:none} }   /* Tablet quer gedreht: im Seitenblatt keine Leiste */
.zl422{position:sticky;inset-block-end:calc(14px + env(safe-area-inset-bottom,0px));z-index:7;display:flex;justify-content:center;margin:18px 16px 0;pointer-events:none;
  transition:opacity .2s ease,transform .2s ease}
.zl422.aus422{opacity:0;transform:translateY(10px)}
.zl422-k{pointer-events:auto;display:flex;align-items:center;gap:6px;max-inline-size:100%;margin:0;padding:6px;border:0;border-radius:999px;overflow:hidden;cursor:pointer;
  color:var(--ink);background:color-mix(in srgb,var(--surface,#29221A) 84%,transparent);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);-webkit-tap-highlight-color:transparent}
:root:not(#_):not(#_):not(#_) .zl422-k .zutat-bild{inline-size:40px;block-size:40px;flex:none;margin:0}
.zl422-mehr{flex:none;display:grid;place-items:center;min-inline-size:40px;block-size:40px;padding-inline:6px;border-radius:999px;box-sizing:border-box;font-size:15px;font-weight:500;
  box-shadow:inset 0 0 0 1.5px var(--line-2)}
.zl422-k:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
:root:not(#_):not(#_) #blatt .platte.ist-laeuft .zl422-k{background:rgba(255,255,255,.55);color:#1A130C;box-shadow:inset 0 0 0 1px rgba(26,19,12,.18)}
@media (prefers-reduced-motion:reduce){ .zl422{transition:none} }
/* Startseite: Knopf zum Programm am Ende des Abschnitts */
.prog422{margin-block-start:22px}
.prog422 .plan338{margin:0;max-inline-size:none}
@media (max-width:399px){ :root:not(#_):not(#_) .prog422 .plan338{gap:8px;padding-inline:12px 10px} :root:not(#_):not(#_):not(#_) .prog422 .plan338-ic{inline-size:36px;block-size:36px} }
/* Programm-Knöpfe einzeilig (Titel und Orte), passen422 macht sie bei Bedarf kleiner */
:root:not(#_):not(#_) .plan338-titel,:root:not(#_):not(#_) .plan338-unter{white-space:nowrap;overflow-wrap:normal}
/* „Gemerkt“: dunkler Grund im Seitenton, Herz und Schrift hell im Seitenton */
:root:not(#_):not(#_):not(#_),:root:not(#_):not(#_):not(#_) #blatt .platte.detail{
  --akt-an:color-mix(in oklab,var(--zeiger415,#D3A168) 16%,#110A04);--akt-an-hover:color-mix(in oklab,var(--zeiger415,#D3A168) 24%,#110A04);--akt-herz:var(--zeiger415,#D3A168)}
:root:not(#_):not(#_):not(#_) .aktion[aria-pressed="true"],:root:not(#_):not(#_):not(#_) #blatt .platte.detail .aktion[aria-pressed="true"]{color:color-mix(in oklab,var(--zeiger415,#D3A168) 45%,#FFFFFF)}
/* Sauna-Symbole im Menü der Programm-Seite in der Kuppelfarbe wie das Logo (dynamisch, Nutzer), im aktiven hellen Feld dunkel */
:root:not(#_):not(#_):not(#_) .reiter415 .reiter270-k .sym334{color:var(--dome)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .reiter415m a.k315 .sym334{color:var(--dome)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .reiter415m a.k315.an415 .sym334{color:currentColor}
/* Herzen in der Farbe des markierten Kuppel-Stücks (--orange, die Stimmung färbt es) – Nutzer: „wie das markierte Ding in der Ecke vom Dom“ */
:root:not(#_):not(#_):not(#_){--merk-herz:var(--orange)}
:root:not(#_):not(#_):not(#_) .herz-marke{--herz-grund:color-mix(in oklab,var(--orange) 18%,transparent);--herz-farbe:var(--orange)}
:root:not(#_):not(#_):not(#_) .box.laeuft .herz-marke{--herz-grund:#1A130C;--herz-farbe:var(--orange)}
:root:not(#_):not(#_):not(#_) .box.vorbei .herz-marke{--herz-grund:#2E271E;--herz-farbe:color-mix(in oklab,var(--orange) 70%,#B5ABA1)}
:root:not(#_):not(#_):not(#_),:root:not(#_):not(#_):not(#_) #blatt .platte.detail{--akt-herz:var(--orange)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte.detail.ist-laeuft{--akt-herz:var(--orange)}
/* Menüs (Startseite + Programm, Rechner + Handy): Symbole in der Kuppelfarbe (dynamisch); am Handy der aktive Punkt leise hinterlegt wie am Rechner, nicht weiß */
:root:not(#_):not(#_):not(#_) #leiste .reiter270-k .ic{color:var(--dome)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #reiter315 a.k315:not(.cta315-k) .ic{color:var(--dome)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #reiter315 a.k315:not(.cta315-k):is([aria-current="true"],.an415){background:rgba(255,255,255,.13);color:var(--ink)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #reiter315 a.k315.an415 .sym334{color:var(--dome)}
/* Startseite: Menü-Symbole oben in der Farbe der sichtbaren Logo-Kuppel (#E9B372, wie im Burger-Menü) – die Startseite färbt die Stimmung nicht um */
:root.warm270:not(#_):not(#_):not(#_):not(#_) #leiste .reiter270-k .ic{color:#E9B372}
:root.warm270:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #reiter315 a.k315:not(.cta315-k) .ic{color:#E9B372}
/* Burger-Menü: aktive Seite in der Akzentfarbe der Seite (Startseite bleibt pink, sonst das Kuppel-Stück-Orange, das die Stimmung färbt) statt weiß */
:root:not(.warm270):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #menue265 .m265-link.an{background:var(--orange);color:#181109}
/* Startseite: „Heute ab 16:00“ / „Jetzt geöffnet“ präsenter (Nutzer) – größer, rosa hinterlegt, Punkt pulsiert */
:root.warm270:not(#_):not(#_):not(#_) .held265-status{gap:12px;padding:11px 22px;font-size:20px;color:#F3ECE5;background:color-mix(in srgb,#E6AA63 20%,rgba(12,6,2,.55));
  box-shadow:inset 0 0 0 1.5px rgba(217,162,97,.6)}
:root.warm270:not(#_):not(#_):not(#_) .held265-status .punkt265{inline-size:12px;block-size:12px;animation:puls265 2s ease-in-out infinite}
@media (min-width:1000px){ :root.warm270:not(#_):not(#_):not(#_) .held265-status{font-size:22px;padding:12px 26px} }
@media (prefers-reduced-motion:reduce){ :root.warm270:not(#_):not(#_):not(#_) .held265-status .punkt265{animation:none} }
/* Startseite: Programm-Leiste oben klickbar */
.prog271 > li[data-z422]{cursor:var(--hand308,pointer);border-radius:18px;transition:background-color .15s}
@media (hover:hover){ .prog271 > li[data-z422]:hover{background:rgba(255,255,255,.06)} }
.prog271 > li[data-z422]:focus-visible{outline:2px solid #E9B372;outline-offset:2px}
/* Ziel-Markierung als Umriss (box-shadow setzt 269/270 mit stärkerer Regel) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #programm265 li.pb275.ziel422{outline:2px solid rgba(217,162,97,.75);outline-offset:-2px}
#programm265 li.pb275{transition:outline-color .3s}
/* „Die Saunen“: Symbol links, Pillen oben rechts in der Ecke, darunter Name und Text, unten der Knopf zum Programm */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .sa337-liste > .pb275.sa337{display:grid;grid-template-columns:auto minmax(0,1fr);align-content:start;column-gap:16px}
.sa337-liste > .pb275.sa337 > *{grid-column:1 / -1}
.sa337-liste > .pb275.sa337 > .sa337-sym{grid-column:1;grid-row:1;align-self:start}
:root:not(#_):not(#_):not(#_) .sa337-liste > .pb275.sa337 > .sa360-pillen{grid-column:2;grid-row:1;align-self:start;justify-content:flex-end;margin:0}
.sa422-cta{justify-self:start;display:inline-flex;align-items:center;gap:8px;margin-block-start:10px;padding:10px 18px;border-radius:999px;text-decoration:none;font-size:16px;font-weight:500;
  color:var(--ink);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--ink) 45%,transparent);white-space:nowrap}
.sa422-cta .ic{inline-size:18px;block-size:18px;flex:none}
:root.warm270 .sa422-cta{color:#F3ECE5;box-shadow:inset 0 0 0 1.5px rgba(217,162,97,.6)}
@media (hover:hover){ .sa422-cta:hover{background:rgba(255,255,255,.07)} :root.warm270 .sa422-cta:hover{background:rgba(201,148,83,.14)} }
.sa422-cta:focus-visible{outline:2px solid currentColor;outline-offset:2px}
/* Workshop-Kacheln (Datum · Preis · Zeitfenster) wie die UHU-Kacheln: Symbol oben links, darunter das kleine Wort und die Angabe (Nutzer) – gleiche Breiten wie UHU (ab 1180 px) */
@media (min-width:1180px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .lu355.ws373 > .lu355-k{grid-template-columns:minmax(0,1fr);align-content:start;align-items:start;row-gap:6px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .lu355.ws373 .lu355-ic{grid-column:1;grid-row:1;justify-self:start;margin-block-end:10px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .lu355.ws373 .lu355-kopf > span:last-child{grid-column:1;grid-row:2;align-self:start}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_) .lu355.ws373 .lu355-namen{grid-column:1;grid-row:3;font-size:22px}
}
/* „Als Nächstes“ schon in der EIGENEN Farbe des Aufgusses (Nutzer: „nur die als nächstes sind in ihrer eigenen Farbe“) – Kachel und ihr Blatt: Grund, Rand,
   Flammen, Kuppel-Stück und Herz im Ton des Aufgusses (--ton-h); alles andere bleibt in der Seitenfarbe. Nicht auf /live. */
:root:not(#_):not(#_):not(#_) body:not(.im-live) .box.naechster[style*="--ton-h"],
:root:not(#_):not(#_):not(#_) body:not(.im-live) #blatt[style*="--ton-h"] .platte.detail.ist-naechster{
  --orange:oklch(.76 .13 calc(var(--ton-h) * 1deg));--zeiger415:oklch(.82 .09 calc(var(--ton-h) * 1deg));
  background:var(--rausch-fein),linear-gradient(162deg,oklch(.40 .07 calc(var(--ton-h) * 1deg)) 0%,oklch(.31 .055 calc(var(--ton-h) * 1deg)) 55%,oklch(.25 .045 calc(var(--ton-h) * 1deg)) 100%);
  background-blend-mode:soft-light,normal}
:root:not(#_):not(#_):not(#_) body:not(.im-live) .box.naechster[style*="--ton-h"]{border-color:oklch(.72 .09 calc(var(--ton-h) * 1deg) / .45)}
:root:not(#_):not(#_):not(#_) body:not(.im-live) .box.naechster[style*="--ton-h"] .int-flamme.voll{fill:oklch(.78 .15 calc(var(--ton-h) * 1deg));stroke:none}
:root:not(#_):not(#_):not(#_) body:not(.im-live) .box.naechster[style*="--ton-h"] .int-flamme:not(.voll){fill:oklch(.8 .05 calc(var(--ton-h) * 1deg) / .32)}
:root:not(#_):not(#_):not(#_) body:not(.im-live) .box.naechster[style*="--ton-h"] .mehr-hinweis{color:oklch(.84 .1 calc(var(--ton-h) * 1deg))}
/* … dazu die abgeleiteten Töne (Schrift, Linien, Pillen-Teil, Sauna-Pille, Kreis der Person, Zutaten-Kreis) im selben Ton – sonst stand Braun auf Türkis */
:root:not(#_):not(#_):not(#_):not(#_):not(#_) body:not(.im-live) .box.naechster[style*="--ton-h"],
:root:not(#_):not(#_):not(#_):not(#_):not(#_) body:not(.im-live) #blatt[style*="--ton-h"] .platte.detail.ist-naechster{
  --ink:oklch(.965 .014 calc(var(--ton-h) * 1deg));--ink-2:oklch(.88 .035 calc(var(--ton-h) * 1deg));--accent-ink:oklch(.86 .08 calc(var(--ton-h) * 1deg));
  --line:oklch(.95 .02 calc(var(--ton-h) * 1deg) / .16);--line-2:oklch(.95 .02 calc(var(--ton-h) * 1deg) / .30);--surface:oklch(.30 .045 calc(var(--ton-h) * 1deg));
  --dome:oklch(.84 .06 calc(var(--ton-h) * 1deg))}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) body:not(.im-live) :is(.box.naechster[style*="--ton-h"],#blatt[style*="--ton-h"] .platte.detail.ist-naechster) .pille.dauer{background:oklch(.30 .05 calc(var(--ton-h) * 1deg))}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) body:not(.im-live) :is(.box.naechster[style*="--ton-h"],#blatt[style*="--ton-h"] .platte.detail.ist-naechster) .pille.wort{color:oklch(.36 .07 calc(var(--ton-h) * 1deg))}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) body:not(.im-live) :is(.box.naechster[style*="--ton-h"],#blatt[style*="--ton-h"] .platte.detail.ist-naechster) .pille.sa338-pille{background:oklch(.23 .035 calc(var(--ton-h) * 1deg))}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) body:not(.im-live) :is(.box.naechster[style*="--ton-h"],#blatt[style*="--ton-h"] .platte.detail.ist-naechster) .av176:not(:has(img)){background:oklch(.31 .04 calc(var(--ton-h) * 1deg))}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) body:not(.im-live) :is(.box.naechster[style*="--ton-h"],#blatt[style*="--ton-h"] .platte.detail.ist-naechster) .zutat-bild.ohne{
  background:oklch(.29 .04 calc(var(--ton-h) * 1deg));color:oklch(.80 .06 calc(var(--ton-h) * 1deg));box-shadow:inset 0 0 0 1.5px oklch(.80 .06 calc(var(--ton-h) * 1deg) / .45)}
/* Zutaten in den Kacheln noch eine Stufe kleiner (Nutzer: „ein bisschen kleiner“) – 36 px, Bild 30 px */
:root:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) .box .zutaten li{block-size:36px;gap:6px;padding-inline:3px 11px;font-size:13.5px}
:root:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) .box .zutaten .zutat-bild{inline-size:30px;block-size:30px}
:root:not(#_):not(#_):not(#_):not(#_) body:not(.im-live) .box .zutaten li.zutat-mehr{min-inline-size:36px;padding-inline:8px}
/* Team-Box im Plan: Rand und „Team“-Pille in der Seitenfarbe statt fest Pink (Nutzer: „muss auch dynamisch sein“) */
:root:not(#_):not(#_):not(#_) .team366-gruppe{box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--orange) 32%,transparent)}
:root:not(#_):not(#_):not(#_) .team382-tag{box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--orange) 55%,transparent)}
/* Burger-Menü: mehr Trennstriche (Nutzer) – Seiten | Zoomstufe | Sprache | QR-Code + Teilen | Impressum … (gleiche Linie wie die vorhandenen) */
:root:not(#_):not(#_):not(#_) #menue265 .m265-reihe + .m265-zeile,
:root:not(#_):not(#_):not(#_) #menue265 [data-tu="sprache265"] + .m265-zeile{position:relative;margin-block-start:17px}
:root:not(#_):not(#_):not(#_) #menue265 .m265-reihe + .m265-zeile::before,
:root:not(#_):not(#_):not(#_) #menue265 [data-tu="sprache265"] + .m265-zeile::before{content:"";position:absolute;inset-inline:0;inset-block-start:-9px;block-size:1px;background:var(--line);pointer-events:none}
:root.warm270:not(#_):not(#_):not(#_) #menue265 :is(.m265-reihe,[data-tu="sprache265"]) + .m265-zeile::before{background:rgba(217,162,97,.18)}
:root:not(#_):not(#_):not(#_) #menue265.dicht320 :is(.m265-reihe,[data-tu="sprache265"]) + .m265-zeile{margin-block-start:9px}
:root:not(#_):not(#_):not(#_) #menue265.dicht320 :is(.m265-reihe,[data-tu="sprache265"]) + .m265-zeile::before{inset-block-start:-5px}
/* Burger-Menü: „Zoomstufe“ darf den −-Knopf nie berühren (schmale Handys, lange Sprachen) – Abstand bleibt, das Wort wird kleiner (menuePassen320), nie gekürzt */
:root:not(#_):not(#_):not(#_) #menue265 .m265-reihe{gap:12px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) #menue265 .m265-reihe > .m265-wort{white-space:nowrap;flex:0 0 auto;min-inline-size:auto}
:root:not(#_):not(#_):not(#_) #menue265 .m265-reihe > .m265-zoom{flex:none}
/* ===== Ende BAUPLAN 422 ===== */
/* ===== BAUPLAN 424: Programm-Seite – ein Tag, Kopf mittig mit Pfeilen, ein Kasten, Saunen als Spalten mit großen Überschriften ===== */
.tag424{margin-block-start:40px}
.tag424-h{margin:0 0 18px;text-align:center;font-size:clamp(30px,4.4vw,46px);font-weight:500;line-height:1.1;color:var(--ink)}
.tag424-h2{margin-block-start:56px}
.tag424-unter{margin:-8px 0 18px;text-align:center;font-size:17px;color:var(--ink-2)}
.tag424-pw{display:grid;gap:1px;text-align:start;line-height:1.15}
.tag424-pfeil.vor .tag424-pw{text-align:end}
.tag424-pw b{font-weight:500;font-size:15px}
.tag424-pw small{font-size:12.5px;color:var(--ink-2)}
.tag424-kopf{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:12px;margin-block-end:20px}
.tag424-titel{grid-column:2;text-align:center;min-inline-size:0}
.tag424-titel h3{margin:0;font-size:56px;font-weight:500;line-height:1.05;letter-spacing:-.01em;color:var(--ink)}
.tag424.heute .tag424-titel h3{color:var(--accent-ink)}
.tag424-titel p{margin:8px 0 0;font-size:19px;line-height:1.3;color:var(--ink-2)}
.tag424-pfeil{display:inline-flex;align-items:center;gap:8px;min-block-size:48px;margin:0;padding:8px 18px 8px 12px;border:0;border-radius:999px;cursor:pointer;
  color:var(--ink);font:inherit;font-size:15px;font-weight:500;white-space:nowrap;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.tag424-pfeil.zurueck{grid-column:1;justify-self:start}
.tag424-pfeil.vor{grid-column:3;justify-self:end;flex-direction:row-reverse;padding:8px 12px 8px 18px}
.tag424-pfeil .ic{inline-size:22px;block-size:22px;flex:none}
@media (hover:hover){ .tag424-pfeil:hover{background:rgba(255,255,255,.1)} }
.tag424-pfeil:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.tag424-platz{display:block}
:root:not(#_):not(#_):not(#_) .tag424-box{display:block;padding:28px 28px 32px}
.sa424-spalten{display:grid;grid-template-columns:minmax(0,1fr);gap:44px 36px;align-items:start}
@media (min-width:1000px){ .sa424-spalten{grid-template-columns:repeat(var(--sp424,2),minmax(0,1fr))} }
@media (min-width:1000px) and (max-width:1279px){ .sa424-spalten{grid-template-columns:repeat(min(var(--sp424,2),2),minmax(0,1fr))} }
:root:not(#_):not(#_):not(#_):not(#_) .sa424-spalten > .sauna-gruppe338{margin:0}
:root:not(#_):not(#_):not(#_):not(#_) .sa424-spalten .sauna-kopf338{justify-content:center;gap:16px;margin:0 0 6px;font-size:30px}
:root:not(#_):not(#_):not(#_):not(#_) .sa424-spalten .sauna-kopf338 .sym334{inline-size:76px}
:root:not(#_):not(#_):not(#_):not(#_) .sa424-spalten .sauna-gruppe338 > .boxen{margin-block-start:18px}
@media (max-width:999px){
  .tag424-titel h3{font-size:44px}
  .tag424-titel p{font-size:17px}
  :root:not(#_):not(#_):not(#_) .tag424-box{padding:20px 14px 24px}
  :root:not(#_):not(#_):not(#_):not(#_) .sa424-spalten .sauna-kopf338{font-size:26px}
  :root:not(#_):not(#_):not(#_):not(#_) .sa424-spalten .sauna-kopf338 .sym334{inline-size:64px}
}
@media (max-width:499px){
  .tag424-kopf{gap:6px}
  .tag424-titel h3{font-size:38px}
  .tag424-titel p{font-size:15px}
  .tag424-pfeil{min-block-size:44px;padding:6px 12px 6px 8px;font-size:13px;gap:4px}
  .tag424-pfeil.vor{padding:6px 8px 6px 12px}
  .tag424-pfeil .ic{inline-size:20px;block-size:20px}
}
@media (max-width:499px){ .tag424-pw b{font-size:13px} .tag424-pw small{font-size:11.5px} }
@media (max-width:359px){ .tag424-pfeil > span{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap} .tag424-pfeil{padding:6px 10px} }
/* Pfeil-Knöpfe nie umbrechen; passt es nicht (kopfPassen424), stehen „Heute“ + Datum oben und die Pfeile in einer Reihe darunter */
.tag424-pw b,.tag424-pw small{white-space:nowrap}
.tag424-kopf.eng424{grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:14px}
.tag424-kopf.eng424 > .tag424-titel{grid-column:1 / -1;grid-row:1}
.tag424-kopf.eng424 > :first-child{grid-column:1;grid-row:2}
.tag424-kopf.eng424 > :last-child{grid-column:2;grid-row:2}
/* Rechner: gemeinsame „vorbei“-Zeile mit Luft zu den Sauna-Überschriften */
:root:not(#_):not(#_):not(#_) .tag424-box > .vorbei-gruppe{margin-block-end:26px}
/* Handy: „vorbei“ je Sauna direkt unter der Überschrift */
:root:not(#_):not(#_):not(#_) .sa424-spalten .sauna-gruppe338 > .vorbei-gruppe{margin-block:14px 0}
/* ===== Ende BAUPLAN 424 ===== */
/* ===== BAUPLAN 418: Programm-Seite – Umschalter Kacheln | Liste oben rechts im Kasten (424), Liste als kompakte Zeilen: dieselbe .box mit
   Zustandsklasse wie die Kachel (Farben, Pillen, Zeitzeile mit Flammen, Fokus, Hover kommen von dort; hier nur Abstände und Größen der Zeile).
   Rechner und Handy gleich aufgebaut: Pillen (nur läuft/als Nächstes/fällt aus) · Zeit │ Flammen · Temperatur · Name · „mit …“ und Zutaten-Bilder. ===== */
/* Umschalter: eigene Zeile oben rechts im Kasten (bei „ausblenden“ in dessen Zeile), ins Eck gerückt */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .tag424-box > .ans418-reihe{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin:-14px -14px 6px 0;padding:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .tag424-box > .tages-kopf.ans418-mit{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:-14px -14px 6px 0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .tag424-box > .tages-kopf.ans418-mit > .ans418{margin-inline-start:auto}
@media (max-width:999px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .tag424-box > .ans418-reihe{margin:-10px -6px 4px 0}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .tag424-box > .tages-kopf.ans418-mit{margin:-10px -6px 4px 0}
}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .ans418{flex:none;align-self:center;display:inline-flex;gap:3px;padding:3px;border-radius:21px;background:color-mix(in srgb,var(--ink) 5%,transparent);box-shadow:inset 0 0 0 1px var(--line)}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .ans418-k{display:grid;place-items:center;inline-size:34px;block-size:34px;min-inline-size:34px;padding:0;margin:0;border:0;border-radius:17px;background:transparent;color:var(--ink-2);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background-color .15s,color .15s}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .ans418-k[aria-pressed="true"]{background:var(--ink);color:var(--stoff)}
@media (hover:hover){ :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .ans418-k:not([aria-pressed="true"]):hover{background:color-mix(in srgb,var(--ink) 12%,transparent);color:var(--ink)} }
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .ans418-k:focus-visible{outline:2px solid var(--ring);outline-offset:1px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .ans418-k .ans418-ic{inline-size:18px;block-size:18px;stroke-width:1.5;opacity:1}
/* Handy: etwas kleiner, Trefferfläche bleibt groß */
@media (max-width:699px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .ans418{gap:2px;padding:3px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .ans418-k{position:relative;inline-size:32px;block-size:32px;min-inline-size:32px;border-radius:16px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .ans418-k::before{content:"";position:absolute;inset:-6px -1px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .ans418-k .ans418-ic{inline-size:17px;block-size:17px}
}

/* Liste */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .tages-box.liste418 ol.boxen{gap:8px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;padding:12px 16px 13px;border-radius:18px;min-block-size:0;block-size:auto;inline-size:auto;max-inline-size:none}
/* Pillen wie in der Kachel (läuft, als Nächstes, fällt aus) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 > .box-status.z418-stat{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-block-size:0;margin:0 0 9px;padding:0}
/* Zeitzeile der Kachel (.box-kopf > .zeit mit Flammen; zeitZeileEinpassen wie dort – der Kopf füllt die Zeile, sonst hielte das Einpassen
   die Flammen für zu breit), rechts Temperatur und eigene Sterne; wird es eng, rutschen sie in die nächste Zeile. Das Herz steht oben rechts in
   der Ecke (die erste Zeile lässt ihm Platz) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 > .z418-oben{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;min-inline-size:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .z418-oben > .box-kopf.z418-kopf{flex:1 1 auto;min-inline-size:0;min-block-size:0;margin:0;padding:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .z418-oben > .z418-meta{display:inline-flex;flex-wrap:wrap;align-items:center;gap:4px 12px;min-inline-size:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 > .z418-herz{position:absolute;inset-block-start:11px;inset-inline-end:12px;z-index:1;display:block;line-height:0;pointer-events:none}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418.z418-mh > .z418-stat,:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418.z418-mh > .sr:first-child + .z418-oben{padding-inline-end:34px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .kl418{display:inline-flex;align-items:center;gap:3px;margin:0;font-size:15px;font-weight:500;line-height:1;white-space:nowrap;font-variant-numeric:tabular-nums}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .kl418 .kl199-ic{inline-size:17px;block-size:17px;stroke-width:1.5}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .z418-meta > .fb-marke{font-size:14px;white-space:nowrap}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .z418-meta > .fb-marke .stern-klein{inline-size:15px;block-size:15px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 > .z418-herz > .herz-marke{inline-size:26px;block-size:26px;min-inline-size:26px;margin:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 > .z418-herz > .herz-marke .ic{inline-size:14px;block-size:14px}
/* Name ganz (keine Kürzung), Silbentrennung statt Wortbruch */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 > .z418-ober{margin:7px 0 0;font-size:11.5px;line-height:1.2;letter-spacing:.06em;text-transform:uppercase;opacity:.8;overflow-wrap:break-word}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 > .z418-name{display:block;margin:5px 0 0;padding:0;font-size:20px;line-height:1.25;font-weight:500;letter-spacing:0;-webkit-line-clamp:none;line-clamp:none;overflow:visible;max-block-size:none;min-block-size:0;
  hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word;text-wrap:pretty}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 > .z418-ober + .z418-name{margin-block-start:2px}
/* „mit …“ links, Zutaten-Bilder rechts – passen beide nicht in eine Zeile, stehen die Bilder rechts darunter */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 > .z418-unten{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:6px 0 0;min-inline-size:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .z418-wer{flex:1 1 auto;min-inline-size:0;margin:0;font-size:15px;line-height:1.3;overflow-wrap:break-word}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .z418-wer .wer-bild175{inline-size:20px;block-size:20px;margin-block:-3px 0}
/* position:relative – die Bilder messen ihre Lage in der Liste selbst (zutatenKuerzen) */
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .z418-zut{position:relative;flex:none;display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:4px;margin:0;margin-inline-start:auto;padding:0;list-style:none;inline-size:calc(var(--z418,4) * 32px - 4px);max-inline-size:100%;min-inline-size:0;overflow:visible}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .z418-zut > li{display:block;position:relative;flex:none;inline-size:28px;block-size:28px;min-inline-size:0;max-inline-size:none;margin:0;padding:0;gap:0;border-radius:50%;background:none;box-shadow:none;border:0}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .z418-zut > li > .zutat-bild{display:block;inline-size:28px;block-size:28px;margin:0;border-radius:50%;object-fit:cover}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .z418-zut > li > span.zutat-bild.ohne{display:grid;place-items:center}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .z418-zut > li > span.zutat-bild.ohne svg{inline-size:16px;block-size:16px}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .z418-zut > li > .z418-zn{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .z418-zut > li.zutat-mehr{display:grid;place-items:center;inline-size:auto;min-inline-size:28px;padding:0 5px;border-radius:14px;font-size:12px;font-weight:500;line-height:1;background:transparent;box-shadow:inset 0 0 0 1.5px var(--line-2,var(--line))}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.laeuft.zeile418 .z418-zut > li.zutat-mehr{box-shadow:inset 0 0 0 1.5px rgba(26,19,12,.32)}
/* Handy: Schrift wie die übrige Seite eine Stufe größer (Zeit und Flammen folgen der Kachel von selbst) */
@media (max-width:699px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418{padding:12px 14px 13px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 > .z418-name{font-size:21px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .z418-wer{font-size:16px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .kl418{font-size:16px}
}
@media (max-width:359px){
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418{padding:11px 12px 12px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 > .z418-name{font-size:20px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .z418-wer{font-size:15px}
  :root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) .box.zeile418 .kl418{font-size:15px}
}
/* ===== Ende BAUPLAN 418 ===== */
/* ===== BAUPLAN 425: Vorbei-Knopf einzeilig, Flammen im Blatt-Kopf passen, kein Zurück-Wischen auf der Programm-Seite ===== */
/* die Zeile darf nie breiter als ihre Sauna-Spalte werden (Raster-Spalte „auto“ wuchs sonst mit dem einzeiligen Text) */
:root:not(#_):not(#_) .vorbei-gruppe{min-inline-size:0}
:root:not(#_):not(#_) .vorbei-knopf{min-inline-size:0;max-inline-size:100%}
.vorbei-knopf .vg-text{min-inline-size:0}
.vorbei-knopf .vg-zahl{white-space:nowrap}
.vorbei-knopf.kurz425 .vg-mehr{font-size:0;gap:0}
.vorbei-knopf.kurz425 .vg-mehr .ic{font-size:16px}
.vorbei-knopf.um425 .vg-zahl{white-space:normal}
:root:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) #blatt .platte-kopf .zeit-int.eng425 .int-flamme{inline-size:var(--fl425);block-size:var(--fl425)}
/* Burger-Menü: Zeilen nie zweizeilig („QR-Code anzeigen“ el/hu bei 320 px) – nowrap, dann macht menuePassen320 das Wort kleiner */
:root:not(#_):not(#_):not(#_) #menue265 .m265-zeile > span:first-of-type{white-space:nowrap}
/* Programm-Seite: Wischen nach rechts wechselt den Tag (138) – der Browser soll dabei nicht „Zurück“ gehen */
:root:has(.tag424){overscroll-behavior-x:none}
/* ===== Ende BAUPLAN 425 ===== */