/* /Auth/AccessDenied.razor.rz.scp.css */
.access-denied[b-xttj5qzphd] {
    max-width: 520px;
    margin: 0 auto;
    padding: 48px 24px;
    text-align: center;
}

.access-denied p[b-xttj5qzphd] {
    margin-top: 8px;
    color: rgba(255, 255, 255, 0.6);
}

.access-denied-link[b-xttj5qzphd] {
    display: inline-block;
    min-height: 44px;
    margin-top: 24px;
    padding: 12px 22px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.05);
    color: #fff;
    font-weight: 600;
}
/* /Components/AwardPopup.razor.rz.scp.css */
.award-backdrop[b-q1076wjg06] {
    position: fixed;
    inset: 0;
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 22px;
    background: rgba(4, 7, 10, 0.72);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.award-card[b-q1076wjg06] {
    position: relative;
    width: 100%;
    max-width: 420px;
    overflow: hidden;
    padding: 30px 26px 24px;
    border-radius: var(--radius-card);
    background: var(--surface-strong);
    border: 1px solid var(--award-border);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
    text-align: center;
    animation: popin 0.28s ease-out;
}

.award-trophy[b-q1076wjg06] {
    font-size: 56px;
    line-height: 1;
}

.award-tag[b-q1076wjg06] {
    display: inline-block;
    margin-top: 12px;
    padding: 4px 12px;
    border-radius: 999px;
    background: var(--award-glass);
    border: 1px solid var(--award-border);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.award-title[b-q1076wjg06] {
    margin-top: 10px;
    font-size: 42px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1;
    color: var(--award-accent);
}

.award-text[b-q1076wjg06] {
    margin-top: 8px;
    font-size: 15px;
    color: var(--text-muted);
}

.award-text b[b-q1076wjg06] {
    color: var(--text);
}

.award-button[b-q1076wjg06] {
    min-height: var(--touch);
    margin-top: 20px;
    padding: 0 30px;
    border-radius: var(--radius-control);
    border: 1px solid var(--award-border);
    background: var(--award-glass);
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.award-button:disabled[b-q1076wjg06] {
    cursor: default;
    opacity: 0.6;
}

/* ---------- confetti ---------- */

.award-confetti[b-q1076wjg06] {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.award-piece[b-q1076wjg06] {
    position: absolute;
    top: -14px;
    width: 7px;
    height: 12px;
    border-radius: 2px;
    background: var(--award-accent);
    opacity: 0;
    animation: awardfall-b-q1076wjg06 1.5s ease-in forwards;
}

.award-piece:nth-child(3n)[b-q1076wjg06] {
    background: #facc15;
}

.award-piece:nth-child(3n + 1)[b-q1076wjg06] {
    background: var(--correct);
}

@keyframes awardfall-b-q1076wjg06 {
    0% { transform: translate(0, 0) rotate(0deg); opacity: 0; }
    12% { opacity: 1; }
    100% { transform: translate(var(--piece-drift), 340px) rotate(220deg); opacity: 0; }
}
/* /Components/BracketSlotCard.razor.rz.scp.css */
.slot[b-h4cudd182n] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 9px 10px;
    border-radius: 14px;
    background: rgba(14, 19, 25, 0.72);
    border: 1px solid var(--border);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

/* The glowing path: only the cards the one chosen team appears on. */
.slot.is-on-path[b-h4cudd182n] {
    border-color: var(--path-color, var(--accent));
    box-shadow: 0 0 0 1px var(--path-color, var(--accent)), 0 0 18px var(--path-glow, transparent);
}

.slot-head[b-h4cudd182n] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.slot-round[b-h4cudd182n] {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--text-faint);
}

.slot-stake[b-h4cudd182n] {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--accent);
}

/* Busted bracket: the card is only worth the fallback score from here on. */
.slot-stake.is-reduced[b-h4cudd182n] {
    color: #f0b429;
}

.slot-team[b-h4cudd182n] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: var(--touch);
    padding: 6px 9px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.04);
    color: #f2f5f7;
    font-size: 13px;
    font-weight: 600;
    text-align: left;
    /* Display only: the score fields below decide who advances. */
    transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.slot-team.is-picked[b-h4cudd182n] {
    background: var(--slot-team-glass);
    border-color: var(--slot-team);
    box-shadow: 0 0 12px var(--slot-team-glow);
}

.slot-team.is-winner[b-h4cudd182n] {
    border-color: var(--correct);
}

.slot-team.is-loser[b-h4cudd182n] {
    opacity: 0.45;
}

.slot-team.is-placeholder[b-h4cudd182n] {
    color: var(--text-faint);
    font-style: italic;
    font-weight: 500;
}

.slot-logo[b-h4cudd182n] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    flex: none;
    border-radius: 8px;
    background: var(--slot-team-glass, rgba(255, 255, 255, 0.08));
    border: 1px solid rgba(255, 255, 255, 0.12);
    font-size: 10.5px;
    font-weight: 700;
}

.slot-name[b-h4cudd182n] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.slot-check[b-h4cudd182n] {
    flex: none;
    color: var(--correct);
    font-size: 13px;
}

.slot-foot[b-h4cudd182n] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-size: 10.5px;
    color: var(--text-faint);
}

.slot-score[b-h4cudd182n] {
    font-weight: 700;
    color: var(--text-muted);
}

.slot-scores[b-h4cudd182n] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

.slot-score-input[b-h4cudd182n] {
    width: 42px;
    height: 30px;
    padding: 0 2px;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.06);
    color: var(--text);
    font-size: 13px;
    font-weight: 700;
    text-align: center;
    -moz-appearance: textfield;
    appearance: textfield;
}

.slot-score-input[b-h4cudd182n]::-webkit-outer-spin-button,
.slot-score-input[b-h4cudd182n]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.slot-score-input:focus[b-h4cudd182n] {
    outline: none;
    border-color: var(--accent-border);
    background: var(--accent-glass);
}

.slot-score-sep[b-h4cudd182n] {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.4);
}

.slot-hint[b-h4cudd182n] {
    font-size: 10.5px;
    font-weight: 600;
    color: #f0b429;
    text-align: center;
}
/* /Components/CurrentWeekCard.razor.rz.scp.css */
.week-head[b-jxr61rcu42] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 14px;
}

.week-title[b-jxr61rcu42] {
    margin-bottom: 0;
}

.week-label[b-jxr61rcu42] {
    padding: 3px 11px;
    border-radius: 999px;
    background: var(--accent-glass);
    border: 1px solid var(--accent-border);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.week-counts[b-jxr61rcu42] {
    display: flex;
    gap: 8px;
    margin-bottom: 14px;
}

.week-count[b-jxr61rcu42] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 12px 6px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.06);
}

.week-count-value[b-jxr61rcu42] {
    font-size: 30px;
    font-weight: 700;
    line-height: 1;
}

.week-count-label[b-jxr61rcu42] {
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--text-faint);
}

.week-correct[b-jxr61rcu42] {
    color: var(--correct);
}

.week-wrong[b-jxr61rcu42] {
    color: var(--wrong);
}

.week-open[b-jxr61rcu42] {
    color: var(--text-muted);
}

.week-bar[b-jxr61rcu42] {
    display: flex;
    height: 8px;
    border-radius: 999px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.07);
}

.week-part-correct[b-jxr61rcu42] {
    background: var(--correct);
}

.week-part-wrong[b-jxr61rcu42] {
    background: var(--wrong);
}

.week-part-open[b-jxr61rcu42] {
    background: rgba(255, 255, 255, 0.22);
}

.week-empty[b-jxr61rcu42] {
    margin-top: 12px;
    font-size: 13px;
}
/* /Components/FavoriteGamesCard.razor.rz.scp.css */
/* The empty state is exactly where someone taps, so it is a full touch target and not
   a link inside a sentence. */
.favgames-link[b-pgpm3twv2o] {
    display: inline-flex;
    align-items: center;
    min-height: var(--touch);
    margin-top: 10px;
    padding: 0 16px;
    border-radius: var(--radius-control);
    background: var(--accent-glass);
    border: 1px solid var(--accent-border);
    color: #fff;
    font-weight: 600;
    font-size: 14px;
}

.favgames-group + .favgames-group[b-pgpm3twv2o] {
    margin-top: 14px;
}

