/* ==========================================================================
   wolf - 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/wolf.tail.css.
   Paleta ESCURA do wolf (style.css :root): --bg #07080c / --panel #10131a, texto --text
   #f5f1e8, muted --muted #9aa0ad, borda --border rgba(255,255,255,.09), destaque --cyan
   #20e0ff e --violet #8d65ff, ouro --gold #e4b85b, --success #36ff8a, --danger #ff4d5e.
   ========================================================================== */

:root {
    --v7-bg: #07080c;
    --v7-bg-rgb: 7, 8, 12;
    --v7-surface: #0c0f16;
    --v7-card: #10131a;
    --v7-card-rgb: 16, 19, 26;
    --v7-sunken: #050608;
    --v7-sidebar: #0c0f16;
    --v7-primary: #20e0ff;
    --v7-primary-rgb: 32, 224, 255;
    --v7-primary-bright: #7eebff;
    --v7-primary-bright-rgb: 126, 235, 255;
    --v7-primary-hover: #7eebff;
    --v7-accent: #20e0ff;
    --v7-accent-rgb: 32, 224, 255;
    --v7-accent-hover: #bff7ff;
    --v7-text: #f5f1e8;
    --v7-muted: #9aa0ad;
    --v7-muted-rgb: 154, 160, 173;
    --v7-line: rgba(255, 255, 255, .09);
    --v7-line-soft: rgba(255, 255, 255, .06);
    --v7-shadow: 0 18px 42px rgba(0, 0, 0, .28);
    --v7-success-bg: rgba(54, 255, 138, .12);
    --v7-success-fg: #36ff8a;
    --v7-warning-bg: rgba(228, 184, 91, .14);
    --v7-warning-fg: #e4b85b;
    --v7-danger-bg: rgba(255, 77, 94, .14);
    --v7-danger-fg: #ff4d5e;
    --v7-info-bg: rgba(141, 101, 255, .14);
    --v7-info-fg: #b49cff;
    --v7-primary-soft: rgba(32, 224, 255, .12);
}

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

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


.page .sidebar-toggler  {
    
    border:0;
    background:none;
    display:flex;
    align-items:center;
    padding:0;
    margin-bottom:.5rem;
}


.page .sidebar-toggler svg  {
    
    width:20px;
    height:20px;
    margin-right:.4rem;
}


.page .sidebar-toggler svg path  {
    
    fill:#000;
}


.notifications-header-title  {
    
    font-size:.95rem;
    font-weight:600;
    color:#fff;
}


.form-range-control  {
    
    display:flex;
    align-items:center;
    gap:.5rem;
}


.form-range-control .form-range-text  {
    
    display:flex;
    justify-content:end;
}


.form-range-control .form-range  {
    
    flex:1;
}


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


.countdowns  {
    
    display:flex;
    flex-wrap:wrap;
    gap:.6rem;
    margin-bottom:1.5rem;
}


.countdown  {
    
    background:rgba(0,0,0,.45);
    padding:.6rem .65rem;
    border-radius:.375rem;
    color:#fff;
    min-width:200px;
}


@media(max-width:767.98px)  {
    

.countdown  {
    
    min-width:0;
    flex:1;
}

}


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


.countdown-timer  {
    
    opacity:0;
    transition:opacity .3s ease;
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:.3rem;
}


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


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


.workshop-container  {
    
    display:flex;
    gap:1rem;
}


@media(max-width:991.98px)  {
    

.workshop-container  {
    
    flex-direction:column;
}

}


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


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


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


.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  {
    
    position:fixed;
    z-index:99999;
    bottom:20px;
    display:none;
    right:0;
    flex-direction:row-reverse;
    transition:right .5s ease-in-out;
}


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


.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:#061016;
    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  {
    
    margin-right:10px;
    position:relative;
    border:2px solid var(--v7-line-soft);
    border-radius:.375rem;
    overflow:hidden;
}


.streamers-streamer:last-child  {
    
    margin-right:0;
}


.streamers-streamer:hover  {
    
    border-color:var(--v7-primary-bright);
}


.streamers-streamer-name  {
    
    position:absolute;
    top:0;
    left:0;
    right:0;
    color:#061016;
    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;
}


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


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


.ticket-rate h2  {
    
    font-size:1rem;
    font-weight:700;
    margin-bottom:.5rem;
}


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


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


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


