.editorial-page {
    padding: clamp(1.5rem, 3vw, 2.25rem) 0 5rem;
    color: var(--tp-text-primary);
}

.editorial-page a {
    color: var(--tp-link);
}

.editorial-page a:hover {
    color: var(--tp-link-hover);
}

.editorial-page-hero {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, rgb(var(--tp-surface-rgb) / 0.94) 0%, rgb(var(--tp-cream-rgb) / 0.96) 52%, rgb(var(--tp-deep-rgb) / 0.90) 100%);
    border: 1px solid var(--tp-border);
    border-radius: 32px;
    box-shadow: var(--tp-shadow);
    backdrop-filter: blur(12px);
    padding: clamp(2rem, 5vw, 3.25rem);
    margin-bottom: 1.75rem;
    isolation: isolate;
}

.editorial-page-hero::before,
.editorial-page-hero::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
}

.editorial-page-hero::before {
    width: 22rem;
    height: 22rem;
    top: -8rem;
    right: -7rem;
    background: radial-gradient(circle, rgb(var(--tp-gold-rgb) / 0.12) 0%, transparent 70%);
}

.editorial-page-hero::after {
    width: 18rem;
    height: 18rem;
    bottom: -10rem;
    left: -5rem;
    background: radial-gradient(circle, rgb(var(--tp-deep-rgb) / 0.52) 0%, transparent 70%);
}

.editorial-page-hero > * {
    position: relative;
    z-index: 1;
}

.editorial-page-kicker {
    font-size: 0.68rem;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    color: var(--tp-gold);
    font-weight: 600;
    margin-bottom: 1.25rem;
}

.editorial-page-hero h1 {
    font-size: clamp(2.2rem, 4.8vw, 4rem);
    font-weight: 300;
    line-height: 1.1;
    letter-spacing: -0.03em;
    color: var(--tp-text-primary);
    margin: 0;
}

.editorial-page-intro {
    max-width: 60ch;
    margin-top: 1.25rem;
    font-size: 1.05rem;
    line-height: 1.8;
    color: var(--tp-text-secondary);
}

.editorial-page-hero-compact {
    padding: clamp(1.75rem, 4vw, 2.5rem);
}

.editorial-metric-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem;
    margin-top: 1.75rem;
}

.editorial-metric {
    min-width: 170px;
    padding: 1rem 1.15rem;
    border-radius: 18px;
    border: 1px solid var(--tp-border);
    background: rgb(var(--tp-surface-rgb) / 0.76);
    box-shadow: 0 12px 28px rgb(var(--tp-shadow-rgb) / 0.08);
}

.editorial-metric strong {
    display: block;
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--tp-text-primary);
}

.editorial-metric span {
    display: block;
    margin-top: 0.25rem;
    font-size: 0.82rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--tp-text-muted);
}

.editorial-panel {
    background: var(--tp-surface);
    border: 1px solid var(--tp-border);
    border-radius: 24px;
    box-shadow: 0 18px 46px rgb(var(--tp-shadow-rgb) / 0.08);
    padding: clamp(1.25rem, 3vw, 1.85rem);
    margin-bottom: 1.5rem;
    backdrop-filter: blur(14px);
}

.editorial-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}

.editorial-panel-title {
    margin: 0;
    font-size: 1rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--tp-text-muted);
    font-weight: 600;
}

.editorial-grid {
    display: grid;
    gap: 1.25rem;
}

.editorial-grid-two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.editorial-action-row {
    display: flex;
    justify-content: center;
    gap: 0.9rem;
    flex-wrap: wrap;
    margin-top: 2rem;
}

.editorial-page .btn {
    border-radius: 999px;
    padding: 0.82rem 1.3rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    border-width: 1px;
    box-shadow: 0 10px 24px rgb(var(--tp-shadow-rgb) / 0.08);
    transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

.editorial-page .btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 16px 28px rgb(var(--tp-shadow-rgb) / 0.12);
}

.editorial-page-hero .btn,
.editorial-page-hero .btn-primary,
.editorial-page-hero .btn-outline-primary,
.editorial-page-hero .btn-outline-secondary,
.editorial-page-hero .btn-light {
    background: transparent !important;
    border-color: rgb(var(--tp-gold-rgb) / 0.36) !important;
    border-width: 0 0 1px !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--tp-text-primary) !important;
    letter-spacing: 0.14em;
    padding: 0 0 0.55rem !important;
    text-transform: uppercase;
}

.editorial-page-hero .btn:hover,
.editorial-page-hero .btn-primary:hover,
.editorial-page-hero .btn-outline-primary:hover,
.editorial-page-hero .btn-outline-secondary:hover,
.editorial-page-hero .btn-light:hover,
.editorial-page-hero .btn:focus,
.editorial-page-hero .btn-primary:focus,
.editorial-page-hero .btn-outline-primary:focus,
.editorial-page-hero .btn-outline-secondary:focus,
.editorial-page-hero .btn-light:focus {
    background: transparent !important;
    border-color: rgb(var(--tp-gold-rgb) / 0.72) !important;
    box-shadow: none !important;
    color: var(--tp-link-hover) !important;
    transform: none;
}

.editorial-page .btn-primary,
.editorial-page .btn-info,
.editorial-page .btn-warning,
.editorial-page .btn-success {
    background: var(--tp-gold);
    border-color: var(--tp-gold);
    color: var(--tp-ivory);
}

.editorial-page .btn-primary:hover,
.editorial-page .btn-info:hover,
.editorial-page .btn-warning:hover,
.editorial-page .btn-success:hover,
.editorial-page .btn-primary:focus,
.editorial-page .btn-info:focus,
.editorial-page .btn-warning:focus,
.editorial-page .btn-success:focus {
    background: var(--tp-slate);
    border-color: var(--tp-slate);
    color: var(--tp-ivory);
}

.editorial-page .btn-outline-primary,
.editorial-page .btn-outline-secondary,
.editorial-page .btn-light {
    background: rgb(var(--tp-surface-rgb) / 0.74);
    border-color: var(--tp-border-strong);
    color: var(--tp-slate);
}

.editorial-page .btn-outline-primary:hover,
.editorial-page .btn-outline-secondary:hover,
.editorial-page .btn-light:hover {
    background: rgb(var(--tp-slate-rgb) / 0.06);
    border-color: var(--tp-gold);
    color: var(--tp-slate);
}

.editorial-page .btn-danger {
    background: #7a2d29;
    border-color: #7a2d29;
    color: var(--tp-ivory);
}

.editorial-page .btn-danger:hover {
    background: #5d1f1c;
    border-color: #5d1f1c;
    color: var(--tp-ivory);
}

