/* Fetisch-Stile, Neugestaltung von Claude (13.10.2026). Jeder Stil gestaltet die ganze Seite: Kopf, Navigation, Inhalt,
   Knöpfe, Formulare, Fußzeile und (bei Ultra HD) eine gezeichnete Bühne aus fetisch-<stil>.js.
   Aktiv nur mit Klasse .fx2 (gesetzt von fetisch.js), damit alte Regeln aus fun-designs.css nicht dazwischenfunken. */

/* ================= Gemeinsame Steuerleiste ================= */
.fx-dock { position: fixed; right: 16px; bottom: 16px; z-index: 40; max-width: min(440px, calc(100vw - 32px)); box-sizing: border-box;
  font: 600 14px/1.3 var(--fxd-font, 'Inter', sans-serif); color: var(--fxd-fg, #2b2b2b); background: var(--fxd-bg, #fff);
  border: var(--fxd-border, 2px solid rgba(0, 0, 0, 0.12)); border-radius: var(--fxd-radius, 22px); box-shadow: var(--fxd-shadow, 0 18px 40px -18px rgba(0, 0, 0, 0.45)); padding: 8px 10px 10px; }
.fx-dock.closed { padding: 6px 8px; }
.fx-dock-head { display: flex; align-items: center; gap: 6px; }
.fx-dock button { font: inherit; cursor: pointer; }
.fx-dock-toggle { flex: 1; display: flex; align-items: center; gap: 8px; min-height: 36px; padding: 2px 6px; background: none; border: 0; color: inherit; text-align: left; border-radius: 12px; }
.fx-dock-ico { font-size: 20px; line-height: 1; }
.fx-dock-title { font: var(--fxd-title-font, 700 15px/1.2 'Inter', sans-serif); letter-spacing: 0.01em; }
.fx-dock-snd { width: 36px; height: 36px; border-radius: 50%; border: 0; background: var(--fxd-soft, rgba(0, 0, 0, 0.06)); color: inherit; font-size: 16px; }
.fx-dock-min { width: 36px; height: 36px; border-radius: 50%; border: 0; background: var(--fxd-soft, rgba(0, 0, 0, 0.06)); color: inherit; font: 700 20px/1 'Inter', sans-serif; }
.fx-dock.closed .fx-dock-snd { display: none; }
@media (min-width: 1420px) { .fx-dock.closed { width: auto; } }
.fx-dock-body { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 6px; }
.fx-dock-body[hidden] { display: none; }
.fx-dock .fx-btn { min-height: 38px; padding: 7px 14px; border-radius: var(--fxd-btn-radius, 999px); border: var(--fxd-btn-border, 0); background: var(--fxd-btn, #eee); color: var(--fxd-btn-fg, inherit);
  box-shadow: var(--fxd-btn-shadow, none); transition: transform 0.12s, box-shadow 0.12s; }
.fx-dock .fx-btn:active { transform: translateY(2px); }
.fx-dock .fx-btn.alt { background: var(--fxd-btn2, transparent); color: var(--fxd-btn2-fg, inherit); box-shadow: var(--fxd-btn2-shadow, inset 0 0 0 2px currentColor); }
.fx-dock :focus-visible { outline: 3px solid var(--fxd-focus, #2a6fdb); outline-offset: 2px; }
.fx-dock .fx-meter { display: flex; align-items: center; gap: 6px; width: 100%; font-weight: 600; }
.fx-dock .fx-say { width: 100%; margin: 2px 2px 0; font-weight: 500; font-size: 13px; line-height: 1.4; opacity: 0.85; min-height: 1.4em; }
.fx-dock label { display: flex; flex-direction: column; gap: 3px; font-size: 12px; font-weight: 600; min-width: 0; }
@media (min-width: 1420px) { .fx-dock label { width: 100%; } .fx-dock :is(input, select) { width: 100%; box-sizing: border-box; } }
.fx-dock :is(input, select) { min-height: 34px; padding: 4px 8px; border-radius: 10px; border: 2px solid var(--fxd-soft, rgba(0, 0, 0, 0.12)); background: var(--fxd-input, #fff); color: var(--fxd-input-fg, #222); font: 500 14px/1.2 'Inter', sans-serif; max-width: 100%; }
@media (min-width: 1420px) { .fx-dock { right: 18px; bottom: auto; top: max(300px, 38vh); width: calc((100vw - 900px) / 2 - 40px); max-width: 300px; }
  .fx-dock .fx-dock-body { flex-direction: column; align-items: stretch; } .fx-dock .fx-btn { width: 100%; } }
@media (max-width: 640px) { .fx-dock { right: 8px; left: 8px; bottom: 8px; max-width: none; } .fx-dock.closed { left: auto; } }
@media print { .fx-dock { display: none !important; } }
/* Vordergrund ausgeblendet: nur Bühne, Kopfzeile und Leiste */
html.fx-bare main, html.fx-bare footer, html.fx-bare .statusline { visibility: hidden !important; pointer-events: none !important; }
html.fx-bare .fx-dock .fx-bare-btn { background: var(--fxd-btn); color: var(--fxd-btn-fg); box-shadow: var(--fxd-btn-shadow); }

/* ================= FETT: Konditorei, Sahnetorte, Gummibonbons ================= */
html.fx2[data-shell="fufett"] {
  --fx-cream: #fff6ea; --fx-vanilla: #fffbf4; --fx-straw: #ff6f98; --fx-straw-d: #d9436f; --fx-straw-l: #ff9ab8; --fx-choc: #5a3022; --fx-choc-d: #3f1f15;
  --fx-caramel: #f2a04a; --fx-mint: #63cdb3; --fx-lemon: #ffd25e; --fx-berry: #8f7cf0; --fx-ink: #4a2a20; --fx-ink-soft: #7b5446;
  --fx-f: 0; --font: 'Arimo', 'Helvetica Neue', Arial, sans-serif; --prompt: '🍰'; --bg: var(--fx-cream); --fg: var(--fx-ink); --muted: var(--fx-ink-soft);
  --accent: var(--fx-straw-d); --line: #f2d6c4; --soft: #ffe9ef; --card: var(--fx-vanilla); font-size: 16.5px; color-scheme: light;
  --fxd-font: 'Fredoka', 'Arimo', sans-serif; --fxd-title-font: 600 17px/1.1 'Fredoka', sans-serif; --fxd-bg: linear-gradient(#fffaf2, #ffeede); --fxd-fg: var(--fx-choc);
  --fxd-border: 3px solid #fff; --fxd-radius: 28px; --fxd-shadow: 0 7px 0 #ffb7c9, 0 13px 0 #f5cf98, 0 26px 40px -16px rgba(90, 48, 34, 0.45);
  --fxd-btn: linear-gradient(#ff9ab8, #ff5d8f); --fxd-btn-fg: #fff; --fxd-btn-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.5), inset 0 -4px 0 rgba(150, 20, 60, 0.18), 0 4px 0 #c93a66;
  --fxd-btn2: linear-gradient(#a6efdd, #5fcbb0); --fxd-btn2-fg: #134d40; --fxd-btn2-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.55), 0 4px 0 #2f9a80; --fxd-soft: #ffe1ea; --fxd-focus: var(--fx-choc); }
html.fx2[data-shell="fufett"][data-fx-fat="2"] { --fx-f: 0.25; } html.fx2[data-shell="fufett"][data-fx-fat="3"] { --fx-f: 0.5; }
html.fx2[data-shell="fufett"][data-fx-fat="4"] { --fx-f: 0.75; } html.fx2[data-shell="fufett"][data-fx-fat="5"] { --fx-f: 1; }

/* Grund: Vanillecreme mit Streuseln (Icons) */
html.fx2[data-shell="fufett"] body { background-color: var(--fx-cream); color: var(--fx-ink);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cg opacity='.75'%3E%3Crect x='20' y='30' width='16' height='5' rx='2.5' fill='%23ff8fb1' transform='rotate(-25 28 32)'/%3E%3Crect x='90' y='18' width='16' height='5' rx='2.5' fill='%2363cdb3' transform='rotate(40 98 20)'/%3E%3Crect x='140' y='70' width='16' height='5' rx='2.5' fill='%23ffd25e' transform='rotate(-60 148 72)'/%3E%3Crect x='60' y='95' width='16' height='5' rx='2.5' fill='%238f7cf0' transform='rotate(15 68 97)'/%3E%3Crect x='25' y='140' width='16' height='5' rx='2.5' fill='%23f2a04a' transform='rotate(70 33 142)'/%3E%3Crect x='120' y='145' width='16' height='5' rx='2.5' fill='%23ff8fb1' transform='rotate(-10 128 147)'/%3E%3Ccircle cx='160' cy='20' r='3.5' fill='%2363cdb3'/%3E%3Ccircle cx='100' cy='60' r='3' fill='%23ffd25e'/%3E%3Ccircle cx='70' cy='160' r='3.5' fill='%23ff8fb1'/%3E%3C/g%3E%3C/svg%3E"),
    radial-gradient(1200px 500px at 50% -120px, #ffe1ea 0%, rgba(255, 225, 234, 0) 70%); background-attachment: fixed; }

/* Kopf: Schokoladenleiste und tropfende Erdbeerglasur */
html.fx2[data-shell="fufett"] header.top { background: none; border: 0; box-shadow: none; }
html.fx2[data-shell="fufett"] .chrome { background: linear-gradient(#6d3a29, var(--fx-choc) 55%, var(--fx-choc-d)); color: #ffe9d6; border: 0; box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.18); }
html.fx2[data-shell="fufett"] .chrome .wintitle { font: 500 13px/1 'Fredoka', sans-serif; letter-spacing: 0.02em; color: #ffd9bd; }
html.fx2[data-shell="fufett"] .chrome summary { font-family: 'Fredoka', sans-serif; color: #ffe9d6; }
html.fx2[data-shell="fufett"] .topbar { position: relative; background: linear-gradient(180deg, #ffb1c7 0%, var(--fx-straw) 46%, #f55a88 100%); color: #fff; border: 0;
  box-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.45), inset 0 -2px 0 rgba(160, 30, 70, 0.15); padding-bottom: 10px; }
html.fx2[data-shell="fufett"] .topbar::after { content: ''; position: absolute; left: 0; right: 0; top: calc(100% - 1px); height: 30px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='30' fill='%23f55a88'%3E%3Crect width='260' height='8'/%3E%3Crect x='14' y='0' width='11' height='17' rx='5.5'/%3E%3Crect x='46' y='0' width='15' height='27' rx='7.5'/%3E%3Crect x='88' y='0' width='9' height='13' rx='4.5'/%3E%3Crect x='121' y='0' width='13' height='21' rx='6.5'/%3E%3Crect x='163' y='0' width='17' height='25' rx='8.5'/%3E%3Crect x='207' y='0' width='10' height='15' rx='5'/%3E%3Crect x='236' y='0' width='12' height='19' rx='6'/%3E%3C/svg%3E") repeat-x 0 0 / 260px 30px;
  filter: drop-shadow(0 3px 0 rgba(150, 25, 65, 0.22)); }
html.fx2[data-shell="fufett"] .topbar :is(.brand, .brand a, .typed, .session a) { color: #fff; text-shadow: 0 2px 0 rgba(160, 30, 70, 0.35); }
html.fx2[data-shell="fufett"] .topbar .brand { font: 600 1.05rem/1.2 'Fredoka', sans-serif; }
html.fx2[data-shell="fufett"] .topbar .term-open { color: var(--fx-choc); background: #fff3f6; border: 0; border-radius: 999px; box-shadow: 0 3px 0 #d9436f; }
html.fx2[data-shell="fufett"] nav.main { gap: calc(8px + var(--fx-f) * 6px); }
html.fx2[data-shell="fufett"] nav.main a { font: 600 calc(1rem + var(--fx-f) * 0.12rem)/1.1 'Fredoka', sans-serif; color: var(--fx-choc); text-shadow: none; text-transform: none;
  padding: calc(0.42rem + var(--fx-f) * 0.2rem) calc(0.95rem + var(--fx-f) * 0.5rem); border-radius: 999px; border: 0;
  background: radial-gradient(120% 90% at 50% 15%, #ffffff 0%, #fff4f7 45%, #ffd9e5 100%);
  box-shadow: inset 0 -4px 0 rgba(217, 67, 111, 0.16), 0 calc(4px + var(--fx-f) * 3px) 0 #d9436f, 0 calc(8px + var(--fx-f) * 4px) 12px -6px rgba(120, 20, 50, 0.45);
  transition: box-shadow 0.15s, translate 0.15s; }
html.fx2[data-shell="fufett"] nav.main a:hover { translate: 0 -2px; }
html.fx2[data-shell="fufett"] nav.main a.active { color: #fff; background: radial-gradient(120% 90% at 50% 15%, #8b5a45 0%, var(--fx-choc) 55%, var(--fx-choc-d) 100%); box-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.25), 0 calc(4px + var(--fx-f) * 3px) 0 #2a120a; }
html.fx2[data-shell="fufett"] nav.main a .lock { opacity: 0.7; }
html.fx2[data-shell="fufett"] .session a, html.fx2[data-shell="fufett"] .session .link { font-family: 'Fredoka', sans-serif; color: #fff; }

/* Inhalt: dreischichtige Sahnetorte mit Sahnehäubchen-Rand */
html.fx2[data-shell="fufett"] main { position: relative; z-index: 1; background: var(--fx-vanilla); color: var(--fx-ink); border: 0;
  border-radius: calc(40px + var(--fx-f) * 16px); margin-top: 3.4rem; margin-bottom: 4.5rem; padding: calc(2.6rem + var(--fx-f) * 0.6rem) calc(2.6rem + var(--fx-f) * 0.8rem) 2.4rem;
  box-shadow: inset 0 3px 0 #fff, inset 0 -10px 18px -10px rgba(242, 160, 74, 0.25),
    0 calc(12px + var(--fx-f) * 6px) 0 -3px #ffb3c7, 0 calc(24px + var(--fx-f) * 12px) 0 -6px #f7d39b, 0 calc(36px + var(--fx-f) * 18px) 0 -9px #ffb3c7,
    0 calc(50px + var(--fx-f) * 22px) 50px -14px rgba(90, 48, 34, 0.35); }
html.fx2[data-shell="fufett"] main::before { content: ''; position: absolute; left: 30px; right: 30px; top: -24px; height: 34px; pointer-events: none; margin: 0 12px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='34'%3E%3Cpath d='M1 34C1 23 7 17 14 17C14 9 21 5 26 7C27 2 33 1 33 6C40 9 45 19 45 34Z' fill='%23fffbf4'/%3E%3Cpath d='M1 34C1 23 7 17 14 17C14 9 21 5 26 7C27 2 33 1 33 6C40 9 45 19 45 34' fill='none' stroke='%23f0cdb6' stroke-width='1.6'/%3E%3Cpath d='M7 27C14 22 24 22 33 25M15 17C20 14 27 14 31 16' fill='none' stroke='%23f3dccd' stroke-width='1.6' stroke-linecap='round'/%3E%3Cellipse cx='22' cy='13' rx='3' ry='2' fill='%23fff'/%3E%3C/svg%3E") 0 0 / 46px 34px repeat-x;
  filter: drop-shadow(0 -2px 3px rgba(242, 160, 74, 0.18)); }
html.fx2[data-shell="fufett"] main :is(p, li, td, dd) { color: var(--fx-ink); line-height: 1.75; }
html.fx2[data-shell="fufett"] main h1 { font: 600 calc(2.9rem + var(--fx-f) * 0.5rem)/1.08 'Fredoka', 'Arimo', sans-serif; color: var(--fx-choc); letter-spacing: calc(-0.01em - var(--fx-f) * 0.02em);
  background: none; -webkit-text-fill-color: currentColor; animation: none; display: inline-block; transform-origin: 0 100%; scale: calc(1 + var(--fx-f) * 0.16) 1;
  text-shadow: 0 2px 0 #ffd9bd, 0 4px 0 var(--fx-caramel), 0 calc(7px + var(--fx-f) * 4px) 0 rgba(90, 48, 34, 0.18); margin-bottom: 0.6rem; }
html.fx2[data-shell="fufett"] main h1::before, html.fx2[data-shell="fufett"] main h1::after { content: none; }
html.fx2[data-shell="fufett"] main h2 { font: 600 calc(1.55rem + var(--fx-f) * 0.2rem)/1.25 'Fredoka', sans-serif; color: var(--fx-straw-d); margin-top: 2.4rem; padding: 0; border: 0; background: none; text-transform: none; letter-spacing: 0; }
html.fx2[data-shell="fufett"] main h2::before { content: ''; display: inline-block; width: calc(0.8em + var(--fx-f) * 0.25em); height: calc(0.8em + var(--fx-f) * 0.25em); margin-right: 0.45em; vertical-align: -0.06em; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #fff 0 12%, #ff9ab8 13%, var(--fx-straw-d) 75%); box-shadow: 0 3px 0 #a72b52; }
html.fx2[data-shell="fufett"] main h3 { font-family: 'Fredoka', sans-serif; font-weight: 600; color: var(--fx-choc); }
html.fx2[data-shell="fufett"] main a:not(.button):not(.card):not(.tag) { color: #c2385f; text-decoration: underline; text-decoration-thickness: calc(3px + var(--fx-f) * 2px); text-underline-offset: 4px;
  text-decoration-color: rgba(242, 160, 74, 0.75); text-decoration-skip-ink: none; background: none; border-radius: 4px; transition: background-color 0.15s; }
html.fx2[data-shell="fufett"] main a:not(.button):not(.card):not(.tag):hover { background-color: #ffe4ec; text-decoration-color: var(--fx-caramel); }
html.fx2[data-shell="fufett"] main ul > li { position: relative; list-style: none; }
html.fx2[data-shell="fufett"] main ul > li::before { content: ''; position: absolute; left: -1.3em; top: 0.72em; margin: 0; display: block; width: 0.85em; height: 0.3em; border-radius: 0.15em; rotate: -28deg; background: var(--fx-straw); box-shadow: 0 1px 0 rgba(0, 0, 0, 0.12); }
html.fx2[data-shell="fufett"] main ul > li:nth-child(4n+2)::before { background: var(--fx-mint); rotate: 22deg; }
html.fx2[data-shell="fufett"] main ul > li:nth-child(4n+3)::before { background: var(--fx-lemon); rotate: -60deg; }
html.fx2[data-shell="fufett"] main ul > li:nth-child(4n)::before { background: var(--fx-berry); rotate: 40deg; }
html.fx2[data-shell="fufett"] main :is(blockquote, pre) { background: #fff0e4; border: 0; border-radius: 22px; box-shadow: inset 0 0 0 3px #ffe0c7; }
html.fx2[data-shell="fufett"] main code { background: #ffeef3; color: #8a2245; border-radius: 8px; }
html.fx2[data-shell="fufett"] main hr { border: 0; height: 10px; background: radial-gradient(circle, var(--fx-straw-l) 0 4px, rgba(0, 0, 0, 0) 5px) 0 0 / 22px 10px repeat-x; }

/* Gummibonbon-Knöpfe: Erdbeere, Minze, Zitrone, Heidelbeere */
html.fx2.fx2-fufett[data-shell="fufett"] main :where(.button, button:not(.link):not(.tag):not(.dot), input[type="submit"]) { font: 600 calc(1rem + var(--fx-f) * 0.12rem)/1.15 'Fredoka', sans-serif; color: #fff;
  padding: calc(0.7rem + var(--fx-f) * 0.3rem) calc(1.35rem + var(--fx-f) * 0.7rem); border: 0; border-radius: 999px; text-shadow: 0 2px 0 rgba(150, 20, 60, 0.3); animation: none;
  background: radial-gradient(130% 100% at 50% 0%, #ffc0d2 0%, #ff7aa2 40%, #f04f82 100%);
  box-shadow: inset 0 4px 0 rgba(255, 255, 255, 0.55), inset 0 -6px 0 rgba(150, 20, 60, 0.2), 0 calc(6px + var(--fx-f) * 4px) 0 #c93a66, 0 calc(12px + var(--fx-f) * 6px) 18px -8px rgba(201, 58, 102, 0.55);
  transition: translate 0.1s, box-shadow 0.1s; }
html.fx2[data-shell="fufett"] main .button::before, html.fx2[data-shell="fufett"] main .button::after { content: none; }
html.fx2.fx2-fufett[data-shell="fufett"] main .button:hover { translate: 0 -2px; filter: saturate(1.1); }
html.fx2.fx2-fufett[data-shell="fufett"] main :where(.button, button:not(.link):not(.tag):not(.dot)):active { translate: 0 4px; filter: brightness(0.96); }
html.fx2[data-shell="fufett"] main .button.secondary { color: #134d40; text-shadow: 0 2px 0 rgba(255, 255, 255, 0.45); background: radial-gradient(130% 100% at 50% 0%, #d4fbef 0%, #8be5cf 40%, #4fbea2 100%);
  box-shadow: inset 0 4px 0 rgba(255, 255, 255, 0.6), inset 0 -6px 0 rgba(20, 90, 70, 0.18), 0 calc(6px + var(--fx-f) * 4px) 0 #2f9a80, 0 calc(12px + var(--fx-f) * 6px) 18px -8px rgba(47, 154, 128, 0.5); }
html.fx2[data-shell="fufett"] main .button.secondary:nth-of-type(3n) { color: #5a3d00; background: radial-gradient(130% 100% at 50% 0%, #fff6c9 0%, #ffe07a 40%, #f7bf2f 100%);
  box-shadow: inset 0 4px 0 rgba(255, 255, 255, 0.6), inset 0 -6px 0 rgba(120, 80, 0, 0.18), 0 calc(6px + var(--fx-f) * 4px) 0 #c9901a, 0 calc(12px + var(--fx-f) * 6px) 18px -8px rgba(201, 144, 26, 0.5); }
html.fx2[data-shell="fufett"] main .button.secondary:nth-of-type(4n) { color: #fff; text-shadow: 0 2px 0 rgba(40, 20, 120, 0.3); background: radial-gradient(130% 100% at 50% 0%, #d9d2ff 0%, #a597ff 40%, #7a66ea 100%);
  box-shadow: inset 0 4px 0 rgba(255, 255, 255, 0.5), inset 0 -6px 0 rgba(40, 20, 120, 0.2), 0 calc(6px + var(--fx-f) * 4px) 0 #5643c4, 0 calc(12px + var(--fx-f) * 6px) 18px -8px rgba(86, 67, 196, 0.5); }
html.fx2[data-shell="fufett"] main :is(input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]), select, textarea) { border: 3px solid #ffd3df; border-radius: 18px; background: #fff; color: var(--fx-ink);
  box-shadow: inset 0 3px 0 #fff0f4; padding: 0.55rem 0.9rem; font-family: 'Arimo', sans-serif; }
html.fx2[data-shell="fufett"] main :is(input, select, textarea):focus { outline: 0; border-color: var(--fx-straw); box-shadow: 0 0 0 4px #ffe1ea; }
html.fx2[data-shell="fufett"] main .tag { background: #fff; color: var(--fx-choc); border: 0; border-radius: 999px; box-shadow: 0 3px 0 #ffc4d4; font-family: 'Fredoka', sans-serif; }
html.fx2[data-shell="fufett"] main .card { background: linear-gradient(#fffdf9, #fff5ec); border: 0; border-radius: 30px; rotate: none; box-shadow: inset 0 -5px 0 #ffe3cd, 0 8px 0 #ffd0dc, 0 16px 26px -14px rgba(90, 48, 34, 0.4); }
html.fx2[data-shell="fufett"] main table { border-collapse: separate; border-spacing: 0; background: #fff; border-radius: 22px; overflow: hidden; box-shadow: 0 0 0 4px #ffd3df, 0 8px 0 4px #ffb3c7; }
html.fx2[data-shell="fufett"] main th { background: linear-gradient(#ff9ab8, var(--fx-straw)); color: #fff; font-family: 'Fredoka', sans-serif; font-weight: 600; border: 0; }
html.fx2[data-shell="fufett"] main tr:nth-child(even) td { background: #fff7f0; }
html.fx2[data-shell="fufett"] main :is(th, td) { border-color: #ffe6d6; }
html.fx2[data-shell="fufett"] main .reader-bar { font-family: 'Fredoka', sans-serif; color: var(--fx-ink-soft); }
html.fx2[data-shell="fufett"] main .reader-bar :is(a, button) { color: #c2385f; }

/* Fuß: Schokoboden mit Streuseln */
html.fx2[data-shell="fufett"] footer { position: relative; z-index: 1; background-color: var(--fx-choc); color: #ffe2cc; border: 0; padding-top: 2.4rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='90'%3E%3Cg opacity='.55'%3E%3Crect x='14' y='20' width='13' height='4' rx='2' fill='%23ff8fb1' transform='rotate(-25 20 22)'/%3E%3Crect x='70' y='10' width='13' height='4' rx='2' fill='%2363cdb3' transform='rotate(35 76 12)'/%3E%3Crect x='110' y='50' width='13' height='4' rx='2' fill='%23ffd25e' transform='rotate(-55 116 52)'/%3E%3Crect x='40' y='62' width='13' height='4' rx='2' fill='%23fff' transform='rotate(20 46 64)'/%3E%3C/g%3E%3C/svg%3E"); }
html.fx2[data-shell="fufett"] footer::before { content: ''; position: absolute; left: 0; right: 0; top: -22px; height: 24px; pointer-events: none;
  background: radial-gradient(circle at 50% 100%, var(--fx-choc) 0 13px, rgba(0, 0, 0, 0) 14px) 0 0 / 30px 24px repeat-x; }
html.fx2[data-shell="fufett"] footer :is(a, span, .statusline) { color: #ffe2cc; font-family: 'Fredoka', sans-serif; }
html.fx2[data-shell="fufett"] footer a:hover { color: #fff; text-decoration-color: var(--fx-straw); }

/* Menüs und Fenster dieses Stils deckend, im Konditorei-Look */
html.fx2[data-shell="fufett"] :is(details.themer .menu, .navcmd .nc-list, .coach) { background: #fffaf3; color: var(--fx-ink); border: 3px solid #fff; border-radius: 22px; box-shadow: 0 8px 0 #ffc4d4, 0 26px 50px -18px rgba(90, 48, 34, 0.5); }

/* Ultra HD: Bühne „Schlaraffenland“ hinter einer etwas durchscheinenden Torte */
html.fx2.ultra-stage[data-shell="fufett"] { --u-base: #ffd7c4; --font: 'Arimo', 'Helvetica Neue', Arial, sans-serif; }
html.fx2.ultra-stage[data-shell="fufett"] body { background: #ffd7c4; }
html.fx2.ultra-stage[data-shell="fufett"] header.top { background: none; backdrop-filter: none; -webkit-backdrop-filter: none; border: 0; }
html.fx2.ultra-stage[data-shell="fufett"] main { background: rgba(255, 251, 244, 0.93); backdrop-filter: blur(10px) saturate(1.2); -webkit-backdrop-filter: blur(10px) saturate(1.2); border: 0; }
html.fx2.ultra-stage[data-shell="fufett"] main h1 { font-family: 'Fredoka', sans-serif; font-size: calc(2.9rem + var(--fx-f) * 0.5rem); color: var(--fx-choc); }
html.fx2.ultra-stage[data-shell="fufett"] main h2 { font-family: 'Fredoka', sans-serif; color: var(--fx-straw-d); margin-top: 2.4rem; }
html.fx2.ultra-stage[data-shell="fufett"] main h2::before { content: ''; width: calc(0.8em + var(--fx-f) * 0.25em); height: calc(0.8em + var(--fx-f) * 0.25em); margin-right: 0.45em; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #fff 0 12%, #ff9ab8 13%, var(--fx-straw-d) 75%); box-shadow: 0 3px 0 #a72b52; vertical-align: -0.06em; }
html.fx2.ultra-stage[data-shell="fufett"] main :is(p, li, td) { color: var(--fx-ink); }
html.fx2.ultra-stage[data-shell="fufett"] main a:not(.button):not(.card):not(.tag) { color: #c2385f; background: none; }
html.fx2.ultra-stage[data-shell="fufett"] main .button { border-radius: 999px; padding: calc(0.7rem + var(--fx-f) * 0.3rem) calc(1.35rem + var(--fx-f) * 0.7rem); font: 600 calc(1rem + var(--fx-f) * 0.12rem)/1.15 'Fredoka', sans-serif; }
html.fx2.ultra-stage[data-shell="fufett"] footer { background-color: var(--fx-choc); backdrop-filter: none; -webkit-backdrop-filter: none; border: 0; }
html.fx2.ultra-stage[data-shell="fufett"] footer, html.fx2.ultra-stage[data-shell="fufett"] footer a { color: #ffe2cc; }

/* Stufenanzeige in der Leiste: fünf Bonbons */
html.fx2[data-shell="fufett"] .fx-fat-dot { width: 16px; height: 16px; border-radius: 50%; background: #f3e2d6; box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.08); }
html.fx2[data-shell="fufett"] .fx-fat-dot.on { background: radial-gradient(circle at 35% 30%, #fff 0 15%, #ff9ab8 16%, #e2457a 80%); box-shadow: 0 2px 0 #a72b52; }
html.fx2[data-shell="fufett"] .fx-fat-lbl { margin-left: 4px; font-size: 13px; color: #7b5446; }
/* Überlast-Anzeige bei voller Stufe */
html.fx2[data-shell="fufett"][data-fx-fat="5"] .chrome .wintitle::after { content: '  ⚠ Überlast'; color: #ffd25e; }
@media (max-width: 760px) {
  html.fx2[data-shell="fufett"] main { margin: 2.6rem 10px 3.6rem; padding: 1.8rem 1.3rem 1.6rem; border-radius: 30px; }
  html.fx2[data-shell="fufett"] main h1 { font-size: calc(2.1rem + var(--fx-f) * 0.3rem); }
  html.fx2[data-shell="fufett"] main::before { left: 18px; right: 18px; }
  html.fx2[data-shell="fufett"] nav.main a { padding: 0.35rem 0.75rem; }
}
@media print { html.fx2[data-shell="fufett"] main { box-shadow: none !important; background: #fff !important; } html.fx2[data-shell="fufett"] main::before, html.fx2[data-shell="fufett"] footer::before, html.fx2[data-shell="fufett"] .topbar::after { display: none !important; } }

/* ================= COUGAR: erfundene 80er-Serie im Comic-Adventure-Stil ================= */
html.fx2[data-shell="fuclub"] {
  --cg-night: #24102f; --cg-velvet: #3a1340; --cg-velvet-d: #2a0d30; --cg-pink: #ff3d9a; --cg-pink-l: #ff8cc8; --cg-gold: #f5c84c; --cg-gold-d: #b8801c; --cg-cream: #fbeaf3; --cg-soft: #d9b8d6; --cg-red: #8e1238;
  --font: 'Inter', 'Helvetica Neue', Arial, sans-serif; --prompt: '♥'; --bg: var(--cg-night); --fg: var(--cg-cream); --muted: var(--cg-soft); --accent: var(--cg-pink); --line: rgba(245, 200, 76, 0.35);
  --soft: rgba(255, 255, 255, 0.06); --card: rgba(255, 255, 255, 0.05); color-scheme: dark; font-size: 16.5px;
  --fxd-font: 'Inter', sans-serif; --fxd-title-font: italic 500 18px/1.1 'Playfair Display', Georgia, serif; --fxd-bg: linear-gradient(160deg, #42154a, #24102f 70%); --fxd-fg: var(--cg-cream);
  --fxd-border: 2px solid var(--cg-gold); --fxd-radius: 14px; --fxd-shadow: 0 0 0 4px #24102f, 0 0 0 5px rgba(245, 200, 76, 0.6), 0 24px 50px -16px rgba(0, 0, 0, 0.8);
  --fxd-btn: linear-gradient(#fff3bf, #f5c84c 45%, #b8801c 55%, #f0c24a); --fxd-btn-fg: #2a0d30; --fxd-btn-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5), 0 3px 0 #6b4510; --fxd-btn-radius: 8px;
  --fxd-btn2: rgba(255, 61, 154, 0.12); --fxd-btn2-fg: var(--cg-pink-l); --fxd-btn2-shadow: inset 0 0 0 2px var(--cg-pink), 0 3px 0 #5e0a37; --fxd-soft: rgba(245, 200, 76, 0.25); --fxd-focus: var(--cg-pink);
  --fxd-input: #1b0a22; --fxd-input-fg: var(--cg-cream); }
html.fx2[data-shell="fuclub"] body { background-color: var(--cg-night); color: var(--cg-cream);
  background-image: radial-gradient(130% 90% at 50% 30%, rgba(36, 16, 47, 0.55) 0%, rgba(36, 16, 47, 0.92) 70%), url("fx-leopard.svg"); background-size: auto, 220px; background-attachment: fixed; }

/* Kopf: schwarzer Senderbalken, Leopardenband, Goldkante mit Neonlinie */
html.fx2[data-shell="fuclub"] header.top { background: none; border: 0; box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.7); }
html.fx2[data-shell="fuclub"] .chrome { background: linear-gradient(#2b2b2f, #0f0f12); color: var(--cg-gold); border: 0; box-shadow: inset 0 -1px 0 rgba(245, 200, 76, 0.4); }
html.fx2[data-shell="fuclub"] .chrome .wintitle { font: italic 500 14px/1 'Playfair Display', serif; letter-spacing: 0.04em; color: var(--cg-gold); }
html.fx2[data-shell="fuclub"] .chrome summary { color: var(--cg-gold); }
html.fx2[data-shell="fuclub"] .topbar { background: linear-gradient(rgba(36, 10, 30, 0.55), rgba(36, 10, 30, 0.78)), url("fx-leopard.svg") 0 0 / 180px; color: var(--cg-cream);
  border: 0; border-bottom: 3px solid var(--cg-gold); box-shadow: 0 3px 0 var(--cg-pink), 0 3px 14px rgba(255, 61, 154, 0.8); }
html.fx2[data-shell="fuclub"] .topbar :is(.brand, .brand a, .typed, .session a) { color: var(--cg-gold); text-shadow: 0 1px 0 #000; }
html.fx2[data-shell="fuclub"] .topbar .brand { font: italic 500 1.1rem/1.2 'Playfair Display', serif; }
html.fx2[data-shell="fuclub"] .topbar .term-open { color: var(--cg-gold); background: rgba(0, 0, 0, 0.45); border: 1px solid var(--cg-gold); border-radius: 6px; }
html.fx2[data-shell="fuclub"] nav.main { gap: 8px; }
html.fx2[data-shell="fuclub"] nav.main a { font: 600 0.92rem/1.1 'Inter', sans-serif; color: #2a0d30; text-transform: none; letter-spacing: 0.01em; padding: 0.45rem 0.95rem; border-radius: 6px;
  background: linear-gradient(#fff3bf, #f5c84c 45%, #c99024 55%, #f0c24a); border: 0; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.55), inset 0 0 0 3px rgba(107, 69, 16, 0.35), 0 3px 0 #5a3a0c, 0 6px 12px -4px rgba(0, 0, 0, 0.7); transition: box-shadow 0.15s, translate 0.15s; }
html.fx2[data-shell="fuclub"] nav.main a:hover { translate: 0 -1px; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.55), inset 0 0 0 3px rgba(107, 69, 16, 0.35), 0 3px 0 #5a3a0c, 0 0 18px rgba(255, 61, 154, 0.75); }
html.fx2[data-shell="fuclub"] nav.main a.active { color: #fff; background: linear-gradient(#ff7cbf, var(--cg-pink) 50%, #c4106c); text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5), 0 3px 0 #6d0a3d, 0 0 16px rgba(255, 61, 154, 0.9); }

/* Inhalt: Samtbildschirm mit Goldrahmen und Folgen-Banderole */
html.fx2[data-shell="fuclub"] main { position: relative; z-index: 1; color: var(--cg-cream); border-radius: 16px; margin-top: 3.2rem; margin-bottom: 3.6rem; padding: 2.8rem 2.7rem 2.4rem;
  background: radial-gradient(120% 80% at 50% 0%, #4a1a52 0%, var(--cg-velvet) 45%, var(--cg-velvet-d) 100%);
  border: 3px solid var(--cg-gold); box-shadow: inset 0 0 0 5px var(--cg-velvet-d), inset 0 0 0 6px rgba(245, 200, 76, 0.55), 0 0 0 4px #1b0a22, 0 0 0 5px rgba(255, 61, 154, 0.6), 0 30px 70px -20px rgba(0, 0, 0, 0.85); }
html.fx2[data-shell="fuclub"] main[data-fx-ep]::before { content: attr(data-fx-ep); position: absolute; top: -17px; left: 50%; translate: -50% 0; max-width: calc(100% - 60px); box-sizing: border-box;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 0.32rem 1.3rem 0.36rem; font: italic 500 0.98rem/1.2 'Playfair Display', Georgia, serif; color: #fff; letter-spacing: 0.02em;
  background: linear-gradient(#ff6fb6, var(--cg-pink) 55%, #c4106c); border: 2px solid var(--cg-gold); border-radius: 999px; box-shadow: 0 4px 0 #6d0a3d, 0 0 20px rgba(255, 61, 154, 0.7); pointer-events: none; }
html.fx2[data-shell="fuclub"] main :is(p, li, td, dd) { color: var(--cg-cream); line-height: 1.75; }
html.fx2[data-shell="fuclub"] main h1 { font: italic 500 3.1rem/1.1 'Playfair Display', Georgia, serif; letter-spacing: 0.005em; display: inline-block; padding-bottom: 0.06em; margin-bottom: 0.5rem;
  background: linear-gradient(180deg, #fff8d6 0%, #ffd54f 42%, #b87511 52%, #ffe28a 74%, #f5c84c 100%); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 2px 0 #6d0a3d) drop-shadow(0 0 14px rgba(255, 61, 154, 0.55)); animation: none; text-shadow: none; }
html.fx2[data-shell="fuclub"] main h1::before, html.fx2[data-shell="fuclub"] main h1::after { content: none; }
html.fx2[data-shell="fuclub"] main h2 { width: fit-content; max-width: 100%; box-sizing: border-box; font: italic 500 1.45rem/1.25 'Playfair Display', Georgia, serif; color: #fff; text-transform: none; letter-spacing: 0.01em;
  margin: 2.4rem 0 0.9rem; padding: 0.22rem 2.6rem 0.26rem 0.9rem; border: 0; border-left: 6px solid var(--cg-gold); border-radius: 0 999px 999px 0;
  background: linear-gradient(90deg, var(--cg-pink) 0%, #c4106c 65%, rgba(196, 16, 108, 0) 100%); text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35); }
html.fx2[data-shell="fuclub"] main h2::before { content: none; }
html.fx2[data-shell="fuclub"] main h3 { font: italic 500 1.2rem/1.3 'Playfair Display', serif; color: var(--cg-gold); }
html.fx2[data-shell="fuclub"] main a:not(.button):not(.card):not(.tag) { color: var(--cg-pink-l); text-decoration: underline; text-decoration-color: rgba(255, 140, 200, 0.4); text-underline-offset: 3px; background: none; }
html.fx2[data-shell="fuclub"] main a:not(.button):not(.card):not(.tag):hover { color: #fff; text-decoration-color: var(--cg-gold); text-shadow: 0 0 10px rgba(255, 61, 154, 0.9); }
html.fx2[data-shell="fuclub"] main ul > li { position: relative; list-style: none; }
html.fx2[data-shell="fuclub"] main ul > li::before { content: ''; position: absolute; left: -1.55em; top: 0.48em; margin: 0; display: block; width: 1.1em; height: 0.75em; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='16'%3E%3Cpath d='M1 8C4 2 8 1 12 4C16 1 20 2 23 8C19 14 15 15 12 15C9 15 5 14 1 8Z' fill='%23ff3d9a'/%3E%3Cpath d='M3 8C7 9 9 9 12 8.5C15 9 17 9 21 8' fill='none' stroke='%238a0b4f' stroke-width='1.2'/%3E%3Cellipse cx='8' cy='5' rx='2' ry='1' fill='%23fff' opacity='.6'/%3E%3C/svg%3E") center / contain no-repeat; rotate: -8deg; }
html.fx2[data-shell="fuclub"] main ul > li:nth-child(even)::before { rotate: 10deg; }
html.fx2[data-shell="fuclub"] main :is(blockquote, pre) { background: rgba(0, 0, 0, 0.28); border: 1px solid rgba(245, 200, 76, 0.35); border-radius: 10px; }
html.fx2[data-shell="fuclub"] main code { background: rgba(255, 61, 154, 0.14); color: #ffd0ea; border-radius: 5px; }
html.fx2[data-shell="fuclub"] main hr { border: 0; height: 2px; background: linear-gradient(90deg, transparent, var(--cg-gold), transparent); }
html.fx2[data-shell="fuclub"] main .reader-bar { color: var(--cg-soft); }
html.fx2[data-shell="fuclub"] main .reader-bar :is(a, button) { color: var(--cg-gold); }

/* Knöpfe: goldene Chromknöpfe, Zweitknöpfe im Leopardenfell */
html.fx2.fx2-fuclub[data-shell="fuclub"] main :where(.button, button:not(.link):not(.tag):not(.dot), input[type="submit"]) { font: 700 0.95rem/1.15 'Inter', sans-serif; letter-spacing: 0.02em; color: #2a0d30;
  padding: 0.7rem 1.4rem; border: 0; border-radius: 8px; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6); animation: none;
  background: linear-gradient(#fff3bf, #f5c84c 45%, #c99024 55%, #f0c24a);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.6), inset 0 0 0 3px rgba(107, 69, 16, 0.3), 0 4px 0 #5a3a0c, 0 10px 20px -8px rgba(0, 0, 0, 0.8); transition: translate 0.12s, box-shadow 0.12s; }
html.fx2.fx2-fuclub[data-shell="fuclub"] main .button::before, html.fx2.fx2-fuclub[data-shell="fuclub"] main .button::after { content: none; }
html.fx2.fx2-fuclub[data-shell="fuclub"] main .button:hover { translate: 0 -2px; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.6), inset 0 0 0 3px rgba(107, 69, 16, 0.3), 0 4px 0 #5a3a0c, 0 0 22px rgba(255, 61, 154, 0.85); }
html.fx2.fx2-fuclub[data-shell="fuclub"] main :where(.button, button:not(.link):not(.tag):not(.dot)):active { translate: 0 3px; filter: brightness(0.95); }
html.fx2.fx2-fuclub[data-shell="fuclub"] main .button.secondary { color: #2a0d30; text-shadow: 0 1px 0 rgba(255, 230, 190, 0.8);
  background: linear-gradient(rgba(255, 238, 205, 0.35), rgba(255, 238, 205, 0.15)), url("fx-leopard.svg") 0 0 / 120px; box-shadow: inset 0 0 0 2px #2a0d30, inset 0 0 0 4px rgba(255, 255, 255, 0.35), 0 4px 0 #2a0d30, 0 10px 20px -8px rgba(0, 0, 0, 0.8); }
html.fx2[data-shell="fuclub"] main :is(input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]), select, textarea) { background: #1b0a22; color: var(--cg-cream); border: 2px solid rgba(245, 200, 76, 0.55); border-radius: 8px; padding: 0.5rem 0.8rem; }
html.fx2[data-shell="fuclub"] main :is(input, select, textarea):focus { outline: 0; border-color: var(--cg-pink); box-shadow: 0 0 0 3px rgba(255, 61, 154, 0.35); }
html.fx2[data-shell="fuclub"] main .tag { background: rgba(255, 61, 154, 0.14); color: var(--cg-pink-l); border: 1px solid rgba(255, 61, 154, 0.5); border-radius: 999px; }
html.fx2[data-shell="fuclub"] main .card { background: linear-gradient(160deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02)); border: 1px solid rgba(245, 200, 76, 0.45); border-radius: 12px; rotate: none; box-shadow: 0 14px 30px -18px #000; }
html.fx2[data-shell="fuclub"] main .card:hover { box-shadow: 0 0 0 1px var(--cg-gold), 0 0 24px rgba(255, 61, 154, 0.45); }
html.fx2[data-shell="fuclub"] main table { border-collapse: separate; border-spacing: 0; background: rgba(0, 0, 0, 0.22); border: 1px solid rgba(245, 200, 76, 0.5); border-radius: 10px; overflow: hidden; }
html.fx2[data-shell="fuclub"] main th { background: linear-gradient(#5a1d62, #3a1340); color: var(--cg-gold); font: italic 500 1rem/1.3 'Playfair Display', serif; border-color: rgba(245, 200, 76, 0.3); }
html.fx2[data-shell="fuclub"] main :is(th, td) { border-color: rgba(245, 200, 76, 0.18); }
html.fx2[data-shell="fuclub"] main tr:nth-child(even) td { background: rgba(255, 255, 255, 0.03); }

/* Fuß: Samtvorhang mit Goldfransen */
html.fx2[data-shell="fuclub"] footer { position: relative; z-index: 1; color: var(--cg-gold); border: 0; padding-top: 2.2rem;
  background: linear-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.45)), repeating-linear-gradient(90deg, #5a0824 0 10px, #8e1238 22px, #b01d48 28px, #8e1238 34px, #5a0824 46px); }
html.fx2[data-shell="fuclub"] footer::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 12px; pointer-events: none;
  background: linear-gradient(var(--cg-gold), #b8801c) 0 0 / 100% 4px no-repeat, repeating-linear-gradient(90deg, var(--cg-gold) 0 2px, transparent 2px 6px) 0 4px / 100% 8px no-repeat; }
html.fx2[data-shell="fuclub"] footer :is(a, span, .statusline) { color: var(--cg-gold); }
html.fx2[data-shell="fuclub"] footer a:hover { color: #fff; text-shadow: 0 0 10px var(--cg-pink); }
html.fx2[data-shell="fuclub"] :is(details.themer .menu, .navcmd .nc-list, .coach) { background: #24102f; color: var(--cg-cream); border: 2px solid var(--cg-gold); border-radius: 12px; box-shadow: 0 0 0 4px #1b0a22, 0 30px 60px -20px #000; }

/* Ultra HD: die Bühne ist die jeweilige Episode, die Inhaltsfläche bleibt deckend (sie ist der „Busch“) */
html.fx2.ultra-stage[data-shell="fuclub"] { --u-base: #24102f; --font: 'Inter', 'Helvetica Neue', Arial, sans-serif; }
html.fx2.ultra-stage[data-shell="fuclub"] body { background: #24102f; }
html.fx2.ultra-stage[data-shell="fuclub"] header.top { backdrop-filter: none; -webkit-backdrop-filter: none; }
html.fx2.ultra-stage[data-shell="fuclub"] main { backdrop-filter: none; -webkit-backdrop-filter: none; border: 3px solid var(--cg-gold); border-radius: 16px; padding: 2.8rem 2.7rem 2.4rem;
  background: radial-gradient(120% 80% at 50% 0%, #4a1a52 0%, var(--cg-velvet) 45%, var(--cg-velvet-d) 100%);
  box-shadow: inset 0 0 0 5px var(--cg-velvet-d), inset 0 0 0 6px rgba(245, 200, 76, 0.55), 0 0 0 4px #1b0a22, 0 0 0 5px rgba(255, 61, 154, 0.6), 0 30px 70px -20px rgba(0, 0, 0, 0.85); }
html.fx2.ultra-stage[data-shell="fuclub"] main h1 { font: italic 500 3.1rem/1.1 'Playfair Display', Georgia, serif; color: transparent;
  background: linear-gradient(180deg, #fff8d6 0%, #ffd54f 42%, #b87511 52%, #ffe28a 74%, #f5c84c 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
html.fx2.ultra-stage[data-shell="fuclub"] main h2 { font: italic 500 1.45rem/1.25 'Playfair Display', Georgia, serif; color: #fff; margin-top: 2.4rem; }
html.fx2.ultra-stage[data-shell="fuclub"] main h2::before { content: none; }
html.fx2.ultra-stage[data-shell="fuclub"] main :is(p, li, td) { color: var(--cg-cream); }
html.fx2.ultra-stage[data-shell="fuclub"] :is(.page h1 + p, .page .reader-bar + p) { color: #f3dcef; }
html.fx2.ultra-stage[data-shell="fuclub"] main a:not(.button):not(.card):not(.tag) { color: var(--cg-pink-l); background: none; }
html.fx2.ultra-stage[data-shell="fuclub"] main .button { border-radius: 8px; padding: 0.7rem 1.4rem; font: 700 0.95rem/1.15 'Inter', sans-serif; }
html.fx2.ultra-stage[data-shell="fuclub"] footer { backdrop-filter: none; -webkit-backdrop-filter: none; border: 0;
  background: linear-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.45)), repeating-linear-gradient(90deg, #5a0824 0 10px, #8e1238 22px, #b01d48 28px, #8e1238 34px, #5a0824 46px); }
html.fx2.ultra-stage[data-shell="fuclub"] footer, html.fx2.ultra-stage[data-shell="fuclub"] footer a { color: var(--cg-gold); }

/* Cougar: Leiste oben im rechten Rand, unten spielen die Figuren */
html.fx2[data-shell="fuclub"] .fx-dock label { color: var(--cg-gold); }
html.fx2[data-shell="fuclub"] .fx-dock .cg-more { width: 100%; border-top: 1px solid rgba(245, 200, 76, 0.3); padding-top: 6px; }
html.fx2[data-shell="fuclub"] .fx-dock .cg-more > summary { cursor: pointer; font-size: 13px; color: var(--cg-gold); padding: 4px 0; }
html.fx2[data-shell="fuclub"] .fx-dock .cg-more[open] { display: flex; flex-direction: column; gap: 8px; }
html.fx2[data-shell="fuclub"] .fx-dock .cg-row { display: flex; flex-wrap: wrap; gap: 6px; }
html.fx2[data-shell="fuclub"] .fx-dock .cg-row .fx-btn { width: auto; min-height: 32px; padding: 5px 10px; font-size: 13px; }
html.fx2[data-shell="fuclub"] .fx-dock .cg-tgl[aria-pressed="true"] { background: var(--cg-pink); color: #fff; box-shadow: 0 0 12px rgba(255, 61, 154, 0.7); }
@media (min-width: 1420px) { html.fx2[data-shell="fuclub"] .fx-dock { top: 96px; max-height: calc(100vh - 120px); overflow: hidden auto; } }

/* Knöpfe in Tabellen (z. B. Kopierknöpfe bei Software) bleiben kompakt */
html.fx2.fx2-fufett[data-shell="fufett"] main :is(td, th) :where(.button, button:not(.link):not(.tag):not(.dot)) { padding: 0.3rem 0.75rem; font-size: 0.82rem; box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.5), 0 3px 0 #c93a66; }
html.fx2.fx2-fuclub[data-shell="fuclub"] main :is(td, th) :where(.button, button:not(.link):not(.tag):not(.dot)) { padding: 0.28rem 0.7rem; font-size: 0.8rem; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5), 0 2px 0 #5a3a0c; }

/* Schmale Bildschirme: Inhaltsfläche mit Rand ohne Überlauf, Tabellen wieder waagrecht scrollbar, Überschrift nicht breiter als die Fläche */
@media (max-width: 760px) {
  html.fx2 main { width: auto !important; box-sizing: border-box; }
  html.fx2[data-shell="fufett"] main h1 { scale: 1 1; max-width: 100%; overflow-wrap: anywhere; }
}
@media (max-width: 640px) { html.fx2 main .page table, html.fx2 main table { display: block !important; overflow-x: auto !important; max-width: 100%; } }

/* Vorspann der Serie (Overlay, per Klick oder Esc überspringbar) */
.cg-intro { position: fixed; inset: 0; z-index: 95; display: grid; place-items: center; overflow: hidden; cursor: pointer; background: #12061a; color: #fff; text-align: center; }
.cg-intro canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.cg-intro .cg-card { position: relative; padding: 0 24px; }
.cg-intro .cg-pre { font: 600 clamp(14px, 2vw, 20px)/1.2 'Inter', sans-serif; letter-spacing: 0.4em; text-transform: uppercase; color: #ffb3dc; opacity: 0; animation: cg-in 0.6s 0.2s forwards; }
.cg-intro .cg-name { font: italic 500 clamp(64px, 13vw, 190px)/0.95 'Playfair Display', Georgia, serif; margin: 0.1em 0 0.05em; padding: 0 0.1em 0.1em;
  background: linear-gradient(180deg, #fff8d6 0%, #ffd54f 42%, #b87511 52%, #ffe28a 74%, #f5c84c 100%); -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 5px 0 #6d0a3d) drop-shadow(0 0 30px rgba(255, 61, 154, 0.8)); opacity: 0; animation: cg-zoom 0.9s 0.5s cubic-bezier(0.2, 1.4, 0.4, 1) forwards; }
.cg-intro .cg-ep { font: italic 500 clamp(20px, 3.2vw, 38px)/1.2 'Playfair Display', serif; color: #fff; text-shadow: 0 0 18px #ff3d9a; opacity: 0; animation: cg-in 0.6s 1.6s forwards; }
.cg-intro .cg-cast { margin-top: 1.4em; font: 500 clamp(13px, 1.6vw, 17px)/1.5 'Inter', sans-serif; color: #f5c84c; letter-spacing: 0.08em; opacity: 0; animation: cg-in 0.6s 2.6s forwards; }
.cg-intro .cg-skip { position: absolute; right: 18px; bottom: 16px; font: 500 13px/1 'Inter', sans-serif; color: rgba(255, 255, 255, 0.6); }
@keyframes cg-in { from { opacity: 0; translate: 0 14px; } to { opacity: 1; translate: 0 0; } }
@keyframes cg-zoom { from { opacity: 0; scale: 2.4; rotate: -8deg; } to { opacity: 1; scale: 1; rotate: -4deg; } }
html[data-hide~="fx"] .cg-intro * { animation: none !important; opacity: 1 !important; }
@media (prefers-reduced-motion: reduce) { .cg-intro * { animation: none !important; opacity: 1 !important; } }

@media (max-width: 760px) {
  html.fx2[data-shell="fuclub"] main { margin: 2.6rem 10px 3rem; padding: 2.2rem 1.25rem 1.6rem; }
  html.fx2[data-shell="fuclub"] main h1 { font-size: 2.2rem; }
  html.fx2[data-shell="fuclub"] main h2 { font-size: 1.2rem; padding-right: 1.6rem; }
  html.fx2[data-shell="fuclub"] main[data-fx-ep]::before { font-size: 0.85rem; }
}
@media print { html.fx2[data-shell="fuclub"] main { background: #fff !important; color: #000 !important; box-shadow: none !important; border: 0 !important; } html.fx2[data-shell="fuclub"] main[data-fx-ep]::before { display: none !important; } html.fx2[data-shell="fuclub"] main h1 { color: #000 !important; -webkit-text-fill-color: #000 !important; background: none !important; filter: none !important; } }

/* ================= HAARIG: erfundene Fluglinie „Hairlines“, die Knöpfe sind die Hauptfiguren ================= */
html.fx2[data-shell="fuhaar"] {
  --hl-navy: #0f2a4d; --hl-navy-d: #0a1d36; --hl-sky: #5fb4ff; --hl-sky-l: #dff0ff; --hl-gold: #ffc94a; --hl-coral: #ff6b5a; --hl-ink: #172338; --hl-soft: #5a6b84; --hl-scalp: #f3d3b6; --hl-scalp-d: #d9a983;
  --hc: #8a5a2c; --hc2: #5c3a1a;
  --font: 'Inter', 'Helvetica Neue', Arial, sans-serif; --prompt: '✈'; --bg: #eef6ff; --fg: var(--hl-ink); --muted: var(--hl-soft); --accent: var(--hl-coral); --line: #cfe0f5; --soft: #e8f2ff; --card: #fff; font-size: 16.5px; color-scheme: light;
  --fxd-font: 'Inter', sans-serif; --fxd-title-font: 800 15px/1.1 'Inter', sans-serif; --fxd-bg: linear-gradient(#13345e, var(--hl-navy-d)); --fxd-fg: #fff; --fxd-border: 2px solid var(--hl-gold); --fxd-radius: 16px;
  --fxd-shadow: 0 20px 40px -18px rgba(10, 29, 54, 0.8); --fxd-btn: var(--hl-gold); --fxd-btn-fg: var(--hl-navy-d); --fxd-btn-shadow: 0 3px 0 #b8861c; --fxd-btn-radius: 10px;
  --fxd-btn2: rgba(255, 255, 255, 0.1); --fxd-btn2-fg: #fff; --fxd-btn2-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.45); --fxd-soft: rgba(255, 255, 255, 0.15); --fxd-focus: var(--hl-gold); }
html.fx2[data-shell="fuhaar"] body { background-color: #eef6ff; color: var(--hl-ink); background-attachment: fixed;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='260'%3E%3Cpath d='M-20 220 Q160 40 440 120' fill='none' stroke='%239cc7f0' stroke-width='2' stroke-dasharray='6 9'/%3E%3Cg fill='%237fb2e6' transform='translate(300 92) rotate(18)'%3E%3Cpath d='M0 -3 L22 -3 L30 0 L22 3 L0 3Z'/%3E%3Cpath d='M10 -3 L4 -14 L8 -14 L18 -3Z'/%3E%3Cpath d='M10 3 L4 14 L8 14 L18 3Z'/%3E%3Cpath d='M0 -2 L-4 -8 L-1 -8 L4 -2Z'/%3E%3C/g%3E%3C/svg%3E"),
    linear-gradient(#cfe7ff, #eef6ff 420px); }

/* Kopf: Abflugtafel */
html.fx2[data-shell="fuhaar"] header.top { background: none; border: 0; box-shadow: 0 10px 24px -14px rgba(10, 29, 54, 0.6); }
html.fx2[data-shell="fuhaar"] .chrome { background: var(--hl-navy-d); color: #cfe0f5; border: 0; }
html.fx2[data-shell="fuhaar"] .chrome .wintitle { font: 700 12px/1 'Inter', sans-serif; letter-spacing: 0.18em; text-transform: uppercase; color: var(--hl-gold); }
html.fx2[data-shell="fuhaar"] .chrome summary { color: #cfe0f5; }
html.fx2[data-shell="fuhaar"] .topbar { background: linear-gradient(#232a36, #171c25); color: #fff; border: 0; border-bottom: 4px solid var(--hl-gold); }
html.fx2[data-shell="fuhaar"] .topbar :is(.brand, .brand a, .typed, .session a) { color: var(--hl-gold); font-family: 'JetBrains Mono', ui-monospace, monospace; }
html.fx2[data-shell="fuhaar"] .topbar .term-open { color: var(--hl-gold); background: #0d1118; border: 1px solid #3a4352; border-radius: 4px; }
html.fx2[data-shell="fuhaar"] nav.main { gap: 6px; }
html.fx2[data-shell="fuhaar"] nav.main a { position: relative; font: 700 0.92rem/1 'JetBrains Mono', ui-monospace, monospace; letter-spacing: 0.06em; text-transform: uppercase; color: #f3f6fb;
  padding: 0.55rem 0.7rem; border-radius: 4px; border: 0; background: linear-gradient(#2f3746 0 49%, #0b0e14 49% 51%, #252c39 51% 100%); box-shadow: inset 0 0 0 1px #3b4454, 0 2px 0 #06080c; }
html.fx2[data-shell="fuhaar"] nav.main a.active { color: var(--hl-navy-d); background: linear-gradient(#ffd977 0 49%, #8a6a12 49% 51%, #ffc94a 51% 100%); box-shadow: inset 0 0 0 1px #fff2c4, 0 2px 0 #06080c; }
html.fx2[data-shell="fuhaar"] nav.main a:hover { color: var(--hl-gold); }
html.fx2[data-shell="fuhaar"] nav.main a.active:hover { color: var(--hl-navy-d); }

/* Inhalt: Bordkarte mit Kopfband und Perforation */
html.fx2[data-shell="fuhaar"] main { position: relative; z-index: 1; background: #fff; color: var(--hl-ink); border: 0; border-radius: 22px; margin-top: 3rem; margin-bottom: 3.6rem; padding: 5.4rem 2.8rem 2.6rem;
  box-shadow: 0 2px 0 #dbe7f5, 0 30px 60px -28px rgba(15, 42, 77, 0.45); }
html.fx2[data-shell="fuhaar"] main[data-hl-pass]::before { content: attr(data-hl-pass); position: absolute; left: 0; right: 0; top: 0; height: 3.2rem; box-sizing: border-box; padding: 0 2.8rem; display: flex; align-items: center;
  border-radius: 22px 22px 0 0; background: linear-gradient(90deg, var(--hl-navy) 0%, #1c4a85 100%); color: #fff; font: 700 0.82rem/1.2 'JetBrains Mono', ui-monospace, monospace; letter-spacing: 0.08em; text-transform: uppercase;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; pointer-events: none; }
html.fx2[data-shell="fuhaar"] main::after { content: ''; position: absolute; left: 18px; right: 18px; top: 3.9rem; height: 0; border-top: 2px dashed #cfe0f5; pointer-events: none; }
html.fx2[data-shell="fuhaar"] main :is(p, li, td, dd) { color: var(--hl-ink); line-height: 1.75; }
html.fx2[data-shell="fuhaar"] main h1 { font: 800 2.8rem/1.1 'Inter', sans-serif; letter-spacing: -0.02em; color: var(--hl-navy); background: none; -webkit-text-fill-color: currentColor; animation: none; text-shadow: none; }
html.fx2[data-shell="fuhaar"] main h1::before, html.fx2[data-shell="fuhaar"] main h1::after { content: none; }
html.fx2[data-shell="fuhaar"] main h2 { font: 800 1.45rem/1.3 'Inter', sans-serif; color: var(--hl-navy); margin-top: 2.4rem; padding: 0; border: 0; background: none; text-transform: none; letter-spacing: -0.01em; }
html.fx2[data-shell="fuhaar"] main h2::before { content: '✈'; display: inline-block; margin-right: 0.5em; color: var(--hl-coral); rotate: -20deg; font-size: 0.9em; }
html.fx2[data-shell="fuhaar"] main h3 { color: var(--hl-navy); }
html.fx2[data-shell="fuhaar"] main a:not(.button):not(.card):not(.tag) { color: #1f6fd1; text-decoration: underline; text-decoration-color: rgba(31, 111, 209, 0.35); text-underline-offset: 3px; background: none; }
html.fx2[data-shell="fuhaar"] main a:not(.button):not(.card):not(.tag):hover { text-decoration-color: var(--hl-coral); }
html.fx2[data-shell="fuhaar"] main ul > li { position: relative; list-style: none; }
html.fx2[data-shell="fuhaar"] main ul > li::before { content: ''; position: absolute; left: -1.3em; top: 0.62em; margin: 0; display: block; width: 0.55em; height: 0.55em; border-radius: 50%; background: var(--hl-sky); box-shadow: 0 0 0 3px #dff0ff; }
html.fx2[data-shell="fuhaar"] main :is(blockquote, pre) { background: #f2f7fd; border: 1px solid #dbe7f5; border-radius: 12px; }
html.fx2[data-shell="fuhaar"] main .tag { background: #eef6ff; color: var(--hl-navy); border: 1px solid #cfe0f5; border-radius: 6px; font-family: 'JetBrains Mono', monospace; }
html.fx2[data-shell="fuhaar"] main .card { background: #fff; border: 1px solid #dbe7f5; border-radius: 16px; rotate: none; box-shadow: 0 12px 28px -20px rgba(15, 42, 77, 0.5); }
html.fx2[data-shell="fuhaar"] main table { border-collapse: separate; border-spacing: 0; border: 1px solid #dbe7f5; border-radius: 12px; overflow: hidden; background: #fff; }
html.fx2[data-shell="fuhaar"] main th { background: var(--hl-navy); color: #fff; font-family: 'JetBrains Mono', monospace; font-size: 0.82rem; letter-spacing: 0.06em; text-transform: uppercase; border-color: #1c4a85; }
html.fx2[data-shell="fuhaar"] main tr:nth-child(even) td { background: #f6faff; }
html.fx2[data-shell="fuhaar"] main :is(input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]), select, textarea) { border: 2px solid #cfe0f5; border-radius: 10px; background: #fff; color: var(--hl-ink); padding: 0.5rem 0.8rem; }

/* Knöpfe als Köpfe: Kopfhaut mit Glanz, darüber Haare je Stufe (data-hair 0 bis 5) und Farbe (--hc) */
html.fx2.fx2-fuhaar[data-shell="fuhaar"] main :where(.button, button:not(.link):not(.tag):not(.dot), input[type="submit"]) { position: relative; font: 700 0.95rem/1.15 'Inter', sans-serif; color: var(--hl-navy-d);
  padding: 0.72rem 1.4rem; border: 0; border-radius: 999px 999px 18px 18px; text-shadow: none; animation: none; overflow: visible;
  background: radial-gradient(60% 50% at 40% 18%, rgba(255, 255, 255, 0.75) 0%, rgba(255, 255, 255, 0) 60%), linear-gradient(#f7dcc3, var(--hl-scalp) 45%, var(--hl-scalp-d));
  box-shadow: inset 0 -3px 0 rgba(150, 90, 50, 0.25), 0 4px 0 #b9875f, 0 10px 18px -10px rgba(90, 50, 20, 0.6); transition: translate 0.15s, opacity 0.5s, scale 0.5s; }
html.fx2.fx2-fuhaar[data-shell="fuhaar"] main .button::after { content: none; }
html.fx2.fx2-fuhaar[data-shell="fuhaar"] main .button:hover { translate: 0 -2px; }
html.fx2.fx2-fuhaar[data-shell="fuhaar"] main .button.secondary { color: var(--hl-navy-d); }
html.fx2.fx2-fuhaar[data-shell="fuhaar"] main :is(td, th) :where(.button, button:not(.link):not(.tag):not(.dot)) { padding: 0.3rem 0.8rem; font-size: 0.8rem; box-shadow: 0 2px 0 #b9875f; }
html.fx2[data-shell="fuhaar"] nav.main a[data-hair] { overflow: visible; }
html.fx2[data-shell="fuhaar"] [data-hair] { isolation: isolate; }
html.fx2[data-shell="fuhaar"] [data-hair]::before { content: ''; position: absolute; left: 6%; right: 6%; bottom: calc(100% - 6px); height: 0; pointer-events: none; z-index: 1;
  background: repeating-linear-gradient(78deg, var(--hc) 0 2px, var(--hc2) 2px 3px, var(--hc) 3px 5px); -webkit-mask: var(--hm) center bottom / 100% 100% no-repeat; mask: var(--hm) center bottom / 100% 100% no-repeat;
  filter: drop-shadow(0 1px 0 rgba(0, 0, 0, 0.25)); transition: height 0.9s cubic-bezier(0.3, 1.5, 0.5, 1); }
html.fx2[data-shell="fuhaar"] [data-hair="1"]::before { --hm: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none' fill='white'%3E%3Cpath d='M38 40 C38 30 44 26 50 26 C56 26 62 30 62 40Z'/%3E%3Cpath d='M44 27 C46 22 50 21 52 24' stroke='white' stroke-width='3' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); height: 12px; }
html.fx2[data-shell="fuhaar"] [data-hair="2"]::before { --hm: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none' fill='white'%3E%3Ccircle cx='6' cy='38' r='1.6'/%3E%3Ccircle cx='11' cy='37' r='1.6'/%3E%3Ccircle cx='16' cy='36' r='1.6'/%3E%3Ccircle cx='21' cy='39' r='1.6'/%3E%3Ccircle cx='26' cy='38' r='1.6'/%3E%3Ccircle cx='31' cy='37' r='1.6'/%3E%3Ccircle cx='36' cy='36' r='1.6'/%3E%3Ccircle cx='41' cy='39' r='1.6'/%3E%3Ccircle cx='46' cy='38' r='1.6'/%3E%3Ccircle cx='51' cy='37' r='1.6'/%3E%3Ccircle cx='56' cy='36' r='1.6'/%3E%3Ccircle cx='61' cy='39' r='1.6'/%3E%3Ccircle cx='66' cy='38' r='1.6'/%3E%3Ccircle cx='71' cy='37' r='1.6'/%3E%3Ccircle cx='76' cy='36' r='1.6'/%3E%3Ccircle cx='81' cy='39' r='1.6'/%3E%3Ccircle cx='86' cy='38' r='1.6'/%3E%3Ccircle cx='91' cy='37' r='1.6'/%3E%3Ccircle cx='16' cy='34' r='1.4'/%3E%3Ccircle cx='22' cy='32' r='1.4'/%3E%3Ccircle cx='28' cy='34' r='1.4'/%3E%3Ccircle cx='34' cy='32' r='1.4'/%3E%3Ccircle cx='40' cy='34' r='1.4'/%3E%3Ccircle cx='46' cy='32' r='1.4'/%3E%3Ccircle cx='52' cy='34' r='1.4'/%3E%3Ccircle cx='58' cy='32' r='1.4'/%3E%3Ccircle cx='64' cy='34' r='1.4'/%3E%3Ccircle cx='70' cy='32' r='1.4'/%3E%3Ccircle cx='76' cy='34' r='1.4'/%3E%3Ccircle cx='82' cy='32' r='1.4'/%3E%3Ccircle cx='88' cy='34' r='1.4'/%3E%3C/svg%3E"); height: 9px; }
html.fx2[data-shell="fuhaar"] [data-hair="3"]::before { --hm: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none' fill='white'%3E%3Cpath d='M2 40 C2 26 22 22 50 22 C78 22 98 26 98 40 C90 36 84 37 78 39 C72 35 66 36 60 39 C54 35 46 35 40 39 C34 35 28 36 22 39 C16 36 10 36 2 40Z'/%3E%3C/svg%3E"); height: 14px; }
html.fx2[data-shell="fuhaar"] [data-hair="4"]::before { --hm: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none' fill='white'%3E%3Cpath d='M4 40 C2 24 20 18 40 18 C52 6 76 2 92 10 C86 12 84 16 88 20 C96 24 98 32 96 40 C88 35 80 36 74 39 C66 34 56 34 48 39 C40 34 30 35 22 39 C16 35 10 36 4 40Z'/%3E%3C/svg%3E"); height: 22px; left: 2%; right: 2%; }
html.fx2[data-shell="fuhaar"] [data-hair="5"]::before { --hm: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none' fill='white'%3E%3Cpath d='M0 40 C-2 18 18 4 50 4 C82 4 102 18 100 40 C92 30 86 30 80 36 C74 28 66 28 60 36 C54 28 46 28 40 36 C34 28 26 28 20 36 C14 30 8 30 0 40Z'/%3E%3C/svg%3E"); height: 26px; left: -8%; right: -8%; }
html.fx2[data-shell="fuhaar"] [data-hair="5"]::after { content: '' !important; position: absolute; left: -12%; right: -12%; top: 4px; height: 165%; pointer-events: none; z-index: -1;
  background: repeating-linear-gradient(95deg, var(--hc) 0 2px, var(--hc2) 2px 3px, var(--hc) 3px 6px); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none' fill='white'%3E%3Cpath d='M0 0 C10 0 16 10 14 30 C12 50 18 70 10 100 C4 80 -2 60 2 40 C4 24 -2 10 0 0Z'/%3E%3Cpath d='M100 0 C90 0 84 10 86 30 C88 50 82 70 90 100 C96 80 102 60 98 40 C96 24 102 10 100 0Z'/%3E%3C/svg%3E") center top / 100% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none' fill='white'%3E%3Cpath d='M0 0 C10 0 16 10 14 30 C12 50 18 70 10 100 C4 80 -2 60 2 40 C4 24 -2 10 0 0Z'/%3E%3Cpath d='M100 0 C90 0 84 10 86 30 C88 50 82 70 90 100 C96 80 102 60 98 40 C96 24 102 10 100 0Z'/%3E%3C/svg%3E") center top / 100% 100% no-repeat; }
html.fx2[data-shell="fuhaar"] [data-hc="blond"] { --hc: #f2cf6b; --hc2: #c99a2e; } html.fx2[data-shell="fuhaar"] [data-hc="rot"] { --hc: #d2502a; --hc2: #8f2a10; }
html.fx2[data-shell="fuhaar"] [data-hc="braun"] { --hc: #8a5a2c; --hc2: #5c3a1a; } html.fx2[data-shell="fuhaar"] [data-hc="schwarz"] { --hc: #2b2424; --hc2: #000; }
html.fx2[data-shell="fuhaar"] [data-hc="grau"] { --hc: #d6d6d6; --hc2: #9a9a9a; } html.fx2[data-shell="fuhaar"] [data-hc="glam"] { --hc: #ff5fa8; --hc2: #7a3cff; }
html.fx2[data-shell="fuhaar"] [data-hc="glam"]::before, html.fx2[data-shell="fuhaar"] [data-hc="glam"]::after { background: linear-gradient(90deg, #ff5fa8, #ffcf4a, #3fd0ff, #b06bff) !important; }
/* Abflug und Landung */
html.fx2[data-shell="fuhaar"] .hl-away { opacity: 0 !important; scale: 0.4 !important; translate: 40px -60px !important; transition: opacity 0.45s, scale 0.45s, translate 0.45s !important; }
html.fx2[data-shell="fuhaar"] .hl-land { animation: hl-land 0.9s cubic-bezier(0.2, 1.6, 0.4, 1); }
@keyframes hl-land { 0% { opacity: 0; translate: -50px -70px; scale: 0.4; } 60% { opacity: 1; translate: 0 4px; scale: 1.06 0.92; } 100% { translate: 0 0; scale: 1; } }
html[data-hide~="fx"] .hl-land { animation: none; }
.hl-plane { position: fixed; z-index: 45; font-size: 44px; pointer-events: none; filter: drop-shadow(0 6px 6px rgba(0, 0, 0, 0.25)); }
.hl-strand { position: fixed; z-index: 45; width: 26px; height: 26px; pointer-events: none; }

/* Fuß: Rollfeld */
html.fx2[data-shell="fuhaar"] footer { position: relative; z-index: 1; background: #2b3240; color: #e8eef7; border: 0; padding-top: 2rem;
  background-image: linear-gradient(90deg, #ffc94a 0 40px, transparent 40px 80px); background-size: 80px 4px; background-repeat: repeat-x; background-position: 0 10px; }
html.fx2[data-shell="fuhaar"] footer :is(a, span, .statusline) { color: #e8eef7; }
html.fx2[data-shell="fuhaar"] footer a:hover { color: var(--hl-gold); }
html.fx2[data-shell="fuhaar"] :is(details.themer .menu, .navcmd .nc-list, .coach) { background: #fff; color: var(--hl-ink); border: 2px solid var(--hl-navy); border-radius: 14px; }
html.fx2[data-shell="fuhaar"] .fx-dock .fx-hl-stats { width: 100%; font: 600 12px/1.4 'JetBrains Mono', monospace; color: var(--hl-gold); }

/* Ultra HD: Flughafen hinter der Bordkarte */
html.fx2.ultra-stage[data-shell="fuhaar"] { --u-base: #8fd0ff; --font: 'Inter', 'Helvetica Neue', Arial, sans-serif; }
html.fx2.ultra-stage[data-shell="fuhaar"] body { background: #8fd0ff; }
html.fx2.ultra-stage[data-shell="fuhaar"] header.top { backdrop-filter: none; -webkit-backdrop-filter: none; }
html.fx2.ultra-stage[data-shell="fuhaar"] main { background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border: 0; border-radius: 22px; padding: 5.4rem 2.8rem 2.6rem; }
html.fx2.ultra-stage[data-shell="fuhaar"] main h1 { font: 800 2.8rem/1.1 'Inter', sans-serif; color: var(--hl-navy); }
html.fx2.ultra-stage[data-shell="fuhaar"] main h2 { font: 800 1.45rem/1.3 'Inter', sans-serif; color: var(--hl-navy); }
html.fx2.ultra-stage[data-shell="fuhaar"] main h2::before { content: '✈'; width: auto; height: auto; background: none; margin-right: 0.5em; vertical-align: baseline; }
html.fx2.ultra-stage[data-shell="fuhaar"] main :is(p, li, td) { color: var(--hl-ink); }
html.fx2.ultra-stage[data-shell="fuhaar"] :is(.page h1 + p, .page .reader-bar + p) { color: var(--hl-soft); }
html.fx2.ultra-stage[data-shell="fuhaar"] main a:not(.button):not(.card):not(.tag) { color: #1f6fd1; background: none; }
html.fx2.ultra-stage[data-shell="fuhaar"] main .button { padding: 0.72rem 1.4rem; font: 700 0.95rem/1.15 'Inter', sans-serif; border-radius: 999px 999px 18px 18px; }
html.fx2.ultra-stage[data-shell="fuhaar"] footer { backdrop-filter: none; -webkit-backdrop-filter: none; background-color: #2b3240; }
@media (max-width: 760px) { html.fx2[data-shell="fuhaar"] main { margin: 2.4rem 10px 3rem; padding: 4.8rem 1.25rem 1.6rem; } html.fx2[data-shell="fuhaar"] main[data-hl-pass]::before { padding: 0 1.25rem; font-size: 0.72rem; } html.fx2[data-shell="fuhaar"] main h1 { font-size: 2.1rem; } }
@media print { html.fx2[data-shell="fuhaar"] [data-hair]::before, html.fx2[data-shell="fuhaar"] [data-hair]::after, html.fx2[data-shell="fuhaar"] main::before { display: none !important; } }

/* Haarig: Frisuren in der Navigation kleiner, damit Nachbarkacheln lesbar bleiben */
html.fx2[data-shell="fuhaar"] nav.main a[data-hair]::before { transform: scaleY(0.72); transform-origin: 50% 100%; }
html.fx2[data-shell="fuhaar"] nav.main a[data-hair="5"]::before { left: -4%; right: -4%; }
html.fx2[data-shell="fuhaar"] nav.main a[data-hair="5"]::after { left: -6%; right: -6%; height: 105%; }

/* ================= MUDDA: Comedy-Club mit Backsteinwand, Glühbirnen und Publikum ================= */
html.fx2[data-shell="fuwitz"] {
  --mu-red: #c8102e; --mu-red-d: #8a0b20; --mu-gold: #ffd166; --mu-bulb: #fff3b0; --mu-ink: #2b1a14; --mu-paper: #fff8ec; --mu-soft: #7a5a4a; --mu-brick: #5a2219;
  --font: 'Arimo', 'Helvetica Neue', Arial, sans-serif; --prompt: '🎤'; --bg: var(--mu-brick); --fg: var(--mu-ink); --muted: var(--mu-soft); --accent: var(--mu-red); --line: #ecd9c2; --soft: #fbeedd; --card: var(--mu-paper); font-size: 16.5px; color-scheme: light;
  --fxd-font: 'Arimo', sans-serif; --fxd-title-font: 600 18px/1.1 'Fredoka', sans-serif; --fxd-bg: linear-gradient(#2a1410, #160a08); --fxd-fg: #fff3e0; --fxd-border: 3px solid var(--mu-gold); --fxd-radius: 18px;
  --fxd-shadow: 0 0 0 4px #160a08, 0 0 22px rgba(255, 209, 102, 0.45), 0 24px 50px -16px rgba(0, 0, 0, 0.8); --fxd-btn: linear-gradient(#ff4d63, var(--mu-red) 55%, var(--mu-red-d)); --fxd-btn-fg: #fff;
  --fxd-btn-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.35), 0 3px 0 #4a0510; --fxd-btn2: rgba(255, 209, 102, 0.12); --fxd-btn2-fg: var(--mu-gold); --fxd-btn2-shadow: inset 0 0 0 2px rgba(255, 209, 102, 0.6);
  --fxd-soft: rgba(255, 209, 102, 0.2); --fxd-focus: var(--mu-gold); --fxd-input: #fff8ec; --fxd-input-fg: var(--mu-ink); }
html.fx2[data-shell="fuwitz"] body { background-color: var(--mu-brick); color: var(--mu-ink); background-attachment: fixed;
  background-image: radial-gradient(70% 55% at 50% 0%, rgba(255, 230, 160, 0.38) 0%, rgba(255, 230, 160, 0) 70%), radial-gradient(120% 90% at 50% 40%, rgba(0, 0, 0, 0) 40%, rgba(20, 5, 2, 0.65) 100%), url("fx-backstein.svg"); background-size: auto, auto, 120px 60px; }
/* Kopf: Leuchtreklame mit Glühbirnenrand */
html.fx2[data-shell="fuwitz"] header.top { background: none; border: 0; box-shadow: 0 12px 30px -12px rgba(0, 0, 0, 0.8); }
html.fx2[data-shell="fuwitz"] .chrome { background: #120706; color: var(--mu-gold); border: 0; }
html.fx2[data-shell="fuwitz"] .chrome .wintitle { font: 600 13px/1 'Fredoka', sans-serif; letter-spacing: 0.08em; color: var(--mu-gold); }
html.fx2[data-shell="fuwitz"] .chrome summary { color: var(--mu-gold); }
html.fx2[data-shell="fuwitz"] .topbar { position: relative; background: linear-gradient(#a50d27, var(--mu-red-d)); color: #fff; border: 0; padding-top: 14px; padding-bottom: 14px;
  box-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.18), inset 0 -3px 0 rgba(0, 0, 0, 0.25); }
html.fx2[data-shell="fuwitz"] .topbar::before, html.fx2[data-shell="fuwitz"] .topbar::after { content: ''; position: absolute; left: 0; right: 0; height: 10px; pointer-events: none;
  background: radial-gradient(circle at 12px 5px, #fffbe0 0 3px, var(--mu-bulb) 3.5px, rgba(255, 220, 120, 0.55) 5px, rgba(255, 220, 120, 0) 8px) 0 0 / 24px 10px repeat-x; }
html.fx2[data-shell="fuwitz"] .topbar::before { top: 2px; } html.fx2[data-shell="fuwitz"] .topbar::after { bottom: 2px; }
html.fx2.mu-blink[data-shell="fuwitz"] .topbar::before, html.fx2.mu-blink[data-shell="fuwitz"] .topbar::after { background-position: 12px 0; }
html.fx2[data-shell="fuwitz"] .topbar :is(.brand, .brand a, .typed, .session a) { color: var(--mu-gold); }
html.fx2[data-shell="fuwitz"] .topbar .brand { font: 600 1.05rem/1.2 'Fredoka', sans-serif; }
html.fx2[data-shell="fuwitz"] .topbar .term-open { color: var(--mu-gold); background: rgba(0, 0, 0, 0.3); border: 1px solid var(--mu-gold); border-radius: 6px; }
html.fx2[data-shell="fuwitz"] nav.main { gap: 7px; }
html.fx2[data-shell="fuwitz"] nav.main a { font: 700 0.95rem/1 'Fredoka', 'Arimo', sans-serif; letter-spacing: 0.06em; text-transform: uppercase; color: #1a0d09; padding: 0.5rem 0.75rem; border: 0; border-radius: 4px;
  background: #fffaf0; box-shadow: inset 0 0 0 2px #e9dcc4, 0 3px 0 #2a120d; rotate: -1deg; }
html.fx2[data-shell="fuwitz"] nav.main a:nth-child(even) { rotate: 1.2deg; }
html.fx2[data-shell="fuwitz"] nav.main a:hover { background: var(--mu-gold); }
html.fx2[data-shell="fuwitz"] nav.main a.active { background: var(--mu-gold); box-shadow: inset 0 0 0 2px #fff3b0, 0 3px 0 #2a120d, 0 0 16px rgba(255, 209, 102, 0.8); }
/* Inhalt: Programmheft mit Glühbirnen oben und unten */
html.fx2[data-shell="fuwitz"] main { position: relative; z-index: 1; background: var(--mu-paper); color: var(--mu-ink); border: 6px solid var(--mu-red-d); border-radius: 16px; margin-top: 3.2rem; margin-bottom: 3.6rem; padding: 3rem 2.8rem 2.6rem;
  box-shadow: inset 0 0 0 3px var(--mu-gold), 0 30px 70px -20px rgba(0, 0, 0, 0.85), 0 0 40px rgba(255, 209, 102, 0.25); }
html.fx2[data-shell="fuwitz"] main::before, html.fx2[data-shell="fuwitz"] main::after { content: ''; position: absolute; left: 14px; right: 14px; height: 12px; pointer-events: none;
  background: radial-gradient(circle at 14px 6px, #fffbe0 0 3.5px, var(--mu-bulb) 4px, rgba(255, 220, 120, 0.5) 6px, rgba(255, 220, 120, 0) 9px) 0 0 / 28px 12px repeat-x; }
html.fx2[data-shell="fuwitz"] main::before { top: 8px; } html.fx2[data-shell="fuwitz"] main::after { bottom: 8px; }
html.fx2[data-shell="fuwitz"] main :is(p, li, td, dd) { color: var(--mu-ink); line-height: 1.75; }
html.fx2[data-shell="fuwitz"] main h1 { font: 600 3rem/1.05 'Fredoka', 'Arimo', sans-serif; color: var(--mu-red); letter-spacing: 0.01em; background: none; -webkit-text-fill-color: currentColor; animation: none; display: inline-block;
  text-shadow: 3px 3px 0 var(--mu-gold), 6px 6px 0 rgba(43, 26, 20, 0.85); rotate: -1.5deg; margin-bottom: 0.6rem; }
html.fx2[data-shell="fuwitz"] main h1::before, html.fx2[data-shell="fuwitz"] main h1::after { content: none; }
html.fx2[data-shell="fuwitz"] main h2 { font: 600 1.55rem/1.25 'Fredoka', sans-serif; color: var(--mu-ink); margin-top: 2.4rem; padding: 0; border: 0; background: none; text-transform: none; }
html.fx2[data-shell="fuwitz"] main h2::before { content: '🎤'; display: inline-block; margin-right: 0.4em; rotate: -18deg; }
html.fx2[data-shell="fuwitz"] main h3 { font-family: 'Fredoka', sans-serif; color: var(--mu-red-d); }
html.fx2[data-shell="fuwitz"] main a:not(.button):not(.card):not(.tag) { color: var(--mu-red); text-decoration: underline wavy rgba(200, 16, 46, 0.45); text-underline-offset: 4px; background: none; }
html.fx2[data-shell="fuwitz"] main a:not(.button):not(.card):not(.tag):hover { text-decoration-color: var(--mu-red); }
html.fx2[data-shell="fuwitz"] main ul > li { position: relative; list-style: none; }
html.fx2[data-shell="fuwitz"] main ul > li::before { content: '★'; position: absolute; left: -1.3em; top: 0; margin: 0; display: block; width: auto; color: var(--mu-red); }
html.fx2[data-shell="fuwitz"] main :is(blockquote, pre) { background: #f6ead6; border: 0; border-left: 5px solid var(--mu-red); border-radius: 8px; }
html.fx2[data-shell="fuwitz"] main .tag { background: #fff; color: var(--mu-red-d); border: 2px solid var(--mu-red-d); border-radius: 999px; font-family: 'Fredoka', sans-serif; }
html.fx2[data-shell="fuwitz"] main .card { background: #fff; border: 3px solid var(--mu-ink); border-radius: 12px; rotate: -0.5deg; box-shadow: 5px 5px 0 var(--mu-gold); }
html.fx2[data-shell="fuwitz"] main table { border-collapse: separate; border-spacing: 0; border: 3px solid var(--mu-ink); border-radius: 10px; overflow: hidden; background: #fff; }
html.fx2[data-shell="fuwitz"] main th { background: var(--mu-red); color: #fff; font-family: 'Fredoka', sans-serif; font-weight: 600; border-color: var(--mu-red-d); }
html.fx2[data-shell="fuwitz"] main tr:nth-child(even) td { background: #fff4e3; }
html.fx2[data-shell="fuwitz"] main :is(input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]), select, textarea) { border: 3px solid var(--mu-ink); border-radius: 10px; background: #fff; padding: 0.5rem 0.8rem; }
html.fx2.fx2-fuwitz[data-shell="fuwitz"] main :where(.button, button:not(.link):not(.tag):not(.dot), input[type="submit"]) { position: relative; font: 600 1rem/1.15 'Fredoka', sans-serif; color: #fff; padding: 0.7rem 1.4rem; border: 0; border-radius: 12px;
  background: linear-gradient(#ff4d63, var(--mu-red) 55%, var(--mu-red-d)); text-shadow: 0 2px 0 rgba(0, 0, 0, 0.3); animation: none; box-shadow: inset 0 0 0 2px var(--mu-gold), inset 0 3px 0 rgba(255, 255, 255, 0.3), 0 5px 0 #4a0510, 0 10px 18px -8px rgba(0, 0, 0, 0.7); }
html.fx2.fx2-fuwitz[data-shell="fuwitz"] main .button::before, html.fx2.fx2-fuwitz[data-shell="fuwitz"] main .button::after { content: none; }
html.fx2.fx2-fuwitz[data-shell="fuwitz"] main .button:hover { translate: 0 -2px; }
html.fx2.fx2-fuwitz[data-shell="fuwitz"] main .button.secondary { color: var(--mu-ink); text-shadow: none; background: linear-gradient(#fff3b0, var(--mu-gold) 55%, #e0a93a); box-shadow: inset 0 0 0 2px #fff8d0, 0 5px 0 #7a5410, 0 10px 18px -8px rgba(0, 0, 0, 0.7); }
html.fx2.fx2-fuwitz[data-shell="fuwitz"] main :is(td, th) :where(.button, button:not(.link):not(.tag):not(.dot)) { padding: 0.3rem 0.8rem; font-size: 0.82rem; box-shadow: inset 0 0 0 2px var(--mu-gold), 0 3px 0 #4a0510; }
/* Fuß: Bühnenboden */
html.fx2[data-shell="fuwitz"] footer { position: relative; z-index: 1; color: #f7e0c0; border: 0; padding-top: 2rem; background: repeating-linear-gradient(90deg, #6b3d22 0 70px, #5a321b 70px 72px, #74432a 72px 140px, #5a321b 140px 142px); box-shadow: inset 0 6px 12px rgba(0, 0, 0, 0.45); }
html.fx2[data-shell="fuwitz"] footer :is(a, span, .statusline) { color: #f7e0c0; } html.fx2[data-shell="fuwitz"] footer a:hover { color: var(--mu-gold); }
html.fx2[data-shell="fuwitz"] :is(details.themer .menu, .navcmd .nc-list, .coach) { background: var(--mu-paper); color: var(--mu-ink); border: 3px solid var(--mu-ink); border-radius: 14px; }
/* Leiste: Witz als Sprechblase */
html.fx2[data-shell="fuwitz"] .fx-dock .mu-joke { width: 100%; box-sizing: border-box; margin: 2px 0 6px; padding: 12px 14px; border-radius: 14px; background: #fff8ec; color: var(--mu-ink); font: 600 16px/1.35 'Fredoka', sans-serif; position: relative; min-height: 4.2em; }
html.fx2[data-shell="fuwitz"] .fx-dock .mu-joke::after { content: ''; position: absolute; left: 22px; bottom: -9px; border: 10px solid transparent; border-bottom: 0; border-top-color: #fff8ec; }
html.fx2[data-shell="fuwitz"] .fx-dock .mu-joke b { color: var(--mu-red); }
html.fx2[data-shell="fuwitz"] .fx-dock .mu-topics { display: flex; flex-wrap: wrap; gap: 4px; width: 100%; }
html.fx2[data-shell="fuwitz"] .fx-dock .mu-topics .fx-btn { width: auto; min-height: 28px; padding: 3px 9px; font-size: 12px; }
html.fx2[data-shell="fuwitz"] .fx-dock .mu-topics .fx-btn[aria-pressed="true"] { background: var(--mu-gold); color: var(--mu-ink); box-shadow: none; }
/* Witz-Effekte auf der echten Seite (je etwa sieben Sekunden) */
html.fx2.mu-alt[data-shell="fuwitz"] main { filter: sepia(0.55) contrast(0.92); transition: filter 1.2s; }
html.fx2.mu-alt[data-shell="fuwitz"] main .button { filter: grayscale(0.6); }
html.fx2.mu-langsam[data-shell="fuwitz"] :is(main .button, nav.main a, main a) { transition: translate 2.6s, background-color 2.6s, color 2.6s !important; }
html.fx2.mu-haarig[data-shell="fuwitz"] :is(main h1, main h2, main .button, nav.main a) { position: relative; }
html.fx2.mu-haarig[data-shell="fuwitz"] :is(main h2, main .button, nav.main a)::after { content: '' !important; position: absolute; left: 4%; right: 4%; top: -9px; height: 10px; pointer-events: none;
  background: repeating-linear-gradient(80deg, #3b2414 0 2px, transparent 2px 5px); -webkit-mask: linear-gradient(transparent, #000 40%); mask: linear-gradient(transparent, #000 40%); animation: mu-sprout 0.8s ease-out both; transform-origin: 50% 100%; }
@keyframes mu-sprout { from { scale: 1 0; } to { scale: 1 1; } }
html.fx2.mu-haesslich[data-shell="fuwitz"] main h1 { rotate: -4deg; scale: 1.04 0.94; transition: rotate 0.6s, scale 0.6s; }
.mu-wart { position: absolute; width: 9px; height: 8px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #c9a27a, #7a5434 70%); box-shadow: 0 1px 0 rgba(0, 0, 0, 0.3); pointer-events: none; z-index: 2; }
.mu-wart::after { content: ''; position: absolute; left: 4px; top: -3px; width: 1px; height: 4px; background: #3a2414; rotate: 20deg; }
.mu-fly, .mu-cloud, .mu-dust, .mu-snail, .mu-tomato { position: fixed; z-index: 44; pointer-events: none; }
.mu-cloud { width: 46px; height: 30px; border-radius: 50%; background: radial-gradient(circle at 30% 60%, rgba(150, 190, 70, 0.55) 0 30%, transparent 31%), radial-gradient(circle at 60% 40%, rgba(150, 190, 70, 0.5) 0 34%, transparent 35%), radial-gradient(circle at 75% 70%, rgba(150, 190, 70, 0.45) 0 26%, transparent 27%); filter: blur(1px); }
.mu-dust { width: 4px; height: 4px; border-radius: 50%; background: rgba(160, 140, 110, 0.8); }
.mu-fly { font-size: 16px; } .mu-snail { font-size: 34px; }
/* Ultra HD: Bühne mit Vorhängen, Spot und Publikum */
html.fx2.ultra-stage[data-shell="fuwitz"] { --u-base: #1a0a07; --font: 'Arimo', 'Helvetica Neue', Arial, sans-serif; }
html.fx2.ultra-stage[data-shell="fuwitz"] body { background: #1a0a07; }
html.fx2.ultra-stage[data-shell="fuwitz"] header.top { backdrop-filter: none; -webkit-backdrop-filter: none; }
html.fx2.ultra-stage[data-shell="fuwitz"] main { background: var(--mu-paper); backdrop-filter: none; -webkit-backdrop-filter: none; border: 6px solid var(--mu-red-d); border-radius: 16px; padding: 3rem 2.8rem 2.6rem; }
html.fx2.ultra-stage[data-shell="fuwitz"] main h1 { font: 600 3rem/1.05 'Fredoka', sans-serif; color: var(--mu-red); }
html.fx2.ultra-stage[data-shell="fuwitz"] main h2 { font: 600 1.55rem/1.25 'Fredoka', sans-serif; color: var(--mu-ink); }
html.fx2.ultra-stage[data-shell="fuwitz"] main h2::before { content: '🎤'; width: auto; height: auto; background: none; margin-right: 0.4em; vertical-align: baseline; }
html.fx2.ultra-stage[data-shell="fuwitz"] main :is(p, li, td) { color: var(--mu-ink); }
html.fx2.ultra-stage[data-shell="fuwitz"] :is(.page h1 + p, .page .reader-bar + p) { color: var(--mu-soft); }
html.fx2.ultra-stage[data-shell="fuwitz"] main a:not(.button):not(.card):not(.tag) { color: var(--mu-red); background: none; }
html.fx2.ultra-stage[data-shell="fuwitz"] main .button { padding: 0.7rem 1.4rem; font: 600 1rem/1.15 'Fredoka', sans-serif; border-radius: 12px; }
html.fx2.ultra-stage[data-shell="fuwitz"] footer { backdrop-filter: none; -webkit-backdrop-filter: none; }
@media (max-width: 760px) { html.fx2[data-shell="fuwitz"] main { margin: 2.6rem 10px 3rem; padding: 2.4rem 1.25rem 1.8rem; } html.fx2[data-shell="fuwitz"] main h1 { font-size: 2.2rem; } }
@media print { html.fx2[data-shell="fuwitz"] main::before, html.fx2[data-shell="fuwitz"] main::after { display: none !important; } html.fx2[data-shell="fuwitz"] main { border: 0 !important; box-shadow: none !important; } }

/* Cougar: Zuschnitt-Dialog für das Heldenfoto */
.cg-crop { position: fixed; inset: 0; z-index: 96; display: grid; place-items: center; background: rgba(18, 6, 26, 0.82); }
.cg-crop-box { box-sizing: border-box; width: min(620px, calc(100vw - 24px)); max-height: calc(100vh - 24px); overflow: auto; padding: 18px 20px; border-radius: 16px; background: linear-gradient(160deg, #42154a, #24102f 70%); color: #fbeaf3; border: 2px solid #f5c84c; font: 500 14px/1.45 'Inter', sans-serif; }
.cg-crop-title { font: italic 500 22px/1.2 'Playfair Display', Georgia, serif; color: #f5c84c; margin-bottom: 10px; }
.cg-crop-stage { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.cg-crop-stage canvas { width: min(240px, 42vw); height: auto; border-radius: 10px; background: #fff; }
.cg-crop-prev { background: repeating-conic-gradient(#ddd 0 25%, #fff 0 50%) 0 0 / 16px 16px !important; }
.cg-crop-src { cursor: grab; touch-action: none; }
.cg-crop-hint { margin: 10px 0; font-size: 13px; opacity: 0.85; }
.cg-crop-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 8px; }
.cg-crop-row label { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #f5c84c; } .cg-crop-row label[hidden] { display: none; }
.cg-crop .fx-btn { min-height: 38px; padding: 7px 14px; border-radius: 8px; border: 0; cursor: pointer; font: 600 14px/1.2 'Inter', sans-serif; background: linear-gradient(#fff3bf, #f5c84c 45%, #b8801c 55%, #f0c24a); color: #2a0d30; }
.cg-crop .fx-btn.alt { background: rgba(255, 61, 154, 0.12); color: #ff8cc8; box-shadow: inset 0 0 0 2px #ff3d9a; }
.cg-crop .fx-btn[aria-pressed="true"] { background: #ff3d9a; color: #fff; box-shadow: 0 0 12px rgba(255, 61, 154, 0.7); }
.cg-intro .cg-face { display: block; margin: 0 auto -0.3em; width: clamp(90px, 13vw, 170px); rotate: -9deg; filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.5)); }
html.fx2[data-shell="fuclub"] .fx-dock .cg-photo .fx-btn:first-child { flex: 1; }
html.fx2[data-shell="fuclub"] .fx-dock .cg-more.open { display: flex; flex-direction: column; gap: 8px; }
.cg-crop .fx-btn[hidden], .cg-crop label[hidden] { display: none !important; }
/* Leiste: nichts darf überstehen, lange Beschriftungen brechen um */
.fx-dock .fx-btn { white-space: normal; overflow-wrap: anywhere; min-width: 0; max-width: 100%; box-sizing: border-box; line-height: 1.2; }
.fx-dock .cg-row { width: 100%; } .fx-dock .cg-row .fx-btn { flex: 0 1 auto; }
.fx-dock .cg-photo { flex-wrap: nowrap; } .fx-dock .cg-photo .fx-btn:first-child { flex: 1 1 auto; } .fx-dock .cg-photo .fx-btn:last-child { flex: 0 0 auto; width: 38px; padding: 0; }
.fx-dock select, .fx-dock input[type="text"] { width: 100%; box-sizing: border-box; min-width: 0; }
.fx-dock .cg-more.open { width: 100%; }
/* Unfertige Stile vorerst nicht im Menü (Link mit ?stil= funktioniert weiter) */
.themer [data-shell-opt][hidden] { display: none !important; }
/* Cougar-Leiste: Felder volle Breite, Knöpfe darunter paarweise */
html.fx2[data-shell="fuclub"] .fx-dock .fx-dock-body > label { flex: 1 1 100%; }
/* Cougar: Charaktergenerator */
.cg-gen .cg-crop-box { width: min(780px, calc(100vw - 24px)); }
.cg-gen-wrap { display: flex; gap: 16px; flex-wrap: wrap; align-items: flex-start; }
.cg-gen-prev { width: 220px; height: 290px; flex: 0 0 auto; border-radius: 12px; background: radial-gradient(circle at 50% 35%, #5a1d62, #24102f 70%); box-shadow: inset 0 0 0 2px rgba(245, 200, 76, 0.5); }
.cg-gen-opts { flex: 1 1 320px; min-width: 0; }
.cg-gen-name { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; font-size: 13px; color: #f5c84c; }
.cg-gen-name input { flex: 1; min-width: 0; padding: 6px 10px; border-radius: 8px; border: 1px solid rgba(245, 200, 76, 0.5); background: #1b0a22; color: #fbeaf3; font: inherit; }
.cg-gen-grp { margin: 0 0 6px; }
.cg-gen-grp > span { display: block; font-size: 12px; color: #f5c84c; margin-bottom: 3px; }
.cg-gen .cg-gen-grp .fx-btn { min-height: 30px; padding: 4px 10px; margin: 0 4px 4px 0; font-size: 13px; }
.cg-sw { display: inline-block; width: 12px; height: 12px; margin-right: 6px; border-radius: 50%; vertical-align: -1px; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.55); }
@media (max-width: 560px) { .cg-gen-prev { width: 150px; height: 198px; margin: 0 auto; } }
/* Fett XXL (Stufen 6 bis 10) */
html.fx2[data-shell="fufett"][data-fx-fat="6"] { --fx-f: 1.25; } html.fx2[data-shell="fufett"][data-fx-fat="7"] { --fx-f: 1.5; } html.fx2[data-shell="fufett"][data-fx-fat="8"] { --fx-f: 1.75; }
html.fx2[data-shell="fufett"][data-fx-fat="9"] { --fx-f: 2; } html.fx2[data-shell="fufett"][data-fx-fat="10"] { --fx-f: 2.25; }
html.fx2[data-shell="fufett"]:is([data-fx-fat="6"], [data-fx-fat="7"], [data-fx-fat="8"], [data-fx-fat="9"], [data-fx-fat="10"]) main :is(p, li, td, dd, blockquote) { font-weight: 600; letter-spacing: calc((var(--fx-f) - 1) * 0.02em); line-height: calc(1.6 + (var(--fx-f) - 1) * 0.12);
  text-shadow: calc((var(--fx-f) - 1) * 0.035em) 0 0 currentColor, calc((var(--fx-f) - 1) * -0.025em) 0 0 currentColor; }
html.fx2[data-shell="fufett"]:is([data-fx-fat="6"], [data-fx-fat="7"], [data-fx-fat="8"], [data-fx-fat="9"], [data-fx-fat="10"]) .topbar .brand::after { content: ' · 100 % Schmalz'; font-size: 0.8em; opacity: 0.9; }
html.fx2[data-shell="fufett"]:is([data-fx-fat="6"], [data-fx-fat="7"], [data-fx-fat="8"], [data-fx-fat="9"], [data-fx-fat="10"]) main { border-width: calc(3px + var(--fx-f) * 2px); }
@keyframes fx-atmen { 0%, 100% { scale: 1 1; } 45% { scale: 1.045 0.965; } 60% { scale: 1.05 0.96; } }
html.fx2[data-shell="fufett"]:is([data-fx-fat="8"], [data-fx-fat="9"], [data-fx-fat="10"]) :is(nav.main a, main .button, main button:not(.link):not(.tag):not(.dot)) { animation: fx-atmen calc(3.2s - var(--fx-f) * 0.5s) ease-in-out infinite; }
html.fx2[data-shell="fufett"]:is([data-fx-fat="8"], [data-fx-fat="9"], [data-fx-fat="10"]) nav.main a:nth-child(2n) { animation-delay: -0.8s; }
html.fx2[data-shell="fufett"]:is([data-fx-fat="8"], [data-fx-fat="9"], [data-fx-fat="10"]) nav.main a:nth-child(3n) { animation-delay: -1.5s; }
html.fx2[data-shell="fufett"][data-fx-fat="10"] .chrome .wintitle::after { content: '  ⚠ Gürtel offen'; color: #ffd25e; }
.fx-fat-dot.xxl { background: #ffd25e; } .fx-fat-dot.xxl.on { background: #d9436f; box-shadow: 0 0 6px rgba(217, 67, 111, 0.7); }
html.fx-platzt body { animation: fx-platz 0.75s cubic-bezier(.3, 1.6, .5, 1); }
@keyframes fx-platz { 0% { transform: none; } 25% { transform: scale(1.06, 0.93); } 55% { transform: scale(0.97, 1.04); } 80% { transform: scale(1.01, 0.99); } 100% { transform: none; } }
.fx-streusel { position: fixed; inset: 0; pointer-events: none; z-index: 95; overflow: hidden; }
.fx-streusel i { position: absolute; top: -20px; width: 6px; height: 16px; border-radius: 4px; animation: fx-streu 2s linear forwards; }
@keyframes fx-streu { to { top: 110vh; rotate: 540deg; } }
@media (max-width: 600px) {
  html.fx2[data-shell="fufett"] main h1 { font-size: calc(2.1rem + min(var(--fx-f), 1) * 0.3rem); scale: calc(1 + min(var(--fx-f), 1) * 0.1) 1; }
  html.fx2[data-shell="fufett"]:is([data-fx-fat="6"], [data-fx-fat="7"], [data-fx-fat="8"], [data-fx-fat="9"], [data-fx-fat="10"]) .topbar .brand::after { content: ''; }
}
@media (prefers-reduced-motion: reduce) { html.fx2[data-shell="fufett"] :is(nav.main a, main .button, main button) { animation: none !important; } html.fx-platzt body { animation: none; } .fx-streusel { display: none; } }

/* ================= FETT, Nachschlag vom 14.10.: Zuckerguss, Tortenschlacht, Kalorien ================= */
html.fx-guss[data-shell="fufett"] main { background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0) 110px); }
html.fx-guss[data-shell="fufett"] main::after { content: ''; position: absolute; left: 0; right: 0; top: -4px; height: 70px; pointer-events: none; border-radius: inherit; opacity: 0.95;
  background: radial-gradient(circle at 50% 100%, #fff8f1 0 9px, rgba(0, 0, 0, 0) 10px) 0 0 / 30px 30px repeat-x, radial-gradient(circle at 50% 100%, #fff8f1 0 7px, rgba(0, 0, 0, 0) 8px) 14px 12px / 38px 44px repeat-x, linear-gradient(#fff8f1, #fff8f1) 0 0 / 100% 18px no-repeat;
  filter: drop-shadow(0 2px 2px rgba(150, 25, 65, 0.18)); animation: fx-drip 7s ease-in-out infinite alternate; }
@keyframes fx-drip { to { background-position: 0 4px, 14px 18px, 0 0; } }
html.fx-guss.fx2-fufett[data-shell="fufett"] main :where(.button, button:not(.link):not(.tag):not(.dot), input[type="submit"]), html.fx-guss[data-shell="fufett"] nav.main a { position: relative; overflow: hidden; filter: saturate(1.15); }
html.fx-guss.fx2-fufett[data-shell="fufett"] main :where(.button, button:not(.link):not(.tag):not(.dot), input[type="submit"])::before, html.fx-guss[data-shell="fufett"] nav.main a::before { content: '' !important; position: absolute; left: 8%; right: 8%; top: 3px; height: 42%; border-radius: 999px; pointer-events: none;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0)); animation: fx-gloss 2.6s ease-in-out infinite; }
@keyframes fx-gloss { 0%, 100% { opacity: 0.75; } 50% { opacity: 1; } }
html.fx-guss[data-shell="fufett"] main h1 { text-shadow: 0 2px 0 #fff, 0 4px 0 var(--fx-caramel), 0 7px 0 rgba(90, 48, 34, 0.18), 0 0 14px rgba(255, 255, 255, 0.9); }
.fx-pie { position: fixed; left: 0; top: 0; z-index: 62; width: 54px; height: 54px; margin: -27px 0 0 -27px; pointer-events: none; border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, #fff 0 30%, #ffe3ea 31% 60%, #e9a874 61%); box-shadow: inset 0 -6px 0 #c98a5e, 0 6px 10px rgba(0, 0, 0, 0.25); }
.fx-pie::after { content: ''; position: absolute; left: 50%; top: 12%; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; background: #d61f3a; }
.fx-splat { position: fixed; z-index: 61; width: 190px; height: 170px; pointer-events: none; translate: -50% -50%;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 190 170'%3E%3Cpath d='M95 18c22-10 50 0 58 22 14 6 22 24 14 40 10 14 2 34-14 38-4 18-26 26-42 18-16 10-40 4-48-12-18 0-32-18-26-36-12-14-4-36 12-42 2-20 26-34 46-28z' fill='%23fff7fa' stroke='%23f1c7d6' stroke-width='3'/%3E%3Cpath d='M60 122v28M98 128v34M136 118v22' stroke='%23fff7fa' stroke-width='12' stroke-linecap='round'/%3E%3Ccircle cx='92' cy='70' r='9' fill='%23d61f3a'/%3E%3C/svg%3E") center / contain no-repeat;
  filter: drop-shadow(0 4px 6px rgba(120, 40, 70, 0.3)); animation: fx-splat-in 0.25s cubic-bezier(0.2, 1.6, 0.4, 1); transition: translate 5s ease-in, opacity 1.5s 3.5s; }
.fx-splat.fx-splat-slide { translate: -50% 40px; opacity: 0; }
@keyframes fx-splat-in { from { scale: 0.3; } to { scale: 1; } }
html.fx2[data-shell="fufett"] .fx-dock .fx-kcal { width: 100%; margin: 0 2px; font: 600 12px/1.3 'Fredoka', sans-serif; color: #c2385f; }
@media (prefers-reduced-motion: reduce) { html.fx-guss[data-shell="fufett"] main::after, html.fx-guss[data-shell="fufett"] main .button::before { animation: none; } }
@media print { .fx-pie, .fx-splat { display: none !important; } }

/* ================= HAARIG, Nachschlag vom 14.10.: Frisuren, Föhn, Friseur ================= */
html.fx2[data-shell="fuhaar"][data-hs="locken"] [data-hair="3"]::before { --hm: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none' fill='white'%3E%3Cpath d='M0 40 C0 30 6 28 10 30 C12 24 20 24 22 28 C24 22 34 22 36 28 C38 22 48 20 50 26 C52 20 62 22 64 28 C66 22 76 24 78 28 C80 24 88 28 90 30 C94 28 100 30 100 40Z'/%3E%3C/svg%3E"); }
html.fx2[data-shell="fuhaar"][data-hs="locken"] [data-hair="4"]::before { --hm: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none' fill='white'%3E%3Cpath d='M0 40 C-1 24 6 20 10 23 C12 14 22 14 24 20 C26 12 36 12 38 18 C40 10 50 10 52 16 C54 10 64 12 66 18 C68 12 78 14 80 20 C82 14 92 20 92 24 C96 22 100 26 100 40Z'/%3E%3C/svg%3E"); }
html.fx2[data-shell="fuhaar"][data-hs="locken"] [data-hair="5"]::before { --hm: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none' fill='white'%3E%3Cpath d='M0 40 C-2 20 4 10 10 12 C12 2 24 2 26 10 C30 0 44 0 48 8 C52 0 66 0 70 8 C74 0 88 2 90 12 C96 10 102 20 100 40Z'/%3E%3C/svg%3E"); }
html.fx2[data-shell="fuhaar"][data-hs="igel"] [data-hair="3"]::before { --hm: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none' fill='white'%3E%3Cpath d='M0 40 L8 24 L16 40 L24 20 L32 40 L40 16 L48 40 L56 16 L64 40 L72 20 L80 40 L88 24 L96 40 L100 36 L100 40Z'/%3E%3C/svg%3E"); }
html.fx2[data-shell="fuhaar"][data-hs="igel"] [data-hair="4"]::before { --hm: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none' fill='white'%3E%3Cpath d='M0 40 L8 16 L16 36 L24 10 L32 36 L40 6 L48 36 L56 6 L64 36 L72 10 L80 36 L88 16 L96 36 L100 30 L100 40Z'/%3E%3C/svg%3E"); }
html.fx2[data-shell="fuhaar"][data-hs="igel"] [data-hair="5"]::before { --hm: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none' fill='white'%3E%3Cpath d='M0 40 V28 L6 6 L14 26 L22 2 L30 24 L38 0 L46 22 L54 0 L62 22 L70 2 L78 24 L86 6 L94 26 L100 28 V40Z'/%3E%3C/svg%3E"); }
html.fx2[data-shell="fuhaar"][data-hs="scheitel"] [data-hair="3"]::before { --hm: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none' fill='white'%3E%3Cpath d='M2 40 C2 26 20 22 40 22 L40 26 L44 22 C70 22 98 26 98 40Z'/%3E%3C/svg%3E"); }
html.fx2[data-shell="fuhaar"][data-hs="scheitel"] [data-hair="4"]::before { --hm: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none' fill='white'%3E%3Cpath d='M2 40 C0 22 18 14 40 14 L40 20 L45 14 C76 14 100 22 98 40Z'/%3E%3C/svg%3E"); }
html.fx2[data-shell="fuhaar"][data-hs="scheitel"] [data-hair="5"]::before { --hm: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none' fill='white'%3E%3Cpath d='M0 40 C-2 16 16 4 40 4 L40 12 L46 4 C84 4 102 16 100 40Z'/%3E%3C/svg%3E"); }
/* Föhn: Haare wehen nach links (eigene Rotations-Eigenschaft, verträgt sich mit transform der Navigation) */
html.fx2.hl-wind[data-shell="fuhaar"] [data-hair]::before, html.fx2.hl-wind[data-shell="fuhaar"] [data-hair]::after { animation: hl-wind 0.32s ease-in-out infinite alternate; transform-origin: 50% 100%; }
@keyframes hl-wind { from { rotate: -7deg; translate: -2px 0; } to { rotate: -16deg; translate: -5px 1px; } }
/* Friseur-Modus: Schere als Zeiger (selbst gezeichnet) */
html.fx2.hl-cut[data-shell="fuhaar"] body { cursor: crosshair; }
html.fx2.hl-cut[data-shell="fuhaar"] [data-hair] { cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M6 6l16 14M6 26l16-14' stroke='%230f2a4d' stroke-width='3' stroke-linecap='round'/%3E%3Ccircle cx='8' cy='25' r='4' fill='none' stroke='%230f2a4d' stroke-width='3'/%3E%3Ccircle cx='8' cy='7' r='4' fill='none' stroke='%230f2a4d' stroke-width='3'/%3E%3C/svg%3E") 22 16, crosshair; }
html.fx2.hl-cut[data-shell="fuhaar"] [data-hair]:hover { outline: 3px dashed var(--hl-coral); outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) { html.fx2.hl-wind[data-shell="fuhaar"] [data-hair]::before, html.fx2.hl-wind[data-shell="fuhaar"] [data-hair]::after { animation: none; rotate: -10deg; } }

/* ================= HAARIG, Eskalation vom 14.10.: Flugmodus, Nacht, Vollbehaart, Orkan, Radar ================= */
html.fx2[data-shell="fuhaar"] [data-hair] { position: relative; }
html.fx2.hl-full[data-shell="fuhaar"] main :is(h1, h2, h3)[data-hair] { display: inline-block; padding-top: 0.2em; }
html.fx2.hl-full[data-shell="fuhaar"] main h2[data-hair]::before { content: '' !important; rotate: none; margin: 0; width: auto; }
html.fx2.hl-full[data-shell="fuhaar"] main :is(h1, h2, h3, .card, th)[data-hair="5"]::after { display: none; }   /* Überschriften bleiben lesbar: nur Haar obendrauf, keine Mähne davor */
html.fx2.hl-full[data-shell="fuhaar"] main .card[data-hair] { overflow: visible; margin-top: 1.6rem; }
html.fx2.hl-full[data-shell="fuhaar"] main .tag[data-hair]::before { transform: scaleY(0.6); transform-origin: 50% 100%; }
html.fx2.hl-full[data-shell="fuhaar"] main th[data-hair]::before { transform: scaleY(0.7); transform-origin: 50% 100%; }
/* Orkan: Haare liegen flach, Böenflattern */
html.fx2.hl-storm[data-shell="fuhaar"] [data-hair]::before, html.fx2.hl-storm[data-shell="fuhaar"] [data-hair]::after { animation: hl-storm 0.14s ease-in-out infinite alternate !important; transform-origin: 50% 100%; }
@keyframes hl-storm { from { rotate: -22deg; translate: -6px 2px; } to { rotate: -38deg; translate: -12px 4px; } }
/* Mähnen schwingen beim Scrollen */
html.fx2.hl-swing[data-shell="fuhaar"] [data-hair="4"]::before, html.fx2.hl-swing[data-shell="fuhaar"] [data-hair="5"]::before, html.fx2.hl-swing[data-shell="fuhaar"] [data-hair="5"]::after { animation: hl-swing 0.42s ease-in-out; transform-origin: 50% 100%; }
@keyframes hl-swing { 0% { rotate: 0deg; } 30% { rotate: 5deg; } 65% { rotate: -4deg; } 100% { rotate: 0deg; } }
/* Flugmodus: Anschnallzeichen, Abheben und Kurvenlage, Wolken vor dem Inhalt, Landung */
html.fx2.hl-belt[data-shell="fuhaar"] .chrome .wintitle::after { content: '  🔔 BITTE ANSCHNALLEN'; color: #ff6b5a; animation: hl-belt 0.9s steps(2) infinite; }
@keyframes hl-belt { to { opacity: 0.25; } }
html.fx2.hl-flight[data-shell="fuhaar"] main { animation: hl-flight 9.5s ease-in-out forwards; transform-origin: 50% 60%; }
@keyframes hl-flight { 0% { transform: perspective(1200px) rotateX(0) rotate(0) translateY(0); } 18% { transform: perspective(1200px) rotateX(6deg) rotate(-2.5deg) translateY(-26px); } 45% { transform: perspective(1200px) rotateX(2deg) rotate(2deg) translateY(-34px); } 75% { transform: perspective(1200px) rotateX(1deg) rotate(-1deg) translateY(-30px); } 100% { transform: perspective(1200px) rotateX(3deg) rotate(0) translateY(-10px); } }
html.fx2.hl-landing[data-shell="fuhaar"] main { animation: hl-landing 1.1s cubic-bezier(0.2, 1.4, 0.4, 1) forwards; }
@keyframes hl-landing { 0% { transform: perspective(1200px) rotateX(3deg) translateY(-10px); } 40% { transform: translateY(6px); } 70% { transform: translateY(-3px); } 100% { transform: none; } }
.hl-cloud { position: fixed; left: 0; top: 0; z-index: 44; width: 320px; height: 120px; pointer-events: none; opacity: 0.92;
  background: radial-gradient(circle at 30% 60%, #fff 0 38px, rgba(255, 255, 255, 0) 40px), radial-gradient(circle at 52% 40%, #fff 0 52px, rgba(255, 255, 255, 0) 54px), radial-gradient(circle at 74% 62%, #fff 0 40px, rgba(255, 255, 255, 0) 42px), radial-gradient(circle at 50% 78%, #fff 0 46px, rgba(255, 255, 255, 0) 48px);
  filter: drop-shadow(0 8px 10px rgba(15, 42, 77, 0.25)); }
.hl-wig { position: fixed; left: 0; top: 0; z-index: 46; pointer-events: none; filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.3)); }
.hl-wig svg { width: 100%; height: 100%; display: block; }
/* Nachtflug: dunkle Seite, Bordkarte leuchtet */
html.fx2.hl-night[data-shell="fuhaar"] body { background: #0b1526; }
html.fx2.hl-night[data-shell="fuhaar"]:not(.ultra-stage) body { background: linear-gradient(#0b1526, #101e36 420px); }
html.fx2.hl-night.ultra-stage[data-shell="fuhaar"] body { background: #0b1526; }
html.fx2.hl-night[data-shell="fuhaar"] main[data-hl-pass]::before { background: linear-gradient(90deg, #0b1526 0%, #1c4a85 100%); box-shadow: inset 0 0 0 1px rgba(255, 201, 74, 0.5); }
html.fx2.hl-night[data-shell="fuhaar"] footer { background-color: #060b14; }
html.fx2.hl-night[data-shell="fuhaar"] .hl-cloud { opacity: 0.35; }
/* Radar in der Leiste */
html.fx2[data-shell="fuhaar"] .fx-dock .fx-hl-radar { display: flex; align-items: center; gap: 10px; width: 100%; font: 600 12px/1.3 'JetBrains Mono', monospace; color: #9fd0ff; }
html.fx2[data-shell="fuhaar"] .fx-dock .fx-hl-radar canvas { width: 84px; height: 84px; border-radius: 50%; box-shadow: 0 0 0 2px #1c4a85, 0 0 12px rgba(80, 220, 120, 0.35); }
@media (prefers-reduced-motion: reduce) { html.fx2.hl-flight[data-shell="fuhaar"] main, html.fx2.hl-landing[data-shell="fuhaar"] main, html.fx2.hl-storm[data-shell="fuhaar"] [data-hair]::before, html.fx2.hl-storm[data-shell="fuhaar"] [data-hair]::after, html.fx2.hl-belt[data-shell="fuhaar"] .chrome .wintitle::after { animation: none !important; } }
@media print { .hl-cloud, .hl-wig { display: none !important; } }
/* Handy-Band: „Zum Inhalt“ nicht über der aufgeklappten Fetisch-Leiste (Claude, 14.10.) */
html.fx2:has(.fx-dock:not(.closed)) .ultra-band-hint { opacity: 0; pointer-events: none; }
/* Cougar: Knopf „Szenen einschalten“ nur ohne Ultra HD */
html[data-gfx="ultra"] .fx-dock .fx-btn.cg-ultra { display: none !important; }
html.fx2[data-shell="fuclub"] .fx-dock .cg-ultra { width: 100%; }