.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:#061016;
    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:#061016;
    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 .description  {
    
    margin-top:3px;
}


/* ==========================================================================
   wolf - reposicoes proprias (valores do app.css do DEFAULT e do style.css do wolf;
   nenhum valor copiado de outro tema)
   ========================================================================== */

/* D22 - cabecalho das views de plugin SEM override (.page > .page-header > h3 + nav .breadcrumb:
   BattlePass, Subscribe, Coupon, Poll archive, ItemMarket show/prices, Pages...). Mesmo desenho do
   hero do proprio tema (.aurora-hero do style.css: faixa de largura total, padding 44/34, titulo Cinzel
   42px, trilha em caixa alta 12px #9fa8b8 com o item ativo em ciano), sem override de view. A trilha
   vem DEPOIS do h3 no markup do plugin: column-reverse a poe em cima, como no hero do wolf. */
.page > .page-header {
    display: flex;
    flex-direction: column-reverse;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    margin-bottom: 24px;
    padding: 44px max(4vw, calc((100vw - 1180px) / 2)) 34px;
    position: relative;
    background: linear-gradient(90deg, rgba(5, 6, 8, .94), rgba(5, 6, 8, .62), rgba(5, 6, 8, .9)),
        url("https://r4.wallpaperflare.com/wallpaper/646/649/278/action-adventure-dragon-dragons-wallpaper-0a039309e16cf43c9b6261256f412424.jpg") center/cover no-repeat;
    border-bottom: 1px solid var(--border);
}
.page > .page-header:first-child {
    margin-top: -40px;
}
.page > .page-header > h1,
.page > .page-header > h2,
.page > .page-header > h3 {
    font-family: Cinzel, serif;
    font-size: 42px;
    line-height: 1;
    color: #fff;
    text-shadow: 0 8px 25px rgba(0, 0, 0, .6);
    margin: 0;
}
.page > .page-header .breadcrumb {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin: 0 0 14px;
    padding: 0;
    background: transparent;
    font-weight: 800;
    font-size: 12px;
    text-transform: uppercase;
    --bs-breadcrumb-divider-color: #9fa8b8;
}
.page > .page-header .breadcrumb-item,
.page > .page-header .breadcrumb-item a {
    color: #9fa8b8;
}
.page > .page-header .breadcrumb-item a:hover {
    color: #fff;
}
.page > .page-header .breadcrumb-item.active {
    color: var(--cyan);
}
@media (max-width: 760px) {
    .page > .page-header > h1,
    .page > .page-header > h2,
    .page > .page-header > h3 {
        font-size: 30px;
    }
}

/* Renderizadores do core (getInventory()->getRenderer()->render(), bau, paper-doll do perfil).
   As classes vem do core, nao das views: o extrator (usedclasses) nao as ve. Valores do app.css do
   default (workshop.scss/profile.scss); so a cor das celulas foi trocada para a paleta do wolf. */
.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: rgba(32, 224, 255, .06);
    border: 1px solid rgba(32, 224, 255, .18);
}
.morpheus-inventory-items .item .image,
.morpheus-warehouse .item .image {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}
.equipments .mapping {
    position: relative;
    width: 400px;
    height: 388px;
    max-width: 100%;
}
.equipments .mapping .item-mapping {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
}
.equipments .mapping .item-mapping img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}
.equipments .mapping .item0  { bottom: 17px; width: 70px; height: 130px; left: 7px; }
.equipments .mapping .item1  { bottom: 17px; width: 70px; height: 130px; right: 2px; }
.equipments .mapping .item2  { top: 58px; width: 56px; height: 65px; left: 76px; }
.equipments .mapping .item3  { top: 133px; width: 82px; height: 98px; left: 39px; }
.equipments .mapping .item4  { bottom: 17px; width: 60px; height: 74px; left: 88px; }
.equipments .mapping .item5  { bottom: 155px; width: 83px; height: 54px; right: 44px; }
.equipments .mapping .item6  { bottom: 17px; width: 57px; height: 74px; right: 84px; }
.equipments .mapping .item7  { top: 59px; width: 127px; height: 112px; right: 0; }
.equipments .mapping .item8  { display: none; }
.equipments .mapping .item9  { top: 81px; width: 30px; height: 30px; right: 137px; }
.equipments .mapping .item10 { bottom: 106px; width: 30px; height: 30px; left: 102px; }
.equipments .mapping .item11 { bottom: 106px; width: 30px; height: 30px; right: 99px; }

