:root {
    --bg: #06151b;
    --bg-deep: #02090c;
    --panel: rgba(11, 36, 45, 0.92);
    --panel-2: #102f39;
    --line: rgba(255, 255, 255, 0.1);
    --text: #f4fbfd;
    --muted: #9eb3bb;
    --accent: #17b8c8;
    --accent-2: #67d9e4;
    --orange: #ff9f43;
    --live: #65df8c;
    --danger: #ff6b6b;
    --shadow: 0 22px 60px rgba(0, 0, 0, 0.24);
    --radius: 22px;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color-scheme: dark;
}

* {
    box-sizing: border-box;
}

html {
    min-height: 100%;
    background: var(--bg-deep);
}

body {
    margin: 0;
    min-height: 100vh;
    color: var(--text);
    background:
        radial-gradient(circle at 10% 0%, rgba(23, 184, 200, 0.16), transparent 32rem),
        radial-gradient(circle at 95% 20%, rgba(255, 159, 67, 0.08), transparent 28rem),
        linear-gradient(180deg, #081f27 0%, #041116 55%, #02090c 100%);
}

button,
input {
    font: inherit;
}

button,
a {
    -webkit-tap-highlight-color: transparent;
}

a {
    color: inherit;
}

.app-shell {
    width: min(1320px, calc(100% - 32px));
    margin: 0 auto;
}

.topbar {
    min-height: 86px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.brand {
    display: flex;
    align-items: center;
    gap: 13px;
    text-decoration: none;
}

.brand-ball {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    border: 3px solid var(--accent-2);
    color: var(--orange);
    font-size: 25px;
    box-shadow: inset 0 0 0 6px rgba(255,255,255,.04);
}

.brand strong,
.brand small {
    display: block;
}

.brand strong {
    font-size: 1.08rem;
    letter-spacing: .02em;
}

.brand small {
    margin-top: 2px;
    color: var(--muted);
    font-size: .78rem;
}

.connection-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 13px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: rgba(0,0,0,.18);
    color: var(--muted);
    font-size: .82rem;
    white-space: nowrap;
}

.status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--muted);
}

.connection-pill.is-live .status-dot {
    background: var(--live);
    box-shadow: 0 0 0 5px rgba(101,223,140,.1);
}

.connection-pill.is-live {
    color: #c7f9d5;
}

.connection-pill.is-fallback .status-dot {
    background: var(--orange);
}

.connection-pill.is-fallback {
    color: #ffd1a2;
}

.connection-pill.is-loading .status-dot {
    background: var(--accent);
    animation: pulse 1.2s infinite;
}

@keyframes pulse {
    50% { opacity: .35; transform: scale(.75); }
}

main {
    padding-bottom: 70px;
}

.hero {
    min-height: 330px;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 40px;
    padding: 54px 0 48px;
}

.eyebrow {
    margin: 0 0 8px;
    color: var(--accent-2);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .17em;
}

.hero h1 {
    margin: 0;
    max-width: 780px;
    font-size: clamp(2.5rem, 7vw, 5.9rem);
    line-height: .94;
    letter-spacing: -.06em;
}

.hero-copy {
    max-width: 700px;
    margin: 22px 0 0;
    color: var(--muted);
    font-size: clamp(1rem, 1.6vw, 1.15rem);
    line-height: 1.6;
}

.hero-stat {
    min-width: 180px;
    padding: 30px 34px;
    text-align: center;
    border-radius: 28px;
    border: 1px solid rgba(101,223,140,.22);
    background: rgba(101,223,140,.07);
    box-shadow: var(--shadow);
}

.hero-stat span,
.hero-stat small {
    display: block;
}

.hero-stat span {
    color: var(--live);
    font-size: 4rem;
    font-weight: 800;
    line-height: 1;
}

.hero-stat small {
    margin-top: 7px;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: .08em;
}

.panel {
    margin-bottom: 22px;
    padding: clamp(20px, 3vw, 34px);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: linear-gradient(180deg, rgba(16,47,57,.84), rgba(7,25,32,.9));
    box-shadow: var(--shadow);
    backdrop-filter: blur(12px);
}

.section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 22px;
}

.section-heading h2 {
    margin: 0;
    font-size: clamp(1.4rem, 3vw, 2rem);
    letter-spacing: -.025em;
}

.search-box {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 64px;
    padding: 0 16px;
    border: 1px solid rgba(103,217,228,.25);
    border-radius: 18px;
    background: rgba(0,0,0,.2);
    transition: border-color .2s, box-shadow .2s;
}

.search-box:focus-within {
    border-color: var(--accent);
    box-shadow: 0 0 0 4px rgba(23,184,200,.10);
}

.search-icon {
    color: var(--accent-2);
    font-size: 1.7rem;
}

.search-box input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    color: var(--text);
    background: transparent;
    font-size: clamp(1rem, 2vw, 1.15rem);
}

.search-box input::placeholder {
    color: #708a94;
}

.clear-search {
    display: none;
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 50%;
    color: var(--muted);
    background: rgba(255,255,255,.06);
    cursor: pointer;
    font-size: 1.4rem;
}

.clear-search.is-visible {
    display: grid;
    place-items: center;
}

.search-hint,
.muted {
    color: var(--muted);
}

.search-hint {
    margin: 10px 3px 0;
    font-size: .84rem;
}

.team-list {
    display: grid;
    gap: 9px;
    margin-top: 22px;
}

.team-card {
    min-height: 76px;
    display: grid;
    grid-template-columns: 52px 1fr auto;
    align-items: center;
    gap: 14px;
    padding: 11px 13px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: rgba(255,255,255,.025);
}

.team-logo {
    width: 50px;
    height: 50px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: 13px;
    background: #fff;
    color: #0b3139;
    font-weight: 900;
}

.team-logo img {
    width: 100%;
    height: 100%;
    padding: 4px;
    object-fit: contain;
}

.team-info {
    min-width: 0;
}

.team-info strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: .98rem;
}

.team-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 7px;
    color: var(--muted);
    font-size: .72rem;
}

.chip {
    display: inline-flex;
    max-width: 230px;
    padding: 4px 7px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(23,184,200,.1);
    color: #aeeff4;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.favorite-button {
    width: 46px;
    height: 46px;
    border: 1px solid var(--line);
    border-radius: 14px;
    color: #95aab1;
    background: rgba(255,255,255,.035);
    cursor: pointer;
    font-size: 1.55rem;
}

.favorite-button:hover {
    border-color: rgba(255,159,67,.4);
    color: var(--orange);
}