.editorial-page .form-control,
.editorial-page .form-select,
.editorial-page select.form-control,
.editorial-page select.form-select {
    background-color: rgb(var(--tp-surface-rgb) / 0.86);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23173a62' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 16px 12px;
    padding-right: 2.5rem;
    appearance: none;
    -webkit-appearance: none;
    border: 1px solid var(--tp-border-strong);
    color: var(--tp-text-primary);
    border-radius: 18px;
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
    padding-left: 1rem;
    box-shadow: inset 0 1px 0 rgb(var(--tp-surface-rgb) / 0.45);
}

.editorial-page .form-control::placeholder {
    color: var(--tp-text-muted);
}

.editorial-page .form-control:focus,
.editorial-page .form-select:focus,
.editorial-page select.form-control:focus,
.editorial-page select.form-select:focus {
    border-color: var(--tp-gold);
    box-shadow: 0 0 0 0.2rem rgb(var(--tp-gold-rgb) / 0.12);
}

.editorial-page .input-group .form-control {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.editorial-page .input-group .btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    box-shadow: none;
}

.editorial-page .card {
    background: var(--tp-surface) !important;
    border: 1px solid var(--tp-border) !important;
    box-shadow: 0 18px 42px rgb(var(--tp-shadow-rgb) / 0.08) !important;
    backdrop-filter: blur(14px);
}

.editorial-page .card:hover {
    transform: translateY(-2px);
    box-shadow: 0 22px 48px rgb(var(--tp-shadow-rgb) / 0.12) !important;
}

.editorial-page .table {
    --bs-table-bg: transparent;
    --bs-table-accent-bg: transparent;
    --bs-table-striped-bg: rgb(var(--tp-cream-rgb) / 0.56);
    --bs-table-hover-bg: rgb(var(--tp-cream-rgb) / 0.9);
    color: var(--tp-text-secondary);
}

.editorial-page .table-responsive {
    border-radius: 20px;
}

.editorial-page .table > :not(caption) > * > * {
    padding: 1rem 1.1rem;
    border-bottom-color: rgb(var(--tp-gold-rgb) / 0.10);
    vertical-align: middle;
}

.editorial-page .table thead th,
.editorial-page .table-dark th {
    background: var(--tp-slate) !important;
    color: var(--tp-ivory) !important;
    border-bottom: none;
    font-size: 0.76rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-weight: 600;
}

.editorial-page .badge {
    border-radius: 999px;
    padding: 0.55rem 0.8rem;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.editorial-page .badge.bg-primary {
    background: rgb(var(--tp-gold-rgb) / 0.12) !important;
    color: var(--tp-slate) !important;
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.16);
}

.editorial-page .badge.bg-secondary {
    background: rgb(var(--tp-slate-rgb) / 0.08) !important;
    color: var(--tp-text-secondary) !important;
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.12);
}

.editorial-page .text-muted,
.editorial-page .small,
.editorial-page .form-text {
    color: var(--tp-text-muted) !important;
}

.download-page .editorial-page-hero {
    text-align: center;
}

.download-page .download-note {
    font-size: 0.98rem;
    line-height: 1.8;
    color: var(--tp-text-secondary);
}

.download-page .download-note strong {
    color: var(--tp-slate);
}

.download-page .download-primary-cta {
    margin-top: 1.75rem;
    margin-bottom: 1rem;
}

.download-page .download-primary-note {
    max-width: 62ch;
    margin: 0 auto;
    text-align: center;
}

.download-page .download-legacy-cta {
    display: flex;
    justify-content: center;
    margin-top: 1.5rem;
}

.download-page .download-extras {
    max-width: 640px;
    margin: 0 auto;
}

.download-page .download-extras-title {
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--tp-text-muted);
    margin-bottom: 0.85rem;
}

.download-page .download-support-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.download-page .download-link-card {
    display: block;
    text-decoration: none;
    background: rgb(var(--tp-surface-rgb) / 0.76);
    border: 1px solid var(--tp-border);
    border-radius: 20px;
    padding: 1.2rem;
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease, background-color 0.25s ease;
    box-shadow: 0 10px 24px rgb(var(--tp-shadow-rgb) / 0.06);
}

.download-page .download-link-card:hover {
    text-decoration: none;
    border-color: var(--tp-border-strong);
    background: var(--tp-surface-strong);
    transform: translateY(-2px);
    box-shadow: 0 18px 34px rgb(var(--tp-shadow-rgb) / 0.10);
}

.download-page .download-link-card i {
    display: inline-flex;
    margin-bottom: 0.85rem;
    font-size: 1.3rem;
    color: var(--tp-gold);
}

.download-page .download-link-card strong {
    display: block;
    font-size: 1rem;
    color: var(--tp-text-primary);
    margin-bottom: 0.35rem;
}

.download-page .download-link-card span {
    display: block;
    color: var(--tp-text-muted);
    line-height: 1.6;
}

.download-page .download-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1300;
    padding: 1.5rem;
    background: rgb(var(--tp-shadow-rgb) / 0.45);
    backdrop-filter: blur(10px);
}

.download-page .download-modal-content {
    max-width: 480px;
    margin: 12vh auto 0;
    background: var(--tp-ivory);
    border: 1px solid var(--tp-border-strong);
    border-radius: 24px;
    box-shadow: 0 28px 70px rgb(var(--tp-shadow-rgb) / 0.18);
    padding: 1.75rem;
    color: var(--tp-text-primary);
    text-align: center;
}

.download-page .download-modal-content p {
    margin: 0;
    line-height: 1.8;
    color: var(--tp-text-secondary);
}

.download-page .download-modal-actions {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-top: 1.5rem;
}

.compatibility-page .compatibility-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}

.compatibility-page .compatibility-search {
    width: min(360px, 100%);
}

.compatibility-page .game-icon {
    width: 48px;
    height: 48px;
    overflow: hidden;
    border-radius: 14px;
    border: 1px solid var(--tp-border);
    box-shadow: inset 0 0 0 1px rgb(var(--tp-surface-rgb) / 0.4);
}

.compatibility-page .game-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.compatibility-page .click-row {
    cursor: pointer;
}

.compatibility-page .click-row:hover td {
    background: rgb(var(--tp-cream-rgb) / 0.9);
}

.compatibility-page .table.games th.sortable {
    cursor: pointer;
}

.compatibility-page .table.games th.sortable:hover {
    background: var(--tp-gold) !important;
}

.compatibility-page .table tbody td {
    color: var(--tp-text-primary);
}

.compatibility-page .compatibility-status-label {
    font-weight: 600;
}

.compatibility-page .compat-status-perfect {
    color: #2f6c4e;
}

.compatibility-page .compat-status-great {
    color: #1d5b86;
}

.compatibility-page .compat-status-issues {
    color: #8a5b00;
}

.compatibility-page .compat-status-unplayable {
    color: #8d2f2f;
}

.compatibility-page .compat-status-unknown {
    color: #5a6777;
}

