:root{
  /* primitivas — verde âncora */
  --green-50:#ecfaef; --green-100:#d6f3de; --green-200:#ade4c0; --green-300:#7bd39a;
  --green-400:#45bd6f; --green-500:#22a854; --green-600:#0f7a38; --green-700:#0c6330;
  --green-800:#0a4f28; --green-900:#093a20; --green-950:#06281a;
  /* neutros viés verde */
  --n-0:#ffffff; --n-50:#f6f8f6; --n-100:#eef1ee; --n-200:#dfe4e0; --n-300:#c5cdc7;
  --n-400:#9aa59d; --n-500:#66716a; --n-600:#4d5750; --n-700:#3a423d; --n-800:#242b26;
  --n-900:#161c18; --n-950:#0c110d;
  /* roxo = fluxo de valor */
  --purple-100:#efe7fc; --purple-300:#b795ef; --purple-400:#a37ee8; --purple-500:#7c4fd8;
  --purple-600:#6a3ec6; --purple-900:#2a1a4e;
  /* charts (validadas) */
  --chart-1:#22a854; --chart-2:#7c4fd8; --chart-3:#00a5a5;
  /* assinatura: traço Cacique */
  --beam:linear-gradient(135deg,#45bd6f,#0e8f8f);
  /* tipografia */
  --font-sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-mono:ui-monospace,"SF Mono","Cascadia Mono","Roboto Mono",Menlo,monospace;
  /* espaço / raio / z / motion */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px; --sp-6:24px; --sp-8:32px;
  --r-xs:6px; --r-sm:8px; --r-md:12px; --r-lg:16px; --r-pill:999px;
  --z-sticky:10; --z-topbar:20; --z-dropdown:30; --z-overlay:40; --z-modal:50; --z-toast:60;
  --dur-fast:120ms; --dur:180ms; --ease:cubic-bezier(.2,.8,.3,1);
  /* sidebar — sempre escura, âncora de marca (idêntica nos 2 temas) */
  --side-bg:linear-gradient(180deg,#0a2e1b,#051f11);
  --side-text:#cfe4d5; --side-dim:#7fae8d; --side-active:rgba(69,189,111,.16);
}
:root[data-theme="light"]{
  --bg:#eef2ee; --surface-1:#ffffff; --surface-2:#f6f8f6; --surface-3:#eef1ee;
  --border-1:#dfe4e0; --border-2:#c5cdc7;
  --text-1:#151a17; --text-2:#4d5750; --text-3:#66716a;
  --brand:var(--green-600); --brand-hover:var(--green-700); --brand-fg-on:#ffffff;
  --brand-soft:var(--green-50); --focus-ring:#22a854;
  --st-ok-base:#22a854; --st-ok-fg:#147a3b;
  --st-warn-base:#d99a00; --st-warn-fg:#8f5d00;
  --st-err-base:#dc2430; --st-err-fg:#b91c27;
  --st-info-base:#0e8f8f; --st-info-fg:#0b6e6e;
  --st-mut-base:#8a958d; --st-mut-fg:#57625a;
  --purple-fg:var(--purple-600); --purple-soft:var(--purple-100);
  --pos:#147a3b; --neg:#b91c27;
  --shadow-sm:0 1px 2px rgba(8,40,20,.05);
  --shadow-md:0 1px 2px rgba(8,40,20,.06),0 4px 16px rgba(8,40,20,.06);
  --shadow-pop:0 4px 12px rgba(8,40,20,.10),0 12px 32px rgba(8,40,20,.12);
  --shadow-modal:0 12px 32px rgba(0,0,0,.18),0 32px 80px rgba(0,0,0,.28);
}
:root[data-theme="dark"]{
  --bg:#0b100c; --surface-1:#141b16; --surface-2:#1a231c; --surface-3:#212b23;
  --border-1:#29342b; --border-2:#35423a;
  --text-1:#e9f0ea; --text-2:#aab8ad; --text-3:#8a988e;
  --brand:var(--green-400); --brand-hover:var(--green-300); --brand-fg-on:#06281a;
  --brand-soft:color-mix(in srgb,var(--green-500) 16%,transparent); --focus-ring:#45bd6f;
  --st-ok-base:#22a854; --st-ok-fg:#4cc776;
  --st-warn-base:#d99a00; --st-warn-fg:#f0b13d;
  --st-err-base:#dc2430; --st-err-fg:#ff7078;
  --st-info-base:#0e8f8f; --st-info-fg:#3cc9c9;
  --st-mut-base:#8a958d; --st-mut-fg:#9faba2;
  --purple-fg:var(--purple-400); --purple-soft:color-mix(in srgb,var(--purple-500) 20%,transparent);
  --pos:#4cc776; --neg:#ff7078;
  --shadow-sm:0 1px 2px rgba(0,0,0,.35);
  --shadow-md:0 1px 2px rgba(0,0,0,.4),0 4px 16px rgba(0,0,0,.35);
  --shadow-pop:0 4px 12px rgba(0,0,0,.45),0 12px 32px rgba(0,0,0,.5);
  --shadow-modal:0 12px 32px rgba(0,0,0,.5),0 32px 80px rgba(0,0,0,.6);
}
*{box-sizing:border-box;margin:0;padding:0}
html{font-size:14px}
body{font-family:var(--font-sans);background:var(--bg);color:var(--text-1);
  line-height:1.57;transition:background var(--dur) var(--ease)}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:4px}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
.tnum{font-variant-numeric:tabular-nums}
.mono{font-family:var(--font-mono)}


*{box-sizing:border-box;margin:0;padding:0}
html{font-size:14px}
body{font-family:var(--font-sans);background:var(--bg);color:var(--text-1);min-height:100vh}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:4px}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
.tnum{font-variant-numeric:tabular-nums}

