/*
 * The Scorekeeper visual system
 *
 * This layer deliberately leaves the application's content, data contracts,
 * and scoring behavior untouched. It remaps the existing UI into two related
 * surfaces: Arena (home, live, scoring) and Ice (reports, stats, operations).
 */

:root {
    color-scheme: dark;
    --sk3-midnight: #061b3b;
    --sk3-deep: #031a4f;
    --sk3-panel: #0b2a58;
    --sk3-panel-strong: #102f5f;
    --sk3-electric: #e5f70a;
    --sk3-electric-soft: #f2fb77;
    --sk3-ice: #f6f8fa;
    --sk3-white: #ffffff;
    --sk3-ink: #0b1324;
    --sk3-slate: #253344;
    --sk3-steel: #637080;
    --sk3-border: #d7dee7;
    --sk3-live: #ff4d5e;
    --sk3-saved: #27c17c;
    --sk3-saved-text: #0b6b45;
    --sk3-blue: #55c2ff;
    --sk3-display: "Barlow Condensed", "Arial Narrow", Arial, sans-serif;
    --sk3-ui: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --sk3-radius-data: 12px;
    --sk3-radius-feature: 18px;
    --sk3-shadow-arena: 0 24px 64px rgba(0, 8, 24, 0.32);
    --sk3-shadow-ice: 0 16px 38px rgba(6, 27, 59, 0.09);

    /* Compatibility map for the established component styles. */
    --primary-color: var(--sk3-blue);
    --primary-hover: #31a9ef;
    --primary-light: #8bd5ff;
    --secondary-color: #a9b8cc;
    --gold-color: var(--sk3-electric);
    --gold-hover: #cddd05;
    --gold-light: var(--sk3-electric-soft);
    --gold-glow: rgba(229, 247, 10, 0.18);
    --teal-color: var(--sk3-saved);
    --teal-light: #56d89d;
    --teal-glow: rgba(39, 193, 124, 0.16);
    --success-color: var(--sk3-saved);
    --warning-color: #f5c451;
    --danger-color: var(--sk3-live);
    --background-color: var(--sk3-midnight);
    --card-background: var(--sk3-panel);
    --surface-alt: #071a37;
    --text-color: var(--sk3-ice);
    --text-muted: #a9b8cc;
    --heading-color: var(--sk3-white);
    --border-color: rgba(246, 248, 250, 0.16);
    --gold-border: rgba(229, 247, 10, 0.32);
    --shadow: var(--sk3-shadow-arena);
    --glow: rgba(85, 194, 255, 0.08);
    --card-glow: 0 0 0 1px rgba(85, 194, 255, 0.025);
    --text-primary: var(--sk3-ice);
    --text-secondary: #a9b8cc;
    --bg-card: var(--sk3-panel);
    --border-subtle: rgba(246, 248, 250, 0.14);
}

html {
    background: var(--sk3-deep);
    scroll-behavior: smooth;
}

body {
    display: block;
    min-height: 100vh;
    min-height: 100dvh;
    padding: 0;
    font-family: var(--sk3-ui);
    background:
        radial-gradient(circle at 82% -10%, rgba(85, 194, 255, 0.18), transparent 30rem),
        linear-gradient(145deg, var(--sk3-midnight), #030e21 76%);
}

button,
input,
select,
textarea {
    font-family: inherit;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid var(--sk3-blue);
    outline-offset: 3px;
}

#app {
    min-height: 100vh;
    min-height: 100dvh;
}

#app[data-view="main-menu"],
#app[data-view="live-game"],
#app[data-view="game-selection"],
#app[data-view="attendance"],
#app[data-view="scoring"],
#app[data-view="final-review"],
#app[data-view="goal-details"],
#app[data-view="penalty-details"],
#app[data-view="overtime"] {
    background:
        linear-gradient(rgba(246, 248, 250, 0.032) 1px, transparent 1px),
        linear-gradient(90deg, rgba(246, 248, 250, 0.032) 1px, transparent 1px),
        radial-gradient(circle at 82% 8%, rgba(85, 194, 255, 0.13), transparent 28rem),
        linear-gradient(145deg, var(--sk3-midnight), #030e21 82%);
    background-size: 48px 48px, 48px 48px, auto, auto;
}

/* Ice-mode views: editorial and data-heavy pages use light surfaces. */
#app[data-view="statistics"],
#app[data-view="rink-report"],
#app[data-view="scouting-report"],
#app[data-view="admin-dashboard"],
#app[data-view="admin-home"],
#app[data-view="admin-community"],
#app[data-view="admin-operations"],
#app[data-view="admin-notifications"],
#app[data-view="admin-llm"],
#app[data-view="admin-visitors"],
#app[data-view="admin-share"],
#app[data-view="admin-seasons"] {
    color-scheme: light;
    --primary-color: var(--sk3-midnight);
    --primary-hover: var(--sk3-panel);
    --primary-light: #31507d;
    --secondary-color: var(--sk3-steel);
    --gold-color: var(--sk3-midnight);
    --gold-hover: var(--sk3-panel);
    --gold-light: #31507d;
    --gold-glow: rgba(6, 27, 59, 0.12);
    --teal-color: var(--sk3-saved-text);
    --teal-light: var(--sk3-saved);
    --background-color: var(--sk3-ice);
    --card-background: var(--sk3-white);
    --surface-alt: #eef2f6;
    --text-color: var(--sk3-slate);
    --text-muted: var(--sk3-steel);
    --heading-color: var(--sk3-midnight);
    --border-color: var(--sk3-border);
    --gold-border: rgba(6, 27, 59, 0.15);
    --shadow: var(--sk3-shadow-ice);
    --card-glow: none;
    --text-primary: var(--sk3-ink);
    --text-secondary: var(--sk3-steel);
    --bg-card: var(--sk3-white);
    --border-subtle: var(--sk3-border);
    color: var(--sk3-ink);
    background:
        radial-gradient(circle at 10% 0%, rgba(85, 194, 255, 0.1), transparent 25rem),
        var(--sk3-ice);
}

/* Persistent approved brand shell. */
#app > header {
    position: sticky;
    z-index: 90;
    top: 0;
    min-height: 64px;
    margin: 0;
    padding: 0 clamp(18px, 2.4vw, 28px);
    overflow: visible;
    color: var(--sk3-white);
    background: rgba(6, 27, 59, 0.98);
    border: 0;
    border-bottom: 1px solid rgba(246, 248, 250, 0.15);
    border-radius: 0;
    box-shadow: 0 12px 30px rgba(0, 8, 24, 0.18);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

#app > header::after {
    display: none;
}

/* Keep background sync feedback centered over the persistent top bar. */
#sync-banner {
    color: var(--sk3-white);
    box-shadow: 0 8px 24px rgba(0, 8, 24, 0.34);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

#sync-banner.sync-info {
    color: #b9e7ff;
    background: rgba(8, 39, 76, 0.96);
    border-color: rgba(85, 194, 255, 0.58);
}

#sync-banner.sync-success {
    color: #9ce8c2;
    background: rgba(5, 55, 46, 0.96);
    border-color: rgba(39, 193, 124, 0.58);
}

#sync-banner.sync-error {
    color: #ffc2c9;
    background: rgba(73, 16, 30, 0.97);
    border-color: rgba(255, 77, 94, 0.62);
}

#sync-banner.sync-warning {
    color: #ffe0a3;
    background: rgba(69, 45, 9, 0.97);
    border-color: rgba(245, 196, 81, 0.62);
}

.header-top-row {
    width: 100%;
    max-width: 1180px;
    min-height: 64px;
    margin-inline: auto;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
}

.header-logo-button {
    display: flex;
    align-items: center;
    width: auto;
    max-width: none;
    min-height: 44px;
    margin: 0 auto 0 0;
    text-align: left;
}

.header-logo-button:focus-visible {
    outline-color: var(--sk3-electric);
    border-radius: 8px;
}

.scorekeeper-brand-lockup {
    display: inline-flex;
    align-items: center;
    min-width: 0;
}

.scorekeeper-brand-mark {
    display: block;
    width: 178px;
    max-width: 100%;
    height: auto;
}

.push-bell-wrap {
    position: static;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.social-account-wrap {
    position: static;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.header-top-row .social-account-button,
.header-top-row .push-bell {
    width: 44px;
    height: 44px;
    color: var(--sk3-ice);
    background: rgba(246, 248, 250, 0.055);
    border: 1px solid rgba(246, 248, 250, 0.16);
    border-radius: 10px;
    box-shadow: none;
    animation: none;
}

.header-top-row .social-account-button:hover,
.header-top-row .push-bell:hover {
    color: var(--sk3-white);
    background: rgba(246, 248, 250, 0.11);
    border-color: rgba(229, 247, 10, 0.58);
    box-shadow: none;
    transform: none;
}

.header-top-row .social-account-button:focus-visible,
.header-top-row .push-bell:focus-visible {
    outline: 2px solid var(--sk3-electric);
    outline-offset: 2px;
}

.header-top-row .social-account-wrap[data-authenticated="true"] .social-account-button,
.header-top-row .push-bell[data-enabled="true"] {
    color: var(--sk3-electric);
    background: rgba(229, 247, 10, 0.08);
    border-color: rgba(229, 247, 10, 0.5);
    box-shadow: none;
}

.header-top-row .social-account-button__avatar {
    width: 20px;
    height: 20px;
    overflow: visible;
    color: currentColor;
    background: transparent;
    border-radius: 0;
}

.header-top-row .social-account-wrap[data-authenticated="true"] .social-account-button__avatar {
    width: 26px;
    height: 26px;
    overflow: hidden;
    border-radius: 50%;
}

.header-top-row .social-account-button__avatar-fallback {
    display: block;
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.header-top-row .push-bell__icon {
    display: block;
    line-height: 0;
    animation: none;
}

.header-top-row .push-bell__icon svg {
    display: block;
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.push-bell__dot {
    top: 6px;
    right: 6px;
    width: 7px;
    height: 7px;
    background: var(--sk3-electric);
    box-shadow: 0 0 0 2px var(--sk3-midnight);
}

.social-account-button__badge,
.social-account-button__mobile-label,
.push-bell__label,
.push-bell__hint-badge {
    display: none;
}

/* Persistent public navigation and compact contextual bars. */
#top-navigation {
    position: sticky;
    z-index: 80;
    top: 64px;
    min-height: 0;
    margin: 0;
    padding: 0 clamp(14px, 2vw, 26px);
    gap: 8px;
    background: rgba(6, 27, 59, 0.98);
    border-bottom: 1px solid rgba(246, 248, 250, 0.12);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

#top-navigation:empty {
    display: none;
}

.nav-btn {
    min-height: 46px;
    padding: 0 14px;
    color: #c4cfdd;
    background: transparent;
    border: 0;
    border-bottom: 3px solid transparent;
    border-radius: 0;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.06em;
}

.nav-btn:hover,
.nav-btn.primary {
    color: var(--sk3-white);
    background: rgba(255, 255, 255, 0.045);
    border-color: var(--sk3-electric);
    transform: none;
}

.desktop-nav {
    margin: 0;
}

.primary-nav {
    display: flex;
}

.primary-nav__desktop-label {
    display: inline-flex;
    align-items: center;
}

.primary-nav__mobile-label {
    display: none;
}

.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.workflow-nav {
    display: grid;
    flex: 1 1 100%;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    width: 100%;
    min-width: 0;
    min-height: 58px;
    padding: 0 clamp(10px, 2.4vw, 20px);
    background: rgba(6, 27, 59, 0.98);
    border-bottom: 1px solid rgba(246, 248, 250, 0.14);
}

.workflow-nav__back {
    display: inline-flex;
    grid-column: 1;
    align-items: center;
    justify-self: start;
    min-height: 40px;
    gap: 5px;
    padding: 0 11px 0 9px;
    color: var(--sk3-ice);
    background: rgba(246, 248, 250, 0.055);
    border: 1px solid rgba(246, 248, 250, 0.14);
    border-radius: 10px;
    font-weight: 800;
}

.workflow-nav__back:hover {
    color: var(--sk3-white);
    background: rgba(246, 248, 250, 0.11);
    border-color: rgba(229, 247, 10, 0.58);
}

.workflow-nav__back-icon {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.workflow-nav__brand {
    display: inline-flex;
    grid-column: 2;
    align-items: center;
    justify-self: center;
}

.workflow-nav__brand-mark {
    display: block;
    width: 142px;
    max-width: 100%;
    height: auto;
}

.workflow-nav__context {
    grid-column: 3;
    justify-self: end;
    color: #a9b8cc;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.065em;
    text-align: right;
    text-transform: uppercase;
}

.desktop-nav__link:disabled {
    color: #7f8da0;
    cursor: not-allowed;
    opacity: 0.72;
}

.desktop-nav__live-dot {
    width: 7px;
    height: 7px;
    margin-right: 7px;
    flex: 0 0 auto;
    background: var(--sk3-live);
    border-radius: 50%;
    box-shadow: 0 0 0 3px rgba(255, 77, 94, 0.14);
}

.desktop-nav__link:disabled .desktop-nav__live-dot {
    background: var(--sk3-steel);
    box-shadow: none;
}

.pre-game-waiting-room__notify-icon,
.scout-expand__icon {
    width: 1rem;
    height: 1rem;
}

.pre-game-waiting-room__notify-btn[aria-busy="true"] .pre-game-waiting-room__notify-icon {
    animation: live-summary-spin 0.8s linear infinite;
}

.scout-expand {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.scout-expand__icon {
    transition: transform 0.16s ease;
}

.scout-expand[aria-expanded="true"] .scout-expand__icon {
    transform: rotate(180deg);
}

/* Shared layout, typography, and controls. */
#main-content {
    width: 100%;
    padding: clamp(18px, 3vw, 34px);
}

#app[data-view="main-menu"] #main-content,
#app[data-view="live-game"] #main-content {
    padding: 0;
}

#main-content h1,
.report-masthead,
.home-section__heading,
.card h2,
.live-feed__title,
.live-period-breakdown__title,
.live-leaders__title,
.admin-home__title,
.admin-dashboard__header h1,
.admin-card__header h2 {
    font-family: var(--sk3-display);
    font-weight: 800;
    letter-spacing: -0.01em;
}

#main-content h1,
.report-masthead {
    text-transform: uppercase;
}

.card {
    border-radius: var(--sk3-radius-feature);
    border: 1px solid var(--border-color);
    border-top-color: var(--gold-border);
    box-shadow: var(--shadow);
}

.btn {
    min-height: 46px;
    color: var(--sk3-midnight);
    background: var(--gold-color);
    border-radius: 10px;
    box-shadow: 0 9px 22px var(--gold-glow);
    font-weight: 800;
}

.btn:hover {
    color: var(--sk3-midnight);
    background: var(--gold-hover);
    box-shadow: 0 12px 28px var(--gold-glow);
}

.btn-secondary {
    color: var(--text-color);
    background: transparent;
    border: 1px solid var(--border-color);
    box-shadow: none;
}

.btn-secondary:hover {
    color: var(--heading-color);
    background: rgba(85, 194, 255, 0.09);
    border-color: var(--sk3-blue);
}

.btn-danger {
    color: var(--sk3-white);
    background: var(--sk3-live);
    box-shadow: 0 9px 22px rgba(255, 77, 94, 0.18);
}

.form-group input,
.form-group select,
.form-group textarea,
.admin-form__field input,
.admin-form__field select {
    min-height: 46px;
    border-radius: 10px;
}

/* Home / rink lobby: broadcast hierarchy with full-width scrolling sections. */
.rink-lobby {
    width: min(100%, 1180px);
    margin: 0 auto;
    padding: 0 clamp(16px, 3vw, 34px) clamp(34px, 6vw, 64px);
}

.rink-lobby__status-bar.arena-status {
    min-height: 48px;
    margin: 0 calc(clamp(16px, 3vw, 34px) * -1) 20px;
    padding: 10px clamp(18px, 3vw, 34px);
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
    border: 0;
    border-radius: 0;
    box-shadow: none;
    font-size: 0.78rem;
    font-weight: 800;
}

.arena-status__wave,
.arena-status__count,
.arena-status__live {
    color: var(--sk3-midnight);
}

#app[data-view="main-menu"] .rink-lobby[data-mode="game-day"] .rink-lobby__status-bar.arena-status {
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
    border: 0;
    animation: none;
}

#app[data-view="main-menu"] .rink-lobby[data-mode="game-day"] .arena-status__count,
#app[data-view="main-menu"] .rink-lobby[data-mode="game-day"] .arena-status__live {
    color: var(--sk3-midnight);
}

.home-division-filter {
    max-width: none;
    margin: 0 0 18px;
    padding: 0;
}

.home-division-filter__controls,
.report-filter,
.report-tabs,
.division-filter {
    gap: 8px;
}

.home-division-filter .report-filter__label {
    color: var(--sk3-blue);
    font-size: 0.67rem;
    font-weight: 800;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.home-division-filter .report-filter__btn,
#app[data-view="main-menu"] .division-chip {
    min-height: 44px;
    padding: 8px 15px;
    color: #cbd6e4;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(246, 248, 250, 0.16);
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 800;
}

.home-division-filter .report-filter__btn.is-active,
#app[data-view="main-menu"] .division-chip.is-active {
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
    border-color: var(--sk3-electric);
    box-shadow: none;
}

.home-section__heading {
    margin: 28px 0 12px;
    color: var(--sk3-white);
    font-size: clamp(1.45rem, 3vw, 2rem);
    text-transform: uppercase;
}

.home-section__heading--hero {
    margin-top: 0;
}

.home-section__desc {
    color: #a9b8cc;
    font-family: var(--sk3-ui);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
}

.next-game-card,
.hero-scoreboard__card {
    max-width: none;
    min-height: 270px;
    margin: 0;
    padding: clamp(22px, 4vw, 40px);
    overflow: hidden;
    background:
        radial-gradient(circle at 100% 0%, rgba(229, 247, 10, 0.16), transparent 17rem),
        linear-gradient(135deg, var(--sk3-panel), var(--sk3-midnight));
    border: 1px solid rgba(229, 247, 10, 0.34);
    border-radius: var(--sk3-radius-feature);
    box-shadow: var(--sk3-shadow-arena);
}

.next-game-card__eyebrow,
.hero-scoreboard__badge,
.next-game-card__countdown,
.hero-scoreboard__cta {
    color: var(--sk3-electric);
}

.next-game-card__team-name,
.next-game-card__team-word,
.hero-scoreboard__team {
    color: var(--sk3-ice);
    font-family: var(--sk3-display);
    font-weight: 700;
}

.next-game-card__vs-emblem {
    color: inherit;
    background: transparent;
}

.next-game-card__vs-text {
    color: var(--sk3-electric);
    background: rgba(229, 247, 10, 0.08);
    border-color: rgba(229, 247, 10, 0.45);
    box-shadow: 0 0 12px rgba(229, 247, 10, 0.12);
}

.next-game-card__watch-btn,
.next-game-card__notify-btn {
    min-height: 46px;
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
    border-color: var(--sk3-electric);
    border-radius: 10px;
    font-weight: 800;
}

.next-game-card__notify-btn {
    width: 44px;
    height: 44px;
    min-height: 44px;
    padding: 0;
    border-radius: 50%;
}

.hero-scoreboard__score {
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: clamp(2.8rem, 8vw, 5rem);
}

.live-pulse,
.live-status--live::before {
    background: var(--sk3-live);
    box-shadow: 0 0 0 5px rgba(255, 77, 94, 0.14);
}

.content-carousel__card,
.summary-card,
.game-result-card,
.recent-finals__card,
.rink-social,
.rink-feed,
.rink-ops-dock,
.live-teaser__card {
    background: rgba(11, 42, 88, 0.68);
    border-color: rgba(246, 248, 250, 0.15);
    box-shadow: none;
}

.content-carousel__card:hover,
.recent-finals__card:hover {
    border-color: rgba(229, 247, 10, 0.42);
    box-shadow: 0 16px 36px rgba(0, 8, 24, 0.24);
}

.content-carousel__card h3,
.summary-card__header,
.recent-finals__heading,
.rink-feed__title {
    color: var(--sk3-white);
    font-family: var(--sk3-display);
}

.rink-ops-dock {
    max-width: none;
    margin-top: 34px;
    background: rgba(3, 14, 33, 0.58);
    border-radius: var(--sk3-radius-feature);
}

.rink-ops-dock__eyebrow {
    color: var(--sk3-blue);
    letter-spacing: 0.15em;
}

.rink-ops-dock__action--primary {
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
    box-shadow: 0 8px 20px rgba(229, 247, 10, 0.16);
}

#app[data-view="main-menu"] .scorekeeper-entry-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin: 12px 0 18px;
    padding: 10px 12px;
    border: 1px solid rgba(82, 183, 255, 0.28);
    border-radius: 12px;
    background: rgba(3, 14, 33, 0.5);
}

#app[data-view="main-menu"] .scorekeeper-entry-strip__copy {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 9px;
    min-width: 0;
    color: rgba(246, 248, 250, 0.7);
    font-size: 0.78rem;
}

#app[data-view="main-menu"] .scorekeeper-entry-strip__copy strong {
    color: var(--sk3-white);
}

#app[data-view="main-menu"] .scorekeeper-entry-strip__action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    gap: 7px;
    min-height: 44px;
    padding: 9px 14px;
    border: 1px solid rgba(229, 247, 10, 0.58);
    border-radius: 999px;
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
    font: inherit;
    font-size: 0.8rem;
    font-weight: 850;
    cursor: pointer;
}

#app[data-view="main-menu"] .scorekeeper-entry-strip__action:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(229, 247, 10, 0.18);
}

#app[data-view="main-menu"] .scorekeeper-entry-strip__action:focus-visible {
    outline: 3px solid var(--sk3-blue);
    outline-offset: 2px;
}

#app[data-view="main-menu"] .scorekeeper-entry-strip__icon {
    width: 1rem;
    height: 1rem;
}

#app[data-view="main-menu"] .scorekeeper-entry-strip__admin {
    min-height: 44px;
    padding: 8px 12px;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 8px;
    background: transparent;
    color: #e3eaf3;
    cursor: pointer;
}

#app[data-view="main-menu"] .scorekeeper-entry-strip__admin:focus-visible {
    outline: 2px solid #f6b83f;
    outline-offset: 3px;
}

@media (max-width: 640px) {
    #app[data-view="main-menu"] .scorekeeper-entry-strip {
        align-items: stretch;
        flex-direction: column;
        gap: 9px;
    }

    #app[data-view="main-menu"] .scorekeeper-entry-strip__copy {
        display: grid;
        gap: 2px;
    }

    #app[data-view="main-menu"] .scorekeeper-entry-strip__action {
        width: 100%;
    }
}

.live-teaser__card {
    border-color: rgba(255, 77, 94, 0.38);
    background: linear-gradient(135deg, rgba(255, 77, 94, 0.09), rgba(11, 42, 88, 0.7));
}

.live-teaser__badge,
.live-teaser__crowd strong {
    color: var(--sk3-live);
}

/* Live game: score first, then the supporting broadcast modules. */
#app[data-view="live-game"] #top-navigation {
    top: 0;
    padding: 0;
}

#app[data-view="game-selection"] #top-navigation,
#app[data-view="attendance"] #top-navigation,
#app[data-view="scoring"] #top-navigation,
#app[data-view="final-review"] #top-navigation,
#app[data-view="goal-details"] #top-navigation,
#app[data-view="penalty-details"] #top-navigation,
#app[data-view="overtime"] #top-navigation {
    top: 0;
    padding: 0;
}

.live-nav {
    display: grid;
    flex: 1 1 100%;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    width: 100%;
    min-width: 0;
    min-height: 64px;
    padding: 0 clamp(14px, 3vw, 24px);
    background: rgba(6, 27, 59, 0.98);
    border: 0;
    border-bottom: 1px solid rgba(246, 248, 250, 0.14);
    border-radius: 0;
}

.live-nav__title {
    display: inline-flex;
    grid-column: 2;
    align-items: center;
    justify-self: center;
}

.live-nav__brand-mark {
    display: block;
    width: 154px;
    max-width: 100%;
    height: auto;
}

.live-nav__back {
    grid-column: 1;
    justify-self: start;
}

.live-nav__actions {
    grid-column: 3;
    justify-self: end;
    margin-left: 0;
}

.live-nav__back,
.live-nav__account,
.live-nav__share {
    min-height: 44px;
    color: var(--sk3-ice);
    background: rgba(246, 248, 250, 0.055);
    border: 1px solid rgba(246, 248, 250, 0.14);
    border-radius: 10px;
}

