/* ==========================================================================
   forest - camada V7
   --------------------------------------------------------------------------
   ADITIVO: carrega por ULTIMO. Nunca redefine classe que o CSS original do
   tema ja estiliza (gerado/filtrado com cssfilter.pl). Cores so via --v7-*.
   Conteudo CLARO (pergaminho, texto #230707/#4e1910, cobre #c07334). Regioes ESCURAS
   (sidebars .widget, menu, .status-block, footer) redefinem os tokens escopados no fim.
   ========================================================================== */

:root {
    --v7-bg: #1a100a;
    --v7-bg-rgb: 26, 16, 10;
    --v7-surface: #f6ead0;
    --v7-card: #fdf6e0;
    --v7-card-rgb: 253, 246, 224;
    --v7-sunken: #efe0c0;
    --v7-sidebar: #f3e4c4;
    --v7-primary: #c07334;
    --v7-primary-rgb: 192, 115, 52;
    --v7-primary-bright: #d98a45;
    --v7-primary-bright-rgb: 217, 138, 69;
    --v7-primary-hover: #774318;
    --v7-accent: #774318;
    --v7-accent-rgb: 119, 67, 24;
    --v7-accent-hover: #4e1910;
    --v7-text: #230707;
    --v7-muted: #7a5a45;
    --v7-muted-rgb: 122, 90, 69;
    --v7-line: #c09074;
    --v7-line-soft: #d8b89c;
    --v7-shadow: 0 5px 15px rgba(78, 25, 16, .18);
    --v7-success-bg: rgba(45, 90, 39, .12);
    --v7-success-fg: #2d5a27;
    --v7-warning-bg: rgba(255, 193, 7, .2);
    --v7-warning-fg: #8a6300;
    --v7-danger-bg: rgba(139, 0, 0, .1);
    --v7-danger-fg: #8b0000;
    --v7-info-bg: rgba(13, 202, 240, .14);
    --v7-info-fg: #087990;
    --v7-primary-soft: rgba(192, 115, 52, .15);
}

/* ==========================================================================
   Componentes V7 (uniao das camadas v7.css ja validadas em darkside/fatal/unique,
   filtrada pelas classes que ESTE tema emite - usedfilter.pl - e sem redefinir
   classe que o CSS original do tema ja estiliza - cssfilter.pl).
   ========================================================================== */

.checkout-layout {
    align-items: flex-start;
}

.checkout-pending {
    display: flex;
    gap: .85rem;
    padding: 1rem 1.25rem;
    margin-bottom: 1.5rem;
    background: var(--v7-warning-bg);
    border: 1px solid rgba(255, 193, 7, .35);
    color: var(--v7-text);
}

.checkout-pending-body {
    flex: 1;
    min-width: 0;
}

.checkout-pending-list {
    display: flex;
    flex-direction: column;
    gap: .4rem;
    margin-top: .5rem;
}

.checkout-pending-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .5rem .75rem;
    background: var(--v7-card);
    border: 1px solid var(--v7-line);
    text-decoration: none;
    color: var(--v7-text);
    font-size: .875rem;
}

.checkout-pending-item:hover {
    color: var(--v7-accent-hover);
    border-color: var(--v7-primary-bright);
}

.checkout-pending-resume {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    color: var(--v7-accent);
    font-weight: 600;
    white-space: nowrap;
}

.checkout-pending-resume .material-symbols-outlined {
    font-size: 1rem;
}

.checkout-card {
    overflow: hidden;
    background: var(--v7-card);
    border: 1px solid var(--v7-line);
    box-shadow: var(--v7-shadow);
}

.checkout-step {
    padding: 1.25rem 1.25rem 0;
}

.checkout-step-title {
    margin-bottom: 1rem;
}

.checkout-step-title:before,
.checkout-step-title:after {
    display: none;
}

.checkout-step-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    background: var(--v7-primary);
    color: #fff;
    font-size: .8rem;
    font-weight: 700;
    line-height: 1;
    flex-shrink: 0;
}

.checkout-step-optional {
    font-size: .72rem;
    font-weight: 400;
    color: var(--v7-muted);
    margin-left: .35rem;
}

.checkout-amounts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    gap: .6rem;
    margin-bottom: 1rem;
}

.checkout-amount {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    padding: .9rem .5rem;
    border: 2px solid var(--v7-line);
    background: var(--v7-surface);
    color: var(--v7-text);
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease;
}

.checkout-amount-icon {
    font-size: 1.6rem;
    width: 1.6rem;
    height: 1.6rem;
    color: var(--v7-accent);
}

.checkout-amount-value {
    font-weight: 700;
    font-size: .95rem;
}

.checkout-amount:hover {
    border-color: var(--v7-primary-bright);
}

.checkout-amount.is-active {
    border-color: var(--v7-primary-bright);
    background: var(--v7-primary-soft);
    color: #fff;
}

.checkout-amount-custom .form-label {
    color: var(--v7-muted);
}

.checkout-receive {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-top: 1rem;
    padding: .75rem 1rem;
    background: var(--v7-success-bg);
    border: 1px solid rgba(25, 135, 84, .35);
    color: var(--v7-success-fg);
    font-size: .95rem;
}

.checkout-receive strong {
    font-size: 1.1rem;
}

.checkout-receive-wallet {
    font-weight: 600;
}

.checkout-receive .material-symbols-outlined {
    font-size: 1.25rem;
}

.checkout-gateways {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: .6rem;
}

.checkout-gateway {
    cursor: pointer;
    margin: 0;
}

.checkout-gateway input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.checkout-gateway-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: .4rem;
    padding: .9rem .6rem;
    height: 100%;
    border: 2px solid var(--v7-line);
    background: var(--v7-surface);
    transition: border-color .15s ease, background .15s ease;
}

.checkout-gateway input:checked + .checkout-gateway-card {
    border-color: var(--v7-primary-bright);
    background: var(--v7-primary-soft);
}

.checkout-gateway-logo {
    max-height: 28px;
    max-width: 100%;
    width: auto;
}

.checkout-gateway-name {
    font-weight: 600;
    font-size: .82rem;
    color: var(--v7-text);
}

.checkout-gateway-fee {
    font-size: .68rem;
    font-weight: 600;
    padding: .12rem .4rem;
    background: var(--v7-warning-bg);
    color: var(--v7-warning-fg);
    white-space: nowrap;
}

.checkout-gateway-fee.is-free {
    background: var(--v7-success-bg);
    color: var(--v7-success-fg);
}

.checkout-gateway-check {
    position: absolute;
    top: .4rem;
    right: .4rem;
    font-size: 1.1rem;
    width: 1.1rem;
    height: 1.1rem;
    color: var(--v7-accent);
    opacity: 0;
}

.checkout-gateway input:checked + .checkout-gateway-card .checkout-gateway-check {
    opacity: 1;
}

.checkout-fields {
    margin-top: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.checkout-fields .checkout-field[hidden] {
    display: none;
}

.checkout-summary {
    padding: 1.25rem;
}

.checkout-total {
    margin-bottom: 1rem;
}

.checkout-total[hidden] {
    display: none;
}

.checkout-total-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 1rem;
    color: var(--v7-text);
}

.checkout-total-row strong {
    font-size: 1.3rem;
}

.checkout-total-discount {
    margin-bottom: .35rem;
    font-size: .9rem;
    color: var(--v7-success-fg);
}

.checkout-total-discount strong {
    font-size: .95rem;
}

.checkout-total-discount[hidden] {
    display: none;
}

.checkout-total-fee {
    display: block;
    margin-top: .25rem;
    font-size: .8rem;
    color: var(--v7-muted);
}

.checkout-total-fee[hidden] {
    display: none;
}

.checkout-coupon-feedback {
    display: block;
    margin-top: .5rem;
    font-size: .85rem;
    font-weight: 600;
    color: var(--v7-danger-fg);
}

.checkout-coupon-feedback[hidden] {
    display: none;
}

.checkout-continue {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
}

.checkout-continue-icon {
    font-size: 1.25rem;
    width: 1.25rem;
    height: 1.25rem;
    line-height: 1;
}

.checkout-bank {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-top: 1rem;
    padding: .85rem 1.25rem;
    background: var(--v7-sunken);
    border: 1px solid var(--v7-line);
    text-decoration: none;
    color: var(--v7-text);
    font-weight: 600;
}

.checkout-bank:hover {
    border-color: var(--v7-primary-bright);
    color: var(--v7-accent-hover);
}

.checkout-bank-icon {
    font-size: 1.4rem;
}

.checkout-bank > .material-symbols-outlined:last-child {
    margin-left: auto;
}

.checkout-history-title {
    margin: 0 0 1rem;
}

.checkout-history-title:before,
.checkout-history-title:after {
    display: none;
}

.checkout-history-grid {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.checkout-history-item {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: .85rem 1rem;
    background: var(--v7-card);
    border: 1px solid var(--v7-line);
    box-shadow: var(--v7-shadow);
}

.checkout-history-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    background: var(--v7-sunken);
}

.checkout-history-logo img {
    max-height: 22px;
    max-width: 32px;
    width: auto;
}

.checkout-history-body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}

.checkout-history-body strong {
    color: var(--v7-text);
}

.checkout-history-date {
    font-size: .75rem;
    color: var(--v7-muted);
}

.checkout-history-status {
    flex-shrink: 0;
    align-self: flex-start;
    margin-left: auto;
}

.checkout-history-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    padding: 2.5rem 1rem;
    background: var(--v7-card);
    border: 1px dashed var(--v7-line-soft);
    color: var(--v7-muted);
}

.checkout-history-empty .material-symbols-outlined {
    font-size: 2.5rem;
}

.donate-form-amount {
    display: flex;
    align-items: baseline;
    gap: .35rem;
    padding: .5rem 0 .25rem;
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--v7-text);
    line-height: 1;
}

.donate-pix-qr {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 1.75rem 1rem;
}

.donate-pix-qr img {
    width: 210px;
    height: 210px;
    display: block;
    background: #fff;
    padding: 6px;
}

.donate-pix-info {
    display: flex;
    justify-content: center;
    gap: 2rem;
}

.donate-pix-info-item {
    text-align: center;
}

.donate-pix-info-item-label {
    display: block;
    font-size: .7rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--v7-muted);
    margin-bottom: .2rem;
}

.donate-pix-info-item-value {
    font-weight: 700;
    font-size: 1rem;
    color: var(--v7-text);
}

.donate-pix-steps {
    border-top: 1px solid var(--v7-line);
}

.donate-pix-step {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: .65rem 1rem;
    border-bottom: 1px solid var(--v7-line);
}

.donate-pix-step:last-child {
    border-bottom: none;
}

.donate-pix-step-icon {
    font-size: 1.25rem;
    width: 1.25rem;
    height: 1.25rem;
    color: var(--v7-accent);
    flex-shrink: 0;
    margin-top: .1rem;
}

