/* Mobile-first: l'uso principale è dal telefono. */
:root {
    --inchiostro: #1d1d29;
    --carta: #f6f4ef;
    --accento: #7a4a9e;
    --ok: #2c7a3f;
    --errore: #b03030;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    min-height: 100dvh;
    display: grid;
    place-items: center;
    background: var(--carta);
    color: var(--inchiostro);
    font: 16px/1.5 -apple-system, "Segoe UI", Roboto, sans-serif;
    padding: 1rem;
}

.scheda {
    width: 100%;
    max-width: 28rem;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgb(0 0 0 / 8%);
    padding: 1.5rem;
}

h1 { font-size: 1.3rem; margin: 0 0 1rem; }

label { display: block; margin-bottom: .3rem; font-weight: 600; }

input[type="password"] {
    width: 100%;
    padding: .7rem;
    font-size: 1rem;
    border: 1px solid #ccc;
    border-radius: 8px;
    margin-bottom: 1rem;
}

button {
    width: 100%;
    padding: .8rem;
    font-size: 1rem;
    font-weight: 600;
    color: #fff;
    background: var(--accento);
    border: 0;
    border-radius: 8px;
    cursor: pointer;
}

button.secondario {
    background: transparent;
    color: var(--accento);
    border: 1px solid var(--accento);
    margin-top: 1rem;
}

.avviso {
    padding: .6rem .8rem;
    border-radius: 8px;
    font-weight: 600;
}
.avviso.errore { background: #fbe9e9; color: var(--errore); }
.avviso.successo { background: #e8f5ec; color: var(--ok); }

table { width: 100%; border-collapse: collapse; margin: 1rem 0; }
td, th { padding: .4rem .5rem; text-align: left; vertical-align: top; }
th { white-space: nowrap; }
tr + tr { border-top: 1px solid #eee; }
td:last-child { word-break: break-all; font-size: .85rem; color: #555; }

.nota { font-size: .8rem; color: #777; }