/* barra limpa + layout do Genérico em todos os temas */
:root[data-tema] #cadWin .bar i.fechavel{display:inline-flex!important;align-items:center;margin-left:auto;width:auto!important;height:auto!important;padding:4px 12px;border:1px solid var(--line)!important;border-radius:999px!important;background:var(--bg)!important;color:var(--gold2);font:600 12px var(--sans);font-style:normal;line-height:1.2;cursor:pointer}
:root[data-tema] #cadWin .bar i.fechavel::before{content:"— Minimizar"}
:root[data-tema] #cadWin .bar i.fechavel:hover{background:var(--hov)!important;filter:none}
:root[data-tema] #perfSq:not([hidden]){display:inline-flex;align-items:center;gap:7px;width:auto!important;height:auto!important;padding:4px 12px;border:1px solid var(--line)!important;border-radius:999px!important;background:var(--surf)!important;color:var(--gold2);font:600 12px var(--sans);cursor:pointer}
:root[data-tema] #perfSq::before{content:"";width:9px;height:9px;border-radius:50%;background:#6EC8AA}
:root[data-tema] #perfSq[data-st=ocupado]::before{background:#F2C94C}
:root[data-tema] #perfSq::after{content:"Meu Perfil"}
:root[data-tema] .shell{display:block;max-width:1120px;margin:0 auto;padding:0 20px}
:root[data-tema] .wrap{max-width:none;padding:20px 0 60px}
:root[data-tema] .top{padding:4px 0 20px;border-bottom:1px solid var(--line);margin-bottom:24px}
:root[data-tema] h1{font-size:clamp(28px,4.2vw,46px);line-height:1.12;letter-spacing:-.02em;font-weight:800;margin:0 0 22px}
:root[data-tema] h1 span{display:block;color:var(--gold)}
:root[data-tema] footer{border-top:1px solid var(--line);padding-top:18px;font-family:var(--sans)}
:root[data-tema] #needRow{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))!important;gap:12px;flex-wrap:wrap;overflow:visible!important}
:root[data-tema] #needRow button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:110px;padding:16px 10px;border-radius:14px;background:var(--surf);border:1px solid var(--line);white-space:normal;word-break:normal!important;overflow-wrap:normal!important;hyphens:none}
:root[data-tema] #needRow button:hover,:root[data-tema] #needRow button:focus-visible{border-color:var(--gold);box-shadow:0 2px 10px rgba(16,24,40,.08);outline:none}
:root[data-tema] .mq,:root[data-tema] .tka{background:var(--deep)}
:root[data-tema] .tk{background:var(--surf)}
:root[data-tema] .mq{border-bottom-color:var(--line)}
@media(min-width:1200px){
 :root[data-tema] .shell{display:grid;grid-template-columns:176px minmax(0,1120px) 176px;gap:14px;justify-content:center;max-width:1560px;padding:0 14px}
}
html.sem-outdoor:root[data-tema] .shell,html.modo-foco:root[data-tema] .shell{grid-template-columns:minmax(0,1120px)!important}

/* campos de texto, telefone e e-mail com as cores do tema (no celular ficavam pretos no Genérico claro) */
:root[data-tema] input:is([type=text],[type=tel],[type=email],[type=url]):not(#m){background-color:var(--surf)!important;color:var(--text)!important;border:1px solid var(--line)!important}
/* ===== Genérico: página em colunas, como jornal ===== */
:root[data-tema] #cLista{column-width:280px;column-gap:14px}
:root[data-tema] #cLista .vcard{break-inside:avoid}
:root[data-tema] #cLista>p{column-span:all}
@media(min-width:1000px){
 :root[data-tema] .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:22px;row-gap:22px;align-items:start}
 :root[data-tema] .wrap>*{grid-column:1/-1}
 :root[data-tema] #vLista{max-height:300px;overflow-y:auto}
}

