:root {
    --bg: #020914;
    --panel: rgba(5, 16, 31, 0.88);
    --panel-strong: rgba(4, 12, 24, 0.96);
    --border: rgba(94, 184, 255, 0.32);
    --border-bright: rgba(94, 184, 255, 0.72);
    --text: #f2f8ff;
    --muted: rgba(213, 231, 255, 0.72);
    --blue: #42aaff;
    --blue-dark: #0b3d87;
    --gold: #ffca58;
    --red: #ff5a4a;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; margin: 0; }
body {
    font-family: "Segoe UI", Arial, sans-serif;
    color: var(--text);
    background: var(--bg);
    overflow-x: hidden;
}

.app-background {
    position: fixed;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(0,6,14,.22), rgba(0,6,14,.92)),
        url("images/backgrounds/bundesliga-dashboard-main-bg.png") center/cover no-repeat;
    z-index: -1;
}

.container {
    width: min(96vw, 1880px);
    margin: 0 auto 36px;
}

.view { display: none; }
.view.active-view { display: block; }

.hidden { display: none !important; }

.login-box {
    width: min(480px, 92vw);
    margin: 12vh auto 0;
    padding: 32px;
    border-radius: 24px;
    border: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(6,18,34,.94), rgba(2,8,17,.98));
    box-shadow: 0 0 34px rgba(45,158,255,.20), inset 0 0 28px rgba(94,184,255,.05);
}

.login-box h1 {
    margin: 0 0 22px;
    font-size: 2rem;
    text-transform: uppercase;
    color: var(--blue);
    letter-spacing: .04em;
}

.login-tabs { display: flex; gap: 10px; margin-bottom: 18px; }
.login-tab {
    flex: 1;
    min-height: 40px;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: rgba(4,14,28,.9);
    color: var(--text);
    font-weight: 800;
    cursor: pointer;
}
.login-tab.active {
    border-color: var(--border-bright);
    background: linear-gradient(180deg, rgba(24,116,238,.98), rgba(9,48,118,.98));
}

.admin-input {
    width: 100%;
    min-height: 44px;
    margin-bottom: 12px;
    padding: 0 14px;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: rgba(3,12,24,.96);
    color: var(--text);
    font-weight: 700;
}

.btn-primary, .btn-secondary {
    min-height: 40px;
    border-radius: 12px;
    border: 1px solid var(--border-bright);
    background: linear-gradient(180deg, rgba(36,130,242,.98), rgba(9,57,139,.98));
    color: #fff;
    font-weight: 900;
    padding: 0 16px;
    cursor: pointer;
}

.btn-secondary {
    background: linear-gradient(180deg, rgba(8,35,70,.92), rgba(4,16,34,.96));
    border-color: var(--border);
}

.dashboard-desktop-shell {
    display: grid;
    grid-template-columns: clamp(240px, 18vw, 330px) minmax(580px, 1fr) clamp(250px, 18vw, 330px);
    gap: 22px;
    align-items: stretch;
    min-height: 78vh;
    border-radius: 28px;
    border: 2px solid rgba(89,184,255,.72);
    padding: 18px;
    background: rgba(2,8,17,.56);
    box-shadow: 0 0 36px rgba(57,160,255,.18), inset 0 0 24px rgba(115,203,255,.06);
}

.cockpit-panel, .results-main-panel, .results-side-panel, .placeholder-card, .table-card, .admin-card, .bundesliga-standings-card {
    border-radius: 20px;
    border: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(6,17,32,.92), rgba(3,10,19,.96));
    box-shadow: inset 0 0 18px rgba(84,176,255,.05), 0 12px 22px rgba(0,0,0,.22);
}

.cockpit-panel { padding: 18px; }
.panel-head { border-bottom: 1px solid rgba(133,206,255,.18); padding-bottom: 12px; margin-bottom: 14px; }
.panel-head h3 { margin: 0; font-size: 1.05rem; text-transform: uppercase; }
.panel-head span { display: block; color: var(--muted); font-size: .84rem; margin-top: 4px; }

.cockpit-card {
    padding: 13px 14px;
    border-radius: 14px;
    border: 1px solid rgba(94,184,255,.28);
    background: rgba(8,23,43,.72);
    margin-bottom: 10px;
}
.cockpit-card strong { display:block; }
.cockpit-card span { display:block; color: var(--muted); font-size:.82rem; margin-top:4px; }

.app-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    align-content: start;
}

.app-tile {
    position: relative;
    min-height: 158px;
    border-radius: 16px;
    border: 1px solid rgba(126,204,255,.34);
    color: #fff;
    text-align: left;
    padding: 28px;
    overflow: hidden;
    background: rgba(3,10,19,.88);
    cursor: pointer;
    box-shadow: inset 0 0 18px rgba(80,166,255,.04);
}

.app-tile::before {
    content:"";
    position:absolute;
    inset:0;
    background: linear-gradient(90deg, rgba(0,0,0,.76), rgba(0,0,0,.28)), var(--tile-bg, none);
    background-size: cover;
    background-position: center;
    transition: transform .2s ease;
    z-index:0;
}
.app-tile:hover::before { transform: scale(1.04); }
.app-tile > * { position: relative; z-index: 1; }
.app-tile h2 { margin:0 0 12px; font-size:1.55rem; line-height:1.02; }
.app-tile p { margin:0; color:rgba(255,255,255,.86); }
.app-tile > span { position:absolute; right:20px; top:50%; transform:translateY(-50%); font-size:1.7rem; color:#9dd8ff; }

.tile-tipps { --tile-bg: url("images/dashboard/dashboard-tippen-bg.png"); }
.tile-table { --tile-bg: url("images/dashboard/dashboard-spieltag-uebersicht-bg.png"); }
.tile-rangliste { --tile-bg: url("images/dashboard/dashboard-rangliste-bg.png"); }
.tile-ergebnisse { --tile-bg: url("images/dashboard/dashboard-ergebnisse-bg.png"); }
.tile-quiz { --tile-bg: url("images/dashboard/dashboard-quiz-bg.png"); }
.tile-preispool { --tile-bg: url("images/dashboard/dashboard-preispool-bg.png"); }
.tile-anleitung { --tile-bg: url("images/dashboard/dashboard-anleitung-bg.png"); }
.tile-kaffee { --tile-bg: url("images/dashboard/dashboard-kaffee-duell-bg.png"); }
.tile-admin { --tile-bg: url("images/dashboard/dashboard-admin-bg.png"); }

.view-title {
    margin: 0 0 20px;
    color: var(--blue);
    text-transform: uppercase;
    letter-spacing: .1em;
    font-size: 2rem;
    display: inline-block;
    border-bottom: 3px solid var(--blue);
    padding-bottom: 8px;
}

.results-page-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
    gap: 22px;
}

.results-main-panel { padding: 26px 30px; }
.results-side-panel { padding: 18px; min-height: 220px; }

.results-panel-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
}

.results-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(105px, 1fr));
    gap: 10px;
    min-width: min(520px, 58%);
}