.donate-pix-step-text {
    font-size: .85rem;
    color: var(--v7-text);
    line-height: 1.5;
}

.donate-pix-copy {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .75rem 1rem;
    background: var(--v7-sunken);
    border-top: 1px solid var(--v7-line);
}

.donate-pix-copy-code {
    flex: 1;
    font-size: .75rem;
    color: var(--v7-muted);
    word-break: break-all;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-family: monospace;
}

.donate-pix-after {
    padding: .65rem 1rem;
    font-size: .8rem;
    color: var(--v7-muted);
    text-align: center;
    border-top: 1px solid var(--v7-line);
}

.donate-pix-success,
.donate-pix-error {
    text-align: center;
    padding: 2.5rem 1.5rem;
}

.donate-pix-success-icon,
.donate-pix-error-icon {
    font-size: 3.5rem;
    width: 3.5rem;
    height: 3.5rem;
    display: block;
    margin: 0 auto 1rem;
}

.donate-pix-success-icon { color: var(--v7-success-fg); }

.donate-pix-error-icon { color: var(--v7-danger-fg); }

.donate-pix-success-title,
.donate-pix-error-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--v7-text);
    margin-bottom: .5rem;
}

.donate-pix-error-title {
    margin-bottom: 1.25rem;
}

.donate-pix-success-text {
    font-size: .9rem;
    color: var(--v7-muted);
    margin-bottom: 1.5rem;
}

.donate-messages {
    list-style: none;
    padding: 0;
    margin: 0;
}

.donate-messages li {
    padding: .75rem 0;
    border-bottom: 1px solid var(--v7-line);
}

.donate-messages li:last-child {
    border-bottom: none;
}

.donate-messages-meta {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .35rem;
    flex-wrap: wrap;
}

.donate-messages-author {
    font-weight: 600;
    font-size: .85rem;
    color: var(--v7-text);
}

.donate-messages-date {
    font-size: .75rem;
    color: var(--v7-muted);
}

.donate-messages-text {
    font-size: .875rem;
    color: var(--v7-text);
    line-height: 1.6;
    width: 100%;
    margin: 0;
}

.card-stat {
    flex: 1;
    background: var(--v7-sunken);
    border: 1px solid var(--v7-line);
    padding: .4rem .55rem;
}

.card-stat-label {
    display: block;
    font-size: .6rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--v7-muted);
    margin-bottom: .2rem;
}

.card-stat-value {
    font-size: .88rem;
    font-weight: 700;
    color: var(--v7-text);
}

.card-stat-value span,
.card-stat-value small {
    font-size: .68rem;
    font-weight: 400;
    color: var(--v7-muted);
}

.card-stat-value--price {
    color: var(--v7-accent);
}

.card-stat--lg .card-stat-value {
    font-size: 1.2rem;
}

.card-stat--lg .card-stat-value span,
.card-stat--lg .card-stat-value small {
    font-size: .8rem;
}

.card-stat-cta {
    display: block;
    margin-top: .3rem;
    font-size: .65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--v7-accent);
    text-decoration: none;
}

.card-stat-cta:hover {
    text-decoration: underline;
    color: var(--v7-accent-hover);
}

.gateway-card {
    display: flex;
    flex-direction: column;
    border: 2px solid var(--v7-line);
    overflow: hidden;
    text-decoration: none;
    transition: border-color .15s ease;
    height: 100%;
}

.gateway-card:hover {
    border-color: var(--v7-primary-bright);
}

.gateway-card-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1.5rem;
    background: var(--v7-sunken);
    flex: 1;
}

.gateway-card-logo img {
    max-height: 48px;
    max-width: 100%;
}

.gateway-card-label {
    padding: .6rem;
    text-align: center;
    font-size: .8rem;
    font-weight: 600;
    color: var(--v7-text);
    background: var(--v7-card);
    border-top: 1px solid var(--v7-line);
}

.plan-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: .75rem;
}

@media (max-width: 575px) {
.plan-cards {
        grid-template-columns: repeat(2, 1fr);
    }
}

.plan-card {
    border: 2px solid var(--v7-line);
    overflow: hidden;
    background: var(--v7-card);
}

.plan-card-header {
    background: var(--v7-sunken);
    padding: 1.1rem .75rem .9rem;
    border-bottom: 1px solid var(--v7-line);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.plan-card-icon {
    font-size: 1.6rem;
    width: 1.6rem;
    height: 1.6rem;
    color: var(--v7-muted);
    opacity: .6;
    margin-bottom: .3rem;
    flex-shrink: 0;
}

.plan-card-name {
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--v7-text);
    line-height: 1.2;
}

.plan-card-category {
    font-size: .62rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: var(--v7-muted);
    background: var(--v7-sunken);
    padding: .4rem .7rem;
    border-top: 1px solid var(--v7-line);
}

.plan-card-featured .plan-card-category {
    background: var(--v7-primary-soft);
    color: var(--v7-text);
    border-top-color: var(--v7-primary-bright);
}

.plan-card-features {
    list-style: none;
    margin: 0;
    padding: 0;
}

.plan-card-feature {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .5rem .7rem;
    font-size: .78rem;
    border-top: 1px solid var(--v7-line);
    line-height: 1.3;
    color: var(--v7-text);
}

.plan-card-feature-icon {
    font-size: .9rem;
    width: .9rem;
    height: .9rem;
    flex-shrink: 0;
}

.plan-card-feature--on .plan-card-feature-icon {
    color: var(--v7-success-fg);
}

.plan-card-feature--off .plan-card-feature-icon {
    color: var(--v7-line-soft);
}

.plan-card-featured {
    border-color: var(--v7-primary-bright);
}

.plan-card-featured .plan-card-header {
    background: var(--v7-primary);
    border-bottom-color: var(--v7-primary-bright);
}

.plan-card-featured .plan-card-icon,
.plan-card-featured .plan-card-name {
    color: #fff;
    opacity: 1;
}

.nav-sidebar-item {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .6rem .85rem;
    background: var(--v7-surface);
    border: 1px solid var(--v7-line);
    border-bottom: none;
    color: var(--v7-text);
    text-decoration: none;
}

.nav-sidebar-item:last-child {
    border-bottom: 1px solid var(--v7-line);
}

.nav-sidebar-item:hover {
    background: var(--v7-primary-hover);
    color: #fff;
}

.nav-sidebar-item--active {
    background: var(--v7-primary);
    color: #fff;
}

.nav-sidebar-logo {
    max-height: 20px;
    max-width: 42px;
    width: auto;
    flex-shrink: 0;
}

.nav-sidebar-name {
    flex: 1;
    min-width: 0;
}

.nav-sidebar-chevron {
    font-size: 1.1rem;
    margin-left: auto;
    opacity: .5;
}

.nav.page-tabs {
    gap: .25rem;
    border-bottom: 1px solid var(--v7-line);
}

.nav.page-tabs .nav-link {
    border: none;
    border-bottom: 2px solid transparent;
    background: none;
    color: var(--v7-muted);
    font-weight: 600;
    padding: .55rem .9rem;
}

.nav.page-tabs .nav-link:hover {
    color: var(--v7-accent);
}

.nav.page-tabs .nav-link.active {
    color: var(--v7-text);
    border-bottom-color: var(--v7-primary-bright);
    background: none;
}

.item-rarity-badge {
    position: absolute;
    top: .35rem;
    left: .35rem;
    padding: .1rem .4rem;
    font-size: .62rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: #fff;
    background: var(--rarity-color, var(--v7-primary));
}

.main-page-builder {
    margin: 0;
}

.page-block {
    padding: 3rem 0;
}

.page-block .container {
    max-width: 1140px;
}

.page-block-guides-title {
    font-family: inherit;
    font-weight: 700;
    color: var(--v7-text);
    margin-bottom: 1rem;
}

.page-block-guides-card {
    display: block;
    padding: 1.1rem 1.25rem;
    background: var(--v7-card);
    border: 1px solid var(--v7-line);
    box-shadow: var(--v7-shadow);
    text-decoration: none;
    height: 100%;
}

.page-block-guides-card:hover {
    border-color: var(--v7-primary-bright);
}

.page-block-guides-card-title {
    font-weight: 700;
    color: var(--v7-text);
    margin-bottom: .3rem;
}

.page-block-guides-card-desc {
    font-size: .85rem;
    color: var(--v7-muted);
    margin: 0;
}

.coupon-item-expire {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    font-size: .72rem;
    color: var(--v7-muted);
}

.coupon-item-expire-icon {
    font-size: .85rem;
}

.achievement-icon-image {
    width: 48px;
    height: 48px;
    object-fit: contain;
}

.achievement-rarity {
    font-size: .7rem;
    color: var(--v7-muted);
}

.achievement-reward-icon {
    font-size: 1.1rem;
    color: var(--v7-accent);
}

.achievement-reward-image {
    max-height: 28px;
    width: auto;
}

.profile-achievements-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
    gap: .5rem;
}

.profile-achievement {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: .25rem;
    padding: .6rem .4rem;
    background: var(--v7-sunken);
    border: 1px solid var(--v7-line);
}

.profile-achievement-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
}

.profile-achievement-icon img {
    width: 2.75rem;
    height: 2.75rem;
    object-fit: contain;
}

.profile-achievement-symbol {
    font-size: 2rem;
    width: 2rem;
    height: 2rem;
    color: var(--v7-warning-fg);
}

.profile-achievement-name {
    font-size: .68rem;
    font-weight: 600;
    color: var(--v7-text);
    line-height: 1.2;
}

.profile-achievement-date {
    font-size: .6rem;
    color: var(--v7-muted);
}

.subscribe-plans {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}

.subscribe-plan {
    background: var(--v7-card);
    border: 2px solid var(--v7-line);
    box-shadow: var(--v7-shadow);
    padding: 1.25rem;
    text-align: center;
}

.subscribe-plan.is-featured {
    border-color: var(--v7-primary-bright);
}

.subscribe-plan-name {
    font-family: inherit;
    font-weight: 700;
    color: var(--v7-text);
    margin-bottom: .35rem;
}

.subscribe-plan-price {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--v7-accent);
    margin-bottom: .75rem;
}

.subscribe-plan-features {
    list-style: none;
    padding: 0;
    margin: 0 0 1rem;
    color: var(--v7-text);
    font-size: .85rem;
}

.subscribe-plan-features li {
    padding: .35rem 0;
    border-top: 1px solid var(--v7-line);
}

.subscribe-billing {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: 1rem;
    color: var(--v7-muted);
}

.battlepass-header,
.battlepass-track,
.battlepass-reward {
    background: var(--v7-card);
    border: 1px solid var(--v7-line);
    color: var(--v7-text);
}

.battlepass-progress {
    background: var(--v7-sunken);
}

.battlepass-progress-bar {
    background: var(--v7-primary);
}

.ticket-rate {
    display: inline-flex;
    gap: .15rem;
}

