/* The new design over every page that still runs on the old stylesheets. Loaded after frame.css on
   everything but home and news. Not layered, so it wins over app.css. Page-sized fixes sit at the
   end, under the page's name. */

.is-legacy .lk-page {
    background: none;
    box-shadow: none;
}

/* Square corners everywhere. What is really round stays round: status dots, avatars, knobs, numbers. */
.is-legacy .page-shell :where(a, button, input, select, textarea, div, section, article, span, li, table, th, td, details, summary, label, aside, nav, header, footer, form, b, em, small, strong):not(.hanzo *, [class*="knob"], [class*="dot"], [class*="orb"], [class*="avatar"], [class*="thumb"], [class*="round"], [class*="circle"], [class*="status"], [class*="spin"], [class*="stepno"], [class*="__num"], [class*="__no"], .forum-page *) {
    border-radius: 0;
}

/* Panels: the card frame for a block on the page, a hairline for a block inside a block. */
.is-legacy .page-shell .content-panel {
    border: 1px solid rgba(143, 111, 53, .24);
    background: var(--k-card);
    box-shadow: none;
}

.is-legacy .page-shell > .content-panel,
.is-legacy .page-shell > section > .content-panel,
.is-legacy .page-shell > div > .content-panel {
    border: 6px solid transparent;
    border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
    background: var(--k-card) padding-box;
}

.is-legacy .page-shell :is(h1, h2, h3) {
    font-family: var(--font-title);
}

.is-legacy .page-shell .content-panel h1 {
    color: var(--k-gold2);
}

/* The main action of a block wears the site's plate instead of a gold pill. The prefix outweighs the
   page stylesheets, which load after this file. */
.is-legacy .page-shell .bank-transfer__button,
.is-legacy .page-shell .donate-card__go,
.is-legacy .page-shell .donate-pack__buy,
.is-legacy .page-shell .epic-wallet__topup,
.is-legacy .page-shell .pin-session__button,
.is-legacy .page-shell .siege-cta,
.is-legacy .page-shell .streamers-join__cta,
.is-legacy .page-shell .first-steps__button,
.is-legacy .page-shell .first-steps__get,
.is-legacy .page-shell .invite-cta,
.is-legacy .page-shell .referral-share button,
.is-legacy .page-shell .referral-take,
.is-legacy .page-shell .starter__button,
.is-legacy .page-shell .vipx-price__buy,
.is-legacy .page-shell .armory__button--gold,
.is-legacy .page-shell .bp-btn--gold,
.is-legacy .page-shell .epic-service__buy,
.is-legacy .page-shell .drops-search .admin-button--primary,
.is-legacy .page-shell .assistant-form button[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    min-height: 42px;
    padding: 4px 44px;
    border: 0;
    border-image: url(../images/button-plate.webp) 40 130 fill / 21px 46px / 0 stretch;
    border-radius: 0;
    background: none;
    box-shadow: none;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .04em;
    line-height: 1.15;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
}

.is-legacy .page-shell .bank-transfer__button:hover,
.is-legacy .page-shell .donate-card__go:hover,
.is-legacy .page-shell .donate-pack__buy:hover,
.is-legacy .page-shell .epic-wallet__topup:hover,
.is-legacy .page-shell .pin-session__button:hover,
.is-legacy .page-shell .siege-cta:hover,
.is-legacy .page-shell .streamers-join__cta:hover,
.is-legacy .page-shell .first-steps__button:hover,
.is-legacy .page-shell .first-steps__get:hover,
.is-legacy .page-shell .invite-cta:hover,
.is-legacy .page-shell .referral-share button:hover,
.is-legacy .page-shell .referral-take:hover,
.is-legacy .page-shell .starter__button:hover,
.is-legacy .page-shell .vipx-price__buy:hover,
.is-legacy .page-shell .armory__button--gold:hover,
.is-legacy .page-shell .bp-btn--gold:hover,
.is-legacy .page-shell .epic-service__buy:hover,
.is-legacy .page-shell .drops-search .admin-button--primary:hover,
.is-legacy .page-shell .assistant-form button[type="submit"]:hover {
    background: none;
    box-shadow: none;
    color: #fff;
    filter: brightness(1.18);
}

/* Switches and tabs of the old pages: a gold line on, no filled pill. */
.drops-views a.is-active {
    border-color: var(--k-gold);
    background: rgba(217, 169, 78, .16);
    box-shadow: none;
    color: var(--k-gold2);
}

