/* ==========================================================================
   wonder - camada V7
   --------------------------------------------------------------------------
   ADITIVO: carrega por ULTIMO (layouts/default e page-builder). Nunca redefine
   classe que o CSS original do tema ja estiliza (cssfilter.pl). Cores so via --v7-*.
   Base: SO o app.css do tema default (extract.pl + recolor.pl) + migr/wonder.tail.css.
   Paleta ESCURA azul-marinho do wonder (style.css/no-strap.css/helpers.css): fundo #030508 /
   #040609, paineis #12141e / #12141f, texto #fff, muted #696868, destaque laranja #fc9162 /
   #cc7954, pessego #ffdda9 / #fcedc0, roxo #a97fff, azul #7888ff. Primario laranja = texto
   escuro sobre ele (oncolor). Dois Bootstrap carregados (app.css sem prefixo + boostrap.mim.css).
   ========================================================================== */

:root {
    --v7-bg: #030508;
    --v7-bg-rgb: 3, 5, 8;
    --v7-surface: #12141e;
    --v7-card: #12141e;
    --v7-card-rgb: 18, 20, 30;
    --v7-sunken: #040609;
    --v7-sidebar: #12141f;
    --v7-primary: #fc9162;
    --v7-primary-rgb: 252, 145, 98;
    --v7-primary-bright: #ffdda9;
    --v7-primary-bright-rgb: 255, 221, 169;
    --v7-primary-hover: #cc7954;
    --v7-accent: #ffdda9;
    --v7-accent-rgb: 255, 221, 169;
    --v7-accent-hover: #fcedc0;
    --v7-text: #ffffff;
    --v7-muted: #969494;
    --v7-muted-rgb: 150, 148, 148;
    --v7-line: #36383a;
    --v7-line-soft: #4a4c50;
    --v7-shadow: 0 0 10px rgba(0, 0, 0, .6);
    --v7-success-bg: rgba(120, 136, 255, .12);
    --v7-success-fg: #8fe39b;
    --v7-warning-bg: rgba(252, 145, 98, .12);
    --v7-warning-fg: #fc9162;
    --v7-danger-bg: rgba(255, 42, 0, .14);
    --v7-danger-fg: #ff6a4d;
    --v7-info-bg: rgba(169, 127, 255, .12);
    --v7-info-fg: #a97fff;
    --v7-primary-soft: rgba(252, 145, 98, .14);
}

/* ==========================================================================
   Cobertura D4: classes emitidas pelas views do tema + views de plugin sem
   override, estilizadas no app.css do DEFAULT e sem regra no CSS do tema
   (extract.pl + recolor.pl)
   ========================================================================== */

.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);
    border-radius:.375rem;
    overflow:hidden;
}


.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:#0b5ed7;
    border-top-color:#b6d4fe;
}


.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;
}


.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  {
    
    color:var(--v7-muted);
}


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


.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-hover);
}


.plan-card-featured .plan-card-icon  {
    
    color:#fff;
    opacity:.85;
}


.plan-card-featured .plan-card-name  {
    
    color:#fff;
}


.card-stats  {
    
    display:flex;
    gap:.35rem;
    margin-top:.45rem;
}


.card-stat  {
    
    flex:1;
    background:var(--v7-sunken);
    border:1px solid var(--v7-line);
    border-radius:.375rem;
    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,
.card-stat-value .small  {
    
    font-size:.68rem;
    font-weight:400;
    color:var(--v7-muted);
}


.card-stat-value--price  {
    
    color:#dc3545;
}


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


.gateway-card:hover  {
    
    border-color:var(--v7-primary-bright);
    box-shadow:0 0 0 3px #cfe2ff;
}


.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:.85rem;
    font-weight:600;
    color:#12141e;
    background:var(--v7-primary);
    flex-shrink:0;
}


.item-rarity-badge  {
    
    position:absolute;
    bottom:4px;
    left:4px;
    font-size:.6rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.05em;
    padding:2px 5px;
    border-radius:.375rem;
    background:var(--rarity-color, var(--v7-primary));
    color:#fff;
    line-height:1.2;
    pointer-events:none;
}


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


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


.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:#dc3545;
}


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


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


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


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


.view-sidebar-row dd,
.market-item-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;
    border-radius:.375rem;
}


.page-tabs  {
    
    background:linear-gradient(to bottom, transparent calc(100% - 2px), var(--v7-line) calc(100% - 2px));
    margin-bottom:1rem;
    gap:0;
    flex-wrap:nowrap;
    overflow-x:auto;
    scrollbar-width:none;
}


.page-tabs::-webkit-scrollbar  {
    
    display:none;
}


