/* Shared gameplay surface for the post-restore pages.
   Goal: match the ornate framed screenshots while keeping one reusable system. */

html body main.approved-gameplay-page {
    --fsb-gameplay-page-width: 1860px;
    --fsb-gameplay-frame: url("/assets/img/fcsb/ui/bboard.webp");
    --fsb-gameplay-panel: rgba(2, 6, 9, .88);
    --fsb-gameplay-panel-soft: rgba(5, 8, 12, .76);
    --fsb-gameplay-line: rgba(214, 166, 62, .32);
    --fsb-gameplay-line-strong: rgba(232, 196, 111, .56);
    --fsb-gameplay-gold: #f4d179;
    --fsb-gameplay-copy: #ddd2bc;
    --fsb-gameplay-muted: #a69682;
    --fsb-gameplay-shadow: 0 22px 58px rgba(0, 0, 0, .36);
    width: min(var(--fsb-gameplay-page-width), calc(100% - 36px)) !important;
    max-width: var(--fsb-gameplay-page-width) !important;
    margin: 0 auto !important;
    padding-top: 8px !important;
    box-sizing: border-box !important;
}

html body main.approved-gameplay-page > section {
    width: 100% !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

html body main.approved-gameplay-page::before {
    content: "" !important;
    position: fixed !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
        radial-gradient(circle at 50% 0, rgba(96, 33, 142, .08), transparent 28rem),
        radial-gradient(circle at 16% 12%, rgba(189, 104, 29, .08), transparent 20rem),
        radial-gradient(circle at 84% 18%, rgba(34, 120, 255, .05), transparent 20rem);
    opacity: .95 !important;
    mask-image: linear-gradient(180deg, black 0%, black 70%, transparent 100%);
}

html body main.approved-gameplay-page .gameplay-hero {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 18px !important;
    align-items: start !important;
    margin: 0 auto 4px !important;
    padding: 8px 12px 6px !important;
    background: transparent !important;
}

html body main.approved-gameplay-page .gameplay-hero-copy {
    min-width: 0 !important;
    padding-top: 8px !important;
}

html body main.approved-gameplay-page .gameplay-hero h1 {
    margin: 0 !important;
    color: var(--fsb-gameplay-gold) !important;
    font-family: var(--serif, Georgia, "Times New Roman", serif) !important;
    font-size: clamp(3.45rem, 4.4vw, 4.8rem) !important;
    font-weight: 500 !important;
    line-height: .96 !important;
    letter-spacing: -.025em !important;
}

html body main.approved-gameplay-page .gameplay-hero p {
    width: min(860px, 100%) !important;
    margin: 8px 0 0 !important;
    color: var(--fsb-gameplay-copy) !important;
    font-size: clamp(.98rem, 1.05vw, 1.12rem) !important;
    line-height: 1.55 !important;
}

html body main.approved-gameplay-page .gameplay-hero-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin-top: 18px !important;
    align-items: center !important;
}

html body main.approved-gameplay-page .gameplay-hero-side {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    min-width: 180px !important;
    padding-top: 4px !important;
}

html body main.approved-gameplay-page .gameplay-hero-side .gameplay-icon-stack {
    display: grid !important;
    gap: 16px !important;
    justify-items: end !important;
}

html body main.approved-gameplay-page .gameplay-hero-side .gameplay-icon-stack img {
    width: 96px !important;
    height: auto !important;
    object-fit: contain !important;
    filter: drop-shadow(0 12px 24px rgba(0, 0, 0, .48));
}

html body main.approved-gameplay-page .gameplay-hero-side .gameplay-hero-actions {
    margin-top: 0 !important;
    justify-content: flex-end !important;
}

html body main.approved-gameplay-page .gameplay-button,
html body main.approved-gameplay-page button.gameplay-button {
    display: inline-flex !important;
    align-items: center !important;
    gap: 9px !important;
    padding: 8px 13px !important;
    min-height: 38px !important;
    border: 1px solid rgba(230, 185, 93, .36) !important;
    border-radius: 7px !important;
    background: rgba(5, 7, 8, .76) !important;
    color: inherit !important;
    font-family: var(--serif, Georgia, "Times New Roman", serif) !important;
    font-size: 1rem !important;
    letter-spacing: .02em !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease, color .18s ease;
}

