/* ===== replay-directory-fix.css ===== */
/* Directory images and Replay report parity overrides (2026-07-31). */
:root {
    --rw-panel: #111923;
    --rw-panel-deep: #0a111a;
    --rw-panel-soft: #172230;
    --rw-line: rgb(155 179 202 / .22);
    --rw-line-strong: rgb(136 188 229 / .44);
    --rw-text: #e9f1f7;
    --rw-muted: #96aabd;
    --rw-accent: #50afe8;
    --rw-enemy: #d36b70;
}

/* Do not stretch a class placeholder over a correct WG image. */
.catalog-card-image,
.catalog-detail-image {
    overflow: hidden;
    background: #0c1621;
}

.catalog-card-image img,
.catalog-detail-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.catalog-achievement-card .catalog-card-image img {
    object-fit: contain;
    padding: .65rem;
}

/* WoT minimaps are square (1:1).
   Reshape the card so the image row gets a 1:1 aspect-ratio cell that
   is not re-stretched by the child img (height:100% from base CSS). */
.catalog-map-card--square {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 1fr auto;
    overflow: hidden;
}

.catalog-map-card--square .catalog-card-link {
    display: grid;
    grid-template-rows: subgrid;
    grid-template-columns: subgrid;
    grid-row: 1 / -1;
}

.catalog-map-card--square .catalog-card-image {
    grid-row: 1 / 2;
    aspect-ratio: 1 / 1;
    height: auto;
    max-height: none;
}

.catalog-map-card--square .catalog-card-image img {
    height: 100% !important;
    max-height: 100%;
}

.catalog-map-card--square .catalog-card-body {
    grid-row: 2 / 3;
}

.catalog-card-media-note {
    position: absolute;
    right: .55rem;
    bottom: .55rem;
    padding: .2rem .45rem;
    border-radius: .2rem;
    background: rgb(5 12 20 / .72);
    color: #d5e5f1;
    font-size: .72rem;
}

/* ReplayWoWS-inspired stats frame: one tab strip, one visual language. */
.replay-reference-page .replay-detail-layout,
.replay-reference-page .replay-detail-main {
    display: block;
    min-width: 0;
}

.replay-reference-page .reference-battle-report {
    overflow: hidden;
    border: 1px solid var(--rw-line-strong);
    border-radius: .35rem;
    background: var(--rw-panel);
    box-shadow: 0 15px 38px rgb(0 0 0 / .18);
}

.replay-reference-page .reference-battle-report > .detail-section-heading {
    display: flex;
    align-items: center;
    min-height: 3.35rem;
    margin: 0;
    padding: 0 1.1rem;
    border-bottom: 1px solid var(--rw-line);
    background: linear-gradient(90deg, #172432, #101923);
}

.replay-reference-page .reference-battle-report > .detail-section-heading h2,
.replay-reference-page .reference-panel h2,
.replay-reference-page .reference-panel h3,
.replay-reference-page .reference-panel h4 {
    margin: 0;
    color: var(--rw-text);
    font-family: Arial, "Microsoft YaHei", sans-serif;
    font-weight: 700;
}

.replay-reference-page .reference-battle-report > .detail-section-heading h2 {
    font-size: 1rem;
    letter-spacing: .025em;
}

.replay-reference-page .reference-report-tabs {
    display: flex;
    min-height: 3.1rem;
    margin: 0;
    padding: 0;
    overflow-x: auto;
    border-bottom: 1px solid var(--rw-line);
    background: #0b121b;
    scrollbar-width: thin;
}

.replay-reference-page .reference-report-tabs .detail-tab {
    position: relative;
    flex: 1 0 8.2rem;
    min-height: 3.1rem;
    margin: 0;
    padding: 0 .95rem;
    border: 0;
    border-right: 1px solid rgb(155 179 202 / .12);
    border-radius: 0;
    background: transparent;
    color: #aebfce;
    font-family: Arial, "Microsoft YaHei", sans-serif;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .025em;
    text-transform: uppercase;
    white-space: nowrap;
    cursor: pointer;
}

.replay-reference-page .reference-report-tabs .detail-tab::after {
    position: absolute;
    right: .8rem;
    bottom: 0;
    left: .8rem;
    height: 3px;
    background: transparent;
    content: "";
}

.replay-reference-page .reference-report-tabs .detail-tab:hover,
.replay-reference-page .reference-report-tabs .detail-tab:focus-visible {
    background: rgb(92 172 222 / .1);
    color: #e7f5ff;
    outline: none;
}

.replay-reference-page .reference-report-tabs .detail-tab.active {
    background: #152638;
    color: #f2f9fd;
}

.replay-reference-page .reference-report-tabs .detail-tab.active::after {
    background: var(--rw-accent);
}

.replay-reference-page .reference-tab-panels {
    min-width: 0;
    background: var(--rw-panel);
}

.replay-reference-page .reference-tab-panels > .detail-panel {
    min-width: 0;
    margin: 0;
}

.replay-reference-page .reference-tab-panels > .detail-panel[hidden] {
    display: none !important;
}

.replay-reference-page .reference-panel {
    min-width: 0;
    margin: 0;
    padding: 1.15rem;
    background: var(--rw-panel);
    color: var(--rw-text);
    font-family: Arial, "Microsoft YaHei", sans-serif;
    font-size: .84rem;
    line-height: 1.4;
}

.replay-reference-page .reference-panel--personal {
    padding: 0;
}

.replay-reference-page .reference-hat {
    display: grid;
    grid-template-columns: minmax(8.5rem, .72fr) minmax(15rem, 1.6fr) minmax(10.5rem, 1fr) auto;
    align-items: stretch;
    min-height: 5.75rem;
    border-bottom: 1px solid var(--rw-line);
    background: linear-gradient(90deg, #152434, #101a25);
}

.replay-reference-page .reference-hat > * {
    display: flex;
    align-items: center;
    min-width: 0;
    padding: .8rem 1rem;
    border-right: 1px solid var(--rw-line);
}

.replay-reference-page .reference-hat > :last-child {
    border-right: 0;
}

.replay-reference-page .reference-hat-result {
    justify-content: center;
    color: #dcecf7;
    font-size: 1.12rem;
    font-weight: 800;
    letter-spacing: .08em;
}

.replay-reference-page .reference-hat-scenario,
.replay-reference-page .reference-hat-player {
    justify-content: space-between;
    gap: .75rem;
}

.replay-reference-page .replay-scenario-data,
.replay-reference-page .reference-hat-player {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.replay-reference-page .replay-scenario-data strong,
.replay-reference-page .reference-hat-player strong {
    overflow: hidden;
    max-width: 100%;
    color: #f4f8fb;
    font-size: .98rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.replay-reference-page .replay-scenario-data span,
.replay-reference-page .reference-hat-player span {
    margin-top: .18rem;
    color: var(--rw-muted);
    font-size: .75rem;
}

.replay-reference-page .replay-scenario-icon {
    width: 4.3rem;
    min-width: 4.3rem;
    height: 3rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.replay-reference-page .battle_type {
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.replay-reference-page .reference-hat-ship-icon {
    width: 5.7rem;
    height: auto;
    max-height: 3.6rem;
    padding: .5rem;
    object-fit: contain;
}

.replay-reference-page .reference-block-label,
.replay-reference-page .report-panel-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 2.65rem;
    padding: 0 1.15rem;
    border-bottom: 1px solid var(--rw-line);
    background: #0c141e;
    color: #c8dae7;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .035em;
}

.replay-reference-page .reference-block-label--performance {
    border-top: 1px solid var(--rw-line);
}

.replay-reference-page .report-panel-heading {
    margin: -1.15rem -1.15rem 1.15rem;
}

.replay-reference-page .report-panel-heading h2 {
    font-size: .96rem;
}

.replay-reference-page .report-panel-kicker {
    display: none;
}

.replay-reference-page .report-panel-caption {
    color: var(--rw-muted);
    font-size: .73rem;
    font-weight: 400;
}

.replay-reference-page .reference-currencies,
.replay-reference-page .reference-performance,
.replay-reference-page .reference-achievements {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));
    gap: 1px;
    padding: 1px;
    background: var(--rw-line);
}

.replay-reference-page .reference-currency,
.replay-reference-page .reference-performance-total,
.replay-reference-page .reference-ribbon {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 5.4rem;
    gap: .55rem;
    padding: .7rem;
    background: var(--rw-panel);
    text-align: center;
}

.replay-reference-page .reference-currency strong,
.replay-reference-page .reference-performance-total strong {
    color: #f7fbfd;
    font-size: 1.15rem;
    font-variant-numeric: tabular-nums;
}

.replay-reference-page .reference-currency img {
    width: 1.65rem;
    height: 1.65rem;
    object-fit: contain;
}

.replay-reference-page .reference-performance {
    grid-template-columns: minmax(10rem, 1.15fr) repeat(auto-fit, minmax(6rem, 1fr));
}

.replay-reference-page .reference-performance-total,
.replay-reference-page .reference-ribbon {
    flex-direction: column;
    gap: .08rem;
}

.replay-reference-page .reference-performance-total span,
.replay-reference-page .reference-ribbon span {
    color: var(--rw-muted);
    font-size: .7rem;
}

.replay-reference-page .reference-ribbon-art {
    width: 2.55rem;
    height: 1.7rem;
}

.replay-reference-page .reference-ribbon-art img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.replay-reference-page .reference-ribbon strong {
    color: #f0f7fc;
    font-size: .9rem;
}

.replay-reference-page .reference-achievements {
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
}

.replay-reference-page .reference-achievements span {
    padding: .7rem .85rem;
    background: var(--rw-panel);
    color: #d2e3ef;
}

.replay-reference-page .report-subheading,
.replay-reference-page .team-block-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 0;
    padding: .68rem .85rem;
    border: 1px solid var(--rw-line);
    border-bottom: 0;
    background: #14202c;
}

.replay-reference-page .report-subheading h3,
.replay-reference-page .team-block-heading h3 {
    font-size: .86rem;
}

.replay-reference-page .report-subheading span,
.replay-reference-page .team-count {
    color: var(--rw-muted);
    font-size: .72rem;
}

.replay-reference-page .report-detail-block,
.replay-reference-page .report-economy-block,
.replay-reference-page .team-block {
    margin: 0 0 1rem;
}

.replay-reference-page .report-weapon-grid,
.replay-reference-page .report-detail-metric-grid,
.replay-reference-page .report-economy-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    gap: .6rem;
    padding: .85rem;
    border: 1px solid var(--rw-line);
    background: #0c141e;
}

.replay-reference-page .report-weapon-grid,
.replay-reference-page .report-detail-metric-grid {
    border-top: 0;
}

.replay-reference-page .report-detail-total,
.replay-reference-page .report-weapon-card,
.replay-reference-page .report-detail-metric,
.replay-reference-page .report-economy-column {
    min-width: 0;
    border: 1px solid rgb(155 179 202 / .17);
    background: #15202c;
}

.replay-reference-page .report-detail-total,
.replay-reference-page .report-detail-metric {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 4.5rem;
    padding: .75rem .85rem;
}

.replay-reference-page .report-detail-total span,
.replay-reference-page .report-detail-metric span,
.replay-reference-page .report-weapon-row span,
.replay-reference-page .report-economy-row span {
    color: var(--rw-muted);
    font-size: .72rem;
}

.replay-reference-page .report-detail-total strong,
.replay-reference-page .report-detail-metric strong,
.replay-reference-page .report-economy-row strong {
    margin-top: .2rem;
    color: #eef7fc;
    font-size: 1rem;
    font-variant-numeric: tabular-nums;
}

.replay-reference-page .report-weapon-card h4 {
    padding: .66rem .75rem;
    border-bottom: 1px solid var(--rw-line);
    background: #192736;
    font-size: .8rem;
}

.replay-reference-page .report-weapon-row,
.replay-reference-page .report-economy-row,
.replay-reference-page .report-economy-subrows > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: .5rem;
    padding: .52rem .75rem;
    border-bottom: 1px solid rgb(155 179 202 / .11);
}

.replay-reference-page .report-weapon-row strong {
    color: #eaf3f9;
    font-variant-numeric: tabular-nums;
}

.replay-reference-page .report-weapon-row small {
    grid-column: 1 / -1;
    color: #70879a;
    font-size: .68rem;
}

.replay-reference-page .team-score-grid {
    display: grid;
    gap: 1rem;
}

.replay-reference-page .team-block-heading {
    border-color: var(--rw-line-strong);
}

.replay-reference-page .team-block--own .team-block-heading {
    background: linear-gradient(90deg, #16334a, #14202c);
}

.replay-reference-page .team-mark {
    display: inline-grid;
    width: 1.45rem;
    height: 1.45rem;
    margin-right: .4rem;
    place-items: center;
    border: 1px solid rgb(106 193 240 / .6);
    border-radius: 50%;
    color: #bde9ff;
    font-size: .74rem;
}

.replay-reference-page .table-wrap {
    overflow-x: auto;
    border: 1px solid var(--rw-line);
    background: var(--rw-panel-deep);
}

.replay-reference-page .team-score-table,
.replay-reference-page .detailed-stats-table {
    width: 100%;
    min-width: 43rem;
    border-collapse: collapse;
    color: #d7e5ef;
    font-size: .76rem;
}

.replay-reference-page .team-score-table thead,
.replay-reference-page .detailed-stats-table thead {
    background: #172330;
    color: #99b1c2;
    font-size: .68rem;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.replay-reference-page .team-score-table th,
.replay-reference-page .team-score-table td,
.replay-reference-page .detailed-stats-table th,
.replay-reference-page .detailed-stats-table td {
    padding: .6rem .65rem;
    border-bottom: 1px solid rgb(155 179 202 / .13);
    text-align: left;
    vertical-align: middle;
}

.replay-reference-page .team-score-table th:not(:first-child),
.replay-reference-page .team-score-table td:not(:first-child),
.replay-reference-page .detailed-stats-table th:not(:first-child),
.replay-reference-page .detailed-stats-table td:not(:first-child) {
    text-align: center;
}

.replay-reference-page .team-score-table tbody tr:hover {
    background: rgb(81 169 219 / .08);
}

.replay-reference-page .team-score-table tr.is-own {
    background: rgb(62 163 222 / .16);
}

.replay-reference-page .team-score-table tr.is-dead {
    color: #8193a2;
}

.replay-reference-page .team-player-cell {
    min-width: 9rem;
}

.replay-reference-page .team-ship-cell {
    display: flex;
    align-items: center;
    min-width: 11rem;
    gap: .55rem;
    text-align: left !important;
}

.replay-reference-page .team-ship-cell img {
    width: 5.5rem;
    height: 1.6rem;
    object-fit: contain;
    object-position: center;
}

.replay-reference-page .team-ship-cell span {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.replay-reference-page .team-ship-cell strong {
    overflow: hidden;
    max-width: 8.5rem;
    color: #eaf3f8;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.replay-reference-page .team-ship-cell small,
.replay-reference-page .team-achievement-dot {
    color: #8da7b9;
    font-size: .68rem;
}

.replay-reference-page .team-achievement-dot:not(:empty) {
    color: #d8be6c;
}

.replay-reference-page .report-economy-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-top: 0;
}

.replay-reference-page .report-economy-column-heading {
    padding: .7rem .75rem;
    border-bottom: 1px solid var(--rw-line);
    background: #192736;
}

.replay-reference-page .report-economy-column.is-premium .report-economy-column-heading {
    background: #263728;
    color: #dff2d5;
}

.replay-reference-page .report-economy-row.is-total {
    background: rgb(83 164 104 / .11);
}

.replay-reference-page .report-economy-subrows {
    padding: .45rem 0;
    border-top: 1px solid var(--rw-line);
}

.replay-reference-page .report-economy-subheading {
    display: block;
    padding: .2rem .75rem .5rem;
    color: var(--rw-muted);
    font-size: .69rem;
}

.replay-reference-page .report-raw-details {
    margin-top: 1rem;
    border: 1px solid var(--rw-line);
    background: #0d151e;
}

.replay-reference-page .report-raw-details summary {
    padding: .7rem .8rem;
    color: #b8cfdf;
    cursor: pointer;
}

.replay-reference-page .detailed-json {
    max-height: 26rem;
    margin: 0;
    padding: .85rem;
    overflow: auto;
    border-top: 1px solid var(--rw-line);
    color: #b6c7d4;
    font-size: .72rem;
}

@media (max-width: 780px) {
    .replay-reference-page .reference-hat {
        grid-template-columns: 1fr 1fr;
    }

    .replay-reference-page .reference-hat-ship-icon {
        display: none;
    }

    .replay-reference-page .reference-performance {
        grid-template-columns: repeat(auto-fit, minmax(6.6rem, 1fr));
    }

}

@media (max-width: 560px) {
    .replay-reference-page .reference-panel {
        padding: .75rem;
    }

    .replay-reference-page .reference-panel--personal {
        padding: 0;
    }

    .replay-reference-page .reference-hat {
        display: block;
    }

    .replay-reference-page .reference-hat > * {
        min-height: auto;
        border-right: 0;
        border-bottom: 1px solid var(--rw-line);
    }

    .replay-reference-page .reference-hat > :last-child {
        border-bottom: 0;
    }

    .replay-reference-page .reference-hat-result {
        justify-content: flex-start;
    }

    .replay-reference-page .reference-currencies,
    .replay-reference-page .reference-performance,
    .replay-reference-page .report-weapon-grid,
    .replay-reference-page .report-detail-metric-grid,
    .replay-reference-page .report-economy-grid {
        grid-template-columns: 1fr 1fr;
    }

    .replay-reference-page .report-economy-grid {
        grid-template-columns: 1fr;
    }

    .replay-reference-page .replay-action-footer,
    .replay-reference-page .report-panel-heading,
    .replay-reference-page .reference-block-label {
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;
        gap: .2rem;
        padding-top: .55rem;
        padding-bottom: .55rem;
    }
}
/* WoT battle-report tab content enhancements (2026-08-06). */
/* Roster rows: own-player highlight + died dimming. */
.report-section--roster tr.is-own td {
    background: rgb(62 163 222 / .12);
}

.report-section--roster tr.is-died td {
    color: #64788a;
    opacity: .62;
}

.report-section--roster tr.is-died td a {
    color: inherit;
}

.report-survive-mark {
    display: inline-block;
    margin-left: .4rem;
    padding: 1px 5px;
    border: 1px solid rgb(155 179 202 / .25);
    border-radius: 2px;
    font-size: .62rem;
    line-height: 1.4;
}

.report-section--roster tr.is-died .report-survive-mark {
    color: #8aa0b2;
}

.report-section--roster tr.is-own .report-survive-mark {
    border-color: rgb(106 193 240 / .6);
    color: #bde9ff;
}

/* Summary: result banner strip. */
.report-result {
    display: flex;
    align-items: center;
    gap: .8rem;
    margin: 0 0 1rem;
    padding: .55rem .9rem;
    border: 1px solid var(--rw-line-strong);
    border-left-width: 4px;
    border-radius: .3rem;
    background: linear-gradient(90deg, #17263a, #101a25);
}

.report-result strong {
    color: #f2f9fd;
    font-size: 1rem;
    letter-spacing: .06em;
}

.report-result span {
    color: var(--rw-muted);
    font-size: .78rem;
}

.report-result--victory {
    border-left-color: #5fc98b;
}

.report-result--victory strong {
    color: #7fe3a5;
}

.report-result--defeat {
    border-left-color: #d36b70;
}

.report-result--defeat strong {
    color: #f08f94;
}

.report-result--draw {
    border-left-color: #c9b86c;
}

.report-result--draw strong {
    color: #e3d287;
}

/* WoT battle-report summary grid (restores 2-col layout that was missing CSS). */
.report-summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
    gap: .55rem .9rem;
    margin: 0;
    padding: 0;
}

.report-summary-item {
    display: flex;
    align-items: baseline;
    gap: .35rem;
    min-width: 0;
    padding: .45rem .65rem;
    border: 1px solid var(--rw-line);
    border-radius: .25rem;
    background: rgb(15 25 35 / .55);
}

.report-summary-item dt {
    color: var(--rw-muted);
    font-size: .72rem;
    letter-spacing: .04em;
    white-space: nowrap;
}

.report-summary-item dd {
    margin: 0;
    overflow: hidden;
    color: #eaf3f9;
    font-size: .88rem;
    font-variant-numeric: tabular-nums;
    text-overflow: ellipsis;
    white-space: nowrap;
}

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

/* WoT detailed-stats panel. */
.report-detail-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
    gap: .55rem;
    margin: 0;
    padding: 0;
}

.report-detail-metric {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 4.2rem;
    padding: .6rem .75rem;
    border: 1px solid rgb(155 179 202 / .17);
    border-radius: .3rem;
    background: #15202c;
}

.report-detail-metric dt {
    color: var(--rw-muted);
    font-size: .7rem;
    letter-spacing: .03em;
}

.report-detail-metric dd {
    margin: .25rem 0 0;
    color: #eef7fc;
    font-size: 1.05rem;
    font-variant-numeric: tabular-nums;
}

.report-mastery {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    margin-top: .9rem;
    padding: .45rem .8rem;
    border: 1px solid rgb(216 190 108 / .45);
    border-radius: .3rem;
    background: rgb(216 190 108 / .1);
    color: #e3d287;
    font-size: .85rem;
    letter-spacing: .05em;
}

.report-mastery span {
    color: var(--rw-muted);
    font-size: .72rem;
}

/* WoT economy panel. */
.report-economy-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .55rem;
    margin: 0;
    padding: 0;
}

@media (max-width: 720px) {
    .report-economy-grid {
        grid-template-columns: 1fr !important;
    }
}

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

.report-economy-column {
    display: flex !important;
    flex-direction: column;
    min-width: 0;
    border: 1px solid rgb(155 179 202 / .17);
    border-radius: .3rem;
    overflow: hidden;
    background: #101a24;
}

.report-economy-column-heading {
    padding: .55rem .8rem;
    border-bottom: 1px solid var(--rw-line);
    background: #192736;
    color: #cfe2ef;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .04em;
}

.report-economy-rows {
    padding: 0;
}

.report-economy-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .6rem;
    padding: .5rem .8rem;
    border-bottom: 1px solid rgb(155 179 202 / .1);
}

