/* Shell da aplicação: topbar, login, estados. Só aliases de tokens.css. */
*,*::before,*::after{box-sizing:border-box;}
html{font-family:var(--font-core);font-size:var(--fs-md);}
body{margin:0;background:var(--surface-canvas);color:var(--text-body);min-height:100vh;}
[hidden]{display:none !important;}

.topbar{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:var(--space-7);height:62px;padding:0 var(--space-9);background:var(--surface-topbar);border-bottom:1px solid var(--border-default);}
.marca{display:flex;align-items:center;gap:var(--space-5);min-width:0;}
.logo-img{height:30px;width:auto;display:block;}
.logo-escuro{display:none;}
:root[data-theme="dark"] .logo-claro{display:none;}
:root[data-theme="dark"] .logo-escuro{display:block;}
.marca-texto{display:flex;flex-direction:column;gap:2px;min-width:0;}
.marca-texto::before{content:"";width:22px;height:2px;background:var(--brand-gradient);border-radius:2px;}
.marca-texto b{font-size:var(--fs-sm);font-weight:700;color:var(--text-on-brand);text-transform:uppercase;letter-spacing:.06em;white-space:nowrap;}
.topbar .marca-texto b{color:var(--text-on-brand);}
.usuario{display:flex;align-items:center;gap:var(--space-4);justify-self:end;grid-column:3;}
.avatar{width:34px;height:34px;border-radius:50%;background:var(--brand-gradient);color:var(--text-on-brand);display:grid;place-items:center;font-size:var(--fs-sm);font-weight:700;}
.usuario-info{display:flex;flex-direction:column;line-height:1.25;min-width:0;}
.usuario-info b{font-size:var(--fs-sm);font-weight:600;color:var(--text-on-brand);max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.usuario-info small{font-size:var(--fs-xs);color:var(--text-on-brand);opacity:.8;}
.btn-topo{display:inline-flex;align-items:center;gap:var(--space-3);padding:6px 12px;border:1px solid color-mix(in srgb,var(--text-on-brand) 40%,transparent);border-radius:var(--radius-md);background:transparent;color:var(--text-on-brand);font:inherit;font-size:var(--fs-sm);font-weight:600;cursor:pointer;}
.btn-topo:hover{background:color-mix(in srgb,var(--text-on-brand) 14%,transparent);}
.btn-topo:focus-visible{outline:2px solid var(--text-on-brand);outline-offset:2px;}

main{max-width:1280px;margin:0 auto;padding:var(--space-9);}
.cab-pagina{margin-bottom:var(--space-8);}
.eyebrow{font-size:var(--fs-2xs);font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);}
.cab-pagina h1{margin:var(--space-1) 0;font-size:var(--fs-2xl);font-weight:700;letter-spacing:-.01em;color:var(--text-strong);}
.cab-pagina p{margin:0;font-size:var(--fs-sm);color:var(--text-muted);}

.palco{display:grid;place-items:center;min-height:calc(100vh - 62px);padding:var(--space-9);background-color:var(--surface-canvas);background-image:var(--stage-glow);}
.cartao-centro{width:min(440px,100%);background:var(--surface-card);border:1px solid var(--border-default);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);padding:var(--space-10);text-align:center;display:flex;flex-direction:column;gap:var(--space-7);align-items:center;}
.cartao-centro .logo-img{height:44px;}
.cartao-centro h1{margin:0;font-size:var(--fs-xl);font-weight:700;color:var(--text-strong);}
.cartao-centro p{margin:0;color:var(--text-muted);font-size:var(--fs-md);}
.btn-primario{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-4);min-height:44px;padding:0 var(--space-9);border:1px solid var(--action-primary);border-radius:var(--radius-md);background:var(--action-primary);color:var(--text-on-brand);font:inherit;font-size:var(--fs-md);font-weight:600;cursor:pointer;}
.btn-primario:hover{background:var(--action-primary-hover);}
.btn-primario:focus-visible{outline:2px solid var(--action-accent);outline-offset:2px;}
.btn-primario[disabled]{opacity:.55;cursor:progress;}
.btn-sec{min-height:44px;padding:0 var(--space-9);border:1px solid var(--border-strong);border-radius:var(--radius-md);background:transparent;color:var(--text-body);font:inherit;font-size:var(--fs-md);font-weight:600;cursor:pointer;}
.btn-sec:hover{border-color:var(--action-accent);color:var(--action-accent);}
.btn-sec:focus-visible{outline:2px solid var(--action-accent);outline-offset:2px;}
.msg-erro{color:var(--status-negative);font-weight:600;font-size:var(--fs-md);}
.carregando{display:flex;align-items:center;justify-content:center;gap:var(--space-4);padding:var(--space-10);color:var(--text-muted);}
.giro{width:16px;height:16px;border:2px solid var(--border-strong);border-top-color:var(--action-accent);border-radius:50%;animation:giro 800ms linear infinite;}
@keyframes giro{to{transform:rotate(360deg);}}
@media (max-width:760px){.topbar{grid-template-columns:1fr;height:auto;padding:var(--space-4) var(--space-7);row-gap:var(--space-3);} .usuario{grid-column:1;justify-self:start;flex-wrap:wrap;} .usuario-info{display:none;} .marca-texto{display:none;} main{padding:var(--space-7);}}
@media (prefers-reduced-motion:reduce){.giro{animation:none;}}