/* Ranking-Umschalter: verbindet /qb-ranking, /hoerer-ranking und /mitspielen (gleiches Markup auf allen drei Seiten) */
.rk-switch { --c:#19e8e8; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; max-width:860px; margin:0 auto; position:relative; z-index:2; }
.rk-tab { --c:#19e8e8; position:relative; display:flex; flex-direction:column; align-items:flex-start; text-align:left; gap:6px; padding:16px 18px 18px; border-radius:20px; overflow:hidden;
  text-decoration:none; color:#fff; background:linear-gradient(160deg,color-mix(in srgb,var(--c) 14%,rgba(8,14,26,.88)) 0%,rgba(8,14,26,.9) 70%);
  border:1px solid color-mix(in srgb,var(--c) 38%,transparent); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  transition:transform .25s cubic-bezier(.2,.8,.2,1), border-color .25s, box-shadow .25s; }
.rk-tab--hosts { --c:#ff2e88; }
.rk-tab--hoerer { --c:#19e8e8; }
.rk-tab--du { --c:#a66bff; }
.rk-tab::after { content:""; position:absolute; right:-30px; top:-30px; width:110px; height:110px; border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--c) 40%,transparent),transparent 70%); opacity:.55; pointer-events:none; }
.rk-tab:hover { transform:translateY(-3px); border-color:var(--c); box-shadow:0 16px 40px -20px var(--c); }
.rk-tab__icon { width:38px; height:38px; border-radius:12px; display:flex; align-items:center; justify-content:center; color:var(--c);
  background:color-mix(in srgb,var(--c) 16%,transparent); border:1px solid color-mix(in srgb,var(--c) 45%,transparent); }
.rk-tab__icon svg { width:20px; height:20px; }
.rk-tab__kick { font-family:'Space Grotesk',sans-serif; font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--c); margin-top:4px; }
.rk-tab__title { font-family:'Orbitron','Space Grotesk',sans-serif; font-weight:800; font-size:17px; line-height:1.15; text-transform:uppercase; letter-spacing:.5px; }
.rk-tab__sub { font-size:13px; color:rgba(220,235,255,.62); line-height:1.35; }
.rk-tab__go { position:absolute; right:16px; bottom:14px; font-size:18px; color:var(--c); transition:transform .25s; }
.rk-tab:hover .rk-tab__go { transform:translateX(4px); }
/* Aktuelle Seite: gefuellt und leuchtend */
.rk-tab[aria-current="page"] { border-color:var(--c); background:linear-gradient(160deg,color-mix(in srgb,var(--c) 34%,#0a1322) 0%,rgba(8,14,26,.92) 80%);
  box-shadow:0 0 0 1px var(--c) inset, 0 18px 46px -22px var(--c); }
.rk-tab[aria-current="page"] .rk-tab__icon { background:var(--c); color:#04070f; border-color:var(--c); box-shadow:0 0 18px -2px var(--c); }
.rk-tab[aria-current="page"] .rk-tab__go { display:none; }
.rk-tab[aria-current="page"]::before { content:"Du bist hier"; position:absolute; right:12px; top:12px; font-size:9.5px; font-weight:800; letter-spacing:.14em;
  text-transform:uppercase; color:#04070f; background:var(--c); border-radius:999px; padding:3px 8px; }
.rk-section { padding:26px 16px 6px; }
.rk-wrap { margin:26px auto 0; }
@media (max-width:640px) {
  .rk-switch { gap:8px; }
  .rk-tab { align-items:center; text-align:center; padding:14px 6px 13px; gap:5px; border-radius:16px; }
  .rk-tab__icon { width:34px; height:34px; border-radius:11px; }
  .rk-tab__kick { font-size:9.5px; letter-spacing:.12em; margin-top:2px; }
  .rk-tab__title { font-size:12.5px; letter-spacing:.2px; }
  .rk-tab__sub, .rk-tab__go { display:none; }
  .rk-tab[aria-current="page"]::before { content:""; top:auto; bottom:6px; right:50%; transform:translateX(50%); width:18px; height:3px; padding:0; }
}
@media (prefers-reduced-motion:reduce) { .rk-tab, .rk-tab__go { transition:none; } .rk-tab:hover { transform:none; } }
.rk-wrap--top { margin:22px auto 26px; }