html body main.approved-gameplay-page .gameplay-button:hover,
html body main.approved-gameplay-page .gameplay-button:focus-visible,
html body main.approved-gameplay-page button.gameplay-button:hover,
html body main.approved-gameplay-page button.gameplay-button:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(255, 217, 130, .72) !important;
    background: rgba(14, 9, 18, .94) !important;
    color: #fff2c0 !important;
    box-shadow: 0 0 26px rgba(167, 121, 255, .18), inset 0 0 0 1px rgba(167, 121, 255, .16) !important;
    outline: 0 !important;
}

html body main.approved-gameplay-page .gameplay-button img {
    width: 24px !important;
    height: 24px !important;
    flex: 0 0 24px !important;
    object-fit: contain !important;
}

html body main.approved-gameplay-page .gameplay-frame,
html body main.approved-gameplay-page .gameplay-card-panel,
html body main.approved-gameplay-page .gameplay-stat-grid > article,
html body main.approved-gameplay-page .gameplay-mini-grid > article,
html body main.approved-gameplay-page .gameplay-list-item {
    position: relative !important;
    box-sizing: border-box !important;
}

html body main.approved-gameplay-page .gameplay-frame {
    padding: 22px 22px 24px !important;
    border: 22px solid transparent !important;
    border-radius: 0 !important;
    border-image-source: var(--fsb-gameplay-frame) !important;
    border-image-slice: 95 125 90 125 !important;
    border-image-width: 22px 28px !important;
    border-image-outset: 0 !important;
    border-image-repeat: stretch !important;
    background:
        linear-gradient(180deg, rgba(49, 18, 70, .12), transparent 22%),
        radial-gradient(circle at 50% 0, rgba(91, 31, 135, .18), transparent 40rem),
        var(--fsb-gameplay-panel) !important;
    box-shadow: var(--fsb-gameplay-shadow) !important;
}

html body main.approved-gameplay-page .gameplay-frame + .gameplay-frame {
    margin-top: 12px !important;
}

html body main.approved-gameplay-page .gameplay-frame::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
        linear-gradient(180deg, rgba(255, 233, 156, .05), transparent 9%, transparent 92%, rgba(255, 233, 156, .04)),
        radial-gradient(circle at 50% 0, rgba(160, 114, 255, .12), transparent 22rem);
    opacity: .95 !important;
}

html body main.approved-gameplay-page .gameplay-frame > * {
    position: relative !important;
    z-index: 1 !important;
}

html body main.approved-gameplay-page .gameplay-section-heading,
html body main.approved-gameplay-page .section-heading {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 12px !important;
    align-items: center !important;
    margin: 0 0 16px !important;
}

html body main.approved-gameplay-page .gameplay-section-heading h2,
html body main.approved-gameplay-page .section-heading h2 {
    margin: 0 !important;
    color: var(--fsb-gameplay-gold) !important;
    font-family: var(--serif, Georgia, "Times New Roman", serif) !important;
    font-size: clamp(2rem, 2.4vw, 2.9rem) !important;
    font-weight: 500 !important;
    line-height: 1.04 !important;
    letter-spacing: -.02em !important;
}

html body main.approved-gameplay-page .gameplay-section-heading p,
html body main.approved-gameplay-page .section-heading p {
    width: min(820px, 100%) !important;
    margin: 8px 0 0 !important;
    color: var(--fsb-gameplay-copy) !important;
    line-height: 1.5 !important;
}

html body main.approved-gameplay-page .gameplay-side-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
    gap: 10px !important;
}

html body main.approved-gameplay-page .gameplay-side-actions .gameplay-button {
    min-width: 138px !important;
    justify-content: center !important;
}

html body main.approved-gameplay-page .gameplay-stat-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 8px !important;
}

html body main.approved-gameplay-page .gameplay-stat-grid > article,
html body main.approved-gameplay-page .gameplay-mini-grid > article {
    display: grid !important;
    gap: 6px !important;
    min-width: 0 !important;
    padding: 16px 18px !important;
    border: 1px solid rgba(211, 159, 55, .30) !important;
    background: rgba(3, 7, 10, .76) !important;
}

html body main.approved-gameplay-page .gameplay-stat-grid > article::before,
html body main.approved-gameplay-page .gameplay-mini-grid > article::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
        linear-gradient(180deg, rgba(255, 224, 128, .04), transparent 32%),
        radial-gradient(circle at 0 0, rgba(167, 121, 255, .06), transparent 14rem);
}

