:root {
    --sfondo: #f6f7f9;
    --superficie: #ffffff;
    --testo: #1d2330;
    --tenue: #5b6475;
    --accento: #2f5bd3;
    --bordo: #dde1e8;
    --errore: #b3261e;
}
@media (prefers-color-scheme: dark) {
    :root {
        --sfondo: #14171d;
        --superficie: #1c2029;
        --testo: #e6e8ee;
        --tenue: #9aa3b5;
        --accento: #7b9cff;
        --bordo: #2e3441;
        --errore: #ff8a80;
    }
}
* { box-sizing: border-box; }
body { margin: 0; font-family: system-ui, "Segoe UI", sans-serif; background: var(--sfondo); color: var(--testo); }
a { color: var(--accento); }
.barra { display: flex; align-items: center; gap: 1.5rem; padding: .75rem 1rem; background: var(--superficie); border-bottom: 1px solid var(--bordo); flex-wrap: wrap; }
.marchio { font-weight: 700; text-decoration: none; color: var(--testo); }
.menu { display: flex; gap: 1rem; flex: 1; flex-wrap: wrap; }
.menu a { text-decoration: none; }
.utente { display: flex; align-items: center; gap: .5rem; color: var(--tenue); margin: 0; }
.contenuto { max-width: 1100px; margin: 0 auto; padding: 1.5rem 1rem; }
.schede { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1rem; }
.schede a { display: flex; flex-direction: column; gap: .35rem; padding: 1rem; background: var(--superficie); border: 1px solid var(--bordo); border-radius: 8px; text-decoration: none; color: var(--testo); }
.schede a:hover { border-color: var(--accento); }
.schede span { color: var(--tenue); font-size: .9rem; }
.tabella { width: 100%; border-collapse: collapse; background: var(--superficie); }
.tabella th, .tabella td { text-align: left; padding: .4rem .6rem; border-bottom: 1px solid var(--bordo); }
.stato-inerrore td { color: var(--errore); }
button { font: inherit; padding: .35rem .8rem; border: 1px solid var(--bordo); border-radius: 6px; background: var(--superficie); color: var(--testo); cursor: pointer; }
.utente form { margin: 0; }
.modulo { display: flex; flex-direction: column; gap: .75rem; max-width: 34rem; margin: 1rem 0; }
.modulo label { display: flex; flex-direction: column; gap: .25rem; }
.modulo label.riga { flex-direction: row; align-items: center; gap: .4rem; }
.modulo input[type=text], .modulo input[type=password], .modulo input[type=email], .modulo input[type=number] {
    font: inherit; padding: .4rem .5rem; border: 1px solid var(--bordo); border-radius: 6px;
    background: var(--superficie); color: var(--testo);
}
.modulo button { align-self: flex-start; }
.modulo fieldset { border: 1px solid var(--bordo); border-radius: 8px; }
.modulo-ruoli { margin-bottom: .75rem; }
.errore { color: var(--errore); font-weight: 600; }
.esito { color: var(--accento); }
.tenue { color: var(--tenue); }
code { background: var(--sfondo); padding: .1rem .3rem; border-radius: 4px; }