.favorite-button.is-favorite {
    color: var(--orange);
    border-color: rgba(255,159,67,.28);
    background: rgba(255,159,67,.09);
}

.button {
    min-height: 42px;
    padding: 0 16px;
    border: 1px solid transparent;
    border-radius: 12px;
    background: var(--accent);
    color: #022027;
    font-weight: 800;
    cursor: pointer;
}

.button:disabled {
    opacity: .45;
    cursor: wait;
}

.button-secondary {
    border-color: var(--line);
    color: var(--text);
    background: rgba(255,255,255,.05);
}

.empty-state,
.loading-state,
.error-state {
    min-height: 80px;
    display: grid;
    place-items: center;
    padding: 18px;
    text-align: center;
    color: var(--muted);
}

.empty-state p,
.loading-state p,
.error-state p {
    margin: 0;
}

.empty-state small {
    display: block;
    margin-top: 6px;
}

.error-state {
    color: #ffc4c4;
}

.match-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 13px;
}

.match-card {
    position: relative;
    display: block;
    min-width: 0;
    padding: 16px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: rgba(255,255,255,.028);
    text-decoration: none;
    transition: transform .15s, border-color .15s, background .15s;
}

.match-card:hover {
    transform: translateY(-2px);
    border-color: rgba(103,217,228,.34);
    background: rgba(255,255,255,.045);
}

.match-card.is-live {
    border-color: rgba(101,223,140,.28);
}

.match-card-top,
.match-card-bottom,
.match-team-row {
    display: flex;
    align-items: center;
}

.match-card-top {
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 16px;
}

.series-name {
    min-width: 0;
    overflow: hidden;
    color: var(--muted);
    font-size: .72rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.match-status {
    flex: 0 0 auto;
    padding: 4px 7px;
    border-radius: 999px;
    font-size: .65rem;
    font-weight: 900;
    letter-spacing: .06em;
}

.match-status.live {
    color: #0c4420;
    background: var(--live);
}

.match-status.finished {
    color: var(--muted);
    background: rgba(255,255,255,.08);
}

.match-status.scheduled {
    color: #bfeff3;
    background: rgba(23,184,200,.12);
}

.match-team-row {
    min-height: 42px;
    gap: 9px;
}

.match-team-row strong {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .9rem;
}

.match-logo {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    object-fit: contain;
    border-radius: 7px;
    background: #fff;
}

.match-logo-fallback {
    display: grid;
    place-items: center;
    color: #123740;
    font-size: .63rem;
    font-weight: 900;
}

.mini-serve {
    width: 11px;
    color: var(--orange);
    font-size: .62rem;
}

.sets {
    min-width: 26px;
    text-align: right;
    font-size: 1.25rem;
    font-weight: 900;
}

.match-card-bottom {
    min-height: 30px;
    gap: 9px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
    color: var(--muted);
    font-size: .75rem;
}

.current-points {
    margin-left: auto;
    color: var(--text);
    font-size: .95rem;
    font-weight: 900;
}

.favorite-marker {
    color: var(--orange);
}

footer {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding: 25px 0 48px;
    color: #60747b;
    font-size: .78rem;
}

.toast {
    position: fixed;
    left: 50%;
    bottom: 24px;
    z-index: 30;
    max-width: min(90vw, 520px);
    padding: 12px 18px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #132f38;
    box-shadow: var(--shadow);
    color: var(--text);
    opacity: 0;
    transform: translate(-50%, 16px);
    pointer-events: none;
    transition: .2s ease;
}

.toast.show {
    opacity: 1;
    transform: translate(-50%, 0);
}

/* Scoreboard */

.scoreboard-page {
    overflow-x: hidden;
    background:
        radial-gradient(circle at 50% 30%, rgba(23,184,200,.14), transparent 38%),
        #02080b;
}

.scoreboard-shell {
    min-height: 100vh;
    display: grid;
    grid-template-rows: auto 1fr auto;
    padding: clamp(12px, 2vw, 28px);
}

.scoreboard-top {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 16px;
}

.back-link {
    justify-self: start;
    color: var(--muted);
    text-decoration: none;
    font-size: .85rem;
}

.scoreboard-series {
    max-width: 55vw;
    overflow: hidden;
    text-align: center;
    color: var(--muted);
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: clamp(.75rem, 1.3vw, 1rem);
    font-weight: 700;
    letter-spacing: .04em;
}

.scoreboard-top .connection-pill {
    justify-self: end;
}

.scoreboard-main {
    display: grid;
    align-content: center;
    gap: clamp(18px, 4vh, 48px);
    padding: clamp(20px, 3vw, 45px) 0;
}

.score-status-row {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 18px;
    color: var(--muted);
}

.score-status {
    padding: 7px 12px;
    border-radius: 999px;
    background: rgba(255,255,255,.06);
    font-size: clamp(.68rem, 1.1vw, .88rem);
    font-weight: 900;
    letter-spacing: .11em;
}

.score-status.is-live {
    color: #082f18;
    background: var(--live);
}

.score-status.is-finished {
    color: #c6d2d6;
    background: rgba(255,255,255,.09);
}

.score-time {
    font-size: clamp(.72rem, 1.1vw, .9rem);
}

.teams-score {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(250px, .8fr) minmax(0, 1fr);
    align-items: center;
    gap: clamp(14px, 3vw, 50px);
}

.score-team {
    min-width: 0;
    text-align: center;
}

.score-logo-wrap {
    width: clamp(82px, 11vw, 160px);
    height: clamp(82px, 11vw, 160px);
    display: grid;
    place-items: center;
    margin: 0 auto clamp(13px, 2.2vh, 24px);
    overflow: hidden;
    border-radius: 24%;
    background: #fff;
    box-shadow: 0 18px 50px rgba(0,0,0,.22);
}

.score-logo {
    width: 100%;
    height: 100%;
    padding: 8%;
    object-fit: contain;
}

.score-logo-fallback {
    color: #143842;
    font-size: clamp(1.6rem, 5vw, 4rem);
    font-weight: 950;
}

.score-team h1 {
    min-height: 2.25em;
    display: grid;
    place-items: center;
    margin: 0;
    overflow-wrap: anywhere;
    font-size: clamp(1.2rem, 3vw, 3.25rem);
    line-height: 1.06;
    letter-spacing: -.045em;
}

.serve-badge {
    display: inline-flex;
    margin-top: 14px;
    padding: 7px 11px;
    border: 1px solid rgba(255,159,67,.26);
    border-radius: 999px;
    color: var(--orange);
    background: rgba(255,159,67,.08);
    font-size: clamp(.62rem, 1vw, .85rem);
    font-weight: 850;
    letter-spacing: .08em;
}

.score-center {
    text-align: center;
}

.set-score-label {
    color: var(--muted);
    font-size: clamp(.65rem, 1vw, .9rem);
    font-weight: 900;
    letter-spacing: .18em;
}

.set-score,
.point-score {
    display: flex;
    justify-content: center;
    align-items: baseline;
    font-variant-numeric: tabular-nums;
    font-weight: 950;
    line-height: .9;
    letter-spacing: -.06em;
}

.set-score {
    margin-top: 7px;
    color: var(--accent-2);
    font-size: clamp(2.4rem, 6vw, 6.5rem);
}

.point-score {
    margin-top: clamp(20px, 4vh, 44px);
    font-size: clamp(4rem, 12vw, 13rem);
    text-shadow: 0 10px 50px rgba(23,184,200,.08);
}

.colon {
    margin: 0 .13em;
    color: #6f8890;
    font-size: .72em;
}

.current-set-label {
    margin-top: 14px;
    color: var(--muted);
    font-size: clamp(.8rem, 1.4vw, 1.15rem);
    font-weight: 750;
}

.set-history-wrap {
    overflow-x: auto;
    scrollbar-width: thin;
}

.set-history {
    display: flex;
    justify-content: center;
    gap: 9px;
    min-width: max-content;
    padding: 4px;
}

.set-pill {
    min-width: 105px;
    padding: 9px 14px;
    border: 1px solid var(--line);
    border-radius: 13px;
    text-align: center;
    background: rgba(255,255,255,.025);
}

.set-pill small,
.set-pill strong {
    display: block;
}

.set-pill small {
    margin-bottom: 4px;
    color: var(--muted);
    font-size: .65rem;
}

.set-pill strong {
    font-size: 1rem;
}

.set-pill.is-current {
    border-color: rgba(23,184,200,.4);
    background: rgba(23,184,200,.08);
}

.scoreboard-controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 0;
    color: var(--muted);
    font-size: .75rem;
}