.compatibility-page .compatibility-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: center;
}

.compatibility-page .legend-item {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.7rem 0.95rem;
    border-radius: 999px;
    border: 1px solid var(--tp-border);
    background: rgb(var(--tp-surface-rgb) / 0.72);
    color: var(--tp-text-secondary);
    font-size: 0.82rem;
}

.highscores-page .editorial-selector-panel {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    position: relative;
    overflow: hidden;
    padding: 1.35rem 1.45rem;
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.14);
    border-radius: 20px;
    background: linear-gradient(145deg, rgb(var(--tp-surface-rgb) / 0.94) 0%, rgb(var(--tp-ivory-rgb) / 0.92) 100%);
    box-shadow: inset 0 1px 0 rgb(var(--tp-surface-rgb) / 0.7);
}

.highscores-page .editorial-selector-panel::after {
    content: '';
    position: absolute;
    inset: auto -3rem -4rem auto;
    width: 10rem;
    height: 10rem;
    border-radius: 50%;
    background: radial-gradient(circle, rgb(var(--tp-gold-rgb) / 0.12) 0%, transparent 70%);
    pointer-events: none;
}

.highscores-page .editorial-filter-label {
    margin: 0;
    font-size: 0.82rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--tp-text-muted);
    font-weight: 600;
}

.highscores-page .highscores-select-wrap {
    width: min(420px, 100%);
}

.highscores-page .highscores-select-wrap .form-control,
.highscores-page .highscores-select-wrap .form-select,
.highscores-page .highscores-select-wrap .selectpicker,
.highscores-page .bootstrap-select > .dropdown-toggle {
    min-height: 3.5rem;
    background-color: rgb(var(--tp-surface-rgb) / 0.98) !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23173a62' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 1rem center !important;
    background-size: 16px 12px !important;
    padding-right: 2.5rem !important;
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.18) !important;
    border-radius: 18px !important;
    color: var(--tp-slate) !important;
    font-weight: 600;
    letter-spacing: 0.02em;
    box-shadow: 0 14px 28px rgb(var(--tp-shadow-rgb) / 0.08);
    appearance: none;
    -webkit-appearance: none;
}

.highscores-page .bootstrap-select {
    width: 100% !important;
}

.highscores-page .bootstrap-select > .dropdown-toggle {
    padding: 0.92rem 1rem !important;
}

.highscores-page .bootstrap-select > .dropdown-toggle .filter-option,
.highscores-page .bootstrap-select > .dropdown-toggle .filter-option-inner,
.highscores-page .bootstrap-select > .dropdown-toggle .filter-option-inner-inner,
.highscores-page .bootstrap-select > .dropdown-toggle .text {
    color: var(--tp-slate) !important;
}

.highscores-page .bootstrap-select .dropdown-toggle:focus,
.highscores-page .bootstrap-select .dropdown-toggle:hover {
    background: linear-gradient(180deg, rgb(var(--tp-surface-rgb) / 1) 0%, rgb(var(--tp-cream-rgb) / 0.96) 100%) !important;
    border-color: rgb(var(--tp-gold-rgb) / 0.26) !important;
    color: var(--tp-slate) !important;
}

.highscores-page .bootstrap-select .dropdown-menu {
    padding: 0.55rem;
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.16);
    border-radius: 18px;
    background: rgb(var(--tp-ivory-rgb) / 0.98);
    box-shadow: 0 22px 46px rgb(var(--tp-shadow-rgb) / 0.12);
}

.highscores-page .bootstrap-select .dropdown-item,
.highscores-page .bootstrap-select .dropdown-menu li a {
    border-radius: 12px;
    color: var(--tp-text-secondary);
    font-weight: 500;
    padding: 0.7rem 0.9rem;
}

.highscores-page .bootstrap-select .dropdown-item:hover,
.highscores-page .bootstrap-select .dropdown-item:focus,
.highscores-page .bootstrap-select .dropdown-menu li a:hover,
.highscores-page .bootstrap-select .dropdown-menu li a:focus {
    background: rgb(var(--tp-gold-rgb) / 0.08);
    color: var(--tp-slate);
}

.highscores-page .bootstrap-select .dropdown-item.active,
.highscores-page .bootstrap-select .dropdown-item:active,
.highscores-page .bootstrap-select .dropdown-item.selected,
.highscores-page .bootstrap-select .dropdown-menu li.active a,
.highscores-page .bootstrap-select .dropdown-menu li.selected a {
    background: var(--tp-gold);
    color: var(--tp-ivory);
}

.highscores-page .bootstrap-select .bs-searchbox {
    padding: 0.25rem 0.25rem 0.5rem;
}

.highscores-page .bootstrap-select .bs-searchbox input {
    background: rgb(var(--tp-surface-rgb) / 0.92);
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.14);
    border-radius: 14px;
    color: var(--tp-text-primary);
}

.highscores-page .highscores-results-panel {
    padding: 0;
    overflow: hidden;
    background: linear-gradient(180deg, rgb(var(--tp-surface-rgb) / 0.92) 0%, rgb(var(--tp-ivory-rgb) / 0.88) 100%);
    border-color: rgb(var(--tp-gold-rgb) / 0.16);
    box-shadow: 0 24px 56px rgb(var(--tp-shadow-rgb) / 0.10);
}

.highscores-page .tab-content {
    overflow-x: auto;
    padding: 1.5rem;
    background: linear-gradient(180deg, rgb(var(--tp-surface-rgb) / 0.22) 0%, rgb(var(--tp-surface-rgb) / 0.02) 100%);
}

.highscores-page .tab-pane h3,
.highscores-page h2 {
    color: var(--tp-slate);
    font-weight: 500;
}

.highscores-page .tab-pane {
    color: var(--tp-text-secondary);
}

.highscores-page .tab-pane h3 {
    margin-bottom: 0.35rem;
    font-size: clamp(1.35rem, 2.2vw, 1.8rem);
    letter-spacing: -0.01em;
}

.highscores-page .tab-pane > div > .form-text,
.highscores-page .tab-pane > .form-text,
.highscores-page .editorial-selector-panel .form-text {
    color: var(--tp-text-muted) !important;
    font-size: 0.84rem;
    letter-spacing: 0.02em;
}

.highscores-page .highscore-player-link,
.highscores-page .highscore-details-link {
    text-decoration: none;
}

.highscores-page .highscore-player-link:not(.btn),
.highscores-page .highscore-details-link:not(.btn) {
    padding: 0;
    color: inherit;
}

.highscores-page .highscore-player-link:hover,
.highscores-page .highscore-details-link:hover {
    background: transparent;
    text-decoration: none;
}