.live-nav__back {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding-inline: 10px 12px;
}

.live-nav__account {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    min-height: 40px;
    padding: 0;
}

.live-nav__account[data-authenticated="false"] {
    color: var(--sk3-ice);
    background: rgba(246, 248, 250, 0.055);
    border-color: rgba(246, 248, 250, 0.14);
}

.live-nav__share {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    min-height: 40px;
    padding: 0;
}

.live-nav__back:hover,
.live-nav__account:hover,
.live-nav__share:hover {
    color: var(--sk3-white);
    background: rgba(246, 248, 250, 0.11);
    border-color: rgba(229, 247, 10, 0.58);
}

.live-nav__back-icon,
.live-nav__account-icon,
.live-nav__share-icon,
.live-nav__share-success {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.live-nav__share-success {
    display: none;
    color: var(--sk3-electric);
}

.live-nav__share[data-copied="true"] .live-nav__share-icon {
    display: none;
}

.live-nav__share[data-copied="true"] .live-nav__share-success {
    display: block;
}

.live-view {
    max-width: 960px;
    padding: clamp(18px, 3vw, 32px);
}

.live-scoreboard {
    padding: clamp(24px, 5vw, 48px);
    background:
        radial-gradient(circle at 100% 0%, rgba(229, 247, 10, 0.15), transparent 18rem),
        linear-gradient(135deg, var(--sk3-panel), var(--sk3-midnight));
    border: 1px solid rgba(229, 247, 10, 0.33);
    border-radius: var(--sk3-radius-feature);
    box-shadow: var(--sk3-shadow-arena);
}

.live-scoreboard--error {
    min-height: 250px;
    display: grid;
    align-content: center;
    justify-items: start;
    gap: 10px;
    text-align: left;
    border-color: rgba(255, 77, 94, 0.55);
}

.live-scoreboard--error h1,
.live-scoreboard--error p {
    margin: 0;
}

.live-scoreboard--error h1 {
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: clamp(2rem, 6vw, 3.4rem);
    line-height: 1;
    text-transform: uppercase;
}

.live-scoreboard--error > p:not(.live-load-error__eyebrow):not(.live-load-error__detail) {
    max-width: 58ch;
    color: #c4cfdd;
    line-height: 1.55;
}

.live-load-error__eyebrow {
    color: var(--sk3-live);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.live-load-error__detail {
    color: #f5c451;
    font-size: 0.82rem;
    font-weight: 750;
}

.live-load-error__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    margin-top: 8px;
    color: #a9b8cc;
    font-size: 0.78rem;
}

.live-load-error__retry {
    min-height: 44px;
    padding: 0 20px;
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
    border: 1px solid var(--sk3-electric);
    border-radius: 10px;
    font-weight: 900;
    cursor: pointer;
}

.live-status--live {
    color: var(--sk3-white);
    background: var(--sk3-live);
}

.live-scoreboard__team-name,
.live-scoreboard__score,
.live-scoreboard__divider {
    font-family: var(--sk3-display);
}

.live-scoreboard__score {
    color: var(--sk3-white);
    font-size: clamp(4rem, 14vw, 7.5rem);
    line-height: 0.82;
}

.live-scoreboard__period {
    color: var(--sk3-electric);
    font-weight: 800;
}

.live-game-context {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 9px 12px;
    color: #b9c7d8;
    background: rgba(6, 27, 59, 0.72);
    border: 1px solid rgba(246, 248, 250, 0.13);
    border-radius: 14px;
    box-shadow: inset 0 1px 0 rgba(246, 248, 250, 0.04);
}

.live-game-context__phase {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    flex: 0 0 auto;
    padding: 5px 9px;
    color: var(--sk3-white);
    background: rgba(85, 194, 255, 0.14);
    border: 1px solid rgba(85, 194, 255, 0.32);
    border-radius: 999px;
    font-family: var(--sk3-display);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
}

.live-game-context__phase::before {
    width: 7px;
    height: 7px;
    background: var(--sk3-blue);
    border-radius: 50%;
    content: '';
}

.live-game-context--live .live-game-context__phase {
    background: rgba(255, 71, 87, 0.14);
    border-color: rgba(255, 71, 87, 0.42);
}

.live-game-context--live .live-game-context__phase::before {
    background: var(--sk3-live);
    box-shadow: 0 0 0 4px rgba(255, 71, 87, 0.13);
}

.live-game-context--archive .live-game-context__phase {
    color: var(--sk3-electric);
    background: rgba(229, 247, 10, 0.08);
    border-color: rgba(229, 247, 10, 0.28);
}

.live-game-context--archive .live-game-context__phase::before {
    background: var(--sk3-electric);
}

.live-game-context__season {
    flex: 0 0 auto;
    color: var(--sk3-white);
    font-size: 0.82rem;
    font-weight: 800;
}

.live-game-context__coverage {
    min-width: 0;
    margin-left: auto;
    font-size: 0.78rem;
    font-weight: 650;
    text-align: right;
}

.live-analysis {
    display: grid;
    gap: 16px;
    padding: clamp(16px, 3vw, 24px);
    background:
        radial-gradient(circle at 0% 0%, rgba(229, 247, 10, 0.075), transparent 18rem),
        linear-gradient(145deg, rgba(6, 27, 59, 0.92), rgba(3, 17, 39, 0.9));
    border: 1px solid rgba(229, 247, 10, 0.2);
    border-radius: var(--sk3-radius-feature);
    box-shadow: 0 18px 44px rgba(0, 8, 24, 0.22);
}

.live-analysis__header {
    display: grid;
    gap: 5px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(246, 248, 250, 0.12);
}

.live-analysis__header h2,
.live-analysis__header p {
    margin: 0;
}

.live-analysis__header h2 {
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: clamp(1.65rem, 4vw, 2.35rem);
    line-height: 0.98;
}

.live-analysis__header p {
    max-width: 42rem;
    color: #b9c7d8;
    font-size: 0.88rem;
    line-height: 1.45;
}

.live-analysis__eyebrow {
    color: var(--sk3-electric);
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.live-analysis__modules {
    display: grid;
    gap: 14px;
}

.live-analysis__modules > * {
    margin: 0;
}

.live-pregame-preview {
    display: grid;
    gap: 10px;
    padding: clamp(16px, 3vw, 22px);
    background: rgba(246, 248, 250, 0.055);
    border: 1px solid rgba(246, 248, 250, 0.14);
    border-radius: 14px;
}

.live-pregame-preview h3,
.live-pregame-preview p {
    margin: 0;
}

.live-pregame-preview h3 {
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: clamp(1.35rem, 3.5vw, 1.9rem);
    line-height: 1.05;
}

.live-pregame-preview > p:not(.live-pregame-preview__kicker) {
    max-width: 48rem;
    color: #c9d5e4;
    line-height: 1.55;
}

.live-pregame-preview__kicker {
    color: var(--sk3-electric);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.live-pregame-preview__action {
    justify-self: start;
    min-height: 42px;
    margin-top: 4px;
    padding: 0.7rem 1rem;
    color: #07162e;
    background: var(--sk3-electric);
    border: 1px solid var(--sk3-electric);
    border-radius: 10px;
    font: inherit;
    font-size: 0.84rem;
    font-weight: 900;
    cursor: pointer;
}

.live-pregame-preview__action:hover,
.live-pregame-preview__action:focus-visible {
    color: var(--sk3-white);
    background: rgba(229, 247, 10, 0.12);
    outline: none;
}

.live-fan-zone {
    display: grid;
    gap: 14px;
    padding: clamp(16px, 3vw, 24px);
    background:
        radial-gradient(circle at 100% 0%, rgba(85, 194, 255, 0.12), transparent 18rem),
        rgba(6, 27, 59, 0.82);
    border: 1px solid rgba(85, 194, 255, 0.3);
    border-radius: var(--sk3-radius-feature);
    box-shadow: 0 18px 44px rgba(0, 8, 24, 0.2);
}

.live-fan-zone--archive {
    background:
        radial-gradient(circle at 100% 0%, rgba(229, 247, 10, 0.07), transparent 18rem),
        rgba(6, 27, 59, 0.82);
    border-color: rgba(246, 248, 250, 0.18);
}

.live-fan-zone__header {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
}

.live-fan-zone__header h2,
.live-fan-zone__header p {
    margin: 0;
}

.live-fan-zone__header h2 {
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: clamp(1.55rem, 4vw, 2.15rem);
    line-height: 1;
}

.live-fan-zone__header p {
    max-width: 28rem;
    color: #b9c7d8;
    font-size: 0.9rem;
    text-align: right;
}

.live-fan-zone__eyebrow {
    display: block;
    margin-bottom: 4px;
    color: var(--sk3-electric);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.live-fan-zone > .live-crowd,
.live-fan-zone > .rink-feed {
    margin: 0;
}

.live-fan-zone > .live-crowd {
    background: rgba(11, 42, 88, 0.74);
}

.live-fan-zone > .rink-feed {
    border-color: rgba(85, 194, 255, 0.28);
}

.rink-feed__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 3px;
}

.rink-feed__action {
    min-height: 30px;
    padding: 3px 8px;
    color: #cbd8e8;
    background: rgba(246, 248, 250, 0.06);
    border: 1px solid rgba(246, 248, 250, 0.2);
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 800;
}

.rink-feed__action:hover,
.rink-feed__action:focus-visible {
    color: var(--sk3-white);
    background: rgba(85, 194, 255, 0.18);
    border-color: var(--sk3-blue);
}

.google-signin-benefits {
    display: grid;
    gap: 0.5rem;
    margin: -0.55rem 0 1.35rem;
    padding-left: 1.25rem;
    color: #c7d3e3;
    font-size: 0.88rem;
    line-height: 1.4;
    text-align: left;
}

.social-account-modal__danger {
    display: grid;
    justify-items: start;
    gap: 0.35rem;
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(148, 163, 184, 0.28);
}

.social-account-modal__danger p {
    margin: 0;
    color: #64748b;
    font-size: 0.8rem;
}

.social-account-modal__delete {
    min-height: 38px;
    padding: 0.4rem 0;
    color: #9f1239;
    background: transparent;
    border: 0;
    font: inherit;
    font-size: 0.84rem;
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.social-account-modal__delete:hover,
.social-account-modal__delete:focus-visible {
    color: #be123c;
}

.live-connection,
.live-crowd,
.live-win-probability,
.live-flow-chart,
.live-period-breakdown,
.live-leaders,
.live-h2h,
.live-feed,
.live-summary,
.live-share,
.pre-game-waiting-room {
    background: rgba(11, 42, 88, 0.65);
    border-color: rgba(246, 248, 250, 0.15);
    border-radius: var(--sk3-radius-feature);
    box-shadow: none;
}

.live-connection--connected .live-connection__dot {
    background: var(--sk3-saved);
}

.live-event--goal {
    border-left-color: var(--sk3-electric);
}

.live-event {
    position: relative;
}

.live-event__header {
    padding-right: 38px;
}

.live-event__share {
    position: absolute;
    top: 10px;
    right: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    color: #c9d5e4;
    background: rgba(246, 248, 250, 0.055);
    border: 1px solid rgba(246, 248, 250, 0.15);
    border-radius: 9px;
}

.live-event__share:hover,
.live-event__share:focus-visible {
    color: var(--sk3-white);
    background: rgba(246, 248, 250, 0.11);
    border-color: rgba(229, 247, 10, 0.58);
}

.live-event__share-icon,
.live-event__share-success,
.live-share__icon,
.live-share__success {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.live-event__share-success,
.live-share__success,
.live-share__label-success {
    display: none;
}

.live-event__share[data-copied="true"] .live-event__share-icon,
.live-share__btn[data-copied="true"] .live-share__icon,
.live-share__btn[data-copied="true"] .live-share__label-default {
    display: none;
}

.live-event__share[data-copied="true"] .live-event__share-success,
.live-share__btn[data-copied="true"] .live-share__success,
.live-share__btn[data-copied="true"] .live-share__label-success {
    display: inline-flex;
}

.live-event__share[data-copied="true"],
.live-share__btn[data-copied="true"] {
    color: var(--sk3-saved);
}

.live-share__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 18px;
    gap: 8px;
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
    border: 1px solid var(--sk3-electric);
    border-radius: 10px;
    font-weight: 900;
}

.live-share__btn:hover {
    color: var(--sk3-midnight);
    background: var(--sk3-electric-soft);
    border-color: var(--sk3-electric-soft);
}

.live-event--goal .live-event__type,
.live-event__tag--impact,
.live-event__tag--hat-trick {
    color: var(--sk3-electric-soft);
}

.live-win-probability__home,
.live-crowd__bar-segment--home {
    background: var(--sk3-electric);
}

.live-win-probability__away,
.live-crowd__bar-segment--away {
    background: var(--sk3-blue);
}

/* Live scoring / rink operations. */
#app[data-view="scoring"],
#app[data-view="final-review"] {
    max-width: 980px;
}

.scoring-live-card,
.final-review-card {
    background: rgba(11, 42, 88, 0.78);
    border-color: rgba(246, 248, 250, 0.15);
}

.scoring-live-topline,
.scoring-live-schedule {
    color: #a9b8cc;
}

.scoring-sync-compact--saved {
    color: #7ae5b2;
    background: rgba(39, 193, 124, 0.12);
}

.scoreboard {
    padding: clamp(18px, 4vw, 34px);
    background:
        radial-gradient(circle at 50% -30%, rgba(85, 194, 255, 0.15), transparent 20rem),
        var(--sk3-midnight);
    border: 1px solid rgba(229, 247, 10, 0.28);
    border-radius: var(--sk3-radius-feature);
    box-shadow: var(--sk3-shadow-arena);
}

.scoreboard .team h2,
.scoreboard .score,
.scoreboard-period-label {
    font-family: var(--sk3-display);
}

.scoreboard .score {
    color: var(--sk3-white);
    font-size: clamp(3.5rem, 11vw, 6.5rem);
}

.scoreboard-period-label {
    color: var(--sk3-electric);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.team-goal-button,
.score-btn-hero,
.score-actions-live .btn:not(.btn-danger) {
    min-height: 56px;
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
    border-radius: 10px;
    box-shadow: 0 10px 24px rgba(229, 247, 10, 0.17);
    font-family: var(--sk3-display);
    font-size: 1.25rem;
    font-weight: 800;
    text-transform: uppercase;
}

.shot-stepper__button,
.period-btn,
.team-swap-compact,
.score-btn-undo {
    color: var(--sk3-ice);
    background: #102f5f;
    border-color: rgba(246, 248, 250, 0.16);
}

.shot-stepper__button {
    min-height: 56px;
}

.period-btn,
.team-swap-compact,
.score-btn-undo {
    min-height: 44px;
}

.scoreboard .team-position-label,
.attendance-card .team-position-label {
    color: #a9b8cc;
    background: rgba(85, 194, 255, 0.09);
    border-color: rgba(85, 194, 255, 0.28);
}

.scoreboard .team-position-label strong,
.attendance-card .team-position-label strong {
    color: var(--sk3-white);
}

.period-btn.is-active {
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
    border-color: var(--sk3-electric);
}

.game-events-panel,
.scoring-sync-card,
.score-submit-callout,
.attendance-summary,
.final-verification {
    background: rgba(11, 42, 88, 0.62);
    border-color: rgba(246, 248, 250, 0.15);
    border-radius: var(--sk3-radius-data);
}

.final-review-decision__hint {
    display: block;
    margin-top: 6px;
    color: #f5c451;
    font-size: 0.78rem;
    font-weight: 750;
}

.final-review-decision [data-action="record-overtime"]:disabled {
    cursor: not-allowed;
    opacity: 0.48;
}

#app[data-view="overtime"] {
    max-width: 880px;
}

.overtime-decision-card {
    width: min(100%, 880px);
    margin-inline: auto;
}

.overtime-decision-heading {
    max-width: 680px;
    margin: 0 auto 22px;
    text-align: center;
}

#app[data-view="overtime"] .overtime-decision-heading h1 {
    margin: 5px 0 8px;
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: clamp(2.5rem, 8vw, 4.7rem);
    line-height: 0.9;
    text-transform: uppercase;
}

.overtime-decision-heading > p:last-child {
    margin: 0;
    color: #b8c7da;
}

.overtime-decision-score {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    padding: clamp(16px, 4vw, 24px);
    border: 1px solid rgba(229, 247, 10, 0.28);
    border-radius: 16px;
    background:
        radial-gradient(circle at 50% -40%, rgba(85, 194, 255, 0.18), transparent 17rem),
        var(--sk3-midnight);
}

.overtime-decision-score > div,
.overtime-decision-score > p {
    display: grid;
    justify-items: center;
    gap: 3px;
    margin: 0;
    text-align: center;
}

.overtime-decision-score span {
    color: #bdcada;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.overtime-decision-score > div > strong {
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: clamp(3rem, 10vw, 5.4rem);
    line-height: 1;
}

.overtime-decision-score > p > strong {
    color: var(--sk3-electric);
    font-size: 1.25rem;
}

.overtime-rule-note,
.overtime-readiness {
    margin-top: 14px;
    padding: 14px 16px;
    border: 1px solid rgba(246, 248, 250, 0.15);
    border-radius: 12px;
    background: rgba(6, 27, 59, 0.58);
}

.overtime-rule-note > strong,
.overtime-readiness > strong {
    color: var(--sk3-white);
}

.overtime-rule-note p,
.overtime-readiness p,
.overtime-readiness ul {
    margin: 5px 0 0;
    color: #b8c7da;
}

.overtime-readiness--ready {
    border-color: rgba(113, 230, 160, 0.38);
    background: rgba(39, 193, 124, 0.1);
}

.overtime-readiness--warning {
    border-color: rgba(245, 196, 81, 0.42);
    background: rgba(245, 196, 81, 0.08);
}

.overtime-readiness--blocked {
    border-color: rgba(216, 77, 90, 0.42);
    background: rgba(180, 47, 60, 0.1);
}

.overtime-team-options--submit {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
}

#app[data-view="overtime"] .overtime-team-choice {
    display: grid;
    justify-items: center;
    gap: 4px;
    min-height: 124px;
    padding: 18px 14px;
    border: 1px solid rgba(229, 247, 10, 0.42);
    border-radius: 14px;
    background: #102f5f;
    box-shadow: 0 12px 28px rgba(1, 8, 22, 0.2);
    text-transform: none;
}

#app[data-view="overtime"] .overtime-team-choice span {
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: clamp(1.25rem, 4vw, 1.8rem);
    text-transform: uppercase;
}

#app[data-view="overtime"] .overtime-team-choice strong {
    color: var(--sk3-electric);
    font-size: 1.05rem;
}

#app[data-view="overtime"] .overtime-team-choice small {
    color: #b8c7da;
    font-size: 0.76rem;
    font-weight: 750;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

#app[data-view="overtime"] .overtime-team-choice:not(:disabled):hover,
#app[data-view="overtime"] .overtime-team-choice:not(:disabled):focus-visible,
#app[data-view="overtime"] .overtime-team-choice.is-active {
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
    border-color: var(--sk3-electric);
    transform: translateY(-1px);
}

#app[data-view="overtime"] .overtime-team-choice:not(:disabled):hover :where(span, strong, small),
#app[data-view="overtime"] .overtime-team-choice:not(:disabled):focus-visible :where(span, strong, small),
#app[data-view="overtime"] .overtime-team-choice.is-active :where(span, strong, small) {
    color: var(--sk3-midnight);
}

#app[data-view="overtime"] .overtime-team-choice:disabled {
    cursor: not-allowed;
    opacity: 0.48;
}

.overtime-decision-actions {
    justify-content: center;
    margin-top: 18px;
}

@media (max-width: 640px) {
    .overtime-decision-score {
        gap: 8px;
        padding: 16px 8px;
    }

    .overtime-decision-score span {
        font-size: 0.66rem;
    }

    .overtime-team-options--submit {
        grid-template-columns: minmax(0, 1fr);
    }

    #app[data-view="overtime"] .overtime-team-choice {
        min-height: 108px;
    }
}

/* Stats: crisp tables, dense data, clear selected state. */
#app[data-view="statistics"] #main-content,
#app[data-view="rink-report"] #main-content,
#app[data-view^="admin-"] #main-content,
#app[data-view="scouting-report"] #main-content {
    width: min(100%, 1180px);
    margin: 0 auto;
}

.stats-card {
    padding: clamp(20px, 4vw, 38px);
    text-align: left;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.stats-card h2 {
    color: var(--sk3-midnight);
    font-size: clamp(1.7rem, 3vw, 2.35rem);
    text-transform: uppercase;
}

.stats-toolbar,
.report-toolbar {
    padding: 14px;
    background: var(--sk3-white);
    border: 1px solid var(--sk3-border);
    border-radius: var(--sk3-radius-data);
    box-shadow: 0 9px 24px rgba(6, 27, 59, 0.055);
}

.stats-select,
.report-chip-select select {
    min-height: 44px;
    color: var(--sk3-ink);
    background: var(--sk3-white);
    border-color: var(--sk3-border);
}

#app[data-view="statistics"] .division-chip,
#app[data-view="rink-report"] .report-filter__btn,
#app[data-view="rink-report"] .rr-nav__item {
    min-height: 42px;
    color: var(--sk3-slate);
    background: var(--sk3-white);
    border: 1px solid var(--sk3-border);
    border-radius: 999px;
    box-shadow: none;
}

#app[data-view="statistics"] .division-chip.is-active,
#app[data-view="rink-report"] .report-filter__btn.is-active,
#app[data-view="rink-report"] .rr-nav__item--active,
#app[data-view="admin-share"] .admin-share__surface .division-chip.is-active,
#app[data-view="admin-share"] .admin-share__surface .report-filter__btn.is-active,
#app[data-view="admin-share"] .admin-share__surface .rr-nav__item--active {
    color: var(--sk3-white);
    background: var(--sk3-midnight);
    border-color: var(--sk3-midnight);
}

.stats-table-container,
.report-table-wrapper {
    overflow: auto;
    background: var(--sk3-white);
    border: 1px solid var(--sk3-border);
    border-radius: var(--sk3-radius-data);
    box-shadow: var(--sk3-shadow-ice);
}

.stats-table,
.report-table,
.admin-table {
    color: var(--sk3-slate);
    background: var(--sk3-white);
}

.stats-table thead,
.stats-table thead th,
.report-table thead,
.report-table th,
.admin-table thead th {
    color: var(--sk3-white);
    background: var(--sk3-midnight);
}

.stats-table tbody tr:nth-child(even),
.report-table tbody tr:nth-child(even),
.admin-table tbody tr:nth-child(even) {
    background: #f0f3f6;
}

.stats-table tbody tr:hover,
.report-table tbody tr:hover,
.admin-table tbody tr:hover {
    background: rgba(85, 194, 255, 0.1);
}

.stats-rank-badge,
.stats-table tbody tr:first-child .stats-rank-badge {
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
}

.stats-flyout__panel {
    color: var(--sk3-ink);
    background: var(--sk3-white);
    border-color: var(--sk3-border);
    border-radius: var(--sk3-radius-feature);
}

/* Rink Report: newspaper-like masthead, then modular report cards. */
.report-wrap {
    color: var(--sk3-ink);
}

#app[data-view="rink-report"] #main-content .report-masthead {
    margin: 8px 0 0;
    color: var(--sk3-midnight);
    font-size: clamp(3.3rem, 8vw, 6.3rem);
    line-height: 0.88;
    letter-spacing: -0.035em;
    text-align: left;
}

#app[data-view="rink-report"] .report-subtitle {
    margin: 8px 0 24px;
    color: var(--sk3-steel);
    font-size: 0.9rem;
    text-align: left;
}

.report-toolbar {
    position: sticky;
    z-index: 20;
    top: 120px;
}

.report-content,
.report-card,
.report-card--front-page,
.rr-last-week-boxscore,
.rr-star-card,
.rr-storyline,
.player-watch-card,
.front-section {
    color: var(--sk3-slate);
}

/* Matchup previews intentionally stay in Arena colors inside the Ice report.
   Keep their text tokens dark-surface aware instead of inheriting Ice colors. */
.matchup-card {
    --report-link-color: #d7e4ff;
    color: var(--sk3-white);
    border-color: rgba(85, 194, 255, 0.28);
    box-shadow: 0 14px 30px rgba(6, 27, 59, 0.16);
}

.matchup-card header strong {
    color: var(--sk3-white);
}

.matchup-card__time,
.matchup-card__detail-block h4,
.matchup-card__detail-block--meta p {
    color: #a9b8cc;
}