.favgames-group-title[b-pgpm3twv2o] {
    margin-bottom: 7px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-faint);
}

.favgames-row[b-pgpm3twv2o] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.06);
}

.favgames-row + .favgames-row[b-pgpm3twv2o] {
    margin-top: 7px;
}

.favgames-logo[b-pgpm3twv2o] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    flex: none;
    border-radius: 12px;
    /* Opponent colour, so the row is recognisable without reading the name. */
    background: var(--opponent-glass);
    border: 1px solid var(--opponent);
}

.favgames-logo img[b-pgpm3twv2o] {
    width: 28px;
    height: 28px;
    object-fit: contain;
}

.favgames-abbr[b-pgpm3twv2o] {
    font-size: 12.5px;
    font-weight: 700;
}

.favgames-text[b-pgpm3twv2o] {
    flex: 1;
    min-width: 0;
}

.favgames-opponent[b-pgpm3twv2o] {
    display: flex;
    align-items: baseline;
    gap: 6px;
    min-width: 0;
}

.favgames-prefix[b-pgpm3twv2o] {
    flex: none;
    font-size: 12px;
    color: var(--text-faint);
}

.favgames-name[b-pgpm3twv2o] {
    font-size: 15px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.favgames-meta[b-pgpm3twv2o] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 1px;
    font-size: 12.5px;
    color: var(--text-muted);
}

.favgames-sep[b-pgpm3twv2o] {
    opacity: 0.5;
}

.favgames-venue[b-pgpm3twv2o] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.favgames-result[b-pgpm3twv2o] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 3px;
    flex: none;
}

.favgames-score[b-pgpm3twv2o] {
    font-size: 19px;
    font-weight: 700;
}

.favgames-badge[b-pgpm3twv2o] {
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.favgames-badge.is-win[b-pgpm3twv2o] {
    background: rgba(52, 211, 153, 0.18);
    color: var(--correct);
}

.favgames-badge.is-loss[b-pgpm3twv2o] {
    background: rgba(244, 91, 91, 0.18);
    color: var(--wrong);
}

.favgames-badge.is-tie[b-pgpm3twv2o] {
    background: rgba(255, 255, 255, 0.12);
    color: var(--text-muted);
}

.favgames-none[b-pgpm3twv2o] {
    margin-top: 12px;
    font-size: 13px;
}
/* /Components/FavoriteTeamCard.razor.rz.scp.css */
/* The header bleeds to the card edges, so the rounded corners have to clip it. */
.favteam[b-r0s6s5hkpr] {
    overflow: hidden;
}

/* The empty state is exactly where someone taps, so it is a full touch target and not
   a link inside a sentence. */
.favteam-link[b-r0s6s5hkpr] {
    display: inline-flex;
    align-items: center;
    min-height: var(--touch);
    margin-top: 10px;
    padding: 0 16px;
    border-radius: var(--radius-control);
    background: var(--accent-glass);
    border: 1px solid var(--accent-border);
    color: #fff;
    font-weight: 600;
    font-size: 14px;
}

.favteam-head[b-r0s6s5hkpr] {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0 -20px 16px;
    padding: 14px 20px;
    /* The team colour carries the header, the way the team cards do it. */
    background: linear-gradient(135deg, var(--team-primary), var(--team-primary-soft));
    border-bottom: 2px solid var(--team-secondary-soft);
    color: var(--team-on-primary);
}

.favteam-logo[b-r0s6s5hkpr] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    flex: none;
    border-radius: 15px;
    background: rgba(255, 255, 255, 0.16);
}

.favteam-logo img[b-r0s6s5hkpr] {
    width: 40px;
    height: 40px;
    object-fit: contain;
}

.favteam-abbr[b-r0s6s5hkpr] {
    font-size: 17px;
    font-weight: 700;
    letter-spacing: 0.03em;
}

.favteam-name-block[b-r0s6s5hkpr] {
    flex: 1;
    min-width: 0;
}

/* Wraps onto a second line instead of cutting the name off. In the three column layout
   the card is narrow enough that "Kansas City Chiefs" no longer fits on one line, and a
   team name is exactly the thing that must stay readable. */
.favteam-name[b-r0s6s5hkpr] {
    font-size: 24px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1.05;
    overflow-wrap: anywhere;
}

.favteam-record[b-r0s6s5hkpr] {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-top: 1px;
    font-size: 14px;
    font-weight: 600;
    opacity: 0.85;
}

.favteam-sep[b-r0s6s5hkpr] {
    opacity: 0.6;
}

.favteam-status[b-r0s6s5hkpr] {
    flex: none;
    padding: 5px 11px;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.28);
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.favteam-status.is-clinched[b-r0s6s5hkpr] {
    background: rgba(52, 211, 153, 0.9);
    color: #06281d;
}

.favteam-status.is-inrace[b-r0s6s5hkpr] {
    background: rgba(255, 255, 255, 0.9);
    color: #10161c;
}

.favteam-status.is-eliminated[b-r0s6s5hkpr] {
    background: rgba(244, 91, 91, 0.92);
    color: #2b0c0c;
}

/* minmax(0, 1fr) instead of 1fr: a plain 1fr keeps the auto minimum of the content, so
   the widest label ("Punktedifferenz") pushed the third tile out of the card as soon as
   the column got narrow. */
.favteam-stats[b-r0s6s5hkpr] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.favteam-stat[b-r0s6s5hkpr] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 11px 10px;
    border-radius: 14px;
    background: var(--team-glass);
    border: 1px solid var(--team-border);
}

/* 10.5 px and tighter tracking, not the usual 11 px / 0.05em: "Punktedifferenz" is the
   longest label and has no place to break. At the original size it needs 105 px and the
   tile offers 97 in the three column dashboard. */
.favteam-stat dt[b-r0s6s5hkpr] {
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--text-faint);
    overflow-wrap: break-word;
}

.favteam-stat dd[b-r0s6s5hkpr] {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.1;
}

.favteam-stat dd.is-positive[b-r0s6s5hkpr] {
    color: var(--correct);
}

.favteam-stat dd.is-negative[b-r0s6s5hkpr] {
    color: var(--wrong);
}

/* Below this the card sits in a column of roughly 300 px, and three tiles next to each
   other leave about 78 px per label — "Punktedifferenz" would break mid-word there. */
@media (max-width: 820px) {
    .favteam-stats[b-r0s6s5hkpr] {
        grid-template-columns: 1fr;
    }
}
/* /Components/LeaderboardCard.razor.rz.scp.css */
.board-head[b-l5zo96qypf] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}

.board-title[b-l5zo96qypf] {
    margin-bottom: 0;
}

.board-scopes[b-l5zo96qypf] {
    display: flex;
    gap: 6px;
}

/* Sits next to the heading, so the switch reads as belonging to the leaderboard. */
.board-view[b-l5zo96qypf] {
    min-height: var(--touch);
    margin-right: auto;
    padding: 6px 14px;
    border-radius: 999px;
    border: 1px solid var(--accent-border);
    background: var(--accent-glass);
    color: #fff;
    font-size: 12.5px;
    font-weight: 600;
    cursor: pointer;
}

.board-scope[b-l5zo96qypf] {
    min-height: var(--touch);
    padding: 6px 14px;
    border-radius: 999px;
    border: 1px solid var(--border-strong);
    background: rgba(255, 255, 255, 0.04);
    color: var(--text-muted);
    font-size: 12.5px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.board-scope.is-active[b-l5zo96qypf] {
    background: var(--accent-glass);
    border-color: var(--accent-border);
    color: #fff;
    cursor: default;
}

.board-table[b-l5zo96qypf] {
    width: 100%;
    border-collapse: collapse;
}

.board-table th[b-l5zo96qypf] {
    padding: 0 10px 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--text-faint);
    text-align: left;
}

.board-num-col[b-l5zo96qypf] {
    text-align: right;
    width: 92px;
}

.board-rank-col[b-l5zo96qypf] {
    width: 44px;
}

.board-table td[b-l5zo96qypf] {
    padding: 9px 10px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 15px;
}

.board-rank[b-l5zo96qypf] {
    font-weight: 700;
    color: var(--text-muted);
}

.board-player[b-l5zo96qypf] {
    display: flex;
    align-items: center;
    gap: 7px;
}

