/* My Garden World player center v6. Loaded last and scoped to the player panel. */
html.fi,
html.fi:has(body.fi-body.fi-panel-player),
html.fi.dark:has(body.fi-body.fi-panel-player) {
    background-color: #edf6f1 !important;
    background-image: url('/images/wdhysj/client/garden-bg.png') !important;
    background-position: center top !important;
    background-size: 760px auto !important;
    background-repeat: repeat-x !important;
    background-attachment: fixed !important;
}

html.fi body.fi-body.fi-panel-player,
html.fi body.fi-body.fi-panel-player:not(.s33-guest-body) {
    --garden-ink: #26372f;
    --garden-muted: #68766f;
    --garden-green: #2f6b55;
    --garden-green-dark: #214d3e;
    --garden-coral: #c85d50;
    --garden-gold: #b98532;
    --garden-teal: #28777a;
    --garden-surface: #ffffff;
    --garden-soft: #eef6f1;
    --garden-pink: #fbf0f2;
    --garden-blue: #edf6f7;
    --garden-line: #d6e4db;
    --zxr-player-ink: var(--garden-ink);
    --zxr-player-paper: #f7faf8;
    --zxr-player-surface: var(--garden-surface);
    --zxr-player-line: var(--garden-line);
    --zxr-player-muted: var(--garden-muted);
    --zxr-player-red: var(--garden-coral);
    --zxr-player-gold: var(--garden-gold);
    --zxr-player-teal: var(--garden-teal);
    color: var(--garden-ink) !important;
    background-color: #edf6f1 !important;
    background-image: url('/images/wdhysj/client/garden-bg.png') !important;
    background-position: center top !important;
    background-size: 760px auto !important;
    background-repeat: repeat-x !important;
    background-attachment: fixed !important;
    letter-spacing: 0 !important;
}

html.fi body.fi-body.fi-panel-player *,
html.fi body.fi-body.fi-panel-player *::before,
html.fi body.fi-body.fi-panel-player *::after {
    letter-spacing: 0 !important;
}

html.fi body.fi-body.fi-panel-player .fi-main-ctn {
    background: rgba(247, 250, 248, .9) !important;
}

html.fi body.fi-body.fi-panel-player .fi-main {
    width: 100% !important;
    max-width: 1480px !important;
    min-width: 0 !important;
    padding: 28px 34px 64px !important;
    margin-inline: auto !important;
    background: transparent !important;
    box-shadow: none !important;
}

html.fi body.fi-body.fi-panel-player .fi-topbar,
html.fi body.fi-body.fi-panel-player .fi-topbar-ctn {
    min-height: 64px !important;
    color: var(--garden-ink) !important;
    background: rgba(255, 255, 255, .96) !important;
    border-bottom: 1px solid var(--garden-line) !important;
    box-shadow: 0 8px 24px rgba(47, 107, 85, .07) !important;
    backdrop-filter: blur(16px) !important;
}

html.fi body.fi-body.fi-panel-player .fi-topbar .fi-icon-btn,
html.fi body.fi-body.fi-panel-player .fi-topbar svg {
    color: var(--garden-green) !important;
}

html.fi body.fi-body.fi-panel-player .fi-sidebar,
html.fi body.fi-body.fi-panel-player .fi-main-sidebar {
    color: #ffffff !important;
    background-color: var(--garden-green-dark) !important;
    background-image: url('/images/wdhysj/client/login-florist.png') !important;
    background-position: 116px bottom !important;
    background-size: 185px auto !important;
    background-repeat: no-repeat !important;
    border-right: 1px solid rgba(255, 255, 255, .12) !important;
    box-shadow: 14px 0 34px rgba(33, 77, 62, .14) !important;
}

html.fi body.fi-body.fi-panel-player .fi-sidebar-header,
html.fi body.fi-body.fi-panel-player .fi-sidebar-header-ctn,
html.fi body.fi-body.fi-panel-player .fi-sidebar-header-logo-ctn,
html.fi body.fi-body.fi-panel-player .fi-sidebar-nav,
html.fi body.fi-body.fi-panel-player .fi-sidebar-nav-groups {
    color: #ffffff !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
}

html.fi body.fi-body.fi-panel-player .fi-sidebar-header,
html.fi body.fi-body.fi-panel-player .fi-sidebar-header-ctn {
    border-bottom: 1px solid rgba(255, 255, 255, .12) !important;
}

html.fi body.fi-body.fi-panel-player .fi-sidebar-nav {
    padding: 16px 12px 230px !important;
}

html.fi body.fi-body.fi-panel-player .fi-sidebar-group-label {
    color: rgba(255, 255, 255, .58) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
}

html.fi body.fi-body.fi-panel-player .fi-sidebar .fi-sidebar-item-btn,
html.fi body.fi-body.fi-panel-player .fi-sidebar .fi-sidebar-item-button,
html.fi body.fi-body.fi-panel-player .fi-sidebar .fi-sidebar-item-btn:not(:hover),
html.fi body.fi-body.fi-panel-player .fi-sidebar .fi-sidebar-item-button:not(:hover) {
    min-height: 44px !important;
    padding: 9px 11px !important;
    color: rgba(255, 255, 255, .84) !important;
    background: rgba(255, 255, 255, .055) !important;
    border: 1px solid rgba(255, 255, 255, .1) !important;
    border-radius: 6px !important;
}

html.fi body.fi-body.fi-panel-player .fi-sidebar-item-label,
html.fi body.fi-body.fi-panel-player .fi-sidebar-item-icon {
    color: inherit !important;
}

html.fi body.fi-body.fi-panel-player .fi-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn,
html.fi body.fi-body.fi-panel-player .fi-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-button,
html.fi body.fi-body.fi-panel-player .fi-sidebar .fi-sidebar-item-btn:hover,
html.fi body.fi-body.fi-panel-player .fi-sidebar .fi-sidebar-item-button:hover {
    color: #ffffff !important;
    background: rgba(255, 255, 255, .16) !important;
    border-color: rgba(255, 255, 255, .28) !important;
    border-radius: 6px !important;
    transform: none !important;
}

html.fi body.fi-body.fi-panel-player .fi-sidebar .fi-sidebar-item.fi-active .fi-sidebar-item-icon,
html.fi body.fi-body.fi-panel-player .fi-sidebar .fi-sidebar-item-btn:hover .fi-sidebar-item-icon,
html.fi body.fi-body.fi-panel-player .fi-sidebar .fi-sidebar-item-button:hover .fi-sidebar-item-icon {
    color: #ffd985 !important;
}

.zxr-player-home,
html.fi body.fi-body.fi-panel-player .s33-player-page {
    gap: 22px !important;
    color: var(--garden-ink) !important;
}

.zxr-player-home-hero,
html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero {
    position: relative !important;
    isolation: isolate !important;
    overflow: hidden !important;
    color: var(--garden-ink) !important;
    background-color: #e7f3ed !important;
    background-image: url('/images/wdhysj/client/share-7.png') !important;
    background-position: right center !important;
    background-size: auto 100% !important;
    background-repeat: no-repeat !important;
    border: 1px solid #c9ded1 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    order: -100 !important;
}

.zxr-player-home-hero {
    grid-template-columns: minmax(0, 1fr) minmax(360px, .8fr) !important;
    min-height: 330px !important;
}

html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero {
    grid-template-columns: minmax(0, 1fr) 360px !important;
    min-height: 232px !important;
    padding: 28px 34px !important;
}

.zxr-player-home-hero::before,
html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    background: rgba(238, 247, 242, .83) !important;
}

.zxr-player-home-hero::after,
html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero::after {
    content: '' !important;
    position: absolute !important;
    inset: auto 0 0 !important;
    height: 4px !important;
    background: var(--garden-coral) !important;
}

.zxr-player-home-hero__copy {
    z-index: 5 !important;
    max-width: 620px !important;
    padding: 42px 46px !important;
}