.matchup-card__projection {
    --report-link-color: var(--sk3-electric-soft);
    color: var(--sk3-electric);
    border-top-color: rgba(246, 248, 250, 0.16);
}

.report-card,
.report-card--front-page,
.rr-last-week-boxscore,
.rr-star-card,
.rr-storyline,
.player-watch-card,
.front-section {
    background: var(--sk3-white);
    border-color: var(--sk3-border);
    border-radius: var(--sk3-radius-data);
    box-shadow: 0 10px 28px rgba(6, 27, 59, 0.065);
}

.report-section-title,
.front-section__title,
.rr-section-heading,
.rr-star-card h4,
.player-watch-card__header {
    color: var(--sk3-midnight);
    font-family: var(--sk3-display);
    font-weight: 800;
    text-transform: uppercase;
}

.report-lede--hero {
    color: var(--sk3-slate);
    border-left-color: var(--sk3-electric);
}

.report-stat-strip {
    color: var(--sk3-white);
    background: var(--sk3-midnight);
    border-radius: var(--sk3-radius-data);
}

.report-stat-strip__value,
.front-leader__stat--pts {
    color: var(--sk3-electric);
}

.rr-star-card--rank-1 {
    border-top-color: #d99b14;
}

.rr-star-card--rank-2 {
    border-top-color: #738096;
}

.rr-star-card--rank-3 {
    border-top-color: #a9663a;
}

/* Admin / league operations follows the Ice data language. */
.admin-home,
.admin-dashboard,
.admin-share {
    color: var(--sk3-ink);
}

.admin-home__header h1,
.admin-dashboard__header h1,
.admin-share__header h1 {
    color: var(--sk3-midnight);
    font-size: clamp(2.4rem, 6vw, 4.5rem);
    text-transform: uppercase;
}

.admin-home__tile,
.admin-home__status-card,
.admin-card,
.admin-share__card,
.ops-kpi,
.ops-stat {
    color: var(--sk3-slate);
    background: var(--sk3-white);
    border-color: var(--sk3-border);
    border-radius: var(--sk3-radius-data);
    box-shadow: 0 10px 28px rgba(6, 27, 59, 0.065);
}

.admin-home__tile:hover,
.admin-card:hover {
    border-color: var(--sk3-blue);
    box-shadow: var(--sk3-shadow-ice);
}

.admin-home__icon,
.admin-pill--current {
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
}

.admin-home__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 14px;
}

.admin-home__icon svg {
    width: 25px;
    height: 25px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.admin-analysis__severity--high,
.admin-analysis__priority--high,
.admin-home__status-pill--high {
    color: #9f241b;
    background: #fee4e2;
}

.admin-analysis__severity--medium,
.admin-analysis__priority--medium,
.admin-home__status-pill--medium {
    color: #7a4307;
    background: #fff1cc;
}

.admin-analysis__severity--low,
.admin-analysis__priority--low,
.admin-home__status-pill--low,
.admin-analysis__status-pill.is-ready {
    color: var(--sk3-saved-text);
    background: #dff8ec;
}

.admin-analysis__status-pill.is-fallback {
    color: #7a4307;
    background: #fff1cc;
}

/* Social-share canvases reserve a branded rail instead of overlaying reports. */
.admin-share .admin-share__surface,
.admin-share__export-root .admin-share__surface {
    display: grid;
    grid-template-rows: minmax(0, 1fr) 112px;
    overflow: hidden;
}

.admin-share .admin-share__content,
.admin-share__export-root .admin-share__content {
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: var(--sk3-ice);
    border-radius: 10px 10px 0 0;
}

.admin-share .admin-share__brand-rail,
.admin-share__export-root .admin-share__brand-rail {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 112px;
    padding: 16px 40px;
    overflow: hidden;
    background: var(--sk3-midnight);
    border-top: 4px solid var(--sk3-electric);
    border-radius: 0 0 10px 10px;
    box-sizing: border-box;
}

.admin-share .admin-share__brand-wordmark,
.admin-share__export-root .admin-share__brand-wordmark {
    display: block;
    width: 312px;
    max-width: 100%;
    height: auto;
}

.admin-share__export-root .admin-share__surface--export,
.admin-share__export-root .admin-share__surface--export > * {
    border-radius: 0;
    box-shadow: none;
}

.admin-form__status[data-variant="success"] {
    color: var(--sk3-saved-text);
}

.admin-form__status[data-variant="error"] {
    color: #9f241b;
}

/* Responsive layout and safe-area handling. */
@media (min-width: 769px) {
    #app[data-view="main-menu"],
    #app[data-view="statistics"],
    #app[data-view="rink-report"],
    #app[data-view="scouting-report"],
    #app[data-view^="admin-"] {
        max-width: 1280px;
    }

    #app[data-view="game-selection"],
    #app[data-view="attendance"],
    #app[data-view="scoring"],
    #app[data-view="final-review"],
    #app[data-view="goal-details"],
    #app[data-view="penalty-details"],
    #app[data-view="overtime"],
    #app[data-view="live-game"] {
        max-width: 980px;
    }

    #top-navigation > .nav-btn[data-action="back-to-menu"] {
        display: none;
    }

    .desktop-nav {
        display: flex;
        width: 100%;
        min-height: 52px;
        padding: 0;
        gap: 2px;
        justify-content: center;
        background: transparent;
        border: 0;
        border-radius: 0;
        backdrop-filter: none;
    }

    #app[data-view="live-game"] .primary-nav {
        display: none;
    }

    .desktop-nav__link {
        position: relative;
        display: inline-flex;
        align-items: center;
        min-height: 52px;
        padding: 0 18px;
        color: #c4cfdd;
        background: transparent;
        border-radius: 0;
        font-size: 0.75rem;
    }

    .desktop-nav__link:hover {
        color: var(--sk3-white);
        background: rgba(255, 255, 255, 0.045);
    }

    .desktop-nav__link--active,
    .desktop-nav__link--active:hover {
        color: var(--sk3-white);
        background: transparent;
    }

    .desktop-nav__link--active::after {
        position: absolute;
        right: 18px;
        bottom: 0;
        left: 18px;
        height: 4px;
        content: "";
        background: var(--sk3-electric);
        border-radius: 4px 4px 0 0;
    }

    .desktop-nav__link:focus-visible {
        outline-color: var(--sk3-blue);
    }

    .rink-lobby {
        display: grid;
        grid-template-columns: minmax(0, 1.55fr) minmax(300px, 0.75fr);
        column-gap: 18px;
    }

    .rink-lobby__status-bar,
    .rink-lobby__division-filter,
    .rink-social,
    .home-section,
    .rink-lobby__live-teaser,
    .rink-lobby__recent-finals,
    .rink-lobby__footer {
        grid-column: 1 / -1;
    }

    .rink-lobby__hero-slot {
        grid-column: 1 / -1;
    }

    .tonight-carousel__card.next-game-card {
        padding: 24px 20px 22px;
    }

    .content-carousel__track,
    .tonight-carousel__track {
        scroll-padding-inline: 10px;
    }
}

@media (max-width: 768px) {
    body {
        padding: 0;
    }

    #app,
    #app[data-view] {
        max-width: 100%;
    }

    #app > header,
    .header-top-row {
        min-height: 60px;
    }

    #app > header {
        padding: 0 14px;
    }

    .scorekeeper-brand-mark {
        width: 145px;
    }

    .header-top-row .social-account-button,
    .header-top-row .push-bell {
        width: 44px;
        height: 44px;
    }

    #top-navigation {
        top: 0;
        justify-content: flex-start;
        min-height: 48px;
        padding: 0 10px;
        overflow-x: auto;
        scrollbar-width: none;
    }

    #app[data-primary-navigation="true"] #top-navigation {
        overflow: visible;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    #app[data-primary-navigation="true"]:is(
        [data-view="main-menu"],
        [data-view="games"],
        [data-view="statistics"],
        [data-view="scouting-report"],
        [data-view="rink-report"]
    ) #top-navigation {
        position: relative;
        top: auto;
        height: 0;
        min-height: 0;
        padding: 0;
        overflow: visible;
        background: transparent;
        border: 0;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    #top-navigation::-webkit-scrollbar {
        display: none;
    }

    .primary-nav {
        position: fixed;
        z-index: 240;
        right: 0;
        bottom: 0;
        left: 0;
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: minmax(0, 1fr);
        width: 100%;
        min-width: 0;
        min-height: 62px;
        margin: 0;
        padding: 4px 8px max(4px, env(safe-area-inset-bottom));
        gap: 2px;
        background: rgba(3, 14, 33, 0.98);
        border: 0;
        border-top: 1px solid rgba(246, 248, 250, 0.16);
        border-radius: 0;
        box-shadow: 0 -12px 30px rgba(0, 8, 24, 0.3);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .primary-nav .desktop-nav__link {
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 0;
        min-height: 54px;
        padding: 0 4px;
        color: #a9b8cc;
        background: transparent;
        border: 0;
        border-radius: 9px;
        font-family: var(--sk3-ui);
        font-size: 0.7rem;
        font-weight: 800;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        white-space: nowrap;
    }

    .primary-nav .desktop-nav__link--active {
        color: var(--sk3-white);
        background: transparent;
    }

    .primary-nav .desktop-nav__link--active::before {
        position: absolute;
        top: 0;
        left: 50%;
        width: 30px;
        height: 3px;
        content: "";
        background: var(--sk3-electric);
        border-radius: 0 0 3px 3px;
        transform: translateX(-50%);
    }

    .primary-nav .desktop-nav__link:focus-visible {
        outline: 3px solid var(--sk3-electric);
        outline-offset: -3px;
    }

    .primary-nav__desktop-label {
        display: none;
    }

    .primary-nav__mobile-label {
        display: inline;
    }

    .desktop-nav ~ .nav-btn[data-action="back-to-menu"] {
        display: none;
    }

    #app[data-header-visible="true"] #top-navigation {
        top: 60px;
    }

    .workflow-nav,
    .live-nav {
        min-height: 56px;
    }

    .workflow-nav__brand-mark,
    .live-nav__brand-mark {
        width: 128px;
    }

    #main-content {
        padding: 16px 12px calc(24px + env(safe-area-inset-bottom));
    }

    #app[data-primary-navigation="true"] #main-content {
        padding-bottom: calc(88px + env(safe-area-inset-bottom));
    }

    .rink-lobby {
        display: block;
        padding: 0 12px calc(92px + env(safe-area-inset-bottom));
    }

    .rink-lobby__status-bar.arena-status {
        margin: 0 -12px 16px;
        padding-inline: 14px;
    }

    .next-game-card,
    .hero-scoreboard__card {
        min-height: 0;
        padding: 20px 16px;
    }

    .home-section__heading {
        font-size: 1.45rem;
    }

    .home-section__desc {
        display: block;
        margin-top: 2px;
    }

    .live-view {
        padding: 12px 10px calc(24px + env(safe-area-inset-bottom));
    }

    .live-scoreboard {
        padding: 22px 12px;
    }

    .live-scoreboard__score {
        font-size: clamp(3.4rem, 20vw, 5.2rem);
    }

    .live-game-context {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        gap: 7px 9px;
        padding: 9px 10px;
    }

    .live-game-context__season {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .live-game-context__coverage {
        grid-column: 1 / -1;
        margin-left: 0;
        font-size: 0.74rem;
        text-align: left;
    }

    .live-analysis {
        gap: 13px;
        padding: 15px 10px;
    }

    .live-analysis__header {
        padding-inline: 4px;
    }

    .live-fan-zone {
        gap: 10px;
        padding: 14px 10px;
    }

    .live-fan-zone__header {
        display: grid;
        gap: 6px;
    }

    .live-fan-zone__header p {
        font-size: 0.84rem;
        text-align: left;
    }

    #app[data-view="rink-report"] #main-content .report-masthead {
        margin-top: 0;
        font-size: clamp(3rem, 17vw, 4.6rem);
    }

    .report-toolbar {
        top: 108px;
        margin-inline: -4px;
        padding: 10px;
    }

    .stats-card {
        padding: 4px 0 20px;
    }

    .stats-toolbar {
        align-items: stretch;
    }

    .stats-table-container,
    .report-table-wrapper,
    .admin-table {
        -webkit-overflow-scrolling: touch;
    }

    .scoreboard {
        padding: 16px 8px;
    }

    .scoreboard .score {
        font-size: clamp(3rem, 18vw, 4.8rem);
    }

    .team-goal-button,
    .score-btn-hero {
        min-height: 58px;
    }
}

@media (max-width: 430px) {
    .scorekeeper-brand-mark {
        width: 132px;
    }

    .workflow-nav,
    .live-nav {
        grid-template-columns: minmax(84px, 1fr) minmax(108px, 132px) minmax(84px, 1fr);
        padding-inline: 8px;
    }

    .workflow-nav__brand-mark,
    .live-nav__brand-mark {
        width: 122px;
    }

    .workflow-nav__context {
        display: none;
    }

    .live-nav__actions {
        flex-wrap: nowrap;
        gap: 4px;
    }

    .live-nav__account {
        width: 40px;
        height: 40px;
    }

    .live-nav__share {
        width: 40px;
        height: 40px;
    }

    .home-division-filter__controls,
    .division-filter,
    .rr-nav {
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .admin-home__header h1,
    .admin-dashboard__header h1,
    .admin-share__header h1 {
        font-size: clamp(1.8rem, 9vw, 2.2rem);
        line-height: 1;
        overflow-wrap: anywhere;
    }
}

@media (max-width: 360px) {
    .scorekeeper-brand-mark {
        width: 124px;
    }

    .workflow-nav__brand-mark,
    .live-nav__brand-mark {
        width: 112px;
    }

    .workflow-nav__back,
    .live-nav__back {
        width: 40px;
        padding: 0;
        justify-content: center;
    }

    .workflow-nav__back span,
    .live-nav__back span {
        display: none;
    }
}

/* Shared action drawer: scoring, account, and authenticated operations. */
body.sk-action-sheet-open {
    overflow: hidden;
}

.vi-spot__header {
    width: 100%;
    padding: 0;
    color: inherit;
    font: inherit;
    text-align: left;
    background: transparent;
    border: 0;
}

.sk-action-sheet-overlay {
    position: fixed;
    z-index: 10020;
    inset: 0;
    display: flex;
    justify-content: flex-end;
    background: rgba(1, 8, 22, 0.76);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.sk-action-sheet {
    width: min(480px, 100%);
    height: 100%;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    padding: max(24px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left));
    overflow: hidden;
    color: var(--sk3-ice);
    background:
        linear-gradient(rgba(85, 194, 255, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(85, 194, 255, 0.035) 1px, transparent 1px),
        var(--sk3-midnight);
    background-size: 40px 40px, 40px 40px, auto;
    border-left: 1px solid rgba(246, 248, 250, 0.17);
    box-shadow: -26px 0 70px rgba(0, 8, 24, 0.44);
}

.sk-action-sheet__body {
    min-height: 0;
    padding-right: 4px;
    overflow-y: auto;
    scrollbar-gutter: stable;
}

.sk-action-sheet__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding-bottom: 19px;
    border-bottom: 1px solid rgba(246, 248, 250, 0.16);
}

.sk-action-sheet__header > div {
    min-width: 0;
}

.sk-action-sheet__eyebrow {
    margin: 0 0 5px;
    color: var(--sk3-blue);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.sk-action-sheet__header h2 {
    margin: 0;
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: clamp(1.8rem, 5vw, 2.35rem);
    line-height: 0.98;
    overflow-wrap: anywhere;
    text-transform: uppercase;
}

.sk-action-sheet__close {
    display: inline-grid;
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    padding: 0;
    color: var(--sk3-ice);
    place-items: center;
    background: rgba(11, 42, 88, 0.86);
    border: 1px solid rgba(246, 248, 250, 0.18);
    border-radius: 11px;
}

.sk-action-sheet__close svg {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
}

.sk-action-sheet__description {
    margin: 20px 0;
    color: #c5d0df;
    line-height: 1.65;
    white-space: pre-line;
}

.sk-action-sheet__details {
    display: grid;
    gap: 9px;
    margin: 0 0 20px;
}

.sk-action-sheet__detail {
    display: grid;
    grid-template-columns: minmax(90px, 0.75fr) minmax(0, 1.25fr);
    gap: 14px;
    align-items: baseline;
    margin: 0;
    padding: 13px 14px;
    background: rgba(3, 14, 36, 0.6);
    border: 1px solid rgba(246, 248, 250, 0.11);
    border-radius: 11px;
}

.sk-action-sheet__detail dt {
    color: #a9b8cc;
}

.sk-action-sheet__detail dd {
    min-width: 0;
    margin: 0;
    color: var(--sk3-white);
    font-weight: 800;
    overflow-wrap: anywhere;
}

.sk-action-sheet__detail--good dd {
    color: #7ae5b2;
}

.sk-action-sheet__detail--warn dd {
    color: #f5d06d;
}

.sk-action-sheet__detail--danger dd {
    color: #ff9aa5;
}

.sk-action-sheet__note {
    display: grid;
    gap: 5px;
    margin: 0 0 20px;
    padding: 14px 16px;
    color: #d5deea;
    background: rgba(245, 196, 81, 0.11);
    border-left: 4px solid #f5c451;
}

.sk-action-sheet__note strong {
    color: var(--sk3-white);
}

.sk-action-sheet--success .sk-action-sheet__note {
    background: rgba(39, 193, 124, 0.1);
    border-left-color: var(--sk3-saved);
}

.sk-action-sheet__field {
    display: grid;
    gap: 7px;
    margin: 0 0 7px;
    color: var(--sk3-white);
    font-weight: 800;
}

.sk-action-sheet__field input {
    width: 100%;
    min-height: 50px;
    padding: 11px 13px;
    color: var(--sk3-white);
    background: #0b2a58;
    border: 1px solid rgba(246, 248, 250, 0.2);
    border-radius: 10px;
}

.sk-action-sheet__error {
    min-height: 1.3em;
    margin: 0 0 9px;
    color: #ff9aa5;
}

.sk-action-sheet__actions {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.35fr);
    gap: 10px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(246, 248, 250, 0.14);
}

.sk-action-sheet__actions .btn {
    min-height: 50px;
}

.sk-action-sheet__confirm {
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
    border-color: var(--sk3-electric);
}

.sk-action-sheet--danger .sk-action-sheet__confirm {
    color: var(--sk3-white);
    background: #b42f3c;
    border-color: #d84d5a;
}

.sk-action-sheet--warning .sk-action-sheet__confirm {
    color: var(--sk3-midnight);
    background: #f5c451;
    border-color: #f5c451;
}

.sk-action-sheet--success .sk-action-sheet__confirm {
    color: #031a11;
    background: #71e6a0;
    border-color: #71e6a0;
}

/* Scoring workflow details use the same arena hierarchy as Game Center. */
#app[data-view="attendance"] .attendance-card,
#app[data-view="goal-details"] [data-goal-form],
#app[data-view="penalty-details"] [data-penalty-form],
#app[data-view="overtime"] #main-content > .card,
#app[data-view="final-review"] .final-review-card {
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(85, 194, 255, 0.09), transparent 52%),
        rgba(11, 42, 88, 0.9);
    border: 1px solid rgba(246, 248, 250, 0.16);
    border-top: 5px solid var(--sk3-electric);
    border-radius: var(--sk3-radius-feature);
    box-shadow: var(--sk3-shadow-arena);
}

#app[data-view="goal-details"] [data-goal-form] > h2,
#app[data-view="penalty-details"] [data-penalty-form] > h2,
#app[data-view="overtime"] #main-content > .card > h2,
#app[data-view="attendance"] #main-content > h1 {
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: clamp(2.2rem, 7vw, 3.4rem);
    line-height: 0.95;
    text-transform: uppercase;
}

#app[data-view="goal-details"] :where(.form-group > label, .goal-form-shot-check),
#app[data-view="penalty-details"] .form-group > label {
    color: #c4d0df;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

#app[data-view="goal-details"] :where(select, input),
#app[data-view="penalty-details"] :where(select, input) {
    min-height: 48px;
}

#app[data-view="goal-details"] .minutes-button,
#app[data-view="penalty-details"] .minutes-button,
#app[data-view="overtime"] .minutes-button {
    min-height: 48px;
    color: var(--sk3-ice);
    background: #102f5f;
    border-color: rgba(246, 248, 250, 0.18);
}

#app[data-view="goal-details"] .minutes-button.is-active,
#app[data-view="penalty-details"] .minutes-button.is-active,
#app[data-view="overtime"] .minutes-button.is-active {
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
    border-color: var(--sk3-electric);
}

.scoring-number-dialog {
    z-index: 10015;
    padding: 14px;
    background: rgba(1, 8, 22, 0.76);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.scoring-number-dialog .scoring-number-dialog__panel {
    width: min(440px, 100%);
    padding: 26px;
    color: var(--sk3-ice);
    background: var(--sk3-midnight);
    border: 1px solid rgba(246, 248, 250, 0.17);
    border-top: 5px solid var(--sk3-electric);
    border-radius: 16px;
    box-shadow: var(--sk3-shadow-arena);
}

.scoring-number-dialog__eyebrow,
.scoring-number-dialog__field {
    color: var(--sk3-blue);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.scoring-number-dialog__note {
    color: #a9b8cc;
}

.scoring-number-dialog__actions {
    display: flex;
    gap: 10px;
    margin-top: 20px;
}

.scoring-number-dialog__actions .btn {
    flex: 1 1 0;
    min-height: 48px;
}

@media (max-width: 640px) {
    .sk-action-sheet {
        width: 100%;
        padding: max(20px, env(safe-area-inset-top)) 16px max(20px, env(safe-area-inset-bottom));
        border-left: 0;
    }

    .sk-action-sheet__detail {
        grid-template-columns: minmax(0, 1fr);
        gap: 4px;
    }

    .sk-action-sheet__actions {
        grid-template-columns: minmax(0, 1fr);
    }

    #app[data-view="goal-details"] [data-goal-form],
    #app[data-view="penalty-details"] [data-penalty-form],
    #app[data-view="attendance"] .attendance-card,
    #app[data-view="overtime"] #main-content > .card,
    #app[data-view="final-review"] .final-review-card {
        padding: 20px 15px;
        border-radius: 14px;
    }

    .scoring-number-dialog {
        align-items: flex-end;
        padding: 0;
    }

    .scoring-number-dialog .scoring-number-dialog__panel {
        width: 100%;
        margin: 0;
        padding: 24px 18px max(24px, env(safe-area-inset-bottom));
        border-right: 0;
        border-bottom: 0;
        border-left: 0;
        border-radius: 18px 18px 0 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
    }
}

@media (forced-colors: active) {
    .desktop-nav__link--active::after,
    .live-pulse,
    .push-bell__dot {
        background: Highlight;
    }
}

/* Statistics redesign: standings-first layout and scouting drawers. */
body.stats-flyout-open {
    overflow: hidden;
    overscroll-behavior: none;
}

body.stats-flyout-open #app[data-home-scroll-shell="true"] {
    overflow: hidden !important;
    touch-action: none !important;
}

body.stats-flyout-open .stats-flyout__panel--drawer {
    touch-action: pan-y;
}

#app[data-view="statistics"] .stats-card--redesign {
    width: 100%;
    max-width: 1180px;
    margin-inline: auto;
    padding: clamp(18px, 3vw, 32px);
    overflow: visible;
    color: var(--sk3-ink);
    background: transparent;
    border: 0;
    box-shadow: none;
}

#app[data-view="statistics"] .stats-page-heading {
    margin: 0 0 20px;
}

#app[data-view="statistics"] .stats-page-heading__topline {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
}

#app[data-view="statistics"] .stats-page-heading h1 {
    margin: 2px 0 0;
    color: var(--sk3-midnight);
    font-family: var(--sk3-display);
    font-size: clamp(2.35rem, 6vw, 4.25rem);
    font-weight: 900;
    line-height: 0.92;
    letter-spacing: -0.025em;
    text-transform: uppercase;
}

#app[data-view="statistics"] .stats-scope-label {
    color: var(--sk3-saved-text);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

#app[data-view="statistics"] .stats-updated {
    flex: 0 0 auto;
    padding-bottom: 4px;
    color: var(--sk3-steel);
    font-size: 0.78rem;
    font-variant-numeric: tabular-nums;
}

#app[data-view="statistics"] .stats-toolbar--redesign {
    display: block;
    margin: 0 0 14px;
    padding: 14px 16px;
    background: var(--sk3-white);
    border: 1px solid var(--sk3-border);
    border-radius: 14px;
    box-shadow: 0 10px 28px rgba(6, 27, 59, 0.07);
}