.page-tabs .nav-link  {
    
    font-size:.85rem;
    font-weight:700;
    text-transform:uppercase;
    color:var(--v7-muted);
    padding:.55rem 1rem;
    white-space:nowrap;
}


.page-tabs .nav-link:hover  {
    
    color:var(--v7-accent);
    background:linear-gradient(to bottom, transparent calc(100% - 2px), var(--v7-primary-bright) calc(100% - 2px));
}


.page-tabs .nav-link.active  {
    
    color:var(--v7-accent);
    background:linear-gradient(to bottom, transparent calc(100% - 2px), var(--v7-primary) calc(100% - 2px));
}


.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;
}


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


.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;
}


.events-row  {
    
    display:flex;
    align-items:center;
    padding:.3rem 0;
}


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


.events-row-name  {
    
    display:block;
    font-size:.84rem;
    font-weight:600;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}


.events-row-next  {
    
    display:block;
    font-size:.7rem;
    color:var(--v7-muted);
    margin-top:.05rem;
}


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


.events-row-countdown  {
    
    font-size:.74rem;
    font-weight:600;
    padding:.2rem .45rem;
    border-radius:.375rem;
    background:rgba(255,255,255,.07);
    color:var(--v7-muted);
    transition:background .3s,color .3s;
}


.events-row.is-soon .events-row-countdown  {
    
    background:rgba(25,135,84,.15);
    color:var(--v7-success-fg);
}


.events-row.is-upcoming .events-row-countdown  {
    
    background:rgba(255,193,7,.12);
    color:#ffc107;
}


.events-row.is-live .events-row-countdown  {
    
    background:rgba(220,53,69,.15);
    color:#dc3545;
}


.events-row.is-live .events-row-next  {
    
    color:#dc3545;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.03em;
}


.events-row-notify  {
    
    margin:0;
}


.events-row-notify .form-check-input  {
    
    width:1.8em;
    height:.9em;
    margin-top:0;
    cursor:pointer;
}


[data-spotlight] .events-row  {
    
    padding:.25rem 0;
}


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


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


[data-spotlight] .events-row-countdown  {
    
    font-size:.7rem;
}


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


.market-account-char-tab  {
    
    display:flex;
    gap:1.25rem;
    flex-wrap:wrap;
    align-items:flex-start;
}


.market-account-char-info  {
    
    border:1px solid var(--v7-line);
    border-radius:.375rem;
    overflow:hidden;
    flex:1;
    min-width:200px;
}


.market-account-char-info-section  {
    
    display:block;
    font-size:.62rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.05em;
    color:var(--v7-muted);
    padding:.5rem .85rem .2rem;
}


.market-account-char-info-attrs  {
    
    margin:0;
}


.market-account-char-info-attr  {
    
    display:flex;
    align-items:center;
    gap:.6rem;
    padding:.38rem .85rem;
    border-bottom:1px solid var(--v7-line);
}


.market-account-char-info-attr:last-child  {
    
    border-bottom:none;
}


.market-account-char-info-attr dt  {
    
    flex:1;
    font-weight:400;
    color:var(--v7-muted);
    font-size:.8rem;
}


.market-account-char-info-attr dd  {
    
    margin:0;
    font-weight:700;
    font-size:.85rem;
}


.market-account-char-info-attr-dot  {
    
    width:8px;
    height:8px;
    border-radius:50%;
    flex-shrink:0;
}


.market-account-char-info-attr-dot-str  {
    
    background:#dc3545;
}


.market-account-char-info-attr-dot-agi  {
    
    background:#ffc107;
}


.market-account-char-info-attr-dot-vit  {
    
    background:#198754;
}


.market-account-char-info-attr-dot-ene  {
    
    background:var(--v7-primary);
}


.market-account-char-info-attr-dot-cmd  {
    
    background:var(--v7-sunken);
}


.market-account-char-info-rows  {
    
    margin:0;
    border-top:1px solid var(--v7-line);
}


.market-account-char-info-row  {
    
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    gap:.5rem;
    padding:.35rem .85rem;
    font-size:.8rem;
    border-bottom:1px solid var(--v7-line);
}


.market-account-char-info-row:last-child  {
    
    border-bottom:none;
}


.market-account-char-info-row dt  {
    
    font-weight:400;
    color:var(--v7-muted);
}


.market-account-char-info-row dd  {
    
    margin:0;
    font-weight:500;
    text-align:right;
}


.market-account-inventory  {
    
    overflow-x:auto;
}


.market-account-warehouse  {
    
    overflow-x:auto;
}


.market-product  {
    
    height:100%;
}


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


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