.results-summary-card {
    border-radius: 14px;
    border: 1px solid rgba(122,203,255,.28);
    background: linear-gradient(180deg, rgba(8,22,40,.94), rgba(4,11,21,.96));
    padding: 12px 14px;
}
.results-summary-card span, .results-summary-card small { display:block; color:var(--muted); font-size:.74rem; }
.results-summary-card strong { display:block; color:#fff; font-size:1.45rem; margin:3px 0; }

.results-day-selector {
    border-radius: 16px;
    border: 1px solid rgba(119,198,255,.18);
    background: linear-gradient(180deg, rgba(6,17,32,.42), rgba(4,10,19,.34));
    padding: 14px;
    margin-bottom: 18px;
}
.results-day-selector-head {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin-bottom: 12px;
}
.results-day-selector-head > span { font-weight:900; }

.results-day-switcher {
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:4px;
    border-radius:12px;
    border:1px solid rgba(118,201,255,.2);
    background:rgba(4,13,26,.62);
}
.results-day-switcher strong { min-width:92px; text-align:center; font-size:.82rem; }

.results-switch-btn, .results-day-btn {
    border-radius: 9px;
    border: 1px solid rgba(112,198,255,.32);
    background: linear-gradient(180deg, rgba(8,32,61,.96), rgba(4,13,27,.98));
    color: #f4fbff;
    font-weight: 900;
    cursor: pointer;
}
.results-switch-btn { width:30px; height:28px; font-size:1.1rem; }
.results-switch-btn:disabled { opacity:.38; cursor:not-allowed; }

.results-matchday-grid {
    display:grid;
    grid-template-columns: repeat(17, minmax(28px, 1fr));
    gap:6px;
}
.results-day-btn {
    min-height:31px;
    color:rgba(218,237,255,.78);
}
.results-day-btn.is-season-current:not(.is-selected) {
    border-color: rgba(255,204,92,.72);
    background: linear-gradient(180deg, rgba(35,27,8,.72), rgba(7,14,25,.98));
}
.results-day-btn.is-selected {
    border-color: rgba(92,207,255,.98);
    background: linear-gradient(180deg, rgba(20,96,210,.98), rgba(7,38,103,.98));
    box-shadow: 0 0 0 1px rgba(209,246,255,.68) inset, 0 0 14px rgba(59,176,255,.42);
}
.results-day-btn.is-selected span {
    color:#fff;
    text-shadow: 0 0 7px rgba(255,255,255,.92), 0 0 14px rgba(74,184,255,.78);
}

.results-list { display:flex; flex-direction:column; gap:10px; }
.results-match-row {
    display:grid;
    grid-template-columns: 150px minmax(210px, 1fr) 120px minmax(210px, 1fr) 104px;
    align-items:center;
    gap:14px;
    min-height:72px;
    padding:12px 16px;
    border-radius:14px;
    border:1px solid rgba(126,204,255,.16);
    background: linear-gradient(180deg, rgba(8,20,38,.86), rgba(4,11,21,.90));
}
.results-kickoff strong, .results-kickoff span { display:block; color:var(--muted); font-size:.78rem; line-height:1.35; }
.results-team { display:flex; align-items:center; gap:12px; min-width:0; }
.results-team-away { flex-direction:row-reverse; text-align:right; }
.results-team strong { color:#fff; font-size:.98rem; overflow:hidden; text-overflow:ellipsis; }
.club-emblem-slot {
    width:34px;
    height:34px;
    min-width:34px;
    border-radius:50%;
    border:1px solid rgba(127,205,255,.34);
    background: radial-gradient(circle at 35% 30%, rgba(120,204,255,.2), rgba(6,18,33,.95));
}
.results-score { text-align:center; }
.results-score strong { display:block; font-size:1.8rem; line-height:1; }
.results-score span { display:block; color:rgba(200,224,250,.62); font-size:.78rem; margin-top:7px; }
.results-status { text-align:right; }
.results-status span {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:86px;
    min-height:28px;
    border-radius:8px;
    border:1px solid rgba(84,180,255,.32);
    color:#77caff;
    background:rgba(8,22,40,.72);
    font-size:.74rem;
    font-weight:900;
    text-transform:uppercase;
}

.results-side-title { font-weight:950; text-transform:uppercase; margin-bottom:14px; }
.results-topmatch-visual {
    height:120px;
    border-radius:16px;
    background: linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.55)), url("images/dashboard/dashboard-ergebnisse-bg.png") center/cover;
    border:1px solid rgba(126,204,255,.16);
    margin-bottom:14px;
}
.results-topmatch-line { display:flex; align-items:center; justify-content:space-between; gap:10px; font-weight:900; }
.results-topmatch-line span { font-size:1.4rem; }

.bundesliga-table-summary {
    display:grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap:14px;
    margin-bottom:18px;
}
.bundesliga-summary-box {
    border-radius:16px;
    border:1px solid rgba(127,205,255,.24);
    background:linear-gradient(180deg, rgba(8,22,40,.94), rgba(4,11,21,.96));
    padding:16px;
}
.bundesliga-summary-box span { display:block; color:var(--muted); font-size:.82rem; text-transform:uppercase; }
.bundesliga-summary-box strong { display:block; font-size:1.5rem; margin-top:8px; }

.bundesliga-standings-card { overflow:hidden; }
.bundesliga-standings-head {
    display:flex;
    justify-content:space-between;
    gap:16px;
    padding:20px 24px;
    border-bottom:1px solid rgba(128,204,255,.16);
}
.bundesliga-standings-head h3 { margin:0; text-transform:uppercase; }
.bundesliga-standings-head span { color:var(--muted); }
.bundesliga-standings-table-wrap { overflow-x:auto; }
.bundesliga-standings-table { width:100%; min-width:1040px; border-collapse:collapse; }
.bundesliga-standings-table th, .bundesliga-standings-table td {
    padding:12px;
    text-align:center;
    border-bottom:1px solid rgba(130,205,255,.1);
}
.bundesliga-standings-table th {
    background:rgba(10,23,42,.95);
    color:rgba(213,231,255,.84);
    font-size:.82rem;
    text-transform:uppercase;
}
.club-cell { display:flex; align-items:center; gap:12px; text-align:left; }
.club-name { font-weight:800; }
.points-cell { font-weight:950; }

.table-legend { display:flex; flex-wrap:wrap; gap:14px; padding:16px 20px; color:var(--muted); font-size:.84rem; }
.legend { display:inline-block; width:12px; height:12px; border-radius:3px; margin-right:6px; vertical-align:-1px; }
.legend.cl { background:#3aa8ff; } .legend.el { background:#19d6c4; } .legend.col { background:#9d79ff; } .legend.rel { background:#ffad38; } .legend.down { background:#ff594d; }

.placeholder-card, .table-card, .admin-card {
    padding:24px;
    margin-bottom:18px;
}
.placeholder-card h3, .admin-card h3 { margin-top:0; }
.placeholder-card p, .admin-card p { color:var(--muted); }

.simple-table { width:100%; border-collapse:collapse; }
.simple-table th, .simple-table td { padding:12px; border-bottom:1px solid rgba(126,204,255,.14); text-align:left; }

.admin-grid { display:grid; grid-template-columns: 1fr 1fr; gap:20px; }
.dashboard-sorter { display:flex; flex-direction:column; gap:8px; margin:12px 0 18px; }
.sort-row {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:10px 12px;
    border-radius:12px;
    border:1px solid rgba(126,204,255,.2);
    background:rgba(7,20,38,.72);
}
.sort-actions { display:flex; gap:6px; }
.sort-actions button {
    width:32px;
    height:28px;
    border-radius:8px;
    border:1px solid rgba(112,198,255,.28);
    background:rgba(4,13,27,.98);
    color:#fff;
    cursor:pointer;
}

.modal {
    position:fixed;
    inset:0;
    z-index:100;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(0,0,0,.65);
}
.modal-content {
    width:min(420px, 92vw);
    border-radius:20px;
    border:1px solid var(--border);
    background:linear-gradient(180deg, rgba(6,18,34,.98), rgba(2,8,17,1));
    padding:24px;
}

@media (max-width: 1180px) {
    .dashboard-desktop-shell { grid-template-columns:1fr; }
    .results-page-layout { grid-template-columns:1fr; }
    .results-panel-head { flex-direction:column; }
    .results-summary-grid { min-width:0; width:100%; }
    .app-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .admin-grid { grid-template-columns:1fr; }
}
@media (max-width: 760px) {
    .container { width: 94vw; }
    .app-grid { grid-template-columns:1fr; }
    .results-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .results-matchday-grid { grid-template-columns: repeat(7, minmax(28px, 1fr)); }
    .results-match-row { grid-template-columns:1fr; text-align:left; }
    .results-team-away { flex-direction:row; text-align:left; }
    .results-status { text-align:left; }
    .bundesliga-table-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}


/* Step 32 - Login speichern + Refresh-Sitzung */
.remember-login-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 2px 0 16px;
    color: rgba(224, 240, 255, 0.86);
    font-size: 0.9rem;
    font-weight: 800;
    cursor: pointer;
    user-select: none;
}