#app[data-view="statistics"] .stats-toolbar__filters {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
}

#app[data-view="statistics"] .stats-toolbar__group {
    display: grid;
    gap: 6px;
    min-width: min(100%, 240px);
}

#app[data-view="statistics"] .stats-label {
    color: var(--sk3-steel);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

#app[data-view="statistics"] .stats-select,
#app[data-view="statistics"] .stats-search-input {
    min-height: 44px;
    padding: 9px 12px;
    color: var(--sk3-ink);
    background: var(--sk3-white);
    border: 1px solid var(--sk3-border);
    border-radius: 9px;
    font-size: 0.9rem;
}

#app[data-view="statistics"] .stats-search-input {
    width: min(100%, 360px);
    padding-left: 38px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23637080' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 12px center;
    background-size: 17px;
}

#app[data-view="statistics"] .stats-division-field {
    flex-shrink: 0;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

#app[data-view="statistics"] .stats-division-field .stats-label {
    display: block;
    margin-bottom: 6px;
}

#app[data-view="statistics"] .division-filter {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0;
}

#app[data-view="statistics"] .division-chip {
    min-width: 82px;
    min-height: 40px;
    padding: 8px 14px;
    color: var(--sk3-steel);
    background: #f4f6f8;
    border: 1px solid transparent;
    border-radius: 999px;
    box-shadow: none;
    font-size: 0.72rem;
    font-weight: 850;
}

#app[data-view="statistics"] .division-chip:hover {
    color: var(--sk3-midnight);
    background: #e9edf2;
    border-color: var(--sk3-border);
}

#app[data-view="statistics"] .division-chip.is-active,
#app[data-view="statistics"] .division-chip.is-active:hover {
    color: var(--sk3-white);
    background: var(--sk3-midnight);
    border-color: var(--sk3-midnight);
    box-shadow: none;
}

#app[data-view="statistics"] .stats-note {
    margin: 0 0 14px;
}

#app[data-view="statistics"] .stats-view-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 52px;
    margin-top: 2px;
    border-bottom: 1px solid var(--sk3-border);
}

#app[data-view="statistics"] .stats-view-tabs {
    display: flex;
    align-self: stretch;
    gap: 24px;
}

#app[data-view="statistics"] .stats-view-tab {
    position: relative;
    min-width: 76px;
    padding: 12px 2px;
    color: var(--sk3-steel);
    background: transparent;
    border: 0;
    font-size: 0.85rem;
    font-weight: 850;
    cursor: pointer;
}

#app[data-view="statistics"] .stats-view-tab::after {
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    height: 3px;
    content: "";
    background: transparent;
    border-radius: 3px 3px 0 0;
}

#app[data-view="statistics"] .stats-view-tab:hover,
#app[data-view="statistics"] .stats-view-tab.is-active {
    color: var(--sk3-midnight);
}

#app[data-view="statistics"] .stats-view-tab.is-active::after {
    background: var(--sk3-electric);
}

#app[data-view="statistics"] .stats-data-status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--sk3-steel);
    font-size: 0.72rem;
    font-weight: 750;
}

#app[data-view="statistics"] .stats-data-status__dot {
    width: 8px;
    height: 8px;
    background: var(--sk3-saved);
    border-radius: 50%;
    box-shadow: 0 0 0 3px rgba(39, 193, 124, 0.12);
}

#app[data-view="statistics"] .stats-data-status.is-limited .stats-data-status__dot {
    background: #e39b21;
    box-shadow: 0 0 0 3px rgba(227, 155, 33, 0.13);
}

#app[data-view="statistics"] .stats-data-status.is-error .stats-data-status__dot {
    background: var(--sk3-live);
    box-shadow: 0 0 0 3px rgba(255, 77, 94, 0.13);
}

#app[data-view="statistics"] .stats-view-panel[hidden] {
    display: none;
}

#app[data-view="statistics"] .stats-view-panel {
    padding-top: 16px;
}

#app[data-view="statistics"] .stats-player-tools {
    display: grid;
    gap: 6px;
    justify-items: start;
    margin-bottom: 12px;
}

#app[data-view="statistics"] .stats-table-container {
    margin: 0;
    overflow-x: auto;
    background: var(--sk3-white);
    border: 1px solid var(--sk3-border);
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(6, 27, 59, 0.08);
}

#app[data-view="statistics"] .stats-table-hint {
    margin: 0;
    padding: 10px 14px;
    color: var(--sk3-steel);
    background: #f7f9fb;
    border-bottom: 1px solid var(--sk3-border);
    font-size: 0.74rem;
}

#app[data-view="statistics"] .stats-search-status {
    margin: 0;
    padding: 7px 14px;
    color: var(--sk3-steel);
    background: #fbfcfd;
    border-bottom: 1px solid var(--sk3-border);
    font-size: 0.72rem;
    font-weight: 700;
}

#app[data-view="statistics"] .stats-table {
    width: 100%;
    min-width: 760px;
    table-layout: auto;
    color: var(--sk3-slate);
    background: var(--sk3-white);
    font-size: 0.82rem;
    font-variant-numeric: tabular-nums;
}

#app[data-view="statistics"] .stats-table--players {
    min-width: 680px;
}

#app[data-view="statistics"] .stats-table col.stats-col--rank {
    width: 78px;
}

#app[data-view="statistics"] .stats-table col.stats-col--identity {
    width: 29%;
}

#app[data-view="statistics"] .stats-table th,
#app[data-view="statistics"] .stats-table td {
    padding: 13px 10px;
    text-align: right;
    white-space: nowrap;
    border-bottom: 1px solid #e7ebf0;
}

#app[data-view="statistics"] .stats-table thead th {
    padding-block: 12px;
    color: #dfe8f5;
    background: var(--sk3-midnight);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    writing-mode: horizontal-tb;
}

#app[data-view="statistics"] .stats-table thead th .stats-sort-button {
    display: inline-flex;
    flex-direction: row;
    justify-content: flex-end;
    gap: 4px;
}

#app[data-view="statistics"] .stats-table .stats-col--rank {
    text-align: center;
    white-space: normal;
}

#app[data-view="statistics"] .stats-table .stats-col--identity {
    min-width: 180px;
    text-align: left;
}

#app[data-view="statistics"] .stats-table tbody tr {
    background: var(--sk3-white);
    transform: none;
}

#app[data-view="statistics"] .stats-table tbody tr:nth-child(even) {
    background: #f7f9fb;
}

#app[data-view="statistics"] .stats-table tbody tr:hover {
    background: rgba(85, 194, 255, 0.1);
    transform: none;
}

#app[data-view="statistics"] .stats-row-trigger {
    display: grid;
    gap: 3px;
    width: 100%;
    padding: 0;
    color: var(--sk3-midnight);
    background: transparent;
    border: 0;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

#app[data-view="statistics"] .stats-row-trigger:hover .stats-team-name,
#app[data-view="statistics"] .stats-row-trigger:hover .stats-player-name {
    color: #075e9a;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

#app[data-view="statistics"] .stats-team-name,
#app[data-view="statistics"] .stats-player-name {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
    color: inherit;
    font-weight: 850;
    line-height: 1.15;
    white-space: normal;
}

#app[data-view="statistics"] .stats-row-meta {
    display: block;
    overflow: hidden;
    color: var(--sk3-steel);
    font-size: 0.69rem;
    font-weight: 600;
    line-height: 1.2;
    text-overflow: ellipsis;
}

#app[data-view="statistics"] .stats-rank {
    color: var(--sk3-steel);
    font-weight: 850;
}

#app[data-view="statistics"] .stats-rank > span {
    display: inline-grid;
    min-width: 28px;
    min-height: 28px;
    place-items: center;
    border-radius: 50%;
}

#app[data-view="statistics"] .stats-rank.is-leader > span {
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
}

#app[data-view="statistics"] .stats-points {
    color: var(--sk3-midnight);
    font-weight: 900;
}

#app[data-view="statistics"] .stats-diff--pos {
    color: var(--sk3-saved-text);
    font-weight: 800;
}

#app[data-view="statistics"] .stats-diff--neg {
    color: #c43b4a;
    font-weight: 800;
}

#app[data-view="statistics"] .stats-form {
    display: inline-flex;
    justify-content: flex-end;
    gap: 4px;
}

#app[data-view="statistics"] .stats-form__result {
    display: inline-grid;
    width: 21px;
    height: 21px;
    place-items: center;
    color: var(--sk3-white);
    border-radius: 50%;
    font-size: 0.61rem;
    font-weight: 900;
}

#app[data-view="statistics"] .stats-form__result--w {
    background: var(--sk3-saved-text);
}

#app[data-view="statistics"] .stats-form__result--l {
    background: #c43b4a;
}

#app[data-view="statistics"] .stats-form__result--otl {
    color: var(--sk3-midnight);
    background: #efbd45;
}

#app[data-view="statistics"] .stats-form__result--t {
    background: var(--sk3-steel);
}

#app[data-view="statistics"] .stats-methodology {
    max-width: 72ch;
    margin: 18px 0 0;
    color: var(--sk3-steel);
    font-size: 0.8rem;
}

#app[data-view="statistics"] .stats-methodology summary {
    color: var(--sk3-slate);
    font-size: 0.8rem;
}

.stats-flyout {
    align-items: stretch;
    justify-content: flex-end;
    padding: 0;
    overflow: hidden;
    background: rgba(3, 14, 33, 0.58);
    backdrop-filter: blur(3px);
}

.stats-flyout .stats-flyout__panel--drawer {
    width: min(450px, 100%);
    max-width: 450px;
    height: 100vh;
    height: 100dvh;
    max-height: 100dvh;
    padding: 0;
    overflow-y: auto;
    color: var(--sk3-ink);
    background: var(--sk3-white);
    border: 0;
    border-left: 1px solid var(--sk3-border);
    border-radius: 0;
    box-shadow: -22px 0 60px rgba(3, 14, 33, 0.24);
    overscroll-behavior: contain;
    transform: translateX(100%);
    transition: transform 220ms ease;
}

.stats-flyout.is-visible .stats-flyout__panel--drawer {
    transform: translateX(0);
}

.stats-flyout .stats-flyout__header {
    position: sticky;
    z-index: 5;
    top: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin: 0;
    padding: 22px 22px 16px;
    background: rgba(255, 255, 255, 0.97);
    border-bottom: 1px solid var(--sk3-border);
    backdrop-filter: blur(10px);
}

.stats-flyout .stats-flyout__title-stack {
    display: grid;
    flex: 1;
    gap: 3px;
    align-items: start;
    justify-items: start;
    text-align: left;
}

.stats-flyout .stats-flyout__header h3 {
    margin: 0;
    color: var(--sk3-midnight);
    font-family: var(--sk3-display);
    font-size: 1.75rem;
    font-weight: 900;
    line-height: 1;
    text-align: left;
    text-transform: uppercase;
}

.stats-flyout .stats-flyout__subtitle {
    margin: 0;
    color: var(--sk3-steel);
    font-size: 0.74rem;
    font-weight: 650;
    text-align: left;
}

.stats-flyout .stats-flyout__close {
    position: static;
    display: inline-grid;
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    margin: 0;
    padding: 0;
    place-items: center;
    color: var(--sk3-midnight);
    background: #eef2f6;
    border: 1px solid var(--sk3-border);
    border-radius: 50%;
}

.stats-flyout .stats-flyout__close:hover {
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
    border-color: var(--sk3-electric);
}

.stats-flyout .stats-flyout__close .ui-icon {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
}

.stats-flyout .stats-flyout__content,
.stats-flyout .stats-flyout__content--team {
    display: grid;
    gap: 18px;
    padding: 20px 22px max(26px, env(safe-area-inset-bottom));
}

.stats-detail-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
    margin: 0;
}

.stats-detail-kpi {
    min-width: 0;
    padding: 11px 7px;
    text-align: center;
    background: #f1f4f7;
    border: 1px solid #e3e8ee;
    border-radius: 9px;
}

.stats-detail-kpi dt {
    min-height: 1.8em;
    color: var(--sk3-steel);
    font-size: 0.58rem;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.stats-detail-kpi dd {
    margin: 4px 0 0;
    overflow: hidden;
    color: var(--sk3-midnight);
    font-family: var(--sk3-display);
    font-size: 1.45rem;
    font-weight: 900;
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stats-detail-section {
    margin: 0;
    padding-top: 16px;
    border-top: 1px solid var(--sk3-border);
}

.stats-detail-section--chart {
    padding-top: 0;
    border-top: 0;
}

.stats-detail-section--chart[hidden] {
    display: none;
}

.stats-detail-section h4,
.stats-detail-section__heading h4 {
    margin: 0 0 10px;
    color: var(--sk3-midnight);
    font-size: 0.78rem;
    font-weight: 850;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.stats-detail-section__heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.stats-detail-section__heading > span {
    color: var(--sk3-steel);
    font-size: 0.66rem;
    font-weight: 700;
}

.stats-flyout .stats-flyout__chart {
    min-height: 0;
    margin: 0;
    padding: 12px;
    background: #f7f9fb;
    border: 1px solid #e3e8ee;
    border-radius: 10px;
}

.stats-position-chart,
.stats-game-chart {
    display: block;
    width: 100%;
    height: auto;
}

.stats-position-chart__area {
    fill: rgba(85, 194, 255, 0.16);
}

.stats-position-chart__line {
    fill: none;
    stroke: var(--sk3-midnight);
    stroke-width: 4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.stats-position-chart__marker {
    fill: var(--sk3-electric);
    stroke: var(--sk3-midnight);
    stroke-width: 3;
}

.stats-game-chart__bar {
    fill: var(--sk3-midnight);
}

.stats-game-chart__value {
    fill: var(--sk3-midnight);
    font-size: 0.72rem;
    font-weight: 900;
}

.stats-chart__grid-line {
    stroke: #dfe5eb;
    stroke-width: 1;
}

.stats-chart__tick-label {
    fill: var(--sk3-steel);
    font-size: 0.66rem;
    font-weight: 700;
}

.stats-scoring-margin {
    display: grid;
    gap: 9px;
}

.stats-margin-row {
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr) 28px;
    align-items: center;
    gap: 8px;
    color: var(--sk3-steel);
    font-size: 0.72rem;
    font-weight: 800;
}

.stats-margin-row strong {
    color: var(--sk3-midnight);
    text-align: right;
}

.stats-margin-track {
    height: 8px;
    overflow: hidden;
    background: #e7ebf0;
    border-radius: 999px;
}

.stats-margin-fill {
    display: block;
    height: 100%;
    background: var(--sk3-saved);
    border-radius: inherit;
}

.stats-margin-fill--against {
    background: var(--sk3-live);
}

.stats-recent-games {
    display: grid;
}

.stats-recent-game {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 10px;
    padding: 10px 0;
    color: var(--sk3-slate);
    border-bottom: 1px solid #e7ebf0;
    font-size: 0.77rem;
}

.stats-recent-game:last-child {
    border-bottom: 0;
}

.stats-recent-game small {
    display: block;
    margin-top: 2px;
    color: var(--sk3-steel);
    font-size: 0.66rem;
}

.stats-recent-game__result {
    display: inline-grid;
    min-width: 29px;
    height: 23px;
    padding-inline: 6px;
    place-items: center;
    color: var(--sk3-white);
    background: var(--sk3-steel);
    border-radius: 999px;
    font-size: 0.62rem;
    font-weight: 900;
}

.stats-recent-game__result--w {
    background: var(--sk3-saved-text);
}

.stats-recent-game__result--l {
    background: #c43b4a;
}

.stats-recent-game__result--otl {
    color: var(--sk3-midnight);
    background: #efbd45;
}

.stats-detail-section--next {
    padding-top: 0;
    border-top: 0;
}

.stats-team-next {
    display: grid;
    gap: 4px;
    padding: 14px 15px;
    color: var(--sk3-slate);
    background: rgba(85, 194, 255, 0.12);
    border: 1px solid rgba(7, 94, 154, 0.2);
    border-radius: 10px;
}

.stats-team-next__eyebrow {
    color: #075e9a;
    font-size: 0.62rem;
    font-weight: 900;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.stats-team-next strong {
    color: var(--sk3-midnight);
    font-family: var(--sk3-display);
    font-size: 1.15rem;
    line-height: 1.05;
    text-transform: uppercase;
}

.stats-team-next > span:last-child {
    color: var(--sk3-steel);
    font-size: 0.74rem;
    font-weight: 700;
}

.stats-team-next__empty,
.stats-team-roster__empty {
    padding: 13px;
}

.stats-team-schedule {
    margin-top: 8px;
    border: 1px solid var(--sk3-border);
    border-radius: 9px;
}

.stats-team-schedule summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 46px;
    padding: 10px 12px;
    color: var(--sk3-midnight);
    font-size: 0.76rem;
    font-weight: 850;
    cursor: pointer;
    list-style: none;
}

.stats-team-schedule summary::-webkit-details-marker {
    display: none;
}

.stats-team-schedule summary::after {
    content: '+';
    margin-left: auto;
    color: #075e9a;
    font-size: 1.1rem;
}

.stats-team-schedule[open] summary::after {
    content: '\2212';
}

.stats-team-schedule summary span {
    color: var(--sk3-steel);
    font-size: 0.68rem;
}

.stats-team-schedule ul,
.stats-team-roster {
    margin: 0;
    padding: 0;
    list-style: none;
}

.stats-team-schedule ul {
    border-top: 1px solid var(--sk3-border);
}

.stats-team-schedule__row {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-bottom: 1px solid #e7ebf0;
    font-size: 0.72rem;
}

.stats-team-schedule__row:last-child {
    border-bottom: 0;
}

.stats-team-schedule__date,
.stats-team-schedule__matchup,
.stats-team-schedule__result {
    min-width: 0;
}

.stats-team-schedule__date,
.stats-team-schedule__result {
    display: grid;
    gap: 2px;
}

.stats-team-schedule__date small,
.stats-team-schedule__status,
.stats-team-schedule__score {
    color: var(--sk3-steel);
    font-size: 0.64rem;
}

.stats-team-schedule__matchup {
    overflow-wrap: anywhere;
    color: var(--sk3-slate);
    font-weight: 700;
}

.stats-team-schedule__result {
    justify-items: end;
}

.stats-team-schedule__status--pending {
    color: #966600;
}

.stats-team-roster {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px 14px;
    margin-top: 7px;
}

.stats-team-roster__player {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    align-items: center;
    gap: 7px;
    min-width: 0;
    padding: 8px 0;
    border-bottom: 1px solid #e7ebf0;
}

.stats-team-roster__number {
    color: #075e9a;
    font-size: 0.68rem;
    font-weight: 850;
    text-align: center;
}

.stats-team-roster__player strong,
.stats-team-roster__player small {
    display: block;
    overflow-wrap: anywhere;
}

.stats-team-roster__player strong {
    color: var(--sk3-midnight);
    font-size: 0.72rem;
}

.stats-team-roster__player small {
    color: var(--sk3-steel);
    font-size: 0.62rem;
}

.stats-detail-section--read,
.stats-detail-section--previous {
    padding: 14px;
    background: #f7f9fb;
    border: 1px solid #e0e6ec;
    border-radius: 10px;
}

.stats-detail-section--read p,
.stats-detail-section--previous p {
    margin: 0;
    color: var(--sk3-slate);
    font-size: 0.78rem;
    line-height: 1.55;
}

.stats-detail-section--read p + p {
    margin-top: 7px;
    color: var(--sk3-steel);
}

.stats-detail-kpis--compact {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 12px;
}

.stats-detail-kpis--compact .stats-detail-kpi dd {
    font-size: 1.05rem;
}

.stats-matchup-history {
    display: grid;
    gap: 7px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.stats-matchup-history li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 10px;
    color: var(--sk3-slate);
    background: #f4f7fa;
    border-radius: 8px;
    font-size: 0.72rem;
}

.stats-matchup-history li > span:first-child {
    display: grid;
    min-width: 0;
}

.stats-matchup-history strong {
    overflow-wrap: anywhere;
    color: var(--sk3-midnight);
}

.stats-matchup-history small {
    color: var(--sk3-steel);
    font-size: 0.61rem;
}

.stats-matchup-history li > span:last-child {
    flex: 0 0 auto;
    font-weight: 750;
    text-align: right;
}

.stats-source-note,
.stats-detail-unavailable {
    margin: 0;
    color: var(--sk3-steel);
    font-size: 0.69rem;
    line-height: 1.45;
}

.stats-detail-unavailable {
    padding: 18px 10px;
    text-align: center;
}

.stats-flyout .stats-coverage-notice {
    color: var(--sk3-slate);
    background: #fff8e7;
    border-color: #d89b2b;
}

@media (max-width: 760px) {
    #app[data-view="statistics"] .stats-card--redesign {
        padding: 16px 12px 24px;
    }

    #app[data-view="statistics"] .stats-page-heading__topline {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    #app[data-view="statistics"] .stats-updated {
        padding: 0;
    }

    #app[data-view="statistics"] .stats-toolbar__filters {
        align-items: stretch;
        flex-direction: column;
        gap: 12px;
    }

    #app[data-view="statistics"] .stats-toolbar__group,
    #app[data-view="statistics"] .stats-select {
        width: 100%;
    }

    #app[data-view="statistics"] [data-action="favorite-stats-division"] {
        align-self: flex-start;
        width: auto;
        min-height: 38px;
        padding: 7px 12px;
        font-size: 0.72rem;
    }

    #app[data-view="statistics"] .division-filter {
        overflow-x: auto;
        padding-bottom: 2px;
        scrollbar-width: none;
    }

    #app[data-view="statistics"] .stats-view-bar {
        align-items: flex-start;
        flex-direction: column-reverse;
        gap: 0;
    }

    #app[data-view="statistics"] .stats-data-status {
        padding: 10px 2px 2px;
    }

    #app[data-view="statistics"] .stats-view-tabs {
        width: 100%;
    }

    #app[data-view="statistics"] .stats-view-tab {
        flex: 1 1 0;
    }

    #app[data-view="statistics"] .stats-search-input {
        width: 100%;
    }

    #app[data-view="statistics"] .stats-table-container {
        overflow: hidden;
    }

    #app[data-view="statistics"] .stats-table,
    #app[data-view="statistics"] .stats-table--players {
        min-width: 0;
        table-layout: fixed;
        font-size: 0.72rem;
    }

    #app[data-view="statistics"] .stats-table col,
    #app[data-view="statistics"] .stats-table th,
    #app[data-view="statistics"] .stats-table td {
        display: table-cell;
    }

    #app[data-view="statistics"] .stats-table col {
        display: table-column;
    }

    #app[data-view="statistics"] .stats-table--teams .stats-col--gf,
    #app[data-view="statistics"] .stats-table--teams .stats-col--ga,
    #app[data-view="statistics"] .stats-table--teams .stats-col--diff,
    #app[data-view="statistics"] .stats-table--teams .stats-col--form,
    #app[data-view="statistics"] .stats-table--players .stats-col--gp,
    #app[data-view="statistics"] .stats-table--players .stats-col--rate,
    #app[data-view="statistics"] .stats-table--players .stats-col--pim {
        display: none;
    }

    #app[data-view="statistics"] .stats-table col.stats-col--rank {
        width: 60px;
    }

    #app[data-view="statistics"] .stats-table col.stats-col--identity {
        width: 40%;
    }

    #app[data-view="statistics"] .stats-table th,
    #app[data-view="statistics"] .stats-table td {
        padding: 11px 4px;
    }

    #app[data-view="statistics"] .stats-table .stats-col--identity {
        min-width: 0;
        padding-left: 7px;
    }

    #app[data-view="statistics"] .stats-table thead th {
        font-size: 0.6rem;
    }

    #app[data-view="statistics"] .stats-table thead th.stats-col--rank {
        width: 60px;
        padding-inline: 3px;
        font-size: 0.5rem;
        line-height: 1.15;
        word-break: normal;
        overflow-wrap: normal;
    }

    #app[data-view="statistics"] .stats-row-meta {
        font-size: 0.6rem;
    }

    #app[data-view="statistics"] .stats-table .stats-col--record {
        font-size: 0.68rem;
    }

    #app[data-view="statistics"] .stats-rank > span {
        min-width: 24px;
        min-height: 24px;
    }

    #app[data-view="statistics"] .stats-table-hint {
        padding: 8px 10px;
        font-size: 0.66rem;
    }

    .stats-flyout .stats-flyout__panel--drawer {
        position: fixed;
        inset: 0;
        width: 100%;
        max-width: none;
        height: 100vh;
        height: 100dvh;
        max-height: 100dvh;
        border: 0;
        border-radius: 0;
    }

    .stats-flyout .stats-flyout__header {
        padding: max(16px, env(safe-area-inset-top)) 16px 13px;
    }

    .stats-flyout .stats-flyout__content,
    .stats-flyout .stats-flyout__content--team {
        padding: 16px 16px max(22px, env(safe-area-inset-bottom));
    }

    .stats-team-roster {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 390px) {
    #app[data-view="statistics"] .stats-table-hint {
        display: none;
    }

    #app[data-view="statistics"] .stats-card--redesign {
        padding-inline: 8px;
    }

    #app[data-view="statistics"] .stats-toolbar--redesign {
        padding-inline: 11px;
    }

    #app[data-view="statistics"] .stats-table col.stats-col--identity {
        width: 39%;
    }

    #app[data-view="statistics"] .stats-table th,
    #app[data-view="statistics"] .stats-table td {
        padding-inline: 3px;
    }

    .stats-detail-kpis {
        gap: 5px;
    }

    .stats-detail-kpi {
        padding-inline: 4px;
    }

    .stats-detail-kpi dd {
        font-size: 1.25rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .stats-flyout,
    .stats-flyout .stats-flyout__panel--drawer {
        transition: none;
    }
}

