@font-face{font-family:'Bebas Neue';src:url(/fonts/BebasNeue-Regular.ttf) format('truetype');font-display:swap}
@font-face{font-family:'Inter';font-weight:400;src:url(/fonts/inter-normal-400-latin.woff2) format('woff2');font-display:swap}
@font-face{font-family:'Inter';font-weight:600;src:url(/fonts/inter-normal-600-latin.woff2) format('woff2');font-display:swap}
:root{--fondo:#16181c;--carta:#20242a;--linea:#2e333b;--testo:#e8eaed;--tenue:#9aa1ab;--giallo:#ffd400;--rosso:#e5484d;--verde:#3fb27f}
*{box-sizing:border-box}
html,body{margin:0;background:var(--fondo);color:var(--testo);font:400 16px/1.5 Inter,system-ui,sans-serif}
h1,.logo,.logo-piccolo{font-family:'Bebas Neue',Impact,sans-serif;font-weight:400;letter-spacing:.04em;margin:0}
a{color:inherit;text-decoration:none}
.accesso{display:grid;place-items:center;min-height:100vh;min-height:100dvh;padding:24px}
.accesso-box{width:100%;max-width:360px;text-align:center}
.logo{font-size:72px;line-height:1;color:var(--giallo)}
.sotto{color:var(--tenue);margin:8px 0 28px}
.avviso{background:var(--carta);border-left:4px solid var(--rosso);padding:10px 14px;text-align:left;margin:0 0 20px}
.bottone-giallo{display:block;background:var(--giallo);color:#111;font-weight:600;padding:14px 18px;border-radius:10px}
.alto{display:flex;align-items:center;gap:16px;padding:10px 16px;border-bottom:1px solid var(--linea)}
.logo-piccolo{font-size:28px;color:var(--giallo)}
.utente{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:14px}
.chi small{color:var(--tenue);margin-left:4px}
.utente button{background:none;border:1px solid var(--linea);color:var(--testo);border-radius:8px;padding:6px 12px;font:inherit;cursor:pointer}
.schede a{padding:10px 14px;color:var(--tenue);font-weight:600}
.schede a.attiva{color:var(--giallo)}
.schede-alto{display:none}
.schede-basso{position:fixed;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(4,1fr);background:var(--carta);border-top:1px solid var(--linea);padding-bottom:env(safe-area-inset-bottom)}
.schede-basso a{text-align:center;padding:14px 4px;font-size:14px}
.contenuto{padding:20px 16px 96px;max-width:960px;margin:0 auto}
.contenuto h1{font-size:40px}
.vuoto{margin-top:16px;padding:40px 16px;border:1px dashed var(--linea);border-radius:12px;color:var(--tenue);text-align:center}
@media(min-width:800px){
  .schede-alto{display:flex;margin-left:12px}
  .schede-basso{display:none}
  .contenuto{padding-bottom:32px}
}