.remember-login-row input {
    appearance: none;
    width: 18px;
    height: 18px;
    min-width: 18px;
    border-radius: 6px;
    border: 1px solid rgba(116, 198, 255, 0.46);
    background: linear-gradient(180deg, rgba(8, 21, 39, 0.96), rgba(4, 12, 24, 0.96));
    box-shadow: inset 0 0 10px rgba(80, 166, 255, 0.05);
}

.remember-login-row input:checked {
    border-color: rgba(92, 207, 255, 0.96);
    background:
        radial-gradient(circle at center, rgba(92, 207, 255, 0.96) 0 35%, transparent 38%),
        linear-gradient(180deg, rgba(20, 96, 210, 0.98), rgba(7, 38, 103, 0.98));
    box-shadow: 0 0 12px rgba(59, 176, 255, 0.34);
}


/* Step 33 - Ergebnisse stabil finalisieren */
.results-day-btn,
.results-day-btn:focus,
.results-day-btn:focus-visible,
.results-day-btn:active {
    outline: none;
    box-shadow: none;
}

.results-day-btn span {
    pointer-events: none;
}

.results-day-btn.is-selected {
    border-color: rgba(92, 207, 255, 0.98);
    background: linear-gradient(180deg, rgba(20, 96, 210, 0.98), rgba(7, 38, 103, 0.98));
    box-shadow: 0 0 0 1px rgba(209, 246, 255, 0.68) inset, 0 0 14px rgba(59, 176, 255, 0.42);
}

.results-day-btn.is-selected span {
    color: #ffffff;
    text-shadow: 0 0 7px rgba(255, 255, 255, 0.92), 0 0 14px rgba(74, 184, 255, 0.78);
}

.results-day-btn.is-season-current:not(.is-selected) {
    border-color: rgba(255, 204, 92, 0.72);
    background: linear-gradient(180deg, rgba(35, 27, 8, 0.72), rgba(7, 14, 25, 0.98));
    box-shadow: inset 0 0 0 1px rgba(255, 190, 72, 0.18), 0 0 9px rgba(255, 166, 45, 0.16);
}

.results-day-btn:hover:not(.is-selected) {
    border-color: rgba(143, 218, 255, 0.58);
    background: linear-gradient(180deg, rgba(10, 28, 52, 0.98), rgba(5, 15, 30, 0.98));
}

.results-switch-btn:hover:not(:disabled) {
    border-color: rgba(143, 218, 255, 0.78);
    box-shadow: 0 0 10px rgba(67, 171, 255, 0.2);
}

.results-list:empty::after {
    content: "Für diesen Spieltag sind noch keine Begegnungen geladen.";
    display: block;
    padding: 18px;
    color: rgba(213, 231, 255, 0.72);
    border-radius: 14px;
    border: 1px solid rgba(126, 204, 255, 0.16);
    background: linear-gradient(180deg, rgba(8,20,38,.72), rgba(4,11,21,.82));
}


/* Step 34 - Bundesliga-Tabelle: leuchtende Platzbereiche + Legende */
.bundesliga-standings-table tbody tr {
    position: relative;
}

.bundesliga-standings-table tbody tr::before {
    content: "";
    display: table-cell;
    width: 6px;
    min-width: 6px;
    padding: 0;
    border-bottom: 1px solid rgba(130,205,255,.1);
    background: transparent;
    box-shadow: none;
}

.bundesliga-standings-table thead tr::before {
    content: "";
    display: table-cell;
    width: 6px;
    min-width: 6px;
    padding: 0;
    background: rgba(10,23,42,.95);
    border-bottom: 1px solid rgba(130,205,255,.1);
}

.bundesliga-standings-table tbody tr.zone-cl::before {
    background: linear-gradient(180deg, rgba(58,168,255,.98), rgba(17,82,178,.92));
    box-shadow: 0 0 12px rgba(58,168,255,.78), inset 0 0 8px rgba(255,255,255,.24);
}

.bundesliga-standings-table tbody tr.zone-el::before {
    background: linear-gradient(180deg, rgba(25,214,196,.98), rgba(10,118,122,.92));
    box-shadow: 0 0 12px rgba(25,214,196,.78), inset 0 0 8px rgba(255,255,255,.24);
}

.bundesliga-standings-table tbody tr.zone-col::before {
    background: linear-gradient(180deg, rgba(157,121,255,.98), rgba(82,52,185,.92));
    box-shadow: 0 0 12px rgba(157,121,255,.82), inset 0 0 8px rgba(255,255,255,.24);
}

.bundesliga-standings-table tbody tr.zone-rel::before {
    background: linear-gradient(180deg, rgba(255,173,56,.98), rgba(188,93,14,.92));
    box-shadow: 0 0 12px rgba(255,173,56,.84), inset 0 0 8px rgba(255,255,255,.24);
}

.bundesliga-standings-table tbody tr.zone-down::before {
    background: linear-gradient(180deg, rgba(255,89,77,.98), rgba(184,31,35,.92));
    box-shadow: 0 0 12px rgba(255,89,77,.84), inset 0 0 8px rgba(255,255,255,.24);
}

.bundesliga-standings-table tbody tr.zone-cl {
    background: linear-gradient(90deg, rgba(58,168,255,.18), rgba(5,16,31,0) 38%);
}

.bundesliga-standings-table tbody tr.zone-el {
    background: linear-gradient(90deg, rgba(25,214,196,.16), rgba(5,16,31,0) 38%);
}

.bundesliga-standings-table tbody tr.zone-col {
    background: linear-gradient(90deg, rgba(157,121,255,.16), rgba(5,16,31,0) 38%);
}

.bundesliga-standings-table tbody tr.zone-rel {
    background: linear-gradient(90deg, rgba(255,173,56,.17), rgba(5,16,31,0) 38%);
}

.bundesliga-standings-table tbody tr.zone-down {
    background: linear-gradient(90deg, rgba(255,89,77,.18), rgba(5,16,31,0) 38%);
}

.bundesliga-standings-table tbody tr.zone-cl .position-cell span,
.bundesliga-standings-table tbody tr.zone-el .position-cell span,
.bundesliga-standings-table tbody tr.zone-col .position-cell span,
.bundesliga-standings-table tbody tr.zone-rel .position-cell span,
.bundesliga-standings-table tbody tr.zone-down .position-cell span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    height: 30px;
    border-radius: 10px;
    font-weight: 950;
    color: #fff;
}

