/* Layout-only do módulo Gestão de Compras / OMS.
   NÃO redefine token de paleta — só estrutura, consumindo as vars do slate-mist.
   Tokens/cores/tabela/pills/botões vêm de slate-mist.css (fonte única). */

*{box-sizing:border-box}
body{margin:0}
a{color:inherit;text-decoration:none}

.shell{display:grid;grid-template-columns:224px 1fr 268px;min-height:100vh}
.side{border-right:1px solid var(--borda);background:var(--card);padding:20px 14px}
.main{padding:28px 32px;max-width:1120px}
.rail{border-left:1px solid var(--borda);background:var(--card);padding:22px 18px;font-size:12px}

.brand{font-weight:600;font-size:14px;letter-spacing:-.2px;margin:0 6px 4px}
.brand small{display:block;color:var(--dica);font-weight:400;font-size:11px;margin-top:2px}
.navgrp{margin-top:22px}
.nav-a{display:block;padding:8px 10px;border-radius:8px;font-size:13px;color:var(--texto2);
  border-left:3px solid transparent;margin:2px 0}
.nav-a:hover{background:var(--pagina)}
.nav-a.active{background:var(--pagina);font-weight:600;color:var(--tinta)}
.nav-a.active.cart{border-left-color:var(--se-cart)}
.nav-a.active.roma{border-left-color:var(--se-roma)}
.nav-a.active.expe{border-left-color:var(--se-expe)}
.nav-a.active.ini{border-left-color:var(--apoio)}

.kpigrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0}
.kpi{background:var(--card);border:1px solid var(--borda);border-radius:12px;padding:16px 18px;display:block}
.kpi .v{font-size:24px;font-weight:600;font-family:ui-monospace,Consolas,monospace;font-variant-numeric:tabular-nums}
.kpi .l{font-size:12px;color:var(--texto2);margin-top:4px;font-weight:600}
.kpi .d{font-size:11px;color:var(--dica);margin-top:6px;line-height:1.4}

.band{background:var(--pagina);border:1px solid var(--borda);border-radius:10px;
  padding:10px 14px;font-size:12px;color:var(--apoio);margin:14px 0 20px}
.revbar{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}
.foot{color:var(--dica);font-size:11px;line-height:1.5;margin-top:14px}
.rail h4{font-size:10.5px;text-transform:uppercase;letter-spacing:.12em;color:var(--dica);margin:0 0 10px}
.rail .fld{margin-bottom:16px}
.rail label{display:block;font-size:11px;color:var(--apoio);margin-bottom:5px}
.rail select,.rail input,.f input,.f select,.f textarea{width:100%;padding:7px 9px;border:1px solid var(--borda);
  border-radius:8px;background:var(--card);color:var(--tinta);font:13px ui-sans-serif,system-ui,sans-serif}
.f .row{margin-bottom:16px;max-width:560px}
.f label{display:block;font-size:12px;color:var(--texto2);font-weight:600;margin-bottom:5px}
.f textarea{min-height:88px;font-family:ui-monospace,Consolas,monospace}
.tag{display:inline-block;font-size:10.5px;padding:2px 8px;border-radius:6px;background:var(--pagina);
  border:1px solid var(--borda);color:var(--apoio)}
.staged{opacity:.55}
@media(max-width:900px){.shell{grid-template-columns:1fr}.side,.rail{border:0;border-bottom:1px solid var(--borda)}.kpigrid{grid-template-columns:1fr 1fr}}