.ticket-rate-btn {
    background: none;
    border: none;
    padding: 0 .1rem;
    color: var(--v7-line-soft);
    cursor: pointer;
    line-height: 1;
}

.ticket-rate-btn:hover,
.ticket-rate-btn.is-active {
    color: var(--v7-warning-fg);
}

.market-filters-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    margin-bottom: .75rem;
}

.market-filters-clear {
    font-size: .75rem;
    font-weight: 600;
    color: var(--v7-accent);
    text-decoration: none;
    white-space: nowrap;
}

.market-filters-clear:hover {
    color: var(--v7-accent-hover);
    text-decoration: underline;
}

.market-filters-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.25rem;
    height: 1.25rem;
    padding: 0 .3rem;
    margin-left: .35rem;
    background: var(--v7-primary);
    color: #fff;
    font-size: .7rem;
    font-weight: 700;
}

.market-filter-flags {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: .1rem .5rem;
    margin-bottom: .75rem;
}

.market-filter-category .form-check-label {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    width: 100%;
}

.market-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.market-orders {
    display: flex;
    align-items: center;
    gap: .35rem;
    flex-wrap: wrap;
}

.market-orders-label {
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--v7-muted);
}

.market-order {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    padding: .25rem .6rem;
    background: var(--v7-surface);
    border: 1px solid var(--v7-line);
    color: var(--v7-text);
    font-size: .78rem;
    text-decoration: none;
}

.market-order:hover {
    border-color: var(--v7-primary-bright);
    color: var(--v7-accent-hover);
}

.market-order--active {
    background: var(--v7-primary);
    border-color: var(--v7-primary-bright);
    color: #fff;
}

.market-order .material-symbols-outlined {
    font-size: .95rem;
}

.product--rarity {
    border-color: var(--rarity-color, var(--v7-line)) !important;
}

.product-badges {
    display: flex;
    flex-wrap: wrap;
    gap: .2rem;
    margin-bottom: .35rem;
}

.product-badge {
    padding: .05rem .35rem;
    font-size: .62rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    background: var(--v7-sunken);
    border: 1px solid var(--v7-line);
    color: var(--v7-muted);
}

.market-price-history {
    margin-top: .75rem;
    padding: .75rem;
    background: var(--v7-sunken);
    border: 1px solid var(--v7-line);
}

.market-price-history[hidden] {
    display: none;
}

.market-price-history-hint {
    display: block;
    font-size: .72rem;
    color: var(--v7-muted);
}

.auction-item--warning .card,
.card.auction-item--warning {
    border-color: var(--v7-warning-fg);
    animation: auction-pulse-warning 1s ease-in-out infinite;
}

.auction-item--danger .card,
.card.auction-item--danger {
    border-color: var(--v7-danger-fg);
    animation: auction-pulse-danger .7s ease-in-out infinite;
}

.auction-item--expired {
    opacity: 0;
    transform: scale(.95);
}

@keyframes auction-pulse-warning {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255, 205, 57, .45); }
    50%      { box-shadow: 0 0 0 6px rgba(255, 205, 57, 0); }
}

@keyframes auction-pulse-danger {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255, 123, 136, .5); }
    50%      { box-shadow: 0 0 0 6px rgba(255, 123, 136, 0); }
}

.auction-bid-info {
    display: flex;
    gap: .35rem;
    margin: .5rem 0;
}

.auction-bid-info .card-stat {
    flex: 1;
}

.raffle-progress .progress {
    height: 8px;
    background: var(--v7-sunken);
    border: 1px solid var(--v7-line);
}

.raffle-progress .progress-bar {
    background: var(--v7-primary);
    transition: width .4s ease;
}

.raffle-number--available {
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
}

.raffle-number--available:hover {
    border-color: var(--v7-primary-bright);
    color: var(--v7-accent-hover);
}

.raffle-number--selected {
    background: var(--v7-primary);
    border-color: var(--v7-primary-bright);
    color: #fff;
    font-weight: 700;
}

.raffle-number--mine {
    background: rgba(25, 135, 84, .25);
    border-color: rgba(25, 135, 84, .5);
    color: var(--v7-success-fg);
    cursor: not-allowed;
}

.raffle-number--sold {
    background: var(--v7-sunken);
    border-color: var(--v7-line);
    color: var(--v7-muted);
    opacity: .5;
    cursor: not-allowed;
}

.raffle-summary .raffle-price {
    color: var(--v7-accent);
}

.raffle-card-total {
    display: flex;
    align-items: center;
    gap: .3rem;
    margin-top: .5rem;
    font-size: .78rem;
    color: var(--v7-muted);
}

.raffle-card-total .material-symbols-outlined {
    font-size: 1rem;
    color: var(--v7-accent);
}

.package-benefits {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
    margin: .5rem 0;
}

.package-benefit {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    padding: .1rem .4rem;
    background: var(--v7-sunken);
    border: 1px solid var(--v7-line);
    color: var(--v7-text);
    font-size: .7rem;
}

.package-benefit .material-symbols-outlined {
    font-size: .9rem;
    color: var(--v7-accent);
}

.package-progress {
    height: 6px;
    margin-top: .3rem;
    background: var(--v7-sunken);
    border: 1px solid var(--v7-line);
}

.package--sold-out .card {
    opacity: .65;
}

.achievement-header {
    display: flex;
    align-items: center;
    gap: .6rem;
}

.achievement-stats {
    display: flex;
    gap: 1rem;
    margin-top: .5rem;
    font-size: .72rem;
    color: var(--v7-muted);
}

.achievement-rarity,
.achievement-unlocked {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
}

.achievement-stats .material-symbols-outlined {
    font-size: .95rem;
    color: var(--v7-accent);
}

.achievement-reward {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.slide-links {
    position: absolute;
    left: 50%;
    bottom: 1.25rem;
    transform: translateX(-50%);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .35rem;
    z-index: 2;
}

.vip-coin {
    border: 1px solid var(--v7-line);
    background: var(--v7-card);
    box-shadow: var(--v7-shadow);
    padding: 1.5rem 1rem;
    text-align: center;
    height: 100%;
}

.vip-coin-icon {
    font-size: 2rem;
    width: 2rem;
    height: 2rem;
    display: block;
    margin: 0 auto .5rem;
    color: var(--v7-accent);
    opacity: .85;
}

.vip-coin-name {
    font-size: .8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--v7-text);
    margin-bottom: .5rem;
}

.vip-coin-balance {
    font-family: inherit;
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--v7-text);
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

.vip-coin-label {
    font-size: .65rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--v7-muted);
    margin-top: .2rem;
}

.events-row {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .45rem .15rem;
    border-bottom: 1px solid var(--v7-line);
}

.events-row:last-child {
    border-bottom: none;
}

.events-row-label {
    flex: 1;
    min-width: 0;
}

.events-row-name {
    display: block;
    font-size: .84rem;
    font-weight: 600;
    line-height: 1.25;
    color: var(--v7-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.events-row-next {
    display: block;
    font-size: .7rem;
    line-height: 1.3;
    margin-top: .1rem;
    color: var(--v7-muted);
    font-variant-numeric: tabular-nums;
}

.events-row-next:empty {
    display: none;
}

.events-row-timer {
    display: flex;
    align-items: center;
    gap: .4rem;
    flex-shrink: 0;
    padding-left: .35rem;
}

.events-row-countdown {
    min-width: 5.1rem;
    padding: .22rem .45rem;
    text-align: center;
    font-size: .74rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    letter-spacing: .02em;
    color: var(--v7-text);
    background: var(--v7-sunken);
    border: 1px solid var(--v7-line);
    transition: background .3s, color .3s, border-color .3s;
}

.events-row.is-upcoming .events-row-countdown {
    color: var(--v7-warning-fg);
    background: rgba(240, 192, 90, .12);
    border-color: rgba(240, 192, 90, .34);
}

.events-row.is-soon .events-row-countdown {
    color: var(--v7-success-fg);
    background: rgba(92, 214, 160, .13);
    border-color: rgba(92, 214, 160, .38);
}

.events-row.is-live .events-row-countdown {
    color: var(--v7-danger-fg);
    background: rgba(255, 107, 129, .15);
    border-color: rgba(255, 107, 129, .42);
}

.events-row.is-live .events-row-next {
    color: var(--v7-danger-fg);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.events-row-notify {
    margin: 0;
    min-height: auto;
    padding-left: 2.1em;
}

.events-row-notify .form-check-input {
    width: 1.8em;
    height: .95em;
    margin-top: .15em;
    margin-left: -2.1em;
    cursor: pointer;
}

[data-spotlight] .events-row {
    padding: .38rem .1rem;
}

[data-spotlight] .events-row-name {
    font-size: .78rem;
}

[data-spotlight] .events-row-next {
    display: none;
}

[data-spotlight] .events-row-countdown {
    min-width: 4.85rem;
    padding: .18rem .35rem;
    font-size: .7rem;
}

[data-spotlight] .events-row-notify {
    display: none;
}

.countdowns .countdown-timer .countdown-unit-value {
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
    color: var(--v7-text);
}

.countdowns .countdown-timer .countdown-unit-label {
    font-size: .52rem;
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: .05em;
    opacity: .7;
}

.countdowns .countdown-message {
    justify-content: center;
    text-align: center;
    font-size: .85rem;
}

.avatar-upload-input {
    display: none;
}

.avatar-upload-zone {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 160px;
    padding: 1.5rem;
    text-align: center;
    overflow: hidden;
    cursor: pointer;
    background: var(--v7-sunken);
    border: 2px dashed var(--v7-line-soft);
    transition: border-color .15s, background .15s;
}

.avatar-upload-zone:hover {
    background: rgba(var(--v7-primary-rgb), .22);
    border-color: var(--v7-accent);
}

.avatar-upload-zone--has-file {
    padding: 0;
    background: transparent;
    border-style: solid;
    border-color: var(--v7-accent);
}

.avatar-upload-zone--error,
.avatar-upload-zone--error:hover {
    background: rgba(255, 107, 129, .1);
    border-style: solid;
    border-color: #ff6b81;
}

.avatar-upload-preview {
    width: 100%;
    max-height: 260px;
    object-fit: contain;
}

.avatar-upload-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .4rem;
}

.avatar-upload-icon {
    font-size: 3rem;
    width: 3rem;
    height: 3rem;
    color: var(--v7-muted);
    opacity: .55;
}

.avatar-upload-label {
    font-size: .9rem;
    font-weight: 600;
    color: var(--v7-text);
}

.avatar-upload-hint {
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--v7-muted);
}

.avatar-upload-error {
    margin-top: .5rem;
    font-size: .8rem;
    color: var(--v7-danger-fg);
}

.ticket-rate-stars {
    display: flex;
    gap: .25rem;
}

.ticket-rate-btn {
    padding: 0;
    font-size: 2rem;
    line-height: 1;
    color: var(--v7-line-soft);
    background: none;
    border: none;
    cursor: pointer;
    transition: color .15s ease, transform .1s ease;
}

.ticket-rate-btn--active {
    color: var(--v7-warning-fg);
    transform: scale(1.1);
}

.ticket-rate-btn:disabled {
    opacity: .5;
    cursor: not-allowed;
}





















.market-product {
    height: 100%;
}

.market-product .card {
    height: 100%;
}

.market-product-image {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 110px;
    padding: .75rem;
    overflow: hidden;
    border-bottom: 1px solid var(--v7-line);
    background:
        radial-gradient(circle at 50% 40%, rgba(var(--v7-primary-bright-rgb), .26) 0%, rgba(var(--v7-card-rgb), .96) 72%),
        var(--v7-sunken);
}

.market-product-image[style*="--rarity-color"],
.market-product[style*="--rarity-color"] .market-product-image {
    border-bottom-color: var(--rarity-color, var(--v7-line));
    box-shadow: inset 0 -2px 0 -1px var(--rarity-color, transparent);
}

.market-product-image img {
    max-height: 80px;
    width: auto;
    filter: drop-shadow(0 3px 6px rgba(0, 0, 0, .65));
}

.market-product-expire {
    position: absolute;
    top: .3rem;
    right: .3rem;
    padding: .1rem .32rem;
    font-size: .7rem;
    font-weight: 700;
    line-height: 1.5;
    color: #fff;
    background: rgba(0, 0, 0, .55);
}

.market-product-name {
    margin-bottom: .25rem;
    font-size: .95rem;
    font-weight: 600;
    line-height: 1.25;
    color: var(--v7-text);
}

.market-product-name a {
    color: inherit;
    text-decoration: none;
}

.market-product-name a:hover {
    color: var(--v7-accent-hover);
}

.market-product-badges {
    display: flex;
    flex-wrap: wrap;
    gap: .2rem;
    margin-bottom: .25rem;
}

.market-badge {
    display: inline-block;
    padding: .1rem .35rem;
    font-size: .6rem;
    font-weight: 700;
    line-height: 1.5;
    text-transform: uppercase;
    letter-spacing: .03em;
    border: 1px solid transparent;
}

.market-empty {
    padding: 3rem 1rem;
    text-align: center;
    color: var(--v7-muted);
}

.market-empty p {
    margin: 0;
}

.market-empty-icon {
    display: block;
    margin: 0 auto 1rem;
    font-size: 4rem;
    width: 4rem;
    height: 4rem;
    color: var(--v7-primary-bright);
}

.market-price-history {
    padding: .75rem .9rem;
    margin-bottom: 1rem;
    background: var(--v7-sunken);
    border: 1px solid var(--v7-line);
}

.market-price-history-suggestion {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .5rem;
}

.market-price-history-suggestion-label {
    font-size: .9rem;
    font-weight: 700;
    color: var(--v7-text);
}

.market-price-history-use {
    padding: .2rem .6rem;
    font-size: .72rem;
    font-weight: 600;
    color: var(--v7-accent);
    background: transparent;
    border: 1px solid var(--v7-primary-bright);
    cursor: pointer;
    transition: background-color .12s ease, color .12s ease;
}

.market-price-history-use:hover {
    color: #fff;
    background: var(--v7-primary);
}

.market-price-history-hint {
    margin-top: .15rem;
    font-size: .72rem;
    color: var(--v7-muted);
}

.market-price-history-toggle {
    display: flex;
    align-items: center;
    gap: .4rem;
    margin: .5rem 0;
    font-size: .78rem;
    color: var(--v7-muted);
    cursor: pointer;
}

.market-price-history-chart {
    display: block;
    width: 100%;
    height: 60px;
}

.market-price-history-chart polyline {
    fill: none;
    stroke: var(--v7-accent);
    stroke-width: 2;
    vector-effect: non-scaling-stroke;
}

.market-item-rows {
    margin: 0;
}

.market-item-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .75rem;
    padding: .4rem 0;
    font-size: .84rem;
    border-bottom: 1px solid var(--v7-line);
}