.bundesliga-standings-table tbody tr.zone-cl .position-cell span {
    background: rgba(58,168,255,.22);
    box-shadow: 0 0 14px rgba(58,168,255,.62), inset 0 0 0 1px rgba(132,213,255,.56);
}

.bundesliga-standings-table tbody tr.zone-el .position-cell span {
    background: rgba(25,214,196,.20);
    box-shadow: 0 0 14px rgba(25,214,196,.62), inset 0 0 0 1px rgba(99,245,232,.50);
}

.bundesliga-standings-table tbody tr.zone-col .position-cell span {
    background: rgba(157,121,255,.22);
    box-shadow: 0 0 14px rgba(157,121,255,.64), inset 0 0 0 1px rgba(198,176,255,.52);
}

.bundesliga-standings-table tbody tr.zone-rel .position-cell span {
    background: rgba(255,173,56,.22);
    box-shadow: 0 0 14px rgba(255,173,56,.64), inset 0 0 0 1px rgba(255,211,126,.52);
}

.bundesliga-standings-table tbody tr.zone-down .position-cell span {
    background: rgba(255,89,77,.22);
    box-shadow: 0 0 14px rgba(255,89,77,.64), inset 0 0 0 1px rgba(255,154,148,.52);
}

.table-legend {
    position: relative;
    align-items: center;
    border-top: 1px solid rgba(126,204,255,.16);
    background: linear-gradient(180deg, rgba(4,12,24,.72), rgba(2,8,17,.86));
}

.table-legend::before {
    content: "";
    position: absolute;
    left: 20px;
    right: 20px;
    top: 0;
    height: 2px;
    background: linear-gradient(90deg,
        rgba(58,168,255,.96) 0 24%,
        rgba(25,214,196,.96) 24% 42%,
        rgba(157,121,255,.96) 42% 58%,
        rgba(255,173,56,.96) 58% 75%,
        rgba(255,89,77,.96) 75% 100%
    );
    box-shadow:
        0 0 10px rgba(58,168,255,.60),
        0 0 14px rgba(25,214,196,.42),
        0 0 14px rgba(157,121,255,.42),
        0 0 14px rgba(255,173,56,.38),
        0 0 14px rgba(255,89,77,.38);
}

.legend-item {
    min-height: 30px;
    padding: 6px 10px;
    border-radius: 10px;
    border: 1px solid rgba(126,204,255,.12);
    background: rgba(5,16,31,.58);
}

.legend {
    box-shadow: 0 0 10px currentColor;
}

.legend-item-cl { border-color: rgba(58,168,255,.34); box-shadow: inset 0 0 12px rgba(58,168,255,.06); }
.legend-item-el { border-color: rgba(25,214,196,.34); box-shadow: inset 0 0 12px rgba(25,214,196,.06); }
.legend-item-col { border-color: rgba(157,121,255,.34); box-shadow: inset 0 0 12px rgba(157,121,255,.06); }
.legend-item-rel { border-color: rgba(255,173,56,.34); box-shadow: inset 0 0 12px rgba(255,173,56,.06); }
.legend-item-down { border-color: rgba(255,89,77,.34); box-shadow: inset 0 0 12px rgba(255,89,77,.06); }


/* Step 35 - Admin kategorisiert + Ergebnisquellen-Modell */
.admin-category-shell {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);
    gap: 20px;
    align-items: start;
}

.admin-category-nav {
    position: sticky;
    top: 18px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px;
    border-radius: 18px;
    border: 1px solid rgba(126,204,255,.24);
    background: linear-gradient(180deg, rgba(6,17,32,.92), rgba(3,10,19,.96));
    box-shadow: inset 0 0 18px rgba(84,176,255,.05), 0 12px 22px rgba(0,0,0,.22);
}

.admin-category-btn {
    min-height: 44px;
    border-radius: 13px;
    border: 1px solid rgba(112,198,255,.26);
    background: linear-gradient(180deg, rgba(8,32,61,.88), rgba(4,13,27,.94));
    color: rgba(231,244,255,.82);
    font-weight: 950;
    text-align: left;
    padding: 0 14px;
    cursor: pointer;
}

.admin-category-btn.active {
    color: #fff;
    border-color: rgba(92,207,255,.96);
    background: linear-gradient(180deg, rgba(20,96,210,.98), rgba(7,38,103,.98));
    box-shadow: 0 0 0 1px rgba(209,246,255,.38) inset, 0 0 14px rgba(59,176,255,.32);
}

.admin-category-panel {
    display: none;
}

.admin-category-panel.active {
    display: block;
}

.admin-section-head {
    margin-bottom: 16px;
    padding: 18px 20px;
    border-radius: 18px;
    border: 1px solid rgba(126,204,255,.22);
    background: linear-gradient(180deg, rgba(6,17,32,.88), rgba(3,10,19,.94));
}

.admin-section-head h3 {
    margin: 0;
    color: var(--blue);
    text-transform: uppercase;
    letter-spacing: .08em;
}

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

.admin-status-card {
    min-height: 116px;
    padding: 16px;
    border-radius: 18px;
    border: 1px solid rgba(126,204,255,.20);
    background: linear-gradient(180deg, rgba(8,22,40,.94), rgba(4,11,21,.96));
    box-shadow: inset 0 0 18px rgba(84,176,255,.04);
}

.admin-status-card span {
    display: block;
    color: var(--muted);
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-weight: 900;
}

.admin-status-card strong {
    display: block;
    margin: 8px 0 5px;
    font-size: 2rem;
    color: #fff;
}

.admin-status-card small {
    display: block;
    color: rgba(213,231,255,.62);
    font-size: .78rem;
}

.admin-status-card.status-admin {
    border-color: rgba(255,173,56,.38);
    box-shadow: inset 0 0 18px rgba(255,173,56,.06), 0 0 14px rgba(255,173,56,.10);
}

.admin-status-card.status-api {
    border-color: rgba(25,214,196,.38);
    box-shadow: inset 0 0 18px rgba(25,214,196,.06), 0 0 14px rgba(25,214,196,.10);
}

.admin-status-card.status-open {
    border-color: rgba(126,204,255,.26);
}

.admin-status-card.status-total {
    border-color: rgba(92,207,255,.42);
    box-shadow: inset 0 0 18px rgba(92,207,255,.06), 0 0 14px rgba(92,207,255,.12);
}

.admin-priority-flow {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin: 12px 0 14px;
}

.priority-pill {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 13px;
    border-radius: 999px;
    font-weight: 950;
    border: 1px solid rgba(126,204,255,.20);
}

.priority-admin {
    color: #ffdba1;
    border-color: rgba(255,173,56,.44);
    background: rgba(255,173,56,.12);
    box-shadow: 0 0 12px rgba(255,173,56,.14);
}

.priority-api {
    color: #a5fff5;
    border-color: rgba(25,214,196,.44);
    background: rgba(25,214,196,.10);
    box-shadow: 0 0 12px rgba(25,214,196,.13);
}

.priority-open {
    color: rgba(224,240,255,.82);
    background: rgba(126,204,255,.08);
}

.priority-arrow {
    color: rgba(191,224,255,.72);
    font-size: 1.5rem;
    font-weight: 950;
}

.admin-muted {
    color: var(--muted);
}

.results-status .result-source-admin {
    border-color: rgba(255,173,56,.44);
    color: #ffdba1;
    background: rgba(255,173,56,.10);
    box-shadow: 0 0 10px rgba(255,173,56,.14);
}

.results-status .result-source-api {
    border-color: rgba(25,214,196,.44);
    color: #a5fff5;
    background: rgba(25,214,196,.10);
    box-shadow: 0 0 10px rgba(25,214,196,.13);
}

