:root{
  --notte:#0b1726; --notte2:#13263d;
  --avorio:#f6efe1;
  --oro:#ffd36b; --oro2:#ffe7ad; --rame:#ff7a45; --azzurro:#7cd0ff;
  --pietra:#efe1c4; --testo:#e9eef5; --tenue:#a9b7c9;
  color-scheme:dark;
}
*{box-sizing:border-box;margin:0}
html{height:100%}
body{
  min-height:100%;display:flex;flex-direction:column;align-items:center;
  background:radial-gradient(120% 90% at 50% 0%,var(--notte2) 0%,var(--notte) 60%) fixed;
  color:var(--testo);
  font:400 clamp(1rem,.95rem + .3vw,1.125rem)/1.6 system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,sans-serif;
  padding:clamp(1.5rem,4vw,3rem) 1rem 1.25rem;
  -webkit-font-smoothing:antialiased;
}
main{width:min(42rem,100%);text-align:center;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.1rem}

@media (prefers-reduced-motion:no-preference){
  .punto{animation:pulsa 1.8s ease-in-out infinite}
}
@keyframes pulsa{50%{box-shadow:0 0 0 .45rem rgb(255 211 107 / 0)}}

/* ===== nome ===== */
h1{
  font:700 clamp(3.2rem,2.2rem + 5vw,5.4rem)/1 ui-serif,Georgia,"Times New Roman",serif;
  letter-spacing:-.03em;
}
.logo{background:linear-gradient(180deg,var(--oro2),var(--oro) 55%,var(--rame));-webkit-background-clip:text;background-clip:text;color:transparent}
.tld{color:var(--tenue);font-size:.38em;font-weight:400;letter-spacing:0;margin-left:.08em}

/* ===== testi ===== */
.def{color:var(--tenue);font-size:.95em}
.def dfn{font-style:normal;font-weight:600;color:var(--pietra)}
.pron{font-family:ui-monospace,Consolas,monospace;font-size:.85em;opacity:.8}
.def em{color:var(--oro)}
.lead{max-width:34rem;color:var(--testo)}
.lead strong{color:var(--oro);font-weight:600}

.temi{list-style:none;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem}
.temi li{
  border:1px solid rgb(246 239 225 / .3);color:var(--pietra);
  padding:.32rem .8rem;border-radius:999px;font-size:.88em;background:rgb(246 239 225 / .05)
}
.stato{display:inline-flex;align-items:center;gap:.55rem;color:var(--tenue);font-size:.95em}
.stato strong{color:var(--pietra);font-weight:600;font-style:italic}
.punto{width:.6rem;height:.6rem;border-radius:50%;background:var(--oro);box-shadow:0 0 0 0 rgb(255 211 107 / .6)}

footer{margin-top:2rem;color:#6f8099;font-size:.82rem}
@media (max-width:420px){.temi li{font-size:.82em}}