.control-buttons {
    display: flex;
    gap: 8px;
}

:fullscreen .scoreboard-shell {
    width: 100vw;
    height: 100vh;
}

@media (max-width: 980px) {
    .match-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .teams-score {
        grid-template-columns: 1fr minmax(180px, .8fr) 1fr;
        gap: 14px;
    }
}

@media (max-width: 720px) {
    .app-shell {
        width: min(100% - 20px, 1320px);
    }

    .topbar {
        min-height: 72px;
    }

    .brand small {
        display: none;
    }

    .hero {
        min-height: auto;
        grid-template-columns: 1fr;
        padding: 42px 2px 34px;
    }

    .hero-stat {
        display: none;
    }

    .panel {
        padding: 18px;
        border-radius: 18px;
    }

    .section-heading {
        align-items: flex-end;
    }

    .match-grid {
        grid-template-columns: 1fr;
    }

    .team-card {
        grid-template-columns: 46px 1fr auto;
        gap: 10px;
    }

    .team-logo {
        width: 44px;
        height: 44px;
    }

    .scoreboard-shell {
        padding: 10px;
    }

    .scoreboard-top {
        grid-template-columns: auto 1fr auto;
    }

    .back-link {
        font-size: 0;
    }

    .back-link::before {
        content: "←";
        font-size: 1.2rem;
    }

    .scoreboard-series {
        max-width: 45vw;
    }

    .scoreboard-top .connection-pill {
        padding: 7px 9px;
    }

    .teams-score {
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
            "team1 team2"
            "center center";
        align-items: start;
    }

    .score-team-left { grid-area: team1; }
    .score-team-right { grid-area: team2; }
    .score-center {
        grid-area: center;
        margin-top: 10px;
    }

    .score-team h1 {
        min-height: 2.4em;
        font-size: clamp(1.05rem, 5vw, 1.7rem);
    }

    .score-logo-wrap {
        width: 78px;
        height: 78px;
        margin-bottom: 10px;
    }

    .set-score {
        font-size: 2.8rem;
    }

    .point-score {
        margin-top: 14px;
        font-size: clamp(4.8rem, 25vw, 8rem);
    }

    .set-history {
        justify-content: flex-start;
    }

    .scoreboard-controls {
        align-items: flex-end;
    }

    .scoreboard-controls > span {
        max-width: 38vw;
    }

    .control-buttons {
        flex-wrap: wrap;
        justify-content: flex-end;
    }

    .control-buttons .button {
        min-height: 38px;
        padding: 0 10px;
        font-size: .76rem;
    }
}

/* v2: WVV + DVV, Filter und Quellenkennzeichnung */
.filter-stack {
    display: grid;
    gap: 14px;
}

.filter-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 9px;
}

.filter-row-compact {
    margin-top: 14px;
}

.filter-label {
    min-width: 72px;
    color: var(--muted);
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.filter-button {
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--muted);
    background: rgba(255,255,255,.035);
    cursor: pointer;
    font-size: .82rem;
    font-weight: 800;
    transition: border-color .15s, background .15s, color .15s, transform .15s;
}

.filter-button:hover {
    transform: translateY(-1px);
    border-color: rgba(103,217,228,.28);
    color: var(--text);
}

.filter-button.is-active {
    border-color: rgba(23,184,200,.42);
    color: #d9fbff;
    background: rgba(23,184,200,.14);
}

.filter-button-live.is-active {
    border-color: rgba(101,223,140,.38);
    color: #c8f9d6;
    background: rgba(101,223,140,.1);
}

.section-count {
    color: var(--muted);
    font-size: .78rem;
    white-space: nowrap;
}

.source-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    min-height: 22px;
    padding: 3px 7px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 999px;
    color: #dce9ed;
    background: rgba(255,255,255,.055);
    font-size: .62rem;
    font-weight: 950;
    letter-spacing: .08em;
    line-height: 1;
}

.source-badge.source-wvv {
    border-color: rgba(23,184,200,.34);
    color: #b9f6fb;
    background: rgba(23,184,200,.11);
}

.source-badge.source-dvv {
    border-color: rgba(255,159,67,.34);
    color: #ffd2a6;
    background: rgba(255,159,67,.1);
}

