:root{--fundo:#F4F6F9;--card:#FFFFFF;--borda:#E2E6EC;--texto:#18212F;--suave:#5B6573;--menu:#0F1B2D;--destaque:#1D63D8;--ok:#0E6B30;--okf:#E2F4E8;--erro:#A3201A;--errof:#FCE4E2}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--texto);background:var(--fundo)}
h1,h2{margin:0}
button,input,select{font:inherit}
.botao{border:0;background:var(--destaque);color:#fff;border-radius:8px;padding:11px 16px;font-weight:600;cursor:pointer;min-height:44px}
.botao.claro{background:#fff;color:var(--texto);border:1px solid #D5DBE3}
.campo{display:flex;flex-direction:column;gap:6px;font-size:14px}
.campo input,.campo select{border:1px solid #D5DBE3;border-radius:8px;padding:10px 12px;min-height:44px;background:#fff;color:var(--texto)}
.erro{color:var(--erro);font-size:14px;min-height:20px}
.pilula{font-size:12px;padding:3px 9px;border-radius:10px;font-weight:600}
.pilula.ok{background:var(--okf);color:var(--ok)}.pilula.ruim{background:var(--errof);color:var(--erro)}
/* login */
.login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.login form{background:var(--card);border:1px solid var(--borda);border-radius:14px;padding:32px;width:100%;max-width:380px;display:flex;flex-direction:column;gap:16px}
.marca{display:flex;align-items:center;gap:10px}
.marca span{width:34px;height:34px;border-radius:9px;background:var(--destaque)}
/* início */
.casca{display:flex;flex-wrap:wrap;min-height:100vh}
.menu{flex:1 1 200px;max-width:220px;background:var(--menu);color:#E7ECF3;padding:20px 16px;display:flex;flex-direction:column;gap:12px}
.menu small{color:#A9B4C4}
.conteudo{flex:999 1 560px;min-width:0;padding:28px 32px;display:flex;flex-direction:column;gap:20px}
.grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}
.card{background:var(--card);border:1px solid var(--borda);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:12px}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:8px 6px;border-bottom:1px solid var(--borda)}
th{color:var(--suave);font-weight:600;font-size:13px}
.rolagem{overflow-x:auto}
.escondido{display:none !important}