.results-status .result-source-open {
    border-color: rgba(84,180,255,.32);
    color: #77caff;
    background: rgba(8,22,40,.72);
}

@media (max-width: 980px) {
    .admin-category-shell {
        grid-template-columns: 1fr;
    }

    .admin-category-nav {
        position: static;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .admin-category-btn {
        flex: 1 1 150px;
        text-align: center;
    }

    .admin-status-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .admin-status-grid {
        grid-template-columns: 1fr;
    }
}


/* Step 36 - Admin Ergebnispflege */
.admin-results-editor-card {
    overflow: hidden;
}

.admin-results-editor-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 16px;
}

.admin-results-editor-head h3 {
    margin-bottom: 6px;
}

.admin-results-editor-head p {
    margin: 0;
    color: var(--muted);
}

.admin-results-day-switcher {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 4px;
    border-radius: 12px;
    border: 1px solid rgba(118,201,255,.2);
    background: rgba(4,13,26,.62);
}

.admin-results-day-switcher strong {
    min-width: 92px;
    text-align: center;
    font-size: .82rem;
}

.admin-results-day-grid {
    display: grid;
    grid-template-columns: repeat(17, minmax(28px, 1fr));
    gap: 6px;
    margin: 16px 0 18px;
}

.admin-results-day-btn {
    position: relative;
    min-height: 31px;
    border-radius: 9px;
    border: 1px solid rgba(112,198,255,.30);
    background: linear-gradient(180deg, rgba(8,32,61,.88), rgba(4,13,27,.94));
    color: rgba(218,237,255,.78);
    font-weight: 950;
    cursor: pointer;
}

.admin-results-day-btn.is-selected {
    border-color: rgba(92,207,255,.98);
    background: linear-gradient(180deg, rgba(20,96,210,.98), rgba(7,38,103,.98));
    box-shadow: 0 0 0 1px rgba(209,246,255,.54) inset, 0 0 14px rgba(59,176,255,.36);
    color: #fff;
}

.admin-results-day-btn.is-season-current:not(.is-selected) {
    border-color: rgba(255,204,92,.72);
    background: linear-gradient(180deg, rgba(35,27,8,.72), rgba(7,14,25,.98));
}

.admin-results-day-btn.has-admin-result:not(.is-selected) {
    border-color: rgba(255,173,56,.64);
    box-shadow: 0 0 9px rgba(255,173,56,.18);
}

.admin-results-day-btn em {
    position: absolute;
    right: 3px;
    top: 3px;
    min-width: 14px;
    height: 14px;
    border-radius: 999px;
    background: rgba(255,173,56,.95);
    color: #07101f;
    font-size: .58rem;
    font-style: normal;
    line-height: 14px;
    text-align: center;
    box-shadow: 0 0 8px rgba(255,173,56,.7);
}

.admin-results-editor-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.admin-result-row {
    display: grid;
    grid-template-columns: 94px minmax(180px, 1fr) 116px minmax(180px, 1fr) 150px 78px;
    align-items: center;
    gap: 12px;
    min-height: 66px;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(126,204,255,.16);
    background: linear-gradient(180deg, rgba(8,20,38,.86), rgba(4,11,21,.90));
}

.admin-result-meta strong,
.admin-result-meta span {
    display: block;
}

.admin-result-meta strong {
    color: #fff;
    font-size: 1rem;
}

.admin-result-meta span {
    color: var(--muted);
    font-size: .76rem;
    margin-top: 3px;
}

.admin-result-team {
    font-weight: 900;
    color: #fff;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-result-away {
    text-align: right;
}

.admin-result-inputs {
    display: grid;
    grid-template-columns: 1fr 14px 1fr;
    align-items: center;
    gap: 6px;
}

.admin-result-inputs span {
    text-align: center;
    color: rgba(230,245,255,.74);
    font-weight: 950;
}

.admin-goal-input {
    width: 100%;
    height: 36px;
    border-radius: 10px;
    border: 1px solid rgba(116,198,255,.34);
    background: rgba(3,12,24,.96);
    color: #fff;
    text-align: center;
    font-weight: 950;
    font-size: 1rem;
    outline: none;
}

.admin-goal-input:focus {
    border-color: rgba(92,207,255,.92);
    box-shadow: 0 0 12px rgba(59,176,255,.22);
}

.admin-result-source span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 92px;
    min-height: 27px;
    padding: 0 8px;
    border-radius: 9px;
    font-size: .72rem;
    font-weight: 950;
    border: 1px solid rgba(84,180,255,.32);
}

.admin-result-source small {
    display: block;
    margin-top: 5px;
    color: rgba(213,231,255,.58);
    font-size: .68rem;
}

.source-admin {
    color: #ffdba1;
    border-color: rgba(255,173,56,.44) !important;
    background: rgba(255,173,56,.10);
    box-shadow: 0 0 10px rgba(255,173,56,.14);
}

.source-api {
    color: #a5fff5;
    border-color: rgba(25,214,196,.44) !important;
    background: rgba(25,214,196,.10);
    box-shadow: 0 0 10px rgba(25,214,196,.13);
}

.source-open {
    color: #77caff;
    background: rgba(8,22,40,.72);
}

.admin-result-clear-btn {
    min-height: 32px;
    border-radius: 10px;
    border: 1px solid rgba(255,89,77,.34);
    background: rgba(255,89,77,.10);
    color: #ffb3ad;
    font-weight: 900;
    cursor: pointer;
}

.admin-result-clear-btn:hover {
    border-color: rgba(255,89,77,.72);
    box-shadow: 0 0 12px rgba(255,89,77,.18);
}

.admin-results-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(126,204,255,.14);
}

@media (max-width: 1180px) {
    .admin-result-row {
        grid-template-columns: 72px minmax(150px, 1fr) 112px minmax(150px, 1fr);
    }

    .admin-result-source,
    .admin-result-clear-btn {
        grid-column: auto;
    }
}

@media (max-width: 820px) {
    .admin-results-editor-head {
        flex-direction: column;
    }

    .admin-results-day-grid {
        grid-template-columns: repeat(7, minmax(28px, 1fr));
    }

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

    .admin-result-away {
        text-align: left;
    }

    .admin-result-inputs {
        max-width: 180px;
    }
}


/* Step 37 - Tippabgabe mit Löschen/Neu eintragen bis 15 Minuten vor Spielbeginn */
.betting-page-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
    gap: 22px;
}

.betting-main-panel,
.betting-side-panel {
    border-radius: 20px;
    border: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(6,17,32,.92), rgba(3,10,19,.96));
    box-shadow: inset 0 0 18px rgba(84,176,255,.05), 0 12px 22px rgba(0,0,0,.22);
}

.betting-main-panel {
    padding: 24px;
}

.betting-side-panel {
    padding: 18px;
}

.betting-panel-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 16px;
}

.betting-panel-head h3,
.betting-info-card h3 {
    margin: 0 0 7px;
    text-transform: uppercase;
    color: var(--blue);
    letter-spacing: .06em;
}

.betting-panel-head p,
.betting-info-card p {
    margin: 0;
    color: var(--muted);
}

.betting-day-switcher {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 4px;
    border-radius: 12px;
    border: 1px solid rgba(118,201,255,.2);
    background: rgba(4,13,26,.62);
}

.betting-day-switcher strong {
    min-width: 92px;
    text-align: center;
    font-size: .82rem;
}

.betting-day-grid {
    display: grid;
    grid-template-columns: repeat(17, minmax(28px, 1fr));
    gap: 6px;
    margin: 16px 0 18px;
}