.market-product-image img  {
    
    max-height:80px;
    width:auto;
}


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


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


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


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


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


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


.market-filter-icon  {
    
    font-size:1.2rem;
    width:1.2rem;
    height:1.2rem;
}


.market-filter-heading  {
    
    display:block;
    font-size:.68rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.04em;
    color:var(--v7-muted);
    margin-bottom:.5rem;
}


.market-pill-grid  {
    
    display:grid;
    gap:.25rem;
    grid-template-columns:repeat(auto-fill, minmax(2.25rem, 1fr));
}


@media(min-width:992px)  {
    

.market-pill-grid  {
    
    grid-template-columns:repeat(6, minmax(0, 1fr));
}

}


.market-category-pill  {
    
    display:flex;
    align-items:center;
    justify-content:center;
    padding:.3rem .2rem;
    border:1px solid var(--v7-line);
    border-radius:.375rem;
    cursor:pointer;
    line-height:1;
    transition:border-color .12s ease,background-color .12s ease,color .12s ease;
    background:rgba(0,0,0,0);
    color:var(--v7-text);
    user-select:none;
}


.market-category-pill-icon  {
    
    font-size:1.3rem;
    width:1.3rem;
    height:1.3rem;
    opacity:.5;
    transition:opacity .12s ease;
}


.market-category-pill-icon img  {
    
    display:block;
    width:100%;
    height:100%;
}


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


.market-category-pill:hover .market-category-pill-icon  {
    
    opacity:1;
}


.market-category-pill--empty  {
    
    opacity:.35;
}


.btn-check:checked+.market-category-pill  {
    
    border-color:var(--v7-primary-bright);
    background:var(--v7-primary-soft);
    color:var(--v7-primary-hover);
}


.btn-check:checked+.market-category-pill .market-category-pill-icon  {
    
    opacity:1;
}


.market-class-pill  {
    
    display:flex;
    align-items:center;
    justify-content:center;
    padding:.25rem;
    border:1px solid var(--v7-line);
    border-radius:.375rem;
    cursor:pointer;
    transition:border-color .12s ease,background-color .12s ease;
    background:rgba(0,0,0,0);
    user-select:none;
}


.market-class-pill img  {
    
    display:block;
    height:26px;
    width:auto;
    opacity:.7;
    transition:opacity .12s ease;
}


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


.market-class-pill:hover img  {
    
    opacity:1;
}


.btn-check:checked+.market-class-pill  {
    
    border-color:var(--v7-primary-bright);
    background:var(--v7-primary-soft);
}


.btn-check:checked+.market-class-pill img  {
    
    opacity:1;
}


.market-order-select  {
    
    width:auto;
}


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


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


.market-empty p  {
    
    margin:0;
}


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


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


.market-item-price-diff-above  {
    
    color:#c6303e;
}


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


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


.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);
}


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


@media(max-width:767.98px)  {
    

.market-item-details  {
    
    flex-direction:column;
}

}


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


.market-item-info  {
    
    flex:0 0 auto;
    min-width:240px;
    max-width:100%;
    background:#0b0b0f;
    border-radius:.375rem;
    padding:1rem 1.25rem;
}


.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;
    border-radius:.375rem;
}


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


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


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


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


.market-item-stat-value-price  {
    
    color:#dc3545;
}


.market-item-empty  {
    
    padding:1.5rem 1rem;
}


.market-item-empty .market-empty-icon  {
    
    font-size:2.5rem;
    width:2.5rem;
    height:2.5rem;
    margin-bottom:.5rem;
}


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


.market-item-chart  {
    
    display:block;
    width:100%;
    height:auto;
    border-radius:.375rem;
}


.market-item-chart-grid  {
    
    stroke:var(--v7-line);
    stroke-width:1;
    stroke-dasharray:3 3;
    vector-effect:non-scaling-stroke;
}


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


.market-item-chart-area  {
    
    fill:rgba(var(--v7-primary-rgb), .12);
}


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


.market-item-chart-point  {
    
    fill:var(--v7-accent);
    stroke:#fff;
    stroke-width:2;
    cursor:pointer;
    transition:r .12s ease;
}


.market-item-chart-point:hover  {
    
    r:6;
}


.market-item-chart-tooltip  {
    
    position:absolute;
    pointer-events:none;
    z-index:5;
    transform:translate(-50%, calc(-100% - 10px));
    background:var(--v7-sunken);
    color:#fff;
    font-size:.72rem;
    font-weight:600;
    white-space:nowrap;
    padding:.3rem .55rem;
    border-radius:.375rem;
}


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


.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:#dc3545;
    white-space:nowrap;
}


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


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


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


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


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


