/* MADAME — palette e caratteri dall'identità visiva (sett. 2026) */
:root{
  --lacca:#100D0C;      /* fondo della notte */
  --velluto:#3A0D10;    /* sipario, filetti scuri */
  --bue:#6B1518;        /* sangue di bue */
  --notte:#E5483D;      /* rosso notte: accento, i tre punti */
  --avorio:#F1EADB;     /* testo */
  --crema:#E4D6BA;
  --ottone:#9B7A45;     /* filetti, descrittore */
  --panel:#171211;
  --line:#2c2120;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--lacca);color:var(--avorio);font-family:'EB Garamond',Georgia,serif;font-size:18px;line-height:1.45;
     -webkit-font-smoothing:antialiased;min-height:100vh}
a{color:var(--crema)}
.display{font-family:'Bodoni Moda',Didot,Georgia,serif;font-style:italic;font-weight:400}
.descr{font-family:'EB Garamond',Georgia,serif;font-size:11px;letter-spacing:.42em;color:var(--ottone);text-transform:uppercase}
.punti{color:var(--notte)}
label{display:block;font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--ottone);margin:0 0 6px}
input,select,textarea{width:100%;padding:13px 14px;margin:0 0 18px;background:transparent;border:0;border-bottom:1px solid var(--ottone);
      color:var(--avorio);font:inherit;font-size:18px;border-radius:0;-webkit-appearance:none;appearance:none}
input::placeholder{color:#6f6253;font-style:italic}
input:focus,select:focus,textarea:focus{outline:none;border-bottom-color:var(--notte)}
.btn{display:inline-block;background:var(--bue);color:var(--avorio);border:1px solid var(--bue);padding:14px 30px;
     font-family:'EB Garamond',Georgia,serif;font-size:14px;letter-spacing:.3em;text-transform:uppercase;cursor:pointer;border-radius:0}
.btn:hover{background:var(--notte);border-color:var(--notte)}
.btn:disabled{opacity:.55;cursor:default}
.btn.mini{padding:8px 14px;font-size:11px;letter-spacing:.2em}
.btn.ghost{background:transparent;border-color:var(--ottone);color:var(--crema)}
.msg{font-size:15px;margin:12px 0;min-height:1em;font-style:italic}
.msg.ok{color:#7fbf8a}.msg.err{color:var(--notte)}
.muted{color:#9a8b78;font-size:15px}
/* grana leggera, come la pellicola */
body::after{content:"";position:fixed;inset:-50%;pointer-events:none;z-index:50;opacity:.07;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grana 1s steps(4) infinite}
@keyframes grana{0%{transform:translate(0,0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-2%,-1%)}100%{transform:translate(0,0)}}
@media (prefers-reduced-motion:reduce){body::after{animation:none}}