.betting-day-btn {
    position: relative;
    min-height: 31px;
    border-radius: 9px;
    border: 1px solid rgba(112,198,255,.30);
    background: linear-gradient(180deg, rgba(8,32,61,.88), rgba(4,13,27,.94));
    color: rgba(218,237,255,.78);
    font-weight: 950;
    cursor: pointer;
}

.betting-day-btn.is-selected {
    border-color: rgba(92,207,255,.98);
    background: linear-gradient(180deg, rgba(20,96,210,.98), rgba(7,38,103,.98));
    box-shadow: 0 0 0 1px rgba(209,246,255,.54) inset, 0 0 14px rgba(59,176,255,.36);
    color: #fff;
}

.betting-day-btn.is-season-current:not(.is-selected) {
    border-color: rgba(255,204,92,.72);
    background: linear-gradient(180deg, rgba(35,27,8,.72), rgba(7,14,25,.98));
}

.betting-day-btn.has-bets:not(.is-selected) {
    border-color: rgba(25,214,196,.64);
    box-shadow: 0 0 9px rgba(25,214,196,.18);
}

.betting-day-btn em {
    position: absolute;
    right: 3px;
    top: 3px;
    min-width: 14px;
    height: 14px;
    border-radius: 999px;
    background: rgba(25,214,196,.95);
    color: #031017;
    font-size: .58rem;
    font-style: normal;
    line-height: 14px;
    text-align: center;
    box-shadow: 0 0 8px rgba(25,214,196,.7);
}

.betting-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.betting-match-row {
    display: grid;
    grid-template-columns: 94px minmax(180px, 1fr) 116px minmax(180px, 1fr) 170px 78px;
    align-items: center;
    gap: 12px;
    min-height: 66px;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(126,204,255,.16);
    background: linear-gradient(180deg, rgba(8,20,38,.86), rgba(4,11,21,.90));
}

.betting-match-row.has-saved-bet {
    border-color: rgba(25,214,196,.34);
    box-shadow: inset 0 0 18px rgba(25,214,196,.04);
}

.betting-match-row.is-locked {
    opacity: .78;
}

.betting-match-meta strong,
.betting-match-meta span {
    display: block;
}

.betting-match-meta strong {
    color: #fff;
    font-size: 1rem;
}

.betting-match-meta span {
    color: var(--muted);
    font-size: .76rem;
    margin-top: 3px;
}

.betting-team {
    font-weight: 900;
    color: #fff;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.betting-away {
    text-align: right;
}

.betting-inputs {
    display: grid;
    grid-template-columns: 1fr 14px 1fr;
    align-items: center;
    gap: 6px;
}

.betting-inputs span {
    text-align: center;
    color: rgba(230,245,255,.74);
    font-weight: 950;
}

.betting-goal-input {
    width: 100%;
    height: 36px;
    border-radius: 10px;
    border: 1px solid rgba(116,198,255,.34);
    background: rgba(3,12,24,.96);
    color: #fff;
    text-align: center;
    font-weight: 950;
    font-size: 1rem;
    outline: none;
}

.betting-goal-input:focus {
    border-color: rgba(92,207,255,.92);
    box-shadow: 0 0 12px rgba(59,176,255,.22);
}

.betting-goal-input:disabled {
    opacity: .6;
    cursor: not-allowed;
}

.betting-lock-status span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 82px;
    min-height: 27px;
    padding: 0 8px;
    border-radius: 9px;
    font-size: .72rem;
    font-weight: 950;
    border: 1px solid rgba(84,180,255,.32);
}

.betting-lock-status .open {
    color: #a5fff5;
    border-color: rgba(25,214,196,.44);
    background: rgba(25,214,196,.10);
    box-shadow: 0 0 10px rgba(25,214,196,.13);
}

.betting-lock-status .locked {
    color: #ffb3ad;
    border-color: rgba(255,89,77,.44);
    background: rgba(255,89,77,.10);
    box-shadow: 0 0 10px rgba(255,89,77,.14);
}

.betting-lock-status small {
    display: block;
    margin-top: 5px;
    color: rgba(213,231,255,.58);
    font-size: .68rem;
}

.betting-clear-btn {
    min-height: 32px;
    border-radius: 10px;
    border: 1px solid rgba(255,89,77,.34);
    background: rgba(255,89,77,.10);
    color: #ffb3ad;
    font-weight: 900;
    cursor: pointer;
}

.betting-clear-btn:hover {
    border-color: rgba(255,89,77,.72);
    box-shadow: 0 0 12px rgba(255,89,77,.18);
}

.betting-clear-btn:disabled {
    opacity: .45;
    cursor: not-allowed;
}

.betting-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(126,204,255,.14);
}

.betting-info-card {
    padding: 16px;
    border-radius: 16px;
    border: 1px solid rgba(126,204,255,.18);
    background: rgba(8,22,40,.56);
    margin-bottom: 14px;
}

.betting-summary-line {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 0;
    border-bottom: 1px solid rgba(126,204,255,.12);
}

.betting-summary-line:last-child {
    border-bottom: none;
}

.betting-summary-line span {
    color: var(--muted);
}

.betting-summary-line strong {
    color: #fff;
}

@media (max-width: 1180px) {
    .betting-page-layout {
        grid-template-columns: 1fr;
    }

    .betting-match-row {
        grid-template-columns: 72px minmax(150px, 1fr) 112px minmax(150px, 1fr);
    }
}

@media (max-width: 820px) {
    .betting-panel-head {
        flex-direction: column;
    }

    .betting-day-grid {
        grid-template-columns: repeat(7, minmax(28px, 1fr));
    }

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

    .betting-away {
        text-align: left;
    }

    .betting-inputs {
        max-width: 180px;
    }
}


/* Step 37b - Tipp pro Begegnung einzeln speichern */
.betting-row-actions {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.betting-save-btn,
.betting-clear-btn {
    min-height: 30px;
    border-radius: 10px;
    font-weight: 900;
    cursor: pointer;
}

.betting-save-btn {
    border: 1px solid rgba(25,214,196,.42);
    background: rgba(25,214,196,.10);
    color: #a5fff5;
    box-shadow: inset 0 0 10px rgba(25,214,196,.04);
}

.betting-save-btn:hover {
    border-color: rgba(25,214,196,.78);
    box-shadow: 0 0 12px rgba(25,214,196,.18);
}

.betting-save-btn:disabled,
.betting-clear-btn:disabled {
    opacity: .45;
    cursor: not-allowed;
}

@media (max-width: 820px) {
    .betting-row-actions {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .betting-save-btn,
    .betting-clear-btn {
        min-width: 110px;
    }
}


/* Step 38 - Punkteberechnung und Rangliste */
.ranking-summary-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}

.ranking-summary-card {
    border-radius: 16px;
    border: 1px solid rgba(127,205,255,.24);
    background: linear-gradient(180deg, rgba(8,22,40,.94), rgba(4,11,21,.96));
    padding: 16px;
    box-shadow: inset 0 0 18px rgba(84,176,255,.04);
}

.ranking-summary-card span {
    display: block;
    color: var(--muted);
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-weight: 900;
}

.ranking-summary-card strong {
    display: block;
    margin: 8px 0 4px;
    font-size: 1.45rem;
    color: #fff;
    min-height: 1.6em;
}

.ranking-summary-card small {
    display: block;
    color: rgba(213,231,255,.62);
    font-size: .78rem;
}

.ranking-page-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 320px);
    gap: 22px;
}