.team-title-line {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.team-title-line strong {
    min-width: 0;
}

.match-source-series {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

.scoreboard-series {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

/* Wichtig: author CSS darf das HTML-hidden-Attribut nicht übersteuern. */
.serve-badge[hidden],
.score-logo[hidden],
.score-logo-fallback[hidden] {
    display: none !important;
}

@media (max-width: 720px) {
    .filter-label {
        width: 100%;
        min-width: 0;
        margin-bottom: 1px;
    }

    .filter-button {
        flex: 1 1 auto;
    }

    .section-heading .section-count {
        display: none;
    }
}

/* v3 – Benutzerkonto & gespeicherte Spiele */
.topbar-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.account-pill {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 5px 12px 5px 6px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: rgba(255,255,255,.04);
    color: var(--text);
    text-decoration: none;
    font-size: .82rem;
    font-weight: 750;
}

.account-pill:hover {
    border-color: rgba(103,217,228,.35);
    background: rgba(255,255,255,.065);
}

.account-avatar {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(23,184,200,.14);
    color: var(--accent-2);
    font-weight: 900;
}

.account-pill.is-logged-in .account-avatar {
    background: var(--accent);
    color: #03242a;
}

.inline-link {
    color: var(--accent-2);
    text-underline-offset: 3px;
}

.account-promo {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
}

.account-promo h2 {
    margin: 0 0 8px;
}

.account-promo p {
    margin: 0;
}

.account-promo-actions {
    display: flex;
    gap: 9px;
    flex: 0 0 auto;
}

.account-promo-actions .button {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

.match-card-shell {
    position: relative;
    min-width: 0;
}

.match-card-shell > .match-card {
    height: 100%;
    padding-bottom: 54px;
}

.match-save-button {
    position: absolute;
    right: 13px;
    bottom: 12px;
    z-index: 4;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,159,67,.25);
    border-radius: 12px;
    background: rgba(4,17,22,.92);
    color: #8aa0a8;
    cursor: pointer;
    font-size: 1.35rem;
    line-height: 1;
}

.match-save-button:hover,
.match-save-button.is-saved {
    color: var(--orange);
    border-color: rgba(255,159,67,.5);
    background: rgba(255,159,67,.09);
}

.match-card-archived {
    cursor: default;
    opacity: .82;
}

/* Auth-Seiten */
.auth-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 28px 16px;
}

.auth-shell {
    width: min(100%, 520px);
}

.auth-shell-wide {
    width: min(100%, 640px);
}

.auth-brand {
    display: inline-flex;
    margin: 0 0 14px 4px;
    color: var(--muted);
    text-decoration: none;
    font-size: .88rem;
}

.auth-brand:hover {
    color: var(--text);
}

.auth-card {
    padding: clamp(24px, 5vw, 42px);
    border: 1px solid var(--line);
    border-radius: 24px;
    background: linear-gradient(180deg, rgba(16,47,57,.96), rgba(5,20,26,.98));
    box-shadow: var(--shadow);
}

.auth-card h1 {
    margin: 0;
    font-size: clamp(2rem, 8vw, 3.5rem);
    letter-spacing: -.05em;
}

.auth-copy {
    margin: 12px 0 26px;
    color: var(--muted);
    line-height: 1.55;
}

.auth-form {
    display: grid;
    gap: 16px;
}

.form-field {
    display: grid;
    gap: 7px;
}

.form-field > span {
    color: #dce8eb;
    font-size: .84rem;
    font-weight: 750;
}

.form-field > small {
    color: var(--muted);
    font-size: .72rem;
    line-height: 1.4;
}

.form-field input {
    width: 100%;
    min-height: 50px;
    padding: 0 14px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 13px;
    outline: 0;
    background: rgba(0,0,0,.22);
    color: var(--text);
}

.form-field input:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 4px rgba(23,184,200,.09);
}

.auth-submit {
    width: 100%;
    min-height: 50px;
    margin-top: 4px;
}

.auth-button-link {
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.auth-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px 16px;
    margin-top: 22px;
    padding-top: 19px;
    border-top: 1px solid var(--line);
}

.auth-links a {
    color: var(--accent-2);
    font-size: .82rem;
    text-decoration: none;
}

.form-alert {
    margin: 0 0 18px;
    padding: 12px 14px;
    border-radius: 12px;
    font-size: .84rem;
    line-height: 1.45;
}

.form-alert-error {
    border: 1px solid rgba(255,107,107,.25);
    background: rgba(255,107,107,.08);
    color: #ffcaca;
}

.form-alert-success {
    border: 1px solid rgba(101,223,140,.25);
    background: rgba(101,223,140,.08);
    color: #c9f8d7;
}

.account-stats {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin: 24px 0;
}

.account-stats > div {
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: rgba(255,255,255,.025);
    text-align: center;
}

.account-stats strong,
.account-stats span {
    display: block;
}

.account-stats strong {
    color: var(--accent-2);
    font-size: 2.1rem;
}

.account-stats span {
    margin-top: 4px;
    color: var(--muted);
    font-size: .76rem;
}

.account-actions {
    display: grid;
    gap: 9px;
}

.logout-form {
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid var(--line);
    text-align: center;
}

.text-button {
    border: 0;
    background: transparent;
    color: #d98b8b;
    cursor: pointer;
    font-size: .82rem;
}

@media (max-width: 720px) {
    .topbar-actions {
        gap: 6px;
    }

    .account-name {
        display: none;
    }

    .account-pill {
        padding-right: 6px;
    }

    .connection-pill #connectionText {
        max-width: 88px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .account-promo {
        align-items: stretch;
        flex-direction: column;
    }

    .account-promo-actions {
        width: 100%;
    }

    .account-promo-actions .button {
        flex: 1;
        justify-content: center;
    }
}

/* v3.1: Liga-Favoriten + kompakte LIVE-Übersicht */
.favorites-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}

.favorites-columns > .panel {
    min-width: 0;
}

.search-type-row {
    margin-bottom: 14px;
}

.league-list {
    display: grid;
    gap: 9px;
    margin-top: 22px;
}

.league-card {
    min-height: 82px;
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    padding: 12px 13px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: rgba(255,255,255,.025);
}

.league-icon {
    width: 50px;
    height: 50px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: rgba(23,184,200,.1);
    font-size: 1.5rem;
}

.league-info {
    min-width: 0;
}

.league-info strong {
    font-size: 1rem;
}