/* ===== chrome comum a todos os temas ===== */
:root[data-tema]:not([data-tema=terminal]){--mono:var(--sans)}
:root[data-tema] .win{border-radius:12px;overflow:hidden}
:root[data-tema] .bar{font-family:var(--sans);font-size:13px;font-weight:600;background:var(--surf);border-bottom:1px solid var(--line)}
:root[data-tema] .bar i:not(.fechavel){display:none}
:root[data-tema] .bar .t{text-shadow:none}
:root[data-tema] *{text-shadow:none}
#cfgBtn{display:none!important}
#cfg{left:auto!important;right:12px;top:calc(64px + env(safe-area-inset-top,0px));bottom:auto!important;z-index:60}
#cfgPan{max-height:calc(100vh - 96px);overflow:auto;border-radius:16px;min-width:240px;padding:10px}
html.sem-letreiro .mq,html.sem-letreiro .tk{display:none!important}
nav.nv.nv-s>#navAjustes{display:inline-flex!important;align-items:center;justify-content:center;gap:6px;width:auto;min-height:42px;padding:8px 16px;border-radius:999px;font:700 15px var(--sans);white-space:nowrap;cursor:pointer;background:var(--surf);border:1px solid var(--line);color:var(--gold2)}
nav.nv.nv-s>#navAjustes:hover,nav.nv.nv-s>#navAjustes[aria-expanded=true]{border-color:var(--gold)}
@media(max-width:640px){nav.nv.nv-s>#navAjustes{flex:1 1 0;min-width:0;font-size:14px;padding:8px 10px}}
/* a engrenagem só aparece dentro de "Mais informações" (menu aberto) */
html:root:root:root:root body nav.nv.nv-s:not(.nv-aberto)>#navAjustes{display:none!important}
@keyframes mhblink{50%{opacity:0}}

/* ===== 1 Dourado: editorial, ouro e serifa ===== */
:root[data-tema=escuro] h1,:root[data-tema=escuro] h2,:root[data-tema=escuro] h3{font-family:Georgia,"Times New Roman",serif;font-weight:700}
:root[data-tema=escuro] body{background-image:radial-gradient(900px 480px at 15% 0,rgba(var(--gold-rgb),.14),transparent 70%)}
:root[data-tema=escuro] .win{border-top:2px solid var(--gold);box-shadow:0 12px 30px rgba(0,0,0,.45)}
:root[data-tema=escuro] .top{border-bottom-color:rgba(var(--gold-rgb),.55)}
/* ===== 2 Claro: papel e marca-texto ===== */
:root[data-tema=claro] h1,:root[data-tema=claro] h2,:root[data-tema=claro] h3{font-family:Georgia,"Times New Roman",serif}
:root[data-tema=claro] .win{background:var(--surf);box-shadow:inset 0 1px 0 #fff,0 10px 24px rgba(122,86,0,.13)}
:root[data-tema=claro] .bar{background:var(--deep)}
:root[data-tema=claro] h1 span{background:linear-gradient(transparent 62%,rgba(var(--gold-rgb),.3) 0);width:fit-content}
/* ===== 3 Miami: neon degradê ===== */
:root[data-tema=miami] .win{border:1px solid transparent;background:linear-gradient(var(--surf),var(--surf)) padding-box,linear-gradient(135deg,#FF4FA3,#5EE7FF) border-box;box-shadow:0 0 28px rgba(255,79,163,.2)}
:root[data-tema=miami] h1{font-style:italic;font-weight:900;letter-spacing:-.03em}
:root[data-tema=miami] h1 span{background:linear-gradient(90deg,#FF4FA3,#FFB86B,#5EE7FF);-webkit-background-clip:text;background-clip:text;color:transparent}
:root[data-tema=miami] .top{border-bottom:3px solid;border-image:linear-gradient(90deg,#FF4FA3,#FFB86B,#5EE7FF) 1}
/* ===== 4 Brasil: faixas e losango ===== */
:root[data-tema=brasil] body{background-image:repeating-linear-gradient(45deg,rgba(255,223,0,.035) 0 2px,transparent 2px 30px),radial-gradient(900px 480px at 15% 0,rgba(0,156,59,.22),transparent 70%),radial-gradient(700px 420px at 90% 10%,rgba(0,39,118,.3),transparent 70%)}
:root[data-tema=brasil] .top{border-bottom:0;padding-bottom:26px;box-shadow:0 5px 0 #009C3B,0 10px 0 #FFDF00,0 15px 0 #002776}
:root[data-tema=brasil] .win{border-left:4px solid var(--gold);border-radius:10px}
:root[data-tema=brasil] h1{font-weight:900}
/* ===== 5 Pôr do sol: vidro e horizonte ===== */
:root[data-tema=araguaia] body{background-image:radial-gradient(circle 280px at 82% 0,rgba(255,138,61,.4),transparent 70%),linear-gradient(180deg,#3A1A3F 0,#1A0F1E 560px)}
:root[data-tema=araguaia] .win{background:rgba(38,22,41,.7);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-color:rgba(255,184,107,.28);border-radius:20px}
:root[data-tema=araguaia] .bar{background:transparent}
:root[data-tema=araguaia] h1 span{background:linear-gradient(90deg,#FF8A3D,#FF5E7E);-webkit-background-clip:text;background-clip:text;color:transparent}
/* ===== 6 Terminal: prompt e cursor ===== */
:root[data-tema=terminal] .win{border-radius:2px;border-color:var(--gold);box-shadow:0 0 0 1px rgba(57,255,20,.15),0 0 20px rgba(57,255,20,.12)}
:root[data-tema=terminal] .bar::before{content:"$";color:var(--gold)}
:root[data-tema=terminal] h1 span::after{content:"\2588";margin-left:.12em;animation:mhblink 1s steps(1) infinite}
:root[data-tema=terminal] nav.nv.nv-s>.more,:root[data-tema=terminal] nav.nv.nv-s>#navAjustes{border-radius:2px!important}
@media(prefers-reduced-motion:reduce){:root[data-tema=terminal] h1 span::after{animation:none}}
/* ===== 7 Eclipse: disco negro com coroa ===== */
:root[data-tema=eclipse] body{background-repeat:no-repeat;background-image:radial-gradient(circle 70px at 88% 110px,#000 0 96%,transparent 100%),radial-gradient(circle 150px at 88% 110px,rgba(178,107,255,.6),transparent 72%),radial-gradient(900px 480px at 10% 0,rgba(178,107,255,.2),transparent 70%)}
:root[data-tema=eclipse] .win{border-radius:20px;box-shadow:0 0 0 1px rgba(178,107,255,.25),0 0 44px rgba(178,107,255,.14)}
:root[data-tema=eclipse] h1 span{background:linear-gradient(90deg,#B26BFF,#FF6EC7);-webkit-background-clip:text;background-clip:text;color:transparent}
/* ===== 8 Cristal: gelo e vidro fosco ===== */
:root[data-tema=cristal] body{background-image:linear-gradient(160deg,#E6F0FF,#F5F6F8 42%,#ECF3FF);background-attachment:fixed}
:root[data-tema=cristal] .win{background:rgba(255,255,255,.7);-webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4);border:1px solid rgba(255,255,255,.95);border-radius:20px;box-shadow:0 10px 34px rgba(29,95,214,.1),inset 0 1px 0 #fff}
:root[data-tema=cristal] .bar{background:transparent;border-bottom-color:rgba(29,95,214,.12)}
/* ===== 11 Voltagem: bloco duro e sombra deslocada ===== */
:root[data-tema=voltagem] .win{border:2px solid var(--text);border-radius:4px;box-shadow:6px 6px 0 var(--gold)}
:root[data-tema=voltagem] .bar{background:var(--gold);color:#0D0F12;border-bottom:2px solid var(--text)}
:root[data-tema=voltagem] h1{text-transform:uppercase;font-weight:900;letter-spacing:-.01em}
:root[data-tema=voltagem] nav.nv.nv-s>.more,:root[data-tema=voltagem] nav.nv.nv-s>#navAjustes{border-radius:4px!important;border-width:2px!important}
/* ===== 12 Sombra: noir, só linhas ===== */
:root[data-tema=sombra] body{background-image:radial-gradient(ellipse at 50% -10%,rgba(255,255,255,.08),transparent 60%)}
:root[data-tema=sombra] .win{background:transparent;border-radius:2px;box-shadow:none}
:root[data-tema=sombra] .bar{background:transparent;letter-spacing:.08em}
:root[data-tema=sombra] h1{font-weight:300;letter-spacing:.02em}

/* ===== Colunas de jornal: perfil + Caronas à esquerda, chat + Guia à direita ===== */
.jcol{display:flex;flex-direction:column;gap:22px;min-width:0}
.jcol>#vale,.jcol>#carona,.jcol>#cheers{margin-top:0}
:root[data-tema] .wrap>.grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:22px;align-items:start}
/* perfil minimizado OU chat ampliado: as posições mudam (chat em cima, Guia e Caronas lado a lado) */
:root[data-tema] .wrap>.grid.perfil-fechado>.jcol,html.cw-open:root[data-tema] .wrap>.grid>.jcol{display:contents}
:root[data-tema] .grid.perfil-fechado #cw{grid-column:1/-1;grid-row:1}
:root[data-tema] .grid.perfil-fechado #vale{grid-column:1;grid-row:2}
:root[data-tema] .grid.perfil-fechado #carona{grid-column:2;grid-row:2}
:root[data-tema] .grid.perfil-fechado #cheers{grid-column:1;grid-row:3}
html.cw-open:root[data-tema] .grid:not(.perfil-fechado) #cadWin{grid-column:1;grid-row:1/span 3}
html.cw-open:root[data-tema] .grid:not(.perfil-fechado) #vale{grid-column:2;grid-row:1}
html.cw-open:root[data-tema] .grid:not(.perfil-fechado) #carona{grid-column:2;grid-row:3}
html.cw-open:root[data-tema] .grid:not(.perfil-fechado) #cheers{grid-column:2;grid-row:2}
html.modo-foco #vale,html.modo-foco #carona,html.modo-foco #cheers{display:none!important}
@media(max-width:860px){
 :root[data-tema] .wrap>.grid,:root[data-tema] .wrap>.grid.perfil-fechado{display:flex;flex-direction:column;gap:12px}
 :root[data-tema] .wrap>.grid>.jcol{display:contents}
 :root[data-tema] #cadWin{order:1}:root[data-tema] #cw{order:2}:root[data-tema] #vale{order:3}:root[data-tema] #cheers{order:4}:root[data-tema] #carona{order:5}
 .jcol>#vale,.jcol>#carona,.jcol>#cheers{margin-top:20px}
}
/* ===== Genérico: cabeçalho misto (Suporte, Mais informações e Ajustes como nos outros temas) ===== */
:root[data-tema^=generico] :is(#saiba,#hoje,#tutorial,#guia-chat,#seguranca,#taxas,#duvidas,#apoie,#patrocinio,#quem,#privacidade).mh-ver{display:block!important;scroll-margin-top:16px}
:root[data-tema^=generico] nav.nv.nv-s.nv-aberto>.more:not(:is(#navSup,#navMais,#navAjustes,[href*="instagram.com"],#navBaixar,[data-go="saiba"],[data-go="hoje"],[data-go="tutorial"],[data-go="guia-chat"],[data-go="seguranca"],[data-go="taxas"],[data-go="duvidas"],[data-go="apoie"],[data-go="patrocinio"],[data-go="quem"],[data-go="privacidade"])):not(#navSup):not(#navMais){display:none!important}
/* ===== Publicidade lateral: sem moldura nem título, os anúncios soltos na página ===== */
:root[data-tema] .side>.win{background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important;overflow:visible}
:root[data-tema] .side>.win>.bar{display:none!important}
:root[data-tema] .side .vcol{padding:0}
/* ===== Letreiros do topo: integrados à página, acompanham a rolagem junto com os outdoors, sem sombra nem linhas ===== */
:root[data-tema] .top-letreiros{position:sticky!important;top:0;z-index:50;box-shadow:none!important;background:var(--bg)!important;border:0!important}
:root[data-tema] .top-letreiros .mq,:root[data-tema] .top-letreiros .tk,:root[data-tema] .top-letreiros .tka{background:transparent!important;border:0!important;box-shadow:none!important}
:root[data-tema] .top-letreiros .tkl{border-radius:999px}
/* SOS privado */
p.sospv{border-left:4px solid #dc2626;background:rgba(220,38,38,.12);border-radius:8px;padding:6px 8px;font-weight:700}
#psos{background:#dc2626;color:#fff;border-color:#dc2626;font-weight:700}
#psos.off{opacity:.55}
/* ===== Aba Categorias (ao lado de "Do que você precisa?") ===== */
.need-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.need-tabs button{min-height:40px;padding:8px 16px;border-radius:999px;border:1px solid var(--line);background:var(--surf);color:var(--read);font:700 14px var(--sans);cursor:pointer;transition:border-color .15s,background .15s}
.need-tabs button[aria-selected=true]{border-color:var(--gold);color:var(--gold2);background:var(--deep)}
.need-tabs button:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}
#need[data-min="1"] .need-tabs,#need[data-min="1"] #needCats{display:none!important}
#need .need-sep{grid-column:1/-1;margin:6px 0 0;font:800 13px var(--sans);letter-spacing:.3px;color:var(--mute)}#need .need-sep:first-child{margin-top:0}
#need[data-aba="cat"] #needRow,#need[data-aba="est"] #needRow{display:none!important}
/* setinha: minimizado esconde tudo (vence as regras dos temas) */
:root:root:root:root #need[data-min="1"] :is(#needRow,#needTabs,#needCats,#needInfo){display:none!important}
#needCats .nc-q{width:100%;box-sizing:border-box;min-height:46px;padding:0 16px;border-radius:999px;border:1px solid var(--line);background:var(--bg);color:var(--text);font:16px var(--sans);margin:0 0 12px}
#needCats .nc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
#needCats .need-cat{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:110px;padding:14px 10px;border-radius:14px;background:var(--surf);border:1px solid var(--line);color:var(--read);font:700 15px var(--sans);text-align:center;cursor:pointer;transition:transform .08s,border-color .15s}
#needCats .need-cat:hover,#needCats .need-cat:focus-visible{border-color:var(--gold);outline:none}
#needCats .need-cat:active{transform:scale(.97)}
#needCats .nc-ic{font-size:32px;line-height:1}
#needCats .nc-n{font:500 12px var(--sans);color:var(--mute)}
#needCats .nc-chips{display:flex;flex-wrap:wrap;gap:8px}
#needCats .nc-chip{min-height:42px;padding:8px 16px;border-radius:999px;background:var(--surf);border:1px solid var(--line);color:var(--read);font:600 14px var(--sans);cursor:pointer}
#needCats .nc-chip:hover,#needCats .nc-chip:focus-visible{border-color:var(--gold);color:var(--gold2);outline:none}
#needCats .nc-busca{margin-top:12px;border-style:dashed}
#needCats .nc-back{background:none;border:0;color:var(--gold2);font:700 14px var(--sans);padding:6px 0;margin:0 0 6px;cursor:pointer}
#needCats .nc-h{margin:0 0 10px;font:800 18px var(--sans);color:var(--text)}
#needCats .nc-dica{margin:12px 0 0;font-size:13px;color:var(--mute)}
@media(max-width:640px){#needCats .nc-grid{grid-template-columns:repeat(2,1fr);gap:8px}#needCats .need-cat{min-height:96px}}