html body main.approved-gameplay-page .gameplay-stat-grid strong,
html body main.approved-gameplay-page .gameplay-mini-grid strong {
    display: block !important;
    color: var(--fsb-gameplay-gold) !important;
    font: 700 clamp(1.45rem, 1.8vw, 1.9rem)/1 var(--serif, Georgia, "Times New Roman", serif) !important;
    letter-spacing: .01em !important;
}

html body main.approved-gameplay-page .gameplay-stat-grid span,
html body main.approved-gameplay-page .gameplay-mini-grid span {
    display: block !important;
    color: var(--fsb-gameplay-copy) !important;
    font-size: .84rem !important;
    text-transform: uppercase !important;
    letter-spacing: .03em !important;
}

html body main.approved-gameplay-page .gameplay-grid-two {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

html body main.approved-gameplay-page .gameplay-grid-three {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

html body main.approved-gameplay-page .gameplay-card-panel {
    display: grid !important;
    gap: 12px !important;
    min-width: 0 !important;
    padding: 16px !important;
    border: 1px solid rgba(211, 159, 55, .26) !important;
    background:
        linear-gradient(180deg, rgba(32, 12, 48, .08), transparent 28%),
        rgba(2, 6, 9, .72) !important;
}

html body main.approved-gameplay-page .gameplay-card-panel h3 {
    margin: 0 !important;
    color: var(--fsb-gameplay-gold) !important;
    font-family: var(--serif, Georgia, "Times New Roman", serif) !important;
    font-size: clamp(1.35rem, 1.45vw, 1.6rem) !important;
    font-weight: 600 !important;
    line-height: 1.08 !important;
}

html body main.approved-gameplay-page .gameplay-card-panel p {
    margin: 0 !important;
    color: var(--fsb-gameplay-copy) !important;
    line-height: 1.5 !important;
}

html body main.approved-gameplay-page .gameplay-card-panel img {
    width: auto !important;
    max-width: 100% !important;
    max-height: 430px !important;
    height: auto !important;
    object-fit: contain !important;
    justify-self: center !important;
}

html body main.approved-gameplay-page .gameplay-badge-row,
html body main.approved-gameplay-page .gameplay-chip-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

html body main.approved-gameplay-page .gameplay-badge,
html body main.approved-gameplay-page .gameplay-chip {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    min-height: 30px !important;
    padding: 4px 10px !important;
    border: 1px solid rgba(211, 159, 55, .28) !important;
    border-radius: 999px !important;
    background: rgba(2, 6, 9, .65) !important;
    color: #e8d8ae !important;
    font-size: .76rem !important;
    letter-spacing: .03em !important;
    text-transform: uppercase !important;
}

html body main.approved-gameplay-page .gameplay-status-pill {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 4px 10px !important;
    border: 1px solid rgba(211, 159, 55, .22) !important;
    background: rgba(2, 6, 9, .55) !important;
    color: #c9bba4 !important;
    font-size: .76rem !important;
    text-transform: uppercase !important;
}

html body main.approved-gameplay-page .gameplay-status-pill::before {
    content: "" !important;
    width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
    background: #61d86f !important;
    box-shadow: 0 0 10px rgba(97, 216, 111, .45) !important;
}

html body main.approved-gameplay-page .gameplay-progress {
    width: 100% !important;
    height: 10px !important;
    border: 1px solid rgba(211, 159, 55, .20) !important;
    background: rgba(0, 0, 0, .28) !important;
    overflow: hidden !important;
}

html body main.approved-gameplay-page .gameplay-progress > span {
    display: block !important;
    height: 100% !important;
    background: linear-gradient(90deg, #66cf65, #f2c14b) !important;
}

html body main.approved-gameplay-page .gameplay-list {
    display: grid !important;
    gap: 8px !important;
}

html body main.approved-gameplay-page .gameplay-list-item {
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) auto !important;
    gap: 12px !important;
    align-items: center !important;
    min-width: 0 !important;
    padding: 12px 14px !important;
    border: 1px solid rgba(211, 159, 55, .22) !important;
    background:
        linear-gradient(90deg, rgba(167, 121, 255, .06), transparent 30%),
        rgba(0, 0, 0, .26) !important;
}

html body main.approved-gameplay-page .gameplay-list-item:hover {
    border-color: rgba(230, 185, 93, .40) !important;
    background:
        linear-gradient(90deg, rgba(167, 121, 255, .10), transparent 30%),
        rgba(0, 0, 0, .30) !important;
}

html body main.approved-gameplay-page .gameplay-list-item img {
    width: 42px !important;
    height: 42px !important;
    object-fit: contain !important;
    filter: drop-shadow(0 0 12px rgba(167, 121, 255, .38));
}

html body main.approved-gameplay-page .gameplay-list-item strong {
    display: block !important;
    color: #ffe3ac !important;
    font-size: 1rem !important;
    line-height: 1.15 !important;
}

html body main.approved-gameplay-page .gameplay-list-item span,
html body main.approved-gameplay-page .gameplay-list-item p {
    margin: 2px 0 0 !important;
    color: var(--fsb-gameplay-copy) !important;
    font-size: .85rem !important;
    line-height: 1.45 !important;
}

html body main.approved-gameplay-page .gameplay-list-item .gameplay-badge {
    justify-self: end !important;
}

html body main.approved-gameplay-page .gameplay-tile-links {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    margin-top: 14px !important;
}

html body main.approved-gameplay-page .gameplay-tile-links .gameplay-button {
    min-width: 132px !important;
    justify-content: center !important;
}

html body main.approved-gameplay-page .battle-sign,
html body main.approved-gameplay-page .fusion-sign {
    position: relative !important;
    width: 100% !important;
    margin: 0 auto !important;
    overflow: hidden !important;
    isolation: isolate !important;
    border: 1px solid rgba(230, 185, 93, .28) !important;
    background: rgba(1, 4, 6, .72) !important;
    box-shadow: 0 26px 60px rgba(0, 0, 0, .34) !important;
}

html body main.approved-gameplay-page .battle-sign {
    aspect-ratio: 1774 / 887 !important;
    max-height: 520px !important;
}

html body main.approved-gameplay-page .fusion-sign {
    aspect-ratio: 1659 / 948 !important;
    max-height: 540px !important;
}

html body main.approved-gameplay-page .battle-sign .base-art,
html body main.approved-gameplay-page .battle-sign .fx-canvas,
html body main.approved-gameplay-page .fusion-sign .base-art,
html body main.approved-gameplay-page .fusion-sign .fx-canvas {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

html body main.approved-gameplay-page .battle-sign .base-art,
html body main.approved-gameplay-page .fusion-sign .base-art {
    z-index: 1 !important;
    object-fit: contain !important;
    user-select: none !important;
    pointer-events: none !important;
}

html body main.approved-gameplay-page .battle-sign .fx-canvas,
html body main.approved-gameplay-page .fusion-sign .fx-canvas {
    z-index: 3 !important;
    pointer-events: none !important;
    mix-blend-mode: screen !important;
}

html body main.approved-gameplay-page .battle-sign .battle-glow,
html body main.approved-gameplay-page .battle-sign .battle-card-glow,
html body main.approved-gameplay-page .battle-sign .battle-brazier,
html body main.approved-gameplay-page .fusion-sign .fusion-ring,
html body main.approved-gameplay-page .fusion-sign .center-glow,
html body main.approved-gameplay-page .fusion-sign .wing-shimmer,
html body main.approved-gameplay-page .fusion-sign .card-energy,
html body main.approved-gameplay-page .fusion-sign .symbol-glow {
    position: absolute !important;
    z-index: 2 !important;
    pointer-events: none !important;
    mix-blend-mode: screen !important;
}

html body main.approved-gameplay-page .battle-sign .battle-glow {
    left: 49.3% !important;
    top: 67.2% !important;
    width: 11.5% !important;
    height: 23% !important;
    border-radius: 50% !important;
    background: radial-gradient(circle, rgba(255, 235, 122, .9) 0 12%, rgba(255, 107, 18, .42) 30%, rgba(142, 52, 255, .28) 54%, transparent 74%) !important;
    filter: blur(7px) !important;
    animation: gameplayBattleVsPulse 2.6s ease-in-out infinite !important;
}

html body main.approved-gameplay-page .battle-sign .battle-card-glow {
    width: 17% !important;
    height: 30% !important;
    border-radius: 26% !important;
    filter: blur(12px) !important;
    opacity: .42 !important;
    animation: gameplayBattleCardPulse 4.8s ease-in-out infinite !important;
}

html body main.approved-gameplay-page .battle-sign .battle-card-glow-left {
    left: 31.6% !important;
    top: 71.6% !important;
    background: radial-gradient(circle, rgba(185, 58, 255, .75), rgba(75, 20, 220, .22) 48%, transparent 72%) !important;
    transform: translate(-50%, -50%) rotate(-10deg) !important;
}

html body main.approved-gameplay-page .battle-sign .battle-card-glow-right {
    left: 69.1% !important;
    top: 71.5% !important;
    background: radial-gradient(circle, rgba(42, 151, 255, .72), rgba(25, 62, 220, .2) 48%, transparent 72%) !important;
    transform: translate(-50%, -50%) rotate(9deg) !important;
    animation-delay: -1.8s !important;
}

html body main.approved-gameplay-page .battle-sign .battle-brazier {
    width: 6% !important;
    height: 13% !important;
    border-radius: 50% !important;
    filter: blur(6px) !important;
    opacity: .58 !important;
    animation: gameplayBattleBrazierFlicker 1.35s steps(4, end) infinite !important;
}

html body main.approved-gameplay-page .battle-sign .battle-brazier-left-outer {
    left: 6.7% !important;
    top: 76.2% !important;
    background: radial-gradient(circle, rgba(250, 78, 255, .82), rgba(113, 25, 216, .28) 44%, transparent 74%) !important;
}

html body main.approved-gameplay-page .battle-sign .battle-brazier-left-inner {
    left: 19.3% !important;
    top: 80.2% !important;
    background: radial-gradient(circle, rgba(238, 65, 255, .68), rgba(108, 18, 190, .18) 48%, transparent 76%) !important;
    animation-delay: -.35s !important;
}

html body main.approved-gameplay-page .battle-sign .battle-brazier-right-inner {
    left: 79.8% !important;
    top: 80.4% !important;
    background: radial-gradient(circle, rgba(62, 177, 255, .72), rgba(23, 75, 224, .22) 48%, transparent 76%) !important;
    animation-delay: -.65s !important;
}

html body main.approved-gameplay-page .battle-sign .battle-brazier-right-outer {
    left: 92.3% !important;
    top: 75.8% !important;
    background: radial-gradient(circle, rgba(41, 160, 255, .82), rgba(18, 76, 230, .24) 44%, transparent 74%) !important;
    animation-delay: -.2s !important;
}

html body main.approved-gameplay-page .fusion-sign[data-low-effects="true"] {
    --fx-intensity: .58;
}

html body main.approved-gameplay-page .fusion-sign[data-low-effects="true"] .wing-shimmer,
html body main.approved-gameplay-page .fusion-sign[data-low-effects="true"] .symbol-glow {
    display: none !important;
}

html body main.approved-gameplay-page .gameplay-copy {
    color: var(--fsb-gameplay-copy) !important;
    line-height: 1.55 !important;
}

html body main.approved-gameplay-page.approved-fusion-page .gameplay-hero h1,
html body main.approved-gameplay-page.approved-tournaments-page .gameplay-hero h1,
html body main.approved-gameplay-page.approved-tournament-page .gameplay-hero h1,
html body main.approved-gameplay-page.approved-friends-page .gameplay-hero h1 {
    font-size: clamp(3.35rem, 4.2vw, 4.65rem) !important;
}

html body main.approved-gameplay-page.approved-fusion-page .gameplay-hero-side,
html body main.approved-gameplay-page.approved-tournaments-page .gameplay-hero-side,
html body main.approved-gameplay-page.approved-tournament-page .gameplay-hero-side,
html body main.approved-gameplay-page.approved-friends-page .gameplay-hero-side {
    min-width: 220px !important;
}

html body main.approved-gameplay-page.approved-fusion-page .gameplay-hero-side .gameplay-icon-stack img,
html body main.approved-gameplay-page.approved-tournaments-page .gameplay-hero-side .gameplay-icon-stack img,
html body main.approved-gameplay-page.approved-tournament-page .gameplay-hero-side .gameplay-icon-stack img,
html body main.approved-gameplay-page.approved-friends-page .gameplay-hero-side .gameplay-icon-stack img {
    width: 94px !important;
}

html body main.approved-gameplay-page.approved-battle-arena-page .gameplay-hero h1,
html body main.approved-gameplay-page.approved-battle-room-page .gameplay-hero h1,
html body main.approved-gameplay-page.approved-watch-battle-page .gameplay-hero h1 {
    font-size: clamp(3.4rem, 4.3vw, 4.75rem) !important;
}

html body main.approved-gameplay-page.approved-battle-arena-page .gameplay-hero-side .gameplay-icon-stack img,
html body main.approved-gameplay-page.approved-battle-room-page .gameplay-hero-side .gameplay-icon-stack img,
html body main.approved-gameplay-page.approved-watch-battle-page .gameplay-hero-side .gameplay-icon-stack img {
    width: 96px !important;
}

html body main.approved-gameplay-page.approved-fusion-page .gameplay-hero,
html body main.approved-gameplay-page.approved-tournaments-page .gameplay-hero,
html body main.approved-gameplay-page.approved-tournament-page .gameplay-hero,
html body main.approved-gameplay-page.approved-friends-page .gameplay-hero {
    padding-top: 10px !important;
}

html body:has(main.approved-gameplay-page) .site-footer {
    width: min(var(--fsb-gameplay-page-width), calc(100% - 36px)) !important;
    max-width: var(--fsb-gameplay-page-width) !important;
    margin: 8px auto 0 !important;
    box-sizing: border-box !important;
}

html body main.approved-gameplay-page .gameplay-form {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    align-items: center !important;
    margin: 0 !important;
}

html body main.approved-gameplay-page .gameplay-card-action-form {
    justify-content: flex-end !important;
}

html body main.approved-gameplay-page .gameplay-input {
    min-height: 40px !important;
    min-width: min(360px, 100%) !important;
    padding: 9px 12px !important;
    border: 1px solid rgba(211, 159, 55, .30) !important;
    border-radius: 6px !important;
    background: rgba(0, 0, 0, .42) !important;
    color: #f2e5cc !important;
    font: inherit !important;
}

html body main.approved-gameplay-page .gameplay-input:focus {
    border-color: rgba(255, 217, 130, .70) !important;
    box-shadow: 0 0 0 3px rgba(167, 121, 255, .14) !important;
    outline: 0 !important;
}

html body main.approved-gameplay-page .gameplay-card-select {
    min-width: min(260px, 100%) !important;
}

html body main.approved-gameplay-page .gameplay-callout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 10px 18px !important;
    align-items: center !important;
    margin: 0 0 18px !important;
    padding: 14px 16px !important;
    border: 1px solid rgba(211, 159, 55, .24) !important;
    background: linear-gradient(90deg, rgba(58, 32, 82, .22), rgba(0, 0, 0, .28)) !important;
}

html body main.approved-gameplay-page .gameplay-callout strong {
    color: var(--fsb-gameplay-gold) !important;
    font-size: 1.02rem !important;
}

html body main.approved-gameplay-page .gameplay-callout p {
    margin: 3px 0 0 !important;
    color: var(--fsb-gameplay-copy) !important;
}

html body main.approved-gameplay-page .gameplay-empty {
    padding: 14px !important;
    border: 1px solid rgba(211, 159, 55, .18) !important;
    background: rgba(0, 0, 0, .22) !important;
    color: var(--fsb-gameplay-copy) !important;
}

html body main.approved-gameplay-page .gameplay-empty-slot-art {
    width: min(260px, 74%) !important;
    max-height: 330px !important;
    object-fit: contain !important;
    opacity: .82 !important;
    filter: drop-shadow(0 10px 22px rgba(111, 54, 188, .28)) !important;
}

html body main.approved-gameplay-page.approved-watch-battle-page .gameplay-card-panel img {
    max-height: 520px !important;
}

html body main.approved-gameplay-page.approved-battle-room-page .gameplay-card-panel img,
html body main.approved-gameplay-page.approved-fusion-page .gameplay-card-panel img {
    max-height: 400px !important;
}

html body:has(main.approved-gameplay-page) .site-footer .footer-links,
html body:has(main.approved-gameplay-page) .site-footer .footer-legal {
    flex-wrap: wrap !important;
}

@keyframes gameplayBattleVsPulse {
    0%, 100% { opacity: .45; transform: translate(-50%, -50%) scale(.94); }
    48% { opacity: .96; transform: translate(-50%, -50%) scale(1.08); }
}

@keyframes gameplayBattleCardPulse {
    0%, 100% { opacity: .28; }
    45% { opacity: .58; }
    70% { opacity: .38; }
}

@keyframes gameplayBattleBrazierFlicker {
    0%, 100% { opacity: .42; transform: translate(-50%, -50%) scale(.92, .86); }
    35% { opacity: .74; transform: translate(-50%, -50%) scale(1.03, 1.14); }
    70% { opacity: .56; transform: translate(-50%, -50%) scale(.96, 1.02); }
}

@media (max-width: 1200px) {
    html body main.approved-gameplay-page .gameplay-hero {
        grid-template-columns: 1fr !important;
    }

    html body main.approved-gameplay-page .gameplay-hero-side {
        align-items: flex-start !important;
    }

    html body main.approved-gameplay-page .gameplay-stat-grid,
    html body main.approved-gameplay-page .gameplay-grid-three {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 820px) {
    html body main.approved-gameplay-page {
        width: calc(100% - 20px) !important;
        padding-top: 6px !important;
    }

    html body main.approved-gameplay-page .gameplay-hero {
        padding: 12px 6px 8px !important;
    }

    html body main.approved-gameplay-page .gameplay-hero h1 {
        font-size: clamp(3.1rem, 12vw, 4.2rem) !important;
    }

    html body main.approved-gameplay-page .gameplay-hero-side {
        width: 100% !important;
        align-items: flex-start !important;
    }

    html body main.approved-gameplay-page .gameplay-hero-side .gameplay-icon-stack {
        justify-items: start !important;
    }

    html body main.approved-gameplay-page .gameplay-hero-side .gameplay-icon-stack img {
        width: 112px !important;
    }

    html body main.approved-gameplay-page .gameplay-frame {
        padding: 20px 16px 22px !important;
        border-width: 18px !important;
        border-image-width: 18px 20px !important;
    }

    html body main.approved-gameplay-page .gameplay-grid-two,
    html body main.approved-gameplay-page .gameplay-grid-three,
    html body main.approved-gameplay-page .gameplay-stat-grid {
        grid-template-columns: 1fr !important;
    }

    html body main.approved-gameplay-page .gameplay-side-actions {
        justify-content: flex-start !important;
    }

    html body main.approved-gameplay-page .gameplay-callout {
        grid-template-columns: 1fr !important;
    }

    html body:has(main.approved-gameplay-page) .site-footer {
        width: calc(100% - 20px) !important;
    }
}


/* FSB gameplay privacy/presence hardening */
.gameplay-privacy-form {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    align-items: end;
    gap: 12px;
}
.gameplay-privacy-form label {
    display: grid;
    gap: 7px;
    color: var(--cream, #f8edd5);
    font-weight: 700;
}
@media (max-width: 920px) {
    .gameplay-privacy-form { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
    .gameplay-privacy-form { grid-template-columns: 1fr; }
}

/* Live battle room and synchronized spectator playback */
.compact-battle-sign{max-height:420px;overflow:hidden;margin-bottom:18px}.compact-battle-sign .base-art{width:100%;height:auto;display:block}.battle-live-stage{position:relative}.battle-live-countdown{text-align:center;font-family:var(--font-display,Georgia,serif);font-size:clamp(1.1rem,2vw,1.65rem);color:#f3cf72;margin:10px 0 18px;text-transform:capitalize}.battle-live-players{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:18px}.battle-live-player{padding:18px;border:1px solid rgba(218,170,65,.35);background:linear-gradient(180deg,rgba(20,12,35,.9),rgba(2,8,14,.95));border-radius:16px;min-width:0}.battle-live-player header{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.battle-live-player h3{margin:7px 0 0;color:#f5d777}.battle-live-card-wrap{text-align:center;min-height:330px;display:flex;flex-direction:column;align-items:center;justify-content:center}.battle-live-card-wrap img{display:block;max-width:235px;width:76%;max-height:310px;object-fit:contain;filter:drop-shadow(0 0 16px rgba(126,62,255,.42))}.battle-live-card-wrap p{margin:8px 0;color:#e7d9ef}.battle-live-versus{font-family:var(--font-display,Georgia,serif);font-size:clamp(2rem,4vw,4rem);color:#f4c95d;text-shadow:0 0 22px rgba(166,73,255,.75)}.battle-live-hp{margin:10px 0}.battle-live-hp-label{display:flex;justify-content:space-between;font-size:.85rem;color:#ead9ba}.battle-live-hp-track{height:12px;border:1px solid rgba(226,183,70,.45);border-radius:999px;overflow:hidden;background:#130d18}.battle-live-hp-track span{display:block;height:100%;background:linear-gradient(90deg,#9f2cff,#ff5f9b,#ffc65a);transition:width .35s ease}.battle-live-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;margin-top:18px}.battle-event-log{max-height:430px;overflow:auto;display:grid;gap:9px}.battle-event-entry{padding:11px 13px;border:1px solid rgba(208,162,66,.26);background:rgba(4,7,13,.76);border-radius:10px}.battle-event-entry strong{color:#f4cf70}.battle-event-entry p{margin:4px 0 0;color:#ddcfdf}.battle-result-card{padding:20px;text-align:center;border:1px solid rgba(237,192,76,.4);border-radius:14px;background:radial-gradient(circle at top,rgba(110,48,180,.24),rgba(4,8,14,.92))}.battle-result-card h3{font-size:1.7rem;color:#f5d777}.battle-result-card .gameplay-chip-row{justify-content:center}.gameplay-primary{box-shadow:0 0 24px rgba(137,64,255,.45)}
@media(max-width:820px){.battle-live-players{grid-template-columns:1fr}.battle-live-versus{text-align:center;font-size:2rem}.battle-live-card-wrap{min-height:260px}.battle-live-card-wrap img{max-height:245px}.compact-battle-sign{max-height:270px}}
@media(prefers-reduced-motion:reduce){.battle-live-hp-track span{transition:none}}

/* Production tournament controls and bracket */
.tournament-create-form{display:grid;grid-template-columns:2fr 1fr 1.4fr 2fr auto;gap:12px;align-items:end}.tournament-create-form label{display:grid;gap:6px;color:#ead9ba;font-size:.82rem}.tournament-lobby-row>.gameplay-side-actions{max-width:54%;justify-content:flex-end}.tournament-bracket-live{display:flex;gap:18px;align-items:flex-start;overflow-x:auto;padding:8px 4px 18px;scrollbar-color:#7e43b5 #090711}.tournament-round{flex:0 0 min(320px,78vw);display:grid;gap:14px}.tournament-round h3{text-align:center;color:#f4cf70}.tournament-match-card{border:1px solid rgba(221,173,67,.32);border-radius:14px;background:linear-gradient(180deg,rgba(24,13,41,.9),rgba(2,8,13,.96));padding:13px;display:grid;gap:8px}.tournament-match-head{display:flex;justify-content:space-between;align-items:center;color:#cdbfd5;font-size:.8rem}.tournament-contender{padding:10px;border:1px solid rgba(151,93,204,.27);border-radius:9px;background:rgba(3,7,13,.7);display:grid;gap:3px}.tournament-contender strong{color:#ead9f0}.tournament-contender small{color:#ad9eb6}.tournament-contender.winner{border-color:rgba(240,195,73,.75);box-shadow:inset 0 0 18px rgba(240,195,73,.1)}.tournament-contender.winner strong{color:#f6d87c}.tournament-match-card .gameplay-side-actions{justify-content:flex-end}.battle-result-card>img{max-width:180px;max-height:240px;object-fit:contain;filter:drop-shadow(0 0 18px rgba(152,73,255,.45))}
@media(max-width:1100px){.tournament-create-form{grid-template-columns:1fr 1fr}.tournament-lobby-row>.gameplay-side-actions{max-width:100%}}
@media(max-width:700px){.tournament-create-form{grid-template-columns:1fr}.tournament-lobby-row{align-items:flex-start}.tournament-lobby-row>.gameplay-side-actions{width:100%;justify-content:flex-start}}

.gameplay-group-status {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0 24px 16px;
    padding: 12px 16px;
    border: 1px solid rgba(218, 174, 74, .42);
    border-radius: 10px;
    background: rgba(4, 8, 15, .86);
    box-shadow: inset 0 0 22px rgba(113, 60, 180, .08);
}
.gameplay-group-status strong { color: #f4cf70; white-space: nowrap; }
.gameplay-group-status span { color: #d9d4c7; }
.gameplay-group-status.is-verified { border-color: rgba(79, 204, 140, .52); }
.gameplay-group-status.is-verified strong { color: #7fe0aa; }
.gameplay-group-status.is-required { border-color: rgba(232, 148, 84, .62); }
@media (max-width: 720px) {
    .gameplay-group-status { margin-inline: 14px; align-items: flex-start; flex-direction: column; gap: 4px; }
    .gameplay-group-status strong { white-space: normal; }
}
