/* ═══════════════════════════════════════════════════════════════════════════
   CONEXIS ERP — Manual de Identidade Visual v1.0 §8.3 (sistema/dashboard)
   Sidebar #072536 · item ativo com barra amarela de 3px · topbar branca com
   borda inferior · cartões brancos raio 3px SEM sombra · 80/15/5 ·
   nenhum hex fora das 11 cores oficiais. Tema escuro em #072536 e #0D3B54,
   que são as cores oficiais de fundo escuro do manual.
   ═══════════════════════════════════════════════════════════════════════════ */
:root{
  --petroleo:#0D3B54; --profundo:#072536; --amarelo:#F2C50F; --ambar:#B8880A;
  --branco:#FFFFFF; --cinza:#F4F6F7; --borda-of:#E2E8EC;
  --tx:#3D5468; --tx2:#62798A; --ok:#1E7A5F; --al:#C0392B;

  --ground:var(--cinza); --card:var(--branco); --card2:var(--cinza);
  --linha:var(--borda-of); --corpo:var(--tx); --apoio:var(--tx2);
  --titulo:var(--petroleo); --top:var(--branco);
  --thead:var(--petroleo); --thead-tx:var(--branco);
  --v-ok:var(--ok); --v-al:var(--al); --v-at:var(--ambar);
  --sel:rgba(242,197,15,.15); --hov:rgba(13,59,84,.045);
  --sombra-drawer:rgba(7,37,54,.42);

  --f-t:'Archivo',system-ui,sans-serif;
  --f-x:'IBM Plex Sans',system-ui,sans-serif;
  --f-m:'IBM Plex Mono',ui-monospace,monospace;
  --r:3px;
  --lin-h:38px;            /* altura de linha de grade — densidade média */
  --nav-w:238px;
}
:root[data-densidade="compacta"]{ --lin-h:30px }
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ground:#061E2C; --card:#0D3B54; --card2:#072536; --linha:#1D4E68;
    --corpo:#E2E8EC; --apoio:#9DB2C0; --titulo:var(--branco); --top:#072536;
    --thead:#072536; --thead-tx:var(--amarelo);
    --v-ok:#4FBF9B; --v-al:#E8837A; --v-at:var(--amarelo);
    --sel:rgba(242,197,15,.17); --hov:rgba(255,255,255,.05);
    --sombra-drawer:rgba(0,0,0,.6);
  }
}
:root[data-theme="dark"]{
  --ground:#061E2C; --card:#0D3B54; --card2:#072536; --linha:#1D4E68;
  --corpo:#E2E8EC; --apoio:#9DB2C0; --titulo:var(--branco); --top:#072536;
  --thead:#072536; --thead-tx:var(--amarelo);
  --v-ok:#4FBF9B; --v-al:#E8837A; --v-at:var(--amarelo);
  --sel:rgba(242,197,15,.17); --hov:rgba(255,255,255,.05);
  --sombra-drawer:rgba(0,0,0,.6);
}

*,*::before,*::after{box-sizing:border-box}
html,body{height:100%}
body{margin:0; background:var(--ground); color:var(--corpo);
     font-family:var(--f-x); font-size:14px; line-height:1.5;
     -webkit-font-smoothing:antialiased; overflow:hidden}
h1,h2{font-family:var(--f-t); letter-spacing:-.02em; margin:0; color:var(--titulo)}
h2{font-weight:700; font-size:22px; line-height:1.16}
h3{font-family:var(--f-x); font-weight:600; font-size:15px; line-height:1.4; margin:0; color:var(--titulo)}
h4{font-family:var(--f-m); font-weight:600; font-size:10.5px; letter-spacing:.18em;
   text-transform:uppercase; color:var(--apoio); margin:0}
p{margin:0}
strong{font-weight:600; color:var(--titulo)}
code{font-family:var(--f-m); font-size:.87em; background:var(--card2);
     border:1px solid var(--linha); border-radius:var(--r); padding:0 4px}