.market-item-row:last-child {
    border-bottom: none;
}

.market-item-price-diff {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    margin-top: .5rem;
    font-size: .72rem;
    font-weight: 600;
    color: var(--v7-muted);
}

.market-item-price-diff-below {
    color: var(--v7-success-fg);
}

.market-item-price-diff-above {
    color: var(--v7-danger-fg);
}

.market-item-price-diff-icon {
    font-size: 1rem;
    width: 1rem;
    height: 1rem;
}

.market-item-section {
    margin-bottom: 2.25rem;
}

.market-item-section:last-child {
    margin-bottom: 0;
}

.market-item-section-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    flex-wrap: wrap;
    gap: .35rem .75rem;
    margin-bottom: .85rem;
}

.market-item-hint {
    font-size: .78rem;
    font-weight: 400;
    color: var(--v7-muted);
}

.market-item-hint a {
    color: inherit;
    text-decoration: underline;
}

.market-item-hint a:hover {
    color: var(--v7-accent-hover);
}

.market-item-details {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
}

.market-item-details-rows {
    flex: 1;
    min-width: 220px;
    margin: 0;
}

.market-item-info {
    flex: 0 0 auto;
    min-width: 240px;
    max-width: 100%;
    padding: 1rem 1.25rem;
    background: var(--v7-card);
    border: 1px solid var(--v7-line);
}

.market-item-info .item-info {
    font-size: .8rem;
}

.market-item-classes {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .3rem;
}

.market-item-classes img {
    width: 26px;
    height: 26px;
}

.market-item-stats {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-bottom: 1.25rem;
}

.market-item-stat {
    display: flex;
    flex-direction: column;
    flex: 1 1 140px;
    padding: .6rem .9rem;
    background: var(--v7-sunken);
    border: 1px solid var(--v7-line);
}

.market-item-stat-label {
    margin-bottom: .15rem;
    font-size: .68rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--v7-muted);
}

.market-item-stat-value {
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    color: var(--v7-text);
}

.market-item-stat-value-price {
    color: var(--v7-accent);
}

.market-item-empty {
    padding: 1.5rem 1rem;
    text-align: center;
    color: var(--v7-muted);
}

.market-item-chart-wrap {
    position: relative;
}

.market-item-chart {
    display: block;
    width: 100%;
}

.market-item-chart-line {
    fill: none;
    stroke: var(--v7-accent);
    stroke-width: 2;
    vector-effect: non-scaling-stroke;
}

.market-item-chart-area {
    fill: rgba(var(--v7-accent-rgb), .18);
    stroke: none;
}

.market-item-chart-grid {
    stroke: var(--v7-line);
    stroke-width: 1;
}

.market-item-chart-point {
    fill: var(--v7-accent);
}

.market-item-chart-label {
    font-size: .68rem;
    fill: var(--v7-muted);
}

.market-item-chart-tooltip {
    position: absolute;
    padding: .25rem .5rem;
    font-size: .72rem;
    color: var(--v7-text);
    background: var(--v7-card);
    border: 1px solid var(--v7-line-soft);
    pointer-events: none;
}

.market-prices-search {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: 1.75rem;
}

.market-prices-search .form-control {
    flex: 1;
}

.market-prices-suggestion {
    display: block;
    height: 100%;
    color: inherit;
    text-decoration: none;
}

.market-prices-suggestion:hover .market-product-name {
    color: var(--v7-accent-hover);
}

.market-prices-suggestion-count {
    font-size: .72rem;
    color: var(--v7-muted);
}

.market-prices-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem 1rem;
    margin-bottom: .75rem;
}

.market-prices-change {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    font-size: .8rem;
    font-weight: 600;
    color: var(--v7-muted);
    text-decoration: none;
}

.market-prices-change:hover {
    color: var(--v7-accent-hover);
}

.market-prices-change-icon {
    font-size: 1.1rem;
    width: 1.1rem;
    height: 1.1rem;
}

.market-prices-tabs {
    margin-bottom: 1rem;
}

.market-prices-tabs .nav-link {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
}

.market-prices-count {
    font-size: .68rem;
    font-weight: 600;
    color: var(--v7-muted);
}

.market-prices-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    margin-bottom: 1rem;
}

@media (max-width: 767.98px) {
.market-item-details {
        flex-direction: column;
    }
}

.market-toolbar-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
}

.server-rates {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: var(--v7-primary);
    border: 1px solid var(--v7-line-soft);
    overflow: hidden;
    margin-bottom: 2rem;
}

@media (max-width: 575px) {
.server-rates {
        grid-template-columns: repeat(2, 1fr);
    }
}

.server-rate {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1.25rem 1rem;
    text-align: center;
    border-right: 1px solid rgba(255, 255, 255, .15);
}

.server-rate:last-child {
    border-right: none;
}

@media (max-width: 575px) {
.server-rate {
        border-bottom: 1px solid rgba(255, 255, 255, .15);
    }

.server-rate:nth-child(2) { border-right: none; }

.server-rate:nth-child(3),
.server-rate:nth-child(4) { border-bottom: none; }
}

.server-rate-icon {
    font-size: 1.5rem;
    width: 1.5rem;
    height: 1.5rem;
    color: rgba(255, 255, 255, .6);
    margin-bottom: .3rem;
}

.server-rate-value {
    font-family: inherit;
    font-size: 1.3rem;
    font-weight: 700;
    color: #fff;
    line-height: 1.1;
}

.server-rate-label {
    font-size: .7rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: rgba(255, 255, 255, .65);
    margin-top: .2rem;
}

.server-stat {
    border: 1px solid var(--v7-line);
    background: var(--v7-card);
    padding: 1rem .75rem;
    text-align: center;
    height: 100%;
}

.server-stat-icon {
    font-size: 1.6rem;
    width: 1.6rem;
    height: 1.6rem;
    color: var(--v7-accent);
    opacity: .55;
    display: block;
    margin: 0 auto .3rem;
}

.server-stat-value {
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.2;
    color: var(--v7-text);
}

.server-stat-value a {
    color: inherit;
    text-decoration: none;
}

.server-stat-value a:hover {
    color: var(--v7-accent-hover);
}

.server-stat-value-sm {
    font-size: .9rem;
}

.server-stat-label {
    font-size: .65rem;
    color: var(--v7-muted);
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-top: .2rem;
    line-height: 1.3;
}

.server-specs {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin: 0;
}

.server-spec {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: .6rem 0;
    border-bottom: 1px solid var(--v7-line);
    font-size: .875rem;
}

.server-spec:last-child {
    border-bottom: none;
}

.server-spec dt {
    font-weight: 400;
    color: var(--v7-muted);
    flex-shrink: 0;
}

.server-spec dd {
    margin: 0;
    font-weight: 500;
    text-align: right;
    color: var(--v7-text);
}

