/* ════════════════════════════════════════════════════════════════
   GOBLINS & GUNSLINGERS — AWARDS FINISH LAYER (2026-08)
   Loads LAST on every page, after main / frontier-redesign /
   site-polish / gng-2026 / frontier-press. Authoritative finish.

   Contract (see DESIGN.md): the cards are the interface. This layer
   ships the real-card object system (.gng-card-obj), the fanned-hand
   hero, the masthead pattern for content pages, letterpress rules &
   brass plates, and the sitewide material/typographic finish.
   Vocabulary: gng-* here, gx-* primitives remain valid.
   ════════════════════════════════════════════════════════════════ */

:root {
    /* Metals */
    --gng-tin: #b8b3a6;
    --gng-tin-deep: #797466;
    --gng-brass: #c9a25e;
    --gng-ember-hi: #e78354;
    --gng-ember: #c2572f;
    --gng-ember-deep: #7a3318;
    --gng-leaf: linear-gradient(180deg, #fff8e8 0%, #f3d488 48%, #cf9a3e 100%);
    --gng-ink-plate: linear-gradient(180deg, rgba(10, 7, 4, 0), rgba(8, 5, 3, 0.55) 34%, rgba(6, 4, 2, 0.92) 78%);
    --gng-paper: #efe3c8;
    --gng-paper-ink: #241a0e;
    /* Card object scale — override per context */
    --gco-w: 232px;
}

/* ── Global material corrections ───────────────────────────────── */

/* Poster face: the game's own display font. Poster lines only — never body. */
.gng-poster {
    font-family: 'Rye', 'Cinzel', serif;
    font-weight: 400;
    letter-spacing: 0.05em;
    color: var(--gx-gold-hi);
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.65), 0 6px 22px rgba(0, 0, 0, 0.5);
}

.gng-smallcaps {
    font-family: 'Inter', sans-serif;
    font-size: var(--gx-tiny);
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--gx-muted);
}

/* Standalone kicker (heroes outside .gng-masthead) */
.gng-kicker {
    display: block;
    font-family: 'Rye', 'Cinzel', serif;
    font-size: clamp(0.82rem, 1.4vw, 1rem);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--gx-gold);
    margin-bottom: 0.7rem;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.8);
}
html[data-theme="light"] .gng-kicker { color: #7d4f12; text-shadow: none; }

/* Letterpress rules — section openers that are not eyebrows. */
.gng-rule,
.gng-rule-double {
    border: 0;
    height: 1px;
    margin: 1.4rem 0;
    background: linear-gradient(90deg, transparent, var(--gx-hairline-strong) 18%, var(--gx-hairline-strong) 82%, transparent);
}
.gng-rule-double {
    height: 5px;
    background:
        linear-gradient(90deg, transparent, var(--gx-hairline-strong) 18%, var(--gx-hairline-strong) 82%, transparent) top / 100% 1px no-repeat,
        linear-gradient(90deg, transparent, var(--gx-hairline) 26%, var(--gx-hairline) 74%, transparent) bottom / 100% 1px no-repeat;
}

/* Brass plate — riveted stat strip. Replaces loose badge rows. */
.gng-plate {
    display: inline-flex;
    align-items: stretch;
    flex-wrap: wrap;
    border: 1px solid rgba(217, 172, 84, 0.42);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(66, 50, 24, 0.55), rgba(30, 22, 11, 0.72)),
        rgba(14, 10, 6, 0.6);
    box-shadow: inset 0 1px 0 rgba(255, 236, 190, 0.18), 0 10px 30px rgba(0, 0, 0, 0.45);
    overflow: hidden;
}
.gng-plate > * {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.15rem;
    padding: 0.7rem 1.25rem;
    position: relative;
}
.gng-plate > * + *::before {
    content: "";
    position: absolute;
    left: 0;
    top: 18%;
    bottom: 18%;
    width: 1px;
    background: linear-gradient(180deg, transparent, rgba(217, 172, 84, 0.4), transparent);
}
.gng-plate b {
    font-family: 'Cinzel', serif;
    font-weight: 800;
    font-size: 1.18rem;
    color: var(--gx-gold-hi);
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
}
.gng-plate span {
    font-family: 'Inter', sans-serif;
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--gx-muted);
}

