/* ── Cup-Baukasten (Schaufenster SF6 · Figma 316:16779 K1–K8, Spec 343:20476) ──────────────────────────────────────────
   Praefix `bk-`. Nur Tokens aus style.css (:root) + Bausteine aus tw.css (.tw-*, .tw-sf-*); die Buehne selbst sind die
   ECHTEN Seiten-Klassen (tw-turniere.css) im <iframe> (`html.bk-im-rahmen`, Klassen `.bk-r-*` nur fuer das, was es auf
   /turnier/<slug> nicht gibt: Navbar-Attrappe, simulierter Baum, Liste, Discord-Post). Brueche wie die Seiten: ≤ 1080 · ≤ 600. */

/* ═══════════ Seite /partner-werden/baukasten ═══════════ */
.bk-main { padding-top: 72px; }
.bk-app { display: grid; grid-template-columns: 380px minmax(0, 1fr); min-height: calc(100vh - 72px); }
.bk-app.nur { grid-template-columns: minmax(0, 1fr); }
.bk-app.nur .bk-links { display: none; }
.bk-links { position: sticky; top: 72px; height: calc(100vh - 72px); overflow-y: auto; overscroll-behavior: contain; min-width: 0;
    border-right: 1px solid var(--w08); background: var(--flaeche); scrollbar-width: thin; }
.bk-rechts { min-width: 0; padding: 0 32px 64px; display: flex; flex-direction: column; gap: 16px; }
.bk-leiste { position: sticky; top: 72px; z-index: 20; display: flex; justify-content: space-between; align-items: center; gap: 12px 16px;
    flex-wrap: wrap; padding: 16px 0; background: var(--grund); }
.bk-leiste .gr { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; min-width: 0; }
.bk-leiste .tw-btn.klein { height: 36px; }
.bk-seg button { white-space: nowrap; }
.bk-tel-kopf:empty, .bk-tel-fuss:empty { display: none; }
.bk-wb-status:empty { display: none; }