.server-event-pills {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.server-event-pill {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .35rem .8rem;
    font-size: .8rem;
    font-weight: 500;
    border: 1px solid transparent;
}

.server-event-pill-icon {
    font-size: .95rem;
    width: .95rem;
    height: .95rem;
}

.server-event-pill-on {
    background: var(--v7-success-bg);
    border-color: rgba(99, 209, 158, .35);
    color: var(--v7-success-fg);
}

.server-event-pill-off {
    background: var(--v7-sunken);
    border-color: var(--v7-line);
    color: var(--v7-muted);
}

.server-commands {
    border: 1px solid var(--v7-line);
    overflow: hidden;
}

.server-command {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: .55rem .9rem;
    border-bottom: 1px solid var(--v7-line);
    font-size: .8rem;
}

.server-command:last-child {
    border-bottom: none;
}

.server-command kbd {
    min-width: 85px;
    text-align: center;
    font-size: .72rem;
    flex-shrink: 0;
    color: var(--v7-accent);
    background: var(--v7-sunken);
    border: 1px solid var(--v7-line-soft);
}

.server-command-desc {
    color: var(--v7-muted);
    line-height: 1.4;
}

.ticket-rating-display {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-top: .5rem;
}

.ticket-rating-label {
    font-size: .85rem;
    font-weight: 600;
    color: var(--v7-muted);
    margin-right: .35rem;
}

.view-sidebar {
    position: sticky;
    top: 1.5rem;
}

.view-sidebar-image {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 180px;
    padding: 1.5rem;
    overflow: hidden;
    border-radius: .375rem .375rem 0 0;
    background: linear-gradient(135deg, var(--rarity-color, var(--v7-primary)) 0%, color-mix(in srgb, var(--rarity-color, var(--v7-primary)), #000 40%) 100%);
}

.view-sidebar-image img {
    max-height: 150px;
    width: auto;
    object-fit: contain;
}

.view-sidebar-title {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--v7-text);
    line-height: 1.25;
    margin-bottom: .35rem;
}

.view-sidebar-price {
    text-align: center;
    padding: 1rem 0 .5rem;
}

.view-sidebar-price-label {
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--v7-muted);
}

.view-sidebar-price-value {
    font-size: 1.85rem;
    font-weight: 700;
    line-height: 1.1;
    color: var(--v7-danger-fg);
}

.view-sidebar-price-name {
    font-size: .8rem;
    color: var(--v7-muted);
}

.view-sidebar-rows {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    margin: 0 0 1rem;
}

.view-sidebar-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    padding: .5rem .8rem;
    font-size: .85rem;
    background: var(--v7-sunken);
    color: var(--v7-text);
    border-radius: .375rem;
}

.view-sidebar-row dt {
    font-weight: 400;
    color: var(--v7-muted);
}

.view-sidebar-row dd {
    margin: 0;
    font-weight: 600;
    text-align: right;
}

.view-sidebar-notice {
    text-align: center;
    font-size: .85rem;
    color: var(--v7-muted);
    padding: .5rem 0;
}

.market-item-sales {
    font-size: .85rem;
}

.market-item-sales th {
    font-size: .7rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--v7-muted);
    font-weight: 600;
    border-top: 0;
}

.market-item-sales-price {
    font-weight: 700;
    color: var(--v7-danger-fg);
    white-space: nowrap;
}

.market-item-sales-price span {
    font-size: .72rem;
    font-weight: 400;
    color: var(--v7-muted);
}

.market-prices-filters-field {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin: 0;
}

.market-prices-filters-label {
    font-size: .68rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--v7-muted);
}

.filter-grid {
    display: grid;
    gap: .3rem;
    margin-bottom: 1rem;
}

.filter-grid--category {
    grid-template-columns: repeat(auto-fill, minmax(34px, 1fr));
}

.filter-grid--class {
    grid-template-columns: repeat(auto-fill, minmax(38px, 1fr));
}

.filter-tile {
    position: relative;
    margin: 0;
    cursor: pointer;
}

.filter-tile input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.filter-tile-box {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1;
    width: 100%;
    background: var(--v7-surface);
    border: 1px solid var(--v7-line);
    color: var(--v7-muted);
    transition: border-color .15s ease, background .15s ease, color .15s ease;
}

.filter-tile-box .material-symbols-outlined {
    font-size: 1.15rem;
}

.filter-tile-box img {
    max-width: 78%;
    max-height: 78%;
    object-fit: contain;
    opacity: .55;
    transition: opacity .15s ease;
}

.filter-tile:hover .filter-tile-box {
    border-color: var(--v7-primary-bright);
    color: var(--v7-accent);
}

.filter-tile:hover .filter-tile-box img {
    opacity: .85;
}

.filter-tile--active .filter-tile-box {
    background: var(--v7-primary-soft);
    border-color: var(--v7-primary-bright);
    color: var(--v7-text);
}

.filter-tile--active .filter-tile-box img {
    opacity: 1;
}

.filter-tile input:focus-visible + .filter-tile-box {
    outline: 2px solid var(--v7-accent);
    outline-offset: 1px;
}

.filter-tile-count {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 15px;
    padding: 0 3px;
    background: var(--v7-primary);
    border: 1px solid var(--v7-card);
    color: #fff;
    font-size: .6rem;
    font-weight: 700;
    line-height: 15px;
    text-align: center;
}

.filter-tile input:checked + .filter-tile-box {
    background: var(--v7-primary-soft);
    border-color: var(--v7-primary-bright);
    color: var(--v7-text);
}

.filter-tile input:checked + .filter-tile-box img {
    opacity: 1;
}

.filter-tile input:checked + .filter-tile-box::after {
    content: "";
    position: absolute;
    right: 3px;
    bottom: 3px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--v7-accent);
}

.filter-tile-box {
    position: relative;
}

.market-filter-flags--stack {
    grid-template-columns: 1fr;
    max-height: 190px;
    overflow-y: auto;
    padding-right: .2rem;
}

.market-filter-flags .form-check {
    min-width: 0;
    margin-bottom: 0;
}

.market-filter-flags .form-check-label {
    display: block;
    font-size: .78rem;
    line-height: 1.35;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}

.market-filter-flags--stack::-webkit-scrollbar {
    width: 6px;
}

.market-filter-flags--stack::-webkit-scrollbar-thumb {
    background: var(--v7-line-soft);
}

.market-filter-flags--stack::-webkit-scrollbar-track {
    background: var(--v7-sunken);
}

.filter-tile-abbr {
    font-size: .6rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: .02em;
    color: var(--v7-muted);
    transition: color .15s ease;
}

.filter-tile:hover .filter-tile-abbr,
.filter-tile--active .filter-tile-abbr,
.filter-tile input:checked + .filter-tile-box .filter-tile-abbr {
    color: var(--v7-text);
}

.filter-tile--empty .filter-tile-box {
    opacity: .4;
}

.filter-tile--empty:hover .filter-tile-box {
    opacity: .75;
}

.filter-grid--category .filter-tile-box img {
    filter: brightness(0) invert(1);
}

.market-prices-search {
    max-width: 640px;
    padding: .75rem;
    background: var(--v7-card);
    border: 1px solid var(--v7-line);
    border-radius: .375rem;
}

.market-prices-search .form-control {
    background: var(--v7-sunken);
    border-color: var(--v7-line-soft);
    color: var(--v7-text);
}

.market-prices-search .form-control::placeholder {
    color: var(--v7-muted);
}

.market-prices-search .btn-primary {
    background: var(--v7-primary);
    border-color: var(--v7-primary);
    color: #fff;
}

.market-prices-search .btn-primary:hover {
    background: var(--v7-primary-hover);
    border-color: var(--v7-primary-hover);
}

.market-prices-head .title {
    margin: 0;
}

.market-prices .market-empty {
    padding: 2.5rem 1rem;
    text-align: center;
    background: var(--v7-card);
    border: 1px dashed var(--v7-line-soft);
    border-radius: .375rem;
}

.profile-attrs {
    margin-bottom: 1.5rem;
    background: var(--v7-card);
    border: 1px solid var(--v7-line);
    border-radius: .375rem;
    overflow: hidden;
}

.profile-attr {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .5rem 1.25rem;
    border-bottom: 1px solid var(--v7-line);
}

.profile-attr:last-child {
    border-bottom: 0;
}

.profile-attr-abbr {
    flex-shrink: 0;
    width: 38px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--v7-primary-soft);
    color: var(--v7-accent);
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
    border-radius: .375rem;
}

.profile-attr-label {
    flex: 1;
    font-size: .82rem;
    color: var(--v7-muted);
}

.profile-attr-value {
    font-size: .88rem;
    font-weight: 700;
    color: var(--v7-text);
    white-space: nowrap;
}

.profile-achievements {
    margin-top: 1.5rem;
}

.video-card {
    height:100%;
    border:1px solid var(--v7-line);
    border-radius:.375rem;
    background:var(--v7-card);
    overflow:hidden
}

.video-card-embed {
    position:relative;
    padding-top:56.25%
}

.video-card-embed iframe {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    border:none;
    display:block
}

.video-card-body {
    padding:.9rem 1rem
}

.video-card-title {
    font-weight:600;
    font-size:.95rem;
    margin-bottom:.35rem;
    line-height:1.3
}

.countdown-unit {
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:.1rem;
    background:rgba(0,0,0,.55);
    padding:.35rem .2rem;
    border-radius:.375rem
}

.countdown-unit-value {
    font-size:1.2rem;
    font-weight:700;
    line-height:1;
    font-variant-numeric:tabular-nums
}

.countdown-unit-label {
    font-size:.52rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.05em;
    opacity:.65
}

.countdown-message {
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:.85rem;
    min-height:34px;
    opacity:.9
}

.battlepass-empty {
    text-align:center;
    padding:4rem 2rem
}

.battlepass-empty-icon {
    display:block;
    font-size:4rem;
    width:4rem;
    height:4rem;
    color:var(--v7-muted);
    margin:0 auto 1rem
}

.battlepass-empty h3,
.battlepass-empty .h3 {
    color:var(--v7-muted)
}

.battlepass-header {
    display:flex;
    align-items:center;
    gap:1.25rem;
    padding:1.2rem 1.5rem;
    background:linear-gradient(135deg, var(--v7-primary-hover), var(--v7-primary));
    border-radius:.375rem;
    margin-bottom:1.25rem;
    color:#fff;
    flex-wrap:wrap
}

.battlepass-header-info {
    flex:1;
    min-width:0
}

.battlepass-header-title {
    font-size:1.4rem;
    font-weight:700;
    margin-bottom:.1rem
}

.battlepass-header-desc {
    opacity:.8;
    margin-bottom:.3rem;
    font-size:.85rem
}

.battlepass-header-dates {
    display:inline-flex;
    align-items:center;
    gap:.2rem;
    opacity:.7;
    font-size:.78rem
}

.battlepass-header-dates-icon {
    font-size:.9rem;
    width:.9rem;
    height:.9rem
}

.battlepass-header-actions {
    flex-shrink:0
}