.league-name {
    margin-top: 4px;
    overflow: hidden;
    color: var(--muted);
    font-size: .78rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.league-period-row {
    margin-bottom: 20px;
}

.compact-copy {
    max-width: 760px;
    margin: 8px 0 0;
    font-size: .83rem;
    line-height: 1.45;
}

.live-count-badge {
    color: var(--live);
}

.live-dashboard-panel {
    overflow: hidden;
}

.live-match-board {
    --live-columns: 2;
    display: grid;
    grid-template-columns: repeat(var(--live-columns), minmax(0, 1fr));
    gap: 10px;
}

.live-match-board[data-density="large"] {
    --live-columns: 2;
}

.live-match-board[data-density="normal"] {
    --live-columns: 3;
}

.live-match-board[data-density="compact"] {
    --live-columns: 4;
    gap: 8px;
}

.live-match-board[data-density="dense"] {
    --live-columns: 5;
    gap: 7px;
}

.live-mini-card {
    min-width: 0;
    display: grid;
    gap: 7px;
    padding: 13px 14px;
    border: 1px solid rgba(101,223,140,.24);
    border-radius: 15px;
    background: linear-gradient(180deg, rgba(101,223,140,.055), rgba(255,255,255,.025));
    text-decoration: none;
    transition: transform .15s, border-color .15s, background .15s;
}

.live-mini-card:hover {
    transform: translateY(-1px);
    border-color: rgba(101,223,140,.45);
    background: rgba(101,223,140,.075);
}

.live-mini-head {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

.live-dot-label {
    flex: 0 0 auto;
    color: var(--live);
    font-size: .66rem;
    font-weight: 900;
    letter-spacing: .06em;
}

.live-mini-series {
    min-width: 0;
    overflow: hidden;
    color: var(--muted);
    font-size: .68rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.live-mini-team {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
}

.live-mini-team strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .84rem;
}

.live-mini-team > span {
    min-width: 20px;
    text-align: right;
    color: var(--accent-2);
    font-size: 1.05rem;
    font-weight: 950;
}

.live-mini-score {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    padding-top: 7px;
    border-top: 1px solid var(--line);
    color: var(--muted);
    font-size: .7rem;
}

.live-mini-score strong {
    color: var(--text);
    font-size: 1.05rem;
}

.live-match-board[data-density="compact"] .live-mini-card,
.live-match-board[data-density="dense"] .live-mini-card {
    padding: 10px 11px;
}

.live-match-board[data-density="compact"] .live-mini-team strong,
.live-match-board[data-density="dense"] .live-mini-team strong {
    font-size: .76rem;
}

.live-match-board[data-density="dense"] .live-mini-series {
    display: none;
}

.live-match-board[data-density="dense"] .source-badge {
    padding: 2px 5px;
    font-size: .56rem;
}

.account-stats {
    grid-template-columns: repeat(3, 1fr);
}

@media (max-width: 1100px) {
    .live-match-board[data-density="normal"],
    .live-match-board[data-density="compact"],
    .live-match-board[data-density="dense"] {
        --live-columns: 3;
    }
}

@media (max-width: 820px) {
    .favorites-columns {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .live-match-board,
    .live-match-board[data-density="large"],
    .live-match-board[data-density="normal"],
    .live-match-board[data-density="compact"],
    .live-match-board[data-density="dense"] {
        --live-columns: 2;
    }
}

@media (max-width: 560px) {
    .live-match-board,
    .live-match-board[data-density="large"],
    .live-match-board[data-density="normal"],
    .live-match-board[data-density="compact"],
    .live-match-board[data-density="dense"] {
        --live-columns: 1;
    }

    .live-mini-card {
        padding: 10px 12px;
    }

    .live-mini-head {
        gap: 6px;
    }

    .live-mini-team strong {
        font-size: .8rem;
    }

    .live-mini-score {
        padding-top: 5px;
    }

    .league-card {
        grid-template-columns: 44px minmax(0, 1fr) auto;
        gap: 10px;
    }

    .league-icon {
        width: 44px;
        height: 44px;
    }

    .account-stats {
        grid-template-columns: 1fr;
    }
}

/* Dedizierte Meine-LIVE-Spiele-Seite */
.section-heading-actions,
.live-page-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.compact-action {
    min-height: 36px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-size: .76rem;
}

.live-page {
    min-height: 100vh;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 0%, rgba(23,184,200,.11), transparent 35%),
        #02080b;
}

.live-page-shell {
    min-height: 100vh;
    height: 100vh;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    padding: 18px 22px 14px;
}

.live-page-header {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 18px;
    min-height: 66px;
}

.live-page-header h1 {
    margin: 0;
    font-size: clamp(1.45rem, 3vw, 2.5rem);
    letter-spacing: -.045em;
}

.live-page-main {
    min-height: 0;
    display: grid;
    align-items: stretch;
    padding: 10px 0;
}

.live-page-grid {
    --cols: 2;
    --rows: 1;
    min-height: 0;
    display: grid;
    grid-template-columns: repeat(var(--cols), minmax(0, 1fr));
    grid-template-rows: repeat(var(--rows), minmax(0, 1fr));
    gap: 10px;
}

.live-page-grid[data-density="xl"] { --cols: 2; --rows: 1; }
.live-page-grid[data-density="large"] { --cols: 2; --rows: 2; }
.live-page-grid[data-density="normal"] { --cols: 4; --rows: 2; }
.live-page-grid[data-density="compact"] { --cols: 4; --rows: 3; gap: 8px; }
.live-page-grid[data-density="dense"] { --cols: 5; --rows: 4; gap: 7px; }
.live-page-grid[data-density="ultra"] { --cols: 6; --rows: 5; gap: 6px; }

.live-page-card {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: auto 1fr 1fr auto;
    gap: clamp(4px, .8vh, 10px);
    padding: clamp(9px, 1.4vw, 18px);
    overflow: hidden;
    border: 1px solid rgba(101,223,140,.24);
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(101,223,140,.055), rgba(8,27,34,.88));
    text-decoration: none;
}

.live-page-card-head {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 7px;
}

.live-page-series {
    min-width: 0;
    overflow: hidden;
    color: var(--muted);
    font-size: clamp(.58rem, .8vw, .76rem);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.live-page-team {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 12px auto;
    align-items: center;
    gap: 8px;
}

.live-page-team strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: clamp(.75rem, 1.5vw, 1.25rem);
}

.live-page-team b {
    color: var(--accent-2);
    font-size: clamp(1.05rem, 2vw, 1.8rem);
}

.serve-dot {
    color: var(--orange);
    font-size: .7rem;
}

.live-page-score {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    padding-top: 6px;
    border-top: 1px solid var(--line);
    color: var(--muted);
    font-size: clamp(.58rem, .8vw, .72rem);
}

.live-page-score strong {
    color: var(--text);
    font-size: clamp(1rem, 2.1vw, 1.8rem);
    font-variant-numeric: tabular-nums;
}

.live-page-grid[data-density="dense"] .live-page-card,
.live-page-grid[data-density="ultra"] .live-page-card {
    border-radius: 12px;
    padding: 8px 9px;
}

.live-page-grid[data-density="ultra"] .live-page-series {
    display: none;
}

.live-page-grid[data-density="ultra"] .live-page-team strong {
    font-size: .7rem;
}

.live-page-grid[data-density="ultra"] .live-page-score strong {
    font-size: 1rem;
}

.live-page-empty {
    grid-column: 1 / -1;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    min-height: 0;
    color: var(--muted);
    text-align: center;
}

.live-page-empty strong {
    color: var(--text);
    font-size: clamp(1.4rem, 4vw, 3rem);
}

.live-page-footer {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 8px 0 0;
    color: var(--muted);
    font-size: .72rem;
}

@media (max-width: 900px) {
    .live-page {
        overflow: auto;
    }

    .live-page-shell {
        height: auto;
        min-height: 100vh;
    }

    .live-page-header {
        grid-template-columns: auto 1fr;
    }

    .live-page-actions {
        grid-column: 1 / -1;
        justify-content: flex-end;
    }

    .live-page-grid,
    .live-page-grid[data-density="xl"],
    .live-page-grid[data-density="large"],
    .live-page-grid[data-density="normal"],
    .live-page-grid[data-density="compact"],
    .live-page-grid[data-density="dense"],
    .live-page-grid[data-density="ultra"] {
        --cols: 2;
        --rows: auto;
        grid-template-rows: none;
        grid-auto-rows: minmax(118px, auto);
    }
}

@media (max-width: 560px) {
    .section-heading-actions {
        align-items: flex-end;
        flex-direction: column;
    }

    .live-page-shell {
        padding: 12px 10px 10px;
    }

    .live-page-grid,
    .live-page-grid[data-density="xl"],
    .live-page-grid[data-density="large"],
    .live-page-grid[data-density="normal"],
    .live-page-grid[data-density="compact"],
    .live-page-grid[data-density="dense"],
    .live-page-grid[data-density="ultra"] {
        --cols: 1;
        grid-auto-rows: minmax(110px, auto);
    }

    .live-page-actions {
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .live-page-team strong {
        font-size: .86rem;
    }

    .live-page-team b {
        font-size: 1.2rem;
    }
}

/* v3.2: VBL + eingeklappter Favoritenfinder + getrennte Spielbereiche */
.source-badge.source-vbl {
    border-color: rgba(177, 127, 255, .38);
    color: #e3ccff;
    background: rgba(151, 93, 236, .12);
}

.live-shortcut {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 0 13px;
    border: 1px solid rgba(101,223,140,.24);
    border-radius: 999px;
    color: #c8f9d6;
    background: rgba(101,223,140,.075);
    text-decoration: none;
    font-size: .76rem;
    font-weight: 850;
    white-space: nowrap;
}

.live-shortcut:hover {
    border-color: rgba(101,223,140,.45);
    background: rgba(101,223,140,.12);
}

.finder-panel {
    padding: 0;
    overflow: hidden;
}

.finder-panel > summary {
    list-style: none;
}

.finder-panel > summary::-webkit-details-marker {
    display: none;
}

.finder-summary {
    min-height: 126px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: clamp(22px, 3vw, 34px);
    cursor: pointer;
    user-select: none;
}

.finder-summary h2 {
    margin: 0;
    font-size: clamp(1.5rem, 3vw, 2.2rem);
    letter-spacing: -.025em;
}

.finder-toggle {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(103,217,228,.24);
    border-radius: 50%;
    color: var(--accent-2);
    background: rgba(23,184,200,.08);
    font-size: 1.8rem;
    line-height: 1;
    transition: transform .2s ease, background .2s ease;
}

.finder-panel[open] .finder-toggle {
    transform: rotate(45deg);
    background: rgba(23,184,200,.14);
}

.finder-content {
    padding: 0 clamp(22px, 3vw, 34px) clamp(22px, 3vw, 34px);
    border-top: 1px solid var(--line);
}

.finder-content > .search-type-row {
    padding-top: 24px;
}

.finder-favorites {
    margin-top: 28px;
    padding-top: 24px;
    border-top: 1px solid var(--line);
}

.finder-subpanel {
    min-width: 0;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: rgba(0,0,0,.11);
}

.finder-subpanel .section-heading {
    margin-bottom: 14px;
}

.finder-subpanel h3 {
    margin: 0;
    font-size: 1.18rem;
}

.team-period-row,
.saved-period-row {
    margin-bottom: 20px;
}

#teamMatchesSection,
#leagueMatchesSection,
#savedMatchesSection {
    scroll-margin-top: 18px;
}

@media (max-width: 980px) {
    .live-shortcut {
        display: none;
    }
}

@media (max-width: 720px) {
    .finder-summary {
        min-height: 108px;
        padding: 20px 18px;
    }

    .finder-content {
        padding: 0 18px 18px;
    }

    .finder-toggle {
        width: 42px;
        height: 42px;
        flex-basis: 42px;
    }

    .finder-summary .compact-copy {
        display: none;
    }

    .finder-subpanel {
        padding: 14px;
    }

    .team-period-row,
    .league-period-row,
    .saved-period-row {
        gap: 7px;
    }

    .team-period-row .filter-label,
    .league-period-row .filter-label,
    .saved-period-row .filter-label {
        flex-basis: 100%;
        min-width: 0;
    }
}


/* v3.2.1: kompakte LIVE-Karten mit Satzhistorie */
.match-set-results {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    margin-top: 10px;
    padding-top: 10px;
    overflow-x: auto;
    border-top: 1px solid rgba(255,255,255,.055);
    scrollbar-width: none;
}

.match-set-results::-webkit-scrollbar {
    display: none;
}

.match-set-chip {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
    padding: 4px 7px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 9px;
    color: var(--muted);
    background: rgba(255,255,255,.025);
    font-variant-numeric: tabular-nums;
}

.match-set-chip small {
    font-size: .58rem;
    font-weight: 800;
}

.match-set-chip b {
    color: var(--text);
    font-size: .72rem;
}

.match-set-chip.is-current {
    border-color: rgba(23,184,200,.35);
    color: var(--accent-2);
    background: rgba(23,184,200,.085);
}

.live-page-card {
    grid-template-rows: auto auto auto auto auto;
}

.live-page-setline {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: clamp(3px, .45vw, 7px);
    overflow: hidden;
    white-space: nowrap;
}

.live-page-setline.is-empty {
    color: #6c8188;
    font-size: clamp(.5rem, .65vw, .68rem);
}

.live-page-set {
    min-width: 0;
    display: inline-flex;
    align-items: baseline;
    gap: 3px;
    padding: 3px 5px;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 7px;
    color: var(--muted);
    background: rgba(255,255,255,.022);
    font-variant-numeric: tabular-nums;
}

.live-page-set small {
    font-size: clamp(.46rem, .58vw, .62rem);
    font-weight: 800;
}

.live-page-set b {
    color: var(--text);
    font-size: clamp(.58rem, .78vw, .78rem);
}

.live-page-set.is-current {
    border-color: rgba(23,184,200,.32);
    color: var(--accent-2);
    background: rgba(23,184,200,.075);
}

/* Je mehr Spiele, desto stärker werden Header, Abstände und Satzchips verdichtet. */
.live-page-grid[data-density="compact"] .live-page-card,
.live-page-grid[data-density="dense"] .live-page-card,
.live-page-grid[data-density="ultra"] .live-page-card {
    gap: 4px;
}

.live-page-grid[data-density="dense"] .live-page-card-head,
.live-page-grid[data-density="ultra"] .live-page-card-head {
    gap: 4px;
}

.live-page-grid[data-density="dense"] .live-page-set,
.live-page-grid[data-density="ultra"] .live-page-set {
    padding: 2px 4px;
}

.live-page-grid[data-density="ultra"] .live-page-set small {
    display: none;
}

.live-page-grid[data-density="ultra"] .live-page-set b {
    font-size: .58rem;
}

.live-page-grid[data-density="ultra"] .live-dot-label,
.live-page-grid[data-density="ultra"] .source-badge {
    font-size: .52rem;
    padding: 2px 5px;
}

.live-page-grid[data-density="ultra"] .live-page-team b {
    font-size: .86rem;
}

.live-page-grid[data-density="ultra"] .live-page-score {
    padding-top: 3px;
}

.live-page-grid[data-density="ultra"] .live-page-score span {
    font-size: .5rem;
}

.live-page-grid[data-density="ultra"] .live-page-score strong {
    font-size: .9rem;
}

@media (max-width: 1000px) {
    .live-page {
        overflow: auto;
    }

    .live-page-shell {
        height: auto;
        min-height: 100vh;
    }

    .live-page-grid,
    .live-page-grid[data-density] {
        grid-template-rows: none;
        grid-auto-rows: minmax(132px, auto);
    }
}

@media (max-width: 720px) {
    .live-page-grid,
    .live-page-grid[data-density] {
        --cols: 1;
        grid-template-columns: 1fr;
        grid-auto-rows: minmax(140px, auto);
    }

    .live-page-setline {
        overflow-x: auto;
        scrollbar-width: none;
    }
}

/* v3.3: kompakte tabellarische Satzanzeige auf /live.php */
.live-page-main {
    align-items: start;
}

.live-page-grid {
    grid-template-rows: none;
    grid-auto-rows: auto;
    align-content: start;
}

.live-page-card {
    display: block;
    min-height: 0;
    padding: 12px 14px;
    border-radius: 14px;
}

.live-page-card-head {
    margin-bottom: 9px;
}

.live-page-current-set {
    margin-left: auto;
    color: var(--accent-2);
    font-size: .68rem;
    font-weight: 850;
    white-space: nowrap;
}

.live-score-table {
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.085);
    border-radius: 11px;
    background: rgba(0,0,0,.09);
}