.board-name[b-l5zo96qypf] {
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.board-badge[b-l5zo96qypf] {
    flex: none;
    padding: 2px 7px;
    border-radius: 999px;
    background: var(--accent-glass);
    border: 1px solid var(--accent-border);
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: #fff;
}

.board-num[b-l5zo96qypf] {
    text-align: right;
    color: var(--text-muted);
}

.board-points[b-l5zo96qypf] {
    font-size: 17px;
    font-weight: 700;
    color: var(--text);
}

/* Podium: the top three are tinted, gold to bronze, without turning the table loud. */
.board-table tbody tr.is-first td[b-l5zo96qypf] {
    background: rgba(250, 204, 21, 0.11);
}

.board-table tbody tr.is-first .board-rank[b-l5zo96qypf] {
    color: #facc15;
}

.board-table tbody tr.is-second td[b-l5zo96qypf] {
    background: rgba(203, 213, 225, 0.09);
}

.board-table tbody tr.is-second .board-rank[b-l5zo96qypf] {
    color: #cbd5e1;
}

.board-table tbody tr.is-third td[b-l5zo96qypf] {
    background: rgba(217, 141, 88, 0.09);
}

.board-table tbody tr.is-third .board-rank[b-l5zo96qypf] {
    color: #d98d58;
}

.board-table tbody tr.is-me .board-name[b-l5zo96qypf] {
    color: var(--accent);
}

.board-note[b-l5zo96qypf] {
    margin-top: 12px;
    font-size: 13px;
}

@media (max-width: 620px) {
    .board-num-col[b-l5zo96qypf] {
        width: 66px;
    }

    .board-table th[b-l5zo96qypf],
    .board-table td[b-l5zo96qypf] {
        padding-left: 6px;
        padding-right: 6px;
    }
}
/* /Components/LeaderboardHistoryChart.razor.rz.scp.css */
.chart-svg[b-ec34ohw8qp] {
    display: block;
    width: 100%;
    height: auto;
}

.chart-grid[b-ec34ohw8qp] {
    stroke: rgba(255, 255, 255, 0.09);
    stroke-width: 1;
}

.chart-line[b-ec34ohw8qp] {
    fill: none;
    stroke-width: 2;
    stroke-linejoin: round;
    stroke-linecap: round;
    /* The other players stay readable but recede behind one's own line. */
    opacity: 0.75;
}

.chart-line.is-me[b-ec34ohw8qp] {
    stroke-width: 3;
    opacity: 1;
}

.chart-legend[b-ec34ohw8qp] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 16px;
    margin-top: 10px;
    list-style: none;
}

.chart-legend-item[b-ec34ohw8qp] {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 13px;
}

.chart-swatch[b-ec34ohw8qp] {
    width: 10px;
    height: 10px;
    flex: none;
    border-radius: 3px;
}

.chart-legend-name[b-ec34ohw8qp] {
    color: var(--text-muted);
}

.chart-legend-points[b-ec34ohw8qp] {
    font-weight: 700;
}

.chart-empty[b-ec34ohw8qp] {
    font-size: 13px;
}
/* /Components/LeaderCard.razor.rz.scp.css */
.leader-body[b-8rprpoq6yy] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.leader-trophy[b-8rprpoq6yy] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    flex: none;
    border-radius: 18px;
    background: rgba(250, 204, 21, 0.13);
    border: 1px solid rgba(250, 204, 21, 0.32);
    font-size: 32px;
    line-height: 1;
}

.leader-text[b-8rprpoq6yy] {
    min-width: 0;
}

.leader-name[b-8rprpoq6yy] {
    font-size: 30px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1.05;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.leader-points[b-8rprpoq6yy] {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-top: 2px;
}

.leader-points-value[b-8rprpoq6yy] {
    font-size: 20px;
    font-weight: 700;
    color: #facc15;
}

.leader-points-label[b-8rprpoq6yy] {
    font-size: 13px;
    color: var(--text-muted);
}
/* /Components/MatchRow.razor.rz.scp.css */
.match[b-1y2opp9umr] {
    display: grid;
    grid-template-columns: 1fr 116px 1fr;
    align-items: stretch;
    gap: 8px;
    margin-bottom: 8px;
    padding: 8px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.035);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.match-team[b-1y2opp9umr] {
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: var(--touch);
    padding: 10px 12px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 11px;
    /* Both sides plain grey while nothing is picked — the "open" state. */
    background: rgba(255, 255, 255, 0.04);
    color: #f2f5f7;
    font-size: 14.5px;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
    /* Only the colours move, so a long list of rows does not jump while tapping. */
    transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.match-team:disabled[b-1y2opp9umr] {
    cursor: default;
}

.match-home[b-1y2opp9umr] {
    justify-content: flex-end;
    text-align: right;
}

.match-team-name[b-1y2opp9umr] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.match-logo[b-1y2opp9umr] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: none;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.02em;
}

/* ---------- picked ---------- */

/* The team colour plus a soft glow, deliberately restrained: with sixteen rows below one
   another a strong highlight per row turns the page into a flicker. */
.match-home.is-picked[b-1y2opp9umr] {
    background: var(--home-primary);
    border-color: var(--home-secondary);
    color: var(--home-on-primary);
    box-shadow: 0 0 0 1px var(--home-secondary), 0 6px 20px var(--home-glow);
}

.match-away.is-picked[b-1y2opp9umr] {
    background: var(--away-primary);
    border-color: var(--away-secondary);
    color: var(--away-on-primary);
    box-shadow: 0 0 0 1px var(--away-secondary), 0 6px 20px var(--away-glow);
}

.match-home.is-picked .match-logo[b-1y2opp9umr],
.match-away.is-picked .match-logo[b-1y2opp9umr] {
    background: rgba(0, 0, 0, 0.25);
    border-color: rgba(255, 255, 255, 0.35);
}

/* ---------- finished ---------- */

.match-team.is-winner[b-1y2opp9umr] {
    border-color: rgba(255, 255, 255, 0.28);
}

.match-team.is-loser[b-1y2opp9umr] {
    opacity: 0.5;
}

.match-team.is-tie[b-1y2opp9umr] {
    opacity: 0.75;
}

/* ---------- middle column ---------- */

.match-middle[b-1y2opp9umr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    text-align: center;
}

.match-vs[b-1y2opp9umr] {
    font-size: 15px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.35);
    letter-spacing: 0.06em;
}

.match-score[b-1y2opp9umr] {
    font-size: 16px;
    font-weight: 700;
    white-space: nowrap;
}

.match-lock[b-1y2opp9umr] {
    font-size: 15px;
    line-height: 1;
}

.match-kickoff[b-1y2opp9umr] {
    font-size: 11.5px;
    color: rgba(255, 255, 255, 0.45);
}

.match-outcome[b-1y2opp9umr] {
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Green means right, red means wrong — the same everywhere in this app. */
.match-outcome-correct[b-1y2opp9umr] {
    color: var(--correct);
}

.match-outcome-wrong[b-1y2opp9umr] {
    color: var(--wrong);
}

.match-outcome-notPredicted[b-1y2opp9umr] {
    color: rgba(255, 255, 255, 0.4);
}

.match-stake[b-1y2opp9umr] {
    font-size: 10px;
    font-weight: 700;
    color: var(--accent);
    text-transform: uppercase;
}

/* Marks a prediction the user did not make themselves. Deliberately quiet: it is a note,
   not a warning, and it sits in rows that are otherwise all alike. */
.match-auto[b-1y2opp9umr] {
    font-size: 11px;
    line-height: 1;
    color: rgba(255, 255, 255, 0.45);
}

/* ---------- playoff mode: final score ---------- */

.match-scores[b-1y2opp9umr] {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 3px;
}

.match-score-input[b-1y2opp9umr] {
    width: 38px;
    /* Below the 44 px rule on purpose: two of these have to fit between the team
       buttons. The row around them stays a large target, and typing a number is a
       keyboard interaction rather than a tap target. */
    height: 30px;
    padding: 0 2px;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.06);
    color: var(--text);
    font-size: 14px;
    font-weight: 700;
    text-align: center;
}

.match-score-input:focus[b-1y2opp9umr] {
    outline: none;
    border-color: var(--accent-border);
    background: var(--accent-glass);
}

