:root { --fondo:#f4f6f8; --testo:#1d2733; --tenue:#5b6775; --accento:#1f7a74; --bordo:#d8dee5; --errore:#a3262b; }
* { box-sizing:border-box; }
body { margin:0; font:15px/1.45 system-ui, -apple-system, "Segoe UI", sans-serif; background:var(--fondo); color:var(--testo); }
a { color:var(--accento); }
.barra { display:flex; gap:16px; align-items:center; padding:8px 16px; background:#fff; border-bottom:1px solid var(--bordo); flex-wrap:wrap; }
.barra .logo { font-weight:600; text-decoration:none; color:var(--testo); }
.barra nav { display:flex; gap:12px; }
.barra .chi { margin-left:auto; color:var(--tenue); font-size:13px; }
.barra form { margin:0; }
main { padding:16px; max-width:1100px; margin:0 auto; }
.pagina-mockup main { max-width:none; padding:0; }
.login { max-width:360px; margin:12vh auto; background:#fff; padding:24px; border:1px solid var(--bordo); border-radius:8px; display:grid; gap:12px; }
.login label { display:grid; gap:4px; font-size:13px; color:var(--tenue); }
.login input { padding:8px; font:inherit; border:1px solid var(--bordo); border-radius:4px; }
button, .bottone { background:var(--accento); color:#fff; border:0; border-radius:4px; padding:8px 14px; font:inherit; cursor:pointer; text-decoration:none; display:inline-block; }
.barra button { background:none; color:var(--accento); padding:4px 8px; border:1px solid var(--bordo); }
.errore { color:var(--errore); }
.area ul { list-style:none; padding:0; margin:0; background:#fff; border:1px solid var(--bordo); border-radius:6px; }
.voce { padding:6px 12px; border-bottom:1px solid var(--bordo); display:flex; gap:10px; flex-wrap:wrap; align-items:baseline; }
.voce small { color:var(--tenue); flex-basis:100%; }
.voce .stato { font-size:12px; color:var(--tenue); }
.voce.pronto .stato { color:var(--accento); font-weight:600; }
.voce .uso { font-size:12px; color:var(--errore); }
.stato-router { padding:4px 16px; font-size:12px; color:var(--tenue); background:#fff; border-bottom:1px solid var(--bordo); }
#mockup { width:100%; height:calc(100vh - 80px); border:0; display:block; }