.highscores-page .highscore-player-link.btn,
.highscores-page .highscore-details-link.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    min-height: 2.55rem;
    padding: 0.6rem 1rem;
    border-radius: 999px;
    font-size: 0.8rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.highscores-page .highscore-player-link.btn {
    background: rgb(var(--tp-slate-rgb) / 0.06);
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.18);
    color: var(--tp-slate);
    box-shadow: none;
}

.highscores-page .highscore-player-link.btn:hover,
.highscores-page .highscore-player-link.btn:focus {
    background: var(--tp-gold);
    border-color: var(--tp-gold);
    color: var(--tp-ivory);
}

.highscores-page .highscore-details-link.btn {
    background: rgb(var(--tp-surface-rgb) / 0.82);
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.16);
    color: var(--tp-slate);
    box-shadow: none;
}

.highscores-page .highscore-details-link.btn:hover,
.highscores-page .highscore-details-link.btn:focus {
    background: rgb(var(--tp-gold-rgb) / 0.08);
    border-color: var(--tp-gold);
    color: var(--tp-slate);
}

.highscores-page .highscore-video-cell {
    margin: 0 auto;
}

.highscores-page .video-wrapper {
    position: relative;
    display: inline-block;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 10px 20px rgb(var(--tp-shadow-rgb) / 0.10);
}

.highscores-page .video-wrapper.expanded {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1200;
    background: rgb(var(--tp-shadow-rgb) / 0.92);
    padding: 0.75rem;
    border-radius: 16px;
    box-shadow: 0 24px 60px rgb(var(--tp-shadow-rgb) / 0.22);
}

.highscores-page .video-wrapper iframe {
    border-radius: 12px;
}

.highscores-page .close-video {
    position: absolute;
    top: -10px;
    right: -10px;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 50%;
    background: #7a2d29;
    color: var(--tp-ivory);
    cursor: pointer;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 10px 20px rgb(var(--tp-shadow-rgb) / 0.18);
}

.highscores-page .latest-submissions-table td:first-child {
    min-width: 240px;
}

.highscores-page .latest-submissions-table {
    margin-bottom: 0;
    color: var(--tp-text-secondary);
}

.highscores-page .latest-submissions-table tbody td {
    color: var(--tp-text-secondary);
}

.highscores-page .latest-submissions-table tbody tr:nth-child(even) td {
    background: rgb(var(--tp-ivory-rgb) / 0.72);
}

.highscores-page .latest-submissions-table tbody tr:hover td {
    background: rgb(var(--tp-gold-rgb) / 0.08);
    color: var(--tp-text-primary);
}

.highscores-page .latest-submissions-table tbody td:first-child {
    color: var(--tp-text-primary);
}

.highscores-page .latest-submissions-table td:last-child {
    width: 1%;
    white-space: nowrap;
    text-align: right;
}

.highscores-page .latest-submissions-table .d-flex {
    gap: 0.85rem;
}

.highscores-page .latest-submissions-table i.bi-search {
    font-size: 0.95rem;
}

.highscores-rich-page {
    padding-top: 1.25rem;
}

.highscores-rich-page .editorial-page-hero {
    margin-bottom: 2rem;
}

.highscores-rich-page .editorial-page-intro {
    max-width: 58ch;
}

.highscores-rich-page .highscores-rich-form {
    display: block;
    width: 100%;
}

.highscores-rich-page .highscores-rich-form > .col-sm-12,
.highscores-rich-page .highscores-rich-form > .record-container {
    margin-bottom: 1.5rem;
    padding: clamp(1.25rem, 3vw, 1.7rem);
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.14);
    border-radius: 24px;
    background: linear-gradient(180deg, rgb(var(--tp-surface-rgb) / 0.9) 0%, rgb(var(--tp-ivory-rgb) / 0.86) 100%);
    box-shadow: 0 22px 52px rgb(var(--tp-shadow-rgb) / 0.08);
    backdrop-filter: blur(14px);
}

.highscores-rich-page .highscores-rich-panel-header,
.highscores-rich-page .highscores-rich-form > .col-sm-12 > .d-flex.justify-content-between.align-items-center.mb-2 {
    gap: 1rem;
    margin-bottom: 1.1rem !important;
}

.highscores-rich-page .highscores-rich-panel-header h3,
.highscores-rich-page .highscores-rich-form > .col-sm-12 > .d-flex.justify-content-between.align-items-center.mb-2 h3,
.highscores-rich-page .record-header,
.highscores-rich-page .record-container h2,
.highscores-rich-page .record-container h3,
.highscores-rich-page .record-container h4,
.highscores-rich-page .record-container h6 {
    color: var(--tp-slate);
    font-weight: 500;
    letter-spacing: -0.01em;
}

.highscores-rich-page .highscores-rich-panel-header h3,
.highscores-rich-page .highscores-rich-form > .col-sm-12 > .d-flex.justify-content-between.align-items-center.mb-2 h3 {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.7rem;
    margin: 0;
    font-size: clamp(1.3rem, 2.2vw, 1.75rem);
}

.highscores-rich-page .highscores-record-count {
    font-size: 0.8rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    color: var(--tp-text-muted);
}

.highscores-rich-page .highscores-rich-subtitle,
.highscores-rich-page p.text-muted,
.highscores-rich-page .text-muted,
.highscores-rich-page .small,
.highscores-rich-page .form-text {
    color: var(--tp-text-muted) !important;
}

.highscores-rich-page .table-responsive {
    overflow: hidden;
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.12);
    border-radius: 20px;
    background: rgb(var(--tp-surface-rgb) / 0.74);
    box-shadow: inset 0 1px 0 rgb(var(--tp-surface-rgb) / 0.7);
}

.highscores-rich-page .table {
    margin-bottom: 0;
    color: var(--tp-text-secondary);
}

.highscores-rich-page .table tbody tr:nth-child(even) td {
    background: rgb(var(--tp-ivory-rgb) / 0.72);
}

.highscores-rich-page .table tbody tr:hover td {
    background: rgb(var(--tp-gold-rgb) / 0.08);
    color: var(--tp-text-primary);
}

.highscores-rich-page .table tbody td:first-child,
.highscores-rich-page .table tbody strong {
    color: var(--tp-text-primary);
}

.highscores-rich-page a.nav-link.text-dark {
    color: inherit !important;
    padding: 0 !important;
    background: transparent !important;
    text-decoration: none;
}

.highscores-rich-page a.nav-link.text-dark:hover {
    background: transparent !important;
    text-decoration: none;
}

.highscores-rich-page .btn-outline-purple,
.highscores-rich-page .highscores-rich-toggle {
    background: rgb(var(--tp-surface-rgb) / 0.8);
    color: var(--tp-slate);
    border-color: rgb(var(--tp-gold-rgb) / 0.18);
    box-shadow: none;
}

