/* Palette ufficiale dal Manuale Brand Standard BNI (notebook "BNI - Pillole del Martedì").
   Rosso BNI #CF2030 · Sterling Grey #C8C8C8 · Granite Grey #64666A · Light Grey #F2F2F2 · bianco · nero.
   Struttura e densità da STILE-GUI.md (versione chiara, §9). Font: Arial (sostituto ammesso dal manuale) davanti a Helvetica Neue, per un PDF identico su ogni computer. */
:root{
  --rosso:#CF2030;       /* colore primario del brand */
  --rosso-hover:#AD1B28; /* derivato dal rosso BNI (non definito dal manuale): solo per hover/pressed */
  --sterling:#C8C8C8;    /* bordi, separatori */
  --granito:#64666A;     /* testo secondario, nome del capitolo */
  --chiaro:#F2F2F2;      /* sfondo pagina, riquadri incassati */
  --bianco:#FFFFFF;      /* pannelli */
  --nero:#000000;        /* testo primario */
  --riga:#E6E6E6;
  /* Stati: asse separato dal brand (STILE-GUI §2.4/§9.4), così il rosso di marca non si confonde con "errore" */
  --ok-bg:#d1fae5;--ok:#065f46;--info-bg:#dbeafe;--info:#1e40af;--att-bg:#ffedd5;--att:#9a3412;--err-bg:#fee2e2;--err:#991b1b;
}
*{box-sizing:border-box}
body{margin:0;background:var(--chiaro);color:var(--nero);font:13px Arial,"Helvetica Neue",sans-serif}
a{color:var(--rosso)}
.layout{display:grid;grid-template-columns:220px 1fr;min-height:100vh}
.side{background:var(--bianco);border-right:1px solid var(--sterling);padding:16px 0;position:sticky;top:0;align-self:start;height:100vh;overflow-y:auto} /* il menu non scorre con la pagina */
.logo{padding:0 16px 14px;text-align:center}
.logo img{width:96px;height:auto;display:block;margin:0 auto}
.logo span{display:block;margin-top:6px;color:var(--granito);font-weight:700;font-size:12px;letter-spacing:.04em} /* nome capitolo: sempre Granite Grey */
.side a{display:block;padding:9px 16px;color:var(--nero);text-decoration:none;cursor:pointer;border-left:3px solid transparent}
.side a:hover{background:var(--chiaro)}
.side a.on{background:var(--rosso);color:var(--bianco);font-weight:700;border-left-color:var(--rosso)}
.main{display:flex;flex-direction:column;min-width:0}
.top{background:var(--bianco);border-bottom:1px solid var(--sterling);padding:10px 16px;display:flex;justify-content:space-between;align-items:center}
.top h1{font-size:15px;margin:0;color:var(--nero);font-weight:700}
.top .chi{color:var(--granito);font-size:12px}
.work{padding:16px;overflow:auto}
table{border-collapse:collapse;width:100%;background:var(--bianco);border:1px solid var(--sterling)}
th{position:sticky;top:0;background:var(--bianco);color:var(--granito);font-size:11px;text-align:left;padding:8px 14px;border-bottom:2px solid var(--rosso)}
td{padding:8px 14px;border-bottom:1px solid var(--riga);max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
tr:hover td{background:var(--chiaro)}
.vuoto{color:var(--granito);padding:24px;text-align:center}
.mono{font-family:ui-monospace,Menlo,Consolas,monospace;color:var(--granito)}
button,.btn{background:var(--rosso);border:0;border-radius:4px;color:var(--bianco);padding:7px 12px;cursor:pointer;font:inherit;font-weight:700}
button:hover{background:var(--rosso-hover)}
button.sec{background:var(--bianco);color:var(--granito);border:1px solid var(--sterling)}
input{background:var(--bianco);border:1px solid var(--sterling);border-radius:4px;color:var(--nero);padding:7px;font:inherit}
input:focus{outline:0;border-color:var(--rosso);box-shadow:0 0 0 2px rgba(207,32,48,.15)}
.err{color:var(--err)}
.bdg{display:inline-block;border-radius:4px;padding:2px 8px;font-size:11px;font-weight:700;text-transform:uppercase}
.bdg.ok{background:var(--ok-bg);color:var(--ok)}.bdg.info{background:var(--info-bg);color:var(--info)}
.bdg.att{background:var(--att-bg);color:var(--att)}.bdg.err{background:var(--err-bg);color:var(--err)}
::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-thumb{background:var(--sterling);border-radius:3px}