/* Mesmo visual do chat ("painel de cinema") nas páginas de entrar, Minha conta, afiliado e admin.
   Carregado depois do estilo de cada página, então só sobrescreve. */
@font-face{font-family:"Inter";src:url(/static/fontes/inter-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Inter";src:url(/static/fontes/inter-latin-600-normal.woff2) format("woff2");font-weight:500 800;font-display:swap}
@font-face{font-family:"Space Grotesk";src:url(/static/fontes/space-grotesk-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Space Grotesk";src:url(/static/fontes/space-grotesk-latin-700-normal.woff2) format("woff2");font-weight:600 800;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(/static/fontes/jetbrains-mono-latin-500-normal.woff2) format("woff2");font-weight:400 500;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(/static/fontes/jetbrains-mono-latin-700-normal.woff2) format("woff2");font-weight:600 800;font-display:swap}
:root{--bg:#060709;--side:#0a0b0e;--card:#0f1115;--line:rgba(255,255,255,.08);--line2:rgba(255,255,255,.14);--txt:#eceef2;--mut:#80858f;--acc:#ffd400;
  --acc-s:rgba(255,212,0,.1);--acc-l:rgba(255,212,0,.45);--glow:0 0 0 1px rgba(255,212,0,.35),0 0 22px -4px rgba(255,212,0,.45);
  --tit:"Space Grotesk","Inter",system-ui,sans-serif;--mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace}
body{font-family:"Inter",-apple-system,system-ui,"Segoe UI",sans-serif;
  background:radial-gradient(1100px 500px at 75% -10%,rgba(255,212,0,.07),transparent 60%),
    linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px) 0 0/44px 44px,linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px) 0 0/44px 44px,var(--bg);
  background-attachment:fixed}
::selection{background:var(--acc);color:#000}
.ico{width:15px;height:15px;flex-shrink:0;vertical-align:-3px;display:inline-block;margin-right:7px;color:var(--acc)}

/* topo */
.topo{background:rgba(6,7,9,.82);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.logo{font-family:var(--tit);font-weight:700;letter-spacing:-.6px}
.logo b{color:var(--acc);text-shadow:0 0 18px rgba(255,212,0,.55)}
.topo nav a,.topo nav .link{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.topo nav .link{color:var(--mut)}.topo nav .link:hover{color:var(--txt)}

/* títulos */
h2{font-family:var(--tit);font-weight:700;letter-spacing:-.6px;font-size:22px}
h3{font-family:var(--mono);font-size:11px!important;letter-spacing:.16em;text-transform:uppercase;color:#9ca1ab;font-weight:600;display:flex;align-items:center;gap:10px}
h3::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--line2),transparent)}
.mut{color:var(--mut)}

/* caixas: vidro escuro com cantos marcados em amarelo */
.saldo,.card,.painel,.tabela,.modal-box,.kpi{border-radius:8px;border:1px solid var(--line);
  background:linear-gradient(var(--acc),var(--acc)) 0 0/12px 1px,linear-gradient(var(--acc),var(--acc)) 0 0/1px 12px,
    linear-gradient(var(--acc),var(--acc)) 100% 100%/12px 1px,linear-gradient(var(--acc),var(--acc)) 100% 100%/1px 12px,
    linear-gradient(180deg,#111318,#0c0e12);background-repeat:no-repeat}
.card{transition:border-color .2s,box-shadow .2s,transform .2s}
.card:hover{border-color:var(--line2);transform:translateY(-2px);box-shadow:0 18px 50px -24px #000}
.card.dest{border-color:var(--acc-l);box-shadow:0 0 40px -18px rgba(255,212,0,.5)}
.card h3{font-family:var(--tit)!important;font-size:18px!important;letter-spacing:-.3px;text-transform:none;color:var(--txt)}.card h3::after{display:none}
.selo{border-radius:4px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;box-shadow:0 0 16px -2px rgba(255,212,0,.7)}
.moedas{font-family:var(--tit);letter-spacing:-1.5px}.moedas b{text-shadow:0 0 22px rgba(255,212,0,.45)}
.preco{font-family:var(--tit);letter-spacing:-1px}
.kpi small{font-family:var(--mono);letter-spacing:.14em;font-size:10.5px}
.kpi b{font-family:var(--tit);letter-spacing:-1px}
.kpi.destaque{border-color:var(--acc-l);box-shadow:0 0 34px -16px rgba(255,212,0,.6)}

/* botões */
.bt{border-radius:9px;font-family:var(--tit);font-weight:700;letter-spacing:.02em;background:linear-gradient(180deg,#ffe14d,var(--acc));
  box-shadow:0 0 0 1px rgba(255,212,0,.6),0 8px 24px -10px rgba(255,212,0,.7);transition:transform .12s,box-shadow .2s;text-decoration:none;display:inline-block}
.bt:hover{transform:translateY(-1px);box-shadow:0 0 0 1px #ffe14d,0 12px 30px -10px rgba(255,212,0,.85)}
.bt.s{background:rgba(255,255,255,.035);border:1px solid var(--line2);box-shadow:none;color:var(--txt)}
.bt.s:hover{border-color:var(--acc-l);box-shadow:var(--glow)}
.bt.r{background:rgba(255,80,80,.08);box-shadow:none;border:1px solid rgba(255,90,90,.35)}

/* tabelas */
th{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#7d828c;font-weight:600}
td{border-bottom-color:var(--line)}
tr:hover td{background:rgba(255,255,255,.02)}
.tag{border-radius:4px;font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase}

/* campos */
label{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase}
label input,label select,label textarea,.campo,input{background:#08090b;border:1px solid var(--line2);border-radius:8px;font-family:"Inter",system-ui,sans-serif;text-transform:none;letter-spacing:0}
label input:focus,.campo:focus,input:focus{border-color:var(--acc);box-shadow:0 0 0 3px rgba(255,212,0,.1)}
code{background:#08090b;border:1px solid var(--line);font-family:var(--mono)}

/* tela de entrar */
form.box{border:1px solid var(--line2);border-radius:10px;background:
  linear-gradient(var(--acc),var(--acc)) 0 0/16px 2px,linear-gradient(var(--acc),var(--acc)) 0 0/2px 16px,
  linear-gradient(var(--acc),var(--acc)) 100% 100%/16px 2px,linear-gradient(var(--acc),var(--acc)) 100% 100%/2px 16px,
  rgba(12,13,17,.88);background-repeat:no-repeat;backdrop-filter:blur(10px);box-shadow:0 40px 100px -30px #000,0 0 60px -30px rgba(255,212,0,.35)}
form.box .logo{font-size:28px}
form.box .sub{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase}
.abas{background:#08090b;border:1px solid var(--line);border-radius:9px}
.abas button{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;border-radius:6px}
.abas button.on{background:var(--acc-s);color:#fff;box-shadow:inset 0 0 0 1px var(--acc-l)}
form.box .bt{width:100%}
.aviso{border-radius:8px}
.forca{background:rgba(255,255,255,.06)}

/* ---------- janela de recarga (estilo injetado pelo recarga.js; "body" na frente ganha dele) ---------- */
body #woc-rec{background:rgba(3,4,6,.78);backdrop-filter:blur(6px)}
body #woc-rec .cx{border-radius:12px;border:1px solid var(--line2);font-family:"Inter",system-ui,sans-serif;background:
  linear-gradient(var(--acc),var(--acc)) 0 0/16px 2px,linear-gradient(var(--acc),var(--acc)) 0 0/2px 16px,
  linear-gradient(var(--acc),var(--acc)) 100% 100%/16px 2px,linear-gradient(var(--acc),var(--acc)) 100% 100%/2px 16px,
  rgba(11,12,15,.97);background-repeat:no-repeat;box-shadow:0 40px 100px -30px #000,0 0 60px -30px rgba(255,212,0,.4)}
body #woc-rec h3{font-family:var(--tit);font-weight:700;letter-spacing:-.4px;display:flex;align-items:center;font-size:20px!important;text-transform:none;color:var(--txt)}
body #woc-rec h3::after{display:none}
body #woc-rec h3 .ico{color:var(--acc);width:20px;height:20px;margin-right:9px}
body #woc-rec .sec{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;display:flex;align-items:center;gap:8px}
body #woc-rec .sec::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--line2),transparent)}
body #woc-rec .it{border-radius:8px;background:rgba(255,255,255,.025);border-color:var(--line);transition:border-color .15s,box-shadow .15s,background .15s}
body #woc-rec .it:hover{border-color:var(--acc-l);background:var(--acc-s)}
body #woc-rec .it.dest{border-color:var(--acc);box-shadow:var(--glow)}
body #woc-rec .it b{font-family:var(--tit);font-weight:600}
body #woc-rec .it small{font-family:var(--mono);font-size:11px}
body #woc-rec .it .pr{font-family:var(--tit);text-shadow:0 0 18px rgba(255,212,0,.4)}
body #woc-rec .tag{border-radius:4px;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em}
body #woc-rec button.bt{border-radius:9px;font-family:var(--tit);display:inline-flex;align-items:center;justify-content:center}
body #woc-rec .amar{background:linear-gradient(180deg,#ffe14d,var(--acc));box-shadow:0 0 0 1px rgba(255,212,0,.6),0 8px 24px -10px rgba(255,212,0,.7)}
body #woc-rec .esc{background:rgba(255,255,255,.04);border-color:var(--line2)}
body #woc-rec .aviso,body #woc-rec .ok{border-radius:8px;display:flex;gap:2px;align-items:flex-start}
body #woc-rec .aviso{background:rgba(255,212,0,.07);border-color:var(--acc-l);border-left:2px solid var(--acc)}
body #woc-rec .aviso .ico,body #woc-rec .ok .ico,body #woc-rec .mut .ico{margin-top:2px}
body #woc-rec .ok .ico{color:#6be39a}
body #woc-rec .formas{border-radius:9px;background:#08090b}
body #woc-rec .formas button{border-radius:6px;font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;display:inline-flex;align-items:center;justify-content:center}
body #woc-rec .formas button.on .ico{color:#000}
body #woc-rec code{background:#08090b;border-color:var(--line2);font-family:var(--mono);border-radius:8px}
body #woc-rec img.qr{border-radius:8px;box-shadow:0 0 0 1px var(--acc-l),0 0 40px -10px rgba(255,212,0,.5)}
