/* Kamba v3 — visual claro, estilo rede social moderna. Carregar DEPOIS do <style> principal */
:root{--fundo:#F0F2F5;--az:#0B5ED7;--sombra:0 1px 3px rgba(16,32,60,.10)}
:root[data-tema=escuro]{--fundo:#0A1121}
/* barra lateral clara */
.rail{background:var(--br);color:var(--tinta);border-right:1px solid var(--linha)}
.rail .logo{padding:.2rem .4rem .6rem}.rail .logo img.lg{width:172px;height:auto}
.nav a{color:var(--suave);border-radius:12px}
.nav a:hover{background:var(--inp);color:var(--tinta);transform:none}
.nav a.on{background:rgba(11,94,215,.10);color:var(--az);box-shadow:none}
.eu{background:var(--inp)}.eu small{color:var(--suave)}
.rail .sair{background:var(--inp);color:var(--tinta)}
.btn{border-radius:12px}
/* cartões e publicações */
.card{border-radius:14px;box-shadow:var(--sombra);border:0}
.post{border-radius:14px;padding:1rem 1.1rem .5rem}
.post .foto{margin:.2rem -1.1rem .5rem;border-radius:0}
.acoes{border-top:1px solid var(--linha);padding-top:.3rem}
.acoes button{background:none;flex:1;justify-content:center;border-radius:10px}
.acoes button.on{background:none}
.sub button{border-radius:10px}.sub button.on{background:var(--az);border-color:var(--az)}
.perfil{border-radius:16px}
/* logos */
.topm .logo img{width:auto;height:36px}
.logo-card{background:#fff;border-radius:18px;padding:.9rem 1.1rem;width:fit-content;box-shadow:0 20px 40px -20px rgba(0,0,0,.5)}
.logo-card img{width:min(240px,60vw);height:auto}
/* barra inferior (telemóvel) */
@media(max-width:860px){
 .tabs{left:0;right:0;bottom:0;border-radius:0;border:0;border-top:1px solid var(--linha);box-shadow:none;padding-bottom:calc(.3rem + env(safe-area-inset-bottom))}
 .tabs .mais{margin:0 auto;width:44px;height:44px;border-radius:12px;box-shadow:none}
 .col{padding-bottom:5.5rem}
}
/* visualizações dentro do estado */
.sv__sheet{position:absolute;left:0;right:0;bottom:0;max-height:62%;overflow-y:auto;background:var(--br);color:var(--tinta);border-radius:20px 20px 0 0;padding:1rem;z-index:8;animation:sobe .3s var(--ease)}
.sv__sheet .pess{padding:.4rem 0;margin:0}
/* logo legível no modo escuro */
:root[data-tema=escuro] .rail .logo img.lg,
:root[data-tema=escuro] .topm .logo img{background:#fff;border-radius:10px;padding:4px 10px}