.live-score-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) repeat(5, minmax(26px, 34px)) minmax(42px, 54px);
    align-items: stretch;
}

.live-score-labels {
    min-height: 24px;
    border-bottom: 1px solid rgba(255,255,255,.07);
    color: #779097;
    background: rgba(255,255,255,.018);
    font-size: .53rem;
    font-weight: 850;
    letter-spacing: .045em;
    text-transform: uppercase;
}

.live-score-team-label,
.live-set-label,
.live-set-total-label,
.live-set-cell,
.live-set-total {
    display: grid;
    place-items: center;
    min-width: 0;
    border-left: 1px solid rgba(255,255,255,.055);
    font-variant-numeric: tabular-nums;
}

.live-score-team-label {
    place-items: center start;
    padding-left: 10px;
    border-left: 0;
}

.live-set-total-label {
    color: #b8d2d8;
}

.live-score-team-row {
    min-height: 44px;
}

.live-score-team-row + .live-score-team-row {
    border-top: 1px solid rgba(255,255,255,.07);
}

.live-score-team-name {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 0 10px;
}

.live-score-team-name strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: clamp(.72rem, .92vw, .96rem);
}

.live-score-serve {
    width: 8px;
    flex: 0 0 8px;
    color: transparent;
    font-size: .6rem;
}