.report-economy-row:last-child {
    border-bottom: 0;
}

.report-economy-row span {
    color: var(--rw-muted);
    font-size: .74rem;
}

.report-economy-row strong {
    color: #eaf3f9;
    font-size: .92rem;
    font-variant-numeric: tabular-nums;
}

.report-economy-row--total {
    background: rgb(83 164 104 / .11);
}

.report-economy-row--total strong {
    color: #a5e6b8;
}

@media (max-width: 560px) {
    .report-detail-grid,
    .report-economy-grid {
        grid-template-columns: 1fr;
    }
}

/* ===== replay-tabs-parity.css ===== */
/* ReplayWoWS layout parity: intentionally replaces the former card treatment. */
.replay-reference-page .reference-battle-report {
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.replay-reference-page .reference-battle-report > .detail-section-heading {
    display: none !important;
}

.replay-reference-page .reference-report-tabs {
    display: flex !important;
    min-height: 25px !important;
    height: 25px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    background: transparent !important;
}

.replay-reference-page .reference-report-tabs .detail-tab {
    display: block !important;
    flex: 0 0 25% !important;
    min-height: 25px !important;
    height: 25px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #ddd !important;
    font-family: "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 14px !important;
    font-stretch: condensed;
    font-weight: 700 !important;
    line-height: 25px !important;
    letter-spacing: .02em !important;
    text-align: left !important;
    text-transform: uppercase !important;
}

.replay-reference-page .reference-report-tabs .detail-tab:hover,
.replay-reference-page .reference-report-tabs .detail-tab:focus-visible,
.replay-reference-page .reference-report-tabs .detail-tab.active {
    background: transparent !important;
    color: #fefefe !important;
    outline: 0 !important;
}

.replay-reference-page .reference-report-tabs .detail-tab::after {
    display: none !important;
}

.replay-reference-page .reference-tab-panels {
    min-width: 0 !important;
    margin-top: 30px !important;
    background: transparent !important;
}

.replay-reference-page .reference-tab-panels > .detail-panel,
.replay-reference-page .reference-tab-panels > .detail-panel.active {
    margin: 0 !important;
    background: transparent !important;
}

.replay-reference-page .reference-panel,
.replay-reference-page .reference-panel--personal,
.replay-reference-page .reference-panel--team,
.replay-reference-page .reference-panel--detailed,
.replay-reference-page .reference-panel--economy {
    display: block !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #ddd !important;
    font-family: "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 17px !important;
    font-stretch: condensed;
    font-weight: 400 !important;
    line-height: 30.6px !important;
}

/* 1. Personal score: replay-hat then replay-stats, no boxed segments. */
.replay-reference-page .reference-hat {
    display: grid !important;
    grid-template-columns: 250px minmax(0, 1fr) 250px !important;
    align-items: center !important;
    min-height: 150px !important;
    margin: 0 !important;
    padding: 40px 0 !important;
    border: 0 !important;
    background: transparent !important;
}

.replay-reference-page .reference-hat > *,
.replay-reference-page .reference-hat > :last-child {
    display: block !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

.replay-reference-page .reference-hat-result {
    color: #ddd !important;
    font-family: "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 25px !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
}

.replay-reference-page .reference-hat-scenario,
.replay-reference-page .reference-hat-player,
.replay-reference-page .replay-scenario-data {
    display: block !important;
}

.replay-reference-page .replay-scenario-data strong,
.replay-reference-page .reference-hat-player strong {
    display: block !important;
    overflow: visible !important;
    color: #b3c8d8 !important;
    font-family: "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 30.6px !important;
    text-overflow: clip !important;
    white-space: normal !important;
}

.replay-reference-page .replay-scenario-data span,
.replay-reference-page .reference-hat-player span {
    display: block !important;
    margin: 0 !important;
    color: #ddd !important;
    font-size: 17px !important;
    line-height: 30.6px !important;
}

.replay-reference-page .replay-scenario-icon,
.replay-reference-page .reference-hat-ship-icon {
    display: none !important;
}

.replay-reference-page .reference-block-label,
.replay-reference-page .report-panel-heading,
.replay-reference-page .report-subheading,
.replay-reference-page .team-block-heading {
    display: block !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #ddd !important;
    font-family: "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 30.6px !important;
    letter-spacing: 0 !important;
}

.replay-reference-page .reference-block-label--performance {
    margin-top: 15px !important;
    border: 0 !important;
}

.replay-reference-page .reference-currencies {
    display: flex !important;
    gap: 28px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

.replay-reference-page .reference-currency {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    text-align: left !important;
}

.replay-reference-page .reference-currency strong,
.replay-reference-page .reference-performance-total strong {
    color: #ddd !important;
    font-family: "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 24px !important;
    font-weight: 400 !important;
}

.replay-reference-page .reference-currency img {
    width: 24px !important;
    height: 24px !important;
    margin-left: 8px !important;
}

.replay-reference-page .reference-performance {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    gap: 0 24px !important;
    padding: 0 !important;
    background: transparent !important;
}

.replay-reference-page .reference-performance-total,
.replay-reference-page .reference-ribbon {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    min-width: 88px !important;
    min-height: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    text-align: left !important;
}

.replay-reference-page .reference-performance-total {
    min-width: 185px !important;
}

.replay-reference-page .reference-performance-total span,
.replay-reference-page .reference-ribbon span,
.replay-reference-page .reference-ribbon strong {
    color: #ddd !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 24px !important;
}

.replay-reference-page .reference-ribbon-art {
    width: 50px !important;
    height: 35px !important;
}

.replay-reference-page .reference-achievements {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0 20px !important;
    padding: 14px 0 0 !important;
    background: transparent !important;
}

.replay-reference-page .reference-achievements span {
    padding: 0 !important;
    background: transparent !important;
    color: #ddd !important;
}

/* 2. Team score: two side-by-side post-battle tables. */
.replay-reference-page .reference-panel--team {
    padding: 25px 0 !important;
}

.replay-reference-page .reference-panel--team > .report-panel-heading {
    display: none !important;
}

.replay-reference-page .team-score-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.replay-reference-page .team-block,
.replay-reference-page .team-block--own {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

.replay-reference-page .team-block-heading,
.replay-reference-page .team-block--own .team-block-heading {
    height: 30.6px !important;
    padding: 0 !important;
    background: transparent !important;
}

.replay-reference-page .team-block-heading h3 {
    color: #ddd !important;
    font-family: "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 30.6px !important;
}

.replay-reference-page .team-count,
.replay-reference-page .team-mark {
    display: none !important;
}

.replay-reference-page .team-block .table-wrap {
    overflow: hidden !important;
    border: 0 !important;
    background: transparent !important;
}

.replay-reference-page .team-score-table,
.replay-reference-page .detailed-stats-table {
    min-width: 0 !important;
    border-collapse: collapse !important;
    color: #ddd !important;
    font-family: "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 16px !important;
    line-height: 30.6px !important;
}

.replay-reference-page .team-score-table thead,
.replay-reference-page .detailed-stats-table thead {
    background: transparent !important;
    color: #9db8cb !important;
    font-size: 14px !important;
}

.replay-reference-page .team-score-table th,
.replay-reference-page .team-score-table td,
.replay-reference-page .detailed-stats-table th,
.replay-reference-page .detailed-stats-table td {
    padding: 0 6px !important;
    border: 0 !important;
    color: inherit !important;
    line-height: 30.6px !important;
}

.replay-reference-page .team-score-table tbody tr:hover,
.replay-reference-page .team-score-table tr.is-own,
.replay-reference-page .team-score-table tr.is-dead {
    background: transparent !important;
    color: #ddd !important;
}

.replay-reference-page .team-player-cell {
    min-width: 0 !important;
}

.replay-reference-page .team-ship-cell {
    min-width: 0 !important;
    gap: 4px !important;
}

.replay-reference-page .team-ship-cell img {
    width: 72px !important;
    height: 22px !important;
}

.replay-reference-page .team-ship-cell strong,
.replay-reference-page .team-ship-cell small,
.replay-reference-page .team-achievement-dot {
    color: #ddd !important;
    font-family: inherit !important;
    font-size: 16px !important;
    font-weight: 400 !important;
}

/* 3. Detailed statistics: three plain post-battle columns. */
.replay-reference-page .reference-panel--detailed {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: start !important;
    gap: 0 30px !important;
    padding: 40px 0 !important;
}

.replay-reference-page .reference-panel--detailed > .report-panel-heading,
.replay-reference-page .reference-panel--detailed > .report-raw-details {
    grid-column: 1 / -1 !important;
}

.replay-reference-page .reference-panel--detailed .report-detail-block {
    min-width: 0 !important;
    margin: 0 0 25px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

.replay-reference-page .reference-panel--detailed .report-subheading h3,
.replay-reference-page .reference-panel--detailed .report-subheading span {
    color: #ddd !important;
    font-family: "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 30.6px !important;
}

.replay-reference-page .report-weapon-grid,
.replay-reference-page .report-detail-metric-grid {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

.replay-reference-page .report-detail-total,
.replay-reference-page .report-weapon-card,
.replay-reference-page .report-detail-metric {
    display: block !important;
    min-height: 0 !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

.replay-reference-page .report-detail-total span,
.replay-reference-page .report-detail-metric span,
.replay-reference-page .report-weapon-row span,
.replay-reference-page .report-detail-total strong,
.replay-reference-page .report-detail-metric strong,
.replay-reference-page .report-weapon-row strong {
    color: #ddd !important;
    font-family: "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 30.6px !important;
}

.replay-reference-page .report-weapon-card h4 {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #ddd !important;
    font: inherit !important;
}

.replay-reference-page .report-weapon-row,
.replay-reference-page .report-economy-row,
.replay-reference-page .report-economy-subrows > div {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 8px !important;
    padding: 0 !important;
    border: 0 !important;
}

.replay-reference-page .report-weapon-row small {
    display: none !important;
}

.replay-reference-page .report-target-table {
    margin-top: 4px !important;
}

/* 4. Economy: the actual premium/non-premium outcome, shown as one vertical list. */
.replay-reference-page .reference-panel--economy {
    padding: 40px 0 !important;
}

.replay-reference-page .reference-panel--economy > .report-panel-heading {
    display: none !important;
}

.replay-reference-page .report-economy-status {
    margin: 0 0 20px !important;
    color: #ddd !important;
}

.replay-reference-page .report-economy-block {
    margin: 0 0 28px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

.replay-reference-page .report-economy-grid {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

.replay-reference-page .report-economy-grid--with_premium .report-economy-column:not(.is-premium),
.replay-reference-page .report-economy-grid--without_premium .report-economy-column.is-premium {
    display: none !important;
}

.replay-reference-page .report-economy-column,
.replay-reference-page .report-economy-column.is-premium {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

.replay-reference-page .report-economy-column-heading {
    display: none !important;
}

.replay-reference-page .report-economy-row span,
.replay-reference-page .report-economy-row strong,
.replay-reference-page .report-economy-subrows span,
.replay-reference-page .report-economy-subrows strong {
    color: #ddd !important;
    font-family: "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 30.6px !important;
}

.replay-reference-page .report-economy-row.is-total {
    background: transparent !important;
}

.replay-reference-page .report-economy-subrows {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

.replay-reference-page .report-economy-subheading {
    display: none !important;
}

.replay-reference-page .report-raw-details {
    margin-top: 25px !important;
    border: 0 !important;
    background: transparent !important;
}

@media (max-width: 860px) {
    .replay-reference-page .reference-hat {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        min-height: 0 !important;
    }

    .replay-reference-page .team-score-grid,
    .replay-reference-page .reference-panel--detailed {
        grid-template-columns: 1fr !important;
    }

    .replay-reference-page .reference-tab-panels {
        margin-top: 20px !important;
    }
}

/* ===== replay-tabs-parity-v18.css ===== */
/* v18: the report tabs follow the geometry of the reference replay pages. */
.reference-report-tabs .detail-tab--video { letter-spacing: .04em; }
.reference-report-tabs .detail-tab--video span { color: #f2ca3a; }

/* =====================================================================
   A. Tab strip parity with replayswows.
   replayswows (.replay-tabs): bordered strip, 25px line-height, per-tab
   dark gradient, 1px right separators, centred uppercase condensed text,
   teal gradient active state with glow, hover underline + shine sweep.

   This block intentionally overrides the "flat 25px transparent strip"
   shipped in replay-tabs-parity.css (same selector + !important). It wins
   because this file is loaded last in layouts/site.blade.php.
   ===================================================================== */
.replay-reference-page .reference-report-tabs {
    display: flex !important;
    width: 100% !important;
    min-height: 25px !important;
    height: 25px !important;
    margin: 40px 0 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 1px solid hsla(0, 0%, 87%, .3) !important;
    background: transparent !important;
    position: relative !important;
    z-index: 10 !important;
}

.replay-reference-page .reference-report-tabs .detail-tab {
    display: block !important;
    flex: 1 1 0 !important;
    min-width: 0 !important;
    min-height: 25px !important;
    height: 25px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-right: 1px solid hsla(0, 0%, 100%, .2) !important;
    border-radius: 0 !important;
    background: linear-gradient(135deg, rgba(0, 0, 0, .5), rgba(0, 0, 0, .3)) !important;
    color: #ddd !important;
    font-family: WarHeliosCondCBold, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 14px !important;
    font-stretch: condensed;
    font-weight: 700 !important;
    line-height: 25px !important;
    letter-spacing: .02em !important;
    text-align: center !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    position: relative !important;
    transition: all .3s ease !important;
}

.replay-reference-page .reference-report-tabs .detail-tab:last-child {
    border-right: 0 !important;
}

.replay-reference-page .reference-report-tabs .detail-tab:hover,
.replay-reference-page .reference-report-tabs .detail-tab:focus-visible {
    background: linear-gradient(135deg, rgba(17, 85, 98, .8), rgba(17, 85, 98, .4)) !important;
    color: #fff !important;
    box-shadow: 0 4px 15px rgba(17, 85, 98, .3) !important;
    outline: 0 !important;
}

.replay-reference-page .reference-report-tabs .detail-tab.active {
    background: linear-gradient(135deg, rgba(17, 85, 98, .9), rgba(17, 85, 98, .5)) !important;
    color: #fff !important;
    box-shadow: 0 6px 20px rgba(17, 85, 98, .4) !important;
}

/* bottom underline sweep (replayswows .replay-tab:after) */
.replay-reference-page .reference-report-tabs .detail-tab::after {
    display: block !important;
    content: "" !important;
    position: absolute !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    height: 2px !important;
    background: linear-gradient(90deg, transparent, hsla(0, 0%, 100%, .3), transparent) !important;
    transform: scaleX(0) !important;
    transition: transform .3s ease !important;
}

.replay-reference-page .reference-report-tabs .detail-tab:hover::after,
.replay-reference-page .reference-report-tabs .detail-tab:focus-visible::after {
    transform: scaleX(1) !important;
}

/* top shine sweep (replayswows .replay-tab:before) */
.replay-reference-page .reference-report-tabs .detail-tab::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: -100% !important;
    width: 100% !important;
    height: 100% !important;
    background: linear-gradient(90deg, transparent, hsla(0, 0%, 100%, .1), transparent) !important;
    transition: left .5s ease !important;
}

.replay-reference-page .reference-report-tabs .detail-tab:hover::before,
.replay-reference-page .reference-report-tabs .detail-tab:focus-visible::before {
    left: 100% !important;
}

/* =====================================================================
   B. Panel switch animation (replayswows .replay-tab-content.active:
   animation:e .6s cubic-bezier(.25,.46,.45,.94) -> fade + rise 30px).
   ===================================================================== */
@keyframes rpt-panel-in {
    from { opacity: 0; transform: translateY(30px); }
    to   { opacity: 1; transform: none; }
}

.replay-reference-page .reference-tab-panels > .detail-panel.active {
    animation: rpt-panel-in .6s cubic-bezier(.25, .46, .45, .94);
}

/* =====================================================================
   C. Personal panel internals aligned to the reference hat / labels.
   Reference: .replay-result{font-size:40px},
   .replay-scenario{font-size:16px;color:#9cbaba},
   .replay-stats-info-text{font-size:28px;gradient text},
   .rb-received{gap:36px}, .rb-received__val{font-size:30px},
   .rb-pblock__label{font-size:12px;letter-spacing:.2em;uppercase}.
   ===================================================================== */
.replay-reference-page .reference-hat-result {
    font-size: 40px !important;
    line-height: 1 !important;
}

.replay-reference-page .replay-scenario-data strong,
.replay-reference-page .reference-hat-player strong {
    color: #b3c8d8 !important;
}

.replay-reference-page .replay-scenario-data span,
.replay-reference-page .reference-hat-player span {
    color: #9cbaba !important;
    font-size: 16px !important;
}

.replay-reference-page .reference-block-label {
    color: hsla(42, 35%, 93%, .54) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
}

.replay-reference-page .reference-block-label--performance {
    margin-top: 15px !important;
    margin-bottom: 20px !important;
    background: linear-gradient(45deg, #cecece, #fff) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    font-size: 28px !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

@supports not (background-clip: text) {
    .replay-reference-page .reference-block-label--performance {
        color: #ddd !important;
        background: none !important;
    }
}

.replay-reference-page .reference-currencies {
    gap: 36px !important;
}

.replay-reference-page .reference-currency strong,
.replay-reference-page .reference-performance-total strong {
    font-size: 30px !important;
}

/* Reference team tab: two compact tables centred on the row
   (replayswows .replay-teams{margin:0 auto}). */
.reference-panel--team .team-block {
    margin: 0 auto !important;
}

/* Reference team tab: two compact left-aligned roster tables, one directly below the other. */
.reference-panel--team { padding: 25px 0 !important; }
.reference-panel--team .report-panel-heading { display: none !important; }
.reference-panel--team .team-score-grid { display: block !important; width: 100% !important; padding: 0 !important; }
.reference-panel--team .team-block { width: 667px !important; max-width: 100% !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
.reference-panel--team .team-block + .team-block { margin-top: 0 !important; }
.reference-panel--team .table-wrap { overflow: visible !important; }
.reference-panel--team .team-score-table { width: 100% !important; table-layout: fixed; border-collapse: collapse !important; }
.reference-panel--team .team-score-table th, .reference-panel--team .team-score-table td { height: 30px !important; padding: 3px 7px !important; vertical-align: middle !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.reference-panel--team .team-score-table thead tr:not(.team-score-label) th { font-size: 13px !important; }
.reference-panel--team .team-score-table .team-score-label th { height: 31px !important; padding: 5px 7px !important; color: #e8edf3 !important; background: #333f4d !important; font-size: 16px !important; font-weight: 700 !important; text-align: left !important; }
.reference-panel--team .team-score-table th:nth-child(1), .reference-panel--team .team-score-table td:nth-child(1) { width: 26%; }
.reference-panel--team .team-score-table th:nth-child(2), .reference-panel--team .team-score-table td:nth-child(2) { width: 34%; }
.reference-panel--team .team-score-table th:nth-child(n+3), .reference-panel--team .team-score-table td:nth-child(n+3) { width: 10%; }
.reference-panel--team .team-ship-cell { display: table-cell !important; font-size: 13px !important; line-height: 22px !important; }
.reference-panel--team .team-ship-cell img { display: inline-block !important; width: 38px !important; height: 22px !important; margin: 0 5px 0 0 !important; object-fit: cover; vertical-align: middle !important; }
.reference-panel--team .team-ship-tier { display: inline-block; min-width: 16px; margin-right: 3px; color: #f1c85c; font-size: 12px; font-weight: 700; vertical-align: middle; }
.reference-panel--team .team-ship-cell strong { display: inline !important; color: inherit !important; font-size: 13px !important; font-weight: 600 !important; vertical-align: middle; }
.reference-panel--team .team-player-cell { font-size: 13px !important; }

/* Reference detailed tab: one fixed three-column information sheet instead of repeated cards. */
.reference-panel--detailed { display: block !important; padding: 38px 0 42px !important; }
.reference-panel--detailed .report-panel-heading { display: none !important; }
.reference-detail-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 0; }
.reference-detail-column { min-width: 0; padding: 0 20px 0 0; }
.reference-detail-column + .reference-detail-column { padding-left: 20px; border-left: 1px solid rgba(165,177,190,.13); }
.reference-detail-group { margin: 0 0 27px; }
.reference-detail-group h3 { margin: 0 0 11px; color: #dbe2eb; font-size: 18px; font-weight: 700; line-height: 1.15; }
.reference-detail-group h4 { margin: 11px 0 4px; color: #aab7c5; font-size: 14px; font-weight: 700; line-height: 1.2; }
.reference-detail-total, .reference-detail-row, .reference-detail-list > div { display: grid; grid-template-columns: minmax(0,1fr) auto; column-gap: 12px; align-items: baseline; min-height: 24px; border-bottom: 1px solid rgba(165,177,190,.10); }
.reference-detail-total { color: #edf2f7; font-size: 15px; font-weight: 700; }
.reference-detail-row, .reference-detail-list > div { color: #aeb9c5; font-size: 14px; }
.reference-detail-total strong, .reference-detail-row strong, .reference-detail-list dd { margin: 0; color: #e4ebf2; font-weight: 600; text-align: right; }
.reference-detail-row small { grid-column: 1 / -1; margin: -2px 0 3px; color: #7e8c9c; font-size: 11px; }
.reference-detail-list { margin: 0; }
.reference-detail-list dt, .reference-detail-list dd { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.report-extra-details { margin-top: 6px; color: #aeb9c5; }
.report-extra-details summary { width: fit-content; cursor: pointer; color: #c4d4e4; font-size: 14px; }
.report-extra-details__body { max-width: 420px; margin-top: 12px; }
.report-extra-details__body > div { display: flex; justify-content: space-between; gap: 12px; min-height: 24px; border-bottom: 1px solid rgba(165,177,190,.10); }
.report-extra-details__body strong { color: #e4ebf2; }

/* VIDEO follows the reference player's 1284 × 800 ratio and is mounted only when selected. */
.reference-panel--video { padding: 0 !important; background: #05090d !important; }
.replay-video-stage { width: 100%; aspect-ratio: 321 / 200; background: #000; }
.replay-video-stage iframe { display: block; width: 100%; height: 100%; border: 0; }
.reference-panel--economy .report-economy-status { display: none !important; }

@media (max-width: 820px) {
    .reference-detail-columns { grid-template-columns: 1fr; }
    .reference-detail-column, .reference-detail-column + .reference-detail-column { padding: 0; border-left: 0; }
    .reference-detail-column + .reference-detail-column { margin-top: 10px; }
}

/* ===== panel-parity-v19.css ===== */
/* =====================================================================
   panel-parity-v19 — 4 个 tab panel 内容区像素级对齐 replayswows
   /replay/234557（参考 6replay /replays/3236）。
   本文件在 replay-tabs-parity-v18.css 之后加载，覆盖旧 panel 类。
   ===================================================================== */

/* =====================================================================
   Tab 1 · 个人成绩 —— 参考 .replay-tab-stats
   ===================================================================== */

/* hat: 参考 .replay-hat { display:block; height:150px; padding:40px 0; overflow:hidden } */
.replay-reference-page .reference-panel--personal .replay-hat {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    min-height: 150px !important;
    height: 150px !important;
    margin: 0 !important;
    padding: 20px 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    background: transparent !important;
}

/* 结果文字: 参考 .replay-result { font-size:60px; color:#FECD66; padding:11px 0;
   font-family:WarHeliosCondCBold; display:block; position:relative; text-shadow:0 1px 4px #000 } */
.replay-reference-page .reference-panel--personal .replay-result {
    display: block !important;
    position: relative !important;
    margin: 0 !important;
    padding: 11px 0 !important;
    color: #FECD66 !important;
    font-family: WarHeliosCondCBold, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 60px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
    text-transform: none !important;
    text-shadow: 0 1px 4px #000 !important;
    background: transparent !important;
}

/* v24: 取消 v21s 的"毛玻璃"(shell::before blur)。
   整页大背景 = .replay-reference-page::before 的地图图（show.blade 内联 $_mapBg），
   对该背景层直接 blur。shell 保持透明露出背景。 */
.replay-reference-shell {
    background: transparent !important;
}

/* 场景块: 参考 .replay-scenario { margin-top:-45px; float:right; font-size:16px;
   color:#9cbaba; text-shadow:0 2px 1px rgba(0,0,0,.95) } */
.replay-reference-page .reference-panel--personal .replay-scenario {
    display: block !important;
    float: right !important;
    position: relative !important;
    margin: -45px 0 0 !important;
    color: #9cbaba !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 30.6px !important;
    text-align: right !important;
    text-shadow: 0 2px 1px rgba(0, 0, 0, .95) !important;
}

.replay-reference-page .reference-panel--personal .replay-scenario > div {
    display: block !important;
}

/* 场景数据: 参考 .replay-scenario-data { display:inline-block; text-align:right; height:80px; padding:10px } */
.replay-reference-page .reference-panel--personal .replay-scenario-data {
    display: inline-block !important;
    text-align: right !important;
    min-height: 80px !important;
    height: 80px !important;
    padding: 10px !important;
    box-sizing: border-box !important;
    color: #9cbaba !important;
}

.replay-reference-page .reference-panel--personal .replay-scenario-data p {
    margin: 0 !important;
    color: #9cbaba !important;
    font-size: 16px !important;
    line-height: 30.6px !important;
    text-align: right !important;
}

.replay-reference-page .reference-panel--personal .replay-scenario__map_name {
    color: #9cbaba !important;
}

/* 模式图标: 参考 .battle_type.medium 80x80 */
.replay-reference-page .reference-panel--personal .replay-scenario-icon {
    display: inline-block !important;
    float: right !important;
    width: 80px !important;
    height: 80px !important;
}

.replay-reference-page .reference-panel--personal .battle_type {
    width: 80px !important;
    height: 80px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
}

/* 玩家行: 参考 .replay-info-player { color:#fecd66; font-size:16px; padding-left:1px;
   font-family:WarHeliosCondCBold; text-shadow:0 1px 4px #000 } */
.replay-reference-page .reference-panel--personal .replay-info-player {
    display: block !important;
    position: relative !important;
    margin: 0 !important;
    padding: 0 0 0 1px !important;
    color: #fecd66 !important;
    font-family: WarHeliosCondCBold, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 47px !important;
    text-shadow: 0 1px 4px #000 !important;
}

.replay-reference-page .reference-panel--personal .destroyed_by {
    display: inline-block !important;
    color: #fecd66 !important;
    font-family: WarHeliosCondC, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 16px !important;
    /* line-height 略大于 47，为了 Arial Narrow fallback 字体 descender 不被 .replay-hat overflow:hidden 裁掉 */
    line-height: 47px !important;
    padding-bottom: 0 !important;
}

.replay-reference-page .reference-panel--personal .destroyed_by img {
    width: 27px !important;
    height: 27px !important;
    vertical-align: middle !important;
    margin: 0 4px !important;
}

.replay-reference-page .reference-panel--personal .destroyed_by span {
    color: #fecd66 !important;
    font-size: 16px !important;
    margin-right: 3px !important;
}

/* stats 区: 参考 .replay-stats { padding:20px 0; position:relative } */
.replay-reference-page .reference-panel--personal .replay-stats {
    display: block !important;
    position: relative !important;
    margin: 0 !important;
    padding: 20px 0 !important;
    border: 0 !important;
    background: transparent !important;
}

/* 收益标签: 参考 .rb-pblock__label.replay-stats-info-text 28px gradient */
.replay-reference-page .reference-panel--personal .rb-pblock {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

.replay-reference-page .reference-panel--personal .rb-pblock__label.replay-stats-info-text {
    z-index: 2 !important;
    display: block !important;
    margin: 0 0 20px !important;
    padding: 0 !important;
    background: linear-gradient(45deg, #cecece, #fff) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    font-family: WarHeliosCondCBold, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 28px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    text-shadow: none !important;
}

@supports not (background-clip: text) {
    .replay-reference-page .reference-panel--personal .rb-pblock__label.replay-stats-info-text {
        color: #ddd !important;
        background: none !important;
    }
}

/* 收益条: 参考 .rb-received { display:flex; gap:36px; padding:0 4px; align-items:center } */
.replay-reference-page .reference-panel--personal .rb-received {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 36px !important;
    margin: 0 !important;
    padding: 0 4px !important;
}

.replay-reference-page .reference-panel--personal .rb-received__currencies {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 30px !important;
}

.replay-reference-page .reference-panel--personal .rb-received__cur {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
}

.replay-reference-page .reference-panel--personal .rb-received__val {
    color: #f3efe6 !important;
    font-family: WarHeliosCondCBold, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 45px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: .01em !important;
    white-space: nowrap !important;
    text-shadow: 0 1px 8px rgba(0, 0, 0, .7) !important;
}

.replay-reference-page .reference-panel--personal .rb-received__icon {
    width: 26px !important;
    height: 26px !important;
    background-size: contain !important;
    background-position: 50% !important;
    background-repeat: no-repeat !important;
    flex-shrink: 0 !important;
    filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .6)) !important;
}

.replay-reference-page .reference-panel--personal .rb-received__icon--credits {
    background-image: url('/assets/replayswows/income.webp') !important;
}

.replay-reference-page .reference-panel--personal .rb-received__icon--ship-exp {
    background-image: url('/assets/replayswows/exp.webp') !important;
}

.replay-reference-page .reference-panel--personal .rb-received__icon--free-exp {
    background-image: url('/assets/replayswows/f_exp.webp') !important;
}

.replay-reference-page .reference-panel--personal .rb-received__divider {
    width: 1px !important;
    height: 40px !important;
    background: hsla(0, 0%, 100%, .18) !important;
    flex-shrink: 0 !important;
}

.replay-reference-page .reference-panel--personal .rb-received__medals {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 14px !important;
}

.replay-reference-page .reference-panel--personal .rb-received__medal {
    width: 46px !important;
    height: 46px !important;
    background-size: contain !important;
    background-position: 50% !important;
    background-repeat: no-repeat !important;
    flex-shrink: 0 !important;
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .6)) !important;
}

/* 战斗表现标签: 参考 .replay-stats .replay-stats-info-text 28px gradient margin-top:40px */
.replay-reference-page .reference-panel--personal .replay-stats .replay-stats-info-text {
    z-index: 2 !important;
    display: block !important;
    margin-bottom: 20px !important;
    padding: 0 !important;
    background: linear-gradient(45deg, #cecece, #fff) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    font-family: WarHeliosCondCBold, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 28px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-transform: none !important;
    text-shadow: none !important;
}

@supports not (background-clip: text) {
    .replay-reference-page .reference-panel--personal .replay-stats .replay-stats-info-text {
        color: #ddd !important;
        background: none !important;
    }
}

/* 勋带区: 参考 .replay-stats-info { display:flex; gap:10px; flex-wrap:wrap; align-items:center } */
.replay-reference-page .reference-panel--personal .replay-stats-info {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
}

.replay-reference-page .reference-panel--personal .replay-stats-info .ribbon {
    position: relative !important;
    display: block !important;
    text-align: center !important;
    border-radius: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

/* 总伤害/数字: 参考 .ribbon_content { height:46px; line-height:38px; color:#fff; min-width:120px; position:relative; z-index:2 } */
.replay-reference-page .reference-panel--personal .ribbon_content {
    display: block !important;
    min-width: 120px !important;
    height: 46px !important;
    line-height: 38px !important;
    color: #fff !important;
    position: relative !important;
    z-index: 2 !important;
    text-align: center !important;
    font-size: 45px !important;
    font-weight: 400 !important;
    padding-top: 4px !important;
    box-sizing: border-box !important;
}

.replay-reference-page .reference-panel--personal .ribbon_base,
.replay-reference-page .reference-panel--personal .ribbon-base {
    display: inline-block !important;
    width: 110px !important;
    height: 42px !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    background-position: center !important;
    vertical-align: middle !important;
}

.replay-reference-page .reference-panel--personal .ribbon_content p {
    position: absolute !important;
    /* v25: top 22.5px 使数字底边与 ribbon 图片下端对齐(实测 p.bottom 比 base.bottom 高 1.3px) */
    top: 22.5px !important;
    right: 0 !important;
    transform: none !important;
    margin: 0 !important;
    color: #fff !important;
    font-family: WarHeliosCondCBold, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 25px !important;
    text-align: right !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .8) !important;
}

/* 勋带标题: 参考 .ribbon_title { font-size:15px; color:#9cbaba; line-height:18px; text-align:center } */
.replay-reference-page .reference-panel--personal .ribbon_title {
    display: block !important;
    color: #9cbaba !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    text-align: center !important;
    margin-top: 2px !important;
}

/* =====================================================================
   Tab 2 · 团队成绩 —— 参考 .replay-tab-post-battle-team
   ===================================================================== */

.replay-reference-page .reference-panel--team {
    padding: 0 !important;
}

.replay-reference-page .reference-panel--team .replay-teams {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 2px !important;
    /* 表格自适应宽度：两表按内容伸缩，长船名可撑开，整体居中 */
    width: auto !important;
    max-width: 100% !important;
    margin: 40px auto 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

.replay-reference-page .reference-panel--team .replay-team {
    /* 参考页：.replay-team{width:667px} —— 两表强制等宽，内容溢出由容器裁剪，保证左右完全对称 */
    flex: 0 0 667px !important;
    min-width: 0 !important;
    width: 667px !important;
    max-width: 100% !important;
    margin: 0 2px 0 0 !important;
    box-sizing: border-box !important;
    font-size: 16px !important;
    overflow: hidden !important;
}

@media (max-width: 1400px) {
    .replay-reference-page .reference-panel--team .replay-teams {
        width: 100% !important;
        max-width: 100% !important;
        margin: 25px 0 0 !important;
    }
    .replay-reference-page .reference-panel--team .replay-team {
        flex: 1 1 50% !important;
        width: auto !important;
        max-width: 667px !important;
        margin: 0 2px 0 0 !important;
    }
}

/* 仅在极窄屏幕（移动端）才上下排列 */
@media (max-width: 700px) {
    .replay-reference-page .reference-panel--team .replay-teams {
        flex-wrap: wrap !important;
    }
    .replay-reference-page .reference-panel--team .replay-team {
        flex: 1 1 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }
    /* 表格固定 10 列 + 667px 内容在 <700px 任何竖屏手机都放不下，让表格内部横向滚动 */
    .replay-reference-page .reference-panel--team .replay-team__table {
        display: block !important;
        width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
    .replay-reference-page .reference-panel--team .replay-team__table thead,
    .replay-reference-page .reference-panel--team .replay-team__table tbody {
        display: table !important;
        width: 100% !important;
        table-layout: fixed !important;
    }
}

.replay-reference-page .reference-panel--team .replay-team__table {
    /* table-layout fixed：列宽严格按 colgroup 比例分配。
       auto 布局下列宽由内容驱动（长用户名/船名会把 exp/frags/planes 等列挤压变窄），
       导致两侧镜像列宽不一致（实测 exp 我方 49 vs 敌方 51）。fixed 下两侧完全等宽。 */
    table-layout: fixed !important;
    width: 100% !important;
    min-width: 0 !important;
    border-collapse: collapse !important;
    font-size: 16px !important;
    background: transparent !important;
}

.replay-reference-page .reference-panel--team .replay-team__table.team-allies thead {
    background: linear-gradient(135deg, rgba(14, 117, 98, .8), rgba(14, 117, 98, .4)) !important;
}

.replay-reference-page .reference-panel--team .replay-team__table.team-enemies thead {
    background: linear-gradient(135deg, rgba(154, 53, 46, .8), rgba(154, 53, 46, .4)) !important;
}

/* Th/td 基础规则（specificity 0,3,1 = .replay-reference-page .reference-panel--team .replay-team__table + th/td）
   后续 .team-table__team 规则用更高 specificity 覆盖"我方/敌方"标题 */
.replay-reference-page .reference-panel--team .replay-team__table th,
.replay-reference-page .reference-panel--team .replay-team__table td {
    padding: 3px 0 0 !important;
    color: #eee !important;
    text-shadow: 2px 2px 6px #000 !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    vertical-align: middle !important;
    font-size: 16px !important;
    line-height: 1 !important;
    height: 32px !important;  /* 参考页 thead 高 32px */
}

/* achievements 列允许 tooltip 溢出显示（不被 overflow:hidden 裁剪） */
.replay-reference-page .reference-panel--team .replay-team__table td.team-table__achievements {
    overflow: visible !important;
}

/* "我方"/"敌方" 标题：用更高 specificity（多一个 .replay-team__table）确保胜出 */
.replay-reference-page .reference-panel--team .replay-team__table th.team-table__team {
    color: #f5f5f5 !important;
    padding: 1px 0 0 !important;
    font-weight: 400 !important;
    font-family: WarHeliosCondCBold, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 18px !important;
    text-align: left !important;
    height: 32px !important;
}

.replay-reference-page .reference-panel--team .replay-team__table.team-enemies th,
.replay-reference-page .reference-panel--team .replay-team__table.team-enemies td {
    text-align: right !important;
}

/* 敌方数字列/squad/rank 保持 center —— 参考页实测：数字列双方都 center，仅文字/图片列 right。
   specificity 0,5,1 压过上方 .team-enemies td (0,4,1)，保证两侧数字列对齐方式完全对称 */
.replay-reference-page .reference-panel--team .replay-team__table.team-enemies td.team-table__frags,
.replay-reference-page .reference-panel--team .replay-team__table.team-enemies td.team-table__exp,
.replay-reference-page .reference-panel--team .replay-team__table.team-enemies td.team-table__ship_level,
.replay-reference-page .reference-panel--team .replay-team__table.team-enemies td.team-table__squad,
.replay-reference-page .reference-panel--team .replay-team__table.team-enemies td.team-table__rank {
    text-align: center !important;
}

.replay-reference-page .reference-panel--team .replay-team__table tbody tr:nth-of-type(odd) {
    background-color: rgba(0, 0, 0, .1) !important;
}

.replay-reference-page .reference-panel--team .replay-team__table tbody tr:nth-of-type(2n) {
    background-color: rgba(0, 0, 0, .2) !important;
}

.replay-reference-page .reference-panel--team .replay-team__table tbody tr:hover {
    background: hsla(0, 0%, 100%, .05) !important;
    transform: scale(1.01) !important;
}

.replay-reference-page .reference-panel--team .replay-team__table.team-enemies th.team-table__team {
    text-align: right !important;
}

.replay-reference-page .reference-panel--team .team-table__icons {
    height: 31px !important;
    position: relative !important;
    text-align: center !important;
    background-position: 50% !important;
    background-repeat: no-repeat !important;
}

/* 敌方表头图标保持居中 —— 参考页图标用 background:50% 定位，两侧视觉都居中；
   .team-enemies th 的 right 会覆盖 .team-table__icons 的 center (0,3,0)，
   用 0,5,1 压过 .team-enemies th (0,4,1)，保证两侧表头图标对称居中 */
.replay-reference-page .reference-panel--team .replay-team__table.team-enemies th.team-table__icons {
    text-align: center !important;
}

.replay-reference-page .reference-panel--team .team-table__icons.team-icon__frags::before {
    content: "" !important;
    display: inline-block !important;
    width: 21px !important;
    height: 21px !important;
    background: url('/assets/replayswows/team-icons/icon-frags.webp') 50%/contain no-repeat !important;
    background-image: -webkit-image-set(url('/assets/replayswows/team-icons/icon-frags.webp') 1x, url('/assets/replayswows/team-icons/icon-frags.webp') 1x) !important;
}

.replay-reference-page .reference-panel--team .team-table__icons.team-icon__planes::before {
    content: "" !important;
    display: inline-block !important;
    width: 21px !important;
    height: 21px !important;
    background: url('/assets/replayswows/team-icons/icon-planes.webp') 50%/contain no-repeat !important;
    background-image: -webkit-image-set(url('/assets/replayswows/team-icons/icon-planes.webp') 1x, url('/assets/replayswows/team-icons/icon-planes.webp') 1x) !important;
}

.replay-reference-page .reference-panel--team .team-table__icons.team-icon__exp::before {
    content: "" !important;
    display: inline-block !important;
    width: 21px !important;
    height: 21px !important;
    background: url('/assets/replayswows/team-icons/icon-exp.webp') 50%/contain no-repeat !important;
    background-image: -webkit-image-set(url('/assets/replayswows/team-icons/icon-exp.webp') 1x, url('/assets/replayswows/team-icons/icon-exp.webp') 1x) !important;
}

.replay-reference-page .reference-panel--team .team-table__icons.team-icon__achievements::before {
    content: "" !important;
    display: inline-block !important;
    width: 21px !important;
    height: 21px !important;
    background: url('/assets/replayswows/team-icons/icon-achievements.webp') 50%/contain no-repeat !important;
    background-image: -webkit-image-set(url('/assets/replayswows/team-icons/icon-achievements.webp') 1x, url('/assets/replayswows/team-icons/icon-achievements.webp') 1x) !important;
}

.replay-reference-page .reference-panel--team .team-table__icons.active,
.replay-reference-page .reference-panel--team .team-table__icons:hover {
    background-color: hsla(0, 2%, 80%, .3) !important;
}

/* exp/frags/planes/achievements 表头 active 排序指示器：参考页 ::after 背景透明，无可见短横条 */
.replay-reference-page .reference-panel--team .team-table__icons.active::after {
    content: "" !important;
    width: 0 !important;
    height: 0 !important;
    display: block !important;
    position: absolute !important;
    bottom: 0 !important;
    background: transparent !important;
}

.replay-reference-page .reference-panel--team .team-allies .team-table__icons.active::after {
    left: 2px !important;
}

.replay-reference-page .reference-panel--team .team-enemies .team-table__icons.active::after {
    right: 2px !important;
}

.replay-reference-page .reference-panel--team .team-table__username {
    padding: 3px 0 0 !important;
    text-align: left !important;
}

.replay-reference-page .reference-panel--team .team-enemies .team-table__username {
    text-align: right !important;
}

.replay-reference-page .reference-panel--team .team-table__squad {
    text-align: center !important;
    text-shadow: none !important;
}

/* rank 徽章列：参考页 .team-table__rank{text-align:center} 双方都居中 */
.replay-reference-page .reference-panel--team .team-table__rank {
    text-align: center !important;
}

.replay-reference-page .reference-panel--team .team-table__ship_image {
    text-align: left !important;
    height: 34px !important;
}

.replay-reference-page .reference-panel--team .team-enemies .team-table__ship_image {
    text-align: right !important;
}

.replay-reference-page .reference-panel--team .team-table__ship_image img {
    width: 109px !important;
    height: 20px !important;
    object-fit: contain !important;
    vertical-align: middle !important;
    display: inline-block !important;
}

.replay-reference-page .reference-panel--team .team-table__ship_level,
.replay-reference-page .reference-panel--team .team-table__frags {
    text-align: center !important;
}

.replay-reference-page .reference-panel--team .player-rank-badge {
    display: inline-block !important;
    width: 26px !important;
    height: 26px !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: 50% !important;
    vertical-align: middle !important;
}

/* .player-rank-star 不再渲染（用户反馈不需要），CSS 规则保留占位防止误用 */

.replay-reference-page .reference-panel--team .team-table__ship_name {
    text-align: left !important;
}

.replay-reference-page .reference-panel--team .team-enemies .team-table__ship_name {
    text-align: right !important;
}

.replay-reference-page .reference-panel--team .team-table__exp {
    text-align: center !important;
}

.replay-reference-page .reference-panel--team .team-table__achievements {
    text-align: center !important;
}

.replay-reference-page .reference-panel--team .achievement-icon {
    display: inline-block !important;
    width: 21px !important;
    height: 21px !important;
    margin: 3px auto 0 !important;
    background: #f59e3c !important;
    -webkit-clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%) !important;
    clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%) !important;
}

/* 己方金色 / 死亡深色：specificity 0,4,1 压过 .replay-team__table td 的 color:#eee (0,3,1)，
   与参考页一致 —— 参考页 FontColorGolden #fc6、FontColorStrongBlueish #758b8b。
   死亡行（舰船剪影为深色）所有文字/数字列（用户名/等级/船名/击沉/飞机/经验）变为深灰蓝 */
.replay-reference-page .reference-panel--team .replay-team__table td.FontColorGolden {
    color: #fc6 !important;
}

.replay-reference-page .reference-panel--team .replay-team__table td.FontColorStrongBlueish {
    color: #758b8b !important;
}

/* =====================================================================
   Tab 3 · 详细统计 —— 参考 .replay-tab-post-battle
   ===================================================================== */

.replay-reference-page .reference-panel--detailed {
    padding: 0 !important;
    /* 覆盖全局的 grid 3 列布局(全局 grid-template-columns: 408px 408px 408px 导致 row 被压缩为 408px)；
       改为 block 让 row 拿满 1284px，内部 flex 3 列横排 */
    display: block !important;
}

.replay-reference-page .reference-panel--detailed .row.replay-post-battle-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    padding: 40px 0 !important;
    margin: 0 !important;
}

.replay-reference-page .reference-panel--detailed .replay-post-battle__column {
    flex: 1 1 300px !important;
    min-width: 0 !important;
    padding: 0 2px 0 0 !important;
    box-sizing: border-box !important;
}

.replay-reference-page .reference-panel--detailed .post-battle-section {
    border: 1px solid hsla(0, 0%, 100%, .1) !important;
    background: hsla(0, 0%, 100%, .02) !important;
    margin: 0 0 12px !important;
    overflow: hidden !important;
    text-shadow: 1px 1px #000 !important;
}

.replay-reference-page .reference-panel--detailed .post-battle-section:last-child {
    margin-bottom: 0 !important;
}

.replay-reference-page .reference-panel--detailed .post-battle-row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 4px 12px !important;
    line-height: 1.4 !important;
    border-bottom: 1px solid hsla(0, 0%, 100%, .08) !important;
}

.replay-reference-page .reference-panel--detailed .post-battle-row:last-child {
    border-bottom: none !important;
}

.replay-reference-page .reference-panel--detailed .post-battle-row__title {
    flex: 1 !important;
    min-width: 0 !important;
}

.replay-reference-page .reference-panel--detailed .post-battle-row__value {
    flex-shrink: 0 !important;
    text-align: right !important;
    margin-left: 12px !important;
}

.replay-reference-page .reference-panel--detailed .post-battle-row--header {
    padding: 6px 12px !important;
    background: hsla(0, 0%, 100%, .55) !important;
    border-bottom: 1px solid hsla(0, 0%, 100%, .08) !important;
    font-weight: 600 !important;
    color: #fff !important;
    text-transform: uppercase !important;
    font-size: 18px !important;
}

.replay-reference-page .reference-panel--detailed .post-battle-row--header .post-battle-row__title,
.replay-reference-page .reference-panel--detailed .post-battle-row--header .post-battle-row__value {
    color: #fff !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
}

.replay-reference-page .reference-panel--detailed .post-battle-row--subheader {
    padding: 4px 12px !important;
    background: hsla(0, 0%, 100%, .22) !important;
    color: #e8eef0 !important;
    font-size: 16px !important;
}

.replay-reference-page .reference-panel--detailed .post-battle-row--subheader .post-battle-row__title,
.replay-reference-page .reference-panel--detailed .post-battle-row--subheader .post-battle-row__value {
    color: #e8eef0 !important;
    font-size: 16px !important;
}

.replay-reference-page .reference-panel--detailed .post-battle-row--detail {
    padding: 4px 12px 4px 26px !important;
    color: #aab2b6 !important;
    font-size: 16px !important;
    background: transparent !important;
}

.replay-reference-page .reference-panel--detailed .post-battle-row--detail .post-battle-row__title,
.replay-reference-page .reference-panel--detailed .post-battle-row--detail .post-battle-row__value {
    color: #aab2b6 !important;
    font-size: 16px !important;
}

.replay-reference-page .reference-panel--detailed .replay-post-battle__column--received .post-battle-row--header {
    background: rgba(178, 82, 69, .18) !important;
}

.replay-reference-page .reference-panel--detailed .replay-post-battle__column--received .post-battle-row--header .post-battle-row__title {
    color: #e8a394 !important;
}

/* =====================================================================
   Tab 4 · 经济 —— 参考 .replay-tab-content[data-ng-tab=economy] .rb-economy-grid
   ===================================================================== */

.replay-reference-page .reference-panel--economy {
    padding: 0 !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
    padding: 40px 0 !important;
}

@media (max-width: 900px) {
    .replay-reference-page .reference-panel--economy .rb-economy-grid {
        grid-template-columns: 1fr !important;
    }
}

.replay-reference-page .reference-panel--economy .rb-economy-side {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    min-width: 0 !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-side--inactive {
    opacity: .4 !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-card {
    border: 1px solid hsla(0, 0%, 100%, .1) !important;
    background: hsla(0, 0%, 100%, .02) !important;
    display: flex !important;
    flex-direction: column !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-card__header {
    display: grid !important;
    grid-template-columns: 1fr auto auto !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 8px 10px !important;
    background: hsla(0, 0%, 100%, .55) !important;
    border-bottom: 1px solid hsla(0, 0%, 100%, .18) !important;
    font-weight: 800 !important;
    color: #fff !important;
    text-transform: uppercase !important;
    font-size: 18px !important;
    line-height: 18px !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-side--wp .rb-economy-card__header {
    background: hsla(43, 83%, 75%, .1) !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-card__title {
    font-family: WarHeliosCondCBold, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 16px !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
    color: #f3efe6 !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-card__side-label {
    font-family: WarHeliosCondC, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 13px !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    color: hsla(42, 35%, 93%, .55) !important;
    font-weight: 400 !important;
    white-space: nowrap !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-card__factor {
    font-family: WarHeliosCondCBold, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 12px !important;
    color: hsla(42, 35%, 93%, .65) !important;
    white-space: nowrap !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-row {
    display: grid !important;
    grid-template-columns: 12px 1fr auto auto !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0 10px !important;
    border-bottom: 1px solid hsla(0, 0%, 100%, .1) !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-row:last-child {
    border-bottom: none !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-row__caret {
    font-size: 9px !important;
    color: hsla(42, 35%, 93%, .45) !important;
    line-height: 1 !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-row__title {
    font-family: WarHeliosCondC, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 14px !important;
    color: hsla(42, 35%, 93%, .78) !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-row__factor {
    font-family: WarHeliosCondCBold, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 14px !important;
    color: hsla(42, 35%, 93%, .55) !important;
    text-align: right !important;
    white-space: nowrap !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-cell {
    font-family: WarHeliosCondCBold, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 15px !important;
    color: #f3efe6 !important;
    text-align: right !important;
    white-space: nowrap !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-row--subheader {
    padding: 0 10px !important;
    background: hsla(0, 0%, 100%, .22) !important;
    color: #e8eef0 !important;
    font-size: 16px !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-row--subheader .rb-economy-row__title {
    font-size: 13px !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    color: #f3efe6 !important;
    font-weight: 700 !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-row--subheader .rb-economy-cell {
    font-weight: 700 !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-row--detail {
    padding-left: 22px !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-row--detail .rb-economy-row__title {
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-weight: 400 !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-row--total {
    padding: 0 10px !important;
    background: hsla(0, 0%, 100%, .06) !important;
    border-top: 1px solid hsla(0, 0%, 100%, .18) !important;
    border-bottom: none !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-row--total .rb-economy-row__title {
    font-size: 13px !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
    color: #f3efe6 !important;
    font-weight: 700 !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-row--total .rb-economy-cell {
    font-family: WarHeliosCondCBold, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

.replay-reference-page .reference-panel--economy .rb-economy-side--wp .rb-economy-card__header .rb-economy-card__side-label,
.replay-reference-page .reference-panel--economy .rb-economy-side--wp .rb-economy-row--total .rb-economy-cell {
    color: #f4d68a !important;
}

.replay-reference-page .reference-panel--economy .report-raw-details {
    margin-top: 25px !important;
    border: 0 !important;
    background: transparent !important;
}

/* v19c: 地图背景图可见（减淡遮罩）+ 文字阴影保护可读性 */
.replay-hero-backdrop {
    background-image:
        linear-gradient(180deg, rgba(25,32,40,.42) 0%, rgba(0,0,0,.22) 28%, rgba(0,0,0,.12) 55%, rgba(25,32,40,.55) 78%, rgba(25,32,40,.78) 100%),
        var(--replay-hero-bg);
}
.replay-hero--visual .replay-hero-content {
    text-shadow: 0 1px 2px rgba(0,0,0,.85), 0 0 10px rgba(0,0,0,.5);
}

/* v19s: 整页背景图 = 地图图（精准替换 replay-report-bg.jpg 的引用；渐变/内容卡片保持原样） */
.replay-reference-shell {
    background:
        linear-gradient(rgba(25,32,40,.82), rgba(25,32,40,.95)),
        var(--map-bg, url('/assets/replayswows/replay-report-bg.webp')) center top / cover no-repeat !important;
}
.replay-reference-page::before {
    background:
        linear-gradient(rgba(25,32,40,.80) 0%, rgba(0,0,0,.60) 5%, rgba(0,0,0,.19) 45%, rgba(0,0,0,.19) 65%, rgba(25,32,40,.90) 90%, #192028 100%),
        var(--map-bg, url('/assets/replayswows/replay-report-bg.webp')) center top / cover no-repeat !important;
}

/* v19y: 三个 replay 侧边卡横排一行（仅 sidebar 容器；app.css:7179 本为 3 列，被 replay-directory-fix.css 覆盖成 2 列——此处恢复并限定，不碰 .replay-detail-main） */
@media (min-width: 781px) {
    .replay-reference-shell .replay-detail-main > .replay-detail-sidebar--below {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 16px !important;
        width: 100% !important;
        margin-top: 28px !important;
    }
    .replay-reference-shell .replay-detail-main > .replay-detail-sidebar--below > .detail-side-card {
        grid-column: auto !important;
        margin: 0 !important;
    }
}

/* v19z: .replay-reference-shell 透明——它原带深色渐变+replay-report-bg.jpg（app.css:6212），盖住了 ::before 整页地图背景 */
.replay-reference-shell {
    background: transparent !important;
}


}

/* v20d: 成就 medal 参考站样式（60x60 纯背景图 + hover 悬浮说明，无背景色） */
.replay-reference-page .reference-panel--personal .rb-received__medal {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    position: relative !important;
}
.replay-reference-page .reference-panel--personal .rb-received__medal-img {
    width: 46px !important;
    height: 46px !important;
    display: block !important;
    background-color: transparent !important;
    background-size: contain !important;
    background-position: 50% !important;
    background-repeat: no-repeat !important;
    flex-shrink: 0 !important;
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .6)) !important;
}



/* v20d: 无图 medal 的中文名样式（金色小字，作为 fallback） */
.replay-reference-page .reference-panel--personal .rb-received__medal .rb-received__medal-name {
    font-size: .72rem !important;
    font-weight: 700 !important;
    color: #ffd98a !important;
    letter-spacing: .03em !important;
    white-space: nowrap !important;
    text-align: center !important;
    max-width: 100px !important;
}
/* hover tooltip */
.replay-reference-page .reference-panel--personal .rb-received__medal .rb-received__medal-tip {
    display: none !important;
    position: absolute !important;
    bottom: calc(100% + 10px) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 50 !important;
    min-width: 210px !important;
    max-width: 280px !important;
    padding: 10px 12px !important;
    background: rgba(22, 26, 29, .97) !important;
    border: 1px solid rgba(255, 217, 138, .35) !important;
    border-radius: 6px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .55) !important;
    text-align: left !important;
}
.replay-reference-page .reference-panel--personal .rb-received__medal .rb-received__medal-tip b {
    display: block !important;
    font-size: .82rem !important;
    font-weight: 700 !important;
    color: #ffd98a !important;
    letter-spacing: .03em !important;
}
.replay-reference-page .reference-panel--personal .rb-received__medal .rb-received__medal-tip em {
    display: block !important;
    font-style: normal !important;
    font-size: .62rem !important;
    color: rgba(255, 255, 255, .55) !important;
    margin: 1px 0 6px !important;
    letter-spacing: .06em !important;
}
.replay-reference-page .reference-panel--personal .rb-received__medal .rb-received__medal-tip > span:last-child {
    display: block !important;
    font-size: .68rem !important;
    line-height: 1.45 !important;
    color: rgba(255, 255, 255, .82) !important;
}
.replay-reference-page .reference-panel--personal .rb-received__medal:hover .rb-received__medal-tip {
    display: block !important;
}

/* v20d: 聚合 ribbon（主炮命中）hover 悬浮显示子项明细，参考 replayswows ribbons-list tooltip */
.replay-reference-page .reference-panel--personal .ribbon--grouped {
    position: relative !important;
}
.replay-reference-page .reference-panel--personal .ribbon--grouped .ribbon-tip {
    display: none !important;
    position: absolute !important;
    bottom: calc(100% + 8px) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 60 !important;
    min-width: 230px !important;
    padding: 10px 12px !important;
    background: rgba(22, 26, 29, .97) !important;
    border: 1px solid rgba(255, 217, 138, .35) !important;
    border-radius: 6px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .55) !important;
    text-align: left !important;
}
.replay-reference-page .reference-panel--personal .ribbon--grouped:hover .ribbon-tip {
    display: block !important;
}
.replay-reference-page .reference-panel--personal .ribbon-tip__head {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding-bottom: 8px !important;
    border-bottom: 1px solid rgba(255, 255, 255, .12) !important;
    margin-bottom: 8px !important;
}
.replay-reference-page .reference-panel--personal .ribbon-tip__head-icon {
    width: 66px !important;
    height: 26px !important;
    background-size: contain !important;
    background-position: 50% !important;
    background-repeat: no-repeat !important;
    flex-shrink: 0 !important;
}
.replay-reference-page .reference-panel--personal .ribbon-tip__head-text b {
    display: block !important;
    font-size: .82rem !important;
    font-weight: 700 !important;
    color: #ffd98a !important;
    letter-spacing: .03em !important;
}
.replay-reference-page .reference-panel--personal .ribbon-tip__head-text em {
    font-style: normal !important;
    font-size: .72rem !important;
    color: rgba(255, 255, 255, .85) !important;
}
.replay-reference-page .reference-panel--personal .ribbon-tip__line {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 3px 0 !important;
}
.replay-reference-page .reference-panel--personal .ribbon-tip__line-icon {
    width: 34px !important;
    height: 26px !important;
    background-size: contain !important;
    background-position: 50% !important;
    background-repeat: no-repeat !important;
    flex-shrink: 0 !important;
}
.replay-reference-page .reference-panel--personal .ribbon-tip__line-label {
    flex: 1 !important;
    font-size: .7rem !important;
    color: rgba(255, 255, 255, .82) !important;
}
.replay-reference-page .reference-panel--personal .ribbon-tip__line-count {
    font-size: .72rem !important;
    font-weight: 700 !important;
    color: #fff !important;
}

/* v20e: 成就目录分类标签导航 + 卡片分类徽标 */
.catalog-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 18px;
    padding: 10px 12px;
    background: rgba(9, 24, 38, .55);
    border: 1px solid rgba(167, 210, 232, .18);
    border-radius: 10px;
}
.catalog-tab {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    font-size: .82rem;
    font-weight: 600;
    letter-spacing: .03em;
    color: rgba(217, 233, 241, .75);
    background: rgba(255, 255, 255, .04);
    border: 1px solid rgba(167, 210, 232, .16);
    border-radius: 20px;
    text-decoration: none;
    transition: all .15s ease;
}
.catalog-tab:hover {
    color: #fff;
    background: rgba(255, 255, 255, .09);
    border-color: rgba(255, 217, 138, .35);
    text-decoration: none;
}
.catalog-tab.is-active {
    color: #0a1723;
    background: #ffd98a;
    border-color: #ffd98a;
    box-shadow: 0 2px 10px rgba(255, 217, 138, .35);
}
.catalog-tab-count {
    font-size: .68rem;
    font-weight: 700;
    padding: 1px 7px;
    border-radius: 10px;
    background: rgba(255, 255, 255, .14);
    color: inherit;
}
.catalog-tab.is-active .catalog-tab-count {
    background: rgba(10, 23, 35, .18);
    color: inherit;
}
.catalog-achievement-card .catalog-card-type-badge {
    position: absolute;
    top: 8px;
    left: 8px;
    padding: 3px 9px;
    font-size: .64rem;
    font-weight: 700;
    letter-spacing: .05em;
    color: #0a1723;
    background: rgba(255, 217, 138, .92);
    border-radius: 3px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .45);
    z-index: 2;
}

/* v20g: replay-card 系别旗帜铺满背景层（舰船图叠其上；WG 官方 nation flag） */
.replay-card-media {
    position: relative !important;
}
.replay-card-media .replay-card-nation-flag {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    z-index: 0 !important;
    pointer-events: none !important;
    filter: brightness(.5) saturate(.9) contrast(1.05) !important;
}
/* 舰船图叠在旗帜之上（app.css 未给 img 设 z-index，此处显式抬高） */
.replay-card-media > img:not(.replay-card-nation-flag) {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    z-index: 1 !important;
}
/* 暗色渐变遮罩仍覆盖最上层，保证文字可读 */
.replay-card-media .replay-card-shade {
    z-index: 2 !important;
}
.replay-card-media .outcome-badge,
.replay-card-media .replay-video-badge,
.replay-card-media .replay-demo-badge,
.replay-card-media .replay-card-tier {
    z-index: 3 !important;
}

/* ============ v20i 追加：数字分页样式（catalog-pagination） ============ */
.catalog-pagination {
    display: flex;
    justify-content: center;
    margin-top: 28px;
}
.catalog-pagination-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.catalog-pagination-item .catalog-pagination-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    font-size: .85rem;
    font-weight: 600;
    color: rgba(217, 233, 241, .75);
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(167, 210, 232, .18);
    border-radius: 6px;
    text-decoration: none;
    transition: all .15s ease;
}
.catalog-pagination-item .catalog-pagination-link:hover {
    color: #fff;
    background: rgba(255, 255, 255, .12);
    border-color: rgba(255, 217, 138, .4);
    text-decoration: none;
}
.catalog-pagination-item.active .catalog-pagination-link {
    color: #0a1723;
    background: #ffd98a;
    border-color: #ffd98a;
    box-shadow: 0 2px 10px rgba(255, 217, 138, .3);
}
.catalog-pagination-item.disabled .catalog-pagination-link {
    opacity: .35;
    cursor: not-allowed;
    pointer-events: none;
}
.catalog-pagination-item .catalog-pagination-ellipsis {
    background: transparent;
    border-color: transparent;
}

/* ============ v20m 追加：tab 居中按 5 tab 宽度设计 + 团队排序 + 成就 tooltip ============ */

/* Tab 条：固定 1000px 居中；tab 用 flex 均分（4 个时各 250px 占满无空白，5 个含 video 时各 200px） */
.replay-reference-page .reference-report-tabs {
    display: flex !important;
    width: 1000px !important;
    max-width: 100% !important;
    margin: 40px auto 0 !important;
}

.replay-reference-page .reference-report-tabs .detail-tab {
    flex: 1 1 0 !important;
    width: auto !important;
    max-width: none !important;
}

/* 极窄屏 tab 缩小 */
@media (max-width: 1100px) {
    .replay-reference-page .reference-report-tabs {
        width: 100% !important;
    }
    .replay-reference-page .reference-report-tabs .detail-tab {
        flex: 1 1 0 !important;
        width: auto !important;
        max-width: none !important;
    }
}

/* 可排序列（frags/planes/exp）表头：cursor + 排序态 */
.replay-reference-page .reference-panel--team .team-table__icons[data-sort-key] {
    cursor: pointer !important;
}

.replay-reference-page .reference-panel--team .team-table__icons[data-sort-key]:hover {
    background-color: hsla(0, 2%, 80%, .25) !important;
}

.replay-reference-page .reference-panel--team .team-table__icons[data-sort-key].active {
    background-color: hsla(0, 2%, 80%, .3) !important;
}

/* 成就：单个图标 + hover 弹出成就列表（参考 replayswows .tip.achievements_tooltip） */
.replay-reference-page .reference-panel--team .team-table__achievements {
    position: relative !important;
}

.replay-reference-page .reference-panel--team .achievement-trigger {
    position: relative !important;
    display: inline-block !important;
    width: 21px !important;
    height: 21px !important;
    cursor: pointer !important;
}

/* 成就主项图标：<img> 标签引用 base64 PNG（透明背景 + 青色勋章图） */
/* 成就主项图标：参考站同款深灰勋章 PNG（透明背景 + 白色描边 + 深灰图案），原样 21×21 显示 */
.replay-reference-page .reference-panel--team .achievement-trigger img.achievement-icon {
    display: inline-block !important;
    width: 21px !important;
    height: 21px !important;
    vertical-align: middle !important;
    /* 深色背景上深灰不可见 → 浅色圆底模拟参考站浅背景 */
    background: rgba(255, 255, 255, .18) !important;
    border-radius: 50% !important;
    padding: 0 !important;
    -webkit-clip-path: none !important;
    clip-path: none !important;
    margin: 0 !important;
    filter: none !important;
    mix-blend-mode: normal !important;
}

.replay-reference-page .reference-panel--team .achievement-trigger .achievement-count {
    position: absolute !important;
    top: -5px !important;
    right: -5px !important;
    min-width: 13px !important;
    height: 13px !important;
    padding: 0 3px !important;
    border-radius: 7px !important;
    background: #e8562d !important;
    color: #fff !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    line-height: 13px !important;
    text-align: center !important;
    text-shadow: none !important;
}

/* hover 弹出成就列表（内嵌版隐藏，由 JS 克隆到 body 层 .achievements-tooltip-pop 显示） */
.replay-reference-page .reference-panel--team .achievement-trigger .achievements-tooltip {
    display: none !important;
}

/* body 级成就浮层（position fixed + 高 z-index，脱离表格 stacking context） */
.replay-reference-page .achievements-tooltip-pop {
    position: fixed !important;
    z-index: 99999 !important;
    display: none !important;
    min-width: 300px !important;
    max-width: 380px !important;
    max-height: 320px !important;
    overflow-y: auto !important;
    padding: 8px 10px !important;
    background: rgba(9, 24, 38, .97) !important;
    border: 1px solid rgba(167, 210, 232, .3) !important;
    border-radius: 6px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .6) !important;
    text-shadow: none !important;
}

/* 显示态：靠 JS 添加 .show 类（inline style 会被上面的 !important display:none 覆盖，
   所以必须用同类优先级的选择器来打开） */
.replay-reference-page .achievements-tooltip-pop.show {
    display: block !important;
}

.replay-reference-page .achievements-tooltip-pop .achievement_image {
    position: relative !important;
    padding: 4px 6px 4px 44px !important;
    min-height: 36px !important;
    background-color: transparent !important;
    background-position: 4px 50% !important;
    background-size: 30px 30px !important;
    background-repeat: no-repeat !important;
    border-bottom: 1px solid hsla(0, 0%, 100%, .08) !important;
}

.replay-reference-page .achievements-tooltip-pop .achievement_image:last-child {
    border-bottom: 0 !important;
}

.replay-reference-page .achievements-tooltip-pop .achievement_image .achievement-name {
    display: block !important;
    color: #ffd98a !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    text-shadow: none !important;
}

.replay-reference-page .achievements-tooltip-pop .achievement_image .achievement-desc {
    display: block !important;
    color: #c8d4d8 !important;
    font-size: 11px !important;
    line-height: 1.4 !important;
    font-weight: 400 !important;
    text-shadow: none !important;
    margin-top: 1px !important;
}

/* 组队字母（同队同字母，参考 replayswows squad_index） */
.replay-reference-page .reference-panel--team .team-table__squad .squad-letter {
    width: 13px !important;
    height: 18px !important;
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAASCAYAAACAa1QyAAABqklEQVR42p2RuWoCURSGhxTa5Q3CFBKSRzBY2WnvG1hZ+QghjyBWlvaC27jv+74hCoIgo0hEsLCwsjiZ/+KZcQgSyIWDOvP93/3vVZIkyfmPkZyXy4V4zucznU4nOhwOtN/vabfbkaqqYpbLJZlC0WhUTCwWo3g8TolEghRFoVQqRel0Wsx8PjdCx+NRgAwnk0kRAJjJZCiXy1E+nzfvxCGGYQeczWYFXCgUqFQqmXdCdwS4yr29WCxSuVymSqVCk8nECG2324d2BKrVKtXrdRoMBkZos9kIGHbA9/ZarUaNRoOazSZ1Oh0jtF6v9SqwA2Y74FarJQII66HVamWqwnbA7Xabut0u9Xo9IdNDi8VCr8J2wLAD7vf7NBwORXU9NJvNBMx2wLADxuFHoxGNx2NxUXoID7gK2wHDjne4anzHf8ihN4/HE9DOckWIq8AOeDqdClkkErm63e4AeISetHm12WzecDis4jxs59rBYFCVZdkL7sbr68Vqtbr8fr+CS8GOuFGfz6dYLBYX3ksP1rM27w6H4ysUCn3b7fZP/L49/3PJ2nzcPn+tH4dcC8/84AerAAAAAElFTkSuQmCC') 50% no-repeat !important;
    text-align: center !important;
    color: #0f0f10 !important;
    font-family: WarHeliosCondCBold, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 13px !important;
    display: inline-block !important;
    line-height: 17px !important;
    vertical-align: middle !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    font-weight: 400 !important;
    text-shadow: none !important;
}

.replay-reference-page .reference-panel--team .team-table__squad .squad-letter.own {
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAASCAYAAACAa1QyAAACKElEQVR42p2PS08TUQCFJ5gQNupWFwQXoi5cuDAxboTRihWpQDu0OgVfNcQYifjYuDDGrQsT4i9wIVKptJZpGWmpFNTE4KMEFUtbmEJhaGspirhhcbz3ztiRqDHxJifzOt+XMxzHcfx/hOMLE9dQeH9dC7nPj19FLtaJ7NvLWHzdAXXsEosSPY910McHB1gmu2vw6WEt4j08ptwHkXx0CCmPieWPEAXiPbWkzCNBysleE6Y9hzHTdwRpr3k9lI9dKdkT1N5L7aT8uA6KlwC+o5h7Uo/pyFkDotvpFGpPUTsp/7TPknLGfwzzkgWJ0GkDUsc62BTDTsrUTsv9DViQjmMx2Ii43GpA868uMrvSZ0zJ+GnZAjXQiOxAE3KyFZMB0YDmXl7QpvxiVwOaPSc3I//UikJIwAe/w4DSo+2avV+3BzU7LX8etGEp1ILikB0TXsGAZoZd7EeZnU2hdhuzF8N2LEcc+PLsJMY9VgNKDZ1hU7IDzbpdwFKY2mn5BL4Oi/gWdeKdu8mAEoOnoMoCm1LQpyxHSJnYV6IiVkdaUYw48abbUoJ2ig3VXTGvfS0jk7JuX6H2ESdWR9uwIDvw4n79mmCq6qJ9CpWRVO/Yttnlu1eXVoJ2Yncy+/fnbVCkFrjv1KS3V2500Z7eL53KivIN5pvte6Skn0wNi5jy2XDj3G6porzMTL9zfzmbSHaZ9m297bvLq/zeLbfos/7+n6eKZL9+/e38AOzb0MgKdNUIAAAAAElFTkSuQmCC') no-repeat 50% !important;
}

/* v24: 整页大背景(地图图)模糊 — 取消毛玻璃后, 对 .replay-reference-page::before 背景层直接 blur
   注意: filter 会连带模糊层内渐变, 属预期(柔和压暗); margin 负值防 blur 边缘露底 */
.replay-reference-page::before {
    filter: blur(6px) saturate(0.95) !important;
    margin: -30px !important;
}

/* v25: tab 标题字号放大 (原 14px / span 11.2px -> 16px) */
.replay-reference-page .reference-report-tabs .detail-tab {
    font-size: 16px !important;
}
.replay-reference-page .reference-report-tabs .detail-tab span {
    font-size: 16px !important;
}

/* ============ v26b: 统一 tab 条与下方战报内容的间距 ============
   统一为 40px: tab-panels 提供基础 40px, 各 panel 内部去掉顶部间距
   (此前 team 被 @media(max-width:1400px) 覆盖成 25px, 各 tab 不一致) */
.replay-reference-page .reference-tab-panels {
    margin-top: 40px !important;
}
.replay-reference-page .reference-panel--personal .replay-hat {
    margin-top: 0 !important;
}
.replay-reference-page .reference-panel--team .replay-teams {
    margin-top: 0 !important;
}
.replay-reference-page .reference-panel--detailed .row.replay-post-battle-row {
    padding-top: 0 !important;
}
.replay-reference-page .reference-panel--economy .rb-economy-grid {
    padding-top: 0 !important;
}

/* ============ v27: ships 页舰船卡片国旗背景(与首页 replay-card 同规则) ============ */
.replay-reference-page .catalog-card-image,
.catalog-card-image {
    position: relative !important;
    overflow: hidden !important;
}
.catalog-card-image .catalog-card-nation-flag {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    z-index: 0 !important;
    pointer-events: none !important;
    filter: brightness(.5) saturate(.9) contrast(1.05) !important;
}
.catalog-card-image > img:not(.catalog-card-nation-flag) {
    position: relative !important;
    z-index: 1 !important;
}
.catalog-card-media-note {
    z-index: 2 !important;
}

/* ============ v29: related/players grid 统一为首页 replay-card 风格 ============ */
.replay-reference-page .related-grid,
.related-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 16px !important;
    margin-top: 16px !important;
}
.replay-reference-page .related-section,
.related-section {
    margin-top: 30px !important;
}
.replay-reference-page .related-heading,
.related-heading {
    margin: 0 0 4px !important;
    color: #e8f1f8 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
}
/* 旧 related-card 不再使用, 隐藏兜底 */
.replay-reference-page .related-card {
    display: none !important;
}
.player-replays-section {
    margin-top: 28px !important;
}
.player-replays-section h2 {
    margin: 0 0 12px !important;
    color: #e8f1f8 !important;
    font-size: 17px !important;
}
@media (max-width: 900px) {
    .replay-reference-page .related-grid,
    .related-grid {
        grid-template-columns: 1fr !important;
    }
}

/* ============ v30: related 恢复旧卡片样式 + 查看全部链接 ============ */
.replay-reference-page .related-card {
    display: block !important;
}
.replay-reference-page .related-grid {
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)) !important;
    gap: 12px !important;
    margin-top: 0 !important;
}
.replay-reference-page .related-card {
    background: rgba(18, 28, 38, .85) !important;
    border: 1px solid rgba(155, 179, 202, .18) !important;
    border-radius: 8px !important;
    padding: 12px 14px !important;
    transition: border-color .2s ease, box-shadow .2s ease !important;
}
.replay-reference-page .related-card:hover {
    border-color: rgba(136, 188, 229, .5) !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .3) !important;
}
.replay-reference-page .related-card-title {
    margin: 0 0 6px !important;
    font-size: 14px !important;
    line-height: 1.35 !important;
}
.replay-reference-page .related-card-title a {
    color: #e8f1f8 !important;
    text-decoration: none !important;
}
.replay-reference-page .related-card-title a:hover {
    color: #8fd0f2 !important;
}
.replay-reference-page .related-card-meta {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px 12px !important;
    color: rgba(181, 200, 216, .7) !important;
    font-size: 12px !important;
}
.replay-reference-page .related-view-all {
    display: inline-block !important;
    margin-top: 12px !important;
    color: #8fd0f2 !important;
    font-size: 13px !important;
    text-decoration: none !important;
    border-bottom: 1px dashed rgba(143, 208, 242, .45) !important;
}
.replay-reference-page .related-view-all:hover {
    color: #c5ecff !important;
}

/* ============ v31: ribbon 数字右下对齐(在 base 图内, 不超出) ============ */
.replay-reference-page .reference-panel--personal .ribbon_content .ribbon-base {
    position: relative !important;
}
.replay-reference-page .reference-panel--personal .ribbon_content .ribbon-base p {
    position: absolute !important;
    right: 2px !important;
    bottom: 2px !important;
    margin: 0 !important;
    color: #fff !important;
    font-family: WarHeliosCondCBold, "Arial Narrow", Tahoma, Arial, sans-serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 25px !important;
    text-align: right !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .85) !important;
}
/* 总伤害 ribbon_content (无 base) 数字保持原样 */
.replay-reference-page .reference-panel--personal .ribbon_content:not(:has(.ribbon-base)) {
    line-height: 38px !important;
    padding-top: 4px !important;
    font-size: 45px !important;
    font-weight: 400 !important;
}

/* ============ v31: 经济 tab 资源图标 ============ */
.replay-reference-page .reference-panel--economy .rb-economy-side--np .report-economy-side__name,
.replay-reference-page .reference-panel--economy .rb-economy-side--wp .report-economy-side__name {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
}
.replay-reference-page .reference-panel--economy .eco-icon {
    display: inline-block !important;
    width: 22px !important;
    height: 22px !important;
    vertical-align: middle !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    flex-shrink: 0 !important;
}
.replay-reference-page .reference-panel--economy .eco-icon--credits {
    background-image: url('/assets/replayswows/income.webp') !important;
}
.replay-reference-page .reference-panel--economy .eco-icon--ship_exp {
    background-image: url('/assets/replayswows/exp.webp') !important;
}
.replay-reference-page .reference-panel--economy .eco-icon--free_exp {
    background-image: url('/assets/replayswows/f_exp.webp') !important;
}
.replay-reference-page .reference-panel--economy .eco-icon--commander_exp {
    /* CSS 蓝色星 (无对应 png 图标) */
    background: radial-gradient(circle at 50% 55%, #b4e0ff 0%, #6cb8e8 45%, #2a7eb8 100%) !important;
    clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%) !important;
}

/* ============ v31: 单舰船伤害样式 ============ */
.replay-reference-page .reference-panel--detailed .post-battle-row--ship-damage-header {
    padding: 20px 0 6px !important;
    border-top: 1px solid rgba(155, 179, 202, .15) !important;
    margin-top: 10px !important;
}
.replay-reference-page .reference-panel--detailed .post-battle-row--ship-damage-header .post-battle-row__title {
    color: #ffd98a !important;
    font-weight: 700 !important;
    font-size: 15px !important;
}

/* ============ v32: 筛选器勾选框美化 (左勾选右文字, 小尺寸) ============ */
.replay-reference-page .search-filters .checkbox-label,
.search-filters .checkbox-label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    margin: 0 !important;
    padding: 0 !important;
}
.replay-reference-page .search-filters .checkbox-label input[type="checkbox"],
.search-filters .checkbox-label input[type="checkbox"] {
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    min-height: 14px !important;
    margin: 0 !important;
    padding: 0 !important;
    accent-color: #f57a14 !important;
    vertical-align: middle !important;
    flex-shrink: 0 !important;
}
.replay-reference-page .search-filters .filter-checkbox-group,
.search-filters .filter-checkbox-group {
    align-self: center !important;
}

/* v32: 个人成绩地图名 + 模式标签 */
.replay-reference-page .replay-scenario__map_name {
    display: inline-block !important;
}
.replay-reference-page .replay-scenario__map_name .replay-scenario__mode {
    display: inline-block !important;
    margin-left: 6px !important;
    padding: 1px 7px !important;
    border: 1px solid rgba(143, 208, 242, .45) !important;
    border-radius: 3px !important;
    background: rgba(143, 208, 242, .10) !important;
    color: #9fd4f2 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: .03em !important;
    vertical-align: middle !important;
}

/* ============ v33: 首页紧凑化 ============
   松散点: hero 420px / section 上下各 32px / grid gap 16px / 卡片 body 20px
   方案: hero 降 300px, section 上下各 20px, gap 降 12px, 卡片 body 14px,
   标题字号逐级缩小, 间距统一收紧 */
/* Hero */
.home-hero { min-height: 300px !important; }
.home-hero-overlay { padding: 26px 0 !important; }
.home-hero-badge { margin-bottom: 10px !important; padding: 3px 10px !important; }
.home-hero-title { font-size: 1.85rem !important; margin-bottom: 10px !important; }
.home-hero-subtitle { font-size: 1rem !important; margin-bottom: 14px !important; line-height: 1.5 !important; }
.home-hero-meta { margin-bottom: 14px !important; }

/* 统计条 */
.home-stats-bar { margin-top: -28px !important; padding-bottom: 16px !important; }
.home-stats-grid { gap: 12px !important; }
.home-stat-card { padding: 14px 16px !important; }

/* 各 section */
.home-section { padding: 20px 0 !important; }
.home-section-header { margin-bottom: 12px !important; }
.home-section-heading { font-size: 1.15rem !important; }
.home-section-kicker { font-size: 0.6rem !important; }

/* grid 间距 */
.home-replay-grid,
.home-featured-grid,
.home-series-grid { gap: 12px !important; }
.home-ship-type-grid { gap: 8px !important; }
.home-leaderboard-grid { gap: 12px !important; }
.home-leaderboard-column { padding: 14px 16px !important; }
.home-leaderboard-title { margin-bottom: 12px !important; }
.home-leaderboard-list li { padding: 4px 0 !important; }

/* replay-card 内部紧凑 (首页 + 各列表页统一) */
.replay-card-body { padding: 14px 14px 12px !important; }
.replay-card-eyebrow { margin-bottom: 5px !important; font-size: 0.6rem !important; }
.replay-card h3 { font-size: 1.08rem !important; min-height: 2.4em !important; }
.replay-card-subtitle { margin-top: 5px !important; }
.replay-card-identity { margin-top: 10px !important; }
.replay-card-context { margin-top: 8px !important; }
.replay-card-stats { margin: 10px 0 0 !important; padding-top: 10px !important; }
.replay-card-stats > div { padding: 0 8px !important; }

/* CTA */
.home-cta-content { padding: 20px 0 !important; }
.home-cta-title { font-size: 1.5rem !important; margin-bottom: 8px !important; }
.home-cta-text { font-size: 0.95rem !important; margin-bottom: 14px !important; }

/* ===== panel-parity-v20.css ===== */
/* ==========================================================================
   panel-parity-v20.css — V2「深蓝舰队 × 黄铜金」全站主题（2026-08-03）
   --------------------------------------------------------------------------
   全站覆盖层，加载顺序在 panel-parity-v19.css 之后。
   设计语言：
     - 底色：藏青（navy）多层渐变 + 黄铜金光斑（为半透明卡片提供背后层次）
     - 强调色：亮蓝 -> 黄铜金 #c9a961 系列
     - 卡片：半透明毛玻璃（rgba + backdrop-filter blur），hover 黄铜金描边
   ========================================================================== */

/* ---------- 1. 变量覆盖 ---------- */
:root {
    --accent: #c9a961;
    --accent-dim: #8a6d2f;
    --gold-300: #e8cf8f;
    --gold-400: #d4b46a;
    --gold-500: #c9a961;
    --gold-600: #a88745;
    --navy-800: #081020;
    --navy-700: #0c1626;
    --navy-600: #12243c;
    --navy-500: #1a3152;
    --navy-400: #2a4670;
    --panel: rgba(18, 36, 60, 0.62);
    --panel-hover: rgba(26, 49, 82, 0.78);
    --surface: rgba(26, 49, 82, 0.5);
    --border: rgba(201, 169, 97, 0.28);
    --border-dim: rgba(201, 169, 97, 0.16);
    --focus: var(--gold-400);
    --focus-glow: 0 0 0 3px rgba(212, 180, 106, 0.3);
}

/* ---------- 2. 全站背景：藏青渐变 + 黄铜金光斑 ---------- */
body {
    background:
        radial-gradient(1100px 560px at 82% -8%, rgba(201, 169, 97, 0.13), transparent 60%),
        radial-gradient(900px 480px at -8% 28%, rgba(64, 120, 190, 0.12), transparent 55%),
        radial-gradient(760px 760px at 50% 118%, rgba(20, 60, 110, 0.28), transparent 62%),
        linear-gradient(158deg, #0c1626 0%, #081020 52%, #101a2c 100%) !important;
    background-attachment: fixed !important;
}

/* ---------- 3. 顶部导航 ---------- */
.site-header {
    background: linear-gradient(180deg, rgba(8, 16, 32, 0.92), rgba(10, 18, 32, 0.8)) !important;
    backdrop-filter: blur(14px) saturate(150%);
    -webkit-backdrop-filter: blur(14px) saturate(150%);
    border-bottom: 1px solid rgba(201, 169, 97, 0.22) !important;
}
.site-header .brand b { color: var(--gold-400) !important; }
.site-header .brand-icon { color: var(--gold-400) !important; }
.site-header .nav-link:hover,
.site-header .nav-link.active { color: var(--gold-400) !important; }
.site-header .nav-upload {
    background: linear-gradient(180deg, #d4b46a, #c9a961) !important;
    color: #0b0c0e !important;
    box-shadow: 0 4px 18px rgba(201, 169, 97, 0.3) !important;
}
.site-header .nav-upload:hover {
    background: linear-gradient(180deg, #e0c37e, #d4b46a) !important;
    color: #0b0c0e !important;
}

/* ---------- 4. 首页 Hero ---------- */
.home-hero {
    background:
        radial-gradient(900px 420px at 78% 12%, rgba(201, 169, 97, 0.22), transparent 60%),
        linear-gradient(160deg, rgba(12, 22, 38, 0.60), rgba(8, 16, 32, 0.28) 55%, rgba(16, 26, 44, 0.42)) !important;
}
.home-hero-overlay {
    background: linear-gradient(180deg, rgba(8, 16, 32, 0.34), rgba(8, 16, 32, 0.10)) !important;
}
.home-hero-badge {
    color: var(--gold-300) !important;
    border-color: rgba(201, 169, 97, 0.35) !important;
    background: rgba(18, 36, 60, 0.55) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.home-hero-title {
    text-shadow: 0 6px 30px rgba(201, 169, 97, 0.28) !important;
}
.home-hero-divider {
    background: linear-gradient(90deg, var(--gold-500), transparent) !important;
}
.home-hero-damage,
.home-hero-player,
.home-hero-ship { color: var(--gold-300) !important; }

/* ---------- 5. 统计条 ---------- */
.home-stats .stat-card,
.home-stats-bar .stat-card,
.home-stats-grid .stat-card {
    background: rgba(18, 36, 60, 0.55) !important;
    border: 1px solid rgba(201, 169, 97, 0.22) !important;
    backdrop-filter: blur(12px) saturate(150%);
    -webkit-backdrop-filter: blur(12px) saturate(150%);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35) !important;
}
.home-stats .stat-card b,
.home-stats-bar .stat-card b { color: var(--gold-400) !important; }

/* ---------- 6. 半透明卡片（首页/列表/舰船等前台卡片；战报页面板与侧栏卡不在此列） ---------- */
.replay-card,
.catalog-card,
.home-series-card,
.home-leaderboard-column {
    background: rgba(18, 36, 60, 0.52) !important;
    border: 1px solid rgba(201, 169, 97, 0.18) !important;
    backdrop-filter: blur(14px) saturate(150%);
    -webkit-backdrop-filter: blur(14px) saturate(150%);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35) !important;
    transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease !important;
}
.replay-card:hover,
.catalog-card:hover,
.home-series-card:hover {
    transform: translateY(-4px);
    border-color: rgba(201, 169, 97, 0.5) !important;
    background: rgba(26, 49, 82, 0.66) !important;
    box-shadow: 0 16px 40px rgba(201, 169, 97, 0.16) !important;
}
/* 卡片内部 accent */
.replay-card-eyebrow { color: var(--gold-400) !important; }
.replay-card-stats b { color: var(--gold-400) !important; }
.catalog-card-title a:hover { color: var(--gold-400) !important; }

/* ---------- 7. 区块标题 / 链接 ---------- */
.home-section-kicker { color: var(--gold-400) !important; }
.section-link { color: var(--gold-300) !important; }
.section-link:hover { color: var(--gold-400) !important; }
.home-section-heading { color: var(--white, #e8eef7) !important; }

/* ---------- 8. 按钮：黄铜金 ---------- */
.btn-primary {
    background: linear-gradient(180deg, #d4b46a, #c9a961) !important;
    color: #0b0c0e !important;
    box-shadow: 0 6px 24px rgba(201, 169, 97, 0.3) !important;
}
.btn-primary:hover {
    background: linear-gradient(180deg, #e0c37e, #d4b46a) !important;
    color: #0b0c0e !important;
    box-shadow: 0 10px 32px rgba(201, 169, 97, 0.4) !important;
}
/* 侧栏下载/分享橘色按钮 -> 黄铜金 */
.replay-reference-page .replay-detail-sidebar--below .replay-side-actions .btn-orange,
.replay-side-actions .btn-orange,
.btn-orange {
    background: linear-gradient(180deg, #d4b46a, #c9a961) !important;
    color: #0b0c0e !important;
    border-color: transparent !important;
}
.replay-reference-page .replay-detail-sidebar--below .replay-side-actions .btn-orange:hover:not([aria-disabled]),
.replay-side-actions .btn-orange:hover,
.btn-orange:hover {
    background: linear-gradient(180deg, #e0c37e, #d4b46a) !important;
    color: #0b0c0e !important;
}

/* ---------- 9. 页脚 ---------- */
.site-footer {
    background: linear-gradient(180deg, rgba(8, 16, 32, 0.9), rgba(6, 13, 23, 0.96)) !important;
    border-top: 1px solid rgba(201, 169, 97, 0.18) !important;
}
/* 页脚文字调大（V2 主题）：栏目标题 0.95rem、链接/正文 0.9rem、版权 0.88rem */
.site-footer .footer-grid h2,
.site-footer .footer-links-block h3 {
    color: var(--gold-300) !important;
    font-size: 0.95rem !important;
}
.site-footer .footer-grid a,
.site-footer .footer-grid span {
    font-size: 0.9rem !important;
}
.site-footer .footer-brand p {
    font-size: 1.12rem !important;
}
.site-footer .footer-bottom {
    font-size: 0.88rem !important;
}
.site-footer a:hover { color: var(--gold-400) !important; }

/* ---------- 10. 战报详情页（个人成绩/团队/详细/经济） ---------- */
.replay-reference-page .detail-tab.active {
    color: var(--gold-300) !important;
    border-color: var(--gold-500) !important;
}
/* 详情页 tab 高亮（保留：金色 border 增强，不改变面板背景）
   注意：不再覆盖 .reference-panel / .detail-side-card 背景 —— 战报页面板
   保持 app.css 原样 background: transparent，透明透出模糊地图背景。 */
.replay-reference-page .detail-tab.active {
    color: var(--gold-300) !important;
    border-color: var(--gold-500) !important;
}
.replay-reference-page .detail-tab:hover { color: var(--gold-300) !important; }
/* 详情页 tab 高亮条（如果 app.css 用下划线/胶囊） */
.replay-reference-page .detail-tab.active::after {
    background: var(--gold-500) !important;
}

/* ---------- 11b. main 宽度统一：以首页 .main--full（container-wide 1480px）为准 ---------- */
.main.container {
    width: min(1480px, calc(100% - 64px)) !important;
    margin-inline: auto !important;
}

/* ---------- 13. /replays 列表卡片每行 5 个（与 ships 页 catalog-grid 一致） ----------
   app.css 4554 行曾强制 repeat(3)；改回 auto-fill minmax(260px,1fr) → 1421px 容器下 5 列 */
.replay-grid {
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important;
    gap: 16px !important;
}

/* ---------- 14. replay-card 信息部分紧凑 + video 徽章黄铜金 ---------- */
.replay-card-media .replay-video-badge {
    background: linear-gradient(180deg, #d4b46a, #c9a961) !important;
    color: #0b0c0e !important;
    border-color: rgba(255, 255, 255, 0.35) !important;
    font-weight: 700 !important;
    box-shadow: 0 2px 10px rgba(201, 169, 97, 0.4) !important;
}
/* context 更紧凑：模式显示为中文大类（如"随机战"），地图/版本缩小并排 */
.replay-card-context {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 3px 6px !important;
    margin-top: 6px !important;
    font-size: 0.7rem !important;
    color: var(--text-dim) !important;
}
.replay-card-context span {
    display: inline-flex !important;
    align-items: center !important;
    padding: 1px 6px !important;
    border-radius: 999px !important;
    background: rgba(201, 169, 97, 0.12) !important;
    border: 1px solid rgba(201, 169, 97, 0.25) !important;
    color: var(--gold-300) !important;
    white-space: nowrap !important;
}
.replay-card-footer {
    margin-top: 8px !important;
    font-size: 0.68rem !important;
}
.replay-card-identity {
    margin-top: 8px !important;
    font-size: 0.78rem !important;
}

/* ---------- 15. 系统字体栈 + 数字等宽（纯 CSS，零 webfont 下载，v37） ----------
   中文走系统黑体（苹方/雅黑/思源），数字用系统西文字体 + tabular-nums 等宽对齐。
   视觉找补：标题 900 字重、kicker 窄体大写、数字窄体。 */
:root {
    --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto,
        "PingFang SC", "Microsoft YaHei", "Source Han Sans CN", "Noto Sans CJK SC", sans-serif;
    --font-num: "Segoe UI", "SF Pro Display", -apple-system, Roboto, "Inter", sans-serif;
}
body,
.home-hero-title,
.home-section-heading,
.home-leaderboard-title,
.replay-card h3 {
    font-family: var(--font-sans) !important;
}
/* 数字等宽对齐 + 力量感（伤害/击沉/经验/下载/排行/统计/hero 数值） */
.home-stats .stat-card b,
.home-stats-bar .stat-card b,
.replay-card-stats dd,
.replay-card-footer span,
.home-leaderboard-item strong,
.home-hero-damage,
.leaderboard-rank {
    font-family: var(--font-num) !important;
    font-variant-numeric: tabular-nums !important;
    letter-spacing: -0.02em !important;
}
/* 标题字重（战争感找补） */
.home-hero-title { font-weight: 900 !important; }
.home-section-heading { font-weight: 900 !important; letter-spacing: 0.01em !important; }
.home-leaderboard-title { font-weight: 800 !important; }
/* kicker 英文窄体大写 */
.home-section-kicker {
    font-family: var(--font-num) !important;
    letter-spacing: 0.18em !important;
}

/* ---------- 16. replay-card 信息链接（按钮色）+ 国旗调亮 + 更紧凑（v38） ----------
   v39: 内容居中 + 字号大一号 + 玩家前服务器标签 */
/* 船名/玩家/地图/模式/版本 → 按钮色 pill 链接 */
.card-tag {
    display: inline-flex !important;
    align-items: center !important;
    padding: 1px 9px !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, #d4b46a, #c9a961) !important;
    color: #0b0c0e !important;
    font-weight: 700 !important;
    font-size: 0.78rem !important;
    line-height: 1.7 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) !important;
    transition: filter 0.15s ease, transform 0.15s ease !important;
}
.card-tag:hover {
    filter: brightness(1.12) !important;
    transform: translateY(-1px) !important;
    text-decoration: none !important;
}
/* 地图/模式/版本：次级半透明金（避免 5 个实心按钮太抢） */
.card-tag--soft {
    background: rgba(201, 169, 97, 0.16) !important;
    color: var(--gold-300) !important;
    border: 1px solid rgba(201, 169, 97, 0.35) !important;
    box-shadow: none !important;
}
/* 服务器标签（玩家名前）：蓝灰次级 */
.card-tag--server {
    background: rgba(90, 122, 158, 0.28) !important;
    color: #b8cdde !important;
    border: 1px solid rgba(90, 122, 158, 0.45) !important;
    box-shadow: none !important;
}
/* identity 改为 flex 排布（船名 + [服务器] + 玩家），居中，一行显示（v40）
   v41: 必须显式 flex-direction:row —— 原始 app.css 是 column 竖排，不覆盖仍垂直堆叠 */
.replay-card-identity {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    margin-top: 7px !important;
    font-size: 0.85rem !important;
    min-width: 0 !important;
}
/* 长名省略（船名/玩家），服务器不收缩 */
.replay-card-identity .card-tag {
    min-width: 0 !important;
    max-width: 48% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
.replay-card-identity .card-tag--server {
    flex: 0 0 auto !important;
    max-width: none !important;
}
.replay-card-context {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    margin-top: 6px !important;
    font-size: 0.8rem !important;
}
/* 更紧凑 + 居中 + 字号大一号（v39） */
.replay-card-body { padding: 12px 12px 10px !important; text-align: center !important; }
.replay-card h3 { font-size: 1.15rem !important; min-height: 2.2em !important; }
.replay-card-stats { justify-content: center !important; }
.replay-card-footer {
    margin-top: 7px !important;
    font-size: 0.78rem !important;
    justify-content: center !important;
}
/* 国旗调亮（replay-card + ships 页 catalog-card） */
.replay-card-media .replay-card-nation-flag,
.catalog-card-image .catalog-card-nation-flag {
    filter: brightness(0.72) saturate(1.05) contrast(1.05) !important;
}

/* ---------- 11. 上传 CTA ---------- */
.home-upload-cta .home-cta-content {
    border: 1px solid rgba(201, 169, 97, 0.3) !important;
    box-shadow: 0 0 44px rgba(201, 169, 97, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}
.home-cta-title { color: var(--gold-300) !important; }

/* ---------- 12. 手机端修复：3241 destroyed_by 被 .replay-hat 裁切 ----------
   移动端容器窄，destroyed_by 内容（玩家名+图标+等级+船名）折行后高度 > 150px，
   超出 .replay-hat{overflow:hidden} 底部被裁。改为高度自适应 + 内容可见。 */
@media (max-width: 700px) {
    .replay-reference-page .reference-panel--personal .replay-hat {
        height: auto !important;
        overflow: visible !important;
        padding-bottom: 8px !important;
    }
}

.related-card-meta .result-victory { color: #ff6b5e !important; font-weight: 700 !important; }
.related-card-meta .result-defeat { color: #48c78e !important; font-weight: 700 !important; }
.related-card-meta .result-draw { color: #9fb0c5 !important; font-weight: 700 !important; }

/* ---------- 22. replay-card footer：时间/下载 图标 + 两端对齐（v45，覆盖上方 center 规则） ---------- */
.replay-card-footer {
    justify-content: space-between !important;
    flex-wrap: wrap;
    row-gap: 4px;
}
.replay-card-footer time,
.replay-card-footer span {
    display: inline-flex !important;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
    line-height: 1;
}
.replay-card-footer svg {
    width: 13px !important;
    height: 13px !important;
    flex-shrink: 0;
    opacity: 0.9;
}

/* ---------- 23. 批量上传队列 + 上传协议（v45） ---------- */
.upload-drop-zone {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 34px 22px;
    border: 2px dashed rgba(201, 169, 97, 0.35);
    border-radius: 10px;
    background: rgba(18, 36, 60, 0.35);
    cursor: pointer;
    text-align: center;
    transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
}
.upload-drop-zone:hover,
.upload-drop-zone.is-dragover {
    border-color: rgba(212, 180, 106, 0.75);
    background: rgba(26, 49, 82, 0.5);
}
.upload-drop-zone.is-dragover {
    transform: scale(1.01);
}
.upload-drop-zone .upload-drop-icon {
    font-size: 2rem;
    line-height: 1;
    color: var(--gold-400, #c9a961);
}
.upload-drop-zone .upload-drop-title {
    color: var(--white, #e8eef7);
    font-weight: 700;
}
.upload-drop-input {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}
#replay-upload-form.batch-mode .single-only { display: none !important; }
.upload-batch { margin-top: 14px; }
.upload-batch-list { display: grid; gap: 10px; max-height: 420px; overflow-y: auto; }
.batch-item {
    background: rgba(20, 36, 60, 0.6);
    border: 1px solid rgba(201, 169, 97, 0.25);
    border-radius: 8px;
    padding: 10px 12px;
}
.batch-item-head { display: flex; align-items: center; gap: 10px; font-size: 0.85rem; margin-bottom: 8px; }
.batch-item-name {
    flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    font-family: var(--font-num, ui-monospace, monospace);
}
.batch-item-size { color: var(--text-dim); font-size: 0.78rem; white-space: nowrap; }
.batch-item-status { font-size: 0.78rem; font-weight: 700; white-space: nowrap; }
.batch-status-pending { color: var(--text-dim); }
.batch-status-uploading { color: var(--gold-400, #c9a961); }
.batch-status-success { color: #48c78e; }
.batch-status-error { color: #ff6b5e; }
.batch-retry {
    background: var(--accent, #c9a961);
    color: #14202a; border: 0; border-radius: 6px;
    padding: 3px 10px; font-size: 0.78rem; font-weight: 700; cursor: pointer;
}
.batch-retry:hover { filter: brightness(1.12); }
.batch-item-err { margin-top: 6px; font-size: 0.78rem; color: #ff6b5e; }
.upload-batch-summary { margin-top: 10px; font-size: 0.85rem; color: var(--text-dim); min-height: 1.2em; }
.upload-terms-box { margin-top: 6px; }
.upload-terms-box .field-hint a { color: var(--gold-400, #c9a961); text-decoration: underline; }
.upload-terms-list { padding-left: 1.4em; display: grid; gap: 12px; }
.upload-terms-list li strong { color: var(--gold-400, #c9a961); }
.upload-terms-list p { margin: 4px 0 0; color: var(--text-dim); font-size: 0.9rem; }

/* ---------- 24. 上传页服务器选项：强制横排 + 美化（v46） ---------- */
.server-choice-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
}
.server-choice {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    min-height: 48px !important;
    padding: 12px 14px !important;
    white-space: nowrap;
}
.server-choice span {
    display: inline !important;
    white-space: nowrap;
    font-weight: 600;
    color: var(--text, #e8eef4);
}
.server-choice input[type="radio"] {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    accent-color: var(--accent, #c9a961);
    margin: 0 !important;
}
@media (max-width: 700px) {
    .server-choice-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* ---------- 25. 战报不可用占位卡片 + 基础数据统计卡（v46c） ---------- */
.report-unavailable {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px 22px;
    background: linear-gradient(135deg, rgba(201, 169, 97, 0.08), rgba(20, 36, 60, 0.55));
    border: 1px solid rgba(201, 169, 97, 0.28);
    border-radius: 12px;
}
.report-unavailable__icon {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(201, 169, 97, 0.14);
    color: #e5c879;
}
.report-unavailable__icon svg { width: 24px; height: 24px; }
.report-unavailable__title {
    color: #e5c879;
    font-weight: 700;
    font-size: 1rem;
    letter-spacing: 0.02em;
}
.report-unavailable__desc {
    color: var(--text-dim);
    font-size: 0.85rem;
    margin-top: 4px;
    line-height: 1.55;
}
.report-stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px;
    margin-top: 14px;
}
.report-stat-card {
    background: rgba(20, 36, 60, 0.6);
    border: 1px solid rgba(113, 159, 187, 0.15);
    border-radius: 10px;
    padding: 14px 16px;
    text-align: center;
}
.report-stat-card b {
    display: block;
    font-size: 1.45rem;
    color: #e5c879;
    font-family: var(--font-num, ui-monospace, monospace);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
}
.report-stat-card span {
    font-size: 0.78rem;
    color: var(--text-dim);
    margin-top: 2px;
    display: block;
}


/* ---------- 28. 我的上传页操作列（v47） ---------- */
.mine-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
}
.mine-actions a {
    color: var(--accent, #c9a961);
    text-decoration: none;
    font-size: 0.85rem;
}
.mine-actions a:hover { text-decoration: underline; }
.mine-actions .inline { margin: 0; }
.mine-actions .link-danger {
    background: none;
    border: 0;
    padding: 0;
    color: #ff6b5e;
    font-size: 0.85rem;
    cursor: pointer;
    font-family: inherit;
}
.mine-actions .link-danger:hover { text-decoration: underline; }


/* ---------- 29. replay-result 结果未知说明（v49） ---------- */
.replay-result-note {
    margin: 6px 0 0;
    color: var(--text-dim, #6f8798);
    font-size: 0.72rem;
    line-height: 1.5;
}


/* ---------- 30. 老版本详细统计：主炮命中明细（v55） ---------- */
.report-stat-card--main-hits { border-color: rgba(201, 169, 97, 0.45); }
.report-main-hits {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
    gap: 8px;
    margin-top: 12px;
}
.report-main-hits__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    background: rgba(20, 36, 60, 0.45);
    border: 1px solid rgba(113, 159, 187, 0.14);
    border-radius: 8px;
    padding: 8px 12px;
    font-size: 0.8rem;
}
.report-main-hits__row span { color: var(--text-dim, #6f8798); }
.report-main-hits__row b {
    color: #e5c879;
    font-family: var(--font-num, ui-monospace, monospace);
    font-variant-numeric: tabular-nums;
}


/* ---------- 31. v61：hero ::before 图片透明度提升 ---------- */
.home-hero::before { opacity: 0.62 !important; }
.home-hero.has-asset::before { opacity: 0.72 !important; }


/* ---------- 32. v62：hero 完全无遮罩，保持原图 ---------- */
.home-hero {
    background: none !important;
}
.home-hero::before {
    opacity: 1 !important;
}
.home-hero.has-asset::before {
    opacity: 1 !important;
}
.home-hero-overlay {
    background: transparent !important;
}


/* ---------- 33. admin replays tab + 状态徽章（v63） ---------- */
.admin-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 4px 0 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(113, 159, 187, 0.14);
}
.admin-tabs__item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border-radius: 999px;
    border: 1px solid rgba(113, 159, 187, 0.22);
    color: var(--text-dim, #8aa3b4);
    font-size: 0.85rem;
    text-decoration: none;
    transition: all 0.15s;
}
.admin-tabs__item:hover { border-color: var(--accent, #c9a961); color: var(--accent, #c9a961); }
.admin-tabs__item.is-active {
    background: rgba(201, 169, 97, 0.14);
    border-color: var(--accent, #c9a961);
    color: #e5c879;
    font-weight: 600;
}
.admin-tabs__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    background: rgba(113, 159, 187, 0.18);
    color: var(--text-dim, #8aa3b4);
}
.admin-tabs__badge--danger { background: rgba(255, 107, 94, 0.18); color: #ff8d82; }
.admin-tabs__badge--ok { background: rgba(94, 200, 140, 0.16); color: #7ddb9d; }
.admin-tabs__badge--warn { background: rgba(229, 200, 121, 0.16); color: #e5c879; }
.admin-tabs__badge--muted { background: rgba(140, 150, 160, 0.16); color: #9aa7b3; }

.status-cell { display: flex; flex-wrap: wrap; gap: 4px; }
.status-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    background: rgba(113, 159, 187, 0.14);
    color: #9db7c8;
    white-space: nowrap;
}
.status-badge--ok { background: rgba(94, 200, 140, 0.14); color: #7ddb9d; }
.status-badge--warn { background: rgba(229, 200, 121, 0.14); color: #e5c879; }
.status-badge--danger { background: rgba(255, 107, 94, 0.14); color: #ff8d82; }
.status-badge--info { background: rgba(89, 150, 214, 0.14); color: #7db3e8; }
.status-badge--muted { background: rgba(140, 150, 160, 0.12); color: #9aa7b3; }

.admin-actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.admin-actions .button { margin: 0; }
.empty-cell { text-align: center; color: var(--text-dim, #6f8798); padding: 24px; }



/* ---------- 37. v76：hero battle-card 美化（舰船图/链接/间距） ---------- */
.home-hero { margin-bottom: 42px !important; }
.home-battle-card .home-battle-shipline {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 14px 0 !important;
    padding: 10px !important;
    border-radius: 10px !important;
    text-decoration: none !important;
    transition: background 0.18s, transform 0.18s !important;
}
.home-battle-card .home-battle-shipline:hover {
    background: rgba(201, 169, 97, 0.10) !important;
    transform: translateY(-1px) !important;
}
.home-battle-card .home-battle-ship-icon {
    width: 72px !important;
    height: 72px !important;
    object-fit: contain !important;
    border-radius: 8px !important;
    background: rgba(9, 24, 38, 0.55) !important;
    border: 1px solid rgba(201, 169, 97, 0.22) !important;
    flex: 0 0 auto !important;
}
.home-battle-card .home-battle-shipline div { display: flex !important; flex-direction: column !important; gap: 2px !important; min-width: 0 !important; }
.home-battle-card .home-battle-shipline strong { color: #e7eeee !important; font-size: 0.95rem !important; }
.home-battle-card .home-battle-shipline span { color: #8aa3b4 !important; font-size: 0.75rem !important; }
.home-battle-card .home-battle-link {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin-top: 14px !important;
    color: var(--gold-300, #c9a961) !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    border-bottom: 1px solid rgba(201, 169, 97, 0.35) !important;
    padding-bottom: 2px !important;
    transition: color 0.15s, border-color 0.15s !important;
}
.home-battle-card .home-battle-link:hover { color: #e5c879 !important; border-color: #e5c879 !important; }

/* ---------- v44: 战报下方区域紧凑化（只限 WoWS 战报页下方区块间距，不动战报本身） ---------- */
.replay-reference-page .replay-detail-main > * + * {
    margin-top: 12px !important;
}
.replay-reference-page .replay-detail-main > .replay-detail-sidebar--below {
    margin-top: 12px !important;
}
.replay-reference-page .related-replay-stack {
    gap: 10px !important;
}
.replay-reference-page .replay-reference-shell {
    padding-bottom: 10px !important;
}
body:has(.replay-reference-page) main {
    padding-bottom: 8px !important;
}
body:has(.replay-reference-page) .site-footer {
    padding-top: 14px !important;
}
.replay-reference-page .replay-nav {
    margin-bottom: 0 !important;
}
.replay-reference-page .replay-nav-link {
    padding: 8px 14px !important;
}

/* 操作卡：下载主按钮 + 分享 + 点赞计数 + 弱化举报 */
.sb-card--action .sb-card__actions .button,
.sb-card--action .sb-card__actions .sb-card__action-form .button {
    min-height: 32px !important;
    padding: 0 14px !important;
    font-size: 0.78rem !important;
    font-weight: 600 !important;
    line-height: 32px !important;
    border-radius: 8px !important;
}
.sb-card--action .sb-card__actions .btn-orange {
    min-height: 32px !important;
    line-height: 32px !important;
}
.sb-card--action .sb-card__actions .sb-card__action-form {
    margin: 0 !important;
}
.sb-card--action .sb-card__actions .is-liked {
    background: rgba(201, 169, 97, 0.18) !important;
    color: #e0c37e !important;
    border: 1px solid rgba(201, 169, 97, 0.45) !important;
}
.sb-card--action .sb-card__actions .sb-card__action-report {
    color: #c98a7a !important;
    background: rgba(201, 138, 122, 0.06) !important;
    border: 1px solid rgba(201, 138, 122, 0.35) !important;
}

/* ============================================================
   v77: 平台统一卡片系统（WoWS / WoT / 未来游戏共用）
   ------------------------------------------------------------
   设计：中性石墨玻璃卡面 + 银灰描边 + 香槟金点缀。
   - 选择器不再带游戏前缀，未来新游戏自动继承；
   - 游戏身份只通过 --game-accent 覆盖（当前两站都用默认值）。
   ============================================================ */
:root {
    --card-bg: linear-gradient(165deg, rgba(30, 34, 39, .52), rgba(13, 16, 20, .66));
    --card-border: rgba(226, 232, 238, .14);
    --card-radius: 10px;
    --card-radius-sm: 8px;
    --card-shadow: 0 10px 28px rgba(0, 0, 0, .28);
    --card-text: #eef2f5;
    --card-text-dim: #aab6c0;
    --card-text-muted: #77848f;
    --card-accent: #d8b26d;
    --card-accent-strong: #ecd9a8;
}

/* ---------- A 组：replay-detail-sidebar--below（操作/上传者/回放信息） ---------- */
.replay-detail-sidebar--below {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
    align-items: stretch !important;
    margin: 12px 0 8px !important;
}

/* 与 v19y 的 WoWS 专属 shell 规则等权，保证两站间距一致 */
.replay-reference-shell .replay-detail-main > .replay-detail-sidebar--below {
    gap: 14px !important;
    margin-top: 12px !important;
}

.replay-detail-sidebar--below .detail-side-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: stretch !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 16px !important;
    position: relative !important;
    grid-column: auto !important;
    background: var(--card-bg) !important;
    border: 1px solid var(--card-border) !important;
    border-radius: var(--card-radius) !important;
    backdrop-filter: blur(14px) saturate(140%);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
    box-shadow: var(--card-shadow) !important;
    text-align: left !important;
}

/* 移除旧顶部高亮条 / 标题图标条 */
.replay-detail-sidebar--below .detail-side-card::before,
.replay-detail-sidebar--below .detail-side-card h2::before {
    content: none !important;
}

.replay-detail-sidebar--below h2 {
    width: 100% !important;
    margin: 0 0 12px !important;
    padding: 0 0 8px !important;
    color: var(--card-text) !important;
    font-family: var(--font-sans, Arial, "Microsoft YaHei", sans-serif) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: .02em !important;
    text-align: center !important;
    border-bottom: 1px solid rgba(226, 232, 238, .10) !important;
}

.sb-card--action .sb-card__desc {
    margin: 0 0 12px !important;
    color: var(--card-text-dim) !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
    text-align: center !important;
}
.sb-card--action .sb-card__actions {
    width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
}
.sb-card--action .sb-card__actions .button { margin: 0 !important; }

.sb-card--uploader .sb-card__uploader {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    text-align: center !important;
}
.sb-card--uploader .sb-card__uploader-meta {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 3px !important;
    min-width: 0 !important;
    text-align: center !important;
}
.sb-card--uploader .sb-card__uploader-meta strong {
    color: var(--card-text) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}
.sb-card--uploader .sb-card__uploader-meta span {
    color: var(--card-text-dim) !important;
    font-size: 12px !important;
}
.sb-card--uploader .uploader-avatar {
    display: inline-grid !important;
    flex: 0 0 40px !important;
    width: 40px !important;
    height: 40px !important;
    place-items: center !important;
    background: rgba(216, 178, 109, .10) !important;
    border: 1px solid rgba(216, 178, 109, .36) !important;
    border-radius: 50% !important;
    color: var(--card-accent) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
}
.sb-card--uploader .uploader-replays-link {
    margin-top: 2px !important;
    font-size: 12px !important;
    color: var(--card-accent) !important;
}

.sb-card--file .sb-card__meta {
    width: 100% !important;
    margin: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 4px 12px !important;
}
.sb-card--file .sb-card__meta > div {
    width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: baseline !important;
    gap: 8px !important;
    padding: 8px 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-top: 1px solid rgba(226, 232, 238, .10) !important;
}
.sb-card--file .sb-card__meta > div:nth-child(-n+2) { border-top: 0 !important; }
.sb-card--file .sb-card__meta dt {
    color: var(--card-text-muted) !important;
    font-size: 12px !important;
    margin: 0 !important;
    white-space: nowrap !important;
}
.sb-card--file .sb-card__meta dd {
    color: var(--card-text) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    margin: 0 !important;
    text-align: right !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.replay-detail-sidebar--below .download-limit-alert {
    width: 100% !important;
    flex: 0 0 100% !important;
    padding: 7px 11px !important;
    color: #f2dcae !important;
    background: rgba(216, 178, 109, .12) !important;
    border: 1px solid rgba(216, 178, 109, .38) !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}
.replay-detail-sidebar--below .replay-copy-status { color: var(--card-accent) !important; }

/* WoWS 在窄屏折叠为单列；WoT 战报页保持桌面三列（整页横向滚动策略不变） */
@media (max-width: 900px) {
    .replay-reference-shell .replay-detail-sidebar--below { grid-template-columns: 1fr !important; }
}

/* ---------- B 组：下方卡片（相关回放/说明/截图/评论） ---------- */
.related-replay-stack { gap: 10px !important; }
.related-replay-stack .related-section { margin-top: 0 !important; }

.related-section,
.replay-description-card,
.replay-comments-card,
.media-showcase {
    background: var(--card-bg) !important;
    border: 1px solid var(--card-border) !important;
    border-radius: var(--card-radius) !important;
    backdrop-filter: blur(14px) saturate(140%);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
    box-shadow: var(--card-shadow) !important;
}
.related-section { padding: 12px 14px !important; margin-bottom: 0 !important; }
.replay-description-card,
.replay-comments-card,
.media-showcase { padding: 18px 20px !important; }

.related-heading-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin-bottom: 8px !important;
}
.related-section .related-heading {
    margin: 0 !important;
    color: var(--card-text) !important;
    font-family: var(--font-sans, Arial, "Microsoft YaHei", sans-serif) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    letter-spacing: .02em !important;
}
.related-section .related-view-all {
    display: inline-block !important;
    margin-top: 0 !important;
    color: var(--card-accent) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    border-bottom: none !important;
}
.related-section .related-view-all:hover {
    color: var(--card-accent-strong) !important;
    text-decoration: underline !important;
}
.related-section .related-grid {
    gap: 10px !important;
    margin-top: 0 !important;
}
.related-section .related-card {
    background: rgba(255, 255, 255, .03) !important;
    border: 1px solid var(--card-border) !important;
    border-radius: var(--card-radius-sm) !important;
    padding: 10px 12px !important;
    box-shadow: none !important;
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease !important;
}
.related-section .related-card:hover {
    transform: translateY(-2px) !important;
    border-color: rgba(216, 178, 109, .42) !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .22) !important;
}
.related-section .related-card-title {
    margin: 0 0 4px !important;
    font-size: 13px !important;
}
.related-section .related-card-title a {
    color: var(--card-text) !important;
    text-decoration: none !important;
}
.related-section .related-card-title a:hover { color: var(--card-accent) !important; }
.related-section .related-card-vehicle {
    font-size: 12px !important;
    color: var(--card-text-muted) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    margin-bottom: 4px !important;
}
.related-section .related-card-meta {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 4px 10px !important;
    font-size: 12px !important;
    color: var(--card-text-dim) !important;
}
.related-section .related-card-meta .related-stat {
    color: var(--card-text) !important;
    font-weight: 600 !important;
}

.replay-description-card h2,
.replay-comments-card h2,
.media-showcase h2 {
    margin: 0 0 10px !important;
    color: var(--card-text) !important;
    font-family: var(--font-sans, Arial, "Microsoft YaHei", sans-serif) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: .02em !important;
}
.replay-description-card p {
    margin: 0 !important;
    color: var(--card-text-dim) !important;
    line-height: 1.75 !important;
}
.media-showcase .media-grid { margin-top: 14px !important; }
.media-showcase .media-item {
    background: rgba(255, 255, 255, .03) !important;
    border: 1px solid var(--card-border) !important;
    border-radius: var(--card-radius-sm) !important;
    padding: 8px !important;
}
.media-showcase .media-caption {
    margin-top: 6px !important;
    color: var(--card-text-dim) !important;
    font-size: 12px !important;
}
.replay-comments-card > section,
.replay-comments-card > div { margin: 0 !important; }
/* ============ related-nav: unified 3-link related replays card ============ */
/* 单卡片：1 行 3 列，图标 + 层级化；强调色随游戏主题（WoWS 蓝 / WoT 金） */
.related-nav {
    --nav-accent: var(--accent, #46a6ff);
    margin-bottom: var(--space-5);
    padding: var(--space-4) var(--space-5);
    background: rgba(18, 36, 60, .55);
    border: 1px solid rgba(201, 169, 97, .18);
    border-radius: var(--radius-lg);
}
.wot-replay .related-nav {
    --nav-accent: var(--wot-gold, #e1bd67);
}
.related-nav-heading {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0 0 var(--space-3);
    font-size: var(--text-base);
    font-weight: 800;
    color: var(--nav-accent);
}
.related-nav-heading::before {
    content: "";
    flex: 0 0 auto;
    width: 4px;
    height: 1em;
    border-radius: 2px;
    background: var(--nav-accent);
    opacity: .85;
}
.related-nav-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
}
.related-nav-item {
    margin: 0;
    padding: 0;
}
/* 列间渐变分隔线（非生硬整条实线） */
.related-nav-item + .related-nav-item {
    border-left: 1px dashed rgba(201, 169, 97, .16);
}
.related-nav-link {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: var(--space-2) var(--space-3);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: background var(--transition-fast), transform var(--transition-fast);
}
.related-nav-link:hover {
    background: rgba(201, 169, 97, .08);
    transform: translateY(-1px);
}
.related-nav-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-size: var(--text-xs);
    font-weight: 500;
    color: var(--text-muted);
}
.related-nav-icon {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
    color: var(--nav-accent);
    opacity: .85;
}
.related-nav-name {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: var(--text-sm);
    font-weight: var(--weight-semibold);
    color: var(--text);
    text-align: center;
    transition: color var(--transition-fast);
}
.related-nav-link:hover .related-nav-name {
    color: var(--nav-accent);
}
.related-nav-arrow {
    position: absolute;
    top: 50%;
    right: var(--space-2);
    transform: translateY(-50%) translateX(-3px);
    font-size: var(--text-base);
    color: var(--nav-accent);
    opacity: 0;
    transition: opacity var(--transition-fast), transform var(--transition-fast);
}
.related-nav-link:hover .related-nav-arrow {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}
@media (max-width: 720px) {
    .related-nav-list {
        grid-template-columns: 1fr;
    }
    .related-nav-item + .related-nav-item {
        border-left: 0;
        border-top: 1px dashed rgba(201, 169, 97, .16);
    }
    .related-nav-link {
        flex-direction: row;
        align-items: center;
        gap: var(--space-2);
        transform: none;
    }
    .related-nav-link:hover {
        transform: none;
    }
    .related-nav-label {
        flex: 0 0 auto;
    }
    .related-nav-name {
        flex: 1 1 auto;
        text-align: right;
    }
    .related-nav-arrow {
        position: static;
        transform: none;
        opacity: 1;
        color: var(--text-muted);
        font-size: var(--text-sm);
    }
    .related-nav-link:hover .related-nav-arrow {
        opacity: 1;
        transform: none;
    }
}

/* ============ replay settlement notice (missing BattleStats) ============ */
.replay-settlement-notice {
    max-width: 960px;
    margin: 0.75rem auto;
    padding: 0.7rem 1rem;
    border: 1px solid rgba(201, 169, 97, 0.35);
    border-left: 4px solid var(--gold-300, #c9a961);
    border-radius: 3px;
    color: #e3d9ae;
    font-size: 0.82rem;
    line-height: 1.5;
    background: rgba(44, 38, 21, 0.45);
}