.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;
    border-radius:.375rem;
}


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


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


.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);
    border-radius:.375rem;
}


.market-prices-filters  {
    
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:.75rem 1.5rem;
    margin-bottom:2rem;
    border-radius:.375rem;
}


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


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


.market-prices-filters .form-select  {
    
    width:auto;
    min-width:130px;
}


.market-character  {
    
    height:100%;
}


.market-character .card  {
    
    height:100%;
    display:flex;
    flex-direction:column;
    border-radius:.375rem;
    overflow:hidden;
}


.market-character-header  {
    
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:.5rem;
    padding:.65rem .85rem;
    background:var(--v7-sunken);
    border-bottom:1px solid var(--v7-line);
    flex-shrink:0;
}


.market-character-name  {
    
    font-size:.9rem;
    font-weight:700;
    color:var(--v7-text);
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}


.market-character-reserved  {
    
    font-size:.62rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.05em;
    padding:.2rem .5rem;
    border-radius:.375rem;
    background:#fff0c1;
    color:#8c6a04;
    flex-shrink:0;
    white-space:nowrap;
}


.market-character-avatar  {
    
    display:flex;
    justify-content:center;
    padding:.5rem 0 .25rem;
}


.market-character-avatar-img  {
    
    width:72px;
    height:80px;
    object-fit:cover;
    border:1px solid var(--v7-line);
    border-radius:.375rem;
}


.market-character-class  {
    
    text-align:center;
    font-size:.78rem;
    color:var(--v7-muted);
    margin-bottom:.25rem;
}


.market-character-title  {
    
    text-align:center;
    font-size:.8rem;
    color:var(--v7-text);
    padding:0 .25rem;
    margin-bottom:.5rem;
    overflow:hidden;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
}


.market-character-stats  {
    
    display:flex;
    justify-content:center;
    gap:.75rem;
    padding:.35rem 0;
    border-top:1px solid var(--v7-line);
    border-bottom:1px solid var(--v7-line);
    margin-bottom:.5rem;
}


.market-character-stat  {
    
    display:flex;
    flex-direction:column;
    align-items:center;
    min-width:0;
}


.market-character-stat-label  {
    
    font-size:.62rem;
    text-transform:uppercase;
    letter-spacing:.04em;
    color:var(--v7-muted);
}


.market-character-stat-value  {
    
    font-size:.85rem;
    font-weight:700;
    color:var(--v7-text);
}


.market-character-portrait  {
    
    max-width:100%;
    max-height:180px;
    border-radius:.375rem;
}


.server-rates  {
    
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    background:var(--v7-primary);
    border-radius:.375rem;
    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-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);
    border-radius:.375rem;
    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);
}


.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;
}


.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-radius:.375rem;
}


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


.server-event-pill-on  {
    
    background:#ddede5;
    color:var(--v7-success-fg);
}


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


.server-commands  {
    
    border:1px solid var(--v7-line);
    border-radius:.375rem;
    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;
}


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


.auction-item--warning .card  {
    
    border-color:#ffc107 !important;
    animation:auction-pulse-warning 1s ease-in-out infinite;
}


.auction-item--danger .card  {
    
    border-color:#dc3545 !important;
    animation:auction-pulse-danger .6s ease-in-out infinite;
}


.auction-item--expired  {
    
    opacity:0;
    transition:opacity .4s ease;
    pointer-events:none;
}


.auction-bid-info  {
    
    display:flex;
    gap:.5rem;
    margin-bottom:.75rem;
}


.raffle-number  {
    
    display:flex;
    align-items:center;
    justify-content:center;
    height:2.6rem;
    border-radius:.375rem;
    font-size:.75rem;
    font-weight:600;
    border:1px solid rgba(0,0,0,0);
    padding:0;
    cursor:default;
    transition:background .12s,color .12s,border-color .12s,transform .1s;
    line-height:1;
}


.raffle-number--available  {
    
    background:var(--v7-sunken);
    border-color:var(--v7-line);
    color:var(--v7-text);
    cursor:pointer;
}


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


.raffle-number--available.raffle-number--selected  {
    
    background:var(--v7-primary);
    border-color:var(--v7-primary-bright);
    color:#12141e;
    transform:scale(1.08);
}


.raffle-number--mine  {
    
    background:#cce5d9;
    border-color:#81bda1;
    color:var(--v7-success-fg);
}


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


.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);
    border-radius:.375rem;
}


.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:#ffc107;
}


.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);
}


.streamers.is-loaded  {
    
    display:block;
}


.streamers-container  {
    
    display:flex;
}