/* Ticket-edge chip — perforated short label. */
.gng-ticket {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.4rem 1rem;
    font-family: 'Inter', sans-serif;
    font-size: var(--gx-tiny);
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--gx-ink-soft);
    background: rgba(28, 22, 15, 0.72);
    border: 1px solid var(--gx-hairline-strong);
    border-radius: 4px;
    -webkit-mask: radial-gradient(circle 3.5px at 0 50%, transparent 96%, #000) left / 51% 100% no-repeat,
                  radial-gradient(circle 3.5px at 100% 50%, transparent 96%, #000) right / 51% 100% no-repeat;
            mask: radial-gradient(circle 3.5px at 0 50%, transparent 96%, #000) left / 51% 100% no-repeat,
                  radial-gradient(circle 3.5px at 100% 50%, transparent 96%, #000) right / 51% 100% no-repeat;
}

/* ── The card object ───────────────────────────────────────────────
   A real Season-2 card: portrait art, rarity metal edge, name plate,
   mana/gold costs, ATK/DEF. Markup built by js/gng-cards.js:

   <figure class="gng-card-obj" data-rarity="rare" data-race="Goblin">
     <span class="gco-frame"></span>
     <img class="gco-art" …>
     <span class="gco-scrim"></span>
     <span class="gco-cost gco-mana">3</span>
     <span class="gco-cost gco-gold">2</span>
     <figcaption class="gco-name">Kaboom Kid</figcaption>
     <span class="gco-type">Goblin · Creature</span>
     <span class="gco-stat gco-atk">4</span>
     <span class="gco-stat gco-def">3</span>
     <span class="gco-foil"></span>
   </figure>
   ──────────────────────────────────────────────────────────────── */

.gng-card-obj {
    position: relative;
    width: var(--gco-w);
    aspect-ratio: 5 / 7;
    margin: 0;
    border-radius: calc(var(--gco-w) * 0.055);
    background: #0c0906;
    box-shadow:
        0 calc(var(--gco-w) * 0.06) calc(var(--gco-w) * 0.16) rgba(0, 0, 0, 0.55),
        0 2px 8px rgba(0, 0, 0, 0.5);
    transform-style: preserve-3d;
    isolation: isolate;
    overflow: hidden;
    font-size: calc(var(--gco-w) / 14.5);  /* everything inside scales in em */
}

/* Rarity metal edge */
.gng-card-obj .gco-frame {
    position: absolute;
    inset: 0;
    z-index: 4;
    pointer-events: none;
    border-radius: inherit;
    padding: calc(var(--gco-w) * 0.018);
    background: linear-gradient(160deg, var(--gng-tin) 0%, #6f6a5e 38%, #98937f 62%, #55503f 100%);
    -webkit-mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
            mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
}
.gng-card-obj[data-rarity="uncommon"] .gco-frame {
    background: linear-gradient(160deg, #e3c084 0%, #8a6a34 40%, #d3ab68 60%, #6d5124 100%);
}
.gng-card-obj[data-rarity="rare"] .gco-frame {
    background: linear-gradient(160deg, #ffe9ae 0%, var(--gx-gold) 36%, #8a6423 55%, var(--gx-gold-hi) 78%, #a87c2e 100%);
}
.gng-card-obj[data-rarity="legendary"] .gco-frame {
    background: linear-gradient(160deg, #ffedb0 0%, var(--gx-gold-hi) 30%, var(--gng-ember-hi) 52%, var(--gx-gold) 72%, var(--gng-ember) 100%);
}

.gng-card-obj .gco-art {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Ink scrim carrying the text block */
.gng-card-obj .gco-scrim {
    position: absolute;
    inset: 0;
    z-index: 2;
    background: var(--gng-ink-plate);
    pointer-events: none;
}

.gng-card-obj .gco-cost {
    position: absolute;
    top: 0.55em;
    z-index: 3;
    display: grid;
    place-items: center;
    width: 2em;
    height: 2em;
    border-radius: 50%;
    font-family: 'Cinzel', serif;
    font-weight: 800;
    font-size: 1.05em;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
}
.gng-card-obj .gco-mana {
    left: 0.55em;
    background: radial-gradient(circle at 32% 28%, #c7a6ff, #8b64d7 58%, #4a2f86);
    box-shadow: 0 0 0 1.5px rgba(199, 166, 255, 0.55), 0 2px 8px rgba(0, 0, 0, 0.6);
}
.gng-card-obj .gco-gold {
    right: 0.55em;
    color: #241703;
    text-shadow: 0 1px 0 rgba(255, 240, 200, 0.5);
    background: radial-gradient(circle at 32% 28%, #ffe9ae, var(--gx-gold) 58%, var(--gx-gold-deep));
    box-shadow: 0 0 0 1.5px rgba(255, 233, 174, 0.55), 0 2px 8px rgba(0, 0, 0, 0.6);
}
.gng-card-obj .gco-gold[hidden] { display: none; }

.gng-card-obj .gco-name {
    position: absolute;
    z-index: 3;
    left: 0.7em;
    right: 0.7em;
    bottom: 2.9em;
    font-family: 'Cinzel', serif;
    font-weight: 700;
    font-size: 0.98em;
    line-height: 1.15;
    color: #f6ecd6;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
    text-wrap: balance;
}
.gng-card-obj .gco-type {
    position: absolute;
    z-index: 3;
    left: 0.72em;
    right: 0.72em;
    bottom: 1.75em;
    font-family: 'Inter', sans-serif;
    font-size: 0.62em;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(217, 203, 171, 0.85);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9);
}

.gng-card-obj .gco-stat {
    position: absolute;
    z-index: 3;
    bottom: 0.5em;
    display: grid;
    place-items: center;
    min-width: 1.9em;
    height: 1.9em;
    padding: 0 0.4em;
    border-radius: 0.55em;
    font-family: 'Cinzel', serif;
    font-weight: 800;
    font-size: 0.95em;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.75);
}
.gng-card-obj .gco-atk {
    left: 0.55em;
    background: linear-gradient(160deg, var(--gng-ember-hi), var(--gng-ember) 60%, var(--gng-ember-deep));
    box-shadow: inset 0 1px 0 rgba(255, 220, 190, 0.4), 0 2px 6px rgba(0, 0, 0, 0.55);
}
.gng-card-obj .gco-def {
    right: 0.55em;
    background: linear-gradient(160deg, #9fb7c9, #5a7387 60%, #33454f);
    box-shadow: inset 0 1px 0 rgba(230, 240, 250, 0.4), 0 2px 6px rgba(0, 0, 0, 0.55);
}
.gng-card-obj[data-type="Spell"] .gco-stat,
.gng-card-obj[data-type="Item"] .gco-stat { display: none; }

/* Legendary foil — a single slow light sweep, motion-gated. */
.gng-card-obj .gco-foil {
    position: absolute;
    inset: 0;
    z-index: 5;
    pointer-events: none;
    border-radius: inherit;
    opacity: 0;
}
.gng-card-obj[data-rarity="legendary"] .gco-foil {
    opacity: 1;
    background: linear-gradient(115deg, transparent 32%, rgba(255, 236, 190, 0.16) 46%, rgba(231, 131, 84, 0.14) 52%, transparent 66%);
    background-size: 260% 100%;
    background-position: 120% 0;
    mix-blend-mode: screen;
}
body.gx-motion .gng-card-obj[data-rarity="legendary"] .gco-foil {
    animation: gco-foil-sweep 6.5s var(--gx-ease) infinite;
}
@keyframes gco-foil-sweep {
    0%, 55% { background-position: 120% 0; }
    85%, 100% { background-position: -60% 0; }
}

/* Interactive hover — fine pointers only */
@media (hover: hover) and (pointer: fine) {
    .gng-card-obj {
        transition: transform 0.35s var(--gx-ease), box-shadow 0.35s var(--gx-ease);
    }
    .gng-card-obj.is-tilting { transition: transform 0.06s linear, box-shadow 0.3s var(--gx-ease); }
    .gng-card-obj:hover {
        box-shadow:
            0 calc(var(--gco-w) * 0.11) calc(var(--gco-w) * 0.24) rgba(0, 0, 0, 0.6),
            0 0 calc(var(--gco-w) * 0.16) rgba(217, 172, 84, 0.22);
    }
}

/* Frame-only fallback (art missing / preview): give the face a card-back. */
.gng-card-obj.gco-noart {
    background:
        radial-gradient(120% 90% at 50% 0%, rgba(217, 172, 84, 0.16), transparent 55%),
        repeating-linear-gradient(45deg, #171008 0 10px, #120c06 10px 20px);
}
.gng-card-obj.gco-noart .gco-name { bottom: 2.9em; }

/* ── The fanned hand ───────────────────────────────────────────── */

.gng-fan {
    position: relative;
    height: calc(var(--gco-w) * 1.52);
    perspective: 1200px;
    pointer-events: none; /* cards re-enable */
}
.gng-fan .gng-card-obj {
    position: absolute;
    left: 50%;
    bottom: 0;
    pointer-events: auto;
    transform-origin: 50% 118%;
    transform: translateX(calc(-50% + var(--fan-x, 0px)))
               rotate(var(--fan-rot, 0deg))
               translateY(var(--fan-lift, 0px));
}
/* A held hand: center card leads, neighbours tuck under it. */
.gng-fan .gng-card-obj:nth-child(1) { --fan-rot: -13deg; --fan-x: calc(var(--gco-w) * -0.72); z-index: 1; }
.gng-fan .gng-card-obj:nth-child(2) { --fan-rot: -6.5deg; --fan-x: calc(var(--gco-w) * -0.37); z-index: 2; }
.gng-fan .gng-card-obj:nth-child(3) { --fan-rot: 0deg;   --fan-x: 0px; z-index: 5; --fan-lift: -8px; }
.gng-fan .gng-card-obj:nth-child(4) { --fan-rot: 6.5deg; --fan-x: calc(var(--gco-w) * 0.37); z-index: 4; }
.gng-fan .gng-card-obj:nth-child(5) { --fan-rot: 13deg;  --fan-x: calc(var(--gco-w) * 0.72); z-index: 3; }

@media (hover: hover) and (pointer: fine) {
    .gng-fan .gng-card-obj:hover {
        --fan-lift: -26px;
        z-index: 9;
    }
}

/* Deal-in: cards rise from below the table edge, staggered. */
body.gx-motion .gng-fan.gng-deal .gng-card-obj {
    animation: gco-deal 0.9s var(--gx-ease) both;
    animation-delay: calc(var(--deal-i, 0) * 0.09s + 0.15s);
}
@keyframes gco-deal {
    from {
        transform: translateX(calc(-50% + var(--fan-x, 0px) * 0.3))
                   rotate(calc(var(--fan-rot, 0deg) * 0.3)) translateY(46%);
        opacity: 0;
    }
    to {
        transform: translateX(calc(-50% + var(--fan-x, 0px)))
                   rotate(var(--fan-rot, 0deg)) translateY(var(--fan-lift, 0px));
        opacity: 1;
    }
}

/* Row layout (factions, showcase): plain inline card row. */
.gng-card-row {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(1rem, 2.4vw, 1.8rem);
    justify-content: center;
}

/* ── Masthead — content-page opener ────────────────────────────── */

.gng-masthead {
    position: relative;
    padding: calc(68px + clamp(2.6rem, 6vw, 4.6rem)) 0 clamp(2rem, 4.5vw, 3.2rem);
    overflow: hidden;
    isolation: isolate;
    border-bottom: 1px solid var(--gx-hairline);
}
.gng-masthead-bg {
    position: absolute;
    inset: 0;
    z-index: -2;
}
.gng-masthead-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 32%;
}
.gng-masthead-scrim {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(7, 5, 3, 0.78), rgba(7, 5, 3, 0.5) 45%, var(--gx-bg-0) 100%);
}
.gng-masthead .gng-kicker {
    display: block;
    font-family: 'Rye', 'Cinzel', serif;
    font-size: clamp(0.82rem, 1.4vw, 1rem);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--gx-gold);
    margin-bottom: 0.7rem;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.8);
}
.gng-masthead h1 {
    font-size: var(--gx-display);
    font-weight: 800;
    line-height: 1.08;
    text-wrap: balance;
    max-width: 22ch;
    text-shadow: 0 4px 30px rgba(0, 0, 0, 0.75);
}
.gng-masthead .gx-lead { text-shadow: 0 2px 16px rgba(0, 0, 0, 0.8); }
.gng-masthead .gng-rule-double { margin: 1.5rem 0 0; }

/* ── Launch stage finish (/play + /outpost) ────────────────────── */

.play-stage {
    box-shadow:
        0 40px 110px rgba(0, 0, 0, 0.65),
        0 0 0 1px rgba(217, 172, 84, 0.35),
        0 0 70px rgba(217, 172, 84, 0.14);
}
.play-stage:not(.is-live)::after {
    /* brass proscenium rail */
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    border-radius: inherit;
    padding: 3px;
    background: linear-gradient(180deg, rgba(243, 207, 117, 0.65), rgba(168, 124, 46, 0.25) 30%, rgba(120, 86, 30, 0.4) 85%, rgba(243, 207, 117, 0.5));
    -webkit-mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
            mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
}
.play-launch-btn {
    position: relative;
    font-family: 'Rye', 'Cinzel', serif;
    font-weight: 400;
    border-radius: 14px;
    border-width: 2px;
    padding: 0.9em 2.4em;
}
.play-launch-btn::before {
    content: "★";
    margin-right: 0.55em;
    font-size: 0.85em;
    vertical-align: 0.08em;
}
body.gx-motion .play-poster .play-launch-btn {
    animation: gng-btn-breathe 3.2s ease-in-out infinite;
}
@keyframes gng-btn-breathe {
    0%, 100% { box-shadow: 0 10px 34px rgba(0, 0, 0, 0.6), 0 0 30px rgba(217, 172, 84, 0.35); }
    50% { box-shadow: 0 10px 34px rgba(0, 0, 0, 0.6), 0 0 52px rgba(217, 172, 84, 0.55); }
}
.play-loader { z-index: 4; }
.play-loader-title { font-family: 'Rye', 'Cinzel', serif; font-weight: 400; }

/* ── Sections, bands, rhythm ───────────────────────────────────── */

.gng-band {
    background: var(--gx-bg-1);
    border-block: 1px solid var(--gx-hairline);
}
.gng-band-ember {
    position: relative;
    background:
        radial-gradient(900px 420px at 78% 0%, rgba(194, 87, 47, 0.16), transparent 65%),
        radial-gradient(700px 380px at 12% 100%, rgba(217, 172, 84, 0.08), transparent 70%),
        var(--gx-bg-1);
    border-block: 1px solid rgba(194, 87, 47, 0.24);
}

/* Section head lockup: rule + centered smallcaps + title. */
.gng-sechead {
    display: grid;
    justify-items: center;
    text-align: center;
    gap: 0.55rem;
    margin-bottom: clamp(1.6rem, 3.5vw, 2.6rem);
}
.gng-sechead .gng-smallcaps {
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
    color: var(--gx-gold);
}
.gng-sechead .gng-smallcaps::before,
.gng-sechead .gng-smallcaps::after {
    content: "";
    width: 34px;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--gx-hairline-strong));
}
.gng-sechead .gng-smallcaps::after {
    background: linear-gradient(90deg, var(--gx-hairline-strong), transparent);
}
.gng-sechead h2 { font-size: var(--gx-h2); line-height: 1.15; text-wrap: balance; }
.gng-sechead .gx-section-sub { margin-inline: auto; }

/* ── Nav & footer finish ───────────────────────────────────────── */

.main-nav {
    border-bottom-color: rgba(217, 172, 84, 0.3);
}
.main-nav::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 1px;
    background: linear-gradient(90deg, transparent 4%, rgba(243, 207, 117, 0.55) 50%, transparent 96%);
    pointer-events: none;
}
.nav-logo-mana-icon {
    font-family: 'Rye', 'Cinzel', serif;
    font-size: 0.9rem;
}

.site-footer-v2 .footer-factions {
    display: flex;
    align-items: baseline;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 1.1rem 0;
    border-top: 1px solid rgba(217, 172, 84, 0.1);
}
.footer-factions-label {
    font-family: 'Inter', sans-serif;
    font-size: var(--gx-tiny);
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--gx-gold);
}
.footer-factions-list { display: flex; flex-wrap: wrap; gap: 0.2rem 1.1rem; }
.footer-factions-list a {
    color: var(--gx-muted);
    font-size: var(--gx-small);
    text-decoration: none;
}
.footer-factions-list a:hover { color: var(--gx-gold-hi); }
.footer-col-heading {
    font-family: 'Inter', sans-serif;
    font-size: var(--gx-tiny);
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--gx-gold);
    margin-bottom: 1rem;
}

/* ── Article template (blog posts, legal) ──────────────────────── */

.gng-article {
    max-width: 72ch;
    margin-inline: auto;
}
.gng-article > p:first-of-type::first-letter {
    font-family: 'Rye', 'Cinzel', serif;
    font-size: 3.1em;
    line-height: 0.82;
    float: left;
    padding: 0.08em 0.14em 0 0;
    color: var(--gx-gold);
}
.gng-article h2 {
    margin-top: 2.2em;
    padding-top: 1.1em;
    border-top: 1px solid var(--gx-hairline);
    font-size: var(--gx-h3);
}
.gng-article blockquote {
    margin: 1.6em 0;
    padding: 0.2em 0 0.2em 1.2em;
    border-left: 1px solid var(--gx-gold);
    color: var(--gx-ink-soft);
    font-style: italic;
}

/* ── Operate surfaces (admin, profile, auth) shared finish ─────── */

.gng-app-panel {
    background: var(--gx-panel-solid);
    border: 1px solid var(--gx-hairline);
    border-radius: var(--gx-radius-lg);
    box-shadow: var(--gx-shadow-sm);
}
.gng-field-error {
    color: #f0a384;
    font-size: var(--gx-small);
}
input:user-invalid, textarea:user-invalid {
    border-color: rgba(212, 84, 62, 0.65);
}

/* ── Accessibility & motion hygiene ────────────────────────────── */

@media (hover: none) and (pointer: coarse) {
    .gng-fan { perspective: none; }
    body.gx-motion .gng-card-obj[data-rarity="legendary"] .gco-foil { animation: none; }
    body.gx-motion .play-poster .play-launch-btn { animation: none; }
}

@media (prefers-reduced-motion: reduce) {
    body.gx-motion .gng-fan.gng-deal .gng-card-obj { animation: none; opacity: 1; }
    .gng-card-obj .gco-foil { animation: none !important; }
    .play-poster .play-launch-btn { animation: none !important; }
}

/* Fan degrades to a tidy row on narrow screens (cards stay legible). */
@media (max-width: 720px) {
    :root { --gco-w: 158px; }
    .gng-fan { height: calc(var(--gco-w) * 1.4); }
    .gng-fan .gng-card-obj:nth-child(1) { --fan-rot: -14deg; }
    .gng-fan .gng-card-obj:nth-child(5) { --fan-rot: 14deg; }
    .gng-plate > * { padding: 0.55rem 0.85rem; }
    .gng-plate b { font-size: 1rem; }
}

/* ── Light theme ───────────────────────────────────────────────── */

html[data-theme="light"] .gng-poster { color: #7d4f12; text-shadow: none; }
html[data-theme="light"] .gng-smallcaps { color: #6b5a3d; }
html[data-theme="light"] .gng-sechead .gng-smallcaps { color: #7d4f12; }
html[data-theme="light"] .gng-plate {
    background: linear-gradient(180deg, rgba(255, 247, 228, 0.92), rgba(240, 226, 196, 0.92));
    border-color: rgba(140, 100, 40, 0.34);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), 0 8px 22px rgba(90, 66, 28, 0.14);
}
html[data-theme="light"] .gng-plate b { color: #7d4f12; }
html[data-theme="light"] .gng-plate span { color: #6b5a3d; }
html[data-theme="light"] .gng-ticket {
    color: #4d3d24;
    background: rgba(255, 250, 238, 0.8);
    border-color: rgba(140, 100, 40, 0.3);
}
html[data-theme="light"] .gng-band { background: rgba(240, 229, 205, 0.55); }
html[data-theme="light"] .gng-band-ember {
    background:
        radial-gradient(900px 420px at 78% 0%, rgba(194, 87, 47, 0.12), transparent 65%),
        rgba(240, 229, 205, 0.55);
}
html[data-theme="light"] .gng-masthead-scrim {
    background: linear-gradient(180deg, rgba(28, 19, 8, 0.6), rgba(28, 19, 8, 0.34) 45%, #f1e6cf 100%);
}
html[data-theme="light"] .gng-masthead h1,
html[data-theme="light"] .gng-masthead .gx-lead { color: #fff8ea; }
html[data-theme="light"] .gng-masthead .gng-kicker { color: #f3cf75; }
html[data-theme="light"] .gng-article > p:first-of-type::first-letter { color: #7d4f12; }
html[data-theme="light"] .gng-rule,
html[data-theme="light"] .gng-rule-double {
    background-color: transparent;
}
html[data-theme="light"] .gng-app-panel {
    background: rgba(255, 250, 238, 0.92);
    border-color: rgba(140, 100, 40, 0.24);
}
/* Card objects are printed matter — identical in both themes. */

/* ════════════════════════════════════════════════════════════════
   PARITY BLOCK — pages that do not load frontier-press.css
   (blog posts, /outpost, app shells) need its two load-bearing
   fixes. These rules mirror frontier-press.css exactly, so pages
   that load both apply them twice, harmlessly.
   ════════════════════════════════════════════════════════════════ */

/* 1. Content visibility: the scroll-reveal systems must never leave
      sections at opacity 0 (the live /outpost feature cards did). */
.gx-scroll-reveal,
.gx-fade-up,
.reveal,
.gx-reveal,
.gx-stagger,
.gx-stagger > * {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    animation: none !important;
}

/* 2. The shared nav's "More" disclosure (site-nav.js injects it on
      every #navLinks; only frontier-press.css styled it). */
.fp-nav-more { position: relative; }
.fp-nav-more > button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0.45rem 0.7rem;
    background: none;
    border: 0;
    font-family: 'Inter', sans-serif;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gx-ink-soft);
    cursor: pointer;
}
.fp-nav-more > button:hover,
.fp-nav-more > button.active { color: var(--gx-gold-hi); }
.fp-nav-more > button::after {
    content: '';
    width: 0; height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid currentColor;
    opacity: 0.7;
}
.fp-nav-more-panel {
    position: absolute;
    top: calc(100% + 12px);
    right: 0;
    min-width: 210px;
    display: none;
    flex-direction: column;
    padding: 6px;
    background: var(--gx-panel-solid, #161009);
    border: 1px solid var(--gx-hairline-strong);
    border-radius: var(--gx-radius);
    box-shadow: var(--gx-shadow);
    z-index: 60;
}
.fp-nav-more[data-open="true"] .fp-nav-more-panel { display: flex; }
.fp-nav-more-panel a {
    padding: 0.7rem 0.8rem;
    min-height: 44px;
    display: flex;
    align-items: center;
    border-radius: var(--gx-radius-sm);
    white-space: nowrap;
}
.fp-nav-more-panel a:hover { background: rgba(217, 172, 84, 0.1); color: var(--gx-gold-hi); }
@media (max-width: 1180px) {
    .fp-nav-more { position: static; width: 100%; }
    .fp-nav-more > button { display: none; }
    .fp-nav-more-panel {
        position: static;
        display: flex;
        min-width: 0;
        border: 0;
        box-shadow: none;
        padding: 0;
        background: none;
    }
}

/* 3. Launch-page heroes sit under the fixed 68px nav without this.
      !important: the pages' inline <style> shorthand loads after us. */
main .play-hero { padding-top: calc(68px + clamp(2.4rem, 5vw, 4rem)) !important; }