/* ============================================================================
   LINHA · base: reset, letra e o comportamento que o JS espera
   ============================================================================ */
*, *::before, *::after{ box-sizing:border-box }

html{ -webkit-text-size-adjust:100%; text-size-adjust:100% }
html, body{ margin:0; padding:0 }
body{
  min-height:100vh; min-height:100dvh;
  background:var(--l-fundo);
  color:var(--l-texto);
  font-family:var(--l-fonte);
  font-size:var(--l-t-corpo);
  line-height:1.5;
  font-feature-settings:"cv11","ss01";
  font-variant-numeric:tabular-nums;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

h1, h2, h3, h4, h5, h6{ margin:0; font-weight:600; line-height:1.3; letter-spacing:-.01em; color:var(--l-texto) }
h1{ font-size:var(--l-t-tela) }
h2{ font-size:var(--l-t-titulo) }
h3{ font-size:var(--l-t-med) }
h4, h5, h6{ font-size:var(--l-t-corpo) }
p{ margin:0 }
small{ font-size:var(--l-t-peq) }
b, strong{ font-weight:600 }
a{ color:var(--l-marca-tinta); text-decoration:none }
a:hover{ text-decoration:underline; text-underline-offset:2px }
img, svg, video, canvas{ max-width:100%; vertical-align:middle }
img{ height:auto }
hr{ border:0; border-top:1px solid var(--l-fio); margin:var(--l-e4) 0 }
code, kbd, pre{ font-family:var(--l-mono); font-size:.92em }
button, input, select, textarea{ font:inherit; color:inherit; letter-spacing:inherit }
button{ cursor:pointer }
[disabled]{ cursor:not-allowed }
table{ border-collapse:collapse }
fieldset{ border:0; margin:0; padding:0; min-width:0 }
legend{ padding:0 }
::selection{ background:var(--l-marca-clara); color:var(--l-texto) }

/* ícones lucide: tamanho único, acompanham o texto */
i[data-lucide], svg.lucide{ width:18px; height:18px; flex:none; stroke-width:1.75 }

/* foco visível e igual em tudo */
:focus{ outline:none }
:focus-visible{ outline:2px solid var(--l-foco); outline-offset:2px; border-radius:var(--l-raio-1) }

/* rolagem discreta */
*{ scrollbar-width:thin; scrollbar-color:var(--l-borda-forte) transparent }
::-webkit-scrollbar{ width:10px; height:10px }
::-webkit-scrollbar-thumb{ background:var(--l-borda-forte); border-radius:10px; border:3px solid transparent; background-clip:padding-box }
::-webkit-scrollbar-track{ background:transparent }

/* ---------------------------------------------------------------- comportamento */
.hidden, [hidden]{ display:none !important }
.cl-hide, .panel-oculto, .reg-hidden{ display:none !important }
.sr-only, .visually-hidden{
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.skip-link{
  position:fixed; left:var(--l-e4); top:-60px; z-index:10000;
  background:var(--l-marca); color:var(--l-sobre-marca); padding:10px 16px; border-radius:var(--l-raio-2);
  transition:top var(--l-rapido);
}
.skip-link:focus{ top:var(--l-e4) }

/* telas: uma por vez */
.view-section{ display:none; width:100%; min-height:100vh; min-height:100dvh }
.view-section.active{ display:block }
.view-section.active.is-entering{ animation:l-entra var(--l-medio) var(--l-curva) }
#view-login.view-section.active{ display:flex }
@keyframes l-entra{ from{ opacity:0; transform:translateY(4px) } to{ opacity:1; transform:none } }

/* enquanto a sessão é conferida: tela limpa com um ponto que pulsa */
html.auth-pending body::before{
  content:""; position:fixed; inset:0; z-index:9999; background:var(--l-fundo);
}
html.auth-pending body::after{
  content:""; position:fixed; left:50%; top:50%; z-index:10000; width:10px; height:10px; margin:-5px 0 0 -5px;
  border-radius:50%; background:var(--l-marca); animation:l-pulsa 1s ease-in-out infinite;
}
/* a primeira tela ativa encerra a espera (o JS não tira a classe) */
body:has(.view-section.active)::before, body:has(.view-section.active)::after{ display:none }
@keyframes l-pulsa{ 0%,100%{ opacity:.25; transform:scale(.8) } 50%{ opacity:1; transform:scale(1.2) } }

body.reg-modal-open, body.modal-open{ overflow:hidden }

/* troca de tema sem piscar transições */
body.theme-switching *{ transition:none !important }

@media (prefers-reduced-motion:reduce){
  *, *::before, *::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important }
}

@media print{
  body{ background:#fff }
}