/* The spinner arrows would not survive the narrow field. */
.match-score-input[b-1y2opp9umr]::-webkit-outer-spin-button,
.match-score-input[b-1y2opp9umr]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.match-score-input[b-1y2opp9umr] {
    -moz-appearance: textfield;
    appearance: textfield;
}

.match-score-sep[b-1y2opp9umr] {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.4);
}

.match-scores-locked[b-1y2opp9umr] {
    font-size: 12px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.55);
}

.match-hint[b-1y2opp9umr] {
    margin-top: 2px;
    font-size: 10.5px;
    font-weight: 600;
    color: #f0b429;
    line-height: 1.2;
}

/* iPad portrait and phones: the team name moves under the logo instead of shrinking away. */
@media (max-width: 600px) {
    .match[b-1y2opp9umr] {
        grid-template-columns: 1fr 84px 1fr;
        gap: 6px;
        padding: 6px;
    }

    .match-team[b-1y2opp9umr] {
        padding: 9px 10px;
        gap: 8px;
        font-size: 13px;
    }

    .match-logo[b-1y2opp9umr] {
        width: 30px;
        height: 30px;
        font-size: 11px;
    }

    /* Two fields plus the colon have to fit into the narrower middle column. */
    .match-score-input[b-1y2opp9umr] {
        width: 32px;
        height: 28px;
        font-size: 13px;
    }

    .match-scores[b-1y2opp9umr] {
        gap: 2px;
    }
}
/* /Components/MyScoreCard.razor.rz.scp.css */
.score-body[b-rrfcxpymrv] {
    display: flex;
    align-items: center;
    gap: 20px;
}

.score-ring[b-rrfcxpymrv] {
    position: relative;
    width: 132px;
    height: 132px;
    flex: none;
}

.score-ring svg[b-rrfcxpymrv] {
    width: 100%;
    height: 100%;
    /* Starts the arcs at twelve o'clock instead of at three. */
    transform: rotate(-90deg);
}

.score-track[b-rrfcxpymrv] {
    fill: none;
    stroke: rgba(255, 255, 255, 0.08);
    stroke-width: 11;
}

.score-arc[b-rrfcxpymrv] {
    fill: none;
    stroke-width: 11;
    stroke-linecap: butt;
}

.score-arc-correct[b-rrfcxpymrv] {
    stroke: var(--correct);
}

.score-arc-wrong[b-rrfcxpymrv] {
    stroke: var(--wrong);
}

.score-center[b-rrfcxpymrv] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
}

.score-points[b-rrfcxpymrv] {
    font-size: 38px;
    font-weight: 700;
    line-height: 1;
}

.score-points-label[b-rrfcxpymrv] {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-faint);
}

.score-legend[b-rrfcxpymrv] {
    flex: 1;
    min-width: 0;
}

.score-legend-row[b-rrfcxpymrv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 6px 0;
    font-size: 14px;
}

.score-legend-row dt[b-rrfcxpymrv] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--text-muted);
}

.score-legend-row dd[b-rrfcxpymrv] {
    font-weight: 700;
}

.score-legend-total[b-rrfcxpymrv] {
    margin-top: 4px;
    padding-top: 10px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.score-dot[b-rrfcxpymrv] {
    width: 9px;
    height: 9px;
    flex: none;
    border-radius: 50%;
}

.score-dot-correct[b-rrfcxpymrv] {
    background: var(--correct);
}

.score-dot-wrong[b-rrfcxpymrv] {
    background: var(--wrong);
}

/* Hollow, not grey: games without a prediction count as wrong and sit inside the red
   share of the ring — a neutral dot would promise a third arc that does not exist. */
.score-dot-none[b-rrfcxpymrv] {
    background: transparent;
    box-shadow: inset 0 0 0 2px var(--wrong);
}

.score-empty[b-rrfcxpymrv] {
    margin-top: 14px;
    font-size: 13px;
}

@media (max-width: 480px) {
    .score-body[b-rrfcxpymrv] {
        flex-direction: column;
        align-items: stretch;
    }

    .score-ring[b-rrfcxpymrv] {
        align-self: center;
    }
}
/* /Components/Skeleton.razor.rz.scp.css */
.skeleton[b-fh8xs5rdz4] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.skeleton-row[b-fh8xs5rdz4] {
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.04);
    animation: skeletonpulse-b-fh8xs5rdz4 1.4s ease-in-out infinite;
}

@keyframes skeletonpulse-b-fh8xs5rdz4 {
    0%, 100% { opacity: 0.45; }
    50% { opacity: 0.85; }
}
/* /Components/TeamDataTab.razor.rz.scp.css */
.data-grid[b-g56zoh7fag] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 10px;
}

.data-tile[b-g56zoh7fag] {
    padding: 14px 16px;
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.06);
}

.data-label[b-g56zoh7fag] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(255, 255, 255, 0.55);
}

.data-value[b-g56zoh7fag] {
    margin-top: 2px;
    font-size: 22px;
    font-weight: 700;
}

/* Signed values follow the app wide colour code: green good, red bad. */
.data-positive[b-g56zoh7fag] {
    color: var(--correct);
}

.data-negative[b-g56zoh7fag] {
    color: var(--wrong);
}

.data-note[b-g56zoh7fag] {
    margin-top: 14px;
    font-size: 13px;
    color: var(--text-faint);
}
/* /Components/TeamGamesTab.razor.rz.scp.css */
.games-heading[b-bjqlncmtqw] {
    margin: 6px 0 10px;
    font-size: 17px;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--text-muted);
}

.games-heading + .game-row[b-bjqlncmtqw] {
    margin-top: 0;
}

.game-row[b-bjqlncmtqw] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
    padding: 12px 14px;
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.04);
}

.game-when[b-bjqlncmtqw] {
    width: 78px;
    flex: none;
    font-size: 11px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
}

.game-when-next[b-bjqlncmtqw] {
    color: var(--accent);
}

.game-logo[b-bjqlncmtqw] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    flex: none;
    border-radius: 9px;
    background: var(--opponent-primary);
    border: 1px solid var(--opponent-secondary);
    color: #fff;
    font-size: 10.5px;
    font-weight: 700;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}

.game-opponent[b-bjqlncmtqw] {
    flex: 1;
    min-width: 0;
    font-size: 14.5px;
    font-weight: 600;
}

.game-score[b-bjqlncmtqw] {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.7);
}

.game-time[b-bjqlncmtqw] {
    font-size: 12.5px;
    color: rgba(255, 255, 255, 0.55);
    white-space: nowrap;
}

.game-result[b-bjqlncmtqw] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    flex: none;
    border-radius: 7px;
    font-size: 13px;
    font-weight: 700;
    color: #0b0f14;
}

/* Green means right, red means wrong — the same everywhere in this app. */
.game-result-win[b-bjqlncmtqw] {
    background: var(--correct);
}

.game-result-loss[b-bjqlncmtqw] {
    background: var(--wrong);
}

.game-result-tie[b-bjqlncmtqw] {
    background: rgba(255, 255, 255, 0.45);
}

.game-result-open[b-bjqlncmtqw] {
    background: transparent;
}

@media (max-width: 560px) {
    .game-when[b-bjqlncmtqw] {
        width: 58px;
    }

    .game-time[b-bjqlncmtqw] {
        font-size: 11.5px;
    }
}
/* /Components/TeamRosterTab.razor.rz.scp.css */
.roster-note[b-ktcyu3furz] {
    margin-bottom: 12px;
    font-size: 13.5px;
    color: var(--text-muted);
}

.roster-section + .roster-section[b-ktcyu3furz] {
    margin-top: 20px;
}

.roster-section-title[b-ktcyu3furz] {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 9px;
    padding-bottom: 7px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.roster-section-code[b-ktcyu3furz] {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--accent);
}

.roster-section-name[b-ktcyu3furz] {
    flex: 1;
    min-width: 0;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-muted);
}

.roster-section-count[b-ktcyu3furz] {
    font-size: 12.5px;
    color: rgba(255, 255, 255, 0.35);
}

.roster-grid[b-ktcyu3furz] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 10px;
}

.roster-row[b-ktcyu3furz] {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 11px 14px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.06);
}

.roster-row.is-injured[b-ktcyu3furz] {
    border-color: rgba(244, 91, 91, 0.3);
}

/* Practice squad and injured reserve are visibly a step back, without hiding them. */
.roster-row.is-benched[b-ktcyu3furz] {
    background: rgba(255, 255, 255, 0.02);
    opacity: 0.62;
}