.highscores-rich-page .btn-outline-purple:hover,
.highscores-rich-page .btn-outline-purple:focus,
.highscores-rich-page .highscores-rich-toggle:hover,
.highscores-rich-page .highscores-rich-toggle:focus {
    background: rgb(var(--tp-gold-rgb) / 0.08);
    color: var(--tp-slate);
    border-color: var(--tp-gold);
}

.highscores-rich-page .btn-outline-secondary {
    background: var(--tp-gold);
    color: var(--tp-ivory);
    border-color: var(--tp-gold);
}

.highscores-rich-page .btn-outline-secondary:hover,
.highscores-rich-page .btn-outline-secondary:focus {
    background: var(--tp-slate);
    color: var(--tp-ivory);
    border-color: var(--tp-slate);
}

.highscores-rich-page .table .btn-info,
.highscores-rich-page .record-row .name a,
.highscores-rich-page .highscores-rich-link {
    background: rgb(var(--tp-slate-rgb) / 0.06) !important;
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.18) !important;
    color: var(--tp-slate) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    text-decoration: none !important;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 0.6rem 1rem !important;
}

.highscores-rich-page .table .btn-info:hover,
.highscores-rich-page .table .btn-info:focus,
.highscores-rich-page .record-row .name a:hover,
.highscores-rich-page .record-row .name a:focus,
.highscores-rich-page .highscores-rich-link:hover,
.highscores-rich-page .highscores-rich-link:focus {
    background: var(--tp-gold) !important;
    border-color: var(--tp-gold) !important;
    color: var(--tp-ivory) !important;
}

.highscores-rich-page .record-container {
    padding-top: 1.45rem;
}

.highscores-rich-page .record-container,
.highscores-rich-page .course-distance-container,
.highscores-rich-page .panel.panel-default {
    background: transparent !important;
    color: var(--tp-text-secondary) !important;
}

.highscores-rich-page .panel.panel-default {
    margin-bottom: 1.5rem;
    padding: 1.1rem;
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.12);
    border-radius: 20px;
    background: rgb(var(--tp-surface-rgb) / 0.72) !important;
    box-shadow: 0 14px 30px rgb(var(--tp-shadow-rgb) / 0.05);
}

.highscores-rich-page .panel.panel-default > .panel-heading,
.highscores-rich-page .panel.panel-default > .panel-body {
    padding: 0;
    border: none !important;
    background: transparent !important;
}

.highscores-rich-page .course-distance-container .record-header,
.highscores-rich-page .course-distance-container .column-header,
.highscores-rich-page .course-distance-container .rank,
.highscores-rich-page .course-distance-container .distance,
.highscores-rich-page .records-table th,
.highscores-rich-page .records-table td,
.highscores-rich-page .records-table .date-single-line {
    color: var(--tp-text-secondary) !important;
}

.highscores-rich-page .course-distance-container .course-section,
.highscores-rich-page .course-distance-container .course-column {
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.10);
    background: rgb(var(--tp-ivory-rgb) / 0.72) !important;
    box-shadow: none;
}

.highscores-rich-page .course-distance-container .course-header {
    background: transparent !important;
    color: var(--tp-slate) !important;
    border-bottom: 1px solid rgb(var(--tp-gold-rgb) / 0.10);
    border-radius: 0 !important;
    padding: 0 0 0.85rem !important;
}

.highscores-rich-page .course-distance-container .record-row {
    background: transparent !important;
    border-bottom: 1px solid rgb(var(--tp-gold-rgb) / 0.10);
    border-radius: 0 !important;
    margin-bottom: 0;
}

.highscores-rich-page .course-distance-container .record-row:last-child {
    border-bottom: none;
}

.highscores-rich-page .records-table th {
    color: var(--tp-text-muted) !important;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.highscores-rich-page .records-table .rank-col,
.highscores-rich-page .records-table .time-col,
.highscores-rich-page .records-table .rank-column,
.highscores-rich-page .records-table .score-column,
.highscores-rich-page .records-table .action-col,
.highscores-rich-page .records-table .action-column {
    color: var(--tp-text-primary) !important;
}

.highscores-rich-page .btn-purple-name,
.highscores-rich-page .search-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    min-height: 2.4rem;
    padding: 0.55rem 0.95rem !important;
    border-radius: 999px !important;
    background: rgb(var(--tp-slate-rgb) / 0.06) !important;
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.18) !important;
    color: var(--tp-slate) !important;
    text-decoration: none !important;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.78rem !important;
    font-weight: 600;
    box-shadow: none !important;
}

.highscores-rich-page .btn-purple-name:hover,
.highscores-rich-page .btn-purple-name:focus,
.highscores-rich-page .search-btn:hover,
.highscores-rich-page .search-btn:focus {
    background: var(--tp-gold) !important;
    border-color: var(--tp-gold) !important;
    color: var(--tp-ivory) !important;
}

.highscores-page .modal-content {
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.14);
    border-radius: 24px;
    background: linear-gradient(180deg, rgb(var(--tp-surface-rgb) / 0.94) 0%, rgb(var(--tp-ivory-rgb) / 0.92) 100%);
    box-shadow: 0 24px 56px rgb(var(--tp-shadow-rgb) / 0.12);
}

.highscores-page .modal-header,
.highscores-page .modal-footer {
    border-color: rgb(var(--tp-gold-rgb) / 0.10);
}

.highscores-page .modal-title {
    color: var(--tp-slate);
}

.highscores-page .modal-body {
    color: var(--tp-text-secondary);
}

.highscores-rich-page .record-header {
    font-size: clamp(1.35rem, 2.4vw, 1.9rem);
    margin-bottom: 1rem;
}

.highscores-rich-page .course-section {
    margin-bottom: 1rem;
    padding: 1rem 1.1rem;
    border-radius: 20px;
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.12);
    background: rgb(var(--tp-surface-rgb) / 0.7);
    box-shadow: 0 14px 30px rgb(var(--tp-shadow-rgb) / 0.05);
}

.highscores-rich-page .course-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid rgb(var(--tp-gold-rgb) / 0.10);
    color: var(--tp-slate);
    font-size: 1.05rem;
}

.highscores-rich-page .course-content {
    gap: 1rem;
}

.highscores-rich-page .course-column {
    padding: 1rem;
    border-radius: 18px;
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.10);
    background: rgb(var(--tp-ivory-rgb) / 0.72);
}

.highscores-rich-page .column-header {
    color: var(--tp-text-muted);
    font-size: 0.76rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 0.9rem;
}

.highscores-rich-page .record-row {
    padding: 0.8rem 0;
    border-bottom: 1px solid rgb(var(--tp-gold-rgb) / 0.10);
}

.highscores-rich-page .record-row:last-child {
    border-bottom: none;
}

.highscores-rich-page .record-row .rank,
.highscores-rich-page .record-row .score {
    color: var(--tp-slate);
    font-weight: 600;
}