.zxr-player-feature-hero__copy {
    z-index: 5 !important;
    max-width: 760px !important;
}

.zxr-player-home-hero__logo,
.zxr-player-feature-hero__logo {
    width: 148px !important;
    height: auto !important;
    margin-bottom: 12px !important;
}

.zxr-player-feature-hero__logo {
    width: 112px !important;
}

html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero__copy > .zxr-player-feature-hero__logo {
    display: block !important;
    width: 112px !important;
    height: auto !important;
    max-width: 112px !important;
    margin: 0 0 9px !important;
    padding: 0 !important;
    object-fit: contain !important;
}

.zxr-player-home-hero__copy > span,
.zxr-player-services header span,
html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero .s33-player-kicker {
    display: block !important;
    width: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    color: var(--garden-coral) !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    font-size: 11px !important;
    line-height: 1.4 !important;
    font-weight: 800 !important;
}

.zxr-player-home-hero h1,
html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero h2 {
    max-width: 660px !important;
    margin: 6px 0 10px !important;
    color: var(--garden-green-dark) !important;
    font-family: "Noto Serif SC", "Songti SC", serif !important;
    font-size: 40px !important;
    line-height: 1.16 !important;
    font-weight: 900 !important;
}

html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero h2 {
    font-size: 31px !important;
}

.zxr-player-home-hero p,
html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero p {
    max-width: 570px !important;
    margin: 0 !important;
    color: #596b62 !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
}

.zxr-player-home-hero__identity,
html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero .s33-player-identity {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-top: 18px !important;
}

.zxr-player-home-hero__identity span,
html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero .s33-player-identity span {
    min-height: 30px !important;
    padding: 6px 10px !important;
    color: var(--garden-green-dark) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    background: rgba(255, 255, 255, .8) !important;
    border: 1px solid #c6dbce !important;
    border-radius: 5px !important;
}

html.fi body.fi-body.fi-panel-player .s33-switch-account-btn {
    min-height: 30px !important;
    padding: 6px 10px !important;
    color: #ffffff !important;
    background: var(--garden-green) !important;
    border: 1px solid var(--garden-green) !important;
    border-radius: 5px !important;
}

.zxr-player-home-hero__art,
.zxr-player-feature-hero__art {
    position: absolute !important;
    right: 105px !important;
    bottom: -30px !important;
    z-index: 3 !important;
    width: 365px !important;
    height: auto !important;
    max-width: none !important;
    object-fit: contain !important;
    filter: drop-shadow(0 14px 18px rgba(47, 107, 85, .18)) !important;
}

html.fi body.fi-body.fi-panel-player .zxr-player-home-hero > .zxr-player-home-hero__art,
html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero > .zxr-player-feature-hero__art {
    position: absolute !important;
    right: 105px !important;
    bottom: -30px !important;
    z-index: 3 !important;
    display: block !important;
    width: 365px !important;
    height: auto !important;
    max-width: none !important;
    object-fit: contain !important;
}

html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero > .zxr-player-feature-hero__art {
    right: 94px !important;
    bottom: -44px !important;
    width: 285px !important;
}

.zxr-player-feature-hero__art {
    right: 94px !important;
    bottom: -44px !important;
    width: 285px !important;
}

.zxr-player-home-hero__florist,
.zxr-player-feature-hero__florist {
    position: absolute !important;
    right: -8px !important;
    bottom: -36px !important;
    z-index: 4 !important;
    width: 225px !important;
    height: auto !important;
    object-fit: contain !important;
    filter: drop-shadow(0 14px 18px rgba(33, 77, 62, .18)) !important;
}

html.fi body.fi-body.fi-panel-player .zxr-player-home-hero > .zxr-player-home-hero__florist,
html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero > .zxr-player-feature-hero__florist {
    position: absolute !important;
    right: -8px !important;
    bottom: -36px !important;
    z-index: 4 !important;
    display: block !important;
    width: 225px !important;
    height: auto !important;
    max-width: none !important;
    object-fit: contain !important;
}

html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero > .zxr-player-feature-hero__florist {
    right: 4px !important;
    bottom: -66px !important;
    width: 190px !important;
}

.zxr-player-feature-hero__florist {
    right: 4px !important;
    bottom: -66px !important;
    width: 190px !important;
}

.zxr-player-balance,
html.fi body.fi-body.fi-panel-player .s33-player-metric-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0 !important;
    overflow: hidden !important;
    background: #ffffff !important;
    border: 1px solid var(--garden-line) !important;
    border-radius: 8px !important;
}

.zxr-player-balance > div,
html.fi body.fi-body.fi-panel-player .s33-player-metric-grid article {
    min-height: 94px !important;
    padding: 17px 20px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.zxr-player-balance > div + div,
html.fi body.fi-body.fi-panel-player .s33-player-metric-grid article + article {
    border-left: 1px solid var(--garden-line) !important;
}

.zxr-player-balance span,
html.fi body.fi-body.fi-panel-player .s33-player-metric-grid span {
    color: var(--garden-muted) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
}

.zxr-player-balance strong,
html.fi body.fi-body.fi-panel-player .s33-player-metric-grid strong {
    display: block !important;
    margin-top: 5px !important;
    color: var(--garden-green-dark) !important;
    font-size: 24px !important;
    line-height: 1.15 !important;
    font-weight: 900 !important;
    overflow-wrap: anywhere !important;
}

.zxr-player-balance small,
html.fi body.fi-body.fi-panel-player .s33-player-metric-grid em {
    display: block !important;
    margin-top: 4px !important;
    color: var(--garden-muted) !important;
    font-size: 10px !important;
    font-style: normal !important;
}

.zxr-player-home-wallet-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr) !important;
    gap: 16px !important;
}

.zxr-player-home-recharge,
.zxr-player-home-reward,
.zxr-player-home-data-card,
html.fi body.fi-body.fi-panel-player .s33-player-data-card,
html.fi body.fi-body.fi-panel-player .s33-player-form-card,
html.fi body.fi-body.fi-panel-player .s33-player-empty-card,
html.fi body.fi-body.fi-panel-player .s33-player-result,
html.fi body.fi-body.fi-panel-player .s33-recharge-reward-preview,
html.fi body.fi-body.fi-panel-player .s33-recharge-reward-progress-card,
html.fi body.fi-body.fi-panel-player .s33-zone-transfer-board,
html.fi body.fi-body.fi-panel-player .s33-zone-transfer-rule-card,
html.fi body.fi-body.fi-panel-player .s33-zone-transfer-target,
html.fi body.fi-body.fi-panel-player .s33-zone-transfer-empty {
    color: var(--garden-ink) !important;
    background: #ffffff !important;
    border: 1px solid var(--garden-line) !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 22px rgba(47, 107, 85, .06) !important;
}

.zxr-player-home-recharge,
.zxr-player-home-reward,
html.fi body.fi-body.fi-panel-player .s33-player-data-card,
html.fi body.fi-body.fi-panel-player .s33-player-form-card,
html.fi body.fi-body.fi-panel-player .s33-player-empty-card {
    padding: 20px !important;
}

.zxr-player-home-recharge header > span,
.zxr-player-home-reward header > span,
html.fi body.fi-body.fi-panel-player .s33-player-section-head span {
    color: var(--garden-coral) !important;
    font-size: 10px !important;
    font-weight: 800 !important;
}

.zxr-player-home-recharge h2,
.zxr-player-home-reward h2,
html.fi body.fi-body.fi-panel-player .s33-player-section-head strong {
    color: var(--garden-green-dark) !important;
    font-size: 21px !important;
    font-weight: 900 !important;
}

.zxr-player-home-recharge p,
.zxr-player-home-reward p,
html.fi body.fi-body.fi-panel-player .s33-player-section-head p,
html.fi body.fi-body.fi-panel-player .s33-player-empty,
html.fi body.fi-body.fi-panel-player .s33-player-note-list,
html.fi body.fi-body.fi-panel-player .s33-action-desc {
    color: var(--garden-muted) !important;
}