/* Rink Report editorial edition
   Scoped to the redesigned report so legacy and non-report surfaces stay intact. */
#app[data-view="rink-report"] .report-wrap--editorial {
    --rrx-navy: #07182d;
    --rrx-navy-soft: #102b4b;
    --rrx-paper: #ffffff;
    --rrx-ice: #f4f7f9;
    --rrx-ink: #111b29;
    --rrx-muted: #5c6876;
    --rrx-rule: #cbd4dd;
    --rrx-rule-strong: #8b98a7;
    --rrx-lime: #d8ff29;
    --rrx-cyan: #39c7f4;
    width: min(100%, 1180px);
    min-width: 0;
    margin-inline: auto;
    padding: clamp(12px, 2vw, 24px) clamp(12px, 2.4vw, 28px) clamp(40px, 6vw, 72px);
    color: var(--rrx-ink);
    font-family: var(--sk3-ui);
}

#app[data-view="rink-report"] .report-wrap--editorial *,
#app[data-view="rink-report"] .report-wrap--editorial *::before,
#app[data-view="rink-report"] .report-wrap--editorial *::after {
    box-sizing: border-box;
}

#app[data-view="rink-report"] .report-wrap--editorial .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial :where(a, button, select):focus-visible {
    outline: 3px solid var(--rrx-cyan);
    outline-offset: 3px;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-filters[hidden] {
    display: none;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-edition {
    position: relative;
    margin: 0 0 14px;
    padding: clamp(24px, 4.6vw, 54px) clamp(18px, 4.8vw, 58px) clamp(22px, 4vw, 44px);
    overflow: hidden;
    color: var(--rrx-paper);
    background: var(--rrx-navy);
    border-top: 6px solid var(--rrx-lime);
    border-bottom: 1px solid #1c3b5e;
    border-radius: 0;
    box-shadow: 0 18px 42px rgba(7, 24, 45, 0.16);
}

#app[data-view="rink-report"] .report-wrap--editorial .report-edition::after {
    position: absolute;
    right: clamp(18px, 4vw, 48px);
    bottom: 0;
    width: min(28vw, 260px);
    height: 4px;
    content: "";
    background: var(--rrx-cyan);
}

#app[data-view="rink-report"] .report-wrap--editorial .report-edition__eyebrow {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 12px;
    color: var(--rrx-lime);
    font-size: 0.72rem;
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-edition__eyebrow::before {
    width: 28px;
    height: 2px;
    content: "";
    background: currentColor;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-edition__title-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: clamp(18px, 4vw, 46px);
    min-width: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-edition__title,
#app[data-view="rink-report"] .report-wrap--editorial .report-edition .report-masthead {
    max-width: 900px;
    margin: 0;
    color: var(--rrx-paper);
    font-family: var(--sk3-display);
    font-size: clamp(3.1rem, 8vw, 6.65rem);
    font-weight: 900;
    line-height: 0.84;
    letter-spacing: -0.045em;
    text-wrap: balance;
    text-transform: uppercase;
    background: none;
    opacity: 1;
    -webkit-text-fill-color: var(--rrx-paper);
}

#app[data-view="rink-report"] .report-wrap--editorial .report-edition__deck,
#app[data-view="rink-report"] .report-wrap--editorial .report-edition .report-subtitle {
    max-width: 760px;
    margin: clamp(15px, 2.5vw, 24px) 0 0;
    color: #cbd7e5;
    font-size: clamp(0.96rem, 1.7vw, 1.2rem);
    font-weight: 500;
    line-height: 1.55;
    text-align: left;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-edition__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px 18px;
    margin-top: 20px;
    padding-top: 14px;
    color: #91a6bd;
    border-top: 1px solid #294461;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-edition__meta strong {
    color: var(--rrx-paper);
}

#app[data-view="rink-report"] .report-wrap--editorial .report-toolbar--editorial {
    position: sticky;
    z-index: 24;
    top: 74px;
    display: grid;
    grid-template-columns: minmax(210px, 260px) auto minmax(0, 1fr);
    align-items: end;
    gap: 12px;
    margin: 0 0 18px;
    padding: 12px 14px;
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid var(--rrx-rule);
    border-top: 3px solid var(--rrx-navy);
    border-radius: 0;
    box-shadow: 0 10px 24px rgba(7, 24, 45, 0.1);
}

#app[data-view="rink-report"] .report-wrap--editorial .report-toolbar--editorial .rr-nav {
    justify-self: end;
}