.streamers-online  {
    
    display:flex;
    padding:10px;
    background:var(--v7-primary-soft);
    border:1px solid var(--v7-line-soft);
    border-right:0;
}


.streamers-title  {
    
    background:var(--v7-primary);
    writing-mode:vertical-rl;
    text-orientation:mixed;
    color:#12141e;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:.5rem;
    text-transform:uppercase;
    font-size:.75rem;
    font-weight:700;
    letter-spacing:.1em;
    border:1px solid var(--v7-line-soft);
    text-decoration:none;
}


.streamers-title:hover  {
    
    color:#fff;
}


.streamers-streamer-name  {
    
    position:absolute;
    top:0;
    left:0;
    right:0;
    color:#12141e;
    background:var(--v7-primary);
    padding:2px 4px;
    text-align:center;
    z-index:2;
    font-size:.7rem;
}


.streamers-streamer-thumb  {
    
    position:relative;
}


.streamers-streamer-thumb-user  {
    
    position:absolute;
    bottom:0;
    left:0;
}


.streamers-streamer-platform  {
    
    position:absolute;
    bottom:0;
    right:0;
    padding:1px 4px;
    font-size:.6rem;
    font-weight:700;
    text-transform:uppercase;
    color:#fff;
    background:#9146ff;
    border-radius:.375rem 0 0 0;
}


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


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


.ticket-rate-btn--active  {
    
    color:#ffc107;
    transform:scale(1.1);
}


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


.lootbox-wheel  {
    
    padding:1.5rem 1.5rem 2rem;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:1.75rem;
}


.lootbox-wheel canvas  {
    
    display:block;
    max-width:min(480px,100%);
    height:auto;
    position:relative;
    z-index:1;
}


.lootbox-case-window  {
    
    position:relative;
    overflow:hidden;
    height:240px;
    display:flex;
    align-items:center;
}


.lootbox-case-shadow  {
    
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    box-shadow:inset 60px 0 120px -20px #080808,inset -60px 0 120px -20px #080808;
    overflow:hidden;
    z-index:100;
    pointer-events:none;
}


.lootbox-case-line  {
    
    position:absolute;
    top:-5px;
    bottom:-5px;
    left:50%;
    width:2px;
    margin-left:-1px;
    background-color:var(--v7-primary);
    z-index:101;
}


.lootbox-case-line::before  {
    
    content:"";
    position:absolute;
    left:50%;
    top:-5px;
    transform:translate(-50%, -100%);
    width:0;
    height:0;
    border-left:10px solid rgba(0,0,0,0);
    border-right:10px solid rgba(0,0,0,0);
    border-top:14px solid var(--v7-primary-bright);
}


.lootbox-case-line::after  {
    
    content:"";
    position:absolute;
    left:50%;
    transform:translate(-50%, -100%);
    width:0;
    height:0;
    border-left:10px solid rgba(0,0,0,0);
    border-right:10px solid rgba(0,0,0,0);
    border-bottom:14px solid var(--v7-primary-bright);
    bottom:-33px;
}


.lootbox-case-rotatable  {
    
    display:flex;
    will-change:transform;
    gap:8px;
}


.lootbox-case-item  {
    
    flex:0 0 auto;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    width:200px;
    height:200px;
    border:2px solid var(--lootbox-item-rarity);
    background-color:var(--lootbox-item-rarity);
    position:relative;
    z-index:100;
    color:#fff;
    padding:10px;
    border-radius:.375rem;
}


.lootbox-case-item::before  {
    
    content:"";
    width:100%;
    height:100%;
    background:linear-gradient(180deg, rgba(0, 0, 0, 0.82) 0%, rgba(0, 0, 0, 0.45) 100%);
    position:absolute;
    inset:0;
    z-index:-1;
    border-radius:.375rem;
}


.lootbox-case-item-image  {
    
    display:flex;
    align-items:center;
    justify-content:center;
    flex:1;
}


.lootbox-case-item-image img  {
    
    max-width:80%;
    max-height:80%;
}


.lootbox-case-item-name  {
    
    text-align:center;
    font-size:.72rem;
    padding:.2rem 0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    width:100%;
}


.lootbox__item  {
    
    --lootbox-item-rarity:#ced4da;
    min-width:0;
    padding:.75rem .75rem .6rem;
    display:flex;
    flex-direction:column;
    border:2px solid var(--lootbox-item-rarity);
    background-color:var(--lootbox-item-rarity);
    position:relative;
    z-index:100;
    color:#fff;
    border-radius:.375rem;
}


.lootbox__item::before  {
    
    content:"";
    width:100%;
    height:100%;
    background:linear-gradient(180deg, rgba(0, 0, 0, 0.82) 0%, rgba(0, 0, 0, 0.45) 100%);
    position:absolute;
    inset:0;
    z-index:-1;
    border-radius:.375rem;
}