/* ── Werkbank ── */
.bk-wb { display: flex; flex-direction: column; gap: 26px; padding: 24px 24px 40px; box-sizing: border-box; min-width: 0; }
.bk-wb-kopf { display: flex; flex-direction: column; gap: 10px; }
.bk-wb-t { margin: 0; display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.bk-wb-t b { font: 700 20px/26px var(--font-brand); color: var(--w100); }
.bk-wb-t span { font: 500 12px/16px var(--font-brand); color: var(--w45); }
.bk-wb-intro { margin: 0; font: 400 13px/19px var(--font-brand); color: var(--w70); }
.bk-wb-gr { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.bk-wb-gr > .tw-cap { margin: 0; }
.bk-wb-schnell { display: none; }
.bk-f { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.bk-f[hidden] { display: none; }
.bk-l { font: 500 13px/16px var(--font-brand); color: var(--w70); }
.bk-hint { margin: 0; font: 400 12px/16px var(--font-brand); color: var(--w45); }
.bk-f-fehler { margin: 0; font: 400 12px/16px var(--font-brand); color: var(--gold2); }
.bk-f-fehler[hidden] { display: none; }
.bk-f.fehler .tw-feld, .bk-f.fehler select { border-color: rgba(232, 180, 80, .6); }
.bk-zeile { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; min-width: 0; }
#bk-i-kuerzel { text-transform: uppercase; }
.bk-f .tw-seg { display: flex; width: 100%; box-sizing: border-box; }
.bk-f .tw-seg button { flex: 1 1 0; justify-content: center; }
.bk-f select:disabled { opacity: .55; cursor: not-allowed; }
.bk-logo { display: flex; align-items: center; gap: 10px; min-height: 40px; flex-wrap: wrap; }
.bk-logo-k { height: 40px; padding: 0 16px; border-radius: 8px; border: 1px dashed var(--w25); background: none; color: var(--w70); cursor: pointer;
    font: 500 13px/1 var(--font-brand); }
.bk-logo-k:hover { color: var(--w100); border-color: var(--w45); }
.bk-logo-k:focus-visible, .bk-farben button:focus-visible, .bk-cover button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.bk-logo .tw-logo.s40 { width: 40px; height: 40px; }
.bk-farben { display: flex; gap: 8px; flex-wrap: wrap; }
.bk-farben button { width: 28px; height: 28px; border-radius: 7px; border: 0; padding: 0; cursor: pointer; background: var(--bk-f);
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .25); }
.bk-farben button[aria-pressed="true"] { box-shadow: 0 0 0 2px var(--grund), 0 0 0 4px var(--w100); }
.bk-cover { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.bk-cover.reihe { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.bk-cover button { position: relative; aspect-ratio: 16 / 10; border-radius: 7px; border: 1px solid var(--w08); padding: 0; cursor: pointer; overflow: hidden;
    background: var(--erhoeht) center 20% / cover no-repeat; }
.bk-cover button::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(12,13,17,0) 45%, rgba(12,13,17,.75) 100%); }
.bk-cover button span { position: absolute; left: 6px; bottom: 4px; z-index: 1; font: 600 10px/12px var(--font-brand); color: var(--w100);
    max-width: calc(100% - 10px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bk-cover.reihe button span { display: none; }
.bk-cover button[aria-pressed="true"] { border: 2px solid var(--violett-text); }
.bk-cover-mehr { align-self: flex-start; margin-top: 4px; font-size: 13px; }
.bk-haken { display: flex; gap: 10px; align-items: center; cursor: pointer; font: 500 14px/18px var(--font-brand); color: var(--w100); }
.bk-haken input { width: 18px; height: 18px; flex: 0 0 18px; margin: 0; accent-color: var(--violett-knopf); cursor: pointer; }
.bk-regler-k { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.bk-regler-k b { font: 600 13px/16px var(--font-brand); color: var(--w100); }
.bk-regler { -webkit-appearance: none; appearance: none; width: 100%; height: 20px; background: none; margin: 0; cursor: pointer; }
.bk-regler::-webkit-slider-runnable-track { height: 4px; border-radius: 2px;
    background: linear-gradient(90deg, var(--violett-knopf) var(--bk-anteil, 0%), var(--w12) var(--bk-anteil, 0%)); }
.bk-regler::-moz-range-track { height: 4px; border-radius: 2px; background: var(--w12); }
.bk-regler::-moz-range-progress { height: 4px; border-radius: 2px; background: var(--violett-knopf); }
.bk-regler::-webkit-slider-thumb { -webkit-appearance: none; width: 18px; height: 18px; margin-top: -7px; border-radius: 50%; background: var(--w100); border: 0; }
.bk-regler::-moz-range-thumb { width: 18px; height: 18px; border-radius: 50%; background: var(--w100); border: 0; }
.bk-regler:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 4px; }
.bk-wb-fuss { display: flex; gap: 10px; flex-wrap: wrap; }
.bk-st { display: flex; align-items: flex-start; gap: 8px; margin: 0; font: 400 12px/17px var(--font-brand); color: var(--w55); }
.bk-st svg { flex: 0 0 14px; margin-top: 1px; }
.bk-st.warn { color: var(--gold2); }
.bk-st .tw-link { font-size: 12px; line-height: 17px; margin-left: 4px; white-space: nowrap; }
.bk-st.leise { color: var(--w45); }
.bk-wb-status { display: flex; flex-direction: column; gap: 6px; }

/* ── Buehne (iframe mit echter Breite; Desktop skaliert, Phone 430 mit Geraeterand) ── */
.bk-buehne { min-width: 0; }
.bk-rahmen-box { position: relative; overflow: hidden; border-radius: 14px; border: 1px solid var(--w08); background: var(--grund); margin: 0 auto; }
.bk-rahmen-if { display: block; border: 0; transform-origin: 0 0; background: var(--grund); }
.bk-buehne.telefon .bk-rahmen-box { box-sizing: content-box; border: 8px solid #1f2229; border-radius: 32px; }

/* ── Handy (K6): Vorschau zuerst, Kopf + zwei Segment-Zeilen, feste Leiste unten, Werkbank im Bottom-Sheet ── */
.bk-tel-kopf { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.bk-tel-kopf .tw-seg { width: auto; }
.bk-tel-fuss { position: fixed; left: 0; right: 0; bottom: 0; z-index: 900; display: flex; align-items: center; gap: 12px;
    padding: 14px 16px calc(14px + env(safe-area-inset-bottom)); background: var(--erhoeht); border-top: 1px solid var(--border2); }
.bk-tel-fuss .n { flex: 1 1 auto; min-width: 0; font: 600 15px/19px var(--font-brand); color: var(--w100); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.bk-mit-fuss { padding-bottom: 76px; }
.tw-dlg.bk-sheet { gap: 12px; }
.bk-sheet .bk-wb { padding: 0 0 8px; gap: 22px; }
.bk-sheet-kopf h2 { font-size: 20px; line-height: 26px; }
.bk-sheet-fertig { font-size: 15px; font-weight: 600; }
.bk-wb.im-sheet .bk-wb-kopf { display: none; }
.bk-wb.im-sheet .bk-wb-schnell { display: flex; flex-direction: column; gap: 14px; padding-bottom: 18px; border-bottom: 1px solid var(--w08); }
.bk-wb.im-sheet .bk-dup { display: none; }

/* ── Cover-Dialog „More…“ ── */
.tw-dlg.bk-cv-dlg { width: 760px; }
.bk-cv-rumpf { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.bk-cv-gitter { display: grid; grid-template-columns: repeat(auto-fill, minmax(76px, 1fr)); gap: 10px; max-height: 420px; overflow-y: auto; min-width: 0; }
.bk-cv-gitter .tw-skel { aspect-ratio: 1; border-radius: 8px; }
.bk-cv-c { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; padding: 6px 4px; border-radius: 10px; cursor: pointer;
    border: 1px solid transparent; background: none; color: var(--w70); font: 500 11px/14px var(--font-brand); }
.bk-cv-c img { width: 56px; height: 56px; border-radius: 8px; display: block; background: var(--w06); }
.bk-cv-c span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bk-cv-c:hover { background: var(--w06); color: var(--w100); }
.bk-cv-c.an { border-color: var(--violett); background: rgba(124, 92, 255, .1); color: var(--w100); }
.bk-cv-c:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.bk-cv-leer { margin: 0; padding: 18px 0; font: 400 13px/18px var(--font-brand); color: var(--w55); }
.bk-cv-leer p { margin: 0 0 12px; }

/* ═══════════ K5 auf /partner-werden — Design-QoL 47 (Figma-Final B W-1 790:54536 / M-W1 790:55001): Kopfzeile in Barlow (wie die
   Abschnittskoepfe der Seite), EINE Reihe Felder (Verein · Cup · Format · Vereinsfarbe), keine eigene Buehne ═══════════ */
.bk-k5-kopf { display: flex; justify-content: space-between; align-items: center; gap: 8px 24px; flex-wrap: wrap; }
.bk-k5-kopf h2 { margin: 0; font: 600 12px/1.3 'Barlow Condensed', 'Outfit', sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--w55); }
.bk-k5-kopf .kn { display: flex; align-items: center; gap: 8px 20px; flex-wrap: wrap; }
.bk-k5-kopf .tw-link { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; }
.bk-k5-kopf button.tw-link { color: var(--w55); }
.bk-k5-kopf button.tw-link:hover { color: var(--w100); }
.bk-k5 { min-width: 0; }
.bk-k5 .bk-wb.kompakt { padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; align-items: stretch; }
.bk-k5 .bk-wb.kompakt .bk-f { gap: 8px; padding: 12px 14px 14px; background: #121318; border-bottom: 1px solid var(--w14); min-width: 0; }
.bk-k5 .bk-wb.kompakt .bk-l { font: 600 11px/1.3 'Barlow Condensed', 'Outfit', sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--w55); }
.bk-k5 .bk-wb.kompakt .tw-feld { height: 34px; padding: 0 10px; font-size: 15px; font-weight: 600; }
.bk-k5 .bk-wb.kompakt .bk-seg { width: 100%; display: flex; }
.bk-k5 .bk-wb.kompakt .bk-seg button { flex: 1 1 0; justify-content: center; padding: 0 6px; min-width: 0; }
.bk-k5 .bk-farben { gap: 4px; flex-wrap: nowrap; }
.bk-k5 .bk-farben button { width: 17px; height: 17px; border-radius: 4px; flex: 0 0 auto; }
.bk-k5-status:empty { display: none; }
.pw-entwurf { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 10px; border: 1px solid rgba(124, 92, 255, .45);
    background: rgba(124, 92, 255, .08); font: 400 13px/18px var(--font-brand); color: var(--w70); }
.pw-entwurf[hidden] { display: none; }
.pw-entwurf svg { flex: 0 0 16px; color: var(--violett-text); margin-top: 1px; }
.pw-entwurf > div { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 6px; overflow-wrap: anywhere; }
.pw-entwurf .kn { display: flex; gap: 6px 16px; flex-wrap: wrap; }
.pw-entwurf b { color: var(--w100); font-weight: 600; }
.pw-entwurf .tw-link { font-size: 13px; white-space: nowrap; }

@media (max-width: 1280px) {
    .bk-app { grid-template-columns: 340px minmax(0, 1fr); }
    .bk-rechts { padding: 0 24px 56px; }
}
@media (max-width: 1080px) {
    .bk-app { grid-template-columns: 320px minmax(0, 1fr); }
    .bk-wb { padding: 20px 18px 36px; }
    .bk-k5 .bk-wb.kompakt { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    .bk-app, .bk-app.nur { grid-template-columns: minmax(0, 1fr); }
    .bk-links { display: none; }
    .bk-rechts { padding: 16px 16px 32px; gap: 12px; }
    .bk-leiste { position: static; padding: 0; flex-direction: column; align-items: stretch; gap: 8px; }
    .bk-leiste .tw-seg { width: 100%; display: flex; }
    .bk-leiste .tw-seg button { flex: 1 1 0; justify-content: center; padding: 0 6px; }
    .bk-tel-kopf { order: -1; }
    .bk-buehne .bk-rahmen-box { border-radius: 12px; }
    .bk-buehne.telefon .bk-rahmen-box { border: 1px solid var(--w08); border-radius: 12px; }
    .bk-zeile { gap: 10px; }
    .bk-k5 .bk-wb.kompakt { grid-template-columns: minmax(0, 1fr); gap: 8px; }   /* M-W1: Felder untereinander */
    .bk-k5-kopf .kn { width: 100%; justify-content: space-between; }
    .bk-cover.reihe { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

/* ═══════════ Rahmen (die Buehne im <iframe>, html.bk-im-rahmen) ═══════════ */
html.bk-im-rahmen { overflow: hidden; scrollbar-gutter: auto; scroll-behavior: auto; }
html.bk-im-rahmen body { min-height: 0; overflow: hidden; }
html.bk-im-rahmen .site-footer { display: none; }
.bk-r-main { display: block; position: relative; }
.bk-r-nav { position: absolute; top: 0; left: 0; right: 0; height: 72px; z-index: 2; display: flex; align-items: center; gap: 40px; padding: 0 32px;
    box-sizing: border-box; background: var(--grund); border-bottom: 1px solid var(--w08); pointer-events: none; }
.bk-r-nav .marke { display: inline-flex; align-items: center; gap: 10px; }
.bk-r-nav .marke b { font: 700 18px/1 var(--font-brand); color: var(--w100); }
.bk-r-nav .links { display: flex; gap: 28px; font: 500 14px/1 var(--font-brand); color: var(--w70); }
.bk-r-nav .links .an { color: var(--w100); }
.bk-r-nav .tw-btn { margin-left: auto; }
.bk-r-tipp { position: absolute; z-index: 50; width: 240px; box-sizing: border-box; padding: 8px 12px; border-radius: 8px; background: var(--erhoeht);
    border: 1px solid var(--border2); box-shadow: 0 8px 24px rgba(0,0,0,.5); font: 500 12px/16px var(--font-brand); color: var(--w100); text-align: center; pointer-events: none; }
.bk-r-tipp[hidden] { display: none; }
.bk-r-fehlt { padding: 24px; border-radius: 12px; border: 1px dashed var(--w14); display: flex; flex-direction: column; gap: 6px; }
.bk-r-fehlt b { font: 600 16px/20px var(--font-brand); color: var(--w100); }
.bk-r-fehlt p { margin: 0; font: 400 14px/20px var(--font-brand); color: var(--w55); }
body.bk-nur-hero .tw-sf-buehne { top: 0; height: 100%; }
body.bk-nur-hero .tw-main.bk-r-seite { padding-top: 96px; padding-bottom: 56px; }
/* Sieger im Hero (K2 „Beendet“) */
.bk-r-sieger { display: inline-flex; align-items: center; gap: 12px; margin-top: 20px; padding: 12px 18px 12px 14px; border-radius: 12px; align-self: flex-start;
    border: 1px solid rgba(232, 180, 80, .55); background: rgba(232, 180, 80, .1); }
.bk-r-sieger .pk { color: var(--gold2); display: inline-flex; }
.bk-r-sieger span:last-child { display: flex; flex-direction: column; gap: 2px; }
.bk-r-sieger small { font: 600 10px/12px var(--font-brand); letter-spacing: .88px; text-transform: uppercase; color: var(--gold2); }
.bk-r-sieger b { font: 700 20px/24px var(--font-brand); color: var(--w100); }
.bk-r-frei.amber { color: var(--gold2); }
.bk-r-frei:not(.amber) { color: var(--gruen); }
/* Teams: freie Plaetze gestrichelt */
.bk-r-offen { display: flex; align-items: center; justify-content: center; min-height: 220px; border-radius: 12px; border: 1px dashed var(--w14);
    font: 500 14px/18px var(--font-brand); color: var(--w45); text-align: center; padding: 16px; box-sizing: border-box; }
.bk-r-spieler { display: flex; flex-direction: column; }
.bk-r-sp { display: grid; grid-template-columns: 32px 24px minmax(0, 1fr) 140px 64px 120px; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--w06); }
.bk-r-sp b { font: 500 14px/18px var(--font-brand); color: var(--w100); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bk-r-sp .nr, .bk-r-sp .gdr { font: 500 13px/16px var(--font-brand); color: var(--w45); }
.bk-r-sp .ro { display: inline-flex; align-items: center; gap: 6px; font: 400 13px/16px var(--font-brand); color: var(--w70); }
.bk-r-sp .ro img { width: 16px; height: 16px; }
.bk-r-sp .ci { display: inline-flex; align-items: center; gap: 6px; font: 400 13px/16px var(--font-brand); color: var(--w45); }
.bk-r-sp .ci .tw-punkt { background: var(--w25); }
.bk-r-sp .ci.da { color: var(--gruen); }
.bk-r-sp .ci.da .tw-punkt { background: var(--gruen); }
.bk-r-mehr { margin-top: 12px; }
/* Baum (simuliert, einfache Karten) */
.bk-r-baum-w { display: flex; flex-direction: column; gap: 28px; }
.bk-r-note { margin-top: 6px; }
.bk-r-ab { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.bk-r-baum { display: flex; gap: 24px; overflow-x: auto; padding-bottom: 8px; min-width: 0; scrollbar-width: thin; }
.bk-r-sp-spalte { flex: 0 0 212px; display: flex; flex-direction: column; gap: 12px; }
.bk-r-ps { display: flex; flex-direction: column; justify-content: space-around; gap: 14px; flex: 1 1 auto; }
.bk-r-p { position: relative; border-radius: 10px; border: 1px solid var(--w08); background: var(--flaeche); overflow: hidden; }
.bk-r-p.live { border-color: rgba(140, 198, 63, .55); }
.bk-r-p .lv { position: absolute; top: -1px; right: 8px; display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px; border-radius: 0 0 6px 6px;
    background: rgba(140, 198, 63, .16); font: 600 10px/14px var(--font-brand); color: var(--gruen); text-transform: uppercase; letter-spacing: .6px; }
.bk-r-p .lv .tw-punkt { background: var(--gruen); width: 6px; height: 6px; }
.bk-r-p .z { display: grid; grid-template-columns: 22px minmax(0, 1fr) 20px; gap: 10px; align-items: center; padding: 8px 12px; }
.bk-r-p .z + .z { border-top: 1px solid var(--w06); }
.bk-r-p .z .n { font: 500 13px/17px var(--font-brand); color: var(--w100); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bk-r-p .z b { font: 700 13px/17px var(--font-brand); color: var(--w45); text-align: right; }
.bk-r-p .z.sieg b { color: var(--gruen); }
.bk-r-p .z.raus .n { color: var(--w45); }
.bk-r-p .tw-logo.leer, .bk-r-tz .tw-logo.leer { background: var(--w06); border: 1px dashed var(--w14); color: transparent; box-sizing: border-box; }
.bk-r-p .z:has(.tw-logo.leer) .n { color: var(--w45); font-weight: 400; }
.bk-r-tabellen { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; }
.bk-r-tab-t { display: flex; flex-direction: column; gap: 8px; min-width: 0; padding: 16px; border-radius: 12px; border: 1px solid var(--w08); background: var(--flaeche); }
.bk-r-tz { display: grid; grid-template-columns: 24px minmax(0, 1fr) 32px 32px; gap: 10px; align-items: center; padding: 7px 0; border-bottom: 1px solid var(--w06);
    font: 500 13px/17px var(--font-brand); color: var(--w70); }
.bk-r-tz:last-child { border-bottom: 0; }
.bk-r-tz.kopf { font: 600 10px/14px var(--font-brand); letter-spacing: .66px; text-transform: uppercase; color: var(--w45); }
.bk-r-tz > span:nth-child(n+3) { text-align: right; }
.bk-r-tz .tm { display: flex; align-items: center; gap: 8px; min-width: 0; }
.bk-r-tz .tm b { font-weight: 500; color: var(--w100); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bk-r-tz.weiter { box-shadow: inset 2px 0 0 var(--gruen); padding-left: 8px; }
.bk-r-champ { display: inline-flex; align-items: center; gap: 12px; align-self: flex-start; padding: 12px 18px; border-radius: 12px;
    border: 1px solid rgba(232, 180, 80, .55); background: rgba(232, 180, 80, .1); color: var(--gold2); }
.bk-r-champ b { font: 700 16px/20px var(--font-brand); color: var(--w100); }
/* In the list (K3) */
.tw-main.bk-r-liste { padding-top: calc(72px + 40px); }
.bk-r-liste-box { display: flex; flex-direction: column; gap: 20px; padding: 40px; border-radius: 16px; border: 1px solid var(--w08); background: var(--flaeche); }
.bk-r-karte.dim { opacity: .5; }
/* W2-7: „In the list“ = eure Zeile auf der Abflugtafel (tw-turniere.css `.tw-l-tz`), Nachbarn gedimmt */
.bk-r-tafel { margin-top: 0; }
.bk-r-tafel .tw-l-tz.bk-r-dim { opacity: .45; }
.bk-r-tafel .tw-l-tz:not(.bk-r-dim):not(.kopf) { background: rgba(124,92,255,.1); }
/* Discord-Post (K4) — Discord-Farben, Embed-Rand = Bot-Farbe des Servers */
.tw-main.bk-r-dc { padding-top: 40px; display: flex; flex-direction: column; gap: 16px; }
.bk-r-dc-um { align-self: flex-start; }
.dc-kanal { padding: 28px 32px; border-radius: 16px; background: #313338; border: 1px solid var(--w08); font-family: var(--font-brand); }
.dc-msg { display: flex; gap: 16px; align-items: flex-start; max-width: 620px; }
.dc-ava { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; }
.dc-ava .tw-logo { border-radius: 50%; }
.dc-ava.hub { background: var(--violett-knopf); }
.dc-ava.hub img { width: 26px; height: 26px; }
.dc-r { min-width: 0; flex: 1 1 auto; display: flex; flex-direction: column; gap: 6px; }
.dc-kopf { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.dc-kopf b { font: 600 15px/20px var(--font-brand); color: #f2f3f5; }
.dc-app { padding: 0 5px; border-radius: 4px; background: #5865f2; color: #fff; font: 600 10px/16px var(--font-brand); }
.dc-wann { font: 400 12px/16px var(--font-brand); color: #949ba4; }
.dc-embed { display: flex; flex-direction: column; gap: 4px; padding: 12px 16px 14px 14px; border-radius: 4px; border-left: 4px solid #d8dcea; background: #2b2d31;
    max-width: 520px; box-sizing: border-box; font: 400 14px/20px var(--font-brand); color: #dbdee1; overflow-wrap: anywhere; }
.dc-titel { font: 600 15px/20px var(--font-brand); color: #00a8fc; margin-bottom: 4px; }
.dc-z b { color: #f2f3f5; }
.dc-z.klein { font-size: 12px; line-height: 16px; color: #949ba4; }
.dc-link { color: #00a8fc; }
.dc-zeit { padding: 0 2px; border-radius: 3px; background: rgba(255, 255, 255, .06); }
.dc-fuss { margin-top: 6px; font: 500 12px/16px var(--font-brand); color: #b5bac1; }
.dc-kn { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.dc-btn { height: 32px; padding: 0 16px; border-radius: 3px; border: 0; background: #4e5058; color: #fff; font: 500 14px/1 var(--font-brand); cursor: pointer; }
.dc-btn.gruen { background: #248046; }
.bk-r-dc-satz { max-width: 620px; }

@media (max-width: 1080px) {
    .bk-r-nav .links { display: none; }
    .bk-r-sp { grid-template-columns: 28px 24px minmax(0, 1fr) 110px 56px; }
    .bk-r-sp .ci { display: none; }
}
@media (max-width: 600px) {
    .bk-r-nav { padding: 0 16px; gap: 16px; }
    .bk-r-nav .marke b { font-size: 16px; }
    body.bk-nur-hero .tw-main.bk-r-seite { padding-top: 64px; padding-bottom: 32px; }
    .bk-r-sieger b { font-size: 17px; }
    .bk-r-offen { min-height: 72px; }
    .bk-r-sp { grid-template-columns: 24px 24px minmax(0, 1fr) 52px; gap: 8px; }
    .bk-r-sp .ro { display: none; }
    .bk-r-sp-spalte { flex-basis: 200px; }
    .bk-r-tabellen { grid-template-columns: minmax(0, 1fr); }
    .bk-r-liste-box { padding: 20px 16px; }
    .tw-main.bk-r-liste { padding-top: calc(72px + 24px); }
    .tw-main.bk-r-dc { padding-top: 24px; }
    .dc-kanal { padding: 16px 12px; }
    .dc-msg { gap: 10px; }
    .dc-ava { flex-basis: 32px; width: 32px; height: 32px; }
    .dc-embed { padding: 10px 12px 12px 10px; }
}
@media (prefers-reduced-motion: reduce) {
    html.bk-im-rahmen *, .bk-app * { transition: none !important; animation: none !important; }
}
/* W2-2b Rules = Rueckseite (Baustein TW.sf.rueckseite): in der Buehne liegt keine feste Leiste ueber dem Papier */
.bk-r-seite .tw-l-rs .tw-l-rg-ab { scroll-margin-top: 24px; }
@media (max-width: 760px) {
    .bk-r-seite .tw-l-rs-sprung { top: 0; }
    .bk-r-seite .tw-l-rs .tw-l-rg-ab { scroll-margin-top: 64px; }
}
/* Design-QoL 30 (P6): Reiter „Page“ = Ticket-Seite (TK3) in der Buehne. Das Ticket kommt in Album-Form (nie bedienbar, wie der Hero auf
   /partner-werden) — in voller Breite traegt es aber die Masse des echten Tickets: Breite 1120, Rand 20/30, Fakten-Schrift wie TK3
   (die Album-Groessen aus tw.css sind fuer kleine Kacheln und schoben die vierte Angabe unter den Abschnitt). */
.bk-r-seite .tw-sf-ticket.album { max-width: 1120px; margin: 0 auto; }
.bk-r-seite .tw-sf-ticket.album .tk { margin: calc(20 * var(--u)) calc(30 * var(--u)); }
.bk-r-seite .tw-sf-ticket.album .tk-fakt dd { font-size: max(14px, calc(20 * var(--u))); }
.bk-r-seite .tw-sf-ticket.album .tk-fakt dt { font-size: max(9px, calc(10 * var(--u))); }