/* ============================================================
   NÈMM — design token condivisi
   Unica fonte di verità per colori, tipografia e forme.
   ============================================================ */

:root{
  /* gradiente brand */
  --grad-brand: linear-gradient(45deg,#feda75,#fa7e1e,#d62976,#962fbf);
  --grad-cta:   linear-gradient(45deg,#fa7e1e,#d62976,#962fbf);
  --grad-short: linear-gradient(45deg,#fa7e1e,#d62976);
  --grad-vote:  linear-gradient(45deg,#962fbf,#4f5bd5);

  /* accenti */
  --rosa:  #f082b6;
  --viola: #962fbf;
  --verde: #2ecf8e;
  --rosso: #ff6b81;
  --carta: #faf8f2;

  /* colori membri */
  --m-blu:     #4f5bd5;
  --m-magenta: #d62976;
  --m-arancio: #fa7e1e;
  --m-viola:   #962fbf;
  --m-verde:   #2aa876;

  /* superficie scura (default ovunque) */
  --bg:        #0d0d13;
  --bg-deep:   #0a0a0d;
  --text:      #f4f4f6;
  --text-2:    #a5a5b0;
  --text-3:    #7c7c88;
  --text-quiet:#8a8a96;
  --text-muted2:#c7c7cf;

  --glass:      rgba(255,255,255,.07);
  --card-solido: rgba(30,30,40,.72);   /* superficie piena: stessa resa del vetro, senza costo */
  --glass-soft: rgba(255,255,255,.06);
  --glass-light:rgba(255,255,255,.05);
  --border:     rgba(255,255,255,.14);
  --border-soft:rgba(255,255,255,.12);
  --border-dashed:rgba(255,255,255,.18);
  --inset:      inset 0 1px 0 rgba(255,255,255,.16);

  --sheet-bg:    rgba(24,24,32,.9);
  --sheet-border:rgba(255,255,255,.16);
  --icon-bg:     rgba(255,255,255,.08);
  --icon-border: rgba(255,255,255,.12);
  --input-bg:    rgba(255,255,255,.07);
  --input-border:rgba(255,255,255,.14);
  --switch-off:  rgba(255,255,255,.12);
  --handle:      rgba(255,255,255,.25);
  --divider:     rgba(255,255,255,.1);
  --divider-soft:rgba(255,255,255,.07);
  --chip-on:     rgba(255,255,255,.14);
  --chip-off:    rgba(255,255,255,.05);
  --chip-on-border: rgba(255,255,255,.3);
  --chip-off-border:rgba(255,255,255,.1);
  --chat-other:      rgba(255,255,255,.08);
  --chat-other-border:rgba(255,255,255,.12);
  --chat-other-text: rgba(255,255,255,.5);
  --idea-bg: linear-gradient(135deg,rgba(214,41,118,.16),rgba(79,91,213,.14));

  --blob1: rgba(214,41,118,.4);
  --blob2: rgba(79,91,213,.35);
  --blob3: rgba(250,126,30,.28);

  /* tipografia */
  --font-display: 'Sora', system-ui, sans-serif;
  --font-body:    'Nunito Sans', system-ui, sans-serif;
  --font-hand:    'Caveat', cursive;

  /* forme */
  --r-card: 22px;
  --r-card-lg: 24px;
  --r-pill: 20px;
  --r-sheet: 28px;
}

/* tema chiaro dell'app */
.chiaro{
  --bg:#f5f2ec; --bg-deep:#e9e4da;
  --text:#221f2b; --text-2:#5c5866; --text-3:#847f8c; --text-quiet:#736e7a; --text-muted2:#443f4d;
  --glass:rgba(20,10,30,.05); --glass-soft:rgba(20,10,30,.04); --glass-light:rgba(20,10,30,.03);
  --card-solido:rgba(255,255,255,.72);
  --border:rgba(20,10,30,.13); --border-soft:rgba(20,10,30,.1); --border-dashed:rgba(20,10,30,.18);
  --inset:inset 0 1px 0 rgba(255,255,255,.6);
  --sheet-bg:rgba(252,250,246,.94); --sheet-border:rgba(20,10,30,.12);
  --icon-bg:rgba(20,10,30,.05); --icon-border:rgba(20,10,30,.1);
  --input-bg:rgba(20,10,30,.045); --input-border:rgba(20,10,30,.14);
  --switch-off:rgba(20,10,30,.12); --handle:rgba(20,10,30,.2);
  --divider:rgba(20,10,30,.1); --divider-soft:rgba(20,10,30,.07);
  --chip-on:rgba(20,10,30,.1); --chip-off:rgba(20,10,30,.03);
  --chip-on-border:rgba(20,10,30,.18); --chip-off-border:rgba(20,10,30,.08);
  --chat-other:rgba(20,10,30,.05); --chat-other-border:rgba(20,10,30,.1); --chat-other-text:rgba(34,20,40,.5);
  --idea-bg:linear-gradient(135deg,rgba(214,41,118,.1),rgba(79,91,213,.09));
  --blob1:rgba(214,41,118,.2); --blob2:rgba(79,91,213,.18); --blob3:rgba(250,126,30,.15);
}

/* ---------- primitive condivise ---------- */
*{-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-body);-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit;background:none;border:none;padding:0;margin:0;cursor:pointer;text-align:inherit}
input,textarea{font:inherit}
a{color:var(--rosa);text-decoration:none}

.sora{font-family:var(--font-display)}
.caveat{font-family:var(--font-hand)}
.grad-text{background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent}
.glass{
  background:var(--glass);
  backdrop-filter:blur(24px) saturate(1.5);
  -webkit-backdrop-filter:blur(24px) saturate(1.5);
  border:1px solid var(--border);
  box-shadow:var(--inset);
}

@keyframes popIn{0%{opacity:0;transform:scale(.92) translateY(8px)}100%{opacity:1;transform:scale(1) translateY(0)}}
@keyframes slideUp{0%{transform:translateY(100%)}100%{transform:translateY(0)}}
@keyframes heartPop{0%{transform:scale(1)}40%{transform:scale(1.35)}100%{transform:scale(1)}}
@keyframes blobDrift{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(30px,-20px) scale(1.15)}}
@keyframes riseIn{0%{opacity:0;transform:translateY(24px)}100%{opacity:1;transform:translateY(0)}}

:focus-visible{outline:2px solid var(--rosa);outline-offset:2px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto}}
