/* SwankageTCG /tcg directory — v699 data-first catalog + marketplace overview */
.sw-tcg-directory-v699 {
    --sw-v699-panel: #12191f;
    --sw-v699-panel-2: #0e151a;
    --sw-v699-border: rgba(166, 182, 194, .22);
    --sw-v699-muted: #93a6b3;
    --sw-v699-text: #f5f7f8;
    --sw-v699-accent: var(--sw-header-nav-accent, #ff6b18);
}

.sw-v699-directory-hero {
    margin-bottom: 14px;
}

.sw-v699-directory-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    padding-bottom: 28px;
}

.sw-v699-game-card {
    min-width: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    color: var(--sw-v699-text) !important;
    text-decoration: none !important;
    background: linear-gradient(180deg, rgba(20, 28, 34, .98), rgba(13, 20, 25, .98));
    border: 1px solid var(--sw-v699-border);
    border-radius: 12px;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .12);
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.sw-v699-game-card:hover,
.sw-v699-game-card:focus-visible {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--sw-v699-accent) 72%, transparent);
    box-shadow: 0 13px 30px rgba(0, 0, 0, .18), 0 0 18px color-mix(in srgb, var(--sw-v699-accent) 8%, transparent);
    outline: none;
}

.sw-v699-game-art {
    position: relative;
    min-height: 116px;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    padding: 14px 16px;
    background:
        radial-gradient(circle at 82% 28%, color-mix(in srgb, var(--sw-v699-accent) 22%, transparent), transparent 34%),
        linear-gradient(120deg, #151c22 0%, #1b232a 54%, #10161b 100%);
    border-bottom: 1px solid rgba(255,255,255,.06);
}

.sw-v699-game-art::before,
.sw-v699-game-art::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.sw-v699-game-art::before {
    width: 180px;
    height: 180px;
    right: -52px;
    top: -76px;
    border: 1px solid color-mix(in srgb, var(--sw-v699-accent) 32%, transparent);
    border-radius: 50%;
    box-shadow:
        0 0 0 24px color-mix(in srgb, var(--sw-v699-accent) 7%, transparent),
        0 0 0 52px color-mix(in srgb, var(--sw-v699-accent) 4%, transparent);
}

.sw-v699-game-art::after {
    inset: 0;
    background: linear-gradient(to top, rgba(5, 9, 12, .54), transparent 64%);
}

.sw-v699-art-pokemon {
    background-position: center 34% !important;
    background-size: cover !important;
}

.sw-v699-art-one-piece { background-color: #12202a; }
.sw-v699-art-magic { background-color: #211b1d; }
.sw-v699-art-yugioh { background-color: #171a24; }
.sw-v699-art-lorcana { background-color: #171928; }

.sw-v699-live-chip,
.sw-v699-art-mark {
    position: relative;
    z-index: 2;
}

.sw-v699-live-chip {
    align-self: flex-start;
    padding: 4px 7px;
    border: 1px solid color-mix(in srgb, var(--sw-v699-accent) 58%, transparent);
    border-radius: 5px;
    color: var(--sw-v699-accent);
    background: rgba(4, 8, 10, .78);
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .075em;
}

.sw-v699-art-mark {
    margin-left: auto;
    max-width: 68%;
    color: rgba(255,255,255,.18);
    font-size: clamp(24px, 3vw, 42px);
    font-weight: 900;
    line-height: .9;
    letter-spacing: .09em;
    text-align: right;
    text-transform: uppercase;
}

.sw-v699-game-body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    padding: 16px;
}

.sw-v699-game-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.sw-v699-section-kicker {
    display: block;
    margin-bottom: 4px;
    color: var(--sw-v699-accent);
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .075em;
}

.sw-v699-game-heading h2 {
    margin: 0;
    color: #fff;
    font-size: 21px;
    font-weight: 900;
    line-height: 1.15;
}

.sw-v699-browse-arrow {
    flex: 0 0 auto;
    color: var(--sw-v699-accent);
    font-size: 23px;
    font-weight: 800;
    transition: transform .16s ease;
}

.sw-v699-game-card:hover .sw-v699-browse-arrow,
.sw-v699-game-card:focus-visible .sw-v699-browse-arrow {
    transform: translateX(3px);
}

.sw-v699-description {
    min-height: 42px;
    margin: 8px 0 13px;
    color: #a8bac5;
    font-size: 11px;
    line-height: 1.55;
}

.sw-v699-stat-section {
    margin-top: 7px;
}

.sw-v699-stat-section-title {
    margin-bottom: 6px;
    color: #7f929f;
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .10em;
    text-transform: uppercase;
}

.sw-v699-catalog-stats,
.sw-v699-market-stats {
    display: grid;
    overflow: hidden;
    border: 1px solid rgba(156, 173, 185, .16);
    border-radius: 8px;
    background: rgba(5, 10, 13, .35);
}

.sw-v699-catalog-stats {
    grid-template-columns: .8fr .8fr 1.65fr;
}

.sw-v699-market-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.sw-v699-stat {
    min-width: 0;
    padding: 10px 9px;
    border-left: 1px solid rgba(156, 173, 185, .13);
}

.sw-v699-stat:first-child {
    border-left: 0;
}

.sw-v699-stat strong,
.sw-v699-stat span {
    display: block;
}

.sw-v699-stat strong {
    overflow: hidden;
    color: var(--sw-v699-accent);
    font-size: 16px;
    font-weight: 900;
    line-height: 1.12;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sw-v699-stat-wide strong {
    color: #e9eef1;
    font-size: 12px;
}

.sw-v699-stat span {
    margin-top: 4px;
    color: #8195a2;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.15;
}

.sw-v699-market-section {
    margin-top: 11px;
}

.sw-v699-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 15px;
    padding-top: 11px;
    border-top: 1px solid rgba(156, 173, 185, .13);
    color: #dce5ea;
    font-size: 11px;
    font-weight: 800;
}

.sw-v699-card-footer span:last-child {
    color: var(--sw-v699-accent);
    font-size: 16px;
}

@media (max-width: 1050px) {
    .sw-v699-directory-grid {
        grid-template-columns: 1fr;
    }

    .sw-v699-description {
        min-height: 0;
    }
}

@media (max-width: 620px) {
    .sw-v699-game-art {
        min-height: 92px;
        padding: 12px;
    }

    .sw-v699-game-body {
        padding: 13px;
    }

    .sw-v699-catalog-stats {
        grid-template-columns: repeat(2, 1fr);
    }

    .sw-v699-catalog-stats .sw-v699-stat-wide {
        grid-column: 1 / -1;
        border-left: 0;
        border-top: 1px solid rgba(156, 173, 185, .13);
    }

    .sw-v699-market-stats {
        grid-template-columns: repeat(2, 1fr);
    }

    .sw-v699-market-stats .sw-v699-stat:nth-child(3) {
        border-left: 0;
    }

    .sw-v699-market-stats .sw-v699-stat:nth-child(n+3) {
        border-top: 1px solid rgba(156, 173, 185, .13);
    }
}


/* -------------------------------------------------------------------------
   v704 — /tcg full-width stacked game directory
   Keep each catalog/marketplace panel at the site's standard content width
   and separate panels with a theme-aware fading rule.
   ------------------------------------------------------------------------- */
.sw-tcg-directory-v699 .sw-v699-directory-grid {
    display: block;
    padding-bottom: 28px;
}

.sw-tcg-directory-v699 .sw-v699-game-card {
    width: 100%;
    max-width: none;
}

.sw-v704-tcg-divider {
    position: relative;
    width: 100%;
    height: 1px;
    margin: 22px 0;
    overflow: visible;
    background: linear-gradient(
        90deg,
        transparent 0%,
        color-mix(in srgb, var(--sw-v699-accent) 18%, transparent) 10%,
        color-mix(in srgb, var(--sw-v699-accent) 62%, transparent) 28%,
        var(--sw-v699-accent) 50%,
        color-mix(in srgb, var(--sw-v699-accent) 62%, transparent) 72%,
        color-mix(in srgb, var(--sw-v699-accent) 18%, transparent) 90%,
        transparent 100%
    );
}

.sw-v704-tcg-divider::after {
    content: "";
    position: absolute;
    inset: -3px 12% -3px;
    pointer-events: none;
    background: linear-gradient(
        90deg,
        transparent,
        color-mix(in srgb, var(--sw-v699-accent) 10%, transparent) 35%,
        color-mix(in srgb, var(--sw-v699-accent) 18%, transparent) 50%,
        color-mix(in srgb, var(--sw-v699-accent) 10%, transparent) 65%,
        transparent
    );
    filter: blur(3px);
}

@media (max-width: 620px) {
    .sw-v704-tcg-divider {
        margin: 16px 0;
    }
}

/* -------------------------------------------------------------------------
   v706 — Pokémon /tcg directory wallpaper rotation
   Built directly on v704. Only the Pokémon top hero strip is affected.
   Each wallpaper is kept toward the right side so its focal subject sits
   behind/near the large POKÉMON wordmark rather than disappearing in a crop.
   ------------------------------------------------------------------------- */
.sw-v699-art-pokemon {
    --sw-v706-pokemon-wallpaper: none;
    --sw-v706-pokemon-wallpaper-x: 78%;
    --sw-v706-pokemon-wallpaper-y: 53%;
    --sw-v706-pokemon-wallpaper-size: cover;
    --sw-v706-pokemon-wallpaper-x-offset: 450px;
    --sw-v706-pokemon-wallpaper-y-offset: 0px;
    background: #11191f !important;
}

/* Pokémon uses a dedicated artwork layer so opacity never affects the panel UI. */
.sw-v699-art-pokemon::before,
.sw-v699-art-pokemon::after {
    display: none !important;
}

.sw-v718-pokemon-wallpaper-layer {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

/* v723: wallpaper opacity and gradient opacity are separated. */
.sw-v718-pokemon-wallpaper-layer::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: var(--sw-v706-pokemon-wallpaper);
    background-repeat: no-repeat;
    background-size: var(--sw-v706-pokemon-wallpaper-size);
    background-position: calc(var(--sw-v706-pokemon-wallpaper-x) + var(--sw-v706-pokemon-wallpaper-x-offset)) calc(var(--sw-v706-pokemon-wallpaper-y) + var(--sw-v706-pokemon-wallpaper-y-offset));
    opacity: .50;
}

/* Full-strength panel-color overlay hides the wallpaper's physical left edge. */
.sw-v718-pokemon-wallpaper-layer::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(
        90deg,
        #11191f 0%,
        #11191f calc(33% + 40px),
        rgba(17, 25, 31, .98) calc(42% + 40px),
        rgba(17, 25, 31, .82) calc(55% + 40px),
        rgba(17, 25, 31, .44) calc(73% + 40px),
        rgba(17, 25, 31, 0) 100%
    );
}


/* v726: Pokémon title matches the directory hero's text hierarchy + inset spacing. */
.sw-v725-pokemon-title {
    position: absolute;
    left: 26px;
    top: calc(50% + 10px);
    transform: translateY(-50%);
    z-index: 5;
    pointer-events: none;
}

.sw-v725-pokemon-title .sw-v699-section-kicker {
    margin: 0;
    color: var(--sw-v699-accent);
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.4px;
    text-transform: uppercase;
}

.sw-v725-pokemon-title h2 {
    margin: 5px 0 7px;
    color: var(--sw-v699-text, #f5f7f8);
    font-size: 32px;
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: -.7px;
}

.sw-v725-pokemon-body-heading {
    justify-content: flex-end;
}

/* v724: dedicated separator painted above wallpaper + fade layers. */
.sw-v724-pokemon-separator {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    z-index: 4;
    pointer-events: none;
    background: rgba(255, 255, 255, .06);
}

.sw-v706-pokemon-wallpaper-bulbasaur {
    --sw-v706-pokemon-wallpaper: url('../img/tcg/pokemon/directory/bulbasaur-directory-wallpaper-v1304.webp');
    --sw-v706-pokemon-wallpaper-x: 81%;
    --sw-v706-pokemon-wallpaper-y: 47%;
    --sw-v706-pokemon-wallpaper-y-offset: -25px;
}

.sw-v706-pokemon-wallpaper-umbreon {
    --sw-v706-pokemon-wallpaper: url('../img/tcg/pokemon/directory/umbreon-directory-wallpaper-v1304.webp');
    --sw-v706-pokemon-wallpaper-x: 77%;
    --sw-v706-pokemon-wallpaper-y: 51%;
    --sw-v706-pokemon-wallpaper-y-offset: -130px;
}

.sw-v706-pokemon-wallpaper-charizard {
    --sw-v706-pokemon-wallpaper: url('../img/tcg/pokemon/directory/charizard-directory-wallpaper-v1304.webp');
    --sw-v706-pokemon-wallpaper-x: 80%;
    --sw-v706-pokemon-wallpaper-y: 43%;
    --sw-v706-pokemon-wallpaper-y-offset: 25px;
}

@media (max-width: 760px) {
    .sw-v699-art-pokemon {
        --sw-v706-pokemon-wallpaper-x: 73%;
        --sw-v706-pokemon-wallpaper-y: 50%;
    }

    .sw-v706-pokemon-wallpaper-bulbasaur {
        --sw-v706-pokemon-wallpaper-x: 74%;
        --sw-v706-pokemon-wallpaper-y: 49%;
    }

    .sw-v706-pokemon-wallpaper-umbreon {
        --sw-v706-pokemon-wallpaper-x: 72%;
        --sw-v706-pokemon-wallpaper-y: 53%;
    }

    .sw-v706-pokemon-wallpaper-charizard {
        --sw-v706-pokemon-wallpaper-x: 75%;
        --sw-v706-pokemon-wallpaper-y: 45%;
    }
}


/* v729: Pokémon history block + neutral spacing divider. */
.sw-v729-pokemon-history {
    min-height: 0;
    margin: 0 0 13px;
    padding: 16px 0 18px;
    color: #a8bac5;
    line-height: 1.65;
    border-bottom: 1px solid rgba(166, 182, 194, .22);
}


/* -------------------------------------------------------------------------
   v730 — One Piece first-pass mirrors the finished Pokémon directory card.
   Artwork is reserved for the LEFT side; title sits on the RIGHT. The actual
   wallpaper URLs/position tuning will be added once the approved assets land.
   ------------------------------------------------------------------------- */
.sw-v699-art-one-piece {
    --sw-v730-onepiece-wallpaper: none;
    --sw-v730-onepiece-wallpaper-x: 0%;
    --sw-v730-onepiece-wallpaper-y: 50%;
    --sw-v730-onepiece-wallpaper-size: 72% auto;
    --sw-v730-onepiece-wallpaper-x-offset: 0px;
    --sw-v730-onepiece-wallpaper-y-offset: 0px;
    background: #11191f !important;
}

.sw-v699-art-one-piece::before,
.sw-v699-art-one-piece::after {
    display: none !important;
}

.sw-v730-onepiece-wallpaper-layer {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

.sw-v730-onepiece-wallpaper-layer::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: var(--sw-v730-onepiece-wallpaper);
    background-repeat: no-repeat;
    background-size: var(--sw-v730-onepiece-wallpaper-size);
    background-position: calc(var(--sw-v730-onepiece-wallpaper-x) + var(--sw-v730-onepiece-wallpaper-x-offset)) calc(var(--sw-v730-onepiece-wallpaper-y) + var(--sw-v730-onepiece-wallpaper-y-offset));
    opacity: .50;
}

/* Mirror of Pokémon's seam-safe fade: image stays left, panel color takes over right. */
.sw-v730-onepiece-wallpaper-layer::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(
        270deg,
        #11191f 0%,
        #11191f calc(33% + 40px),
        rgba(17, 25, 31, .98) calc(42% + 40px),
        rgba(17, 25, 31, .82) calc(55% + 40px),
        rgba(17, 25, 31, .44) calc(73% + 40px),
        rgba(17, 25, 31, 0) 100%
    );
}

.sw-v730-onepiece-title {
    position: absolute;
    right: 26px;
    top: calc(50% + 10px);
    transform: translateY(-50%);
    z-index: 5;
    pointer-events: none;
    text-align: right;
}

.sw-v730-onepiece-title .sw-v699-section-kicker {
    margin: 0;
    color: var(--sw-v699-accent);
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.4px;
    text-transform: uppercase;
}

.sw-v730-onepiece-title h2 {
    margin: 5px 0 7px;
    color: var(--sw-v699-text, #f5f7f8);
    font-size: 32px;
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: -.7px;
}

.sw-v730-onepiece-body-heading {
    justify-content: flex-start;
}

.sw-v730-onepiece-separator {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    z-index: 4;
    pointer-events: none;
    background: rgba(255, 255, 255, .06);
}

.sw-v730-onepiece-history {
    min-height: 0;
    margin: 0 0 13px;
    padding: 16px 0 18px;
    color: #a8bac5;
    line-height: 1.65;
    border-bottom: 1px solid rgba(166, 182, 194, .22);
}


/* -------------------------------------------------------------------------
   v731 — approved One Piece directory artwork rotation.
   These three banners were composed specifically for this left-art/right-copy
   layout, so they start with conservative focal positions and can be fine-
   tuned individually after the first browser pass if needed.
   ------------------------------------------------------------------------- */
.sw-v731-onepiece-wallpaper-dragon {
    --sw-v730-onepiece-wallpaper: url('../img/tcg/one-piece/directory/onepiece-dragon-directory-wallpaper-v1304.webp');
    --sw-v730-onepiece-wallpaper-x: 0%;
    --sw-v730-onepiece-wallpaper-y: calc(50% + 40px);
}

.sw-v731-onepiece-wallpaper-seaside {
    --sw-v730-onepiece-wallpaper: url('../img/tcg/one-piece/directory/onepiece-seaside-directory-wallpaper-v1304.webp');
    --sw-v730-onepiece-wallpaper-x: 0%;
    --sw-v730-onepiece-wallpaper-y: calc(43% + 40px);
}

.sw-v731-onepiece-wallpaper-battle {
    --sw-v730-onepiece-wallpaper: url('../img/tcg/one-piece/directory/onepiece-battle-directory-wallpaper-v1304.webp');
    --sw-v730-onepiece-wallpaper-x: 0%;
    --sw-v730-onepiece-wallpaper-y: 50%;
}

@media (max-width: 760px) {
    .sw-v699-art-one-piece {
        --sw-v730-onepiece-wallpaper-x: 0%;
        --sw-v730-onepiece-wallpaper-y: 50%;
        --sw-v730-onepiece-wallpaper-size: 92% auto;
        --sw-v730-onepiece-wallpaper-x-offset: 0px;
    }

    .sw-v730-onepiece-title {
        right: 18px;
    }
}


/* -------------------------------------------------------------------------
   v734 — theme-aware orbit accents for Pokémon + One Piece directory headers.
   Mirrors the original directory-card background effect: One Piece keeps the
   orbit on the right; Pokémon flips it to the left behind its title block.
   ------------------------------------------------------------------------- */
.sw-v734-theme-orbit {
    position: absolute;
    top: -76px;
    width: 180px;
    height: 180px;
    z-index: 1;
    pointer-events: none;
    border: 1px solid color-mix(in srgb, var(--sw-v699-accent) 32%, transparent);
    border-radius: 50%;
    box-shadow:
        0 0 0 24px color-mix(in srgb, var(--sw-v699-accent) 7%, transparent),
        0 0 0 52px color-mix(in srgb, var(--sw-v699-accent) 4%, transparent),
        0 0 42px color-mix(in srgb, var(--sw-v699-accent) 10%, transparent);
    opacity: .95;
}

.sw-v734-theme-orbit-right {
    right: -52px;
}

.sw-v734-theme-orbit-left {
    left: -52px;
}

/* Keep titles and separator line above the decorative orbit. */
.sw-v725-pokemon-title,
.sw-v730-onepiece-title {
    z-index: 5;
}

.sw-v724-pokemon-separator,
.sw-v730-onepiece-separator {
    z-index: 6;
}


/* -------------------------------------------------------------------------
   v736 — top-strip accent fade for Pokémon + One Piece only.
   Mirrors the generic Magic header treatment, but respects each custom layout:
   Pokémon fades from the LEFT/title side; One Piece fades from the RIGHT/title side.
   This is intentionally confined to the .sw-v699-game-art header strip and does
   not spill into the main stats/body panel.
   ------------------------------------------------------------------------- */
.sw-v699-art-pokemon::after,
.sw-v699-art-one-piece::after {
    display: block !important;
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    opacity: 1;
}

.sw-v699-art-pokemon::after {
    background:
        radial-gradient(circle at 12% 26%, color-mix(in srgb, var(--sw-v699-accent) 20%, transparent), transparent 34%),
        linear-gradient(90deg,
            color-mix(in srgb, var(--sw-v699-accent) 10%, transparent) 0%,
            color-mix(in srgb, var(--sw-v699-accent) 6%, transparent) 18%,
            color-mix(in srgb, var(--sw-v699-accent) 2%, transparent) 34%,
            transparent 52%);
    opacity: .76;
}

.sw-v699-art-one-piece::after {
    background:
        radial-gradient(circle at 88% 26%, color-mix(in srgb, var(--sw-v699-accent) 20%, transparent), transparent 34%),
        linear-gradient(270deg,
            color-mix(in srgb, var(--sw-v699-accent) 10%, transparent) 0%,
            color-mix(in srgb, var(--sw-v699-accent) 6%, transparent) 18%,
            color-mix(in srgb, var(--sw-v699-accent) 2%, transparent) 34%,
            transparent 52%);
    opacity: .76;
}

/* Keep the decorative orbit, title, and separator line above the new fade. */
.sw-v734-theme-orbit {
    z-index: 2;
}

.sw-v725-pokemon-title,
.sw-v730-onepiece-title {
    z-index: 5;
}

.sw-v724-pokemon-separator,
.sw-v730-onepiece-separator {
    z-index: 6;
}


/* v737 — lower One Piece top-strip accent fade to visually match the generic Magic header intensity. */


/* v738 — tone down the Pokémon top-strip accent fade to match One Piece / Magic intensity. */

/* -------------------------------------------------------------------------
   v739 — Magic: The Gathering finished directory treatment.
   Alternates the established layout: title on LEFT, four approved wallpapers
   on RIGHT, 50% artwork opacity, seam-safe fade, theme-aware orbit/accent,
   separator above artwork, history block, and no duplicate live-chip/arrow.
   ------------------------------------------------------------------------- */
.sw-v699-art-magic {
    --sw-v739-magic-wallpaper: none;
    --sw-v739-magic-wallpaper-x: 100%;
    --sw-v739-magic-wallpaper-y: 50%;
    --sw-v739-magic-wallpaper-size: 72% auto;
    --sw-v739-magic-wallpaper-x-offset: 1px;
    --sw-v739-magic-wallpaper-y-offset: 0px;
    background: #11191f !important;
}

.sw-v699-art-magic::before,
.sw-v699-art-magic::after {
    display: none !important;
}

.sw-v739-magic-wallpaper-layer {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

.sw-v739-magic-wallpaper-layer::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: var(--sw-v739-magic-wallpaper);
    background-repeat: no-repeat;
    background-size: var(--sw-v739-magic-wallpaper-size);
    background-position: calc(var(--sw-v739-magic-wallpaper-x) + var(--sw-v739-magic-wallpaper-x-offset)) calc(var(--sw-v739-magic-wallpaper-y) + var(--sw-v739-magic-wallpaper-y-offset));
    opacity: .50;
}

/* Same hard-edge-safe direction as Pokémon: panel color owns the left/title side. */
.sw-v739-magic-wallpaper-layer::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(
        90deg,
        #11191f 0%,
        #11191f calc(33% + 40px),
        rgba(17, 25, 31, .98) calc(42% + 40px),
        rgba(17, 25, 31, .82) calc(55% + 40px),
        rgba(17, 25, 31, .44) calc(73% + 40px),
        rgba(17, 25, 31, 0) 100%
    );
}

.sw-v739-magic-title {
    position: absolute;
    left: 26px;
    top: calc(50% + 10px);
    transform: translateY(-50%);
    z-index: 5;
    max-width: 46%;
    pointer-events: none;
}

.sw-v739-magic-title .sw-v699-section-kicker {
    margin: 0;
    color: var(--sw-v699-accent);
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.4px;
    text-transform: uppercase;
}

.sw-v739-magic-title h2 {
    margin: 5px 0 7px;
    color: var(--sw-v699-text, #f5f7f8);
    font-size: 32px;
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: -.7px;
}

.sw-v739-magic-body-heading {
    justify-content: flex-end;
}

.sw-v739-magic-separator {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    z-index: 6;
    pointer-events: none;
    background: rgba(255, 255, 255, .06);
}

.sw-v739-magic-history {
    min-height: 0;
    margin: 0 0 13px;
    padding: 16px 0 18px;
    color: #a8bac5;
    line-height: 1.65;
    border-bottom: 1px solid rgba(166, 182, 194, .22);
}

/* Theme-aware top-strip fade — intentionally confined to the Magic header. */
.sw-v699-art-magic::after {
    display: block !important;
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        radial-gradient(circle at 12% 26%, color-mix(in srgb, var(--sw-v699-accent) 20%, transparent), transparent 34%),
        linear-gradient(90deg,
            color-mix(in srgb, var(--sw-v699-accent) 10%, transparent) 0%,
            color-mix(in srgb, var(--sw-v699-accent) 6%, transparent) 18%,
            color-mix(in srgb, var(--sw-v699-accent) 2%, transparent) 34%,
            transparent 52%);
    opacity: .76;
}

.sw-v699-art-magic .sw-v734-theme-orbit {
    z-index: 2;
}

.sw-v739-magic-wallpaper-white-dragon {
    --sw-v739-magic-wallpaper: url('../img/tcg/magic/directory/magic-white-dragon-directory-wallpaper-v1304.webp');
    --sw-v739-magic-wallpaper-y-offset: -15px;
}

.sw-v739-magic-wallpaper-stormbound {
    --sw-v739-magic-wallpaper: url('../img/tcg/magic/directory/magic-stormbound-directory-wallpaper-v1304.webp');
    --sw-v739-magic-wallpaper-y-offset: 50px;
}

.sw-v739-magic-wallpaper-golden-dragon {
    --sw-v739-magic-wallpaper: url('../img/tcg/magic/directory/magic-golden-dragon-directory-wallpaper-v1304.webp');
    --sw-v739-magic-wallpaper-y-offset: 25px;
}

.sw-v739-magic-wallpaper-necromancer {
    --sw-v739-magic-wallpaper: url('../img/tcg/magic/directory/magic-necromancer-directory-wallpaper-v1304.webp');
    --sw-v739-magic-wallpaper-y-offset: 100px;
}

@media (max-width: 760px) {
    .sw-v699-art-magic {
        --sw-v739-magic-wallpaper-x: 100%;
        --sw-v739-magic-wallpaper-y: 50%;
        --sw-v739-magic-wallpaper-size: 92% auto;
    }

    .sw-v739-magic-title {
        left: 18px;
        max-width: 58%;
    }

    .sw-v739-magic-title h2 {
        font-size: 26px;
    }
}


/* -------------------------------------------------------------------------
   v741 — Yu-Gi-Oh! finished directory treatment.
   Alternates the established layout: title on RIGHT, four approved wallpapers
   on LEFT, 50% artwork opacity, seam-safe fade, theme-aware orbit/accent,
   separator above artwork, history block, and no duplicate live-chip/arrow.
   ------------------------------------------------------------------------- */
.sw-v699-art-yugioh {
    --sw-v741-yugioh-wallpaper: none;
    --sw-v741-yugioh-wallpaper-x: 0%;
    --sw-v741-yugioh-wallpaper-y: 50%;
    --sw-v741-yugioh-wallpaper-size: 72% auto;
    --sw-v741-yugioh-wallpaper-x-offset: 0px;
    --sw-v741-yugioh-wallpaper-y-offset: 0px;
    background: #11191f !important;
}

.sw-v699-art-yugioh::before,
.sw-v699-art-yugioh::after {
    display: none !important;
}

.sw-v741-yugioh-wallpaper-layer {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

.sw-v741-yugioh-wallpaper-layer::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: var(--sw-v741-yugioh-wallpaper);
    background-repeat: no-repeat;
    background-size: var(--sw-v741-yugioh-wallpaper-size);
    background-position: calc(var(--sw-v741-yugioh-wallpaper-x) + var(--sw-v741-yugioh-wallpaper-x-offset)) calc(var(--sw-v741-yugioh-wallpaper-y) + var(--sw-v741-yugioh-wallpaper-y-offset));
    opacity: .50;
}

/* Same hard-edge-safe direction as Pokémon: panel color owns the left/title side. */
.sw-v741-yugioh-wallpaper-layer::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(
        270deg,
        #11191f 0%,
        #11191f calc(33% + 40px),
        rgba(17, 25, 31, .98) calc(42% + 40px),
        rgba(17, 25, 31, .82) calc(55% + 40px),
        rgba(17, 25, 31, .44) calc(73% + 40px),
        rgba(17, 25, 31, 0) 100%
    );
}

.sw-v741-yugioh-title {
    position: absolute;
    right: 26px;
    text-align: right;
    top: calc(50% + 10px);
    transform: translateY(-50%);
    z-index: 5;
    max-width: 46%;
    pointer-events: none;
}

.sw-v741-yugioh-title .sw-v699-section-kicker {
    margin: 0;
    color: var(--sw-v699-accent);
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.4px;
    text-transform: uppercase;
}

.sw-v741-yugioh-title h2 {
    margin: 5px 0 7px;
    color: var(--sw-v699-text, #f5f7f8);
    font-size: 32px;
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: -.7px;
}

.sw-v741-yugioh-body-heading {
    justify-content: flex-start;
}

.sw-v741-yugioh-separator {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    z-index: 6;
    pointer-events: none;
    background: rgba(255, 255, 255, .06);
}

.sw-v741-yugioh-history {
    min-height: 0;
    margin: 0 0 13px;
    padding: 16px 0 18px;
    color: #a8bac5;
    line-height: 1.65;
    border-bottom: 1px solid rgba(166, 182, 194, .22);
}

/* Theme-aware top-strip fade — intentionally confined to the Yu-Gi-Oh! header. */
.sw-v699-art-yugioh::after {
    display: block !important;
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        radial-gradient(circle at 88% 26%, color-mix(in srgb, var(--sw-v699-accent) 20%, transparent), transparent 34%),
        linear-gradient(270deg,
            color-mix(in srgb, var(--sw-v699-accent) 10%, transparent) 0%,
            color-mix(in srgb, var(--sw-v699-accent) 6%, transparent) 18%,
            color-mix(in srgb, var(--sw-v699-accent) 2%, transparent) 34%,
            transparent 52%);
    opacity: .76;
}

.sw-v699-art-yugioh .sw-v734-theme-orbit {
    z-index: 2;
}

 .sw-v741-yugioh-shadow-dragon { --sw-v741-yugioh-wallpaper: url('../img/tcg/yugioh/directory/yugioh_shadow_dragon-v1304.webp'); --sw-v741-yugioh-wallpaper-y-offset: 50px; }
.sw-v741-yugioh-water-duelist { --sw-v741-yugioh-wallpaper: url('../img/tcg/yugioh/directory/yugioh_water_mage-v1304.webp'); --sw-v741-yugioh-wallpaper-y-offset: 35px; }
.sw-v741-yugioh-cosmic-dragon { --sw-v741-yugioh-wallpaper: url('../img/tcg/yugioh/directory/yugioh_celestial_dragon-v1304.webp'); --sw-v741-yugioh-wallpaper-y-offset: 50px; }
.sw-v741-yugioh-arcane-duelist { --sw-v741-yugioh-wallpaper: url('../img/tcg/yugioh/directory/yugioh_crystal_mage-v1304.webp'); --sw-v741-yugioh-wallpaper-y-offset: 25px; }

@media (max-width: 760px) {
    .sw-v699-art-yugioh {
        --sw-v741-yugioh-wallpaper-x: 0%;
        --sw-v741-yugioh-wallpaper-y: 50%;
        --sw-v741-yugioh-wallpaper-size: 92% auto;
    }

    .sw-v741-yugioh-title {
        right: 18px;
        max-width: 58%;
    }

    .sw-v741-yugioh-title h2 {
        font-size: 26px;
    }
}


/* -------------------------------------------------------------------------
   v746 — Disney Lorcana finished directory treatment.
   Alternates the established layout: title on LEFT, four approved wallpapers
   on RIGHT, 50% artwork opacity, seam-safe fade, theme-aware orbit/accent,
   separator above artwork, history block, and no duplicate live-chip/arrow.
   ------------------------------------------------------------------------- */
.sw-v699-art-lorcana {
    --sw-v746-lorcana-wallpaper: none;
    --sw-v746-lorcana-wallpaper-x: 100%;
    --sw-v746-lorcana-wallpaper-y: 50%;
    --sw-v746-lorcana-wallpaper-size: 72% auto;
    --sw-v746-lorcana-wallpaper-x-offset: 0px;
    --sw-v746-lorcana-wallpaper-y-offset: 0px;
    background: #11191f !important;
}

.sw-v699-art-lorcana::before,
.sw-v699-art-lorcana::after {
    display: none !important;
}

.sw-v746-lorcana-wallpaper-layer {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

.sw-v746-lorcana-wallpaper-layer::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: var(--sw-v746-lorcana-wallpaper);
    background-repeat: no-repeat;
    background-size: var(--sw-v746-lorcana-wallpaper-size);
    background-position: calc(var(--sw-v746-lorcana-wallpaper-x) + var(--sw-v746-lorcana-wallpaper-x-offset)) calc(var(--sw-v746-lorcana-wallpaper-y) + var(--sw-v746-lorcana-wallpaper-y-offset));
    opacity: .50;
}

/* Same hard-edge-safe direction as Pokémon: panel color owns the left/title side. */
.sw-v746-lorcana-wallpaper-layer::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(
        90deg,
        #11191f 0%,
        #11191f calc(33% + 40px),
        rgba(17, 25, 31, .98) calc(42% + 40px),
        rgba(17, 25, 31, .82) calc(55% + 40px),
        rgba(17, 25, 31, .44) calc(73% + 40px),
        rgba(17, 25, 31, 0) 100%
    );
}

.sw-v746-lorcana-title {
    position: absolute;
    left: 26px;
    top: calc(50% + 10px);
    transform: translateY(-50%);
    z-index: 5;
    max-width: 46%;
    pointer-events: none;
}

.sw-v746-lorcana-title .sw-v699-section-kicker {
    margin: 0;
    color: var(--sw-v699-accent);
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.4px;
    text-transform: uppercase;
}

.sw-v746-lorcana-title h2 {
    margin: 5px 0 7px;
    color: var(--sw-v699-text, #f5f7f8);
    font-size: 32px;
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: -.7px;
}

.sw-v746-lorcana-body-heading {
    justify-content: flex-end;
}

.sw-v746-lorcana-separator {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    z-index: 6;
    pointer-events: none;
    background: rgba(255, 255, 255, .06);
}

.sw-v746-lorcana-history {
    min-height: 0;
    margin: 0 0 13px;
    padding: 16px 0 18px;
    color: #a8bac5;
    line-height: 1.65;
    border-bottom: 1px solid rgba(166, 182, 194, .22);
}

/* Theme-aware top-strip fade — intentionally confined to the Lorcana header. */
.sw-v699-art-lorcana::after {
    display: block !important;
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        radial-gradient(circle at 12% 26%, color-mix(in srgb, var(--sw-v699-accent) 20%, transparent), transparent 34%),
        linear-gradient(90deg,
            color-mix(in srgb, var(--sw-v699-accent) 10%, transparent) 0%,
            color-mix(in srgb, var(--sw-v699-accent) 6%, transparent) 18%,
            color-mix(in srgb, var(--sw-v699-accent) 2%, transparent) 34%,
            transparent 52%);
    opacity: .76;
}

.sw-v699-art-lorcana .sw-v734-theme-orbit {
    z-index: 2;
}

/* Per-image offsets intentionally exposed for later visual tuning. */
.sw-v746-lorcana-wallpaper-jafar {
    --sw-v746-lorcana-wallpaper: url('../img/tcg/lorcana/directory/lorcana-jafar-v1304.webp');
    --sw-v746-lorcana-wallpaper-y: 12%;
    --sw-v746-lorcana-wallpaper-x-offset: 150px;
    --sw-v746-lorcana-wallpaper-y-offset: -75px;
}
.sw-v746-lorcana-wallpaper-stitch {
    --sw-v746-lorcana-wallpaper: url('../img/tcg/lorcana/directory/lorcana-stitch-v1304.webp');
    --sw-v746-lorcana-wallpaper-y: 14%;
    --sw-v746-lorcana-wallpaper-x-offset: 150px;
    --sw-v746-lorcana-wallpaper-y-offset: -100px;
}
.sw-v746-lorcana-wallpaper-minnie {
    --sw-v746-lorcana-wallpaper: url('../img/tcg/lorcana/directory/lorcana-minnie-v1304.webp');
    --sw-v746-lorcana-wallpaper-y: 30%;
    --sw-v746-lorcana-wallpaper-x-offset: 150px;
}
.sw-v746-lorcana-wallpaper-pooh {
    --sw-v746-lorcana-wallpaper: url('../img/tcg/lorcana/directory/lorcana-pooh.jpg');
    --sw-v746-lorcana-wallpaper-y: 8%;
    --sw-v746-lorcana-wallpaper-x-offset: 150px;
    --sw-v746-lorcana-wallpaper-y-offset: 15px;
}

@media (max-width: 760px) {
    .sw-v699-art-lorcana {
        --sw-v746-lorcana-wallpaper-x: 100%;
        --sw-v746-lorcana-wallpaper-y: 50%;
        --sw-v746-lorcana-wallpaper-size: 92% auto;
    }

    .sw-v746-lorcana-title {
        left: 18px;
        max-width: 58%;
    }

    .sw-v746-lorcana-title h2 {
        font-size: 26px;
    }
}