.live-score-serve.is-serving {
    color: var(--orange);
}

.live-set-cell {
    color: #b1c1c6;
    font-size: clamp(.72rem, .88vw, .9rem);
    font-weight: 750;
}

.live-set-label.is-current,
.live-set-cell.is-current {
    color: #dcfbff;
    background: rgba(23,184,200,.12);
}

.live-set-total {
    color: var(--accent-2);
    background: rgba(23,184,200,.055);
    font-size: clamp(.92rem, 1.15vw, 1.2rem);
    font-weight: 950;
}

.live-page-grid[data-density="large"] .live-page-card {
    max-width: 760px;
}

.live-page-grid[data-density="compact"] .live-page-card,
.live-page-grid[data-density="dense"] .live-page-card,
.live-page-grid[data-density="ultra"] .live-page-card {
    padding: 8px 9px;
}

.live-page-grid[data-density="dense"] .live-page-card-head,
.live-page-grid[data-density="ultra"] .live-page-card-head {
    margin-bottom: 6px;
}

.live-page-grid[data-density="dense"] .live-score-row,
.live-page-grid[data-density="ultra"] .live-score-row {
    grid-template-columns: minmax(0, 1fr) repeat(5, minmax(22px, 28px)) minmax(36px, 44px);
}

.live-page-grid[data-density="dense"] .live-score-team-row,
.live-page-grid[data-density="ultra"] .live-score-team-row {
    min-height: 36px;
}

.live-page-grid[data-density="dense"] .live-score-team-name,
.live-page-grid[data-density="ultra"] .live-score-team-name {
    padding-inline: 7px;
}

.live-page-grid[data-density="dense"] .live-score-team-name strong,
.live-page-grid[data-density="ultra"] .live-score-team-name strong {
    font-size: .68rem;
}

.live-page-grid[data-density="dense"] .live-set-cell,
.live-page-grid[data-density="ultra"] .live-set-cell {
    font-size: .68rem;
}

.live-page-grid[data-density="ultra"] .live-score-labels {
    min-height: 20px;
    font-size: .46rem;
}

.live-page-grid[data-density="ultra"] .live-page-current-set,
.live-page-grid[data-density="ultra"] .live-page-series {
    display: none;
}