.highscores-rich-page .record-row .score {
    font-variant-numeric: tabular-nums;
}

.highscores-rich-page .game-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.35rem 0.55rem;
    border-radius: 999px;
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.14);
    background: rgb(var(--tp-gold-rgb) / 0.08);
    color: var(--tp-gold);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.highscores-rich-page .record-row .search a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    background: rgb(var(--tp-slate-rgb) / 0.06);
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.16);
    color: var(--tp-slate);
    text-decoration: none;
}

.highscores-rich-page .record-row .search a:hover,
.highscores-rich-page .record-row .search a:focus {
    background: rgb(var(--tp-gold-rgb) / 0.08);
    border-color: var(--tp-gold);
    color: var(--tp-slate);
}

.highscores-rich-page .video-wrapper {
    position: relative;
    display: inline-block;
    overflow: hidden;
    border-radius: 14px;
    box-shadow: 0 12px 26px rgb(var(--tp-shadow-rgb) / 0.10);
}

.highscores-rich-page .video-wrapper.expanded {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1200;
    background: rgb(var(--tp-shadow-rgb) / 0.94);
    padding: 0.85rem;
    border-radius: 18px;
    box-shadow: 0 30px 70px rgb(var(--tp-shadow-rgb) / 0.22);
}

.highscores-rich-page .close-video {
    position: absolute;
    top: -10px;
    right: -10px;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 50%;
    background: #7a2d29;
    color: var(--tp-ivory);
    cursor: pointer;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 10px 20px rgb(var(--tp-shadow-rgb) / 0.18);
}

.highscores-rich-page .controls-wrapper {
    margin-bottom: 1rem;
}

.highscores-rich-page .controls-row {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.highscores-rich-page .select-container {
    display: flex;
    gap: 0.75rem;
    flex: 1;
    min-width: 220px;
}

.highscores-rich-page .button-container {
    display: flex;
    gap: 0.6rem;
}

.highscores-rich-page #chartContainer {
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.12);
    border-radius: 20px;
    background: rgb(var(--tp-surface-rgb) / 0.82);
    padding: 0.8rem;
    box-shadow: inset 0 1px 0 rgb(var(--tp-surface-rgb) / 0.72);
}

.highscores-rich-page #handicapChart {
    margin-bottom: 0;
    border: none !important;
    background: rgb(var(--tp-surface-rgb) / 0.98) !important;
    border-radius: 16px;
}

.highscores-rich-page #legend {
    height: 403px;
    overflow-y: auto;
    border-radius: 20px;
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.12);
    box-shadow: none !important;
}

.highscores-rich-page #legend .card-header {
    background: transparent !important;
    border-bottom: 1px solid rgb(var(--tp-gold-rgb) / 0.10);
    padding: 1rem 1.1rem;
}

.highscores-rich-page #legend .card-body {
    background: transparent;
}

.highscores-rich-page .list-group-item,
.highscores-rich-page .list-group-item-action {
    background: transparent;
    border-color: rgb(var(--tp-gold-rgb) / 0.08);
    color: var(--tp-text-secondary);
}

.highscores-rich-page .list-group-item.active {
    background: rgb(var(--tp-gold-rgb) / 0.08);
    border-color: rgb(var(--tp-gold-rgb) / 0.12);
    color: var(--tp-slate);
}

.highscores-rich-page .list-group-item:hover {
    background: rgb(var(--tp-gold-rgb) / 0.05);
}

.highscores-rich-page #tooltip {
    display: none;
    position: absolute;
    background: rgb(var(--tp-shadow-rgb) / 0.92);
    color: var(--tp-ivory);
    padding: 12px;
    border-radius: 12px;
    font-size: 14px;
    pointer-events: none;
    z-index: 1000;
    max-width: 250px;
    border: 1px solid rgb(var(--tp-ivory-rgb) / 0.14);
    box-shadow: 0 20px 36px rgb(var(--tp-shadow-rgb) / 0.16);
}

.highscore-list-page .highscores-rich-form {
    display: grid;
    gap: 1.5rem;
}

.highscore-list-page .editorial-page-hero {
    margin-bottom: 1.5rem;
}

.highscore-detail-page .highscore-detail-surface {
    padding: clamp(1.25rem, 3vw, 1.75rem);
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.14);
    border-radius: 24px;
    background: linear-gradient(180deg, rgb(var(--tp-surface-rgb) / 0.92) 0%, rgb(var(--tp-ivory-rgb) / 0.88) 100%);
    box-shadow: 0 24px 56px rgb(var(--tp-shadow-rgb) / 0.08);
    backdrop-filter: blur(14px);
}

.highscore-detail-page table[align="center"],
.highscore-detail-page .scorecard-table,
.highscore-detail-page .bowling-table {
    width: 100%;
}

.highscore-detail-page .table {
    margin-bottom: 0;
}

.highscore-detail-page .card {
    margin-top: 1.5rem;
    overflow: hidden;
}

.highscore-detail-page .card-header {
    background: linear-gradient(135deg, rgb(var(--tp-slate-rgb) / 0.98), rgb(var(--tp-gold-rgb) / 0.96)) !important;
    color: var(--tp-ivory) !important;
    border-bottom: none;
    font-size: 0.8rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-weight: 700;
    padding: 1rem 1.2rem;
}

.highscore-detail-page .card-body {
    color: var(--tp-text-secondary);
}

.highscore-detail-page .card-link {
    color: var(--tp-slate);
    word-break: break-all;
}

.highscore-detail-page .form-control {
    background: rgb(var(--tp-surface-rgb) / 0.92);
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.16);
    color: var(--tp-text-primary);
}

.highscore-detail-page .btn-secondary {
    background: var(--tp-gold);
    border-color: var(--tp-gold);
    color: var(--tp-ivory);
}

.highscore-detail-page .btn-secondary:hover,
.highscore-detail-page .btn-secondary:focus {
    background: var(--tp-slate);
    border-color: var(--tp-slate);
    color: var(--tp-ivory);
}

.highscore-detail-page video,
.highscore-detail-page img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
    border-radius: 18px;
    box-shadow: 0 14px 34px rgb(var(--tp-shadow-rgb) / 0.12);
}

.highscore-detail-page .scorecard-container,
.highscore-detail-page .bowling-container {
    background: linear-gradient(180deg, rgb(var(--tp-surface-rgb) / 0.96) 0%, rgb(var(--tp-cream-rgb) / 0.92) 100%) !important;
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.16) !important;
    border-radius: 28px !important;
    box-shadow: 0 26px 60px rgb(var(--tp-shadow-rgb) / 0.10) !important;
    max-width: none !important;
    margin: 0 !important;
}

.highscore-detail-page .scorecard-container::before,
.highscore-detail-page .bowling-container::before {
    height: 4px !important;
    background: linear-gradient(90deg, var(--tp-gold), var(--tp-gold-light), var(--tp-gold)) !important;
}

