/* ============================================================
   RF ORION - GameCP  |  Tema do painel
   Base: Bootstrap 4.6 + Bootswatch "Darkly" (assets/vendor)
   Este arquivo só ajusta o Darkly para o visual do painel.
   ============================================================ */

/* ---------- Fonte Inter (arquivo local, não depende de internet) ---------- */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('../vendor/inter/inter-latin-ext-wght-normal.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('../vendor/inter/inter-latin-wght-normal.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- Base ---------- */
html { font-size: 16px; }
body {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    line-height: 1.5;
    font-weight: 400;
    color: #fff;
    background-color: #09090b;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 { font-family: 'Inter', sans-serif; font-weight: 500; margin-bottom: 8px; }
a { color: #00bc8c; text-decoration: none; }
a:hover { color: #007053; text-decoration: none; }
small, .small { font-size: 12px; }
.text-muted { color: #888 !important; }
.font-size-12x { font-size: 12px !important; }
.font-weight-bolder { font-weight: 700 !important; }
hr { border-top-color: #27272a; }

/* ---------- Navbar ---------- */
.navbar {
    padding: 8px;
    border-bottom: 1px solid #27272a;
}
.navbar.bg-dark { background-color: rgba(9, 9, 11, .95) !important; }
.navbar .container-fluid { display: flex; justify-content: space-between; }
.navbar-brand { font-size: 18.75px; font-weight: 400; color: #fff !important; padding: 5.1875px 0; margin-right: 16px; }
.navbar-dark .navbar-nav .nav-link { color: rgba(255, 255, 255, .6); font-size: 15px; font-weight: 400; padding: 8px; }
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus,
.navbar-dark .navbar-nav .show > .nav-link,
.navbar-dark .navbar-nav .active > .nav-link { color: #fff; }
.dropdown-menu {
    background-color: #09090b;
    border: 1px solid #444;
    border-radius: 4px;
    padding: 8px 0;
    margin-top: 2px;
    font-size: 15px;
}
.dropdown-item { color: #fff; padding: 4px 24px; font-size: 15px; }
.dropdown-item:hover, .dropdown-item:focus { color: #fff; background-color: #375a7f; }
@media (min-width: 768px) {
    .navbar .dropdown-menu.show { position: fixed !important; top: 45px; left: unset; max-height: calc(100vh - 55px); overflow-y: auto; }
}
#logout { margin: 0 5px; }
.navbar .navbar-nav.ml-auto { margin-right: 20px; }

/* ---------- Conteúdo ---------- */
main.container-fluid { padding: 0 15px; }
#panel-container { padding: 16px; }
.module-title { border-bottom: 4px solid #ec1d1d; }

footer { text-align: center; }
footer code { color: #e83e8c; font-size: 13.125px; }
footer code a { color: #00bc8c; }

/* ---------- Cards ---------- */
.card {
    background-color: transparent;
    border: 1px solid #27272a;
    border-radius: 8px;
    margin-bottom: 24px;
}
.card-header {
    background-color: transparent;
    padding: 12px 20px;
    border-bottom: 1px solid rgba(0, 0, 0, .125);
}
.card-header:first-child { border-radius: 7px 7px 0 0; }
.card-header h4 { font-size: 22.5px; }
.card-body { padding: 20px; }
.card-tools .btn { margin: 0 5px; }
.card-welcome-medal { border-color: #3498db !important; }
.card.bg-primary { background-color: transparent !important; }

/* linhas com colunas da mesma altura */
.match-height > [class*='col'] { display: flex; flex-flow: column; }
.match-height > [class*='col'] > .card:only-child { flex: 1 1 auto; }

/* ---------- Billing ---------- */
.statistics-body .media { align-items: flex-start; }
.statistics-body .media .mr-2 { line-height: 1.5; }
.statistics-body h4 { font-size: 22.5px; line-height: 1.2; }
.swipe-down { animation: swipeDownAnimation .5s ease-out 1; position: relative; }
@keyframes swipeDownAnimation {
    0%   { top: -12px; opacity: 0; }
    100% { top: 0;     opacity: 1; }
}

/* ---------- Badges / botões ---------- */
.badge { font-size: 11.25px; font-weight: 700; padding: 2.8px 4.5px; border-radius: 4px; }
.badge.font-size-12x { padding: 3px 4.8px; }
.btn { font-size: 15px; padding: 6px 12px; border-radius: 4px; }
.btn-sm { font-size: 13.2px; padding: 4px 8px; border-radius: 3.2px; }
.btn-secondary { background-color: #444; border-color: #444; }

/* ---------- Formulários ---------- */
label { font-size: 15px; margin-bottom: 8px; }
.form-control {
    background-color: #fff;
    color: #444;
    border: 1px solid #222;
    border-radius: 4px;
    padding: 6px 12px;
    height: 36.5px;
    font-size: 15px;
}
textarea.form-control { height: auto; }
.form-control:focus { background-color: #fff; color: #444; }
.card-reset-password { width: 500px; max-width: 100%; }
.card-form { width: 500px; max-width: 100%; }

/* ---------- Tabelas ---------- */
.table { color: #fff; margin-bottom: 16px; }
.table th, .table td { padding: 8px; border-top: 1px solid #444; vertical-align: middle; }
.table-bordered, .table-bordered th, .table-bordered td { border: 1px solid #444; }
.table-striped tbody tr:nth-of-type(odd) { background-color: rgb(38, 38, 38); }
.table-hover tbody tr:hover { color: #fff; background-color: rgba(255, 255, 255, .075); }
.table .table-info, .table .table-info > th, .table .table-info > td { background-color: #3498db; color: #fff; }
.table .table-info th, .table .table-info td { border-color: #95c9ec; border-bottom: 2px solid #444; }
.table .table-primary, .table .table-primary > th, .table .table-primary > td { background-color: #375a7f; color: #fff; }
.table .table-dark, .table .table-dark > th, .table .table-dark > td { background-color: #303030; color: #fff; }
.table td.thead { padding: 4px; }
.table-borderless th, .table-borderless td, .table-borderless thead th { border: 0; }
.table-responsive.border { border: 1px solid #27272a !important; }
.rounded-md { border-radius: 6px !important; overflow: hidden; }
.table-form td:first-child { width: 25%; }

/* ---------- Abas ---------- */
.nav-tabs { border-bottom: 1px solid #444; margin-bottom: 16px; }
.nav-tabs .nav-link { padding: 8px 32px; color: #fff; border: 1px solid transparent; border-radius: 4px 4px 0 0; }
.nav-tabs .nav-link:hover { border-color: #444 #444 transparent; }
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link { color: #fff; background-color: #6610f2; border-color: #444 #444 transparent; }
.character-tab { flex-direction: row; align-items: center; padding: 8px 16px; color: #fff; }
.character-tab .race-emblem { margin-right: 8px; }
.character-tab small { margin-left: 8px; }
.nav-link.card.character-tab.active { background-color: #375a7f; border-color: #375a7f; }

/* ---------- Gráficos ---------- */
.chart-box { position: relative; height: 300px; }

/* ---------- Emblemas das raças ---------- */
.race-emblem { width: 30px; height: 30px; object-fit: contain; vertical-align: middle; }
.race-bellato  { color: #03a9f4; }
.race-cora     { color: #9575cd; }
.race-accretia { color: #f44336; }

/* ---------- Alertas ---------- */
.alert { border-radius: 4px; }

/* ---------- Personagem (equipamento / inventário) ---------- */
.equip-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.equip-slot { border: 1px solid #27272a; border-radius: 6px; padding: 10px; text-align: center; min-height: 72px; }
.equip-slot .es-label { color: #888; font-size: 12px; }
.equip-slot .es-item  { font-weight: 500; }
.equip-slot.filled { border-color: #375a7f; }
.inv-wrap { display: flex; flex-wrap: wrap; gap: 16px; }
.inv-bag { flex: 1 1 280px; }
.inv-title { color: #888; font-size: 12px; text-transform: uppercase; margin-bottom: 6px; }
.char-head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.char-statbar { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 12px; }
.char-money { color: #f39c12; }
.cs-level { font-weight: 700; }
.ctab-panel { display: none; }
.ctab-panel.active { display: block; }
.dot-on, .dot-off { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 6px; }
.dot-on  { background: #00bc8c; }
.dot-off { background: #e74c3c; }

/* ---------- Telas de login / registro ---------- */
body.auth-body { align-items: center; justify-content: center; }
.auth-card { width: 400px; max-width: calc(100vw - 30px); margin: 24px auto; }
.auth-card .card-body { padding: 28px; }
.auth-logo { text-align: center; margin-bottom: 20px; }
.auth-logo .brand { font-size: 32px; font-weight: 500; letter-spacing: 1px; color: #fff; }
.auth-logo .brand-sub { color: #888; font-size: 12px; letter-spacing: 3px; text-transform: uppercase; }
.auth-links { display: flex; justify-content: space-between; margin-top: 16px; font-size: 13.2px; }
.auth-foot { text-align: center; margin-top: 18px; }

/* ---------- Blocos auxiliares usados em algumas páginas ---------- */
.grid { display: flex; flex-wrap: wrap; margin: 0 -7.5px 9px; }
.stat { flex: 1 1 180px; margin: 0 7.5px 15px; border: 1px solid #27272a; border-radius: 8px; padding: 16px 20px; }
.stat .label { color: #888; font-size: 12px; }
.stat .value { font-size: 22.5px; font-weight: 700; line-height: 1.2; }
.stat .sub   { color: #888; font-size: 12px; }
.kv { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid #27272a; }
.kv:last-child { border-bottom: 0; }
.kv .k { color: #888; }
.pill { display: inline-block; font-size: 12px; font-weight: 700; padding: 3px 4.8px; border-radius: 4px; line-height: 1; color: #fff; background: #444; }
.pill-ok  { background: #00bc8c; }
.pill-ban { background: #e74c3c; }
.row-actions { display: flex; gap: 6px; justify-content: center; }

/* ---------- Give Item: tabela de itens ---------- */
.ig-table td { vertical-align: top; }
.ig-item-cell { position: relative; }
.ig-suggest {
    position: absolute; left: 12px; right: 12px; top: 100%; z-index: 50;
    max-height: 280px; overflow-y: auto;
    background: #fff; color: #222; border: 1px solid #888; border-radius: 0 0 4px 4px;
    box-shadow: 0 6px 16px rgba(0,0,0,.45);
}
.ig-sug, .ig-sug-empty { padding: 6px 10px; font-size: 14px; cursor: pointer; }
.ig-sug:hover { background: #3498db; color: #fff; }
.ig-sug:hover .text-muted { color: #e8f2fb !important; }
.ig-sug-empty { cursor: default; color: #777; }
.ig-upg-box { display: flex; gap: 6px; align-items: flex-end; }
.ig-mini { flex: 0 0 78px; margin: 0; min-width: 0; }
.ig-mini-wide { flex: 1 1 auto; }
.ig-mini > span { display: block; font-size: 12px; color: #adb5bd; line-height: 1.2; margin-bottom: 2px; }
.ig-mini select { padding-left: 8px; padding-right: 4px; }
.ig-upg-note { display: block; margin-top: 4px; }
.ig-char-title { font-size: 1.9rem; font-weight: 500; margin: 14px 0 10px; }
@media (max-width: 767px) {
    .ig-table thead { display: none; }
    .ig-table, .ig-table tbody, .ig-table tr, .ig-table td { display: block; width: 100% !important; }
    .ig-table .ig-row { border-bottom: 2px solid #375a7f; padding-bottom: 6px; }
}

/* ---------- Visualizador 3D (Equipment Search) ---------- */
.char3d-card .card-header { gap: 8px; }
.char3d-stage { position: relative; height: 460px; max-height: 70vh; background: #111114; border-radius: 0 0 7px 7px; overflow: hidden; }
.char3d-stage canvas { display: block; width: 100%; height: 100%; touch-action: none; cursor: grab; }
.char3d-stage canvas:active { cursor: grabbing; }
.char3d-status { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #888; font-size: 14px; pointer-events: none; }
.char3d-hint { position: absolute; left: 12px; bottom: 10px; font-size: 12px; color: #888; background: rgba(9, 9, 11, .6); padding: 2px 8px; border-radius: 4px; pointer-events: none; }
.char3d-name { position: absolute; top: 12px; left: 0; right: 0; text-align: center; font-weight: 700; font-size: 15px; color: #fff; letter-spacing: .04em; text-shadow: 0 1px 3px #000, 0 0 8px rgba(0,0,0,.8); pointer-events: none; }
.char3d-icons { position: absolute; top: 10px; left: 10px; display: flex; flex-direction: column; gap: 4px; pointer-events: auto; }
.char3d-icons img { width: 40px; height: 40px; border: 1px solid rgba(255,255,255,.25); border-radius: 4px; background: rgba(9,9,11,.55); }
.char3d-note { font-size: 12px; color: #888; padding: 8px 12px; border-top: 1px solid #27272a; }
@media (max-width: 576px) { .char3d-stage { height: 360px; } }

/* ---- Equipment Search: ficha + 3D ---- */
.char3d-sheet td { vertical-align: middle; }
.char3d-sheet-k { width: 22%; color: #a1a1aa; white-space: nowrap; }
.char3d-sheet-u { width: 30%; white-space: nowrap; }
.char3d-sheet-view { padding: 10px !important; }
.char3d-row[data-tip] { cursor: default; }
.char3d-row[data-tip]:hover td { background: rgba(0,188,140,.08); }
.char3d-row-ic { width: 24px; height: 24px; margin-right: 6px; border: 1px solid rgba(255,255,255,.2); border-radius: 3px; vertical-align: middle; }
.char3d-compact { max-width: 480px; margin: 0 auto; }
.char3d-compact .char3d-stage { height: auto; aspect-ratio: 1 / 0.92; max-height: none; border: 1px solid #3f3f46; border-radius: 4px; }
.char3d-compact .char3d-hint { display: none; }
.char3d-ph { display: block; width: 40px; height: 40px; border: 1px solid rgba(255,255,255,.25); border-radius: 4px; background: rgba(9,9,11,.55) center / 32px no-repeat; }
.char3d-ph-ring { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='22' r='11' fill='none' stroke='%23d9b44a' stroke-width='5'/%3E%3Cpath d='M14 9l6-5 6 5-6 5z' fill='%23c2185b' stroke='%23ffe08a' stroke-width='1'/%3E%3C/svg%3E"); }
.char3d-ph-amulet { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M9 6q11 14 22 0' fill='none' stroke='%23c9a640' stroke-width='2'/%3E%3Ccircle cx='20' cy='25' r='9' fill='%237b1fa2' stroke='%23ffe08a' stroke-width='2.5'/%3E%3Ccircle cx='17' cy='22' r='2.5' fill='%23f3c6ff'/%3E%3C/svg%3E"); }
.char3d-ph-ammo { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg stroke='%239aa7b4' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M8 32L30 10'/%3E%3Cpath d='M13 34L33 14'/%3E%3C/g%3E%3Cpath d='M30 10l-6 1 5 5zM33 14l-6 1 5 5z' fill='%23cfd8dc'/%3E%3Cpath d='M8 32l-2 4 4-2zM13 34l-2 4 4-2z' fill='%238d6e63'/%3E%3C/svg%3E"); }
.char3d-ph-item, .char3d-ph-accessory { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Crect x='8' y='8' width='24' height='24' rx='4' fill='%233f3f46'/%3E%3C/svg%3E"); }
.char3d-talics { display: inline-flex; gap: 3px; vertical-align: middle; }
.tal { display: inline-block; width: 13px; height: 13px; transform: rotate(45deg); border-radius: 2px; border: 1px solid rgba(0,0,0,.6); box-shadow: inset 0 0 0 1px rgba(255,255,255,.35), 0 0 4px rgba(0,0,0,.6); margin: 0 2px; }
.tal-empty { background: transparent; border: 1px solid #52525b; box-shadow: none; }
.tal-0 { background: linear-gradient(135deg, #fff8 0%, #6d6d6d 45%, #6d6d6d 100%); }
.tal-1 { background: linear-gradient(135deg, #fff8 0%, #e53935 45%, #e53935 100%); }
.tal-2 { background: linear-gradient(135deg, #fff8 0%, #5e35b1 45%, #5e35b1 100%); }
.tal-3 { background: linear-gradient(135deg, #fff8 0%, #fb8c00 45%, #fb8c00 100%); }
.tal-4 { background: linear-gradient(135deg, #fff8 0%, #8e1b1b 45%, #8e1b1b 100%); }
.tal-5 { background: linear-gradient(135deg, #fff8 0%, #43a047 45%, #43a047 100%); }
.tal-6 { background: linear-gradient(135deg, #fff8 0%, #1e88e5 45%, #1e88e5 100%); }
.tal-7 { background: linear-gradient(135deg, #fff8 0%, #ffb300 45%, #ffb300 100%); }
.tal-8 { background: linear-gradient(135deg, #fff8 0%, #4fc3f7 45%, #4fc3f7 100%); }
.tal-9 { background: linear-gradient(135deg, #fff8 0%, #26a69a 45%, #26a69a 100%); }
.tal-10 { background: linear-gradient(135deg, #fff8 0%, #fdd835 45%, #fdd835 100%); }
.tal-11 { background: linear-gradient(135deg, #fff8 0%, #ec407a 45%, #ec407a 100%); }
.tal-12 { background: linear-gradient(135deg, #fff8 0%, #f5f5f5 45%, #f5f5f5 100%); }

.char3d-tip { position: absolute; left: 60px; bottom: 14px; min-width: 170px; max-width: 70%; background: rgba(9,9,11,.88); border: 1px solid #52525b; border-radius: 4px; padding: 8px 12px 10px; color: #f4f4f5; text-align: center; pointer-events: none; z-index: 3; }
.char3d-tip .n { font-weight: 600; margin-bottom: 6px; }
.char3d-tip img, .char3d-tip .char3d-ph { display: block; width: 64px; height: 64px; margin: 0 auto 8px; background-size: 52px; }
.char3d-tip .char3d-talics { display: flex; justify-content: center; }
.char3d-row .char3d-ph { display: inline-block; width: 24px; height: 24px; margin-right: 6px; vertical-align: middle; background-size: 20px; }
.char3d-cloak { position: absolute; left: 10px; bottom: 10px; }
.char3d-cloak img { width: 40px; height: 40px; border: 1px solid rgba(255,255,255,.25); border-radius: 4px; background: rgba(9,9,11,.55); }
.tal-ic { width: 22px; height: 22px; margin: 0 1px; filter: drop-shadow(0 0 2px rgba(0,0,0,.8)); }
.tal-slot { display: inline-block; width: 14px; height: 14px; margin: 4px; border-radius: 50%; background: radial-gradient(circle at 40% 35%, #3f3f46, #18181b 70%); border: 1px solid #52525b; vertical-align: middle; }
.char3d-tip .tal-ic { width: 26px; height: 26px; }

/* ---- Council List ---- */
.council-card { border: 1px solid #27272a; }
.council-head { position: relative; text-align: center; padding: 12px 20px; min-height: 206px; background-size: cover; background-position: center; color: #fff; border-bottom: 1px solid #27272a; }
.council-head::before { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.35); }
.council-head > * { position: relative; }
.council-logo { width: 110px; height: 110px; object-fit: contain; filter: drop-shadow(0 2px 6px rgba(0,0,0,.6)); }
.council-head h4 { font-size: 2.5em; margin: -18px 0 0; text-shadow: 1px 2px 2px rgba(0,0,0,.6); }
.council-head h5 { font-size: 1.5em; margin: 0; text-shadow: 1px 2px 2px rgba(0,0,0,.6); }
.council-grid { display: grid; grid-template-columns: 1fr 1fr; }
.council-cell { text-align: center; padding: 8px 6px 10px; border: 1px solid #27272a; min-width: 0; }
.council-archon { grid-column: 1 / -1; }
.council-pos { width: 75px; height: 75px; }
.council-name { display: inline-block; max-width: 100%; margin-top: 8px; font-size: 1.5em; font-weight: 500; line-height: 1.25;
                border-bottom: 4px solid #757575; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.council-name.is-online { border-bottom-color: #2ecc71; }
.council-accretia { color: #e6121d; }
.council-bellato { color: #6bbfff; }
.council-cora { color: #b48cff; }
.council-class { margin-top: 8px; font-size: 1em; font-weight: 500; color: #fff; }

/* ---- Suporte por tickets ---- */
.tk-wrap { --tk-bg: #15151b; --tk-panel: #1c1c24; --tk-line: #2b2b36; --tk-soft: #24242f; --tk-acc: #8b5cf6; --tk-acc2: #a855f7; --tk-mut: #9a9aab;
           display: grid; grid-template-columns: 300px minmax(0, 1fr); height: calc(100vh - 135px); min-height: 360px; max-width: 1500px; margin: 0 auto;
           background: var(--tk-bg); border: 1px solid var(--tk-line); border-radius: 16px; overflow: hidden; }
.tk-side { display: flex; flex-direction: column; border-right: 1px solid var(--tk-line); min-width: 0; min-height: 0; }
.tk-side-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px 8px; }
.tk-side-head h4, .tk-head h4, .tk-welcome h4 { margin: 0; font-weight: 700; font-size: 1.15rem; color: #fff; }
.tk-list { flex: 1; overflow-y: auto; padding: 4px 10px; min-height: 0; }
.tk-item { display: block; padding: 10px 10px; border-radius: 10px; color: #ddd; text-decoration: none !important; margin-bottom: 2px; }
.tk-item:hover { background: var(--tk-soft); color: #fff; }
.tk-item.active { background: rgba(139, 92, 246, .16); box-shadow: inset 3px 0 0 var(--tk-acc); }
.tk-item-top { display: flex; justify-content: space-between; gap: 8px; }
.tk-item-subj { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-item.unread .tk-item-subj { font-weight: 700; color: #fff; }
.tk-item-age, .tk-item-id, .tk-item-acc { color: var(--tk-mut); font-size: .8rem; white-space: nowrap; }
.tk-item-acc { overflow: hidden; text-overflow: ellipsis; }
.tk-item-bot { display: flex; align-items: center; gap: 6px; margin-top: 5px; min-width: 0; }
.tk-new { margin-left: auto; background: var(--tk-acc); color: #fff; border-radius: 10px; font-size: .72rem; padding: 0 7px; font-weight: 700; }
.tk-empty-list { color: var(--tk-mut); padding: 14px 8px; font-size: .9rem; }
.tk-side-foot { padding: 8px 10px; border-top: 1px solid var(--tk-line); }
.tk-side-foot .tk-hours { padding: 8px 10px; font-size: .78rem; }
.tk-side-foot .tk-hours-txt { display: none; }
.tk-badge { display: inline-block; font-size: .72rem; padding: 2px 9px; border-radius: 10px; background: #2c2c37; color: #c9c9d4; font-weight: 600; }
.tk-badge.tk-warn { background: rgba(245, 158, 11, .16); color: #fbbf24; }
.tk-badge.tk-ok { background: rgba(34, 197, 94, .15); color: #4ade80; }
.tk-hours { display: flex; gap: 10px; background: var(--tk-soft); border: 1px solid var(--tk-line); border-radius: 12px; padding: 9px 12px; font-size: .82rem; color: #cfcfda; text-align: left; }
.tk-hours b { color: #fff; }
.tk-hours-txt { color: var(--tk-mut); margin-top: 4px; line-height: 1.45; }
.tk-dot { flex: none; width: 12px; height: 12px; margin-top: 3px; border-radius: 50%; background: #6b7280; box-shadow: 0 0 0 3px rgba(107, 114, 128, .25); }
.tk-dot.on { background: #22c55e; box-shadow: 0 0 0 3px rgba(34, 197, 94, .25); }
.tk-btn { background: linear-gradient(135deg, var(--tk-acc), var(--tk-acc2)); color: #fff !important; border: 0; border-radius: 10px; font-weight: 600; padding: 7px 16px; }
.tk-btn:hover { filter: brightness(1.1); }
.tk-btn-ghost { background: var(--tk-soft); color: #ddd !important; border: 1px solid var(--tk-line); border-radius: 10px; padding: 6px 12px; }
.tk-btn-ghost:hover { background: #2e2e3b; }
.tk-main { display: flex; flex-direction: column; min-width: 0; min-height: 0; background: var(--tk-panel); }
.tk-welcome { margin: auto; max-width: 420px; text-align: center; padding: 16px; display: flex; flex-direction: column; align-items: center; gap: 9px; color: #ccc; font-size: .92rem; }
.tk-welcome p { margin: 0; color: var(--tk-mut); }
.tk-welcome-ic { width: 46px; height: 46px; border-radius: 16px; display: grid; place-items: center; font-size: 1.3rem; color: #fff; background: linear-gradient(135deg, var(--tk-acc), #ec4899); }
.tk-muted { color: var(--tk-mut); font-size: .88rem; }
.tk-head { display: flex; align-items: center; gap: 12px; padding: 10px 16px; border-bottom: 1px solid var(--tk-line); }
.tk-head-main { flex: 1; min-width: 0; }
.tk-head h4 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-num { color: var(--tk-acc2); }
.tk-head-sub { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin-top: 4px; color: var(--tk-mut); font-size: .86rem; }
.tk-head-sub a { color: #c4b5fd; }
.tk-back { color: #fff; font-size: 1.15rem; padding: 4px 6px; }
.tk-head-act { margin: 0; }
.tk-scroll { flex: 1; overflow-y: auto; min-height: 0; }
.tk-form { padding: 12px 16px; display: flex; flex-direction: column; gap: 4px; }
.tk-form .tk-hours { margin-bottom: 8px; }
.tk-label { color: #fff; font-weight: 600; margin: 6px 0 2px; font-size: .92rem; }
.tk-help { color: var(--tk-mut); font-size: .78rem; }
.tk-field, .tk-input { background: var(--tk-soft) !important; border: 1px solid var(--tk-line) !important; color: #eee !important; border-radius: 10px !important; }
.tk-field:focus, .tk-input:focus { border-color: var(--tk-acc) !important; box-shadow: 0 0 0 2px rgba(139, 92, 246, .25) !important; }
.tk-composer { position: relative; display: flex; flex-direction: column; gap: 8px; }
.tk-input { resize: vertical; min-height: 60px; max-height: 300px; }
.tk-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tk-bar .tk-hint { color: var(--tk-mut); font-size: .76rem; margin-right: auto; }
.tk-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.tk-chips:empty { display: none; }
.tk-chip { display: flex; align-items: center; gap: 6px; max-width: 260px; background: var(--tk-soft); border: 1px solid var(--tk-line); border-radius: 8px; padding: 4px 6px; font-size: .78rem; color: #ddd; }
.tk-chip img { width: 34px; height: 34px; object-fit: cover; border-radius: 5px; }
.tk-chip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-chip-x { background: none; border: 0; color: #f87171; font-size: 1.1rem; line-height: 1; padding: 0 2px; cursor: pointer; }
.tk-warn { background: rgba(239, 68, 68, .14); color: #fca5a5; border-radius: 8px; padding: 6px 10px; font-size: .84rem; }
.tk-drop-hint { display: none; }
.tk-composer.tk-dragging .tk-drop-hint { display: grid; place-items: center; position: absolute; inset: -6px; z-index: 3; border: 2px dashed var(--tk-acc); border-radius: 12px; background: rgba(21, 21, 27, .92); color: #e9d5ff; font-weight: 600; }
.tk-reply { padding: 8px 14px; border-top: 1px solid var(--tk-line); }
.tk-reply .tk-input { min-height: 42px; }
.tk-reply .tk-composer { gap: 6px; }
.tk-chat { padding: 12px 16px; display: flex; flex-direction: column; gap: 12px; }
.tk-day { text-align: center; }
.tk-day span { display: inline-block; background: var(--tk-soft); color: #ccc; font-size: .75rem; font-weight: 600; padding: 3px 12px; border-radius: 10px; }
.tk-msg { display: flex; gap: 10px; max-width: 78%; }
.tk-mine { align-self: flex-end; flex-direction: column; align-items: flex-end; }
.tk-col { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; }
.tk-meta { font-size: .8rem; color: var(--tk-mut); margin-bottom: 4px; }
.tk-meta b { color: #e5e5ee; margin-right: 4px; }
.tk-sub { font-size: .76rem; color: var(--tk-mut); }
.tk-team { display: inline-block; background: var(--tk-acc); color: #fff; font-size: .66rem; font-weight: 700; letter-spacing: .06em; padding: 1px 6px; border-radius: 4px; margin-right: 4px; }
.tk-avatar { flex: none; width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; font-size: .9rem; color: #fff;
             background: radial-gradient(circle at 30% 30%, #3b0764, #0b0b10); border: 2px solid var(--tk-acc); }
.tk-avatar-p { background: #374151; border-color: #4b5563; }
.tk-bubble { background: var(--tk-soft); border: 1px solid var(--tk-line); color: #eee; border-radius: 14px; padding: 9px 13px; max-width: 100%; min-width: 0; }
.tk-mine .tk-bubble { background: linear-gradient(135deg, var(--tk-acc), var(--tk-acc2)); border-color: transparent; color: #fff; }
.tk-text { white-space: pre-wrap; word-break: break-word; line-height: 1.45; }
.tk-text a { color: inherit; text-decoration: underline; }
.tk-files { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.tk-text + .tk-files { margin-top: 8px; }
/* tradução automática dos tickets */
.tk-tr { margin-top: 6px; font-size: .78rem; opacity: .85; }
.tk-tr summary { cursor: pointer; list-style: none; color: #c4b5fd; user-select: none; }
.tk-tr summary::-webkit-details-marker { display: none; }
.tk-tr summary:hover { text-decoration: underline; }
.tk-tr[open] summary { margin-bottom: 4px; }
.tk-tr-orig { white-space: pre-wrap; word-break: break-word; line-height: 1.4; padding: 6px 8px; border-left: 2px solid rgba(196, 181, 253, .5); background: rgba(0, 0, 0, .18); border-radius: 4px; font-size: .85rem; }
.tk-lang { color: #c4b5fd; }
.tk-tr-hint { font-size: .82rem; color: #c4b5fd; margin: 0 0 6px 2px; }
.tk-att-img img { display: block; max-width: 260px; max-height: 220px; border-radius: 8px; }
.tk-att-vid { max-width: 320px; max-height: 240px; border-radius: 8px; background: #000; }
.tk-att-file { display: inline-block; background: rgba(0, 0, 0, .25); color: inherit !important; padding: 6px 10px; border-radius: 8px; word-break: break-all; }
.tk-sys { align-self: center; display: flex; gap: 10px; max-width: 86%; border: 1px dashed rgba(139, 92, 246, .55); background: rgba(139, 92, 246, .07); color: #ddd; border-radius: 12px; padding: 10px 14px; font-size: .9rem; }
.tk-sys i { color: #c4b5fd; margin-top: 3px; }
.tk-sys small { display: block; color: var(--tk-mut); margin-top: 4px; font-size: .74rem; }
.tk-closed { margin: 10px 16px 14px; background: var(--tk-soft); border-radius: 12px; padding: 12px; text-align: center; color: #ccc; font-size: .9rem; }
.tk-closed a { color: #c4b5fd; }
.tk-tabs { display: flex; gap: 4px; padding: 0 12px 8px; flex-wrap: wrap; }
.tk-tab { font-size: .8rem; padding: 4px 10px; border-radius: 8px; color: #bbb; background: var(--tk-soft); text-decoration: none !important; }
.tk-tab span { color: var(--tk-mut); }
.tk-tab.active { background: var(--tk-acc); color: #fff; }
.tk-tab.active span { color: #ede9fe; }
.tk-search { padding: 0 12px 8px; margin: 0; }
@media (max-width: 860px) {
    .tk-wrap { grid-template-columns: 1fr; height: auto; min-height: 0; }
    .tk-page-view .tk-side, .tk-page-new .tk-side { display: none; }
    .tk-page-home .tk-main { display: none; }
    .tk-page-home .tk-side { border-right: 0; }
    .tk-page-home .tk-list { max-height: 55vh; }
    .tk-chat { max-height: 62vh; }
    .tk-msg { max-width: 92%; }
    .tk-att-img img, .tk-att-vid { max-width: 100%; }
}
.menu-badge { font-size: .68rem; vertical-align: 1px; }
.tk-fab { position: fixed; right: 22px; bottom: calc(22px + env(safe-area-inset-bottom, 0px)); z-index: 1040; width: 56px; height: 56px; border-radius: 50%;
          display: grid; place-items: center; color: #fff !important; font-size: 1.6rem; text-decoration: none !important;
          background: linear-gradient(135deg, #8b5cf6, #ec4899); box-shadow: 0 6px 20px rgba(139, 92, 246, .45); transition: transform .15s; }
.tk-fab:hover { transform: scale(1.07); }
.tk-fab-n { position: absolute; top: -3px; right: -3px; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 11px; background: #ef4444; color: #fff;
            font-size: .75rem; font-weight: 700; line-height: 22px; text-align: center; border: 2px solid #0b0b0f; }
.tk-fab-alert { animation: tk-pulse 2s infinite; }
@keyframes tk-pulse { 0%, 100% { box-shadow: 0 6px 20px rgba(139, 92, 246, .45), 0 0 0 0 rgba(236, 72, 153, .55); } 50% { box-shadow: 0 6px 20px rgba(139, 92, 246, .45), 0 0 0 12px rgba(236, 72, 153, 0); } }
.tk-toast { position: fixed; right: 22px; bottom: calc(90px + env(safe-area-inset-bottom, 0px)); z-index: 1040; display: flex; align-items: center; gap: 6px; max-width: min(340px, calc(100vw - 44px));
            background: #1c1c24; border: 1px solid #3b2a63; border-left: 4px solid #8b5cf6; border-radius: 12px; padding: 10px 8px 10px 14px; box-shadow: 0 8px 26px rgba(0, 0, 0, .5); }
.tk-toast a { display: flex; align-items: center; gap: 10px; color: #eee !important; text-decoration: none !important; font-size: .9rem; }
.tk-toast a i { color: #c4b5fd; font-size: 1.1rem; }
.tk-toast button { background: none; border: 0; color: #999; font-size: 1.2rem; line-height: 1; padding: 0 4px; cursor: pointer; }
.tk-toast button i { font-size: .95rem; }
.tk-toast-in { animation: tk-slide .35s ease-out; }
@keyframes tk-slide { from { transform: translateY(14px); opacity: 0; } to { transform: none; opacity: 1; } }
/* janela flutuante do suporte */
.tk-w { position: fixed; right: 22px; bottom: calc(88px + env(safe-area-inset-bottom, 0px)); z-index: 1045; width: 400px; height: min(620px, calc(100vh - 120px));
        display: flex; flex-direction: column; background: #15151b; border: 1px solid #3b2a63; border-radius: 16px; overflow: hidden;
        box-shadow: 0 16px 48px rgba(0, 0, 0, .6); animation: tk-slide .25s ease-out; }
.tk-w-head { display: flex; align-items: center; justify-content: space-between; padding: 8px 8px 8px 14px; color: #fff; font-weight: 600; cursor: default; user-select: none;
             background: linear-gradient(135deg, #6d28d9, #a21caf); }
.tk-w-tools { display: flex; gap: 2px; }
.tk-w-btn { background: none; border: 0; color: #fff !important; width: 32px; height: 30px; border-radius: 8px; display: grid; place-items: center; cursor: pointer; text-decoration: none !important; }
.tk-w-btn:hover { background: rgba(255, 255, 255, .15); }
.tk-w-frame { flex: 1; width: 100%; border: 0; background: #15151b; }
.tk-fab-open { box-shadow: 0 0 0 3px rgba(196, 181, 253, .6), 0 6px 20px rgba(139, 92, 246, .45); }
.tk-toast { z-index: 1046; }
@media (max-width: 520px) { .tk-w { right: 8px; left: 8px; width: auto; bottom: calc(84px + env(safe-area-inset-bottom, 0px)); height: calc(100vh - 110px); } }
/* páginas abertas dentro da janela flutuante */
body.tk-embed { margin: 0; height: 100vh; overflow: hidden; background: #15151b; display: flex; flex-direction: column; }
body.tk-embed > .alert { margin: 8px; font-size: .85rem; padding: 6px 10px; }
body.tk-embed .tk-wrap { grid-template-columns: 1fr; flex: 1; height: auto; min-height: 0; width: 100%; max-width: none; border: 0; border-radius: 0; }
body.tk-embed .tk-page-view .tk-side, body.tk-embed .tk-page-new .tk-side { display: none; }
body.tk-embed .tk-page-home .tk-main { display: none; }
body.tk-embed .tk-page-home .tk-side { border-right: 0; }
body.tk-embed .tk-page-home .tk-list { max-height: none; }
body.tk-embed .tk-chat { max-height: none; }
body.tk-embed .tk-msg { max-width: 90%; }
body.tk-embed .tk-att-img img, body.tk-embed .tk-att-vid { max-width: 100%; }
body.tk-embed .tk-head { padding: 8px 10px; gap: 8px; }
body.tk-embed .tk-head h4 { font-size: 1rem; }
body.tk-embed .tk-head-act .btn { padding: 4px 8px; font-size: .8rem; }
body.tk-embed .tk-bar .tk-hint { display: none; }
body.tk-embed .tk-hours-txt { display: none; }
body.tk-embed .tk-head-sub { font-size: .76rem; gap: 2px 8px; }

/* ---- Vitrine do personagem (página inicial) ---- */
.cs-wrap { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 400px); grid-template-areas: "view side" "stats stats";
           background: #0d0d12; border: 1px solid #26262f; border-radius: 12px; overflow: hidden; color: #e7e7ee; max-width: 1100px; margin: 0 auto; }
.cs-view { grid-area: view; position: relative; min-height: 300px; background: #111116; }
.cs-view .char3d-compact { max-width: none; height: 100%; }
.cs-view .char3d-compact > div { height: 100%; }
.cs-view .char3d-compact .char3d-stage { aspect-ratio: auto; height: 100%; min-height: 300px; border: 0; border-radius: 0; }
.cs-card { position: absolute; left: 8px; top: 8px; width: min(170px, calc(100% - 16px)); padding: 6px 8px; border-radius: 8px;
           background: rgba(12, 12, 18, .66); backdrop-filter: blur(4px); border: 1px solid rgba(255, 255, 255, .08); pointer-events: none; }
.cs-tag { font-size: .58rem; letter-spacing: .07em; text-transform: uppercase; color: #a8a8b8; }
.cs-race-accretia { color: #ff5a5f; } .cs-race-bellato { color: #5ab8ff; } .cs-race-cora { color: #b58cff; }
.cs-name { font-size: .95rem; font-weight: 800; color: #fff; line-height: 1.1; margin: 1px 0; word-break: break-word; }
.cs-sub { font-size: .64rem; color: #b5b5c4; margin-bottom: 3px; }
.cs-bar { display: grid; grid-template-columns: 16px 1fr auto; align-items: center; gap: 4px; font-size: .6rem; margin-top: 2px; font-variant-numeric: tabular-nums; }
.cs-bar b { color: #ccc; } .cs-bar span { color: #eee; min-width: 34px; text-align: right; }
.cs-bar i { height: 4px; border-radius: 3px; background: rgba(255, 255, 255, .1); overflow: hidden; }
.cs-bar s { display: block; height: 100%; border-radius: 3px; }
.cs-hp s { background: linear-gradient(90deg, #b91c1c, #ef4444); } .cs-fp s { background: linear-gradient(90deg, #1d4ed8, #3b82f6); } .cs-sp s { background: linear-gradient(90deg, #a16207, #eab308); }
.cs-side { grid-area: side; padding: 8px 10px; border-left: 1px solid #26262f; background: #121219; min-width: 0; }
.cs-cap { font-size: .6rem; letter-spacing: .1em; text-transform: uppercase; color: #9b9bab; margin: 0 0 4px; font-weight: 700; }
.cs-cap-bag { margin-top: 6px; }
.cs-eq { display: grid; grid-template-columns: 1fr 1fr; gap: 1px 6px; }
.cs-eq-row { display: flex; align-items: center; gap: 5px; padding: 1px 2px; border-radius: 6px; min-width: 0; cursor: default; }
.cs-eq-row:hover { background: rgba(255, 255, 255, .05); }
.cs-eq-row.off { opacity: .45; }
.cs-eq-txt { min-width: 0; flex: 1; display: flex; flex-direction: column; line-height: 1.1; }
.cs-eq-txt small { font-size: .52rem; color: #8d8d9c; text-transform: uppercase; letter-spacing: .05em; }
.cs-eq-txt span { font-size: .66rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cs-tal-mini { display: none; }
.cs-acc { display: flex; flex-wrap: wrap; gap: 3px; margin-top: 4px; }
.cs-ic { position: relative; width: 34px; height: 34px; border-radius: 5px; display: grid; place-items: center; background: #1b1b24; border: 1px solid #2c2c38; cursor: default; }
.cs-ic.sm { width: 24px; height: 24px; flex: none; border-radius: 4px; }
.cs-ic img { width: 90%; height: 90%; object-fit: contain; }
.cs-ic.empty { background: #15151c; border-style: dashed; border-color: #262630; }
.cs-ic:not(.empty):hover { border-color: #a78bfa; box-shadow: 0 0 0 1px #a78bfa inset; }
.cs-amt { position: absolute; right: 1px; bottom: -1px; font-size: .55rem; font-weight: 700; color: #fff; text-shadow: 0 0 3px #000, 0 0 2px #000; font-variant-numeric: tabular-nums; }
.cs-up { position: absolute; left: 1px; top: -1px; font-size: .52rem; font-weight: 700; color: #fcd34d; text-shadow: 0 0 3px #000; }
.cs-noic { font-size: .6rem; color: #aaa; }
.cs-bagtabs { display: flex; gap: 3px; margin-bottom: 4px; }
.cs-bagtab { position: relative; display: grid; place-items: center; width: 34px; height: 34px; padding: 0; background: transparent; border: 1px solid transparent; border-radius: 6px; cursor: pointer; }
.cs-bagtab img { width: 30px; height: 30px; image-rendering: auto; }
.cs-bagtab:hover { background: rgba(255, 255, 255, .05); }
.cs-bagtab.active { background: rgba(139, 92, 246, .18); border-color: #8b5cf6; }
.cs-bagtab.locked img { filter: grayscale(1) brightness(.55); }
.cs-baglock { position: absolute; right: 1px; bottom: 1px; font-size: .62rem; color: #e5e5e5; text-shadow: 0 0 3px #000; }
.cs-bag { display: grid; grid-template-columns: repeat(10, 34px); gap: 3px; }
.cs-bag.locked .cs-ic { opacity: .35; }
.cs-stats { grid-area: stats; display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); border-top: 1px solid #26262f; background: #101016; }
.cs-stats > div { padding: 4px 4px; text-align: center; border-right: 1px solid #1f1f28; min-width: 0; }
.cs-stats > div:last-child { border-right: 0; }
.cs-stats small { display: block; font-size: .52rem; letter-spacing: .07em; text-transform: uppercase; color: #8d8d9c; }
.cs-stats b { font-size: .74rem; color: #fff; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.cs-tip { position: absolute; z-index: 20; max-width: 240px; pointer-events: none; background: rgba(10, 10, 16, .96); border: 1px solid #4c3a85; border-radius: 8px; padding: 6px 8px; box-shadow: 0 8px 24px rgba(0, 0, 0, .6); }
.cs-tip-n { font-weight: 700; color: #fff; font-size: .8rem; }
.cs-tip-s { font-size: .7rem; color: #b8b8c8; margin-top: 2px; }
.cs-tip-tal { display: flex; gap: 2px; margin-top: 4px; }
.cs-tip-tal img { width: 18px; height: 18px; }
.cs-no3d { height: 100%; min-height: 300px; background: radial-gradient(circle at 50% 40%, #23232e, #0d0d12); }
@media (max-width: 991px) {
    .cs-wrap { grid-template-columns: 1fr; grid-template-areas: "view" "side" "stats"; }
    .cs-side { border-left: 0; border-top: 1px solid #26262f; }
    .cs-view, .cs-view .char3d-compact .char3d-stage, .cs-no3d { min-height: 260px; }
    .cs-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .cs-stats > div:nth-child(4) { border-right: 0; }
}
@media (max-width: 460px) {
    .cs-bag { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .cs-ic:not(.sm) { width: auto; aspect-ratio: 1; height: auto; }
}
.cs-view .char3d-note { display: none; }

/* ---------- Chip War ---------- */
.cw { max-width: 1100px; margin: 0 auto; }
.cw-clock { text-align: center; color: #bbb; margin-bottom: 18px; font-size: .95rem; }
.cw-clock b { color: #fff; font-variant-numeric: tabular-nums; }
.cw-slots { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; margin-bottom: 18px; }
.cw-slot { position: relative; border: 1px solid rgba(255, 255, 255, .12); border-radius: 14px; background: linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(0, 0, 0, .15)); padding: 14px 16px 16px; text-align: center; }
.cw-slot-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.cw-ord { font-weight: 700; letter-spacing: .06em; text-transform: uppercase; font-size: .8rem; color: #c4b5fd; }
.cw-slot-time { color: #ddd; font-size: .9rem; }
.cw-slot-time small { color: #888; }
.cw-slot-label { margin-top: 10px; color: #bbb; font-size: .9rem; }
.cw-count { font-size: 2rem; font-weight: 600; color: #fff; font-variant-numeric: tabular-nums; line-height: 1.2; }
.cw-slot.is-live { border-color: rgba(239, 68, 68, .7); box-shadow: 0 0 0 1px rgba(239, 68, 68, .35), 0 0 24px rgba(239, 68, 68, .18); }
.cw-slot.is-live .cw-slot-label { color: #fca5a5; font-weight: 600; }
.cw-slot.is-live .cw-count { font-size: 1.35rem; color: #fecaca; }
.cw-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: #ef4444; margin-right: 4px; animation: cw-pulse 1.2s infinite; vertical-align: 1px; }
@keyframes cw-pulse { 50% { opacity: .25; } }
.cw-badge { display: inline-block; padding: 3px 10px; border-radius: 8px; font-size: .78rem; font-weight: 600; }
.cw-b-morning { background: #16a34a; color: #fff; }
.cw-b-noon { background: #d6b98c; color: #2b1d0e; }
.cw-b-night { background: #5b21b6; color: #fff; }
.cw-admin { margin: 0 0 18px; border: 1px dashed rgba(196, 181, 253, .45); border-radius: 10px; padding: 8px 12px; }
.cw-admin summary { cursor: pointer; color: #c4b5fd; }
.cw-admin-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; margin-top: 10px; }
.cw-admin-form label { display: flex; flex-direction: column; gap: 4px; font-size: .85rem; color: #bbb; margin: 0; flex: 1 1 200px; }
.cw-h { margin: 8px 0 12px; font-size: 1.15rem; }
.cw-empty { text-align: center; color: #999; padding: 24px; border: 1px solid rgba(255, 255, 255, .08); border-radius: 12px; margin-bottom: 16px; }
.cw-day { border: 1px solid rgba(255, 255, 255, .1); border-radius: 18px; padding: 12px 14px 14px; margin-bottom: 14px; background: rgba(255, 255, 255, .02); }
.cw-day-h { font-weight: 600; margin: 0 0 10px 4px; color: #ddd; }
.cw-day-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 12px; }
.cw-war { position: relative; border: 1px solid rgba(255, 255, 255, .12); border-radius: 12px; padding: 14px; text-align: center; }
.cw-war > .cw-badge { position: absolute; top: -10px; right: 12px; }
.cw-war-time { color: #ddd; font-variant-numeric: tabular-nums; }
.cw-war-time span { display: block; color: #aaa; font-size: .85rem; margin-top: 2px; }
.cw-war-res { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 10px; flex-wrap: wrap; }
.cw-win { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.cw-win small { color: #999; font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; }
.cw-bel { color: #03a9f4; } .cw-cor { color: #b39ddb; } .cw-acc { color: #f44336; }
.cw-bosses { display: flex; flex-direction: column; gap: 4px; text-align: left; font-size: .85rem; }
.cw-boss { color: #999; white-space: nowrap; }
.cw-boss.is-win { color: #bef264; font-weight: 600; }
.cw-draw { flex-direction: column; gap: 2px; color: #ddd; }
.cw-draw small { color: #999; }
.cw-lose { opacity: .75; }
.cw-online { margin-top: 8px; font-size: .85rem; color: #ccc; }
.cw-online small { color: #888; }

/* Chip War: quadro no modelo do site (barras dos keepers, resultado e horários) */
.cwx { max-width: 520px; margin: 0 auto 22px; border: 1px solid rgba(255, 255, 255, .12); border-radius: 14px; overflow: hidden;
       background: linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(0, 0, 0, .15)); box-shadow: 0 10px 30px rgba(0, 0, 0, .35); }
.cwx.is-live { border-color: rgba(239, 68, 68, .65); box-shadow: 0 0 26px rgba(239, 68, 68, .2); }
.cwx-head { padding: 14px 18px; font-weight: 800; letter-spacing: .14em; font-size: .95rem; color: #fff; border-bottom: 1px solid rgba(255, 255, 255, .1);
            background: rgba(255, 255, 255, .03); }
.cwx-head .fa { color: #c4b5fd; margin-right: 6px; }
.cwx-livetag { float: right; color: #fca5a5; font-size: .78rem; letter-spacing: .08em; }
.cwx-body { padding: 16px 18px 18px; }
.cwx-race { margin-bottom: 14px; }
.cwx-race-top { display: flex; justify-content: space-between; align-items: center; color: #e5e5e5; font-weight: 600; margin-bottom: 6px; }
.cwx-race-top .race-emblem { vertical-align: -3px; margin-right: 4px; }
.cwx-race-top b { font-variant-numeric: tabular-nums; }
.cwx-bar { height: 7px; border-radius: 6px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.cwx-bar i { display: block; height: 100%; border-radius: 6px; transition: width .6s; }
.cwx-acc { background: linear-gradient(90deg, #ef4444, #f87171); }
.cwx-bel { background: linear-gradient(90deg, #0ea5e9, #38bdf8); }
.cwx-cor { background: linear-gradient(90deg, #8b5cf6, #b39ddb); }
.cwx-sep { border-top: 1px dashed rgba(255, 255, 255, .12); margin: 16px 0 12px; }
.cwx-res { display: flex; flex-direction: column; gap: 6px; color: #ddd; font-size: .92rem; }
.cwx-res span { color: #999; }
.cwx-res .race-emblem { vertical-align: -3px; }
.cwx-win { color: #4ade80; } .cwx-lose { color: #f87171; }
.cwx-time-h { margin: 18px 0 8px; font-weight: 800; letter-spacing: .12em; font-size: .85rem; color: #fff; display: flex; align-items: center; gap: 10px; }
.cwx-time-h::after { content: ''; flex: 1; border-top: 1px solid rgba(255, 255, 255, .15); }
.cwx-row { display: flex; justify-content: space-between; align-items: center; padding: 5px 8px; color: #ddd; border-radius: 6px; }
.cwx-row small { color: #888; margin-left: 4px; }
.cwx-row b { font-variant-numeric: tabular-nums; color: #fff; font-weight: 600; }
.cwx-row.is-live { background: rgba(239, 68, 68, .12); }
.cwx-row.is-live b { color: #fecaca; font-size: .85rem; }
.cwx .cw-online { margin-top: 10px; text-align: center; }
.cwx .cwx-row.cw-slot { border: 0; background: none; box-shadow: none; padding: 5px 8px; text-align: left; }
.cwx .cwx-row.cw-slot.is-live { background: rgba(239, 68, 68, .12); box-shadow: none; }
.cwx .cwx-row .cw-count { font-size: .95rem; line-height: 1.3; text-align: right; }
.cwx .cwx-row.is-live .cw-count { font-size: .82rem; color: #fecaca; }

/* Chip War: contagens grandes (esquerda) + quadro (direita) */
.cw-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 520px); gap: 18px; align-items: start; margin-bottom: 18px; }
.cw-top .cw-slots { grid-template-columns: 1fr; margin-bottom: 0; }
.cw-top .cwx { margin: 0; max-width: none; }
@media (max-width: 900px) { .cw-top { grid-template-columns: 1fr; } }

.cwx-crown { color: #facc15; margin-left: 4px; font-size: .85rem; filter: drop-shadow(0 0 4px rgba(250, 204, 21, .5)); }

/* Buscas de inventário / equipamento / banco: ícone do item ao lado do nome */
.inv-item { display: inline-flex; align-items: center; gap: 10px; text-align: left; }
.inv-icon { width: 32px; height: 32px; flex: 0 0 32px; border-radius: 4px; border: 1px solid rgba(255, 255, 255, .15); background: rgba(0, 0, 0, .35); object-fit: contain; }
.inv-noicon { display: inline-block; }

/* ---------- Events & Coupons ---------- */
.rw { max-width: 1100px; margin: 0 auto; }
.rw-coupon { border: 1px solid rgba(196, 181, 253, .35); border-radius: 14px; padding: 16px 18px; margin-bottom: 22px;
             background: linear-gradient(180deg, rgba(139, 92, 246, .1), rgba(0, 0, 0, .15)); }
.rw-coupon-head { font-weight: 700; letter-spacing: .06em; margin-bottom: 10px; color: #fff; }
.rw-coupon-head .fa { color: #c4b5fd; margin-right: 6px; }
.rw-coupon-form { display: flex; flex-wrap: wrap; gap: 10px; }
.rw-coupon-form .rw-code { flex: 1 1 200px; font-weight: 700; letter-spacing: .1em; }
.rw-coupon-form .rw-char { flex: 1 1 220px; }
.rw-hint { display: block; margin-top: 8px; color: #999; }
.rw-h { margin: 6px 0 12px; font-size: 1.15rem; }
.rw-h .fa { color: #c4b5fd; margin-right: 6px; }
.rw-empty { text-align: center; color: #999; padding: 26px; border: 1px solid rgba(255, 255, 255, .08); border-radius: 12px; }
.rw-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 14px; }
.rw-card { border: 1px solid rgba(255, 255, 255, .12); border-radius: 14px; padding: 14px 16px; background: linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(0, 0, 0, .15));
           display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.rw-card.is-done { opacity: .8; }
.rw-card-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.rw-card-top h5 { margin: 0; font-size: 1.05rem; color: #fff; }
.rw-tag { font-size: .72rem; font-weight: 700; padding: 3px 9px; border-radius: 8px; white-space: nowrap; }
.rw-tag-live { background: #16a34a; color: #fff; }
.rw-tag-soon { background: #d6b98c; color: #2b1d0e; }
.rw-tag-done { background: rgba(255, 255, 255, .12); color: #ddd; }
.rw-desc { margin: 0; color: #ccc; font-size: .9rem; }
.rw-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; color: #aaa; font-size: .85rem; }
.rw-meta b { color: #fff; font-variant-numeric: tabular-nums; }
.rw-items { display: flex; flex-wrap: wrap; gap: 8px; }
.rw-item { display: inline-flex; align-items: center; gap: 8px; padding: 4px 10px 4px 4px; border: 1px solid rgba(255, 255, 255, .12); border-radius: 8px; background: rgba(0, 0, 0, .25); max-width: 100%; }
.rw-item img, .rw-noicon { width: 32px; height: 32px; flex: 0 0 32px; border-radius: 4px; object-fit: contain; background: rgba(0, 0, 0, .35); }
.rw-item-name { font-size: .85rem; color: #eee; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rw-item b { color: #fde68a; font-size: .85rem; }
.rw-claim { display: flex; gap: 8px; flex-wrap: wrap; margin-top: auto; }
.rw-claim .rw-char { flex: 1 1 180px; }
.rw-done { margin-top: auto; color: #86efac; font-size: .88rem; }
.rw-items-mini .rw-item { padding: 2px 8px 2px 2px; }
.rw-items-mini .rw-item img, .rw-items-mini .rw-noicon { width: 24px; height: 24px; flex-basis: 24px; }
.rw-keep { display: inline-flex; align-items: center; gap: 6px; margin: 0; }
.rw-rm { font-size: .8rem; color: #f87171; }

/* ---------- Battle Pass ---------- */
.bp { max-width: 1150px; margin: 0 auto; }
.bp-none { display: flex; gap: 14px; align-items: center; justify-content: center; padding: 40px; color: #bbb; border: 1px solid rgba(255,255,255,.1); border-radius: 14px; }
.bp-none .fa { font-size: 2.2rem; color: #facc15; }
.bp-season { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; color: #ddd; }
.bp-ends { color: #999; margin-left: 8px; font-size: .9rem; }
.bp-ends b, .bp-cash { font-variant-numeric: tabular-nums; }
.bp-cash { color: #fde68a; }
.bp-head { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; border: 1px solid rgba(255,255,255,.12); border-radius: 12px 12px 0 0; padding: 12px 14px;
           background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(0,0,0,.25)); }
.bp-lv { font-size: 1.05rem; color: #eee; min-width: 120px; }
.bp-lv b { color: #fff; font-size: 1.25rem; }
.bp-exp { flex: 1 1 260px; }
.bp-exp-txt { text-align: right; color: #ccc; font-size: .85rem; margin-bottom: 4px; font-variant-numeric: tabular-nums; }
.bp-bar { height: 8px; border-radius: 6px; background: rgba(255,255,255,.1); overflow: hidden; }
.bp-bar i { display: block; height: 100%; background: linear-gradient(90deg, #a16207, #facc15); border-radius: 6px; }
.bp-plus { width: 42px; height: 42px; border-radius: 8px; border: 1px solid #4ade80; background: #14532d; color: #fff; font-size: 1.1rem; }
.bp-claimall { min-width: 170px; height: 42px; border-radius: 8px; border: 1px solid rgba(255,255,255,.25); background: #3f3f46; color: #fff; font-weight: 700; letter-spacing: .04em; }
.bp-claimall:not([disabled]) { background: linear-gradient(180deg, #ca8a04, #854d0e); border-color: #facc15; }
.bp-claimall[disabled] { opacity: .55; }
.bp-ways { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; padding: 8px 14px; border-left: 1px solid rgba(255,255,255,.12); border-right: 1px solid rgba(255,255,255,.12); color: #bbb; font-size: .88rem; }
.bp-ways b { color: #fff; }
.bp-daily { border: 1px solid rgba(74,222,128,.6); background: rgba(22,101,52,.35); color: #dcfce7; border-radius: 8px; padding: 5px 12px; font-size: .85rem; }
.bp-daily[disabled] { opacity: .5; }
.bp-board { display: flex; gap: 10px; border: 1px solid rgba(255,255,255,.12); border-radius: 0 0 12px 12px; padding: 12px; background: rgba(0,0,0,.25); }
.bp-side { flex: 0 0 160px; display: flex; flex-direction: column; gap: 10px; }
.bp-pass { flex: 1; border-radius: 10px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 12px 8px; min-height: 170px; text-align: center; }
.bp-pass-gold { background: radial-gradient(circle at 50% 35%, #a16207, #422006 75%); border: 2px solid #ca8a04; }
.bp-pass-free { background: radial-gradient(circle at 50% 35%, #71717a, #27272a 75%); border: 2px solid #a1a1aa; }
.bp-badge { display: flex; flex-direction: column; align-items: center; color: #fde68a; }
.bp-badge .fa { font-size: 2.6rem; filter: drop-shadow(0 0 6px rgba(250,204,21,.6)); }
.bp-pass-free .bp-badge { color: #e4e4e7; }
.bp-pass-free .bp-badge .fa { filter: none; }
.bp-badge span { font-size: .8rem; letter-spacing: .1em; }
.bp-pass-name { font-weight: 800; letter-spacing: .12em; color: #fff; }
.bp-unlock { border: 2px solid #facc15; background: #1c1917; color: #fde68a; font-weight: 800; letter-spacing: .1em; border-radius: 8px; padding: 6px 14px; }
.bp-unlocked { color: #86efac; font-weight: 700; }
.bp-track { flex: 1; display: flex; gap: 8px; overflow-x: auto; padding-bottom: 6px; min-width: 0; scroll-behavior: smooth; }
.bp-col { flex: 0 0 132px; display: flex; flex-direction: column; gap: 6px; }
.bp-cell { position: relative; height: 150px; border-radius: 8px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px; padding: 8px; }
.bp-cell-gold { background: linear-gradient(180deg, #3b0764, #1e1b4b); border: 1px solid #7e22ce; }
.bp-cell-free { background: linear-gradient(180deg, #3f3f46, #18181b); border: 1px solid #52525b; }
.bp-cell.is-locked .bp-ic, .bp-cell.is-locked .bp-more { opacity: .45; }
.bp-cell.is-ready { cursor: pointer; box-shadow: 0 0 0 2px #facc15, 0 0 18px rgba(250,204,21,.45); animation: bp-glow 1.6s ease-in-out infinite; }
@keyframes bp-glow { 50% { box-shadow: 0 0 0 2px #facc15, 0 0 6px rgba(250,204,21,.2); } }
.bp-cell.is-done { opacity: .55; }
.bp-lock { position: absolute; top: -2px; left: 50%; transform: translateX(-50%); background: #ca8a04; color: #1c1917; width: 30px; height: 34px; border-radius: 0 0 6px 6px;
           display: flex; align-items: center; justify-content: center; font-size: .95rem; z-index: 1; }
.bp-done { position: absolute; top: 6px; right: 6px; background: #16a34a; color: #fff; width: 22px; height: 22px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: .75rem; z-index: 1; }
.bp-ic { position: relative; width: 48px; height: 48px; border: 1px solid rgba(255,255,255,.25); border-radius: 6px; background: rgba(0,0,0,.45); }
.bp-ic img { width: 100%; height: 100%; object-fit: contain; }
.bp-ic b { position: absolute; left: 2px; bottom: 0; font-size: .72rem; color: #fff; text-shadow: 0 0 3px #000, 0 0 3px #000; }
.bp-noic { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; color: #777; }
.bp-more { color: #ddd; font-size: .8rem; }
.bp-empty { color: #666; }
.bp-num { display: flex; justify-content: center; margin: -2px 0; }
.bp-num span { width: 40px; height: 40px; transform: rotate(45deg); border: 2px solid #a1a1aa; background: #18181b; display: flex; align-items: center; justify-content: center; }
.bp-num span { font-weight: 800; color: #e4e4e7; }
.bp-col.is-reached .bp-num span { border-color: #facc15; background: #422006; color: #fde68a; }
.bp-num span::before { content: ''; }
.bp-num span { font-size: 1rem; }
.bp-num span > * { transform: rotate(-45deg); }
.bp-tip { color: #888; font-size: .85rem; margin-top: 8px; }
.bp-dlg { position: fixed; inset: 0; background: rgba(0,0,0,.65); z-index: 2000; display: flex; align-items: center; justify-content: center; padding: 16px; }
.bp-dlg[hidden] { display: none !important; }
.bp-dlg-box { background: #18181b; border: 1px solid #52525b; border-radius: 12px; padding: 18px 20px; max-width: 420px; width: 100%; color: #eee; }
.bp-dlg-row { display: flex; flex-direction: column; gap: 4px; margin: 8px 0; font-size: .9rem; color: #bbb; }
.bp-dlg-btn { display: flex; gap: 8px; justify-content: flex-end; margin-top: 12px; }
.bp-dlg-total { color: #fde68a; margin: 6px 0 0; }
/* admin */
.bp-adm-grid { display: flex; gap: 6px; overflow-x: auto; padding: 8px 2px 10px; }
.bp-adm-col { flex: 0 0 96px; display: flex; flex-direction: column; gap: 4px; }
.bp-adm-cell { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; justify-content: center; min-height: 92px; border-radius: 8px; padding: 4px; text-decoration: none !important; }
.bp-adm-cell.gold { background: linear-gradient(180deg, #3b0764, #1e1b4b); border: 1px solid #7e22ce; }
.bp-adm-cell.free { background: linear-gradient(180deg, #3f3f46, #18181b); border: 1px solid #52525b; }
.bp-adm-cell.on { box-shadow: 0 0 0 2px #facc15; }
.bp-adm-cell .bp-ic { width: 38px; height: 38px; }
.bp-adm-n { text-align: center; font-weight: 700; color: #ddd; }
.bp-adm-items { display: flex; flex-wrap: wrap; gap: 10px; }
.bp-adm-it { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
@media (max-width: 700px) { .bp-board { flex-direction: column; } .bp-side { flex-direction: row; flex-basis: auto; } .bp-pass { min-height: 120px; } }
.bp-num span i { transform: rotate(-45deg); font-style: normal; display: block; }
.bp-daily { font-weight: 700; padding: 7px 16px; font-size: .9rem; border-color: #facc15; background: linear-gradient(180deg, #ca8a04, #854d0e); color: #fff; }
.bp-daily[disabled] { background: rgba(22,101,52,.35); border-color: rgba(74,222,128,.6); color: #dcfce7; opacity: .8; }

/* ---------- v83: Roleta (Events) ---------- */
.rl { border: 1px solid rgba(196, 181, 253, .35); border-radius: 14px; padding: 16px 18px; margin-bottom: 22px;
      background: radial-gradient(circle at 20% 0%, rgba(124, 58, 237, .22), transparent 60%), rgba(0, 0, 0, .2); }
.rl-head { font-weight: 700; letter-spacing: .06em; margin-bottom: 12px; color: #fff; font-size: 1.05rem; }
.rl-head .fa { color: #fde68a; margin-right: 6px; }
.rl-body { display: flex; flex-wrap: wrap; gap: 22px; align-items: center; justify-content: center; }
.rl-wheel-wrap { --rl: 320px; position: relative; width: var(--rl); height: var(--rl); flex: 0 0 auto; }
.rl-wheel { position: absolute; inset: 0; border-radius: 50%; border: 6px solid #d6b98c; box-shadow: 0 0 0 3px #2b1d0e, 0 0 28px rgba(124, 58, 237, .55), inset 0 0 30px rgba(0, 0, 0, .55);
            transition: transform 5s cubic-bezier(.12, .7, .1, 1); overflow: hidden; }
.rl-line { position: absolute; left: 50%; top: 0; width: 2px; height: 50%; margin-left: -1px; background: rgba(214, 185, 140, .55); transform-origin: 50% 100%; }
.rl-slot { position: absolute; left: 50%; top: 50%; width: 46px; height: 46px; margin: -23px 0 0 -23px; text-align: center; }
.rl-slot { transform-origin: 50% 50%; }
.rl-slot img, .rl-slot .rw-noicon { position: relative; top: calc(var(--rl) * -0.33); width: 40px; height: 40px; border-radius: 6px; background: rgba(0, 0, 0, .45);
            box-shadow: 0 0 0 1px rgba(255, 255, 255, .25); object-fit: contain; display: inline-block; }
.rl-slot b { position: relative; top: calc(var(--rl) * -0.33); display: block; font-size: .7rem; color: #fde68a; text-shadow: 0 1px 2px #000; line-height: 1; margin-top: 2px; }
.rl-hub { position: absolute; left: 50%; top: 50%; width: 54px; height: 54px; margin: -27px 0 0 -27px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
          background: radial-gradient(circle at 35% 30%, #fde68a, #b45309); color: #2b1d0e; font-size: 1.3rem; box-shadow: 0 0 0 4px #2b1d0e; }
.rl-pointer { position: absolute; left: 50%; top: -10px; margin-left: -14px; z-index: 3; width: 0; height: 0;
              border-left: 14px solid transparent; border-right: 14px solid transparent; border-top: 30px solid #fde68a; filter: drop-shadow(0 2px 3px rgba(0, 0, 0, .7)); }
.rl-side { flex: 1 1 280px; max-width: 460px; display: flex; flex-direction: column; gap: 10px; }
.rl-cash { color: #ccc; } .rl-cash b { color: #fde68a; font-size: 1.1rem; }
.rl-form { display: flex; flex-wrap: wrap; gap: 8px; }
.rl-form .rw-char { flex: 1 1 200px; }
.rl-btn { font-weight: 700; }
.rl-msg { padding: 8px 12px; border-radius: 8px; font-weight: 600; }
.rl-msg.ok { background: rgba(22, 163, 74, .2); color: #86efac; border: 1px solid rgba(22, 163, 74, .5); }
.rl-msg.err { background: rgba(220, 38, 38, .15); color: #fca5a5; border: 1px solid rgba(220, 38, 38, .45); }
.rl-odds summary { cursor: pointer; color: #c4b5fd; }
.rl-odd { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 6px; }
.rl-odd span { color: #fde68a; font-weight: 700; font-variant-numeric: tabular-nums; }
.rl-hist { font-size: .85rem; color: #ddd; } .rl-hist small { color: #999; display: block; margin-bottom: 2px; }
.rl-hist span { color: #999; font-variant-numeric: tabular-nums; } .rl-hist em { color: #aaa; font-style: normal; }
.rl-adm .rw-item { margin: 0; }
@media (max-width: 420px) { .rl-wheel-wrap { --rl: 270px; } .rl-slot img, .rl-slot .rw-noicon { width: 34px; height: 34px; } }