.roster-number[b-ktcyu3furz] {
    width: 34px;
    flex: none;
    font-size: 12.5px;
    color: rgba(255, 255, 255, 0.45);
}

.roster-name[b-ktcyu3furz] {
    flex: 1;
    min-width: 0;
    font-size: 14.5px;
    font-weight: 600;
}

.roster-squad[b-ktcyu3furz] {
    padding: 3px 8px;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.6);
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
}

.roster-injury[b-ktcyu3furz] {
    padding: 3px 8px;
    border-radius: 6px;
    background: rgba(244, 91, 91, 0.18);
    color: var(--wrong);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    white-space: nowrap;
}
/* /Components/WeekPager.razor.rz.scp.css */
.pager[b-ndq2hnz3wx] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}

.pager-step[b-ndq2hnz3wx] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--touch);
    height: var(--touch);
    flex: none;
    border: 1px solid var(--border-strong);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.05);
    color: #fff;
    font-size: 18px;
    cursor: pointer;
}

.pager-step:disabled[b-ndq2hnz3wx] {
    opacity: 0.3;
    cursor: default;
}

.pager-current[b-ndq2hnz3wx] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    min-width: 150px;
}

.pager-label[b-ndq2hnz3wx] {
    font-size: 26px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1;
}

.pager-now[b-ndq2hnz3wx] {
    padding: 3px 9px;
    border-radius: 999px;
    background: var(--accent-glass);
    border: 1px solid var(--accent-border);
    color: var(--accent);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.pager-jump[b-ndq2hnz3wx] {
    min-height: var(--touch);
    margin-left: auto;
    padding: 8px 12px;
    border: 1px solid var(--border-strong);
    border-radius: 12px;
    background: rgba(0, 0, 0, 0.28);
    color: #fff;
    font-size: 14px;
}

@media (max-width: 600px) {
    .pager-label[b-ndq2hnz3wx] {
        font-size: 21px;
    }

    .pager-jump[b-ndq2hnz3wx] {
        margin-left: 0;
        width: 100%;
    }
}
/* /Components/WeekStatusBar.razor.rz.scp.css */
.status[b-4yyjjnamvp] {
    margin-bottom: 18px;
}

.status-bar[b-4yyjjnamvp] {
    display: flex;
    height: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.07);
}

.status-part[b-4yyjjnamvp] {
    display: block;
    height: 100%;
}

/* Green means right, red means wrong — the same everywhere in this app. */
.status-correct[b-4yyjjnamvp] {
    background: var(--correct);
}

.status-wrong[b-4yyjjnamvp] {
    background: var(--wrong);
}

.status-open[b-4yyjjnamvp] {
    background: rgba(255, 255, 255, 0.22);
}

.status-legend[b-4yyjjnamvp] {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 8px;
    font-size: 13px;
    color: var(--text-muted);
}

.status-item b[b-4yyjjnamvp] {
    font-weight: 700;
}

.status-correct-text b[b-4yyjjnamvp] {
    color: var(--correct);
}

.status-wrong-text b[b-4yyjjnamvp] {
    color: var(--wrong);
}

.status-open-text b[b-4yyjjnamvp] {
    color: #fff;
}
/* /Layout/TopBar.razor.rz.scp.css */
.topbar[b-ldx9w41y0g] {
    position: sticky;
    top: 0;
    z-index: 40;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 22px;
    background: linear-gradient(180deg, rgba(7, 11, 15, 0.72), rgba(7, 11, 15, 0.28));
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.topbar-spacer[b-ldx9w41y0g] {
    flex: 1;
}

.league-switch[b-ldx9w41y0g] {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: var(--touch);
    padding: 8px 16px;
    border: 1px solid var(--accent-border);
    border-radius: 999px;
    background: var(--accent-glass);
    color: #fff;
    font-weight: 600;
    font-size: 15px;
    cursor: pointer;
}

.league-dot[b-ldx9w41y0g] {
    width: 9px;
    height: 9px;
    flex: none;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 10px var(--accent);
}

.league-switch-hint[b-ldx9w41y0g] {
    opacity: 0.55;
    font-size: 13px;
}

.topbar-nav[b-ldx9w41y0g] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.nav-item[b-ldx9w41y0g] {
    display: flex;
    align-items: center;
    min-height: var(--touch);
    padding: 8px 15px;
    border: none;
    border-radius: 10px;
    background: transparent;
    color: rgba(255, 255, 255, 0.62);
    font-weight: 600;
    font-size: 15px;
    cursor: pointer;
}

.nav-item.is-active[b-ldx9w41y0g] {
    color: #fff;
    background: var(--accent);
    box-shadow: 0 6px 18px var(--accent-glass);
}

.user-button[b-ldx9w41y0g] {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: var(--touch);
    margin-left: 6px;
    padding: 5px 5px 5px 13px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.05);
    color: #fff;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
}

.user-initial[b-ldx9w41y0g] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: none;
    border-radius: 50%;
    background: linear-gradient(135deg, #3a4652, #1c242c);
    font-size: 17px;
    font-weight: 700;
}

/* iPad portrait and phones: the league name alone has to carry the button. */
@media (max-width: 640px) {
    .topbar[b-ldx9w41y0g] {
        gap: 10px;
        padding: 12px 14px;
    }

    .league-switch-hint[b-ldx9w41y0g],
    .user-name[b-ldx9w41y0g] {
        display: none;
    }
}
/* /Pages/Admin.razor.rz.scp.css */
/* Styling of this page only. It moves into the global theme system in a later step. */

.admin[b-px7qub2cgj] {
    max-width: 1040px;
    margin: 0 auto;
    padding: 26px 22px 60px;
}

.admin-subtitle[b-px7qub2cgj] {
    margin: 4px 0 24px;
    font-size: 15px;
    color: rgba(255, 255, 255, 0.6);
}

.admin-card[b-px7qub2cgj] {
    margin-bottom: 22px;
    padding: 18px 20px;
    border-radius: 20px;
    background: rgba(14, 19, 25, 0.55);
    border: 1px solid rgba(255, 255, 255, 0.09);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.42);
}

.admin-card-title[b-px7qub2cgj] {
    margin-bottom: 14px;
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.55);
}

.admin-table[b-px7qub2cgj] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    overflow-x: auto;
}

.admin-row[b-px7qub2cgj] {
    display: grid;
    grid-template-columns: 1.1fr 1.1fr 0.7fr 0.6fr 0.9fr 0.9fr 0.9fr;
    gap: 10px;
    align-items: center;
    min-width: 720px;
    padding: 11px 12px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.03);
}

.admin-row-head[b-px7qub2cgj] {
    background: none;
    padding-bottom: 4px;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.45);
}

.admin-center[b-px7qub2cgj] {
    text-align: center;
}

.admin-toggle[b-px7qub2cgj] {
    width: 46px;
    height: 26px;
    padding: 3px;
    border: none;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    transition: background 0.15s ease;
}

.admin-toggle.is-on[b-px7qub2cgj] {
    background: #2f81f7;
    justify-content: flex-end;
}

/* Three way choice per user and league. Full 44 px height so it stays a comfortable touch
   target on the iPad, where this page is used just as often as on the desktop. */
.admin-select[b-px7qub2cgj] {
    width: 100%;
    max-width: 190px;
    min-height: 44px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(0, 0, 0, 0.28);
    color: #fff;
    font-size: 14px;
    font-family: inherit;
    outline: none;
}

.admin-select:focus-visible[b-px7qub2cgj] {
    border-color: #2f81f7;
}

/* The note under the bookmaker mode. Left aligned inside the centred cell, because a
   centred sentence of this length is harder to read than a flush one. */
.admin-mode-note[b-px7qub2cgj] {
    display: block;
    margin-top: 6px;
    text-align: left;
    font-size: 12px;
    line-height: 1.35;
    color: var(--text-muted);
}

.admin-knob[b-px7qub2cgj] {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #fff;
    display: block;
}

.admin-form[b-px7qub2cgj] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px 16px;
    align-items: center;
}

.admin-label[b-px7qub2cgj] {
    font-size: 13px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.55);
}

.admin-input[b-px7qub2cgj] {
    width: 100%;
    min-height: 44px;
    margin-bottom: 12px;
    padding: 11px 14px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(0, 0, 0, 0.28);
    color: #fff;
    font-size: 15px;
    font-family: inherit;
    outline: none;
}