.battlepass-premium-badge {
    display:inline-flex;
    align-items:center;
    gap:.4rem;
    background:rgba(255,255,255,.15);
    border:1px solid rgba(255,255,255,.3);
    border-radius:.375rem;
    padding:.4rem .9rem;
    font-weight:600;
    font-size:.85rem
}

.battlepass-premium-badge-icon {
    font-size:1.1rem;
    width:1.1rem;
    height:1.1rem;
    color:#ffc107
}

.battlepass-btn-premium {
    background:#ffc107;
    color:var(--v7-text);
    border:none;
    font-weight:600;
    font-size:.85rem;
    display:inline-flex;
    align-items:center;
    gap:.4rem;
    border-radius:.375rem;
    padding:.45rem 1rem
}

.battlepass-btn-premium-icon {
    font-size:1rem;
    width:1rem;
    height:1rem
}

.battlepass-btn-premium:hover {
    background:#e6ae06;
    color:var(--v7-text)
}

.battlepass-progress {
    margin-bottom:1.25rem
}

.battlepass-progress-info {
    display:flex;
    justify-content:space-between;
    margin-bottom:.3rem;
    font-size:.82rem;
    font-weight:500;
    color:var(--v7-muted)
}

.battlepass-progress-bar {
    height:8px;
    background:var(--v7-sunken);
    border-radius:.375rem;
    overflow:hidden
}

.battlepass-progress-fill {
    height:100%;
    background:linear-gradient(90deg, var(--v7-primary), var(--v7-primary-hover));
    border-radius:.375rem;
    transition:width .4s ease
}

.battlepass-track {
    display:flex;
    flex-direction:column;
    min-width:max-content
}

.battlepass-track-wrap {
    overflow-x:auto;
    padding-bottom:.25rem
}

.battlepass-track-row {
    display:flex;
    align-items:center
}

.battlepass-track-row--free {
    margin-bottom:.35rem
}

.battlepass-track-row--nodes {
    position:relative;
    padding:.35rem 0
}

.battlepass-track-row--nodes::before {
    content:"";
    position:absolute;
    top:50%;
    left:0;
    right:0;
    height:3px;
    background:var(--v7-sunken);
    transform:translateY(-50%);
    z-index:0
}

.battlepass-track-row--xp {
    margin-bottom:.35rem
}

.battlepass-track-cell {
    width:90px;
    flex-shrink:0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 .25rem
}

.battlepass-track-cell--node {
    position:relative;
    z-index:1;
    padding:0
}

.battlepass-track-node {
    width:34px;
    height:34px;
    border-radius:50%;
    border:3px solid var(--v7-line);
    background:var(--v7-card);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:.78rem;
    font-weight:700;
    color:var(--v7-muted);
    position:relative;
    z-index:1;
    transition:background .2s,border-color .2s,color .2s;
    border-radius:50%
}

.battlepass-track-node-icon {
    font-size:.9rem;
    width:.9rem;
    height:.9rem
}

.battlepass-track-cell--node.is-unlocked .battlepass-track-node {
    background:var(--v7-primary);
    border-color:var(--v7-primary-bright);
    color:#fff
}

.battlepass-track-xp {
    font-size:.6rem;
    color:var(--v7-muted);
    white-space:nowrap
}

.battlepass-reward {
    width:calc(100% - .4rem);
    background:var(--v7-sunken);
    border:1px solid var(--v7-line);
    border-radius:.375rem;
    padding:.55rem .35rem .4rem;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:.2rem;
    text-align:center;
    opacity:.45;
    transition:opacity .2s,border-color .2s,background .2s;
    min-height:88px;
    justify-content:space-between
}

.battlepass-reward.is-unlocked {
    opacity:1
}

.battlepass-reward[data-tooltip] {
    cursor:help
}

.battlepass-reward.is-claimed {
    opacity:1;
    border-color:rgba(25, 135, 84, .45);
    background:var(--v7-success-bg)
}

.battlepass-reward--premium {
    background:var(--v7-warning-bg);
    border-color:rgba(255, 193, 7, .45)
}

.battlepass-reward--premium.is-unlocked {
    background:var(--v7-warning-bg);
    border-color:rgba(255, 193, 7, .45)
}

.battlepass-reward-icon {
    font-size:1.3rem;
    width:1.3rem;
    height:1.3rem;
    color:var(--v7-accent)
}

.battlepass-reward--premium .battlepass-reward-icon {
    color:#cc9a06
}

.battlepass-reward.is-claimed .battlepass-reward-icon {
    color:#198754
}

.battlepass-reward-label {
    font-size:.64rem;
    line-height:1.2;
    color:var(--v7-text);
    overflow:hidden;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical
}

.battlepass-reward-check {
    font-size:.85rem;
    width:.85rem;
    height:.85rem;
    color:#198754
}

.battlepass-reward-lock {
    font-size:.82rem;
    width:.82rem;
    height:.82rem;
    color:var(--v7-muted);
    opacity:.55
}

.battlepass-reward-img {
    width:36px;
    height:36px;
    object-fit:contain;
    border-radius:.375rem
}

.battlepass-premium-checkout-header {
    display:flex;
    align-items:center;
    gap:1rem;
    padding:1.2rem 1.5rem;
    background:linear-gradient(135deg, #e6ae06, #ffc107);
    border-radius:.375rem;
    margin-bottom:1.5rem;
    color:var(--v7-text)
}

.battlepass-premium-checkout-icon {
    font-size:2.5rem;
    width:2.5rem;
    height:2.5rem;
    flex-shrink:0
}

.battlepass-premium-checkout-title {
    font-size:1.1rem;
    font-weight:700;
    margin:0 0 .1rem
}

.battlepass-premium-checkout-price {
    margin:0;
    font-size:.9rem;
    opacity:.75
}

.battlepass-premium-checkout-label {
    font-weight:500;
    margin-bottom:.75rem;
    color:var(--v7-muted)
}

.battlepass-sources {
    margin-top:2rem
}

.battlepass-sources-title {
    font-size:.8rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.07em;
    color:var(--v7-muted);
    margin-bottom:.75rem
}

.battlepass-sources-grid {
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));
    gap:.5rem
}

.battlepass-source {
    display:flex;
    align-items:center;
    gap:.75rem;
    padding:.65rem .9rem;
    min-height:3.4rem;
    background:var(--v7-sunken);
    border:1px solid var(--v7-line);
    border-radius:.375rem
}

.battlepass-source-info {
    flex:1;
    display:flex;
    flex-direction:column;
    min-width:0
}

.battlepass-source-label {
    font-size:.8rem;
    font-weight:500;
    color:var(--v7-text);
    line-height:1.3
}

.battlepass-source-limit {
    font-size:.7rem;
    color:var(--v7-muted);
    margin-top:.1rem
}

.battlepass-source-xp {
    font-size:.8rem;
    font-weight:700;
    color:var(--v7-accent);
    white-space:nowrap;
    flex-shrink:0
}

.battlepass-btn-claim {
    background:var(--v7-primary);
    color:#fff;
    border:none;
    font-size:.63rem;
    padding:.2rem .5rem;
    border-radius:.375rem;
    font-weight:600;
    line-height:1.4;
    cursor:pointer;
    white-space:nowrap
}

.battlepass-btn-claim:hover {
    background:var(--v7-primary-hover);
    color:#fff
}

.subscribe-current {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    padding:1rem 1.25rem;
    margin-bottom:1.5rem;
    border:1px solid var(--v7-line);
    border-radius:.375rem;
    background:var(--v7-sunken)
}

.subscribe-current-label {
    color:var(--v7-muted);
    margin-right:.5rem
}

.subscribe-current-renew {
    color:var(--v7-muted);
    margin-left:.75rem
}

.subscribe-badge {
    display:inline-block;
    padding:.15rem .5rem;
    border-radius:.375rem;
    font-size:.75rem
}

.subscribe-badge.is-active {
    background:rgba(25,135,84,.15);
    color:#198754
}

.subscribe-badge.is-muted {
    background:var(--v7-sunken);
    color:var(--v7-muted)
}

.subscribe-cancel {
    border:1px solid #dc3545;
    color:#dc3545;
    background:rgba(0,0,0,0);
    padding:.35rem .9rem;
    border-radius:.375rem
}

.subscribe-cancel:hover {
    background:#dc3545;
    color:#fff
}

.subscribe-billing {
    display:inline-flex;
    gap:.25rem;
    padding:.25rem;
    margin:0 auto 1.75rem;
    border:1px solid var(--v7-line);
    border-radius:.375rem;
    background:var(--v7-sunken)
}

.subscribe-billing-btn {
    border:0;
    background:rgba(0,0,0,0);
    color:var(--v7-muted);
    padding:.4rem 1.25rem;
    border-radius:.375rem;
    transition:all .15s ease
}

.subscribe-billing-btn.is-active {
    background:var(--v7-primary);
    color:#fff
}

.subscribe-charges {
    margin-bottom:1.75rem
}

.subscribe-charges-title {
    font-size:1rem;
    margin-bottom:.75rem
}

.subscribe-charges-table {
    width:100%;
    border-collapse:collapse;
    border:1px solid var(--v7-line);
    border-radius:.375rem;
    overflow:hidden
}

.subscribe-charges-table th,
.subscribe-charges-table td {
    padding:.6rem .85rem;
    text-align:left;
    border-bottom:1px solid var(--v7-line)
}

.subscribe-charges-table th {
    background:var(--v7-sunken);
    color:var(--v7-muted);
    font-size:.82rem;
    font-weight:600
}

.subscribe-charges-table tbody tr:last-child td {
    border-bottom:0
}

.subscribe-charges-status {
    display:inline-block;
    padding:.15rem .5rem;
    border-radius:.375rem;
    font-size:.75rem;
    background:var(--v7-sunken);
    color:var(--v7-muted)
}

.subscribe-charges-status.is-paid {
    background:rgba(25,135,84,.15);
    color:#198754
}

.subscribe-charges-status.is-refunded,
.subscribe-charges-status.is-canceled {
    background:rgba(220,53,69,.15);
    color:#dc3545
}

.subscribe-charges-status.is-waiting,
.subscribe-charges-status.is-analysis {
    background:rgba(255,193,7,.15);
    color:#cc9a06
}

.subscribe-plans-block {
    margin-bottom:2rem
}

.subscribe-plans-heading {
    font-size:1.25rem;
    margin-bottom:.35rem
}

.subscribe-plans-subheading {
    color:var(--v7-muted);
    font-size:.9rem;
    margin-bottom:1.35rem
}

.subscribe-plans {
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
    gap:1.5rem;
    align-items:stretch
}

.subscribe-plan {
    position:relative;
    display:flex;
    flex-direction:column;
    padding:1.75rem 1.5rem;
    border:1px solid var(--v7-line);
    border-radius:.375rem;
    background:var(--v7-card);
    transition:transform .15s ease,box-shadow .15s ease
}