.lootbox__item-image  {
    
    height:72px;
    display:flex;
    justify-content:center;
    align-items:center;
    margin-bottom:.4rem;
}


.lootbox__item-image img  {
    
    width:52px;
    height:52px;
    object-fit:contain;
}


.lootbox__item-percent  {
    
    position:absolute;
    top:.25rem;
    right:.3rem;
    font-size:.62rem;
    opacity:.65;
    font-weight:600;
}


.lootbox__item-name  {
    
    text-align:center;
    font-size:.75rem;
    font-weight:600;
    margin-bottom:.2rem;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    line-height:1.3;
}


.lootbox__item-rarity  {
    
    text-align:center;
    text-transform:uppercase;
    color:var(--lootbox-item-rarity);
    font-weight:700;
    font-size:.6rem;
    letter-spacing:.04em;
    filter:brightness(1.8);
}


.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  {
    
    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:#12141e;
}


.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:var(--v7-success-fg);
}


.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:var(--v7-success-fg);
}


.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:#12141e;
    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;
}


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


.avatar-upload-zone:hover  {
    
    border-color:var(--v7-primary-bright);
    background:#f0f6ff;
}


.avatar-upload-zone--has-file  {
    
    padding:0;
    border-style:solid;
    border-color:var(--v7-primary-bright);
    background:rgba(0,0,0,0);
}


.avatar-upload-zone--error  {
    
    border-color:#dc3545;
    border-style:solid;
    background:var(--v7-danger-bg);
}


.avatar-upload-zone--error:hover  {
    
    border-color:#dc3545;
    background:var(--v7-danger-bg);
}


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


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


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


.page-block-guides-title  {
    
    margin-bottom:2rem;
}


.page-block-guides-card  {
    
    display:block;
    padding:1.25rem;
    border:1px solid var(--v7-line);
    border-radius:.375rem;
    margin-bottom:1.5rem;
    text-decoration:none;
    color:var(--v7-text);
    transition:border-color .2s,box-shadow .2s;
}


.page-block-guides-card:hover  {
    
    border-color:var(--v7-primary-bright);
    box-shadow:0 2px 8px rgba(0,0,0,.08);
    color:var(--v7-accent);
}


.page-block-guides-card-title  {
    
    font-weight:600;
    margin-bottom:.375rem;
}


.page-block-guides-card-desc  {
    
    font-size:.875rem;
    color:var(--v7-muted);
    overflow:hidden;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
}


.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:var(--v7-success-fg);
}


.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:#12141e;
}


.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-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);
    color:#12141e;
    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);
}


.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:#12141e;
    font-weight:600;
    transition:background .15s ease;
}


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


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


.item-info  {
    
    color:#fff;
    margin:0;
    font-size:.75rem;
    text-align:center;
    border-radius:.375rem;
}


.item-info .description  {
    
    margin-top:3px;
}


.item-info .pentagram  {
    
    margin-top:10px;
}


.item-info .name  {
    
    font-size:.85rem;
}


/* ==========================================================================
   wonder - reposicoes proprias (valores do app.css do DEFAULT e do CSS do tema;
   nenhum valor copiado de outro tema). Base comum do lote (aprovada no godz).
   ========================================================================== */

/* Renderizadores do core (inventario/bau do getRenderer()->render(), paper-doll do perfil): classes do core, nao das
   views - o extrator nao as ve. Valores do app.css do default; celulas na cor dos tokens do tema. */
.morpheus-inventory-equipments {
    display: none;
}
.morpheus-inventory-items {
    position: relative;
    width: 256px;
    height: 256px;
}
.morpheus-warehouse {
    position: relative;
    width: 256px;
    height: 480px;
}
.morpheus-inventory-items .item,
.morpheus-warehouse .item {
    position: absolute;
    background-color: var(--v7-primary-soft);
    border: 1px solid var(--v7-line);
}
.morpheus-inventory-items .item .image,
.morpheus-warehouse .item .image {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}
.market-account-inventory,
.market-account-warehouse {
    overflow-x: auto;
}

/* Icones Material Symbols: ligadura sempre ativa e sem caixa alta herdada dos titulos/botoes do tema. */
.material-symbols-outlined {
    font-family: "Material Symbols Outlined";
    font-weight: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    direction: ltr;
    font-feature-settings: "liga";
    -webkit-font-smoothing: antialiased;
}