.ranking-main-card,
.ranking-side-card {
    border-radius: 20px;
    border: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(6,17,32,.92), rgba(3,10,19,.96));
    box-shadow: inset 0 0 18px rgba(84,176,255,.05), 0 12px 22px rgba(0,0,0,.22);
}

.ranking-main-card {
    overflow: hidden;
}

.ranking-side-card {
    padding: 18px;
    align-self: start;
}

.ranking-card-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 20px 24px;
    border-bottom: 1px solid rgba(128,204,255,.16);
}

.ranking-card-head h3,
.ranking-side-card h3 {
    margin: 0;
    color: var(--blue);
    text-transform: uppercase;
    letter-spacing: .08em;
}

.ranking-card-head span {
    color: var(--muted);
    font-weight: 800;
    font-size: .86rem;
}

.ranking-table-wrap {
    overflow-x: auto;
}

.ranking-table {
    width: 100%;
    min-width: 900px;
    border-collapse: collapse;
}

.ranking-table th,
.ranking-table td {
    padding: 13px 14px;
    text-align: center;
    border-bottom: 1px solid rgba(130,205,255,.10);
}

.ranking-table th {
    background: rgba(10,23,42,.95);
    color: rgba(213,231,255,.84);
    font-size: .82rem;
    text-transform: uppercase;
}

.ranking-table td:nth-child(2),
.ranking-table th:nth-child(2) {
    text-align: left;
}

.ranking-player {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ranking-player span {
    width: 34px;
    height: 34px;
    min-width: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1px solid rgba(127,205,255,.34);
    background: radial-gradient(circle at 35% 30%, rgba(120,204,255,.2), rgba(6,18,33,.95));
}

.ranking-player strong {
    color: #fff;
}

.ranking-position span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    border-radius: 10px;
    font-weight: 950;
    color: #fff;
    background: rgba(126,204,255,.10);
    border: 1px solid rgba(126,204,255,.20);
}

.ranking-points {
    font-size: 1.25rem;
    font-weight: 950;
    color: #fff;
}

.ranking-table tr.rank-one {
    background: linear-gradient(90deg, rgba(255,202,88,.18), rgba(5,16,31,0) 42%);
}

.ranking-table tr.rank-two {
    background: linear-gradient(90deg, rgba(180,213,235,.14), rgba(5,16,31,0) 42%);
}

.ranking-table tr.rank-three {
    background: linear-gradient(90deg, rgba(205,130,64,.15), rgba(5,16,31,0) 42%);
}

.ranking-table tr.rank-one .ranking-position span {
    background: rgba(255,202,88,.22);
    border-color: rgba(255,202,88,.54);
    box-shadow: 0 0 14px rgba(255,202,88,.64), inset 0 0 0 1px rgba(255,231,158,.45);
}

.ranking-table tr.rank-two .ranking-position span {
    background: rgba(180,213,235,.18);
    border-color: rgba(180,213,235,.50);
    box-shadow: 0 0 14px rgba(180,213,235,.46), inset 0 0 0 1px rgba(235,248,255,.34);
}

.ranking-table tr.rank-three .ranking-position span {
    background: rgba(205,130,64,.18);
    border-color: rgba(205,130,64,.48);
    box-shadow: 0 0 14px rgba(205,130,64,.46), inset 0 0 0 1px rgba(255,204,154,.34);
}

.ranking-rule-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px solid rgba(126,204,255,.12);
}

.ranking-rule-row:last-child {
    border-bottom: none;
}

.ranking-rule-row strong {
    width: 38px;
    height: 38px;
    border-radius: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: linear-gradient(180deg, rgba(20,96,210,.98), rgba(7,38,103,.98));
    box-shadow: 0 0 14px rgba(59,176,255,.28);
}

.ranking-rule-row span {
    color: var(--muted);
    font-weight: 800;
}

@media (max-width: 1180px) {
    .ranking-page-layout {
        grid-template-columns: 1fr;
    }

    .ranking-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .ranking-summary-grid {
        grid-template-columns: 1fr;
    }

    .ranking-card-head {
        flex-direction: column;
        align-items: flex-start;
    }
}


/* Step 39 - Admin Testkomfort */
.admin-test-card {
    border-color: rgba(92,207,255,.26);
}

.admin-test-overview {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 12px 0 2px;
}

.admin-test-box {
    min-height: 86px;
    padding: 13px 14px;
    border-radius: 15px;
    border: 1px solid rgba(126,204,255,.18);
    background: linear-gradient(180deg, rgba(8,22,40,.84), rgba(4,11,21,.92));
    box-shadow: inset 0 0 14px rgba(84,176,255,.04);
}