.num{font-family:var(--f-m); font-variant-numeric:tabular-nums}
.kicker{font-family:var(--f-m); font-size:10px; letter-spacing:.2em;
        text-transform:uppercase; color:var(--apoio)}
.regua{height:4px; width:48px; background:var(--amarelo); border:0; margin:0}
.mut{color:var(--apoio); font-size:12px; line-height:1.45}
.nowrap{white-space:nowrap}
.mono{font-family:var(--f-m); font-size:.9em; letter-spacing:-.01em}
table.gr--form td{padding:9px 12px; vertical-align:top}
table.gr--form tbody tr:nth-child(even){background:transparent}
table.gr--form tbody tr{border-bottom:1px solid var(--linha)}
table.gr--form .mut{margin-top:2px; display:block}

/* ── Esqueleto ─────────────────────────────────────────────────────────── */
.app{display:grid; grid-template-columns:var(--nav-w) 1fr; height:100vh; overflow:hidden}
.app[data-rail="1"]{ --nav-w:58px }

.sidebar{background:var(--profundo); display:flex; flex-direction:column;
         height:100vh; overflow:hidden}
.sb-topo{display:flex; align-items:center; gap:8px; padding:16px 14px 12px; flex:0 0 auto}
.sb-topo img{width:132px; height:auto}
.app[data-rail="1"] .sb-topo img{display:none}
.sb-rail{background:none; border:1px solid rgba(255,255,255,.16); color:rgba(255,255,255,.7);
         width:28px; height:28px; border-radius:var(--r); cursor:pointer; flex:0 0 auto;
         margin-left:auto; font-family:var(--f-m); font-size:13px; line-height:1}
.app[data-rail="1"] .sb-rail{margin:0 auto}
.nav{flex:1; overflow-y:auto; padding-bottom:12px}
.nav::-webkit-scrollbar{width:6px} .nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14)}
.nav__grupo{font-family:var(--f-m); font-size:9.5px; letter-spacing:.2em; text-transform:uppercase;
            color:rgba(255,255,255,.36); padding:13px 16px 5px}
.app[data-rail="1"] .nav__grupo{padding:10px 0 4px; text-align:center; font-size:8px; letter-spacing:.05em}
.nav__item{display:flex; align-items:center; gap:9px; min-height:34px; padding:0 16px;
           border-left:3px solid transparent; color:rgba(255,255,255,.74); font-size:13.5px;
           font-weight:500; background:none; border-top:0; border-right:0; border-bottom:0;
           width:100%; text-align:left; cursor:pointer; font-family:var(--f-x)}