/* ItemMarket: icone da categoria = SVG do core (resources/images/item-category/{slug}.svg) como mascara na cor do texto. */
.market-category-pill-svg {
    display: block;
    width: 1.5rem;
    height: 1.5rem;
    background-color: currentColor;
    -webkit-mask: var(--cat-icon) center / contain no-repeat;
    mask: var(--cat-icon) center / contain no-repeat;
}

/* LootBox: a seta inferior do marcador (.lootbox-case-line::after, bottom -33px no app.css do default) cai sobre o
   preco se a view nao deixa espaco depois da esteira (godz). */
.lootbox-case {
    margin-bottom: 2.75rem;
}

/* ==========================================================================
   wonder - componentes V7 no desenho do tema (lote 4, out/2026)
   ========================================================================== */

/* Views de plugin SEM override (BattlePass, Subscribe, CharacterMarket, ItemMarket show/prices, Rescue/confirm,
   Exchange/exchange-wallet, Tracker/release...): montam .page > .page-title (h1 + breadcrumb) + .page-body. O app.css do
   tema pinta .page de BRANCO (#fff, como no godz). Moldura = o painel .content do wonder (style.css: imagens de topo e
   base, #12141e, padding 35px); titulo = .h2-title span + .h2-title-content (cor #cc7954, Philosopher, icone, filete). */
