/* Fonts: non-blocking via base.html (kein @import – spart Render-Blocking) */
:root {
--bg:#F4F2EE;--bg2:#F7F6F3;--surf:#FFFFFF;--card:#FFFFFF;--card2:#F4F2EE;
--bdr:#E2DDD6;--bdr2:#CFC8BE;
--lime:#1B3A5C;--lime2:#244A73;--limeg:rgba(27,58,92,0.08);--limeg2:rgba(27,58,92,0.04);
--chrome:#131921;--chrome2:#232F3E;
--cta:#FFD814;--cta-hover:#F7CA00;--cta-ink:#111;
--text:#1A1F24;--text2:#4A5560;--muted:#6B7580;--label:#EEF0F2;
--green:#2F7A56;--red:#B33A3A;--gold:#8A7348;--blue:#1B3A5C;--purple:#5A6570;
--fd:'IBM Plex Sans',system-ui,sans-serif;--fb:'IBM Plex Sans',system-ui,sans-serif;--fm:ui-monospace,'Cascadia Code','Segoe UI Mono',Menlo,Consolas,monospace;
--r:6px;--r-lg:12px;--r-xl:16px;
--shadow:0 1px 3px rgba(26,31,36,0.08),0 4px 16px rgba(26,31,36,0.06);
--shadow-lg:0 8px 28px rgba(26,31,36,0.10);
--glass-bg:#FFFFFF;
--glass-bg-soft:#FFFFFF;
--glass-card:var(--card);
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
html{overflow-x:clip}
body{background:var(--bg2);color:var(--text);font-family:var(--fb);font-size:15px;line-height:1.5;min-height:100vh;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font-family:var(--fb)}
/* ── Chrome: Menü + Subbar immer oben (außerhalb .page-wrap, sonst klebt sticky nicht) ── */
.bk-chrome{
position:sticky;top:0;z-index:400;
width:100%;max-width:100%;
box-sizing:border-box;
overflow:visible;
}
/* ── HEADER (3 feste Zonen – kein Layout-Sprengung durch lange Labels) ── */
.bk-header{
background:var(--chrome);border-bottom:1px solid #0f1111;
position:relative;z-index:2;height:60px;
display:grid;grid-template-columns:auto minmax(0,1fr) auto;
align-items:center;padding:0 16px;gap:12px;
width:100%;max-width:100%;box-sizing:border-box;
overflow:visible;
}
.bk-subbar{
background:var(--chrome2);
color:#fff;
min-height:36px;
display:flex;align-items:center;flex-wrap:nowrap;gap:16px;
padding:0 16px;
position:relative;z-index:1;
width:100%;max-width:100%;box-sizing:border-box;
overflow:hidden;
border-bottom:1px solid #1a2330;
}
.bk-subbar-track{
display:flex;align-items:center;gap:18px;
flex:1;min-width:0;
overflow-x:auto;scrollbar-width:none;
-ms-overflow-style:none;
white-space:nowrap;
}
.bk-subbar-track::-webkit-scrollbar{display:none;height:0}
.bk-subbar-track a,
.bk-subbar-track span{
color:#D5D9D9;font-size:13px;font-weight:500;line-height:36px;
flex-shrink:0;text-decoration:none;
}
.bk-subbar-track a:hover{color:#fff;text-decoration:underline}
.bk-subbar-promo{
margin-left:auto;flex-shrink:0;
color:#fff;font-size:13px;font-weight:700;line-height:36px;
white-space:nowrap;text-decoration:none;
}
.bk-subbar-promo:hover{text-decoration:underline;color:#fff}
.bk-logo{
font-family:var(--fd);font-weight:700;font-size:22px;letter-spacing:1.5px;
text-transform:uppercase;color:#fff;white-space:nowrap;
flex-shrink:0;min-width:0;max-width:42vw;
/* overflow visible: Krone (::before) ragt über die Zeile hinaus */
overflow:visible;line-height:1.15;padding-top:0.2em;
}
.bk-logo .accent{color:#fff}
.bk-logo .num{font-size:14px;color:#ADB1B8;margin-left:2px;font-weight:400}
/* Krone über dem i in kIngs (wie i-Punkt / BK24-Logo) */
.bk-logo .bk-i{
position:relative;
display:inline-block;
line-height:1;
overflow:visible;
}
.bk-logo .bk-i::before{
content:"";
position:absolute;
left:50%;
top:-0.48em;
width:0.78em;
height:0.42em;
transform:translateX(-50%);
background:var(--cta);
clip-path:polygon(
0% 100%,
0% 52%,
6% 52%,
14% 5%,
26% 42%,
50% 0%,
74% 42%,
86% 5%,
94% 52%,
100% 52%,
100% 100%
);
pointer-events:none;
z-index:2;
}
.bk-nav{
display:flex;align-items:center;justify-content:center;gap:0;
min-width:0;overflow-x:auto;overflow-y:hidden;
scrollbar-width:none;-ms-overflow-style:none;
mask-image:linear-gradient(90deg,transparent 0,#000 8px,#000 calc(100% - 8px),transparent 100%);
}
.bk-nav::-webkit-scrollbar{display:none;height:0}
.bk-nav a{
color:#D5D9D9;font-family:var(--fb);font-size:13px;font-weight:600;
letter-spacing:0;text-transform:none;padding:6px 8px;border-radius:var(--r);
transition:color .15s,background .15s;white-space:nowrap;flex-shrink:0;max-width:9.5em;
overflow:hidden;text-overflow:ellipsis;
}
.bk-nav a:hover{color:#fff;background:rgba(255,255,255,.08)}
.bk-nav a.active{color:#fff}
.bk-nav a.pro-btn{background:var(--cta);color:var(--cta-ink);font-weight:700;border-radius:var(--r);max-width:none}
.bk-nav a.pro-btn:hover{background:var(--cta-hover);color:var(--cta-ink)}
@media(min-width:769px){
.bk-nav a.pro-btn{display:none}
.bk-nav a{font-size:13px;padding:6px 10px;letter-spacing:0;max-width:11em}
}
@media(min-width:1100px){
.bk-nav a{padding:6px 12px;letter-spacing:0;max-width:none}
}
@media(max-width:1099px){
.bk-nav-more{display:none !important}
}
@media(min-width:769px) and (max-width:1099px){
.burger-btn{
display:flex !important;flex-shrink:0;
width:40px;height:34px;align-items:center;justify-content:center;
padding:0;box-sizing:border-box;
}
.bk-nav a{font-size:13px;padding:6px 8px;letter-spacing:0;max-width:10em}
}
/* Rechte Header-Zone: Pro (weiter links) | Abstand | Flagge (gewählte Sprache) | Burger */
.bk-header-actions{
display:flex;align-items:center;gap:8px;flex-shrink:0;
justify-content:flex-end;min-width:0;
}
/* Pro links vom Sprach-Button – Platz für Puls-Glow */
.bk-header-actions .header-pro-btn,
.bk-header-actions .mobile-pro-btn{
margin-right:10px;
order:0;
}
.bk-header-actions .lang-dd{order:1;margin-left:2px}
.bk-header-actions .burger-btn{order:2}
.lang-sw{display:none} /* alt */
/* Sprache wie AlphaCore: runder Flaggen-Button + kompakte Flaggen-Liste */
.lang-dd{position:relative;z-index:220;flex-shrink:0}
.lang-dd-btn{
display:grid;place-items:center;
width:44px;height:44px;min-width:44px;min-height:44px;box-sizing:border-box;
background:rgba(255,255,255,.04);border:1.5px solid rgba(255,255,255,.14);
border-radius:999px;color:#fff;padding:0;cursor:pointer;
transition:border-color .15s, background .15s, box-shadow .15s;
}
.lang-dd-btn:hover,.lang-dd.is-open .lang-dd-btn{
border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.08);
}
.lang-dd-flag{display:grid;place-items:center;line-height:0}
.lang-dd-flag svg{display:block;width:22px;height:15px;border-radius:2px}
.lang-dd-code,.lang-dd-chev{display:none !important}
.lang-dd-menu{
position:absolute;top:calc(100% + 8px);right:0;
width:auto;min-width:52px;max-width:min(220px, calc(100vw - 16px));
display:flex;flex-direction:column;align-items:center;gap:4px;
background:rgba(10,12,16,.96);border:1px solid rgba(255,255,255,.12);
border-radius:14px;box-shadow:0 12px 40px rgba(0,0,0,.45);
padding:8px;z-index:450;
box-sizing:border-box;overflow:visible;
}
.lang-dd-menu[hidden]{display:none !important}
.lang-dd-item{
display:grid;place-items:center;
width:44px;height:32px;padding:0;border-radius:8px;
border:1.5px solid transparent;background:transparent;
color:#fff;cursor:pointer;text-decoration:none;box-sizing:border-box;
}
.lang-dd-item svg{display:block;width:22px;height:15px;border-radius:2px}
.lang-dd-item-flag,.lang-dd-item-txt{display:none}
.lang-dd-item:hover{background:rgba(255,255,255,.06)}
.lang-dd-item.is-active{
border-color:var(--cta,#e8c56b);
box-shadow:0 0 10px rgba(232,197,107,.35);
background:rgba(232,197,107,.08);
}
.lang-dd-more{
width:44px;height:32px;font-size:16px;line-height:1;
border-top:1px solid rgba(255,255,255,.1);margin-top:2px;
border-radius:8px;padding-top:0;
}
.lang-gt-wrap{padding:8px 4px 4px;border-top:1px solid rgba(255,255,255,.1);margin-top:4px;max-width:180px;overflow:hidden;align-self:stretch}
.lang-dd-menu:has(#lang-gt-wrap:not([hidden])){min-width:180px;align-items:stretch}
.lang-dd-menu:has(#lang-gt-wrap:not([hidden])) .lang-dd-item{width:100%}
.lang-gt-wrap[hidden]{display:none !important}
.lang-gt-hint{font-size:10px;color:var(--muted);margin-bottom:6px;line-height:1.3}
.lang-gt-wrap-mobile{border:1px solid var(--bdr);border-radius:var(--r);padding:10px;background:var(--card)}
.lang-gt-quick{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.lang-gt-chip{
font-family:var(--fd);font-size:11px;font-weight:700;letter-spacing:.3px;
padding:8px 10px;border:1px solid var(--bdr);border-radius:var(--r);
background:var(--surf);color:var(--text2);cursor:pointer;-webkit-tap-highlight-color:transparent;
}
.lang-gt-chip:active,.lang-gt-chip:hover{border-color:var(--lime2);color:var(--lime);background:var(--limeg)}
/* Google Translate: Banner + Body-Shift killen (verhindert Scroll/Hamburger-Shift) */
#google_translate_element,
#google_translate_element_mobile{
min-height:0;max-width:100%;overflow:hidden;
font-size:11px !important;
}
#google_translate_element select,
#google_translate_element .goog-te-combo,
#google_translate_element_mobile select,
#google_translate_element_mobile .goog-te-combo{
max-width:100% !important;width:100% !important;
background:var(--surf)!important;color:var(--text)!important;
border:1px solid var(--bdr)!important;border-radius:6px!important;
padding:6px!important;font-size:12px!important;
}
.goog-te-banner-frame,
.goog-te-banner-frame.skiptranslate,
iframe.goog-te-banner-frame{display:none !important;visibility:hidden !important;height:0 !important}
body{top:0 !important;position:static !important}
body > .skiptranslate{display:none !important}
html.translated-ltr,html.translated-rtl{margin-top:0 !important}
#goog-gt-tt,.goog-te-balloon-frame{display:none !important}
.goog-text-highlight{background:transparent !important;box-shadow:none !important}
.goog-logo-link{display:none !important}
.goog-te-gadget{font-size:0 !important;color:transparent !important}
.goog-te-gadget .goog-te-combo{font-size:12px !important;color:var(--text)!important}
.VIpgJd-ZVi9od-l4eHX-hSRGPd,.VIpgJd-ZVi9od-ORHb{display:none !important}
/* Horizontal clip nur am Content – nicht an html/body, sonst klebt das Menü nicht */
html,body{max-width:100%}
.page-wrap{overflow-x:hidden;max-width:100%;position:relative;z-index:1;background:transparent}
/* ── MAIN ────────────────────────────────────────────── */
.bk-main{max-width:1080px;margin:0 auto;padding:20px 16px 100px;position:relative;z-index:1;background:transparent}
/* ── Tactics background canvas ───────────────────────── */
.tactics-canvas{display:none !important}
/* ── Unified solid panels ── */
.bk-panel,
.bk-glass,
.bk-glass-soft,
.bk-empty{
background:var(--glass-bg);
border:1px solid var(--bdr);
border-radius:var(--r-xl);
box-shadow:var(--shadow);
}
.bk-panel{overflow:hidden}
.bk-panel-soft,
.bk-glass-soft{
background:var(--glass-bg-soft);
border-radius:var(--r-lg);
box-shadow:none;
}
.bk-panel-accent{border-color:var(--lime2)}
/* Preise-Seite */
.bk-compare{
display:grid;grid-template-columns:1fr 1fr;gap:12px;
max-width:720px;margin:0 auto 28px;
}
.bk-compare-card{
background:var(--glass-bg);border:1px solid var(--bdr);
border-radius:12px;padding:16px 18px;
}
.bk-compare-card.is-pro{border-color:var(--lime2)}
.bk-compare-card.is-trial{border-color:var(--lime2)}
.bk-compare-card.is-trial .bk-compare-title{color:var(--lime)}
.bk-compare-cta{
display:inline-block;margin-top:10px;
font-family:var(--fd);font-size:11px;font-weight:700;
letter-spacing:.8px;text-transform:uppercase;color:var(--cta-ink);
background:var(--cta);padding:8px 14px;border-radius:20px;text-decoration:none;
}
.bk-compare-cta:hover{background:var(--cta-hover)}
.bk-btn-trial{
display:block;width:100%;text-align:center;text-decoration:none;
background:var(--cta);color:var(--cta-ink);border:none;padding:12px 14px;
border-radius:20px;font-family:var(--fb);font-size:13px;font-weight:700;
letter-spacing:0;text-transform:none;box-sizing:border-box;
}
.bk-btn-trial:hover{background:var(--cta-hover)}
.bk-compare-title{
font-family:var(--fd);font-size:11px;font-weight:700;
letter-spacing:1.5px;text-transform:uppercase;
color:var(--muted);margin-bottom:8px;
}
.bk-compare-card.is-pro .bk-compare-title{color:var(--lime)}
.bk-compare-list{
margin:0;padding:0;list-style:none;
font-size:12px;color:var(--text2);line-height:1.65;
}
.bk-compare-list .muted{color:var(--muted)}
.bk-hero-code-link{
margin-top:12px;font-size:12px;
}
.bk-hero-code-link a{
color:var(--lime2);font-family:var(--fd);letter-spacing:.8px;
text-transform:uppercase;text-decoration:none;
}
.bk-hero-code-link a:hover{color:var(--lime)}
.bk-hero-pay-line{color:var(--muted);font-size:12px}
.bk-pay-toast{
display:none;max-width:520px;margin:0 auto 18px;padding:12px 16px;
border-radius:10px;font-size:13px;line-height:1.45;
border:1px solid var(--bdr);background:var(--surf);color:var(--text);
}
.bk-email-box{
max-width:440px;margin:0 auto 28px;background:var(--surf);
border:1px solid var(--bdr);border-radius:10px;padding:16px 20px;
}
.bk-email-box-lbl{
font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:2px;
text-transform:uppercase;color:var(--muted);margin-bottom:8px;
}
.bk-email-input{
width:100%;padding:10px 14px;background:var(--bg);
border:2px solid var(--red);color:var(--text);font-family:var(--fb);
font-size:13px;border-radius:6px;outline:none;box-sizing:border-box;
animation:none;
transition:border-color .15s;
}
.bk-email-hint{font-size:11px;margin-top:8px;color:var(--muted);min-height:16px}
@keyframes emailPulse{
0%,100%{box-shadow:0 0 0 0 rgba(232,18,50,0);border-color:rgba(232,18,50,.6)}
50%{box-shadow:0 0 0 4px rgba(232,18,50,.2);border-color:rgba(232,18,50,1)}
}
@keyframes emailGreen{
0%,100%{box-shadow:0 0 0 0 rgba(0,217,126,0)}
50%{box-shadow:0 0 0 4px rgba(0,217,126,.2)}
}
.bk-plan-grid{
display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));
gap:18px;margin-bottom:36px;
}
.bk-plan-card{
background:var(--glass-bg);border:2px solid var(--bdr);
border-radius:14px;overflow:hidden;position:relative;
}
.bk-plan-card.is-featured{
border-color:var(--lime2);
box-shadow:0 8px 40px rgba(27,58,92,0.12);
}
.bk-plan-badge{
position:absolute;top:14px;right:14px;background:var(--lime);color:#fff;
font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:2px;
padding:3px 11px;border-radius:20px;text-transform:uppercase;
}
.bk-plan-head{padding:24px 22px 16px;border-bottom:1px solid var(--bdr)}
.bk-plan-name-tag{
font-family:var(--fb);font-size:9px;letter-spacing:2.5px;
text-transform:uppercase;color:var(--muted);margin-bottom:6px;
}
.bk-plan-card.is-featured .bk-plan-name-tag{color:var(--lime)}
.bk-plan-title{
font-family:var(--fd);font-size:26px;font-weight:700;color:var(--text);
}
.bk-plan-card.is-featured .bk-plan-title{color:var(--lime)}
.bk-plan-price-row{
margin-top:10px;display:flex;align-items:baseline;gap:4px;flex-wrap:wrap;
}
.bk-plan-price{
font-family:var(--fd);font-size:36px;font-weight:700;line-height:1;
}
.bk-plan-per{font-size:13px;color:var(--muted);font-weight:400}
.bk-plan-month{font-size:11px;color:var(--muted);margin-top:4px}
.bk-plan-body{padding:16px 22px 22px}
.bk-plan-feat{
font-size:12px;color:var(--text2);margin-bottom:7px;
display:flex;gap:8px;align-items:flex-start;
}
.bk-plan-feat .tick{color:var(--lime);flex-shrink:0;font-weight:700;margin-top:1px}
.bk-plan-actions{margin-top:18px;display:flex;flex-direction:column;gap:8px}
/* PayPal JS-Buttons brauchen sichtbaren Platz während/ nach dem Render */
.bk-plan-actions [id^="pp-"]{
min-height:48px;width:100%;
}
.bk-plan-actions [id^="pp-"] iframe,
.bk-plan-actions [id^="pp-"] .paypal-buttons{
max-width:100% !important;
}
.bk-btn-crypto{
width:100%;padding:12px;background:var(--surf);color:var(--text2);
border:1px solid var(--bdr);border-radius:6px;font-family:var(--fb);font-size:13px;
font-weight:600;letter-spacing:0;text-transform:none;cursor:pointer;
display:flex;align-items:center;justify-content:center;gap:7px;box-sizing:border-box;
}
.bk-btn-crypto:hover{border-color:var(--lime2);color:var(--text)}
.bk-btn-crypto:disabled{opacity:.65;cursor:wait}
.bk-btn-disabled{
width:100%;padding:11px;background:var(--surf);color:var(--muted);
border:1px solid var(--bdr);border-radius:6px;font-family:var(--fd);
font-size:13px;cursor:not-allowed;
}
.bk-pay-hints{
display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-bottom:28px;
}
.bk-pay-hint{
display:flex;align-items:center;gap:8px;background:var(--surf);
border:1px solid var(--bdr);border-radius:8px;padding:9px 18px;
font-size:11px;color:var(--text2);
}
.bk-pay-hint a{color:var(--lime2)}
.bk-how{
max-width:720px;margin:0 auto 32px;display:grid;gap:10px;
}
.bk-how-title{
font-family:var(--fd);font-size:11px;font-weight:700;letter-spacing:2px;
text-transform:uppercase;color:var(--muted);text-align:center;margin-bottom:4px;
}
.bk-how-step{
background:var(--surf);border:1px solid var(--bdr);border-radius:10px;
padding:14px 18px;font-size:12px;color:var(--text2);line-height:1.5;
}
.bk-how-step strong{color:var(--text)}
.bk-how-step a{color:var(--lime2)}
.bk-disclaimer{text-align:center;font-size:11px;color:var(--muted)}
@media(max-width:560px){
.bk-compare{grid-template-columns:1fr}
}
/* ── Mobile Feinschliff: Preise / Hero / Pay ── */
@media(max-width:640px){
.bk-page-hero{padding:22px 10px 16px;overflow:visible}
.bk-page-hero h1{
font-size:clamp(20px,6.4vw,28px) !important;
letter-spacing:0 !important;
line-height:1.2 !important;
white-space:normal !important;
overflow:visible !important;
text-overflow:clip !important;
max-width:100%;
width:100%;
padding:0 6px;
box-sizing:border-box;
}
.bk-page-hero h1 .lime{display:inline}
.bk-page-hero .hero-sub{
font-size:12px;line-height:1.55;
white-space:normal;overflow:visible;
max-width:100%;padding:0 8px;
}
.bk-page-hero .hero-badge{
font-size:9px;letter-spacing:1.2px;padding:5px 12px;margin-bottom:12px;
max-width:calc(100% - 16px);box-sizing:border-box;
}
.bk-hero-code-link{font-size:11px;margin-top:10px}
.bk-hero-pay-line{font-size:11px;display:inline-block;max-width:100%}
.bk-compare{gap:10px;margin-bottom:20px}
.bk-compare-card{padding:14px 14px}
.bk-email-box{
max-width:100%;margin:0 0 22px;padding:14px 14px;
box-sizing:border-box;
}
.bk-email-input{font-size:16px;padding:12px 14px} /* 16px = kein iOS-Zoom */
.bk-plan-grid{
grid-template-columns:1fr !important;
gap:14px;margin-bottom:28px;
min-width:0;
}
.bk-plan-card{min-width:0;max-width:100%}
.bk-plan-head{padding:18px 16px 14px}
.bk-plan-body{padding:14px 16px 18px}
.bk-plan-title{font-size:22px}
.bk-plan-price{font-size:32px}
.bk-plan-badge{top:12px;right:12px;font-size:8px;padding:3px 9px}
.bk-plan-actions{gap:10px}
.bk-plan-actions [id^="pp-"]{min-height:52px}
.bk-btn-crypto{
padding:14px 12px;font-size:11px;letter-spacing:1px;
min-height:48px; /* Touch-Target */
}
.bk-pay-hints{flex-direction:column;align-items:stretch;gap:8px;margin-bottom:22px}
.bk-pay-hint{width:100%;box-sizing:border-box;justify-content:center;padding:10px 12px}
.bk-how{margin-bottom:24px;padding:0 2px}
.bk-how-step{padding:12px 14px;font-size:12px}
.bk-pay-toast{margin-bottom:14px;padding:12px 12px;font-size:12px}
.bk-main{overflow-x:hidden;max-width:100%}
}
@media(max-width:380px){
.bk-page-hero h1{font-size:18px !important;letter-spacing:0 !important}
.bk-plan-title{font-size:20px}
.bk-plan-price{font-size:28px}
.bk-logo{font-size:16px;letter-spacing:0.5px}
}
/* Kombis */
/* Gewonnene Kombis: Datums-Akkordeon */
.won-kombi-acc{
background:var(--card);border:1px solid var(--bdr);border-radius:var(--r-lg);
margin-bottom:10px;overflow:hidden;
}
.won-kombi-acc[open]{border-color:rgba(0,217,126,0.28)}
.won-kombi-acc-sum{
list-style:none;cursor:pointer;user-select:none;
display:flex;align-items:center;justify-content:space-between;gap:12px;
padding:12px 14px;font-family:var(--fd);font-size:12px;font-weight:700;
letter-spacing:1px;text-transform:uppercase;color:var(--lime2);
-webkit-tap-highlight-color:transparent;
}
.won-kombi-acc-sum::-webkit-details-marker{display:none}
.won-kombi-acc-sum::after{content:'▾';color:var(--muted);font-size:11px;transition:transform .15s}
.won-kombi-acc[open] .won-kombi-acc-sum::after{transform:rotate(180deg)}
.won-kombi-acc-lbl{display:flex;align-items:center;gap:8px;min-width:0}
.won-kombi-acc-cnt{
font-size:10px;color:var(--muted);border:1px solid var(--bdr);
border-radius:10px;padding:2px 8px;letter-spacing:0.5px;
}
.won-kombi-acc-body{padding:0 12px 12px}
.kombi-card{margin-bottom:20px}
.kombi-card-hdr{
padding:18px 20px;background:var(--surf);
border-bottom:1px solid var(--bdr);
display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;
}
.kombi-card-title{font-family:var(--fd);font-size:20px;font-weight:700;letter-spacing:.5px}
.kombi-card-meta{
font-size:11px;color:var(--muted);margin-top:4px;
display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.kombi-card-meta .lime2{color:var(--lime2)}
.kombi-card-odds-lbl{
font-size:9px;color:var(--muted);text-transform:uppercase;
letter-spacing:1.5px;font-family:var(--fb);margin-bottom:4px;text-align:right;
}
.kombi-card-odds{
font-family:var(--fm);font-size:38px;font-weight:700;color:var(--gold);line-height:1;text-align:right;
}
.kombi-pick-row{
padding:14px 20px;border-bottom:1px solid var(--bdr);
display:grid;grid-template-columns:1fr auto;align-items:center;gap:16px;
transition:background .15s;
}
.kombi-pick-row:hover{background:var(--card2)}
.kombi-pick-meta{display:flex;align-items:center;gap:10px;flex-shrink:0}
.kombi-pick-tip{
text-align:center;padding:8px 16px;background:var(--limeg2);
border:1px solid var(--lime2);border-radius:var(--r);min-width:0;
}
.kombi-pick-odds{
text-align:center;padding:8px 16px;background:rgba(232,176,10,.06);
border:1px solid rgba(232,176,10,.2);border-radius:var(--r);min-width:72px;
}
.kombi-pick-league{
font-size:9px;color:var(--lime2);font-family:var(--fb);font-weight:700;
letter-spacing:2px;text-transform:uppercase;margin-bottom:4px;
}
.kombi-pick-ko{color:var(--muted);font-weight:400;margin-left:8px}
.kombi-pick-teams{
font-family:var(--fd);font-size:15px;font-weight:700;color:var(--text);
display:flex;align-items:center;gap:6px;flex-wrap:wrap;
}
.kombi-pick-vs{color:var(--muted);font-weight:400;font-size:12px}
.kombi-pick-tip-lbl,.kombi-pick-odds-lbl{
font-size:8px;text-transform:uppercase;letter-spacing:1.5px;
font-family:var(--fb);margin-bottom:3px;
}
.kombi-pick-tip-lbl{color:var(--lime2)}
.kombi-pick-odds-lbl{color:var(--muted)}
.kombi-pick-tip-val{
font-family:var(--fd);font-size:13px;font-weight:700;color:var(--lime);
}
.kombi-pick-odds-val{
font-family:var(--fm);font-size:18px;font-weight:700;color:var(--gold);
}
.kombi-meta-dot{color:var(--bdr2)}
.kombi-card-ftr{
padding:16px 20px;background:var(--surf);
display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;
}
.kombi-stake-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.kombi-stake-lbl{
font-size:9px;color:var(--muted);text-transform:uppercase;
letter-spacing:1.5px;font-family:var(--fb);margin-bottom:3px;
}
.kombi-stake-val{font-family:var(--fm);font-size:16px;font-weight:600;color:var(--green)}
.kombi-warn{font-size:11px;color:var(--muted);text-align:right;max-width:240px;line-height:1.5}
@media(max-width:640px){
.kombi-card-hdr{padding:14px 12px}
.kombi-card-title{font-size:16px}
.kombi-card-odds{font-size:28px}
.kombi-pick-row{grid-template-columns:1fr;gap:10px;align-items:stretch;padding:12px}
.kombi-pick-meta{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.kombi-pick-tip,.kombi-pick-odds{width:100%;box-sizing:border-box}
.kombi-pick-teams{font-size:13px}
.kombi-pick-tip-val{font-size:12px;overflow-wrap:anywhere}
.kombi-card-ftr{padding:12px;flex-direction:column;align-items:stretch}
.kombi-stake-row{justify-content:space-between}
.kombi-warn{text-align:left;max-width:none}
}
/* Empty-State Startseite */
.bk-empty-home{
text-align:center;
color:var(--text2);
padding:40px 22px 36px;
margin-bottom:24px;
}
.bk-empty-ico{font-size:40px;margin-bottom:12px;line-height:1}
.bk-empty-title{
font-family:var(--fd);font-size:18px;font-weight:700;
text-transform:uppercase;letter-spacing:1px;
margin:0 0 10px;color:var(--text);
}
.bk-empty-text{
font-size:13px;color:var(--text2);max-width:440px;
margin:0 auto 18px;line-height:1.55;
}
.bk-empty-next{
display:inline-flex;align-items:center;gap:10px;
margin:0 auto 20px;padding:12px 18px;
background:rgba(27,58,92,0.08);
border:1px solid rgba(27,58,92,0.35);
border-radius:12px;color:var(--text);
text-decoration:none;transition:border-color .15s, background .15s;
}
.bk-empty-next:hover{border-color:var(--lime);background:rgba(27,58,92,0.12);text-decoration:none}
.bk-empty-next-lbl{
font-family:var(--fb);font-size:10px;font-weight:700;
letter-spacing:1.2px;text-transform:uppercase;color:var(--muted);
}
.bk-empty-next-date{
font-family:var(--fd);font-size:16px;font-weight:700;color:var(--lime);
}
.bk-empty-next-go{color:var(--lime);font-weight:700;font-size:16px}
.bk-empty-stats{
display:flex;flex-wrap:wrap;justify-content:center;gap:10px;
margin:0 auto 22px;max-width:480px;
}
.bk-empty-stat{
min-width:110px;padding:12px 14px;
background:var(--surf);border:1px solid var(--bdr);border-radius:10px;
}
.bk-empty-stat-v{
font-family:var(--fd);font-size:20px;font-weight:700;color:var(--text);line-height:1.1;
}
.bk-empty-stat-v.lime{color:var(--lime)}
.bk-empty-stat-v.gold{color:var(--gold)}
.bk-empty-stat-k{
font-family:var(--fb);font-size:9px;font-weight:700;
letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin-top:5px;
}
.bk-empty-ctas{
display:flex;flex-wrap:wrap;gap:10px;justify-content:center;
}
.bk-empty-cta{
display:inline-block;padding:10px 16px;border-radius:8px;
border:1px solid var(--bdr);color:var(--text2);text-decoration:none;
font-family:var(--fd);font-size:11px;font-weight:700;
letter-spacing:1px;text-transform:uppercase;
transition:border-color .15s, color .15s, background .15s;
}
.bk-empty-cta:hover{border-color:var(--bdr2);color:var(--text);text-decoration:none}
.bk-empty-cta-pri{
border-color:var(--lime2);color:var(--lime);
background:rgba(27,58,92,0.06);
}
.bk-empty-cta-pri:hover{border-color:var(--lime);color:var(--lime);background:rgba(27,58,92,0.1)}
.bk-empty-cta-pro{
border-color:rgba(232,176,10,0.35);color:var(--gold);
}
.bk-empty-cta-pro:hover{border-color:var(--gold);color:var(--gold)}
.bk-empty-leagues{
display:flex;flex-wrap:wrap;gap:8px 10px;justify-content:center;
margin-top:18px;padding-top:16px;border-top:1px solid var(--bdr);
}
.bk-empty-leagues a{
font-family:var(--fd);font-size:11px;font-weight:700;letter-spacing:.6px;
text-transform:uppercase;color:var(--muted);text-decoration:none;
display:inline-flex;align-items:center;justify-content:center;
min-height:44px;min-width:44px;padding:10px 12px;box-sizing:border-box;
border:1px solid var(--bdr);border-radius:8px;background:var(--surf);
}
.bk-empty-leagues a:hover{color:var(--lime);border-color:var(--lime2)}
.bk-empty-title{color:var(--text)}
.bk-empty-text{color:#c4c4c4} /* a11y: stärkerer Kontrast als --text2 */
@media(max-width:480px){
.bk-empty-stat{min-width:90px;flex:1 1 40%}
.bk-empty-next{width:100%;justify-content:center;box-sizing:border-box}
}
.bk-glass-soft{
background:var(--glass-bg-soft) !important;
border:1px solid var(--bdr);
border-radius:var(--r-lg);
}
.bk-paywall{
background:#fff !important;
}
/* Pro/Liga-Container die glass-vars nutzen */
.lg-acc,
.mf-group{
background:var(--glass-bg-soft) !important;
}
/* ── HERO ────────────────────────────────────────────── */
.bk-hero{text-align:center;padding:28px 20px 20px}
/* Einheitlicher Unterseiten-Hero (Kombis, Ergebnisse, Preise, …) */
.bk-page-hero{text-align:center;padding:32px 12px 22px}
.bk-page-hero .hero-badge{margin-bottom:14px}
.bk-page-hero h1{
font-family:var(--fd);font-weight:700;
font-size:clamp(24px,5.4vw,40px);letter-spacing:-0.2px;
text-transform:none;line-height:1.18;margin:0 0 12px;
max-width:100%;padding:0 2px;box-sizing:border-box;
overflow-wrap:anywhere;word-break:break-word;hyphens:auto;
}
.bk-page-hero h1 .lime{color:var(--lime)}
/* Mobile: Titel in 2 Zeilen statt abschneiden */
@media(max-width:640px){
.bk-page-hero h1 .bk-h1-a{display:block;font-size:0.92em;letter-spacing:0.5px}
.bk-page-hero h1 .bk-h1-b{display:inline-block;margin-top:2px}
}
.bk-page-hero .hero-sub{
color:var(--text2);font-size:13px;max-width:520px;
margin:0 auto;letter-spacing:0.4px;line-height:1.55;
padding:0 4px;box-sizing:border-box;
}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:var(--surf);border:1px solid var(--bdr);border-radius:20px;padding:6px 14px;margin-bottom:16px;font-family:var(--fb);font-size:12px;font-weight:600;letter-spacing:0.2px;text-transform:none;color:var(--text2)}
.hero-badge-logo{width:22px;height:22px;object-fit:contain;flex-shrink:0}
.bk-hero h1{font-family:var(--fd);font-weight:700;font-size:clamp(32px,6vw,56px);letter-spacing:-0.3px;text-transform:none;line-height:1.12;margin-bottom:14px}
.hero-trial{margin:12px 0 0;font-size:13px;color:var(--muted)}
.hero-trial a{color:var(--lime);font-weight:600;text-decoration:none}
.hero-trial a:hover{text-decoration:underline}
.bk-hero h1 .lime{color:var(--lime);white-space:nowrap}
.hero-sub{color:var(--text2);font-size:13px;max-width:500px;margin:0 auto 20px;letter-spacing:0.5px}
/* Free-Märkte: Lock statt Blur (echte Tipps nicht sichtbar) */
.mc2-lock-wrap{
position:relative;display:flex;flex-direction:column;align-items:flex-start;
gap:8px;min-height:48px;justify-content:center;
}
.mc2-lock-ghost{
font-family:var(--fd);font-size:15px;font-weight:700;
color:var(--muted);letter-spacing:2px;user-select:none;
opacity:0.55;
}
.mc2-lock-ghost.score{font-size:20px;color:var(--gold);letter-spacing:3px}
.mc2-lock-ghost.sm{font-size:13px;letter-spacing:1px}
.mc2-lock-btn,.mc2-lock-pill{
display:inline-flex;align-items:center;gap:5px;
font-family:var(--fb);font-size:10px;font-weight:700;
letter-spacing:1px;text-transform:uppercase;text-decoration:none;
color:#fff;background:var(--lime);border:none;
padding:6px 12px;border-radius:20px;cursor:pointer;
transition:background .15s, transform .15s;
}
.mc2-lock-btn:hover,.mc2-lock-pill:hover{background:#244A73;color:#fff;text-decoration:none}
.mc2-lock-pill{
background:rgba(139,77,255,0.18);border:1px solid rgba(139,77,255,0.45);
color:#8b4dff;padding:3px 10px;font-size:9px;
}
.mc2-lock-pill:hover{background:rgba(139,77,255,0.28);color:#a87aff}
.mc2-lock-overlay{
position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
background:rgba(12,12,12,0.72);border-radius:8px;z-index:2;
}
.mc2-dblock.mc2-locked{position:relative;min-height:90px}
.mc2-dblock.mc2-locked > .mc2-lock-veil{
position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,14,14,0.55),rgba(14,14,14,0.88));
display:flex;align-items:center;justify-content:center;z-index:2;border-radius:0;
pointer-events:none;
}
.mc2-dblock.mc2-locked > .mc2-lock-veil a{pointer-events:auto}
.live-dot{display:inline-flex;align-items:center;gap:7px;font-family:var(--fb);font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--red)}
.live-dot::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--red)}
@keyframes lpulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:0.4;transform:scale(1.4)}}
/* ── STATS ───────────────────────────────────────────── */
.bk-stats{display:grid;grid-template-columns:repeat(4,1fr);background:var(--surf);border:1px solid var(--bdr);border-radius:var(--r-xl);overflow:hidden;margin-bottom:28px}
.bk-stat{padding:20px 16px;border-right:1px solid var(--bdr);text-align:center;transition:background 0.15s}
.bk-stat:last-child{border-right:none}
.bk-stat:hover{background:var(--card)}
.sv{font-family:var(--fd);font-size:28px;font-weight:700;line-height:1}
.sv.lime{color:var(--lime)}.sv.green{color:var(--green)}.sv.gold{color:var(--gold)}
.sk{font-size:9px;text-transform:uppercase;letter-spacing:2px;color:var(--muted);margin-top:5px;font-family:var(--fb)}
/* ── DATE TABS ───────────────────────────────────────── */
.date-tabs{display:flex;gap:6px;margin-bottom:20px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
.date-tabs::-webkit-scrollbar{display:none}
.dt{flex-shrink:0;padding:6px 16px;border:1px solid var(--bdr);border-radius:var(--r);font-family:var(--fd);font-size:11px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--muted);background:transparent;cursor:pointer;transition:all 0.15s;white-space:nowrap}
.dt:hover{border-color:var(--bdr2);color:var(--text)}
.dt.active{border-color:var(--lime);color:var(--lime);background:var(--limeg2)}
.home-date-tabs{margin:4px 0 18px}
.home-kombis{margin:8px 0 28px;min-width:0;overflow:hidden}
.home-kombis-hdr{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px}
.home-kombis-title{font-family:var(--fd);font-size:13px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--lime);margin:0}
.home-kombis-all{font-family:var(--fb);font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--muted);text-decoration:none;white-space:nowrap}
.home-kombis-all:hover{color:var(--lime)}
.home-kombis-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.home-kombi{display:block;background:var(--card);border:1px solid var(--bdr);border-radius:var(--r-xl);padding:14px 16px;text-decoration:none;color:inherit;transition:border-color .15s,transform .15s;min-width:0}
.home-kombi:hover{border-color:var(--lime2);transform:translateY(-1px)}
.home-kombi-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:4px}
.home-kombi-name{font-family:var(--fd);font-size:13px;font-weight:700;color:var(--text);min-width:0;overflow-wrap:anywhere}
.home-kombi-odds{font-family:var(--fm);font-size:16px;font-weight:700;color:var(--gold);white-space:nowrap;flex-shrink:0}
.home-kombi-meta{font-size:11px;color:var(--muted);margin-bottom:8px}
.home-kombi-picks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.home-kombi-picks li{display:flex;justify-content:space-between;gap:8px;font-size:12px;min-width:0}
.home-kombi-teams{color:var(--text2);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.home-kombi-tip{color:var(--lime);font-weight:600;white-space:nowrap;flex-shrink:0}
@media(max-width:900px){
.home-kombis-grid{grid-template-columns:1fr}
.home-kombi-tip{white-space:normal}
.home-kombi-picks li{flex-wrap:wrap}
}
@media(max-width:720px){
.home-kombis{margin:4px 0 20px}
.home-kombis-grid{grid-template-columns:1fr;gap:8px}
.home-kombis-hdr{align-items:center;margin-bottom:8px}
.home-kombis-title{font-size:12px;letter-spacing:1px}
.home-kombi{padding:12px;border-radius:12px}
.home-kombi:hover{transform:none}
.home-kombi-top{align-items:center;gap:8px}
.home-kombi-name{font-size:12px;line-height:1.3}
.home-kombi-odds{font-size:15px}
.home-kombi-meta{font-size:10px;margin-bottom:6px}
.home-kombi-picks{gap:6px}
.home-kombi-picks li{
flex-direction:column;align-items:flex-start;gap:2px;
padding:7px 8px;background:var(--surf);border-radius:8px;
}
.home-kombi-teams{white-space:normal;overflow:visible;text-overflow:unset;font-size:12px;line-height:1.3}
.home-kombi-tip{white-space:normal;font-size:12px}
}
@media(max-width:400px){
.home-kombi{padding:10px}
.home-kombi-odds{font-size:14px}
}
/* ── SEC LABEL ───────────────────────────────────────── */
.sec-lbl{font-family:var(--fb);font-size:10px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--muted);margin-bottom:16px;display:flex;align-items:center;gap:12px}
.sec-lbl::after{content:'';flex:1;height:1px;background:var(--bdr)}
.sec-lbl .lime{color:var(--lime)}
/* ── MATCH CARD ──────────────────────────────────────── */
.mc{background:var(--card);border:1px solid var(--bdr);border-radius:var(--r-xl);margin-bottom:16px;overflow:hidden;transition:all 0.2s;box-shadow:var(--shadow)}
.mc:hover{border-color:var(--bdr2);transform:translateY(-2px);box-shadow:var(--shadow-lg)}
/* League Bar */
.mc-league{padding:8px 18px;background:var(--surf);border-bottom:1px solid var(--bdr);display:flex;align-items:center;justify-content:space-between}
.lg-badge{font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:6px}
.lg-round{font-size:9px;color:var(--label);font-family:var(--fb)}
/* Teams Header */
.mc-hdr{display:grid;grid-template-columns:1fr 140px 1fr;align-items:center;padding:20px 18px 16px;gap:12px;background:linear-gradient(135deg,rgba(27,58,92,0.02) 0%,transparent 60%)}
.team{display:flex;flex-direction:column;gap:5px}
.team.away{align-items:flex-end}
.t-row{display:flex;align-items:center;gap:10px}
.t-row.away{flex-direction:row-reverse}
.t-logo{width:40px;height:40px;object-fit:contain;flex-shrink:0}
.t-logo-fb{width:40px;height:40px;background:var(--surf);border:1px solid var(--bdr);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-family:var(--fd);font-size:11px;font-weight:700;color:var(--muted);flex-shrink:0}
.t-name{font-family:var(--fd);font-weight:700;font-size:17px;letter-spacing:0.5px;color:var(--text)}
.t-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:2px}
.t-meta.away{justify-content:flex-end}
.t-rank{font-size:9px;font-weight:700;color:var(--lime);border:1px solid var(--lime2);padding:1px 6px;border-radius:3px;font-family:var(--fb);letter-spacing:0.5px}
.t-coach{font-size:11px;color:var(--text2);font-family:var(--fb)}
.form-row{display:flex;gap:3px;margin-top:3px}
.form-row.away{justify-content:flex-end}
.fb_{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:3px;font-size:9px;font-weight:700;font-family:var(--fb)}
.fw_{background:rgba(0,217,126,0.15);color:var(--green);border:1px solid rgba(0,217,126,0.3)}
.fd__{background:rgba(232,176,10,0.1);color:var(--gold);border:1px solid rgba(232,176,10,0.2)}
.fl_{background:rgba(232,18,50,0.1);color:var(--red);border:1px solid rgba(232,18,50,0.2)}
/* Score Block */
.score-blk{text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px}
.score{font-family:var(--fd);font-weight:700;font-size:38px;letter-spacing:4px;line-height:1;color:var(--text)}
.score.tbd{font-size:20px;letter-spacing:8px;color:var(--muted)}
.ht-sc{font-size:10px;color:var(--muted);font-family:var(--fm);letter-spacing:1px}
.ko{font-family:var(--fm);font-size:11px;color:var(--text2);letter-spacing:0.5px}
.s-pill{display:inline-block;font-size:9px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;padding:3px 8px;border-radius:3px;font-family:var(--fb)}
.s-pill.done{background:rgba(0,217,126,0.1);color:var(--green);border:1px solid rgba(0,217,126,0.25)}
.s-pill.live_{background:rgba(232,18,50,0.15);color:#ff3d55;border:1px solid rgba(232,18,50,0.3);animation:none}
.s-pill.ns{background:var(--surf);color:var(--muted);border:1px solid var(--bdr)}
/* Formation */
.mc-formation{display:grid;grid-template-columns:1fr auto 1fr;padding:0 18px 12px;gap:12px}
.formation-tag{font-family:var(--fm);font-size:11px;color:var(--muted);background:var(--surf);border:1px solid var(--bdr);padding:2px 8px;border-radius:3px;display:inline-block}
.formation-tag.away{text-align:right}
.vs-sep{font-family:var(--fb);font-size:10px;color:var(--muted);text-align:center;letter-spacing:2px}
/* Injured */
.inj-row{display:flex;gap:8px;padding:8px 18px;border-top:1px solid var(--bdr);flex-wrap:wrap;align-items:center;background:rgba(232,18,50,0.02)}
.inj-lbl{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;font-family:var(--fb)}
.inj-pill{font-size:10px;font-family:var(--fb);font-weight:700;color:var(--red);background:rgba(232,18,50,0.08);border:1px solid rgba(232,18,50,0.2);padding:2px 7px;border-radius:3px;white-space:nowrap}
/* Probability Bar */
.prob-sec{padding:0}
.prob-bar-wrap{display:flex;height:42px;border-top:1px solid var(--bdr);border-bottom:1px solid var(--bdr)}
.prob-seg{display:flex;align-items:center;justify-content:center;transition:width 0.6s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}
.prob-seg.h{background:linear-gradient(90deg,rgba(100,180,20,0.6),rgba(27,58,92,0.8))}
.prob-seg.d{background:rgba(40,40,40,0.8)}
.prob-seg.a{background:linear-gradient(90deg,rgba(8,50,140,0.7),rgba(13,110,255,0.85))}
.prob-seg-txt{font-family:var(--fd);font-size:13px;font-weight:700;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,0.5);z-index:1}
.prob-seg.d .prob-seg-txt{color:var(--text2)}
.prob-labels{display:grid;grid-template-columns:1fr 1fr 1fr;padding:6px 18px;background:var(--surf)}
.prob-label{font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted)}
.prob-label:nth-child(2){text-align:center}
.prob-label:nth-child(3){text-align:right}
/* Markets Grid */
.markets{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--bdr);border-top:1px solid var(--bdr)}
.mkt{background:var(--card);padding:14px 16px;transition:background 0.15s}
.mkt:hover{background:var(--card2)}
.mkt.full{grid-column:1/-1}
.mkt-t{font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-bottom:7px;display:flex;align-items:center;gap:5px}
.mkt-v{font-family:var(--fd);font-size:17px;font-weight:700;line-height:1.2;margin-bottom:5px}
.mkt-v.lime{color:var(--lime)}.mkt-v.gold{color:var(--gold)}.mkt-v.blue{color:var(--blue)}.mkt-v.purple{color:var(--purple)}.mkt-v.red{color:var(--red)}.mkt-v.green{color:var(--green)}
.cbar{display:flex;align-items:center;gap:8px;margin:5px 0}
.ct{flex:1;height:3px;background:var(--surf);border-radius:2px;overflow:hidden}
.cf{height:100%;border-radius:2px;transition:width 0.5s}
.cf.lime{background:linear-gradient(90deg,var(--lime2),var(--lime))}
.cf.gold{background:linear-gradient(90deg,#7a5a00,var(--gold))}
.cf.blue{background:linear-gradient(90deg,#063a8a,var(--blue))}
.cf.purple{background:linear-gradient(90deg,#3d1a80,var(--purple))}
.cf.red{background:linear-gradient(90deg,#8a0a1c,var(--red))}
.cf.green{background:linear-gradient(90deg,#006a3a,var(--green))}
.cpct{font-family:var(--fm);font-size:10px;color:var(--muted);white-space:nowrap;min-width:32px}
.mkt-r{font-size:11px;color:var(--text2);margin-top:4px;line-height:1.6}
.qbadge{font-family:var(--fm);font-size:12px;color:var(--gold);background:rgba(232,176,10,0.08);border:1px solid rgba(232,176,10,0.18);padding:2px 8px;border-radius:3px;margin-left:8px}
.spills{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px}
.spill{font-size:10px;font-family:var(--fb);font-weight:700;padding:3px 9px;border-radius:3px;border:1px solid var(--lime2);background:var(--limeg);color:var(--lime2);transition:all 0.15s}
.spill.top{border-color:var(--lime);background:var(--limeg);color:var(--lime)}
.mkt-lock{opacity:0.5}
.mkt-lock-txt{font-size:10px;color:var(--muted);margin-top:6px;display:flex;align-items:center;gap:4px}
/* Odds */
.odds-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:8px}
.odds-i{background:var(--surf);border:1px solid var(--bdr);border-radius:var(--r);padding:10px 8px;text-align:center;transition:all 0.15s}
.odds-i:hover{border-color:var(--bdr2)}
.odds-i.best{border-color:var(--lime2);background:var(--limeg2)}
.odds-l{font-size:9px;text-transform:uppercase;letter-spacing:1.5px;color:var(--muted);font-family:var(--fb);margin-bottom:4px}
.odds-v{font-family:var(--fm);font-size:16px;font-weight:600;color:var(--gold)}
.odds-i.best .odds-v{color:var(--lime)}
/* H2H */
.h2h-row{display:flex;gap:0;border-radius:var(--r);overflow:hidden;margin-top:8px}
.h2h-s{flex:1;text-align:center;padding:10px 6px;background:var(--surf);border-right:1px solid var(--bdr)}
.h2h-s:last-child{border-right:none}
.h2h-v{font-family:var(--fd);font-size:20px;font-weight:700;line-height:1}
.h2h-k{font-size:9px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);font-family:var(--fb);margin-top:3px}
/* Value Bet */
.vbet{background:var(--surf);border:1px solid var(--bdr);border-radius:var(--r);padding:12px 14px;margin-top:8px}
.vbet-l{font-family:var(--fb);font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--lime2);margin-bottom:4px}
.vbet-m{font-family:var(--fd);font-size:15px;font-weight:700;color:var(--lime)}
.vbet-p{font-family:var(--fm);font-size:12px;color:var(--gold);margin-top:2px}
/* Factors */
.factors{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.factor{font-size:11px;background:var(--surf);border:1px solid var(--bdr);padding:3px 10px;border-radius:var(--r);color:var(--text2)}
/* AD BANNER */
.ad-banner{background:var(--surf);border:1px solid var(--bdr);border-left:3px solid var(--lime);border-radius:var(--r-lg);padding:14px 18px;display:flex;align-items:center;gap:14px;margin-bottom:14px;cursor:pointer;transition:border-color 0.15s}
.ad-banner:hover{border-color:var(--lime);transform:translateY(-1px);box-shadow:var(--shadow)}
.ad-logo{width:48px;height:48px;object-fit:contain;border-radius:var(--r);background:var(--card);padding:4px;flex-shrink:0}
.ad-logo-fb{width:48px;height:48px;background:var(--card);border:1px solid var(--bdr);border-radius:var(--r);display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-size:14px;font-weight:700;color:var(--lime);flex-shrink:0}
.ad-bookie{font-family:var(--fd);font-size:16px;font-weight:700;color:var(--text)}
.ad-offer{font-size:12px;color:var(--text2);margin-top:2px}
.ad-badge{font-family:var(--fb);font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;background:var(--lime);color:#fff;padding:3px 10px;border-radius:3px;white-space:nowrap;margin-left:auto}
.ad-disc{font-size:9px;color:var(--muted);text-align:center;margin-top:4px;letter-spacing:0.5px}
/* PAYWALL */
.bk-paywall{border:1px solid var(--bdr);border-radius:var(--r-lg);padding:36px 24px;text-align:center;margin:28px 0;position:relative;overflow:hidden}
.pw-crown{display:none}
.pw-title{font-family:var(--fd);font-weight:700;font-size:clamp(20px,3.6vw,28px);letter-spacing:0;text-transform:none;margin-bottom:10px}
.pw-title .lime{color:var(--lime)}
.pw-sub{color:var(--text2);font-size:13px;margin-bottom:20px;line-height:1.7;max-width:460px;margin-left:auto;margin-right:auto}
.pw-features{display:flex;flex-wrap:wrap;justify-content:center;gap:7px;margin-bottom:24px}
.pw-feat{background:var(--surf);border:1px solid var(--bdr);border-radius:var(--r);padding:5px 13px;font-size:12px;color:var(--text2)}
.pw-feat .lime{color:var(--lime)}
.pw-btn{display:inline-block;background:var(--cta);color:var(--cta-ink);font-family:var(--fb);font-weight:700;font-size:14px;letter-spacing:0;text-transform:none;padding:12px 28px;border-radius:20px;transition:background 0.15s;cursor:pointer;border:none}
.pw-btn:hover{background:var(--cta-hover);color:var(--cta-ink)}
/* RESULTS */
.res-row{background:var(--surf);border:1px solid var(--bdr);border-radius:var(--r);padding:10px 14px;display:grid;grid-template-columns:1fr auto auto auto;align-items:center;gap:10px;margin-bottom:6px;transition:background 0.15s}
.res-row:hover{background:var(--card)}
.res-match strong{font-family:var(--fd);font-size:13px;font-weight:600}
.res-st{font-size:10px;color:var(--muted);margin-top:1px}
.res-score{font-family:var(--fm);font-size:13px;color:var(--gold);min-width:40px;text-align:center}
.res-tip{font-size:11px;color:var(--muted)}
.res-b{font-size:10px;font-weight:700;padding:2px 8px;border-radius:3px;font-family:var(--fb);white-space:nowrap}
.res-b.ok{background:rgba(0,217,126,0.1);color:var(--green)}
.res-b.no{background:rgba(232,18,50,0.1);color:var(--red)}
/* FOOTER (Layout-Details/Overrides auch in base.html) */
.bk-footer{background:var(--chrome2);border-top:none;padding:28px 20px 22px;position:relative;overflow:visible;isolation:isolate;max-width:100%;color:#ddd}
.footer-col-legal a{white-space:nowrap}
.footer-links{display:grid;grid-template-columns:1fr 1fr;gap:16px 24px;min-width:0}
.footer-social{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
/* EU Cookie Banner */
.bk-cookie{
position:fixed;bottom:0;left:0;right:0;z-index:9999;
background:#fff;border-top:1px solid var(--bdr);
padding:16px 18px;
box-shadow:0 -8px 28px rgba(26,31,36,0.08);
}
.bk-cookie[hidden]{display:none !important}
.bk-cookie.is-open{display:block}
.bk-cookie-inner{max-width:1080px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:flex-start;gap:14px 20px}
.bk-cookie-text{flex:1 1 280px;min-width:0}
.bk-cookie-title{font-family:var(--fd);font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--lime);margin-bottom:6px}
.bk-cookie-text p{font-size:12px;color:var(--text2);line-height:1.55;margin:0}
.bk-cookie-text a{color:var(--lime);text-decoration:underline;text-underline-offset:2px}
.bk-cookie-details{margin-top:12px;padding:10px 12px;background:var(--surf);border:1px solid var(--bdr);border-radius:var(--r);display:flex;flex-direction:column;gap:8px}
.bk-cookie-details[hidden]{display:none !important}
.bk-cookie-row{display:flex;align-items:flex-start;gap:10px;font-size:11px;color:var(--text2);cursor:pointer;line-height:1.4}
.bk-cookie-row input{margin-top:2px;accent-color:var(--lime);flex-shrink:0}
.bk-cookie-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-end}
.bk-cookie-btn{
font-family:var(--fd);font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;
padding:9px 14px;border-radius:6px;cursor:pointer;border:1px solid var(--bdr);background:var(--surf);color:var(--text2);
white-space:nowrap;
}
.bk-cookie-btn-lime{background:var(--cta);border-color:var(--cta);color:var(--cta-ink)}
.bk-cookie-btn-lime:hover{background:var(--cta-hover)}
.bk-cookie-btn-ghost{background:transparent;border-color:var(--bdr2);color:var(--text2)}
.bk-cookie-btn-ghost:hover{border-color:var(--muted);color:var(--text)}
.bk-cookie-btn-dim{background:var(--card2);border-color:var(--bdr);color:var(--muted)}
.bk-cookie-btn-dim:hover{color:var(--text)}
@media(max-width:600px){
.bk-cookie{padding:14px 12px 18px}
.bk-cookie-actions{width:100%;justify-content:stretch}
.bk-cookie-btn{flex:1 1 auto;text-align:center;padding:10px 10px;font-size:10px;letter-spacing:0.5px}
}
.footer-inner{max-width:1080px;margin:0 auto;display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr);gap:32px;margin-bottom:28px;position:relative;z-index:2;width:100%;box-sizing:border-box}
.footer-brand{min-width:0}
.footer-brand .footer-desc{font-size:12px;color:#BBB;line-height:1.8;max-width:260px;margin-top:10px}
.footer-col{min-width:0}
.footer-col h4,
.footer-col .footer-col-title{
font-family:var(--fb);font-size:10px;font-weight:700;letter-spacing:2px;
text-transform:uppercase;color:#fff;margin:0 0 10px;line-height:1.2;
}
.footer-col a{
display:block;font-size:12px;color:#DDD;
margin:0 0 7px;padding:0;line-height:1.35;transition:color 0.15s;
overflow:hidden;text-overflow:ellipsis;
}
.footer-col a:last-child{margin-bottom:0}
.footer-col a:hover{color:#fff}
/* Touch etwas großzügiger nur mobil, ohne Desktop-Löcher */
@media(max-width:768px){
.footer-col a{padding:5px 0;margin:0 0 4px;min-height:36px;display:flex;align-items:center}
}
.footer-pay-row{margin-top:14px;display:flex;flex-direction:column;align-items:flex-start;gap:8px;max-width:100%}
.footer-pay-label{font-size:12px;color:#BBB;line-height:1.2}
.footer-pay-badges{display:flex;flex-wrap:wrap;align-items:center;gap:6px;max-width:100%;overflow:visible}
.footer-pay-badges>span{flex-shrink:0;white-space:nowrap}
@media(max-width:768px){
.footer-pay-badges{gap:5px}
.footer-pay-badges>span{font-size:9px;padding:2px 7px}
}
.footer-bottom-wrap{position:relative;max-width:1080px;margin:0 auto;overflow:visible;z-index:2}
.footer-bottom{border-top:1px solid #3d4554;padding-top:20px;text-align:center;position:relative;z-index:2}
.footer-disc{font-size:12px;color:#9aa0a6;line-height:1.8;max-width:700px;margin:0 auto 10px}
.footer-copy{font-size:11px;color:#9aa0a6;letter-spacing:0.5px}
.footer-credit{font-size:10px;color:#7a8088;letter-spacing:.5px;margin:7px 0 0;line-height:1.4}
.footer-credit a{color:#BBB;text-decoration:none;border-bottom:1px solid #4a5160;transition:color .15s,border-color .15s}
.footer-credit a:hover{color:#fff;border-bottom-color:#888}
/* Logo „24“: nicht zu dunkel für Kontrast */
.bk-logo .num{color:#9a9a9a}
/* Footer Girl – z-index über grauen Trennlinien */
.bk-footer{position:relative;overflow:visible}
.footer-pwa,.footer-bottom-wrap,.footer-bottom,.footer-inner{position:relative;z-index:2}
.footer-girl{display:none !important}
.footer-girl-off{
position:absolute;
right:16px;
top:28px;
bottom:auto;
transform:none;
width:118px;
z-index:8;
pointer-events:none;
opacity:0.95;
line-height:0;
display:block !important;
visibility:visible !important;
}
.footer-girl picture{
display:block;
width:100%;
line-height:0;
}
.footer-girl-img,
.footer-girl img{
display:block !important;
width:100%;
height:auto;
max-height:280px;
object-fit:contain;
object-position:center top;
filter:drop-shadow(0 6px 16px rgba(0,0,0,0.55)) drop-shadow(0 0 12px rgba(27,58,92,0.12));
user-select:none;
-webkit-user-drag:none;
visibility:visible !important;
position:relative;
z-index:8;
}
@media(min-width:769px){
.footer-girl{width:118px;right:16px;top:28px;transform:none;opacity:0.95;z-index:8}
.footer-girl-img,
.footer-girl img{max-height:280px}
.footer-inner{padding-right:140px}
}
@media(min-width:1100px){
.footer-girl{width:130px;right:20px;top:22px;z-index:8}
.footer-girl-img,
.footer-girl img{max-height:300px}
.footer-inner{padding-right:155px}
}
/* Handy: wie vorher – tiefer unter Payment, neben Nav */
@media(max-width:768px){
.footer-girl{
width:min(108px,30vw);
right:6px;
top:340px;
transform:none;
opacity:0.95;
z-index:8;
}
.footer-girl-img,
.footer-girl img{max-height:min(240px,40vh);object-position:center top}
.footer-inner{padding-right:min(100px,28vw)}
.footer-bottom{padding-right:0;text-align:left}
.footer-disc{margin-left:0;max-width:none}
}
/* PRO LOGIN */
.pro-box{background:var(--card);border:1px solid var(--bdr);border-top:2px solid var(--lime);border-radius:var(--r-xl);padding:48px 40px;width:100%;max-width:400px;text-align:center}
.pro-box input[type=text]{width:100%;background:var(--surf);border:1px solid var(--bdr);color:var(--text);font-family:var(--fm);font-size:13px;padding:12px 16px;border-radius:var(--r);margin-bottom:12px;outline:none;transition:border-color 0.15s}
.pro-box input[type=text]:focus{border-color:var(--lime2)}
/* LEGAL (Impressum / AGB / Datenschutz) – Brand + responsive */
.legal-page{
max-width:760px;margin:0 auto;padding:36px 16px 80px;
background:var(--card);border:1px solid var(--bdr);border-radius:var(--r-xl);
box-shadow:var(--shadow);
}
.legal-page.has-hero > h1:first-child{display:none}
.legal-page .container{display:block;max-width:none;margin:0;padding:0;background:transparent;border:none;box-shadow:none;border-radius:0}
.legal-page h1{
font-family:var(--fd);font-size:clamp(22px,5vw,32px);font-weight:700;
text-transform:uppercase;letter-spacing:1px;color:var(--text);
text-align:left;border-bottom:2px solid var(--lime);padding-bottom:14px;margin:0 0 24px;
}
.legal-page h2{
font-family:var(--fd);font-size:13px;font-weight:700;text-transform:uppercase;
letter-spacing:1.5px;color:var(--lime);margin:28px 0 10px;
border-left:2px solid var(--lime);padding-left:10px;line-height:1.35;
}
.legal-page h3{font-family:var(--fd);font-size:12px;color:var(--lime2);margin:18px 0 8px;text-transform:uppercase;letter-spacing:1px}
.legal-page p,.legal-page li{font-family:var(--fb);font-size:13px;color:var(--text2);line-height:1.85;margin-bottom:12px}
.legal-page ul,.legal-page ol{padding-left:1.25em;margin:0 0 14px}
.legal-page li{margin-bottom:6px}
.legal-page a{color:var(--lime);text-decoration:underline;text-underline-offset:2px}
.legal-page a:hover{color:var(--lime2)}
.legal-page strong,.legal-page b,.legal-page .highlight{color:var(--lime);font-weight:600}
.legal-page .footer,.legal-page .legal-footer{
margin-top:40px;padding-top:16px;border-top:1px solid var(--bdr);
text-align:center;font-size:12px;color:var(--muted);
}
.legal-page .footer p{color:var(--muted);margin:0}
@media(max-width:600px){
.legal-page{padding:20px 14px 48px;border-radius:var(--r-lg);margin:0 4px 40px}
.legal-page h1{font-size:22px;margin-bottom:18px;padding-bottom:10px}
.legal-page h2{font-size:12px;margin-top:22px}
.legal-page p,.legal-page li{font-size:13px;line-height:1.7}
}
/* Ergebnis-Seite: Win-Karten */
/* Ergebnisse: Archiv-Tabs + Liga-Filter */
.bk-arch-tabs{
display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px;align-items:center;
}
.bk-arch-tab{
font-family:var(--fd);font-size:11px;font-weight:700;letter-spacing:.8px;
text-transform:uppercase;text-decoration:none;color:var(--muted);
padding:8px 12px;border-radius:8px;border:1px solid var(--bdr);
background:var(--card2);transition:border-color .15s,color .15s,background .15s;
}
.bk-arch-tab:hover{color:var(--text);border-color:var(--bdr2);text-decoration:none}
.bk-arch-tab.is-active{
color:var(--lime);border-color:var(--lime2);
background:rgba(27,58,92,0.08);
}
.bk-res-filter{
display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 12px;
}
.bk-res-chip{
font-family:var(--fb);font-size:10px;font-weight:700;letter-spacing:.8px;
text-transform:uppercase;color:var(--muted);cursor:pointer;
padding:7px 12px;border-radius:20px;border:1px solid var(--bdr);
background:var(--surf);transition:border-color .15s,color .15s,background .15s;
}
.bk-res-chip:hover{color:var(--text);border-color:var(--bdr2)}
.bk-res-chip.is-active{
color:var(--lime);border-color:var(--lime2);
background:rgba(27,58,92,0.08);
}
.bk-res-note{
font-size:12px;color:var(--muted);line-height:1.5;margin:0 0 16px;max-width:640px;
}
.bk-res-note a{color:var(--lime2);text-decoration:none}
.bk-res-note a:hover{color:var(--lime);text-decoration:underline}
.bk-res-empty-filter{
text-align:center;color:var(--muted);font-size:13px;
padding:28px 16px;border:1px dashed var(--bdr);border-radius:12px;margin-bottom:20px;
}
.bk-res-more{margin:4px 0 28px;padding:18px 0 0;border-top:1px solid var(--bdr)}
.bk-res-more-txt{font-size:13px;color:var(--muted);margin:0 0 12px;line-height:1.45}
.bk-res-more .bk-arch-tabs{margin:0}
.win-list{display:flex;flex-direction:column;gap:12px;margin-bottom:28px}
.win-card{
background:var(--card);border:1px solid var(--bdr);border-left:3px solid var(--lime);
border-radius:var(--r-lg);padding:14px 16px;box-shadow:var(--shadow);
}
.win-card-top{
display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px;
}
.win-card-match{flex:1;min-width:0}
.win-card-tipslink{color:inherit;text-decoration:none;display:inline-flex;align-items:center;flex-wrap:wrap;gap:inherit}
.win-card-tipslink:hover{color:var(--lime)}
.win-card-teams{
font-family:var(--fd);font-weight:600;font-size:13px;color:var(--text);
display:flex;align-items:center;gap:4px;flex-wrap:wrap;line-height:1.35;
}
.win-vs{color:var(--muted);font-weight:400;font-size:11px;margin:0 2px}
.win-card-meta{
font-size:10px;color:var(--muted);margin-top:5px;
display:flex;align-items:center;gap:6px;flex-wrap:wrap;
}
.win-card-liga{color:var(--muted);text-decoration:none}
.win-card-liga:hover{color:var(--lime)}
.win-card-dot{opacity:.5}
.win-card-right{
display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex-shrink:0;
}
.win-hit-badge{
font-family:var(--fb);font-size:10px;font-weight:700;letter-spacing:.5px;
color:#fff;background:var(--lime);border-radius:999px;
padding:3px 8px;line-height:1;white-space:nowrap;
box-shadow:0 0 12px rgba(27,58,92,.25);
}
.win-card-score{text-align:right}
.win-score-final{
font-family:var(--fd);font-size:26px;font-weight:700;color:var(--lime);
letter-spacing:1px;line-height:1;
text-shadow:none;
}
.win-score-ht{font-size:10px;color:var(--muted);margin-top:3px;font-family:var(--fm);letter-spacing:.3px}
.win-card-tips{display:flex;flex-wrap:wrap;gap:6px}
.win-tip-chip{
background:var(--limeg2);border:1px solid rgba(27,58,92,.28);border-radius:999px;
padding:5px 10px 5px 8px;display:inline-flex;align-items:center;gap:6px;
max-width:100%;
}
.win-tip-ok{color:var(--lime);font-size:11px;font-weight:700;flex-shrink:0}
.win-tip-mkt{
font-size:9px;color:var(--muted);font-family:var(--fb);letter-spacing:.8px;
text-transform:uppercase;flex-shrink:0;
}
.win-tip-val{font-size:12px;font-weight:600;color:var(--lime);line-height:1.2}
.win-tip-odds{
font-family:var(--fm);font-size:10px;font-weight:600;color:var(--gold);
background:rgba(232,176,10,.1);border:1px solid rgba(232,176,10,.28);
border-radius:999px;padding:2px 6px;line-height:1.2;flex-shrink:0;
}
@media(max-width:600px){
.win-card{padding:12px;border-left-width:3px}
.win-card-top{
flex-direction:row;align-items:flex-start;gap:10px;margin-bottom:10px;
}
.win-card-right{align-items:flex-end}
.win-score-final{font-size:22px}
.win-card-tips{gap:5px}
.win-tip-chip{padding:5px 9px 5px 7px}
}
/* CONTACT / FAQ */
.contact-section-title{font-family:var(--fd);font-size:18px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--lime2);margin-bottom:20px}
.contact-faq{margin-bottom:48px}
.faq-item{background:var(--card);border:1px solid var(--bdr);border-radius:var(--r-lg);margin-bottom:10px;overflow:hidden;transition:border-color .2s}
.faq-item[open]{border-color:var(--lime2)}
.faq-item summary{font-family:var(--fd);font-size:14px;font-weight:600;letter-spacing:.5px;padding:16px 20px;cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--text);user-select:none}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:'+';font-size:18px;color:var(--lime2);font-weight:700;flex-shrink:0;transition:transform .2s}
.faq-item[open] summary::after{content:'-'}
.faq-item summary:hover{color:var(--lime)}
.faq-item p{font-size:13px;color:var(--text2);line-height:1.8;padding:0 20px 16px;margin:0}
.faq-item p a{color:var(--lime2);text-decoration:underline}
.contact-alert{max-width:720px;margin:0 auto 28px;padding:14px 18px;border-radius:var(--r-lg);font-size:13px;line-height:1.6}
.contact-alert-ok{background:rgba(0,217,126,.08);border:1px solid var(--green);color:var(--green)}
.contact-alert-err{background:rgba(232,18,50,.08);border:1px solid var(--red);color:var(--red)}
.contact-alert-err a{color:var(--lime2)}
.contact-form-section{max-width:720px;margin:0 auto;background:var(--card);border:1px solid var(--bdr);border-radius:var(--r-xl);padding:28px 24px 32px}
.contact-form-sub{font-size:13px;color:var(--text2);margin-bottom:24px;line-height:1.7}
.contact-form{display:flex;flex-direction:column;gap:16px}
.contact-form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.contact-field{display:flex;flex-direction:column;gap:6px}
.contact-field label{font-family:var(--fb);font-size:10px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted)}
.contact-field input,.contact-field select,.contact-field textarea{width:100%;padding:11px 14px;background:var(--bg);border:1px solid var(--bdr);color:var(--text);font-family:var(--fb);font-size:13px;border-radius:var(--r);outline:none;transition:border-color .2s;box-sizing:border-box}
.contact-field input:focus,.contact-field select:focus,.contact-field textarea:focus{border-color:var(--lime2)}
.contact-field textarea{resize:vertical;min-height:120px}
.contact-field select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23666' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px}
.contact-hp{position:absolute;left:-9999px;opacity:0;height:0;width:0;pointer-events:none}
.contact-privacy{font-size:11px;color:var(--muted);line-height:1.6}
.contact-privacy a{color:var(--lime2)}
.contact-captcha{margin-top:4px;padding:14px 16px;background:var(--surf);border:1px solid var(--bdr);border-radius:var(--r-lg)}
.contact-captcha-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.contact-captcha-q{font-family:var(--fd);font-size:16px;font-weight:700;letter-spacing:1px;color:var(--lime);white-space:nowrap}
.contact-captcha input{width:88px;max-width:30vw;text-align:center;font-family:var(--fm);font-size:16px;font-weight:600}
.contact-captcha-hint{font-size:11px;color:var(--muted);margin-top:8px;line-height:1.5}
.contact-submit{align-self:flex-start;background:var(--lime);color:#fff;font-family:var(--fd);font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:13px 28px;border:none;border-radius:var(--r);cursor:pointer;transition:background .2s,transform .1s}
.contact-submit:hover{background:#244A73}
.contact-submit:active{transform:scale(.98)}
.contact-direct{margin-top:20px;padding-top:18px;border-top:1px solid var(--bdr);font-size:12px;color:var(--muted);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.contact-direct a{color:var(--lime2);font-family:var(--fm);font-size:12px}
@media(max-width:600px){
.contact-form-row{grid-template-columns:1fr}
.contact-form-section{padding:20px 16px 24px}
}
/* PRICING */
.plan-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-bottom:40px}
.plan-card{background:var(--card);border:1px solid var(--bdr);border-radius:var(--r-xl);overflow:hidden;transition:all 0.2s}
.plan-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.plan-card.prem{border-color:var(--lime2)}
.plan-hdr{padding:24px 24px 18px;border-bottom:1px solid var(--bdr)}
.plan-badge{font-family:var(--fb);font-size:10px;letter-spacing:2px;text-transform:uppercase;margin-bottom:6px}
.plan-name{font-family:var(--fd);font-size:26px;font-weight:700}
.plan-name.lime{color:var(--lime)}
.plan-price{font-family:var(--fd);font-size:36px;font-weight:700;margin-top:12px;line-height:1}
.plan-price span{font-size:14px;color:var(--muted);font-weight:400}
.plan-feats{padding:16px 24px 24px}
.plan-feat{font-size:12px;color:var(--text2);margin-bottom:8px;display:flex;gap:8px;align-items:flex-start}
.plan-feat .lime{color:var(--lime)}
/* ADMIN */
.adm-wrap{max-width:1200px;margin:0 auto;padding:24px 16px 80px}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--bdr);margin-bottom:24px;overflow-x:auto;padding-bottom:0;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab-btn{font-family:var(--fd);font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);background:transparent;border:none;border-bottom:2px solid transparent;padding:10px 16px;cursor:pointer;transition:all 0.15s;white-space:nowrap;margin-bottom:-1px}
.tab-btn:hover{color:var(--text)}
.tab-btn.active{color:var(--lime);border-bottom-color:var(--lime)}
.tab{display:none;animation:fadeIn 0.2s ease}
.tab.active{display:block}
@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.adm-wrap h2{font-family:var(--fd);font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--lime2);margin:28px 0 12px;display:flex;align-items:center;gap:10px}
.adm-wrap h2::after{content:'';flex:1;height:1px;background:var(--bdr)}
.fld{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
.fld label{font-family:var(--fb);font-size:10px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted)}
.fld input,.fld select,.fld textarea{background:var(--surf);border:1px solid var(--bdr);color:var(--text);font-family:var(--fm);font-size:12px;padding:9px 12px;border-radius:var(--r);outline:none;transition:border-color 0.15s;width:100%}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--lime2)}
.srow{display:grid;gap:12px}
.s2{grid-template-columns:1fr 1fr}
.s3{grid-template-columns:1fr 1fr 1fr}
.bb{display:inline-flex;align-items:center;gap:5px;padding:7px 14px;border:1px solid transparent;border-radius:var(--r);cursor:pointer;font-family:var(--fd);font-weight:700;font-size:11px;letter-spacing:1px;text-transform:uppercase;transition:all 0.15s;white-space:nowrap}
.bb-lime{background:var(--lime);color:#fff;border-color:var(--lime)}
.bb-lime:hover{background:#244A73}
.bb-gold{background:rgba(232,176,10,0.1);color:var(--gold);border-color:rgba(232,176,10,0.2)}
.bb-red{background:rgba(232,18,50,0.1);color:var(--red);border-color:rgba(232,18,50,0.25)}
.bb-blue{background:rgba(13,110,255,0.1);color:var(--blue);border-color:rgba(13,110,255,0.2)}
.bb-dim{background:var(--surf);color:var(--muted);border-color:var(--bdr)}
.ubox{background:var(--surf);border:1px solid var(--bdr);border-radius:var(--r);padding:14px 16px;font-size:12px;display:flex;flex-direction:column;gap:8px}
.ubox div{display:flex;gap:10px;align-items:center;color:var(--muted)}
.ubox span{font-family:var(--fm);color:var(--lime2);background:var(--card);padding:2px 8px;border-radius:3px;border:1px solid var(--bdr)}
.ab{font-size:10px;font-weight:700;padding:2px 8px;border-radius:3px;font-family:var(--fb)}
.ab.yes{background:rgba(0,217,126,0.1);color:var(--green)}
.ab.no{background:rgba(232,18,50,0.1);color:var(--red)}
table{width:100%;border-collapse:collapse;font-size:12px}
th{font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--bdr);text-align:left;background:var(--surf)}
td{padding:10px 12px;border-bottom:1px solid var(--bdr);color:var(--text2);vertical-align:middle}
tr:hover td{background:var(--card)}
.match-status{font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:1px;padding:2px 7px;border-radius:3px}
.ms-live{background:rgba(232,18,50,0.1);color:var(--red)}
.ms-draft{background:rgba(232,176,10,0.1);color:var(--gold)}
.ms-ft{background:rgba(0,217,126,0.1);color:var(--green)}
.flash{padding:12px 16px;border-radius:var(--r);margin-bottom:16px;font-size:13px;display:flex;align-items:center;gap:8px}
.flash.ok{background:rgba(0,217,126,0.08);color:var(--green);border:1px solid rgba(0,217,126,0.2)}
.flash.error{background:rgba(232,18,50,0.08);color:var(--red);border:1px solid rgba(232,18,50,0.2)}
/* WINNER TICKER */
.winner-ticker{background:var(--surf);border:1px solid var(--bdr);border-radius:var(--r-lg);padding:10px 0;margin-bottom:20px;overflow:hidden}
.ticker-label{font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--lime);padding:0 18px 8px;border-bottom:1px solid rgba(27,58,92,0.08);margin-bottom:8px}
.ticker-track{overflow:hidden;white-space:nowrap}
.ticker-inner{display:flex;flex-wrap:wrap;width:100%;animation:none;will-change:auto}
.ticker-inner:hover{animation-play-state:paused}
.ticker-item{display:inline-flex;align-items:center;gap:10px;padding:4px 24px 4px 0;border-right:1px solid rgba(27,58,92,0.1);margin-right:24px;flex-shrink:0;line-height:1}
.ti-check{color:var(--green);font-size:12px}
.ti-match{font-family:var(--fd);font-size:11px;font-weight:600;color:var(--text2)}
.ti-tip{font-size:11px;color:var(--lime)}
.ti-quote{font-family:var(--fm);font-size:10px;color:var(--gold)}
/* HAMBURGER */
.burger-btn{display:none;flex-direction:column;gap:5px;background:transparent;border:none;cursor:pointer;padding:7px;border-radius:var(--r);transition:background 0.15s}
.burger-btn:hover{background:rgba(255,255,255,.08)}
.burger-btn span{display:block;width:22px;height:2px;background:#fff;border-radius:2px;transition:all 0.25s;transform-origin:center}
.burger-btn.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger-btn.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.burger-btn.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-menu{position:fixed;top:var(--bk-chrome-h,102px);right:-100%;width:min(320px,92vw);height:calc(100vh - var(--bk-chrome-h,102px) - var(--bk-menu-bottom,0px));height:calc(100dvh - var(--bk-chrome-h,102px) - var(--bk-menu-bottom,0px));background:#fff;border-left:1px solid var(--bdr);z-index:500;padding:12px 20px calc(16px + env(safe-area-inset-bottom));transition:right 0.3s cubic-bezier(0.4,0,0.2,1);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.mobile-menu.open{right:0}
.mobile-overlay{position:fixed;inset:0;background:rgba(26,31,36,0.35);z-index:499;opacity:0;pointer-events:none;transition:opacity 0.3s}
.mobile-overlay.open{opacity:1;pointer-events:all}
.mobile-nav{display:flex;flex-direction:column;gap:4px;margin-bottom:28px}
.mobile-nav a{color:var(--text2);font-family:var(--fd);font-size:18px;font-weight:600;letter-spacing:1px;text-transform:uppercase;padding:12px 16px;border-radius:var(--r);transition:all 0.15s;display:block}
.mobile-nav a:hover{color:var(--lime);background:var(--surf)}
.mobile-nav a.active{color:var(--lime)}
.mobile-lang{padding:20px 0;border-top:1px solid var(--bdr)}
.mobile-lang-lbl{display:block;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;font-family:var(--fd)}
.mobile-lang-flags{display:flex;gap:8px;margin-top:10px}
.mlang{
flex:1;min-height:44px;display:flex;align-items:center;justify-content:center;gap:8px;
color:var(--muted);font-family:var(--fd);font-size:12px;font-weight:700;letter-spacing:.04em;
padding:8px 10px;border:1.5px solid var(--bdr);border-radius:12px;transition:all 0.15s;text-decoration:none;
}
.mlang svg{display:block;width:22px;height:15px;border-radius:2px;flex-shrink:0}
.mlang:hover{color:var(--text);border-color:var(--bdr2)}
.mlang.active{background:var(--limeg);color:var(--lime);border-color:var(--cta,#e8c56b);box-shadow:0 0 10px rgba(232,197,107,.28)}
/* Oben rechts: 👑 Pro – Puls wie zuvor, nicht abschneiden */
.mobile-pro-btn,.header-pro-btn{
display:inline-flex;align-items:center;justify-content:center;gap:5px;
background:var(--cta);color:var(--cta-ink);flex-shrink:0;
font-family:var(--fb);font-weight:700;font-size:13px;letter-spacing:0;text-transform:none;
padding:7px 14px;border-radius:20px;white-space:nowrap;
position:relative;isolation:isolate;max-width:none;overflow:visible;
border:none;
}
.mobile-pro-btn::after,.header-pro-btn::after{content:none;display:none}
.mobile-pro-btn:hover,.header-pro-btn:hover{background:var(--cta-hover);color:var(--cta-ink)}
@keyframes proPulse{
0%,100%{transform:scale(1)}
50%{transform:scale(1.07)}
}
@keyframes proGlow{
0%,100%{opacity:0}
50%{opacity:1}
}
@media (prefers-reduced-motion:reduce){
.mobile-pro-btn,.header-pro-btn{animation:none}
.mobile-pro-btn::after,.header-pro-btn::after{animation:none;opacity:0}
}
/* Footer-Ad Glow: compositor-freundlich (opacity statt outline/box-shadow-Anim) */
.ad-pulse-link{
display:block;
border-radius:10px;
overflow:hidden;
position:relative;
box-shadow:0 4px 24px rgba(0,0,0,.4);
outline:none;
}
.ad-pulse-link::after{content:none;display:none}
@keyframes adPulse{
0%,100%{opacity:0.4}
50%{opacity:1}
}
@media (prefers-reduced-motion:reduce){
.ad-pulse-link::after{animation:none;opacity:0.7}
}
/* RESPONSIVE */
@media(max-width:768px){
.bk-header{
padding:0 10px;height:54px;gap:8px;
grid-template-columns:minmax(0,1fr) auto; /* Logo | Actions – Nav weg */
}
.bk-subbar{min-height:34px;padding:0 10px;gap:10px}
.bk-subbar-track{gap:14px}
.bk-subbar-track a,.bk-subbar-track span,
.bk-subbar-promo{font-size:12px;line-height:34px}
.bk-subbar-optional{display:none}
.bk-nav,#desktop-nav{display:none !important}
.lang-sw{display:none}
.bk-header-actions{gap:6px}
.bk-header-actions .header-pro-btn,
.bk-header-actions .mobile-pro-btn{margin-right:8px}
.lang-dd{display:block}
.lang-dd-btn{width:40px;height:40px;min-width:40px;min-height:40px}
.lang-dd-flag svg,.lang-dd-item svg{width:20px;height:13px}
.lang-dd-menu{
right:0;left:auto;
}
.burger-btn{
display:flex !important;flex-shrink:0;
width:40px;height:34px;align-items:center;justify-content:center;
padding:0;box-sizing:border-box;
}
.header-pro-btn,.mobile-pro-btn{
flex-shrink:0;padding:6px 10px;font-size:11px;letter-spacing:0.5px;
max-width:none;overflow:visible;white-space:nowrap;
}
.bk-logo{font-size:18px;letter-spacing:1px;max-width:calc(100vw - 160px);overflow:visible;padding-top:0.25em}
#pwa-install-btn{display:flex !important}
.bk-main{padding:20px 12px 80px}
.bk-hero{padding:32px 14px 24px}
.bk-stats{grid-template-columns:repeat(2,1fr)}
.bk-stat:nth-child(2){border-right:none}
.bk-stat:nth-child(3){border-top:1px solid var(--bdr)}
.mc-hdr{grid-template-columns:1fr 100px 1fr}
.t-name{font-size:14px}
.t-logo{width:32px;height:32px}
.score{font-size:28px}
.markets{grid-template-columns:1fr}
.mkt.full{grid-column:1}
.odds-grid{grid-template-columns:repeat(2,1fr)}
.footer-inner{grid-template-columns:1fr;gap:24px}
.bk-paywall{padding:32px 16px}
.plan-grid{grid-template-columns:1fr}
.s3{grid-template-columns:1fr}
.prob-seg-txt{font-size:11px}
.adm-wrap{padding:16px 12px 60px}
}
@media(max-width:480px){
.mc-hdr{grid-template-columns:1fr 80px 1fr;padding:14px 12px 12px}
.t-name{font-size:13px}
.score{font-size:24px;letter-spacing:2px}
}
@media(display-mode:standalone){
.bk-chrome{top:0}
.bk-header{padding-top:env(safe-area-inset-top);height:calc(60px + env(safe-area-inset-top))}
body{padding-bottom:env(safe-area-inset-bottom)}
}
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:var(--bg2)}
::-webkit-scrollbar-thumb{background:var(--bdr2);border-radius:3px}
/* ═══════════════════════════════════════════════════════
MATCH CARDS v2 – Neues Card-Design
═══════════════════════════════════════════════════════ */
/* Container */
.match-cards { display: flex; flex-direction: column; gap: 10px; margin-bottom: 28px; }
/* Liga-Trenner */
.mc-league-sep {
display: flex; align-items: center; gap: 10px;
padding: 4px 2px; margin-top: 8px;
}
.mc-league-icon { font-size: 14px; }
.mc-league-logo { width: 18px; height: 18px; object-fit: contain; flex-shrink: 0; border-radius: 3px; }
.mc-league-txt {
font-family:var(--fb); font-size: 10px; font-weight: 700;
letter-spacing: 2.5px; text-transform: uppercase; color: var(--lime2);
flex: 1;
}
.mc-league-sep::after {
content: ''; flex: 1; height: 1px;
background: linear-gradient(90deg, var(--bdr), transparent);
}
/* Karte */
.mc2 {
background: var(--card);
border: 1px solid var(--bdr);
border-radius: var(--r-xl);
overflow: hidden;
cursor: pointer;
transition: border-color 0.18s, box-shadow 0.18s;
position: relative;
}
.mc2::before {
content: "";
position: absolute; left: 0; top: 0; bottom: 0; width: 2px;
background: var(--bdr2);
pointer-events: none;
}
.mc2.mc2-pick-home::before { background: var(--lime); box-shadow: none; }
.mc2.mc2-pick-draw::before { background: var(--gold); box-shadow: none; }
.mc2.mc2-pick-away::before { background: var(--blue); box-shadow: none; }
.mc2:hover {
border-color: var(--lime2);
box-shadow: var(--shadow);
}
.mc2.mc2-live::before { background: var(--red); box-shadow: none; }
.mc2.mc2-open {
border-color: var(--lime2);
box-shadow: var(--shadow);
}
/* Top-Bar */
.mc2-top {
display: flex; align-items: center; justify-content: space-between;
gap: 10px;
padding: 7px 16px 7px 18px;
background: transparent;
border-bottom: 1px solid var(--bdr);
}
.mc2-time {
font-family: var(--fm); font-size: 11px; color: var(--muted);
letter-spacing: 0.3px;
}
.mc2-top-mid { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.mc2-status {
font-family: var(--fm); font-size: 10px; font-weight: 600;
letter-spacing: 0.6px; text-transform: uppercase;
padding: 2px 7px; border-radius: 4px;
}
.mc2-ft { background: rgba(0,217,126,0.10); color: var(--green); }
.mc2-ns { color: var(--muted); }
.mc2-live-s { background: rgba(232,18,50,0.14); color: var(--red); }
.mc2-sig {
display: inline-flex; align-items: center; gap: 4px;
font-family: var(--fm); font-size: 10px; font-weight: 700;
letter-spacing: 0.4px; padding: 2px 7px; border-radius: 4px;
border: 1px solid transparent;
}
.mc2-sig-edge {
color: var(--gold);
background: rgba(232,176,10,0.08);
border-color: rgba(232,176,10,0.28);
}
.mc2-value {
font-family: var(--fm); font-size: 10px; font-weight: 700;
letter-spacing: 0.4px; color: var(--gold);
background: rgba(232,176,10,0.08);
border: 1px solid rgba(232,176,10,0.28);
padding: 2px 7px; border-radius: 4px;
}
.mc2-expand {
display: inline-flex; align-items: center; gap: 5px;
font-family: var(--fm); font-size: 10px; font-weight: 600;
letter-spacing: 0.4px; color: var(--muted);
white-space: nowrap;
}
.mc2-expand i {
width: 5px; height: 5px;
border-right: 1.5px solid currentColor;
border-bottom: 1.5px solid currentColor;
transform: rotate(-45deg);
margin-top: -1px;
transition: transform 0.18s;
}
.mc2-open .mc2-expand { color: var(--text2); }
.mc2-open .mc2-expand i { transform: rotate(45deg); }
/* Body: Teams */
.mc2-body {
display: grid;
grid-template-columns: 1fr minmax(140px, 0.42fr) 1fr;
align-items: center;
padding: 20px 16px 16px;
gap: 8px;
}
.mc2-team {
display: flex; flex-direction: column; align-items: center; gap: 8px;
}
.mc2-team-id {
display: flex; flex-direction: column; align-items: inherit; gap: 8px;
}
.mc2-home { align-items: flex-start; }
.mc2-away { align-items: flex-end; }
.mc2-side, .mc2-h2h-mid { display: none; }
.mc2-1x2 {
display: flex;
gap: 4px;
width: 100%;
max-width: 168px;
}
.mc2-1x2-cell {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
gap: 1px;
padding: 5px 2px 4px;
background: var(--surf);
border: 1px solid var(--bdr);
border-radius: 7px;
}
.mc2-1x2-cell.is-pick-h { border-color: var(--lime); background: rgba(27,58,92,0.12); }
.mc2-1x2-cell.is-pick-d { border-color: var(--gold); background: rgba(232,176,10,0.12); }
.mc2-1x2-cell.is-pick-a { border-color: var(--blue); background: rgba(13,110,255,0.14); }
.mc2-1x2-l {
font-family:var(--fb);
font-size: 8px;
font-weight: 700;
letter-spacing: 0.8px;
color: var(--muted);
}
.mc2-1x2-q {
font-family: var(--fm);
font-size: 13px;
font-weight: 700;
color: var(--gold);
line-height: 1.1;
}
.mc2-1x2-d {
font-family: var(--fm); font-size: 9px; font-weight: 700; line-height: 1;
letter-spacing: 0.2px;
}
.mc2-1x2-d.is-plus { color: var(--lime); }
.mc2-1x2-d.is-minus { color: #c07070; }
.mc2-1x2-cell.is-pick-h .mc2-1x2-l { color: var(--lime); }
.mc2-1x2-cell.is-pick-d .mc2-1x2-l { color: var(--gold); }
.mc2-1x2-cell.is-pick-a .mc2-1x2-l { color: var(--blue); }
.mc2-round {
color: var(--muted); font-weight: 500; margin-left: 4px;
max-width: 28ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
display: inline-block; vertical-align: bottom;
}
.mc2-eta {
font-family: var(--fm); font-size: 10px; font-weight: 600;
color: var(--text2); letter-spacing: 0.2px;
}
.mc2-eta.is-soon { color: var(--gold); }
.mc2-eta:empty { display: none; }
.mc2-center:has(.mc2-1x2) .mc2-vs,
.mc2-center:has(.mc2-1x2) .mc2-tip-badge { display: none; }
.mc2:has(.mc2-1x2) .mc2-footer-center .mc2-quote,
.mc2:has(.mc2-1x2) .mc2-footer-center .mc2-quote-lbl { display: none; }
.mc2-logo {
width: 48px; height: 48px; object-fit: contain;
filter: drop-shadow(0 2px 8px rgba(0,0,0,0.5));
border-radius: 4px;
}
.mc2-logo-fb {
width: 48px; height: 48px;
background: var(--surf); border: 1px solid var(--bdr);
border-radius: 50%;
display: flex; align-items: center; justify-content: center;
font-family: var(--fd); font-size: 14px; font-weight: 700; color: var(--muted);
}
.mc2-tname {
font-family: var(--fd); font-size: 15px; font-weight: 600;
color: var(--text2); line-height: 1.2;
text-align: left;
}
.mc2-away .mc2-tname { text-align: right; }
.mc2-tname-bold { color: var(--text); font-weight: 700; }
.mc2-rank {
font-family: var(--fm); font-size: 9px;
color: var(--lime2); background: var(--limeg2);
border: 1px solid var(--lime2); padding: 1px 6px; border-radius: 3px;
}
/* Center: Score / VS / Tipp */
.mc2-center {
display: flex; flex-direction: column;
align-items: center; gap: 6px;
}
/* Desktop: Stats neben Logos + 1X2 in der Mitte – Handy unverändert */
@media (min-width: 720px) {
.mc2-body {
grid-template-columns: minmax(220px, 1fr) minmax(260px, 0.85fr) minmax(220px, 1fr);
padding: 16px 20px 12px;
gap: 10px 12px;
}
.mc2-home {
flex-direction: row;
align-items: center;
justify-content: flex-start;
gap: 14px;
}
.mc2-away {
flex-direction: row-reverse;
align-items: center;
justify-content: flex-start;
gap: 14px;
}
.mc2-side {
display: flex;
flex-direction: column;
gap: 5px;
min-width: 0;
}
.mc2-home .mc2-side { align-items: flex-start; }
.mc2-away .mc2-side { align-items: flex-end; }
.mc2-side-meta {
font-family: var(--fm);
font-size: 11px;
color: var(--muted);
white-space: nowrap;
}
.mc2-1x2 {
max-width: 300px;
gap: 6px;
margin-top: 6px;
}
.mc2-1x2-cell { padding: 6px 4px 5px; border-radius: 8px; gap: 2px; }
.mc2-1x2-l { font-size: 9px; letter-spacing: 1px; }
.mc2-1x2-q { font-size: 15px; }
.mc2-footer-left .mc2-form-row,
.mc2-footer-right .mc2-form-row { display: none; }
.mc2-side.is-empty { display: none; }
.mc2-h2h-mid {
display: block;
font-family: var(--fm);
font-size: 11px;
color: var(--muted);
letter-spacing: 0.3px;
margin-top: 2px;
}
.mc2-center { gap: 8px; }
.mc2-open .mc2-expand i { transform: rotate(45deg); }
}
@media (min-width: 720px) and (max-width: 899px) {
.mc2-body {
grid-template-columns: minmax(130px, 1fr) minmax(168px, 0.9fr) minmax(130px, 1fr);
padding: 14px 12px 10px;
gap: 8px;
}
.mc2-side { display: none; }
.mc2-footer-left .mc2-form-row,
.mc2-footer-right .mc2-form-row { display: flex; }
.mc2-1x2 { max-width: 188px; margin-top: 4px; }
.mc2-1x2-q { font-size: 13px; }
.mc2-tname { font-size: 13px; }
}
.mc2-vs {
font-family: var(--fd); font-size: 22px; font-weight: 700;
color: var(--bdr2); letter-spacing: 3px;
}
.mc2-pred-score {
font-family: var(--fm); font-size: 11px; color: var(--gold);
}
.mc2-score-final {
font-family: var(--fd); font-size: 32px; font-weight: 700;
color: var(--text); letter-spacing: 4px; line-height: 1;
}
.mc2-score-live {
font-family: var(--fd); font-size: 32px; font-weight: 700;
color: var(--red); letter-spacing: 4px; line-height: 1;
animation: none;
}
.mc2-ht { font-family: var(--fm); font-size: 10px; color: var(--muted); }
.mc2-tip-badge {
width: 36px; height: 36px; border-radius: 50%;
display: flex; align-items: center; justify-content: center;
font-family: var(--fd); font-size: 15px; font-weight: 700;
box-shadow: 0 2px 12px rgba(0,0,0,0.4);
}
.mc2-tip-home { background: var(--lime); color: #fff; box-shadow: none; }
.mc2-tip-draw { background: var(--gold); color: #111; box-shadow: 0 2px 16px rgba(232,176,10,0.35); }
.mc2-tip-away { background: var(--blue); color: #fff; box-shadow: 0 2px 16px rgba(13,110,255,0.4); }
/* Probability meters — 3 slim 1X2 tracks, pick highlighted */
.mc2-prob {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 10px;
padding: 8px 14px 10px;
border-top: 1px solid var(--bdr);
background: linear-gradient(180deg, rgba(255,255,255,0.02), transparent);
}
.mc2-prob-col { min-width: 0; }
.mc2-prob-meta {
display: flex;
justify-content: space-between;
align-items: baseline;
gap: 6px;
margin-bottom: 4px;
padding: 0 1px;
}
.mc2-prob-k {
font-family:var(--fb);
font-size: 9px;
font-weight: 700;
letter-spacing: 1px;
color: var(--muted);
}
.mc2-prob-pct {
font-family: var(--fm);
font-size: 11px;
font-weight: 600;
color: var(--text2);
font-variant-numeric: tabular-nums;
}
.mc2-prob-track {
height: 5px;
border-radius: 99px;
background: rgba(255,255,255,0.06);
overflow: hidden;
}
.mc2-prob-fill {
display: block;
height: 100%;
border-radius: 99px;
min-width: 4px;
}
.mc2-prob-h { background: linear-gradient(90deg, #5a8a14, #c6f04a); }
.mc2-prob-d { background: linear-gradient(90deg, #6a6a6a, #c4c4c4); }
.mc2-prob-a { background: linear-gradient(90deg, #1f5fa8, #6ec0ff); }
.mc2-prob-col.is-pick .mc2-prob-pct { font-weight: 700; }
.mc2-prob-col.is-pick-h .mc2-prob-k,
.mc2-prob-col.is-pick-h .mc2-prob-pct { color: var(--lime); }
.mc2-prob-col.is-pick-d .mc2-prob-k,
.mc2-prob-col.is-pick-d .mc2-prob-pct { color: var(--gold); }
.mc2-prob-col.is-pick-a .mc2-prob-k,
.mc2-prob-col.is-pick-a .mc2-prob-pct { color: var(--blue); }
.mc2-prob-col.is-pick .mc2-prob-track {
background: rgba(255,255,255,0.09);
}
.mc2-prob-col.is-pick-h .mc2-prob-fill { box-shadow: none; }
.mc2-prob-col.is-pick-d .mc2-prob-fill { box-shadow: 0 0 10px rgba(232,176,10,0.35); }
.mc2-prob-col.is-pick-a .mc2-prob-fill { box-shadow: 0 0 10px rgba(13,110,255,0.45); }
/* Model readout */
.mc2-model {
display: flex; align-items: center; flex-wrap: wrap;
gap: 8px 12px;
padding: 8px 16px 8px 18px;
border-top: 1px solid rgba(255,255,255,0.04);
background: rgba(0,0,0,0.18);
}
.mc2-model-call {
display: inline-flex; align-items: baseline; gap: 8px;
min-width: 0;
}
.mc2-model-k {
font-family: var(--fm); font-size: 9px; font-weight: 700;
letter-spacing: 1.4px; text-transform: uppercase; color: var(--muted);
}
.mc2-model-ring {
--c: 50;
width: 34px; height: 34px; border-radius: 50%;
display: inline-flex; align-items: center; justify-content: center;
background: conic-gradient(var(--ring, var(--lime)) calc(var(--c) * 1%), rgba(255,255,255,0.08) 0);
flex-shrink: 0;
}
.mc2-pick-home .mc2-model-ring { --ring: var(--lime); }
.mc2-pick-draw .mc2-model-ring { --ring: var(--gold); }
.mc2-pick-away .mc2-model-ring { --ring: var(--blue); }
.mc2-model-pick {
font-family: var(--fd); font-size: 13px; font-weight: 700; line-height: 1;
color: var(--text);
width: 26px; height: 26px; border-radius: 50%;
display: inline-flex; align-items: center; justify-content: center;
background: var(--card2);
}
.mc2-pick-home .mc2-model-pick { color: var(--lime); }
.mc2-pick-draw .mc2-model-pick { color: var(--gold); }
.mc2-pick-away .mc2-model-pick { color: var(--blue); }
.mc2-model-conf {
font-family: var(--fm); font-size: 12px; font-weight: 600;
color: var(--text2); font-variant-numeric: tabular-nums;
}
.mc2-model-conf.is-high { color: var(--lime); }
.mc2-model-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-left: auto; }
.mc2-chip {
font-family: var(--fm); font-size: 10px; color: var(--text2);
background: rgba(255,255,255,0.04);
border: 1px solid rgba(255,255,255,0.06);
border-radius: 4px; padding: 2px 7px; white-space: nowrap;
}
.mc2-chip-warn { color: #e8a0a0; border-color: rgba(232,18,50,0.22); background: rgba(232,18,50,0.06); }
.mc2-model-note {
flex: 1 1 100%;
margin: 0;
font-size: 12px; line-height: 1.4; color: var(--text2);
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* Footer: Quote + Form */
.mc2-footer {
display: grid; grid-template-columns: 1fr auto 1fr;
align-items: center;
padding: 10px 16px;
background: var(--surf);
border-top: 1px solid var(--bdr);
gap: 12px;
}
.mc2-footer-left, .mc2-footer-right { display: flex; align-items: center; }
.mc2-footer-right { justify-content: flex-end; }
.mc2-footer-center { display: flex; flex-direction: column; align-items: center; gap: 1px; }
.mc2-form-row { display: flex; gap: 3px; }
.mc2-fd {
display: inline-flex; align-items: center; justify-content: center;
width: 18px; height: 18px; border-radius: 3px;
font-family:var(--fb); font-size: 9px; font-weight: 700;
}
.mc2-fd-w { background: rgba(0,217,126,0.18); color: var(--green); border: 1px solid rgba(0,217,126,0.35); }
.mc2-fd-d { background: rgba(232,176,10,0.12); color: var(--gold); border: 1px solid rgba(232,176,10,0.25); }
.mc2-fd-l { background: rgba(232,18,50,0.12); color: var(--red); border: 1px solid rgba(232,18,50,0.25); }
.mc2-quote {
font-family: var(--fm); font-size: 18px; font-weight: 600; color: var(--gold);
line-height: 1;
}
.mc2-quote-lbl {
font-family:var(--fb); font-size: 8px; font-weight: 700;
letter-spacing: 1.5px; text-transform: uppercase; color: var(--muted);
}
/* ── DETAIL EXPAND (CSS Grid – kein flex-Stretch / leere Flächen auf PC) ── */
.mc2-detail {
display: none;
background: var(--card2);
border-top: 1px solid var(--bdr);
}
.mc2-detail.open {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
gap: 0;
align-items: stretch;
}
.mc2-dblock {
min-width: 0;
max-width: none;
width: auto;
flex: none;
padding: 16px;
border-right: 1px solid var(--bdr);
border-bottom: 1px solid var(--bdr);
overflow: hidden;
box-sizing: border-box;
}
.mc2-dblock:last-child { border-right: 1px solid var(--bdr); }
.mc2-dblock-inj { min-width: 0; }
@media (min-width: 900px) {
.mc2-detail.open {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}
@media (min-width: 1200px) {
.mc2-detail.open {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
}
.mc2-dlbl {
font-family:var(--fb); font-size: 9px; font-weight: 700;
letter-spacing: 2px; text-transform: uppercase; color: var(--muted);
margin-bottom: 10px;
}
.mc2-reasoning {
font-size: 12px; color: var(--text2); line-height: 1.75; margin-bottom: 8px;
overflow-wrap: anywhere; word-break: break-word;
}
/* Injury / Suspended list – no overlap, short labels */
.mc2-inj-cols {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 12px;
min-width: 0;
}
.mc2-inj-col { min-width: 0; }
.mc2-inj-team {
font-family:var(--fb); font-size: 9px; font-weight: 700;
letter-spacing: 1px; color: var(--muted); margin-bottom: 6px;
text-transform: uppercase;
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mc2-inj-row {
display: flex; align-items: flex-start; gap: 6px;
padding: 5px 0;
border-bottom: 1px solid var(--bdr);
min-width: 0;
}
.mc2-inj-icon { flex-shrink: 0; font-size: 10px; line-height: 1.4; }
.mc2-inj-meta {
display: flex; flex-direction: column; gap: 2px;
min-width: 0; flex: 1;
}
.mc2-inj-name {
font-family: var(--fd); font-size: 11px; font-weight: 600; color: var(--text);
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
line-height: 1.25;
}
.mc2-inj-badge {
font-family: var(--fm); font-size: 9px; color: var(--muted);
line-height: 1.2;
}
.mc2-inj-ok {
font-family: var(--fm); font-size: 11px; color: var(--lime);
padding: 4px 0;
}
@media (max-width: 1100px) {
.mc2-inj-cols { grid-template-columns: 1fr; }
}
.mc2-conf-wrap {
height: 4px; background: var(--surf); border-radius: 2px; overflow: hidden; margin-bottom: 4px;
}
.mc2-conf-bar {
height: 100%; border-radius: 2px;
background: linear-gradient(90deg, var(--lime2), var(--lime));
transition: width 0.6s ease;
}
.mc2-conf-lbl { font-family: var(--fm); font-size: 10px; color: var(--muted); }
.mc2-factors { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 10px; }
.mc2-factor {
font-size: 11px; padding: 3px 10px; border-radius: var(--r);
background: var(--surf); border: 1px solid var(--bdr); color: var(--text2);
max-width: 100%; overflow-wrap: anywhere; word-break: break-word;
line-height: 1.35;
}
/* Odds */
.mc2-odds-grid { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 10px; }
.mc2-odd {
background: var(--surf); border: 1px solid var(--bdr);
border-radius: var(--r); padding: 8px 12px;
text-align: center; min-width: 50px;
display: flex; flex-direction: column; gap: 3px;
}
.mc2-odd-best { border-color: var(--lime2); background: var(--limeg2); }
.mc2-odd-best-d { border-color: rgba(232,176,10,0.4); background: rgba(232,176,10,0.06); }
.mc2-odd-best-a { border-color: rgba(13,110,255,0.4); background: rgba(13,110,255,0.06); }
.mc2-odd-lbl {
font-family:var(--fb); font-size: 8px; font-weight: 700;
letter-spacing: 1px; text-transform: uppercase; color: var(--muted);
}
.mc2-odd-val {
font-family: var(--fm); font-size: 14px; font-weight: 600; color: var(--gold);
}
.mc2-odd-best .mc2-odd-val { color: var(--lime); }
.mc2-odd-best-a .mc2-odd-val { color: var(--blue); }
.mc2-vbet {
display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
background: rgba(232,176,10,0.05);
border: 1px solid rgba(232,176,10,0.18); border-radius: 8px;
padding: 10px 14px; margin-top: 6px;
}
.mc2-vbet-lbl { font-family: var(--fm); font-size: 10px; font-weight: 700; letter-spacing: 0.4px; color: var(--gold); }
.mc2-vbet-market { font-family: var(--fd); font-size: 13px; font-weight: 700; color: var(--text); }
.mc2-vbet-edge { font-family: var(--fm); font-size: 13px; color: var(--gold); font-weight: 600; }
/* H2H */
.mc2-h2h { display: flex; border-radius: var(--r); overflow: hidden; margin-top: 4px; }
.mc2-h2h-item {
flex: 1; text-align: center; padding: 10px 6px;
background: var(--surf); border-right: 1px solid var(--bdr);
}
.mc2-h2h-item:last-child { border-right: none; }
.mc2-h2h-val { font-family: var(--fd); font-size: 22px; font-weight: 700; line-height: 1; }
.mc2-h2h-lbl {
font-size: 9px; text-transform: uppercase; letter-spacing: 1px; color: var(--muted);
font-family:var(--fb); margin-top: 4px;
white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;
padding: 0 2px;
}
.mc2-hint {
margin-left: 8px; font-family: var(--fm); font-size: 9px; font-weight: 600;
letter-spacing: 0.3px; text-transform: none; color: var(--muted);
}
.mc2-score-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 10px; }
.mc2-score-chip {
font-family: var(--fm); font-size: 12px; font-weight: 600;
padding: 3px 8px; border-radius: 4px;
background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.07);
color: var(--text);
}
.mc2-score-chip.is-w { color: var(--lime); border-color: rgba(198,240,74,0.28); }
.mc2-score-chip.is-d { color: var(--gold); border-color: rgba(232,176,10,0.32); }
.mc2-score-chip.is-l { color: #c07070; border-color: rgba(192,112,112,0.28); }
.mc2-l5 { display: flex; flex-wrap: wrap; gap: 4px; margin: 4px 0 6px; }
.mc2-stline {
font-family: var(--fm); font-size: 11px; line-height: 1.45;
color: var(--text2); margin-top: 8px;
}
.mc2-h2h-forms { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.mc2-h2h-form { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mc2-h2h-form-n {
font-size: 11px; color: var(--text2); min-width: 0;
overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mc2-cmp { display: flex; flex-direction: column; gap: 7px; margin-top: 12px; }
.mc2-cmp-l {
display: flex; justify-content: space-between; align-items: center;
font-family: var(--fm); font-size: 10px; color: var(--muted); margin-bottom: 3px;
}
.mc2-cmp-track {
display: flex; height: 4px; border-radius: 99px; overflow: hidden;
background: rgba(255,255,255,0.05);
}
.mc2-cmp-h { display: block; height: 100%; background: linear-gradient(90deg,#5a8a14,#c6f04a); }
.mc2-cmp-a { display: block; height: 100%; background: linear-gradient(90deg,#1f5fa8,#6ec0ff); }
/* Torschütze */
.mc2-ts-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 10px; }
.mc2-ts-col { min-width: 0; }
.mc2-ts-side {
font-family: var(--fm); font-size: 9px; letter-spacing: 0.6px;
text-transform: uppercase; color: var(--muted); margin-bottom: 3px;
overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mc2-ts-pick {
font-family: var(--fd); font-size: 15px; font-weight: 700; color: var(--lime); margin-bottom: 4px;
overflow-wrap: anywhere; word-break: break-word; line-height: 1.25;
}
.mc2-ts-pick.is-away { color: var(--blue); }
.mc2-ts-meta {
display: flex; flex-wrap: wrap; gap: 8px;
font-family: var(--fm); font-size: 11px; color: var(--text2); margin-bottom: 6px;
}
.mc2-spills { display: flex; gap: 5px; flex-wrap: wrap; }
.mc2-spill {
font-size: 10px; font-family:var(--fb); font-weight: 700;
padding: 3px 9px; border-radius: 3px;
border: 1px solid var(--bdr2); color: var(--muted); background: var(--surf);
max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mc2-spill-top { border-color: var(--lime); color: var(--lime); background: var(--limeg2); }
.mc2-spill-away { border-color: var(--blue); color: var(--blue); background: rgba(13,110,255,0.08); }
.mc2-cs-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 6px; margin-bottom: 8px; }
.mc2-cs {
display: flex; flex-direction: column; align-items: center; gap: 2px;
padding: 8px 4px 6px; border-radius: 8px;
background: rgba(255,255,255,0.03); border: 1px solid var(--bdr);
}
.mc2-cs.is-pick { border-color: rgba(232,176,10,0.4); background: rgba(232,176,10,0.07); }
.mc2-cs-s { font-family: var(--fd); font-size: 16px; font-weight: 700; color: var(--text); }
.mc2-cs.is-pick .mc2-cs-s { color: var(--gold); }
.mc2-cs-q { font-family: var(--fm); font-size: 10px; color: var(--muted); }
@media (max-width: 640px) {
.mc2-ts-cols { grid-template-columns: 1fr; }
}
/* Pro Lock */
.mc2-problock { background: rgba(27,58,92,0.015); }
.mc2-pro-markets { display: flex; flex-direction: column; gap: 5px; margin-bottom: 12px; }
.mc2-pro-row {
display: flex; justify-content: space-between; align-items: center;
padding: 7px 12px; background: var(--surf);
border: 1px solid var(--bdr); border-radius: var(--r);
}
.mc2-pro-row span:first-child { font-size: 11px; color: var(--muted); }
.mc2-pro-blur {
font-size: 11px; font-family: var(--fd); font-weight: 700;
color: var(--lime); filter: blur(5px);
user-select: none; pointer-events: none;
}
/* ── Tier Badges ─────────────────────────────────────── */
.tier-badge {
display: inline-block;
font-family:var(--fb); font-size: 8px; font-weight: 700;
letter-spacing: 1px; text-transform: uppercase;
padding: 2px 7px; border-radius: 3px; margin-left: 6px;
vertical-align: middle;
}
.tier-free { background: var(--lime); color: #fff; }
.tier-basic { background: var(--blue); color: #fff; }
.tier-premium { background: var(--gold); color: #111; }
.mc2-pro-btn {
display: inline-flex; align-items: center; gap: 6px;
font-family:var(--fb); font-size: 10px; font-weight: 700;
letter-spacing: 1.5px; text-transform: uppercase;
color: var(--lime2); border: 1px solid var(--lime2);
padding: 6px 14px; border-radius: var(--r);
transition: all 0.15s;
}
.mc2-pro-btn:hover { background: var(--limeg); color: var(--lime); border-color: var(--lime); }
/* Responsive */
@media (max-width: 640px) {
.mc2-body { grid-template-columns: minmax(0,1fr) minmax(128px,40%) minmax(0,1fr); padding: 14px 10px 12px; }
.mc2-logo { width: 36px; height: 36px; }
.mc2-logo-fb { width: 36px; height: 36px; font-size: 11px; }
.mc2-tname { font-size: 12px; }
.mc2-score-final, .mc2-score-live { font-size: 22px; letter-spacing: 2px; }
.mc2-vs { font-size: 16px; }
.mc2-tip-badge { width: 30px; height: 30px; font-size: 13px; }
.mc2-1x2 { max-width: 132px; gap: 3px; }
.mc2-1x2-cell { padding: 4px 1px 3px; border-radius: 6px; }
.mc2-1x2-l { font-size: 8px; }
.mc2-1x2-q { font-size: 12px; }
.mc2-pred-score { font-size: 10px; }
.mc2-model { padding: 6px 10px 7px 12px; gap: 6px 8px; }
.mc2-model-ring { width: 30px; height: 30px; }
.mc2-model-pick { font-size: 12px; width: 22px; height: 22px; }
.mc2-model-meta, .mc2-model-note { display: none; }
.mc2-footer { padding: 8px 12px; }
.mc2-quote { font-size: 15px; }
.mc2-detail.open { grid-template-columns: 1fr; }
.mc2-dblock { min-width: 0; border-right: none; border-bottom: 1px solid var(--bdr); }
.mc2-dblock:last-child { border-bottom: none; }
}
/* ═══════════════════════════════════════════════════════
MATCH TABLE – Einfaches Flexbox-Layout
═══════════════════════════════════════════════════════ */
.fb-table{background:var(--card);border:1px solid var(--bdr);border-radius:var(--r-xl);overflow:hidden;margin-bottom:24px}
/* Header + Row: Flexbox mit fixen Breiten */
.fb-head,.fb-row{display:flex;align-items:center;padding:10px 14px;gap:0;border-top:1px solid var(--bdr)}
.fb-head{background:var(--surf);border-top:none;border-bottom:2px solid var(--bdr)}
.fb-head>div{font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--muted);text-align:center;flex-shrink:0}
/* Spaltenbreiten */
.fh-match,.fbc-match{flex:1 1 auto;min-width:120px;text-align:left}
.fh-form,.fbc-form{width:90px;flex-shrink:0}
.fh-num,.fbc-num{width:40px;flex-shrink:0;text-align:center}
.fh-tip,.fbc-tip{width:50px;flex-shrink:0;text-align:center}
.fh-score,.fbc-score{width:65px;flex-shrink:0;text-align:center}
.fh-odds,.fbc-odds{width:55px;flex-shrink:0;text-align:center}
.fh-st,.fbc-st{width:42px;flex-shrink:0;text-align:center}
.fb-cell{flex-shrink:0}
/* League row */
.fb-league-row{padding:7px 14px;background:linear-gradient(90deg,var(--limeg2),transparent);border-top:1px solid var(--bdr);display:flex;align-items:center;gap:8px}
.fb-league-name{font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--lime2)}
/* Row hover + open */
.fb-row{cursor:pointer;transition:background 0.15s;position:relative}
.fb-row:hover{background:var(--card2)}
.fb-row.fb-row-live{border-left:3px solid var(--red)}
.fb-row.fb-row-open{background:var(--card2);border-left:3px solid var(--lime2)}
.fb-row:after{content:"▸";font-size:10px;color:var(--muted);margin-left:4px;flex-shrink:0}
.fb-row.fb-row-open:after{content:"▾";color:var(--lime)}
/* Teams */
.fb-teams{display:flex;gap:8px;align-items:center}
.fb-team-logos{display:flex;flex-direction:column;gap:4px;flex-shrink:0}
.fb-logo{width:22px;height:22px;object-fit:contain}
.fb-logo-fb{width:22px;height:22px;background:var(--surf);border:1px solid var(--bdr);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--fb);font-size:8px;font-weight:700;color:var(--muted)}
.fb-team-names{flex:1;min-width:0}
.fb-home{font-family:var(--fd);font-size:13px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fb-away{font-family:var(--fd);font-size:12px;font-weight:600;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fb-time{font-family:var(--fm);font-size:10px;color:var(--muted);margin-top:2px}
/* Form */
.fb-form-pills{display:flex;gap:2px;margin-bottom:3px}
.fb-form-dot{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:2px;font-family:var(--fb);font-size:8px;font-weight:700}
.fb-form-dot.fw{background:rgba(0,217,126,0.15);color:var(--green);border:1px solid rgba(0,217,126,0.3)}
.fb-form-dot.fd{background:rgba(232,176,10,0.1);color:var(--gold);border:1px solid rgba(232,176,10,0.2)}
.fb-form-dot.fl{background:rgba(232,18,50,0.1);color:var(--red);border:1px solid rgba(232,18,50,0.2)}
.fb-ki-text{font-size:10px;color:var(--muted);line-height:1.4;margin-top:3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* PCT + Balken */
.fb-pct-num{font-family:var(--fm);font-size:13px;font-weight:600;color:var(--text2);text-align:center}
.fb-pct-best{color:var(--lime);font-weight:700}
.fb-pct-best-d{color:var(--gold);font-weight:700}
.fb-bar-wrap{width:22px;height:20px;background:var(--surf);border-radius:2px;overflow:hidden;display:flex;align-items:flex-end;margin:2px auto 0}
.fb-bar{width:100%;border-radius:2px 2px 0 0;min-height:2px}
.fb-bar-h{background:linear-gradient(0deg,var(--lime2),var(--lime))}
.fb-bar-d{background:var(--bdr2)}
.fb-bar-a{background:linear-gradient(0deg,#063a8a,var(--blue))}
/* Tip badge */
.fb-tip-badge{width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-family:var(--fd);font-size:12px;font-weight:700;margin:0 auto}
.fb-tip-home{background:var(--lime);color:#fff}
.fb-tip-draw{background:var(--gold);color:#111}
.fb-tip-away{background:var(--blue);color:#fff}
/* Score */
.fb-score-pred{font-family:var(--fm);font-size:13px;font-weight:600;color:var(--gold)}
.fb-score-alts{font-size:9px;color:var(--muted);margin-top:1px}
.fb-score-final{font-family:var(--fd);font-size:14px;font-weight:700;color:var(--green)}
.fb-score-ht{font-size:9px;color:var(--muted)}
.fb-score-blur{color:var(--muted);font-size:13px}
/* Odds */
.fb-odds-val{font-family:var(--fm);font-size:13px;font-weight:600;color:var(--gold)}
/* Status */
.fb-status{font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:1px;padding:3px 6px;border-radius:3px}
.fb-status.done{background:rgba(0,217,126,0.1);color:var(--green);border:1px solid rgba(0,217,126,0.2)}
.fb-status.live{background:rgba(232,18,50,0.15);color:var(--red);border:1px solid rgba(232,18,50,0.25);animation:none}
.fb-status.ns{background:var(--surf);color:var(--muted);border:1px solid var(--bdr)}
/* ── DETAIL BOX ─────────────────────────────────────── */
.fb-detail{display:none;background:rgba(27,58,92,0.01);border-top:1px solid var(--bdr)}
.fb-detail.open{display:flex;flex-wrap:wrap}
.fb-detail-inner{display:flex;flex-wrap:wrap}
.fb-detail-block{padding:14px 16px;border-right:1px solid var(--bdr);flex:1;min-width:170px}
.fb-detail-block:last-child{border-right:none}
.fb-detail-lbl{font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.fb-ts-pick{font-family:var(--fd);font-size:16px;font-weight:700;color:var(--lime);margin-bottom:6px}
.fb-h2h{display:flex;gap:10px;flex-wrap:wrap;font-size:12px}
.fb-odds-row{display:flex;gap:5px;flex-wrap:wrap;margin-top:4px}
.fb-odds-item{background:var(--surf);border:1px solid var(--bdr);border-radius:var(--r);padding:7px 10px;text-align:center;min-width:44px}
.fb-odds-item.best{border-color:var(--lime2);background:var(--limeg2)}
.fb-odds-lbl{font-family:var(--fb);font-size:8px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.fb-odds-num{font-family:var(--fm);font-size:13px;font-weight:600;color:var(--gold)}
.fb-odds-item.best .fb-odds-num{color:var(--lime)}
.fb-pro-blur{position:relative}
.fb-pro-lock{display:inline-block;margin-top:8px;font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--lime2);border:1px solid var(--lime2);padding:3px 10px;border-radius:3px}
.fb-pro-lock:hover{background:var(--limeg);color:var(--lime)}
.conf-bar-wrap{height:4px;background:var(--surf);border-radius:2px;overflow:hidden;margin-top:6px}
.conf-bar{height:100%;border-radius:2px;background:linear-gradient(90deg,var(--lime2),var(--lime))}
.conf-label{font-family:var(--fm);font-size:10px;color:var(--muted);margin-top:3px}
.fb-inj{display:flex;flex-wrap:wrap;gap:4px}
/* Mobile */
.fb-mobile-only{display:none}
/* ── RESPONSIVE ─────────────────────────────────────── */
@media(max-width:900px){
.fh-form,.fbc-form{display:none}
.fh-score,.fbc-score{display:none}
.fh-odds,.fbc-odds{display:none}
}
@media(max-width:600px){
.fb-head,.fb-row{padding:9px 10px}
.fh-st,.fbc-st{display:none}
.fb-home{font-size:12px}
.fb-away{font-size:11px}
.fh-num,.fbc-num{width:34px}
.fh-tip,.fbc-tip{width:42px}
.fb-mobile-only{display:block}
.fb-detail-inner{flex-direction:column}
.fb-detail-block{border-right:none;border-bottom:1px solid var(--bdr);min-width:unset}
}
/* ── TICKER ──────────────────────────────────────────── */
.winner-ticker{background:var(--surf);border:1px solid var(--bdr);border-radius:var(--r-lg);padding:10px 0;margin-bottom:20px;overflow:hidden}
.ticker-label{font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--lime);padding:0 18px 8px;border-bottom:1px solid rgba(27,58,92,0.08);margin-bottom:8px}
.ticker-track{overflow:hidden;white-space:nowrap}
.ticker-inner{display:flex;flex-wrap:wrap;width:100%;animation:none;will-change:auto}
.ticker-inner:hover{animation-play-state:paused}
.ticker-item{display:inline-flex;align-items:center;gap:10px;padding:4px 24px 4px 0;border-right:1px solid rgba(27,58,92,0.1);margin-right:24px;flex-shrink:0;line-height:1}
.ti-check{color:var(--green);font-size:12px}
.ti-match{font-family:var(--fd);font-size:11px;font-weight:600;color:var(--text2)}
.ti-tip{font-size:11px;color:var(--lime)}
.ti-quote{font-family:var(--fm);font-size:10px;color:var(--gold)}
/* ── ROW OPEN ────────────────────────────────────────── */
.fb-row-open{background:var(--card2)}
/* ── FORM COLUMN ─────────────────────────────────────── */
.form-team-row{display:flex;align-items:center;gap:6px;margin-bottom:5px}
.form-team-lbl{font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:0.5px;text-transform:uppercase;color:var(--muted);min-width:52px;flex-shrink:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.form-dots{display:flex;gap:2px}
.fd-dot{display:inline-flex;align-items:center;justify-content:center;width:17px;height:17px;border-radius:3px;font-family:var(--fb);font-size:8px;font-weight:700;flex-shrink:0;cursor:default}
.fd-w{background:rgba(0,217,126,0.2);color:var(--green);border:1px solid rgba(0,217,126,0.4)}
.fd-d{background:rgba(232,176,10,0.15);color:var(--gold);border:1px solid rgba(232,176,10,0.3)}
.fd-l{background:rgba(232,18,50,0.15);color:var(--red);border:1px solid rgba(232,18,50,0.3)}
.fd-empty{background:var(--surf);color:var(--muted);border:1px solid var(--bdr)}
.form-coaches{display:flex;flex-direction:column;gap:1px;margin-top:3px}
.form-coach{font-size:10px;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.form-ki{font-size:10px;color:var(--muted);line-height:1.4;margin-top:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* ── MATCH COLUMN EXTRAS ────────────────────────────── */
.team-rank{font-family:var(--fm);font-size:9px;color:var(--lime2);background:var(--limeg2);border:1px solid var(--lime2);padding:1px 5px;border-radius:3px;margin-left:5px;vertical-align:middle}
.match-inj-row{display:flex;gap:4px;flex-wrap:wrap;margin-top:4px}
.inj-chip{font-size:9px;font-family:var(--fb);font-weight:700;padding:2px 6px;border-radius:3px;white-space:nowrap}
.inj-chip.home{background:rgba(232,18,50,0.08);color:var(--red);border:1px solid rgba(232,18,50,0.2)}
.inj-chip.away{background:rgba(232,18,50,0.06);color:#cc3333;border:1px solid rgba(232,18,50,0.15)}
.match-h2h-row{display:flex;gap:6px;align-items:center;margin-top:4px;flex-wrap:wrap}
.h2h-chip{font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:1px;color:var(--muted);text-transform:uppercase}
.match-h2h-row span{font-family:var(--fm);font-size:10px}
.match-scorer-row{display:flex;gap:6px;margin-top:4px;flex-wrap:wrap}
.scorer-chip{font-size:10px;font-family:var(--fb);color:var(--lime2);background:var(--limeg2);border:1px solid var(--lime2);padding:2px 7px;border-radius:3px;white-space:nowrap}
.scorer-chip.away{color:var(--blue);background:rgba(13,110,255,0.06);border-color:rgba(13,110,255,0.3)}
/* Mobile: Ergebnis/Quote/Status im Detail */
@media(max-width:600px){
.match-inj-row,.match-h2h-row,.match-scorer-row{display:none}
}
/* ── FORM INLINE IN MATCH COLUMN ───────────────────── */
.match-form-inline{margin-top:6px;display:flex;flex-direction:column;gap:3px}
.mfi-row{display:flex;align-items:center;gap:5px}
.mfi-lbl{font-family:var(--fb);font-size:9px;font-weight:700;color:var(--muted);min-width:38px;text-transform:uppercase;letter-spacing:0.5px}
.mfi-dots{display:flex;gap:2px}
.mfi-dot{width:12px;height:12px;border-radius:2px;flex-shrink:0}
.mfi-w{background:rgba(0,217,126,0.3);border:1px solid rgba(0,217,126,0.5)}
.mfi-d{background:rgba(232,176,10,0.2);border:1px solid rgba(232,176,10,0.4)}
.mfi-l{background:rgba(232,18,50,0.2);border:1px solid rgba(232,18,50,0.4)}
.mfi-e{background:var(--surf);border:1px solid var(--bdr)}
/* ── SPINNING BALL ───────────────────────────────────── */
.spinning-ball{display:none}
@keyframes spinBall{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
/* ── DESKTOP ONLY ────────────────────────────────────── */
.match-extras{display:block}
@media(max-width:600px){
.match-extras{display:none !important}
.team-rank{display:none}
}
/* ── SPINNING BALL ───────────────────────────────────── */
.spin-ball{display:none}
@keyframes spinBall{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
/* ── VALUE BET BOX ───────────────────────────────────── */
.vbet-box{background:var(--surf);border:1px solid var(--bdr);border-radius:var(--r);padding:10px 12px;margin-top:10px}
.vbet-lbl{font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--lime2);margin-bottom:4px}
.vbet-market{font-family:var(--fd);font-size:14px;font-weight:700;color:var(--lime)}
.vbet-edge{font-family:var(--fm);font-size:13px;color:var(--green);font-weight:600}
/* ── VALUE BADGE ─────────────────────────────────────── */
.value-badge{font-family:var(--fb);font-size:8px;font-weight:700;background:var(--green);color:#000;padding:2px 5px;border-radius:3px;margin-top:3px;text-align:center;letter-spacing:0.5px}
/* ── ODDS GRID DETAIL ────────────────────────────────── */
.odds-grid-detail{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px}
.odds-item{background:var(--surf);border:1px solid var(--bdr);border-radius:var(--r);padding:6px 10px;text-align:center;min-width:44px}
.odds-item.best{border-color:var(--lime2);background:var(--limeg2)}
.odds-lbl{font-family:var(--fb);font-size:8px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.odds-num{font-family:var(--fm);font-size:13px;font-weight:600;color:var(--gold)}
.odds-item.best .odds-num{color:var(--lime)}
.h2h-row{display:flex;gap:0;border-radius:var(--r);overflow:hidden;margin-top:8px}
.h2h-s{flex:1;text-align:center;padding:10px 6px;background:var(--surf);border-right:1px solid var(--bdr)}
.h2h-s:last-child{border-right:none}
.h2h-v{font-family:var(--fd);font-size:20px;font-weight:700;line-height:1}
.h2h-k{font-size:9px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);font-family:var(--fb);margin-top:3px}
/* ── DESKTOP ONLY ────────────────────────────────────── */
.match-extras,.match-inj-row,.match-h2h-row,.match-scorer-row{display:flex}
.fb-mobile-only{display:none}
@media(max-width:600px){
.match-extras,.match-inj-row,.match-h2h-row,.match-scorer-row{display:none !important}
.team-rank{display:none}
.fb-mobile-only{display:block !important}
.fb-head{grid-template-columns:unset;display:flex !important}
.fb-row{display:flex !important}
.fbc-form,.fbc-score,.fbc-odds,.fbc-st,.fh-form,.fh-score,.fh-odds,.fh-st{display:none !important}
.fbc-match{flex:1 !important}
.fbc-num{width:36px !important}
.fbc-tip{width:40px !important}
}
/* ═══════════════════════════════════════════════════════
MOBILE FIX – Tabelle lesbar auf < 640px
═══════════════════════════════════════════════════════ */
/* Desktop extras – auf Mobile ausblenden */
@media(max-width:640px) {
/* Begegnung-Extras: Form, Verletzt, H2H */
.match-extras,
.match-inj-row,
.match-h2h-row,
.match-scorer-row { display: none !important; }
.team-rank { display: none !important; }
/* Mobile-only Block im Dropdown anzeigen */
.fb-mobile-only { display: block !important; }
/* Tabelle: kompaktes Grid ohne unsichtbare Spalten */
.fb-head,
.fb-row {
display: grid !important;
grid-template-columns: 1fr 38px 38px 38px 44px !important;
gap: 2px !important;
padding: 9px 10px !important;
}
/* Unsichtbare Spalten auf Mobile */
.fh-form, .fbc-form,
.fh-score, .fbc-score,
.fh-odds, .fbc-odds,
.fh-st, .fbc-st { display: none !important; }
/* Teams kleiner */
.fb-home { font-size: 13px !important; }
.fb-away { font-size: 12px !important; }
.fb-time { font-size: 9px !important; }
.fb-logo { width: 20px !important; height: 20px !important; }
/* 1X2 Zahlen kleiner */
.fb-pct-num { font-size: 12px !important; }
.fbc-num { width: 38px !important; }
.fbc-tip { width: 44px !important; }
/* Tipp Badge kleiner */
.fb-tip-badge { width: 24px !important; height: 24px !important; font-size: 11px !important; }
/* Detail: Spalten untereinander */
.fb-detail-inner { flex-direction: column !important; }
.fb-detail-block {
border-right: none !important;
border-bottom: 1px solid var(--bdr) !important;
min-width: unset !important;
}
.fb-detail-block:last-child { border-bottom: none !important; }
/* Hero: kurze Headline, nie mitten im Wort zerlegen */
.bk-hero h1 {
font-size: clamp(26px, 8.5vw, 36px) !important;
letter-spacing: 0.3px !important;
line-height: 1.12 !important;
overflow-wrap: normal;
word-break: keep-all;
hyphens: none;
max-width: 100%;
}
.bk-hero h1 .lime { white-space: nowrap; }
.bk-hero { padding: 20px 12px 16px !important; }
.bk-page-hero h1 {
font-size: clamp(22px, 7.5vw, 32px) !important;
letter-spacing: 0.2px !important;
}
/* Stats 2-spaltig */
.bk-stats { grid-template-columns: repeat(2, 1fr) !important; }
.bk-stat:nth-child(2) { border-right: none !important; }
.bk-stat:nth-child(3) { border-top: 1px solid var(--bdr) !important; }
.bk-stat:nth-child(4) { border-top: 1px solid var(--bdr) !important; }
/* Main padding */
.bk-main { padding: 16px 10px 80px !important; }
/* Touch: Pro-Button & Burger */
.header-pro-btn,.mobile-pro-btn{min-height:36px}
.burger-btn{min-width:40px;min-height:36px}
}
/* Spinning Ball */
.spin-ball {
font-size: 0.3em;
vertical-align: middle;
margin-left: 6px;
display: inline-block;
animation: none;
}
@keyframes spinBall {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
/* Hero: Spieler strikt im Hintergrund – darf Ticker-Rand nicht übermalen */
.bk-hero-with-player{
position:relative;
overflow:hidden; /* kein Bleed in den Ticker (Pixelfehler an Border) */
isolation:isolate;
padding-bottom:20px;
min-height:200px;
z-index:0;
}
.hero-content{
position:relative;
z-index:2;
}
.hero-player-bg{
position:absolute;
right:6%;
bottom:0;
/* Desktop-Default: kompakter, Gesicht sichtbar */
width:118px;
height:auto;
z-index:0; /* immer hinter Text + Ticker */
pointer-events:none;
opacity:0.88;
}
.hero-player-bg,.hero-player{display:none !important}
.hero-player-off{
display:block;
width:100%;
height:auto;
object-fit:contain;
object-position:center 12%;
}
@keyframes heroKickIn{
0%{opacity:0;transform:translateY(28px) translateX(10px) scale(.94)}
55%{opacity:1;transform:translateY(-3px) translateX(0) scale(1.02)}
100%{opacity:1;transform:translateY(0) translateX(0) scale(1)}
}
/* Tablet/Desktop: Spieler leicht rechts (Mobil: right:0 bleibt) */
@media(min-width:769px){
.hero-player-bg{
width:130px;
right:6%;
bottom:0;
opacity:0.85;
z-index:0;
}
.bk-hero-with-player{min-height:210px;padding-bottom:24px}
.bk-hero-with-player .hero-content{padding-left:150px;padding-right:150px}
}
@media(min-width:1100px){
.hero-player-bg{width:140px;right:8%;bottom:0}
}
/* Handy: größer, aber weiterhin Hintergrund (nicht über Ticker) */
@media(max-width:768px){
.bk-hero-with-player{
min-height:220px;
padding-bottom:12px;
overflow:hidden;
}
.hero-player-bg{
width:min(168px,48vw);
right:0;
bottom:0;
opacity:0.95;
z-index:0;
}
.hero-content{
z-index:2;
padding-right:36%; /* Platz, Text nicht über Gesicht */
text-align:left;
}
.hero-player-bg .hero-player,
.hero-player{
object-position:center 8%;
filter:drop-shadow(0 6px 16px rgba(0,0,0,0.65)) drop-shadow(0 0 20px rgba(27,58,92,0.22));
}
}
@media(max-width:400px){
.hero-player-bg{width:min(150px,52vw)}
.hero-content{padding-right:40%}
}
@media(prefers-reduced-motion:reduce){
.hero-player,.hero-player-bg .hero-player{animation:none !important}
}
/* ── 7-Tage-Trial Sticker / Bar / Formular ── */
.bk-hero-with-player{overflow:visible}
.bk-trial-corner{display:contents}
.bk-trial-mini{display:none}
.bk-trial-sticker{display:none !important}
.bk-trial-sticker-off{
position:absolute;z-index:5;
left:14px;top:18px;
width:132px;height:132px;
display:flex;flex-direction:column;align-items:center;justify-content:center;
background:var(--lime);color:#fff;
border-radius:50%;
text-decoration:none;text-align:center;
}
.bk-trial-sticker:hover{transform:rotate(-6deg) scale(1.06)}
.bk-trial-sticker-star{
font-size:11px;line-height:1;margin-bottom:2px;opacity:.85;
}
.bk-trial-sticker-main{
font-family:var(--fd);font-size:13px;font-weight:700;
letter-spacing:.3px;text-transform:uppercase;line-height:1.15;
}
.bk-trial-sticker-sub{
font-family:var(--fb);font-size:8px;font-weight:700;letter-spacing:.8px;
text-transform:uppercase;margin-top:4px;opacity:.75;
}
@media(max-width:768px){
.bk-hero-with-player{overflow:hidden}
.bk-trial-corner{
display:block;position:absolute;top:6px;right:6px;
width:auto;height:auto;overflow:visible;z-index:5;
}
.bk-trial-sticker{
position:relative;left:auto;top:auto;right:auto;
display:flex;flex-direction:column;
align-items:center;justify-content:center;
width:54px;height:54px;max-width:none;
margin:0;padding:3px;
border-radius:50%;transform:rotate(8deg);
box-shadow:0 0 0 2px #111, 0 0 0 3px var(--lime), 2px 3px 0 #2a4708;
text-align:center;line-height:1.1;
}
.bk-trial-full{display:none}
.bk-trial-mini{display:inline}
.bk-trial-sticker-main{font-size:7px;letter-spacing:.15px;line-height:1.12}
.bk-trial-sticker-sub,.bk-trial-sticker-star{display:none}
}
.bk-trial-promo{
background:var(--lime);text-align:center;padding:10px 12px;
position:sticky;top:96px;z-index:190;
}
.bk-trial-promo a{
font-family:var(--fd);font-size:13px;font-weight:700;letter-spacing:.6px;
text-transform:uppercase;color:#fff;text-decoration:none;
}
.bk-trial-promo a:hover{text-decoration:underline}
@media(max-width:768px){
.bk-trial-promo{top:calc(88px + env(safe-area-inset-top,0px));padding:9px 10px}
.bk-trial-promo a{font-size:11px;letter-spacing:.3px}
}
/* Trial-Hinweis sitzt in der Subbar – kein Overlay über Liga-Leiste */
.bk-subbar-track a.bk-subbar-trial{
font-weight:700 !important;
color:var(--gold,#e8c56b) !important;
letter-spacing:.2px;
}
.bk-subbar-track a.bk-subbar-trial:hover{color:#fff !important;text-decoration:none !important}
.bk-subbar-trial-short{display:none}
.bk-subbar.bk-trial-bar.is-end .bk-subbar-track a.bk-subbar-trial,
.bk-subbar.is-trial-end .bk-subbar-track a.bk-subbar-trial{color:#e85d5d !important}
@media(max-width:768px){
.bk-subbar-trial-full{display:none}
.bk-subbar-trial-short{display:inline}
}
.bk-trial-page{max-width:480px;margin:0 auto 48px;padding:0 16px}
.bk-trial-form{
background:var(--card);border:1px solid var(--lime2);border-radius:14px;
padding:22px 20px;display:flex;flex-direction:column;gap:12px;
}
.bk-trial-input{
width:100%;background:var(--surf);border:1px solid var(--bdr);color:var(--text);
font-family:var(--fm);font-size:15px;padding:13px 14px;border-radius:8px;outline:none;
}
.bk-trial-input:focus{border-color:var(--lime2)}
.bk-trial-check{
display:flex;align-items:flex-start;gap:10px;font-size:12px;color:var(--text2);line-height:1.45;cursor:pointer;
}
.bk-trial-check input{margin-top:3px;flex-shrink:0}
.bk-trial-submit{
width:100%;background:var(--cta);color:var(--cta-ink);border:none;padding:13px;
border-radius:20px;font-family:var(--fb);font-size:14px;font-weight:700;
letter-spacing:0;cursor:pointer;text-transform:none;
}
.bk-trial-submit:hover{background:var(--cta-hover)}
.bk-trial-points{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:8px;font-size:13px;color:var(--text2)}
.bk-trial-legal{text-align:center;margin-top:22px;font-size:12px;color:var(--muted)}
.bk-trial-legal a{color:var(--lime2);text-decoration:none}
.bk-trial-legal a:hover{color:var(--lime)}
.bk-trial-ok,.bk-trial-err{
border-radius:12px;padding:16px 18px;margin-bottom:16px;font-size:14px;line-height:1.55;
}
.bk-trial-ok{background:rgba(27,58,92,.08);border:1px solid rgba(27,58,92,.3);color:var(--text)}
.bk-trial-ok-title{font-family:var(--fd);font-size:16px;font-weight:700;color:var(--lime);margin-bottom:8px;text-transform:uppercase;letter-spacing:.6px}
.bk-trial-ok-links{margin-top:10px}
.bk-trial-ok-links a{color:var(--lime);font-family:var(--fd);font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase}
.bk-trial-err{background:rgba(232,18,50,.08);border:1px solid rgba(232,18,50,.28);color:#f8a}
.bk-plan-trial{border-color:var(--lime2)!important}
.bk-trial-link{
font-family:var(--fd);font-size:11px;font-weight:700;letter-spacing:1px;
text-transform:uppercase;color:var(--lime);text-decoration:none;
}
/* Value Bet Box */
.vbet-box {
background: var(--surf);
border: 1px solid var(--lime2);
border-radius: var(--r);
padding: 10px 12px;
margin-top: 10px;
}
.vbet-lbl { font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--lime2);margin-bottom:4px;display:block; }
.vbet-market { font-family:var(--fd);font-size:14px;font-weight:700;color:var(--lime); }
.vbet-edge { font-family:var(--fm);font-size:13px;color:var(--green);font-weight:600; }
/* Value Badge in Tipp-Spalte */
.value-badge {
font-family:var(--fb);
font-size: 8px;
font-weight: 700;
background: var(--green);
color: #000;
padding: 2px 4px;
border-radius: 2px;
margin-top: 2px;
text-align: center;
letter-spacing: 0.5px;
}
/* Odds Grid im Detail */
.odds-grid-detail { display:flex;gap:5px;flex-wrap:wrap;margin-top:6px; }
.odds-item { background:var(--surf);border:1px solid var(--bdr);border-radius:var(--r);padding:6px 10px;text-align:center;min-width:44px; }
.odds-item.best { border-color:var(--lime2);background:var(--limeg2); }
.odds-lbl { font-family:var(--fb);font-size:8px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin-bottom:3px;display:block; }
.odds-num { font-family:var(--fm);font-size:13px;font-weight:600;color:var(--gold); }
.odds-item.best .odds-num { color:var(--lime); }
/* H2H Row im Detail */
.h2h-row { display:flex;border-radius:var(--r);overflow:hidden;margin-top:8px; }
.h2h-s { flex:1;text-align:center;padding:10px 6px;background:var(--surf);border-right:1px solid var(--bdr); }
.h2h-s:last-child { border-right:none; }
.h2h-v { font-family:var(--fd);font-size:20px;font-weight:700;line-height:1; }
.h2h-k { font-size:9px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);font-family:var(--fb);margin-top:3px; }
/* Konfidenz Bar */
.conf-bar-wrap { height:4px;background:var(--surf);border-radius:2px;overflow:hidden;margin-top:6px; }
.conf-bar { height:100%;border-radius:2px;background:linear-gradient(90deg,var(--lime2),var(--lime)); }
.conf-label { font-family:var(--fm);font-size:10px;color:var(--muted);margin-top:3px;display:block; }
/* Faktoren Tags */
.factor { font-size:11px;background:var(--surf);border:1px solid var(--bdr);padding:3px 10px;border-radius:var(--r);color:var(--text2); }
/* Spill / Kandidaten */
.spills { display:flex;gap:5px;flex-wrap:wrap;margin-top:6px; }
.spill { font-size:10px;font-family:var(--fb);font-weight:700;padding:3px 9px;border-radius:3px;border:1px solid var(--lime2);color:var(--lime2); }
.spill.top { border-color:var(--lime);color:var(--lime); }
/* TS Pick */
.fb-ts-pick { font-family:var(--fd);font-size:16px;font-weight:700;color:var(--lime);margin-bottom:6px; }
/* Pro Lock Button */
.fb-pro-lock { font-family:var(--fb);font-size:9px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--lime2);border:1px solid var(--lime2);padding:3px 10px;border-radius:3px;text-decoration:none;display:inline-block; }
.fb-pro-lock:hover { background:var(--limeg);color:var(--lime); }
/* Inj Pill im Detail */
.inj-pill { font-size:10px;font-family:var(--fb);font-weight:700;color:var(--red);background:rgba(232,18,50,0.08);border:1px solid rgba(232,18,50,0.2);padding:2px 7px;border-radius:3px;display:inline-block;margin:2px; }
/* Mobile Only */
.fb-mobile-only { display: none; }
/* ── Liga/Pokal-Leiste unter dem Menü ── */
.bk-liga-bar{
background:#fff;
border-bottom:1px solid var(--bdr);
padding:8px 0 6px;
position:relative;
z-index:5;
}
.bk-liga-bar-inner{
max-width:1080px;
margin:0 auto;
padding:0 12px;
position:relative;
}
.bk-liga-bar-track{
display:flex;
flex-wrap:nowrap;
gap:2px;
overflow-x:auto;
overflow-y:hidden;
-webkit-overflow-scrolling:touch;
scrollbar-width:none;
padding:2px 20px 4px 0;
}
.bk-liga-bar-track::-webkit-scrollbar{display:none;height:0}
.bk-liga-ico{
flex:0 0 auto;
width:68px;
display:flex;
flex-direction:column;
align-items:center;
gap:5px;
padding:6px 4px 4px;
border-radius:10px;
text-decoration:none;
color:var(--text2);
transition:background .15s, color .15s;
}
.bk-liga-ico:hover{background:var(--limeg);color:var(--lime)}
.bk-liga-ico.is-active{background:var(--limeg);color:var(--lime)}
.bk-liga-ico-badge{
width:38px;height:38px;
border-radius:50%;
background:#fff;
border:1px solid var(--bdr);
display:flex;align-items:center;justify-content:center;
overflow:hidden;
box-shadow:0 1px 2px rgba(26,31,36,.06);
}
.bk-liga-ico-badge img{
width:28px;height:28px;object-fit:contain;display:block;
}
.bk-liga-ico-fallback{
font-size:10px;font-weight:700;color:var(--lime);letter-spacing:.3px;
}
.bk-liga-ico-name{
font-size:10px;font-weight:600;line-height:1.15;
text-align:center;max-width:64px;
white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.bk-liga-bar-hint{
display:flex;pointer-events:auto;cursor:pointer;
position:absolute;right:4px;top:0;bottom:4px;
width:40px;align-items:center;justify-content:flex-end;
padding:0 6px 0 0;border:0;margin:0;
background:linear-gradient(90deg,transparent, #fff 55%);
color:var(--lime);font-size:22px;font-weight:700;line-height:1;
font-family:inherit;opacity:1;transition:opacity .2s, color .15s;
z-index:2;
}
.bk-liga-bar-hint:hover{color:var(--gold,#d4af6a)}
.bk-liga-bar.is-no-scroll .bk-liga-bar-hint{opacity:0;visibility:hidden;pointer-events:none}
@media(min-width:900px){
.bk-liga-ico{width:72px}
.bk-liga-ico-badge{width:42px;height:42px}
.bk-liga-ico-badge img{width:30px;height:30px}
}
/* ── Tipps-Banner Startseite ── */
.bk-tips-banner{
background:#fff;
border:1px solid var(--bdr);
border-radius:16px;
padding:22px 20px 18px;
margin:0 0 18px;
text-align:center;
box-shadow:var(--shadow);
}
.bk-tips-banner h1{
font-family:var(--fd);font-weight:700;
font-size:clamp(28px,5.4vw,48px);
letter-spacing:-0.3px;line-height:1.12;
margin:0 0 10px;
}
.bk-tips-banner h1 .lime{color:var(--lime)}
.bk-tips-banner .hero-badge{margin-bottom:12px}
.bk-tips-banner .hero-sub{
color:var(--text2);font-size:13px;max-width:560px;
margin:0 auto;letter-spacing:.3px;line-height:1.55;
}
.bk-tips-banner .hero-trial{margin-top:10px}
.bk-tips-grid{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:10px;
margin-top:18px;
text-align:left;
}
.bk-tips-tile{
background:var(--bg);
border:1px solid var(--bdr);
border-radius:12px;
padding:12px 13px;
}
.bk-tips-tile-k{
font-family:var(--fd);font-size:11px;font-weight:700;
letter-spacing:.4px;color:var(--lime);margin-bottom:4px;
}
.bk-tips-tile-v{
font-size:12.5px;line-height:1.45;color:var(--text2);
}
@media(max-width:820px){
.bk-tips-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.bk-tips-banner{padding:18px 14px 14px;border-radius:14px}
.bk-tips-banner h1{font-size:clamp(24px,7vw,36px)}
}
@media(max-width:480px){
.bk-tips-grid{gap:8px}
.bk-tips-tile{padding:10px 11px}
.bk-liga-ico{width:60px}
.bk-liga-ico-badge{width:34px;height:34px}
.bk-liga-ico-badge img{width:24px;height:24px}
}
/* ── Testimonials ── */
.bk-quotes{margin:8px 0 28px}
.bk-quotes-hdr{margin:0 0 14px}
.bk-quotes-title{
font-family:var(--fd);font-size:15px;font-weight:700;
letter-spacing:.4px;color:var(--text);margin:0 0 4px;
}
.bk-quotes-sub{font-size:12px;color:var(--muted);margin:0}
.bk-quotes-grid{
display:grid;
grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
gap:12px;
}
.bk-quote{
background:#fff;
border:1px solid var(--bdr);
border-radius:14px;
padding:14px 15px 15px;
box-shadow:var(--shadow);
}
.bk-quote-top{
display:flex;align-items:center;gap:10px;margin-bottom:10px;
}
.bk-quote-top img{
width:48px;height:48px;border-radius:50%;object-fit:cover;
border:1px solid var(--bdr);flex-shrink:0;background:#eee;
}
.bk-quote-name{font-size:13px;font-weight:700;color:var(--text);line-height:1.2}
.bk-quote-meta{font-size:11px;color:var(--muted);margin-top:2px}
.bk-quote-stars{
margin-left:auto;font-size:11px;color:#C4A35A;letter-spacing:.5px;
white-space:nowrap;flex-shrink:0;
}
.bk-quote p{
font-size:13px;line-height:1.5;color:var(--text2);margin:0;
}
@media(max-width:640px){
.bk-quotes-grid{grid-template-columns:1fr}
.bk-quote-top img{width:44px;height:44px}
}