#app[data-view="rink-report"] .report-wrap--editorial :where(.report-status:empty, .report-note[hidden], .report-filters:empty) {
    display: none;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-toolbar--editorial .report-toolbar__row {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 10px;
    min-width: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-season-control {
    display: grid;
    flex: 0 1 260px;
    gap: 5px;
    min-width: 210px;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-season-control label,
#app[data-view="rink-report"] .report-wrap--editorial .report-season-control__label,
#app[data-view="rink-report"] .report-wrap--editorial .report-season-control > span {
    color: var(--rrx-muted);
    font-size: 0.64rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-season-select,
#app[data-view="rink-report"] .report-wrap--editorial .report-season-control select {
    width: 100%;
    min-height: 46px;
    padding: 0 38px 0 12px;
    color: var(--rrx-ink);
    background-color: var(--rrx-paper);
    border: 1px solid var(--rrx-rule-strong);
    border-radius: 4px;
    font-size: 0.86rem;
    font-weight: 800;
}

#app[data-view="rink-report"] .report-wrap--editorial :where(.report-filter, .report-toolbar__divisions, .rr-nav, .report-toolbar__tabs) {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    min-width: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-filter__label {
    margin-right: 6px;
    color: var(--rrx-muted);
    font-size: 0.64rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial :where(.report-filter__btn, .rr-nav__item, .report-tab__btn) {
    min-height: 44px;
    padding: 9px 13px;
    color: #435064;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 3px;
    box-shadow: none;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial :where(.report-filter__btn, .rr-nav__item, .report-tab__btn):hover {
    color: var(--rrx-navy);
    background: var(--rrx-ice);
    border-color: var(--rrx-rule);
}

#app[data-view="rink-report"] .report-wrap--editorial :where(.report-filter__btn.is-active, .rr-nav__item--active, .report-tab__btn.is-active) {
    color: var(--rrx-paper);
    background: var(--rrx-navy);
    border-color: var(--rrx-navy);
}

#app[data-view="rink-report"] .report-wrap--editorial .report-content {
    min-width: 0;
    color: var(--rrx-ink);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-front-page {
    display: grid;
    gap: clamp(16px, 2vw, 24px);
    min-width: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead {
    position: relative;
    display: grid;
    gap: 14px;
    min-width: 0;
    padding: clamp(24px, 4vw, 48px);
    color: var(--rrx-paper);
    background: var(--rrx-navy);
    border-left: 8px solid var(--rrx-lime);
    box-shadow: 0 16px 36px rgba(7, 24, 45, 0.14);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__kicker,
#app[data-view="rink-report"] .report-wrap--editorial .rrx-section__eyebrow {
    margin: 0;
    color: #207d9c;
    font-size: 0.68rem;
    font-weight: 900;
    line-height: 1.25;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__kicker {
    color: var(--rrx-lime);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__headline {
    max-width: 950px;
    margin: 0;
    color: var(--rrx-paper);
    font-family: var(--sk3-display);
    font-size: clamp(2.55rem, 6vw, 5.25rem);
    font-weight: 900;
    line-height: 0.92;
    letter-spacing: -0.035em;
    text-wrap: balance;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__dek {
    max-width: 790px;
    margin: 0;
    color: #cbd7e5;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(1.02rem, 1.8vw, 1.28rem);
    line-height: 1.58;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__evidence {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px 16px;
    margin: 4px 0 0;
    padding-top: 14px;
    color: #8fa6be;
    border-top: 1px solid #284563;
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1.5;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__evidence strong {
    color: var(--rrx-paper);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 4px;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__actions :where(a, button) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 10px 16px;
    color: var(--rrx-navy);
    background: var(--rrx-lime);
    border: 1px solid var(--rrx-lime);
    border-radius: 3px;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-decoration: none;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-grid {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(270px, 0.82fr);
    align-items: start;
    gap: clamp(16px, 2.2vw, 26px);
    min-width: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial :where(.rrx-main, .rrx-rail) {
    display: grid;
    gap: clamp(16px, 2vw, 22px);
    min-width: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-rail {
    position: sticky;
    top: 208px;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-section {
    min-width: 0;
    padding: clamp(18px, 2.8vw, 30px);
    color: var(--rrx-ink);
    background: var(--rrx-paper);
    border: 1px solid var(--rrx-rule);
    border-top: 4px solid var(--rrx-navy);
    border-radius: 0;
    box-shadow: 0 10px 26px rgba(7, 24, 45, 0.07);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-rail .rrx-section {
    padding: 18px;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-section__title {
    margin: 3px 0 0;
    color: var(--rrx-navy);
    font-family: var(--sk3-display);
    font-size: clamp(1.65rem, 3vw, 2.35rem);
    font-weight: 900;
    line-height: 1;
    letter-spacing: -0.018em;
    text-wrap: balance;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-section__deck {
    margin: 8px 0 18px;
    color: var(--rrx-muted);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 0.96rem;
    line-height: 1.55;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-results-ribbon {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr));
    gap: 1px;
    min-width: 0;
    overflow: hidden;
    background: var(--rrx-rule);
    border: 1px solid var(--rrx-rule);
}

#app[data-view="rink-report"] .report-wrap--editorial :where(.rrx-results-card, .rrx-result-card, .rrx-results-ribbon__card) {
    display: grid;
    align-content: start;
    gap: 8px;
    min-width: 0;
    min-height: 122px;
    padding: 14px 16px;
    color: var(--rrx-ink);
    background: var(--rrx-paper);
    border: 0;
    border-radius: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial :where(.rrx-results-card, .rrx-result-card, .rrx-results-ribbon__card) strong {
    color: var(--rrx-navy);
    font-family: var(--sk3-display);
    font-size: 1.2rem;
    font-weight: 900;
    line-height: 1.05;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-table {
    width: 100%;
    min-width: 0;
    overflow-x: auto;
    color: var(--rrx-ink);
    background: var(--rrx-paper);
    border-top: 1px solid var(--rrx-rule-strong);
    scrollbar-width: thin;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-table table,
#app[data-view="rink-report"] .report-wrap--editorial table.rrx-table {
    width: 100%;
    min-width: 520px;
    border-collapse: collapse;
    font-variant-numeric: tabular-nums;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-table thead :where(th, .rrx-table__head) {
    padding: 10px 9px;
    color: #536173;
    background: var(--rrx-ice);
    border-bottom: 1px solid var(--rrx-rule-strong);
    font-size: 0.62rem;
    font-weight: 900;
    letter-spacing: 0.09em;
    text-align: right;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-table :where(th:first-child, th:nth-child(2), td:first-child, td:nth-child(2), .rrx-table__cell:first-child) {
    text-align: left;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-table :where(tbody th, td, .rrx-table__cell) {
    padding: 12px 9px;
    border-bottom: 1px solid #e1e6eb;
    font-size: 0.8rem;
    font-weight: 700;
    text-align: right;
    vertical-align: middle;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-table :where(tbody tr:first-child, .rrx-table__row:first-child) {
    background: #f5fadf;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-table :where(tbody tr:last-child td, .rrx-table__row:last-child .rrx-table__cell) {
    border-bottom: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-table__team {
    color: var(--rrx-navy);
    font-weight: 900;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-chart {
    display: grid;
    gap: 12px;
    min-width: 0;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--rrx-rule);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-bar {
    display: grid;
    grid-template-columns: minmax(78px, 0.8fr) minmax(100px, 2fr) minmax(34px, auto);
    align-items: center;
    gap: 10px;
    min-width: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-bar__label {
    min-width: 0;
    overflow: hidden;
    color: #2d3a4a;
    font-size: 0.72rem;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-bar__track {
    height: 9px;
    overflow: hidden;
    background: #dce4e9;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-bar__fill {
    display: block;
    width: var(--rrx-bar-width, 0%);
    height: 100%;
    min-width: 3px;
    background: var(--rrx-lime);
    border-right: 2px solid var(--rrx-navy);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-bar__value {
    color: var(--rrx-navy);
    font-family: var(--sk3-display);
    font-size: 1rem;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
    text-align: right;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-insight-list {
    display: grid;
    gap: 0;
    margin: 14px 0 0;
    padding: 0;
    list-style: none;
    counter-reset: rrx-insight;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-insight-item {
    position: relative;
    min-width: 0;
    padding: 15px 4px 15px 42px;
    border-top: 1px solid var(--rrx-rule);
    color: #354254;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 0.96rem;
    line-height: 1.5;
    counter-increment: rrx-insight;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-insight-item::before {
    position: absolute;
    top: 13px;
    left: 2px;
    color: #167696;
    content: counter(rrx-insight, decimal-leading-zero);
    font-family: var(--sk3-display);
    font-size: 1.1rem;
    font-weight: 900;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-insight-item strong {
    color: var(--rrx-navy);
    font-family: var(--sk3-ui);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-leaders {
    display: grid;
    gap: 1px;
    margin-top: 14px;
    overflow: hidden;
    background: var(--rrx-rule);
    border: 1px solid var(--rrx-rule);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-leader {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 12px;
    background: var(--rrx-paper);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-leader:first-child {
    border-left: 4px solid var(--rrx-lime);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-leader :where(strong, b) {
    min-width: 0;
    overflow: hidden;
    color: var(--rrx-navy);
    text-overflow: ellipsis;
    white-space: nowrap;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-leader :where(output, .rrx-leader__value) {
    color: var(--rrx-navy);
    font-family: var(--sk3-display);
    font-size: 1.25rem;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-coverage {
    margin: 16px 0 0;
    padding: 13px 15px;
    color: #3e4e60;
    background: #eef8fb;
    border-left: 4px solid var(--rrx-cyan);
    font-size: 0.75rem;
    font-weight: 650;
    line-height: 1.55;
}

#app[data-view="rink-report"] .report-wrap--editorial :where(.rrx-empty, .rrx-archive) {
    min-width: 0;
    padding: clamp(24px, 5vw, 58px);
    color: var(--rrx-ink);
    background: var(--rrx-paper);
    border: 1px solid var(--rrx-rule);
    border-top: 6px solid var(--rrx-navy);
    box-shadow: 0 12px 28px rgba(7, 24, 45, 0.08);
}

#app[data-view="rink-report"] .report-wrap--editorial :where(.rrx-empty, .rrx-archive) h2,
#app[data-view="rink-report"] .report-wrap--editorial :where(.rrx-empty, .rrx-archive) h3 {
    margin: 0 0 10px;
    color: var(--rrx-navy);
    font-family: var(--sk3-display);
    font-size: clamp(2rem, 5vw, 3.75rem);
    font-weight: 900;
    line-height: 0.98;
    letter-spacing: -0.025em;
    text-wrap: balance;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial :where(.rrx-empty, .rrx-archive) p {
    max-width: 720px;
    margin: 0;
    color: var(--rrx-muted);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1rem;
    line-height: 1.65;
}

/* Existing game recap and preview modules inside the new edition. */
#app[data-view="rink-report"] .report-wrap--editorial :where(.report-card, .report-card--front-page, .front-section, .rr-last-week-boxscore, .rr-star-card, .rr-storyline, .player-watch-card) {
    min-width: 0;
    color: var(--rrx-ink);
    background: var(--rrx-paper);
    border-color: var(--rrx-rule);
    border-radius: 0;
    box-shadow: 0 9px 22px rgba(7, 24, 45, 0.07);
}

#app[data-view="rink-report"] .report-wrap--editorial :where(.report-card, .report-card--front-page) {
    padding: clamp(18px, 3vw, 30px);
    border-top: 4px solid var(--rrx-navy);
}

#app[data-view="rink-report"] .report-wrap--editorial :where(.report-section-title, .front-section__title, .rr-section-heading, .rr-star-card h4, .player-watch-card__header) {
    color: var(--rrx-navy);
    font-family: var(--sk3-display);
    font-weight: 900;
    letter-spacing: -0.012em;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-lede--hero {
    color: #344255;
    border-left-color: var(--rrx-cyan);
    font-family: Georgia, "Times New Roman", serif;
    line-height: 1.6;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-stat-strip {
    color: var(--rrx-paper);
    background: var(--rrx-navy);
    border-radius: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-stat-strip__value {
    color: var(--rrx-lime);
}

#app[data-view="rink-report"] .report-wrap--editorial .report-table-wrapper {
    overflow-x: auto;
    background: var(--rrx-paper);
    border: 1px solid var(--rrx-rule);
    border-radius: 0;
    box-shadow: none;
    scrollbar-width: thin;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-table {
    min-width: 570px;
    color: var(--rrx-ink);
    background: var(--rrx-paper);
    font-variant-numeric: tabular-nums;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-table :where(thead, th) {
    color: var(--rrx-paper);
    background: var(--rrx-navy);
}

#app[data-view="rink-report"] .report-wrap--editorial .report-table tbody tr:nth-child(even) {
    background: var(--rrx-ice);
}

#app[data-view="rink-report"] .report-wrap--editorial .rr-last-week-boxscores,
#app[data-view="rink-report"] .report-wrap--editorial .rr-stars-grid,
#app[data-view="rink-report"] .report-wrap--editorial .rr-storylines,
#app[data-view="rink-report"] .report-wrap--editorial .report-grid,
#app[data-view="rink-report"] .report-wrap--editorial .report-columns,
#app[data-view="rink-report"] .report-wrap--editorial .matchup-grid {
    gap: clamp(12px, 2vw, 20px);
    min-width: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial .rr-last-week-boxscore {
    overflow: hidden;
    border-top: 4px solid var(--rrx-navy);
}

#app[data-view="rink-report"] .report-wrap--editorial .rr-last-week-boxscore--selected {
    border-color: var(--rrx-cyan);
}

#app[data-view="rink-report"] .report-wrap--editorial :where(.rr-last-week-boxscore__status, .rr-last-week-boxscore__final) {
    color: var(--rrx-navy);
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial :where(.rr-last-week-boxscore__link, .rr-last-week-boxscore__actions a, .rr-last-week-boxscore__actions button) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    color: var(--rrx-navy);
    background: transparent;
    border: 1px solid var(--rrx-navy);
    border-radius: 3px;
    font-weight: 850;
    text-decoration: none;
}

#app[data-view="rink-report"] .report-wrap--editorial .rr-star-card--rank-1 {
    border-top-color: var(--rrx-lime);
}

#app[data-view="rink-report"] .report-wrap--editorial .matchup-card {
    min-width: 0;
    overflow: hidden;
    color: var(--rrx-paper);
    background: var(--rrx-navy);
    border: 1px solid #234564;
    border-top: 4px solid var(--rrx-cyan);
    border-radius: 0;
    box-shadow: 0 12px 28px rgba(7, 24, 45, 0.14);
}

#app[data-view="rink-report"] .report-wrap--editorial .matchup-card__toggle {
    min-height: 46px;
}

#app[data-view="rink-report"] .report-wrap--editorial .matchup-card__projection {
    color: var(--rrx-lime);
}

#app[data-view="rink-report"] .report-wrap--editorial .player-watch-card {
    --report-link-color: #dce9ff;
    color: #f6f8fa;
    background: linear-gradient(145deg, #0b223b, #102f4d);
    border: 1px solid #2e5b7c;
    border-top: 4px solid var(--rrx-cyan);
}

#app[data-view="rink-report"] .report-wrap--editorial .player-watch-card__header,
#app[data-view="rink-report"] .report-wrap--editorial .player-watch-card__header strong {
    color: #ffffff;
}

#app[data-view="rink-report"] .report-wrap--editorial .player-watch-card__team,
#app[data-view="rink-report"] .report-wrap--editorial .player-watch-card__line,
#app[data-view="rink-report"] .report-wrap--editorial .player-watch-card__note,
#app[data-view="rink-report"] .report-wrap--editorial .player-watch-card__trend-empty,
#app[data-view="rink-report"] .report-wrap--editorial .player-watch-card__trend-title,
#app[data-view="rink-report"] .report-wrap--editorial .player-watch-card__trend-range,
#app[data-view="rink-report"] .report-wrap--editorial .player-watch-card__trend-legend,
#app[data-view="rink-report"] .report-wrap--editorial .player-watch-card__trend-window {
    color: #d8e6f5;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-status {
    margin: 12px 0;
    padding: 11px 14px;
    color: #3f4e60;
    background: #edf6fa;
    border: 1px solid #b9dce8;
    border-radius: 0;
    font-size: 0.78rem;
    line-height: 1.5;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-note:not([hidden]) {
    margin: 10px 0 14px;
    padding: 8px 11px;
    color: #40566a;
    background: #edf6fa;
    border-left: 3px solid var(--rrx-cyan);
    font-size: 0.72rem;
    font-weight: 750;
    line-height: 1.35;
    text-align: left;
}

/* Alignment for the concrete editorial modules emitted by the report view. */
#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead {
    grid-template-columns: minmax(0, 1fr) minmax(180px, 236px);
    align-items: end;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__copy {
    display: grid;
    gap: 14px;
    min-width: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: start;
    min-width: 150px;
    min-height: 46px;
    margin-top: 3px;
    padding: 10px 16px;
    color: var(--rrx-navy);
    background: var(--rrx-lime);
    border: 1px solid var(--rrx-lime);
    border-radius: 3px;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-decoration: none;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__action:hover {
    color: var(--rrx-paper);
    background: var(--rrx-navy-soft);
    border-color: var(--rrx-cyan);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__scoreboard {
    min-width: 0;
    padding: 18px;
    color: var(--rrx-paper);
    background: #0d2540;
    border-top: 3px solid var(--rrx-cyan);
    border-bottom: 1px solid #36516c;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__scoreboard > span {
    display: block;
    margin-bottom: 6px;
    color: #89a3bc;
    font-size: 0.62rem;
    font-weight: 900;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__scoreboard > strong {
    display: block;
    min-width: 0;
    overflow: visible;
    color: var(--rrx-paper);
    font-family: var(--sk3-display);
    font-size: clamp(1.55rem, 3vw, 2.25rem);
    font-weight: 900;
    line-height: 1;
    overflow-wrap: anywhere;
    text-transform: uppercase;
    white-space: normal;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__scoreboard > strong a {
    color: var(--rrx-paper);
    -webkit-text-fill-color: var(--rrx-paper);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__scoreboard > div {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-top: 15px;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__scoreboard > div b {
    color: var(--rrx-lime);
    font-family: var(--sk3-display);
    font-size: 3rem;
    font-weight: 900;
    line-height: 0.75;
    font-variant-numeric: tabular-nums;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__scoreboard > div small,
#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__scoreboard > p {
    color: #92a8be;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__scoreboard > p {
    margin: 12px 0 0;
    line-height: 1.45;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-results-ribbon {
    display: block;
    padding: clamp(16px, 2.4vw, 24px);
    background: var(--rrx-paper);
    border: 1px solid var(--rrx-rule);
    border-top: 4px solid var(--rrx-navy);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-results-ribbon__track {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr));
    gap: 1px;
    min-width: 0;
    margin-top: 14px;
    overflow: hidden;
    background: var(--rrx-rule);
    border: 1px solid var(--rrx-rule);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-result {
    display: grid;
    gap: 8px;
    min-width: 0;
    padding: 13px 14px;
    color: var(--rrx-ink);
    background: var(--rrx-paper);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-result__meta {
    color: var(--rrx-muted);
    font-size: 0.62rem;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-result__line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    min-width: 0;
    color: #4a5868;
    font-size: 0.78rem;
    font-weight: 700;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-result__line > span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-result__line > strong {
    color: var(--rrx-navy);
    font-family: var(--sk3-display);
    font-size: 1.2rem;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-result__line.is-winner {
    color: var(--rrx-navy);
    font-weight: 900;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-result__line.is-winner > strong {
    color: #0c789d;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-table-wrap {
    max-width: 100%;
    margin-top: 16px;
    overflow-x: auto;
    border: 1px solid var(--rrx-rule);
    scrollbar-width: thin;
}

#app[data-view="rink-report"] .report-wrap--editorial table.rrx-table {
    margin: 0;
    border: 0;
    border-collapse: collapse;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-chart__row {
    display: grid;
    grid-template-columns: minmax(110px, 0.95fr) minmax(100px, 2fr) 34px;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-chart__label {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: center;
    gap: 6px;
    min-width: 0;
    overflow: hidden;
    color: #2d3a4a;
    font-size: 0.72rem;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-chart__label b {
    color: #7c8998;
    font-family: var(--sk3-display);
}

#app[data-view="rink-report"] .report-wrap--editorial meter.rrx-chart__bar {
    width: 100%;
    height: 10px;
    overflow: hidden;
    appearance: none;
    background: #dce4e9;
    border: 0;
    border-radius: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial meter.rrx-chart__bar::-webkit-meter-bar {
    background: #dce4e9;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

#app[data-view="rink-report"] .report-wrap--editorial meter.rrx-chart__bar::-webkit-meter-optimum-value,
#app[data-view="rink-report"] .report-wrap--editorial meter.rrx-chart__bar::-webkit-meter-suboptimum-value,
#app[data-view="rink-report"] .report-wrap--editorial meter.rrx-chart__bar::-webkit-meter-even-less-good-value {
    background: var(--rrx-lime);
    border-right: 2px solid var(--rrx-navy);
}

#app[data-view="rink-report"] .report-wrap--editorial meter.rrx-chart__bar::-moz-meter-bar {
    background: var(--rrx-lime);
    border-right: 2px solid var(--rrx-navy);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-chart__value {
    color: var(--rrx-navy);
    font-family: var(--sk3-display);
    font-size: 1rem;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
    text-align: right;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-insight {
    position: relative;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 10px;
    min-width: 0;
    padding: 14px 2px;
    border-top: 1px solid var(--rrx-rule);
    color: #354254;
    counter-increment: rrx-insight;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-insight > span::before {
    color: #167696;
    content: counter(rrx-insight, decimal-leading-zero);
    font-family: var(--sk3-display);
    font-size: 1.1rem;
    font-weight: 900;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-insight > p {
    margin: 0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 0.92rem;
    line-height: 1.5;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-leader__rank {
    color: #728091;
    font-family: var(--sk3-display);
    font-weight: 900;
    text-align: center;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-leader__identity {
    display: grid;
    min-width: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-leader__identity > small {
    min-width: 0;
    overflow: hidden;
    color: var(--rrx-muted);
    font-size: 0.62rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-leader__line {
    display: grid;
    justify-items: end;
    line-height: 1;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-leader__line > strong {
    color: var(--rrx-navy);
    font-family: var(--sk3-display);
    font-size: 1.35rem;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-leader__line > small {
    color: var(--rrx-muted);
    font-size: 0.56rem;
    font-weight: 900;
    letter-spacing: 0.07em;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-coverage > strong {
    display: block;
    margin-bottom: 4px;
    color: var(--rrx-navy);
    font-size: 0.69rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-coverage > p {
    margin: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-broadcast-copy,
#app[data-view="rink-report"] .report-wrap--editorial .rrx-section--broadcast .front-hot-take {
    margin: 16px 0 0;
    color: #354254;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1rem;
    line-height: 1.65;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-section--broadcast .front-hot-take {
    padding: 14px 0 0;
    border-top: 1px solid var(--rrx-rule);
    font-weight: 700;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-empty__deck,
#app[data-view="rink-report"] .report-wrap--editorial .rrx-archive__header > p {
    max-width: 760px;
    color: var(--rrx-muted);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1rem;
    line-height: 1.65;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-empty__metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    max-width: 700px;
    margin: 24px 0;
    overflow: hidden;
    color: var(--rrx-paper);
    background: #31465d;
    border: 1px solid #31465d;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-empty__metrics > div {
    display: grid;
    gap: 3px;
    min-width: 0;
    padding: 14px;
    color: var(--rrx-paper);
    background: var(--rrx-navy);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-empty__metrics strong {
    color: var(--rrx-lime);
    font-family: var(--sk3-display);
    font-size: 2rem;
    font-weight: 900;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-empty__metrics span {
    color: #9eb0c3;
    font-size: 0.6rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-empty__slate {
    max-width: 800px;
    margin: 28px 0;
    padding-top: 18px;
    border-top: 1px solid var(--rrx-rule-strong);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-empty__matchup {
    display: grid;
    grid-template-columns: minmax(120px, 0.35fr) minmax(0, 1fr);
    gap: 14px;
    padding: 13px 0;
    border-bottom: 1px solid var(--rrx-rule);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-empty__matchup > span,
#app[data-view="rink-report"] .report-wrap--editorial .rrx-empty__note {
    color: var(--rrx-muted);
    font-size: 0.72rem;
    font-weight: 800;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-empty__matchup > strong {
    min-width: 0;
    color: var(--rrx-navy);
    font-size: 0.86rem;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-empty__matchup small {
    color: var(--rrx-muted);
    font-weight: 650;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-archive__header {
    margin-bottom: clamp(22px, 4vw, 40px);
    padding-bottom: clamp(20px, 3vw, 30px);
    border-bottom: 2px solid var(--rrx-navy);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-archive__header h2 {
    max-width: 900px;
    margin: 5px 0 12px;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-archive__games {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr));
    gap: 10px;
    margin-top: 16px;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-archive__game {
    min-width: 0;
    padding: 14px;
    background: var(--rrx-ice);
    border-top: 3px solid var(--rrx-navy);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-archive__game > span {
    display: block;
    margin-bottom: 8px;
    color: var(--rrx-muted);
    font-size: 0.6rem;
    font-weight: 900;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-archive__team {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    min-width: 0;
    padding: 5px 0;
    color: #485669;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-archive__team > strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-archive__team > b {
    color: var(--rrx-navy);
    font-family: var(--sk3-display);
    font-size: 1.2rem;
    font-variant-numeric: tabular-nums;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-archive__team.is-winner {
    color: var(--rrx-navy);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-archive__team.is-winner > b {
    color: #0c789d;
}

#app[data-view="rink-report"] .report-wrap--editorial .front-snapshot__progress {
    display: grid;
    gap: 7px;
    margin-top: 14px;
}

#app[data-view="rink-report"] .report-wrap--editorial meter.front-snapshot__progress-track {
    width: 100%;
    height: 9px;
    overflow: hidden;
    appearance: none;
    background: #dce4e9;
    border: 0;
    border-radius: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial meter.front-snapshot__progress-track::-webkit-meter-bar {
    background: #dce4e9;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

#app[data-view="rink-report"] .report-wrap--editorial meter.front-snapshot__progress-track::-webkit-meter-optimum-value,
#app[data-view="rink-report"] .report-wrap--editorial meter.front-snapshot__progress-track::-webkit-meter-suboptimum-value,
#app[data-view="rink-report"] .report-wrap--editorial meter.front-snapshot__progress-track::-webkit-meter-even-less-good-value {
    background: var(--rrx-cyan);
}

#app[data-view="rink-report"] .report-wrap--editorial meter.front-snapshot__progress-track::-moz-meter-bar {
    background: var(--rrx-cyan);
}

#app[data-view="rink-report"] .report-wrap--editorial .front-snapshot__progress-label {
    color: var(--rrx-muted);
    font-size: 0.64rem;
    font-weight: 800;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-rewind__teams {
    display: grid;
    gap: 1px;
    min-width: 0;
    margin-top: 16px;
    overflow: hidden;
    background: var(--rrx-rule);
    border: 1px solid var(--rrx-rule);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-rewind__team {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-width: 0;
    padding: 14px;
    color: var(--rrx-ink);
    background: var(--rrx-paper);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-rewind__team:first-child {
    border-left: 5px solid var(--rrx-lime);
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-rewind__team > span {
    color: #728091;
    font-family: var(--sk3-display);
    font-size: 1rem;
    font-weight: 900;
    text-align: center;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-rewind__team > div {
    display: grid;
    gap: 3px;
    min-width: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-rewind__team > div strong {
    min-width: 0;
    overflow: hidden;
    color: var(--rrx-navy);
    font-size: 0.86rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-rewind__team > div small {
    color: var(--rrx-muted);
    font-size: 0.65rem;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-rewind__team > b {
    display: grid;
    justify-items: end;
    color: var(--rrx-navy);
    font-family: var(--sk3-display);
    font-size: 1.45rem;
    font-weight: 900;
    line-height: 0.9;
    font-variant-numeric: tabular-nums;
}

#app[data-view="rink-report"] .report-wrap--editorial .rrx-rewind__team > b small {
    color: var(--rrx-muted);
    font-family: var(--sk3-ui);
    font-size: 0.52rem;
    letter-spacing: 0.06em;
}

@media (max-width: 900px) {
    #app[data-view="rink-report"] .report-wrap--editorial .rrx-grid {
        grid-template-columns: minmax(0, 1.5fr) minmax(240px, 0.82fr);
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-rail {
        top: 196px;
    }
}

@media (max-width: 720px) {
    #app[data-view="rink-report"] .report-wrap--editorial {
        width: 100%;
        padding: 8px 10px 42px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-edition {
        margin-bottom: 10px;
        padding: 18px 16px 20px;
        border-top-width: 5px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-edition__title,
    #app[data-view="rink-report"] .report-wrap--editorial .report-edition .report-masthead {
        font-size: clamp(2.85rem, 14vw, 4.35rem);
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-edition__title-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 14px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-edition__meta {
        align-items: center;
        flex-direction: row;
        gap: 7px 12px;
        margin-top: 12px;
        padding-top: 10px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-edition__deck,
    #app[data-view="rink-report"] .report-wrap--editorial .report-edition .report-subtitle {
        display: -webkit-box;
        margin-top: 13px;
        overflow: hidden;
        font-size: 0.92rem;
        line-height: 1.45;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-toolbar--editorial {
        position: relative;
        top: auto;
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
        padding: 12px;
        box-shadow: 0 7px 18px rgba(7, 24, 45, 0.08);
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-toolbar--editorial .rr-nav {
        justify-self: stretch;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-toolbar--editorial .report-toolbar__row {
        align-items: stretch;
        width: 100%;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-toolbar--editorial .report-toolbar__divisions {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 5px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-season-control,
    #app[data-view="rink-report"] .report-wrap--editorial .report-season-select,
    #app[data-view="rink-report"] .report-wrap--editorial .report-season-control select {
        width: 100%;
        min-width: 0;
    }

    #app[data-view="rink-report"] .report-wrap--editorial :where(.report-filter, .report-toolbar__divisions, .rr-nav, .report-toolbar__tabs) {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(88px, 1fr));
        width: 100%;
        gap: 5px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-filter__label {
        display: none;
    }

    #app[data-view="rink-report"] .report-wrap--editorial :where(.report-filter__btn, .rr-nav__item, .report-tab__btn) {
        width: 100%;
        padding-inline: 8px;
        white-space: normal;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-lead {
        grid-template-columns: minmax(0, 1fr);
        padding: 25px 19px 27px;
        border-left-width: 5px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__scoreboard {
        width: 100%;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__headline {
        font-size: clamp(2.4rem, 12vw, 4.2rem);
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__actions {
        align-items: stretch;
        flex-direction: column;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__actions :where(a, button) {
        width: 100%;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__action {
        justify-self: stretch;
        width: 100%;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-rail {
        position: static;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-section,
    #app[data-view="rink-report"] .report-wrap--editorial .rrx-rail .rrx-section,
    #app[data-view="rink-report"] .report-wrap--editorial :where(.rrx-empty, .rrx-archive) {
        padding: 19px 15px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-results-ribbon__track {
        grid-template-columns: minmax(0, 1fr);
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-table {
        margin-inline: -1px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-bar {
        grid-template-columns: minmax(72px, 0.85fr) minmax(90px, 1.8fr) minmax(30px, auto);
        gap: 7px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-chart__row {
        grid-template-columns: minmax(88px, 0.9fr) minmax(80px, 1.65fr) 30px;
        gap: 7px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-leader {
        grid-template-columns: 24px minmax(0, 1fr) auto;
        padding: 11px 9px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-columns,
    #app[data-view="rink-report"] .report-wrap--editorial .matchup-grid,
    #app[data-view="rink-report"] .report-wrap--editorial .rr-stars-grid,
    #app[data-view="rink-report"] .report-wrap--editorial .report-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rr-last-week-boxscore__actions {
        align-items: stretch;
        flex-direction: column;
    }

    #app[data-view="rink-report"] .report-wrap--editorial :where(.rr-last-week-boxscore__link, .rr-last-week-boxscore__actions a, .rr-last-week-boxscore__actions button) {
        width: 100%;
    }
}

@media (max-width: 360px) {
    #app[data-view="rink-report"] .report-wrap--editorial {
        padding-inline: 7px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-edition,
    #app[data-view="rink-report"] .report-wrap--editorial .rrx-lead {
        padding-inline: 15px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-edition__title,
    #app[data-view="rink-report"] .report-wrap--editorial .report-edition .report-masthead {
        font-size: clamp(2.75rem, 16vw, 3.8rem);
        overflow-wrap: anywhere;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__headline {
        font-size: clamp(2.2rem, 11.5vw, 3.2rem);
        overflow-wrap: anywhere;
    }

    #app[data-view="rink-report"] .report-wrap--editorial :where(.report-filter, .report-toolbar__divisions, .rr-nav, .report-toolbar__tabs) {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-bar {
        grid-template-columns: minmax(64px, 0.9fr) minmax(68px, 1.45fr) minmax(28px, auto);
        gap: 5px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-chart__row {
        grid-template-columns: minmax(76px, 0.85fr) minmax(62px, 1.35fr) 28px;
        gap: 5px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-chart__label {
        grid-template-columns: minmax(0, 1fr);
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-chart__label > b {
        display: none;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-empty__metrics {
        grid-template-columns: minmax(0, 1fr);
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-empty__metrics > div {
        grid-template-columns: 58px minmax(0, 1fr);
        align-items: center;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-empty__metrics strong {
        font-size: 1.55rem;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-empty__matchup {
        grid-template-columns: minmax(0, 1fr);
        gap: 5px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-rewind__team {
        grid-template-columns: 22px minmax(0, 1fr) auto;
        gap: 8px;
        padding-inline: 9px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-insight-item {
        padding-left: 35px;
    }
}

/* Home: Game Night Front Page
   One editorial lead, one compact slate, and no placeholder scoreboards. */
#app[data-view="main-menu"] .rink-lobby {
    display: block;
    width: min(100%, 1180px);
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 clamp(16px, 3vw, 34px) clamp(38px, 6vw, 68px);
    overflow-x: clip;
}

#app[data-view="main-menu"] .rink-lobby__status-bar.arena-status {
    justify-content: space-between;
    min-height: 44px;
    margin: 0 calc(clamp(16px, 3vw, 34px) * -1) 18px;
    padding: 9px clamp(18px, 3vw, 34px);
    border-radius: 0;
    font-size: 0.72rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

#app[data-view="main-menu"] .arena-status__season {
    color: var(--sk3-midnight);
    font-weight: 900;
    letter-spacing: 0.07em;
}

#app[data-view="main-menu"] .home-division-filter {
    margin: 0 0 clamp(22px, 4vw, 38px);
}

#app[data-view="main-menu"] .rink-lobby__hero-slot,
#app[data-view="main-menu"] [data-home-pulse],
#app[data-view="main-menu"] [data-home-destinations],
#app[data-view="main-menu"] .home-front__checkin {
    width: 100%;
    min-width: 0;
}

#app[data-view="main-menu"] .home-front__eyebrow {
    margin: 0 0 8px;
    color: var(--sk3-blue);
    font-size: 0.71rem;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

#app[data-view="main-menu"] .home-front__intro {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(22px, 4vw, 48px);
    align-items: end;
    margin-bottom: 24px;
}

#app[data-view="main-menu"] .home-front__slate .home-front__night-facts {
    min-width: 0;
    margin: 0 0 12px;
    padding: 0 0 12px;
    border-left: 0;
    border-bottom: 1px solid rgba(246, 248, 250, 0.12);
}

#app[data-view="main-menu"] .home-summary-grid--single {
    grid-template-columns: minmax(0, 1fr);
}

#app[data-view="main-menu"] .home-front__intro h1 {
    max-width: 18ch;
    margin: 0;
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: clamp(2.65rem, 6vw, 5rem);
    font-weight: 800;
    letter-spacing: -0.035em;
    line-height: 0.88;
    text-wrap: balance;
    text-transform: uppercase;
}

#app[data-view="main-menu"] .home-front__intro-copy {
    max-width: 64ch;
    margin: 16px 0 0;
    color: #b4c2d3;
    font-size: clamp(0.92rem, 1.5vw, 1.02rem);
    line-height: 1.65;
}

#app[data-view="main-menu"] .home-front__night-facts {
    display: grid;
    min-width: 230px;
    margin: 0;
    padding: 2px 0 2px 22px;
    border-left: 1px solid rgba(246, 248, 250, 0.19);
    gap: 10px;
}

#app[data-view="main-menu"] .home-front__night-facts > div {
    display: flex;
    gap: 20px;
    align-items: baseline;
    justify-content: space-between;
}

#app[data-view="main-menu"] .home-front__night-facts dt,
#app[data-view="main-menu"] .home-front__night-facts dd {
    margin: 0;
}

#app[data-view="main-menu"] .home-front__night-facts dt {
    color: #91a5bc;
    font-size: 0.72rem;
    font-weight: 650;
}

#app[data-view="main-menu"] .home-front__night-facts dd {
    color: var(--sk3-white);
    font-size: 0.8rem;
    font-weight: 850;
    text-align: right;
}

#app[data-view="main-menu"] .home-front__hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(290px, 0.75fr);
    gap: 18px;
    align-items: stretch;
}

#app[data-view="main-menu"] .home-front__feature,
#app[data-view="main-menu"] .home-front__slate,
#app[data-view="main-menu"] .home-front__story,
#app[data-view="main-menu"] .home-front__destination {
    min-width: 0;
    background: rgba(11, 42, 88, 0.78);
    border: 1px solid rgba(246, 248, 250, 0.16);
    border-radius: var(--sk3-radius-feature);
}

#app[data-view="main-menu"] .home-front__feature {
    position: relative;
    padding: clamp(24px, 4.5vw, 44px);
    scroll-margin-top: 84px;
    overflow: hidden;
    background:
        radial-gradient(circle at 100% 0%, rgba(85, 194, 255, 0.17), transparent 19rem),
        linear-gradient(145deg, rgba(13, 50, 103, 0.98), rgba(5, 25, 57, 0.98));
    border-color: rgba(229, 247, 10, 0.35);
    box-shadow: var(--sk3-shadow-arena);
}

#app[data-view="main-menu"] .home-front__feature::before {
    position: absolute;
    inset: 0 0 auto;
    height: 5px;
    content: "";
    background: var(--sk3-electric);
}

#app[data-view="main-menu"] .home-front__feature--live::before {
    background: var(--sk3-live);
}

#app[data-view="main-menu"] .home-front__feature-topline {
    display: flex;
    gap: 14px;
    align-items: center;
    justify-content: space-between;
}

#app[data-view="main-menu"] .home-front__feature h2 {
    max-width: 19ch;
    margin: 0;
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: clamp(2rem, 4.4vw, 3.65rem);
    font-weight: 800;
    line-height: 0.98;
    text-transform: uppercase;
    text-wrap: balance;
}

#app[data-view="main-menu"] .home-front__feature-copy {
    max-width: 66ch;
    margin: 12px 0 0;
    color: #acbbce;
    font-size: 0.9rem;
    line-height: 1.6;
}

#app[data-view="main-menu"] .home-front__vote-prompt {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 3px 10px;
    align-items: baseline;
    margin-top: 22px;
}

#app[data-view="main-menu"] .home-front__vote-prompt > span {
    padding: 4px 7px;
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
    border-radius: 5px;
    font-size: 0.65rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
}

#app[data-view="main-menu"] .home-front__vote-prompt > strong {
    color: var(--sk3-white);
    font-size: 0.9rem;
    font-weight: 850;
}

#app[data-view="main-menu"] .home-front__vote-prompt > small {
    grid-column: 2;
    color: #90a5bd;
    font-size: 0.72rem;
    line-height: 1.35;
}

#app[data-view="main-menu"] .home-front__matchup {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px minmax(0, 1fr);
    gap: 10px;
    align-items: stretch;
    margin: 12px 0 12px;
}

#app[data-view="main-menu"] .home-front__team {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
    justify-content: center;
    min-width: 0;
    min-height: 108px;
    padding: 16px;
    color: var(--sk3-white);
    background: rgba(3, 14, 33, 0.52);
    border: 1px solid rgba(246, 248, 250, 0.17);
    border-radius: 14px;
    text-align: center;
}

#app[data-view="main-menu"] button.home-front__team {
    width: 100%;
    font: inherit;
    cursor: pointer;
    transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
}

#app[data-view="main-menu"] button.home-front__team:focus-visible {
    outline: 3px solid rgba(229, 247, 10, 0.72);
    outline-offset: 3px;
}

#app[data-view="main-menu"] button.home-front__team:disabled {
    cursor: wait;
    opacity: 0.72;
}

#app[data-view="main-menu"] button.home-front__team:hover,
#app[data-view="main-menu"] .home-front__team--active {
    background: rgba(85, 194, 255, 0.11);
    border-color: var(--sk3-blue);
    transform: translateY(-1px);
}

#app[data-view="main-menu"] .home-front__team--winner {
    border-color: rgba(229, 247, 10, 0.48);
    box-shadow: inset 0 0 0 1px rgba(229, 247, 10, 0.12);
}

#app[data-view="main-menu"] .home-front__team strong {
    max-width: 100%;
    color: inherit;
    font-family: var(--sk3-display);
    font-size: clamp(1.2rem, 2.7vw, 1.8rem);
    font-weight: 750;
    line-height: 1.02;
    overflow-wrap: anywhere;
    text-wrap: balance;
}

#app[data-view="main-menu"] .home-front__team > span {
    color: var(--sk3-electric);
    font-family: var(--sk3-display);
    font-size: 2rem;
    font-weight: 800;
}

#app[data-view="main-menu"] .home-front__team > .home-front__team-vote {
    display: grid;
    gap: 3px;
    color: #b9c8d8;
    font-family: inherit;
    font-size: 0.7rem;
    font-weight: 700;
    line-height: 1.15;
}

#app[data-view="main-menu"] .home-front__team-vote b {
    color: var(--sk3-white);
    font-size: 0.72rem;
    font-weight: 850;
}

#app[data-view="main-menu"] .home-front__team-vote small {
    color: var(--sk3-electric-soft);
    font-size: 0.66rem;
    font-weight: 850;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

#app[data-view="main-menu"] .home-front__team--active .home-front__team-vote small {
    color: var(--sk3-electric);
}

#app[data-view="main-menu"] .home-front__vote-results {
    display: grid;
    gap: 8px;
    margin: 0 0 18px;
    padding: 13px 14px 12px;
    background: rgba(3, 14, 33, 0.56);
    border: 1px solid rgba(246, 248, 250, 0.14);
    border-radius: 12px;
}

#app[data-view="main-menu"] .home-front__vote-summary,
#app[data-view="main-menu"] .home-front__vote-labels {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
}

#app[data-view="main-menu"] .home-front__vote-summary strong {
    color: var(--sk3-white);
    font-size: 0.78rem;
    font-weight: 850;
}

#app[data-view="main-menu"] .home-front__vote-summary span {
    color: #90a5bd;
    font-size: 0.66rem;
    font-weight: 750;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

#app[data-view="main-menu"] .home-front__vote-bar {
    display: flex;
    width: 100%;
    height: 12px;
    overflow: hidden;
    background: rgba(246, 248, 250, 0.09);
    border: 1px solid rgba(246, 248, 250, 0.13);
    border-radius: 999px;
}

#app[data-view="main-menu"] .home-front__vote-bar-away,
#app[data-view="main-menu"] .home-front__vote-bar-home {
    min-width: 0;
    transition: width 0.35s ease;
}

#app[data-view="main-menu"] .home-front__vote-bar-away {
    background: linear-gradient(90deg, #168fbb, var(--sk3-blue));
}

#app[data-view="main-menu"] .home-front__vote-bar-home {
    background: linear-gradient(90deg, var(--sk3-electric-soft), var(--sk3-electric));
}

#app[data-view="main-menu"] .home-front__vote-results--empty .home-front__vote-bar-away,
#app[data-view="main-menu"] .home-front__vote-results--empty .home-front__vote-bar-home {
    background: rgba(246, 248, 250, 0.08);
}

#app[data-view="main-menu"] .home-front__vote-results--empty .home-front__vote-bar-away {
    border-right: 1px solid rgba(246, 248, 250, 0.16);
}

#app[data-view="main-menu"] .home-front__vote-labels {
    align-items: flex-start;
    color: #aebed0;
    font-size: 0.68rem;
    line-height: 1.25;
}

#app[data-view="main-menu"] .home-front__vote-labels span {
    width: 50%;
}

#app[data-view="main-menu"] .home-front__vote-labels span:last-child {
    text-align: right;
}

#app[data-view="main-menu"] .home-front__vote-labels b {
    color: var(--sk3-white);
    font-size: 0.86rem;
}

#app[data-view="main-menu"] .home-front__vote-status {
    margin: 1px 0 0;
    color: var(--sk3-electric-soft);
    font-size: 0.7rem;
    font-weight: 750;
}

#app[data-view="main-menu"] .home-front__vote-status--error {
    color: #ff9aa5;
}

#app[data-view="main-menu"] .home-front__versus {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--sk3-electric);
    font-family: var(--sk3-display);
    font-size: 0.82rem;
    font-weight: 800;
}

#app[data-view="main-menu"] .home-front__game-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 9px 18px;
    align-items: center;
    justify-content: space-between;
    color: #b7c4d4;
    font-size: 0.76rem;
}

#app[data-view="main-menu"] .home-front__game-meta strong {
    color: var(--sk3-white);
    font-weight: 800;
}

#app[data-view="main-menu"] .home-front__game-state {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    color: var(--sk3-electric-soft);
    font-weight: 800;
}

#app[data-view="main-menu"] .home-front__game-state--live {
    color: #ff98a2;
}

#app[data-view="main-menu"] .home-front__countdown,
#app[data-view="main-menu"] .home-front__fan-pulse {
    display: block;
    margin: 12px 0 0;
    color: #90a5bd;
    font-size: 0.72rem;
    font-weight: 700;
}

#app[data-view="main-menu"] .home-front__action-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}

#app[data-view="main-menu"] .home-front__primary-action,
#app[data-view="main-menu"] .home-front__secondary-action,
#app[data-view="main-menu"] .home-front__text-link {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 15px;
    font: inherit;
    font-size: 0.78rem;
    font-weight: 850;
    cursor: pointer;
    border-radius: 9px;
}

#app[data-view="main-menu"] .home-front__primary-action {
    color: var(--sk3-midnight);
    background: var(--sk3-electric);
    border: 1px solid var(--sk3-electric);
}

#app[data-view="main-menu"] .home-front__secondary-action {
    color: var(--sk3-white);
    background: transparent;
    border: 1px solid rgba(246, 248, 250, 0.2);
}

#app[data-view="main-menu"] .home-front__action-icon {
    width: 0.95rem;
    height: 0.95rem;
}

#app[data-view="main-menu"] .home-front__notify.next-game-card__notify-btn {
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    min-height: 44px;
}

#app[data-view="main-menu"] .home-front__slate {
    display: flex;
    flex-direction: column;
    padding: 20px;
    background: rgba(5, 25, 57, 0.8);
}

#app[data-view="main-menu"] .home-front__slate-heading {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    justify-content: space-between;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(246, 248, 250, 0.14);
}

#app[data-view="main-menu"] .home-front__slate-heading h2,
#app[data-view="main-menu"] .home-front__slate-heading p {
    margin: 0;
}

#app[data-view="main-menu"] .home-front__slate-heading h2 {
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: 1.45rem;
    line-height: 1;
    text-transform: uppercase;
}

#app[data-view="main-menu"] .home-front__slate-heading p {
    margin-top: 5px;
    color: #8fa3ba;
    font-size: 0.68rem;
}

#app[data-view="main-menu"] .home-front__slate-list {
    display: grid;
    margin-top: 6px;
}

#app[data-view="main-menu"] .home-front__slate-game {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    width: 100%;
    min-height: 66px;
    padding: 11px 6px;
    color: var(--sk3-ice);
    background: transparent;
    border: 0;
    border-bottom: 1px solid rgba(246, 248, 250, 0.11);
    font: inherit;
    text-align: left;
    cursor: pointer;
}

#app[data-view="main-menu"] .home-front__slate-game:last-child {
    border-bottom: 0;
}

#app[data-view="main-menu"] .home-front__slate-game:hover,
#app[data-view="main-menu"] .home-front__slate-game.is-active {
    color: var(--sk3-white);
    background: rgba(85, 194, 255, 0.08);
}

#app[data-view="main-menu"] .home-front__slate-game.is-active {
    box-shadow: inset 3px 0 0 var(--sk3-electric);
}

#app[data-view="main-menu"] .home-front__slate-time {
    display: inline-flex;
    gap: 7px;
    align-items: center;
    color: var(--sk3-electric-soft);
    font-family: var(--sk3-display);
    font-size: 0.88rem;
    font-weight: 800;
    text-transform: uppercase;
}

#app[data-view="main-menu"] .home-front__slate-teams {
    display: grid;
    min-width: 0;
    gap: 3px;
    font-size: 0.73rem;
}

#app[data-view="main-menu"] .home-front__slate-teams strong,
#app[data-view="main-menu"] .home-front__slate-teams span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#app[data-view="main-menu"] .home-front__slate-teams span {
    color: #96a9bf;
}

#app[data-view="main-menu"] .home-front__slate-teams small {
    margin-right: 5px;
    color: var(--sk3-blue);
    font-size: 0.58rem;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

#app[data-view="main-menu"] .home-front__slate-score {
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: 1.12rem;
    font-weight: 800;
}

#app[data-view="main-menu"] .home-front__slate-arrow {
    color: var(--sk3-blue);
}

#app[data-view="main-menu"] .home-front__slate-empty {
    margin: auto 0;
    padding: 28px 4px;
    color: #9bacc0;
    font-size: 0.82rem;
    line-height: 1.55;
}

#app[data-view="main-menu"] .home-front__pulse,
#app[data-view="main-menu"] .home-front__destinations {
    margin-top: clamp(34px, 6vw, 58px);
}

#app[data-view="main-menu"] .home-front__section-heading {
    display: flex;
    gap: 20px;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 16px;
}

#app[data-view="main-menu"] .home-front__section-heading h2,
#app[data-view="main-menu"] .home-front__section-heading > p {
    margin: 0;
}

#app[data-view="main-menu"] .home-front__section-heading h2 {
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: clamp(1.75rem, 3.5vw, 2.65rem);
    line-height: 1;
    text-transform: uppercase;
}

#app[data-view="main-menu"] .home-front__section-heading > p {
    color: #8fa3b9;
    font-size: 0.76rem;
}

#app[data-view="main-menu"] .home-front__story {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(250px, 0.5fr);
    gap: clamp(22px, 5vw, 56px);
    padding: clamp(22px, 4vw, 34px);
}

#app[data-view="main-menu"] .home-front__story-kicker,
#app[data-view="main-menu"] .home-front__story h3,
#app[data-view="main-menu"] .home-front__story p {
    margin: 0;
}

#app[data-view="main-menu"] .home-front__story-kicker {
    color: var(--sk3-electric);
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

#app[data-view="main-menu"] .home-front__story h3 {
    margin-top: 8px;
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: clamp(1.55rem, 3vw, 2.2rem);
    line-height: 1;
    text-transform: uppercase;
}

#app[data-view="main-menu"] .home-front__story h3 + p {
    max-width: 68ch;
    margin-top: 12px;
    color: #adbbcc;
    font-size: 0.88rem;
    line-height: 1.62;
}

#app[data-view="main-menu"] .home-front__text-link {
    min-height: 44px;
    margin-top: 16px;
    padding: 10px 0;
    color: var(--sk3-blue);
    background: transparent;
    border: 0;
}