.page {
    background: url(../images/content-top-bg.jpg) center top repeat-x,
        url(../images/content-bottom-bg.jpg) center bottom repeat-x;
    background-color: #12141e;
    box-shadow: none;
    padding: 35px;
    color: #fff;
}
.page > .page-title {
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    padding-bottom: 25px;
    margin-bottom: 25px;
}
.page > .page-title h1 {
    position: relative;
    display: block;
    padding-left: 25px;
    margin: 0;
    color: #cc7954;
    font-family: "Philosopher", sans-serif;
    font-size: 18px;
    text-transform: uppercase;
}
.page > .page-title h1::before {
    content: "";
    position: absolute;
    background: url(../images/title-icon.png) no-repeat;
    width: 26px;
    height: 26px;
    left: -5px;
    top: 50%;
    margin-top: -13px;
    filter: drop-shadow(0 0 10px #ff2a00);
}
.page > .page-title .breadcrumb {
    margin: 10px 0 0;
    padding: 0;
    background: transparent;
    font-size: 13px;
}
.page .breadcrumb-item a {
    color: #696868;
}
.page .breadcrumb-item.active,
.page .breadcrumb-item + .breadcrumb-item::before {
    color: #969494;
}
@media (max-width: 767px) {
    .page {
        padding: 20px 15px;
    }
}

/* Regra GLOBAL do tema: `button, .button { background:url(button.png); background-size:100% 100% !important; height:40px;
   color:#fff !important; text-transform:uppercase; box-shadow }` (D23) vence os <button> de componente V7. Reposicao so
   desses (valores da propria regra V7); botoes de ACAO continuam no desenho do tema. */
button.ticket-rate-btn,
button.subscribe-billing-btn,
button.subscribe-plan-btn,
button.battlepass-btn-claim,
button.battlepass-btn-premium,
button.btn-close,
button.sidebar-toggler {
    background-image: none;
    height: auto;
    box-shadow: none;
    letter-spacing: normal;
    text-transform: none;
    font-family: inherit;
}
button.btn-close {
    background: transparent var(--bs-btn-close-bg) center / 1em auto no-repeat;
    filter: invert(1) grayscale(100%) brightness(200%);
}
.ticket-rate-stars {
    display: flex;
    gap: .25rem;
}
button.ticket-rate-btn {
    font-size: 2rem;
    line-height: 1;
    padding: 0;
    color: #969494 !important;
}
button.ticket-rate-btn:hover,
button.ticket-rate-btn.ticket-rate-btn--active {
    color: #fc9162 !important;
}
button.subscribe-plan-btn,
button.battlepass-btn-claim,
button.battlepass-btn-premium,
button.subscribe-billing-btn.is-active {
    color: #12141e !important;
}
button.subscribe-billing-btn {
    color: #969494 !important;
}
.sidebar-toggler svg path {
    stroke: currentColor;
}

/* Tom Select: o tema escurece o ELEMENTO select (style.css: #040609, borda #36383a); o Tom Select vira div.ts-wrapper.
   form-select e caia no .form-select do Bootstrap claro (--bs-body-bg #fff). Mesmos valores do select do tema. */
.ts-wrapper.form-select,
.ts-wrapper.form-control {
    background-color: #040609;
    border: 1px solid #36383a;
    color: #fff;
}
.ts-wrapper.form-select.focus {
    border-color: #fc9162;
    box-shadow: 0 0 10px 0 rgba(252, 142, 98, .6);
}
.ts-dropdown {
    background: #12141e;
    border-color: #36383a;
    color: #fff;
}
.ts-dropdown .option:hover,
.ts-dropdown .option.active {
    background: rgba(252, 145, 98, .15);
    color: #ffdda9;
}
.ts-wrapper.multi .ts-control > div {
    background: rgba(252, 145, 98, .2);
    color: #ffdda9;
    border-radius: 2px;
}

/* Rifa: o tema pinta o escolhido como .raffle .number.active; o raffle.js V7 alterna .raffle-number--selected. */
.raffle .number.raffle-number--selected {
    background: #4f38a7;
    text-shadow: 0 0 10px #fff;
    box-shadow: inset 0 0 11px rgb(96, 68, 141);
}
.raffle .number.allowed.raffle-number--sold {
    opacity: .5;
    pointer-events: none;
}

/* WebShop: categoria ativa no desenho do :hover do tema. */
.category ul li a.active {
    color: #7888ff;
}

/* Leilao: estados que o auction.js poe no .card (D8); preco do melhor lance que o poll marca. */
.auction-item--warning,
.card.auction-item--warning {
    box-shadow: 0 0 0 1px rgba(252, 145, 98, .6);
}
.auction-item--danger,
.card.auction-item--danger {
    box-shadow: 0 0 0 1px rgba(255, 42, 0, .7);
}
.auction-item--expired,
.card.auction-item--expired {
    opacity: .5;
}
.card-stat-value--price {
    color: #ffdda9;
}

/* Bootstrap do tema: .btn-info/.btn-outline-* (ciano/azul de fabrica), .btn.disabled (borda azul), .progress com trilha
   clara - na paleta do wonder. */
.btn-info,
.btn-outline-primary,
.btn-outline-secondary {
    --bs-btn-color: #ffdda9;
    --bs-btn-border-color: #fc9162;
    --bs-btn-hover-color: #12141e;
    --bs-btn-hover-bg: #fc9162;
    --bs-btn-hover-border-color: #fc9162;
    --bs-btn-active-color: #12141e;
    --bs-btn-active-bg: #cc7954;
    --bs-btn-active-border-color: #cc7954;
    --bs-btn-disabled-color: #969494;
    --bs-btn-disabled-border-color: #36383a;
}
.btn-primary.disabled,
.btn-primary:disabled {
    --bs-btn-disabled-border-color: #36383a;
    opacity: .6;
}
.progress {
    --bs-progress-bg: #040609;
    --bs-progress-bar-bg: #fc9162;
}

/* server/info e vip/advantages (A2, estrutura do default) no painel do tema. */
.server-rates {
    background: #040609;
    border: 1px solid #36383a;
}
.server-rate-icon,
.server-rate-value {
    color: #fc9162;
}
.server-stat,
.plan-card {
    background: #12141e;
    border-color: #36383a;
}
.server-command kbd {
    background: #040609;
    color: #ffdda9;
    border: 1px solid #36383a;
}
.server-event-pill-on {
    background: rgba(120, 136, 255, .14);
    border: 1px solid rgba(120, 136, 255, .35);
}
.plan-card-featured .plan-card-category {
    background: rgba(252, 145, 98, .12);
    color: #ffdda9;
    border-top-color: #36383a;
}

/* Pasteis claros do default (lacuna D4). */
.raffle-number--mine {
    background: rgba(169, 127, 255, .15);
    border-color: rgba(169, 127, 255, .45);
}
.avatar-upload-zone:hover {
    background: rgba(252, 145, 98, .08);
}
.market-character-reserved {
    background: rgba(252, 145, 98, .15);
    color: #fc9162;
    border: 1px solid rgba(252, 145, 98, .35);
}

/* Checkout: o checkout.js poe .is-active no tile [data-checkout-amount] escolhido - mesmo desenho do .button.active do
   tema; Continuar desabilitado ate escolher valor e gateway. */
.button.is-active,
[data-checkout-amount].is-active {
    box-shadow: inset 0 -3px 25px rgba(91, 64, 191, .859), inset 0 -3px 5px rgba(201, 186, 255, .859);
    filter: drop-shadow(0 0 15px rgb(37, 28, 108));
    text-shadow: 0 0 5px #fff;
}
[data-checkout-continue]:disabled,
[data-checkout-continue][disabled] {
    opacity: .5;
    filter: grayscale(.6);
    pointer-events: none;
}
/* Alias Bootstrap 4 (D9): .badge-primary dos rankings do tema nao existe no BS5 (selo sem fundo). */
.badge-primary {
    background-color: #fc9162;
    color: #12141e;
}