.admin-actions[b-px7qub2cgj] {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 8px;
}

.admin-button[b-px7qub2cgj] {
    min-height: 44px;
    padding: 12px 22px;
    border: none;
    border-radius: 12px;
    background: linear-gradient(135deg, #2f81f7, #1e5fc2);
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
}

.admin-link[b-px7qub2cgj] {
    min-height: 44px;
    padding: 8px 6px;
    border: none;
    background: none;
    color: #2f81f7;
    font-size: 14px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    text-align: left;
}

.admin-error[b-px7qub2cgj] {
    margin-top: 12px;
    padding: 10px 13px;
    border-radius: 10px;
    background: rgba(244, 91, 91, 0.14);
    border: 1px solid rgba(244, 91, 91, 0.35);
    color: var(--wrong);
    font-size: 13.5px;
}

.admin-notice[b-px7qub2cgj] {
    margin-top: 12px;
    padding: 12px 14px;
    border-radius: 10px;
    background: rgba(52, 211, 153, 0.12);
    border: 1px solid rgba(52, 211, 153, 0.35);
    font-size: 13.5px;
    line-height: 1.6;
}

.admin-notice code[b-px7qub2cgj] {
    padding: 2px 6px;
    border-radius: 6px;
    background: rgba(0, 0, 0, 0.35);
    font-size: 14px;
}

.admin-muted[b-px7qub2cgj] {
    color: rgba(255, 255, 255, 0.6);
}

/* System status */

.admin-status-head[b-px7qub2cgj] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 16px;
    margin-bottom: 16px;
}

.admin-lamp[b-px7qub2cgj] {
    width: 13px;
    height: 13px;
    border-radius: 50%;
    flex: none;
}

.admin-lamp-ok[b-px7qub2cgj] {
    background: var(--correct);
    box-shadow: 0 0 12px rgba(52, 211, 153, 0.6);
}

.admin-lamp-warning[b-px7qub2cgj] {
    background: #f5a623;
    box-shadow: 0 0 12px rgba(245, 166, 35, 0.6);
}

.admin-lamp-error[b-px7qub2cgj] {
    background: var(--wrong);
    box-shadow: 0 0 12px rgba(244, 91, 91, 0.6);
}

.admin-status-text[b-px7qub2cgj] {
    font-size: 15px;
    font-weight: 700;
}

.admin-quota[b-px7qub2cgj] {
    font-size: 13.5px;
    color: rgba(255, 255, 255, 0.6);
}

.admin-row-sync[b-px7qub2cgj] {
    grid-template-columns: 1.3fr 0.9fr 1.1fr 1fr 0.7fr 0.8fr;
}

.admin-row-history[b-px7qub2cgj] {
    grid-template-columns: 1.1fr 1.3fr 0.9fr 1fr 0.7fr 0.7fr;
}

/* ---------- playoff mode ---------- */

.admin-row-playoff[b-px7qub2cgj] {
    grid-template-columns: 1fr 140px;
    align-items: center;
}

/* Sits under the status head instead of over a form field, so it needs the usual spacing
   rather than the pulled up one. */
.admin-odds-coverage[b-px7qub2cgj] {
    margin: -4px 0 16px;
}

.admin-hint[b-px7qub2cgj] {
    margin: -6px 0 12px;
    font-size: 13px;
    color: var(--text-muted);
}

/* ---------- loading profile ---------- */

/* Three cards side by side, one column as soon as the row gets tight. Each is a whole
   button so the description is part of the target, not just the name. */
.admin-profiles[b-px7qub2cgj] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 10px;
}

.admin-profile[b-px7qub2cgj] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-height: var(--touch);
    padding: 12px 14px;
    border-radius: var(--radius-control);
    border: 1px solid var(--border-strong);
    background: rgba(255, 255, 255, 0.04);
    color: var(--text);
    text-align: left;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.admin-profile:disabled[b-px7qub2cgj] {
    opacity: 0.6;
    cursor: default;
}

.admin-profile.is-active[b-px7qub2cgj] {
    border-color: var(--accent);
    background: var(--accent-glass);
    box-shadow: 0 0 0 1px var(--accent);
}

.admin-profile-name[b-px7qub2cgj] {
    font-size: 15px;
    font-weight: 700;
}

.admin-profile.is-active .admin-profile-name[b-px7qub2cgj] {
    color: var(--accent);
}

.admin-profile-lead[b-px7qub2cgj] {
    font-size: 12.5px;
    color: var(--text-muted);
}

.admin-profile-detail[b-px7qub2cgj] {
    font-size: 11.5px;
    line-height: 1.45;
    color: var(--text-faint);
}

.admin-switch[b-px7qub2cgj] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: var(--touch);
    cursor: pointer;
}

.admin-switch input[b-px7qub2cgj] {
    /* Hidden but still focusable and still the thing screen readers announce. */
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.admin-switch-track[b-px7qub2cgj] {
    position: relative;
    width: 46px;
    height: 26px;
    flex: none;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid var(--border-strong);
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.admin-switch-track[b-px7qub2cgj]::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.75);
    transition: transform 0.15s ease, background-color 0.15s ease;
}

.admin-switch input:checked + .admin-switch-track[b-px7qub2cgj] {
    background: var(--accent-glass);
    border-color: var(--accent-border);
}

.admin-switch input:checked + .admin-switch-track[b-px7qub2cgj]::after {
    transform: translateX(20px);
    background: var(--accent);
}

.admin-switch input:focus-visible + .admin-switch-track[b-px7qub2cgj] {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

.admin-switch input:disabled + .admin-switch-track[b-px7qub2cgj] {
    opacity: 0.5;
}

.admin-switch-label[b-px7qub2cgj] {
    font-size: 13px;
    font-weight: 600;
    color: var(--text-muted);
}

.admin-state[b-px7qub2cgj] {
    font-weight: 600;
}

.admin-state-ok[b-px7qub2cgj] {
    color: var(--correct);
}

.admin-state-warning[b-px7qub2cgj] {
    color: #f5a623;
}

.admin-state-error[b-px7qub2cgj] {
    color: var(--wrong);
}

.admin-state-idle[b-px7qub2cgj] {
    color: rgba(255, 255, 255, 0.45);
}

.admin-sync-message[b-px7qub2cgj] {
    margin: -1px 0 4px;
    padding: 8px 12px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.045);
    color: rgba(255, 255, 255, 0.72);
    font-size: 12.5px;
    min-width: 720px;
}
/* /Pages/Bracket.razor.rz.scp.css */
.bracket[b-wqgqae206k] {
    padding: 14px 0;
}

/* Title and pager in one row — the tree needs the height. */
.bracket-head[b-wqgqae206k] {
    display: flex;
    align-items: center;
    gap: 18px;
    margin: 0 22px 12px;
}

.bracket-title[b-wqgqae206k] {
    flex: none;
    font-size: 26px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1;
}

/* A three column grid, not a flex row: this pins both arrows to a fixed position, so
   clicking through the rounds never makes them travel with the length of the label. */
.bracket-pager[b-wqgqae206k] {
    display: grid;
    grid-template-columns: var(--touch) minmax(0, 1fr) var(--touch);
    align-items: center;
    gap: 12px;
    flex: 1;
    min-width: 0;
}

.bracket-arrow[b-wqgqae206k] {
    width: var(--touch);
    height: var(--touch);
    flex: none;
    border-radius: 50%;
    border: 1px solid var(--border-strong);
    background: var(--surface);
    color: var(--text);
    font-size: 17px;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.bracket-arrow:disabled[b-wqgqae206k] {
    opacity: 0.35;
    cursor: default;
}

.bracket-round[b-wqgqae206k] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
    font-size: 24px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.01em;
}

.bracket-error[b-wqgqae206k] {
    margin: 0 22px 12px;
    padding: 9px 12px;
    border-radius: var(--radius-control);
    background: rgba(244, 91, 91, 0.14);
    border: 1px solid rgba(244, 91, 91, 0.4);
    color: #ffd7d7;
    font-size: 13.5px;
}

/* The window the tree slides behind. Adjacent rounds stay sliced at the edges. */
.bracket-viewport[b-wqgqae206k] {
    overflow: hidden;
    /* Vertical scrolling stays with the page; horizontal movement is the swipe. */
    touch-action: pan-y;
}