#app[data-view="main-menu"] .home-front__story-facts {
    display: grid;
    margin: 0;
    border-left: 1px solid rgba(246, 248, 250, 0.15);
}

#app[data-view="main-menu"] .home-front__story-facts > div {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0 10px 22px;
    border-bottom: 1px solid rgba(246, 248, 250, 0.1);
}

#app[data-view="main-menu"] .home-front__story-facts > div:last-child {
    border-bottom: 0;
}

#app[data-view="main-menu"] .home-front__story-facts dt,
#app[data-view="main-menu"] .home-front__story-facts dd {
    margin: 0;
}

#app[data-view="main-menu"] .home-front__story-facts dt {
    color: #8fa3b9;
    font-size: 0.7rem;
}

#app[data-view="main-menu"] .home-front__story-facts dd {
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: 1.15rem;
    font-weight: 800;
    text-align: right;
}

#app[data-view="main-menu"] .home-front__destination-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

#app[data-view="main-menu"] .home-front__destination {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
    min-height: 205px;
    padding: 22px;
    color: var(--sk3-ice);
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

#app[data-view="main-menu"] .home-front__destination:hover {
    background: rgba(13, 50, 103, 0.9);
    border-color: rgba(85, 194, 255, 0.42);
    transform: translateY(-2px);
}

#app[data-view="main-menu"] .home-front__destination:disabled {
    cursor: default;
    opacity: 0.58;
    transform: none;
}

#app[data-view="main-menu"] .home-front__destination-label {
    color: var(--sk3-blue);
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

#app[data-view="main-menu"] .home-front__destination h3,
#app[data-view="main-menu"] .home-front__destination p {
    margin: 0;
}

#app[data-view="main-menu"] .home-front__destination h3 {
    color: var(--sk3-white);
    font-family: var(--sk3-display);
    font-size: 1.48rem;
    line-height: 1.02;
    text-transform: uppercase;
}

#app[data-view="main-menu"] .home-front__destination p {
    color: #9eafc3;
    font-size: 0.78rem;
    line-height: 1.52;
}

#app[data-view="main-menu"] .home-front__destination-cta {
    margin-top: auto;
    color: var(--sk3-electric-soft);
    font-size: 0.75rem;
    font-weight: 850;
}

#app[data-view="main-menu"] .home-front__checkin {
    margin-top: 18px;
}

#app[data-view="main-menu"] .home-front__checkin .rink-social--compact {
    width: 100%;
    max-width: none;
    margin: 0;
    background: var(--sk3-electric);
    border-color: var(--sk3-electric);
    border-radius: 14px;
    box-shadow: none;
}

#app[data-view="main-menu"] .home-front__checkin .rink-social--compact > summary {
    color: var(--sk3-midnight);
}

#app[data-view="main-menu"] .home-front__checkin .rink-social--compact > summary span,
#app[data-view="main-menu"] .home-front__checkin .rink-social--compact > summary::after {
    color: var(--sk3-midnight);
}

#app[data-view="main-menu"] .home-front__checkin .rink-social--compact[open] {
    color: var(--sk3-ice);
    background: rgba(11, 42, 88, 0.92);
    border-color: rgba(229, 247, 10, 0.4);
}

#app[data-view="main-menu"] .home-front__checkin .rink-social--compact[open] > summary,
#app[data-view="main-menu"] .home-front__checkin .rink-social--compact[open] > summary span,
#app[data-view="main-menu"] .home-front__checkin .rink-social--compact[open] > summary::after {
    color: var(--sk3-white);
}

#app[data-view="main-menu"] .rink-ops-dock {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    max-width: none;
    margin-top: 30px;
    padding: 18px 20px;
    background: rgba(3, 14, 33, 0.48);
    border-radius: 14px;
    box-shadow: none;
}

#app[data-view="main-menu"] .rink-ops-dock__eyebrow,
#app[data-view="main-menu"] .rink-ops-dock__copy {
    grid-column: 1;
}

#app[data-view="main-menu"] .rink-ops-dock__actions {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    margin-top: 0;
}

#app[data-view="main-menu"] .rink-ops-dock__actions button {
    min-height: 44px;
}

@media (max-width: 860px) {
    #app[data-view="main-menu"] .home-front__intro,
    #app[data-view="main-menu"] .home-front__hero-grid,
    #app[data-view="main-menu"] .home-front__story {
        grid-template-columns: minmax(0, 1fr);
    }

    #app[data-view="main-menu"] .home-front__destination-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    #app[data-view="main-menu"] .home-front__night-facts {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        min-width: 0;
        padding: 16px 0 0;
        border-top: 1px solid rgba(246, 248, 250, 0.19);
        border-left: 0;
    }

    #app[data-view="main-menu"] .home-front__night-facts > div {
        display: grid;
        gap: 3px;
        justify-content: start;
    }

    #app[data-view="main-menu"] .home-front__night-facts dd {
        text-align: left;
    }

    #app[data-view="main-menu"] .home-front__story-facts {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        border-top: 1px solid rgba(246, 248, 250, 0.15);
        border-left: 0;
    }

    #app[data-view="main-menu"] .home-front__story-facts > div {
        display: grid;
        gap: 3px;
        justify-content: start;
        padding: 14px 10px 0 0;
        border-bottom: 0;
    }

    #app[data-view="main-menu"] .home-front__story-facts dd {
        text-align: left;
    }
}

@media (max-width: 680px) {
    #app[data-view="main-menu"] .rink-lobby {
        padding: 0 12px calc(92px + env(safe-area-inset-bottom));
    }

    #app[data-view="main-menu"] .rink-lobby__status-bar.arena-status {
        margin: 0 -12px 16px;
        padding-inline: 14px;
    }

    #app[data-view="main-menu"] .home-front__intro {
        gap: 17px;
        margin-bottom: 18px;
    }

    #app[data-view="main-menu"] .home-front__intro h1 {
        max-width: 15ch;
        font-size: clamp(2.45rem, 13vw, 3.8rem);
    }

    #app[data-view="main-menu"] .home-front__feature,
    #app[data-view="main-menu"] .home-front__slate,
    #app[data-view="main-menu"] .home-front__story,
    #app[data-view="main-menu"] .home-front__destination {
        border-radius: 15px;
    }

    #app[data-view="main-menu"] .home-front__feature {
        padding: 24px 16px 20px;
    }

    #app[data-view="main-menu"] .home-front__matchup {
        grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr);
        gap: 7px;
    }

    #app[data-view="main-menu"] .home-front__team {
        min-height: 92px;
        padding: 10px 8px;
    }

    #app[data-view="main-menu"] .home-front__team strong {
        font-size: clamp(1.08rem, 5.4vw, 1.42rem);
    }

    #app[data-view="main-menu"] .home-front__action-row > * {
        width: 100%;
    }

    #app[data-view="main-menu"] .home-front__section-heading {
        display: grid;
        gap: 7px;
        align-items: start;
    }

    #app[data-view="main-menu"] .home-front__destination-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    #app[data-view="main-menu"] .home-front__destination {
        min-height: 0;
    }

    #app[data-view="main-menu"] .rink-ops-dock {
        display: block;
    }

    #app[data-view="main-menu"] .rink-ops-dock__actions {
        margin-top: 14px;
    }
}

@media (max-width: 430px) {
    #app[data-view="main-menu"] .arena-status__count {
        max-width: 44%;
        text-align: right;
    }

    #app[data-view="main-menu"] .home-front__slate {
        padding: 17px 12px;
    }

    #app[data-view="main-menu"] .home-front__slate-game {
        grid-template-columns: 52px minmax(0, 1fr) auto;
        gap: 8px;
    }

    #app[data-view="main-menu"] .home-front__slate-teams strong,
    #app[data-view="main-menu"] .home-front__slate-teams span {
        white-space: normal;
        overflow-wrap: anywhere;
    }

    #app[data-view="main-menu"] .home-front__story {
        padding: 20px 16px;
    }

    #app[data-view="main-menu"] .home-front__story-facts {
        gap: 6px;
    }

    #app[data-view="main-menu"] .home-front__story-facts > div {
        padding-right: 4px;
    }
}

/* Reliability project: compact report context, readable data tables, and
   operational integrity states. These rules intentionally live after the
   editorial layers so the same interaction contract wins at every size. */
#app[data-view="rink-report"] .report-wrap--editorial .report-filters {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-height: 52px;
    margin: -8px 0 18px;
    padding: 7px 10px;
    background: #eef3f7;
    border: 1px solid var(--rrx-rule);
    border-top: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-edition {
    padding: clamp(20px, 3vw, 34px) clamp(18px, 3.4vw, 42px) clamp(19px, 2.8vw, 30px);
}

#app[data-view="rink-report"] .report-wrap--editorial .report-edition__title,
#app[data-view="rink-report"] .report-wrap--editorial .report-edition .report-masthead {
    font-size: clamp(2.8rem, 5.7vw, 4.75rem);
    line-height: 0.88;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-edition__deck,
#app[data-view="rink-report"] .report-wrap--editorial .report-edition .report-subtitle {
    margin-top: 12px;
    font-size: clamp(0.9rem, 1.25vw, 1.02rem);
    line-height: 1.45;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-edition__meta {
    margin-top: 10px;
    padding-top: 10px;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-chip-select {
    display: inline-grid;
    grid-template-columns: auto minmax(170px, 230px);
    align-items: center;
    gap: 8px;
    margin: 0;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-chip-select__label {
    color: var(--rrx-muted);
    font-size: 0.66rem;
    font-weight: 900;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

#app[data-view="rink-report"] .report-wrap--editorial .report-chip-select select {
    min-height: 40px;
    padding: 0 34px 0 10px;
    color: var(--rrx-ink);
    background: var(--rrx-paper);
    border: 1px solid var(--rrx-rule-strong);
    border-radius: 4px;
    font-size: 0.82rem;
    font-weight: 800;
}

#app[data-view="statistics"] .stats-player-tools {
    grid-template-columns: auto minmax(140px, 180px) auto minmax(230px, 1fr);
    align-items: center;
    gap: 8px 10px;
}

#app[data-view="statistics"] .stats-player-tools :where(.stats-select, .stats-search-input) {
    width: 100%;
}

#app[data-view="statistics"] .stats-table thead th {
    position: sticky;
    z-index: 2;
    top: 0;
}

#app[data-view="statistics"] .stats-table tbody tr[data-team-name],
#app[data-view="statistics"] .stats-table tbody tr[data-player-key] {
    cursor: pointer;
}

#app[data-view="statistics"] .stats-table tbody tr:focus-within {
    background: rgba(85, 194, 255, 0.15);
    box-shadow: inset 4px 0 0 var(--sk3-blue);
}

#app[data-view="statistics"] .stats-more-insight {
    margin-top: 18px;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--sk3-border);
    border-radius: 10px;
}

#app[data-view="statistics"] .stats-more-insight > summary {
    min-height: 44px;
    padding: 12px 14px;
    color: var(--sk3-midnight);
    background: #f1f6fa;
    font-weight: 850;
    cursor: pointer;
}

#app[data-view="statistics"] .stats-more-insight > :not(summary) {
    margin-inline: 14px;
}

#app[data-view="statistics"] .stats-more-insight > :last-child {
    margin-bottom: 14px;
}

#app[data-view="admin-operations"] .admin-integrity-grid {
    grid-template-columns: minmax(0, 1.65fr) minmax(280px, 0.75fr);
    align-items: start;
}

#app[data-view="admin-operations"] .admin-game-state-summary {
    display: grid;
    grid-template-columns: repeat(5, minmax(82px, 1fr));
    gap: 8px;
    margin-bottom: 14px;
}

#app[data-view="admin-operations"] .admin-game-state-summary__item {
    display: grid;
    gap: 3px;
    min-width: 0;
    padding: 10px;
    background: #f4f7f9;
    border: 1px solid var(--sk3-border);
    border-radius: 9px;
}

#app[data-view="admin-operations"] .admin-game-state-summary__item strong {
    color: var(--sk3-midnight);
    font-family: var(--sk3-display);
    font-size: 1.4rem;
    line-height: 1;
}

#app[data-view="admin-operations"] .admin-game-state-summary__item span {
    color: var(--sk3-steel);
    font-size: 0.66rem;
    font-weight: 800;
    overflow-wrap: anywhere;
    text-transform: uppercase;
}

#app[data-view="admin-operations"] .admin-game-integrity-list,
#app[data-view="admin-operations"] .admin-integrity-alert-list {
    display: grid;
    gap: 10px;
}

#app[data-view="admin-operations"] .admin-game-integrity {
    min-width: 0;
    padding: 13px;
    background: #fbfcfd;
    border: 1px solid var(--sk3-border);
    border-left: 5px solid #8d99a8;
    border-radius: 10px;
}

#app[data-view="admin-operations"] .admin-game-integrity--missing,
#app[data-view="admin-operations"] .admin-game-integrity--sync-conflict,
#app[data-view="admin-operations"] .admin-game-integrity--needs-action {
    border-left-color: var(--sk3-live);
}

#app[data-view="admin-operations"] .admin-game-integrity--in-progress {
    border-left-color: #d89114;
}

#app[data-view="admin-operations"] .admin-game-integrity--final {
    border-left-color: var(--sk3-saved);
}

#app[data-view="admin-operations"] .admin-game-integrity__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
}

#app[data-view="admin-operations"] .admin-game-integrity__header h3 {
    margin: 6px 0 0;
    color: var(--sk3-midnight);
    font-size: 0.94rem;
    line-height: 1.3;
}

#app[data-view="admin-operations"] .admin-game-integrity__header code {
    max-width: 42%;
    overflow-wrap: anywhere;
    color: var(--sk3-steel);
    font-size: 0.65rem;
    text-align: right;
}

#app[data-view="admin-operations"] .admin-game-integrity__facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
}

#app[data-view="admin-operations"] .admin-game-integrity__fact {
    min-width: 0;
    padding: 8px;
    background: var(--sk3-white);
    border: 1px solid #e2e8ed;
    border-radius: 7px;
}

#app[data-view="admin-operations"] .admin-game-integrity__fact dt {
    color: var(--sk3-steel);
    font-size: 0.61rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

#app[data-view="admin-operations"] .admin-game-integrity__fact dd {
    margin: 3px 0 0;
    overflow-wrap: anywhere;
    color: var(--sk3-midnight);
    font-size: 0.76rem;
    font-weight: 750;
}

#app[data-view="admin-operations"] .admin-game-integrity__fact--score {
    grid-column: span 2;
}

#app[data-view="admin-operations"] .admin-integrity-alert {
    padding: 12px;
    color: #6e2c0a;
    background: #fff5df;
    border: 1px solid #e1a64a;
    border-radius: 9px;
    line-height: 1.45;
}

@media (max-width: 900px) {
    #app[data-view="admin-operations"] .admin-integrity-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    body {
        overflow-x: clip;
    }

    #app[data-view="statistics"] .stats-player-tools {
        grid-template-columns: minmax(0, 1fr);
        gap: 4px;
    }

    #app[data-view="statistics"] .stats-player-tools .stats-label:not(:first-child) {
        margin-top: 6px;
    }

    #app[data-view="statistics"] .stats-table,
    #app[data-view="statistics"] .stats-table--players {
        font-size: 0.78rem;
    }

    #app[data-view="statistics"] .stats-table thead th {
        font-size: 0.64rem;
    }
}

@supports not (overflow-x: clip) {
    @media (max-width: 800px) {
        body {
            overflow-x: hidden;
        }
    }
}

