:root{--azul:#1CB0F6;--azul-esc:#1899D6;--amarelo:#FFC800;--amarelo-esc:#E5A900;--verde:#58CC02;--verde-esc:#46A302;--laranja:#FF9600;--roxo:#CE82FF;--roxo-esc:#A560E8;--vermelho:#FF4B4B;
--bg:#F7F7F7;--card:#fff;--linha:#E5E5E5;--texto:#3C3C3C;--suave:#777;--tela2:#F7F7F7}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--texto);font-family:Nunito,"Segoe UI",system-ui,sans-serif;font-weight:700;line-height:1.45;padding-bottom:78px}
a{color:var(--azul)} img{max-width:100%}
h1,h2,h3{margin:0 0 8px;font-weight:900;letter-spacing:-.3px} h1{font-size:26px} h2{font-size:20px} h3{font-size:16px}
p{margin:0 0 10px}
main{max-width:520px;margin:0 auto;padding:16px 16px 24px;display:flex;flex-direction:column;gap:12px}
main.largo{max-width:1100px}
.topo{position:sticky;top:0;z-index:20;background:var(--card);border-bottom:2px solid var(--linha);display:flex;align-items:center;gap:12px;padding:8px 14px}
.marca{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--azul);font-size:20px;font-weight:900;white-space:nowrap} .marca img{width:34px} .marca b{color:var(--verde)}
.menu-topo{display:none;gap:4px;margin-left:auto} .menu-topo a{text-decoration:none;color:var(--suave);font-size:13px;padding:6px 10px;border-radius:10px} .menu-topo a:hover,.menu-topo a.ativo{background:var(--tela2);color:var(--azul)}
.topo .topo-btn{margin-left:auto;flex:0 0 auto;width:auto;padding:8px 14px;font-size:12px}
@media(min-width:760px){.menu-topo{display:flex}.topo-btn{margin-left:8px}.tab{display:none}body{padding-bottom:0}}
.tab{position:fixed;left:0;right:0;bottom:0;background:var(--card);border-top:2px solid var(--linha);display:flex;justify-content:space-around;padding:6px 4px calc(6px + env(safe-area-inset-bottom));z-index:20}
.tab a{text-decoration:none;font-size:10px;font-weight:800;color:var(--suave);text-align:center;position:relative;min-width:60px}
.tab img{display:block;width:26px;height:26px;margin:0 auto 2px;filter:grayscale(1);opacity:.5} .tab a.on{color:var(--azul)} .tab a.on img{filter:none;opacity:1}
.badge{position:absolute;top:-4px;right:8px;background:var(--vermelho);color:#fff;font-style:normal;font-size:10px;border-radius:99px;padding:1px 6px}
.flash{max-width:520px;margin:12px auto 0;padding:10px 14px;border-radius:14px;font-size:14px;background:#E9F9DD;color:#2f6a00;border:2px solid var(--verde)}
.flash.erro{background:#FFE3E3;color:#8a1010;border-color:var(--vermelho)} .flash.aviso{background:#FFF4D6;color:#5a4300;border-color:var(--amarelo)}
.rodape{text-align:center;color:var(--suave);font-size:12px;padding:20px}
/* componentes */
.btn{display:block;width:100%;border:0;border-radius:16px;padding:13px;font:900 14px Nunito,sans-serif;text-transform:uppercase;letter-spacing:.6px;color:#fff;text-align:center;box-shadow:0 5px 0 var(--verde-esc);background:var(--verde);cursor:pointer;text-decoration:none;transition:transform .08s,box-shadow .08s}
.btn:active{transform:translateY(4px);box-shadow:0 1px 0 var(--verde-esc)}
.btn.azul{background:var(--azul);box-shadow:0 5px 0 var(--azul-esc)} .btn.amarelo{background:var(--amarelo);box-shadow:0 5px 0 var(--amarelo-esc);color:#4a3a00} .btn.roxo{background:var(--roxo);box-shadow:0 5px 0 var(--roxo-esc)} .btn.vermelho{background:var(--vermelho);box-shadow:0 5px 0 #c92b2b}
.btn.linha{background:var(--card);color:var(--azul);border:2px solid var(--linha);box-shadow:0 4px 0 var(--linha)} .btn.pq{padding:9px 12px;font-size:11px;width:auto;display:inline-block}
.btn .ic{width:20px;height:20px;vertical-align:middle;margin-right:4px}
.card{background:var(--card);border:2px solid var(--linha);border-radius:18px;padding:14px}
.card.verde{background:var(--verde);color:#fff;border-color:var(--verde-esc)} .card.verde .mini{color:#fff;opacity:.9}
.card.roxo{background:linear-gradient(135deg,#CE82FF,#8B3DFF);color:#fff;border-color:#8B3DFF} .card.roxo .mini{color:#fff;opacity:.9}
.barra{height:16px;background:var(--linha);border-radius:99px;overflow:hidden} .barra i{display:block;height:100%;border-radius:99px;background:var(--verde);position:relative;width:0;transition:width 1.4s cubic-bezier(.2,.8,.2,1)}
.barra i:after{content:"";position:absolute;left:8px;right:8px;top:4px;height:4px;border-radius:99px;background:rgba(255,255,255,.35)} .barra.azul i{background:var(--azul)} .barra.amarela i{background:var(--amarelo)} .barra.roxa i{background:var(--roxo)}
.num{font-size:34px;font-weight:900;line-height:1;letter-spacing:-1px;font-variant-numeric:tabular-nums} .mini{font-size:12px;color:var(--suave);font-weight:700}
.linha2{display:flex;justify-content:space-between;align-items:center;gap:8px} .chip{display:inline-flex;align-items:center;gap:6px;background:var(--tela2);border:2px solid var(--linha);border-radius:12px;padding:4px 10px;font-size:12px;font-weight:800} .chip img{width:18px;height:18px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px} .stats .card{padding:10px;text-align:center} .stats .num{font-size:22px} .stats img{width:26px;height:26px;display:block;margin:0 auto 2px}
.ic{width:24px;height:24px;vertical-align:middle}
.dom{width:110px;display:block;margin:0 auto;animation:pula 1.6s ease-in-out infinite} @keyframes pula{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-8px) rotate(2deg)}}
.kit{display:flex;gap:10px;align-items:center;border:2px solid var(--linha);border-radius:16px;padding:10px;cursor:pointer;background:var(--card);transition:.15s} .kit:hover{border-color:var(--azul)} .kit.sel{border-color:var(--azul);background:rgba(28,176,246,.08)}
.kit img{width:44px;height:44px;flex:none} .kit b{display:block;font-size:14px} .kit small{color:var(--suave);font-size:11px} .preco{margin-left:auto;font-weight:900;color:var(--azul);font-size:16px;white-space:nowrap}
.med{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;text-align:center} .med div{background:var(--tela2);border:2px solid var(--linha);border-radius:14px;padding:8px 4px} .med img{width:36px;height:36px} .med small{display:block;font-size:10px;font-weight:800;color:var(--suave)} .med div.off{opacity:.35;filter:grayscale(1)}
.jornada{display:flex;justify-content:space-between;align-items:flex-end;padding:0 4px} .jornada div{text-align:center;font-size:9px;font-weight:800;color:var(--suave)} .jornada img{width:34px;height:34px;display:block;margin:0 auto} .jornada .on{color:var(--verde)} .jornada .on img{transform:scale(1.25)} .jornada .off img{filter:grayscale(1);opacity:.4}
.lista{display:flex;flex-direction:column;gap:8px} .item{display:flex;gap:10px;align-items:center;font-size:13px} .item .ck{width:26px;height:26px;border-radius:50%;flex:none;border:2px solid var(--linha);display:flex;align-items:center;justify-content:center;font-size:13px}
.item .ck.ok{background:var(--verde);border-color:var(--verde);color:#fff} .item .ck.now{border-color:var(--azul);color:var(--azul)} .item .ck.x{border-color:var(--vermelho);color:var(--vermelho)}
.feed{display:flex;gap:10px;align-items:center;font-size:12px;padding:6px 0;border-bottom:1px solid var(--linha)} .feed:last-child{border:0} .feed .foto{width:44px;height:44px;border-radius:12px;background:var(--tela2);flex:none;display:flex;align-items:center;justify-content:center;overflow:hidden} .feed .foto img{width:30px} .feed .foto img.real{width:100%;height:100%;object-fit:cover}
.liga{display:flex;align-items:center;gap:10px;font-size:13px;padding:6px 0;border-bottom:1px solid var(--linha)} .liga .pos{width:22px;font-weight:900;color:var(--suave)} .liga .av{width:30px;height:30px;border-radius:50%;background:var(--roxo);flex:none} .liga .xp{margin-left:auto;font-weight:900;color:var(--laranja)} .liga.eu{background:rgba(28,176,246,.08);border-radius:10px;padding:6px}
label{display:block;font-size:13px;margin:6px 0 4px} input,select,textarea{width:100%;border:2px solid var(--linha);border-radius:12px;padding:10px;font:700 14px Nunito,sans-serif;background:var(--card);color:var(--texto)} input:focus,textarea:focus,select:focus{outline:0;border-color:var(--azul)} textarea{resize:vertical;min-height:90px}
.campo{border:2px solid var(--linha);border-radius:12px;padding:8px 10px;font-size:13px;color:var(--suave);background:var(--card)} .campo b{color:var(--texto)}
.tag{display:inline-block;padding:2px 8px;border-radius:8px;font-size:11px;font-weight:900;color:#fff;background:var(--verde)} .tag.p{background:var(--laranja)} .tag.a{background:var(--azul)} .tag.r{background:var(--roxo)} .tag.c{background:var(--suave)} .tag.x{background:var(--vermelho)}
.galeria{display:grid;grid-template-columns:repeat(3,1fr);gap:6px} .galeria div{aspect-ratio:1;border-radius:10px;background:var(--tela2);display:flex;align-items:center;justify-content:center;overflow:hidden} .galeria img,.galeria video{width:100%;height:100%;object-fit:cover}
.bilhete{background:linear-gradient(135deg,#CE82FF,#8B3DFF);color:#fff;border-radius:18px;padding:14px;position:relative;overflow:hidden} .bilhete .num{font-size:28px;letter-spacing:2px}
.rolo{display:flex;gap:6px;justify-content:center} .rolo span{width:36px;height:46px;border-radius:10px;background:#fff;color:#8B3DFF;font-size:24px;font-weight:900;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 -4px 0 rgba(0,0,0,.12)} .rolo.gira span{animation:rola .12s linear infinite} @keyframes rola{0%{transform:translateY(-3px)}100%{transform:translateY(3px)}}
.confete{position:fixed;inset:0;pointer-events:none;z-index:50}
.chat{display:flex;flex-direction:column;gap:6px;max-height:50vh;overflow:auto;padding:4px} .chat .msg{font-size:13px;padding:8px 12px;border-radius:14px;max-width:85%;background:var(--tela2);border:2px solid var(--linha)} .chat .msg.eu{align-self:flex-end;background:rgba(88,204,2,.12);border-color:var(--verde)} .chat .msg small{display:block;color:var(--suave);font-size:10px}
.tabela{width:100%;border-collapse:collapse;font-size:13px} .tabela th{text-align:left;color:var(--suave);font-size:11px;text-transform:uppercase;letter-spacing:.5px;padding:6px 8px;border-bottom:2px solid var(--linha)} .tabela td{padding:7px 8px;border-bottom:1px solid var(--linha);vertical-align:top} .rolar{overflow-x:auto}
.kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:10px} @media(min-width:760px){.kpis{grid-template-columns:repeat(4,1fr)}} .kpis .num{font-size:22px}
.menu-admin{display:flex;gap:6px;flex-wrap:wrap} .menu-admin a{text-decoration:none;font-size:12px;font-weight:800;color:var(--suave);background:var(--card);border:2px solid var(--linha);border-radius:12px;padding:6px 10px;display:flex;gap:6px;align-items:center} .menu-admin a img{width:18px} .menu-admin a.on{background:var(--azul);color:#fff;border-color:var(--azul)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px} .grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}
.post{display:block;text-decoration:none;color:inherit;background:var(--card);border:2px solid var(--linha);border-radius:18px;overflow:hidden} .post .capa{height:110px;background:linear-gradient(135deg,var(--amarelo),var(--laranja));display:flex;align-items:center;justify-content:center;gap:12px} .post .capa img{width:56px} .post .txt{padding:12px}
.prose{font-size:15px;line-height:1.6} .prose p{margin:0 0 12px}
.ia{border:2px dashed var(--roxo);border-radius:16px;padding:12px;background:rgba(206,130,255,.06)}
.hero{text-align:center} .hero .num{color:var(--verde);font-size:44px}
@media(prefers-reduced-motion:reduce){.dom,.rolo.gira span{animation:none}.barra i{transition:none}}