/* The stage starts at the horizontal centre; the transform then pulls the active column
   onto it, so the neighbouring columns peek in from both edges at any viewport width. */
.bracket-stage[b-wqgqae206k] {
    position: relative;
    left: 50%;
    transition: transform 0.28s ease;
}

.bracket-dots[b-wqgqae206k] {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin: 0 22px 10px;
}

.bracket-dot[b-wqgqae206k] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.bracket-dot.is-active[b-wqgqae206k] {
    background: var(--accent);
    transform: scale(1.5);
}

.bracket-lines[b-wqgqae206k] {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.bracket-line[b-wqgqae206k] {
    fill: none;
    stroke: rgba(255, 255, 255, 0.16);
    stroke-width: 2;
}

/* Only one path glows at a time, in the colour of the chosen team. */
.bracket-line.is-on-path[b-wqgqae206k] {
    stroke: var(--path-color, var(--accent));
    stroke-width: 3;
    filter: drop-shadow(0 0 6px var(--path-color, var(--accent)));
}

.bracket-card[b-wqgqae206k] {
    position: absolute;
    /* The rounds beside the active one recede instead of disappearing, so the tree stays
       readable while the lines run on into them. */
    opacity: 0.42;
    transition: opacity 0.28s ease;
}

.bracket-card.is-active[b-wqgqae206k] {
    opacity: 1;
}

/* iPad portrait: the title steps aside so the round name keeps the whole row. */
@media (max-width: 720px) {
    .bracket-head[b-wqgqae206k] {
        flex-wrap: wrap;
        gap: 8px;
    }

    .bracket-title[b-wqgqae206k] {
        font-size: 22px;
    }

    .bracket-pager[b-wqgqae206k] {
        flex: 1 0 100%;
    }

    .bracket-round[b-wqgqae206k] {
        font-size: 20px;
    }
}
/* /Pages/Dashboard.razor.rz.scp.css */
/* One line: tag, name and season side by side. The stacked block with the 46 px heading
   cost about 130 px, and that was most of what made the dashboard scroll on an iPad in
   landscape. */
.league-header[b-olop8fmr3r] {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 14px;
}

.league-header-tag[b-olop8fmr3r] {
    align-self: center;
    padding: 4px 12px;
    border-radius: 999px;
    background: var(--accent);
    color: #fff;
    font-weight: 700;
    font-size: 12.5px;
    letter-spacing: 0.05em;
}

.league-header-name[b-olop8fmr3r] {
    font-size: 30px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1;
    text-shadow: 0 4px 30px rgba(0, 0, 0, 0.6);
}

.league-header-meta[b-olop8fmr3r] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    font-size: 14px;
    color: var(--text-muted);
}

.league-header-phase[b-olop8fmr3r] {
    font-weight: 600;
    color: var(--accent);
}

.league-header-sep[b-olop8fmr3r] {
    opacity: 0.5;
}

/* Three columns grouped by subject, so the tallest one stays short enough to fit an
   iPad in landscape without scrolling. Two columns below that, one on a phone. */
/* The right column is the widest of the three on purpose: it carries the three key
   figures of the favourite team, and "Gegenpunkte / Spiel" needs the room. The middle
   column only holds short labels. */
.widgets[b-olop8fmr3r] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.2fr);
    align-items: start;
    gap: 14px;
}

.widgets-col[b-olop8fmr3r] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}

@media (max-width: 1099px) {
    .widgets[b-olop8fmr3r] {
        grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
    }

    .widgets-col-wide[b-olop8fmr3r] {
        grid-row: span 2;
    }
}

@media (max-width: 760px) {
    .widgets[b-olop8fmr3r] {
        grid-template-columns: minmax(0, 1fr);
    }

    .widgets-col-wide[b-olop8fmr3r] {
        grid-row: auto;
    }

    .league-header-name[b-olop8fmr3r] {
        font-size: 26px;
    }
}
/* /Pages/LeagueSelect.razor.rz.scp.css */
.select-page[b-pnt104ja2t] {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 24px;
    text-align: center;
}

.select-title[b-pnt104ja2t] {
    font-size: 52px;
    font-weight: 700;
    text-transform: uppercase;
    text-shadow: 0 4px 30px rgba(0, 0, 0, 0.6);
}

.select-subtitle[b-pnt104ja2t] {
    margin: 6px 0 44px;
    font-size: 16px;
    color: var(--text-muted);
}

.select-error[b-pnt104ja2t] {
    padding: 10px 13px;
    border-radius: 10px;
    background: rgba(244, 91, 91, 0.14);
    border: 1px solid rgba(244, 91, 91, 0.35);
    color: var(--wrong);
    font-size: 13.5px;
}

.select-cards[b-pnt104ja2t] {
    display: flex;
    flex-wrap: wrap;
    gap: 26px;
    justify-content: center;
    width: 100%;
    max-width: 760px;
}

.league-card[b-pnt104ja2t] {
    position: relative;
    overflow: hidden;
    width: 320px;
    height: 260px;
    padding: 22px;
    text-align: left;
    border-radius: 22px;
    border: 1px solid var(--card-border);
    background: linear-gradient(160deg, var(--card-tint), rgba(10, 14, 19, 0.72));
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    color: #fff;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
    cursor: pointer;
    animation: popin 0.4s ease;
}

.league-card:active[b-pnt104ja2t] {
    transform: scale(0.985);
}

.league-card-watermark[b-pnt104ja2t] {
    position: absolute;
    right: -10px;
    bottom: -30px;
    z-index: 1;
    font-size: 150px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.03em;
    color: var(--card-watermark);
}

.league-card-body[b-pnt104ja2t] {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.league-card-tag[b-pnt104ja2t] {
    align-self: flex-start;
    padding: 6px 15px;
    border-radius: 999px;
    background: var(--card-accent);
    color: #fff;
    font-weight: 700;
    font-size: 15px;
    letter-spacing: 0.05em;
}

.league-card-spacer[b-pnt104ja2t] {
    flex: 1;
}

.league-card-name[b-pnt104ja2t] {
    font-size: 34px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 0.95;
}

.league-card-sub[b-pnt104ja2t] {
    margin-top: 4px;
    font-size: 14px;
    color: var(--text-muted);
}

.league-card-cta[b-pnt104ja2t] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 18px;
    color: var(--card-accent);
    font-weight: 700;
    font-size: 16px;
}

.league-card-arrow[b-pnt104ja2t] {
    font-size: 19px;
}

/* iPad portrait: the two cards stack and use the available width. */
@media (max-width: 720px) {
    .select-title[b-pnt104ja2t] {
        font-size: 40px;
    }

    .select-subtitle[b-pnt104ja2t] {
        margin-bottom: 32px;
    }

    .league-card[b-pnt104ja2t] {
        width: 100%;
        max-width: 360px;
        height: 220px;
    }
}
/* /Pages/Login.razor.rz.scp.css */
/* Styling of this page only. It moves into the global theme system in a later step. */

.login-page[b-tiw5bynmvj] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.login-card[b-tiw5bynmvj] {
    width: 100%;
    max-width: 400px;
    padding: 38px 34px;
    border-radius: 26px;
    background: rgba(14, 19, 25, 0.62);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
}

.login-brand[b-tiw5bynmvj] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 28px;
}

.login-logo[b-tiw5bynmvj] {
    width: 46px;
    height: 46px;
    flex-shrink: 0;
    border-radius: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #2f81f7, #12305e);
    box-shadow: 0 8px 24px rgba(47, 129, 247, 0.45);
}

.login-title[b-tiw5bynmvj] {
    margin: 0;
    font-size: 26px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.01em;
}

.login-subtitle[b-tiw5bynmvj] {
    margin: 4px 0 0;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.5);
}

.login-label[b-tiw5bynmvj] {
    display: block;
    margin-bottom: 7px;
    font-size: 13px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.55);
}

/* ::deep is required because InputText renders its input element itself and
   therefore does not carry the scope attribute of this page. */
.login-card[b-tiw5bynmvj]  .login-input {
    width: 100%;
    padding: 13px 15px;
    margin-bottom: 16px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(0, 0, 0, 0.28);
    color: #fff;
    font-size: 16px;
    font-family: inherit;
    outline: none;
}