.subscribe-plan.is-recommended {
    border-color:var(--v7-primary-bright);
    box-shadow:0 .75rem 2rem rgba(var(--v7-primary-rgb), .18);
    transform:translateY(-0.35rem)
}

.subscribe-plan-badge {
    position:absolute;
    top:-0.75rem;
    left:50%;
    transform:translateX(-50%);
    padding:.2rem .75rem;
    border-radius:.375rem;
    background:var(--v7-primary-hover); /* V7 (out/2026): cobre escuro #774318 - #fff sobre #c07334 dava 3.7:1 */
    color:#fff;
    font-weight:700;
    font-size:.72rem;
    text-transform:uppercase;
    letter-spacing:.04em
}

.subscribe-plan-name {
    margin:0 0 .35rem;
    font-size:1.15rem
}

.subscribe-plan-desc {
    color:var(--v7-muted);
    font-size:.9rem;
    margin-bottom:1rem
}

.subscribe-plan-price {
    margin-bottom:1.25rem
}

.subscribe-plan-value {
    font-size:2rem;
    font-weight:700;
    color:var(--v7-text)
}

.subscribe-plan-cycle {
    color:var(--v7-muted);
    font-size:.9rem
}

.subscribe-plan-features {
    list-style:none;
    padding:0;
    margin:0 0 1.5rem;
    display:flex;
    flex-direction:column;
    gap:.55rem
}

.subscribe-plan-features li {
    display:flex;
    align-items:center;
    gap:.5rem;
    font-size:.92rem
}

.subscribe-plan-check {
    font-size:1.15rem;
    width:1.15rem;
    height:1.15rem;
    color:var(--v7-success-fg) /* V7 (out/2026): era #198754 fixo do default */
}

.subscribe-plan-gateway {
    margin-bottom:.6rem
}

.subscribe-plan-nogateway {
    color:var(--v7-muted);
    font-size:.85rem;
    margin-bottom:.6rem
}

.subscribe-plan-btn {
    margin-top:auto;
    width:100%;
    border:0;
    padding:.6rem 1rem;
    border-radius:.375rem;
    background:var(--v7-primary);
    color:#fff;
    font-weight:600;
    transition:background .15s ease
}

.subscribe-plan-btn:hover:not(:disabled) {
    background:var(--v7-primary-hover)
}

.subscribe-plan-btn:disabled {
    opacity:.55
}

.form-switch.form-switch-block .form-check-input {
    margin-top:.625rem
}

.webshop-product-stock .progress {
    height:3px;
    margin-bottom:.2rem
}

.single-post-meta {
    display:flex;
    align-items:center;
    gap:.75rem;
    margin-bottom:1rem;
    flex-wrap:wrap
}

.single-post-date,
.single-post-views {
    display:flex;
    align-items:center;
    gap:.25rem;
    font-size:.85rem;
    color:var(--v7-muted)
}

.single-post-date-icon,
.single-post-views-icon {
    font-size:1rem;
    width:1rem;
    height:1rem
}

.raffle-card--drawn .raffle-card-image {
    background:linear-gradient(135deg, #198754 0%, #0f5132 100%)
}

.vote-reward-card .card {
    height:100%
}

.vote-reward-card-badges {
    display:flex;
    flex-wrap:wrap;
    gap:.3rem
}

.vote-reward-card-badge {
    display:inline-flex;
    align-items:center;
    gap:.25rem;
    font-size:.7rem;
    padding:.2rem .55rem;
    border-radius:50px;
    font-weight:500;
    background:var(--v7-success-bg);
    color:var(--v7-success-fg)
}

.vote-reward-card-badge-icon {
    font-size:.8rem;
    width:.8rem;
    height:.8rem
}

.checkout-amount.is-active {
    border-color: var(--v7-primary-bright);
    background: var(--v7-primary-soft);
    color: var(--v7-accent); 
}

.page > .page-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .5rem 1rem;
    padding-bottom: .75rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid var(--v7-line);
}

.page > .page-header h3 {
    display: block;
    width: auto;
    margin: 0;
    text-align: left;
}

.page > .page-header h3::before,
.page > .page-header h3::after {
    content: none;
}

.page > .page-header .breadcrumb {
    margin: 0;
}

.auction-item .card {
    border: 2px solid var(--v7-line);
}

.page > .page-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .5rem 1rem;
    padding: 20px 25px;
    border-bottom: 1px solid var(--v7-line);
    text-transform: uppercase;
}

.page > .page-header h3 {
    margin: 0;
    color: #746dab;
    font-weight: 700;
    font-size: 1.5rem;
}

.page > .page-header .breadcrumb {
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    text-transform: none;
    font-size: var(--0-9rem-size);
}