/* A strip added to a page with its own heading: the strip says it, the heading stays for readers of the markup. */
.is-legacy:has(.nn-title--own) .page-shell h1:not(.hanzo__menutitle) {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

/* Fruits: the chance line in the site's colours, red still the harsh end. */
.fruit-chance__bar {
    background-image: linear-gradient(90deg, #6e1218, #9c1c22 40%, #d9a94e);
}

/* Shop: the buy button beside the count, crimson with a gold cross instead of the green pill. */
.is-legacy .page-shell .epic-service__add {
    background: linear-gradient(180deg, #a51d24, #6e1218);
    box-shadow: inset 0 0 0 1px rgba(217, 169, 78, .55);
}

.is-legacy .page-shell .epic-service__add::before,
.is-legacy .page-shell .epic-service__add::after {
    background: var(--k-gold2);
}

.is-legacy .page-shell .epic-service__add:not(:disabled):hover {
    filter: brightness(1.2);
}

/* Single-card forms (password recovery, the account and admin PIN): the site's card frame, not the
   old banner picture that showed through as a box inside the box. */
.page-shell .auth-shell .auth-card {
    border: 6px solid transparent;
    border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
    background: var(--k-card) padding-box;
    box-shadow: 0 24px 48px -16px #000;
    padding: 30px 32px 26px;
}

.page-shell .auth-shell .auth-card::before {
    content: none;
}

/* Referral page: the card frame and the site's black, gold and crimson instead of the brown glow. */
.is-legacy .page-shell .referral-hero {
    border: 6px solid transparent;
    border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
    background:
        radial-gradient(ellipse 60% 90% at 80% 45%, rgba(156, 28, 34, .5), transparent 70%) padding-box,
        linear-gradient(120deg, #0b0a0c 0%, #141215 55%, #1d0d10 100%) padding-box;
    box-shadow: 0 22px 50px -20px #000;
}

.is-legacy .page-shell .referral-hero h1 {
    font-family: var(--font-title);
    color: var(--k-gold2);
}

.is-legacy .page-shell .referral-kicker {
    color: var(--k-gold);
}

.is-legacy .page-shell .referral-totals li {
    border-color: rgba(143, 111, 53, .35);
    background: rgba(0, 0, 0, .45);
}

.is-legacy .page-shell .referral-totals strong {
    font-family: var(--font-title);
    color: var(--k-gold2);
}

.is-legacy .page-shell .referral-share input {
    border: 1px solid rgba(143, 111, 53, .45);
    background: #0e0c0f;
    color: var(--k-text);
}

.is-legacy .page-shell .referral-block {
    border: 6px solid transparent;
    border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
    background: var(--k-card) padding-box;
}

.is-legacy .page-shell .referral-block h2 {
    font-family: var(--font-title);
    color: var(--k-gold2);
}

.is-legacy .page-shell .referral-rung {
    border-color: rgba(143, 111, 53, .3);
    background: linear-gradient(180deg, var(--k-card2), rgba(0, 0, 0, .35));
}

.is-legacy .page-shell .referral-rung--top {
    border-color: var(--k-gold);
    background: linear-gradient(180deg, rgba(156, 28, 34, .45), rgba(20, 8, 10, .6));
    box-shadow: 0 0 26px rgba(156, 28, 34, .35);
}

.is-legacy .page-shell .referral-rung__stage {
    font-family: var(--font-title);
    color: var(--k-gold2);
}

.is-legacy .page-shell .referral-rung__pay {
    border-color: rgba(143, 111, 53, .2);
    background: rgba(0, 0, 0, .35);
}

/* One drawn picture instead of the two class figures: it fills the right part, faded into the text side. */
.is-legacy .page-shell .referral-hero__art--one img {
    inset: 0 0 0 auto;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center right;
    opacity: 1;
}

/* Streamer page: the card frame, a crimson-lit head, muted hints (red only on a field with an error). */
.is-legacy .page-shell .account-streamer-page .account-password-form,
.is-legacy .page-shell .account-streamer-page .account-activity {
    gap: 14px;
    padding: 22px 26px 24px;
    border: 6px solid transparent;
    border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
    border-radius: 0;
    background: var(--k-card) padding-box;
    box-shadow: 0 22px 50px -20px #000;
}

.is-legacy .page-shell .account-streamer-page .account-password-form__head,
.is-legacy .page-shell .account-streamer-page .account-activity__head {
    gap: 6px;
    margin: -22px -26px 4px;
    padding: 26px 26px 22px;
    border-bottom: 1px solid rgba(143, 111, 53, .35);
    background:
        radial-gradient(ellipse 55% 120% at 85% 0%, rgba(156, 28, 34, .5), transparent 70%),
        linear-gradient(120deg, #0b0a0c 0%, #141215 60%, #1d0d10 100%);
}

.is-legacy .page-shell .account-streamer-page .auth-kicker {
    color: var(--k-gold);
    letter-spacing: .14em;
}

.is-legacy .page-shell .account-streamer-page h1 {
    font-family: var(--font-title);
    font-size: 28px;
    color: var(--k-gold2);
    letter-spacing: .04em;
}

.is-legacy .page-shell .account-streamer-page .account-password-form__head p {
    color: var(--k-mute);
    font-size: 14px;
}

.is-legacy .page-shell .account-streamer-page .streamers-link {
    justify-self: start;
    min-height: 34px;
    padding: 0 18px;
    border: 1px solid rgba(143, 111, 53, .55);
    border-radius: 0;
    background: var(--k-card2);
    color: var(--k-gold2);
    font-family: var(--font-title);
    font-size: 13px;
    letter-spacing: .06em;
}

.is-legacy .page-shell .account-streamer-page .streamers-link:hover {
    background: linear-gradient(180deg, #ebb750, #c79b44);
    box-shadow: 0 0 16px rgba(235, 183, 80, .45);
    color: #fff;
}

.is-legacy .page-shell .account-streamer-page .auth-field label {
    color: var(--k-gold);
    font-size: 11px;
    letter-spacing: .08em;
}

.is-legacy .page-shell .account-streamer-page .auth-field small {
    color: var(--k-mute);
    font-size: 12px;
}

.is-legacy .page-shell .account-streamer-page .auth-field.has-error small {
    color: #e4606a;
}

.is-legacy .page-shell .account-streamer-page .auth-field textarea {
    border: 1px solid rgba(235, 183, 80, .15);
    border-left: 2px solid rgba(235, 183, 80, .5);
    border-radius: 0;
    background: #171617;
    color: #fff5e0;
}

.is-legacy .page-shell .account-streamer-page .streamer-platform-pick span {
    border-color: rgba(143, 111, 53, .4);
    border-radius: 0;
    background: var(--k-card2);
    color: var(--k-text);
}

.is-legacy .page-shell .account-streamer-page .streamer-platform-pick span::before {
    border-color: rgba(217, 169, 78, .55);
    border-radius: 2px;
}

.is-legacy .page-shell .account-streamer-page .account-streamer-status span {
    border-color: rgba(143, 111, 53, .35);
    border-radius: 0;
    background: rgba(0, 0, 0, .45);
}

.is-legacy .page-shell .account-streamer-page .account-streamer-status strong {
    font-family: var(--font-title);
    color: var(--k-gold2);
}

/* Drawn picture in the streamer head, once newnew/images/streamer-hero.webp exists: right side, faded into the text. */
.is-legacy .page-shell .account-streamer-page .account-password-form__head {
    position: relative;
    overflow: hidden;
    /* Owner, 2026-11-04: in a 115px strip the picture looked squeezed - the head is as tall as the picture's
       own 16:3 at the width it gets, so it shows whole instead of a cut-off slice. */
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 200px;
}

.is-legacy .page-shell .account-streamer-page .account-password-form__head > :not(.account-streamer-hero) {
    position: relative;
}

.is-legacy .page-shell .account-streamer-page .account-streamer-hero {
    position: absolute;
    inset: 0 0 0 auto;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center right;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 45%);
    mask-image: linear-gradient(90deg, transparent, #000 45%);
}

/* Invoices: the card frame on the head, the three notes and the empty sheet; rows as framed plates. */
.is-legacy .page-shell .account-invoices__hero,
.is-legacy .page-shell .account-invoices__empty {
    border: 6px solid transparent;
    border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
    border-radius: 0;
    box-shadow: 0 22px 50px -20px #000;
}

.is-legacy .page-shell .account-invoices__hero {
    background:
        radial-gradient(ellipse 50% 120% at 90% 50%, rgba(156, 28, 34, .45), transparent 70%) padding-box,
        linear-gradient(120deg, #0b0a0c 0%, #141215 60%, #1d0d10 100%) padding-box;
}

.is-legacy .page-shell .account-invoices__empty {
    background:
        radial-gradient(ellipse 40% 90% at 12% 50%, rgba(156, 28, 34, .3), transparent 70%) padding-box,
        var(--k-card) padding-box;
}

.is-legacy .page-shell .account-invoices__hero h1,
.is-legacy .page-shell .account-invoices__empty-text h2 {
    font-family: var(--font-title);
    color: var(--k-gold2);
}

.is-legacy .page-shell .account-invoices__hero p,
.is-legacy .page-shell .account-invoices__empty-text p,
.is-legacy .page-shell .account-invoices__features li {
    color: var(--k-mute);
}

.is-legacy .page-shell .account-invoices__features li {
    border: 1px solid rgba(143, 111, 53, .35);
    border-top: 2px solid var(--k-line);
    border-radius: 0;
    background: linear-gradient(180deg, var(--k-card2), var(--k-card));
}

.is-legacy .page-shell .account-invoices__features b {
    font-family: var(--font-title);
    color: var(--k-text);
}

.is-legacy .page-shell .account-invoices__icon {
    border: 1px solid rgba(217, 169, 78, .45);
    border-radius: 0;
    background: radial-gradient(circle, rgba(156, 28, 34, .55), rgba(20, 8, 10, .9));
    color: var(--k-gold2);
}

.is-legacy .page-shell .account-invoices__paper {
    border-radius: 2px;
    background: linear-gradient(180deg, #f5ead2, #e6d6b4);
    box-shadow: 0 14px 36px rgba(0, 0, 0, .6), 0 0 0 1px rgba(143, 111, 53, .6);
}

.is-legacy .page-shell .account-invoices__paper-head i {
    color: var(--k-red2);
}

.is-legacy .page-shell .account-invoices__paper-total {
    background: var(--k-red2);
}

.is-legacy .page-shell .account-invoices__empty .button.primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 4px 44px;
    border: 0;
    border-image: url(../images/button-plate.webp) 40 130 fill / 21px 46px / 0 stretch;
    border-radius: 0;
    background: none;
    box-shadow: none;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .04em;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
}

.is-legacy .page-shell .account-invoices__empty .button.primary:hover {
    background: none;
    filter: brightness(1.2);
}

.is-legacy .page-shell .account-invoices__list a {
    border: 1px solid rgba(143, 111, 53, .35);
    border-left: 2px solid var(--k-line);
    border-radius: 0;
    background: linear-gradient(90deg, var(--k-card2), var(--k-card));
    color: var(--k-text);
}

.is-legacy .page-shell .account-invoices__list a:hover {
    border-color: var(--k-gold);
    background: linear-gradient(90deg, rgba(156, 28, 34, .35), var(--k-card));
}

.is-legacy .page-shell .account-invoices__no,
.is-legacy .page-shell .account-invoices__open {
    color: var(--k-gold);
}

.is-legacy .page-shell .account-invoices__sum {
    font-family: var(--font-title);
    color: var(--k-gold2);
}

.is-legacy .page-shell .account-invoices__empty .button.primary {
    height: auto;
    min-height: 46px;
    padding: 6px 52px;
    letter-spacing: .03em;
}

.is-legacy .page-shell .account-invoices__icon-art {
    width: 72px;
    height: 72px;
    margin: -4px 0 2px -6px;
    object-fit: contain;
    filter: drop-shadow(0 6px 14px rgba(0, 0, 0, .6));
}

/* Battle Pass: the site's palette (gold and crimson in place of the old green), the card frame on the
   header, the tier track and the achievements, square plates instead of pills. */
.is-legacy .page-shell .bp {
    --bp-panel: var(--k-card);
    --bp-raise: var(--k-card2);
    --bp-line: rgba(143, 111, 53, .3);
    --bp-accent: var(--k-gold);
    --bp-accent-2: #a87a2c;
    --bp-text: var(--k-text);
    --bp-dim: var(--k-mute);
}

.is-legacy .page-shell .bp-box,
.is-legacy .page-shell .bp-top {
    border: 6px solid transparent;
    border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
    border-radius: 0;
    background: var(--k-card) padding-box;
    box-shadow: 0 22px 50px -20px #000;
}

.is-legacy .page-shell .bp-top {
    background:
        radial-gradient(ellipse 45% 130% at 88% 50%, rgba(156, 28, 34, .45), transparent 70%) padding-box,
        linear-gradient(120deg, #0b0a0c 0%, #141215 60%, #1d0d10 100%) padding-box;
}

.is-legacy .page-shell .bp-top__row h1,
.is-legacy .page-shell .bp-heading,
.is-legacy .page-shell .bp-ach__bar h2,
.is-legacy .page-shell .bp-ach__name {
    font-family: var(--font-title);
    color: var(--k-gold2);
}

.is-legacy .page-shell .bp-heading {
    border-bottom: 1px solid var(--k-line);
}

.is-legacy .page-shell .bp-top__ring > div {
    background: #0e0c0f;
}

.is-legacy .page-shell .bp-top__ring strong {
    font-family: var(--font-title);
    color: var(--k-gold2);
}

.is-legacy .page-shell .bp-chip,
.is-legacy .page-shell .bp-tab__badge,
.is-legacy .page-shell .bp-pill,
.is-legacy .page-shell .bp-pill b,
.is-legacy .page-shell .bp-ach__groups b,
.is-legacy .page-shell .bp-card,
.is-legacy .page-shell .bp-card__art,
.is-legacy .page-shell .bp-more,
.is-legacy .page-shell .bp-btn--ghost,
.is-legacy .page-shell .bp-btn--premium,
.is-legacy .page-shell .bp-arrow,
.is-legacy .page-shell .bp-ach__search,
.is-legacy .page-shell .bp-flash {
    border-radius: 0;
}

.is-legacy .page-shell .bp-bar {
    border-radius: 0;
    background: rgba(0, 0, 0, .55);
    box-shadow: inset 0 0 0 1px rgba(143, 111, 53, .3);
}

.is-legacy .page-shell .bp-bar i {
    border-radius: 0;
    background: linear-gradient(90deg, var(--k-red2), var(--k-gold));
}

/* Tier tabs: the account strip's tab look. */
.is-legacy .page-shell .bp-tabs {
    background: #0b0a0c;
    border-bottom-color: var(--k-line);
}

.is-legacy .page-shell .bp-tab.is-active {
    border-bottom-color: var(--k-gold);
    background: linear-gradient(180deg, rgba(156, 28, 34, .35), var(--k-card));
}

.is-legacy .page-shell .bp-tab__copy strong {
    font-family: var(--font-title);
}

.is-legacy .page-shell .bp-tab.is-active .bp-tab__badge {
    background: linear-gradient(180deg, #ebb750, #c79b44);
    color: #fff;
    box-shadow: 0 0 14px rgba(235, 183, 80, .4);
}

.is-legacy .page-shell .bp-tab.is-owned .bp-tab__badge,
.is-legacy .page-shell .bp-chip--owned {
    border-color: var(--k-gold2);
    color: var(--k-gold2);
}

.is-legacy .page-shell .bp-btn--ghost {
    border-color: var(--k-line);
    background: var(--k-card2);
    color: var(--k-gold2);
    font-family: var(--font-title);
}

.is-legacy .page-shell .bp-btn--ghost:hover {
    background: linear-gradient(180deg, #ebb750, #c79b44);
    color: #fff;
    transform: none;
}

/* Track: a reward ready to take glows gold, not green. */
.is-legacy .page-shell .bp-node__disc {
    border-radius: 0;
}

.is-legacy .page-shell .bp-node.is-ready .bp-node__disc {
    border-color: var(--k-gold2);
    box-shadow: 0 0 0 3px rgba(235, 183, 80, .2), 0 0 18px rgba(235, 183, 80, .45);
}

.is-legacy .page-shell .bp-node__take {
    background: var(--k-red2);
    color: #fff;
}

.is-legacy .page-shell .bp-upgrade {
    border-radius: 0;
    border-top-color: var(--k-line);
    background:
        linear-gradient(90deg, rgba(156, 28, 34, .55), rgba(110, 18, 24, .25) 60%, rgba(156, 28, 34, .55)),
        repeating-linear-gradient(135deg, rgba(240, 198, 116, .08) 0 10px, transparent 10px 20px);
    color: var(--k-text);
    font-family: var(--font-title);
}

.is-legacy .page-shell .bp-upgrade b {
    color: var(--k-gold2);
}

/* Achievement filters: squared tabs like the admin sub-menus. */
.is-legacy .page-shell .bp-pill {
    border-color: rgba(143, 111, 53, .4);
    background: var(--k-card2);
    color: var(--k-text);
}

.is-legacy .page-shell .bp-pill.is-active {
    border-color: transparent;
    background: linear-gradient(180deg, #ebb750, #c79b44);
    box-shadow: 0 0 16px rgba(235, 183, 80, .45);
    color: #fff;
}

.is-legacy .page-shell .bp-pill--ready:not(.is-active) {
    border-color: var(--k-red2);
    background: linear-gradient(180deg, rgba(156, 28, 34, .55), rgba(110, 18, 24, .35));
    color: var(--k-gold2);
    box-shadow: 0 0 12px rgba(156, 28, 34, .45);
}

.is-legacy .page-shell .bp-pill--ready:not(.is-active) b {
    background: rgba(0, 0, 0, .35);
    color: var(--k-gold2);
}

.is-legacy .page-shell .bp-ach__search {
    border: 1px solid rgba(235, 183, 80, .15);
    border-left: 2px solid rgba(235, 183, 80, .5);
    background: #171617;
    color: #fff5e0;
}

/* Cards. */
.is-legacy .page-shell .bp-card {
    border-color: rgba(143, 111, 53, .3);
    background: linear-gradient(180deg, var(--k-card2), #100e11);
}

.is-legacy .page-shell .bp-card.is-ready {
    border-color: var(--k-gold);
    background: linear-gradient(180deg, rgba(156, 28, 34, .4), #140c0e);
    box-shadow: 0 0 20px rgba(156, 28, 34, .35);
}

.is-legacy .page-shell .bp-card.is-done {
    border-color: rgba(245, 212, 138, .5);
}

.is-legacy .page-shell .bp-card.is-done .bp-card__pay,
.is-legacy .page-shell .bp-card.is-done .bp-card__progress small {
    color: var(--k-gold2);
}

.is-legacy .page-shell .bp-card.is-done .bp-card__art {
    border-color: var(--k-gold2);
}

.is-legacy .page-shell .bp-card.is-done .bp-bar i {
    background: var(--k-gold2);
}

.is-legacy .page-shell .bp-card__pay {
    font-family: var(--font-title);
}

.is-legacy .page-shell .bp-more {
    border-color: rgba(143, 111, 53, .45);
}

.is-legacy .page-shell .bp-more span {
    border: 1px solid var(--k-line);
    border-radius: 0;
    background: var(--k-card2);
    color: var(--k-gold2);
    font-family: var(--font-title);
}

.is-legacy .page-shell .bp-more:hover span {
    background: linear-gradient(180deg, #ebb750, #c79b44);
    color: #fff;
}

.is-legacy .page-shell .bp-flash {
    border-color: var(--k-line);
    background: var(--k-card2);
    color: var(--k-gold2);
}

/* Bank: both panels and the coins/jewels strip in the card frame, square controls, the transfer plate wide
   enough for its word. */
.is-legacy .page-shell .bank-panel,
.is-legacy .page-shell .jewel-bank {
    border: 6px solid transparent;
    border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
    border-radius: 0;
    background: var(--k-card) padding-box;
    box-shadow: 0 22px 50px -20px #000;
}

.is-legacy .page-shell .bank-panel {
    background:
        radial-gradient(ellipse 70% 30% at 50% 0%, rgba(156, 28, 34, .3), transparent 75%) padding-box,
        var(--k-card) padding-box;
}

.is-legacy .page-shell .jewel-bank {
    padding: 10px 18px;
    background: linear-gradient(90deg, #1d0d10, var(--k-card) 30%, var(--k-card) 70%, #1d0d10) padding-box;
}

.is-legacy .page-shell .jewel-bank__title {
    font-family: var(--font-title);
    color: var(--k-gold);
}

.is-legacy .page-shell .jewel-bank__item {
    color: var(--k-text);
}

.is-legacy .page-shell .jewel-bank__item strong {
    color: var(--k-gold2);
}

.is-legacy .page-shell .bank-panel__head {
    border-bottom-color: var(--k-line);
}

.is-legacy .page-shell .bank-panel__mark {
    border: 1px solid var(--k-gold);
    border-radius: 0;
    background: radial-gradient(circle, rgba(156, 28, 34, .6), rgba(20, 8, 10, .9));
    color: var(--k-gold2);
    font-family: var(--font-title);
}

.is-legacy .page-shell .bank-panel__head h1,
.is-legacy .page-shell .bank-panel__head h2 {
    font-family: var(--font-title);
    color: var(--k-gold2);
}

.is-legacy .page-shell .bank-panel__head p {
    color: var(--k-mute);
    letter-spacing: .08em;
}

.is-legacy .page-shell .bank-grid {
    border-color: var(--k-line);
    border-radius: 0;
    background:
        linear-gradient(rgba(143, 111, 53, .22) 1px, transparent 1px),
        linear-gradient(90deg, rgba(143, 111, 53, .22) 1px, transparent 1px),
        #0e0c0f;
    background-size: var(--bank-cell) var(--bank-cell);
    box-shadow: inset 0 0 30px rgba(0, 0, 0, .7);
}

.is-legacy .page-shell .bank-grid__item.is-selected {
    border-radius: 0;
    background: rgba(156, 28, 34, .3);
    box-shadow: 0 0 0 1px var(--k-gold2), 0 0 18px rgba(235, 183, 80, .3);
}

/* Middle column: R(eturn) / move / sell. Gold when chosen, crimson when it can be pressed. */
.is-legacy .page-shell .bank-action {
    border: 1px solid rgba(143, 111, 53, .4);
    border-radius: 0;
    background: var(--k-card2);
    color: var(--k-mute);
    font-family: var(--font-title);
}

.is-legacy .page-shell .bank-action--active {
    border-color: transparent;
    background: linear-gradient(180deg, #ebb750, #c79b44);
    box-shadow: 0 0 16px rgba(235, 183, 80, .45);
    color: #fff;
}

.is-legacy .page-shell .bank-action:not(:disabled):not(.bank-action--active) {
    border-color: var(--k-gold);
    background: linear-gradient(180deg, var(--k-red2), var(--k-red));
    box-shadow: 0 0 14px rgba(156, 28, 34, .5);
    color: var(--k-gold2);
}

.is-legacy .page-shell .bank-action:disabled {
    opacity: .55;
}

.is-legacy .page-shell .bank-transfer-form {
    grid-template-columns: minmax(0, 1fr) minmax(140px, 160px);
    width: min(100%, 400px);
}

.is-legacy .page-shell .bank-transfer span {
    color: var(--k-gold);
    font-size: 11px;
    letter-spacing: .08em;
}

.is-legacy .page-shell .bank-transfer input {
    min-height: 42px;
    border: 1px solid rgba(235, 183, 80, .15);
    border-left: 2px solid rgba(235, 183, 80, .5);
    border-radius: 0;
    background: #171617;
    color: var(--k-gold2);
}

.is-legacy .page-shell .bank-transfer__button {
    width: 100%;
    padding: 4px 30px;
}

.is-legacy .page-shell .bank-transfer__button:disabled {
    filter: grayscale(1) brightness(.6);
}

.is-legacy .page-shell .bank-menu {
    border-color: var(--k-line);
    border-radius: 0;
    background: var(--k-card);
}

/* The three invoice notes wear the card frame too (owner, 2026-11-03). */
.is-legacy .page-shell .account-invoices__features li {
    border: 6px solid transparent;
    border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
    background:
        radial-gradient(ellipse 70% 50% at 50% 0%, rgba(156, 28, 34, .25), transparent 75%) padding-box,
        var(--k-card) padding-box;
    box-shadow: 0 18px 40px -20px #000;
}

/* Battle Pass on a phone: less padding inside the boxes so the cards get the width, the search full
   width, the filters in one sideways-scrolling row, the track arrows beside the legend. */
@media (max-width: 760px) {
    .is-legacy .page-shell .bp-box {
        padding: 14px 12px;
    }

    .is-legacy .page-shell .bp-ach__set {
        padding: 0 0 14px;
    }

    .is-legacy .page-shell .bp-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .is-legacy .page-shell .bp-ach__bar {
        gap: 10px;
    }

    .is-legacy .page-shell .bp-ach__search {
        flex: 1 1 100%;
        width: 100%;
        margin-left: 0;
    }

    .is-legacy .page-shell .bp-ach__chips {
        flex: 1 1 100%;
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 4px;
        scrollbar-width: thin;
    }

    .is-legacy .page-shell .bp-pill {
        flex: none;
        white-space: nowrap;
    }

    .is-legacy .page-shell .bp-panel__head {
        flex-wrap: nowrap;
        align-items: center;
        padding-inline: 12px;
    }

    .is-legacy .page-shell .bp-top {
        gap: 14px;
        padding: 14px;
    }

    .is-legacy .page-shell .bp-panel__side {
        display: none;
    }

    .is-legacy .page-shell .bp-top__row h1 {
        font-size: 24px;
    }

    .is-legacy .page-shell .bp-upgrade {
        padding: 11px 12px;
    }
}

/* The nowrap filter row must scroll inside its box, not widen the page grid. */
.is-legacy .page-shell .bp > *,
.is-legacy .page-shell .bp-ach__bar > * {
    min-width: 0;
}

/* Drawn bank buttons (bank-actions--art, set by _bank-board.php once the three pictures exist): the picture
   is the whole button, the letter stays for screen readers only. The pressable state above paints a crimson
   gradient with a stronger selector, so the second selector here and the .bank-action in the picture rules
   outrank it - otherwise an enabled button turns into a plain red square. */
.is-legacy .page-shell .bank-actions--art .bank-action,
.is-legacy .page-shell .bank-actions--art .bank-action:not(:disabled):not(.bank-action--active) {
    width: 56px;
    height: 56px;
    border: 0;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    box-shadow: none;
    color: transparent;
    font-size: 0;
}

.is-legacy .page-shell .bank-actions--art .bank-action svg {
    display: none;
}

.is-legacy .page-shell .bank-actions--art .bank-action[data-bank-refresh] {
    background-image: url(../images/bank-refresh.webp);
}

.is-legacy .page-shell .bank-actions--art .bank-action[data-bank-move-selected] {
    background-image: url(../images/bank-move.webp);
}

.is-legacy .page-shell .bank-actions--art [data-bank-move-selected][data-dir="left"] {
    transform: scaleX(-1);
}

.is-legacy .page-shell .bank-actions--art .bank-action[data-bank-sell-selected] {
    background-image: url(../images/bank-sell.webp);
}

.is-legacy .page-shell .bank-actions--art .bank-action:not(:disabled):hover {
    filter: brightness(1.2) drop-shadow(0 0 10px rgba(235, 183, 80, .5));
}

.is-legacy .page-shell .bank-actions--art .bank-action:disabled {
    filter: grayscale(1) brightness(.55);
    opacity: 1;
}

.is-legacy .page-shell .bank-actions--art .bank-action--active,
.is-legacy .page-shell .bank-actions--art .bank-action:not(:disabled):not(.bank-action--active) {
    border: 0;
    background-color: transparent;
    box-shadow: none;
}

/* Account profile (/account): the password and PIN cards and the account history get the streamer page's
   treatment - card frame, crimson-lit head, gold title, muted hints, a gold PIN dot instead of green. */
.is-legacy .page-shell .account-settings .account-password-form,
.is-legacy .page-shell .account-settings .account-activity {
    gap: 14px;
    padding: 22px 26px 24px;
    border: 6px solid transparent;
    border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
    border-radius: 0;
    background: var(--k-card) padding-box;
    box-shadow: 0 22px 50px -20px #000;
}

.is-legacy .page-shell .account-settings .account-password-form__head,
.is-legacy .page-shell .account-settings .account-activity__head {
    gap: 6px;
    margin: -22px -26px 4px;
    padding: 24px 26px 18px;
    border-bottom: 1px solid rgba(143, 111, 53, .35);
    background:
        radial-gradient(ellipse 55% 120% at 85% 0%, rgba(156, 28, 34, .5), transparent 70%),
        linear-gradient(120deg, #0b0a0c 0%, #141215 60%, #1d0d10 100%);
}

.is-legacy .page-shell .account-settings .auth-kicker {
    color: var(--k-gold);
    letter-spacing: .14em;
}

.is-legacy .page-shell .account-settings h1 {
    font-family: var(--font-title);
    font-size: 24px;
    color: var(--k-gold2);
    letter-spacing: .04em;
}

.is-legacy .page-shell .account-settings .account-password-form__head p {
    color: var(--k-mute);
    font-size: 13px;
}

.is-legacy .page-shell .account-settings .auth-field label {
    color: var(--k-gold);
    font-size: 11px;
    letter-spacing: .08em;
}

.is-legacy .page-shell .account-settings .auth-field small {
    color: var(--k-mute);
    font-size: 12px;
}

.is-legacy .page-shell .account-settings .auth-field.has-error small {
    color: #e4606a;
}

.is-legacy .page-shell .account-settings .account-pin__state {
    top: 24px;
    right: 26px;
    color: var(--k-text) !important;
}

.is-legacy .page-shell .account-settings .account-pin__state span {
    border-radius: 0;
    transform: rotate(45deg);
    background: #5a5148;
}

.is-legacy .page-shell .account-settings .account-pin.is-on .account-pin__state span {
    background: var(--k-gold2);
    box-shadow: 0 0 10px rgba(235, 183, 80, .8);
}

.is-legacy .page-shell .account-settings .account-activity__table th {
    padding-bottom: 9px;
    color: var(--k-gold);
    font-family: var(--font-title);
}

.is-legacy .page-shell .account-settings .account-activity__table td {
    padding: 10px;
    border-top-color: rgba(143, 111, 53, .22);
    color: var(--k-text);
}

.is-legacy .page-shell .account-settings .account-activity__table tbody tr:hover td {
    background: rgba(156, 28, 34, .14);
}

.is-legacy .page-shell .account-settings .account-activity__time,
.is-legacy .page-shell .account-settings .account-activity__details {
    color: var(--k-mute);
}

.is-legacy .page-shell .account-settings .account-activity__character {
    color: var(--k-gold);
}

.is-legacy .page-shell .account-settings .account-activity__amount.is-loss {
    color: #e4606a;
}

.is-legacy .page-shell .account-settings .account-activity__amount.is-gain {
    color: var(--k-gold2);
}

.is-legacy .page-shell .account-settings .account-activity__more {
    min-height: 34px;
    padding: 0 18px;
    border: 1px solid rgba(143, 111, 53, .55);
    border-radius: 0;
    background: var(--k-card2);
    color: var(--k-gold2);
    font-family: var(--font-title);
    font-size: 12px;
}

.is-legacy .page-shell .account-settings .account-activity__more:hover {
    background: linear-gradient(180deg, #ebb750, #c79b44);
    box-shadow: 0 0 16px rgba(235, 183, 80, .45);
    color: #fff;
}

@media (max-width: 760px) {
    .is-legacy .page-shell .account-settings .account-password-form,
    .is-legacy .page-shell .account-settings .account-activity {
        padding: 18px 14px 20px;
    }

    .is-legacy .page-shell .account-settings .account-password-form__head,
    .is-legacy .page-shell .account-settings .account-activity__head {
        margin: -18px -14px 4px;
        padding: 20px 14px 16px;
    }

    .is-legacy .page-shell .account-settings .account-pin__state {
        top: 20px;
        right: 14px;
    }
}

/* Character page, admin: the button that loads the admin block on request. */
.is-legacy .page-shell .admin-character-resources--idle {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 18px;
    padding: 18px 22px;
    border: 6px solid transparent;
    border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
    background: var(--k-card) padding-box;
    color: var(--k-mute);
    font-size: 13px;
}

.is-legacy .page-shell .admin-character-resources--idle .admin-button {
    min-height: 38px;
    padding: 0 20px;
    border: 0;
    border-radius: 0;
    background: linear-gradient(180deg, #ebb750, #c79b44);
    box-shadow: 0 0 16px rgba(235, 183, 80, .4);
    color: #fff;
    font-family: var(--font-title);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
}

/* Donate in the new design (owner, 2026-11-03: "no frames"): the hero, the payment step, the packages,
   the methods and the FAQ in the card frame; square chips and markers; gold and crimson only. */
.is-legacy .page-shell .donx-hero,
.is-legacy .page-shell .donx-pay,
.is-legacy .page-shell .donx-faq__help,
.is-legacy .page-shell .donx-q,
.is-legacy .page-shell .donx-pack,
.is-legacy .page-shell .donx-method {
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  border-radius: 0;
  box-shadow: none;
}
.is-legacy .page-shell .donx-hero {
  background:
    radial-gradient(60% 90% at 78% 30%, rgba(156, 28, 34, .35), transparent 70%) padding-box,
    var(--k-card) padding-box;
}
.is-legacy .page-shell .donx-pay {
  background:
    radial-gradient(50% 120% at 100% 0%, rgba(156, 28, 34, .25), transparent 70%) padding-box,
    var(--k-card) padding-box;
}
.is-legacy .page-shell .donx-faq__help,
.is-legacy .page-shell .donx-q,
.is-legacy .page-shell .donx-method {
  background: var(--k-card) padding-box;
}
.is-legacy .page-shell .donx-pack {
  background: linear-gradient(180deg, rgba(110, 18, 24, .35), var(--k-card) 60%) padding-box;
}
.is-legacy .page-shell .donx-pack:hover,
.is-legacy .page-shell .donx-method:hover {
  filter: brightness(1.15);
}
.is-legacy .page-shell .donx-pack.is-popular {
  background: linear-gradient(180deg, rgba(156, 28, 34, .5), var(--k-card) 65%) padding-box;
}
.is-legacy .page-shell .donx-pack:has(input:checked) {
  background: linear-gradient(180deg, rgba(156, 28, 34, .75), rgba(60, 12, 16, .9) 70%) padding-box;
  box-shadow: 0 0 0 2px var(--k-gold), 0 0 22px rgba(156, 28, 34, .6);
}
.is-legacy .page-shell .donx-pack__dot {
  border-radius: 0;
  transform: rotate(45deg) scale(.8);
  border-color: rgba(217, 169, 78, .45);
}
.is-legacy .page-shell .donx-pack:has(input:checked) .donx-pack__dot {
  border-color: var(--k-gold2);
  background: var(--k-gold2);
  box-shadow: inset 0 0 0 3px #3a0c10;
}
.is-legacy .page-shell .donx-pack__bonus,
.is-legacy .page-shell .donx-chip--hot {
  border-radius: 0;
  background: linear-gradient(180deg, #ebb750, #c79b44);
  color: #1a1208;
}
.is-legacy .page-shell .donx-pack__bonus {
  top: -14px;
}
.is-legacy .page-shell .donx-chip,
.is-legacy .page-shell .donx-hero__balance,
.is-legacy .page-shell .donx-note,
.is-legacy .page-shell .donx-note b,
.is-legacy .page-shell .donx-pay__hint,
.is-legacy .page-shell .donx-summary,
.is-legacy .page-shell .donx-pay .terms-consent,
.is-legacy .page-shell .donx-method__chips i,
.is-legacy .page-shell .donx-method__icon,
.is-legacy .page-shell .donx-faq__help a {
  border-radius: 0;
}
.is-legacy .page-shell .donx-note--green {
  border-color: rgba(217, 169, 78, .45);
  background: rgba(110, 18, 24, .4);
}
.is-legacy .page-shell .donx-note--green b {
  background: linear-gradient(180deg, #ebb750, #c79b44);
}
.is-legacy .page-shell .donx-stepno {
  border: 1px solid var(--k-gold2);
  border-radius: 0;
  background: linear-gradient(180deg, #9c1c22, #5a0f14);
  color: var(--k-gold2);
}
.is-legacy .page-shell .donx-step__trust .is-ok::before {
  background: var(--k-gold);
  color: #1a1208;
}
.is-legacy .page-shell .donx-summary {
  border-color: rgba(217, 169, 78, .45);
  border-left: 2px solid var(--k-gold);
  background: linear-gradient(90deg, rgba(156, 28, 34, .35), rgba(156, 28, 34, .05));
}
.is-legacy .page-shell .donx-pay .terms-consent:has(input:checked) {
  border-color: rgba(217, 169, 78, .6);
  background: rgba(156, 28, 34, .18);
}
.is-legacy .page-shell .donx-method--paypal b,
.is-legacy .page-shell .donx-method--crypto b {
  color: var(--k-gold2);
}
.is-legacy .page-shell .donx-method--card .donx-method__icon,
.is-legacy .page-shell .donx-method--paypal .donx-method__icon,
.is-legacy .page-shell .donx-method--crypto .donx-method__icon {
  border: 1px solid rgba(217, 169, 78, .5);
  background: rgba(156, 28, 34, .45);
  color: var(--k-gold2);
}
.is-legacy .page-shell .donx-method__chips i {
  border: 1px solid rgba(143, 111, 53, .45);
  background: var(--k-card2);
}
.is-legacy .page-shell .donx-q[open] {
  background: linear-gradient(90deg, rgba(156, 28, 34, .28), transparent 55%) padding-box, var(--k-card) padding-box;
}
.is-legacy .page-shell .donx-q summary i {
  border-radius: 0;
  border-color: rgba(217, 169, 78, .45);
}
.is-legacy .page-shell .donx-q[open] summary i {
  border-color: var(--k-gold);
  background-color: #9c1c22;
}
.is-legacy .page-shell .donx-faq__help a {
  border: 0;
  border-image: url(../images/button-plate.webp) 40 130 fill / 21px 46px / 0 stretch;
  justify-self: center;
  padding: 10px 40px;
  color: #fff;
}
/* The drawn question markers (gpt-site task 07): the picture is the whole marker, no turn. */
.is-legacy .page-shell .donx-faq--art .donx-q summary i,
.is-legacy .page-shell .donx-faq--art .donx-q[open] summary i {
  width: 34px;
  height: 34px;
  border: 0;
  background: center / contain no-repeat url(../images/faq-closed.webp);
  transform: none;
}
.is-legacy .page-shell .donx-faq--art .donx-q[open] summary i {
  background-image: url(../images/faq-open.webp);
}
/* The drawn payment emblems (gpt-site task 08): the picture replaces the plate and the line icon. */
.is-legacy .page-shell .donx-methods--art .donx-method .donx-method__icon {
  width: 60px;
  height: 60px;
  border: 0;
  background: center / contain no-repeat;
}
.is-legacy .page-shell .donx-methods--art .donx-method__icon svg {
  display: none;
}
.is-legacy .page-shell .donx-methods--art .donx-method--card .donx-method__icon { background-image: url(../images/pay-card.webp); }
.is-legacy .page-shell .donx-methods--art .donx-method--paypal .donx-method__icon { background-image: url(../images/pay-paypal.webp); }
.is-legacy .page-shell .donx-methods--art .donx-method--crypto .donx-method__icon { background-image: url(../images/pay-crypto.webp); }

/* Rankings table in the new design (owner, 2026-11-03: "like the old style"): a crimson-lit head with gold
   title-face labels, gold hairline rows, the top three lit from the left, square place plates, gold/crimson
   movement and online marks instead of green, numbers in the title face. Every ranking table shares it. */
.is-legacy .page-shell .ranking-table {
  border-collapse: separate;
  border-spacing: 0;
}
.is-legacy .page-shell .ranking-table thead tr {
  background: linear-gradient(180deg, #2a0c10, #160a0c);
}
.is-legacy .page-shell .ranking-table th {
  padding-top: 11px;
  padding-bottom: 11px;
  border-top: 1px solid rgba(217, 169, 78, .45);
  border-bottom: 1px solid rgba(217, 169, 78, .45);
  color: #d9a94e;
  font-family: var(--font-title);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
}
.is-legacy .page-shell .ranking-table td {
  border-bottom: 1px solid rgba(143, 111, 53, .22);
  color: #e9dfcc;
  font-family: var(--font-title);
  font-size: 13px;
}
.is-legacy .page-shell .ranking-table td .rk-char__sub,
.is-legacy .page-shell .ranking-table td .rk-char__where {
  font-family: Inter, Arial, sans-serif;
  color: #a89f91;
}
.is-legacy .page-shell .ranking-table tbody tr {
  background: transparent;
  transition: background .15s;
}
.is-legacy .page-shell .ranking-table tbody tr:nth-child(even) {
  background: rgba(255, 240, 210, .018);
}
.is-legacy .page-shell .ranking-table tbody tr:hover {
  background: linear-gradient(90deg, rgba(156, 28, 34, .28), rgba(156, 28, 34, .04) 70%);
}
.is-legacy .page-shell .ranking-table tbody tr.rank-row--1 {
  background: linear-gradient(90deg, rgba(156, 28, 34, .5), rgba(156, 28, 34, .06) 55%, transparent);
}
.is-legacy .page-shell .ranking-table tbody tr.rank-row--2 {
  background: linear-gradient(90deg, rgba(156, 28, 34, .34), rgba(156, 28, 34, .04) 50%, transparent);
}
.is-legacy .page-shell .ranking-table tbody tr.rank-row--3 {
  background: linear-gradient(90deg, rgba(156, 28, 34, .22), transparent 45%);
}
.is-legacy .page-shell .ranking-table tbody tr.rank-row--1 td:first-child { box-shadow: inset 3px 0 0 #ebb750; }
.is-legacy .page-shell .ranking-table tbody tr.rank-row--2 td:first-child { box-shadow: inset 3px 0 0 #c9c3b6; }
.is-legacy .page-shell .ranking-table tbody tr.rank-row--3 td:first-child { box-shadow: inset 3px 0 0 #c07a45; }
.is-legacy .page-shell .rank-place__no {
  min-width: 32px;
  height: 28px;
  border: 1px solid rgba(217, 169, 78, .45);
  border-radius: 0;
  background: linear-gradient(180deg, #221b1d, #141015);
  color: #f2e8d5;
  font-family: var(--font-title);
  font-size: 14px;
  font-weight: 700;
}
.is-legacy .page-shell .rank-move--up { color: #ebb750; }
.is-legacy .page-shell .rank-move--down { color: #d9474e; }
.is-legacy .page-shell .rk-char__avatar {
  border-color: rgba(217, 169, 78, .6);
}
/* The online mark stays classic (owner): green online, red offline, grey hidden. */
.is-legacy .page-shell .rk-char__avatar--online::after {
  background: #4fd16f;
  box-shadow: 0 0 6px rgba(79, 209, 111, .7);
}
.is-legacy .page-shell .rk-char__avatar--offline::after {
  background: #d9363e;
}
.is-legacy .page-shell .rk-char__avatar--hidden::after {
  background: #6b6560;
}
.is-legacy .page-shell .rk-char__top a {
  color: #fff5e0;
  font-family: var(--font-title);
  font-size: 15px;
  letter-spacing: .02em;
}
.is-legacy .page-shell .rk-char__top a:hover {
  color: #f5d48a;
}
/* Ranking section buttons lower (owner, 2026-11-03). */
.is-legacy .page-shell .rank-button {
  height: 46px;
  min-height: 46px;
}
/* Banner art without lettering (gpt-site task 09): the translated title is drawn over it. */
.is-legacy .page-shell .ranking-tab--art strong {
  position: absolute;
  inset: auto 0 18px;
  width: auto;
  height: auto;
  clip: auto;
  margin: 0;
  overflow: visible;
  color: #f5d48a;
  font-family: var(--font-title);
  font-size: clamp(20px, 2.4vw, 34px);
  font-weight: 700;
  letter-spacing: .08em;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0 2px 4px #000, 0 0 18px rgba(156, 28, 34, .8);
  white-space: nowrap;
}
/* One frame round the ranking section buttons and the filters; the panels inside drop their own. */
.is-legacy .page-shell .rk-controls {
  display: grid;
  gap: 0;
  margin-bottom: 18px;
  padding: 6px 16px;
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  background: var(--k-card) padding-box;
}
.is-legacy .page-shell .rk-controls > .content-panel {
  margin: 0;
  padding: 14px 0;
  border: 0;
  border-image: none;
  background: none;
  box-shadow: none;
}
.is-legacy .page-shell .rk-controls > .content-panel + .content-panel {
  border-top: 1px solid rgba(143, 111, 53, .35);
}

/* Epic Shop in the new design (owner, 2026-11-03): the wallet line, the starter pack, the buff bundle, the
   services and the item cards in the card frame; class tabs and switches as gold tabs; section titles in
   the title face; orange replaced by gold and crimson. */
.is-legacy .page-shell .epic-shop-page .epic-wallet,
.is-legacy .page-shell .epic-shop-page .starter__card,
.is-legacy .page-shell .epic-shop-page .buffs__card,
.is-legacy .page-shell .epic-shop-page .epic-service,
.is-legacy .page-shell .epic-shop-page .epic-item-card {
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  border-radius: 0;
  background: var(--k-card) padding-box;
  box-shadow: none;
}
.is-legacy .page-shell .epic-shop-page .epic-wallet {
  background:
    radial-gradient(50% 140% at 100% 50%, rgba(156, 28, 34, .35), transparent 70%) padding-box,
    var(--k-card) padding-box;
}
.is-legacy .page-shell .epic-shop-page .starter__card,
.is-legacy .page-shell .epic-shop-page .buffs__card {
  background:
    radial-gradient(45% 80% at 15% 40%, rgba(156, 28, 34, .28), transparent 70%) padding-box,
    var(--k-card) padding-box;
}
.is-legacy .page-shell .epic-shop-page .epic-service:hover,
.is-legacy .page-shell .epic-shop-page .epic-item-card:hover {
  filter: brightness(1.12);
}
.is-legacy .page-shell .epic-shop-page .starter__head h2,
.is-legacy .page-shell .epic-shop-page .buffs__head h2,
.is-legacy .page-shell .epic-shop-page .shop-head h2 {
  color: var(--k-gold2);
  font-family: var(--font-title);
  letter-spacing: .04em;
}
.is-legacy .page-shell .epic-shop-page .epic-service h3,
.is-legacy .page-shell .epic-shop-page .epic-service h2,
.is-legacy .page-shell .epic-shop-page .epic-item-card h2,
.is-legacy .page-shell .epic-shop-page .starter__card h3,
.is-legacy .page-shell .epic-shop-page .buffs__card h3 {
  color: #fff5e0;
  font-family: var(--font-title);
}
.is-legacy .page-shell .epic-shop-page .buffs__eyebrow {
  border-color: rgba(217, 169, 78, .6);
  border-radius: 0;
  background: linear-gradient(180deg, #9c1c22, #5a0f14);
  color: var(--k-gold2);
}
/* Class tabs, pack levels, buff durations, the currency switch: the site's gold tab. */
.is-legacy .page-shell .epic-shop-page .starter__class,
.is-legacy .page-shell .epic-shop-page .starter__level,
.is-legacy .page-shell .epic-shop-page .buffs__option,
.is-legacy .page-shell .epic-shop-page .epic-item-shop__currency button {
  border: 1px solid rgba(143, 111, 53, .45);
  border-radius: 0;
  background: var(--k-card2);
  color: var(--k-text);
}
.is-legacy .page-shell .epic-shop-page .starter__class:hover,
.is-legacy .page-shell .epic-shop-page .starter__level:hover,
.is-legacy .page-shell .epic-shop-page .buffs__option:hover,
.is-legacy .page-shell .epic-shop-page .epic-item-shop__currency button:hover {
  border-color: var(--k-gold);
}
.is-legacy .page-shell .epic-shop-page .starter__class.is-active,
.is-legacy .page-shell .epic-shop-page .starter__level.is-active,
.is-legacy .page-shell .epic-shop-page .buffs__option.is-active,
.is-legacy .page-shell .epic-shop-page .epic-item-shop__currency button.is-active {
  border-color: #ebb750;
  background: linear-gradient(180deg, #ebb750, #c79b44);
  color: #1a1208;
}
.is-legacy .page-shell .epic-shop-page .starter__level.is-active *,
.is-legacy .page-shell .epic-shop-page .buffs__option.is-active * {
  color: #1a1208;
}
.is-legacy .page-shell .epic-shop-page .epic-item-shop__currency {
  border-color: rgba(143, 111, 53, .45);
  border-radius: 0;
  background: var(--k-card2);
}
/* The slots of the pack and the bundle, and the item picture. */
.is-legacy .page-shell .epic-shop-page .starter-cell,
.is-legacy .page-shell .epic-shop-page .buffs__scroll {
  border: 1px solid rgba(143, 111, 53, .35);
  border-radius: 0;
  background: radial-gradient(60% 60% at 50% 45%, rgba(156, 28, 34, .25), transparent 75%), #141015;
}
.is-legacy .page-shell .epic-shop-page .starter__art {
  background: radial-gradient(70% 60% at 50% 45%, rgba(156, 28, 34, .35), transparent 70%), #0c0a0b;
}
.is-legacy .page-shell .epic-shop-page .epic-item-shop__arrow {
  border-color: rgba(217, 169, 78, .5);
  border-radius: 0;
  background: var(--k-card2);
  color: var(--k-gold2);
}
.is-legacy .page-shell .epic-shop-page .epic-item-card__icon {
  border: 1px solid rgba(217, 169, 78, .6);
  border-radius: 0;
  background: radial-gradient(60% 60% at 50% 45%, rgba(156, 28, 34, .55), transparent 80%), #120d10;
  box-shadow: inset 0 0 0 3px #0c0a0b, inset 0 0 0 4px rgba(217, 169, 78, .25);
}
.is-legacy .page-shell .epic-shop-page .epic-item-card input {
  border-color: rgba(143, 111, 53, .45);
  border-radius: 0;
  background: #171617;
}
/* The starter pack as the game window (owner, 2026-11-03): the equipment in its slots - pet, helm, wings
   on top, the weapons either side of the armour, gloves, pants and boots below - and what else the pack
   holds in inventory cells, eight to a row. */
.is-legacy .page-shell .epic-shop-page .starter__inv {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.is-legacy .page-shell .epic-shop-page .starter__inv-gear,
.is-legacy .page-shell .epic-shop-page .starter__inv-bag {
  display: grid;
  gap: 8px;
  padding: 10px 12px 12px;
  border: 1px solid rgba(143, 111, 53, .45);
  background:
    linear-gradient(180deg, rgba(156, 28, 34, .18), transparent 40%),
    #0f0c0e;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .6);
}
.is-legacy .page-shell .epic-shop-page .starter__inv-gear h4,
.is-legacy .page-shell .epic-shop-page .starter__inv-bag h4 {
  margin: 0;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(143, 111, 53, .3);
  color: var(--k-gold);
  font-family: var(--font-title);
  text-align: center;
}
.is-legacy .page-shell .epic-shop-page .starter__gear {
  grid-template-columns: repeat(3, 60px);
  grid-template-rows: 60px 52px 52px 60px;
  grid-auto-rows: auto;
  grid-template-areas:
    "pet helm wings"
    "right armor left"
    "right armor left"
    "gloves pants boots";
  justify-content: center;
  gap: 6px;
}
.is-legacy .page-shell .epic-shop-page .starter-cell--pet { grid-area: pet; }
.is-legacy .page-shell .epic-shop-page .starter-cell--helm { grid-area: helm; }
.is-legacy .page-shell .epic-shop-page .starter-cell--wings { grid-area: wings; }
.is-legacy .page-shell .epic-shop-page .starter-cell--right { grid-area: right; }
.is-legacy .page-shell .epic-shop-page .starter-cell--armor { grid-area: armor; }
.is-legacy .page-shell .epic-shop-page .starter-cell--left { grid-area: left; }
.is-legacy .page-shell .epic-shop-page .starter-cell--gloves { grid-area: gloves; }
.is-legacy .page-shell .epic-shop-page .starter-cell--pants { grid-area: pants; }
.is-legacy .page-shell .epic-shop-page .starter-cell--boots { grid-area: boots; }
.is-legacy .page-shell .epic-shop-page .starter__gear .starter-cell--empty {
  border: 1px dashed rgba(143, 111, 53, .35);
  background: #0c0a0b;
}
/* Inventory cells: one grid of squares sharing their lines, like the bag in the game. */
.is-legacy .page-shell .epic-shop-page .starter__extras {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 0;
  border-top: 1px solid rgba(143, 111, 53, .3);
  border-left: 1px solid rgba(143, 111, 53, .3);
}
.is-legacy .page-shell .epic-shop-page .starter__extras .starter-cell--small {
  width: auto;
  height: auto;
  aspect-ratio: 1;
  border: 0;
  border-right: 1px solid rgba(143, 111, 53, .3);
  border-bottom: 1px solid rgba(143, 111, 53, .3);
  background: radial-gradient(60% 60% at 50% 45%, rgba(156, 28, 34, .3), transparent 75%), #151012;
}
.is-legacy .page-shell .epic-shop-page .starter__extras .starter-cell--free {
  background: #0c0a0b;
}
@media (max-width: 760px) {
  .is-legacy .page-shell .epic-shop-page .starter__inv {
    grid-template-columns: 1fr;
  }
}
/* The bundle banner and the stage behind the class figure (gpt-site task 10). */
.is-legacy .page-shell .epic-shop-page .buffs__banner {
  border-left: 0;
  border-right: 1px solid rgba(143, 111, 53, .4);
  border-radius: 0;
}
.is-legacy .page-shell .epic-shop-page .buffs__banner--art {
  background: url(../images/shop-buffs.webp) center / cover no-repeat, #0c0a0b;
}
.is-legacy .page-shell .epic-shop-page .starter__art--stage {
  background: url(../images/shop-starter-stage.webp) center bottom / cover no-repeat, #0c0a0b;
}
/* Starter pack, third pass (owner, 2026-11-03): the figure smaller with the bag under it on the left; on the
   right the equipment window, each slot sized to its picture in 34px units - weapons 2x4, armour 3x4, pants
   3x2; kept short so the card fits a screen. */
.is-legacy .page-shell .epic-shop-page .starter__side {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 14px;
  border-right: 1px solid rgba(143, 111, 53, .3);
}
.is-legacy .page-shell .epic-shop-page .starter__side .starter__art {
  min-height: 0;
  height: 200px;
  padding: 6px 6px 30px;
  border: 1px solid rgba(143, 111, 53, .3);
  border-radius: 0;
}
.is-legacy .page-shell .epic-shop-page .starter__side .starter__art img {
  max-height: 160px;
}
.is-legacy .page-shell .epic-shop-page .starter__body > .starter__inv-gear {
  justify-self: center;
}
.is-legacy .page-shell .epic-shop-page .starter__body .starter__gear {
  --u: 34px;
  grid-template-rows: repeat(8, var(--u));
  gap: 4px;
}
.is-legacy .page-shell .epic-shop-page .starter__body .starter__gear {
  grid-template-columns: repeat(7, var(--u));
  grid-template-areas:
    "pet pet helm helm helm wings wings"
    "pet pet helm helm helm wings wings"
    "right right armor armor armor left left"
    "right right armor armor armor left left"
    "right right armor armor armor left left"
    "right right armor armor armor left left"
    "gloves gloves pants pants pants boots boots"
    "gloves gloves pants pants pants boots boots";
}
.is-legacy .page-shell .epic-shop-page .starter__gear .starter-cell img {
  inset: 6%;
  width: 88%;
  height: 88%;
}
@media (max-width: 760px) {
  .is-legacy .page-shell .epic-shop-page .starter__side {
    border-right: 0;
    border-bottom: 1px solid rgba(143, 111, 53, .3);
  }
  .is-legacy .page-shell .epic-shop-page .starter__body > .starter__inv-gear {
    justify-self: stretch;
  }
  .is-legacy .page-shell .epic-shop-page .starter__body .starter__gear {
    --u: calc((100vw - 120px) / 7);
    justify-content: center;
  }
}
/* Starter pack, fourth pass (owner: "something is off" - the window floated in empty space): three columns -
   the figure and the bag | the equipment window at full height | the pack name, the levels one under the
   other and the buy button at the foot. */
@media (min-width: 761px) {
  .is-legacy .page-shell .epic-shop-page .starter__card {
    grid-template-columns: minmax(250px, 30%) minmax(0, 1fr);
  }
  .is-legacy .page-shell .epic-shop-page .starter__body {
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto 1fr;
    grid-template-areas:
      "gear title"
      "gear levels"
      "gear buy";
    column-gap: 24px;
    row-gap: 12px;
    align-content: stretch;
  }
  .is-legacy .page-shell .epic-shop-page .starter__body > h3 { grid-area: title; }
  .is-legacy .page-shell .epic-shop-page .starter__body > .starter__levels {
    grid-area: levels;
    grid-template-columns: 1fr;
  }
  .is-legacy .page-shell .epic-shop-page .starter__body > .starter__inv-gear {
    grid-area: gear;
    justify-self: start;
    align-self: start;
  }
  .is-legacy .page-shell .epic-shop-page .starter__body > .starter__buy {
    grid-area: buy;
    align-self: end;
    justify-items: stretch;
    border-top: 0;
  }
  .is-legacy .page-shell .epic-shop-page .starter__body > .starter__buy .starter__button {
    width: 100%;
    text-align: center;
  }
}
/* Class tabs inside the pack's frame (owner, 2026-11-03): one frame round both, the tabs a smaller row. */
.is-legacy .page-shell .epic-shop-page .starter__box {
  display: grid;
  gap: 0;
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  background:
    radial-gradient(45% 80% at 15% 55%, rgba(156, 28, 34, .28), transparent 70%) padding-box,
    var(--k-card) padding-box;
}
.is-legacy .page-shell .epic-shop-page .starter__box > .starter__card {
  border: 0;
  border-image: none;
  border-top: 1px solid rgba(143, 111, 53, .35);
  background: none;
}
.is-legacy .page-shell .epic-shop-page .starter__box > .starter__classes {
  gap: 6px;
  padding: 12px 14px;
}
.is-legacy .page-shell .epic-shop-page .starter__box > .starter__result {
  margin: 0 14px 12px;
}
.is-legacy .page-shell .epic-shop-page .starter__box .starter__class {
  grid-auto-flow: column;
  justify-content: center;
  align-items: center;
  gap: 7px;
  padding: 6px 6px;
  font-size: 12px;
}
.is-legacy .page-shell .epic-shop-page .starter__box .starter__class img {
  width: 26px;
  height: 26px;
}

/* Skin shop (owner, 2026-11-03): each set in the card frame, gold and crimson in place of the
   per-set ice, orange and moss themes of the old page. */
.is-legacy .page-shell .skinshop,
.is-legacy .page-shell .skinshop-set {
  --ss-ice: var(--k-gold);
  --ss-ice-2: var(--k-gold2);
  --ss-line: rgba(143, 111, 53, .4);
  --ss-dim: var(--k-mute);
  color: var(--k-text);
}
.is-legacy .page-shell .skinshop-set {
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  border-radius: 0;
  background:
    radial-gradient(circle at 18% 30%, rgba(156, 28, 34, .3), transparent 55%) padding-box,
    var(--k-card) padding-box;
}
.is-legacy .page-shell .skinshop-set .skinshop-figure img {
  filter: drop-shadow(0 0 18px rgba(235, 183, 80, .25));
}
.is-legacy .page-shell .skinshop-stage__name h2 {
  font-family: var(--font-title);
  background: linear-gradient(180deg, #f5d48a, #c79b44);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.is-legacy .page-shell .skinshop-stage__name small,
.is-legacy .page-shell .skinshop-mount__text small,
.is-legacy .page-shell .skinshop-price small {
  color: var(--k-gold);
}
.is-legacy .page-shell .skinshop-mount__text h3,
.is-legacy .page-shell .skinshop-weapons__head h3 {
  font-family: var(--font-title);
  color: #f5d48a;
}
.is-legacy .page-shell .skinshop-mount {
  border-left-color: var(--ss-line);
  background: linear-gradient(180deg, rgba(156, 28, 34, .18), transparent 70%);
}
/* Class tabs: the site's gold tab. */
.is-legacy .page-shell .skinshop-class {
  border: 1px solid rgba(143, 111, 53, .45);
  border-radius: 0;
  background: var(--k-card2);
  color: var(--k-text);
}
.is-legacy .page-shell .skinshop-class:hover {
  border-color: var(--k-gold);
}
.is-legacy .page-shell .skinshop-set .skinshop-class.is-active {
  border-color: #ebb750;
  background: linear-gradient(180deg, #ebb750, #c79b44);
  color: #1a1208;
}
.is-legacy .page-shell .skinshop-piece,
.is-legacy .page-shell .skinshop-weapon {
  border: 1px solid rgba(143, 111, 53, .35);
  border-radius: 0;
  background: #171617;
}
.is-legacy .page-shell .skinshop-set .skinshop-weapon__art img {
  filter: drop-shadow(0 0 10px rgba(235, 183, 80, .2));
}
/* The price boxes: a crimson plate with a gold hairline, as on the donate page. */
.is-legacy .page-shell .skinshop-set .skinshop-buy {
  border: 1px solid rgba(143, 111, 53, .55);
  border-radius: 0;
  background: linear-gradient(180deg, rgba(156, 28, 34, .45), rgba(90, 15, 20, .45));
}
.is-legacy .page-shell .skinshop-price strong {
  font-family: var(--font-title);
  color: #f5d48a;
}
.is-legacy .page-shell .skinshop-set .skinshop-buy .bp-btn--gold {
  border: 0;
  border-image: url(../images/button-plate.webp) 40 130 fill / 21px 46px / 0 stretch;
  background: none;
  color: #fff;
}
.is-legacy .page-shell .skinshop-soon {
  border: 1px dashed rgba(235, 183, 80, .5);
  border-radius: 0;
  color: var(--k-gold);
}
.is-legacy .page-shell .skinshop-weapons {
  border-top-color: var(--ss-line);
  background: rgba(0, 0, 0, .25);
}
.is-legacy .page-shell .skinshop-set .skinshop-weapon__buy {
  border: 1px solid rgba(143, 111, 53, .6);
  border-radius: 0;
  background: linear-gradient(180deg, #9c1c22, #5a0f14);
  color: #f5d48a;
}
.is-legacy .page-shell .skinshop-set .skinshop-weapon__buy:hover {
  border-color: #ebb750;
  background: linear-gradient(180deg, #ebb750, #c79b44);
  color: #1a1208;
}
.is-legacy .page-shell .skinshop-pending {
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  border-radius: 0;
  background: var(--k-card) padding-box;
}
.is-legacy .page-shell .skinshop-select {
  border-radius: 0;
}
/* The plate holds one line; a wrapped label ran over its edges. */
.is-legacy .page-shell .skinshop-set .skinshop-buy .bp-btn--gold {
  max-width: none;
  padding: 4px 32px;
  white-space: nowrap;
}
/* Skin shop, second pass (owner, 2026-11-03: as the starter pack): the class tabs across the top of the
   frame; the figure with the pieces sold apart in a bag under it; the outfit in the slots of the equipment
   window (34px units, as the pack's) beside the set name and the buy box; the mount on the right. */
.is-legacy .page-shell .skinshop [hidden] {
  display: none !important;
}
.is-legacy .page-shell .skinshop-set {
  grid-template-columns: minmax(250px, 27%) minmax(0, 1fr) minmax(240px, 25%);
  grid-template-areas:
    "tabs tabs tabs"
    "side body mount";
}
.is-legacy .page-shell .skinshop-set .skinshop-classes {
  grid-area: tabs;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--ss-line);
}
.is-legacy .page-shell .skinshop-set .skinshop-class {
  grid-auto-flow: column;
  align-items: center;
  gap: 7px;
  padding: 6px 10px;
  font-size: 12px;
}
.is-legacy .page-shell .skinshop-set .skinshop-class img {
  width: 26px;
  height: 26px;
}
.is-legacy .page-shell .skinshop-side {
  grid-area: side;
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 14px;
  border-right: 1px solid var(--ss-line);
}
.is-legacy .page-shell .skinshop-set .skinshop-stage {
  display: block;
  min-height: 0;
  height: 250px;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(143, 111, 53, .3);
  background: radial-gradient(70% 60% at 50% 45%, rgba(156, 28, 34, .35), transparent 70%), #0c0a0b;
}
/* The worn figure at about two thirds of the old page's size. */
.is-legacy .page-shell .skinshop-set .skinshop-figure {
  height: 100%;
}
.is-legacy .page-shell .skinshop-set .skinshop-figure__wings {
  top: 12px;
  max-width: 240px;
  height: 170px;
}
.is-legacy .page-shell .skinshop-set .skinshop-figure__armor {
  top: 82px;
  max-width: 132px;
  height: 158px;
}
.is-legacy .page-shell .skinshop-set .skinshop-figure__helm {
  top: 33px;
  max-width: 70px;
  height: 66px;
}
.is-legacy .page-shell .skinshop-bag,
.is-legacy .page-shell .skinshop-gear {
  border: 1px solid rgba(143, 111, 53, .45);
  background: linear-gradient(180deg, rgba(156, 28, 34, .18), transparent 40%), #0f0c0e;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .6);
}
.is-legacy .page-shell .skinshop-bag {
  display: grid;
  gap: 8px;
  padding: 10px 12px 12px;
}
.is-legacy .page-shell .skinshop-bag h4 {
  margin: 0;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(143, 111, 53, .3);
  color: var(--k-gold);
  font-family: var(--font-title);
  font-size: 14px;
  text-align: center;
}
.is-legacy .page-shell .skinshop-bag__cells {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}
.is-legacy .page-shell .skinshop-extra {
  display: grid;
  min-width: 0;
  border: 1px solid rgba(143, 111, 53, .35);
  background: radial-gradient(60% 60% at 50% 45%, rgba(156, 28, 34, .3), transparent 75%), #151012;
}
.is-legacy .page-shell .skinshop-extra__art {
  display: flex;
  justify-content: center;
  align-items: center;
  aspect-ratio: 1;
  min-width: 0;
  padding: 8%;
}
.is-legacy .page-shell .skinshop-extra__art img {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 0 8px rgba(235, 183, 80, .2));
}
.is-legacy .page-shell .skinshop-extra__buy {
  display: block;
  padding: 4px 2px;
  border: 0;
  border-top: 1px solid rgba(143, 111, 53, .45);
  border-radius: 0;
  background: linear-gradient(180deg, #9c1c22, #5a0f14);
  color: #f5d48a;
  font: inherit;
  font-size: 11.5px;
  font-weight: 800;
  line-height: 1.3;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}
.is-legacy .page-shell a.skinshop-extra__buy:hover,
.is-legacy .page-shell button.skinshop-extra__buy:hover {
  background: linear-gradient(180deg, #ebb750, #c79b44);
  color: #1a1208;
}
.is-legacy .page-shell span.skinshop-extra__buy {
  cursor: default;
}
.is-legacy .page-shell .skinshop-set .skinshop-body {
  grid-area: body;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-rows: auto auto 1fr;
  grid-template-areas:
    "gear title"
    "gear count"
    "gear buy";
  align-items: start;
  gap: 10px 16px;
  padding: 14px;
}
.is-legacy .page-shell .skinshop-outfit {
  display: contents;
}
.is-legacy .page-shell .skinshop-title {
  grid-area: title;
}
.is-legacy .page-shell .skinshop-title small {
  display: block;
  color: var(--k-gold);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.is-legacy .page-shell .skinshop-title h2 {
  margin: 2px 0 0;
  font-family: var(--font-title);
  font-size: 30px;
  background: linear-gradient(180deg, #f5d48a, #c79b44);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.is-legacy .page-shell .skinshop-body .skinshop-pieces__count {
  grid-area: count;
}
.is-legacy .page-shell .skinshop-gear {
  --u: 34px;
  grid-area: gear;
  display: grid;
  grid-template-columns: repeat(7, var(--u));
  grid-template-rows: repeat(8, var(--u));
  grid-template-areas:
    "pet pet helm helm helm wings wings"
    "pet pet helm helm helm wings wings"
    "right right armor armor armor left left"
    "right right armor armor armor left left"
    "right right armor armor armor left left"
    "right right armor armor armor left left"
    "gloves gloves pants pants pants boots boots"
    "gloves gloves pants pants pants boots boots";
  gap: 4px;
  padding: 12px;
}
.is-legacy .page-shell .skinshop-cell {
  position: relative;
  border: 1px solid rgba(143, 111, 53, .35);
  background: radial-gradient(60% 60% at 50% 45%, rgba(156, 28, 34, .25), transparent 75%), #141015;
}
.is-legacy .page-shell .skinshop-cell img {
  position: absolute;
  inset: 6%;
  width: 88%;
  height: 88%;
  object-fit: contain;
}
.is-legacy .page-shell .skinshop-cell--empty {
  border-style: dashed;
  background: #0c0a0b;
}
.is-legacy .page-shell .skinshop-cell--pet { grid-area: pet; }
.is-legacy .page-shell .skinshop-cell--helm { grid-area: helm; }
.is-legacy .page-shell .skinshop-cell--wings { grid-area: wings; }
.is-legacy .page-shell .skinshop-cell--right { grid-area: right; }
.is-legacy .page-shell .skinshop-cell--armor { grid-area: armor; }
.is-legacy .page-shell .skinshop-cell--left { grid-area: left; }
.is-legacy .page-shell .skinshop-cell--gloves { grid-area: gloves; }
.is-legacy .page-shell .skinshop-cell--pants { grid-area: pants; }
.is-legacy .page-shell .skinshop-cell--boots { grid-area: boots; }
.is-legacy .page-shell .skinshop-body > .skinshop-buy {
  grid-area: buy;
  align-self: end;
  flex-direction: column;
  align-items: stretch;
  margin-top: 0;
}
.is-legacy .page-shell .skinshop-body > .skinshop-buy .skinshop-price small {
  min-height: 0;
}
.is-legacy .page-shell .skinshop-set .skinshop-mount {
  grid-area: mount;
}
@media (max-width: 1080px) {
  .is-legacy .page-shell .skinshop-set {
    grid-template-columns: minmax(240px, 34%) minmax(0, 1fr);
    grid-template-areas:
      "tabs tabs"
      "side body"
      "mount mount";
  }
}
@media (max-width: 760px) {
  .is-legacy .page-shell .skinshop-set {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "tabs" "side" "body" "mount";
  }
  .is-legacy .page-shell .skinshop-side {
    border-right: 0;
    border-bottom: 1px solid var(--ss-line);
  }
  .is-legacy .page-shell .skinshop-bag__cells {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .is-legacy .page-shell .skinshop-set .skinshop-body {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: none;
    grid-template-areas: "title" "gear" "count" "buy";
  }
  .is-legacy .page-shell .skinshop-gear {
    --u: calc((100vw - 140px) / 7);
    justify-content: center;
  }
}
.is-legacy .page-shell .skinshop-set .skinshop-mount .skinshop-buy {
  flex-direction: column;
  align-items: stretch;
}
.is-legacy .page-shell .skinshop-set .skinshop-mount .skinshop-buy .skinshop-price small {
  min-height: 0;
}
.is-legacy .page-shell .skinshop-set .skinshop-buy .bp-btn {
  max-width: none;
  white-space: nowrap;
}
/* The guild name with its mark and the score sat on the text baseline, about 3px above the row's other
   cells (owner, 2026-11-03): centred on the row like the plain text. */
.is-legacy .page-shell .ranking-table .guild-cell,
.is-legacy .page-shell .ranking-table .guild-score {
  vertical-align: middle;
}
/* The guild and Spire tables as the character one (owner, 2026-11-03): the place and every number centred
   in its column, the name left in the widest column. */
.is-legacy .page-shell .ranking-table:not(.ranking-table--characters) th,
.is-legacy .page-shell .ranking-table:not(.ranking-table--characters) td {
  text-align: center;
}
.is-legacy .page-shell .ranking-table:not(.ranking-table--characters) th:nth-child(2),
.is-legacy .page-shell .ranking-table:not(.ranking-table--characters) td:nth-child(2) {
  width: 36%;
  text-align: left;
}
/* Owner, 2026-11-04, on the preview: the starter figure stood above the stage (it was centred in the box,
   the stage is drawn at its bottom) - now it stands on the stage; the buffs banner lost its left side to
   cover/centre; the skin shop's buy label ran over the plate's carved ends (the padding was narrower than
   the plate's 46px ends); the VIP page still had hairlines where every other page has the card frame. */
/* Starter pack, fifth pass (owner, 2026-11-04): no stage picture - the figure fills the whole left side,
   and the bag of the pack moved under the levels. */
.is-legacy .page-shell .epic-shop-page .starter__side {
  align-content: stretch;
}
.is-legacy .page-shell .epic-shop-page .starter__side .starter__art {
  height: auto;
  min-height: 340px;
  padding: 10px 10px 44px;
}
.is-legacy .page-shell .epic-shop-page .starter__side .starter__art img {
  position: absolute;
  inset: 10px 10px 44px;
  width: calc(100% - 20px);
  height: calc(100% - 54px);
  max-height: none;
  object-fit: contain;
}
.is-legacy .page-shell .epic-shop-page .starter__body > .starter__inv-bag {
  border-radius: 0;
}
@media (min-width: 761px) {
  .is-legacy .page-shell .epic-shop-page .starter__body {
    grid-template-rows: auto auto auto 1fr;
    grid-template-areas:
      "gear title"
      "gear levels"
      "gear bag"
      "gear buy";
  }
  .is-legacy .page-shell .epic-shop-page .starter__body > .starter__inv-bag {
    grid-area: bag;
  }
}
.is-legacy .page-shell .epic-shop-page .buffs__banner--art {
  background-position: left center;
}
.is-legacy .page-shell .skinshop-set .skinshop-buy .bp-btn--gold {
  box-sizing: border-box;
  width: 100%;
  border-image-width: 21px 30px;
  padding: 4px 30px;
  font-size: 12px;
  letter-spacing: 0;
}
.is-legacy .page-shell .vipx-hero,
.is-legacy .page-shell .vipx-buy,
.is-legacy .page-shell .vipx-groups {
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  border-radius: 0;
  background-clip: padding-box;
}
/* Info menu always in view (owner, 2026-11-04: "слева меню должно быть видно всегда"). From 1500px it already
   hangs in the margin left of the shell; below that it was a drawer behind the Sections button. From 900px it
   is now a column inside the page, its panel sticky under the header; on a phone it stays a drawer. */
@media (min-width: 900px) and (max-width: 1499.98px) {
  .is-legacy .page-shell .wiki-layout,
  .is-legacy .page-shell .wiki-standalone {
    position: relative;
    padding-left: 286px;
  }
  .is-legacy .page-shell .wiki-sidenav {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    width: 270px;
    max-width: none;
    transform: none;
    visibility: visible;
    transition: none;
  }
  .is-legacy .page-shell .wiki-sidenav__panel {
    position: sticky;
    top: calc(var(--top-shell-height, 82px) + 16px);
    height: auto;
    max-height: calc(100vh - var(--top-shell-height, 82px) - 32px - var(--streambox-height, 0px));
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 1px solid rgba(240, 198, 116, .14);
    box-shadow: none;
  }
  .is-legacy .page-shell .wiki-topnav__toggle,
  .is-legacy .page-shell .wiki-sidenav__backdrop,
  .is-legacy .page-shell .wiki-sidenav__close {
    display: none !important;
  }
}
/* /info landing (owner, 2026-11-04): banner buttons to the pages read most, two to a row, each a picture in
   the card frame with its name on a dark band at the foot. */
.is-legacy .page-shell .wiki-hub__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
}
.is-legacy .page-shell .wiki-hub__banner {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: 150px;
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  background-color: #0c0a0b;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-clip: padding-box;
  color: #fff;
  text-decoration: none;
  transition: filter .15s ease;
}
.is-legacy .page-shell .wiki-hub__banner::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 40%, rgba(0, 0, 0, .85));
}
.is-legacy .page-shell .wiki-hub__banner span {
  position: relative;
  padding: 12px 16px;
  font-family: var(--font-title);
  font-size: 20px;
  letter-spacing: .04em;
  text-transform: uppercase;
  text-shadow: 0 2px 6px #000;
}
.is-legacy .page-shell .wiki-hub__banner:hover {
  filter: brightness(1.18);
}
.is-legacy .page-shell .wiki-hub__banner:hover span {
  color: var(--k-gold2, #ffcc19);
}
@media (max-width: 640px) {
  .is-legacy .page-shell .wiki-hub__grid {
    grid-template-columns: 1fr;
  }
  .is-legacy .page-shell .wiki-hub__banner {
    min-height: 120px;
  }
}
/* Second pass (owner: the wide strips "не смотрятся"): upright cards, four to a row, the name on a plate at
   the foot. The pictures are drawn upright for it (GPT task 11). */
.is-legacy .page-shell .wiki-hub__grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.is-legacy .page-shell .wiki-hub__banner {
  min-height: 0;
  aspect-ratio: 3 / 4;
  justify-content: center;
  padding-bottom: 14px;
}
.is-legacy .page-shell .wiki-hub__banner span {
  padding: 6px 14px;
  font-size: 15px;
  text-align: center;
}
@media (max-width: 1100px) {
  .is-legacy .page-shell .wiki-hub__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .is-legacy .page-shell .wiki-hub__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .is-legacy .page-shell .wiki-hub__banner {
    min-height: 0;
  }
  .is-legacy .page-shell .wiki-hub__banner span {
    font-size: 13px;
  }
}
/* Info pages as the market (layouts/main.php, owner 2026-11-04): the section's name in the head and its pages
   in the tab bar under it, so the breadcrumb bar and the small section kicker over the title go; on a phone
   the bar stays for its Sections button. A section with many pages wraps its tabs. */
.is-legacy .page-shell .nn-info-tabs {
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 18px;
}
@media (min-width: 900px) {
  .is-legacy .page-shell .wiki-topnav.wiki-topnav--slim {
    display: none;
  }
}
.is-legacy .page-shell .wiki-article .news-article__body > .auth-kicker {
  display: none;
}
/* Info side menu as links (owner, 2026-11-04): one row per section, the current one lit. */
.is-legacy .page-shell .wiki-sidenav__link {
  text-decoration: none;
}
.is-legacy .page-shell .wiki-sidenav__link.is-active {
  color: #ffcc19;
  background: rgba(240, 198, 116, .08);
}
.is-legacy .page-shell .wiki-sidenav__link.is-active .wiki-topnav__icon {
  border-color: rgba(255, 204, 25, .7);
}
/* Every section name on one line (owner, 2026-11-04): a wider menu and no letter spacing; the longest
   name, "Квесты & Коллекции & Скины", fits at 300px. */
.is-legacy .page-shell .wiki-sidenav__link span:not(.wiki-topnav__icon):not(.wiki-sidenav__chevron) {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  letter-spacing: 0;
}
.is-legacy .page-shell .wiki-sidenav__link .wiki-topnav__icon {
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
}
@media (min-width: 900px) and (max-width: 1499.98px) {
  .is-legacy .page-shell .wiki-layout,
  .is-legacy .page-shell .wiki-standalone {
    padding-left: 316px;
  }
  .is-legacy .page-shell .wiki-sidenav {
    width: 300px;
  }
}
/* The old article banners go (owner, 2026-11-04): every home-banner picture (images/home/...) in an Info page,
   the event sheets' pictures and the stored article heroes. */
.is-legacy .page-shell :is(.wiki-article, .wiki-standalone) :is(picture.banner-picture, img[src*="/images/home/"], .event-page-banner, .event-sheet__pictures, .news-article__hero),
.is-legacy .page-shell :is(.wiki-article, .wiki-standalone) picture:has(> img[src*="/images/home/"]),
.is-legacy .page-shell :is(.wiki-article, .wiki-standalone) p:has(> picture.banner-picture:only-child),
.is-legacy .page-shell :is(.wiki-article, .wiki-standalone) p:has(> img[src*="/images/home/"]:only-child) {
  display: none;
}
.is-legacy .page-shell .wiki-sidenav__link span:not(.wiki-topnav__icon):not(.wiki-sidenav__chevron) {
  font-size: 12.5px;
}
/* Chaos Machine: the mix groups are the head's tab bar now (wings/mixes.php), so the inner tab row goes. */
.is-legacy .page-shell .mix-groups > .tier-tabs {
  display: none;
}

/* Reset page laid out like the owner's mockup "Система сбросов" (wiki/_reset-page.php, 2026-11-04):
   main column with the tiles, the steps, the red panel and the table; a calculator column on the right. */
.is-legacy .page-shell .rsp {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 20px;
  align-items: start;
  margin-top: 6px;
}
.is-legacy .page-shell .rsp__lead {
  margin: 0 0 16px;
  color: #d9cdb4;
  font-size: 16px;
}
.is-legacy .page-shell .rsp__row {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
  gap: 16px;
  margin-bottom: 16px;
}
.is-legacy .page-shell .rsp-card,
.is-legacy .page-shell .rsp-save {
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  background: linear-gradient(180deg, rgba(36, 24, 18, .92), rgba(16, 12, 10, .96));
  background-clip: padding-box;
  padding: 12px 16px 16px;
}
.is-legacy .page-shell .rsp-card__title,
.is-legacy .page-shell .rsp__heading {
  margin: 0 0 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(201, 162, 77, .28);
  color: #f1d48a;
  font-size: 19px;
  letter-spacing: .02em;
}
.is-legacy .page-shell .rsp__heading {
  margin-top: 22px;
  border-bottom: 0;
  padding-bottom: 0;
}
.is-legacy .page-shell .rsp-needs__tiles {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.is-legacy .page-shell .rsp-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 10px 6px 12px;
  border: 1px solid rgba(201, 162, 77, .45);
  border-radius: 6px;
  background: radial-gradient(circle at 50% 30%, rgba(120, 80, 30, .35), rgba(14, 10, 8, .9) 70%);
  text-align: center;
}
.is-legacy .page-shell .rsp-tile__art {
  width: 72px;
  height: 72px;
  background: center / contain no-repeat;
}
.is-legacy .page-shell .rsp-tile strong {
  color: #f3e3bd;
  font-size: 14px;
}
.is-legacy .page-shell .rsp-tile small {
  color: #b7a888;
  font-size: 12px;
  line-height: 1.35;
}
.is-legacy .page-shell .rsp-how__steps {
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: rsp-step;
}
.is-legacy .page-shell .rsp-how__steps li {
  position: relative;
  padding: 9px 0 9px 42px;
  border-bottom: 1px solid rgba(201, 162, 77, .16);
  color: #e6dcc6;
  counter-increment: rsp-step;
}
.is-legacy .page-shell .rsp-how__steps li:last-child {
  border-bottom: 0;
}
.is-legacy .page-shell .rsp-how__steps li::before {
  content: counter(rsp-step) ".";
  position: absolute;
  left: 0;
  top: 6px;
  width: 30px;
  height: 30px;
  border: 2px solid #c9a24d;
  border-radius: 50% !important;
  background: radial-gradient(circle, #8f1d1d, #4a0b0b);
  color: #ffe6a6;
  font-weight: 700;
  line-height: 26px;
  text-align: center;
}
.is-legacy .page-shell .rsp-warn {
  margin-bottom: 16px;
  padding: 14px 18px 16px;
  border: 1px solid #b0453a;
  border-radius: 4px;
  background: linear-gradient(180deg, rgba(122, 18, 18, .82), rgba(64, 8, 8, .92));
  box-shadow: inset 0 0 0 1px rgba(255, 200, 120, .12), 0 0 24px rgba(160, 20, 20, .25);
}
.is-legacy .page-shell .rsp-warn__title {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0 0 10px;
  color: #ffd98a;
  font-size: 20px;
}
.is-legacy .page-shell .rsp-warn__mark {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 2px solid #e2b866;
  transform: rotate(45deg);
  color: #ffe6a6;
  font-weight: 800;
}
.is-legacy .page-shell .rsp-warn__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 240px;
  gap: 18px;
  align-items: center;
}
.is-legacy .page-shell .rsp-warn ul {
  margin: 0;
  padding-left: 18px;
  color: #f4e6d0;
}
.is-legacy .page-shell .rsp-warn li {
  margin: 4px 0;
}
.is-legacy .page-shell .rsp-warn__keep {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border: 2px solid #c9a24d;
  border-radius: 6px;
  background: rgba(20, 10, 8, .55);
}
.is-legacy .page-shell .rsp-warn__keep p {
  margin: 0;
  color: #f4e6d0;
}
.is-legacy .page-shell .rsp-warn__keep strong {
  color: #ffcc19;
}
.is-legacy .page-shell .rsp-warn__shield {
  flex: 0 0 34px;
  height: 38px;
  background: linear-gradient(180deg, #ffd98a, #b8862e);
  clip-path: polygon(50% 0, 100% 16%, 92% 62%, 50% 100%, 8% 62%, 0 16%);
}
.is-legacy .page-shell .rsp-save {
  margin-bottom: 4px;
}
.is-legacy .page-shell .rsp-save p {
  margin: 0;
  color: #e6dcc6;
}
.is-legacy .page-shell .rsp-table {
  max-height: 560px;
  overflow: auto;
  border: 1px solid rgba(201, 162, 77, .45);
  border-radius: 4px;
}
.is-legacy .page-shell .rsp-table table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.is-legacy .page-shell .rsp-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: 9px 10px;
  background: linear-gradient(180deg, #e2b866, #a87a2c);
  color: #2a1606;
  font-weight: 700;
  white-space: nowrap;
}
.is-legacy .page-shell .rsp-table td {
  padding: 7px 10px;
  border-top: 1px solid rgba(201, 162, 77, .14);
  color: #e6dcc6;
  text-align: center;
  white-space: nowrap;
}
.is-legacy .page-shell .rsp-table tbody tr:nth-child(even) td {
  background: rgba(255, 255, 255, .025);
}
.is-legacy .page-shell .rsp-table__index,
.is-legacy .page-shell .rsp-table__total {
  color: #ffcc19 !important;
  font-weight: 700;
}
.is-legacy .page-shell .rsp__note {
  margin: 8px 0 0;
  color: #9d9078;
  font-size: 13px;
}
.is-legacy .page-shell .rsp__side {
  display: grid;
  gap: 16px;
  position: sticky;
  top: 16px;
}
.is-legacy .page-shell .rsp-card__title--icon {
  display: flex;
  align-items: center;
  gap: 10px;
}
.is-legacy .page-shell .rsp-card__title--icon::before {
  content: "";
  flex: 0 0 22px;
  height: 22px;
  background: #e2b866;
  -webkit-mask: var(--rsp-icon) center / contain no-repeat;
  mask: var(--rsp-icon) center / contain no-repeat;
}
.is-legacy .page-shell .rsp-card__title--calc {
  --rsp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 2h14a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1zm1 2v4h12V4zm0 6v2h2v-2zm4 0v2h2v-2zm4 0v2h4v-2zM6 14v2h2v-2zm4 0v2h2v-2zm4 0v6h4v-6zM6 18v2h2v-2zm4 0v2h2v-2z'/%3E%3C/svg%3E");
}
.is-legacy .page-shell .rsp-card__title--book {
  --rsp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 4c3-1 6-1 9 1v15c-3-2-6-2-9-1zm11 1c3-2 6-2 9-1v15c-3-1-6-1-9 1z'/%3E%3C/svg%3E");
}
.is-legacy .page-shell .rsp-calc__label {
  display: block;
  margin-bottom: 6px;
  color: #d9cdb4;
}
.is-legacy .page-shell .rsp-calc__select {
  width: 100%;
  margin-bottom: 12px;
  padding: 8px 10px;
  border: 1px solid #c9a24d;
  border-radius: 4px;
  background: #120c09;
  color: #f3e3bd;
  font-size: 15px;
}
.is-legacy .page-shell .rsp-calc__out {
  margin: 0;
  padding: 6px 12px;
  border: 1px solid rgba(201, 162, 77, .45);
  border-radius: 4px;
  background: rgba(0, 0, 0, .3);
}
.is-legacy .page-shell .rsp-calc__out div {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 0;
  border-bottom: 1px solid rgba(201, 162, 77, .14);
}
.is-legacy .page-shell .rsp-calc__out div:last-child {
  border-bottom: 0;
}
.is-legacy .page-shell .rsp-calc__out dt {
  color: #d9cdb4;
}
.is-legacy .page-shell .rsp-calc__out dd {
  margin: 0;
  color: #ffcc19;
  font-weight: 700;
}
.is-legacy .page-shell .rsp-links ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.is-legacy .page-shell .rsp-links a {
  display: flex;
  justify-content: space-between;
  padding: 9px 2px;
  border-bottom: 1px solid rgba(201, 162, 77, .16);
  color: #e6dcc6;
  text-decoration: none;
}
.is-legacy .page-shell .rsp-links li:last-child a {
  border-bottom: 0;
}
.is-legacy .page-shell .rsp-links a::after {
  content: "\203A";
  color: #c9a24d;
}
.is-legacy .page-shell .rsp-links a:hover {
  color: #ffcc19;
}
/* Closer to the mockup (owner, 2026-11-04 "ты не видишь отличие с эскизом?"): a serif title in normal case with
   the one-line summary and a gold divider under it, no merged tabs (their pages are in "Useful articles"),
   no frame round the article, tiles as big art with a label, the two cards side by side. */
.is-legacy .page-shell .news-article__body:has(> .rsp) > h1 {
  margin: 0 0 6px;
  color: #f3dfa8;
  font-family: "PT Serif", Georgia, serif;
  font-size: 40px;
  font-weight: 700;
  letter-spacing: .01em;
  text-transform: none;
  text-shadow: 0 2px 10px rgba(0, 0, 0, .7);
}
.is-legacy .page-shell .news-article__body:has(> .rsp) > .wiki-merged-tabs {
  display: none;
}
.is-legacy .page-shell .wiki-article:has(.rsp) {
  border: 0;
  border-image: none;
  background: none;
  box-shadow: none;
}
.is-legacy .page-shell .rsp__lead {
  margin: 0 0 10px;
  color: #e6dcc6;
  font-size: 17px;
}
.is-legacy .page-shell .rsp__divider,
.is-legacy .page-shell .rsp__heading::after {
  height: 14px;
  margin: 0 0 20px;
  background:
    linear-gradient(45deg, transparent 42%, #c9a24d 42% 58%, transparent 58%) center / 14px 14px no-repeat,
    linear-gradient(90deg, transparent, #c9a24d 30%, #c9a24d 47%, transparent 47% 53%, #c9a24d 53%, #c9a24d 70%, transparent) center / 100% 1px no-repeat;
}
.is-legacy .page-shell .rsp-card__title,
.is-legacy .page-shell .rsp__heading,
.is-legacy .page-shell .rsp-warn__title {
  font-family: "PT Serif", Georgia, serif;
  font-weight: 700;
  text-transform: none;
}
.is-legacy .page-shell .rsp-card__title {
  font-size: 21px;
}
.is-legacy .page-shell .rsp__heading {
  display: grid;
  gap: 6px;
  font-size: 26px;
  text-align: center;
}
.is-legacy .page-shell .rsp__heading::after {
  content: "";
  display: block;
  width: min(420px, 80%);
  margin: 0 auto;
}
.is-legacy .page-shell .rsp__row {
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
}
.is-legacy .page-shell .rsp-needs__tiles {
  gap: 12px;
}
.is-legacy .page-shell .rsp-tile {
  aspect-ratio: 1 / 1.08;
  justify-content: center;
  gap: 8px;
  padding: 8px 4px 10px;
  border: 2px solid #b8862e;
  box-shadow: inset 0 0 0 1px rgba(255, 220, 140, .18), 0 0 10px rgba(0, 0, 0, .5);
  cursor: help;
}
.is-legacy .page-shell .rsp-tile__art {
  width: 78%;
  height: auto;
  aspect-ratio: 1;
  filter: drop-shadow(0 0 8px rgba(255, 190, 80, .35));
}
.is-legacy .page-shell .rsp-tile strong {
  font-size: 15px;
}
.is-legacy .page-shell .rsp-how__steps li {
  padding: 12px 0 12px 48px;
  font-size: 15px;
}
.is-legacy .page-shell .rsp-how__steps li::before {
  top: 8px;
  width: 34px;
  height: 34px;
  line-height: 30px;
  content: counter(rsp-step);
  font-family: "PT Serif", Georgia, serif;
  font-size: 18px;
}
@media (max-width: 1250px) {
  .is-legacy .page-shell .rsp {
    grid-template-columns: minmax(0, 1fr);
  }
  .is-legacy .page-shell .rsp__side {
    position: static;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  }
}
@media (max-width: 900px) {
  .is-legacy .page-shell .rsp__row,
  .is-legacy .page-shell .rsp-warn__body {
    grid-template-columns: minmax(0, 1fr);
  }
  .is-legacy .page-shell .rsp-needs__tiles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Reset page: the article box gives its padding back so the three columns get the mockup's width. */
.is-legacy .page-shell .news-article__body:has(> .rsp) {
  padding-left: 0;
  padding-right: 0;
}
.is-legacy .page-shell .news-article__body > .rsp {
  grid-template-columns: minmax(0, 1fr) 270px;
}.is-legacy .page-shell .news-article__body > .rsp .rsp__row {
  grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr);
}
.is-legacy .page-shell .news-article__body > .rsp .rsp-needs__tiles {
  gap: 8px;
}
.is-legacy .page-shell .news-article__body > .rsp .rsp-tile strong {
  font-size: 14px;
  line-height: 1.2;
}
.is-legacy .page-shell .news-article__body > .rsp .rsp-table th {
  padding: 8px 6px;
  font-family: "PT Serif", Georgia, serif;
  font-size: 14px;
  letter-spacing: 0;
  text-transform: none;
  white-space: normal;
  line-height: 1.15;
}
.is-legacy .page-shell .news-article__body > .rsp .rsp-table td {
  padding: 7px 6px;
}
.is-legacy .page-shell .news-article__body > .rsp .rsp__heading {
  text-align: left;
}
.is-legacy .page-shell .news-article__body > .rsp .rsp__heading::after {
  width: 100%;
}
/* The wide-screen overrides above outrank the earlier breakpoints, so the reset page repeats them here. */
@media (max-width: 1250px) {
  .is-legacy .page-shell .news-article__body > .rsp {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 900px) {
  .is-legacy .page-shell .news-article__body > .rsp .rsp__row,
  .is-legacy .page-shell .news-article__body > .rsp .rsp-warn__body {
    grid-template-columns: minmax(0, 1fr);
  }
  .is-legacy .page-shell .news-article__body:has(> .rsp) > h1 {
    font-size: 30px;
  }
  .is-legacy .page-shell .rsp__lead {
    font-size: 15px;
  }
}
@media (max-width: 560px) {
  .is-legacy .page-shell .news-article__body > .rsp .rsp-needs__tiles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .is-legacy .page-shell .rsp-tile {
    aspect-ratio: auto;
  }
  .is-legacy .page-shell .rsp-tile__art {
    width: 64px;
  }
  .is-legacy .page-shell .rsp-warn {
    padding: 12px 14px 14px;
  }
  .is-legacy .page-shell .news-article__body > .rsp .rsp-table th,
  .is-legacy .page-shell .news-article__body > .rsp .rsp-table td {
    padding-left: 4px;
    padding-right: 4px;
    font-size: 12px;
  }
}
/* One column: the calculator and the articles come before the long table, not after it. */
@media (max-width: 1250px) {
  .is-legacy .page-shell .news-article__body > .rsp {
    row-gap: 0;
  }
  .is-legacy .page-shell .news-article__body > .rsp .rsp__main {
    display: contents;
  }
  .is-legacy .page-shell .news-article__body > .rsp .rsp__side {
    order: 1;
    margin: 16px 0 0;
  }
  .is-legacy .page-shell .news-article__body > .rsp .rsp__heading,
  .is-legacy .page-shell .news-article__body > .rsp .rsp-table,
  .is-legacy .page-shell .news-article__body > .rsp .rsp__note {
    order: 2;
  }
}
/* Main information in the reset page's look (wiki/_server-page.php, owner 2026-11-04). */
.is-legacy .page-shell .rsp--server .rsp-needs,
.is-legacy .page-shell .rsp--server .rsp-text,
.is-legacy .page-shell .rsp--server .rsp__main > .rsp-card {
  margin-bottom: 16px;
}
.is-legacy .page-shell .rsp--server .rsp-tile {
  aspect-ratio: auto;
  padding: 12px 6px 14px;
  cursor: default;
}
.is-legacy .page-shell .rsp--server .rsp-tile__art {
  width: 72px;
}
.is-legacy .page-shell .rsp-tile__value {
  color: #ffcc19;
  font-family: "PT Serif", Georgia, serif;
  font-size: 24px;
  line-height: 1.1;
  white-space: nowrap;
}
.is-legacy .page-shell .rsp--server .rsp-tile strong {
  color: #d9cdb4;
  font-weight: 600;
}
.is-legacy .page-shell .rsp-text .wiki-copy p {
  margin: 0 0 12px;
  color: #e6dcc6;
  line-height: 1.6;
}
.is-legacy .page-shell .rsp-text .wiki-copy p:last-child {
  margin-bottom: 0;
}
.is-legacy .page-shell .news-article__body > .rsp .rsp__row--even {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.is-legacy .page-shell .rsp-list {
  margin: 0;
}
.is-legacy .page-shell .rsp-list > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(201, 162, 77, .16);
}
.is-legacy .page-shell .rsp-list > div:last-child {
  border-bottom: 0;
}
.is-legacy .page-shell .rsp-list > .rsp-list__row--stacked {
  display: block;
}
.is-legacy .page-shell .rsp-list dt {
  color: #d9cdb4;
}
.is-legacy .page-shell .rsp-list dd {
  margin: 0;
  color: #f3e3bd;
  font-weight: 700;
  text-align: right;
}
.is-legacy .page-shell .rsp-list > .rsp-list__row--stacked dd {
  margin-top: 3px;
  text-align: left;
}
.is-legacy .page-shell .rsp-list dd.is-accent {
  color: #ffcc19;
}
.is-legacy .page-shell .rsp-classes ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.is-legacy .page-shell .rsp-classes a {
  display: flex;
  justify-content: space-between;
  padding: 8px 2px;
  border-bottom: 1px solid rgba(201, 162, 77, .16);
  color: #e6dcc6;
  text-decoration: none;
}
.is-legacy .page-shell .rsp-classes li:last-child a {
  border-bottom: 0;
}
.is-legacy .page-shell .rsp-classes a b {
  color: #c9a24d;
}
.is-legacy .page-shell .rsp-classes a:hover {
  color: #ffcc19;
}
@media (max-width: 1250px) {
  .is-legacy .page-shell .news-article__body > .rsp--server .rsp__side {
    order: 3;
  }
}
@media (max-width: 900px) {
  .is-legacy .page-shell .news-article__body > .rsp .rsp__row--even {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 560px) {
  .is-legacy .page-shell .rsp-tile__value {
    font-size: 20px;
  }
}
/* Tiles of one row are one height (owner, 2026-11-04): the row sets the height, not the tile's own label;
   the picture sits at the top and a one-line label is centred in the same two-line slot. */
.is-legacy .page-shell .news-article__body > .rsp .rsp-tile {
  aspect-ratio: auto;
  justify-content: flex-start;
  align-self: stretch;
}
.is-legacy .page-shell .news-article__body > .rsp .rsp-tile strong {
  display: flex;
  flex: 1 0 2.4em;
  align-items: center;
  justify-content: center;
}
/* Happy Weekends in the reset page's look (wiki/_happy-page.php, owner 2026-11-04). */
.is-legacy .page-shell .news-article__body > .rsp .rsp-needs__tiles--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.is-legacy .page-shell .rsp-tile__value--text {
  font-size: 17px;
  white-space: normal;
}
.is-legacy .page-shell .rsp--happy .rsp-tile__art {
  width: 64px;
}
.is-legacy .page-shell .rsp-card__title--clock {
  --rsp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 1 0 20 10 10 0 0 1 0-20zm0 3a7 7 0 1 0 0 14 7 7 0 0 0 0-14zm-1 2h2v5.2l3.6 2.1-1 1.7L11 13.4z'/%3E%3C/svg%3E");
}
.is-legacy .page-shell .rsp-timer__value {
  margin: 4px 0 8px;
  color: #ffcc19;
  font-family: "PT Serif", Georgia, serif;
  font-size: 30px;
  font-weight: 700;
  text-align: center;
}
.is-legacy .page-shell .rsp-timer__note {
  margin: 0;
  color: #b7a888;
  font-size: 13px;
  text-align: center;
}
@media (max-width: 560px) {
  .is-legacy .page-shell .news-article__body > .rsp .rsp-needs__tiles--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .is-legacy .page-shell .rsp-tile__value--text {
    font-size: 14px;
  }
}
/* Plain articles in the new look (wiki/_article-page.php, owner 2026-11-04): text in cards cut at its
   headings, interface pictures as small thumbnails that open full size, sibling pages in the side card. */
.is-legacy .page-shell .news-article__body > .rsp--single {
  grid-template-columns: minmax(0, 1fr);
  max-width: 900px;
}
.is-legacy .page-shell .rsp--article .rsp-text {
  margin-bottom: 14px;
}
.is-legacy .page-shell .rsp--article .rsp-text--intro {
  border: 0;
  border-image: none;
  background: none;
  padding: 0 2px 4px;
}
.is-legacy .page-shell .rsp--article .rsp-text--intro .wiki-copy p {
  font-size: 16px;
}
.is-legacy .page-shell .rsp--article .wiki-copy {
  color: #e6dcc6;
  line-height: 1.6;
}
.is-legacy .page-shell .rsp--article .wiki-copy > :first-child {
  margin-top: 0;
}
.is-legacy .page-shell .rsp--article .wiki-copy > :last-child {
  margin-bottom: 0;
}
.is-legacy .page-shell .rsp--article .wiki-copy h3 {
  margin: 14px 0 6px;
  color: #f1d48a;
  font-family: "PT Serif", Georgia, serif;
  font-size: 17px;
  text-transform: none;
}
/* Thumbnails: small, side by side, the zoom badge always shown. */
.is-legacy .page-shell .rsp--article .wiki-copy > .wiki-copy__figure--zoom,
.is-legacy .page-shell .rsp--article .wiki-copy__gallery > .wiki-copy__figure--zoom {
  display: inline-block;
  width: 180px !important;
  max-width: 180px !important;
  margin: 4px 10px 10px 0;
  padding: 4px !important;
  vertical-align: top;
  border: 1px solid rgba(201, 162, 77, .45);
  border-radius: 4px;
  background: rgba(0, 0, 0, .35);
}
.is-legacy .page-shell .rsp--article .wiki-copy__gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  margin: 4px 0 8px;
}
.is-legacy .page-shell .rsp--article .wiki-copy__figure--zoom img {
  display: block;
  width: 100% !important;
  max-height: 140px;
  object-fit: cover;
  object-position: top;
}
.is-legacy .page-shell .rsp--article .wiki-copy__figure--zoom figcaption {
  margin-top: 4px;
  color: #b7a888;
  font-size: 12px;
  line-height: 1.3;
  text-align: center;
}
.is-legacy .page-shell .rsp--article .wiki-copy__figure--zoom::after {
  top: 8px;
  right: 8px;
  width: 22px;
  height: 22px;
  opacity: .85;
}
.is-legacy .page-shell .rsp-pages summary {
  list-style: none;
  cursor: pointer;
}
.is-legacy .page-shell .rsp-pages summary::-webkit-details-marker {
  display: none;
}
.is-legacy .page-shell .rsp-pages__current {
  display: none;
}
.is-legacy .page-shell .rsp-links a.is-active {
  color: #ffcc19;
}
@media (min-width: 1251px) {
  .is-legacy .page-shell .rsp-pages summary {
    pointer-events: none;
  }
}
@media (max-width: 1250px) {
  .is-legacy .page-shell .news-article__body > .rsp--article .rsp__side {
    order: -1;
    margin: 0 0 14px;
  }
  .is-legacy .page-shell .rsp-pages:not([open]) summary {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
  }
  .is-legacy .page-shell .rsp-pages summary::after {
    content: "\25BE";
    margin-left: auto;
    color: #c9a24d;
  }
  .is-legacy .page-shell .rsp-pages__current {
    display: inline;
    color: #ffcc19;
    font-family: Inter, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
  }
  .is-legacy .page-shell .rsp-pages summary > span {
    display: none;
  }
}
@media (max-width: 560px) {
  .is-legacy .page-shell .rsp--article .wiki-copy > .wiki-copy__figure--zoom,
  .is-legacy .page-shell .rsp--article .wiki-copy__gallery > .wiki-copy__figure--zoom {
    width: calc(50% - 6px) !important;
    max-width: calc(50% - 6px) !important;
    margin-right: 6px;
  }
}
/* Info section tabs: on a phone one button with the current page, the list opens under it (owner, 2026-11-04). */
.nn-info-tabs__toggle {
  display: none;
}
@media (max-width: 900px) {
  .is-legacy .page-shell .nn-info-tabs__toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin: 0 0 8px;
    padding: 12px 16px;
    border: 1px solid #c9a24d;
    border-radius: 4px;
    background: linear-gradient(180deg, rgba(36, 24, 18, .95), rgba(16, 12, 10, .98));
    color: #ffcc19;
    font: 600 15px/1.2 Inter, sans-serif;
    cursor: pointer;
  }
  .is-legacy .page-shell .nn-info-tabs__toggle::after {
    content: "\25BE";
    color: #c9a24d;
    transition: transform .15s ease;
  }
  .is-legacy .page-shell .nn-info-tabs__toggle[aria-expanded="true"]::after {
    transform: rotate(180deg);
  }
  .is-legacy .page-shell .nn-info-tabs {
    display: none !important;
  }
  .is-legacy .page-shell .nn-info-tabs.is-open {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
  }
  .is-legacy .page-shell .nn-info-tabs.is-open .market-tab {
    text-align: left;
  }
}
@media (max-width: 900px) {
  .is-legacy .page-shell .nn-info-tabs.is-open {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    box-sizing: border-box;
  }
}
/* New-look articles: lists as one plain column with gold bullets, not boxed grid cells. */
.is-legacy .page-shell .rsp--article .wiki-copy__list {
  display: block !important;
  margin: 6px 0 12px;
  padding: 0;
  list-style: none;
}
.is-legacy .page-shell .rsp--article .wiki-copy__list > li {
  position: relative;
  display: block;
  min-height: 0;
  margin: 0;
  padding: 7px 0 7px 20px;
  border: 0;
  border-bottom: 1px solid rgba(201, 162, 77, .12);
  border-radius: 0;
  background: none;
  box-shadow: none;
}
.is-legacy .page-shell .rsp--article .wiki-copy__list > li:last-child {
  border-bottom: 0;
}
.is-legacy .page-shell .rsp--article .wiki-copy__list > li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 15px;
  width: 6px;
  height: 6px;
  background: #c9a24d;
  transform: rotate(45deg);
}
/* Thumbnails show the whole picture (owner, 2026-11-04: it was cut at 140px). */
.is-legacy .page-shell .rsp--article .wiki-copy__figure--zoom img {
  height: auto !important;
  max-height: 240px;
  object-fit: contain;
  object-position: center;
}
/* The opening text is a framed card like every other block (owner, 2026-11-04). */
.is-legacy .page-shell .rsp--article .rsp-text--intro {
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  background: linear-gradient(180deg, rgba(36, 24, 18, .92), rgba(16, 12, 10, .96));
  background-clip: padding-box;
  padding: 12px 16px 16px;
}
.is-legacy .page-shell .rsp--article .rsp-text--intro .wiki-copy p {
  font-size: inherit;
}
/* A single screenshot stands at the right of its block and the text runs beside it, no empty half row. */
.is-legacy .page-shell .rsp--article .wiki-copy > .wiki-copy__figure--zoom {
  float: right;
  margin: 2px 0 10px 16px;
}
.is-legacy .page-shell .rsp--article .wiki-copy::after {
  content: "";
  display: block;
  clear: both;
}
@media (max-width: 560px) {
  .is-legacy .page-shell .rsp--article .wiki-copy > .wiki-copy__figure--zoom {
    float: none;
    display: block;
    margin: 4px auto 10px;
  }
}
/* Lists run beside a floated screenshot instead of dropping below it. */
.is-legacy .page-shell .rsp--article .wiki-copy__list {
  width: auto !important;
  overflow: visible !important;
  clear: none !important;
  contain: none !important;
}
/* Class pages in the new look (wiki/_class-page.php, owner 2026-11-04). */
.is-legacy .page-shell .rsp--class .rsp-class__head {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(201, 162, 77, .28);
}
.is-legacy .page-shell .rsp-class__portrait {
  flex: 0 0 72px;
  width: 72px;
  height: 72px;
  border: 2px solid #b8862e;
  border-radius: 6px;
  object-fit: cover;
  box-shadow: 0 0 12px rgba(0, 0, 0, .6);
}
.is-legacy .page-shell .rsp-class__path {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
}
.is-legacy .page-shell .rsp-class__step {
  color: #f3dfa8;
  font-family: "PT Serif", Georgia, serif;
  font-size: 18px;
  font-weight: 700;
}
.is-legacy .page-shell .rsp-class__arrow {
  color: #c9a24d;
}
.is-legacy .page-shell .rsp-class__note {
  flex-basis: 100%;
  color: #b7a888;
  font-size: 12px;
}
.is-legacy .page-shell .rsp-list--chips > div {
  align-items: center;
}
.is-legacy .page-shell .rsp-list--chips dd {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}
.is-legacy .page-shell .rsp-chip {
  padding: 3px 9px;
  border: 1px solid rgba(201, 162, 77, .45);
  border-radius: 3px;
  background: rgba(0, 0, 0, .3);
  color: #f3e3bd;
  font-size: 13px;
  font-weight: 600;
}
.is-legacy .page-shell .rsp-list--formula dd code,
.is-legacy .page-shell .rsp-skills code {
  color: #ffcc19;
  font: 600 12px/1.45 Consolas, "Courier New", monospace;
  white-space: normal;
  background: none;
}
.is-legacy .page-shell .rsp-list--formula dt {
  flex: 0 1 50%;
}
.is-legacy .page-shell .rsp--class .rsp-list dd {
  font-weight: 600;
}
.is-legacy .page-shell .rsp-skills {
  margin: 0;
  padding: 0;
  list-style: none;
}
.is-legacy .page-shell .rsp-skills li {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 10px 0;
  border-bottom: 1px solid rgba(201, 162, 77, .14);
}
.is-legacy .page-shell .rsp-skills li:last-child {
  border-bottom: 0;
}
.is-legacy .page-shell .rsp-skills img,
.is-legacy .page-shell .rsp-skills__empty {
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(201, 162, 77, .45);
  border-radius: 4px;
}
.is-legacy .page-shell .rsp-skills div {
  display: grid;
  gap: 3px;
}
.is-legacy .page-shell .rsp-skills strong {
  color: #f3e3bd;
}
.is-legacy .page-shell .rsp--class .rsp-card {
  margin-bottom: 14px;
}
.is-legacy .page-shell .rsp--class .rsp__row {
  margin-bottom: 0;
}
.is-legacy .page-shell .rsp-combo .class-combos__intro {
  margin: 0 0 12px;
  color: #e6dcc6;
}
.is-legacy .page-shell .rsp-classes-nav a {
  align-items: center;
  gap: 10px;
}
.is-legacy .page-shell .rsp-classes-nav a::after {
  display: none;
}
.is-legacy .page-shell .rsp-classes-nav img {
  width: 26px;
  height: 26px;
  border: 1px solid rgba(201, 162, 77, .45);
  border-radius: 3px;
}
.is-legacy .page-shell .rsp-classes-nav a span {
  flex: 1;
}
.is-legacy .page-shell .rsp-classes-nav a b {
  color: #c9a24d;
  font-size: 12px;
}
.is-legacy .page-shell .wiki-article--class:has(.rsp) {
  border: 0;
  border-image: none;
  background: none;
  box-shadow: none;
  padding: 0;
}
@media (max-width: 560px) {
  .is-legacy .page-shell .rsp-list--chips > div,
  .is-legacy .page-shell .rsp-list--formula > div {
    display: block;
  }
  .is-legacy .page-shell .rsp-list--chips dd {
    justify-content: flex-start;
    margin-top: 6px;
  }
  .is-legacy .page-shell .rsp-list--formula dd {
    margin-top: 3px;
    text-align: left;
  }
}
.is-legacy .page-shell .news-article__body > .rsp--class .rsp__row--even {
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
}
.is-legacy .page-shell .rsp--class .rsp-list--formula,
.is-legacy .page-shell .rsp--class .rsp__row--even .rsp-card:first-child .rsp-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 28px;
}
.is-legacy .page-shell .rsp--class .rsp-list--formula > div:nth-last-child(2):nth-child(odd) {
  border-bottom: 0;
}
@media (max-width: 900px) {
  .is-legacy .page-shell .rsp--class .rsp-list--formula,
  .is-legacy .page-shell .rsp--class .rsp__row--even .rsp-card:first-child .rsp-list {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 1250px) {
  .is-legacy .page-shell .news-article__body > .rsp--class .rsp__side {
    display: contents;
  }
  .is-legacy .page-shell .news-article__body > .rsp--class .rsp-classes-nav {
    order: -1;
    margin-bottom: 14px;
  }
  .is-legacy .page-shell .news-article__body > .rsp--class .rsp__side > .rsp-links:not(.rsp-classes-nav) {
    order: 3;
  }
}
/* Standalone Info pages (class change quests, fruits, ...) beside the menu like the articles: from 1500px to
   1809px the articles are pushed right of the hanging menu (app.css "Room for the menu"), these were not and
   ran under it (owner, 2026-11-04). */
@media (min-width: 1500px) and (max-width: 1809.98px) {
  .is-legacy .page-shell .wiki-standalone {
    margin-left: calc(314px + 12px - (100vw - 1180px) / 2);
  }
}
/* Standalone pages in the new look: serif title, framed cards, serif card titles in normal case. */
.is-legacy .page-shell .nn-page .nn-page__title {
  margin: 0 0 6px;
  color: #f3dfa8;
  font-family: "PT Serif", Georgia, serif;
  font-size: 40px;
  font-weight: 700;
  letter-spacing: .01em;
  text-transform: none;
  text-shadow: 0 2px 10px rgba(0, 0, 0, .7);
}
.is-legacy .page-shell .nn-page .nn-page__divider {
  margin-bottom: 18px;
}
.is-legacy .page-shell .nn-page .rsp__main > .content-panel {
  margin-bottom: 16px;
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  border-radius: 0;
  background: linear-gradient(180deg, rgba(36, 24, 18, .92), rgba(16, 12, 10, .96));
  background-clip: padding-box;
  box-shadow: none;
}
.is-legacy .page-shell .nn-page .rsp__main > .content-panel > .panel-title,
.is-legacy .page-shell .nn-page .rsp__main > .content-panel > h2 {
  margin: 0 0 12px;
  padding: 0 0 8px;
  border: 0;
  border-bottom: 1px solid rgba(201, 162, 77, .28);
  background: none;
}
.is-legacy .page-shell .nn-page .rsp__main > .content-panel > .panel-title .label,
.is-legacy .page-shell .nn-page .rsp__main > .content-panel > h2,
.is-legacy .page-shell .nn-page .class-step__title {
  color: #f1d48a;
  font-family: "PT Serif", Georgia, serif;
  font-size: 21px;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: none;
}
.is-legacy .page-shell .nn-page .class-step__title {
  font-size: 18px;
}
.is-legacy .page-shell .nn-page .class-step {
  border: 1px solid rgba(201, 162, 77, .3);
  border-radius: 4px;
  background: rgba(0, 0, 0, .25);
}
@media (max-width: 900px) {
  .is-legacy .page-shell .nn-page .nn-page__title {
    font-size: 30px;
  }
}
/* The section's pages on the right of every new-look Info page (wiki/_rsp-side-nav.php, owner 2026-11-04 "где
   полезные ссылки"). One column: the class list folds to a menu at the top, the other cards go to the end. */
.is-legacy .page-shell .nn-page__rsp {
  grid-template-columns: minmax(0, 1fr) 270px;
}
.is-legacy .page-shell .nn-page__rsp .rsp__lead {
  margin-top: 0;
}
.is-legacy .page-shell .nn-page__rsp .rsp__main > .content-panel:last-child {
  margin-bottom: 0;
}
.is-legacy .page-shell .rsp-links a.is-active {
  color: #ffcc19;
}
.is-legacy .page-shell .rsp-facts .rsp-list dd.is-accent {
  color: #ffcc19;
}
@media (max-width: 1250px) {
  .is-legacy .page-shell .nn-page__rsp {
    grid-template-columns: minmax(0, 1fr);
  }
  .is-legacy .page-shell .news-article__body > .rsp:has(.rsp-section-links) .rsp__side,
  .is-legacy .page-shell .nn-page__rsp .rsp__side {
    display: contents;
  }
  .is-legacy .page-shell .news-article__body > .rsp:has(.rsp-section-links) .rsp-classes-nav,
  .is-legacy .page-shell .nn-page__rsp .rsp-classes-nav {
    order: -1;
    margin-bottom: 14px;
  }
  .is-legacy .page-shell .news-article__body > .rsp:has(.rsp-section-links) .rsp__side > .rsp-card:not(.rsp-classes-nav),
  .is-legacy .page-shell .nn-page__rsp .rsp__side > .rsp-card:not(.rsp-classes-nav) {
    order: 3;
    margin-top: 14px;
  }
}
/* /quests in the new look: its cards sit inside the tab panels, and the tab row reads like the site's tabs. */
.is-legacy .page-shell .nn-page .rsp__main [data-tab-panel] > .content-panel {
  margin-bottom: 16px;
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  border-radius: 0;
  background: linear-gradient(180deg, rgba(36, 24, 18, .92), rgba(16, 12, 10, .96));
  background-clip: padding-box;
  box-shadow: none;
}
.is-legacy .page-shell .nn-page .rsp__main [data-tab-panel] > .content-panel > .panel-title,
.is-legacy .page-shell .nn-page .rsp__main [data-tab-panel] > .content-panel > h2 {
  margin: 0 0 12px;
  padding: 0 0 8px;
  border: 0;
  border-bottom: 1px solid rgba(201, 162, 77, .28);
  background: none;
}
.is-legacy .page-shell .nn-page .rsp__main [data-tab-panel] > .content-panel > .panel-title .label,
.is-legacy .page-shell .nn-page .rsp__main [data-tab-panel] > .content-panel > h2 {
  color: #f1d48a;
  font-family: "PT Serif", Georgia, serif;
  font-size: 21px;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: none;
}
.is-legacy .page-shell .nn-page .nn-page__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 16px;
  padding: 0;
  border: 0;
  background: none;
}
.is-legacy .page-shell .nn-page .nn-page__tabs .tier-tabs__button {
  flex: 1 1 0;
  min-height: 42px;
  padding: 8px 14px;
  border: 1px solid rgba(201, 162, 77, .4);
  border-radius: 4px;
  background: rgba(20, 14, 10, .85);
  color: #d9cdb4;
  font-family: "PT Serif", Georgia, serif;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}
.is-legacy .page-shell .nn-page .nn-page__tabs .tier-tabs__button[aria-selected="true"] {
  border-color: #c9a24d;
  background: linear-gradient(180deg, rgba(120, 84, 30, .55), rgba(60, 40, 16, .7));
  color: #ffdf8a;
}
@media (max-width: 560px) {
  .is-legacy .page-shell .nn-page .nn-page__tabs .tier-tabs__button {
    flex-basis: 100%;
  }
}
/* Quest rewards by kind (owner, 2026-11-04): each kind starts its own row, a small gap between kinds. */
.is-legacy .page-shell .quest-loot--kind + .quest-loot--kind {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(201, 162, 77, .18);
}
/* Item tooltips in the cards' frame (owner, 2026-11-04: "тултип нельзя сделать в новой рамке?"). Not tied to
   .page-shell: the script may move a tooltip to the end of the page to keep it on screen. */
.is-legacy .item-tooltip {
  padding: 12px 16px 14px;
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  border-radius: 0;
  background: linear-gradient(180deg, rgba(36, 24, 18, .97), rgba(14, 10, 8, .98));
  background-clip: padding-box;
  box-shadow: 0 18px 42px rgba(0, 0, 0, .65);
}
.is-legacy .item-tooltip::after {
  display: none;
}
.is-legacy .item-tooltip .item-tooltip__title {
  font-family: "PT Serif", Georgia, serif;
  font-size: 15px;
}
/* A family's own row inside the same kind: a plain gap, the gold line only between kinds. */
.is-legacy .page-shell .quest-loot--kind + .quest-loot--same-kind {
  margin-top: 8px;
  padding-top: 0;
  border-top: 0;
}
/* Several screenshots in one text block take turns (owner, 2026-11-04, /quests "Quest Tracker" to the left):
   the second, fourth ... stand on the left with the text to their right. Phones keep them centred. */
@media (min-width: 561px) {
  .is-legacy .page-shell .rsp--article .wiki-copy > .wiki-copy__figure--zoom:nth-of-type(even) {
    float: left;
    margin: 2px 16px 10px 0;
  }
}
/* A screenshot followed straight by a table (owner, 2026-11-04, hunting-log "ты думаешь, что это смотрится?"):
   no text to run beside the picture, so the table takes the left and the picture stands beside it. */
@media (min-width: 561px) {
  .is-legacy .page-shell .rsp--article .rsp-text .wiki-copy:has(> .wiki-copy__figure--zoom + .wiki-copy__table-scroll) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 180px;
    column-gap: 16px;
    align-items: start;
  }
  .is-legacy .page-shell .rsp--article .rsp-text .wiki-copy:has(> .wiki-copy__figure--zoom + .wiki-copy__table-scroll) > * {
    grid-column: 1 / -1;
  }
  .is-legacy .page-shell .rsp--article .rsp-text .wiki-copy:has(> .wiki-copy__figure--zoom + .wiki-copy__table-scroll) > .wiki-copy__figure--zoom:first-child {
    grid-column: 2;
    grid-row: 1;
    float: none;
    margin: 0;
  }
  .is-legacy .page-shell .rsp--article .rsp-text .wiki-copy:has(> .wiki-copy__figure--zoom + .wiki-copy__table-scroll) > .wiki-copy__figure--zoom:first-child + .wiki-copy__table-scroll {
    grid-column: 1;
    grid-row: 1;
    margin-top: 0;
  }
  .is-legacy .page-shell .rsp--article .rsp-text .wiki-copy:has(> .wiki-copy__figure--zoom + .wiki-copy__table-scroll)::after {
    display: none;
  }
}
@media (min-width: 561px) {
  .is-legacy .page-shell .rsp--article .rsp-text .wiki-copy:has(> .wiki-copy__figure--zoom + .wiki-copy__table-scroll) .wiki-copy__table-scroll {
    overflow-x: visible;
  }
  .is-legacy .page-shell .rsp--article .rsp-text .wiki-copy:has(> .wiki-copy__figure--zoom + .wiki-copy__table-scroll) table {
    width: 100%;
    min-width: 0;
  }
  .is-legacy .page-shell .rsp--article .rsp-text .wiki-copy:has(> .wiki-copy__figure--zoom + .wiki-copy__table-scroll) th,
  .is-legacy .page-shell .rsp--article .rsp-text .wiki-copy:has(> .wiki-copy__figure--zoom + .wiki-copy__table-scroll) td {
    white-space: normal;
  }
}
/* Item galleries in the new-look articles as the quest page's slim plates (owner, 2026-11-04, daily-reward:
   "слишком большие, сделай как в квестах"): a small icon, the name beside it, four plates to a row. */
.is-legacy .page-shell .rsp--article .wiki-copy .wiki-copy__gallery:has(> .wiki-copy__figure--item) {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)) !important;
  gap: 8px;
  justify-content: stretch;
  align-items: stretch;
  margin: 14px 0;
}
.is-legacy .page-shell .rsp--article .wiki-copy .wiki-copy__gallery > .wiki-copy__figure--item {
  display: flex !important;
  grid-template-rows: none;
  align-items: center;
  gap: 12px;
  width: auto !important;
  max-width: none !important;
  min-height: 52px;
  margin: 0;
  padding: 8px 12px !important;
  border: 1px solid rgba(143, 111, 53, .35);
  border-radius: 4px;
  background: rgba(0, 0, 0, .28);
  text-align: left;
}
.is-legacy .page-shell .rsp--article .wiki-copy .wiki-copy__gallery > .wiki-copy__figure--item img {
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  margin: 0;
  transform: none;
}
.is-legacy .page-shell .rsp--article .wiki-copy .wiki-copy__gallery > .wiki-copy__figure--item figcaption {
  display: block;
  margin: 0;
  padding: 0;
  color: #e6dcc6;
  font-size: 14px;
  line-height: 1.3;
  text-align: left;
}
@media (max-width: 560px) {
  .is-legacy .page-shell .rsp--article .wiki-copy .wiki-copy__gallery:has(> .wiki-copy__figure--item) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
/* Collections (owner, 2026-11-04: "тут вообще бардак"): the article box clipped with overflow:hidden, which
   stops the right column from following the page, so it stayed at the top over an empty strip; clip cuts the
   same without making a scroll box. Wide tables (the tier sets, six columns) fit the column instead of scrolling. */
.is-legacy .page-shell .wiki-article:has(.rsp) {
  overflow: clip;
}
.is-legacy .page-shell .rsp--article .wiki-copy__table-scroll {
  overflow-x: visible;
}
.is-legacy .page-shell .rsp--article .wiki-copy__table-scroll table {
  width: 100%;
  min-width: 0;
}
.is-legacy .page-shell .rsp--article .wiki-copy__table-scroll th,
.is-legacy .page-shell .rsp--article .wiki-copy__table-scroll td {
  white-space: normal;
  overflow-wrap: anywhere;
}
.is-legacy .page-shell .rsp--article .wiki-copy__table-scroll table:has(tr > :nth-child(5)) th,
.is-legacy .page-shell .rsp--article .wiki-copy__table-scroll table:has(tr > :nth-child(5)) td {
  padding: 8px 6px;
  font-size: 12.5px;
  line-height: 1.35;
  overflow-wrap: normal;
}
@media (max-width: 760px) {
  .is-legacy .page-shell .rsp--article .wiki-copy__table-scroll {
    overflow-x: auto;
  }
  .is-legacy .page-shell .rsp--article .wiki-copy__table-scroll table:has(tr > :nth-child(5)) {
    min-width: 640px;
  }
}
/* Wide tables as cards (wiki/_article-page.php): one card a row, its first cell the title, then the other
   cells in three columns, each under its column's name. */
.is-legacy .page-shell .rsp--article .wiki-copy__table--cards,
.is-legacy .page-shell .rsp--article .wiki-copy__table--cards tbody {
  display: block;
  width: 100%;
  min-width: 0 !important;
  border: 0;
  background: none;
}
.is-legacy .page-shell .rsp--article .wiki-copy__table--cards thead {
  display: none;
}
.is-legacy .page-shell .rsp--article .wiki-copy__table--cards tbody {
  display: grid;
  gap: 10px;
}
.is-legacy .page-shell .rsp--article .wiki-copy__table--cards tr {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px 14px;
  padding: 12px 14px;
  border: 1px solid rgba(143, 111, 53, .35);
  border-radius: 4px;
  background: rgba(0, 0, 0, .28);
}
.is-legacy .page-shell .rsp--article .wiki-copy__table--cards th,
.is-legacy .page-shell .rsp--article .wiki-copy__table--cards td {
  display: block;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  text-align: left;
  white-space: normal;
}
.is-legacy .page-shell .rsp--article .wiki-copy__table--cards tr > :first-child {
  grid-column: 1 / -1;
  padding-bottom: 8px !important;
  border-bottom: 1px solid rgba(201, 162, 77, .22) !important;
  color: #f1d48a;
  font-family: "PT Serif", Georgia, serif;
  font-size: 17px !important;
}
.is-legacy .page-shell .rsp--article .wiki-copy__table--cards tr > :first-child .wiki-copy__cell {
  display: flex;
  align-items: center;
  gap: 10px;
}
.is-legacy .page-shell .rsp--article .wiki-copy__table--cards tr > :not(:first-child)::before {
  content: attr(data-label);
  display: block;
  margin-bottom: 3px;
  color: #c9a24d;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.is-legacy .page-shell .rsp--article .wiki-copy__table--cards tr > :last-child:not(:first-child) {
  color: #ffdf8a;
}
@media (max-width: 760px) {
  .is-legacy .page-shell .rsp--article .wiki-copy__table-scroll:has(.wiki-copy__table--cards) {
    overflow-x: visible;
  }
  .is-legacy .page-shell .rsp--article .wiki-copy__table--cards tr {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
/* Runs of "one screenshot + one paragraph" blocks as a two-column grid of cards (wiki/_article-page.php). */
.is-legacy .page-shell .rsp--article .rsp-shots {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 14px;
}
.is-legacy .page-shell .rsp--article .rsp-shots > .rsp-text--shot {
  margin: 0;
}
.is-legacy .page-shell .rsp--article .rsp-text--shot .wiki-copy > .wiki-copy__figure--zoom {
  float: none !important;
  display: block;
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 10px !important;
}
.is-legacy .page-shell .rsp--article .rsp-text--shot .wiki-copy__figure--zoom img {
  width: 100%;
  height: 150px !important;
  max-height: none;
  object-fit: contain;
}
.is-legacy .page-shell .rsp--article .rsp-text--shot .wiki-copy__figure--zoom figcaption {
  display: none;
}
@media (max-width: 700px) {
  .is-legacy .page-shell .rsp--article .rsp-shots {
    grid-template-columns: minmax(0, 1fr);
  }
}
/* Skill books by map group (wiki/_valuables.php, owner 2026-11-04). */
.is-legacy .page-shell .rsp--books .rsp-books {
  margin-bottom: 14px;
}
.is-legacy .page-shell .rsp--books .rsp-books__maps {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 8px;
}
.is-legacy .page-shell .rsp--books .rsp-books__note {
  margin: 0 0 12px;
  color: #b9ab8f;
  font-size: 13px;
}
.is-legacy .page-shell .rsp--books .rsp-books__kind {
  margin: 14px 0 8px;
  color: #c9a24d;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.is-legacy .page-shell .rsp--books .quest-loot {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.is-legacy .page-shell .rsp--books .rsp-chip {
  display: inline-block;
  padding: 3px 9px;
  border: 1px solid rgba(201, 162, 77, .4);
  border-radius: 3px;
  background: rgba(0, 0, 0, .3);
  color: #e6dcc6;
  font-size: 12.5px;
}
/* Jewels by purpose (wiki/_valuables.php ?tab=jewels, owner 2026-11-04): a row per jewel, plate left, text right. */
.is-legacy .page-shell .rsp--jewels .rsp-jewel {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  padding: 12px 0;
  border-top: 1px solid rgba(201, 162, 77, .18);
}
.is-legacy .page-shell .rsp--jewels .rsp-card__title + .rsp-jewel {
  border-top: 0;
  padding-top: 4px;
}
.is-legacy .page-shell .rsp--jewels .rsp-jewel .quest-loot {
  grid-template-columns: minmax(0, 1fr);
}
.is-legacy .page-shell .rsp--jewels .rsp-jewel--set {
  grid-template-columns: minmax(0, 1fr);
}
.is-legacy .page-shell .rsp--jewels .rsp-jewel--set .quest-loot {
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
}
.is-legacy .page-shell .rsp--jewels .rsp-jewel__text p {
  margin: 0 0 6px;
  color: #e6dcc6;
  font-size: 14px;
  line-height: 1.55;
}
.is-legacy .page-shell .rsp--jewels .rsp-jewel__text p.rsp-jewel__from {
  color: #b9ab8f;
  font-size: 13px;
}
.is-legacy .page-shell .rsp--jewels .rsp-jewel__from b {
  color: #c9a24d;
  font-weight: 600;
}
@media (max-width: 700px) {
  .is-legacy .page-shell .rsp--jewels .rsp-jewel {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }
}
/* What is inside the boxes (drops/boxes.php, owner 2026-11-04): framed cards two a row, icon beside the name,
   where it drops under it, item groups as small gold labels over the list. */
.is-legacy .page-shell .rsp--boxes .rsp-box-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 14px;
}
.is-legacy .page-shell .rsp--boxes .rsp-box-filter a {
  padding: 6px 12px;
  border: 1px solid rgba(201, 162, 77, .35);
  border-radius: 3px;
  background: rgba(0, 0, 0, .35);
  color: #e6dcc6;
  font-size: 13px;
  cursor: pointer;
}
.is-legacy .page-shell .rsp--boxes .rsp-box-filter a small {
  margin-left: 4px;
  color: #b9ab8f;
}
.is-legacy .page-shell .rsp--boxes .rsp-box-filter a.is-active {
  border-color: #c9a24d;
  background: linear-gradient(#d9b25a, #a8802f);
  color: #1b1307;
}
.is-legacy .page-shell .rsp--boxes .rsp-box-filter a.is-active small {
  color: #3a2a0c;
}
.is-legacy .page-shell .rsp--boxes .rsp-boxes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}
.is-legacy .page-shell .rsp--boxes .rsp-box[hidden] {
  display: none;
}
.is-legacy .page-shell .rsp--boxes .rsp-box {
  margin: 0;
}
.is-legacy .page-shell .rsp--boxes .rsp-box__head {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 10px;
}
.is-legacy .page-shell .rsp--boxes .rsp-box__icons {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  flex: 0 0 auto;
  max-width: 50%;
}
.is-legacy .page-shell .rsp--boxes .rsp-box__icon {
  display: grid;
  place-items: center;
  width: 52px;
  min-height: 52px;
  border: 1px solid rgba(201, 162, 77, .3);
  border-radius: 3px;
  background: rgba(0, 0, 0, .35);
}
.is-legacy .page-shell .rsp--boxes .rsp-box__icon img {
  max-width: 40px;
  max-height: 40px;
}
.is-legacy .page-shell .rsp--boxes .rsp-box__icon b {
  color: #c9a24d;
  font-size: 11px;
  font-weight: 600;
}
.is-legacy .page-shell .rsp--boxes .rsp-box__name {
  min-width: 0;
}
.is-legacy .page-shell .rsp--boxes .rsp-box__name .rsp-card__title {
  margin: 0 0 4px;
}
.is-legacy .page-shell .rsp--boxes .rsp-box__where {
  display: block;
  color: #b9ab8f;
  font-size: 13px;
}
.is-legacy .page-shell .rsp--boxes .rsp-box__maps {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 5px;
}
.is-legacy .page-shell .rsp--boxes .rsp-chip {
  display: inline-block;
  padding: 2px 8px;
  border: 1px solid rgba(201, 162, 77, .4);
  border-radius: 3px;
  background: rgba(0, 0, 0, .3);
  color: #e6dcc6;
  font-size: 12px;
}
.is-legacy .page-shell .rsp--boxes .rsp-box__group {
  margin-top: 8px;
}
.is-legacy .page-shell .rsp--boxes .rsp-box__label {
  margin: 10px 0 3px;
  color: #c9a24d;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.is-legacy .page-shell .rsp--boxes .rsp-box__group .rsp-box__label {
  margin-top: 0;
}
.is-legacy .page-shell .rsp--boxes .rsp-box p {
  margin: 0;
  color: #e6dcc6;
  font-size: 13.5px;
  line-height: 1.55;
}
.is-legacy .page-shell .rsp--boxes .rsp-box__loot {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (max-width: 900px) {
  .is-legacy .page-shell .rsp--boxes .rsp-boxes {
    grid-template-columns: minmax(0, 1fr);
  }
}
.is-legacy .page-shell .rsp--boxes .rsp-box__head--many {
  flex-direction: column;
  gap: 8px;
}
.is-legacy .page-shell .rsp--boxes .rsp-box__head--many .rsp-box__name {
  order: -1;
}
.is-legacy .page-shell .rsp--boxes .rsp-box__head--many .rsp-box__icons {
  max-width: none;
}
.is-legacy .page-shell .rsp--boxes .rsp-box-filter a {
  display: inline-block;
  text-decoration: none;
}
.is-legacy .page-shell .rsp--boxes .rsp-box-filter a:hover:not(.is-active) {
  border-color: #c9a24d;
  color: #f3dfa8;
}
/* Where things drop (drops/index.php, owner 2026-11-04): search and the view switch in one card, categories as
   tabs (one category a page), the item cards in the main column beside the section's pages. */
.is-legacy .page-shell .rsp--drops .rsp-drops-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}
.is-legacy .page-shell .rsp--drops .rsp-drops-bar .drops-search {
  flex: 1 1 320px;
  margin: 0;
}
.is-legacy .page-shell .rsp--drops .rsp-drops-bar .drops-views {
  margin: 0;
}
.is-legacy .page-shell .rsp--drops .drops-panel {
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
}
.is-legacy .page-shell .rsp--drops .rsp-drops-tabs {
  margin: 0 0 14px;
}
.is-legacy .page-shell .rsp--drops .drops-category-head h2 {
  color: #f3dfa8;
  font-family: "PT Serif", Georgia, serif;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}
.is-legacy .page-shell .rsp--drops .drops-cards {
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}
.is-legacy .page-shell .rsp--drops .drops-search {
  display: flex;
  gap: 8px;
}
.is-legacy .page-shell .rsp--drops .drops-search input {
  flex: 1 1 auto;
  min-width: 0;
}
.is-legacy .page-shell .rsp--drops .rsp-drops-go {
  flex: 0 0 auto;
  padding: 7px 16px;
  border: 1px solid #c9a24d;
  border-radius: 3px;
  background: linear-gradient(#d9b25a, #a8802f);
  color: #1b1307;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
}
.is-legacy .page-shell .rsp--drops .rsp-drops-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.is-legacy .page-shell .rsp--drops .drops-category-nav a {
  padding: 6px 12px;
  border: 1px solid rgba(201, 162, 77, .35);
  border-radius: 3px;
  background: rgba(0, 0, 0, .35);
  color: #e6dcc6;
  font-size: 13px;
  text-decoration: none;
}
.is-legacy .page-shell .rsp--drops .drops-category-nav a strong {
  margin-left: 4px;
  color: #b9ab8f;
  font-weight: 400;
}
.is-legacy .page-shell .rsp--drops .drops-category-nav a.is-active {
  border-color: #c9a24d;
  background: linear-gradient(#d9b25a, #a8802f);
  color: #1b1307;
}
.is-legacy .page-shell .rsp--drops .drops-category-nav a.is-active strong {
  color: #3a2a0c;
}
.is-legacy .page-shell .rsp--drops .drops-category-nav a:hover:not(.is-active) {
  border-color: #c9a24d;
  color: #f3dfa8;
}
/* By map: one dropdown instead of 47 map chips (owner 2026-11-04, the wall of chips). */
.is-legacy .page-shell .rsp--drops .drops-map-nav {
  display: none;
}
.is-legacy .page-shell .rsp--drops .drops-map-select {
  display: flex;
  gap: 10px;
  align-items: center;
  margin: 0 0 14px;
}
.is-legacy .page-shell .rsp--drops .drops-map-select label {
  color: #c9a24d;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.is-legacy .page-shell .rsp--drops .drops-map-select select {
  min-width: 240px;
  padding: 7px 10px;
  border: 1px solid rgba(201, 162, 77, .45);
  border-radius: 3px;
  background: #15100a;
  color: #f3dfa8;
  font-size: 14px;
}
.is-legacy .page-shell .rsp--drops .drops-map-select label {
  white-space: nowrap;
}
.is-legacy .page-shell .rsp--drops .drops-map-select select {
  width: auto;
  max-width: 100%;
}
/* One row per use (drops/index.php): a gap between the rows. */
.is-legacy .page-shell .rsp--drops .drops-cards + .drops-cards {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(201, 162, 77, .15);
}
/* Bosses (events/bosses.php, owner 2026-11-04): one group a page as tabs, framed cards two a row. */
.is-legacy .page-shell .rsp--bosses .rsp-boss-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 10px;
}
.is-legacy .page-shell .rsp--bosses .rsp-boss-tabs a {
  display: inline-block;
  padding: 6px 12px;
  border: 1px solid rgba(201, 162, 77, .35);
  border-radius: 3px;
  background: rgba(0, 0, 0, .35);
  color: #e6dcc6;
  font-size: 13px;
  text-decoration: none;
}
.is-legacy .page-shell .rsp--bosses .rsp-boss-tabs a small {
  margin-left: 4px;
  color: #b9ab8f;
}
.is-legacy .page-shell .rsp--bosses .rsp-boss-tabs a.is-active {
  border-color: #c9a24d;
  background: linear-gradient(#d9b25a, #a8802f);
  color: #1b1307;
}
.is-legacy .page-shell .rsp--bosses .rsp-boss-tabs a.is-active small {
  color: #3a2a0c;
}
.is-legacy .page-shell .rsp--bosses .rsp-boss-tabs a:hover:not(.is-active) {
  border-color: #c9a24d;
  color: #f3dfa8;
}
.is-legacy .page-shell .rsp--bosses .rsp-boss-note {
  margin: 0 0 4px;
  color: #b9ab8f;
  font-size: 13.5px;
}
.is-legacy .page-shell .rsp--bosses .monster-cards {
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 16px;
}
.is-legacy .page-shell .rsp--bosses .monster-card {
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  border-radius: 0;
  background: radial-gradient(ellipse at 50% 22%, rgba(120, 70, 30, .28), transparent 60%), #120d08;
}
.is-legacy .page-shell .rsp--bosses .monster-card__name {
  color: #f3dfa8;
  font-family: "PT Serif", Georgia, serif;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}
.is-legacy .page-shell .rsp--bosses .monster-card__lore {
  color: #c9bba0;
}
/* Stadium (guilds/stadium.php, owner 2026-11-04): map picture, two fact cards, monster plates, the boss card. */
.is-legacy .page-shell .rsp--stadium .rsp-stadium__map {
  margin: 0 0 14px;
  padding: 0;
  overflow: hidden;
}
.is-legacy .page-shell .rsp--stadium .rsp-stadium__map img {
  display: block;
  width: 100%;
  max-height: 340px;
  object-fit: cover;
}
.is-legacy .page-shell .rsp--stadium .rsp-stadium__facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
}
.is-legacy .page-shell .rsp--stadium .rsp-stadium__monsters,
.is-legacy .page-shell .rsp--stadium .rsp-stadium__loot {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 8px;
  margin: 4px 0 0;
  padding: 0;
  list-style: none;
}
.is-legacy .page-shell .rsp--stadium .rsp-stadium__monsters li,
.is-legacy .page-shell .rsp--stadium .rsp-stadium__loot li {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 6px 8px;
  border: 1px solid rgba(201, 162, 77, .28);
  border-radius: 3px;
  background: rgba(0, 0, 0, .35);
  color: #e6dcc6;
  font-size: 13.5px;
}
.is-legacy .page-shell .rsp--stadium .rsp-stadium__monsters li::before,
.is-legacy .page-shell .rsp--stadium .rsp-stadium__loot li::before {
  content: none;
}
.is-legacy .page-shell .rsp--stadium .rsp-stadium__monsters img {
  width: 40px;
  height: 40px;
  object-fit: contain;
  flex: none;
}
.is-legacy .page-shell .rsp--stadium .rsp-stadium__loot img {
  width: 32px;
  height: 32px;
  object-fit: contain;
  flex: none;
}
.is-legacy .page-shell .rsp--stadium .rsp-stadium__hint {
  margin: 10px 0 0;
  color: #b9ab8f;
  font-size: 13.5px;
}
.is-legacy .page-shell .rsp--stadium .rsp-stadium__boss-body {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.is-legacy .page-shell .rsp--stadium .rsp-stadium__boss-img {
  width: 180px;
  max-width: 40%;
  height: auto;
  flex: none;
  object-fit: contain;
}
@media (max-width: 600px) {
  .is-legacy .page-shell .rsp--stadium .rsp-stadium__boss-body {
    flex-direction: column;
    align-items: center;
  }
  .is-legacy .page-shell .rsp--stadium .rsp-stadium__boss-img {
    max-width: 60%;
  }
}
.rsp-nowrap { white-space: nowrap; }
/* Drawn section icons (Codex, owner 2026-11-04): the picture carries its own frame, so the line icon's box goes. */
.is-legacy .page-shell .wiki-topnav__icon--art {
  padding: 0;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}
.is-legacy .page-shell .wiki-topnav__icon--art img {
  display: block;
  width: 100%;
  height: 100%;
}
/* Invasions section (wiki/index.php, owner 2026-11-04): the event sheet in the new look - lead, framed fact
   card, framed points, serif headings, framed tables; the monster cards below are the /bosses cards. */
.is-legacy .page-shell .rsp--sheet .event-sheet {
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
}
.is-legacy .page-shell .rsp--sheet .event-sheet__lead {
  margin: 0 0 14px;
  color: #e6dcc6;
  font-size: 17px;
}
.is-legacy .page-shell .rsp--sheet .event-sheet__notice {
  margin: 0 0 12px;
}
.is-legacy .page-shell .rsp--sheet :is(.event-sheet__facts, .event-sheet__points, .event-tables > .event-table, .event-sheet > .event-rewards, .event-loot, .event-sheet__tickets) {
  margin: 0 0 16px;
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  background: linear-gradient(180deg, rgba(36, 24, 18, .92), rgba(16, 12, 10, .96));
  background-clip: padding-box;
  padding: 12px 16px 14px;
  border-radius: 0;
  box-shadow: none;
}
.is-legacy .page-shell .rsp--sheet .event-sheet__facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
}
.is-legacy .page-shell .rsp--sheet .event-sheet__facts > div {
  margin: 0;
  padding: 0 0 0 10px;
  border: 0;
  border-left: 2px solid rgba(201, 162, 77, .5);
  background: none;
}
.is-legacy .page-shell .rsp--sheet .event-sheet__facts dt {
  color: #b9ab8f;
  font-size: 12px;
  letter-spacing: .04em;
}
.is-legacy .page-shell .rsp--sheet .event-sheet__facts dd {
  margin: 2px 0 0;
  color: #f3dfa8;
  font-size: 15px;
  font-weight: 600;
}
.is-legacy .page-shell .rsp--sheet .event-sheet__points {
  padding-left: 34px;
  color: #d9cdb4;
}
.is-legacy .page-shell .rsp--sheet .event-sheet__points li {
  margin: 4px 0;
}
.is-legacy .page-shell .rsp--sheet .event-sheet h2 {
  margin: 4px 0 10px;
  color: #f1d48a;
  font-family: "PT Serif", Georgia, serif;
  font-size: 21px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}
.is-legacy .page-shell .rsp--sheet .event-tables > .event-table h2 {
  margin-top: 0;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(201, 162, 77, .28);
}
.is-legacy .page-shell .rsp--sheet .event-sheet__note {
  color: #b9ab8f;
  font-size: 13.5px;
}
.is-legacy .page-shell .rsp--sheet .monster-cards {
  margin-top: 6px;
}
/* Weapons | Armour (wings/upgrade.php, pets.php, earrings.php, owner 2026-11-05): the old panels as framed
   cards in the main column, their tab rows as the gold tab links of /bosses, panel titles in serif. */
.is-legacy .page-shell .rsp--gear .content-panel {
  margin: 0 0 16px;
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  border-radius: 0;
  background: linear-gradient(180deg, rgba(36, 24, 18, .92), rgba(16, 12, 10, .96));
  background-clip: padding-box;
  box-shadow: none;
  padding: 12px 16px 16px;
}
.is-legacy .page-shell .rsp--gear .content-panel .content-panel {
  border: 1px solid rgba(201, 162, 77, .28);
  border-image: none;
  background: rgba(0, 0, 0, .25);
}
.is-legacy .page-shell .rsp--gear .rsp-gear__intro {
  color: #e6dcc6;
}
.is-legacy .page-shell .rsp--gear .rsp-gear__intro :is(p, li) {
  color: #e6dcc6;
  font-size: 15px;
}
.is-legacy .page-shell .rsp--gear .panel-title {
  margin: 0 0 12px;
  padding: 0 0 8px;
  border: 0;
  border-bottom: 1px solid rgba(201, 162, 77, .28);
  background: none;
}
.is-legacy .page-shell .rsp--gear .panel-title .label {
  color: #f1d48a;
  font-family: "PT Serif", Georgia, serif;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}
.is-legacy .page-shell .rsp--gear .tier-tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 6px;
  margin: 0 0 14px;
  padding: 0;
  border: 0;
  background: none;
}
.is-legacy .page-shell .rsp--gear .tier-tabs__button {
  padding: 6px 12px;
  border: 1px solid rgba(201, 162, 77, .35);
  border-radius: 3px;
  background: rgba(0, 0, 0, .35);
  color: #e6dcc6;
  font-size: 13px;
  letter-spacing: 0;
  text-transform: none;
}
.is-legacy .page-shell .rsp--gear .tier-tabs__button:hover {
  border-color: #c9a24d;
  color: #f3dfa8;
}
.is-legacy .page-shell .rsp--gear .tier-tabs__button:is(.tier-tabs__button--active, [aria-selected="true"]) {
  border-color: #c9a24d;
  background: linear-gradient(#d9b25a, #a8802f);
  color: #1b1307;
}
.is-legacy .page-shell .rsp--gear .ancient-catalog__note {
  margin: 0 0 12px;
  color: #e6dcc6;
  font-size: 15px;
}
/* The tables of these pages carry an old min-width (820px for the upgrade table) wider than the main column. */
.is-legacy .page-shell .rsp--gear .table-wrap > table {
  min-width: 0;
  width: 100%;
}
.is-legacy .page-shell .rsp--gear .table-wrap :is(th, td) {
  padding-left: 6px;
  padding-right: 6px;
}
/* Wings by tier (wings/tiers.php, owner 2026-11-05): wing plates, a facts list, the +10..+15 table. */
.is-legacy .page-shell .rsp--wings .rsp-wings__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.is-legacy .page-shell .rsp--wings .rsp-wing {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 8px;
  border: 1px solid rgba(201, 162, 77, .28);
  background: rgba(0, 0, 0, .3);
}
.is-legacy .page-shell .rsp--wings .rsp-wing__icon {
  position: relative;
  flex: 0 0 56px;
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
}
.is-legacy .page-shell .rsp--wings .rsp-wing__icon img {
  max-width: 56px;
  max-height: 56px;
  object-fit: contain;
}
.is-legacy .page-shell .rsp--wings .rsp-wing__text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.is-legacy .page-shell .rsp--wings .rsp-wing__text strong {
  color: #f1d48a;
  font-size: 14px;
}
.is-legacy .page-shell .rsp--wings .rsp-wing__text small {
  color: #b9ab8f;
  font-size: 12.5px;
}
.is-legacy .page-shell .rsp--wings .rsp-wings__sub {
  margin: 14px 0 8px;
  color: #e6c878;
  font-family: "PT Serif", Georgia, serif;
  font-size: 16px;
}
.is-legacy .page-shell .rsp--wings .rsp-wings__facts {
  display: grid;
  grid-template-columns: minmax(150px, 190px) 1fr;
  gap: 8px 14px;
  margin: 0;
}
.is-legacy .page-shell .rsp--wings .rsp-wings__facts dt {
  color: #e6c878;
  font-weight: 700;
  font-size: 14px;
}
.is-legacy .page-shell .rsp--wings .rsp-wings__facts dd {
  margin: 0;
  color: #e6dcc6;
  font-size: 14.5px;
  line-height: 1.5;
}
.is-legacy .page-shell .rsp--wings .rsp-wings__text {
  margin: 0;
  color: #e6dcc6;
  font-size: 15px;
  line-height: 1.55;
}
.is-legacy .page-shell .rsp--wings .rsp-wings__table {
  margin-top: 10px;
  border-collapse: collapse;
}
.is-legacy .page-shell .rsp--wings .rsp-wings__table :is(th, td) {
  padding: 5px 8px;
  border: 1px solid rgba(201, 162, 77, .28);
  color: #e6dcc6;
  text-align: center;
}
.is-legacy .page-shell .rsp--wings .rsp-wings__table th {
  color: #e6c878;
  text-align: left;
}
.is-legacy .page-shell .rsp--wings .rsp-wings__more a {
  color: #f1d48a;
}
@media (max-width: 640px) {
  .is-legacy .page-shell .rsp--wings .rsp-wings__facts {
    grid-template-columns: 1fr;
    gap: 2px;
  }
  .is-legacy .page-shell .rsp--wings .rsp-wings__facts dd {
    margin-bottom: 8px;
  }
}
/* Chaos Machine (wings/mixes.php, owner 2026-11-05): in the narrower main column the mix name keeps its width
   and the badges go under it instead of squeezing it to a few letters. */
.is-legacy .page-shell .rsp--mixes .mix-row__summary {
  grid-template-columns: 52px minmax(0, 1fr) 14px;
  grid-template-areas: "icon text arrow" "icon badges arrow";
  row-gap: 6px;
}
.is-legacy .page-shell .rsp--mixes .mix-row__summary > .mix-row__icon { grid-area: icon; }
.is-legacy .page-shell .rsp--mixes .mix-row__summary > .mix-row__text { grid-area: text; min-width: 0; }
.is-legacy .page-shell .rsp--mixes .mix-row__summary > .mix-row__badges {
  grid-area: badges;
  justify-content: flex-start;
  flex-wrap: wrap;
}
.is-legacy .page-shell .rsp--mixes .mix-row__summary::after { grid-area: arrow; }
.is-legacy .page-shell .rsp--mixes .mix-about p {
  margin: 0 0 6px;
  color: #e6dcc6;
  font-size: 15px;
}
.is-legacy .page-shell .rsp--mixes .mix-talisman {
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}
.is-legacy .page-shell .rsp--mixes .mix-talisman > div {
  grid-column: 2;
  min-width: 0;
}
/* Chaos Machine intro (owner, 2026-11-05): the goblin only as tall as the text beside it, the two talismans
   side by side under both, all text a size smaller. */
.is-legacy .page-shell .rsp--mixes .rsp-gear__intro .daily-lead.has-npc {
  grid-template-columns: minmax(0, 1fr) 150px;
  align-items: start;
  gap: 16px;
}
.is-legacy .page-shell .rsp--mixes .rsp-gear__intro :is(p, li) {
  font-size: 13.5px;
  line-height: 1.5;
}
.is-legacy .page-shell .rsp--mixes .rsp-gear__intro .earring-npc {
  padding: 6px;
}
.is-legacy .page-shell .rsp--mixes .rsp-gear__intro .earring-npc img {
  max-height: 110px;
  width: auto;
}
.is-legacy .page-shell .rsp--mixes .rsp-gear__intro .earring-npc :is(strong, li) {
  font-size: 12.5px;
}
.is-legacy .page-shell .rsp--mixes .rsp-gear__intro .mix-talismans {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.is-legacy .page-shell .rsp--mixes .rsp-gear__intro .mix-talisman {
  padding: 8px 10px;
}
.is-legacy .page-shell .rsp--mixes .rsp-gear__intro .mix-talisman strong {
  font-size: 13px;
}
.is-legacy .page-shell .rsp--mixes .rsp-gear__intro .mix-talisman p {
  margin: 2px 0 0;
  font-size: 12.5px;
  line-height: 1.45;
}
@media (max-width: 640px) {
  .is-legacy .page-shell .rsp--mixes .rsp-gear__intro .mix-talismans {
    grid-template-columns: 1fr;
  }
}
/* Chaos / Blessed weapons (wings/special-weapons.php, 2026-11-05): the stats table spans the card. */
.is-legacy .page-shell .rsp--wings .rsp-weapons__table { width: 100%; }
.is-legacy .page-shell .rsp--wings .rsp-weapons__table tbody th { color: #f1d48a; font-weight: 600; }
.is-legacy .page-shell .rsp--wings .rsp-weapons__note { margin-top: 8px; font-size: 13px; color: #b9ab8f; }

.is-legacy .page-shell .rsp--wings .rsp-weapons__table :is(th, td) {
  text-transform: none;
  letter-spacing: 0;
  white-space: normal;
  font-size: 13px;
}
.is-legacy .page-shell .rsp--wings .rsp-weapons__table thead th {
  color: #e6c878;
  font-size: 12px;
}
/* /guilds in the main column (guilds/system.php, 2026-11-05): the text and its four facts take the full width,
   the two NPCs stand in a row under them, smaller. */
.is-legacy .page-shell .rsp--gear .guild-lead.has-npc {
  grid-template-columns: 1fr;
}
.is-legacy .page-shell .rsp--gear .guild-lead .guild-npcs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.is-legacy .page-shell .rsp--gear .guild-lead .guild-npcs img {
  max-height: 120px;
  width: auto;
}

/* Item options section (gameplay/resistances.php, wiki/_excellent-ranks.php, wiki/_harmony.php, owner 2026-11-05):
   the resistances page in the Weapons | Armour look, and the rank / harmony tables as cards of the article. */
.is-legacy .page-shell .rsp--resist .rsp-resist__totals {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0 0 14px;
  padding: 0;
  list-style: none;
}
.is-legacy .page-shell .rsp--resist .rsp-resist__totals li {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px 10px;
  border: 1px solid rgba(201, 162, 77, .28);
  background: rgba(0, 0, 0, .3);
}
.is-legacy .page-shell .rsp--resist .rsp-resist__totals span {
  color: #b9ab8f;
  font-size: 12.5px;
}
.is-legacy .page-shell .rsp--resist .rsp-resist__totals strong {
  color: #f1d48a;
  font-family: "PT Serif", Georgia, serif;
  font-size: 22px;
}
.is-legacy .page-shell .rsp--resist .rsp-resist__prose p,
.is-legacy .page-shell .rsp--resist .rsp-resist__text {
  margin: 0 0 10px;
  color: #e6dcc6;
  font-size: 15px;
  line-height: 1.55;
}
.is-legacy .page-shell .rsp--resist .rsp-resist__prose p:last-child {
  margin-bottom: 0;
}
.is-legacy .page-shell .rsp--resist .rsp-resist__items {
  margin-bottom: 12px;
}
.is-legacy .page-shell .rsp--resist .rsp-resist__table {
  width: 100%;
}
.is-legacy .page-shell .rsp--resist .rsp-resist__table :is(th, td) {
  font-size: 13px;
  letter-spacing: 0;
  text-transform: none;
  white-space: normal;
}
.is-legacy .page-shell .rsp--resist .rsp-resist__table thead th {
  color: #e6c878;
  font-size: 12px;
  text-align: center;
}
.is-legacy .page-shell .rsp--resist .rsp-resist__table thead th:first-child,
.is-legacy .page-shell .rsp--resist .rsp-resist__table tbody th {
  color: #f1d48a;
  text-align: left;
}
.is-legacy .page-shell .rsp--resist .rsp-resist__elements .muted {
  color: #8d816b;
}
@media (max-width: 760px) {
  .is-legacy .page-shell .rsp--resist .rsp-resist__totals {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .is-legacy .page-shell .rsp--resist .table-wrap {
    overflow-x: auto;
  }
  .is-legacy .page-shell .rsp--resist .rsp-resist__ladder {
    min-width: 520px;
  }
}
/* The rank and harmony tables inside an article card: the old block's own margin and heading go, the table
   spans the card, the long harmony ladder scrolls inside it. */
.is-legacy .page-shell .rsp--article .rsp-opt .reset-table {
  margin: 0;
}
.is-legacy .page-shell .rsp--article .rsp-opt .reset-table__scroll {
  overflow-x: auto;
  margin: 0;
  border: 0;
  background: none;
}
.is-legacy .page-shell .rsp--article .rsp-opt table {
  width: 100%;
  min-width: 0;
  border-collapse: collapse;
}
.is-legacy .page-shell .rsp--article .rsp-opt :is(th, td) {
  padding: 6px 6px;
  border: 1px solid rgba(201, 162, 77, .22);
  font-size: 13px;
  letter-spacing: 0;
  text-transform: none;
}
.is-legacy .page-shell .rsp--article .rsp-opt thead th {
  background: rgba(0, 0, 0, .3);
  font-size: 12px;
}
.is-legacy .page-shell .rsp--article .rsp-opt .reset-table__name {
  min-width: 170px;
  max-width: none;
  padding-left: 8px;
  color: #f1d48a;
  text-align: left;
  white-space: normal;
}
.is-legacy .page-shell .rsp--article .rsp-opt thead th:first-child {
  text-align: left;
}
.is-legacy .page-shell .rsp--article .rsp-opt .reset-table--harmony table {
  min-width: 760px;
}
.is-legacy .page-shell .rsp--article .rsp-opt .reset-table__note {
  margin: 10px 0 0;
  color: #b9ab8f;
  font-size: 13px;
}

/* Event sheets: the NPC you enter at, picture, map and coordinates (owner, 2026-11-05). */
.is-legacy .page-shell .rsp--sheet .event-sheet__npc {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0 0 16px;
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  background: linear-gradient(180deg, rgba(36, 24, 18, .92), rgba(16, 12, 10, .96));
  background-clip: padding-box;
  padding: 10px 16px;
}
.is-legacy .page-shell .rsp--sheet .event-sheet__npc img {
  flex: 0 0 auto;
  width: 96px;
  height: 96px;
  object-fit: contain;
}
.is-legacy .page-shell .rsp--sheet .event-sheet__npc div {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.is-legacy .page-shell .rsp--sheet .event-sheet__npc span {
  color: #b9ab8f;
  font-size: 12px;
  letter-spacing: .04em;
}
.is-legacy .page-shell .rsp--sheet .event-sheet__npc strong {
  color: #f3dfa8;
  font-size: 18px;
}
.is-legacy .page-shell .rsp--sheet .event-sheet__npc em {
  color: #d9cdb4;
  font-style: normal;
  font-size: 15px;
}
.is-legacy .page-shell .rsp--sheet .event-sheet__npc em b {
  color: #7fd1ff;
  margin-left: 4px;
}
.is-legacy .page-shell .rsp--sheet .event-sheet__npc .event-sheet__npc-facts {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 10px 24px;
  margin: 0 0 0 auto;
}
.is-legacy .page-shell .rsp--sheet .event-sheet__npc-facts > div {
  padding: 0 0 0 10px;
  border-left: 2px solid rgba(201, 162, 77, .5);
}
.is-legacy .page-shell .rsp--sheet .event-sheet__npc-facts dt {
  color: #b9ab8f;
  font-size: 12px;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.is-legacy .page-shell .rsp--sheet .event-sheet__npc-facts dd {
  margin: 2px 0 0;
  color: #f3dfa8;
  font-size: 15px;
  font-weight: 600;
}
@media (max-width: 640px) {
  .is-legacy .page-shell .rsp--sheet .event-sheet__npc { flex-wrap: wrap; }
  .is-legacy .page-shell .rsp--sheet .event-sheet__npc .event-sheet__npc-facts { margin: 0; flex-basis: 100%; }
}

/* Event reward rows without chances (owner, 2026-11-05): the prizes of a row in one line, wrapping only as a whole. */
.is-legacy .page-shell .rsp--sheet .event-rewards__line {
  gap: 4px 18px;
}
.is-legacy .page-shell .rsp--sheet .event-rewards__cell .event-line {
  flex-wrap: nowrap;
}
.is-legacy .page-shell .rsp--sheet .event-ticket__gap {
  display: inline-block;
  width: 22px;
}
/* Item options: harmony tables as one row per option, the removal price as tiles; NPC cards with the portrait on
   the left beside its text and the item tiles in one row (WikiHowtoLayout, owner 2026-11-05). */
.is-legacy .page-shell .rsp--article .rsp-harmony {
  width: 100%;
  min-width: 0 !important;
  table-layout: fixed;
  border-collapse: collapse;
}
.is-legacy .page-shell .rsp--article .rsp-harmony :is(th, td):nth-child(1) { width: 50%; overflow-wrap: anywhere; }
.is-legacy .page-shell .rsp--article .rsp-harmony :is(th, td):nth-child(2) { width: 20%; }
.is-legacy .page-shell .rsp--article .rsp-harmony :is(th, td):nth-child(3) { width: 30%; }
.is-legacy .page-shell .rsp--article .rsp-harmony :is(th, td) {
  padding: 7px 10px;
  border-bottom: 1px solid rgba(201, 162, 77, .18);
  color: #e6dcc6;
  font-size: 14px;
  letter-spacing: 0;
  text-align: left;
  text-transform: none;
  white-space: normal;
}
.is-legacy .page-shell .rsp--article .rsp-harmony thead th {
  color: #b9ab8f;
  font-size: 12.5px;
  font-weight: 600;
}
.is-legacy .page-shell .rsp--article .rsp-harmony tbody th {
  color: #f1d48a;
  font-weight: 600;
}
.is-legacy .page-shell .rsp--article .rsp-harmony td strong {
  color: #f3dfa8;
}
.is-legacy .page-shell .rsp--article .rsp-harmony__costs {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.is-legacy .page-shell .rsp--article .rsp-harmony__costs li {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 6px 10px;
  border: 1px solid rgba(201, 162, 77, .28);
  background: rgba(0, 0, 0, .3);
}
.is-legacy .page-shell .rsp--article .rsp-harmony__costs span {
  color: #b9ab8f;
  font-size: 12px;
}
.is-legacy .page-shell .rsp--article .rsp-harmony__costs strong {
  color: #f1d48a;
  font-size: 14px;
}
.is-legacy .page-shell .rsp--article .rsp-harmony__note {
  margin: 10px 0 0;
  color: #b9ab8f;
  font-size: 13px;
}
@media (max-width: 560px) {
  .is-legacy .page-shell .rsp--article .rsp-harmony :is(th, td) {
    padding: 6px 5px;
    font-size: 13px;
  }
}
.is-legacy .page-shell .rsp--article .wiki-copy .rsp-howto {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  margin: 0 0 12px;
}
.is-legacy .page-shell .rsp--article .wiki-copy .rsp-howto > .wiki-copy__figure {
  float: none;
  width: auto;
  max-width: none;
  margin: 0;
  padding: 6px;
  border: 1px solid rgba(201, 162, 77, .28);
  background: rgba(0, 0, 0, .3);
  text-align: center;
}
.is-legacy .page-shell .rsp--article .wiki-copy .rsp-howto > .wiki-copy__figure img {
  width: auto;
  max-width: 100%;
  max-height: 150px;
  margin: 0 auto;
}
.is-legacy .page-shell .rsp--article .wiki-copy .rsp-howto > .wiki-copy__figure figcaption {
  margin-top: 4px;
  font-size: 12.5px;
}
.is-legacy .page-shell .rsp--article .wiki-copy .rsp-howto__lead > :last-child {
  margin-bottom: 0;
}
.is-legacy .page-shell .rsp--article .wiki-copy .wiki-copy__gallery.rsp-howto__items {
  clear: both;
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)) !important;
  margin: 0 0 12px;
}
@media (max-width: 560px) {
  .is-legacy .page-shell .rsp--article .wiki-copy .rsp-howto {
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 12px;
  }
  .is-legacy .page-shell .rsp--article .wiki-copy .rsp-howto > .wiki-copy__figure img {
    max-height: 110px;
  }
}

/* /invite in the new look (owner, 2026-11-05): framed cards, PT Serif titles, gold-edged tiles. */
.is-legacy .page-shell .invite :is(.invite-hero, .invite-card, .invite-end) {
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  border-radius: 0;
  background-clip: padding-box;
}
.is-legacy .page-shell .invite :is(.invite-card, .invite-end) {
  background-color: transparent;
  background-image: linear-gradient(180deg, rgba(36, 24, 18, .92), rgba(16, 12, 10, .96));
}
.is-legacy .page-shell .invite .invite-hero h1,
.is-legacy .page-shell .invite :is(.invite-head, .invite-end) h2 {
  color: #f3dfa8;
  font-family: "PT Serif", Georgia, serif;
  font-weight: 700;
  letter-spacing: .01em;
  text-transform: none;
  text-shadow: 0 2px 10px rgba(0, 0, 0, .7);
}
.is-legacy .page-shell .invite :is(.invite-head, .invite-end) h2 {
  font-size: 28px;
}
.is-legacy .page-shell .invite .invite-kicker {
  color: #c9a24d;
  letter-spacing: .08em;
}
.is-legacy .page-shell .invite :is(.invite-stage, .invite-class, .invite-items li, .invite-player__stats div, .invite-chips li) {
  border: 1px solid rgba(201, 162, 77, .28);
  border-radius: 4px;
  background: rgba(0, 0, 0, .3);
}
.is-legacy .page-shell .invite :is(.invite-stage, .invite-class).is-active {
  border-color: rgba(240, 198, 116, .85);
  background: linear-gradient(180deg, rgba(120, 84, 30, .32), rgba(30, 20, 12, .6));
  box-shadow: inset 0 0 0 1px rgba(240, 198, 116, .25);
}
.is-legacy .page-shell .invite .invite-player__stats div {
  border-left: 2px solid rgba(201, 162, 77, .6);
}
.is-legacy .page-shell .invite .invite-player__stats dt {
  color: #b9ab8f;
  font-size: 12px;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.is-legacy .page-shell .invite .invite-player__stats dd {
  color: #f3dfa8;
}
@media (max-width: 640px) {
  .is-legacy .page-shell .invite :is(.invite-head, .invite-end) h2 { font-size: 22px; }
}
/* The invite banner: the referral art (knight and elf offering a hand), text over its dark left side. */
.is-legacy .page-shell .invite .invite-hero--art {
  min-height: 420px;
  background-color: #0b0a0c;
  background-image: linear-gradient(90deg, rgba(11, 10, 12, .95) 0%, rgba(11, 10, 12, .85) 36%, rgba(11, 10, 12, 0) 56%), var(--invite-hero);
  background-size: auto 100%;
  background-position: right center;
  background-repeat: no-repeat;
}
.is-legacy .page-shell .invite .invite-hero--art .invite-hero__body {
  max-width: 46%;
}
@media (max-width: 640px) {
  .is-legacy .page-shell .invite .invite-hero--art {
    background-image: linear-gradient(180deg, rgba(11, 10, 12, .55), rgba(11, 10, 12, .95) 70%), var(--invite-hero);
    background-position: 70% top;
  }
}


/* Skin shop: the rendered character in the set, one per class tab (setrender). */
.is-legacy .page-shell .skinshop-set .skinshop-render {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(55% 50% at 50% 48%, rgba(120, 200, 120, .16), transparent 72%);
}
.is-legacy .page-shell .skinshop-set .skinshop-render img {
  height: 94%;
  width: auto;
  max-width: 100%;
  object-fit: contain;
  filter: drop-shadow(0 6px 14px rgba(0, 0, 0, .7));
}
.is-legacy .page-shell .skinshop-set .skinshop-render img[hidden] {
  display: none;
}

/* Castle Siege (owner, 2026-11-05: "adapt it to the new design"). The page keeps its markup and
   castle-page.css for the layout; here it takes the card frame, the crimson glow and the gold titles
   of the shop pages. The title band comes from the layout, so the hero keeps the art and the date. */
.is-legacy .page-shell .siege-page {
  gap: 18px;
  color: var(--k-text);
}
.is-legacy .page-shell .siege-hero {
  min-height: 200px;
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  border-radius: 0;
  padding: 0 30px;
}
.is-legacy .page-shell .siege-hero p {
  max-width: 560px;
  padding: 10px 16px;
  border-left: 3px solid var(--k-gold);
  background: linear-gradient(90deg, rgba(11, 10, 12, .82), rgba(11, 10, 12, 0));
  color: var(--k-gold2);
  font-family: var(--font-title);
  font-size: 18px;
  font-weight: 600;
  letter-spacing: .02em;
}
.is-legacy .page-shell .siege-card,
.is-legacy .page-shell .siege-board,
.is-legacy .page-shell .siege-lands {
  padding: 22px 24px;
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  border-radius: 0;
  background:
    radial-gradient(circle at 15% 0%, rgba(156, 28, 34, .26), transparent 55%) padding-box,
    var(--k-card) padding-box;
  box-shadow: none;
}
.is-legacy .page-shell .siege-card__label,
.is-legacy .page-shell .siege-board__sub {
  color: var(--k-gold);
  font-family: var(--font-title);
  letter-spacing: .1em;
}
.is-legacy .page-shell .siege-card__value {
  font-family: var(--font-title);
  font-weight: 700;
  background: linear-gradient(180deg, var(--k-gold2), #c79b44);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.is-legacy .page-shell .siege-card__hint,
.is-legacy .page-shell .siege-note,
.is-legacy .page-shell .siege-prize__lead,
.is-legacy .page-shell .siege-empty {
  color: var(--k-mute);
}
.is-legacy .page-shell .siege-card__crown,
.is-legacy .page-shell .siege-defender svg {
  fill: var(--k-gold);
}
.is-legacy .page-shell .siege-section-head h2 {
  margin: 0;
  font-family: var(--font-title);
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  background: linear-gradient(180deg, var(--k-gold2), #c79b44);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Timeline and clock */
.is-legacy .page-shell .siege-step {
  color: var(--k-mute);
}
.is-legacy .page-shell .siege-step + .siege-step::before {
  background: rgba(143, 111, 53, .35);
}
.is-legacy .page-shell .siege-step.is-done + .siege-step::before,
.is-legacy .page-shell .siege-step.is-now::before {
  background: linear-gradient(90deg, var(--k-gold), var(--k-red2));
}
.is-legacy .page-shell .siege-step__dot {
  border-color: rgba(143, 111, 53, .6);
  background: var(--k-bg);
}
.is-legacy .page-shell .siege-step.is-done,
.is-legacy .page-shell .siege-step.is-now strong {
  color: var(--k-text);
}
.is-legacy .page-shell .siege-step.is-done .siege-step__dot {
  border-color: var(--k-gold);
  background: var(--k-gold);
}
.is-legacy .page-shell .siege-step.is-now .siege-step__dot {
  border-color: var(--k-gold2);
  background: var(--k-red2);
  box-shadow: 0 0 0 4px rgba(217, 169, 78, .18), 0 0 14px rgba(245, 212, 138, .55);
}
.is-legacy .page-shell .siege-clock__lead {
  color: var(--k-mute);
}
.is-legacy .page-shell .siege-clock__tiles div {
  border: 1px solid rgba(143, 111, 53, .55);
  border-radius: 2px;
  background: linear-gradient(180deg, rgba(156, 28, 34, .45), rgba(110, 18, 24, .25)), var(--k-bg);
}
.is-legacy .page-shell .siege-clock__tiles strong {
  font-family: var(--font-title);
  color: var(--k-gold2);
}
.is-legacy .page-shell .siege-clock__tiles span {
  color: var(--k-mute);
}

/* Owner taxes, treasury */
.is-legacy .page-shell .siege-taxes > div,
.is-legacy .page-shell .siege-prize__main,
.is-legacy .page-shell .siege-prize .siege-treasury__item,
.is-legacy .page-shell .siege-flows li {
  border: 1px solid rgba(143, 111, 53, .4);
  border-radius: 2px;
  background: linear-gradient(180deg, rgba(27, 23, 25, .95), rgba(11, 10, 12, .9));
}
.is-legacy .page-shell .siege-taxes strong,
.is-legacy .page-shell .siege-prize__main strong {
  font-family: var(--font-title);
  color: var(--k-gold2);
}
.is-legacy .page-shell .siege-taxes span,
.is-legacy .page-shell .siege-prize__main span,
.is-legacy .page-shell .siege-flows li span {
  color: var(--k-mute);
}
.is-legacy .page-shell .siege-badge--open {
  border-color: rgba(217, 169, 78, .6);
  background: rgba(217, 169, 78, .14);
  color: var(--k-gold2);
}
.is-legacy .page-shell .siege-badge--closed {
  border-color: rgba(156, 28, 34, .7);
  background: rgba(110, 18, 24, .35);
  color: #e9a3a3;
}
.is-legacy .page-shell .siege-giveup summary {
  color: var(--k-mute);
}

/* Lands */
.is-legacy .page-shell .siege-land-tab {
  border: 1px solid rgba(143, 111, 53, .45);
  border-radius: 2px;
}
.is-legacy .page-shell .siege-land-tab span {
  font-family: var(--font-title);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.is-legacy .page-shell #siege-land-stadium:checked ~ .siege-land-tabs .siege-land-tab--stadium,
.is-legacy .page-shell #siege-land-trials:checked ~ .siege-land-tabs .siege-land-tab--trials {
  border-color: var(--k-gold2);
  box-shadow: 0 0 0 1px var(--k-gold), 0 0 18px rgba(217, 169, 78, .3);
}
.is-legacy .page-shell .siege-land h3,
.is-legacy .page-shell .siege-land__boss strong {
  font-family: var(--font-title);
  color: var(--k-gold2);
}
.is-legacy .page-shell .siege-land__boss,
.is-legacy .page-shell .siege-land__monsters li,
.is-legacy .page-shell .siege-land__loot li {
  border-color: rgba(143, 111, 53, .4);
  border-radius: 2px;
  background: linear-gradient(180deg, rgba(156, 28, 34, .14), rgba(11, 10, 12, .6));
}

/* Board of guilds and the chronicle */
.is-legacy .page-shell .siege-defender,
.is-legacy .page-shell .siege-call {
  border-color: rgba(217, 169, 78, .5);
  border-radius: 2px;
  background: linear-gradient(90deg, rgba(156, 28, 34, .3), rgba(11, 10, 12, .6));
}
.is-legacy .page-shell .siege-defender span,
.is-legacy .page-shell .siege-rival__meta,
.is-legacy .page-shell .siege-chronicle__row > div > span {
  color: var(--k-mute);
}
.is-legacy .page-shell .siege-defender strong,
.is-legacy .page-shell .siege-guild {
  font-family: var(--font-title);
  color: var(--k-text);
}
.is-legacy .page-shell .siege-rival,
.is-legacy .page-shell .siege-chronicle__row {
  border: 1px solid rgba(143, 111, 53, .3);
  border-radius: 2px;
  background: linear-gradient(90deg, rgba(110, 18, 24, .3), rgba(20, 18, 21, .9) 60%);
}
.is-legacy .page-shell .siege-rival--top {
  border-color: rgba(217, 169, 78, .6);
}
.is-legacy .page-shell .siege-rank,
.is-legacy .page-shell .siege-score {
  font-family: var(--font-title);
  color: var(--k-gold2);
}
.is-legacy .page-shell .siege-rival__bar {
  border-radius: 0;
  background: rgba(143, 111, 53, .2);
}
.is-legacy .page-shell .siege-rival__bar i {
  background: linear-gradient(90deg, var(--k-red2), var(--k-gold), var(--k-gold2));
}
.is-legacy .page-shell .siege-chronicle__row time {
  color: var(--k-gold);
  font-family: var(--font-title);
}
@media (max-width: 560px) {
  .is-legacy .page-shell .siege-card,
  .is-legacy .page-shell .siege-board,
  .is-legacy .page-shell .siege-lands {
    padding: 16px 14px;
  }
  .is-legacy .page-shell .siege-hero {
    padding: 0 16px;
  }
  .is-legacy .page-shell .siege-hero p {
    font-size: 16px;
  }
  .is-legacy .page-shell .siege-step strong {
    font-size: 11px;
    overflow-wrap: normal;
  }
}

/* Castle Siege, second pass (owner, 2026-11-05): three tabs in the title band, the art cards of the
   rankings, the castle in one row of tiles, the guild plaque with the red button and the attackers
   as a ranking table. */
.is-legacy .page-shell .siege-arts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.is-legacy .page-shell .siege-art {
  position: relative;
  display: block;
  height: 150px;
  overflow: hidden;
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  background: var(--k-bg) padding-box;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}
.is-legacy .page-shell .siege-art img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(.82) saturate(.9);
  object-position: center 30%;
  transition: filter .2s, transform .35s;
}
.is-legacy .page-shell .siege-art::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 35%, rgba(11, 10, 12, .85));
  pointer-events: none;
}
.is-legacy .page-shell .siege-art__name,
.is-legacy .page-shell .siege-art small {
  position: absolute;
  z-index: 1;
  left: 0;
  right: 0;
  padding: 0 10px;
  text-align: center;
}
.is-legacy .page-shell .siege-art__name {
  bottom: 30px;
  color: var(--k-gold2);
  font-family: var(--font-title);
  font-size: clamp(18px, 2vw, 28px);
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-shadow: 0 2px 4px #000, 0 0 18px rgba(156, 28, 34, .8);
  white-space: nowrap;
}
.is-legacy .page-shell .siege-art small {
  bottom: 12px;
  overflow: hidden;
  color: var(--k-mute);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.is-legacy .page-shell .siege-art:hover img {
  filter: brightness(.9) saturate(.95);
  transform: scale(1.03);
}
.is-legacy .page-shell .siege-art.is-on,
.is-legacy .page-shell #siege-land-stadium:checked ~ .siege-arts .siege-art--stadium,
.is-legacy .page-shell #siege-land-trials:checked ~ .siege-arts .siege-art--trials {
  box-shadow: 0 0 0 1px var(--k-gold), 0 0 22px rgba(217, 169, 78, .35);
}
.is-legacy .page-shell .siege-art.is-on img,
.is-legacy .page-shell #siege-land-stadium:checked ~ .siege-arts .siege-art--stadium img,
.is-legacy .page-shell #siege-land-trials:checked ~ .siege-arts .siege-art--trials img {
  filter: none;
}
.is-legacy .page-shell #siege-land-stadium:focus-visible ~ .siege-arts .siege-art--stadium,
.is-legacy .page-shell #siege-land-trials:focus-visible ~ .siege-arts .siege-art--trials {
  outline: 2px solid #fff;
  outline-offset: 2px;
}
.is-legacy .page-shell #siege-land-stadium:checked ~ .siege-lands .siege-land--stadium,
.is-legacy .page-shell #siege-land-trials:checked ~ .siege-lands .siege-land--trials {
  display: block;
}

/* Timeline with the battle date on top */
.is-legacy .page-shell .siege-time__main {
  display: grid;
  gap: 16px;
  min-width: 0;
}
.is-legacy .page-shell .siege-time__date {
  margin: 0;
  padding-left: 12px;
  border-left: 3px solid var(--k-gold);
  color: var(--k-gold2);
  font-family: var(--font-title);
  font-size: 18px;
  font-weight: 600;
}

/* The castle in one row of tiles */
.is-legacy .page-shell .siege-stats {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.is-legacy .page-shell .siege-stat {
  display: grid;
  align-content: center;
  gap: 4px;
  min-width: 0;
  padding: 16px 18px;
  border: 1px solid rgba(143, 111, 53, .5);
  background:
    radial-gradient(circle at 50% 0%, rgba(156, 28, 34, .3), transparent 70%),
    linear-gradient(180deg, var(--k-card2), var(--k-bg));
  text-align: center;
}
.is-legacy .page-shell .siege-stat strong {
  color: var(--k-gold2);
  font-family: var(--font-title);
  font-size: 26px;
  font-weight: 700;
  line-height: 1.1;
  overflow-wrap: anywhere;
}
.is-legacy .page-shell .siege-stat strong small {
  color: var(--k-gold);
  font-size: 13px;
}
.is-legacy .page-shell .siege-stat span {
  color: var(--k-mute);
  font-size: 12px;
}
.is-legacy .page-shell .siege-stat--owner {
  display: flex;
  align-items: center;
  gap: 14px;
  text-align: left;
}
.is-legacy .page-shell .siege-stat--owner .siege-card__crown {
  flex: none;
  width: 40px;
  height: 40px;
}
.is-legacy .page-shell .siege-stat--owner > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.is-legacy .page-shell .siege-stat--owner .siege-card__value {
  font-size: 22px;
  overflow-wrap: anywhere;
}

/* Your guild */
.is-legacy .page-shell .siege-you {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px 24px;
  padding: 20px 26px;
  border: 6px solid transparent;
  border-image: url(../images/card-frame-60.webp) 60 / 60px stretch;
  background:
    radial-gradient(60% 160% at 100% 50%, rgba(156, 28, 34, .45), transparent 70%) padding-box,
    var(--k-card) padding-box;
}
.is-legacy .page-shell .siege-you__text {
  display: grid;
  flex: 1 1 320px;
  gap: 8px;
  min-width: 0;
}
.is-legacy .page-shell .siege-you__text .siege-card__top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
}
.is-legacy .page-shell .siege-you__text .siege-note {
  margin: 0;
}
.is-legacy .page-shell .siege-you__act {
  display: grid;
  justify-items: end;
  gap: 10px;
}

/* Attackers as a ranking table */
.is-legacy .page-shell .siege-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 6px;
}
.is-legacy .page-shell .siege-table th {
  padding: 4px 14px;
  color: var(--k-mute);
  font-family: var(--font-title);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .08em;
  text-align: left;
  text-transform: uppercase;
}
.is-legacy .page-shell .siege-table td {
  padding: 12px 14px;
  border-top: 1px solid rgba(143, 111, 53, .3);
  border-bottom: 1px solid rgba(143, 111, 53, .3);
  background: rgba(20, 18, 21, .92);
  color: var(--k-text);
  vertical-align: middle;
}
.is-legacy .page-shell .siege-table td:first-child {
  width: 56px;
  border-left: 1px solid rgba(143, 111, 53, .3);
  background: linear-gradient(90deg, rgba(110, 18, 24, .45), rgba(20, 18, 21, .92));
  text-align: center;
}
.is-legacy .page-shell .siege-table td:last-child {
  border-right: 1px solid rgba(143, 111, 53, .3);
}
.is-legacy .page-shell .siege-table th:first-child {
  text-align: center;
}
.is-legacy .page-shell .siege-table .siege-table__top td {
  border-color: rgba(217, 169, 78, .55);
}
.is-legacy .page-shell .siege-table .siege-table__defender td {
  border-color: rgba(245, 212, 138, .7);
  background: rgba(40, 30, 18, .92);
}
.is-legacy .page-shell .siege-table .siege-table__defender td:first-child {
  background: linear-gradient(90deg, rgba(217, 169, 78, .3), rgba(40, 30, 18, .92));
}
.is-legacy .page-shell .siege-table .siege-table__defender svg {
  width: 26px;
  height: 26px;
  fill: var(--k-gold2);
  vertical-align: middle;
}
.is-legacy .page-shell .siege-table .siege-guild {
  display: block;
  font-size: 16px;
}
.is-legacy .page-shell .siege-table__role {
  color: var(--k-mute);
  font-size: 12px;
}
.is-legacy .page-shell .siege-table__narrow {
  display: none;
}
.is-legacy .page-shell .siege-table__score {
  width: 170px;
}
.is-legacy .page-shell .siege-table__score .siege-score {
  display: block;
  margin-bottom: 6px;
  font-size: 16px;
}
.is-legacy .page-shell .siege-rank {
  display: inline-grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border: 1px solid rgba(143, 111, 53, .6);
  border-radius: 50%;
  background: var(--k-bg);
  color: var(--k-text);
  font-size: 14px;
}
.is-legacy .page-shell .siege-rank--1 {
  border-color: #f5d48a;
  background: radial-gradient(circle at 35% 30%, #fbe7a8, #c79b44 60%, #7a5a1e);
  color: #2a1a05;
}
.is-legacy .page-shell .siege-rank--2 {
  border-color: #e3e6ea;
  background: radial-gradient(circle at 35% 30%, #ffffff, #b9c0c8 60%, #6b7178);
  color: #1d2024;
}
.is-legacy .page-shell .siege-rank--3 {
  border-color: #e0a674;
  background: radial-gradient(circle at 35% 30%, #f6c9a0, #b06e3c 60%, #5e3315);
  color: #24130a;
}

@media (max-width: 760px) {
  .is-legacy .page-shell .siege-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .is-legacy .page-shell .siege-stat--owner {
    grid-column: 1 / -1;
  }
  .is-legacy .page-shell .siege-stat strong {
    font-size: 20px;
  }
}
@media (max-width: 640px) {
  .is-legacy .page-shell .siege-arts {
    gap: 8px;
  }
  .is-legacy .page-shell .siege-art {
    height: 92px;
  }
  .is-legacy .page-shell .siege-art__name {
    bottom: 12px;
    font-size: 13px;
    letter-spacing: .04em;
    white-space: normal;
  }
  .is-legacy .page-shell .siege-art small {
    display: none;
  }
  .is-legacy .page-shell .siege-table__wide {
    display: none;
  }
  .is-legacy .page-shell .siege-table__narrow {
    display: inline;
  }
  .is-legacy .page-shell .siege-table td {
    padding: 10px 8px;
  }
  .is-legacy .page-shell .siege-table td:first-child {
    width: 40px;
  }
  .is-legacy .page-shell .siege-table__score {
    width: 84px;
  }
  .is-legacy .page-shell .siege-you {
    padding: 16px 14px;
  }
  .is-legacy .page-shell .siege-you__act {
    justify-items: stretch;
    width: 100%;
  }
  .is-legacy .page-shell .siege-stat {
    padding: 12px 8px;
  }
  .is-legacy .page-shell .siege-stat strong {
    font-size: 17px;
  }
  .is-legacy .page-shell .siege-stat span {
    font-size: 11px;
  }
}
/* The page grid takes the screen width, not the widest child (the table pushed it to 660px on a phone). */
.is-legacy .page-shell .siege-page {
  grid-template-columns: minmax(0, 1fr);
}
.is-legacy .page-shell .siege-time__date {
  overflow-wrap: anywhere;
}
/* The site gives tables a 620px floor for side scrolling; this one folds its columns instead. */
.is-legacy .page-shell .siege-board {
  grid-template-columns: minmax(0, 1fr);
}
.is-legacy .page-shell .siege-table {
  min-width: 0;
}