/* Icones Material Symbols (views de plugin V7): ligadura sempre ativa e sem caixa alta herdada. */
.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;
}

/* Tom Select (multi-selects do ItemMarket): o vendor e o tema claro do Bootstrap; mesmas cores do
   .form-control do wolf (style.css: fundo rgba(255,255,255,.04), borda --border, texto --text). */
.ts-wrapper .ts-control,
.ts-wrapper.single .ts-control,
.ts-dropdown {
    background: rgba(255, 255, 255, .04);
    border: 1px solid var(--border);
    color: var(--text);
}
.ts-wrapper .ts-control > input {
    color: var(--text);
}
.ts-dropdown {
    background: #10131a;
}
.ts-dropdown .active {
    background: rgba(32, 224, 255, .12);
    color: #fff;
}
.ts-wrapper.multi .ts-control > div {
    background: rgba(32, 224, 255, .14);
    color: #fff;
    border-radius: 999px;
}

/* Eventos (events.js da V7): o style.css do wolf desenha a linha V6 com badge ABSOLUTO a direita
   (`[data-events-area] .events > *` com padding-right 140px e filhos em linha com !important) e da
   padding-bottom 62px a todo .events (pensado para a section da home). A V7 gera .events-row >
   .events-row-label (nome + proxima) + .events-row-timer (contador), sem badge: sem o ajuste o nome
   e espremido pelos 140px - pior no card estreito do destaque. Mantidos borda, raio, hover e peso
   do tema; so espacamento e empilhamento do rotulo, escopados nas linhas V7. */
[data-events-area] .events {
    padding-bottom: 0;
}
[data-events-area] .events > .events-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 18px;
}
[data-events-area] .events > .events-row > .events-row-label {
    flex-direction: column !important;
    align-items: flex-start;
    gap: 2px;
    min-width: 0;
    flex: 1 1 auto;
}
[data-events-area] .events > .events-row > .events-row-timer {
    flex: 0 0 auto;
}
[data-spotlight] .events > .events-row {
    padding: 10px 14px;
    min-height: 0;
}

/* Checkout: o checkout.js poe .is-active no botao de valor escolhido ([data-checkout-amount], que no wolf
   e um .btn.dark). O wolf nao desenha esse estado: usa o proprio .btn principal do tema (style.css:
   gradiente ciano + texto #061016) para marcar o valor selecionado. */