.zxr-player-home-pay-methods label,
.zxr-player-home-amount button,
html.fi body.fi-body.fi-panel-player .s33-player-amount-presets button,
html.fi body.fi-body.fi-panel-player .s33-player-pay-methods label {
    color: var(--garden-ink) !important;
    background: var(--garden-soft) !important;
    border: 1px solid #cfe0d6 !important;
    border-radius: 6px !important;
    box-shadow: none !important;
}

.zxr-player-home-pay-methods label.is-selected,
.zxr-player-home-amount button.is-selected,
html.fi body.fi-body.fi-panel-player .s33-player-amount-presets button.is-selected {
    color: #ffffff !important;
    background: var(--garden-green) !important;
    border-color: var(--garden-green) !important;
}

.zxr-player-home-recharge form > button,
html.fi body.fi-body.fi-panel-player .s33-player-form-card > button,
html.fi body.fi-body.fi-panel-player .s33-direct-buy-btn,
html.fi body.fi-body.fi-panel-player .s33-zone-transfer-confirm-btn,
html.fi body.fi-body.fi-panel-player .wdhysj-mall-card__footer button {
    min-height: 40px !important;
    color: #ffffff !important;
    background: var(--garden-green) !important;
    border: 1px solid var(--garden-green) !important;
    border-radius: 6px !important;
    box-shadow: none !important;
    font-weight: 800 !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-card__footer button {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-card__footer button svg {
    width: 17px !important;
    height: 17px !important;
}

.zxr-player-services > header {
    border-bottom-color: var(--garden-line) !important;
}

.zxr-player-services h2 {
    color: var(--garden-green-dark) !important;
}

.zxr-player-services__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
}

.zxr-player-service {
    min-height: 108px !important;
    color: var(--garden-ink) !important;
    background: #ffffff !important;
    border: 1px solid var(--garden-line) !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 22px rgba(47, 107, 85, .06) !important;
}

.zxr-player-service:hover {
    border-color: #9fc3ad !important;
    box-shadow: 0 12px 28px rgba(47, 107, 85, .11) !important;
    transform: translateY(-2px) !important;
}

.zxr-player-service__icon {
    color: #ffffff !important;
    background: var(--garden-green) !important;
    border-radius: 6px !important;
}

.zxr-player-service.is-red .zxr-player-service__icon { background: var(--garden-coral) !important; }
.zxr-player-service.is-gold .zxr-player-service__icon { background: var(--garden-gold) !important; }
.zxr-player-service.is-teal .zxr-player-service__icon { background: var(--garden-teal) !important; }

.zxr-player-service strong { color: var(--garden-green-dark) !important; }
.zxr-player-service p { color: var(--garden-muted) !important; }

.zxr-player-account-bar {
    color: var(--garden-ink) !important;
    background: var(--garden-blue) !important;
    border: 1px solid #cfe2e3 !important;
    border-radius: 8px !important;
}

.zxr-player-account-bar button {
    color: #ffffff !important;
    background: var(--garden-teal) !important;
    border-color: var(--garden-teal) !important;
    border-radius: 6px !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-nav {
    gap: 7px !important;
    padding: 0 0 13px !important;
    border-bottom: 1px solid var(--garden-line) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-nav a {
    color: var(--garden-green-dark) !important;
    background: #ffffff !important;
    border: 1px solid var(--garden-line) !important;
    border-radius: 5px !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-nav a.is-active,
html.fi body.fi-body.fi-panel-player .s33-player-nav a:hover {
    color: #ffffff !important;
    background: var(--garden-green) !important;
    border-color: var(--garden-green) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-form-grid {
    gap: 14px !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-field span,
html.fi body.fi-body.fi-panel-player .s33-player-field small,
html.fi body.fi-body.fi-panel-player .s33-player-table td {
    color: var(--garden-ink) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-field small,
html.fi body.fi-body.fi-panel-player .s33-player-table th {
    color: var(--garden-muted) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-field input,
html.fi body.fi-body.fi-panel-player .s33-player-field select,
html.fi body.fi-body.fi-panel-player .s33-player-field textarea {
    color: var(--garden-ink) !important;
    caret-color: var(--garden-green) !important;
    background: #ffffff !important;
    border: 1px solid #b9cec1 !important;
    border-radius: 6px !important;
    box-shadow: none !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-field input:focus,
html.fi body.fi-body.fi-panel-player .s33-player-field select:focus,
html.fi body.fi-body.fi-panel-player .s33-player-field textarea:focus {
    border-color: var(--garden-green) !important;
    box-shadow: 0 0 0 3px rgba(47, 107, 85, .13) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-table-wrap {
    overflow-x: auto !important;
    background: #ffffff !important;
    border: 1px solid var(--garden-line) !important;
    border-radius: 6px !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-table th {
    color: #56675e !important;
    background: var(--garden-soft) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-table td {
    border-color: #e5eee8 !important;
}

/* Verified garden mall */
html.fi body.fi-body.fi-panel-player .wdhysj-mall {
    gap: 24px !important;
    color: var(--garden-ink) !important;
    order: 40 !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page.is-page-store .s33-player-metric-grid.is-store-assets {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 0 !important;
    padding: 0 !important;
    color: var(--garden-ink) !important;
    background: #ffffff !important;
    border: 1px solid var(--garden-line) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page.is-page-store .s33-player-metric-grid.is-store-assets article {
    color: var(--garden-ink) !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page.is-page-store .s33-player-metric-grid.is-store-assets article + article {
    border-left: 1px solid var(--garden-line) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page.is-page-store .s33-player-metric-grid.is-store-assets span,
html.fi body.fi-body.fi-panel-player .s33-player-page.is-page-store .s33-player-metric-grid.is-store-assets em {
    color: var(--garden-muted) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page.is-page-store .s33-player-metric-grid.is-store-assets strong {
    color: var(--garden-green-dark) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall__head {
    padding: 18px 0 !important;
    border-bottom-color: var(--garden-line) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall__head h3,
html.fi body.fi-body.fi-panel-player .wdhysj-mall-group > header > div > span {
    color: var(--garden-green-dark) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall__head span,
html.fi body.fi-body.fi-panel-player .wdhysj-mall-group > header span {
    color: var(--garden-coral) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall__head p,
html.fi body.fi-body.fi-panel-player .wdhysj-mall-group > header p,
html.fi body.fi-body.fi-panel-player .wdhysj-mall__legend,
html.fi body.fi-body.fi-panel-player .wdhysj-mall__legend span {
    color: var(--garden-muted) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-tabs {
    position: sticky !important;
    top: 10px !important;
    z-index: 12 !important;
    display: flex !important;
    gap: 7px !important;
    padding: 8px !important;
    overflow-x: auto !important;
    background: rgba(255, 255, 255, .95) !important;
    border: 1px solid var(--garden-line) !important;
    border-radius: 7px !important;
    box-shadow: 0 10px 26px rgba(47, 107, 85, .1) !important;
    backdrop-filter: blur(14px) !important;
    scrollbar-width: none !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-tabs::-webkit-scrollbar {
    display: none !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-tabs a {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    gap: 7px !important;
    min-height: 36px !important;
    padding: 7px 10px !important;
    color: var(--garden-green-dark) !important;
    text-decoration: none !important;
    background: var(--garden-soft) !important;
    border: 1px solid #d1e1d7 !important;
    border-radius: 5px !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-tabs a:hover,
html.fi body.fi-body.fi-panel-player .wdhysj-mall-tabs a:focus-visible {
    color: #ffffff !important;
    background: var(--garden-green) !important;
    border-color: var(--garden-green) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-tabs em {
    min-width: 20px !important;
    padding: 2px 5px !important;
    color: inherit !important;
    text-align: center !important;
    background: rgba(255, 255, 255, .48) !important;
    border-radius: 4px !important;
    font-size: 10px !important;
    font-style: normal !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-group {
    scroll-margin-top: 68px !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-card {
    grid-template-rows: 142px 1fr auto !important;
    overflow: hidden !important;
    background: #ffffff !important;
    border: 1px solid var(--garden-line) !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 24px rgba(47, 107, 85, .08) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-card__cover {
    background-color: var(--garden-soft) !important;
    background-image: url('/images/wdhysj/client/share-7.png') !important;
    background-position: center !important;
    background-size: cover !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-card__cover img {
    width: 102px !important;
    height: 102px !important;
    filter: drop-shadow(0 8px 12px rgba(47, 107, 85, .18)) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-card__cover > span {
    color: var(--garden-green-dark) !important;
    background: rgba(255, 255, 255, .9) !important;
    border-color: #c8dccf !important;
    border-radius: 4px !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-card__title h4 {
    color: var(--garden-green-dark) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-card__title small,
html.fi body.fi-body.fi-panel-player .wdhysj-mall-items strong {
    color: var(--garden-muted) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-items > div {
    min-height: 104px !important;
    padding-bottom: 17px !important;
    background: #ffffff !important;
    border-color: #dfebe3 !important;
    border-radius: 6px !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-items strong {
    display: block !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    line-height: 1.35 !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-items em {
    color: var(--garden-coral) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-card__footer {
    background: var(--garden-soft) !important;
    border-top-color: var(--garden-line) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-card__footer > div:first-child strong {
    color: var(--garden-coral) !important;
}

/* Keep the two login-recommended launch bundles visually first in the
   storefront, while retaining the same compact card geometry as the rest of
   the catalog. */
html.fi body.fi-body.fi-panel-player .wdhysj-mall-card.is-featured {
    position: relative !important;
    border-color: rgba(200, 93, 80, .42) !important;
    box-shadow: 0 16px 34px rgba(200, 93, 80, .14) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-card.is-featured::before {
    content: '新服主题 · 登录推荐' !important;
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    z-index: 4 !important;
    padding: 4px 7px !important;
    color: #fff !important;
    background: var(--garden-coral) !important;
    border-radius: 4px !important;
    font-size: 9px !important;
    font-weight: 850 !important;
    line-height: 1.2 !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-card.is-featured.is-chengxing .wdhysj-mall-card__cover {
    background-image: url('/images/wdhysj/client/entry-chengxing-bg.jpg') !important;
    background-position: center 28% !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-mall-card.is-featured.is-chiyan .wdhysj-mall-card__cover {
    background-image: url('/images/wdhysj/client/entry-chiyan-decor.png') !important;
}

.zxr-store-empty-showcase {
    background: #ffffff !important;
    border: 1px solid var(--garden-line) !important;
    border-radius: 8px !important;
}

.zxr-store-empty-showcase__visual img {
    width: 150px !important;
    height: 120px !important;
    object-fit: contain !important;
}

/* Override the retired dark feature surfaces with the garden workspace. */
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-metric-grid:not(.is-store-assets) {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
    gap: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    color: var(--garden-ink) !important;
    background: #ffffff !important;
    border: 1px solid var(--garden-line) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-metric-grid:not(.is-store-assets) article {
    min-height: 88px !important;
    padding: 15px 17px !important;
    color: var(--garden-ink) !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-metric-grid:not(.is-store-assets) article + article {
    border-left: 1px solid var(--garden-line) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-metric-grid:not(.is-store-assets) span,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-metric-grid:not(.is-store-assets) em {
    color: var(--garden-muted) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-metric-grid:not(.is-store-assets) strong {
    color: var(--garden-green-dark) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-data-card,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-form-card,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-empty-card,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-result,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-note-list > div,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-recharge-reward-preview,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-recharge-reward-progress-card,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-zone-transfer-board,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-zone-transfer-rule-card,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-zone-transfer-target,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-zone-transfer-empty {
    color: var(--garden-ink) !important;
    background: #ffffff !important;
    border: 1px solid var(--garden-line) !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 22px rgba(47, 107, 85, .06) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-section-head span {
    color: var(--garden-coral) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-section-head strong,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-empty-card strong,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-result strong {
    color: var(--garden-green-dark) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-section-head p,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-empty-card p,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-result div,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-note-list,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-action-desc {
    color: var(--garden-muted) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-empty {
    padding: 20px !important;
    color: #7c8982 !important;
    background: var(--garden-soft) !important;
    border: 1px dashed #bdd2c5 !important;
    border-radius: 6px !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-note-list > div {
    color: var(--garden-muted) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-field > span,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-check em {
    color: var(--garden-ink) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-field > small {
    color: var(--garden-muted) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-field input,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-field select,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-field textarea {
    min-height: 43px !important;
    padding: 10px 12px !important;
    color: var(--garden-ink) !important;
    caret-color: var(--garden-green) !important;
    background: #ffffff !important;
    border: 1px solid #b9cec1 !important;
    border-radius: 6px !important;
    box-shadow: none !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-field input:focus,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-field select:focus,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-field textarea:focus {
    border-color: var(--garden-green) !important;
    box-shadow: 0 0 0 3px rgba(47, 107, 85, .13) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-field input::placeholder,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-field textarea::placeholder {
    color: #96a39c !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-form-card > button,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-pay-submit button,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-zone-transfer-confirm-btn {
    color: #ffffff !important;
    background: var(--garden-green) !important;
    border: 1px solid var(--garden-green) !important;
    border-radius: 6px !important;
    box-shadow: none !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-table-wrap {
    color: var(--garden-ink) !important;
    background: #ffffff !important;
    border: 1px solid var(--garden-line) !important;
    border-radius: 6px !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-table th {
    color: #55665d !important;
    background: var(--garden-soft) !important;
    border-color: #dce9e1 !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-table td {
    color: var(--garden-ink) !important;
    background: #ffffff !important;
    border-color: #e4eee8 !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-player-table tbody tr:hover td {
    background: #f6faf7 !important;
}

/* Cumulative rewards */
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-recharge-reward-preview,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-recharge-reward-preview.is-wallet-compact {
    padding: 18px !important;
    background: #ffffff !important;
    border-color: var(--garden-line) !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-recharge-reward-progress-card,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-recharge-reward-preview.is-wallet-compact .s33-recharge-reward-progress-card {
    padding: 15px !important;
    color: var(--garden-ink) !important;
    background: var(--garden-soft) !important;
    border: 1px solid #cfe0d6 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
}

html.fi body.fi-body.fi-panel-player .s33-recharge-reward-progress-grid.is-single {
    grid-template-columns: minmax(0, 1fr) !important;
}

html.fi body.fi-body.fi-panel-player .s33-recharge-reward-tier-list.is-full-catalog {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

html.fi body.fi-body.fi-panel-player .s33-recharge-reward-progress-card.is-complete .s33-recharge-reward-next {
    background: #eef6f1 !important;
    border-color: #b8d3c2 !important;
}

html.fi body.fi-body.fi-panel-player .s33-recharge-reward-progress-card__head span,
html.fi body.fi-body.fi-panel-player .s33-recharge-reward-next span {
    color: var(--garden-coral) !important;
}

html.fi body.fi-body.fi-panel-player .s33-recharge-reward-progress-card__head strong,
html.fi body.fi-body.fi-panel-player .s33-recharge-reward-next strong,
html.fi body.fi-body.fi-panel-player .s33-recharge-reward-tier > strong {
    color: var(--garden-green-dark) !important;
}

html.fi body.fi-body.fi-panel-player .s33-recharge-reward-progress-card__head em,
html.fi body.fi-body.fi-panel-player .s33-recharge-reward-next em,
html.fi body.fi-body.fi-panel-player .s33-recharge-reward-tier > p,
html.fi body.fi-body.fi-panel-player .s33-recharge-reward-tier > small {
    color: var(--garden-muted) !important;
}

html.fi body.fi-body.fi-panel-player .s33-recharge-reward-next,
html.fi body.fi-body.fi-panel-player .s33-recharge-reward-tier,
html.fi body.fi-body.fi-panel-player .s33-recharge-reward-items div {
    color: var(--garden-ink) !important;
    background: #ffffff !important;
    border: 1px solid var(--garden-line) !important;
    border-radius: 7px !important;
}

html.fi body.fi-body.fi-panel-player .s33-recharge-reward-next button {
    color: #ffffff !important;
    background: var(--garden-coral) !important;
    border-radius: 6px !important;
    box-shadow: none !important;
}

html.fi body.fi-body.fi-panel-player .s33-recharge-reward-bar {
    background: #dbe8e0 !important;
    border-color: #c8d9cf !important;
}

html.fi body.fi-body.fi-panel-player .s33-recharge-reward-bar i {
    background: var(--garden-green) !important;
    box-shadow: none !important;
}

html.fi body.fi-body.fi-panel-player .s33-recharge-reward-tier__title b {
    color: var(--garden-coral) !important;
}

html.fi body.fi-body.fi-panel-player .s33-recharge-reward-tier__title span {
    color: #ffffff !important;
    background: var(--garden-gold) !important;
}

html.fi body.fi-body.fi-panel-player .s33-recharge-reward-tier.is-done .s33-recharge-reward-tier__title span {
    color: #ffffff !important;
    background: var(--garden-green) !important;
}

html.fi body.fi-body.fi-panel-player .s33-recharge-reward-items span {
    color: var(--garden-ink) !important;
}

@media (max-width: 760px) {
    html.fi body.fi-body.fi-panel-player .s33-recharge-reward-tier-list.is-full-catalog {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

/* Zone transfer */
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-zone-transfer-board,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-zone-transfer-board.is-locked {
    color: var(--garden-ink) !important;
    background: var(--garden-blue) !important;
    border: 1px solid #c8dfe1 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
}

html.fi body.fi-body.fi-panel-player .s33-zone-transfer-badge {
    color: var(--garden-teal) !important;
    background: #dceff0 !important;
    border-radius: 5px !important;
}

html.fi body.fi-body.fi-panel-player .s33-zone-transfer-board h3,
html.fi body.fi-body.fi-panel-player .s33-zone-transfer-board__stats strong,
html.fi body.fi-body.fi-panel-player .s33-zone-transfer-target__head strong,
html.fi body.fi-body.fi-panel-player .s33-zone-transfer-target__meta b {
    color: var(--garden-green-dark) !important;
}

html.fi body.fi-body.fi-panel-player .s33-zone-transfer-board p,
html.fi body.fi-body.fi-panel-player .s33-zone-transfer-board__stats span,
html.fi body.fi-body.fi-panel-player .s33-zone-transfer-target__meta span {
    color: var(--garden-muted) !important;
}

html.fi body.fi-body.fi-panel-player .s33-zone-transfer-shortfall b,
html.fi body.fi-body.fi-panel-player .s33-zone-transfer-board__stats em {
    color: var(--garden-coral) !important;
}

html.fi body.fi-body.fi-panel-player .s33-zone-transfer-recharge {
    color: #ffffff !important;
    background: var(--garden-coral) !important;
    border-radius: 6px !important;
    box-shadow: none !important;
}

html.fi body.fi-body.fi-panel-player .s33-zone-transfer-board__stats div,
html.fi body.fi-body.fi-panel-player .s33-zone-transfer-target__meta div {
    color: var(--garden-ink) !important;
    background: #ffffff !important;
    border: 1px solid #d2e2d8 !important;
    border-radius: 7px !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-zone-transfer-rule-card {
    background: var(--garden-pink) !important;
    border-color: #ead4d6 !important;
}

html.fi body.fi-body.fi-panel-player .s33-zone-transfer-rule-card strong {
    color: var(--garden-coral) !important;
}

html.fi body.fi-body.fi-panel-player .s33-zone-transfer-rule-card p {
    color: var(--garden-ink) !important;
}

html.fi body.fi-body.fi-panel-player .s33-zone-transfer-rule-card .is-danger {
    color: #9e3f37 !important;
}

html.fi body.fi-body.fi-panel-player .s33-player-page .s33-zone-transfer-target,
html.fi body.fi-body.fi-panel-player .s33-player-page .s33-zone-transfer-empty {
    background: #ffffff !important;
    border-color: var(--garden-line) !important;
}

html.fi body.fi-body.fi-panel-player .s33-zone-transfer-target__head span {
    color: var(--garden-teal) !important;
    background: var(--garden-blue) !important;
    border-radius: 5px !important;
}

html.fi body.fi-body.fi-panel-player .s33-zone-transfer-target__status {
    color: #84601e !important;
    background: #fff5dc !important;
    border-radius: 6px !important;
}

html.fi body.fi-body.fi-panel-player .s33-zone-transfer-target__status.is-ok {
    color: var(--garden-green-dark) !important;
    background: var(--garden-soft) !important;
}

/* Confirmation and payment dialogs */
html.fi body.fi-body.fi-panel-player .s33-confirm-modal,
html.fi body.fi-body.fi-panel-player .s33-player-pay-modal {
    background: rgba(33, 77, 62, .54) !important;
}

html.fi body.fi-body.fi-panel-player .s33-confirm-modal__dialog,
html.fi body.fi-body.fi-panel-player .s33-player-pay-dialog {
    color: var(--garden-ink) !important;
    background: #ffffff !important;
    border: 1px solid var(--garden-line) !important;
    border-radius: 8px !important;
    box-shadow: 0 30px 80px rgba(33, 77, 62, .25) !important;
}

html.fi body.fi-body.fi-panel-player .s33-confirm-modal__head span,
html.fi body.fi-body.fi-panel-player .s33-player-pay-dialog__head span {
    color: var(--garden-coral) !important;
    background: var(--garden-pink) !important;
    border-color: #ead4d6 !important;
}

html.fi body.fi-body.fi-panel-player .s33-confirm-modal__head strong,
html.fi body.fi-body.fi-panel-player .s33-player-pay-dialog__head strong {
    color: var(--garden-green-dark) !important;
}

html.fi body.fi-body.fi-panel-player .s33-confirm-modal__head p,
html.fi body.fi-body.fi-panel-player .s33-player-pay-dialog__head p,
html.fi body.fi-body.fi-panel-player .s33-player-pay-tip {
    color: var(--garden-muted) !important;
}

html.fi body.fi-body.fi-panel-player .s33-confirm-modal__body div {
    color: var(--garden-ink) !important;
    background: var(--garden-soft) !important;
    border-color: var(--garden-line) !important;
}

html.fi body.fi-body.fi-panel-player .s33-confirm-modal__body span {
    color: var(--garden-muted) !important;
}

html.fi body.fi-body.fi-panel-player .s33-confirm-modal__body strong {
    color: var(--garden-coral) !important;
}

html.fi body.fi-body.fi-panel-player .s33-confirm-modal__actions {
    background: rgba(247, 250, 248, .98) !important;
    border-top-color: var(--garden-line) !important;
}

html.fi body.fi-body.fi-panel-player .s33-confirm-modal__actions .is-primary,
html.fi body.fi-body.fi-panel-player .s33-player-pay-submit button {
    color: #ffffff !important;
    background: var(--garden-green) !important;
    box-shadow: none !important;
}

html.fi body.fi-body.fi-panel-player .s33-confirm-modal__actions .is-ghost,
html.fi body.fi-body.fi-panel-player .s33-player-pay-orders {
    color: var(--garden-green-dark) !important;
    background: var(--garden-soft) !important;
    border-color: var(--garden-line) !important;
}

[x-cloak] { display: none !important; }

@media (max-width: 1180px) {
    html.fi body.fi-body.fi-panel-player .wdhysj-mall-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .zxr-player-services__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1023px) {
    html.fi body.fi-body.fi-panel-player {
        background-attachment: scroll !important;
    }

    html.fi body.fi-body.fi-panel-player .fi-sidebar,
    html.fi body.fi-body.fi-panel-player .fi-sidebar-close-overlay,
    html.fi body.fi-body.fi-panel-player .fi-topbar {
        display: none !important;
    }

    html.fi body.fi-body.fi-panel-player .fi-main-ctn {
        width: 100% !important;
        margin-inline-start: 0 !important;
        background: #f7faf8 !important;
    }

    html.fi body.fi-body.fi-panel-player .fi-main {
        width: 100% !important;
        max-width: none !important;
        min-height: 100svh !important;
        padding: 14px 14px calc(88px + env(safe-area-inset-bottom)) !important;
        margin: 0 !important;
    }

    .zxr-player-mobile-shell { display: block !important; }

    .zxr-player-mobile-nav {
        position: fixed !important;
        inset: auto 0 0 !important;
        z-index: 80 !important;
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        min-height: calc(66px + env(safe-area-inset-bottom)) !important;
        padding: 5px max(8px, env(safe-area-inset-right)) env(safe-area-inset-bottom) max(8px, env(safe-area-inset-left)) !important;
        background: rgba(255, 255, 255, .98) !important;
        border-top: 1px solid var(--garden-line) !important;
        box-shadow: 0 -10px 28px rgba(47, 107, 85, .14) !important;
        backdrop-filter: blur(16px) !important;
    }

    .zxr-player-mobile-nav a,
    .zxr-player-mobile-nav button {
        color: #78867e !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }

    .zxr-player-mobile-nav a.is-active,
    .zxr-player-mobile-nav button.is-active {
        color: var(--garden-green) !important;
    }

    .zxr-player-mobile-nav a.is-active::before,
    .zxr-player-mobile-nav button.is-active::before {
        background: var(--garden-coral) !important;
    }

    .zxr-player-mobile-sheet-backdrop {
        background: rgba(25, 52, 43, .42) !important;
    }

    .zxr-player-mobile-sheet {
        color: var(--garden-ink) !important;
        background-color: #f7faf8 !important;
        background-image: url('/images/wdhysj/client/garden-bg.png') !important;
        background-position: center top !important;
        background-size: cover !important;
        border: 1px solid var(--garden-line) !important;
        border-radius: 8px !important;
        box-shadow: 0 24px 60px rgba(33, 77, 62, .24) !important;
    }

    .zxr-player-mobile-sheet__grid a {
        color: var(--garden-ink) !important;
        background: rgba(255, 255, 255, .92) !important;
        border: 1px solid var(--garden-line) !important;
        border-radius: 7px !important;
    }

    .zxr-player-mobile-sheet__grid a.is-active {
        border-color: var(--garden-green) !important;
        box-shadow: inset 3px 0 var(--garden-green) !important;
    }

    .zxr-player-mobile-sheet__grid a > svg:first-child {
        color: var(--garden-coral) !important;
    }

    .zxr-player-home-hero {
        grid-template-columns: minmax(0, 1fr) 310px !important;
        min-height: 292px !important;
    }

    .zxr-player-home-hero__copy {
        padding: 28px 26px !important;
    }

    .zxr-player-home-hero h1 {
        font-size: 34px !important;
    }

    .zxr-player-home-hero__art {
        right: 55px !important;
        bottom: -34px !important;
        width: 300px !important;
    }

    html.fi body.fi-body.fi-panel-player .zxr-player-home-hero > .zxr-player-home-hero__art {
        right: 55px !important;
        bottom: -34px !important;
        width: 300px !important;
    }

    .zxr-player-home-hero__florist {
        right: -16px !important;
        width: 190px !important;
    }

    html.fi body.fi-body.fi-panel-player .zxr-player-home-hero > .zxr-player-home-hero__florist {
        right: -16px !important;
        width: 190px !important;
    }

    html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero {
        grid-template-columns: minmax(0, 1fr) 280px !important;
        min-height: 220px !important;
        padding: 24px !important;
    }

    .zxr-player-feature-hero__art {
        right: 58px !important;
        width: 250px !important;
    }

    html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero > .zxr-player-feature-hero__art {
        right: 58px !important;
        width: 250px !important;
    }

    .zxr-player-feature-hero__florist {
        right: -4px !important;
        width: 165px !important;
    }

    html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero > .zxr-player-feature-hero__florist {
        right: -4px !important;
        width: 165px !important;
    }

    html.fi body.fi-body.fi-panel-player .s33-player-nav { display: none !important; }

    .zxr-player-home-wallet-grid {
        grid-template-columns: 1fr !important;
    }

    .zxr-player-services__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 700px) {
    .zxr-player-home-hero,
    html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero {
        grid-template-columns: 1fr !important;
        min-height: 330px !important;
        padding: 0 !important;
        background-position: 70% center !important;
    }

    .zxr-player-home-hero__copy,
    .zxr-player-feature-hero__copy {
        max-width: 76% !important;
        padding: 24px 20px !important;
    }

    .zxr-player-home-hero h1,
    html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero h2 {
        font-size: 28px !important;
        overflow-wrap: anywhere !important;
    }

    .zxr-player-home-hero p,
    html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero p {
        font-size: 12px !important;
    }

    .zxr-player-home-hero__art,
    .zxr-player-feature-hero__art {
        right: 34px !important;
        bottom: -22px !important;
        width: 230px !important;
    }

    html.fi body.fi-body.fi-panel-player .zxr-player-home-hero > .zxr-player-home-hero__art,
    html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero > .zxr-player-feature-hero__art {
        right: 34px !important;
        bottom: -22px !important;
        width: 230px !important;
    }

    .zxr-player-home-hero__florist,
    .zxr-player-feature-hero__florist {
        right: -24px !important;
        bottom: -42px !important;
        width: 158px !important;
    }

    html.fi body.fi-body.fi-panel-player .zxr-player-home-hero > .zxr-player-home-hero__florist,
    html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero > .zxr-player-feature-hero__florist {
        right: -24px !important;
        bottom: -42px !important;
        width: 158px !important;
    }

    .zxr-player-balance,
    html.fi body.fi-body.fi-panel-player .s33-player-metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .zxr-player-balance > div + div,
    html.fi body.fi-body.fi-panel-player .s33-player-metric-grid article + article {
        border-left: 0 !important;
    }

    .zxr-player-balance > div:nth-child(even),
    html.fi body.fi-body.fi-panel-player .s33-player-metric-grid article:nth-child(even) {
        border-left: 1px solid var(--garden-line) !important;
    }

    .zxr-player-balance > div:nth-child(n + 3),
    html.fi body.fi-body.fi-panel-player .s33-player-metric-grid article:nth-child(n + 3) {
        border-top: 1px solid var(--garden-line) !important;
    }

    .zxr-player-services__grid,
    html.fi body.fi-body.fi-panel-player .wdhysj-mall-grid,
    html.fi body.fi-body.fi-panel-player .s33-player-form-grid {
        grid-template-columns: 1fr !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-mall__head,
    html.fi body.fi-body.fi-panel-player .wdhysj-mall-group > header {
        align-items: flex-start !important;
        flex-direction: column !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-mall__legend {
        justify-content: flex-start !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-mall-card {
        grid-template-rows: 132px 1fr auto !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-mall-card__footer {
        align-items: stretch !important;
        flex-direction: column !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-mall-card__pay,
    html.fi body.fi-body.fi-panel-player .wdhysj-mall-card__footer button {
        width: 100% !important;
        justify-content: center !important;
    }
}

@media (max-width: 420px) {
    html.fi body.fi-body.fi-panel-player .fi-main {
        padding-inline: 10px !important;
    }

    .zxr-player-home-hero,
    html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero {
        min-height: 350px !important;
    }

    .zxr-player-home-hero__copy,
    .zxr-player-feature-hero__copy {
        max-width: 82% !important;
        padding: 20px 16px !important;
    }

    .zxr-player-home-hero__logo,
    .zxr-player-feature-hero__logo {
        width: 108px !important;
    }

    .zxr-player-home-hero h1,
    html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero h2 {
        font-size: 25px !important;
    }

    .zxr-player-home-hero__identity,
    html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero .s33-player-identity {
        gap: 5px !important;
    }

    .zxr-player-home-hero__identity span,
    html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero .s33-player-identity span,
    html.fi body.fi-body.fi-panel-player .s33-switch-account-btn {
        min-height: 27px !important;
        padding: 5px 7px !important;
        font-size: 10px !important;
    }

    .zxr-player-home-hero__art,
    .zxr-player-feature-hero__art {
        right: 18px !important;
        width: 210px !important;
    }

    html.fi body.fi-body.fi-panel-player .zxr-player-home-hero > .zxr-player-home-hero__art,
    html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero > .zxr-player-feature-hero__art {
        right: 18px !important;
        width: 210px !important;
    }

    .zxr-player-home-hero__florist,
    .zxr-player-feature-hero__florist {
        right: -30px !important;
        width: 148px !important;
    }

    html.fi body.fi-body.fi-panel-player .zxr-player-home-hero > .zxr-player-home-hero__florist,
    html.fi body.fi-body.fi-panel-player .zxr-player-feature-hero > .zxr-player-feature-hero__florist {
        right: -30px !important;
        width: 148px !important;
    }

    .zxr-player-service {
        min-height: 100px !important;
        padding: 14px !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-mall-items {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

/* Login-entry offer showcase. It uses the verified mall payload and keeps
   the artwork motion light enough for a repeated player-center entry. */
html.fi body.fi-body.fi-panel-player.wdhysj-entry-offer-open {
    overflow: hidden !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 100020 !important;
    display: grid !important;
    place-items: center !important;
    padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)) !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    background: rgba(27, 67, 52, .58) !important;
    backdrop-filter: blur(10px) saturate(1.08) !important;
    transition: opacity .24s ease !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal.is-open {
    opacity: 1 !important;
    pointer-events: auto !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__scrim {
    position: absolute !important;
    inset: 0 !important;
    cursor: pointer !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__dialog {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    width: min(980px, 100%) !important;
    max-height: min(820px, calc(100dvh - 32px)) !important;
    flex-direction: column !important;
    overflow: auto !important;
    color: var(--garden-ink) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .96), rgba(247, 251, 246, .98) 55%, rgba(255, 247, 239, .98)) !important;
    border: 1px solid rgba(47, 107, 85, .20) !important;
    border-radius: 14px !important;
    box-shadow: 0 36px 100px rgba(25, 67, 50, .32) !important;
    transform: translateY(16px) scale(.985) !important;
    transition: transform .34s cubic-bezier(.22, 1.18, .36, 1), opacity .24s ease !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal.is-open .wdhysj-entry-offer-modal__dialog {
    transform: translateY(0) scale(1) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__dialog::before {
    content: '';
    position: absolute;
    inset: 0 0 auto;
    height: 5px;
    pointer-events: none;
    background: linear-gradient(90deg, #2f6b55, #e2a34e 48%, #c85d50) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__close {
    position: absolute !important;
    top: 14px !important;
    right: 14px !important;
    z-index: 3 !important;
    display: grid !important;
    width: 34px !important;
    height: 34px !important;
    place-items: center !important;
    color: var(--garden-green-dark) !important;
    background: rgba(255, 255, 255, .78) !important;
    border: 1px solid var(--garden-line) !important;
    border-radius: 50% !important;
    cursor: pointer !important;
    transition: background .18s ease, transform .18s ease !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__close:hover,
html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__close:focus-visible {
    background: #fff !important;
    outline: 2px solid rgba(47, 107, 85, .28) !important;
    outline-offset: 2px !important;
    transform: rotate(8deg) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__close svg {
    width: 17px !important;
    height: 17px !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__head {
    position: relative !important;
    padding: 30px 58px 18px 30px !important;
    background:
        linear-gradient(105deg, rgba(238, 247, 241, .96), rgba(255, 255, 255, .72)),
        url('/images/wdhysj/client/garden-bg.png') center 30% / cover !important;
    border-bottom: 1px solid var(--garden-line) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__eyebrow {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    color: var(--garden-teal) !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__eyebrow img {
    width: 42px !important;
    height: 24px !important;
    object-fit: contain !important;
    object-position: left center !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__head h2 {
    max-width: 720px !important;
    margin: 11px 0 4px !important;
    color: var(--garden-green-dark) !important;
    font-size: 32px !important;
    font-weight: 850 !important;
    line-height: 1.18 !important;
    overflow-wrap: anywhere !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__head p {
    max-width: 700px !important;
    margin: 0 !important;
    color: var(--garden-muted) !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__offers {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
    padding: 18px 22px 20px !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card {
    display: grid !important;
    min-width: 0 !important;
    grid-template-columns: minmax(128px, 35%) minmax(0, 1fr) !important;
    overflow: hidden !important;
    color: inherit !important;
    text-decoration: none !important;
    background: #fff !important;
    border: 1px solid var(--garden-line) !important;
    border-radius: 10px !important;
    box-shadow: 0 10px 26px rgba(47, 107, 85, .08) !important;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card:hover,
html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card:focus-visible {
    border-color: rgba(47, 107, 85, .46) !important;
    box-shadow: 0 16px 32px rgba(47, 107, 85, .16) !important;
    outline: 2px solid rgba(47, 107, 85, .20) !important;
    outline-offset: 2px !important;
    transform: translateY(-2px) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__visual {
    position: relative !important;
    min-height: 260px !important;
    overflow: hidden !important;
    isolation: isolate !important;
    background: var(--garden-soft) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__visual::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(33, 77, 62, .02), rgba(33, 77, 62, .24)) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card.is-chengxing .wdhysj-entry-offer-card__visual::after {
    background: linear-gradient(180deg, rgba(40, 119, 122, .04), rgba(47, 107, 85, .30)) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card.is-chiyan .wdhysj-entry-offer-card__visual::after {
    background: linear-gradient(180deg, rgba(200, 93, 80, .08), rgba(156, 67, 52, .34)) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__visual-bg {
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    filter: saturate(.96) !important;
    transform: scale(1.04) !important;
    transition: transform .6s ease, filter .3s ease !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__native-art {
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center top !important;
    opacity: .74 !important;
    mix-blend-mode: screen !important;
    filter: saturate(1.08) drop-shadow(0 7px 12px rgba(26, 65, 83, .18)) !important;
    pointer-events: none !important;
    transform: translateY(0) scale(1.01) !important;
    animation: wdhysj-entry-offer-native-float 7s ease-in-out infinite !important;
    transition: transform .6s ease, opacity .3s ease !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card.is-chiyan .wdhysj-entry-offer-card__native-art {
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    opacity: .78 !important;
    mix-blend-mode: normal !important;
    filter: saturate(1.12) drop-shadow(0 8px 12px rgba(126, 49, 37, .24)) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card:hover .wdhysj-entry-offer-card__native-art,
html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card:focus-visible .wdhysj-entry-offer-card__native-art {
    opacity: .82 !important;
    transform: translateY(-4px) scale(1.05) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card:hover .wdhysj-entry-offer-card__visual-bg,
html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card:focus-visible .wdhysj-entry-offer-card__visual-bg {
    filter: saturate(1.12) !important;
    transform: scale(1.10) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__shine {
    position: absolute !important;
    top: -18% !important;
    left: -45% !important;
    z-index: 2 !important;
    width: 40% !important;
    height: 140% !important;
    background: rgba(255, 255, 255, .46) !important;
    transform: rotate(18deg) !important;
    animation: wdhysj-entry-offer-sweep 5.8s ease-in-out infinite !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__outfit {
    position: absolute !important;
    right: 50% !important;
    bottom: 24px !important;
    z-index: 2 !important;
    width: min(154px, 92%) !important;
    height: 188px !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    filter: drop-shadow(0 12px 14px rgba(33, 77, 62, .28)) !important;
    transform: translateX(50%) !important;
    animation: wdhysj-entry-offer-float 3.8s ease-in-out infinite !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card.is-chiyan .wdhysj-entry-offer-card__outfit {
    filter: drop-shadow(0 12px 14px rgba(156, 67, 52, .34)) saturate(1.12) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__theme {
    position: absolute !important;
    left: 10px !important;
    bottom: 10px !important;
    z-index: 3 !important;
    padding: 5px 8px !important;
    color: #fff !important;
    background: rgba(33, 77, 62, .72) !important;
    border: 1px solid rgba(255, 255, 255, .40) !important;
    border-radius: 5px !important;
    font-size: 10px !important;
    font-weight: 750 !important;
    line-height: 1.2 !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card.is-chiyan .wdhysj-entry-offer-card__theme {
    background: rgba(156, 67, 52, .78) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__body {
    display: flex !important;
    min-width: 0 !important;
    flex-direction: column !important;
    padding: 16px 15px 14px !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__title {
    display: grid !important;
    gap: 5px !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__title span {
    width: fit-content !important;
    max-width: 100% !important;
    padding: 4px 7px !important;
    color: var(--garden-coral) !important;
    background: var(--garden-pink) !important;
    border-radius: 4px !important;
    font-size: 9px !important;
    font-weight: 800 !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__title strong {
    color: var(--garden-green-dark) !important;
    font-size: 16px !important;
    line-height: 1.34 !important;
    overflow-wrap: anywhere !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__price {
    display: flex !important;
    align-items: baseline !important;
    gap: 5px !important;
    margin-top: 9px !important;
    color: var(--garden-coral) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__price b {
    font-size: 27px !important;
    line-height: 1 !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__price span {
    color: var(--garden-muted) !important;
    font-size: 11px !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__body > p {
    min-height: 38px !important;
    margin: 7px 0 10px !important;
    color: var(--garden-muted) !important;
    font-size: 11px !important;
    line-height: 1.55 !important;
    overflow-wrap: anywhere !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__items {
    display: flex !important;
    min-width: 0 !important;
    max-height: 74px !important;
    gap: 5px !important;
    padding: 5px 0 8px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: thin !important;
    scrollbar-color: rgba(47, 107, 85, .28) transparent !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-item {
    position: relative !important;
    display: grid !important;
    flex: 0 0 44px !important;
    width: 44px !important;
    height: 54px !important;
    place-items: center !important;
    padding: 3px !important;
    background: var(--garden-soft) !important;
    border: 1px solid var(--garden-line) !important;
    border-radius: 5px !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-item img {
    width: 34px !important;
    height: 34px !important;
    object-fit: contain !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-item em {
    position: absolute !important;
    right: 2px !important;
    bottom: 1px !important;
    max-width: calc(100% - 4px) !important;
    padding: 1px 3px !important;
    color: #fff !important;
    background: rgba(33, 77, 62, .78) !important;
    border-radius: 3px !important;
    font-size: 8px !important;
    font-style: normal !important;
    line-height: 1.1 !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-item__fallback {
    display: grid !important;
    width: 30px !important;
    height: 30px !important;
    place-items: center !important;
    color: var(--garden-teal) !important;
    border: 1px dashed var(--garden-teal) !important;
    border-radius: 50% !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__item-count {
    display: block !important;
    margin-top: 2px !important;
    color: var(--garden-muted) !important;
    font-size: 9px !important;
    line-height: 1.3 !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__cta {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    margin-top: auto !important;
    padding-top: 10px !important;
    color: var(--garden-green) !important;
    border-top: 1px solid var(--garden-line) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__cta svg {
    width: 13px !important;
    height: 13px !important;
    transition: transform .18s ease !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card:hover .wdhysj-entry-offer-card__cta svg,
html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card:focus-visible .wdhysj-entry-offer-card__cta svg {
    transform: translate(2px, -2px) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__foot {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    padding: 13px 22px max(15px, env(safe-area-inset-bottom)) !important;
    color: var(--garden-muted) !important;
    background: rgba(238, 247, 241, .74) !important;
    border-top: 1px solid var(--garden-line) !important;
    font-size: 10px !important;
    line-height: 1.45 !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__foot > div {
    display: flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    gap: 8px !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__primary,
html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__secondary {
    display: inline-flex !important;
    min-height: 38px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 8px 13px !important;
    border-radius: 5px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: transform .18s ease, filter .18s ease !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__primary {
    color: #fff !important;
    background: var(--garden-green) !important;
    box-shadow: 0 8px 18px rgba(47, 107, 85, .20) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__secondary {
    color: var(--garden-green-dark) !important;
    background: #fff !important;
    border: 1px solid var(--garden-line) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__primary:hover,
html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__secondary:hover,
html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__primary:focus-visible,
html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__secondary:focus-visible {
    filter: brightness(1.04) !important;
    outline: 2px solid rgba(47, 107, 85, .22) !important;
    outline-offset: 2px !important;
    transform: translateY(-1px) !important;
}

html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__primary svg {
    width: 14px !important;
    height: 14px !important;
}

@keyframes wdhysj-entry-offer-float {
    0%, 100% { transform: translateX(50%) translateY(0) rotate(-1deg); }
    50% { transform: translateX(50%) translateY(-7px) rotate(1deg); }
}

@keyframes wdhysj-entry-offer-native-float {
    0%, 100% { transform: translateY(0) scale(1.01); }
    50% { transform: translateY(-3px) scale(1.025); }
}

@keyframes wdhysj-entry-offer-sweep {
    0%, 52% { opacity: 0; transform: translateX(0) rotate(18deg); }
    66%, 82% { opacity: .34; }
    100% { opacity: 0; transform: translateX(510%) rotate(18deg); }
}

@media (max-width: 760px) {
    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal {
        place-items: end center !important;
        padding: 8px !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__dialog {
        width: 100% !important;
        max-height: calc(100dvh - 16px) !important;
        border-radius: 10px 10px 8px 8px !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__head {
        padding: 25px 52px 14px 18px !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__head h2 {
        font-size: 24px !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__head p {
        font-size: 11px !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__offers {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        padding: 12px !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card {
        grid-template-columns: 104px minmax(0, 1fr) !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__visual {
        min-height: 190px !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__outfit {
        width: 94px !important;
        height: 118px !important;
        bottom: 26px !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__native-art {
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__body {
        padding: 12px 11px 11px !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__title strong {
        font-size: 14px !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__price b {
        font-size: 23px !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__body > p {
        min-height: 0 !important;
        margin: 5px 0 7px !important;
        font-size: 10px !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__items {
        max-height: 61px !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__foot {
        align-items: flex-start !important;
        flex-direction: column !important;
        padding: 11px 12px max(12px, env(safe-area-inset-bottom)) !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__foot > div {
        width: 100% !important;
    }

    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__primary,
    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__secondary {
        flex: 1 1 0 !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal,
    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-modal__dialog,
    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card,
    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__visual-bg,
    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__native-art,
    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__outfit,
    html.fi body.fi-body.fi-panel-player .wdhysj-entry-offer-card__shine {
        animation: none !important;
        transition: none !important;
    }
}

html.fi body.fi-body.fi-panel-player [id^='wdhysj-product-'] {
    scroll-margin-top: 82px !important;
}

html.fi body.fi-body.fi-panel-player [data-wdhysj-product-sku]:target {
    outline: 3px solid rgba(47, 107, 85, .30) !important;
    outline-offset: 5px !important;
}