@media (max-width: 800px) {
    #app[data-view="rink-report"] .report-wrap--editorial .report-edition {
        padding: 15px 14px 17px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-edition__eyebrow {
        gap: 7px;
        margin-bottom: 8px;
        font-size: 0.61rem;
        letter-spacing: 0.12em;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-edition__eyebrow::before {
        width: 20px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-edition__title,
    #app[data-view="rink-report"] .report-wrap--editorial .report-edition .report-masthead {
        font-size: clamp(2.45rem, 12vw, 3.1rem);
        line-height: 0.86;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-edition__deck,
    #app[data-view="rink-report"] .report-wrap--editorial .report-edition .report-subtitle {
        margin-top: 10px;
        font-size: 0.8rem;
        line-height: 1.35;
        -webkit-line-clamp: 1;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-edition__meta {
        display: none;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-toolbar--editorial {
        position: sticky;
        z-index: 28;
        top: 58px;
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
        gap: 6px;
        max-height: none;
        padding: 8px;
        overflow: visible;
        overscroll-behavior: contain;
        box-shadow: 0 8px 20px rgba(7, 24, 45, 0.14);
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-season-control {
        display: grid;
        grid-template-columns: 55px minmax(0, 1fr);
        align-items: center;
        gap: 7px;
        width: 100%;
        min-width: 0;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-season-control select {
        min-height: 40px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-toolbar--editorial .report-toolbar__divisions,
    #app[data-view="rink-report"] .report-wrap--editorial .report-toolbar--editorial .rr-nav {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 5px;
        overflow: visible;
        padding: 0;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-toolbar--editorial .report-toolbar__row {
        align-items: stretch;
        width: 100%;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-toolbar--editorial .rr-nav {
        justify-self: stretch;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-toolbar--editorial .report-toolbar__divisions {
        grid-template-columns: repeat(3, minmax(0, 1fr)) 42px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-toolbar--editorial .report-filter__label {
        display: none;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-toolbar--editorial :where(.report-filter__btn, .rr-nav__item) {
        width: 100%;
        min-height: 40px;
        padding: 8px 11px;
        white-space: nowrap;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-filter__favorite-action {
        width: 42px;
        max-width: 42px;
        padding-inline: 0;
        overflow: hidden;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-filter__favorite-action .report-filter__text {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        padding: 0;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-filters {
        position: relative;
        min-height: 48px;
        margin: -8px 0 12px;
        padding: 6px 8px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-status {
        margin: 8px 0;
        padding: 8px 10px;
        font-size: 0.7rem;
        line-height: 1.35;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-chip-select {
        grid-template-columns: auto minmax(0, 1fr);
        width: 100%;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-table-wrap {
        overflow-x: visible;
    }

    #app[data-view="rink-report"] .report-wrap--editorial table.rrx-table {
        width: 100%;
        min-width: 0;
        table-layout: fixed;
        font-size: 0.76rem;
    }

    #app[data-view="rink-report"] .report-wrap--editorial table.rrx-table :where(th, td) {
        padding-inline: 6px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial table.rrx-table :where(th, td):nth-child(1) {
        width: 34px;
    }

    #app[data-view="rink-report"] .report-wrap--editorial table.rrx-table :where(th, td):nth-child(2) {
        width: 44%;
        overflow-wrap: anywhere;
    }

    #app[data-view="rink-report"] .report-wrap--editorial table.rrx-table :where(th, td):nth-child(4) {
        display: none;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__actions,
    #app[data-view="rink-report"] .report-wrap--editorial .rr-last-week-boxscore__actions {
        align-items: center;
        flex-direction: row;
        flex-wrap: wrap;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__actions :where(a, button),
    #app[data-view="rink-report"] .report-wrap--editorial .rrx-lead__action,
    #app[data-view="rink-report"] .report-wrap--editorial :where(.rr-last-week-boxscore__link, .rr-last-week-boxscore__actions a, .rr-last-week-boxscore__actions button) {
        width: auto;
        min-height: 44px;
    }

    #app[data-view="admin-operations"] .admin-game-state-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #app[data-view="admin-operations"] .admin-game-integrity__header {
        align-items: flex-start;
        flex-direction: column;
    }

    #app[data-view="admin-operations"] .admin-game-integrity__header code {
        max-width: 100%;
        text-align: left;
    }

    #app[data-view="admin-operations"] .admin-game-integrity__facts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 390px) {
    #app[data-view="rink-report"] .report-wrap--editorial .report-toolbar--editorial {
        top: 54px;
        max-height: none;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-chip-select__label {
        display: none;
    }

    #app[data-view="rink-report"] .report-wrap--editorial .report-chip-select {
        grid-template-columns: minmax(0, 1fr);
    }

    #app[data-view="admin-operations"] .admin-game-integrity__facts {
        grid-template-columns: minmax(0, 1fr);
    }

    #app[data-view="admin-operations"] .admin-game-integrity__fact--score {
        grid-column: auto;
    }
}

/* Keep the focused Rink Report story feed inside the editorial paper palette. */
#app[data-view="rink-report"] .report-wrap--editorial .rr-story-lead {
    color: var(--rrx-paper);
}

#app[data-view="rink-report"] .report-wrap--editorial .rr-story-lead :where(h2, dd) {
    color: var(--rrx-paper);
}

#app[data-view="rink-report"] .report-wrap--editorial .rr-story-lead__analysis {
    color: #cbd7e5;
}

#app[data-view="rink-report"] .report-wrap--editorial :where(
    .rr-story-section,
    .rr-preview-edition__heading,
    .rr-preview-edition__matchups,
    .rr-preview-edition__players
) {
    color: var(--rrx-ink);
    background: var(--rrx-paper);
    border-color: var(--rrx-rule);
    box-shadow: 0 10px 26px rgba(7, 24, 45, 0.07);
}

#app[data-view="rink-report"] .report-wrap--editorial :where(
    .rr-story-section,
    .rr-preview-edition__heading,
    .rr-preview-edition__matchups,
    .rr-preview-edition__players,
    .rr-story-card,
    .rr-preview-card,
    .rr-preview-player,
    .rr-game-recap__score
) :where(h2, h3, strong) {
    color: var(--rrx-navy);
}

#app[data-view="rink-report"] .report-wrap--editorial :where(
    .rr-story-card,
    .rr-preview-card,
    .rr-preview-player,
    .rr-game-recap__score
) {
    color: var(--rrx-ink);
    background: var(--rrx-ice);
    border-color: var(--rrx-rule);
}

#app[data-view="rink-report"] .report-wrap--editorial :where(
    .rr-story-section__heading button,
    .rr-story-card a,
    .rr-preview-card a,
    .rr-story-feed__destinations a,
    .rr-preview-edition__all
) {
    color: var(--rrx-navy);
    text-decoration: underline;
    text-decoration-color: var(--rrx-cyan);
    text-underline-offset: 0.2em;
}

#app[data-view="rink-report"] .report-wrap--editorial :where(.rr-story-card > p, .rr-preview-card > p) {
    color: #735800;
}

#app[data-view="rink-report"] .report-wrap--editorial .rr-preview-card > p.rr-preview-card__story {
    color: var(--rrx-ink);
}

#app[data-view="rink-report"] .report-wrap--editorial :where(
    .rr-story-card > span,
    .rr-preview-card > span,
    .rr-story-feed__destinations span,
    .rr-preview-player div > span,
    .rr-preview-player p
) {
    color: var(--rrx-muted);
}

#app[data-view="rink-report"] .report-wrap--editorial .rr-story-feed__destinations {
    color: var(--rrx-ink);
    background: #f7fbe8;
    border-color: #bfcd79;
}

#app[data-view="rink-report"] .report-wrap--editorial .rr-game-recap__score :where(strong, b) {
    color: var(--rrx-navy);
}

/* Editorial clarity pass: canonical matchup facts, recaps, and compact metadata. */
.live-game-context__meta {
    min-width: 0;
    color: #9fb0c5;
    font-size: 0.78rem;
    font-weight: 650;
}

.pre-game-waiting-room__notify-copy {
    display: block;
    max-width: 22rem;
    color: rgba(255, 255, 255, 0.58);
    font-size: 0.72rem;
    line-height: 1.4;
}

.live-pregame-preview__facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    justify-content: stretch;
    margin-top: 6px;
}

.live-pregame-preview__facts .live-summary-stat-strip__item {
    min-width: 0;
    text-align: center;
}

.live-pregame-preview__facts .live-summary-stat-strip__label {
    text-transform: none;
}

.live-summary__recap {
    margin: 0;
    color: #dbe5f1;
    font-size: 0.96rem;
    line-height: 1.6;
}

#app[data-view="rink-report"] .report-wrap--editorial .rr-preview-card__angle {
    display: block;
    color: var(--rrx-navy);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1rem;
    line-height: 1.3;
}

#app[data-view="rink-report"] .report-wrap--editorial .rr-last-week-boxscore__insight {
    margin: 0;
    color: var(--rrx-ink);
    font-size: 0.82rem;
    line-height: 1.5;
}

.stats-team-roster__number--empty {
    visibility: hidden;
}

@media (max-width: 680px) {
    .live-game-context {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .live-game-context__coverage {
        flex-basis: 100%;
        margin-left: 0;
        text-align: left;
    }

    .live-pregame-preview__facts {
        grid-template-columns: 1fr;
    }

    .live-pregame-preview__facts .live-summary-stat-strip__item:not(:last-child)::after {
        top: auto;
        right: 12%;
        bottom: 0;
        left: 12%;
        width: auto;
        height: 1px;
    }
}

/* Approved scorekeeper submission review — existing controls, clearer hierarchy. */
#app[data-navigation-kind="workflow"] :is(h1, h2, h3)[tabindex="-1"]:focus { outline: none; }
#app[data-navigation-kind="workflow"] .card { animation: none; }
#app[data-navigation-kind="workflow"] :is(h1, h2, h3) { animation: none; }
#app[data-navigation-kind="workflow"] .workflow-nav__back:disabled { opacity: 0.45; cursor: default; }

#app[data-navigation-kind="workflow"][data-view] {
    --card-background: #071a35;
    --surface-alt: #102c50;
    --border-color: #304b6a;
    background: #071a35;
}

#app[data-view="scoring"] .scoring-live-card {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}
#app[data-view="scoring"] .scoring-live-topline { gap: 10px; margin: 0 0 16px; }
#app[data-view="scoring"] .scoring-live-schedule { gap: 4px; text-align: left; }
#app[data-view="scoring"] .scoring-live-schedule span { margin: 0; font-size: 0.875rem; }
#app[data-view="scoring"] .scoreboard {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 0;
    margin: 0 0 16px;
    border: 0;
    background: transparent;
    box-shadow: none;
}
#app[data-view="scoring"] .scoreboard .team {
    grid-row: 1;
    padding: 12px 8px;
    border: 1px solid #304b6a;
    border-radius: 10px;
    background: #102c50;
    box-shadow: none;
    animation: none;
}
#app[data-view="scoring"] .scoreboard .team[data-team-position="left"] { grid-column: 1; }
#app[data-view="scoring"] .scoreboard .team[data-team-position="right"] { grid-column: 2; }
#app[data-view="scoring"] .scoreboard .team h2 { min-height: 38px; margin: 8px 0 0; font: 700 0.9375rem/1.3 Inter, Arial, sans-serif; }
#app[data-view="scoring"] .scoreboard .team .score { color: var(--gold-color); font-size: 3.5rem; line-height: 1.1; margin: 8px 0 12px; text-shadow: none; }
#app[data-view="scoring"] .team-goal-button { min-height: 48px; font: 700 1rem/1.3 Inter, Arial, sans-serif; text-transform: none; box-shadow: none; }
#app[data-view="scoring"] .shot-stepper { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; gap: 4px; align-items: center; margin: 12px 0 0; }
#app[data-view="scoring"] .shot-stepper__button { grid-row: 1; min-width: 44px; width: 44px; min-height: 44px; height: 44px; padding: 0; box-shadow: none; }
#app[data-view="scoring"] .shot-stepper__button:first-child { grid-column: 1; }
#app[data-view="scoring"] .shot-stepper__button:last-child { grid-column: 3; }
#app[data-view="scoring"] .shot-stepper__label { grid-column: 2; grid-row: 1; font-size: 0.75rem; }
#app[data-view="scoring"] .shot-button__count { display: block; padding: 0; background: transparent; color: #f0f5ff; font-size: 1rem; }
#app[data-view="scoring"] .scoreboard-center { grid-column: 1 / -1; grid-row: 2; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; padding: 0; border: 0; }
#app[data-view="scoring"] .score-divider { display: none; }
#app[data-view="scoring"] .period-btn { min-height: 44px; min-width: 44px; font-size: 0.875rem; }
#app[data-view="scoring"] .team-swap-compact { min-height: 44px; padding: 8px 12px; border: 1px solid #304b6a; border-radius: 8px; font: 600 0.875rem/1.4 Inter, Arial, sans-serif; }
#app[data-view="scoring"] .score-actions-live { position: static; padding: 0; margin: 0 0 16px; background: transparent; border: 0; box-shadow: none; }
#app[data-view="scoring"] .game-events-panel { padding: 12px; border: 1px solid #304b6a; border-radius: 10px; background: #102c50; }
#app[data-view="scoring"] .game-events-panel__header h3 { font: 700 1rem/1.4 Inter, Arial, sans-serif; text-transform: none; }
#app[data-view="scoring"] .game-event-row { background: transparent; border: 0; border-top: 1px solid #304b6a; border-radius: 0; }
#app[data-view="scoring"] .game-event-row__body { background: transparent; padding: 12px 0; }

#app:is([data-view="scoring"], [data-view="attendance"], [data-view="goal-details"], [data-view="penalty-details"]) .btn-success {
    color: #071a35;
    background: var(--gold-color);
    border-color: var(--gold-color);
    box-shadow: none;
}

#app[data-navigation-kind="workflow"] :is(.btn, .minutes-button):disabled {
    color: #b5c5dc;
    background: #22384f;
    border-color: #466182;
    opacity: 0.65;
    cursor: default;
    box-shadow: none;
}

#app[data-view="scoring"] .score-submit-callout {
    padding: 16px 0 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

#app[data-view="scoring"] .score-submit-callout__header {
    display: grid;
    gap: 12px;
}

#app[data-view="scoring"] .score-submit-callout__status[hidden] { display: none; }
#app[data-view="scoring"] .score-submit-callout:has(.submit-checklist--optional) .score-submit-callout__status { color: #f4ce78; background: #37352c; }

#app[data-view="scoring"] .score-submit-callout__schedule {
    margin: 10px 0 0;
    color: var(--secondary-color);
    font-size: 0.875rem;
}

#app[data-view="scoring"] .score-submit-callout__message {
    margin: 16px 0;
    font-size: 1rem;
    line-height: 1.55;
}

#app[data-view="scoring"] .score-submit-callout__score {
    padding: 16px 10px;
    background: #071a35;
    border: 1px solid var(--border-color);
    border-radius: 10px;
}

#app[data-view="scoring"] .final-review-facts {
    justify-content: flex-start;
    gap: 8px 18px;
    font-size: 0.875rem;
    line-height: 1.5;
    margin: 14px 0;
}

#app[data-view="scoring"] .final-attendance-review {
    padding: 12px 0;
    border: 0;
    border-top: 1px solid var(--border-color);
    border-radius: 0;
    background: transparent;
}

#app[data-view="scoring"] .final-attendance-review summary {
    display: list-item;
    min-height: 44px;
    padding: 10px 0;
    font-size: 0.875rem;
}

#app[data-view="scoring"] .final-attendance-review summary strong { margin-left: 6px; }

#app[data-view="scoring"] .score-submit-callout__checks-passed {
    color: var(--secondary-color);
    font-size: 0.875rem;
    font-weight: 400;
    margin: 14px 0 20px;
}

#app[data-view="scoring"] .score-submit-callout__checks-passed::before { content: none; }

#app[data-view="scoring"] .score-actions-submit {
    position: static;
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 16px 0 0;
    border-top: 1px solid var(--border-color);
    background: transparent;
    box-shadow: none;
}

#app[data-view="scoring"] .score-actions-submit .btn {
    width: 100%;
    max-width: none;
    min-height: 48px;
    margin: 0;
}

#app[data-view="scoring"] .score-submit-callout__hint {
    text-align: left;
    font-size: 0.875rem;
    line-height: 1.5;
}

#app[data-view="scoring"] .final-verification--automatic {
    border: 0;
    border-radius: 0;
    background: transparent;
    padding: 0;
    margin: 16px 0;
    color: var(--secondary-color);
    font-size: 0.875rem;
    font-weight: 400;
}

#app[data-view="scoring"] .score-submit-callout__support {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-top: 16px;
}

#app[data-view="scoring"] .score-submit-shootout {
    background: transparent;
    border: 0;
    border-top: 1px solid var(--border-color);
    border-radius: 0;
    padding: 16px 0 0;
}

#app[data-view="scoring"] .score-submit-shootout__teams .btn { white-space: normal; }

#app[data-view="scoring"] .score-actions-live {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

#app[data-view="scoring"] .score-actions-live .btn {
    width: 100%;
    max-width: none;
    min-width: 0;
    min-height: 48px;
    white-space: normal;
    font-size: 1rem;
    font-family: inherit;
    text-transform: none;
    margin: 0;
}

#app[data-view="scoring"] .score-actions-live [data-action="add-penalty"] {
    color: #f0f5ff;
    background: #122d4d;
    border: 1px solid #3a5675;
    box-shadow: none;
}

#app[data-view="scoring"] :is(.score-submit-callout__support, .submission-receipt__actions) .btn {
    width: 100%;
    max-width: none;
}

#app[data-view="scoring"] .game-event-row > .event-action--danger {
    background: transparent;
    border-color: #835367;
    color: #ffb2bd;
    box-shadow: none;
    min-height: 44px;
}

#app[data-view="scoring"] .game-event-row__kind { color: #69c6f3; }

#app[data-view="scoring"] :is(.submission-progress-card, .submission-receipt) {
    padding: 24px;
    border: 1px solid var(--border-color);
    background: #071a35;
    box-shadow: none;
}

#app[data-view="scoring"] .submission-receipt__actions > .btn-success { grid-column: 1 / -1; }

#app[data-view="attendance"] .attendance-card {
    max-height: none;
    overflow: visible;
    gap: 12px;
    padding: 16px;
    background: #071a35;
    border: 0;
    box-shadow: none;
}

#app[data-view="attendance"] .attendance-card :is(.attendance-card__intro, .attendance-card__side-note) {
    margin: 0;
    padding: 0;
    font-size: 0.9375rem;
    line-height: 1.5;
    background: transparent;
    border: 0;
}

#app[data-view="attendance"] .attendance-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    max-height: none;
    overflow: visible;
    padding: 0;
}

#app[data-view="attendance"] .team-column {
    min-width: 0;
    padding: 12px;
    background: #102c50;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    gap: 0;
    text-align: left;
}

#app[data-view="attendance"] .team-column h3 { font-size: 1rem; margin: 8px 0 12px; text-align: left; padding: 0; border: 0; }
#app[data-view="attendance"] .team-position-label { margin: 0; padding: 0; border: 0; background: transparent; }
#app[data-view="attendance"] .checkbox-group { gap: 0; }

#app[data-view="attendance"] .checkbox-item {
    min-height: 52px;
    padding: 8px 0;
    margin: 0;
    gap: 8px;
    border: 0;
    border-top: 1px solid var(--border-color);
    border-radius: 0;
    background: transparent;
}

#app[data-view="attendance"] .checkbox-item label {
    font-size: 0.9375rem;
    line-height: 1.4;
    min-width: 0;
    overflow-wrap: anywhere;
    text-align: left;
}

#app[data-view="attendance"] .checkbox-item [data-role="jersey-input"] {
    width: 44px;
    min-width: 44px;
    height: 44px;
    font-size: 1rem;
    border-radius: 7px;
}

#app[data-view="attendance"] .attendance-team-controls { gap: 8px; margin: 0 0 12px; padding: 0; border: 0; background: transparent; }
#app[data-view="attendance"] .attendance-team-controls > span { text-align: left; font-size: 0.875rem; font-weight: 400; }
#app[data-view="attendance"] .attendance-team-controls__actions .btn { min-height: 44px; padding: 8px; font-size: 0.875rem; }
#app[data-view="attendance"] .btn-sub-add { margin: 8px 0 0; color: #f0f5ff; background: #122d4d; border: 1px solid #3a5675; box-shadow: none; }
#app[data-view="attendance"] :is(.attendance-card__intro, .attendance-card__side-note) { text-align: left; }
#app[data-view="attendance"] .attendance-card__footer { position: static; margin: 0; padding: 16px 0 0; }
#app[data-view="attendance"] .attendance-card__status [data-role="attendance-guidance"] { font-size: 0.875rem; max-width: none; }

#app:is([data-view="goal-details"], [data-view="penalty-details"]) :is([data-goal-form], [data-penalty-form]) {
    width: min(100%, 760px);
    margin-inline: auto;
    background: #071a35;
    border: 0;
    box-shadow: none;
    padding: 16px;
}

#app:is([data-view="goal-details"], [data-view="penalty-details"]) :is(.goal-form-grid, .penalty-form-grid) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 16px;
}

#app:is([data-view="goal-details"], [data-view="penalty-details"]) .form-group {
    min-width: 0;
    margin: 0;
    grid-column: auto;
    grid-row: auto;
}

#app:is([data-view="goal-details"], [data-view="penalty-details"]) .form-group--team,
#app:is([data-view="goal-details"], [data-view="penalty-details"]) .form-group--type,
#app[data-view="goal-details"] .form-group--period,
#app[data-view="goal-details"] .form-group--time { grid-column: 1 / -1; }

#app:is([data-view="goal-details"], [data-view="penalty-details"]) :is(input, select) { font-size: 1rem; }
#app:is([data-view="goal-details"], [data-view="penalty-details"]) .minutes-button { min-height: 44px; padding: 8px; white-space: normal; }
#app:is([data-view="goal-details"], [data-view="penalty-details"]) .time-entry { max-width: 380px; margin-inline: auto; gap: 8px; width: 100%; }
#app:is([data-view="goal-details"], [data-view="penalty-details"]) .time-entry-display { padding: 6px 16px; font-size: 1.875rem; }
#app:is([data-view="goal-details"], [data-view="penalty-details"]) .time-entry-keypad { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
#app:is([data-view="goal-details"], [data-view="penalty-details"]) .time-keypad-button { min-height: 44px; padding: 8px; box-shadow: none; }
#app:is([data-view="goal-details"], [data-view="penalty-details"]) .time-entry-clear { background: #122d4d; border: 1px solid #3a5675; border-radius: 7px; min-height: 44px; }
#app[data-view="goal-details"] .goal-form-optional { padding: 12px 0; background: transparent; border: 0; border-top: 1px solid var(--border-color); border-radius: 0; }
#app[data-view="goal-details"] .goal-form-optional__grid { grid-template-columns: 1fr; }
#app:is([data-view="goal-details"], [data-view="penalty-details"]) .form-actions { position: static; margin: 16px 0 0; padding: 16px 0 0; border-top: 1px solid var(--border-color); background: transparent; }
#app:is([data-view="goal-details"], [data-view="penalty-details"]) .scoring-form-error { margin: 8px 0 0; font-size: 0.9375rem; }
#app:is([data-view="goal-details"], [data-view="penalty-details"]) [aria-invalid="true"] { border-color: #ffb2bd; }

#app[data-view="game-selection"] .game-selection-card { background: #071a35; padding: 16px; border: 0; box-shadow: none; }
#app[data-view="game-selection"] .game-selection-intro { margin: 8px 0 16px; }
#app[data-view="game-selection"] .game-selection-scope .btn { margin: 0; max-width: none; }
#app[data-view="game-selection"] :is(.game-selection-search, .game-selection-filters, .game-selection-intro, .game-selection-summary) { text-align: left; }
#app[data-view="game-selection"] .game-item { gap: 8px; padding: 16px; background: #102c50; border: 1px solid #304b6a; border-radius: 10px; }
#app[data-view="game-selection"] .game-item h3 { font-size: 1rem; }

#app[data-navigation-kind="workflow"] ~ .sk-action-sheet-overlay:not([data-public-access="true"]) .sk-action-sheet { background: #071a35; }

@media (max-width: 768px) {
    #app[data-view="goal-details"] .goal-form-grid .form-group--assist { grid-column: 2 !important; }
    #app[data-view="goal-details"] .goal-form-grid :is(.form-group--team, .form-group--period, .form-group--time) { grid-column: 1 / -1 !important; }
    #app[data-view="penalty-details"] .penalty-form-grid { grid-template-columns: 1fr; }
    #app[data-view="scoring"] .score-submit-callout__support { grid-template-columns: 1fr; }
    #app[data-view="scoring"] :is(.submission-progress-card, .submission-receipt) { padding: 16px; }
}

@media (max-width: 600px) {
    #app[data-view="attendance"] .attendance-grid { grid-template-columns: 1fr; }
    #app[data-view="scoring"] .score-submit-shootout__teams { grid-template-columns: 1fr; }
    #app[data-view="scoring"] .final-submit-screen__sync { gap: 8px; flex-wrap: wrap; font-size: 0.875rem; }
}