.highscore-detail-page .scorecard-header,
.highscore-detail-page .bowling-header {
    background: linear-gradient(135deg, rgb(var(--tp-surface-rgb) / 0.98), rgb(var(--tp-deep-rgb) / 0.92)) !important;
    border-bottom: 1px solid rgb(var(--tp-gold-rgb) / 0.14) !important;
    padding: 2rem !important;
}

.highscore-detail-page .scorecard-header::after,
.highscore-detail-page .bowling-header::after {
    display: none !important;
}

.highscore-detail-page .scorecard-header h1,
.highscore-detail-page .bowling-header h1 {
    color: var(--tp-slate) !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: clamp(2rem, 4vw, 3rem) !important;
    letter-spacing: -0.02em !important;
    text-transform: none !important;
    text-shadow: none !important;
    margin-bottom: 0.75rem !important;
}

.highscore-detail-page .scorecard-subtitle,
.highscore-detail-page .bowling-subtitle {
    color: var(--tp-text-muted) !important;
    font-size: 0.82rem !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase;
}

.highscore-detail-page .scorecard-table,
.highscore-detail-page .bowling-table {
    background: rgb(var(--tp-surface-rgb) / 0.9) !important;
    color: var(--tp-text-secondary) !important;
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.10) !important;
}

.highscore-detail-page .scorecard-table th,
.highscore-detail-page .bowling-table th {
    background: var(--tp-slate) !important;
    color: var(--tp-ivory) !important;
    border-color: rgb(var(--tp-surface-rgb) / 0.10) !important;
}

.highscore-detail-page .scorecard-table td,
.highscore-detail-page .bowling-table td {
    background: rgb(var(--tp-surface-rgb) / 0.92) !important;
    color: var(--tp-text-secondary) !important;
    border-color: rgb(var(--tp-gold-rgb) / 0.10) !important;
}

.highscore-detail-page .distance-row td,
.highscore-detail-page .par-row td {
    background: rgb(var(--tp-gold-rgb) / 0.08) !important;
    color: var(--tp-slate) !important;
}

.highscore-detail-page .player-row td,
.highscore-detail-page .info-row td,
.highscore-detail-page .totals-cell,
.highscore-detail-page .header-cell,
.highscore-detail-page .label-cell,
.highscore-detail-page .value-cell {
    background: rgb(var(--tp-surface-rgb) / 0.94) !important;
    color: var(--tp-text-primary) !important;
}

.highscore-detail-page .header-cell,
.highscore-detail-page .label-cell,
.highscore-detail-page .totals-cell {
    background: rgb(var(--tp-gold-rgb) / 0.10) !important;
    color: var(--tp-slate) !important;
}

.highscore-detail-page .bowling-table .total-cell {
    background: rgb(var(--tp-gold-rgb) / 0.10) !important;
    color: var(--tp-slate) !important;
    border-color: rgb(var(--tp-gold-rgb) / 0.16) !important;
    font-weight: 700 !important;
}

.highscore-detail-page .scorecard-table td[style*="color: #0000FF"] {
    background: rgb(var(--tp-deep-rgb) / 0.96) !important;
    color: var(--tp-gold-light) !important;
    border-color: rgb(var(--tp-gold-light-rgb) / 0.28) !important;
    box-shadow: inset 0 0 0 1px rgb(var(--tp-gold-light-rgb) / 0.08) !important;
}

.highscore-detail-page .scorecard-table td[style*="color: #00FF00"] {
    background: rgba(228, 243, 233, 0.96) !important;
    color: #2b6e48 !important;
    border-color: rgba(43, 110, 72, 0.28) !important;
    box-shadow: inset 0 0 0 1px rgba(43, 110, 72, 0.08) !important;
}

.highscore-detail-page .scorecard-table td[style*="color: #FF0000"] {
    background: rgba(248, 234, 228, 0.96) !important;
    color: #9a4a3f !important;
    border-color: rgba(154, 74, 63, 0.28) !important;
    box-shadow: inset 0 0 0 1px rgba(154, 74, 63, 0.08) !important;
}

.highscore-detail-page .bowling-info-bar {
    background: transparent !important;
    border-bottom: 1px solid rgb(var(--tp-gold-rgb) / 0.10) !important;
    padding: 1.25rem !important;
}

.highscore-detail-page .bowling-info-item {
    background: rgb(var(--tp-surface-rgb) / 0.82) !important;
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.14) !important;
}

.highscore-detail-page .bowling-info-item strong {
    color: var(--tp-gold) !important;
}

.highscore-detail-page .bowling-info-item span {
    color: var(--tp-text-primary) !important;
}

.highscore-detail-page #VideoPlayer,
.highscore-detail-page [id^="VideoPlayer"] {
    width: 100%;
    max-width: 560px;
}

.highscores-page .external-highscore-pane {
    color: var(--tp-text-secondary);
}

.highscores-page .external-highscore-pane > h3 {
    color: var(--tp-slate);
    margin-bottom: 0.5rem;
}

.highscores-page .external-highscore-empty {
    padding: 1rem 1.15rem;
    border: 1px solid rgb(var(--tp-gold-rgb) / 0.14);
    border-radius: 16px;
    background: rgb(var(--tp-surface-rgb) / 0.72);
    color: var(--tp-text-muted);
}

@media (max-width: 768px) {
    .highscore-detail-page .highscore-detail-surface {
        padding: 1rem;
    }

    .highscore-detail-page .scorecard-header,
    .highscore-detail-page .bowling-header {
        padding: 1.5rem !important;
    }
}

.subscription-page .subscription-container {
    max-width: none;
    padding: 0 0 4rem;
    min-height: auto;
}

.subscription-page .subscription-pricing-container {
    max-width: none;
    padding: 0;
}

.subscription-page .subscription-hero {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, rgb(var(--tp-surface-rgb) / 0.94) 0%, rgb(var(--tp-ivory-rgb) / 0.96) 52%, rgb(var(--tp-deep-rgb) / 0.94) 100%);
    color: var(--tp-text-primary);
    border: 1px solid var(--tp-border);
    border-radius: 32px;
    box-shadow: var(--tp-shadow);
    padding: clamp(2rem, 4vw, 3rem);
}

.subscription-page .subscription-hero::before {
    content: '';
    position: absolute;
    inset: auto -7rem -7rem auto;
    width: 16rem;
    height: 16rem;
    border-radius: 50%;
    background: radial-gradient(circle, rgb(var(--tp-gold-rgb) / 0.16) 0%, transparent 70%);
}

.subscription-page .subscription-hero h1,
.subscription-page .subscription-hero p,
.subscription-page .subscription-hero .lead {
    position: relative;
    z-index: 1;
    color: inherit;
    text-shadow: none;
}