.login{display:grid;grid-template-columns:minmax(420px,52%) 1fr;min-height:100vh}

/* ===== painel de vitrine (slides / avisos / propaganda) ===== */
:root[data-theme="light"]{
  --sc-bg:linear-gradient(160deg,#edf7f0 0%,#e3f2e9 55%,#d8ede4 100%);
  --sc-text:#123d24; --sc-dim:#5c7f68; --sc-card:#ffffff; --sc-card-bd:#dbe8de;
  --sc-p:#477054;
}
:root[data-theme="dark"]{
  --sc-bg:linear-gradient(160deg,#14231a 0%,#101d15 60%,#0d1911 100%);
  --sc-text:#e9f0ea; --sc-dim:#8aa894; --sc-card:#1a2620; --sc-card-bd:#2b3a30;
  --sc-p:#a5bfab;
}
.showcase{background:var(--sc-bg);color:var(--sc-text);
  display:flex;flex-direction:column;padding:40px 48px;position:relative;overflow:hidden}
.showcase::before{content:"";position:absolute;top:-140px;left:-140px;width:420px;height:420px;border-radius:50%;
  background:radial-gradient(circle,rgba(34,168,84,.10),transparent 65%);pointer-events:none}
.showcase::after{content:"";position:absolute;inset:auto -160px -200px auto;width:520px;height:520px;
  border-radius:50%;background:radial-gradient(circle,rgba(14,143,143,.10),transparent 65%);pointer-events:none}
.sc-brand{display:flex;align-items:center;gap:12px;position:relative}
.sc-mark{width:44px;height:40px;border-radius:10px;background:#fff;display:grid;place-items:center;padding:4px;
  box-shadow:0 1px 3px rgba(8,40,20,.10),inset 0 0 0 1px rgba(6,40,26,.06)}
.sc-mark img{width:100%;height:100%;object-fit:contain;display:block}
.sc-brand b{font-size:19px;color:var(--sc-text);letter-spacing:-.01em;display:block;line-height:1.15}
.sc-brand small{font-size:11px;color:var(--sc-dim);text-transform:uppercase;letter-spacing:.1em}
.sc-tag{margin-top:34px;font-size:12px;font-weight:700;color:var(--sc-dim);text-transform:uppercase;letter-spacing:.08em;position:relative}
.sc-title{font-size:26px;font-weight:700;color:var(--sc-text);letter-spacing:-.02em;line-height:1.25;max-width:440px;margin-top:8px;position:relative}

/* hero ilustração */
.sc-hero{flex:1;display:grid;place-items:center;padding:22px 0 0;position:relative;min-height:0}
.sc-hero svg{width:min(100%,470px);height:auto;display:block}
@media(max-height:760px){.sc-hero{display:none}}
/* slides */
.slides{margin-top:auto;padding-top:36px;position:relative}
.slide{display:none;background:var(--sc-card);border:1px solid var(--sc-card-bd);
  border-radius:16px;padding:20px 22px;box-shadow:0 2px 8px rgba(8,40,20,.06),0 12px 32px rgba(8,40,20,.06)}
.slide.on{display:flex;gap:20px;align-items:center;animation:fadein .5s ease}
@keyframes fadein{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.slide.on{animation:none}}
.slide .s-body{flex:1;min-width:0}
.slide .s-art{flex-shrink:0;width:108px;height:96px;border-radius:12px;display:grid;place-items:center;
  background:linear-gradient(150deg,rgba(34,168,84,.10),rgba(14,143,143,.10))}
.slide .s-art img,.slide .s-art svg{max-width:84px;max-height:74px}
.slide .s-kind{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:.07em;padding:3px 10px;border-radius:999px;margin-bottom:10px}
.s-kind.aviso{background:color-mix(in srgb,#d99a00 14%,transparent);color:#8f5d00}
.s-kind.novidade{background:color-mix(in srgb,#22a854 14%,transparent);color:#147a3b}
.s-kind.parceiro{background:color-mix(in srgb,#7c4fd8 12%,transparent);color:#6a3ec6}
:root[data-theme="dark"] .s-kind.aviso{color:#f0b13d}
:root[data-theme="dark"] .s-kind.novidade{color:#4cc776}
:root[data-theme="dark"] .s-kind.parceiro{color:#c9aef5}
.slide h3{font-size:15.5px;font-weight:600;color:var(--sc-text);letter-spacing:-.01em}
.slide p{font-size:12.5px;color:var(--sc-p);margin-top:5px;line-height:1.55}
.slide .s-link{display:inline-block;margin-top:10px;font-size:12px;font-weight:600;color:#0f7a38;text-decoration:none}
.slide .s-link:hover{color:#0c6330}
:root[data-theme="dark"] .slide .s-link{color:#45bd6f}
.dots{display:flex;align-items:center;gap:8px;margin-top:16px;margin-bottom:4px;position:relative}
.dot-b{width:8px;height:8px;border-radius:50%;background:color-mix(in srgb,var(--sc-dim) 40%,transparent);padding:0;transition:all .25s}
.dot-b.on{width:22px;border-radius:999px;background:linear-gradient(90deg,#22a854,#0e8f8f)}

/* ===== lado do formulário ===== */
.pane{display:grid;place-items:center;padding:40px 24px;position:relative}
.theme-btn{position:absolute;top:20px;right:24px;width:34px;height:34px;border-radius:8px;
  display:grid;place-items:center;color:var(--text-2);border:1px solid var(--border-1);background:var(--surface-1)}
.theme-btn:hover{color:var(--text-1);background:var(--surface-2)}
.box{width:100%;max-width:400px}
.box h1{font-size:22px;font-weight:700;letter-spacing:-.02em}
.box .sub{font-size:13px;color:var(--text-3);margin-top:4px}
.card{background:var(--surface-1);border:1px solid var(--border-1);border-radius:16px;
  box-shadow:var(--shadow-md);padding:26px;margin-top:22px}
.fld{margin-bottom:16px}
.fld label{display:block;font-size:12px;font-weight:600;color:var(--text-2);margin-bottom:6px}
.fld .wrap{position:relative}
.fld input{width:100%;font:inherit;font-size:13.5px;padding:10px 12px;height:42px;
  border:1px solid var(--border-2);border-radius:8px;background:var(--surface-1);color:var(--text-1)}
.fld input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 18%,transparent)}
.fld.err input{border-color:var(--st-err-base);box-shadow:0 0 0 3px color-mix(in srgb,var(--st-err-base) 14%,transparent)}
.fld .emsg{display:none;font-size:11.5px;color:var(--st-err-fg);margin-top:5px}
.fld.err .emsg{display:block}
.eye{position:absolute;right:6px;top:5px;width:32px;height:32px;border-radius:6px;display:grid;
  place-items:center;color:var(--text-3)}
.eye:hover{color:var(--text-1);background:var(--surface-2)}
.row{display:flex;align-items:center;justify-content:space-between;margin:2px 0 18px}
.row label{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--text-2);cursor:pointer}
.row input{width:15px;height:15px;accent-color:var(--brand)}
.row a{font-size:12.5px;font-weight:600;color:var(--brand);text-decoration:none}
.row a:hover{color:var(--brand-hover)}
.go{width:100%;height:44px;border-radius:8px;background:var(--brand);color:var(--brand-fg-on);
  font-size:14px;font-weight:700;display:grid;place-items:center;transition:background var(--dur,180ms)}
.go:hover{background:var(--brand-hover)}
.go.loading{opacity:.75;pointer-events:none}
.note{display:flex;gap:9px;align-items:flex-start;font-size:11.5px;color:var(--text-3);
  margin-top:18px;line-height:1.5}
.note svg{flex-shrink:0;margin-top:1px;color:var(--text-3)}
.pane-foot{position:absolute;left:0;right:0;bottom:18px;display:flex;flex-wrap:wrap;
  justify-content:center;align-items:center;gap:6px 14px;font-size:11.5px;color:var(--text-3);padding:0 24px;text-align:center}
.pane-foot .env{display:inline-flex;align-items:center;gap:6px;font-weight:700;
  color:var(--st-ok-fg)}
.pane-foot .env i{width:7px;height:7px;border-radius:50%;background:var(--st-ok-base);font-style:normal}

/* ===== modal esqueci a senha ===== */
.overlay{position:fixed;inset:0;background:rgba(8,26,15,.45);backdrop-filter:blur(3px);
  z-index:50;display:none;place-items:center;padding:20px}
.overlay.open{display:grid}
.modal{background:var(--surface-1);border:1px solid var(--border-1);border-radius:16px;
  box-shadow:var(--shadow-modal);width:100%;max-width:440px;animation:pop .25s ease}
@keyframes pop{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.modal{animation:none}}
.modal-h{display:flex;align-items:center;gap:12px;padding:18px 22px;border-bottom:1px solid var(--border-1)}
.modal-h h3{font-size:16px;font-weight:700;letter-spacing:-.01em;flex:1}
.x{width:32px;height:32px;border-radius:8px;display:grid;place-items:center;color:var(--text-3)}
.x:hover{background:var(--surface-2);color:var(--text-1)}
.modal-b{padding:22px}
.modal-b .lead{font-size:13px;color:var(--text-2);line-height:1.55;margin-bottom:16px}
.modal-f{display:flex;justify-content:flex-end;gap:8px;padding:16px 22px;border-top:1px solid var(--border-1)}
.btn-ghost{font-size:13px;font-weight:600;color:var(--text-2);border:1px solid var(--border-2);
  border-radius:8px;padding:9px 16px}
.btn-ghost:hover{color:var(--text-1);background:var(--surface-2)}
.btn-primary{font-size:13px;font-weight:700;color:var(--brand-fg-on);background:var(--brand);
  border-radius:8px;padding:9px 18px}
.btn-primary:hover{background:var(--brand-hover)}
.btn-primary[disabled]{opacity:.6;cursor:not-allowed}
.sent{display:none;text-align:center;padding:8px 0 4px}
.sent .disc{width:56px;height:56px;border-radius:50%;margin:0 auto 14px;display:grid;place-items:center;
  background:color-mix(in srgb,var(--st-ok-base) 12%,transparent);color:var(--st-ok-fg)}
.sent h4{font-size:15px;font-weight:700}
.sent p{font-size:12.5px;color:var(--text-3);line-height:1.55;margin-top:6px}
.sent .again{margin-top:14px;font-size:12.5px;color:var(--text-3)}
.sent .again button{color:var(--brand);font-weight:600}
.sent .again button[disabled]{color:var(--text-3);font-weight:400;cursor:default}
.sec-note{display:flex;gap:8px;align-items:flex-start;font-size:11.5px;color:var(--text-3);
  margin-top:14px;line-height:1.5}

@media(max-width:900px){
  .login{grid-template-columns:1fr}
  .showcase{min-height:0;padding:26px 24px}
  .sc-tag,.sc-title{display:none}
  .slides{margin-top:20px;padding-top:0}
}

/* banner de erro do servidor (anti-enum: mensagem genérica única) */
.login-alert{background:color-mix(in srgb,var(--st-err-base) 12%,transparent);
  border:1px solid color-mix(in srgb,var(--st-err-base) 40%,transparent);
  color:var(--st-err-fg);border-radius:var(--r-sm,8px);padding:10px 12px;
  font-size:12.5px;font-weight:600;margin-bottom:16px}