/* ======================== */ /* VARIABILI CSS */ /* ======================== */ /* :root è il selettore dell'elemento radice della pagina (= ). Le variabili dichiarate qui sono disponibili in TUTTI i file CSS collegati. Si usano con var(--nome) — cambiarle qui le aggiorna ovunque automaticamente. */ :root { --bg: #0c0414; /* sfondo principale — viola quasi nero */ --surface: #150b24; /* superficie elevata — card, overlay, devtools */ --text: #f0e8ff; /* testo principale — bianco violaceo */ --muted: #8b7aa8; /* testo secondario — viola medio */ --accent: #a78bfa; /* colore accentuato — viola chiaro */ --primary: #6d28d9; /* viola scuro — usato nei gradienti della spirale */ --border: rgba(167, 139, 250, 0.15); /* bordo semitrasparente — viola al 15% di opacità */ --nav-h: 64px; /* altezza navbar — usata anche in navbar.css */ } /* ======================== */ /* RESET */ /* ======================== */ /* — Box sizing — */ /* Applica box-sizing: border-box a TUTTI gli elementi della pagina. border-box: padding e border sono INCLUSI nella larghezza/altezza dichiarata. Senza questo, aggiungere padding a un elemento lo farebbe diventare più grande di quanto dichiarato — rende i calcoli delle dimensioni imprevedibili. */ *, *::before, *::after { box-sizing: border-box; /* padding e border inclusi nelle dimensioni */ margin: 0; /* rimuove margini default del browser */ padding: 0; /* rimuove padding default del browser */ -webkit-tap-highlight-color: transparent; /* rimuove il flash blu al tap su Chrome/Samsung mobile */ } /* ======================== */ /* BASE */ /* ======================== */ /* — HTML — */ html { height: -webkit-fill-available; /* Fix per Safari iOS: 100vh su Safari include la barra degli indirizzi. -webkit-fill-available usa l'altezza visibile reale — evita che il contenuto venga tagliato sotto la barra del browser */ } /* — Body — */ body { min-height: 100vh; /* altezza minima = tutta la finestra */ min-height: -webkit-fill-available; /* stesso fix di html per Safari iOS */ background: var(--bg); /* colore di sfondo dalla variabile */ color: var(--text); /* colore testo default dalla variabile */ font-family: sans-serif; /* font di fallback generico */ -webkit-font-smoothing: antialiased; /* rende i font più nitidi su Mac e iOS (Chrome/Safari) */ -moz-osx-font-smoothing: grayscale; /* stesso effetto su Firefox Mac */ }