/* Additional V2 pages. Loaded only when the existing V2 setting is enabled. */
.av2-extra {
    --hive-ink: var(--av2-ink);
    --hive-muted: var(--av2-muted);
    --nat-ink: var(--av2-ink);
    --nat-muted: var(--av2-muted);
}
.av2-extra :is(.codex-hero, .roles-hero, .comms-hero, .cl-hero, .hive-hero, .nation-hero) {
    text-align: center;
    margin-bottom: 1rem;
}
.av2-extra :is(.codex-hero, .roles-hero, .comms-hero, .cl-hero, .hive-hero, .nation-hero) h1,
.tpx-race > h1 {
    font-family: "Oxygene1", "PusabGD", system-ui, sans-serif;
    text-transform: uppercase;
    font-weight: 400;
    letter-spacing: .02em;
    font-size: clamp(1.6rem, 4vw, 2.8rem);
    line-height: 1.1;
    margin: .35rem 0 .5rem;
    background: linear-gradient(180deg, #fff 0%, #c9d1ff 45%, #6d7dff 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(0 3px 0 #000) drop-shadow(0 0 16px rgba(59, 73, 255, .5));
}
.av2-extra :is(.codex-kicker, .roles-kicker, .comms-kicker, .cl-kicker, .hive-kicker, .nation-kicker, .top-race-kicker) {
    color: var(--av2-sky);
    font-size: .66rem;
    letter-spacing: .2em;
}
.av2-extra :is(.codex-kicker i, .roles-kicker i, .comms-kicker i, .cl-kicker i, .hive-kicker-dot, .nation-kicker i, .top-race-kicker-dot) {
    background: var(--av2-blue-2);
    box-shadow: 0 0 12px var(--av2-blue-2);
}
.av2-extra :is(.codex-hero, .roles-hero, .comms-hero, .cl-hero, .hive-hero, .nation-hero) > p {
    color: var(--av2-muted);
}
.av2-extra .hive-hero > p { display: block; margin: 0 auto .7rem; max-width: 44rem; }
.tpx-race > .text-muted { color: var(--av2-muted) !important; }

/* Cards retain their meaningful role, severity, podium and event colors. */
.av2-extra :is(.codex-rule, .roles-card, .comms-card, .cl-card, .hive-comb, .nation-card) {
    background: var(--av2-card);
    border-radius: 1.1rem;
    box-shadow: 0 0 0 1px #000;
}
.av2-extra :is(.codex-rule, .comms-card) { border-top-color: var(--av2-line); border-right-color: var(--av2-line); border-bottom-color: var(--av2-line); }
.av2-extra :is(.roles-card, .comms-card, .cl-card, .hive-comb, .nation-card):hover {
    box-shadow: 0 0 0 1px #000, 0 16px 34px -18px rgba(59, 73, 255, .75);
}
.av2-extra :is(.codex-orb, .comms-orb, .hive-orb, .nation-orb) {
    padding: .55rem .9rem;
    border-radius: .9rem;
    background: var(--av2-card);
    border-color: var(--av2-line);
    box-shadow: 0 0 0 1px #000;
}
.av2-extra :is(.comms-orb, .hive-orb, .nation-orb) span { color: var(--av2-sky); }
.av2-extra :is(.codex-orb, .comms-orb, .hive-orb, .nation-orb) b {
    font-family: "Oxygene1", "PusabGD", system-ui, sans-serif;
    font-weight: 400;
    font-size: 1.35rem;
    color: #fff;
}

/* Shared V2 controls, scoped to the opted-in page. */
.av2-extra :is(.codex-chip, .comms-chip, .hive-chip, .nation-chip, .roles-toggle, .comms-copy, .top-race-hud-btn, .nation-fit),
.tpx-race .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    padding: .4rem .75rem;
    border-radius: .75rem;
    font-size: .8rem;
    font-weight: 800;
    color: var(--av2-ink);
    border: 1px solid var(--av2-line);
    background: rgba(143, 160, 255, .08);
    text-decoration: none;
    transition: background .15s, transform .15s;
}
.av2-extra :is(.codex-chip, .comms-chip, .hive-chip, .nation-chip, .roles-toggle, .comms-copy, .top-race-hud-btn, .nation-fit):hover,
.tpx-race .btn:hover { color: #fff; background: rgba(59, 73, 255, .22); transform: translateY(-1px); }
.av2-extra :is(.codex-chip.is-on, .hive-chip.is-on, .nation-chip.is-on, .comms-open, .cl-filters button) {
    color: #fff;
    background: linear-gradient(180deg, var(--av2-blue-2), var(--av2-blue));
    border-color: transparent;
    border-radius: .75rem;
    box-shadow: 0 0 0 2px #000, inset 0 2px 0 rgba(255, 255, 255, .25);
}
.av2-extra :is(.codex-search, .hive-search input, .hive-select, .nation-search input, .nation-select, .cl-filters input, .cl-filters select),
.tpx-race :is(.form-control, .form-select) {
    color: var(--av2-ink);
    background-color: rgba(2, 3, 20, .85);
    border: 1px solid rgba(143, 160, 255, .3);
    border-radius: .7rem;
    box-shadow: inset 0 1px 0 rgba(0, 0, 0, .6);
}
.av2-extra :is(input, select, button, a):focus-visible {
    outline: 2px solid var(--av2-sky);
    outline-offset: 3px;
}
.av2-extra :is(.hive-hud, .nation-hud, .cl-filters, .codex-hud),
.tpx-race > form {
    padding: .75rem .9rem;
    border-radius: 1.1rem;
    border: 1px solid var(--av2-line);
    background: var(--av2-card);
    box-shadow: 0 0 0 1px #000;
    margin: 0 auto 1rem;
}
/* The legacy race form has an inline light background. */
.tpx-race > form { background: var(--av2-card) !important; }
.tpx-race .form-label, .av2-extra .cl-filters label { color: var(--av2-sky); }
.av2-extra :is(.codex-panel, .codex-hud) { max-width: 64rem; }
.av2-extra .roles-ladder { max-width: 48rem; }
.av2-extra .comms-grid { max-width: 68rem; }
.av2-extra :is(.cl-feed, .cl-filters) { max-width: 72rem; }
.av2-extra .roles-how { background: var(--av2-card-2); border-color: var(--av2-line); }
.av2-extra .comms-mark {
    font-family: "Oxygene1", "PusabGD", system-ui, sans-serif;
    font-weight: 400;
    color: #fff;
    background: linear-gradient(180deg, var(--av2-blue-2), var(--av2-blue));
    box-shadow: 0 0 0 2px #000, 0 0 18px rgba(59, 73, 255, .45);
}
.av2-extra .comms-card h2 { color: var(--av2-ink); }
.av2-extra :is(.codex-toast, .comms-toast) {
    position: fixed;
    color: var(--av2-ink);
    background: var(--av2-blue);
}
.av2-extra :is(.cl-ranks b, .hive-rank, .nation-points b, .top-race-chunk-range) {
    font-family: "Oxygene1", "PusabGD", system-ui, sans-serif;
    font-weight: 400;
    text-shadow: 0 2px 0 #000;
}
.av2-extra :is(.top-race-arena, .nation-stage) {
    background: radial-gradient(ellipse at 50% 0%, rgba(59, 73, 255, .2), transparent 65%), var(--av2-card-2);
    border: 1px solid var(--av2-line);
    border-radius: 1.1rem;
    box-shadow: 0 0 0 1px #000;
}
.av2-extra .top-race-arena::before { background: none; }
.av2-extra .top-race-hud { background: var(--av2-card); border-color: var(--av2-line); }
.av2-extra :is(.nation-dock, .nation-map .leaflet-tooltip.nation-tip) {
    color: var(--av2-ink);
    background: var(--av2-card-2);
    border-color: var(--av2-line);
    box-shadow: var(--av2-shadow);
}
.av2-extra .nation-map { background: var(--av2-bg); }
.av2-extra .hive-board-head { color: var(--av2-sky); }
.av2-extra .hive-comb.is-me, .av2-extra .nation-card.is-me { outline-color: var(--av2-gold); }

@media (prefers-reduced-motion: reduce) {
    .av2-extra *, .av2-extra *::before, .av2-extra *::after {
        animation: none !important;
        transition: none !important;
        scroll-behavior: auto !important;
    }
}

/* Улей: ничего не должно вылезать по горизонтали */
.av2-extra.hive-arena, .av2-extra .hive-board-scroll, .av2-extra .hive-combs { max-width: 100%; overflow-x: clip; }
.av2-extra .hive-comb, .av2-extra .hive-board-head { max-width: 100%; }
@media (max-width: 1400px) { .av2-extra .hive-combs { --hive-cols: 2.2rem minmax(0, 1.15fr) minmax(0, .8fr) minmax(0, .55fr) minmax(0, .8fr) repeat(3, minmax(0, 1fr)) minmax(0, .9fr); } .av2-extra .hive-board-head, .av2-extra .hive-comb { gap: .35rem .45rem; padding: .5rem .55rem; } }