.admin-test-box span {
    display: block;
    color: var(--muted);
    font-size: .75rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.admin-test-box strong {
    display: block;
    margin-top: 8px;
    color: #fff;
    font-size: 1.55rem;
}

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

@media (max-width: 620px) {
    .admin-test-overview {
        grid-template-columns: 1fr;
    }
}


/* Step 40 - Admin Ergebnis pro Begegnung speichern */
.admin-result-row-actions {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.admin-result-save-btn,
.admin-result-clear-btn {
    min-height: 30px;
    border-radius: 10px;
    font-weight: 900;
    cursor: pointer;
}

.admin-result-save-btn {
    border: 1px solid rgba(25,214,196,.42);
    background: rgba(25,214,196,.10);
    color: #a5fff5;
    box-shadow: inset 0 0 10px rgba(25,214,196,.04);
}

.admin-result-save-btn:hover {
    border-color: rgba(25,214,196,.78);
    box-shadow: 0 0 12px rgba(25,214,196,.18);
}

@media (max-width: 820px) {
    .admin-result-row-actions {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .admin-result-save-btn,
    .admin-result-clear-btn {
        min-width: 110px;
    }
}


/* Step 41 - Tipp-Sperre bei Ergebnis + Letzte-5-Form in Rangliste */
.betting-match-row.is-locked {
    border-color: rgba(255,89,77,.24);
    background: linear-gradient(180deg, rgba(35,14,22,.62), rgba(4,11,21,.90));
}

.betting-lock-status .locked.result {
    color: #ffdba1;
    border-color: rgba(255,173,56,.48);
    background: rgba(255,173,56,.12);
    box-shadow: 0 0 10px rgba(255,173,56,.16);
}

.betting-lock-status .locked.time {
    color: #ffb3ad;
    border-color: rgba(255,89,77,.48);
    background: rgba(255,89,77,.12);
    box-shadow: 0 0 10px rgba(255,89,77,.16);
}

.recent-form-list {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 142px;
}

.recent-form-badge {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .72rem;
    font-weight: 950;
    color: #fff;
    border: 1px solid rgba(126,204,255,.22);
    background: rgba(8,22,40,.72);
}

.recent-form-badge.points-three {
    color: #07101f;
    border-color: rgba(255,202,88,.78);
    background: radial-gradient(circle at 35% 28%, #fff0a8, #ffca58 45%, #c97810 100%);
    box-shadow: 0 0 12px rgba(255,202,88,.62), inset 0 0 6px rgba(255,255,255,.38);
}

.recent-form-badge.points-one {
    border-color: rgba(92,207,255,.78);
    background: radial-gradient(circle at 35% 28%, #aeeaff, #42aaff 48%, #14549e 100%);
    box-shadow: 0 0 12px rgba(92,207,255,.58), inset 0 0 6px rgba(255,255,255,.30);
}

.recent-form-badge.points-zero {
    border-color: rgba(255,89,77,.78);
    background: radial-gradient(circle at 35% 28%, #ffb2ab, #ff594d 48%, #9f1e25 100%);
    box-shadow: 0 0 12px rgba(255,89,77,.58), inset 0 0 6px rgba(255,255,255,.28);
}

.recent-form-badge.empty {
    color: rgba(213,231,255,.42);
    border-color: rgba(126,204,255,.14);
    background: rgba(8,22,40,.42);
    box-shadow: none;
}

.ranking-table td:nth-child(6),
.ranking-table th:nth-child(6) {
    text-align: center;
}


/* Step 45 - API/D1 Status im Admin-Systembereich */
.api-status-card {
    border-color: rgba(92,207,255,.28);
}

.api-status-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 14px;
}

.api-status-head h3 {
    margin-bottom: 6px;
}

.api-status-head p {
    margin: 0;
    color: var(--muted);
}

.api-status-pill {
    min-height: 30px;
    min-width: 104px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid rgba(126,204,255,.26);
    background: rgba(8,22,40,.72);
    color: rgba(224,240,255,.78);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.api-status-pill.is-loading {
    border-color: rgba(92,207,255,.58);
    color: #dff6ff;
    box-shadow: 0 0 12px rgba(92,207,255,.18);
}

.api-status-pill.is-online {
    border-color: rgba(25,214,196,.58);
    color: #a5fff5;
    background: rgba(25,214,196,.10);
    box-shadow: 0 0 12px rgba(25,214,196,.20);
}

.api-status-pill.is-offline {
    border-color: rgba(255,89,77,.58);
    color: #ffb3ad;
    background: rgba(255,89,77,.10);
    box-shadow: 0 0 12px rgba(255,89,77,.18);
}

.api-status-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 12px 0 14px;
}

.api-status-box {
    min-height: 84px;
    padding: 13px 14px;
    border-radius: 15px;
    border: 1px solid rgba(126,204,255,.18);
    background: linear-gradient(180deg, rgba(8,22,40,.84), rgba(4,11,21,.92));
    box-shadow: inset 0 0 14px rgba(84,176,255,.04);
}

.api-status-box span {
    display: block;
    color: var(--muted);
    font-size: .75rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.api-status-box strong {
    display: block;
    margin-top: 8px;
    color: #fff;
    font-size: 1.35rem;
}

.api-status-output {
    min-height: 42px;
    padding: 12px 14px;
    border-radius: 13px;
    border: 1px solid rgba(126,204,255,.16);
    background: rgba(4,13,26,.62);
    color: rgba(224,240,255,.78);
    font-size: .86rem;
    font-weight: 750;
}

@media (max-width: 720px) {
    .api-status-head {
        flex-direction: column;
    }

    .api-status-grid {
        grid-template-columns: 1fr;
    }
}



/* Step 54 - Benutzerverwaltung Feinschliff */
.admin-users-card {
    overflow: hidden;
}

.admin-users-head {
    align-items: center;
}

.admin-users-head-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}

.admin-users-search-wrap {
    min-width: min(360px, 35vw);
}

.admin-users-search-input {
    width: 100%;
    min-height: 40px;
    border-radius: 13px;
    border: 1px solid rgba(74,169,255,.38);
    background: linear-gradient(180deg, rgba(5,16,31,.86), rgba(3,10,20,.94));
    color: #f5fbff;
    padding: 0 15px;
    font: inherit;
    font-weight: 850;
    outline: none;
    box-shadow: inset 0 0 18px rgba(60,144,255,.06);
}

.admin-users-search-input::placeholder {
    color: rgba(218,232,255,.52);
}

.admin-users-search-input:focus {
    border-color: rgba(78,183,255,.78);
    box-shadow: 0 0 0 3px rgba(51,144,255,.14), inset 0 0 18px rgba(60,144,255,.08);
}

.admin-users-collapse-btn {
    width: 44px;
    min-width: 44px;
    height: 40px;
    padding: 0;
    font-size: 1.15rem;
    line-height: 1;
}

.admin-users-content[hidden] {
    display: none !important;
}

.admin-users-card.is-collapsed {
    padding-bottom: 16px;
}

.admin-user-form-card {
    display: grid;
    grid-template-columns: minmax(78px, 100px) minmax(260px, 1.15fr) minmax(260px, 1.15fr) minmax(170px, .8fr) minmax(150px, auto);
    gap: 12px;
    align-items: center;
    margin: 14px 0 16px;
    padding: 14px;
    border: 1px solid rgba(74,169,255,.25);
    border-radius: 18px;
    background:
        radial-gradient(circle at 12% 0%, rgba(42,132,255,.11), transparent 38%),
        linear-gradient(180deg, rgba(6,18,34,.88), rgba(3,10,20,.94));
    box-shadow: inset 0 0 20px rgba(60,144,255,.05);
}

.admin-user-form-badge strong,
.admin-user-form-badge span,
.admin-user-field small,
.admin-user-role small,
.admin-user-main small,
.admin-user-stat small {
    display: block;
}

.admin-user-form-badge strong {
    color: #ffffff;
    font-weight: 950;
    font-size: .96rem;
}

.admin-user-form-badge span,
.admin-user-field small,
.admin-user-role small,
.admin-user-main small,
.admin-user-stat small {
    margin-top: 4px;
    color: rgba(199,214,236,.74);
    font-size: .72rem;
    font-weight: 800;
}

.admin-user-field .admin-goal-input {
    width: 100%;
    min-width: 0;
    text-align: left;
    padding: 0 14px;
}
.admin-user-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    min-width: 0;
}

.admin-user-admin-toggle {
    margin: 0;
    white-space: nowrap;
}

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

.admin-user-list-row {
    display: grid;
    grid-template-columns: 54px minmax(220px, 1.5fr) minmax(80px, .45fr) minmax(95px, .45fr) minmax(80px, .45fr) minmax(120px, .65fr) minmax(110px, auto);
    gap: 12px;
    align-items: center;
    padding: 13px 14px;
    border: 1px solid rgba(74,169,255,.22);
    border-radius: 17px;
    background:
        linear-gradient(90deg, rgba(8,25,45,.92), rgba(5,15,29,.92)),
        radial-gradient(circle at 0% 0%, rgba(57,145,255,.10), transparent 45%);
}

.admin-user-avatar {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(83,174,255,.38);
    background: rgba(6,18,35,.86);
    font-size: 1.25rem;
    box-shadow: inset 0 0 16px rgba(66,152,255,.10);
}

.admin-user-main strong,
.admin-user-stat strong {
    color: #ffffff;
    font-weight: 950;
}

.admin-user-stat {
    text-align: center;
}

.admin-user-role {
    text-align: center;
}

.admin-user-row-actions {
    display: flex;
    justify-content: flex-end;
}

@media (max-width: 1200px) {
    .admin-user-form-card {
        grid-template-columns: minmax(80px, .6fr) minmax(190px, 1fr) minmax(190px, 1fr);
    }

    .admin-user-field-pin,
    .admin-user-actions {
        grid-column: span 2;
    }

    .admin-user-list-row {
        grid-template-columns: 54px minmax(200px, 1fr) repeat(3, minmax(70px, .35fr));
    }

    .admin-user-role,
    .admin-user-row-actions {
        grid-column: span 2;
    }
}

@media (max-width: 820px) {
    .admin-users-head {
        align-items: stretch;
    }

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

    .admin-users-search-wrap {
        width: 100%;
        min-width: 100%;
    }

    .admin-user-form-card,
    .admin-user-list-row {
        grid-template-columns: 1fr;
    }

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

    .admin-user-stat,
    .admin-user-role {
        text-align: left;
    }
}
