/* AFB – Administrative File Booth (v145)
 * Design nach der Vorlage Rockstar_3.zip (MHT-Dateien von rockstargames.com: Startseite, Newswire, Downloads, Store).
 * Übernommen: Schwarz #000 / Fläche #121212 / Rahmen #2d2d2d / Text #e8e8e8, Rockstar-Gold #fcaf17 (Stufen #ffc539 … #976300),
 * Rot #e03232, Grün #81da85; Radien 8/12/16 px, Pillen 100 px; Übergänge 0,3 s ease-in-out; Glas-Kopf blur(12px);
 * Kachelraster wie „Ausgewählte Downloads“; Umriss-Knopf in Großbuchstaben; „Alle anzeigen“ mit Gold-Unterstreichung;
 * Fortschrittsstriche wie im Karussell; Werbeband im Neon-Verlauf der GTA-VI-Kampagne; schwarzer Fuß mit Sprach-Pille.
 * Schriften der Vorlage (Helvetica Now, Chalet) sind lizenzpflichtig – Ersatz: Helvetica Neue / Arial aus dem System.
 * Leistung: Bewegt werden nur transform und opacity; keine Animation auf Flächen mit Glas-Unschärfe.
 */
:root {
  --schwarz: #000; --flaeche: #121212; --flaeche-2: #1a1a1a; --flaeche-3: #232323; --rand: #2d2d2d; --rand-hell: #3f3f3f;
  --text: #e8e8e8; --weiss: #fdfdfd; --leise: #989898; --leiser: #6b6b6b;
  --gold: #fcaf17; --gold-hell: #ffc539; --gold-blass: #ffdb72; --gold-dunkel: #976300; --gold-tief: #2e1e00;
  --rot: #e03232; --gruen: #81da85; --gruen-hell: #c1f7bd;
  --magenta: #ff2e9a; --violett: #7b2cff; --orange: #ff7a1a; --cyan: #3fd8ff; --nacht: #0d0c1a;
  --neon: linear-gradient(100deg, #2f0a4d 0%, #7b2cff 28%, #ff2e9a 58%, #ff7a1a 86%, #fcaf17 100%);
  --schrift: "Helvetica Now Display", "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;
  --schrift-text: "Helvetica Now Text", "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;
  --r-s: 8px; --r-m: 12px; --r-l: 16px; --pille: 100px;
  --weich: .3s ease-in-out; --kopf-h: 64px; --band-h: 40px; --rand-seite: 16px;
  color-scheme: dark;
}
@media (min-width: 768px) { :root { --rand-seite: 24px; } }
@media (min-width: 1200px) { :root { --rand-seite: 40px; } }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--kopf-h) + 60px); }
body { margin: 0; background: var(--schwarz); color: var(--text); font: 400 16px/1.5 var(--schrift-text); -webkit-font-smoothing: antialiased; min-height: 100vh; display: flex; flex-direction: column; }
img, video, iframe { max-width: 100%; display: block; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.afb-unsichtbar { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.afb-sprung { position: absolute; left: 12px; top: -60px; z-index: 200; background: var(--gold); color: #000; padding: 10px 16px; border-radius: var(--pille); font-weight: 700; text-decoration: none; }
.afb-sprung:focus { top: 12px; }
.icon { flex: none; }
.mono, code { font-family: ui-monospace, "SFMono-Regular", Consolas, monospace; font-size: .9em; }

/* ------------------------------------------------------------------ Werbeband (oben, wie das Launch-Band der Vorlage) */
.afb-band { position: relative; z-index: 41; height: var(--band-h); display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 6px;
  background: var(--neon); color: #fff; overflow: hidden; }
.afb-band::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 30%, rgba(255,255,255,.35) 50%, transparent 70%); transform: translateX(-100%); animation: afb-glanz 7s ease-in-out infinite; pointer-events: none; }
.afb-band-text { margin: 0; flex: 1; text-align: center; font: 800 12px/1 var(--schrift); letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-shadow: 0 1px 8px rgba(0,0,0,.35); }
.afb-band-text span { display: inline-block; transition: opacity var(--weich), transform var(--weich); }
.afb-band-text span.weg { opacity: 0; transform: translateY(8px); }
.afb-band-pfeil { width: 32px; height: 32px; border-radius: 50%; border: 0; background: rgba(0,0,0,.18); color: #fff; display: grid; place-items: center; transition: background var(--weich); }
.afb-band-pfeil:hover { background: rgba(0,0,0,.4); }
@keyframes afb-glanz { 0%, 55% { transform: translateX(-100%); } 85%, 100% { transform: translateX(100%); } }

/* ------------------------------------------------------------------ Kopf: Menü links, Zeichen mittig, Person rechts */
.afb-kopf { position: sticky; top: 0; z-index: 40; height: var(--kopf-h); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 calc(var(--rand-seite) - 6px);
  background: rgba(0,0,0,.78); -webkit-backdrop-filter: blur(12px) saturate(140%); backdrop-filter: blur(12px) saturate(140%); border-bottom: 1px solid rgba(255,255,255,.06); }
.afb-kopf > .afb-person-knopf, .afb-kopf > .afb-rund-leer { justify-self: end; }
.afb-kopf > .afb-menue-knopf { justify-self: start; }
.afb-kopf-oeffentlich { grid-template-columns: 1fr; justify-items: center; }
.afb-marke { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; }
.afb-marke-text { font: 800 13px/1 var(--schrift); letter-spacing: .08em; text-transform: uppercase; color: var(--weiss); display: none; }
@media (min-width: 720px) { .afb-marke-text { display: inline; } }
.afb-zeichen { position: relative; width: 40px; height: 40px; border-radius: 11px; display: inline-grid; place-items: center; overflow: hidden;
  background: linear-gradient(145deg, var(--gold-blass) 0%, var(--gold) 45%, #e19808 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.6), inset 0 -2px 0 rgba(0,0,0,.18), 0 6px 20px rgba(252,175,23,.25); }
.afb-zeichen-text { position: relative; z-index: 1; font: 900 14px/1 var(--schrift); letter-spacing: -.04em; color: #000; transform: skewX(-8deg); }
.afb-zeichen-glanz { position: absolute; inset: -40%; background: linear-gradient(115deg, transparent 40%, rgba(255,255,255,.75) 50%, transparent 60%); transform: translateX(-70%); animation: afb-zeichen-glanz 6s ease-in-out infinite; }
@keyframes afb-zeichen-glanz { 0%, 70% { transform: translateX(-70%); } 90%, 100% { transform: translateX(70%); } }
.afb-zeichen-klein { width: 34px; height: 34px; border-radius: 9px; }
.afb-zeichen-gross { width: 72px; height: 72px; border-radius: 18px; }
.afb-zeichen-gross .afb-zeichen-text { font-size: 24px; }
.afb-rund { width: 44px; height: 44px; border-radius: 50%; border: 0; background: transparent; display: inline-grid; place-items: center; color: var(--text); transition: background var(--weich), color var(--weich), transform var(--weich); }
.afb-rund:hover { background: var(--flaeche-3); }
.afb-rund.aktiv { background: var(--weiss); color: #000; }
.afb-rund-klein { width: 36px; height: 36px; }
.afb-rund-leer { pointer-events: none; }
.afb-burger { display: grid; gap: 4px; width: 18px; }
.afb-burger i { display: block; height: 2px; background: currentColor; border-radius: 2px; transition: transform var(--weich), opacity var(--weich); }
.afb-menue-knopf[aria-expanded="true"] .afb-burger i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.afb-menue-knopf[aria-expanded="true"] .afb-burger i:nth-child(2) { opacity: 0; }
.afb-menue-knopf[aria-expanded="true"] .afb-burger i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.afb-initiale { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--flaeche-3); border: 1.5px solid var(--gold); font: 800 14px/1 var(--schrift); color: var(--gold); }
.afb-person { position: absolute; right: var(--rand-seite); top: calc(var(--kopf-h) - 4px); width: min(280px, calc(100vw - 32px)); padding: 18px; display: grid; gap: 10px;
  background: var(--flaeche); border: 1px solid var(--rand); border-radius: var(--r-l); box-shadow: 0 16px 56px rgba(0,0,0,.6); }
.afb-person-name { margin: 0; font: 800 18px/1.2 var(--schrift); color: var(--weiss); }
.afb-person-rolle { margin: -6px 0 6px; color: var(--gold); font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }

/* ------------------------------------------------------------------ Schublade (Menü) */
.afb-schublade { position: fixed; z-index: 60; inset: 0 auto 0 0; width: min(380px, 88vw); background: #070707; border-right: 1px solid var(--rand); transform: translateX(-102%);
  transition: transform .35s ease-in-out; overflow-y: auto; }
.afb-schublade.offen { transform: none; }
.afb-schublade-innen { padding: calc(var(--kopf-h) + 8px) 24px 32px; }
.afb-schublade-titel { margin: 24px 0 8px; color: var(--leise); font: 700 12px/1 var(--schrift); letter-spacing: .14em; text-transform: uppercase; }
.afb-schublade ul { list-style: none; margin: 0; padding: 0; }
.afb-schublade a { display: flex; align-items: center; gap: 14px; padding: 12px 0; text-decoration: none; font: 800 22px/1.1 var(--schrift); letter-spacing: -.01em; color: var(--weiss); transition: color var(--weich), transform var(--weich); }
.afb-schublade a .icon { color: var(--leise); transition: color var(--weich); }
.afb-schublade a:hover, .afb-schublade a.aktiv { color: var(--gold); transform: translateX(4px); }
.afb-schublade a:hover .icon, .afb-schublade a.aktiv .icon { color: var(--gold); }
.afb-schleier { position: fixed; inset: 0; z-index: 55; background: rgba(0,0,0,.6); }

/* ------------------------------------------------------------------ Inhalt */
.afb-inhalt { flex: 1; width: 100%; max-width: 1480px; margin: 0 auto; padding: 0 var(--rand-seite) 120px; }
.afb-inhalt:focus { outline: none; }
.afb-seitenkopf { padding: 36px 0 20px; }
.afb-zurueck { display: inline-flex; align-items: center; gap: 6px; color: var(--leise); text-decoration: none; font-size: 14px; font-weight: 600; margin-bottom: 14px; transition: color var(--weich); }
.afb-zurueck:hover { color: var(--gold); }
.afb-titel { margin: 0; font: 900 clamp(32px, 6vw, 60px)/1 var(--schrift); letter-spacing: -.03em; color: var(--weiss); }
.afb-untertitel { margin: 10px 0 0; color: var(--leise); font-size: 17px; }
.afb-auge { margin: 0 0 10px; color: var(--gold); font: 800 12px/1.2 var(--schrift); letter-spacing: .16em; text-transform: uppercase; }
.afb-hilfe, .hilfe { color: var(--leise); font-size: 14px; }
.afb-umbruch { overflow-wrap: anywhere; }
.afb-nowrap { white-space: nowrap; }

/* ------------------------------------------------------------------ Pillen-Knöpfe */
.afb-pille { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 22px; border-radius: var(--pille); border: 1.5px solid transparent;
  background: var(--flaeche-3); color: var(--weiss); font: 800 13px/1 var(--schrift); letter-spacing: .06em; text-transform: uppercase; text-decoration: none; white-space: nowrap;
  transition: background-color var(--weich), color var(--weich), border-color var(--weich), transform var(--weich), box-shadow var(--weich); }
.afb-pille:hover { transform: translateY(-1px); }
.afb-pille:active { transform: translateY(0) scale(.98); }
.afb-pille-gold { background: var(--gold); color: #000; box-shadow: 0 0 0 0 rgba(252,175,23,0); }
.afb-pille-gold:hover { background: var(--gold-hell); box-shadow: 0 8px 28px rgba(252,175,23,.35); }
.afb-pille-umriss { background: transparent; border-color: var(--text); color: var(--text); }
.afb-pille-umriss:hover { background: var(--weiss); color: #000; border-color: var(--weiss); }
.afb-pille-gefahr { background: transparent; border-color: var(--rot); color: #ff8a8a; }
.afb-pille-gefahr:hover { background: var(--rot); color: #fff; }
.afb-pille-klein { min-height: 34px; padding: 0 14px; font-size: 11px; gap: 6px; }
.afb-pille-gross { min-height: 56px; padding: 0 32px; font-size: 15px; }
.afb-pille-breit { width: 100%; }
.afb-pille[disabled] { opacity: .45; pointer-events: none; }
.afb-link-gold { color: var(--weiss); text-decoration: none; font-weight: 700; border-bottom: 2px solid var(--gold); padding-bottom: 2px; transition: color var(--weich); background: none; border-top: 0; border-left: 0; border-right: 0; }
.afb-link-gold:hover { color: var(--gold); }

/* ------------------------------------------------------------------ Bühne (Kopfbereich der Ablage) */
.afb-held { position: relative; margin-top: 16px; border-radius: var(--r-l); overflow: hidden; background: radial-gradient(120% 140% at 0% 0%, #1b0b2a 0%, #0a0a0a 55%), #0a0a0a; border: 1px solid #1d1d1d; isolation: isolate; }
.afb-held::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .5; pointer-events: none;
  background-image: repeating-linear-gradient(0deg, rgba(255,255,255,.025) 0 1px, transparent 1px 3px); }
.afb-held-licht { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.afb-held-licht span { position: absolute; width: 46vmax; height: 46vmax; border-radius: 50%; filter: blur(70px); opacity: .55; will-change: transform; }
.afb-held-licht span:nth-child(1) { background: var(--violett); top: -30vmax; right: -12vmax; animation: afb-treiben 18s ease-in-out infinite alternate; }
.afb-held-licht span:nth-child(2) { background: var(--magenta); bottom: -34vmax; right: 10vmax; opacity: .38; animation: afb-treiben 22s ease-in-out infinite alternate-reverse; }
.afb-held-licht span:nth-child(3) { background: var(--orange); top: -20vmax; left: -26vmax; opacity: .22; animation: afb-treiben 26s ease-in-out infinite alternate; }
@keyframes afb-treiben { from { transform: translate3d(0,0,0) scale(1); } to { transform: translate3d(-6vmax, 4vmax, 0) scale(1.15); } }
.afb-held-innen { position: relative; padding: 26px 20px 20px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; }   /* minmax: Suchfeld ragte auf Handys über den Rand (v149) */
@media (min-width: 900px) { .afb-held-innen { padding: 44px 40px 28px; grid-template-columns: 1fr minmax(280px, 420px); column-gap: 32px; align-items: end; }
  .afb-held-innen > :not(.afb-suche) { grid-column: 1; } .afb-suche { grid-column: 2; grid-row: 3 / span 2; align-self: end; } }
.afb-held-titel { margin: 0; font: 900 clamp(38px, 8vw, 84px)/.95 var(--schrift); letter-spacing: -.035em; color: var(--weiss); overflow-wrap: anywhere;
  text-shadow: 0 2px 40px rgba(123,44,255,.35); }
.afb-held-info { margin: 10px 0 18px; color: #c9c9c9; font-size: 15px; }
.afb-held-knoepfe { display: flex; flex-wrap: wrap; gap: 10px; }
.afb-pfad ol { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-wrap: wrap; gap: 4px; font-size: 13px; font-weight: 700; color: var(--leise); }
.afb-pfad li { display: inline-flex; align-items: center; gap: 4px; }
.afb-pfad li + li::before { content: "/"; color: var(--leiser); margin-right: 2px; }
.afb-pfad a { color: var(--leise); text-decoration: none; padding: 4px 6px; border-radius: 6px; transition: color var(--weich), background var(--weich); }
.afb-pfad a:hover, .afb-pfad a.ziel { color: var(--weiss); background: rgba(255,255,255,.08); }
.afb-pfad [aria-current] { color: var(--weiss); padding: 4px 6px; }
.afb-suche { position: relative; display: flex; align-items: center; gap: 10px; height: 52px; padding: 0 16px; margin-top: 18px; border-radius: var(--pille);
  background: rgba(18,18,18,.86); border: 1.5px solid var(--rand); transition: border-color var(--weich), box-shadow var(--weich); }
.afb-suche:focus-within { border-color: var(--gold); box-shadow: 0 0 0 4px rgba(252,175,23,.15); }
.afb-suche .icon { color: var(--leise); }
.afb-suche input { flex: 1; min-width: 0; height: 100%; border: 0; background: transparent; outline: none; font-size: 16px; }
.afb-suche kbd { font: 700 12px/1 var(--schrift); color: var(--leise); border: 1px solid var(--rand-hell); border-radius: 6px; padding: 4px 7px; }
.afb-speicher { position: relative; padding: 0 20px 20px; }
@media (min-width: 900px) { .afb-speicher { padding: 0 40px 28px; } }
.afb-speicher-balken { display: flex; gap: 3px; height: 4px; border-radius: 4px; overflow: hidden; background: rgba(255,255,255,.12); }
.afb-speicher-balken span { height: 100%; width: 0; transition: width .8s ease-in-out; }
.s-aktuell { background: var(--gold); } .s-versionen { background: var(--magenta); } .s-papierkorb { background: var(--violett); }
.afb-speicher-text { margin: 10px 0 0; display: flex; flex-wrap: wrap; gap: 4px 18px; font-size: 13px; color: var(--leise); }
.afb-speicher-text i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; vertical-align: 1px; }

/* ------------------------------------------------------------------ Werkzeugleiste: Reiter-Chips, Sortierung, Darstellung */
.afb-werkzeug { position: sticky; top: var(--kopf-h); z-index: 30; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px;
  padding: 14px 0; margin-top: 10px; background: linear-gradient(#000 80%, rgba(0,0,0,0)); }
.afb-reiter { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; max-width: 100%; padding: 2px; }
.afb-reiter::-webkit-scrollbar { display: none; }
.afb-chip { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: var(--pille); border: 1px solid var(--rand); background: var(--flaeche); color: var(--text);
  font: 700 14px/1 var(--schrift); white-space: nowrap; transition: background var(--weich), color var(--weich), border-color var(--weich); }
.afb-chip:hover { border-color: var(--rand-hell); background: var(--flaeche-3); }
.afb-chip.aktiv { background: var(--weiss); color: #000; border-color: var(--weiss); }
.afb-werkzeug-rechts { display: flex; align-items: center; gap: 12px; margin-left: auto; }
.afb-auswahlfeld { position: relative; display: inline-flex; align-items: center; border-bottom: 1px solid var(--text); }
.afb-auswahlfeld select { appearance: none; -webkit-appearance: none; border: 0; background: transparent; padding: 8px 26px 8px 2px; font-weight: 700; font-size: 15px; cursor: pointer; }
.afb-auswahlfeld select option { background: var(--flaeche); color: var(--text); }
.afb-auswahlfeld .icon { position: absolute; right: 2px; pointer-events: none; }
.afb-auswahlfeld-klein select { font-size: 13px; padding: 4px 22px 4px 0; }
.afb-umschalter { display: flex; gap: 4px; padding: 3px; border-radius: var(--pille); background: var(--flaeche); border: 1px solid var(--rand); }

/* ------------------------------------------------------------------ Abschnitte und Kachelraster (wie „Ausgewählte Downloads“) */
.afb-ansicht { min-height: 40vh; }
.afb-abschnitt { margin-top: 28px; }
.afb-abschnitt-kopf { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.afb-abschnitt-titel { margin: 0; font: 800 clamp(22px, 3vw, 30px)/1.1 var(--schrift); letter-spacing: -.02em; color: var(--weiss); }
.afb-abschnitt-zahl { color: var(--leise); font-weight: 700; font-size: 14px; }
.afb-raster { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 16px; }
@media (min-width: 640px) { .afb-raster { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 20px; } }
@media (min-width: 980px) { .afb-raster { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1320px) { .afb-raster { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.afb-kachel { position: relative; display: flex; flex-direction: column; gap: 10px; min-width: 0; border-radius: var(--r-m); outline: none; }
.afb-kachel-bild { position: relative; aspect-ratio: 1 / 1; border-radius: var(--r-m); overflow: hidden; background: var(--flaeche); border: 1px solid #1f1f1f; cursor: pointer;
  transition: transform var(--weich), box-shadow var(--weich), border-color var(--weich); }
.afb-kachel-bild > img, .afb-kachel-bild > .afb-plakat { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease-in-out, filter var(--weich); }
.afb-kachel:hover .afb-kachel-bild, .afb-kachel:focus-visible .afb-kachel-bild { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(0,0,0,.6), 0 0 0 2px var(--gold); border-color: transparent; }
.afb-kachel:hover .afb-kachel-bild > img, .afb-kachel:hover .afb-kachel-bild > .afb-plakat { transform: scale(1.06); }
.afb-kachel.gewaehlt .afb-kachel-bild { box-shadow: 0 0 0 3px var(--gold), 0 0 32px rgba(252,175,23,.35); border-color: transparent; }
.afb-kachel.ziel-drop .afb-kachel-bild { box-shadow: 0 0 0 3px var(--cyan), 0 0 40px rgba(63,216,255,.4); }
.afb-kachel-name { margin: 0; font: 600 15px/1.3 var(--schrift-text); color: var(--weiss); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.afb-kachel-meta { margin: -6px 0 0; font-size: 13px; color: var(--leise); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.afb-kachel-fuss { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid var(--rand-hell); padding-bottom: 6px; }
.afb-aktionen-knopf { display: inline-flex; align-items: center; gap: 4px; border: 0; background: none; padding: 4px 0; font: 600 14px/1 var(--schrift-text); color: var(--text); transition: color var(--weich); }
.afb-aktionen-knopf:hover { color: var(--gold); }
.afb-kachel-wahl { position: absolute; top: 10px; left: 10px; z-index: 2; width: 28px; height: 28px; border-radius: 50%; border: 2px solid rgba(255,255,255,.85); background: rgba(0,0,0,.45);
  display: grid; place-items: center; opacity: 0; transition: opacity var(--weich), background var(--weich), transform var(--weich); color: #000; }
.afb-kachel:hover .afb-kachel-wahl, .afb-kachel:focus-within .afb-kachel-wahl, .auswahl-modus .afb-kachel-wahl, .afb-kachel.gewaehlt .afb-kachel-wahl { opacity: 1; }
.afb-kachel.gewaehlt .afb-kachel-wahl { background: var(--gold); border-color: var(--gold); transform: scale(1.06); }
.afb-kachel-wahl .icon { opacity: 0; } .afb-kachel.gewaehlt .afb-kachel-wahl .icon { opacity: 1; }
.afb-abzeichen { position: absolute; z-index: 2; right: 10px; top: 10px; display: flex; gap: 6px; }
.afb-abzeichen span { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: rgba(0,0,0,.62); color: var(--gold); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.afb-abzeichen .rot { color: #ff8a8a; } .afb-abzeichen .cyan { color: var(--cyan); }
.afb-typmarke { position: absolute; z-index: 2; left: 10px; bottom: 10px; padding: 4px 8px; border-radius: 6px; background: rgba(0,0,0,.66); font: 800 11px/1 var(--schrift); letter-spacing: .08em; color: var(--weiss); text-transform: uppercase; }

/* Plakate: jede Dateiart bekommt ein eigenes Motiv – wie die Titelbilder der Vorlage, nur ohne fremde Marken */
.afb-plakat { display: grid; place-items: center; overflow: hidden; background: var(--p, linear-gradient(150deg, #2a2f3a, #10131a)); isolation: isolate; }
.afb-plakat::before { content: ""; position: absolute; inset: -20%; z-index: -1; opacity: .5;
  background: repeating-linear-gradient(115deg, rgba(255,255,255,.07) 0 2px, transparent 2px 14px); }
.afb-plakat::after { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(80% 60% at 70% 20%, rgba(255,255,255,.22), transparent 60%); }
.afb-plakat span { font: 900 clamp(22px, 5.4vw, 46px)/.9 var(--schrift); letter-spacing: -.04em; color: #fff; text-transform: uppercase; transform: rotate(-6deg) skewX(-6deg);
  text-shadow: 3px 3px 0 rgba(0,0,0,.35), 0 0 30px rgba(255,255,255,.25); max-width: 90%; overflow: hidden; text-overflow: ellipsis; }
.afb-plakat[data-familie="pdf"] { --p: linear-gradient(150deg, #ff5a3d, #b3122e 60%, #3d0614); }
.afb-plakat[data-familie="bild"] { --p: linear-gradient(150deg, #3fd8ff, #7b2cff 55%, #ff2e9a); }
.afb-plakat[data-familie="video"] { --p: linear-gradient(150deg, #ff2e9a, #7b2cff 50%, #120430); }
.afb-plakat[data-familie="audio"] { --p: linear-gradient(150deg, #81da85, #12a37a 50%, #052b2a); }
.afb-plakat[data-familie="archiv"] { --p: linear-gradient(150deg, #ffdb72, #fcaf17 40%, #654200); }
.afb-plakat[data-familie="archiv"] span { color: #1a1000; text-shadow: 3px 3px 0 rgba(255,255,255,.25); }
.afb-plakat[data-familie="tabelle"] { --p: linear-gradient(150deg, #c1f7bd, #2f9e44 50%, #0b3318); }
.afb-plakat[data-familie="text"] { --p: linear-gradient(150deg, #b2c0c8, #5a717f 55%, #1b2226); }
.afb-plakat[data-familie="code"] { --p: linear-gradient(150deg, #3fd8ff, #0e5a8a 55%, #04131f); }
.afb-plakat[data-familie="praes"] { --p: linear-gradient(150deg, #ffb36b, #ff7a1a 45%, #5c1d00); }
.afb-plakat[data-familie="dokument"] { --p: linear-gradient(150deg, #8fb4ff, #2c5bd6 50%, #0a1a45); }
.afb-plakat-ordner { --p: radial-gradient(120% 90% at 30% 10%, #2a2a2a, #0e0e0e 70%); }
.afb-plakat-ordner::before { opacity: .25; }
.afb-ordner-symbol { position: relative; width: 52%; aspect-ratio: 4 / 3; }
.afb-ordner-symbol::before { content: ""; position: absolute; left: 0; top: 0; width: 42%; height: 22%; border-radius: 8px 8px 0 0; background: var(--gold-dunkel); }
.afb-ordner-symbol::after { content: ""; position: absolute; inset: 12% 0 0; border-radius: 4px 12px 12px 12px; background: linear-gradient(160deg, var(--gold-blass), var(--gold) 45%, #c47e02);
  box-shadow: inset 0 2px 0 rgba(255,255,255,.55), 0 12px 30px rgba(252,175,23,.25); }
.afb-ordner-zahl { position: absolute; z-index: 1; bottom: 12px; right: 12px; font: 800 12px/1 var(--schrift); color: var(--leise); }

/* Liste */
.afb-liste { border-top: 1px solid var(--rand); }
.afb-zeile { display: grid; grid-template-columns: 36px 44px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 10px 6px; border-bottom: 1px solid var(--rand); border-radius: 8px;
  transition: background var(--weich); cursor: pointer; outline: none; }
@media (min-width: 800px) { .afb-zeile { grid-template-columns: 36px 44px minmax(0, 1fr) 120px 170px 110px auto; } }
.afb-zeile:hover, .afb-zeile:focus-visible { background: var(--flaeche); }
.afb-zeile.gewaehlt { background: rgba(252,175,23,.1); }
.afb-zeile.ziel-drop { background: rgba(63,216,255,.12); }
.afb-zeile-symbol { width: 44px; height: 44px; border-radius: 8px; overflow: hidden; position: relative; }
.afb-zeile-symbol > * { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.afb-zeile-symbol .afb-plakat span { font-size: 12px; transform: none; }
.afb-zeile-name { min-width: 0; }
.afb-zeile-name b { display: block; font-weight: 600; color: var(--weiss); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.afb-zeile-name small { color: var(--leise); }
.afb-zeile-spalte { color: var(--leise); font-size: 14px; display: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (min-width: 800px) { .afb-zeile-spalte { display: block; } }
.afb-listenkopf { display: none; }
@media (min-width: 800px) { .afb-listenkopf { display: grid; grid-template-columns: 36px 44px minmax(0, 1fr) 120px 170px 110px auto; gap: 12px; padding: 8px 6px; color: var(--leise); font: 700 12px/1 var(--schrift); letter-spacing: .1em; text-transform: uppercase; }
  .afb-listenkopf button { background: none; border: 0; padding: 0; text-align: left; font: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; } .afb-listenkopf button:hover { color: var(--gold); } }
.afb-haken { width: 24px; height: 24px; border-radius: 6px; border: 2px solid var(--rand-hell); display: grid; place-items: center; color: #000; transition: background var(--weich), border-color var(--weich); background: transparent; padding: 0; }
.gewaehlt .afb-haken { background: var(--gold); border-color: var(--gold); }
.afb-haken .icon { opacity: 0; } .gewaehlt .afb-haken .icon { opacity: 1; }

/* Leerzustand und Laden */
.afb-leer { margin-top: 32px; padding: 56px 24px; border-radius: var(--r-l); text-align: center; border: 2px dashed #2a2a2a; background: radial-gradient(60% 80% at 50% 0%, rgba(123,44,255,.14), transparent 70%); }
.afb-leer h2 { margin: 16px 0 8px; font: 900 clamp(26px, 4vw, 40px)/1 var(--schrift); letter-spacing: -.03em; color: var(--weiss); }
.afb-leer p { color: var(--leise); margin: 0 auto 22px; max-width: 46ch; }
.afb-leer .icon { color: var(--gold); }
.afb-laden { display: flex; justify-content: center; gap: 8px; padding: 80px 0; }
.afb-laden span { width: 10px; height: 10px; border-radius: 50%; background: var(--gold); animation: afb-puls 1s ease-in-out infinite; }
.afb-laden span:nth-child(2) { animation-delay: .15s; } .afb-laden span:nth-child(3) { animation-delay: .3s; }
@keyframes afb-puls { 0%, 100% { opacity: .25; transform: scale(.8); } 50% { opacity: 1; transform: scale(1); } }

/* ------------------------------------------------------------------ Kontextmenü */
.afb-menue { position: fixed; z-index: 90; min-width: 230px; max-width: calc(100vw - 24px); padding: 8px; border-radius: var(--r-m); background: #161616; border: 1px solid var(--rand);
  box-shadow: 0 2px 2px rgba(0,0,0,.35), 0 16px 56px rgba(0,0,0,.7); }
.afb-menue button { width: 100%; display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 0; border-radius: 8px; background: none; text-align: left; font-size: 15px; transition: background var(--weich), color var(--weich); }
.afb-menue button:hover, .afb-menue button:focus-visible { background: var(--flaeche-3); color: var(--gold); outline: none; }
.afb-menue button.gefahr { color: #ff8a8a; }
.afb-menue hr { border: 0; border-top: 1px solid var(--rand); margin: 6px 4px; }

/* ------------------------------------------------------------------ Detail (rechts, am Handy von unten) */
.afb-detail { position: fixed; z-index: 70; right: 0; top: 0; bottom: 0; width: min(480px, 100vw); background: #0b0b0b; border-left: 1px solid var(--rand); display: flex; flex-direction: column;
  box-shadow: -24px 0 60px rgba(0,0,0,.6); animation: afb-rein-rechts .3s ease-in-out; }
@keyframes afb-rein-rechts { from { transform: translateX(40px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (max-width: 640px) { .afb-detail { top: auto; height: 92vh; width: 100vw; border-left: 0; border-top: 1px solid var(--rand); border-radius: 20px 20px 0 0; animation-name: afb-rein-unten; } }
@keyframes afb-rein-unten { from { transform: translateY(60px); opacity: 0; } to { transform: none; opacity: 1; } }
.afb-detail-kopf { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 16px 12px 22px; border-bottom: 1px solid var(--rand); }
.afb-detail-kopf h2 { margin: 0; font: 800 20px/1.2 var(--schrift); color: var(--weiss); overflow-wrap: anywhere; }
.afb-detail-inhalt { flex: 1; overflow-y: auto; padding: 18px 22px 40px; }
.afb-detail-reiter { display: flex; gap: 6px; margin: 16px 0; overflow-x: auto; scrollbar-width: none; }
.afb-detail-reiter .afb-chip { height: 34px; font-size: 13px; padding: 0 12px; }
.afb-vorschau { position: relative; border-radius: var(--r-m); overflow: hidden; background: #050505; border: 1px solid #1d1d1d; min-height: 120px; display: grid; place-items: center; }
.afb-vorschau img { max-height: 60vh; width: auto; object-fit: contain; margin: auto; }
.afb-vorschau video { width: 100%; max-height: 60vh; background: #000; }
.afb-vorschau audio { width: calc(100% - 24px); margin: 30px 12px; }
.afb-vorschau iframe { width: 100%; height: 60vh; border: 0; background: #fff; }
.afb-vorschau .afb-plakat { position: relative; width: 100%; aspect-ratio: 16 / 10; }
.afb-vorschau-gross iframe { height: 72vh; }
.afb-vorschau-gross { margin: 18px 0; }
.afb-angaben { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px 16px; margin: 18px 0; font-size: 14px; }
.afb-angaben dt { color: var(--leise); }
.afb-angaben dd { margin: 0; color: var(--weiss); overflow-wrap: anywhere; }
.afb-knopfreihe { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0; }
.afb-chronik { list-style: none; margin: 0; padding: 0; }
.afb-chronik li { position: relative; padding: 0 0 16px 22px; border-left: 2px solid var(--rand); margin-left: 6px; }
.afb-chronik li::before { content: ""; position: absolute; left: -7px; top: 3px; width: 12px; height: 12px; border-radius: 50%; background: var(--flaeche-3); border: 2px solid var(--gold); }
.afb-chronik b { display: block; color: var(--weiss); font-size: 14px; }
.afb-chronik small { color: var(--leise); font-size: 12px; }
.afb-version { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; padding: 14px; border-radius: var(--r-m); background: var(--flaeche); border: 1px solid var(--rand); margin-bottom: 10px; }
.afb-version.aktuell { border-color: var(--gold); }
.afb-version-nr { grid-row: span 2; width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; background: var(--flaeche-3); font: 900 15px/1 var(--schrift); color: var(--gold); }
.afb-version-knoepfe { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.afb-link-karte { padding: 14px; border-radius: var(--r-m); background: var(--flaeche); border: 1px solid var(--rand); margin-bottom: 10px; }
.afb-link-karte.inaktiv { opacity: .55; }
.afb-link-url { display: flex; gap: 6px; margin: 8px 0; }
.afb-link-url input { flex: 1; min-width: 0; height: 38px; padding: 0 10px; border-radius: 8px; border: 1px solid var(--rand); background: #070707; font-size: 13px; }
.afb-marke-klein { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: var(--pille); background: var(--flaeche-3); color: var(--text); font: 700 11px/1.4 var(--schrift); letter-spacing: .06em; text-transform: uppercase; }
.afb-marke-klein.gold { background: rgba(252,175,23,.14); color: var(--gold); }
.afb-marke-klein.gruen { background: rgba(129,218,133,.14); color: var(--gruen); }
.afb-marke-klein.rot { background: rgba(224,50,50,.16); color: #ff8a8a; }
.afb-marke-klein.cyan { background: rgba(63,216,255,.14); color: var(--cyan); }
.afb-pruefsumme { font-family: ui-monospace, Consolas, monospace; font-size: 11px; color: var(--leise); word-break: break-all; }

/* ------------------------------------------------------------------ Dialog */
.afb-modal { position: fixed; inset: 0; z-index: 95; display: grid; place-items: center; padding: 16px; background: rgba(0,0,0,.72); animation: afb-ein .2s ease-in-out; }
@keyframes afb-ein { from { opacity: 0; } to { opacity: 1; } }
.afb-modal-karte { width: min(540px, 100%); max-height: calc(100vh - 32px); overflow-y: auto; padding: 26px; border-radius: var(--r-l); background: var(--flaeche); border: 1px solid var(--rand);
  box-shadow: 0 0 2px rgba(0,0,0,.35), 0 16px 56px rgba(0,0,0,.8); animation: afb-hoch .25s ease-in-out; }
@keyframes afb-hoch { from { transform: translateY(16px) scale(.98); } to { transform: none; } }
.afb-modal-karte h2 { margin: 0 0 16px; font: 900 26px/1.1 var(--schrift); letter-spacing: -.02em; color: var(--weiss); }
.afb-modal-fuss { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-top: 22px; }
.afb-baum { max-height: 46vh; overflow-y: auto; border: 1px solid var(--rand); border-radius: var(--r-m); padding: 6px; }
.afb-baum button { width: 100%; display: flex; align-items: center; gap: 10px; padding: 9px 10px; border: 0; border-radius: 8px; background: none; text-align: left; font-size: 15px; }
.afb-baum button:hover { background: var(--flaeche-3); }
.afb-baum button.gewaehlt { background: rgba(252,175,23,.16); color: var(--gold); }
.afb-baum button[disabled] { opacity: .35; cursor: not-allowed; }
.afb-schalter { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--rand); cursor: pointer; }
.afb-schalter input { appearance: none; -webkit-appearance: none; width: 46px; height: 26px; border-radius: 26px; background: var(--rand-hell); position: relative; flex: none; cursor: pointer; transition: background var(--weich); }
.afb-schalter input::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: transform var(--weich); }
.afb-schalter input:checked { background: var(--gold); }
.afb-schalter input:checked::after { transform: translateX(20px); }

/* ------------------------------------------------------------------ Formulare (auch für die gemeinsame Seite „Sicherheit“) */
.feld { display: grid; gap: 6px; margin-bottom: 16px; }
.feld label, .feld-label { font: 700 12px/1.2 var(--schrift); letter-spacing: .1em; text-transform: uppercase; color: var(--leise); }
.eingabe { width: 100%; min-height: 48px; padding: 0 14px; border-radius: var(--r-s); border: 1px solid var(--rand); background: #070707; color: var(--weiss); font-size: 16px;
  transition: border-color var(--weich), box-shadow var(--weich); }
textarea.eingabe { padding: 12px 14px; min-height: 96px; resize: vertical; }
.eingabe:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 4px rgba(252,175,23,.15); }
.afb-formular { display: grid; }
.knopf { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 20px; border-radius: var(--pille); border: 1.5px solid var(--text); background: transparent; color: var(--text);
  font: 800 13px/1 var(--schrift); letter-spacing: .06em; text-transform: uppercase; transition: background var(--weich), color var(--weich); }
.knopf:hover { background: var(--weiss); color: #000; }
.knopf-primaer { background: var(--gold); border-color: var(--gold); color: #000; }
.knopf-primaer:hover { background: var(--gold-hell); border-color: var(--gold-hell); }
.knopf-reihe { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
.karte { background: var(--flaeche); border: 1px solid var(--rand); border-radius: var(--r-l); padding: 22px; margin-bottom: 20px; }
.karte-kopf { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.karte-kopf h3 { margin: 0; display: flex; align-items: center; gap: 10px; font: 800 19px/1.2 var(--schrift); color: var(--weiss); }
.karte-kopf h3 .icon { color: var(--gold); }
.meldung { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; margin: 0 0 18px; border-radius: var(--r-m); border: 1px solid var(--rand); background: var(--flaeche); }
.meldung[data-status="ok"] { border-color: rgba(129,218,133,.5); background: rgba(129,218,133,.08); } .meldung[data-status="ok"] .icon { color: var(--gruen); }
.meldung[data-status="fehler"] { border-color: rgba(224,50,50,.6); background: rgba(224,50,50,.1); } .meldung[data-status="fehler"] .icon { color: #ff8a8a; }
.meldung[data-status="info"], .meldung[data-status="warn"] { border-color: rgba(252,175,23,.5); background: rgba(252,175,23,.08); }
.meldung-text { flex: 1; }
.afb-zweispaltig { display: grid; gap: 20px; }
@media (min-width: 1100px) { .afb-zweispaltig { grid-template-columns: minmax(0, 1.7fr) minmax(320px, 1fr); align-items: start; } }
.afb-tabelle-rahmen { overflow-x: auto; margin: 0 -6px; }
.afb-tabelle { width: 100%; border-collapse: collapse; font-size: 14px; }
.afb-tabelle th { text-align: left; padding: 10px 8px; color: var(--leise); font: 700 11px/1.2 var(--schrift); letter-spacing: .1em; text-transform: uppercase; border-bottom: 1px solid var(--rand); }
.afb-tabelle td { padding: 12px 8px; border-bottom: 1px solid #1f1f1f; vertical-align: middle; }
.afb-tabelle tr:hover td { background: rgba(255,255,255,.02); }
.afb-zeilen-aktionen { display: flex; flex-wrap: wrap; gap: 6px; align-items: flex-start; }
.afb-zeilen-aktionen form { margin: 0; }
.afb-zeilenform { display: flex; gap: 6px; align-items: center; margin: 0; }
.afb-aufklapp summary { list-style: none; cursor: pointer; }
.afb-aufklapp summary::-webkit-details-marker { display: none; }
.afb-aufklapp[open] .afb-zeilenform { margin-top: 8px; }
.afb-aufklapp .eingabe { min-height: 34px; font-size: 13px; width: 210px; }
.afb-einzelheiten { color: var(--leise); font-size: 13px; overflow-wrap: anywhere; min-width: 260px; }
.afb-filter { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; margin-bottom: 20px; }
.afb-filter .feld { margin: 0; min-width: 200px; }
.afb-rollen { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; margin-bottom: 20px; }
.afb-rolle { padding: 18px; border-radius: var(--r-m); background: linear-gradient(160deg, #161616, #0b0b0b); border: 1px solid var(--rand); }
.afb-rolle h3 { margin: 0 0 6px; font: 800 17px/1.2 var(--schrift); color: var(--gold); }
.afb-rolle p { margin: 0; color: var(--leise); font-size: 14px; }

/* ------------------------------------------------------------------ Uploads, Auswahl, Ablegen, Meldungen */
.afb-uploads { position: fixed; z-index: 80; right: 16px; bottom: 16px; width: min(400px, calc(100vw - 32px)); max-height: 56vh; display: flex; flex-direction: column; border-radius: var(--r-l);
  background: #141414; border: 1px solid var(--rand); box-shadow: 0 16px 56px rgba(0,0,0,.7); overflow: hidden; }
.afb-uploads-kopf { display: flex; align-items: center; justify-content: space-between; padding: 12px 10px 10px 18px; }
.afb-uploads-kopf p { margin: 0; font: 800 15px/1.2 var(--schrift); color: var(--weiss); }
.afb-uploads-gesamt { height: 3px; background: rgba(255,255,255,.08); }
.afb-uploads-gesamt span { display: block; height: 100%; width: 0; background: var(--neon); transition: width .3s ease-in-out; }
.afb-uploads ul { list-style: none; margin: 0; padding: 6px 0; overflow-y: auto; }
.afb-uploads li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; padding: 10px 18px; font-size: 14px; }
.afb-uploads li b { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--weiss); }
.afb-uploads li small { color: var(--leise); }
.afb-uploads li .afb-fortschritt { grid-column: 1 / -1; height: 3px; border-radius: 3px; background: rgba(255,255,255,.08); overflow: hidden; }
.afb-uploads li .afb-fortschritt i { display: block; height: 100%; width: 0; background: var(--gold); transition: width .25s ease-in-out; }
.afb-uploads li.fertig .afb-fortschritt i { background: var(--gruen); }
.afb-uploads li.fehler small { color: #ff8a8a; }
.afb-uploads li.fehler .afb-fortschritt i { background: var(--rot); }
.afb-auswahl { position: fixed; z-index: 75; left: 50%; bottom: 18px; transform: translateX(-50%); width: max-content; max-width: calc(100vw - 24px); display: flex; align-items: center; gap: 12px; padding: 8px 8px 8px 20px;
  border-radius: var(--pille); background: rgba(20,20,20,.94); border: 1px solid var(--rand-hell); box-shadow: 0 16px 56px rgba(0,0,0,.7); animation: afb-hoch .25s ease-in-out; }
.afb-auswahl p { margin: 0; white-space: nowrap; font-size: 14px; } .afb-auswahl b { color: var(--gold); }
.afb-auswahl-knoepfe { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.afb-auswahl-knoepfe::-webkit-scrollbar { display: none; }
@media (max-width: 640px) { .afb-auswahl { left: 12px; right: 12px; transform: none; width: auto; border-radius: var(--r-l); flex-wrap: wrap; padding: 10px 12px; } .afb-auswahl-knoepfe { order: 3; width: 100%; } }
.afb-ablegen { position: fixed; inset: 0; z-index: 99; display: grid; place-items: center; padding: 24px; background: rgba(0,0,0,.72); pointer-events: none; }
.afb-ablegen-innen { position: relative; width: min(640px, 100%); aspect-ratio: 16 / 9; border-radius: 24px; display: grid; place-content: center; justify-items: center; gap: 8px; text-align: center;
  background: rgba(10,10,10,.9); isolation: isolate; overflow: hidden; }
.afb-ablegen-innen::before { content: ""; position: absolute; inset: -60%; z-index: -2; background: conic-gradient(from 0deg, var(--violett), var(--magenta), var(--orange), var(--gold), var(--cyan), var(--violett)); animation: afb-drehen 3s linear infinite; }
.afb-ablegen-innen::after { content: ""; position: absolute; inset: 3px; z-index: -1; border-radius: 21px; background: #0a0a0a; }
@keyframes afb-drehen { to { transform: rotate(1turn); } }
.afb-ablegen-innen p { margin: 0; font: 900 clamp(26px, 5vw, 44px)/1 var(--schrift); letter-spacing: -.03em; color: var(--weiss); }
.afb-ablegen-innen small { color: var(--leise); font-size: 15px; } .afb-ablegen-innen .icon { color: var(--gold); }
.afb-meldungen { position: fixed; z-index: 100; left: 16px; bottom: 16px; display: grid; gap: 8px; max-width: min(420px, calc(100vw - 32px)); }
.afb-toast { display: flex; align-items: center; gap: 12px; padding: 13px 16px; border-radius: var(--r-m); background: var(--weiss); color: #000; font-weight: 600; font-size: 14px; box-shadow: 0 12px 40px rgba(0,0,0,.6);
  animation: afb-hoch .25s ease-in-out; }
.afb-toast.fehler { background: var(--rot); color: #fff; }
.afb-toast button { margin-left: auto; border: 0; background: none; font-weight: 800; text-transform: uppercase; font-size: 12px; letter-spacing: .06em; text-decoration: underline; }

/* ------------------------------------------------------------------ Fuß */
.afb-fuss { background: #000; border-top: 1px solid #1a1a1a; margin-top: auto; }
.afb-fuss-innen { max-width: 1480px; margin: 0 auto; padding: 40px var(--rand-seite) 48px; display: grid; gap: 24px; }
@media (min-width: 900px) { .afb-fuss-innen { grid-template-columns: 1.2fr 1fr auto; align-items: start; } .afb-fuss-klein { grid-column: 1 / -1; } }
.afb-fuss-marke { display: flex; gap: 14px; align-items: center; }
.afb-fuss-marke p { margin: 0; font: 800 15px/1.3 var(--schrift); color: var(--weiss); } .afb-fuss-marke small { color: var(--leise); font-weight: 400; }
.afb-fuss-links { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.afb-fuss-links a { font: 700 15px/1 var(--schrift); text-decoration: none; color: var(--weiss); transition: color var(--weich); }
.afb-fuss-links a:hover { color: var(--gold); }
.afb-sprache { margin: 0; }
.afb-sprache .afb-pille { border-radius: var(--r-s); text-transform: none; letter-spacing: 0; font-size: 15px; }
.afb-fuss-klein { margin: 0; color: var(--leiser); font-size: 12px; border-top: 1px solid #1a1a1a; padding-top: 18px; }
.afb-fuss-schmal { text-align: center; padding: 24px var(--rand-seite); }

/* ------------------------------------------------------------------ Anmeldung und öffentliche Seiten */
.afb-anmelde-koerper, .afb-oeffentlich { background: #000; }
.afb-anmelde-buehne { position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.afb-neon { position: absolute; border-radius: 50%; filter: blur(90px); will-change: transform; }
.afb-neon-1 { width: 60vmax; height: 60vmax; background: var(--violett); opacity: .45; top: -30vmax; left: -20vmax; animation: afb-treiben 20s ease-in-out infinite alternate; }
.afb-neon-2 { width: 50vmax; height: 50vmax; background: var(--magenta); opacity: .32; bottom: -28vmax; right: -16vmax; animation: afb-treiben 24s ease-in-out infinite alternate-reverse; }
.afb-neon-3 { width: 30vmax; height: 30vmax; background: var(--gold); opacity: .16; top: 30%; left: 55%; animation: afb-treiben 28s ease-in-out infinite alternate; }
.afb-strahl { position: absolute; top: -50%; left: 50%; width: 30vmax; height: 200%; background: linear-gradient(90deg, transparent, rgba(255,255,255,.06), transparent); transform: rotate(24deg); animation: afb-strahl 12s ease-in-out infinite; }
@keyframes afb-strahl { 0%, 100% { transform: translateX(-60vmax) rotate(24deg); } 50% { transform: translateX(40vmax) rotate(24deg); } }
.afb-anmeldung { position: relative; z-index: 1; flex: 1; display: grid; place-items: center; padding: 32px 16px; }
.afb-anmelde-karte, .afb-oeffentlich-karte { position: relative; width: min(460px, 100%); padding: 34px 28px; border-radius: 24px; background: rgba(14,14,14,.82); border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 30px 80px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.06); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
.afb-anmelde-zeichen { margin: 0 0 18px; }
.afb-anmelde-titel { margin: 0 0 6px; font: 900 44px/1 var(--schrift); letter-spacing: -.03em; color: var(--weiss); }
.afb-anmelde-karte .afb-hilfe { margin: 0 0 22px; }
.afb-anmelde-fuss { display: flex; align-items: center; gap: 8px; margin: 22px 0 0; color: var(--leiser); font-size: 12px; }
.afb-code form { display: grid; gap: 12px; }
.afb-code label { font: 700 12px/1.2 var(--schrift); letter-spacing: .1em; text-transform: uppercase; color: var(--leise); }
.afb-oeffentlich-inhalt { position: relative; z-index: 1; display: grid; justify-items: center; padding-top: 40px; }
.afb-oeffentlich-breit { width: min(960px, 100%); }
.afb-oeffentlich-leer { text-align: center; }
.afb-oeffentlich-liste { list-style: none; margin: 20px 0 0; padding: 0; border-top: 1px solid var(--rand); }
.afb-oeff-zeile { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 14px 4px; border-bottom: 1px solid var(--rand); text-decoration: none; transition: background var(--weich); }
a.afb-oeff-zeile:hover { background: rgba(255,255,255,.03); }
.afb-oeff-symbol { color: var(--gold); display: grid; }
.afb-oeff-name { flex: 1; min-width: 160px; font-weight: 600; color: var(--weiss); overflow-wrap: anywhere; }
.afb-oeff-meta { color: var(--leise); font-size: 14px; }
.afb-oeff-knoepfe { display: flex; gap: 6px; }
.afb-anfrage-notiz { padding: 14px 16px; border-left: 3px solid var(--gold); background: rgba(252,175,23,.06); border-radius: 0 var(--r-s) var(--r-s) 0; color: var(--weiss); }
.afb-ablagefeld { position: relative; display: grid; justify-items: center; gap: 6px; padding: 44px 20px; margin-top: 18px; border-radius: var(--r-l); border: 2px dashed var(--rand-hell); text-align: center; cursor: pointer;
  transition: border-color var(--weich), background var(--weich); }
.afb-ablagefeld:hover, .afb-ablagefeld.drueber { border-color: var(--gold); background: rgba(252,175,23,.05); }
.afb-ablagefeld .icon { color: var(--gold); } .afb-ablagefeld b { font: 800 20px/1.2 var(--schrift); color: var(--weiss); } .afb-ablagefeld span { color: var(--leise); }
.afb-ablagefeld input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.afb-anfrage-liste { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 10px; }
.afb-anfrage-liste li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 10px; padding: 12px 14px; border-radius: var(--r-m); background: var(--flaeche); border: 1px solid var(--rand); }
.afb-anfrage-liste b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--weiss); font-weight: 600; }
.afb-anfrage-liste small { color: var(--leise); }
.afb-anfrage-liste .afb-fortschritt { grid-column: 1 / -1; height: 3px; border-radius: 3px; background: rgba(255,255,255,.08); overflow: hidden; }
.afb-anfrage-liste .afb-fortschritt i { display: block; height: 100%; width: 0; background: var(--gold); transition: width .25s ease-in-out; }
.afb-anfrage-liste .fertig .afb-fortschritt i { background: var(--gruen); }
.afb-anfrage-liste .fehler small { color: #ff8a8a; }

/* ------------------------------------------------------------------ Bewegung reduzieren */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
  .afb-held-licht span, .afb-neon, .afb-strahl, .afb-band::after, .afb-zeichen-glanz { animation: none !important; }
}
@media (forced-colors: active) { .afb-pille, .afb-chip, .afb-kachel-bild { border: 1px solid CanvasText; } }

/* Kopfzeile einstellen (v146): Automatisch/Fest = oben bleiben, Mitscrollen = mit nach oben. Hintergrund mit einstellbarer Deckkraft. */
.afb-kopf { background: rgba(0,0,0,var(--kopf-deck,.78)); transition: background-color .2s ease-in-out; }
html[data-kopf="mit"] .afb-kopf { position: relative; }
html[data-kopf="mit"] .afb-werkzeug { top: 0; }
.afb-fuss .kz-steuerung { grid-column: 1 / -1; border-top-color: #1a1a1a; color: var(--leise); }
.afb-fuss .kz-knopf { border-color: #333; }

/* Kopfzeile einstellen (v146) */
.kz-steuerung { flex: 1 0 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-top: 6px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.08); font-size: 12.5px; font-weight: 600; letter-spacing: 0; text-transform: none; }
.kz-titel { text-transform: uppercase; letter-spacing: .12em; font-size: 11px; font-weight: 800; opacity: .7; }
.kz-gruppe { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.kz-knopf { font: inherit; font-weight: 700; color: inherit; cursor: pointer; padding: 7px 14px; border-radius: 999px; border: 1px solid rgba(255,255,255,.18); background: transparent; transition: background .15s, color .15s, border-color .15s; }
.kz-knopf:hover { background: rgba(255,255,255,.08); }
.kz-knopf[aria-pressed="true"] { background: #fff; color: #0A0B10; border-color: #fff; }
.kz-knopf:focus-visible, .kz-deck input:focus-visible { outline: 2px solid var(--f1, var(--gold, #fcaf17)); outline-offset: 3px; }
.kz-deck { display: inline-flex; align-items: center; gap: 10px; }
.kz-deck input { width: 150px; accent-color: var(--f1, var(--gold, #fcaf17)); }
.kz-steuerung .kz-deck input[type="range"], .kz-steuerung .kz-deck input[type="range"]:focus { padding: 0; border: 0; background: transparent; box-shadow: none; border-radius: 0; height: auto; }
.kz-trenner { flex-basis: 100%; height: 0; } .kz-leise { opacity: .75; border-style: dashed; }   /* Design-Wahl (v149) */
.kz-deck output { min-width: 3.2em; font-variant-numeric: tabular-nums; }
.kz-ohne-deck .kz-deck { opacity: .45; }