.nav__item:hover{background:rgba(255,255,255,.07); color:#fff}
.nav__item[aria-current="page"]{border-left-color:var(--amarelo); color:#fff; background:rgba(255,255,255,.08)}
.nav__item:disabled{opacity:.32; cursor:not-allowed}
.nav__t{flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.app[data-rail="1"] .nav__t{display:none}
.nav__ic{width:16px; text-align:center; font-family:var(--f-m); font-size:10.5px;
         letter-spacing:0; color:rgba(255,255,255,.55); flex:0 0 auto}
.nav__item[aria-current="page"] .nav__ic{color:var(--amarelo)}
.pill{font-family:var(--f-m); font-size:10px; font-weight:600; color:var(--profundo);
      background:var(--amarelo); border-radius:9px; padding:1px 6px; min-width:18px;
      text-align:center; font-variant-numeric:tabular-nums}
.pill--al{background:var(--al); color:#fff}
.app[data-rail="1"] .pill{position:absolute; margin-left:26px; margin-top:-14px; font-size:8.5px; padding:0 4px}
.app[data-rail="1"] .nav__item{position:relative; justify-content:center; padding:0 4px}

.painel{display:flex; flex-direction:column; height:100vh; overflow:hidden}

/* Topbar */
.topbar{background:var(--top); border-bottom:1px solid var(--linha); flex:0 0 auto;
        display:flex; align-items:center; gap:10px; padding:0 18px; height:54px}
.tb-mod{display:flex; flex-direction:column; min-width:0; margin-right:6px}
.tb-mod strong{font-size:14.5px; line-height:1.2; white-space:nowrap}
.tb-mod span{font-family:var(--f-m); font-size:10px; letter-spacing:.14em; text-transform:uppercase;
             color:var(--apoio); white-space:nowrap}
.tb-sep{width:1px; height:26px; background:var(--linha); flex:0 0 auto}
.tb-busca{flex:1; max-width:360px; position:relative}
.tb-busca input{padding-left:30px}
.tb-busca::before{content:"⌕"; position:absolute; left:9px; top:50%; transform:translateY(-50%);
                  color:var(--apoio); font-size:15px; pointer-events:none}
.tb-atalho{font-family:var(--f-m); font-size:10px; color:var(--apoio); border:1px solid var(--linha);
           border-radius:var(--r); padding:1px 5px; position:absolute; right:7px; top:50%;
           transform:translateY(-50%); pointer-events:none}
.tb-dir{margin-left:auto; display:flex; align-items:center; gap:8px}

/* Barra de contexto do módulo */
.ctxbar{background:var(--card); border-bottom:1px solid var(--linha); flex:0 0 auto;
        display:flex; align-items:center; gap:8px; padding:8px 18px; flex-wrap:wrap; min-height:48px}
.ctxbar .esq{display:flex; align-items:center; gap:8px; flex-wrap:wrap; flex:1; min-width:0}
.ctxbar .dir{display:flex; align-items:center; gap:8px; margin-left:auto}

.corpo{flex:1; overflow-y:auto; padding:16px 18px 60px; display:flex; flex-direction:column; gap:14px}
.corpo::-webkit-scrollbar{width:10px}
.corpo::-webkit-scrollbar-thumb{background:var(--linha); border-radius:5px}

/* Barra de status */
.statusbar{background:var(--card); border-top:1px solid var(--linha); flex:0 0 auto; height:26px;
           display:flex; align-items:center; gap:16px; padding:0 18px; font-family:var(--f-m);
           font-size:10.5px; letter-spacing:.06em; color:var(--apoio); overflow:hidden}
.statusbar b{color:var(--titulo); font-weight:600}

/* ── Controles ─────────────────────────────────────────────────────────── */
.btn{font-family:var(--f-x); font-size:13px; font-weight:600; height:32px; padding:0 12px;
     border-radius:var(--r); border:1px solid transparent; cursor:pointer;
     display:inline-flex; align-items:center; gap:6px; white-space:nowrap; line-height:1}
.btn--p{background:var(--petroleo); color:#fff}
.btn--p:hover{background:var(--profundo)}
.btn--d{background:var(--amarelo); color:var(--profundo)}
.btn--d:hover{background:var(--ambar); color:var(--profundo)}
.btn--s{background:var(--card); color:var(--titulo); border-color:var(--linha)}
.btn--s:hover{background:var(--card2)}
.btn--g{background:none; color:var(--apoio); border-color:transparent; padding:0 8px}
.btn--g:hover{background:var(--card2); color:var(--titulo)}
.btn--peq{height:26px; padding:0 9px; font-size:12px}
.btn--lg{height:38px; padding:0 16px; font-size:14px}
.btn:disabled{background:var(--card2); color:var(--apoio); border-color:var(--linha); cursor:not-allowed}
.btn__k{font-family:var(--f-m); font-size:9.5px; opacity:.6; margin-left:2px}

.input,select,textarea{height:32px; padding:0 9px; font-family:var(--f-x); font-size:13px;
       color:var(--corpo); background:var(--card); border:1px solid var(--linha);
       border-radius:var(--r); width:100%; min-width:0}
textarea{height:auto; padding:8px 9px; font-family:var(--f-m); font-size:12px; line-height:1.6; resize:vertical}
.input:focus,select:focus,textarea:focus{outline:2px solid var(--amarelo); outline-offset:-1px}
.input--peq{height:28px; font-size:12.5px}
.campo{display:flex; flex-direction:column; gap:4px; min-width:0}
.campo>.kicker{font-size:9.5px}

.seg{display:inline-flex; border:1px solid var(--linha); border-radius:var(--r); overflow:hidden; background:var(--card)}
.seg button{background:none; border:0; padding:0 11px; height:30px; font-size:12.5px; font-weight:500;
            color:var(--apoio); cursor:pointer; font-family:var(--f-x); border-right:1px solid var(--linha)}
.seg button:last-child{border-right:0}
.seg button[aria-pressed="true"]{background:var(--petroleo); color:#fff; font-weight:600}
:root[data-theme="dark"] .seg button[aria-pressed="true"],
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .seg button[aria-pressed="true"]{background:var(--amarelo); color:var(--profundo)}}

.chip{display:inline-flex; align-items:center; gap:5px; height:26px; padding:0 8px;
      border:1px solid var(--linha); border-radius:var(--r); background:var(--card2);
      font-size:12px; color:var(--corpo); white-space:nowrap}
.chip b{font-weight:600; color:var(--titulo)}
.chip button{background:none; border:0; cursor:pointer; color:var(--apoio); font-size:13px;
             line-height:1; padding:0 0 0 2px}
.chip button:hover{color:var(--v-al)}

/* ── Cartões e KPI ─────────────────────────────────────────────────────── */
.card{background:var(--card); border:1px solid var(--linha); border-radius:var(--r)}
.card__h{display:flex; align-items:center; gap:10px; padding:11px 14px;
         border-bottom:1px solid var(--linha); flex-wrap:wrap; min-height:44px}
.card__h h3{flex:1; min-width:0}
.card__b{padding:14px; display:flex; flex-direction:column; gap:12px}
.card__f{padding:9px 14px; border-top:1px solid var(--linha); display:flex; align-items:center;
         gap:10px; font-size:12px; color:var(--apoio)}

.kpi{background:var(--card); border:1px solid var(--linha); border-top:3px solid var(--amarelo);
     border-radius:var(--r); padding:12px 14px; display:flex; flex-direction:column; gap:2px; min-width:0}
.kpi--al{border-top-color:var(--al)} .kpi--ok{border-top-color:var(--ok)} .kpi--at{border-top-color:var(--ambar)}
.kpi__v{font-family:var(--f-t); font-weight:800; font-size:27px; line-height:1.06;
        letter-spacing:-.02em; color:var(--titulo); font-variant-numeric:tabular-nums;
        white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.kpi--al .kpi__v{color:var(--v-al)}
.kpi__r{font-family:var(--f-m); font-size:9.5px; letter-spacing:.17em; text-transform:uppercase; color:var(--apoio)}
.kpi__n{font-size:11.5px; color:var(--apoio); line-height:1.4}
.kpi__d{font-family:var(--f-m); font-size:11px; font-weight:600}
.kpi__d--sobe{color:var(--v-ok)} .kpi__d--desce{color:var(--v-al)}

.grid{display:grid; gap:12px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g5{grid-template-columns:repeat(5,minmax(0,1fr))}
.g6{grid-template-columns:repeat(6,minmax(0,1fr))}
.g21{grid-template-columns:2fr 1fr} .g12{grid-template-columns:1fr 2fr}
.g31{grid-template-columns:3fr 1fr}
@media (max-width:1400px){.g6{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:1200px){.g5,.g4{grid-template-columns:repeat(2,minmax(0,1fr))} .g21,.g12,.g31{grid-template-columns:1fr}}
@media (max-width:900px){.grid{grid-template-columns:1fr!important} .app{grid-template-columns:1fr}
  .sidebar{height:auto; max-height:44vh} .app,.painel{height:auto; overflow:visible} body{overflow:auto}}

/* ── Grade de dados ────────────────────────────────────────────────────── */
.gradebox{background:var(--card); border:1px solid var(--linha); border-radius:var(--r);
          display:flex; flex-direction:column; overflow:hidden}
.gr-tool{display:flex; align-items:center; gap:8px; padding:8px 12px; border-bottom:1px solid var(--linha);
         flex-wrap:wrap; background:var(--card)}
.gr-tool .tit{font-weight:600; color:var(--titulo); font-size:14px; margin-right:2px}
.gr-tool .cnt{font-family:var(--f-m); font-size:11px; color:var(--apoio)}
.gr-tool .esp{flex:1}
.gr-filtros{display:flex; align-items:center; gap:7px; padding:7px 12px; border-bottom:1px solid var(--linha);
            flex-wrap:wrap; background:var(--card2)}
.gr-wrap{overflow:auto; max-height:none}
.gr-wrap::-webkit-scrollbar{width:10px; height:10px}
.gr-wrap::-webkit-scrollbar-thumb{background:var(--linha); border-radius:5px}
table.gr{width:100%; border-collapse:separate; border-spacing:0; font-size:13px; min-width:100%}
table.gr thead th{position:sticky; top:0; z-index:5; background:var(--thead); color:var(--thead-tx);
       font-weight:600; text-align:left; padding:0 12px; height:34px; font-size:10.5px;
       letter-spacing:.07em; text-transform:uppercase; white-space:nowrap; cursor:pointer;
       user-select:none; border-bottom:1px solid var(--thead)}
table.gr thead th.nao-ord{cursor:default}
table.gr thead th .ord{opacity:.45; margin-left:4px; font-family:var(--f-m); font-size:9px}
table.gr thead th.ativa .ord{opacity:1; color:var(--amarelo)}
table.gr td{padding:0 12px; height:var(--lin-h); border-bottom:1px solid var(--linha);
            vertical-align:middle; color:var(--corpo)}
table.gr td.alto{height:auto; padding-top:8px; padding-bottom:8px; line-height:1.4}
table.gr tbody tr:nth-child(even){background:var(--card2)}
table.gr tbody tr:hover{background:var(--hov)}
table.gr tbody tr.sel{background:var(--sel)}
table.gr tbody tr.click{cursor:pointer}
table.gr td.num,table.gr th.num{text-align:right; font-family:var(--f-m);
       font-variant-numeric:tabular-nums; white-space:nowrap}
table.gr td.acs{text-align:right; white-space:nowrap}
table.gr tfoot td{position:sticky; bottom:0; background:var(--card); font-weight:600;
       color:var(--titulo); border-top:2px solid var(--linha); height:34px}
.gr-vazio{padding:34px 16px; text-align:center; color:var(--apoio); font-size:13px}
.gr-pag{display:flex; align-items:center; gap:8px; padding:7px 12px; border-top:1px solid var(--linha);
        font-family:var(--f-m); font-size:11px; color:var(--apoio); flex-wrap:wrap}
.gr-pag .esp{flex:1}

/* Barra embutida na célula (mini-gráfico) */
.mini{display:inline-block; height:6px; border-radius:2px; background:var(--petroleo); vertical-align:middle}
.mini--am{background:var(--amarelo)} .mini--al{background:var(--v-al)} .mini--ok{background:var(--v-ok)}
.minitrilho{display:inline-block; width:66px; height:6px; background:var(--linha); border-radius:2px;
            overflow:hidden; vertical-align:middle; margin-right:6px}
.minitrilho>i{display:block; height:100%; background:var(--petroleo)}
.minitrilho>i.am{background:var(--amarelo)} .minitrilho>i.al{background:var(--v-al)} .minitrilho>i.ok{background:var(--v-ok)}

/* Sparkline */
.spark{display:inline-flex; align-items:flex-end; gap:1.5px; height:20px; vertical-align:middle}
.spark i{width:4px; background:var(--petroleo); border-radius:1px 1px 0 0; min-height:1px; display:block}
.spark i:last-child{background:var(--amarelo)}

/* ── Badges e status ───────────────────────────────────────────────────── */
.badge{display:inline-block; padding:1px 7px; border-radius:var(--r); font-size:10.5px;
       font-weight:600; border:1px solid currentColor; white-space:nowrap; line-height:1.5}
.b-ok{color:var(--v-ok)} .b-at{color:var(--v-at)} .b-al{color:var(--v-al)} .b-ne{color:var(--apoio)}
.b-in{color:var(--titulo)}
.badge--solido{border-color:transparent}
.b-ok.badge--solido{background:var(--v-ok); color:#fff}
.b-al.badge--solido{background:var(--v-al); color:#fff}
.b-at.badge--solido{background:var(--amarelo); color:var(--profundo)}
.pt{display:inline-block; width:7px; height:7px; border-radius:50%; margin-right:6px; vertical-align:1px}
.pt-ok{background:var(--v-ok)} .pt-at{background:var(--amarelo)}
.pt-al{background:var(--v-al)} .pt-ne{background:var(--apoio)} .pt-in{background:var(--petroleo)}

/* ── Abas internas ─────────────────────────────────────────────────────── */
.abas{display:flex; gap:0; border-bottom:1px solid var(--linha); overflow-x:auto; background:var(--card)}
.abas::-webkit-scrollbar{height:0}
.abas button{flex:0 0 auto; padding:0 14px; height:38px; font-family:var(--f-x); font-size:12.5px;
             font-weight:500; color:var(--apoio); background:none; border:0;
             border-bottom:2px solid transparent; cursor:pointer; white-space:nowrap}
.abas button[aria-selected="true"]{color:var(--titulo); border-bottom-color:var(--amarelo); font-weight:600}
.abas button:hover{color:var(--titulo); background:var(--hov)}
.abas .cnt{font-family:var(--f-m); font-size:10px; color:var(--apoio); margin-left:5px}

/* ── Gaveta lateral (detalhe do registro) ──────────────────────────────── */
.gaveta{position:fixed; inset:0; z-index:90; display:none}
.gaveta.aberta{display:block}
.gaveta__fundo{position:absolute; inset:0; background:var(--sombra-drawer)}
.gaveta__box{position:absolute; top:0; right:0; bottom:0; width:min(620px,100%);
             background:var(--card); border-left:1px solid var(--linha);
             display:flex; flex-direction:column}
.gaveta__h{display:flex; align-items:flex-start; gap:10px; padding:14px 16px;
           border-bottom:1px solid var(--linha); flex:0 0 auto}
.gaveta__h .t{flex:1; min-width:0}
.gaveta__b{flex:1; overflow-y:auto; padding:14px 16px; display:flex; flex-direction:column; gap:14px}
.gaveta__f{padding:11px 16px; border-top:1px solid var(--linha); display:flex; gap:8px;
           justify-content:flex-end; flex-wrap:wrap; flex:0 0 auto}
.fechar{background:none; border:1px solid var(--linha); border-radius:var(--r); width:28px; height:28px;
        cursor:pointer; color:var(--corpo); font-size:16px; line-height:1; flex:0 0 auto}
.fechar:hover{background:var(--card2)}

/* Lista de propriedades */
.props{display:grid; grid-template-columns:auto 1fr; gap:0; border:1px solid var(--linha);
       border-radius:var(--r); overflow:hidden; font-size:13px}
.props dt{padding:7px 12px; background:var(--card2); border-bottom:1px solid var(--linha);
          font-family:var(--f-m); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase;
          color:var(--apoio); white-space:nowrap}
.props dd{padding:7px 12px; margin:0; border-bottom:1px solid var(--linha); color:var(--corpo)}
.props dt:last-of-type,.props dd:last-of-type{border-bottom:0}

/* Linha de item */
.li{display:flex; align-items:flex-start; gap:10px; padding:10px 14px; border-bottom:1px solid var(--linha)}
.li:last-child{border-bottom:0}
.li:hover{background:var(--hov)}
.li__c{flex:1; min-width:0; display:flex; flex-direction:column; gap:1px}
.li__c strong{font-size:13.5px}
.li__v{font-family:var(--f-m); font-weight:600; font-variant-numeric:tabular-nums;
       white-space:nowrap; color:var(--titulo); font-size:13px}

/* Linha do tempo */
.tl{display:flex; flex-direction:column; border-left:2px solid var(--linha); margin-left:6px; padding-left:0}
.tl__i{display:grid; grid-template-columns:88px 1fr; gap:12px; padding:0 0 14px 16px; position:relative}
.tl__i::before{content:""; position:absolute; left:-6px; top:4px; width:10px; height:10px;
               border-radius:50%; background:var(--petroleo); border:2px solid var(--card)}
.tl__i.am::before{background:var(--amarelo)} .tl__i.ok::before{background:var(--v-ok)}
.tl__i.al::before{background:var(--v-al)} .tl__i.ne::before{background:var(--apoio)}
.tl__d{font-family:var(--f-m); font-size:11px; color:var(--apoio); padding-top:1px}
.tl__t{font-size:13px}

/* ── Modal ─────────────────────────────────────────────────────────────── */
.modal{position:fixed; inset:0; background:var(--sombra-drawer); display:none;
       align-items:flex-start; justify-content:center; padding:32px 14px; z-index:100; overflow-y:auto}
.modal.aberto{display:flex}
.modal__box{background:var(--card); border:1px solid var(--linha); border-radius:var(--r);
            width:min(780px,100%); display:flex; flex-direction:column}
.modal__box.lg{width:min(1080px,100%)}
.modal__h{display:flex; align-items:center; gap:10px; padding:14px 18px; border-bottom:1px solid var(--linha)}
.modal__h h3{flex:1}
.modal__b{padding:16px 18px; display:flex; flex-direction:column; gap:14px; max-height:72vh; overflow-y:auto}
.modal__f{padding:12px 18px; border-top:1px solid var(--linha); display:flex; gap:8px; justify-content:flex-end}

/* ── Paleta de comandos ────────────────────────────────────────────────── */
.paleta{position:fixed; inset:0; background:var(--sombra-drawer); display:none;
        align-items:flex-start; justify-content:center; padding:12vh 14px 0; z-index:120}
.paleta.aberta{display:flex}
.paleta__box{background:var(--card); border:1px solid var(--linha); border-radius:var(--r);
             width:min(620px,100%); display:flex; flex-direction:column; overflow:hidden}
.paleta__box input{height:46px; border:0; border-bottom:1px solid var(--linha); border-radius:0;
                   font-size:15px; padding:0 16px}
.paleta__box input:focus{outline:0; border-bottom-color:var(--amarelo)}
.paleta__lista{max-height:48vh; overflow-y:auto}
.paleta__i{display:flex; align-items:center; gap:10px; padding:9px 16px; cursor:pointer; font-size:13.5px}
.paleta__i.sel{background:var(--sel)}
.paleta__i .g{font-family:var(--f-m); font-size:10px; letter-spacing:.1em; text-transform:uppercase;
              color:var(--apoio); margin-left:auto}
.paleta__vazio{padding:22px 16px; text-align:center; color:var(--apoio); font-size:13px}

/* ── Aviso / toast ─────────────────────────────────────────────────────── */
.aviso{background:var(--card2); border:1px solid var(--linha); border-left:3px solid var(--amarelo);
       border-radius:var(--r); padding:10px 14px; font-size:12.5px; color:var(--apoio); line-height:1.5}
.aviso strong{color:var(--titulo)}
.aviso--al{border-left-color:var(--al)} .aviso--ok{border-left-color:var(--ok)}
.toast{position:fixed; right:16px; bottom:36px; z-index:200; display:flex; flex-direction:column;
       gap:8px; max-width:min(440px,calc(100vw - 32px))}
.toast__i{background:var(--card); border:1px solid var(--linha); border-left:3px solid var(--ok);
          border-radius:var(--r); padding:10px 14px; font-size:12.5px; color:var(--corpo);
          box-shadow:none}
.toast__i--al{border-left-color:var(--al)}
.toast__i strong{display:block; margin-bottom:1px; font-size:13px}

/* ── Faixa escura de destaque ──────────────────────────────────────────── */
.faixa{background:var(--profundo); border-radius:var(--r); padding:18px 20px;
       display:flex; flex-direction:column; gap:8px; color:#fff}
.faixa .kicker{color:var(--amarelo)}
.faixa p{color:rgba(255,255,255,.8); font-size:12.5px; line-height:1.5}
.faixa strong{color:var(--amarelo)}
.faixa h3{color:#fff}
.faixa__n{font-family:var(--f-t); font-weight:800; font-size:clamp(34px,5vw,58px); line-height:.94;
          letter-spacing:-.03em; color:var(--amarelo); font-variant-numeric:tabular-nums}

/* ── Gráfico de barras ─────────────────────────────────────────────────── */
.gbar{display:flex; align-items:flex-end; gap:6px; height:130px; padding:0 2px;
      border-bottom:1px solid var(--linha)}
.gcol{flex:1; display:flex; flex-direction:column; align-items:center; gap:4px; min-width:0}
.gval{width:100%; background:var(--petroleo); border-radius:2px 2px 0 0; min-height:2px}
.gval--p{background:var(--amarelo)}
.grot{font-family:var(--f-m); font-size:9.5px; color:var(--apoio); white-space:nowrap;
      overflow:hidden; text-overflow:ellipsis; max-width:100%}
.legenda{display:flex; flex-wrap:wrap; gap:4px 16px; font-size:11.5px; color:var(--apoio)}

/* Barra empilhada */
.barra{display:flex; height:22px; border-radius:var(--r); overflow:hidden; border:1px solid var(--linha)}
.barra div{display:flex; align-items:center; justify-content:center; font-family:var(--f-m);
           font-size:9.5px; font-weight:600; min-width:0; overflow:hidden}

.lista{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:7px}
.lista li{padding-left:16px; position:relative; font-size:12.8px; line-height:1.5}
.lista li::before{content:""; position:absolute; left:0; top:.62em; width:8px; height:3px; background:var(--amarelo)}

.tela{display:none; flex-direction:column; gap:14px}
.tela.ativa{display:flex}

:focus-visible{outline:2px solid var(--amarelo); outline-offset:1px}
@media (prefers-reduced-motion:reduce){*{animation:none!important; transition:none!important}}
@media print{.sidebar,.topbar,.ctxbar,.statusbar,.btn,.modal,.toast,.gaveta{display:none!important}
  .app{grid-template-columns:1fr} body,.painel,.corpo{overflow:visible; height:auto} }

/* ── Tela de acesso ─────────────────────────────────────────────────────── */
.login{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--profundo);padding:24px;font-family:var(--f-x)}
.login__cx{width:100%;max-width:360px;background:var(--card);border:1px solid var(--linha);border-radius:var(--r);padding:28px;display:flex;flex-direction:column;gap:8px}
.login__logo{display:flex;justify-content:center;margin:0 0 14px}
.login__logo img{width:180px;max-width:100%;height:auto;background:#0b1220;border-radius:14px;padding:14px 18px;box-sizing:content-box}
.login__cx h1{font-family:var(--f-t);font-size:22px;color:var(--titulo);margin:0 0 10px;text-align:center}
.login__cx .rot{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--apoio);margin-top:6px}
.login__cx .input{width:100%}
.login__cx .btn{margin-top:10px;justify-content:center}
.login__msg{font-size:12px;color:var(--v-al);margin:6px 0 0}
.login__alt{margin-top:12px;background:none;border:0;color:var(--apoio);font-size:12px;cursor:pointer;text-decoration:underline}