.btn.dark[data-checkout-amount].is-active {
    background: linear-gradient(135deg, var(--cyan), #bff7ff);
    color: #061016;
    border-color: transparent;
}

/* Texto secundario do Bootstrap 5.3 (.text-muted, .form-text, .text-body-secondary) usa --bs-secondary-color,
   que no tema claro de fabrica e cinza-ESCURO: no fundo escuro do wolf as legendas sumiam (server/info
   "Jogadores online", titulos de categoria das Vantagens VIP). O wolf nunca definiu essas variaveis (o .bak ja
   usava text-muted em 12 lugares). Mesmo cinza do tema (--muted #9aa0ad). */
:root {
    --bs-secondary-color: rgba(154, 160, 173, .9);
    --bs-secondary-color-rgb: 154, 160, 173;
    --bs-tertiary-color: rgba(154, 160, 173, .6);
    --bs-tertiary-color-rgb: 154, 160, 173;
}

/* Vantagens VIP: .vip-panel/.vip-card-top/.price-box sao do painel UNICO e largo do vip/index (coroa 74px ao
   lado de uma caixa com titulo Cinzel 30px). Na grade de planos (uma coluna por tipo de VIP) a caixa espremia o
   nome em 2 linhas e cada card ficava com uma altura. So na grade (.vip-section .row): coroa em cima, caixa
   embaixo, titulo menor numa linha, lista mais compacta. Mesmas cores/raios do tema. */
.vip-page .vip-section .row .vip-panel {
    padding: 22px 18px;
}
.vip-page .vip-section .row .vip-card-top {
    flex-direction: column;
    align-items: stretch;
    text-align: center;
    gap: 12px;
}
.vip-page .vip-section .row .crown {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    font-size: 28px;
    margin: 0 auto;
}
.vip-page .vip-section .row .price-box {
    padding: 12px 14px;
}
.vip-page .vip-section .row .price-box strong {
    font-size: 22px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.vip-page .vip-section .row h6 {
    color: var(--gold);
    letter-spacing: .6px;
    margin-top: 18px !important;
}
.vip-page .vip-section .row .quick-list {
    gap: 6px;
    margin-top: 8px;
}
.vip-page .vip-section .row .quick-list div {
    padding: 9px 12px;
    border-radius: 12px;
    font-size: 14px;
}

/* Tom Select (filtros multi do ItemMarket): as opcoes herdavam o texto escuro do tema claro do vendor
   (so a ativa aparecia) e o <input> interno pegava o fundo/borda/padding do .form-control/.form-select do
   wolf (pilula escura dentro do campo). Opcoes no texto do tema; input interno transparente. */
.ts-dropdown,
.ts-dropdown .option,
.ts-dropdown .optgroup-header,
.ts-dropdown .no-results {
    color: var(--text);
}
.ts-dropdown .option:hover,
.ts-dropdown .option.active {
    background: rgba(32, 224, 255, .12);
    color: #fff;
}
.ts-dropdown .option.selected {
    color: var(--cyan);
}
.ts-wrapper .ts-control > input,
.ts-wrapper .ts-control > input:focus {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    min-height: 0;
    color: var(--text) !important;
}
.ts-wrapper.form-select,
.ts-wrapper.form-control {
    padding: 0;
    background-image: none;
    border: 0;
}
.ts-wrapper .ts-control {
    border-radius: 14px;
    min-height: 46px;
    padding: 10px 14px;
}
.ts-wrapper.focus .ts-control {
    border-color: rgba(32, 224, 255, .5);
    box-shadow: 0 0 0 .2rem rgba(32, 224, 255, .12);
}

/* PIX copia e cola (checkout/confirm/morpheuspay|paghiper): o codigo e um span.form-control#pix-code (o copyText
   do morpheus.js copia NO de texto, nao value de input) numa linha so com reticencias, como o input do .bak.
   O .btn do wolf e pilula (999px) e esticava ate a altura do grupo virando um oval: aqui fecha o campo como
   sufixo do input-group, na altura do campo. */
.input-group:has(#pix-code) > #pix-code {
    min-width: 0;
}
.input-group:has(#pix-code) > .btn {
    align-self: stretch;
    border-radius: 0 14px 14px 0;
    padding: 0 18px;
    font-size: 12px;
}
.input-group:has(#pix-code) > .btn:hover {
    transform: none;
}

/* Menus do topo (usuario, sino, Mais, Idioma): o style.css abre o .dropdown-menu no :hover do .dropdown, mas a
   64px do topo dele - o botao tem ~42px e sobra uma faixa vazia: o mouse saia do .dropdown no caminho e o
   menu fechava antes de chegar. Ponte invisivel do proprio .dropdown cobrindo a faixa, so durante o hover
   (o menu tem overflow com rolagem, entao a ponte nao pode ficar nele). */
header .dropdown:hover::after {
    content: "";
    position: absolute;
    left: -10px;
    right: -10px;
    top: 100%;
    height: 48px;
}

/* Sino de notificacoes: o .dropdown-toggle ganha a seta "⌄" do tema (.dropdown .dropdown-toggle:after); no
   sino ela sobra. So nele, pelo icone - sem mexer na classe que o template.js usa para abrir o menu. */
.nav-cta .dropdown-toggle:has(> .bi-bell)::after {
    content: none;
    display: none;
}

/* ItemMarket: grades de categoria (icone) e classe (imagem) do default (.market-category-pill / .market-class-pill,
   portadas do app.css). Raio, altura e fundo no desenho dos campos do wolf (.form-control: rgba(255,255,255,.04),
   cantos arredondados) em vez do .375rem do default. */
.market-category-pill,
.market-class-pill {
    min-height: 42px;
    border-radius: 12px;
    background: rgba(255, 255, 255, .04);
}
.market-category-pill-icon {
    font-size: 1.35rem;
    width: auto;
    height: auto;
}

/* Icone da categoria = SVG do core (resources/images/item-category/{slug}.svg, fill=currentColor) aplicado como
   mascara: pinta com a cor do texto do pill (cinza; ciano no hover/marcado), em vez do preto que o img daria. */
.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;
}
