/* Pagina Strumenti ed estrattori (30/10) */
.titolo-strumenti{margin:40px 0 16px;font-family:var(--display);font-weight:800;font-size:34px;text-transform:uppercase;line-height:1;color:var(--notte)}
.strumenti{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.strumento{display:flex;gap:16px;align-items:flex-start;padding:20px;border-radius:14px;background:var(--notte);color:#E8EEF7;text-decoration:none;border:1px solid var(--linea);transition:transform .22s ease,box-shadow .22s ease,border-color .2s}
.strumento:hover{transform:translateY(-4px);box-shadow:0 16px 32px -14px rgba(14,27,51,.55);border-color:var(--ambra)}
.strumento-ic{flex-shrink:0;width:48px;height:48px;border-radius:12px;display:grid;place-items:center;background:var(--ambra);color:var(--notte)}
.strumento-ic svg{width:26px;height:26px}
.strumento b{display:block;font-family:var(--display);font-weight:800;font-size:26px;text-transform:uppercase;line-height:1;color:#F6F1E7;margin-bottom:6px}
.strumento>span>span{font-size:15px;line-height:1.5;color:#B9C6DB}
.link-gruppo h3{margin:28px 0 10px;font-family:var(--label);font-weight:700;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--grigio)}
.link-lista{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.link-lista li{background:var(--carta);border:1px solid var(--sabbia);border-radius:12px;padding:16px 18px;transition:border-color .15s}
.link-lista li:hover{border-color:var(--blu)}
.link-lista a{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;text-decoration:none;color:var(--inchiostro)}
.link-lista a b{font-family:var(--label);font-weight:700;font-size:18px}
.link-lista a:hover b{color:var(--blu);text-decoration:underline}
.link-dominio{font-family:var(--label);font-size:13px;color:var(--grigio)}
.link-lista p{margin:6px 0 0;font-size:15px;line-height:1.5;color:var(--grigio)}
.nota-link{margin-top:28px;font-family:var(--label);font-size:14px;color:var(--grigio)}

/* ── Estrattori ── */
.estr-griglia{display:grid;grid-template-columns:minmax(280px,380px) minmax(0,1fr);gap:28px;align-items:start;margin-top:12px}
.estr-pannello{display:flex;flex-direction:column;gap:8px;background:var(--carta);border:1px solid var(--sabbia);border-radius:14px;padding:20px}
.estr-pannello label{font-family:var(--label);font-weight:700;font-size:14px;letter-spacing:.04em}
.estr-pannello textarea,.estr-pannello input[type=number]{font:inherit;font-size:16px;color:var(--inchiostro);background:var(--crema);border:1px solid #CFC4B1;border-radius:8px;padding:10px 12px;width:100%}
.estr-pannello textarea{resize:vertical;min-height:200px;font-family:var(--label);line-height:1.5}
.estr-conta,.estr-calcolo{margin:0;font-family:var(--label);font-size:14px;color:var(--grigio)}
.estr-calcolo b{color:var(--inchiostro)}
.estr-riga{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:6px}
.estr-riga input[type=number]{width:96px}
.estr-spunta{display:flex;gap:8px;align-items:flex-start;font-weight:600 !important;letter-spacing:0 !important;margin-top:6px}
.estr-spunta input{margin-top:3px;accent-color:var(--blu)}
.estr-scorciatoie{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-family:var(--label);font-size:13px;color:var(--grigio)}
.estr-scorciatoie button{font:inherit;font-weight:700;font-size:13px;padding:6px 10px;border-radius:999px;border:1.5px solid var(--sabbia);background:transparent;color:var(--inchiostro);cursor:pointer}
.estr-scorciatoie button:hover,.estr-scorciatoie button[aria-pressed="true"]{border-color:var(--blu);color:var(--blu)}
.estr-via{margin-top:10px;font-family:var(--label);font-weight:700;font-size:17px;letter-spacing:.04em;padding:14px 18px;border-radius:10px;border:0;background:var(--ambra);color:#0E1B33;cursor:pointer;transition:background .15s,transform .15s}
.estr-via:hover{background:var(--ambra2)}
.estr-via:active{transform:scale(.97)}
.estr-via:disabled{opacity:.6;cursor:default}

.estr-palco{position:relative;min-height:420px;border-radius:18px;padding:28px;overflow:hidden;color:#EEF2F8;
  background:radial-gradient(60% 60% at 80% 10%,rgba(242,165,74,.16),transparent 70%),radial-gradient(50% 60% at 10% 100%,rgba(159,211,234,.12),transparent 70%),linear-gradient(160deg,#16274A,#0E1B33 60%,#0B1528)}
.estr-suoni{position:absolute;top:12px;right:12px;z-index:4;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;cursor:pointer;
  border:1px solid rgba(238,242,248,.3);background:rgba(8,17,31,.55);color:#EEF2F8;transition:background .15s,color .15s,border-color .15s}
.estr-suoni:hover{background:#F2A54A;border-color:#F2A54A;color:#0E1B33}
.estr-suoni[aria-pressed="false"]{color:#A9B7CF}
.estr-suoni:focus-visible{outline:3px solid #F2A54A;outline-offset:3px}
.estr-palco{padding-top:60px}
.estr-azioni{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.estr-azioni button{font-family:var(--label);font-weight:700;font-size:15px;padding:10px 16px;border-radius:8px;cursor:pointer;border:1.5px solid rgba(238,242,248,.4);background:transparent;color:#EEF2F8}
.estr-azioni button:first-child{background:#F2A54A;border-color:#F2A54A;color:#0E1B33}
.estr-azioni button:hover{filter:brightness(1.08)}

/* estrazione nomi: la "ruota" che scorre i nomi */
.estr-ruota{position:relative;height:150px;border-radius:14px;display:grid;place-items:center;overflow:hidden;
  background:rgba(8,17,31,.55);box-shadow:inset 0 0 0 2px rgba(242,165,74,.35)}
.estr-ruota::before,.estr-ruota::after{content:"";position:absolute;left:0;right:0;height:38px;pointer-events:none;z-index:1}
.estr-ruota::before{top:0;background:linear-gradient(#0E1B33,transparent)}
.estr-ruota::after{bottom:0;background:linear-gradient(transparent,#0E1B33)}
.estr-ruota span{font-family:var(--display);font-weight:800;font-size:clamp(34px,5vw,58px);text-transform:uppercase;line-height:1;text-align:center;padding:0 16px;color:#F6F1E7;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.estr-ruota.gira span{animation:estr-scorri .09s linear infinite;color:#B9C6DB}
.estr-ruota.vinto{box-shadow:inset 0 0 0 3px #F2A54A,0 0 40px rgba(242,165,74,.35)}
.estr-ruota.vinto span{color:#F7B866;animation:estr-pop .5s cubic-bezier(.2,1.6,.4,1)}
@keyframes estr-scorri{from{transform:translateY(-30%);opacity:.5}to{transform:translateY(30%);opacity:.5}}
@keyframes estr-pop{0%{transform:scale(.6)}100%{transform:scale(1)}}
.estr-vincitori{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;counter-reset:v}
.estr-vincitori li{counter-increment:v;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:10px;background:rgba(242,165,74,.12);border:1px solid rgba(242,165,74,.4);
  font-family:var(--label);font-weight:700;font-size:17px;animation:estr-entra .45s cubic-bezier(.2,.9,.3,1.2)}
.estr-vincitori li::before{content:counter(v);flex-shrink:0;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#F2A54A;color:#0E1B33;font-size:14px}
@keyframes estr-entra{from{opacity:0;transform:translateY(14px) scale(.92)}to{opacity:1;transform:none}}
.scintilla{position:absolute;width:8px;height:8px;border-radius:2px;pointer-events:none;z-index:3;animation:scintilla 1s ease-out forwards}
@keyframes scintilla{from{opacity:1;transform:translate(0,0) rotate(0)}to{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--r))}}

/* estrattore gruppi: il mazzo che si mescola e i party che si riempiono */
.estr-mazzo:empty{display:none}
.estr-party:empty::before{content:"I party compariranno qui";display:grid;place-items:center;grid-column:1/-1;min-height:300px;border:1.5px dashed rgba(159,211,234,.25);border-radius:12px;font-family:var(--label);font-weight:600;color:#A9B7CF}
.estr-mazzo{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;min-height:40px;padding:8px}
.estr-mazzo .gettone{font-family:var(--label);font-weight:700;font-size:13px;padding:6px 10px;border-radius:999px;background:rgba(159,211,234,.14);border:1px solid rgba(159,211,234,.35);color:#DCEEF6}
.estr-mazzo.mescola .gettone{animation:mescola .32s ease-in-out infinite alternate}
.estr-mazzo.mescola .gettone:nth-child(3n){animation-duration:.27s;animation-delay:-.1s}
.estr-mazzo.mescola .gettone:nth-child(3n+1){animation-duration:.36s;animation-delay:-.2s}
@keyframes mescola{from{transform:translate(-6px,-4px) rotate(-6deg)}to{transform:translate(6px,4px) rotate(6deg)}}
.estr-party{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;margin-top:8px}
.party-carta{border-radius:12px;background:rgba(8,17,31,.5);border:1px solid rgba(159,211,234,.25);padding:14px;animation:estr-entra .35s ease-out both}
.party-carta h3{margin:0 0 10px;display:flex;justify-content:space-between;align-items:baseline;font-family:var(--display);font-weight:800;font-size:24px;text-transform:uppercase;color:#F7B866}
.party-carta h3 small{font-family:var(--label);font-size:13px;font-weight:700;color:#A9B7CF}
.party-carta.riserve{border-style:dashed}
.party-carta.riserve h3{color:#9FD3EA}
.party-carta ol{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px}
.party-carta li{font-family:var(--label);font-weight:700;font-size:15px;padding:7px 10px;border-radius:8px;background:rgba(238,242,248,.08)}
.party-carta li.volo{position:relative;z-index:2}
.party-carta li.vuoto{background:transparent;border:1px dashed rgba(238,242,248,.18);color:transparent}

@media (max-width:860px){
  .estr-griglia{grid-template-columns:minmax(0,1fr)}
  .estr-palco{min-height:0;padding:58px 20px 20px}
}
@media (prefers-reduced-motion:reduce){
  .estr-ruota.gira span,.estr-ruota.vinto span,.estr-vincitori li,.estr-mazzo.mescola .gettone,.party-carta,.scintilla{animation:none !important}
}
html:not([data-tema="chiaro"]) body.lettura .titolo-strumenti{color:#F1F4F9}
html:not([data-tema="chiaro"]) body.lettura .estr-pannello :is(textarea,input[type=number]){background:#121A2D;border-color:#3A4766}

.torna-strumenti{display:inline-flex;align-items:center;gap:8px;margin:0 0 18px;padding:9px 16px 9px 12px;border-radius:999px;border:1.5px solid var(--blu);
  font-family:var(--label);font-weight:700;font-size:14px;letter-spacing:.04em;color:var(--blu);text-decoration:none;transition:background .15s,color .15s}
.torna-strumenti:hover{background:var(--blu);color:var(--crema)}
.torna-strumenti:focus-visible{outline:3px solid var(--ambra);outline-offset:3px}
.torna-fondo{margin:32px 0 0}