@media (min-width: 1500px) {
    .live-page-grid[data-count="3"],
    .live-page-grid[data-count="4"] {
        grid-template-columns: repeat(var(--cols), minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .live-page-grid {
        grid-template-rows: none !important;
        grid-auto-rows: auto !important;
    }
}

@media (max-width: 560px) {
    .live-page-card {
        padding: 10px;
    }

    .live-page-card-head {
        margin-bottom: 7px;
    }

    .live-score-row {
        grid-template-columns: minmax(0, 1fr) repeat(5, 26px) 40px;
    }

    .live-score-labels {
        font-size: .46rem;
    }

    .live-score-team-row {
        min-height: 42px;
    }

    .live-score-team-name {
        padding: 0 7px;
    }

    .live-score-team-name strong {
        font-size: .72rem;
    }

    .live-set-cell {
        font-size: .7rem;
    }

    .live-set-total {
        font-size: .95rem;
    }
}


/* v3.4: gleiche Ergebnistabelle auf allen Spielkarten */
.live-score-table.sets-3 .live-score-row,
.match-score-table.sets-3 .live-score-row {
    grid-template-columns: minmax(0, 1fr) repeat(3, minmax(30px, 40px)) minmax(46px, 58px);
}

.match-score-table {
    margin-top: 4px;
}

.match-card .live-score-team-row {
    min-height: 44px;
}

.match-card .live-score-team-name strong {
    font-size: .82rem;
}

.match-card .live-score-labels {
    min-height: 24px;
}

.match-card-bottom {
    margin-top: 10px;
}

.live-page-grid[data-density="dense"] .live-score-table.sets-3 .live-score-row,
.live-page-grid[data-density="ultra"] .live-score-table.sets-3 .live-score-row {
    grid-template-columns: minmax(0, 1fr) repeat(3, minmax(24px, 31px)) minmax(38px, 46px);
}

/* Admin */
.admin-shortcut {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 0 12px;
    border: 1px solid rgba(255,159,67,.28);
    border-radius: 999px;
    color: #ffd19f;
    background: rgba(255,159,67,.08);
    text-decoration: none;
    font-size: .76rem;
    font-weight: 800;
}

.admin-hero {
    min-height: 240px;
}

.admin-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 22px;
}

.admin-kpi {
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(16,47,57,.84), rgba(7,25,32,.9));
    box-shadow: var(--shadow);
}

.admin-kpi small,
.admin-kpi strong,
.admin-kpi span {
    display: block;
}

.admin-kpi small {
    color: var(--muted);
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.admin-kpi strong {
    margin-top: 8px;
    color: var(--accent-2);
    font-size: clamp(2rem, 5vw, 3.5rem);
    line-height: 1;
}

.admin-kpi span {
    margin-top: 8px;
    color: var(--muted);
    font-size: .78rem;
}

.analytics-bars {
    height: 230px;
    display: grid;
    grid-template-columns: repeat(14, minmax(0, 1fr));
    align-items: end;
    gap: 8px;
    padding-top: 12px;
}

.analytics-day {
    height: 100%;
    min-width: 0;
    display: grid;
    grid-template-rows: 1fr auto auto;
    gap: 4px;
    align-items: end;
    text-align: center;
}

.analytics-bar-wrap {
    height: 100%;
    display: flex;
    align-items: end;
    justify-content: center;
}

.analytics-bar {
    width: min(28px, 72%);
    min-height: 4px;
    border-radius: 7px 7px 3px 3px;
    background: linear-gradient(180deg, var(--accent-2), var(--accent));
}

.analytics-day strong {
    font-size: .75rem;
}

.analytics-day span {
    color: var(--muted);
    font-size: .62rem;
}

.admin-simple-table {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 14px;
}

.admin-simple-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 100px;
    align-items: center;
    min-height: 44px;
    padding: 0 14px;
    border-top: 1px solid var(--line);
}

.admin-simple-row:first-child {
    border-top: 0;
}

.admin-simple-head {
    color: var(--muted);
    background: rgba(255,255,255,.025);
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
}

.admin-simple-row > :last-child {
    text-align: right;
}

.admin-simple-row code {
    overflow: hidden;
    color: #dbe9ec;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-user-list {
    display: grid;
    gap: 10px;
}

.admin-user-card {
    display: grid;
    grid-template-columns: minmax(260px, 1.6fr) minmax(240px, .8fr) auto;
    align-items: center;
    gap: 18px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: rgba(255,255,255,.025);
}

.admin-user-card.is-disabled {
    opacity: .62;
}

.admin-user-title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.admin-user-title strong {
    overflow-wrap: anywhere;
}

.admin-role-badge {
    display: inline-flex;
    padding: 4px 7px;
    border-radius: 999px;
    color: #bad0d6;
    background: rgba(255,255,255,.06);
    font-size: .64rem;
    font-weight: 850;
    text-transform: uppercase;
}

.admin-role-badge.is-admin {
    color: #ffd19f;
    background: rgba(255,159,67,.1);
}

.admin-role-badge.is-blocked {
    color: #ffb4b4;
    background: rgba(255,107,107,.09);
}

.admin-user-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 14px;
    margin-top: 7px;
    color: var(--muted);
    font-size: .7rem;
}

.admin-user-counts {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.admin-user-counts span {
    padding: 7px 9px;
    border-radius: 10px;
    background: rgba(23,184,200,.07);
    color: var(--muted);
    font-size: .7rem;
}

.admin-user-counts b {
    color: var(--accent-2);
}

.admin-user-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 7px;
}

.button-danger {
    border-color: rgba(255,107,107,.25);
    background: rgba(255,107,107,.09);
    color: #ffc3c3;
}

@media (max-width: 980px) {
    .admin-kpis {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-user-card {
        grid-template-columns: 1fr;
    }

    .admin-user-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 720px) {
    .match-card .live-score-row,
    .live-page-card .live-score-row {
        grid-template-columns: minmax(0, 1fr) repeat(5, minmax(25px, 31px)) minmax(40px, 48px);
    }

    .match-card .live-score-table.sets-3 .live-score-row,
    .live-page-card .live-score-table.sets-3 .live-score-row {
        grid-template-columns: minmax(0, 1fr) repeat(3, minmax(29px, 36px)) minmax(42px, 50px);
    }

    .admin-kpis {
        grid-template-columns: 1fr 1fr;
    }

    .analytics-bars {
        height: 180px;
        gap: 3px;
        overflow-x: auto;
    }

    .analytics-day span {
        font-size: .52rem;
    }

    .admin-shortcut {
        min-height: 34px;
        padding-inline: 9px;
        font-size: .68rem;
    }
}
