.competitive-page {
    --cp-bg: #080e16;
    --cp-panel: #111b27;
    --cp-panel-2: #172535;
    --cp-panel-3: #0c1520;
    --cp-line: #354b61;
    --cp-line-strong: #52708d;
    --cp-text: #f7fbff;
    --cp-muted: #b8c8d7;
    --cp-accent: #39d7ff;
    --cp-accent-2: #9cecff;
    --cp-success: #5df0a0;
    --cp-focus: #ffe083;
    width: min(100%, 1680px);
    margin: 0 auto;
    padding: clamp(1rem, 2.5vw, 3rem);
    color: var(--cp-text);
    font-size: 1rem;
    line-height: 1.55;
}

.competitive-page * { box-sizing: border-box; }
.competitive-page a { color: inherit; }
.competitive-page :where(a, button, input, select, summary, [tabindex]):focus-visible {
    outline: 3px solid var(--cp-focus);
    outline-offset: 3px;
}

.competitive-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: clamp(1.5rem, 4vw, 4rem);
    min-height: clamp(320px, 31vw, 460px);
    padding: clamp(2rem, 5vw, 5.5rem);
    border: 1px solid var(--cp-line);
    border-radius: 28px;
    background:
        radial-gradient(circle at 82% 18%, rgba(57, 215, 255, .2), transparent 34%),
        linear-gradient(145deg, #142131, #090f17 72%);
    box-shadow: 0 24px 70px rgba(0, 0, 0, .22);
}
.competitive-hero > div { min-width: 0; }
.competitive-hero h1 {
    max-width: 1060px;
    margin: .45rem 0 1.25rem;
    font-size: clamp(3rem, 6.5vw, 7rem);
    line-height: .88;
    letter-spacing: -.06em;
    overflow-wrap: anywhere;
}
.competitive-hero p {
    max-width: 780px;
    margin-bottom: 0;
    color: var(--cp-muted);
    font-size: clamp(1rem, 1.5vw, 1.25rem);
}
.competitive-eyebrow,
.competitive-kicker {
    margin: 0;
    color: var(--cp-accent-2);
    font-size: .82rem;
    font-weight: 850;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.competitive-signal {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: .6rem;
    min-height: 44px;
    padding: .7rem 1rem;
    border: 1px solid var(--cp-line-strong);
    border-radius: 999px;
    background: #07111b;
    font: 800 .76rem/1 system-ui;
    letter-spacing: .08em;
}
.competitive-signal i {
    width: .65rem;
    height: .65rem;
    border-radius: 50%;
    background: var(--cp-success);
    box-shadow: 0 0 0 5px rgba(93, 240, 160, .13);
}

.competitive-tabs {
    position: sticky;
    top: .5rem;
    z-index: 20;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 1.25rem 0 2rem;
    border: 1px solid var(--cp-line);
    border-radius: 16px;
    background: rgba(8, 14, 22, .96);
    box-shadow: 0 12px 32px rgba(0, 0, 0, .22);
    backdrop-filter: blur(14px);
    overflow: hidden;
}
.competitive-tabs a {
    display: flex;
    min-width: 0;
    min-height: 58px;
    align-items: center;
    justify-content: center;
    padding: .85rem 1rem;
    border-right: 1px solid var(--cp-line);
    color: var(--cp-muted);
    font-weight: 800;
    text-align: center;
    text-decoration: none;
}
.competitive-tabs a:last-child { border-right: 0; }
.competitive-tabs a:hover,
.competitive-tabs a:focus-visible,
.competitive-tabs a[aria-current="page"] {
    background: var(--cp-panel-2);
    color: var(--cp-text);
    box-shadow: inset 0 -4px var(--cp-accent);
}

.competitive-overview {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(360px, .55fr);
    gap: 1.25rem;
}
.competitive-lead,
.competitive-kpis,
.competitive-panel,
.competitive-profile {
    border: 1px solid var(--cp-line);
    border-radius: 22px;
    background: var(--cp-panel);
    box-shadow: 0 18px 50px rgba(0, 0, 0, .12);
}
.competitive-lead { padding: clamp(1.5rem, 4vw, 4rem); }
.competitive-lead h2,
.competitive-panel > header h2 {
    margin: .5rem 0 .75rem;
    font-size: clamp(2rem, 3.8vw, 3.75rem);
    line-height: 1.05;
    letter-spacing: -.04em;
}
.competitive-lead > p,
.competitive-panel > header > p,
.competitive-panel > header > div > p {
    max-width: 820px;
    color: var(--cp-muted);
}
.competitive-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    margin-top: 1.75rem;
}
.competitive-button,
.competitive-row-actions button,
.competitive-row-actions a,
.competitive-card-actions :is(button, a) {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    padding: .7rem 1rem;
    border: 1px solid var(--cp-line-strong);
    border-radius: 10px;
    background: #1a2a3a;
    color: var(--cp-text);
    font: inherit;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}