.subscription-page .pricing-highlight {
    position: relative;
    z-index: 1;
    background: rgb(var(--tp-slate-rgb) / 0.06);
    color: var(--tp-slate);
    border: 1px solid var(--tp-border);
    box-shadow: none;
}

.subscription-page .billing-toggle span {
    color: var(--tp-text-muted);
    font-size: 1rem;
    text-shadow: none;
}

.subscription-page .billing-toggle span.active {
    color: var(--tp-slate);
    font-size: 1rem;
    text-shadow: none;
}

.subscription-page .billing-toggle .toggle-switch {
    background: rgb(var(--tp-gold-rgb) / 0.18);
}

.subscription-page .billing-toggle .toggle-switch.active {
    background: linear-gradient(90deg, var(--tp-slate), var(--tp-gold));
}

.subscription-page .yearly-savings {
    background: rgb(var(--tp-gold-rgb) / 0.10);
    color: var(--tp-gold);
    box-shadow: none;
    font-size: 0.78rem;
}

.subscription-page .benefits-section,
.subscription-page .serials-section {
    background: var(--tp-surface);
    border: 1px solid var(--tp-border);
    box-shadow: 0 18px 42px rgb(var(--tp-shadow-rgb) / 0.08);
    color: var(--tp-text-secondary);
}

.subscription-page .benefits-section h2,
.subscription-page .benefits-section h3,
.subscription-page .serials-section h3 {
    color: var(--tp-text-primary);
}

.subscription-page .benefits-list li {
    border-bottom-color: rgb(var(--tp-gold-rgb) / 0.10);
    color: var(--tp-text-secondary);
}

.subscription-page .benefits-list i,
.subscription-page .pricing-card .features li::before {
    color: var(--tp-gold);
}

.subscription-page .pricing-grid {
    gap: 1.25rem;
}

.subscription-page .pricing-card {
    background: rgb(var(--tp-surface-rgb) / 0.84);
    border: 1px solid var(--tp-border);
    box-shadow: 0 16px 38px rgb(var(--tp-shadow-rgb) / 0.08);
    padding-top: 3.25rem;
    margin-top: 1rem;
}

.subscription-page .pricing-card:hover {
    border-color: var(--tp-border-strong);
    box-shadow: 0 22px 48px rgb(var(--tp-shadow-rgb) / 0.12);
}

.subscription-page .pricing-card h3 {
    background: transparent;
    color: var(--tp-text-primary);
    text-shadow: none;
    padding: 0;
    margin-top: 0.75rem;
}

.subscription-page .pricing-card .price {
    color: var(--tp-slate);
}

.subscription-page .pricing-card .features li {
    color: var(--tp-text-secondary);
}

.subscription-page .paddle-checkout-btn,
.subscription-page .btn-gradient {
    background: var(--tp-gold);
    border: 1px solid var(--tp-gold);
    color: var(--tp-ivory);
    border-radius: 999px;
    box-shadow: 0 14px 28px rgb(var(--tp-shadow-rgb) / 0.12);
}

.subscription-page .paddle-checkout-btn:hover,
.subscription-page .btn-gradient:hover {
    background: var(--tp-slate);
    border-color: var(--tp-slate);
    color: var(--tp-ivory);
}

.subscription-page .paddle-checkout-btn:disabled,
.subscription-page .paddle-checkout-btn.disabled,
.subscription-page .btn-gradient:disabled,
.subscription-page .btn-gradient.disabled {
    background: rgb(var(--tp-slate-rgb) / 0.10);
    color: var(--tp-text-muted);
    border-color: rgb(var(--tp-gold-rgb) / 0.14);
    box-shadow: none;
    opacity: 1;
}

.subscription-page .license-type-badge.home-use {
    background: linear-gradient(135deg, var(--tp-gold), var(--tp-gold-light));
    border-color: var(--tp-slate);
}

.subscription-page .license-type-badge.corporate-use {
    background: linear-gradient(135deg, #8f5a24, #c17b2c);
    border-color: #7a4b1f;
}

.subscription-page .popular-badge {
    background: linear-gradient(135deg, #c17b2c, #9a5d1b);
}

.subscription-page .current-subscription {
    background: linear-gradient(135deg, var(--tp-slate), var(--tp-gold));
    border-radius: 24px;
    box-shadow: 0 20px 46px rgb(var(--tp-shadow-rgb) / 0.14);
}

.subscription-page .serial-card {
    background: rgb(var(--tp-cream-rgb) / 0.72);
    border: 1px solid var(--tp-border);
}

.subscription-page .serial-card:hover {
    background: rgb(var(--tp-cream-rgb) / 0.92);
}

.subscription-page .serial-code {
    color: var(--tp-slate);
    background: rgb(var(--tp-slate-rgb) / 0.06);
}

.subscription-page .serial-info {
    color: var(--tp-text-secondary);
}

.subscription-page .subscription-change-info {
    background: rgb(var(--tp-slate-rgb) / 0.05);
    border-color: var(--tp-border);
}

.subscription-page .subscription-change-info small {
    color: var(--tp-text-secondary);
}

.subscription-page .subscription-change-info .text-warning {
    color: #925d22 !important;
}

@media (max-width: 991px) {
    .editorial-grid-two,
    .download-page .download-support-grid {
        grid-template-columns: 1fr;
    }

    .compatibility-page .compatibility-toolbar,
    .highscores-page .editorial-selector-panel {
        align-items: stretch;
        flex-direction: column;
    }

    .compatibility-page .compatibility-search,
    .highscores-page .highscores-select-wrap {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .editorial-page {
        padding: 1.25rem 0 4rem;
    }

    .editorial-page-hero,
    .editorial-panel,
    .subscription-page .subscription-hero {
        border-radius: 24px;
    }

    .editorial-page .table > :not(caption) > * > * {
        padding: 0.8rem 0.85rem;
    }

    .download-page .download-modal-content {
        margin-top: 8vh;
    }

    .highscores-page .tab-content {
        padding: 1rem;
    }

    .compatibility-page .table.games .status-text {
        display: none;
    }

    .compatibility-page .sortable .bi {
        display: none;
    }
}

@media (max-width: 575px) {
    .editorial-page-hero h1 {
        font-size: 2rem;
    }

    .editorial-action-row,
    .download-page .download-modal-actions,
    .editorial-metric-row {
        flex-direction: column;
    }

    .editorial-page .btn,
    .download-page .editorial-action-row form,
    .download-page .editorial-action-row a,
    .download-page .editorial-action-row button,
    .download-page .download-legacy-cta button,
    .download-page .download-modal-actions .btn {
        width: 100%;
    }

    .subscription-page .pricing-card {
        padding-left: 1.2rem;
        padding-right: 1.2rem;
    }
}