.login-card[b-tiw5bynmvj]  .login-input:focus {
    border-color: rgba(47, 129, 247, 0.7);
}

.login-error[b-tiw5bynmvj] {
    margin: 2px 0 16px;
    padding: 10px 13px;
    border-radius: 10px;
    background: rgba(244, 91, 91, 0.14);
    border: 1px solid rgba(244, 91, 91, 0.35);
    color: var(--wrong);
    font-size: 13.5px;
}

.login-button[b-tiw5bynmvj] {
    width: 100%;
    min-height: 48px;
    padding: 15px;
    border: none;
    border-radius: 13px;
    background: linear-gradient(135deg, #2f81f7, #1e5fc2);
    color: #fff;
    font-size: 17px;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    box-shadow: 0 12px 30px rgba(47, 129, 247, 0.4);
}

.login-button:disabled[b-tiw5bynmvj] {
    opacity: 0.65;
    cursor: default;
}

.login-hint[b-tiw5bynmvj] {
    margin: 18px 0 0;
    text-align: center;
    font-size: 12.5px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.4);
}
/* /Pages/Predictions.razor.rz.scp.css */
.tipps[b-oran3zc1br] {
    max-width: 1180px;
    margin: 0 auto;
    padding: 26px 22px 60px;
}

.tipps-title[b-oran3zc1br] {
    font-size: 44px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1;
    margin-bottom: 16px;
}

.tipps-error[b-oran3zc1br] {
    margin-bottom: 14px;
    padding: 10px 13px;
    border-radius: 10px;
    background: rgba(244, 91, 91, 0.14);
    border: 1px solid rgba(244, 91, 91, 0.35);
    color: var(--wrong);
    font-size: 13.5px;
}

/* Explains once why the team buttons no longer react while the playoffs are on. */
.tipps-note[b-oran3zc1br] {
    margin-bottom: 14px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--text-muted);
}

.tipps-day[b-oran3zc1br] {
    margin: 20px 0 10px;
    font-size: 17px;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--text-muted);
}

@media (max-width: 720px) {
    .tipps[b-oran3zc1br] {
        padding: 20px 14px 50px;
    }

    .tipps-title[b-oran3zc1br] {
        font-size: 34px;
    }
}
/* /Pages/TeamDetail.razor.rz.scp.css */
.detail[b-pevrghbyi1] {
    max-width: 980px;
    margin: 0 auto;
    padding: 22px 22px 60px;
}

.detail-back[b-pevrghbyi1] {
    display: inline-flex;
    align-items: center;
    min-height: var(--touch);
    margin-bottom: 16px;
    padding: 8px 14px;
    border-radius: 10px;
    border: 1px solid var(--border-strong);
    background: rgba(255, 255, 255, 0.05);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
}

.detail-error[b-pevrghbyi1] {
    margin: 12px 0;
    padding: 10px 13px;
    border-radius: 10px;
    background: rgba(244, 91, 91, 0.14);
    border: 1px solid rgba(244, 91, 91, 0.35);
    color: var(--wrong);
    font-size: 13.5px;
}

.detail-header[b-pevrghbyi1] {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
    padding: 26px;
    border-radius: 22px;
    background: linear-gradient(135deg, var(--team-primary), var(--team-primary-soft));
    border: 1px solid var(--team-secondary-soft);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
}

.detail-logo[b-pevrghbyi1] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    flex: none;
    border-radius: 20px;
    background: var(--team-primary);
    border: 2px solid var(--team-secondary-soft);
    color: var(--team-on-primary);
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.detail-identity[b-pevrghbyi1] {
    flex: 1;
    min-width: 200px;
}

.detail-group[b-pevrghbyi1] {
    font-size: 12.5px;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.75);
}

.detail-name[b-pevrghbyi1] {
    font-size: 38px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.detail-meta[b-pevrghbyi1] {
    margin-top: 4px;
    font-size: 15px;
    color: rgba(255, 255, 255, 0.85);
}

.detail-fav[b-pevrghbyi1] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: var(--touch);
    padding: 11px 18px;
    border: none;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
}

.detail-fav.is-on[b-pevrghbyi1] {
    background: #f6c34a;
    color: #0b0f14;
}

.detail-tabs[b-pevrghbyi1] {
    display: flex;
    gap: 8px;
    margin: 18px 0;
    flex-wrap: wrap;
}

.detail-tab[b-pevrghbyi1] {
    min-height: var(--touch);
    padding: 8px 15px;
    border: none;
    border-radius: 10px;
    background: transparent;
    color: rgba(255, 255, 255, 0.62);
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
}

.detail-tab.is-active[b-pevrghbyi1] {
    background: var(--accent);
    color: #fff;
    box-shadow: 0 6px 18px var(--accent-glass);
}

@media (max-width: 720px) {
    .detail[b-pevrghbyi1] {
        padding: 18px 14px 50px;
    }

    .detail-header[b-pevrghbyi1] {
        padding: 18px;
        gap: 14px;
    }

    .detail-name[b-pevrghbyi1] {
        font-size: 28px;
    }

    .detail-logo[b-pevrghbyi1] {
        width: 56px;
        height: 56px;
        font-size: 19px;
    }
}
/* /Pages/Teams.razor.rz.scp.css */
.teams[b-egcbs9fbs3] {
    max-width: 1180px;
    margin: 0 auto;
    padding: 26px 22px 60px;
}

.teams-title[b-egcbs9fbs3] {
    font-size: 44px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1;
    margin-bottom: 4px;
}

.teams-subtitle[b-egcbs9fbs3] {
    margin-bottom: 24px;
    font-size: 15px;
    color: var(--text-muted);
}

.teams-error[b-egcbs9fbs3] {
    margin-bottom: 16px;
    padding: 10px 13px;
    border-radius: 10px;
    background: rgba(244, 91, 91, 0.14);
    border: 1px solid rgba(244, 91, 91, 0.35);
    color: var(--wrong);
    font-size: 13.5px;
}

.teams-group[b-egcbs9fbs3] {
    margin: 6px 0 12px;
    font-size: 22px;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--accent);
}

/* The dense grid is deliberate and applies only here — every other page stays roomy. */
.teams-grid[b-egcbs9fbs3] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
    gap: 12px;
    margin-bottom: 28px;
}

/* No backdrop-filter on these cards: with over a hundred of them at once the blur is far
   too expensive on iPad Safari, so a semi transparent fill stands in. */
.team-card[b-egcbs9fbs3] {
    position: relative;
    overflow: hidden;
    border-radius: 16px;
    border: 1px solid var(--border);
    background: rgba(14, 19, 25, 0.62);
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.35);
}

.team-open[b-egcbs9fbs3] {
    display: block;
    cursor: pointer;
}

.team-header[b-egcbs9fbs3] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 54px;
    background: linear-gradient(135deg, var(--team-primary), var(--team-primary-soft));
    border-bottom: 2px solid var(--team-secondary-soft);
}

.team-logo[b-egcbs9fbs3] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    flex: none;
    border-radius: 11px;
    background: var(--team-primary);
    border: 2px solid var(--team-secondary);
    color: var(--team-on-primary);
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 0.02em;
}

.team-body[b-egcbs9fbs3] {
    display: block;
    padding: 11px 12px 13px;
}

.team-name[b-egcbs9fbs3] {
    display: block;
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.15;
}

.team-record[b-egcbs9fbs3] {
    display: block;
    margin-top: 2px;
    font-size: 12.5px;
    color: rgba(255, 255, 255, 0.55);
}

/* The tap area is the required 44 x 44 px, the visible circle stays small: the padding is
   transparent, so the star does not cover the card it sits on. */
.team-fav[b-egcbs9fbs3] {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--touch);
    height: var(--touch);
    padding: 0;
    border: none;
    background: none;
    color: #fff;
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
}

.team-fav-mark[b-egcbs9fbs3] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.45);
}

.team-fav.is-on .team-fav-mark[b-egcbs9fbs3] {
    background: #f6c34a;
    color: #0b0f14;
}

@media (max-width: 720px) {
    .teams[b-egcbs9fbs3] {
        padding: 20px 14px 50px;
    }

    .teams-title[b-egcbs9fbs3] {
        font-size: 34px;
    }

    .teams-grid[b-egcbs9fbs3] {
        grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
        gap: 10px;
    }
}