.competitive-button:hover,
.competitive-row-actions :is(button, a):hover,
.competitive-card-actions :is(button, a):hover {
    border-color: var(--cp-accent);
    background: #20374b;
}
.competitive-button.is-primary { border-color: var(--cp-accent); background: var(--cp-accent); color: #041018; }
.competitive-button:disabled { cursor: not-allowed; opacity: .5; }

.competitive-kpis {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0;
    padding: .75rem;
}
.competitive-kpis div { min-width: 0; padding: clamp(1rem, 2vw, 1.5rem); border: 1px solid transparent; border-radius: 14px; }
.competitive-kpis div:hover { border-color: var(--cp-line); background: var(--cp-panel-2); }
.competitive-kpis dt { color: var(--cp-muted); font-size: .82rem; }
.competitive-kpis dd { margin: .4rem 0 0; font-size: clamp(1.65rem, 3vw, 2.75rem); font-weight: 850; overflow-wrap: anywhere; }
.competitive-kpis dd.is-date { font-size: .95rem; line-height: 1.45; }

.competitive-panel { margin-top: 1.25rem; padding: clamp(1.25rem, 3vw, 3rem); }
.competitive-panel > header { display: grid; grid-template-columns: minmax(0, 1fr); gap: .15rem; }
.competitive-panel > header > * { margin-top: 0; }
.competitive-snapshot > header { grid-template-columns: minmax(260px, .55fr) minmax(320px, 1fr); align-items: end; gap: 2rem; }
.competitive-snapshot > header h2 { font-size: clamp(1.8rem, 3vw, 2.8rem); }
.competitive-loading,
.competitive-empty { grid-column: 1 / -1; padding: clamp(2.5rem, 7vw, 6rem) 1rem; color: var(--cp-muted); text-align: center; }

.competitive-metrics,
.competitive-category-nav { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; margin: 1.75rem 0; }
.competitive-metrics button,
.competitive-category-nav a {
    display: flex;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    padding: .75rem;
    border: 1px solid var(--cp-line-strong);
    border-radius: 11px;
    background: var(--cp-panel-3);
    color: var(--cp-muted);
    font: inherit;
    font-weight: 800;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}
.competitive-metrics button:hover,
.competitive-metrics button:focus-visible,
.competitive-metrics button.is-active,
.competitive-category-nav a:hover,
.competitive-category-nav a:focus-visible,
.competitive-category-nav a[aria-current="page"] { border-color: var(--cp-accent); background: #173044; color: var(--cp-text); }

.competitive-filter-form { margin: 1.5rem 0; padding: clamp(1rem, 2vw, 1.5rem); border: 1px solid var(--cp-line); border-radius: 16px; background: var(--cp-panel-3); }
.competitive-search-row { display: grid; grid-template-columns: auto minmax(220px, 1fr) auto auto; gap: .75rem; align-items: center; }
.competitive-search-row > label { color: var(--cp-text); font-weight: 800; }
.competitive-filter-form input,
.competitive-filter-form select {
    width: 100%;
    min-height: 46px;
    padding: .65rem .8rem;
    border: 1px solid var(--cp-line-strong);
    border-radius: 9px;
    background: #07111b;
    color: var(--cp-text);
    font: inherit;
}
.competitive-filter-form input::placeholder { color: #91a6ba; opacity: 1; }
.competitive-filters { margin-top: 1rem; padding-top: .25rem; border-top: 1px solid var(--cp-line); }
.competitive-filters summary,
.competitive-methodology summary { display: flex; min-height: 46px; align-items: center; color: var(--cp-accent-2); font-weight: 850; cursor: pointer; }
.competitive-filter-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin-top: 1rem; }
.competitive-filter-grid label,
.competitive-filter-grid fieldset { min-width: 0; margin: 0; padding: 0; border: 0; color: var(--cp-muted); font-size: .82rem; font-weight: 750; }
.competitive-filter-grid label select,
.competitive-filter-grid label input { margin-top: .4rem; }
.competitive-filter-grid fieldset { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.competitive-filter-grid legend { grid-column: 1 / -1; margin-bottom: .4rem; }
.competitive-privacy { margin: 1.25rem 0 .25rem; color: var(--cp-muted); font-size: .86rem; }
.competitive-status { min-height: 1.75rem; margin: 1rem 0; color: var(--cp-muted); }

.competitive-podium { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end; gap: 1rem; width: min(100%, 1000px); margin: 1.5rem auto 2rem; }
.competitive-podium-card {
    display: flex;
    min-width: 0;
    min-height: 190px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    padding: 1.25rem;
    border: 1px solid var(--cp-line-strong);
    border-radius: 16px;
    background: #10202e;
    text-align: center;
    text-decoration: none;
    overflow-wrap: anywhere;
}
.competitive-podium-card.is-first { min-height: 235px; border-color: #e0bf61; background: #172435; }
.competitive-avatar { width: 58px; height: 58px; flex: 0 0 auto; border: 2px solid var(--cp-line-strong); border-radius: 50%; background: #203144; object-fit: cover; }
.competitive-podium-card strong,
.competitive-podium-card span { max-width: 100%; }
.competitive-podium-card strong { font-size: 1.05rem; }
.competitive-podium-card span { color: var(--cp-accent-2); }

.competitive-table-wrap {
    position: relative;
    max-width: 100%;
    border: 1px solid var(--cp-line);
    border-radius: 14px;
    background: var(--cp-panel-3);
    overflow: auto;
    overscroll-behavior-inline: contain;
    scrollbar-color: var(--cp-line-strong) var(--cp-panel-3);
    scrollbar-width: auto;
}
.competitive-table-wrap table { width: 100%; min-width: 1100px; border-collapse: separate; border-spacing: 0; background: var(--cp-panel-3); }
.competitive-hall-table table { min-width: 820px; }
.competitive-table-wrap caption { padding: 1rem; color: var(--cp-muted); font-weight: 700; text-align: left; }
.competitive-table-wrap th,
.competitive-table-wrap td { padding: .9rem 1rem; border-top: 1px solid var(--cp-line); text-align: left; white-space: nowrap; }
.competitive-table-wrap thead th { position: sticky; top: 0; z-index: 2; background: #15243a; color: #d7e5f1; font-size: .76rem; letter-spacing: .04em; text-transform: uppercase; }
.competitive-table-wrap tbody tr:nth-child(even) { background: rgba(255, 255, 255, .018); }
.competitive-table-wrap tbody tr:hover { background: #152434; }
.competitive-table-player { display: flex; align-items: center; gap: .75rem; }
.competitive-table-player span { min-width: 0; }
.competitive-table-player strong,
.competitive-table-player small { display: block; }
.competitive-table-player small { color: var(--cp-muted); }
.competitive-entity-cell a { display: inline-flex; min-height: 44px; align-items: center; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.competitive-row-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.competitive-row-actions button,
.competitive-row-actions a { min-height: 44px; padding: .55rem .75rem; }

.competitive-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.competitive-card {
    display: grid;
    min-width: 0;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 1rem;
    padding: 1.25rem;
    border: 1px solid var(--cp-line);
    border-radius: 16px;
    background: var(--cp-panel-3);
}
.competitive-card > div:not([class]) { min-width: 0; }
.competitive-card h3 { margin: 0; font-size: 1.15rem; overflow-wrap: anywhere; }
.competitive-card p { margin: .35rem 0; color: var(--cp-muted); overflow-wrap: anywhere; }
.competitive-card-bio { grid-column: 1 / -1; margin: 0; color: var(--cp-muted); font-size: .88rem; }
.competitive-card-meta { display: flex; grid-column: 1 / -1; flex-wrap: wrap; gap: .4rem; margin: 0; padding: 0; list-style: none; }
.competitive-card-meta li { padding: .4rem .6rem; border: 1px solid var(--cp-line); border-radius: 999px; color: var(--cp-muted); font-size: .76rem; }
.competitive-card-stats { display: grid; grid-column: 1 / -1; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; }
.competitive-card-stats span { min-width: 0; padding: .7rem .55rem; border: 1px solid rgba(82, 112, 141, .45); border-radius: 9px; background: #17283a; color: var(--cp-muted); font-size: .76rem; overflow-wrap: anywhere; }
.competitive-card-stats strong { display: block; color: var(--cp-text); font-size: 1.05rem; }
.competitive-card-actions { display: grid; grid-column: 1 / -1; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; }
.competitive-card-actions > * { min-width: 0; }
.competitive-card-actions [data-compare-player][aria-pressed="true"] { border-color: var(--cp-accent); background: #17425a; }
.competitive-pagination { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .8rem; margin-top: 1.25rem; }

.competitive-profile { margin-top: 1.25rem; padding: clamp(1.25rem, 3vw, 2rem); }
.competitive-profile-head { display: flex; align-items: center; gap: 1rem; }
.competitive-profile-head h2 { margin: 0; overflow-wrap: anywhere; }
.competitive-profile dl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.competitive-profile dl div { padding: .9rem; border: 1px solid var(--cp-line); border-radius: 10px; background: var(--cp-panel-3); }
.competitive-profile dt { color: var(--cp-muted); font-size: .76rem; }
.competitive-profile dd { margin: .25rem 0 0; font-weight: 850; }

.competitive-compare-dock {
    position: sticky;
    bottom: max(1rem, env(safe-area-inset-bottom));
    z-index: 30;
    display: flex;
    width: min(100%, 980px);
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 1.25rem auto 0;
    padding: 1rem 1.2rem;
    border: 2px solid var(--cp-accent);
    border-radius: 16px;
    background: #081521;
    box-shadow: 0 18px 55px rgba(0, 0, 0, .55);
}
.competitive-compare-dock[hidden] { display: none; }
.competitive-compare-dock > span { min-width: 0; overflow-wrap: anywhere; }
.competitive-compare-dock > div { display: flex; flex: 0 0 auto; gap: .6rem; }
.competitive-dialog {
    width: min(960px, calc(100% - 2rem));
    max-height: min(90vh, 900px);
    padding: clamp(1.25rem, 4vw, 3rem);
    border: 1px solid var(--cp-line-strong);
    border-radius: 20px;
    background: var(--cp-panel);
    color: var(--cp-text);
    box-shadow: 0 30px 90px rgba(0, 0, 0, .65);
    overflow: auto;
}
.competitive-dialog::backdrop { background: rgba(0, 4, 10, .82); backdrop-filter: blur(3px); }
.competitive-dialog h2 { margin: 0 0 1.5rem; text-align: center; }
.competitive-dialog > .competitive-button { width: 100%; margin-top: .5rem; }
.competitive-versus-head { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: stretch; gap: clamp(.75rem, 3vw, 2rem); text-align: center; }
.competitive-versus-head > b { display: flex; width: 58px; height: 58px; align-self: center; align-items: center; justify-content: center; border: 2px solid var(--cp-accent); border-radius: 50%; color: var(--cp-accent-2); background: #07111b; }
.competitive-versus-player { display: flex; min-width: 0; min-height: 180px; flex-direction: column; align-items: center; justify-content: center; gap: .75rem; padding: 1.25rem; border: 1px solid var(--cp-line); border-radius: 16px; background: var(--cp-panel-3); overflow-wrap: anywhere; }
.competitive-versus-player .competitive-avatar { width: 76px; height: 76px; }
.competitive-versus-metrics { display: grid; gap: .65rem; margin: 1.5rem 0; }
.competitive-versus-metrics article { display: grid; grid-template-columns: minmax(0, 1fr) minmax(120px, .7fr) minmax(0, 1fr); align-items: center; gap: 1rem; min-height: 72px; padding: .8rem 1rem; border: 1px solid var(--cp-line); border-radius: 12px; background: var(--cp-panel-3); text-align: center; }
.competitive-versus-metrics h3 { margin: 0; color: var(--cp-muted); font-size: .9rem; }
.competitive-versus-metrics span { font-size: 1.25rem; font-weight: 850; }

.competitive-viewer-position { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 1rem 0; padding: 1rem 1.2rem; border: 2px solid var(--cp-accent); border-radius: 14px; background: #0c1b25; }
.competitive-viewer-position[hidden] { display: none; }
.competitive-viewer-position > div { display: flex; align-items: center; gap: .75rem; }
.competitive-viewer-position strong { color: var(--cp-accent-2); font-size: 1.6rem; }
.competitive-methodology { margin-top: 1.25rem; padding: .5rem 1.1rem 1rem; border: 1px solid var(--cp-line); border-radius: 12px; color: var(--cp-muted); background: var(--cp-panel-3); }

@media (min-width: 1500px) {
    .competitive-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .competitive-card-actions { grid-template-columns: 1fr 1fr; }
    .competitive-card-actions [data-compare-player] { grid-column: 1 / -1; }
}

@media (max-width: 1180px) {
    .competitive-overview { grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr); }
    .competitive-filter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .competitive-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .competitive-card-actions { grid-template-columns: 1fr 1fr; }
    .competitive-card-actions [data-compare-player] { grid-column: 1 / -1; }
}

@media (max-width: 900px) {
    .competitive-hero { min-height: 300px; }
    .competitive-overview { grid-template-columns: 1fr; }
    .competitive-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .competitive-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .competitive-profile dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .competitive-snapshot > header { grid-template-columns: 1fr; gap: .25rem; }
}

@media (max-width: 800px) {
    .competitive-page { padding: .85rem; }
    .competitive-hero { grid-template-columns: 1fr; min-height: 280px; align-items: start; padding: 1.5rem; border-radius: 20px; }
    .competitive-hero h1 { font-size: clamp(2.3rem, 12vw, 4rem); }
    .competitive-signal { grid-row: 1; width: max-content; }
    .competitive-tabs { position: relative; top: auto; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: .9rem 0 1.25rem; }
    .competitive-tabs a { min-height: 50px; border-bottom: 1px solid var(--cp-line); }
    .competitive-tabs a:nth-child(2) { border-right: 0; }
    .competitive-tabs a:nth-child(n+3) { border-bottom: 0; }
    .competitive-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .competitive-panel { border-radius: 18px; }
    .competitive-metrics,
    .competitive-category-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .competitive-search-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .competitive-search-row label,
    .competitive-search-row input { grid-column: 1 / -1; }
    .competitive-cards { grid-template-columns: 1fr; }
    .competitive-card-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .competitive-card-actions { grid-template-columns: 1fr 1fr; }
    .competitive-card-actions [data-compare-player] { grid-column: 1 / -1; }
    .competitive-podium { gap: .5rem; }
    .competitive-podium-card { min-height: 160px; padding: .75rem .45rem; }
    .competitive-podium-card.is-first { min-height: 195px; }
    .competitive-podium-card .competitive-avatar { width: 48px; height: 48px; }
    .competitive-podium-card span { font-size: .8rem; }

    .competitive-ranking-table,
    .competitive-hall-table { border: 0; background: transparent; overflow: visible; }
    .competitive-ranking-table table,
    .competitive-hall-table table { min-width: 0; border-spacing: 0 .8rem; background: transparent; }
    .competitive-ranking-table caption,
    .competitive-hall-table caption { padding: .75rem 0; }
    .competitive-ranking-table thead,
    .competitive-hall-table thead { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; overflow: hidden; }
    .competitive-ranking-table tbody,
    .competitive-ranking-table tr,
    .competitive-hall-table tbody,
    .competitive-hall-table tr { display: block; }
    .competitive-ranking-table tr,
    .competitive-hall-table tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; margin-bottom: .85rem; padding: 1rem; border: 1px solid var(--cp-line); border-radius: 14px; background: var(--cp-panel-3); }
    .competitive-ranking-table th,
    .competitive-ranking-table td,
    .competitive-hall-table th,
    .competitive-hall-table td { display: flex; min-width: 0; flex-direction: column; justify-content: center; gap: .2rem; padding: .7rem; border: 1px solid rgba(82, 112, 141, .45); border-radius: 9px; background: #152536; white-space: normal; overflow-wrap: anywhere; }
    .competitive-ranking-table td::before,
    .competitive-hall-table td::before { content: attr(data-label); color: var(--cp-muted); font-size: .7rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
    .competitive-ranking-table th[scope="row"],
    .competitive-hall-table th[scope="row"] { grid-column: 1 / -1; min-height: 44px; color: var(--cp-accent-2); }
    .competitive-ranking-table .competitive-player-cell,
    .competitive-hall-table .competitive-entity-cell { grid-column: 1 / -1; }
    .competitive-ranking-table .competitive-actions-cell { grid-column: 1 / -1; padding: 0; border: 0; background: transparent; }
    .competitive-ranking-table .competitive-actions-cell::before { content: none; }
    .competitive-ranking-table .competitive-row-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .competitive-ranking-table .competitive-row-actions [data-compare-player] { grid-column: 1 / -1; }

    .competitive-compare-dock { align-items: stretch; flex-direction: column; }
    .competitive-compare-dock > div { display: grid; grid-template-columns: 1fr 1fr; }
    .competitive-dialog { width: calc(100% - 1rem); max-height: calc(100vh - 1rem); padding: 1rem; }
    .competitive-versus-head { gap: .5rem; }
    .competitive-versus-head > b { width: 46px; height: 46px; }
    .competitive-versus-player { min-height: 150px; padding: .75rem .4rem; }
    .competitive-versus-player .competitive-avatar { width: 58px; height: 58px; }
    .competitive-versus-metrics article { grid-template-columns: minmax(0, 1fr) minmax(82px, .8fr) minmax(0, 1fr); gap: .35rem; padding: .7rem .45rem; }
    .competitive-versus-metrics span { font-size: 1.05rem; }
    .competitive-viewer-position,
    .competitive-viewer-position > div { align-items: stretch; flex-direction: column; }
}

@media (min-width: 351px) and (max-width: 800px) {
    .competitive-ranking-table tr,
    .competitive-hall-table tr { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .competitive-ranking-table th[scope="row"],
    .competitive-hall-table th[scope="row"] { grid-column: auto; }
    .competitive-ranking-table .competitive-player-cell,
    .competitive-hall-table .competitive-entity-cell { grid-column: span 2; }
    .competitive-ranking-table .competitive-actions-cell { grid-column: 1 / -1; }
}

@media (max-width: 430px) {
    .competitive-page { padding: .65rem; font-size: .95rem; }
    .competitive-hero { min-height: 260px; padding: 1.25rem; }
    .competitive-lead,
    .competitive-panel { padding: 1.1rem; }
    .competitive-actions { display: grid; grid-template-columns: 1fr; }
    .competitive-filter-grid { grid-template-columns: 1fr; }
    .competitive-filter-grid fieldset { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .competitive-card { padding: 1rem; }
    .competitive-card-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .competitive-profile dl { grid-template-columns: 1fr 1fr; }
    .competitive-category-nav { gap: .5rem; }
    .competitive-podium-card strong { font-size: .86rem; }
    .competitive-podium-card span { font-size: .7rem; }
}

@media (max-width: 350px) {
    .competitive-page { padding: .5rem; }
    .competitive-hero h1 { font-size: 2.15rem; }
    .competitive-tabs a { padding: .65rem .35rem; font-size: .82rem; }
    .competitive-metrics,
    .competitive-category-nav { grid-template-columns: 1fr; }
    .competitive-kpis { grid-template-columns: 1fr; }
    .competitive-podium { grid-template-columns: 1fr; align-items: stretch; }
    .competitive-podium-card,
    .competitive-podium-card.is-first { min-height: 0; }
    .competitive-podium-card:nth-child(2) { grid-row: 1; }
    .competitive-profile dl { grid-template-columns: 1fr; }
    .competitive-ranking-table .competitive-row-actions { grid-template-columns: 1fr; }
    .competitive-ranking-table .competitive-row-actions [data-compare-player] { grid-column: auto; }
    .competitive-compare-dock > div { grid-template-columns: 1fr; }
    .competitive-versus-head { grid-template-columns: 1fr; }
    .competitive-versus-head > b { justify-self: center; }
    .competitive-versus-player { min-height: 120px; }
}

@media (prefers-reduced-motion: reduce) {
    .competitive-page * { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* Competitive 2.0: Database-aligned surfaces and ordered multi-compare. */
.competitive-page {
    width: min(100%, 1400px);
    padding: clamp(1rem, 2.5vw, 2.5rem);
}
.competitive-hero {
    min-height: clamp(250px, 24vw, 340px);
    padding: clamp(2rem, 5vw, 3.5rem);
    border-radius: 24px;
    background:
        radial-gradient(circle at 82% 18%, rgba(57, 215, 255, .12), transparent 35%),
        linear-gradient(145deg, rgba(20, 33, 49, .97), rgba(9, 15, 23, .99) 72%);
}
.competitive-hero h1 {
    max-width: 900px;
    font-size: clamp(2.65rem, 5vw, 5rem);
    line-height: .96;
    letter-spacing: -.045em;
}
.competitive-section {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: clamp(1.25rem, 4vw, 4rem);
    margin-top: 1.5rem;
    padding: clamp(1.5rem, 3.5vw, 3rem);
    border: 1px solid var(--cp-line);
    border-radius: 20px;
    background: var(--cp-panel);
    box-shadow: 0 14px 38px rgba(0, 0, 0, .13);
}
.competitive-section > * { min-width: 0; }
.competitive-section h2 {
    margin: .45rem 0 .7rem;
    font-size: clamp(1.75rem, 3vw, 2.8rem);
    line-height: 1.08;
    letter-spacing: -.03em;
}
.competitive-section p { max-width: 760px; color: var(--cp-muted); }
.competitive-overview { grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr); gap: 1.5rem; }
.competitive-overview-lead { display: flex; min-height: 100%; flex-direction: column; justify-content: center; }
.competitive-kpis { background: var(--cp-panel-3); }
.competitive-kpis div:hover { background: rgba(57, 215, 255, .05); }
.competitive-personal { grid-template-columns: minmax(0, .75fr) minmax(360px, 1.25fr); }
.competitive-personal-guest { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.2rem; border-left: 3px solid var(--cp-accent); background: var(--cp-panel-3); }
.competitive-personal-guest p { margin: 0; }
.competitive-compare-callout { border-color: rgba(57, 215, 255, .62); background: #0d1d29; }
.competitive-compare-callout > .competitive-button,
.competitive-find-callout > .competitive-button { min-width: 190px; }
.competitive-shortcuts { display: block; }
.competitive-shortcut-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; margin-top: 1.25rem; }
.competitive-shortcut-links a { display: flex; min-height: 84px; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.2rem; border: 1px solid var(--cp-line); border-radius: 12px; background: var(--cp-panel-3); color: var(--cp-text); text-decoration: none; }
.competitive-shortcut-links a:hover { border-color: var(--cp-accent); background: #142a3a; }
.competitive-shortcut-links span { color: var(--cp-accent-2); font-size: .82rem; }
.competitive-snapshot > #competitiveResults { min-width: 0; }
.competitive-snapshot .competitive-status:empty { display: none; }

.competitive-compare-dock {
    position: sticky;
    bottom: max(1rem, env(safe-area-inset-bottom));
    z-index: 30;
    display: grid;
    width: 100%;
    grid-template-columns: minmax(190px, .7fr) minmax(0, 1.8fr) auto;
    align-items: center;
    gap: 1rem;
    margin: 1.5rem auto 0;
    padding: 1rem 1.2rem;
    border: 2px solid var(--cp-accent);
    border-radius: 16px;
    background: rgba(8, 21, 33, .98);
    box-shadow: 0 18px 55px rgba(0, 0, 0, .55);
    backdrop-filter: blur(12px);
}
.competitive-compare-dock-copy { display: grid; gap: .12rem; min-width: 0; }
.competitive-compare-dock-copy > strong { font-size: 1.05rem; }
.competitive-compare-dock-copy > span { color: var(--cp-muted); font-size: .78rem; }
.competitive-compare-chips { display: flex; min-width: 0; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.competitive-compare-chip { display: inline-flex; min-width: 0; min-height: 44px; align-items: center; gap: .45rem; padding: .3rem .35rem .3rem .45rem; border: 1px solid var(--cp-line-strong); border-radius: 999px; background: var(--cp-panel-2); }
.competitive-compare-chip > span { max-width: 150px; overflow: hidden; font-size: .82rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.competitive-compare-chip-avatar { width: 30px; height: 30px; flex: 0 0 auto; border: 1px solid var(--cp-line-strong); border-radius: 50%; background: #203144; object-fit: cover; }
.competitive-compare-chip button { display: inline-flex; width: 36px; min-width: 36px; height: 36px; align-items: center; justify-content: center; padding: 0; border: 0; border-radius: 50%; background: #263d51; color: var(--cp-text); font: 800 1.2rem/1 system-ui; cursor: pointer; }
.competitive-compare-chip button:hover { background: #3a566d; }
.competitive-compare-actions { display: grid; grid-template-columns: repeat(3, auto); gap: .5rem; }
.competitive-card-actions [data-compare-player]:disabled,
.competitive-row-actions [data-compare-player]:disabled { cursor: not-allowed; opacity: .5; }

.competitive-dialog { width: min(1240px, calc(100% - 2rem)); }
.competitive-dialog-description { max-width: 780px; margin: -1rem auto 1.5rem; color: var(--cp-muted); text-align: center; }
.competitive-matrix-wrap { position: relative; max-width: 100%; border: 1px solid var(--cp-line); border-radius: 14px; background: var(--cp-panel-3); overflow-x: auto; overflow-y: visible; overscroll-behavior-inline: contain; scrollbar-color: var(--cp-line-strong) var(--cp-panel-3); }
.competitive-matrix { width: max-content; min-width: 100%; border-collapse: separate; border-spacing: 0; }
.competitive-matrix caption { padding: .9rem 1rem; color: var(--cp-muted); text-align: left; }
.competitive-matrix th,
.competitive-matrix td { min-width: 170px; padding: .9rem 1rem; border-top: 1px solid var(--cp-line); border-right: 1px solid var(--cp-line); background: var(--cp-panel-3); text-align: center; }
.competitive-matrix tr > :last-child { border-right: 0; }
.competitive-matrix thead th { position: sticky; top: 0; z-index: 2; background: #15243a; vertical-align: bottom; }
.competitive-matrix th:first-child { position: sticky; left: 0; z-index: 3; min-width: 150px; max-width: 150px; background: #142638; text-align: left; }
.competitive-matrix thead th:first-child { z-index: 4; background: #193047; }
.competitive-matrix-player { display: flex; min-width: 0; flex-direction: column; align-items: center; gap: .5rem; overflow-wrap: anywhere; }
.competitive-matrix-player strong { max-width: 150px; }
.competitive-matrix tbody td { font-size: 1.08rem; font-weight: 850; }

@media (max-width: 1050px) {
    .competitive-compare-dock { grid-template-columns: minmax(190px, .65fr) minmax(0, 1.35fr); }
    .competitive-compare-actions { grid-column: 1 / -1; grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 800px) {
    .competitive-page { padding: .85rem; }
    .competitive-hero { min-height: 250px; padding: 1.5rem; }
    .competitive-overview,
    .competitive-personal,
    .competitive-section { grid-template-columns: 1fr; }
    .competitive-personal-guest { align-items: stretch; flex-direction: column; }
    .competitive-shortcut-links { grid-template-columns: 1fr; }
    .competitive-compare-callout > .competitive-button,
    .competitive-find-callout > .competitive-button { width: 100%; min-width: 0; }
    .competitive-compare-dock { position: relative; bottom: auto; display: grid; grid-template-columns: 1fr; align-items: stretch; padding: .85rem; }
    .competitive-compare-actions { grid-column: auto; grid-template-columns: 1fr 1fr; }
    .competitive-compare-actions [data-open-compare] { grid-column: 1 / -1; }
    .competitive-compare-chips { max-height: 152px; overflow-y: auto; }
    .competitive-dialog { width: calc(100% - 1rem); max-height: calc(100vh - 1rem); padding: 1rem; }
    .competitive-matrix th,
    .competitive-matrix td { min-width: 148px; padding: .75rem .65rem; }
    .competitive-matrix th:first-child { min-width: 118px; max-width: 118px; }
}

@media (max-width: 430px) {
    .competitive-section { padding: 1.1rem; }
    .competitive-compare-actions { grid-template-columns: 1fr; }
    .competitive-compare-actions [data-open-compare] { grid-column: auto; }
    .competitive-compare-chip { width: 100%; }
    .competitive-compare-chip > span { max-width: none; flex: 1; }
}


/* Tournament-language redesign: presentation only. */
.competitive-page {
    --cp-bg: #070b18;
    --cp-panel: rgba(14, 20, 38, .96);
    --cp-panel-2: rgba(15, 23, 44, .92);
    --cp-panel-3: rgba(5, 10, 24, .66);
    --cp-line: rgba(255, 255, 255, .085);
    --cp-line-strong: color-mix(in srgb, var(--cp-accent) 34%, transparent);
    --cp-text: #d5e2f5;
    --cp-muted: #aabbd2;
    --cp-accent: #00d4ff;
    --cp-accent-2: #8b5cf6;
    --cp-success: #4ade80;
    width: min(1400px, calc(100% - 32px));
    padding: 26px 0 72px;
    font-size: 1rem;
    line-height: 1.65;
}

.competitive-hero {
    position: relative;
    display: grid;
    min-height: 480px;
    grid-template-columns: minmax(0, 1.55fr) minmax(300px, .65fr);
    align-items: stretch;
    gap: 34px;
    padding: 48px;
    border-color: color-mix(in srgb, var(--cp-accent) 28%, transparent);
    border-radius: 28px;
    background:
        linear-gradient(90deg, rgba(5, 10, 25, .9), rgba(5, 10, 25, .42)),
        radial-gradient(circle at 76% 18%, rgba(0, 212, 255, .2), transparent 30%),
        radial-gradient(circle at 88% 74%, rgba(139, 92, 246, .27), transparent 34%),
        #070b18;
    box-shadow: 0 28px 74px rgba(0, 0, 0, .38), inset 0 0 0 1px rgba(255, 255, 255, .025);
    overflow: hidden;
}
.competitive-hero::before {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
    background-size: 56px 56px;
    content: "";
    mask-image: linear-gradient(90deg, transparent 32%, #000);
    pointer-events: none;
}
.competitive-hero-main {
    position: relative;
    z-index: 1;
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}
.competitive-hero h1 {
    max-width: 720px;
    margin: .55rem 0 1rem;
    color: #fff;
    font-size: clamp(2.35rem, 4vw, 3.6rem);
    font-weight: 900;
    line-height: .98;
    letter-spacing: -.045em;
}
.competitive-hero p {
    max-width: 650px;
    color: var(--cp-muted);
    font-size: clamp(.96rem, 1.2vw, 1.06rem);
    line-height: 1.65;
}
.competitive-eyebrow,
.competitive-kicker {
    color: #64e5ff;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .16em;
}
.competitive-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .7rem;
    margin-top: 1.6rem;
}
.competitive-hero-actions .competitive-button { gap: .6rem; }
.competitive-hero-console {
    position: relative;
    z-index: 1;
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: space-between;
    gap: 1.25rem;
    padding: 24px;
    border: 1px solid color-mix(in srgb, var(--cp-accent) 38%, transparent);
    border-radius: 20px;
    background: linear-gradient(155deg, rgba(13, 19, 39, .98), rgba(6, 10, 23, .98));
    box-shadow: 0 24px 58px rgba(0, 0, 0, .46), inset 0 1px 0 rgba(255, 255, 255, .05);
}
.competitive-hero-console::before {
    position: absolute;
    top: 0;
    right: 16%;
    left: 16%;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--cp-accent), var(--cp-accent-2), transparent);
    content: "";
}
.competitive-hero-console .competitive-signal { align-self: flex-start; }
.competitive-hero-console-grid { display: grid; gap: .65rem; }
.competitive-hero-console-grid span {
    display: flex;
    min-height: 54px;
    align-items: center;
    gap: .8rem;
    padding: .65rem .8rem;
    border: 1px solid var(--cp-line);
    border-radius: 13px;
    background: rgba(5, 10, 24, .7);
    color: var(--cp-text);
    font-size: .83rem;
    font-weight: 800;
}
.competitive-hero-console-grid b {
    display: grid;
    width: 32px;
    height: 32px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--cp-accent), var(--cp-accent-2));
    color: #041018;
    font-size: .72rem;
}
.competitive-hero-console > p {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    margin: 0;
    padding-top: 1rem;
    border-top: 1px solid var(--cp-line);
    font-size: .78rem;
}
.competitive-hero-console > p i { margin-top: .25rem; color: var(--cp-accent); }

.competitive-signal {
    min-height: 40px;
    padding: .55rem .8rem;
    border-color: rgba(255,255,255,.11);
    background: rgba(5, 10, 24, .8);
    font-size: .68rem;
}
.competitive-tabs {
    display: flex;
    gap: 4px;
    margin: 14px 0 20px;
    padding: 5px 8px;
    border-color: rgba(255,255,255,.08);
    border-radius: 16px;
    background: rgba(7, 11, 24, .98);
    box-shadow: 0 14px 38px rgba(0, 0, 0, .28);
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
}
.competitive-tabs a {
    min-width: 150px;
    min-height: 42px;
    flex: 1 0 auto;
    padding: .55rem 1rem;
    border: 0;
    border-radius: 11px;
    color: var(--cp-muted);
    font-size: .8rem;
    transition: background-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.competitive-tabs a:hover,
.competitive-tabs a:focus-visible {
    background: rgba(255,255,255,.055);
    box-shadow: none;
}
.competitive-tabs a[aria-current="page"] {
    background: linear-gradient(135deg, color-mix(in srgb, var(--cp-accent) 22%, transparent), color-mix(in srgb, var(--cp-accent-2) 24%, transparent));
    color: #fff;
    box-shadow: inset 0 0 0 1px var(--cp-line-strong);
}
.competitive-page .competitive-tabs a:focus-visible {
    outline: 3px solid var(--cp-focus) !important;
    outline-offset: 3px;
}

.competitive-button,
.competitive-row-actions button,
.competitive-row-actions a,
.competitive-card-actions [data-compare-player] {
    min-height: 44px;
    padding: .65rem 1rem;
    border-color: rgba(255,255,255,.13);
    border-radius: 999px;
    background: rgba(255,255,255,.045);
    color: var(--cp-text);
    font-size: .82rem;
    font-weight: 850;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
.competitive-button:hover,
.competitive-row-actions :is(button, a):hover,
.competitive-card-actions [data-compare-player]:hover {
    border-color: color-mix(in srgb, var(--cp-accent) 52%, transparent);
    background: rgba(0, 212, 255, .09);
}
.competitive-button.is-primary,
.competitive-card-actions [data-compare-player] {
    border-color: rgba(75, 229, 255, .72);
    background: linear-gradient(110deg, #00aef0, #7b2cbf);
    color: #fff;
    box-shadow: 0 10px 28px rgba(0, 174, 240, .2), inset 0 1px 0 rgba(255,255,255,.18);
}
.competitive-button.is-secondary {
    border-color: color-mix(in srgb, var(--cp-accent) 42%, transparent);
    background: linear-gradient(115deg, rgba(0, 212, 255, .12), rgba(123, 44, 191, .22));
    color: #fff;
}
.competitive-button.is-ghost { border-color: transparent; background: transparent; color: #86eaff; box-shadow: none; }
.competitive-button:disabled {
    border-color: rgba(255,255,255,.07);
    background: rgba(255,255,255,.03);
    color: #76869a;
    box-shadow: none;
    opacity: 1;
}

.competitive-lead,
.competitive-kpis,
.competitive-panel,
.competitive-profile,
.competitive-section {
    border-color: var(--cp-line);
    background: linear-gradient(150deg, rgba(14, 20, 38, .96), rgba(7, 11, 24, .96));
    box-shadow: 0 18px 48px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255,255,255,.035);
}
.competitive-overview { gap: 16px; }
.competitive-lead {
    padding: clamp(24px, 3vw, 32px);
    border-radius: 22px;
}
.competitive-lead h2,
.competitive-panel > header h2,
.competitive-section h2 {
    margin: .45rem 0 .6rem;
    color: #fff;
    font-size: clamp(1.55rem, 2.4vw, 2.15rem);
    font-weight: 850;
    line-height: 1.08;
    letter-spacing: -.03em;
}
.competitive-overview-lead { min-height: 260px; }
.competitive-kpis {
    padding: 10px;
    border-radius: 22px;
    background: linear-gradient(155deg, rgba(9, 15, 31, .98), rgba(5, 10, 23, .98));
}
.competitive-kpis div {
    display: flex;
    min-height: 108px;
    flex-direction: column;
    justify-content: center;
    padding: 16px;
    border-color: rgba(255,255,255,.055);
    background: rgba(255,255,255,.018);
}
.competitive-kpis dt { color: var(--cp-muted); font-size: .74rem; font-weight: 750; }
.competitive-kpis dd { color: #fff; font-size: clamp(1.45rem, 2vw, 2rem); }
.competitive-kpis dd.is-date { font-size: .83rem; }
.competitive-section,
.competitive-panel {
    margin-top: 16px;
    padding: clamp(22px, 3vw, 30px);
    border-radius: 22px;
}
.competitive-section { gap: clamp(20px, 3vw, 38px); }
.competitive-personal { grid-template-columns: minmax(0, .9fr) minmax(360px, 1.1fr); }
.competitive-personal-guest {
    padding: 18px;
    border: 1px solid var(--cp-line);
    border-left: 3px solid var(--cp-accent);
    border-radius: 15px;
    background: rgba(5,10,24,.62);
}
.competitive-personal-guest .competitive-button { flex: 0 0 auto; }
.competitive-snapshot > header { grid-template-columns: minmax(250px,.5fr) minmax(0,1fr); }
.competitive-snapshot .competitive-ranking-table { margin-top: .65rem; }
.competitive-snapshot .competitive-table-wrap th,
.competitive-snapshot .competitive-table-wrap td { padding: .7rem .8rem; }
.competitive-snapshot .competitive-row-actions { flex-wrap: nowrap; }
.competitive-snapshot .competitive-row-actions :is(button,a) { min-height: 40px; padding: .45rem .65rem; font-size: .72rem; }
.competitive-compare-callout {
    border-color: color-mix(in srgb, var(--cp-accent) 34%, transparent);
    background:
        radial-gradient(circle at 86% 30%, rgba(0,212,255,.13), transparent 27%),
        linear-gradient(145deg, rgba(10, 22, 40, .98), rgba(7, 11, 24, .98));
}
.competitive-shortcut-links a {
    min-height: 72px;
    border-color: var(--cp-line);
    border-radius: 15px;
    background: rgba(5, 10, 24, .62);
}
.competitive-shortcut-links a:hover {
    background: color-mix(in srgb, var(--cp-accent) 8%, rgba(5,10,24,.8));
}

.competitive-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 18px;
}
.competitive-workspace .competitive-compare-dock { grid-column: 1; grid-row: 1; }
.competitive-workspace .competitive-explorer { min-width: 0; grid-column: 1; grid-row: 2; margin-top: 0; }
.competitive-workspace .competitive-profile { grid-column: 1; grid-row: 3; margin-top: 0; }

.competitive-metrics,
.competitive-category-nav {
    gap: .55rem;
    margin: 1.15rem 0;
    padding: 5px;
    border: 1px solid var(--cp-line);
    border-radius: 15px;
    background: rgba(5,10,24,.58);
}
.competitive-metrics button,
.competitive-category-nav a {
    min-height: 44px;
    border-color: transparent;
    border-radius: 11px;
    background: transparent;
    font-size: .78rem;
}
.competitive-metrics button.is-active,
.competitive-category-nav a[aria-current="page"] {
    border-color: var(--cp-line-strong);
    background: linear-gradient(135deg, rgba(0,212,255,.14), rgba(123,44,191,.22));
}
.competitive-filter-form {
    margin: 1rem 0;
    padding: 0;
    border: 0;
    background: transparent;
}
.competitive-search-row {
    grid-template-columns: auto minmax(220px,1fr) auto auto;
    gap: .6rem;
    padding: 12px;
    border: 1px solid var(--cp-line);
    border-radius: 15px;
    background: rgba(5,10,24,.7);
}
.competitive-search-row > label { padding-left: .4rem; font-size: .78rem; }
.competitive-filter-form input,
.competitive-filter-form select {
    min-height: 44px;
    border-color: rgba(255,255,255,.12);
    border-radius: 11px;
    background: #050a18;
}
.competitive-filters {
    margin-top: .65rem;
    padding: 0 16px 14px;
    border: 1px solid var(--cp-line);
    border-radius: 15px;
    background: rgba(5,10,24,.55);
}
.competitive-filters summary { min-height: 50px; color: #86eaff; }
.competitive-filters summary::after { margin-left: auto; content: "+"; font-size: 1.25rem; }
.competitive-filters[open] summary::after { content: "−"; }
.competitive-filter-grid { gap: .75rem; margin-top: .55rem; }
.competitive-filter-grid label,
.competitive-filter-grid fieldset { font-size: .74rem; }
.competitive-status:empty { display: none; }

.competitive-podium {
    width: min(100%, 880px);
    gap: .75rem;
    margin: 1.2rem auto 1.5rem;
}
.competitive-podium-card {
    min-height: 170px;
    border-color: var(--cp-line);
    background: linear-gradient(150deg, rgba(13,20,38,.96), rgba(5,10,24,.92));
    box-shadow: 0 12px 30px rgba(0,0,0,.18);
}
.competitive-podium-card.is-first {
    min-height: 210px;
    border-color: rgba(224,191,97,.62);
    background:
        radial-gradient(circle at 50% 0, rgba(224,191,97,.15), transparent 45%),
        linear-gradient(150deg, rgba(19,25,43,.98), rgba(7,11,24,.96));
}
.competitive-podium-card b { color: #ffe083; font-size: 1.1rem; }

.competitive-table-wrap {
    border-color: var(--cp-line);
    background: rgba(5,10,24,.62);
    box-shadow: inset -22px 0 22px -24px rgba(0,212,255,.75);
}
.competitive-table-wrap table { background: transparent; }
.competitive-table-wrap caption { padding: .75rem 1rem; font-size: .78rem; }
.competitive-table-wrap thead th {
    background: #0e1830;
    color: #bfefff;
}
.competitive-table-wrap th,
.competitive-table-wrap td { padding: .72rem .85rem; border-top-color: rgba(255,255,255,.065); }
.competitive-table-wrap tbody tr:nth-child(even) { background: rgba(139,92,246,.028); }
.competitive-table-wrap tbody tr:hover { background: rgba(0,212,255,.055); }
.competitive-row-actions { flex-wrap: nowrap; }
.competitive-row-actions button,
.competitive-row-actions a { min-height: 40px; padding: .45rem .65rem; font-size: .72rem; }

.competitive-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; }
.competitive-card {
    gap: .7rem .85rem;
    padding: 17px;
    border-color: var(--cp-line);
    border-radius: 15px;
    background:
        linear-gradient(150deg, rgba(12,19,36,.96), rgba(5,10,24,.93));
    box-shadow: 0 12px 28px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.025);
}
.competitive-card:hover { border-color: color-mix(in srgb, var(--cp-accent) 28%, transparent); transform: translateY(-1px); }
.competitive-card .competitive-avatar { width: 52px; height: 52px; }
.competitive-card h3 { color: #fff; font-size: 1rem; line-height: 1.2; }
.competitive-card p { margin: .15rem 0; font-size: .78rem; line-height: 1.45; }
.competitive-card-bio {
    display: -webkit-box;
    max-height: 2.8rem;
    margin: 0;
    font-size: .76rem;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.competitive-card-meta { gap: .3rem; }
.competitive-card-meta li {
    padding: .25rem .48rem;
    border-color: rgba(255,255,255,.08);
    background: rgba(255,255,255,.018);
    font-size: .68rem;
}
.competitive-card-stats { gap: .35rem; }
.competitive-card-stats span {
    min-height: 58px;
    padding: .48rem .38rem;
    border-color: rgba(255,255,255,.065);
    border-radius: 10px;
    background: rgba(255,255,255,.025);
    font-size: .65rem;
    line-height: 1.25;
}
.competitive-card-stats strong { font-size: .9rem; }
.competitive-card-actions { grid-template-columns: 1fr 1fr; gap: .45rem; }
.competitive-card-actions [data-compare-player] { grid-column: 1 / -1; }
.competitive-card-actions .competitive-button { min-height: 42px; padding: .5rem .65rem; font-size: .72rem; }

.competitive-compare-dock {
    position: sticky;
    top: 80px;
    bottom: auto;
    z-index: 10;
    display: grid;
    width: 100%;
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: .9rem;
    margin: 0;
    padding: 18px;
    border: 1px solid color-mix(in srgb, var(--cp-accent) 38%, transparent);
    border-radius: 20px;
    background:
        radial-gradient(circle at 100% 0, rgba(0,212,255,.12), transparent 35%),
        linear-gradient(155deg, rgba(13,19,39,.98), rgba(6,10,23,.98));
    box-shadow: 0 20px 52px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.045);
}
.competitive-compare-dock-copy {
    padding-bottom: .8rem;
    border-bottom: 1px solid var(--cp-line);
}
.competitive-compare-dock-copy > strong { color: #fff; font-size: 1.15rem; }
.competitive-compare-chips { display: grid; gap: .45rem; max-height: 390px; overflow-y: auto; }
.competitive-compare-chip {
    width: 100%;
    min-height: 48px;
    padding: .2rem .25rem .2rem .45rem;
    border-color: var(--cp-line);
    border-radius: 13px;
    background: rgba(5,10,24,.65);
}
.competitive-compare-chip > span { max-width: none; flex: 1; }
.competitive-compare-chip button {
    width: 44px;
    min-width: 44px;
    height: 44px;
    background: transparent;
    color: #c9d8e9;
}
.competitive-compare-actions { grid-template-columns: 1fr; }
.competitive-compare-actions .competitive-button { width: 100%; }
.competitive-compare-actions [data-open-compare] { order: -1; }

.competitive-dialog {
    width: min(1240px, calc(100% - 32px));
    max-height: min(90vh, 900px);
    padding: clamp(22px, 3vw, 34px);
    border-color: color-mix(in srgb, var(--cp-accent) 32%, transparent);
    border-radius: 22px;
    background:
        radial-gradient(circle at 50% 0, rgba(0,212,255,.08), transparent 28%),
        linear-gradient(150deg, rgba(14,20,38,.99), rgba(5,10,24,.99));
    box-shadow: 0 30px 90px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.05);
}
.competitive-dialog h2 { color: #fff; font-size: clamp(1.45rem,2.5vw,2rem); }
.competitive-dialog-description { font-size: .85rem; }
.competitive-versus-head { gap: clamp(.75rem,3vw,2rem); }
.competitive-versus-player {
    min-height: 190px;
    border-color: var(--cp-line);
    border-radius: 18px;
    background:
        radial-gradient(circle at 50% 18%, rgba(0,212,255,.1), transparent 38%),
        rgba(5,10,24,.7);
}
.competitive-versus-player strong { color:#fff; font-size:1.15rem; }
.competitive-versus-head > b {
    width: 64px;
    height: 64px;
    border: 1px solid rgba(75,229,255,.72);
    background: linear-gradient(135deg,#00aef0,#7b2cbf);
    color: #fff;
    box-shadow: 0 10px 30px rgba(0,174,240,.25);
}
.competitive-versus-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
.competitive-versus-metrics article {
    min-height: 78px;
    border-color: var(--cp-line);
    background: rgba(5,10,24,.62);
}
.competitive-versus-metrics h3 { color:#9db1c9; font-size:.78rem; }
.competitive-versus-metrics span { color:#fff; }
.competitive-matrix-wrap {
    border-color: var(--cp-line);
    background: rgba(5,10,24,.76);
    box-shadow: inset -28px 0 24px -25px rgba(0,212,255,.9);
}
.competitive-matrix caption { font-size:.78rem; }
.competitive-matrix th,
.competitive-matrix td {
    min-width: 164px;
    padding: .8rem .9rem;
    border-color: rgba(255,255,255,.065);
    background: rgba(5,10,24,.84);
}
.competitive-matrix thead th {
    height: 96px;
    background: #0e1931;
    box-shadow: inset 0 -1px rgba(0,212,255,.12);
}
.competitive-matrix th:first-child {
    min-width: 142px;
    max-width: 142px;
    background: #0d1b32;
    color: #bfefff;
}
.competitive-matrix thead th:first-child { background:#10213d; }
.competitive-matrix tbody tr:nth-child(even) :is(th,td) { background: color-mix(in srgb, var(--cp-accent-2) 4%, #050a18); }
.competitive-matrix tbody tr:hover :is(th,td) { background: color-mix(in srgb, var(--cp-accent) 7%, #050a18); }
.competitive-matrix-player strong { color:#fff; font-size:.78rem; line-height:1.25; }
.competitive-matrix tbody td { color:#fff; font-size:1rem; }

.competitive-hall { border-color: color-mix(in srgb, var(--cp-accent-2) 20%, var(--cp-line)); }
.competitive-methodology {
    border-color: var(--cp-line);
    background: rgba(5,10,24,.62);
}

@media (max-width: 1180px) {
    .competitive-workspace { grid-template-columns: 1fr; }
    .competitive-workspace .competitive-explorer,
    .competitive-workspace .competitive-profile,
    .competitive-workspace .competitive-compare-dock { grid-column: 1; grid-row: auto; }
    .competitive-workspace .competitive-compare-dock {
        position: relative;
        top: auto;
        grid-template-columns: minmax(190px,.7fr) minmax(0,1.6fr) auto;
    }
    .competitive-compare-chips { display:flex; max-height:152px; }
    .competitive-compare-chip { width:auto; }
    .competitive-compare-actions { grid-template-columns:repeat(3,auto); }
    .competitive-compare-actions [data-open-compare] { order:initial; }
}

@media (max-width: 900px) {
    .competitive-hero { grid-template-columns: minmax(0,1.2fr) minmax(270px,.8fr); padding:34px; }
    .competitive-cards { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .competitive-overview,
    .competitive-personal { grid-template-columns:1fr; }
    .competitive-kpis { grid-template-columns:repeat(4,minmax(0,1fr)); }
}

@media (max-width: 800px) {
    .competitive-page {
        width: calc(100% - 16px);
        padding: 14px 0 92px;
        font-size: .95rem;
    }
    .competitive-hero {
        min-height: 0;
        grid-template-columns:1fr;
        gap:18px;
        padding:26px 20px 20px;
        border-radius:22px;
    }
    .competitive-hero h1 { font-size:clamp(2rem,10vw,2.7rem); line-height:1; }
    .competitive-hero-actions { display:grid; grid-template-columns:1fr 1fr; width:100%; }
    .competitive-hero-actions .is-primary { grid-column:1 / -1; }
    .competitive-hero-console { padding:18px; border-radius:17px; }
    .competitive-hero-console-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .competitive-hero-console-grid span { min-height:64px; flex-direction:column; align-items:flex-start; gap:.35rem; }
    .competitive-tabs {
        position:sticky;
        top:4px;
        flex-wrap:nowrap;
        margin:10px 0 14px;
        padding:5px;
        border-radius:13px;
    }
    .competitive-tabs a {
        min-width:132px;
        min-height:42px;
        border:0;
        font-size:.74rem;
    }
    .competitive-overview { grid-template-columns:1fr; }
    .competitive-overview-lead { min-height:0; }
    .competitive-lead,
    .competitive-panel,
    .competitive-section { padding:19px; border-radius:18px; }
    .competitive-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .competitive-kpis div { min-height:94px; }
    .competitive-section { grid-template-columns:1fr; }
    .competitive-shortcut-links { grid-template-columns:1fr; }
    .competitive-snapshot > header { grid-template-columns:1fr; }
    .competitive-snapshot .competitive-row-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
    .competitive-metrics,
    .competitive-category-nav { grid-template-columns:repeat(4,minmax(120px,1fr)); overflow-x:auto; }
    .competitive-search-row { grid-template-columns:1fr 1fr; }
    .competitive-search-row > label,
    .competitive-search-row > input { grid-column:1 / -1; }
    .competitive-filter-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .competitive-cards { grid-template-columns:1fr; }
    .competitive-card { padding:15px; }
    .competitive-workspace .competitive-compare-dock { display:grid; grid-template-columns:1fr; }
    .competitive-compare-chips { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); max-height:210px; }
    .competitive-compare-chip { width:100%; }
    .competitive-compare-actions { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .competitive-dialog { width:calc(100% - 12px); max-height:calc(100vh - 12px); padding:16px; }
    .competitive-versus-metrics { grid-template-columns:1fr; }
    .competitive-matrix th,
    .competitive-matrix td { min-width:142px; padding:.7rem .6rem; }
    .competitive-matrix th:first-child { min-width:108px; max-width:108px; }

    .competitive-ranking-table,
    .competitive-hall-table { border:0; background:transparent; overflow:visible; box-shadow:none; }
    .competitive-ranking-table table,
    .competitive-hall-table table { min-width:0; border-spacing:0 .55rem; background:transparent; }
    .competitive-ranking-table tbody,
    .competitive-ranking-table tr,
    .competitive-hall-table tbody,
    .competitive-hall-table tr { display:block; }
    .competitive-ranking-table tr,
    .competitive-hall-table tr {
        display:grid;
        grid-template-columns:52px repeat(3,minmax(0,1fr));
        gap:.35rem;
        margin-bottom:.55rem;
        padding:.65rem;
        border:1px solid var(--cp-line);
        border-radius:13px;
        background:linear-gradient(150deg,rgba(12,19,36,.96),rgba(5,10,24,.93));
    }
    .competitive-ranking-table th,
    .competitive-ranking-table td,
    .competitive-hall-table th,
    .competitive-hall-table td {
        min-height:44px;
        padding:.4rem;
        border:0;
        border-radius:8px;
        background:rgba(255,255,255,.025);
        font-size:.76rem;
        line-height:1.35;
    }
    .competitive-ranking-table th[scope="row"],
    .competitive-hall-table th[scope="row"] {
        grid-column:1;
        min-height:44px;
        background:rgba(0,212,255,.08);
    }
    .competitive-ranking-table .competitive-player-cell,
    .competitive-hall-table .competitive-entity-cell { grid-column:2 / -1; }
    .competitive-ranking-table .competitive-actions-cell {
        grid-column:1 / -1;
        padding:0;
        background:transparent;
    }
    .competitive-ranking-table .competitive-row-actions { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .competitive-ranking-table .competitive-row-actions [data-compare-player] { grid-column:auto; }
    .competitive-hall-table td::before,
    .competitive-ranking-table td::before { font-size:.6rem; }
}

@media (max-width: 520px) {
    .competitive-hero-actions { grid-template-columns:1fr; }
    .competitive-hero-actions .is-primary { grid-column:auto; }
    .competitive-hero-console-grid { grid-template-columns:1fr; }
    .competitive-hero-console-grid span { min-height:46px; flex-direction:row; align-items:center; }
    .competitive-filter-grid { grid-template-columns:1fr; }
    .competitive-compare-chips { grid-template-columns:1fr; }
    .competitive-compare-actions { grid-template-columns:1fr; }
    .competitive-card-stats { grid-template-columns:repeat(4,minmax(0,1fr)); }
    .competitive-card-stats span { padding:.42rem .25rem; font-size:.58rem; }
    .competitive-card-stats strong { font-size:.82rem; }
    .competitive-category-nav { grid-template-columns:repeat(4,minmax(118px,1fr)); }
    .competitive-podium { grid-template-columns:1fr; }
    .competitive-podium-card,
    .competitive-podium-card.is-first { min-height:92px; flex-direction:row; justify-content:flex-start; padding:.75rem; text-align:left; }
    .competitive-podium-card:nth-child(2) { grid-row:1; }
    .competitive-podium-card .competitive-avatar { width:46px; height:46px; }
    .competitive-versus-head { grid-template-columns:minmax(0,1fr) 44px minmax(0,1fr); }
    .competitive-versus-head > b { width:44px; height:44px; }
    .competitive-versus-player { min-height:140px; padding:.7rem .35rem; }
    .competitive-versus-player .competitive-avatar { width:54px; height:54px; }
}

@media (max-width: 350px) {
    .competitive-page { width:calc(100% - 12px); }
    .competitive-hero { padding:22px 16px 16px; }
    .competitive-hero h1 { font-size:2rem; }
    .competitive-tabs a { min-width:118px; padding:.5rem .6rem; }
    .competitive-kpis { grid-template-columns:1fr 1fr; }
    .competitive-metrics { grid-template-columns:repeat(4,minmax(112px,1fr)); }
    .competitive-ranking-table tr,
    .competitive-hall-table tr { grid-template-columns:46px repeat(3,minmax(0,1fr)); padding:.5rem; }
    .competitive-ranking-table .competitive-row-actions { gap:.25rem; }
    .competitive-ranking-table .competitive-row-actions :is(button,a) { padding:.35rem .2rem; font-size:.62rem; }
    .competitive-versus-head { grid-template-columns:1fr; }
    .competitive-versus-head > b { justify-self:center; }
}



/* Visual review pass 2: mobile density, control clarity and compare centering. */
.competitive-dialog {
    inset: 0;
    margin: auto;
}
.competitive-tabs a,
.competitive-row-actions button,
.competitive-row-actions a,
.competitive-card-actions .competitive-button,
.competitive-snapshot .competitive-row-actions :is(button, a) {
    min-height: 44px;
}
.competitive-workspace .competitive-compare-dock .competitive-compare-actions {
    grid-template-columns: 1fr;
}
.competitive-workspace .competitive-compare-dock .competitive-compare-actions [data-open-compare] {
    order: -1;
}

@media (max-width: 1180px) {
    .competitive-workspace .competitive-compare-dock .competitive-compare-actions {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .competitive-workspace .competitive-compare-dock .competitive-compare-actions [data-open-compare] {
        order: initial;
    }
}

@media (max-width: 800px) {
    .competitive-hero-actions {
        grid-template-columns: 1fr 1fr;
    }
    .competitive-hero-actions .is-primary {
        grid-column: 1 / -1;
    }
    .competitive-hero-console {
        gap: .75rem;
        padding: 14px;
    }
    .competitive-hero-console > p {
        display: none;
    }
    .competitive-hero-console-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: .35rem;
    }
    .competitive-hero-console-grid span {
        min-height: 66px;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: .25rem;
        padding: .45rem;
        font-size: .65rem;
        line-height: 1.25;
    }
    .competitive-hero-console-grid b {
        width: 26px;
        height: 26px;
        border-radius: 8px;
        font-size: .62rem;
    }

    .competitive-hall-table {
        position: relative;
        max-width: 100%;
        border: 1px solid var(--cp-line);
        border-radius: 13px;
        background: rgba(5, 10, 24, .7);
        box-shadow: inset -24px 0 22px -24px rgba(0, 212, 255, .9);
        overflow-x: auto;
        overflow-y: visible;
    }
    .competitive-hall-table table {
        display: table;
        width: 100%;
        min-width: 760px;
        border-collapse: separate;
        border-spacing: 0;
    }
    .competitive-hall-table caption {
        display: table-caption;
        padding: .7rem .8rem;
    }
    .competitive-hall-table thead {
        position: static;
        display: table-header-group;
        width: auto;
        height: auto;
        margin: 0;
        clip: auto;
        clip-path: none;
        white-space: normal;
        overflow: visible;
    }
    .competitive-hall-table tbody { display: table-row-group; }
    .competitive-hall-table tr {
        display: table-row;
        margin: 0;
        padding: 0;
        border: 0;
        background: transparent;
    }
    .competitive-hall-table th,
    .competitive-hall-table td {
        display: table-cell;
        min-height: 0;
        padding: .7rem .75rem;
        border: 0;
        border-top: 1px solid rgba(255, 255, 255, .065);
        border-radius: 0;
        background: rgba(5, 10, 24, .86);
        font-size: .72rem;
        line-height: 1.35;
        white-space: nowrap;
    }
    .competitive-hall-table thead th {
        position: sticky;
        top: 0;
        z-index: 3;
        background: #0e1931;
    }
    .competitive-hall-table th:first-child {
        position: sticky;
        left: 0;
        z-index: 4;
        width: 52px;
        min-width: 52px;
        background: #0d1b32;
        color: #bfefff;
    }
    .competitive-hall-table thead th:first-child { z-index: 5; background: #10213d; }
    .competitive-hall-table td::before { content: none; }
    .competitive-hall-table .competitive-entity-cell {
        position: sticky;
        left: 52px;
        z-index: 2;
        min-width: 190px;
        background: #081126;
        box-shadow: 12px 0 18px -18px rgba(0, 212, 255, .9);
    }
    .competitive-hall-table tbody tr:nth-child(even) td {
        background: color-mix(in srgb, var(--cp-accent-2) 4%, #050a18);
    }
    .competitive-hall-table tbody tr:nth-child(even) .competitive-entity-cell {
        background: color-mix(in srgb, var(--cp-accent-2) 5%, #081126);
    }

    .competitive-ranking-table {
        position: relative;
        max-width: 100%;
        border: 1px solid var(--cp-line);
        border-radius: 13px;
        background: rgba(5, 10, 24, .7);
        box-shadow: inset -24px 0 22px -24px rgba(0, 212, 255, .9);
        overflow-x: auto;
        overflow-y: visible;
    }
    .competitive-ranking-table table {
        display: table;
        width: 100%;
        min-width: 980px;
        border-collapse: separate;
        border-spacing: 0;
    }
    .competitive-ranking-table caption { display: table-caption; padding: .7rem .8rem; }
    .competitive-ranking-table thead {
        position: static;
        display: table-header-group;
        width: auto;
        height: auto;
        margin: 0;
        clip: auto;
        clip-path: none;
        white-space: normal;
        overflow: visible;
    }
    .competitive-ranking-table tbody { display: table-row-group; }
    .competitive-ranking-table tr {
        display: table-row;
        margin: 0;
        padding: 0;
        border: 0;
        background: transparent;
    }
    .competitive-ranking-table th,
    .competitive-ranking-table td {
        display: table-cell;
        min-height: 0;
        padding: .65rem .7rem;
        border: 0;
        border-top: 1px solid rgba(255, 255, 255, .065);
        border-radius: 0;
        background: rgba(5, 10, 24, .86);
        font-size: .7rem;
        line-height: 1.35;
        white-space: nowrap;
    }
    .competitive-ranking-table thead th {
        position: sticky;
        top: 0;
        z-index: 3;
        background: #0e1931;
    }
    .competitive-ranking-table th:first-child {
        position: sticky;
        left: 0;
        z-index: 4;
        width: 48px;
        min-width: 48px;
        background: #0d1b32;
        color: #bfefff;
    }
    .competitive-ranking-table thead th:first-child { z-index: 5; background: #10213d; }
    .competitive-ranking-table td::before { content: none; }
    .competitive-ranking-table .competitive-player-cell {
        position: sticky;
        left: 48px;
        z-index: 2;
        min-width: 205px;
        background: #081126;
        box-shadow: 12px 0 18px -18px rgba(0, 212, 255, .9);
    }
    .competitive-ranking-table tbody tr:nth-child(even) td {
        background: color-mix(in srgb, var(--cp-accent-2) 4%, #050a18);
    }
    .competitive-ranking-table tbody tr:nth-child(even) .competitive-player-cell {
        background: color-mix(in srgb, var(--cp-accent-2) 5%, #081126);
    }
    .competitive-ranking-table .competitive-actions-cell { padding: .45rem .6rem; background: rgba(5, 10, 24, .86); }
    .competitive-ranking-table .competitive-row-actions {
        display: flex;
        flex-wrap: nowrap;
        gap: .3rem;
    }
    .competitive-ranking-table .competitive-row-actions :is(button, a) {
        min-height: 44px;
        padding: .4rem .55rem;
        font-size: .65rem;
    }

    .competitive-workspace .competitive-compare-dock .competitive-compare-actions {
        grid-template-columns: 1fr;
    }
    .competitive-workspace .competitive-compare-dock .competitive-compare-actions [data-open-compare] {
        order: -1;
    }
}

@media (max-width: 520px) {
    .competitive-hero-actions {
        grid-template-columns: 1fr 1fr;
    }
    .competitive-hero-actions .is-primary {
        grid-column: 1 / -1;
    }
    .competitive-hero-console-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 350px) {
    .competitive-hero-actions {
        grid-template-columns: 1fr;
    }
    .competitive-hero-actions .is-primary {
        grid-column: auto;
    }
    .competitive-hero-console-grid {
        grid-template-columns: 1fr;
    }
    .competitive-hero-console-grid span {
        min-height: 42px;
        flex-direction: row;
        align-items: center;
    }
}



/* Keep six-to-eight selected players compact enough for immediate tray actions. */
@media (min-width: 1181px) {
    .competitive-workspace .competitive-compare-dock .competitive-compare-chips {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-height: 230px;
    }
    .competitive-workspace .competitive-compare-dock .competitive-compare-chip > span {
        max-width: 46px;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }
}



.competitive-entity-cell a {
    min-width: 44px;
}

/* Responsive content flow: normal components never rely on horizontal scroll. */
.competitive-tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    overflow: visible;
}
.competitive-tabs a {
    min-width: 0;
    width: 100%;
    flex: none;
    text-align: center;
    white-space: normal;
}

.competitive-ranking-table,
.competitive-hall-table {
    max-width: 100%;
    overflow: visible;
}
.competitive-ranking-table table,
.competitive-hall-table table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
}
.competitive-ranking-table th,
.competitive-ranking-table td,
.competitive-hall-table th,
.competitive-hall-table td {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
}
.competitive-ranking-table th:nth-child(1) { width: 6%; }
.competitive-ranking-table th:nth-child(2) { width: 28%; }
.competitive-ranking-table th:nth-child(3) { width: 10%; }
.competitive-ranking-table th:nth-child(4),
.competitive-ranking-table th:nth-child(5) { width: 8%; }
.competitive-ranking-table th:nth-child(6),
.competitive-ranking-table th:nth-child(7) { width: 11%; }
.competitive-ranking-table th:nth-child(8) { width: 18%; }
.competitive-table-player strong,
.competitive-table-player small { overflow-wrap: anywhere; }
.competitive-row-actions,
.competitive-card-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
    gap: .45rem;
}
.competitive-row-actions [data-compare-player],
.competitive-card-actions [data-compare-player] {
    grid-column: auto;
    min-width: 0;
    white-space: normal;
}
.competitive-card-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .35rem;
}
.competitive-card-actions [data-compare-player],
.competitive-card-actions .competitive-card-action {
    box-sizing: border-box;
    min-width: 0;
    min-height: 44px;
    padding: .45rem .38rem;
    border-radius: 10px;
    font-size: .68rem;
    line-height: 1.12;
    overflow-wrap: anywhere;
}
.competitive-card-actions .competitive-card-action {
    border-color: rgba(255, 255, 255, .13);
    background: rgba(255, 255, 255, .045);
}
.competitive-action-menu {
    position: relative;
    min-width: 0;
}
.competitive-action-menu-toggle {
    box-sizing: border-box;
    width: 100%;
    min-width: 76px;
    min-height: 44px;
    padding: .55rem .7rem;
    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 999px;
    background: rgba(255, 255, 255, .045);
    color: var(--cp-text);
    font: inherit;
    font-size: .72rem;
    font-weight: 850;
    cursor: pointer;
}
.competitive-action-menu-toggle::after {
    margin-left: .35rem;
    content: "▾";
}
.competitive-action-menu-toggle[aria-expanded="true"]::after { content: "▴"; }
.competitive-action-menu-popover {
    position: absolute;
    right: 0;
    bottom: calc(100% + .4rem);
    z-index: 80;
    display: grid;
    width: max-content;
    min-width: 180px;
    padding: .35rem;
    border: 1px solid var(--cp-line-strong);
    border-radius: 12px;
    background: #101a31;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .55);
}
.competitive-action-menu-popover[hidden] { display: none; }
.competitive-action-menu-popover :is(button, a) {
    display: flex;
    min-height: 44px;
    align-items: center;
    padding: .65rem .75rem;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--cp-text);
    font: inherit;
    font-size: .78rem;
    font-weight: 750;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}
.competitive-action-menu-popover :is(button, a):hover,
.competitive-action-menu-popover :is(button, a):focus-visible {
    background: rgba(0, 212, 255, .1);
    color: #fff;
}

.competitive-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.competitive-card { min-width: 0; }
.competitive-compare-tray-toggle { display: none; }
.competitive-compare-dock-body {
    display: grid;
    grid-template-columns: minmax(190px, .7fr) minmax(0, 1.5fr) minmax(260px, auto);
    align-items: center;
    gap: .9rem;
    min-width: 0;
}
.competitive-workspace .competitive-compare-dock-copy {
    padding: 0;
    border: 0;
}
.competitive-workspace .competitive-compare-chips {
    display: flex;
    max-height: 150px;
    flex-wrap: wrap;
}
.competitive-workspace .competitive-compare-chip { width: auto; }
.competitive-workspace .competitive-compare-dock .competitive-compare-actions {
    grid-template-columns: repeat(3, auto);
    min-width: auto;
}
.competitive-workspace .competitive-compare-dock .competitive-compare-actions [data-open-compare] { order: initial; }
.competitive-workspace .competitive-compare-dock-body:has(> .competitive-compare-chips:empty) {
    grid-template-columns: minmax(190px, 1fr) minmax(260px, auto);
}
.competitive-compare-chips:empty { display: none; }
.competitive-matrix-wrap {
    touch-action: pan-x pan-y;
    scrollbar-gutter: stable;
}

@media (max-width: 1380px) {
    .competitive-workspace { grid-template-columns: minmax(0, 1fr); }
    .competitive-workspace .competitive-compare-dock {
        position: sticky;
        top: 80px;
        grid-column: 1;
        grid-row: 1;
    }
    .competitive-workspace .competitive-explorer { grid-column: 1; grid-row: 2; }
    .competitive-workspace .competitive-profile { grid-column: 1; grid-row: 3; }
    .competitive-workspace .competitive-compare-dock-body {
        grid-template-columns: minmax(190px, .7fr) minmax(0, 1.5fr) minmax(260px, auto);
        align-items: center;
    }
    .competitive-workspace .competitive-compare-dock-copy {
        padding: 0;
        border: 0;
    }
    .competitive-workspace .competitive-compare-chips {
        display: flex;
        max-height: 150px;
        flex-wrap: wrap;
    }
    .competitive-workspace .competitive-compare-chip { width: auto; }
    .competitive-workspace .competitive-compare-actions {
        grid-template-columns: 1fr;
        min-width: 260px;
    }
    .competitive-workspace .competitive-compare-dock-body:has(> .competitive-compare-chips:empty) {
        grid-template-columns: minmax(190px, 1fr) minmax(260px, auto);
    }
}

@media (max-width: 1100px) {
    .competitive-ranking-table {
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }
    .competitive-ranking-table table,
    .competitive-ranking-table tbody { display: block; }
    .competitive-ranking-table caption,
    .competitive-ranking-table thead {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        padding: 0;
        clip: rect(0 0 0 0);
        clip-path: inset(50%);
        white-space: nowrap;
        overflow: hidden;
    }
    .competitive-ranking-table tr {
        display: grid;
        grid-template-columns: 64px minmax(180px, 1.4fr) repeat(4, minmax(72px, .7fr));
        grid-template-areas:
            "rank player player player player role"
            "kd wins tournaments points actions actions";
        gap: .45rem;
        margin-bottom: .75rem;
        padding: .8rem;
        border: 1px solid var(--cp-line);
        border-radius: 14px;
        background: linear-gradient(150deg, rgba(12, 19, 36, .96), rgba(5, 10, 24, .93));
    }
    .competitive-ranking-table th,
    .competitive-ranking-table td {
        position: static;
        display: flex;
        min-height: 54px;
        flex-direction: column;
        justify-content: center;
        gap: .2rem;
        width: auto;
        padding: .55rem;
        border: 1px solid rgba(255, 255, 255, .055);
        border-radius: 9px;
        background: rgba(255, 255, 255, .025);
        box-shadow: none;
        font-size: .76rem;
    }
    .competitive-ranking-table td::before {
        color: var(--cp-muted);
        content: attr(data-label);
        font-size: .62rem;
        font-weight: 800;
        letter-spacing: .04em;
        text-transform: uppercase;
    }
    .competitive-ranking-table th[scope="row"] { grid-area: rank; background: rgba(0, 212, 255, .08); }
    .competitive-ranking-table .competitive-player-cell {
        grid-area: player;
        min-width: 0;
    }
    .competitive-ranking-table td:nth-child(3) { grid-area: role; }
    .competitive-ranking-table td:nth-child(4) { grid-area: kd; }
    .competitive-ranking-table td:nth-child(5) { grid-area: wins; }
    .competitive-ranking-table td:nth-child(6) { grid-area: tournaments; }
    .competitive-ranking-table td:nth-child(7) { grid-area: points; }
    .competitive-ranking-table .competitive-actions-cell { grid-area: actions; padding: .25rem; }
    .competitive-ranking-table .competitive-actions-cell::before { content: none; }
    .competitive-ranking-table .competitive-row-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
}

@media (max-width: 1050px) {
    .competitive-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
    .competitive-workspace .competitive-compare-dock-body { grid-template-columns: 1fr; }
    .competitive-workspace .competitive-compare-chips { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .competitive-workspace .competitive-compare-chip { width: 100%; }
    .competitive-workspace .competitive-compare-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); min-width: 0; }

    .competitive-hall-table {
        border: 0;
        background: transparent;
        box-shadow: none;
    }
    .competitive-hall-table table,
    .competitive-hall-table tbody { display: block; }
    .competitive-hall-table caption,
    .competitive-hall-table thead {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        padding: 0;
        clip: rect(0 0 0 0);
        clip-path: inset(50%);
        overflow: hidden;
    }
    .competitive-hall-table tr {
        display: grid;
        grid-template-columns: 64px repeat(2, minmax(0, 1fr));
        gap: .45rem;
        margin-bottom: .7rem;
        padding: .75rem;
        border: 1px solid var(--cp-line);
        border-radius: 14px;
        background: linear-gradient(150deg, rgba(12, 19, 36, .96), rgba(5, 10, 24, .93));
    }
    .competitive-hall-table th,
    .competitive-hall-table td {
        position: static;
        display: flex;
        min-height: 52px;
        flex-direction: column;
        justify-content: center;
        width: auto;
        padding: .55rem;
        border: 1px solid rgba(255, 255, 255, .055);
        border-radius: 9px;
        background: rgba(255, 255, 255, .025);
        box-shadow: none;
        white-space: normal;
    }
    .competitive-hall-table td::before {
        color: var(--cp-muted);
        content: attr(data-label);
        font-size: .62rem;
        font-weight: 800;
        text-transform: uppercase;
    }
    .competitive-hall-table th[scope="row"] { grid-row: span 2; background: rgba(0, 212, 255, .08); }
    .competitive-hall-table .competitive-entity-cell {
        grid-column: 2 / -1;
        min-width: 0;
    }
}

@media (max-width: 800px) {
    .competitive-ranking-table tr {
        grid-template-columns: 56px repeat(2, minmax(0, 1fr));
        grid-template-areas:
            "rank player player"
            "role role role"
            "kd wins tournaments"
            "points points points"
            "actions actions actions";
    }
}

@media (max-width: 700px) {
    .competitive-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .competitive-tabs a { min-height: 48px; }
    .competitive-metrics,
    .competitive-category-nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        overflow: visible;
    }
    .competitive-search-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .competitive-search-row > label,
    .competitive-search-row > input { grid-column: 1 / -1; }
    .competitive-filter-grid { grid-template-columns: 1fr; }
    .competitive-cards { grid-template-columns: 1fr; }
    .competitive-card { min-width: 0; }

    .competitive-workspace .competitive-compare-dock { position: relative; top: auto; padding: .7rem; }
    .competitive-workspace .competitive-compare-dock .competitive-compare-actions { grid-template-columns: 1fr; }
    .competitive-compare-tray-toggle {
        display: flex;
        width: 100%;
        min-height: 52px;
        align-items: center;
        justify-content: space-between;
        gap: .75rem;
        padding: .7rem .8rem;
        border: 1px solid var(--cp-line-strong);
        border-radius: 12px;
        background: rgba(0, 212, 255, .07);
        color: var(--cp-text);
        font: inherit;
        font-weight: 800;
        cursor: pointer;
    }
    .competitive-compare-tray-toggle strong { color: #fff; }
    .competitive-compare-dock[data-collapsed="true"] .competitive-compare-dock-body { display: none; }
    .competitive-workspace .competitive-compare-dock-body { margin-top: .7rem; }
    .competitive-workspace .competitive-compare-actions { grid-template-columns: 1fr; }
    .competitive-workspace .competitive-compare-chips { grid-template-columns: 1fr; }
}

@media (max-width: 430px) {
    .competitive-card-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .competitive-ranking-table tr { padding: .6rem; }
    .competitive-ranking-table th,
    .competitive-ranking-table td { min-height: 48px; padding: .45rem; }
    .competitive-row-actions { grid-template-columns: minmax(0, 1fr) 88px; }
    .competitive-card-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .competitive-action-menu-popover { right: 0; min-width: 170px; }
}

/* The shared shell clips overflow; Competitive proves containment instead. */
body:has(#competitiveHub) { overflow-x: visible; }

/* Player cards: give every public value and every empty state a clear context. */
.competitive-card {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: clamp(1rem, 2vw, 1.3rem);
    border-radius: 18px;
}
.competitive-card-heading {
    display: flex;
    align-items: flex-start;
    gap: .85rem;
    min-width: 0;
}
.competitive-card-heading > div { min-width: 0; flex: 1; }
.competitive-card-heading .competitive-avatar { flex: 0 0 52px; }
.competitive-card h3 { font-size: 1.08rem; line-height: 1.35; }
.competitive-card h4 {
    margin: 0 0 .5rem;
    color: #bfefff;
    font-size: .72rem;
    font-weight: 750;
    letter-spacing: .045em;
    line-height: 1.4;
    text-transform: uppercase;
}
.competitive-card-epic { margin: .4rem 0 0; }
.competitive-card-epic dt { color: var(--cp-muted); font-size: .7rem; }
.competitive-card-epic dd { margin: .12rem 0 0; color: var(--cp-text); font-size: .84rem; overflow-wrap: anywhere; }
.competitive-card-epic .is-unavailable { color: var(--cp-muted); font-size: .78rem; }
.competitive-card-preferences {
    padding: .8rem;
    border: 1px solid rgba(0, 212, 255, .12);
    border-radius: 12px;
    background: rgba(0, 212, 255, .025);
}
.competitive-card-attributes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; margin: 0; }
.competitive-card-attributes div { min-width: 0; }
.competitive-card-attributes dt { color: var(--cp-muted); font-size: .72rem; }
.competitive-card-attributes dd { margin: .15rem 0 0; color: var(--cp-text); font-size: .86rem; font-weight: 650; overflow-wrap: anywhere; }
.competitive-card .competitive-card-empty { margin: 0; color: var(--cp-muted); font-size: .82rem; line-height: 1.55; }
.competitive-card .competitive-card-bio {
    display: block;
    max-height: none;
    margin: 0;
    color: var(--cp-text);
    font-size: .9rem;
    line-height: 1.6;
    white-space: pre-line;
    -webkit-line-clamp: unset;
    overflow: visible;
}
.competitive-card .competitive-card-bio.is-empty { color: var(--cp-muted); font-size: .82rem; }
.competitive-card-meta { gap: .45rem; }
.competitive-card-meta li { padding: .35rem .55rem; color: var(--cp-text); font-size: .72rem; line-height: 1.5; overflow-wrap: anywhere; }
.competitive-card-meta li span { color: var(--cp-muted); }
.competitive-card-statistics { margin-top: auto; padding-top: .85rem; border-top: 1px solid var(--cp-line); }
.competitive-card-stats { gap: .45rem; margin: 0; }
.competitive-card-stats > div { min-width: 0; padding: .7rem .5rem; border: 1px solid var(--cp-line); border-radius: 10px; background: rgba(255, 255, 255, .025); }
.competitive-card-stats dt { color: var(--cp-muted); font-size: .72rem; line-height: 1.4; overflow-wrap: anywhere; }
.competitive-card-stats dd { margin: .4rem 0 0; color: var(--cp-text); font-size: 1.12rem; font-weight: 800; line-height: 1.35; overflow-wrap: anywhere; }
.competitive-card-stats dd.is-unavailable { color: var(--cp-muted); font-size: .78rem; font-weight: 400; }
.competitive-card .competitive-card-stats-empty { padding: .85rem; border: 1px dashed var(--cp-line-strong); border-radius: 10px; }
.competitive-card-actions { gap: .5rem; }
.competitive-card-actions [data-compare-player],
.competitive-card-actions .competitive-card-action { font-size: .75rem; line-height: 1.35; padding: .6rem .4rem; }
@media (max-width: 430px) {
    .competitive-card-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .competitive-card-actions [data-compare-player] { grid-column: 1 / -1; }
}

/* Usability audit remediation: readable operations and one unobstructed scroll surface. */
html:has(#competitiveHub) {
    scroll-behavior: auto;
    scroll-padding-block: 104px 112px;
}
#competitiveHub :where(a, button, input, select, summary, [tabindex]) {
    scroll-margin-block: 104px 112px;
}
.competitive-tabs,
.competitive-workspace .competitive-compare-dock {
    position: relative;
    top: auto;
    bottom: auto;
}
.competitive-page .competitive-tabs a { font-size: .9375rem; line-height: 1.4; }
.competitive-page :is(button, input, select, label, legend, summary) {
    font-size: .875rem;
    line-height: 1.45;
}
.competitive-page :is(input, select, summary) { min-height: 44px; }
.competitive-page :is(.competitive-button, .competitive-row-actions button, .competitive-row-actions a, .competitive-card-actions button, .competitive-card-actions a, .competitive-action-menu-popover button, .competitive-action-menu-popover a) {
    min-height: 44px;
    font-size: .875rem;
    line-height: 1.4;
    text-shadow: none;
}
.competitive-page :is(.competitive-button.is-primary, .competitive-card-actions [data-compare-player]) {
    background: #8beaff;
    border-color: #8beaff;
    color: #082032;
    text-shadow: none;
    box-shadow: none;
}
.competitive-page :is(.competitive-button.is-primary, .competitive-card-actions [data-compare-player]):hover {
    background: #b5f2ff;
    border-color: #b5f2ff;
    color: #082032;
}
.competitive-page .competitive-card-actions [data-compare-player][aria-pressed="true"] {
    background: #17425a;
    color: #fff;
    border-color: #8beaff;
}
.competitive-page .competitive-button.is-secondary,
.competitive-page .competitive-card-action { color: #f7fbff; }
.competitive-page :is(.competitive-kicker, .competitive-eyebrow, .competitive-signal, .competitive-hero-console-grid span, .competitive-hero-console-grid b, .competitive-hero-console > p) {
    font-size: .875rem;
    line-height: 1.45;
}
.competitive-page :is(.competitive-kpis dt, .competitive-table-player small, .competitive-card h4, .competitive-card-epic dt, .competitive-card-epic dd, .competitive-card-attributes dt, .competitive-card-attributes dd, .competitive-card-meta li, .competitive-card-meta li span, .competitive-card-stats dt, .competitive-card-stats dd.is-unavailable, .competitive-card .competitive-card-empty, .competitive-card .competitive-card-bio.is-empty, .competitive-compare-dock-copy > span, .competitive-compare-chip > span, .competitive-dialog-description, .competitive-privacy) {
    font-size: .875rem;
    line-height: 1.5;
}
.competitive-page :is(.competitive-ranking-table th, .competitive-ranking-table td, .competitive-hall-table th, .competitive-hall-table td, .competitive-hall-table td a) {
    font-size: .875rem;
    line-height: 1.45;
}
.competitive-page :is(.competitive-ranking-table td, .competitive-hall-table td)::before {
    font-size: .875rem;
    line-height: 1.4;
}
.competitive-page .competitive-table-player strong { font-size: 1rem; }
.competitive-page .competitive-podium-card span { font-size: .875rem; line-height: 1.4; }
.competitive-page .competitive-podium-card strong { font-size: 1rem; line-height: 1.4; }
.competitive-page :is(.competitive-kpis dd.is-date, .competitive-shortcut-links span, .competitive-category-nav a, .competitive-table-wrap caption) {
    font-size: .875rem;
    line-height: 1.5;
}
.competitive-page .competitive-card .competitive-card-bio:not(.is-empty) { font-size: 1rem; }
.competitive-page :is(.competitive-versus-metrics h3, .competitive-matrix th, .competitive-matrix-player strong, .competitive-matrix caption) {
    font-size: .875rem;
    line-height: 1.5;
}
.competitive-page .competitive-card-actions { gap: .6rem; }
.competitive-page .competitive-row-actions { gap: .6rem; }
.competitive-page .competitive-action-menu-toggle { min-width: 84px; }
.competitive-page .competitive-kpis dt { overflow-wrap: anywhere; }
.competitive-page .competitive-compare-chip > span { max-width: none; white-space: normal; overflow-wrap: anywhere; }
.competitive-page .competitive-compare-chips { min-width: 0; }

.competitive-hero.is-compact {
    display: block;
    min-height: 0;
    padding: 1.25rem 1.5rem;
    border-radius: 18px;
}
.competitive-hero.is-compact h1 {
    max-width: none;
    margin: .3rem 0 0;
    font-size: clamp(1.65rem, 3vw, 2.25rem);
    line-height: 1.2;
    letter-spacing: -.025em;
}
.competitive-hero.is-compact .competitive-eyebrow { margin: 0; }
.competitive-hero.is-compact::before { opacity: .4; }
.competitive-explorer-intro { margin-bottom: 1rem; }
.competitive-explorer-intro > p { margin: 0; }
.competitive-visually-hidden,
.competitive-explorer-intro .visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}
.competitive-active-filters {
    display: flex;
    flex-direction: column;
    gap: .6rem;
    align-items: stretch;
    margin: .75rem 0 1rem;
}
.competitive-active-filters:empty { display: none; }
.competitive-active-filters[hidden],
.competitive-active-filter-heading[hidden],
.competitive-filter-chips[hidden] { display: none !important; }
.competitive-active-filter-heading {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .4rem .9rem;
    margin: 0;
    font-size: .875rem;
    line-height: 1.5;
}
.competitive-filter-order { color: var(--cp-muted); }
.competitive-filter-chips { display: flex; flex-wrap: wrap; gap: .6rem; }
.competitive-active-filters button {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    min-height: 44px;
    max-width: 100%;
    padding: .55rem .8rem;
    border: 1px solid var(--cp-line-strong);
    border-radius: 10px;
    background: #132b3e;
    color: #f7fbff;
    font: inherit;
    font-size: .875rem;
    text-align: left;
    overflow-wrap: anywhere;
    cursor: pointer;
}
.competitive-active-filters button > span:first-child { min-width: 0; }
.competitive-active-filters button > span[aria-hidden="true"] { flex: 0 0 auto; font-size: 1.125rem; line-height: 1; }
.competitive-filter-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .75rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--cp-line);
}
.competitive-range-error { margin: .55rem 0 0; color: #ffced2; font-size: .875rem; }
.competitive-filter-form [aria-invalid="true"] { border: 2px solid #ff9aa5; }
.competitive-load-error { display: grid; justify-items: start; gap: .75rem; text-align: left; }
.competitive-load-error p { margin: 0; }
.competitive-data-notes { margin-top: 1.25rem; }
.competitive-data-notes dl { display: grid; gap: 1rem; margin: 1rem 0; }
.competitive-data-notes dt { color: var(--cp-text); font-weight: 750; }
.competitive-data-notes dd { margin: .35rem 0 0; font-size: 1rem; line-height: 1.65; }
.competitive-overview-note { grid-column: 1 / -1; margin: 0; color: var(--cp-muted); font-size: 1rem; line-height: 1.65; }
.competitive-hall-criteria { margin: 1.1rem 0; color: var(--cp-text); font-size: 1rem; line-height: 1.65; }
.competitive-data-notes p,
.competitive-methodology p { font-size: 1rem; line-height: 1.65; }

.competitive-workspace dialog.competitive-profile-context,
dialog.competitive-profile-context {
    position: fixed;
    inset: 16px;
    width: min(640px, calc(100% - 32px));
    height: fit-content;
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    margin: auto;
    padding: 1.5rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 1px solid var(--cp-line-strong);
    border-radius: 18px;
    background: #0c1727;
    color: var(--cp-text);
}
dialog.competitive-profile-context:not([open]) { display: none; }
dialog.competitive-profile-context::backdrop { background: rgba(0, 4, 10, .8); }
.competitive-profile-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.competitive-profile-head > div { min-width: 0; flex: 1; }
.competitive-profile-head h2 { min-width: 0; margin: 0; overflow-wrap: anywhere; }
.competitive-profile-head [data-close-profile] { flex: 0 0 auto; }
.competitive-profile-close { display: flex; width: fit-content; margin: 0 0 1rem auto; }
.competitive-profile-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1rem; }
.competitive-profile-context :is(dt, dd) { font-size: .875rem; line-height: 1.5; }

@media (max-width: 700px) {
    .competitive-hero.is-compact { padding: .625rem 1rem; }
    .competitive-page .competitive-hero.is-compact + .competitive-tabs { margin: 6px 0; }
    .competitive-page .competitive-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .competitive-page .competitive-tabs a { min-height: 48px; padding: .6rem .4rem; }
    .competitive-filter-actions > .competitive-button { flex: 1 1 120px; }
    .competitive-page .competitive-card-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .competitive-page .competitive-card-actions [data-compare-player] { grid-column: 1 / -1; }
    .competitive-profile-context .competitive-profile-actions > * { flex: 1 1 180px; }
}
@media (max-width: 430px) {
    .competitive-page .competitive-ranking-table tr { grid-template-columns: 56px repeat(2, minmax(0, 1fr)); }
    .competitive-page .competitive-hall-table tr { grid-template-columns: 44px repeat(2, minmax(0, 1fr)); }
    .competitive-page .competitive-row-actions { grid-template-columns: minmax(0, 1fr) 84px; }
    .competitive-page .competitive-ranking-table th,
    .competitive-page .competitive-ranking-table td,
    .competitive-page .competitive-hall-table th,
    .competitive-page .competitive-hall-table td { padding: .45rem; }
    dialog.competitive-profile-context { padding: 1rem; }
    .competitive-profile-head { flex-wrap: wrap; }
}

/* Competitive palette refresh: presentation only, existing layout preserved. */
.competitive-page {
    --cp-text: #f5f7ff;
    --cp-muted: #c4d0e5;
    --cp-line: #3b4965;
    --cp-line-strong: #687b9b;
    --cp-accent: #78e1ff;
    --cp-accent-2: #d0b5ff;
    --cp-section: #78e1ff;
    --cp-tint: #122c40;
    --cp-focus: #ffe093;
}
.competitive-page[data-view="rankings"] { --cp-section: #ffda89; --cp-tint: #342c23; }
.competitive-page[data-view="players"] { --cp-section: #89edc8; --cp-tint: #14352f; }
.competitive-page[data-view="hall-of-fame"] { --cp-section: #d0b5ff; --cp-tint: #2d2345; }
.competitive-page .competitive-hero {
    border-color: var(--cp-section);
    background: radial-gradient(ellipse at 95% 0, #3a285c 0, transparent 55%),
        radial-gradient(ellipse at 0 100%, #12465b 0, transparent 60%), #111a30;
    box-shadow: 0 20px 56px #0005, inset 0 1px 0 #ffffff14;
}
.competitive-page .competitive-hero h1 { line-height: 1.12; letter-spacing: -.03em; }
.competitive-page .competitive-hero p { color: #d7e1f2; font-size: 1.0625rem; line-height: 1.7; }
.competitive-page :is(.competitive-eyebrow, .competitive-kicker) { color: var(--cp-section); letter-spacing: .1em; }
.competitive-page .competitive-hero-console { background: linear-gradient(145deg, #1b2943, #182034); border-color: #6989af; }
.competitive-page .competitive-hero-console-grid span { background: #17283e; border-color: #47617b; }
.competitive-page .competitive-hero-console-grid span:nth-child(2) { background: #2a2340; border-color: #79639c; }
.competitive-page .competitive-hero-console-grid span:nth-child(3) { background: #183831; border-color: #4b8878; }
.competitive-page .competitive-hero-console-grid b { background: #8beaff; color: #102134; }
.competitive-page .competitive-hero-console-grid span:nth-child(2) b { background: #d0b5ff; }
.competitive-page .competitive-hero-console-grid span:nth-child(3) b { background: #89edc8; }
.competitive-page .competitive-tabs { background: #111c30; border-color: #485977; }
.competitive-page .competitive-tabs a:nth-child(1) { --cp-tab: #78e1ff; --cp-tab-bg: #17364a; }
.competitive-page .competitive-tabs a:nth-child(2) { --cp-tab: #ffda89; --cp-tab-bg: #3a3024; }
.competitive-page .competitive-tabs a:nth-child(3) { --cp-tab: #89edc8; --cp-tab-bg: #173a32; }
.competitive-page .competitive-tabs a:nth-child(4) { --cp-tab: #d0b5ff; --cp-tab-bg: #322647; }
.competitive-page .competitive-tabs a { color: var(--cp-tab); font-size: 1rem; }
.competitive-page .competitive-tabs a:is(:hover, [aria-current="page"]) {
    color: #fff; background: var(--cp-tab-bg);
    box-shadow: inset 0 -3px var(--cp-tab), inset 0 0 0 1px #ffffff24;
}
.competitive-overview-lead { --cp-section: #78e1ff; --cp-tint: #123248; }
.competitive-personal { --cp-section: #89edc8; --cp-tint: #15392f; }
.competitive-snapshot { --cp-section: #ffda89; --cp-tint: #342d24; }
.competitive-compare-callout { --cp-section: #d0b5ff; --cp-tint: #302547; }
.competitive-shortcuts { --cp-section: #ffbfa3; --cp-tint: #382b2c; }
.competitive-find-callout { --cp-section: #89edc8; --cp-tint: #15392f; }
.competitive-page :is(.competitive-lead, .competitive-section, .competitive-panel) {
    background: linear-gradient(125deg, var(--cp-tint), #121c30 72%);
    border-color: color-mix(in srgb, var(--cp-section) 48%, #26324b);
    box-shadow: inset 0 3px var(--cp-section), 0 14px 38px #0003;
}
.competitive-page :is(.competitive-lead, .competitive-section, .competitive-panel) h2 { line-height: 1.25; }
.competitive-page :is(.competitive-section p, .competitive-lead > p, .competitive-explorer-intro p) { color: var(--cp-muted); line-height: 1.7; }
.competitive-page .competitive-kpis { background: #152039; }
.competitive-page .competitive-kpis div:nth-child(4n+1) { --cp-stat: #78e1ff; --cp-stat-bg: #173248; }
.competitive-page .competitive-kpis div:nth-child(4n+2) { --cp-stat: #d0b5ff; --cp-stat-bg: #302646; }
.competitive-page .competitive-kpis div:nth-child(4n+3) { --cp-stat: #ffda89; --cp-stat-bg: #352e24; }
.competitive-page .competitive-kpis div:nth-child(4n+4) { --cp-stat: #89edc8; --cp-stat-bg: #16392f; }
.competitive-page .competitive-kpis div { background: var(--cp-stat-bg); border-color: color-mix(in srgb, var(--cp-stat) 40%, #26324b); }
.competitive-page .competitive-kpis dd { color: var(--cp-stat); font-variant-numeric: tabular-nums; }
.competitive-page :is(.competitive-kpis dt, .competitive-kpis dd.is-date, .competitive-privacy, .competitive-shortcut-links span, .competitive-card h4, .competitive-card-epic dt, .competitive-card-epic dd, .competitive-card-attributes dt, .competitive-card-attributes dd, .competitive-card-meta li, .competitive-card-stats dt, .competitive-card .competitive-card-empty, .competitive-card .competitive-card-bio.is-empty) { font-size: .9375rem; line-height: 1.6; }
.competitive-page :is(button, input, select, label, legend, summary, .competitive-button, .competitive-row-actions button, .competitive-row-actions a, .competitive-card-actions button, .competitive-card-actions a) { font-size: .9375rem; line-height: 1.5; }
.competitive-page :is(.competitive-button, .competitive-row-actions button, .competitive-row-actions a) { background: #253550; border-color: #7184a3; color: #f5f7ff; }
.competitive-page :is(.competitive-button.is-primary, .competitive-card-actions [data-compare-player]) { background: var(--cp-section); border-color: var(--cp-section); color: #122033; }
.competitive-page :is(.competitive-button.is-primary, .competitive-card-actions [data-compare-player]):hover { background: #edf5ff; border-color: #edf5ff; color: #122033; }
.competitive-page .competitive-button.is-secondary { background: #302747; border-color: #aa8fd4; }
.competitive-page .competitive-button.is-ghost { background: transparent; color: #bcf0ff; border-color: #628298; }
.competitive-page :is(.competitive-search-row, .competitive-filters, .competitive-methodology, .competitive-data-notes) { background: #142137; border: 1px solid #526380; border-radius: 14px; }
.competitive-page .competitive-data-notes { padding: .8rem 1rem; }
.competitive-page .competitive-filter-form :is(input, select) { background: #0d192b; border-color: #7385a4; color: #f5f7ff; }
.competitive-page .competitive-filter-form input::placeholder { color: #bbc9de; }
.competitive-page :is(.competitive-filter-grid label, .competitive-filter-grid legend) { color: #dce5f5; }
.competitive-page :is(.competitive-metrics button, .competitive-category-nav a) { color: #dce5f5; font-size: .9375rem; }
.competitive-page :is(.competitive-metrics button.is-active, .competitive-category-nav a[aria-current="page"]) { background: var(--cp-tint); border-color: var(--cp-section); color: var(--cp-section); box-shadow: inset 0 -2px var(--cp-section); }
.competitive-page .competitive-shortcut-links a { background: #19273e; border-color: #627494; }
.competitive-page .competitive-shortcut-links a:nth-child(1) strong { color: #ffda89; }
.competitive-page .competitive-shortcut-links a:nth-child(2) strong { color: #78e1ff; }
.competitive-page .competitive-shortcut-links a:nth-child(3) strong { color: #d0b5ff; }
.competitive-page .competitive-card { background: linear-gradient(150deg, #20334b, #142338); border-color: #58768f; }
.competitive-page .competitive-card:nth-child(3n+2) { background: linear-gradient(150deg, #302c49, #1b2338); border-color: #796b9a; }
.competitive-page .competitive-card:nth-child(3n+3) { background: linear-gradient(150deg, #1c3c36, #162735); border-color: #58897e; }
.competitive-page .competitive-card :is(h3, h4) { color: #f5f7ff; }
.competitive-page .competitive-card-stats > div { background: #111f34; border-color: #586d8a; }
.competitive-page .competitive-card-stats > div:nth-child(4n+1) dd { color: #78e1ff; }
.competitive-page .competitive-card-stats > div:nth-child(4n+2) dd { color: #89edc8; }
.competitive-page .competitive-card-stats > div:nth-child(4n+3) dd { color: #ffda89; }
.competitive-page .competitive-card-stats > div:nth-child(4n+4) dd { color: #d0b5ff; }
.competitive-page .competitive-card-stats > div dd.is-unavailable { color: var(--cp-muted); }
.competitive-page .competitive-table-wrap thead th { background: #253653; color: #f5f7ff; font-size: .9375rem; }
.competitive-page .competitive-table-wrap tbody tr:nth-child(even) { background: #1c2a40; }
.competitive-page .competitive-table-wrap tbody tr:hover { background: #2a3b55; }
.competitive-page .competitive-podium-card { background: linear-gradient(145deg, #253750, #17243a); border-color: #92abc6; }
.competitive-page .competitive-podium-card.is-first { background: linear-gradient(145deg, #443624, #242535); border-color: #ffda89; }
.competitive-page .competitive-podium-card.is-first span { color: #ffda89; }
.competitive-page :is(.competitive-profile-context, .competitive-dialog) { --cp-muted: #c4d0e5; --cp-text: #f5f7ff; background: #16243b; border-color: #a18bcd; color: var(--cp-text); }
.competitive-page .competitive-compare-dock { background: #25213b; border-color: #d0b5ff; }
.competitive-page .competitive-profile-context :is(dt, dd),
.competitive-page :is(.competitive-matrix th, .competitive-matrix caption, .competitive-versus-metrics h3) { font-size: .9375rem; line-height: 1.6; }
@media (max-width: 700px) {
    .competitive-page :is(.competitive-ranking-table tbody tr, .competitive-hall-table tbody tr) { background: #192a40; border-color: #60748f; }
    .competitive-page :is(.competitive-ranking-table td, .competitive-hall-table td)::before { color: #c4d0e5; }
}
/* Dialogs are moved to the document body by the existing interaction code. */
.competitive-share-fallback { display: flex; flex: 1 1 100%; flex-direction: column; gap: .5rem; min-width: 0; color: var(--cp-text); }
.competitive-share-fallback input { width: 100%; min-width: 0; padding: .7rem; border: 1px solid var(--cp-line-strong); border-radius: .5rem; background: #0c172b; color: #f5f7ff; }
.competitive-snapshot-action { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1rem; }
.competitive-snapshot-action p { color: var(--cp-muted); margin: 0; }
:is(dialog.competitive-profile-context, dialog.competitive-dialog) {
    --cp-text: #f5f7ff;
    --cp-muted: #c4d0e5;
    --cp-line: #526380;
    --cp-line-strong: #a18bcd;
    --cp-accent: #78e1ff;
    --cp-accent-2: #d0b5ff;
    background: #16243b;
    border-color: #a18bcd;
    color: var(--cp-text);
}
:is(dialog.competitive-profile-context, dialog.competitive-dialog) :is(dt, dd, .competitive-versus-metrics h3, .competitive-matrix th) { font-size: .9375rem; line-height: 1.6; }
:is(dialog.competitive-profile-context dl div, dialog.competitive-dialog .competitive-versus-metrics article):nth-child(4n+1) { background: #173248; border-color: #547d99; }
:is(dialog.competitive-profile-context dl div, dialog.competitive-dialog .competitive-versus-metrics article):nth-child(4n+2) { background: #16392f; border-color: #58897e; }
:is(dialog.competitive-profile-context dl div, dialog.competitive-dialog .competitive-versus-metrics article):nth-child(4n+3) { background: #352e24; border-color: #998358; }
:is(dialog.competitive-profile-context dl div, dialog.competitive-dialog .competitive-versus-metrics article):nth-child(4n+4) { background: #302646; border-color: #796b9a; }
