/* ===== marca ===== */
.marca{display:inline-flex;align-items:center;gap:.55rem;text-decoration:none;font-stretch:125%;font-weight:800;font-size:1.2rem;letter-spacing:-.02em;color:var(--tinta)}
.marca svg{width:1.9rem;height:1.9rem;flex:none}
.marca b{font-weight:800}
.marca span{font-weight:500}

/* ===== botões ===== */
.btn{--bg:transparent;--fg:var(--tinta);--bd:var(--tinta);display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:2.9rem;min-width:2.9rem;padding:.6rem 1.15rem;
  border:2px solid var(--bd);border-radius:var(--r-m);background:var(--bg);color:var(--fg);font-weight:650;font-stretch:104%;font-size:var(--t-s);line-height:1.2;text-decoration:none;
  transition:transform var(--d-rapido) var(--ease),background-color var(--d-rapido),box-shadow var(--d-rapido);cursor:pointer;text-align:center}
.btn:hover{transform:translateY(-1px);box-shadow:0 4px 0 -1px var(--anel),0 6px 14px -8px rgb(15 29 38 / .4);text-decoration:none}
.btn:active{transform:translateY(1px);box-shadow:none}
.btn--primario{--bg:var(--acao);--fg:var(--acao-texto);--bd:var(--acao)}
.btn--janela{--bg:var(--janela);--fg:#fff;--bd:var(--janela)}
:root[data-tema="escuro"] .btn--janela{--fg:#06231e}
@media (prefers-color-scheme:dark){:root:not([data-tema="claro"]) .btn--janela{--fg:#06231e}}
.btn--fantasma{--bd:transparent;--bg:transparent}
.btn--fantasma:hover{--bg:var(--folha-2)}
.btn--perigo{--fg:var(--vencido-texto);--bd:var(--vencido)}
.btn--perigo-cheio{--bg:var(--vencido);--fg:#fff;--bd:var(--vencido)}
.btn--p{min-height:2.75rem;padding:.4rem .85rem;font-size:var(--t-xs)}
.btn--bloco{width:100%}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
.btn svg{width:1.15em;height:1.15em;flex:none}

/* ===== folha (superfície) ===== */
.folha{background:var(--folha);border:1px solid var(--linha);border-radius:var(--r-g);box-shadow:var(--sombra);padding:var(--e5)}
.folha--plana{box-shadow:none}
.folha--cotas{position:relative}
.folha--cotas::before,.folha--cotas::after{content:"";position:absolute;width:.9rem;height:.9rem;border:2px solid var(--tinta);pointer-events:none}
.folha--cotas::before{left:-.45rem;top:-.45rem;border-right:0;border-bottom:0}
.folha--cotas::after{right:-.45rem;bottom:-.45rem;border-left:0;border-top:0}

/* ===== selos de estado: ícone + texto + cor ===== */
.selo{display:inline-flex;align-items:center;gap:.35rem;padding:.2rem .6rem .2rem .45rem;border-radius:99px;font-size:var(--t-xs);font-weight:650;font-stretch:96%;line-height:1.3;border:1.5px solid currentColor;background:var(--folha);white-space:nowrap}
.selo svg{width:1rem;height:1rem;flex:none}
.selo--ok{color:var(--ok)}
.selo--atencao{color:var(--atencao-texto);background:var(--atencao-fundo);border-color:var(--atencao)}
.selo--vencido{color:var(--vencido-texto);background:var(--vencido-fundo);border-color:var(--vencido)}
.selo--janela{color:var(--janela-texto);background:var(--janela-fundo);border-color:var(--janela)}
.selo--neutro{color:var(--tinta-2);border-color:var(--linha-forte)}
.selo--anexado{color:var(--ok);border-style:dashed}

/* ===== formulários ===== */
.campo{display:grid;gap:.4rem}
.campo>label,.campo>.campo__rotulo,legend{font-weight:650;font-size:var(--t-s);font-stretch:100%}
.campo__ajuda{font-size:var(--t-xs);color:var(--tinta-2);max-width:60ch}
.campo__erro{font-size:var(--t-s);color:var(--vencido-texto);font-weight:600;display:flex;gap:.4rem;align-items:flex-start}
input[type=text],input[type=password],input[type=date],input[type=number],input[type=email],select{width:100%;min-height:2.9rem;padding:.55rem .8rem;background:var(--folha);border:2px solid var(--linha-forte);border-radius:var(--r-m);color:var(--tinta);font-size:1rem}
input[type=date],input[type=number],.mono{font-family:var(--f-dados);font-variant-numeric:tabular-nums}
input:hover,select:hover{border-color:var(--tinta-2)}
input[aria-invalid=true]{border-color:var(--vencido)}
fieldset{border:0;padding:0;margin:0;min-width:0;display:grid;gap:.6rem}
.opcoes{display:grid;gap:.6rem}
.opcao{display:flex;gap:.75rem;align-items:flex-start;padding:.8rem .9rem;background:var(--folha);border:2px solid var(--linha);border-radius:var(--r-m);cursor:pointer;min-height:3rem}
.opcao:hover{border-color:var(--linha-forte)}
.opcao:has(input:checked){border-color:var(--tinta);box-shadow:inset 0 0 0 1px var(--tinta)}
.opcao:has(input:focus-visible){outline:3px solid var(--foco);outline-offset:2px}
.opcao input{margin-top:.25rem;width:1.2rem;height:1.2rem;accent-color:var(--tinta);flex:none}
.opcao strong{display:block;font-weight:650}
.opcao small{display:block;color:var(--tinta-2);font-size:var(--t-xs);line-height:1.45}
.por-que{font-size:var(--t-s);color:var(--tinta-2);padding:.7rem .9rem;border-left:4px solid var(--janela);background:var(--folha-2);border-radius:0 var(--r-m) var(--r-m) 0;max-width:62ch}
.por-que b{color:var(--tinta);font-stretch:80%;text-transform:uppercase;letter-spacing:.1em;font-size:var(--t-xs);display:block;margin-bottom:.15rem}

/* ===== avisos ===== */
.aviso{display:flex;gap:.75rem;align-items:flex-start;padding:.85rem 1rem;border-radius:var(--r-m);border:1.5px solid var(--linha-forte);background:var(--folha);font-size:var(--t-s)}
.aviso>svg{width:1.3rem;height:1.3rem;flex:none;margin-top:.1rem}
.aviso>div>*+*{margin-top:.35rem}
.aviso--atencao{border-color:var(--atencao);background:var(--atencao-fundo);color:var(--tinta)}
.aviso--atencao>svg{color:var(--atencao-texto)}
.aviso--vencido{border-color:var(--vencido);background:var(--vencido-fundo)}
.aviso--vencido>svg{color:var(--vencido-texto)}
.aviso--janela{border-color:var(--janela);background:var(--janela-fundo)}
.aviso--janela>svg{color:var(--janela-texto)}
.aviso strong{font-weight:700}

/* ===== tabelas ===== */
.tabela{font-size:var(--t-s)}
.tabela th,.tabela td{padding:.6rem .7rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--linha)}
.tabela th{font-stretch:80%;text-transform:uppercase;letter-spacing:.08em;font-size:var(--t-xs);color:var(--tinta-3);font-weight:700;border-bottom:2px solid var(--tinta)}
.tabela td.dados,.tabela th.dados{white-space:nowrap}

/* ===== diálogo e toasts ===== */
dialog{border:2px solid var(--tinta);border-radius:var(--r-g);background:var(--folha);color:var(--tinta);padding:var(--e5);width:min(100% - 2rem,34rem);box-shadow:0 30px 80px -20px rgb(0 0 0 / .5)}
dialog::backdrop{background:rgb(8 18 24 / .6)}
dialog h2{font-size:var(--t-l);font-stretch:105%;margin-bottom:var(--e3)}
.dialogo__acoes{display:flex;gap:var(--e3);flex-wrap:wrap;margin-top:var(--e5);justify-content:flex-end}
.toasts{position:fixed;left:50%;bottom:calc(5.2rem + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:60;display:grid;gap:.5rem;width:min(100% - 2rem,26rem);pointer-events:none}
.toast{background:var(--tinta);color:var(--papel);padding:.75rem 1rem;border-radius:var(--r-m);font-weight:600;font-size:var(--t-s);display:flex;gap:.6rem;align-items:center;box-shadow:var(--sombra);animation:toast-entra var(--d-normal) var(--ease)}
.toast svg{width:1.2rem;height:1.2rem;flex:none}
@keyframes toast-entra{from{opacity:0;transform:translateY(10px)}}

/* ===== carregando ===== */
.esqueleto{background:linear-gradient(90deg,var(--folha-2) 0%,var(--folha) 50%,var(--folha-2) 100%);background-size:220% 100%;border-radius:var(--r-m);animation:esq 1.4s linear infinite}
@keyframes esq{to{background-position:-220% 0}}

/* ===== estado vazio / erro ===== */
.estado{display:grid;justify-items:start;gap:var(--e3);padding:var(--e6) var(--e5);background:var(--folha);border:2px dashed var(--linha-forte);border-radius:var(--r-g)}
.estado__alvo{width:4.5rem;height:4.5rem;color:var(--tinta)}
.estado h2,.estado h3{font-size:var(--t-l)}
.estado__acoes{display:flex;flex-wrap:wrap;gap:var(--e3);margin-top:var(--e2)}

/* ===== cabeçalho e rodapé públicos ===== */
.topo{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--papel) 88%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--linha)}
.topo__fila{display:flex;align-items:center;justify-content:space-between;gap:var(--e3);min-height:3.8rem}
.topo nav{display:flex;align-items:center;gap:var(--e1)}
.topo nav a:not(.btn){padding:.6rem .7rem;font-weight:600;font-size:var(--t-s);text-decoration:none;border-radius:var(--r-s)}
.topo nav a:not(.btn):hover{background:var(--folha-2)}
.topo nav a[aria-current=page]{text-decoration:underline;text-decoration-thickness:.18em;text-underline-offset:.35em}
.nav-longa{display:none!important}
@media (min-width:52rem){.nav-longa{display:inline-flex!important}}
.tema-btn{width:2.75rem;height:2.75rem;display:inline-grid;place-items:center;border:0;background:transparent;border-radius:99px}
.tema-btn:hover{background:var(--folha-2)}
.tema-btn svg{width:1.3rem;height:1.3rem}
.rodape{margin-top:var(--e9);border-top:2px solid var(--tinta);background:var(--folha);padding:var(--e7) 0 var(--e8)}
.rodape__grade{display:grid;gap:var(--e6)}
@media (min-width:52rem){.rodape__grade{grid-template-columns:1.4fr 1fr 1fr}}
.rodape ul{list-style:none;padding:0;display:grid;gap:.1rem}
.rodape li a{display:inline-block;padding:.5rem 0;min-height:2.75rem;text-decoration:none}
.rodape li a:hover{text-decoration:underline}
.aviso-legal{font-size:var(--t-xs);color:var(--tinta-2);max-width:62ch;line-height:1.55}
.aviso-legal strong{color:var(--tinta)}
.migalhas{font-size:var(--t-xs);color:var(--tinta-3);padding-block:var(--e4)}
.migalhas ol{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.2rem .5rem}
.migalhas li+li::before{content:"/";margin-right:.5rem;color:var(--linha-forte)}
.migalhas a{display:inline-block;padding:.5rem 0}

.obs summary::before,.esqueci summary::before,.folha>summary::before,details.folha>summary::before{content:"+";font-family:var(--f-dados);font-weight:600;display:inline-grid;place-items:center;width:1.4rem;height:1.4rem;margin-right:.55rem;border:1.5px solid currentColor;border-radius:50%;flex:none;line-height:1}
details[open]>summary::before{content:"−"}
.tabela tbody th{text-transform:none;letter-spacing:0;font-size:inherit;color:inherit;font-stretch:100%;font-weight:600;border-bottom:1px solid var(--linha)}
.nav-entrar{display:none}
@media (min-width:30rem){.nav-entrar{display:inline-flex}}