.page > .container {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.profile-block-packages .package {
    margin-bottom: 1rem;
}

.profile-block-packages .package .description {
    font-size: .8rem;
}

.profile-block-packages .package .price {
    font-weight: 700;
    text-align: center;
    margin-top: 1rem;
}

.profile-block-packages .package .price span {
    color: var(--v7-danger-fg);
}



.notifications-container {
    width:20rem;
    display:flex;
    flex-direction:column
}

@media(max-width:575.98px) {
.notifications-container {
    width:calc(100vw - 1rem)
}
}

.notifications-item-body {
    flex:1;
    min-width:0
}



/* ==========================================================================
   Reposicao escopada (regra D5): o CSS original do tema ja usa estes nomes de
   classe, mas SEM as propriedades de que o renderizador do core / o JS precisam.
   Seletor mais especifico para so acrescentar o que falta.
   ========================================================================== */
div.morpheus-inventory-items {
    position: relative;
    width: 256px;
    height: 256px;
}

div.morpheus-warehouse {
    position: relative;
    width: 256px;
    height: 480px;
}

div.morpheus-inventory-items .item,
div.morpheus-warehouse .item {
    position: absolute;
    background-color: rgba(var(--v7-card-rgb), .35);
    border: 1px solid var(--v7-line);
}

div.morpheus-inventory-items .item .image,
div.morpheus-warehouse .item .image {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.card.item .image[style*="--rarity-color"],
.card.item .product-image[style*="--rarity-color"] {
    border-radius: .375rem;
    box-shadow:
        inset 0 0 0 2px var(--rarity-color),
        inset 0 -22px 30px -20px var(--rarity-color);
}



/* ==========================================================================
   forest - regioes ESCURAS dentro do tema claro (regra D2): laterais
   (.sidebar / .widget red-dark|red-light), faixa superior, menu, status e
   rodape. Os componentes V7 que caem ali (eventos, poll, countdown, top
   players, ofertas do WebShop, sino) passam a ler os tokens escuros.
   ========================================================================== */
.sidebar,
.top-panel,
.menu,
.status-block,
.header,
.footer {
    --v7-surface: #2a1409;
    --v7-card: #221001;
    --v7-card-rgb: 34, 16, 1;
    --v7-sunken: #1a100a;
    --v7-sidebar: #2a1409;
    --v7-accent: #ffde00;
    --v7-accent-rgb: 255, 222, 0;
    --v7-accent-hover: #ffd700;
    --v7-text: #ffffff;
    --v7-muted: #ffd4a3;
    --v7-muted-rgb: 255, 212, 163;
    --v7-line: #4e1910;
    --v7-line-soft: #774318;
    --v7-success-fg: #8fd687;
    --v7-warning-fg: #ffd700;
    --v7-danger-fg: #ff8a8a;
    --v7-info-fg: #6edff6;
    --v7-primary-soft: rgba(192, 115, 52, .28);
}

/* ==========================================================================
   Cobertura D4: classes emitidas pelas views + estilizadas no app.css do
   default + sem regra no tema (extract.pl + recolor.pl)
   ========================================================================== */

.character-card-badge {
    position:absolute;
    top:.5rem;
    right:.5rem;
    font-size:.6rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.06em;
    padding:.15rem .45rem;
    border-radius:.375rem;
}

.character-card-badge--online {
    background:#198754;
    color:#fff;
}

.character-card-class {
    font-size:.72rem;
    color:var(--v7-muted);
    margin-bottom:.55rem;
}

.character-card-stats {
    display:flex;
    justify-content:center;
    gap:.4rem;
}

.character-card-stat {
    display:flex;
    flex-direction:column;
    align-items:center;
    background:var(--v7-sunken);
    border:1px solid var(--v7-line);
    border-radius:.375rem;
    padding:.2rem .45rem;
}

.character-card-stat-label {
    font-size:.55rem;
    text-transform:uppercase;
    letter-spacing:.06em;
    color:var(--v7-muted);
    line-height:1;
    margin-bottom:.1rem;
}

.character-card-stat-value {
    font-size:.8rem;
    font-weight:700;
    color:var(--v7-text);
    line-height:1;
}

.ticket-message {
    padding:.5rem 0;
    border-bottom:1px solid var(--v7-line);
}

.ticket-message:last-child {
    border-bottom:0;
}

.ticket-images {
    display:flex;
    margin-top:.5rem;
}

.ticket-images a {
    display:flex;
    align-items:center;
    justify-content:center;
    height:50px;
    width:50px;
    padding:.5rem;
    border:1px solid var(--v7-line);
    border-radius:.375rem;
    margin-right:.5rem;
}

.countdown-title {
    font-size:.7rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.07em;
    opacity:.75;
    text-align:center;
    margin-bottom:.4rem;
}

.market.items .sell-item {
    display:flex;
    gap:1rem;
}

@media(max-width:991.98px) {
.market.items .sell-item {
    flex-direction:column;
}
}

.market.items .item {
    flex:1;
}

.tracker-comments {
    display:flex;
    flex-direction:column;
    gap:0;
    margin-bottom:1.5rem;
    border:1px solid var(--v7-line);
}

.items-list .item .card-body {
    position:relative;
}


/* ==========================================================================
   Slides/banner (view nova: a V7 injeta notify('banner')). Moldura .slider do
   tema (630x280, setas e pontos) com o carousel do Bootstrap no lugar do JS V6
   que o tema nao tem mais. Imagem preenche a moldura como o background do V6;
   pontos no desenho do tema (sem a borda/opacidade do .carousel-indicators).
   ========================================================================== */
.slider.carousel .carousel-item {
    height: 280px;
}

.slider.carousel .carousel-item img {
    width: 100%;
    height: 280px;
    object-fit: cover;
    border: 1px solid #373022;
}

.slider.carousel .carousel-item::before {
    content: "";
    position: absolute;
    inset: 0;
    box-shadow: inset 0 0 80px;
    pointer-events: none;
    z-index: 1;
}

.slider.carousel .navigation.carousel-indicators {
    margin: 0;
    padding: 0;
    right: 0;
}

.slider.carousel .navigation.carousel-indicators .dot {
    box-sizing: content-box;
    flex: 0 0 auto;
    width: 2px;
    height: 2px;
    padding: 0;
    border: 0;
    opacity: 1;
    text-indent: 0;
    background-color: #fff;
    margin: 0 10px;
}

.slider.carousel .navigation.carousel-indicators .dot.active {
    border-radius: 50%;
    width: 7px;
    height: 7px;
    margin: 0 5px;
    background-color: #ffc103;
}

.slider.carousel .slide-links {
    position: absolute;
    left: 35px;
    bottom: 45px;
    transform: none;
    z-index: 5;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

/* ItemMarket - barra da listagem: .btn-theme-solid do tema traz margin-top:10px (pensado para
   blocos empilhados); na barra os botoes ficam alinhados lado a lado. */
.market-toolbar-actions > .btn-theme-solid {
    margin-top: 0;
    flex: 0 0 auto;
}

/* vip/advantages: marca de recurso incluso / nao incluso nos plan-cards (porte do default, tokens do tema) */
.plan-card-feature-on .plan-card-feature-icon {
    color: var(--v7-success-fg);
}

.plan-card-feature-off {
    color: var(--v7-muted);
}

.plan-card-feature-off .plan-card-feature-icon {
    color: var(--v7-line-soft);
}

/* Radio do Bootstrap (Poll na lateral, formularios V7): o style-bb.css do forest aplica a
   input:not([type=checkbox]) - portanto tambem ao radio - fundo em imagem, border-radius 30px e
   padding de campo de texto; o radio virava uma pilula sem marcacao. Escopado em input.form-check-input. */
input.form-check-input[type="radio"],
.poll-vote-form input[type="radio"] {
    padding: 0;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    background: var(--v7-card) none;
    border: 1px solid var(--v7-line);
    flex-shrink: 0;
    margin: 0 .4rem 0 0;
    vertical-align: -.15em;
}

input.form-check-input[type="radio"]:checked,
.poll-vote-form input[type="radio"]:checked {
    background-color: var(--v7-primary);
    border-color: var(--v7-primary-hover);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* .form-range (filtros do ItemMarket, Oficina): thumb azul de fabrica do Bootstrap (#0d6efd) na cor
   do tema. Uma regra por fornecedor - pseudo de fornecedor em lista invalida a regra inteira. */
.form-range::-webkit-slider-thumb {
    background-color: var(--v7-primary-bright);
}

.form-range::-moz-range-thumb {
    background-color: var(--v7-primary-bright);
}

.form-range:focus::-webkit-slider-thumb {
    box-shadow: 0 0 0 .2rem var(--v7-primary-soft);
}

.form-range:focus::-moz-range-thumb {
    box-shadow: 0 0 0 .2rem var(--v7-primary-soft);
}

/* Sino do header (faixa superior escura): o .btn do Bootstrap pinta o texto com --bs-body-color
   (escuro) - o icone sumia no fundo. Cor de destaque da regiao (tokens escopados em .top-panel). */
.navbar-notifications .btn-header {
    --bs-btn-color: var(--v7-accent);
    --bs-btn-hover-color: var(--v7-accent-hover);
    --bs-btn-active-color: var(--v7-accent-hover);
    color: var(--v7-accent);
    line-height: 1;
}

.navbar-notifications .btn-header .material-symbols-outlined {
    color: inherit;
    font-size: 1.35rem;
    text-transform: none;
}

/* ==========================================================================
   Cabecalho das views de plugin SEM override (BattlePass, Subscribe, Coupon,
   Poll/archive, ItemMarket show/prices, Pages): o plugin emite o padrao da V7
   (.page > .page-header > h3 + nav .breadcrumb). No forest vira a faixa
   .content-title (imagem, 74px, titulo branco 14px) com o .breadcrumber-custom
   logo abaixo e o miolo com o respiro do .content-page - como as paginas do tema.
   ========================================================================== */
.page > .page-header {
    display: block;
    position: relative;
    z-index: 2;
    height: 74px;
    padding: 19px 39px 0 39px;
    margin: 0 0 42px 0;
    background: url(../images/content-title-bg.png) no-repeat;
    border-bottom: 0;
    text-transform: none;
}

.page > .page-header h3 {
    margin: 0;
    font-size: 14px;
    color: #fff;
    text-transform: uppercase;
    font-weight: 400;
    text-align: left;
}

.page > .page-header h3::before,
.page > .page-header h3::after {
    content: none;
}

/* nav .breadcrumb = .breadcrumber-custom, abaixo da faixa */
.page > .page-header nav {
    position: absolute;
    top: 100%;
    left: 30px;
    margin-top: 12px;
}

.page > .page-header .breadcrumb {
    --bs-breadcrumb-divider-color: #4e1910;
    --bs-breadcrumb-item-padding-x: 8px;
    display: flex;
    padding: 0;
    margin: 0;
    background: none;
    border: 0;
    font-size: 10px;
    text-transform: uppercase;
}

.page > .page-header .breadcrumb a {
    color: #774318;
    text-decoration: none;
}

.page > .page-header .breadcrumb-item.active {
    color: #c07334;
    font-weight: bold;
}

.page > .page-header + .container {
    padding: 0 30px 30px;
    line-height: 1.6;
}

/* Raffle: o .numbers-grid do tema limita a 400px com rolagem; com os numeros no tamanho V7 a grade
   de 100 numeros rolava dentro do card. Sem rolagem: a grade mostra todos os numeros. */
#raffle-numbers-grid.numbers-grid {
    max-height: none;
    overflow: visible;
}

/* ==========================================================================
   ItemMarket (listagem, ofertas e perfil) - card de item harmonizado.
   Mesmo card do tema (.info-block-item + .char-name-header) com medidas fixas:
   cabecalho de 2 linhas, imagem em caixa fixa (sprites do MU tem proporcoes
   muito diferentes), selos numa linha centralizada, nome/preco/expiracao
   alinhados e o botao sempre no rodape. Escopo: cards que tem .market-item-image.
   ========================================================================== */
.info-block-item:has(.market-item-image) > .char-name-header {
    min-height: 3.4em;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1.25;
}

.info-block-item:has(.market-item-image) > [data-tooltip] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: .5rem;
    min-height: 150px;
    padding: .9rem .75rem .5rem !important;
}

.info-block-item .market-item-image {
    display: block;
    width: auto;
    height: 100px;
    max-width: 100%;
    object-fit: contain;
    margin: 0 auto;
    filter: drop-shadow(0 3px 4px rgba(34, 16, 1, .35));
}

.info-block-item:has(.market-item-image) .product-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px;
    margin: 0 !important;
    position: static;
}

.info-block-item:has(.market-item-image) .item-rarity-badge {
    position: static;
}

.info-block-item:has(.market-item-image) > .text-center.px-2 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .3rem;
}

.info-block-item:has(.market-item-image) .item-name,
.info-block-item:has(.market-item-image) .product-price {
    line-height: 1.3;
    min-height: 2.6em;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* "Expira em": o amarelo claro (#ffd700) sumia no pergaminho */
.info-block-item:has(.market-item-image) .expire-badge .badge {
    color: #6b4d00 !important;
    background: rgba(255, 196, 0, .22) !important;
    font-weight: 700;
}

/* Filtro de categoria: icones brancos (feitos para fundo escuro) sobre o pergaminho - escurecidos */
.filter-grid--category .filter-tile-box img {
    filter: brightness(0);
    opacity: .7;
}

.filter-grid--category .filter-tile:hover .filter-tile-box img,
.filter-grid--category .filter-tile--active .filter-tile-box img,
.filter-grid--category .filter-tile input:checked + .filter-tile-box img {
    opacity: 1;
}

/* Botao do tema desabilitado (checkout: "Continuar" so libera depois de escolher valor e gateway) */
.btn-theme-solid:disabled,
.btn-theme-solid.disabled {
    opacity: .5;
    cursor: not-allowed;
    filter: grayscale(.4);
}

/* checkout: botao do tema com icone ao lado do texto */
.btn-theme-solid.checkout-continue {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
}

/* Copiar link (Streamer / Indication): campo + botao na mesma linha e mesma altura.
   O .btn-theme-solid traz margin-top:10px (feito para blocos empilhados) e ficava desalinhado. */
.input-container-box.d-flex {
    align-items: stretch;
}

.input-container-box.d-flex > input {
    flex: 1 1 auto;
    min-width: 0;
}

.input-container-box.d-flex > .btn-theme-solid {
    margin-top: 0;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 1rem;
}

.input-container-box.d-flex > .btn-theme-solid .material-symbols-outlined {
    font-size: 1.2rem;
    text-transform: none;
}

/* ==========================================================================
   V7 (out/2026) - Subscribe no /vip (grade de assinaturas, notify vip.plans)
   --------------------------------------------------------------------------
   O style-bb.css do forest pinta TODO elemento button sem .btn com
   button:not(.carousel-control-prev):not(.carousel-control-next):not(.carousel-indicators button)
   :not(.btn):not(.dropdown-item):not(.dropdown-toggle):not(.btn-theme-solid) - especificidade 0,7,2:
   fundo #b4a814, padding 12px 28px, 11px maiusculo, sombra - e o :hover (0,5,2) troca para #c1b51c.
   Os botoes Mensal/Anual e Assinar do plugin nao tem .btn e saiam com esse dourado-oliva. Reposicao
   SO nesses dois componentes, com !important (nenhuma cadeia de classe razoavel vence 0,7,2).
   Visual = .btn-theme-solid do proprio forest: gradiente cobre #c07334 -> #774318, borda #4e1910,
   texto branco maiusculo em negrito; ativo/hover = gradiente #774318 -> #4e1910 (.btn-theme-solid.active).
   #fff sobre o #c07334 liso dava 3.7:1 - no gradiente o texto fica sobre o tom medio (~5:1).
   ========================================================================== */
button.subscribe-billing-btn {
    padding: .4rem 1.25rem !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--v7-muted) !important;
    font-size: .75rem !important;
    font-weight: 700;
    text-transform: uppercase !important;
    letter-spacing: .03em;
    box-shadow: none !important;
}

button.subscribe-billing-btn:hover {
    background: rgba(var(--v7-primary-rgb), .14) !important;
    color: var(--v7-accent) !important;
}

button.subscribe-billing-btn.is-active,
button.subscribe-billing-btn.is-active:hover {
    background: linear-gradient(180deg, var(--v7-primary-hover) 0%, var(--v7-accent-hover) 100%) !important;
    color: #fff !important;
}

button.subscribe-plan-btn {
    padding: .7rem 1rem !important;
    border: 1px solid var(--v7-accent-hover) !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, var(--v7-primary) 0%, var(--v7-primary-hover) 100%) !important;
    color: #fff !important;
    font-size: .75rem !important;
    font-weight: 700;
    text-transform: uppercase !important;
    letter-spacing: .04em;
    box-shadow: none !important;
}

button.subscribe-plan-btn:hover:not(:disabled) {
    background: linear-gradient(180deg, var(--v7-primary-hover) 0%, var(--v7-accent-hover) 100%) !important;
    box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .2) !important;
}

button.subscribe-plan-btn:disabled {
    opacity: .55;
    cursor: not-allowed !important;
}