:root{
  --bg-abyss:#0a0518;
  --bg-deep:#120a24;
  --panel-glass-1:rgba(30,17,64,.62);
  --panel-glass-2:rgba(18,10,36,.68);
  --panel-glass-3:rgba(10,5,24,.55);
  --bg-main:#150c2b;
  --bg-card:#1e1140;
  --bg-elevated:#2a1a58;
  --bg-glass:rgba(30,17,64,.7);
  --primary:#8b5cf6;
  --primary-bright:#a78bfa;
  --primary-dark:#6d28d9;
  --primary-glow:rgba(139,92,246,.35);
  --primary-subtle:rgba(139,92,246,.1);
  --gold:#ffb300;
  --gold-bright:#ffca4d;
  --gold-deep:#cc8a00;
  --gold-glow:rgba(255,179,0,.35);
  --gold-subtle:rgba(255,179,0,.08);
  --fire:#c026d3;
  --fire-bright:#e879f9;
  --fire-glow:rgba(192,38,211,.4);
  --success:#00e0a0;
  --success-glow:rgba(0,224,160,.3);
  --danger:#ff3860;
  --danger-glow:rgba(255,56,96,.3);
  --text-primary:#f3eefe;
  --text-secondary:#b3a3d9;
  --text-muted:#7c6a9c;
  --border:rgba(255,255,255,.08);
  --border-light:rgba(255,255,255,.14);
  --font-main:Inter,-apple-system,BlinkMacSystemFont,sans-serif;
  --font-display:Outfit,Inter,sans-serif;
  --font-mono:JetBrains Mono,Fira Code,monospace;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth;height:100vh;overflow:hidden}
body{font-family:var(--font-main);font-size:.9rem;line-height:1.5;color:var(--text-primary);background:var(--bg-deep);height:100vh;overflow:hidden}
body::before{content:'';position:fixed;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(ellipse at 30% 20%,rgba(139,92,246,.03) 0%,transparent 50%),radial-gradient(ellipse at 70% 80%,rgba(255,184,0,.02) 0%,transparent 50%);animation:spotlight-drift 20s ease-in-out infinite alternate;pointer-events:none;z-index:0}
@keyframes spotlight-drift{0%{transform:translate(0,0)}100%{transform:translate(-3%,-3%)}}
#app{position:relative;z-index:1}
.screen{display:none;min-height:100vh}.screen.active{display:block;height:100vh;overflow-y:auto}
#screen-home .home-header,
#screen-crea-asta .home-header{padding-top:72px}
/* Sfondo tematico calcio per le schermate Strategie (lista, form nuova, editor): campo da gioco
   molto scurito, solo un tocco decorativo che non deve disturbare la lettura del contenuto. */
#screen-strategie-lista.active,
#screen-strategia-form.active,
#screen-strategia-editor.active{
  position:relative;
  background:
    linear-gradient(rgba(8,4,20,.86), rgba(8,4,20,.9)),
    repeating-linear-gradient(125deg, rgba(0,150,75,.16) 0px 70px, rgba(0,100,50,.10) 70px 140px),
    var(--bg-deep);
  background-attachment:fixed;
}
/* Cerchio di centrocampo e linea mediana, molto tenui, fissi al centro dello schermo */
#screen-strategie-lista.active::before,
#screen-strategia-form.active::before,
#screen-strategia-editor.active::before{
  content:'';
  position:fixed;
  top:50%; left:50%;
  width:640px; height:640px;
  transform:translate(-50%,-50%);
  z-index:0;
  pointer-events:none;
  border:2px solid rgba(255,255,255,.05);
  border-radius:50%;
}
#screen-strategie-lista.active::after,
#screen-strategia-form.active::after,
#screen-strategia-editor.active::after{
  content:'';
  position:fixed;
  top:50%; left:0; right:0;
  height:0;
  border-top:2px solid rgba(255,255,255,.045);
  z-index:0;
  pointer-events:none;
}
#screen-strategie-lista.active > *,
#screen-strategia-form.active > *,
#screen-strategia-editor.active > *{position:relative;z-index:1}
.home-header{text-align:center;padding:48px 20px 32px}
.home-logo{font-size:3rem;margin-bottom:8px;filter:drop-shadow(0 0 20px rgba(139,92,246,.4))}
.home-title{font-family:var(--font-display);font-size:clamp(1.8rem,4vw,2.8rem);font-weight:900;background:linear-gradient(135deg,var(--primary-bright),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:8px}
.home-subtitle{color:var(--text-secondary);font-size:1rem}
/* Home (menu principale): layout più compatto per far entrare tutte le voci di menu
   in una sola schermata, senza scroll, anche con più voci aggiunte nel tempo. */
#screen-menu-principale .home-header{padding:20px 20px 14px}
#screen-menu-principale .home-logo{font-size:2.1rem;margin-bottom:4px}
#screen-menu-principale .home-title{font-size:clamp(1.3rem,3.4vw,1.9rem);margin-bottom:2px}
#screen-menu-principale .home-subtitle{font-size:.86rem}
#screen-menu-principale .card{padding:10px;margin:0 auto 8px}
#screen-menu-principale .card .btn-lg{padding:11px 20px;font-size:.9rem}
#screen-menu-principale .mt-16{margin-top:8px}
.card{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:24px;max-width:700px;margin:0 auto 16px;position:relative;overflow:hidden}
.card::before{content:'';position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,var(--border-light),transparent)}
.card-title{font-family:var(--font-display);font-size:1.25rem;font-weight:800;margin-bottom:20px}
.card-title-sm{font-size:1rem;font-weight:700;margin-bottom:12px;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}
.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:12px}
.form-group{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
label{font-size:.8rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.04em}
input[type=text],input[type=number],select{background:var(--bg-main);border:1px solid var(--border);border-radius:10px;color:var(--text-primary);font-family:var(--font-main);font-size:16px;padding:10px 14px;transition:border-color .2s,box-shadow .2s;width:100%;-webkit-appearance:none}
input:focus,select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-glow)}
.file-drop{background:var(--bg-main);border:2px dashed rgba(139,92,246,.3);border-radius:12px;padding:24px;text-align:center;cursor:pointer;transition:all .2s;color:var(--text-secondary)}
.file-drop:hover,.file-drop.dragover{border-color:var(--primary);background:var(--primary-subtle);color:var(--primary-bright)}
.json-preview{background:var(--bg-main);border:1px solid var(--border);border-radius:8px;padding:10px 14px;font-size:.82rem;color:var(--success);margin-top:8px}
.json-preview.hidden{display:none}.hint-text{font-size:.78rem;color:var(--text-muted);margin-top:4px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:none;border-radius:10px;cursor:pointer;font-family:var(--font-main);font-size:.9rem;font-weight:600;padding:10px 18px;transition:all .15s;white-space:nowrap;position:relative;overflow:hidden}.btn::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,0) 55%);pointer-events:none}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0) scale(.97)}
/* position:fixed invece di sticky: su mobile (soprattutto iOS) lo sticky dentro un
   contenitore con overflow-y:auto "saltava" durante lo scroll inerziale, rendendo il
   pulsante difficile da toccare con precisione. Fixed lo ancora al viewport, sempre stabile.
   Va DOPO la regola .btn nel file: stessa specificità (0-1-0), e .btn imposta anch'essa
   position (relative) — l'ultima dichiarazione nel foglio di stile vince, quindi questa
   regola deve stare più in basso di .btn o il fixed viene silenziosamente sovrascritto. */
/* top:44px per non finire sotto a .user-email-badge (fixed anch'esso, in alto a sinistra):
   senza questo margine i due elementi si sovrappongono, il badge (z-index piu' alto) copre
   meta' del testo del bottone. Il valore mobile e' piu' basso perche' li' il badge e' piu'
   piccolo (vedi media query di .user-email-badge). */
.btn-back-sticky{position:fixed;top:44px;left:14px;z-index:50;box-shadow:0 2px 10px rgba(0,0,0,.35)}
@media (max-width:520px){
  .btn-back-sticky{top:34px}
}
.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0) scale(.98)}
/* Il "lift" al passaggio del mouse (.btn:hover sopra) va bene per i CTA normali, ma su
   un pulsante fisso in un angolo, sempre visibile, il micro-spostamento di 1px sotto al
   cursore si percepisce come se "scappasse" mentre lo si punta. Lo disattiviamo qui. */
.btn-back-sticky:hover,.btn-back-sticky:active{transform:none}
/* I bottoni #btn-back-home-menu/#btn-back-home vivono ora fuori da #app (vedi index.html),
   fratelli di tutte le .screen, quindi sempre nel DOM: la visibilità va gestita qui in base
   a quale schermata è attiva, invece che con display/JS nella sezione stessa. */
#btn-back-home-menu,#btn-back-home{display:none}
body:has(#screen-home.active) #btn-back-home-menu{display:inline-flex}
body:has(#screen-crea-asta.active) #btn-back-home{display:inline-flex}
.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;box-shadow:0 4px 15px var(--primary-glow)}
.btn-primary:hover{box-shadow:0 6px 20px rgba(139,92,246,.5)}
.btn-secondary{background:var(--bg-elevated);border:1px solid var(--border-light);color:var(--text-primary)}
.btn-secondary:hover{background:var(--bg-glass);border-color:var(--primary)}
.btn-success{background:linear-gradient(135deg,#00c853,var(--success));color:#000;font-weight:700}
.btn-danger{background:linear-gradient(135deg,var(--danger),#c90032);color:#fff;box-shadow:0 4px 12px var(--danger-glow)}
.btn-accent{background:linear-gradient(135deg,var(--gold),var(--gold-deep));color:#000;font-weight:800}
.btn-lg{padding:14px 28px;font-size:1rem;font-weight:700;border-radius:12px;width:100%}
.import-choice-buttons{display:flex;flex-direction:column;gap:12px;margin-top:12px}
.btn-small{padding:6px 12px;font-size:.8rem;border-radius:8px}.btn-block{width:100%}.btn-esci{color:#ff6b6b!important}
.link-share{display:flex;align-items:center;gap:10px;background:var(--bg-main);border-radius:10px;padding:12px 16px;flex-wrap:wrap}
.link-label{font-size:.8rem;color:var(--text-muted);white-space:nowrap}
.link-text{flex:1;font-family:var(--font-mono);font-size:.8rem;color:var(--primary-bright);word-break:break-all}
.squadre-list{list-style:none;display:flex;flex-direction:column;gap:8px}
.squadre-list li{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--bg-main);border-radius:8px}
.sq-dot.online{color:var(--success)}.sq-dot.offline{color:var(--text-muted)}
.mt-8{margin-top:8px}.mt-16{margin-top:16px}
.text-muted{color:var(--text-muted)}.text-center{text-align:center}
.text-accent{color:var(--gold);font-weight:700}.text-danger{color:var(--danger)}.hidden{display:none!important}
#screen-asta{background:transparent}#screen-asta.active{display:flex!important;flex-direction:column;height:100vh;overflow:hidden}
.asta-header{position:sticky;top:0;z-index:1000;display:flex;align-items:center;justify-content:space-between;height:32px;padding:0 10px;background:rgba(6,12,24,.92);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);box-shadow:0 1px 0 rgba(139,92,246,.18),0 6px 24px rgba(0,0,0,.35)}
.asta-header-left{display:flex;align-items:center;gap:10px}
.asta-header-logo{font-size:.88rem;filter:drop-shadow(0 0 6px var(--primary-glow))}
.asta-header-title{font-family:var(--font-display);font-size:.72rem;font-weight:800;background:linear-gradient(90deg,var(--primary-bright),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.asta-header-right{display:flex;align-items:center;gap:6px}.asta-header-right .btn-small{padding:3px 8px;font-size:.68rem;border-radius:6px}
.btn-sound{background:none;border:1px solid var(--border);border-radius:6px;color:var(--text-secondary);font-size:.72rem;padding:2px 6px;cursor:pointer;transition:all .2s}
.btn-sound:hover{border-color:var(--primary);color:var(--primary-bright)}.btn-sound.muted{opacity:.4}
.asta-row-panels{display:flex;gap:10px;padding:0 12px;flex-shrink:0;align-items:stretch}
.asta-row-panels>#admin-panel{flex:1.9;max-height:clamp(160px,26vh,230px);overflow-y:auto}
.asta-row-panels>#mio-panel{flex:1;max-height:clamp(160px,26vh,230px);overflow-y:auto}
.panel-budget{background:linear-gradient(180deg,var(--panel-glass-3) 0%,var(--panel-glass-2) 100%);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--border);border-radius:14px;padding:6px 8px;flex:0.75;min-width:0;overflow-y:auto;max-height:clamp(180px,30vh,260px);box-shadow:0 10px 24px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.03)}
.panel-budget-hdr{font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);padding:0 0 2px;border-bottom:1px solid var(--border);margin-bottom:2px}
.sidebar-squadre-list{display:flex;flex-direction:column;gap:1px}
.sidebar-squadra{padding:3px 7px;border-radius:7px;border-left:3px solid transparent;transition:all .2s;background:var(--bg-card);margin-bottom:2px;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.sidebar-squadra:hover{background:var(--bg-elevated);transform:translateX(2px);box-shadow:0 2px 8px rgba(0,0,0,.3)}
.sidebar-squadra.mia-squadra{border-left-color:var(--primary);background:var(--primary-subtle)}
.sidebar-squadra.offerente-attuale{border-left-color:var(--gold);background:var(--gold-subtle)}
.sidebar-squadra.critica{border-left-color:var(--danger)}
.sq-top{display:flex;align-items:center;gap:5px;margin-bottom:1px}
.sq-dot-online{font-size:.6rem;flex-shrink:0}
.sq-nome{flex:1;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text-secondary);line-height:1}
.sidebar-squadra.mia-squadra .sq-nome{color:var(--primary-bright)}
.sidebar-squadra.offerente-attuale .sq-nome{color:var(--gold-bright)}
.sq-crediti{font-family:var(--font-display);font-size:.82rem;font-weight:800;color:var(--gold);flex-shrink:0;line-height:1;text-shadow:0 0 10px var(--gold-glow)}
.budget-progress{height:3px;border-radius:2px;background:rgba(255,255,255,.08);margin-top:1px;overflow:hidden}
.budget-progress-fill{height:100%;border-radius:4px;transition:width .5s}.budget-progress-fill.ok{background:linear-gradient(90deg,#00e0a0,#00b386)}.budget-progress-fill.warn{background:linear-gradient(90deg,var(--gold),var(--gold-deep))}.budget-progress-fill.crit{background:linear-gradient(90deg,var(--danger),#c4002e)}
.sq-bottom{display:block;font-size:.82rem;color:var(--text-secondary);margin-top:2px;font-weight:700;line-height:1.3}
.sq-portieri{margin-left:6px;opacity:1;font-size:.88rem}
.asta-row-puja{display:flex;flex-wrap:wrap;align-items:flex-start;gap:12px;padding:0 12px;flex-shrink:0}
.asta-row-puja .card-timer-group{flex:1;min-width:0}
.asta-row-puja .rilancio-box{flex:1 1 200px;min-width:180px;max-width:260px}
.asta-row-tabs{flex:1;min-height:0;display:flex;flex-direction:column;padding:0 12px 4px;overflow:hidden}
.card-timer-group{display:flex;flex-direction:column;align-items:center}
.chiamata-card{width:100%;
  background:linear-gradient(170deg,#3c2a6e 0%,#2d1f58 100%);
  border:2px solid rgba(139,92,246,.5);border-radius:20px 20px 0 0;padding:24px 28px 20px;text-align:center;
  box-shadow:0 0 60px rgba(139,92,246,.18),0 24px 50px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.08);
  position:relative;overflow:hidden;transition:border-color .3s,box-shadow .3s}
html.theme-light .chiamata-card{
  background:linear-gradient(170deg,#f1e9ff 0%,#e6d9fb 100%);
}
.chiamata-card::before{content:'';position:absolute;top:0;left:10%;right:10%;height:2px;background:linear-gradient(90deg,transparent,var(--primary),transparent);border-radius:2px;box-shadow:0 0 14px 1px var(--primary-glow);animation:cc-topbar-pulse 3s ease-in-out infinite}
.chiamata-card .chiamata-stato{color:var(--text-muted);font-size:1rem;padding:20px 0}
.cc-header{display:flex;align-items:flex-start;gap:14px;margin-bottom:16px;text-align:left}
/* Solo vista UTENTE (classe usata unicamente da renderChiamata quando !S.isAdmin):
   avatar + badge Manuale Admin impilati in colonna, cosi il badge non occupa
   larghezza extra accanto al nome del giocatore. Non tocca .cc-avatar di base
   né alcuna regola usata dalla vista admin. */
.cc-avatar-utente-col{display:flex;flex-direction:column;align-items:center;flex-shrink:0;gap:3px}
.cc-avatar-utente-col .cc-manuale-badge{margin:0!important;white-space:nowrap;font-size:.58rem!important;padding:2px 7px!important}
.cc-avatar{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:84px;height:84px;border-radius:50%;background:radial-gradient(circle at 35% 28%,#ffffff 0%,#e4e6ec 55%,#cdd0d9 100%);border:3px solid var(--primary-bright);box-shadow:0 0 0 3px rgba(139,92,246,.2),0 0 22px var(--primary-glow),inset 0 2px 6px rgba(0,0,0,.18);overflow:hidden;animation:cc-avatar-pulse 3s ease-in-out infinite}.cc-avatar-icon{font-size:1.7rem;opacity:.55;filter:grayscale(1) brightness(1.6)}.cc-avatar-initial{font-size:1.4rem;font-weight:800;color:#fff;font-family:var(--font-display);text-shadow:0 1px 4px rgba(0,0,0,.35);letter-spacing:-.02em}.cc-avatar-svg{width:78%;height:78%}.cc-avatar-img{width:100%;height:100%;object-fit:cover;border-radius:50%}.cc-nome-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cc-info{flex:1}.cc-meta{display:flex;align-items:center;gap:6px;margin-top:4px;flex-wrap:wrap}
.cc-nome{font-family:var(--font-display);font-size:clamp(1.3rem,3vw,2rem);font-weight:800;color:var(--text-primary);text-transform:uppercase;letter-spacing:-.01em;line-height:1.1;text-shadow:0 2px 10px rgba(0,0,0,.45)}
.cc-offerta{font-family:var(--font-display);font-size:clamp(2.5rem,6vw,3.8rem);font-weight:900;color:var(--gold);letter-spacing:-.03em;text-shadow:0 0 30px var(--gold-glow),0 0 60px rgba(255,184,0,.15);line-height:1.18}
.cc-offerta-label{font-size:.75rem;font-weight:600;text-transform:uppercase;color:var(--text-muted);letter-spacing:.08em;margin-top:2px}
.cc-body{margin-bottom:8px}.cc-offerente{font-size:.85rem;color:var(--text-secondary)}.cc-offerta-box{display:inline-flex;flex-direction:column;align-items:center;border:2px solid var(--gold);border-radius:16px;padding:6px 20px 10px;background:linear-gradient(160deg,rgba(255,202,77,.16) 0%,rgba(255,179,0,.05) 100%);box-shadow:0 0 32px rgba(255,179,0,.16),inset 0 1px 0 rgba(255,255,255,.15),inset 0 -8px 18px rgba(255,179,0,.06);margin-bottom:6px;position:relative;overflow-x:hidden;overflow-y:visible}.cc-offerta-box::after{content:'';position:absolute;top:0;left:-60%;width:35%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.28),transparent);transform:skewX(-15deg);animation:cc-offerta-shimmer 3.6s ease-in-out infinite}.puja-panel-slot .cc-offerta-box,body.layout-admin .asta-row-puja .cc-offerta-box{border-width:1.5px;padding:3px 12px 6px;border-radius:12px;margin-bottom:0}
.cc-offerente strong{color:var(--text-primary);font-weight:700}
.chiamata-card.assegnata{border-color:rgba(0,230,118,.4);box-shadow:0 0 40px var(--success-glow),0 20px 40px rgba(0,0,0,.4)}
.chiamata-card.assegnata::before{background:linear-gradient(90deg,transparent,var(--success),transparent)}
.chiamata-card.scartata{border-color:rgba(74,99,128,.3)}
.cc-esito{font-family:var(--font-display);font-size:1.5rem;font-weight:800;color:var(--success)}
@keyframes rilancio-flash{0%{border-color:rgba(255,184,0,.8);box-shadow:0 0 60px var(--gold-glow),0 0 100px rgba(255,184,0,.2)}100%{border-color:rgba(139,92,246,.2);box-shadow:0 0 80px rgba(139,92,246,.05),0 20px 40px rgba(0,0,0,.4)}}
.chiamata-card.flash{animation:rilancio-flash .6s ease-out}
@keyframes card-enter{0%{opacity:0;transform:scale(.85) translateY(15px)}100%{opacity:1;transform:scale(1) translateY(0)}}
.card-enter{animation:card-enter .4s cubic-bezier(.34,1.56,.64,1)}
@keyframes price-up{0%{transform:scale(1.35);color:var(--gold-bright);filter:brightness(1.5)}100%{transform:scale(1);color:var(--gold);filter:brightness(1)}}
.price-bump{animation:price-up .35s ease-out}
.badge-ruolo{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:22px;padding:0 6px;border-radius:6px;font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.03em;flex-shrink:0}
.badge-ruolo.r-Por{background:linear-gradient(135deg,#f5a623,#e09000);color:#000}
.badge-ruolo.r-P{background:linear-gradient(135deg,#f5a623,#e09000);color:#000}
.badge-ruolo.r-Dc{background:linear-gradient(135deg,#2ecc71,#229954);color:#fff}
.badge-ruolo.r-Ds{background:linear-gradient(135deg,#27ae60,#1e8449);color:#fff}
.badge-ruolo.r-Dd{background:linear-gradient(135deg,#58d68d,#2ecc71);color:#000}
.badge-ruolo.r-D{background:linear-gradient(135deg,#2ecc71,#229954);color:#fff}
.badge-ruolo.r-B{background:linear-gradient(135deg,#1abc9c,#16a085);color:#fff}
.badge-ruolo.r-E{background:linear-gradient(135deg,#00b894,#00a381);color:#fff}
.badge-ruolo.r-M{background:linear-gradient(135deg,#4b7bec,#3867d6);color:#fff}
.badge-ruolo.r-C{background:linear-gradient(135deg,#54a0ff,#2e86de);color:#fff}
.badge-ruolo.r-W{background:linear-gradient(135deg,#a55eea,#8854d0);color:#fff}
.badge-ruolo.r-T{background:linear-gradient(135deg,#ffa502,#e68900);color:#000}
.badge-ruolo.r-A{background:linear-gradient(135deg,#ff6b6b,#ee5a24);color:#fff}
.badge-ruolo.r-Pc{background:linear-gradient(135deg,#eb3b5a,#d63031);color:#fff}
.badge-ruolo.r-XX{background:var(--bg-elevated);color:var(--text-muted)}
.cc-tipo-badge{font-size:.65rem;font-weight:800;text-transform:uppercase;padding:2px 7px;border-radius:5px}
.tipo-RIC{background:rgba(139,92,246,.15);color:var(--primary-bright);border:1px solid rgba(139,92,246,.3)}
.tipo-PLUS{background:rgba(255,184,0,.15);color:var(--gold);border:1px solid rgba(255,184,0,.3)}
.tipo-U21{background:rgba(0,224,160,.15);color:var(--success);border:1px solid rgba(0,224,160,.3)}
.timer-ring-container{position:relative;width:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(170deg,var(--bg-main) 0%,var(--bg-card) 100%);border:1px solid rgba(139,92,246,.15);border-top:none;border-radius:0 0 20px 20px;padding:14px 0 18px;box-shadow:0 20px 40px rgba(0,0,0,.3);overflow:hidden}
.timer-ring{width:90px;height:90px;filter:drop-shadow(0 0 10px rgba(139,92,246,.2));position:relative;z-index:1}
.timer-progress{transition:stroke-dashoffset .9s linear}
/* Pallone che percorre l'anello seguendo il conto alla rovescia, con una leggera rotazione mentre si muove */
.timer-ball{position:absolute;left:50%;top:6%;width:15%;height:15%;transform:translate(-50%,-50%);
  display:flex;align-items:center;justify-content:center;
  filter:drop-shadow(0 1px 3px rgba(0,0,0,.7));transition:left .9s linear,top .9s linear;z-index:2;pointer-events:none}
.timer-ball-svg{width:100%;height:100%;animation:ball-spin 1.6s linear infinite}
@keyframes ball-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.timer-inner{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1}
/* Numero in stile tabellone/scoreboard da stadio (font mono, glow tipo LED) */
.timer-number{font-family:var(--font-mono);font-size:1.7rem;font-weight:700;color:var(--success);line-height:1;letter-spacing:-.02em;text-shadow:0 0 12px var(--success-glow),0 0 2px rgba(255,255,255,.4)}
.timer-label-text{font-size:.6rem;font-weight:600;text-transform:uppercase;color:var(--text-muted);letter-spacing:.08em;margin-top:2px;text-align:center;width:100%}
.timer-label-text::before{content:'⏱ ';opacity:.7}
.timer-ring-container.urgent{animation:timer-pulse .8s ease-in-out infinite}
.timer-ring-container.urgent .timer-number{color:var(--fire-bright);text-shadow:0 0 20px var(--fire-glow)}
.timer-ring-container.urgent .timer-ring{filter:drop-shadow(0 0 12px rgba(255,77,42,.5))}
@keyframes timer-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}
@keyframes shake{0%,100%{transform:translateX(0)}10%,30%,50%,70%,90%{transform:translateX(-4px)}20%,40%,60%,80%{transform:translateX(4px)}}
.shake{animation:shake .5s ease}
.rilancio-box{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:12px}
.rilancio-top-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.btn-rilancio-adj{background:var(--bg-elevated);border:1px solid var(--border-light);color:var(--text-primary);border-radius:8px;font-size:1.1rem;font-weight:700;width:36px;height:36px;cursor:pointer;transition:all .15s;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.btn-rilancio-adj:hover{background:var(--primary-subtle);border-color:var(--primary)}
.btn-rilancio-adj:active{transform:scale(.92)}
.inp-rilancio{width:70px!important;text-align:center;font-family:var(--font-display);font-size:1.2rem;font-weight:800;background:var(--bg-main);border:1px solid var(--border-light);border-radius:10px;color:var(--text-primary);padding:6px!important}
.quick-bids{display:flex;gap:6px}.quick-bids-row{display:flex;gap:8px;justify-content:center;margin-bottom:8px}
.manual-bid-row{display:flex;gap:8px;justify-content:center;align-items:center}
.btn-manuale{flex:0 0 auto;padding:8px 16px}
.btn-quick{background:var(--bg-elevated);border:1px solid var(--border);color:var(--text-primary);font-family:var(--font-main);font-weight:700;font-size:.88rem;padding:8px 14px;border-radius:9px;cursor:pointer;transition:all .15s}
.btn-quick:hover{background:var(--primary-subtle);border-color:var(--primary);transform:scale(1.06);color:var(--primary-bright)}
.btn-quick:active{transform:scale(.94)}.btn-quick:disabled{opacity:.3;cursor:not-allowed;transform:none}
.btn-rilancia{width:100%;background:linear-gradient(135deg,var(--fire-bright) 0%,#ff2200 100%);color:#fff;font-family:var(--font-display);font-weight:800;font-size:clamp(.85rem,3vw,1.1rem);letter-spacing:.02em;padding:15px 10px;border-radius:13px;border:none;cursor:pointer;position:relative;overflow:hidden;transition:transform .15s,box-shadow .2s;box-shadow:0 4px 20px rgba(255,77,42,.35);text-transform:uppercase;white-space:nowrap}
.btn-rilancia:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 8px 30px rgba(255,77,42,.55)}
.btn-rilancia:active{transform:translateY(0) scale(.98)}
.btn-rilancia::after{content:'';position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,.35) 50%,transparent 100%);transform:skewX(-20deg);animation:shimmer-slide 2.2s infinite}
@keyframes shimmer-slide{0%,100%{left:-120%}60%{left:140%}}
.btn-rilancia:active{transform:translateY(0) scale(.98)}
.btn-rilancia:disabled{opacity:.3;cursor:not-allowed;transform:none;box-shadow:none}
.btn-rilancia::after{content:'';position:absolute;top:-50%;left:-60%;width:40%;height:200%;background:linear-gradient(105deg,transparent 0%,rgba(255,255,255,.18) 50%,transparent 100%);transform:skewX(-15deg);transition:left .6s}
.btn-rilancia:hover::after{left:120%}
.admin-btn-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:3px;margin-top:3px}
.admin-btn-grid .btn{font-size:.68rem;padding:5px 3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Estrai è il bottone più premuto durante la puja — deve risaltare su tutti gli altri */
#btn-estrai{grid-column:1/-1;font-size:.82rem;font-weight:800;padding:9px 3px;letter-spacing:.02em;animation:pulse-estrai 2.2s ease-in-out infinite}
@keyframes pulse-estrai{0%,100%{box-shadow:0 4px 15px var(--primary-glow)}50%{box-shadow:0 4px 22px rgba(139,92,246,.75),0 0 0 3px rgba(139,92,246,.18)}}
.cc-attesa-badge{background:rgba(139,92,246,.1);border:1px solid rgba(139,92,246,.25);border-radius:8px;padding:6px 12px;font-size:.82rem;color:var(--primary-bright);margin-top:6px;text-align:center}
.cc-manuale-badge{display:inline-flex;align-items:center;gap:4px;background:linear-gradient(135deg,rgba(255,184,0,.18),rgba(255,140,0,.08));border:1px solid rgba(255,184,0,.4);color:var(--gold);font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;padding:3px 9px;border-radius:8px;margin-bottom:6px;white-space:nowrap;line-height:1.3}
.mio-panel{background:var(--panel-glass-1);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(139,92,246,.15);border-radius:14px;padding:8px 10px}
.mio-panel-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}
.mio-nome{font-family:var(--font-display);font-size:.8rem;font-weight:800;text-transform:uppercase;color:var(--primary-bright)}
.crediti-badge{font-family:var(--font-display);font-size:.8rem;font-weight:800;color:var(--gold);background:var(--gold-subtle);border:1px solid rgba(255,184,0,.25);border-radius:8px;padding:2px 8px}
.slot-counter{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}#mio-slot-counter{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-bottom:6px!important}
.slot-chip{display:flex;align-items:center;justify-content:space-between;font-size:.78rem;padding:5px 10px;background:var(--bg-main);border-radius:7px;border:1px solid var(--border);min-width:0}#mio-slot-counter .slot-chip{flex-direction:column;align-items:flex-start;justify-content:center;gap:0;padding:2px 6px;font-size:.68rem}#mio-slot-counter .slot-chip>.slot-main{display:flex;align-items:center;justify-content:space-between;width:100%;gap:4px}#mio-slot-counter .slot-sub{align-self:flex-start;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.slot-chip span{font-weight:700;color:var(--primary)}.slot-chip.esaurito span{color:var(--danger)}
.slot-sub{font-size:.68rem;color:var(--text-muted)}#mio-slot-counter .slot-sub{font-size:.56rem;line-height:1.1}.mio-panel-actions{display:flex;flex-direction:row;gap:6px;margin-top:0}.mio-panel-actions .btn{flex:1;min-width:0;padding:5px 8px;font-size:.72rem}
.admin-panel{background:var(--bg-glass);backdrop-filter:blur(12px);border:1px solid rgba(255,184,0,.25);border-radius:14px;padding:10px 12px;box-shadow:0 12px 28px rgba(0,0,0,.35),0 0 40px rgba(255,184,0,.05),inset 0 1px 0 rgba(255,255,255,.05)}
.admin-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.admin-badge{display:inline-flex;align-items:center;gap:5px;background:linear-gradient(135deg,rgba(255,184,0,.15),rgba(255,184,0,.05));border:1px solid rgba(255,184,0,.3);border-radius:7px;padding:3px 8px;font-size:.7rem;font-weight:700;color:var(--gold);text-transform:uppercase;letter-spacing:.05em}
.admin-actions{display:flex;flex-direction:column;gap:6px}
.admin-conferma-box{background:rgba(255,184,0,.05);border:1px solid rgba(255,184,0,.2);border-radius:10px;padding:10px;margin-top:6px}
.conferma-titolo{font-family:var(--font-display);font-size:.9rem;font-weight:800;color:var(--gold);margin-bottom:4px}
.conferma-info-text{font-size:.76rem;color:var(--text-secondary);margin-bottom:8px}
.conferma-actions{display:flex;flex-direction:column;gap:6px}
.riapri-row{display:flex;gap:5px;flex-wrap:wrap}.riapri-row .btn{flex:1;min-width:100px;font-size:.72rem;padding:6px 8px;white-space:normal;line-height:1.2;text-align:center}
.backup-menu{background:var(--bg-main);border:1px solid var(--border);border-radius:10px;padding:10px;margin-bottom:8px;display:flex;flex-direction:column;gap:4px}
.bk-btn{background:none;border:1px solid var(--border);border-radius:7px;color:var(--text-primary);font-size:.82rem;padding:7px 12px;cursor:pointer;text-align:left;transition:all .15s}
.bk-btn:hover{background:var(--bg-elevated);border-color:var(--primary)}.bk-btn-muted{color:var(--text-muted)}
.fine-asta-export-row{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.fine-asta-export-row .bk-btn{flex:1 1 140px;text-align:center;padding:10px 12px}
.storico-esportazioni-modal{max-width:560px;width:calc(100vw - 32px)}
#storico-esportazioni-lista{display:flex;flex-direction:column;gap:8px;max-height:50vh;overflow-y:auto}
.storico-export-item{background:var(--bg-main);border:1px solid var(--border);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:8px}
.storico-export-info{display:flex;flex-direction:column;gap:2px}
.storico-export-data{font-weight:700;font-size:.86rem;color:var(--text-primary)}
.storico-export-meta{font-size:.76rem;color:var(--text-muted);text-transform:capitalize}
.storico-export-actions{display:flex;flex-wrap:wrap;gap:6px}
.storico-export-actions .bk-btn{flex:1 1 auto;text-align:center;font-size:.74rem;padding:6px 8px}
.bk-btn-danger{color:#e74c3c;border-color:rgba(231,76,60,.35)}
.bk-btn-danger:hover{background:rgba(231,76,60,.14);border-color:#e74c3c}
.popup-override{background:rgba(255,77,42,.05);border:1px solid rgba(255,77,42,.2);border-radius:10px;padding:6px;margin-top:4px}
.popup-override p{font-size:.72rem;color:var(--text-secondary);margin-bottom:4px}
.popup-override .btn{margin:2px 3px 2px 0;font-size:.7rem;padding:4px 8px}
/* Quando c'è una decisione admin in attesa (popup RIC/PLUS o timer scaduto), la priorità è vedere
   SUBITO i bottoni di conferma senza scroll: nascondiamo temporaneamente la grid di bottoni admin
   (Estrai/Manuale/Assegna/Annulla/Reintr./Timer/Termina) finché la decisione non è risolta */
.admin-panel:has(#popup-override-box:not(.hidden)) .admin-btn-grid,
.admin-panel:has(#admin-conferma-box:not(.hidden)) .admin-btn-grid{display:none}
/* Il pannello non deve più tagliare/scrollare quando c'è una decisione in attesa: si espande per intero */
.admin-panel:has(#popup-override-box:not(.hidden)),
.admin-panel:has(#admin-conferma-box:not(.hidden)),
.admin-panel.force-show-btns{max-height:none!important;overflow-y:visible!important}
/* Ripristino manuale: l'admin può comunque far tornare visibili i bottoni azione con un click
   (il JS toglie anche .hidden da #admin-actions-box, che altrimenti resterebbe display:none) */
.admin-panel.force-show-btns .admin-btn-grid{display:grid!important}
.toggle-admin-btns{display:none}
.admin-panel:has(#popup-override-box:not(.hidden)) .toggle-admin-btns,
.admin-panel:has(#admin-conferma-box:not(.hidden)) .toggle-admin-btns{display:inline-flex}
.tabs-panel{background:linear-gradient(180deg,var(--panel-glass-1) 0%,var(--panel-glass-2) 100%);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--border);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;flex:1;min-height:0;box-shadow:0 12px 30px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.04)}
.tabs-nav{display:flex;gap:3px;border-bottom:1px solid var(--border);background:linear-gradient(180deg,var(--panel-glass-2) 0%,var(--panel-glass-3) 100%);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);padding:3px}
.tab-btn{position:relative;flex:1;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:5px;background:rgba(255,255,255,.02);border:1px solid transparent;border-bottom:2px solid transparent;color:var(--text-muted);font-family:var(--font-main);font-size:.76rem;font-weight:600;padding:5px 10px;margin:1px;border-radius:9px;cursor:pointer;transition:all .22s cubic-bezier(.4,0,.2,1);white-space:nowrap;overflow:hidden}.tab-icon{font-size:1rem;line-height:1}.tab-label{position:relative;font-size:.7rem;text-transform:uppercase;letter-spacing:.04em}
.tab-btn:hover{color:var(--text-primary);background:var(--bg-elevated);border-color:var(--border-light);transform:translateY(-1px)}
.tab-btn.active{color:#fff;border-bottom-color:transparent;background:linear-gradient(135deg,var(--primary) 0%,var(--fire) 100%);box-shadow:0 4px 18px var(--primary-glow),inset 0 1px 0 rgba(255,255,255,.25);border-radius:10px;text-shadow:0 1px 4px rgba(0,0,0,.3);transform:translateY(-1px)}.tab-btn.active::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,0) 55%);pointer-events:none}.tab-btn.active:hover{transform:translateY(-1px)}
.tab-content{display:none;padding:14px;overflow-y:auto}.tab-content.active{display:flex;flex-direction:column;flex:1;min-height:0;overflow-y:auto}.tab-content.active.tab-rose-content{padding:0;overflow:hidden;display:flex;flex-direction:column}
.storico-list{list-style:none;display:flex;flex-direction:column;gap:3px}
.storico-list li{display:flex;align-items:center;gap:5px;padding:5px 8px;background:var(--bg-main);border-radius:7px;font-size:.78rem;flex-wrap:wrap}
.storico-nome{flex:1;font-weight:600;color:var(--text-primary)}.storico-sq{color:var(--text-secondary);font-size:.75rem}
.storico-prezzo{color:var(--gold);font-weight:700;font-family:var(--font-display)}
.storico-tipo{padding:1px 6px;border-radius:4px;font-size:.68rem;font-weight:700;text-transform:uppercase}
.storico-manuale-tag{margin-right:2px;opacity:.85;font-size:.85em}
.tipo-tag-asta{background:rgba(139,92,246,.12);color:var(--primary-bright)}
.tipo-tag-riconferma{background:rgba(0,230,118,.12);color:var(--success)}
.tipo-tag-recompra{background:rgba(255,184,0,.12);color:var(--gold)}
.tipo-tag-plusvalenza{background:rgba(165,94,234,.15);color:#c49bff}
.tipo-tag-con_svincolo{background:rgba(255,77,42,.12);color:var(--fire-bright)}
.tipo-tag-scartato{background:rgba(74,99,128,.2);color:var(--text-muted)}
.tipo-tag-tradeoff{background:rgba(139,92,246,.12);color:var(--primary-bright)}
.filtro-ruolo{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:8px}
.filtro-btn{background:var(--bg-elevated);border:1px solid var(--border);color:var(--text-secondary);border-radius:7px;padding:4px 8px;font-size:.7rem;font-weight:600;cursor:pointer;transition:all .15s}
.filtro-btn.active{background:var(--primary-subtle);border-color:var(--primary);color:var(--primary-bright)}
.liberi-list{list-style:none;display:flex;flex-direction:column;gap:3px;flex:1;min-height:0;overflow-y:auto}
.liberi-list li{display:flex;align-items:center;gap:6px;padding:5px 8px;background:var(--bg-main);border-radius:7px;font-size:.78rem}
.liberi-list li.scartato{opacity:.5;filter:grayscale(.7);cursor:default}
.liberi-list li.scartato .l-nome{text-decoration:line-through}
.l-scartato-tag{font-size:.6rem;font-weight:800;letter-spacing:.04em;color:var(--text-muted);background:rgba(255,255,255,.08);padding:1px 6px;border-radius:5px;text-transform:uppercase}
.libero-nome{flex:1;font-weight:500}.libero-sq{font-size:.72rem;color:var(--text-muted)}
.libero-costo{font-family:var(--font-display);font-weight:700;color:var(--gold);font-size:.85rem}
.btn-chiama-libero{background:var(--primary-subtle);border:1px solid rgba(139,92,246,.3);color:var(--primary-bright);border-radius:7px;padding:4px 10px;font-size:.75rem;cursor:pointer;transition:all .15s}
.btn-chiama-libero:hover{background:var(--primary);color:#fff}
.tab-content.active.tab-rose-content{position:relative;padding:0;display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}.rose-container{flex:1;min-height:0;overflow-x:auto;overflow-y:auto;display:flex;gap:4px;padding:8px;align-items:flex-start}
.rose-search-row{display:flex;gap:4px;margin:2px 8px;flex-wrap:nowrap;max-width:240px;align-items:center}
.rose-chevron{display:inline-flex;align-items:center;justify-content:center;margin-left:6px;font-size:1.3rem;line-height:1;padding:6px 8px;border-radius:6px;transition:transform .2s,background .15s;cursor:pointer}.rose-chevron:hover{background:rgba(255,255,255,.12)}
.rose-chevron.open{transform:scale(1.15);background:rgba(255,255,255,.18)}
#tab-rose .rose-search-row{position:relative;z-index:20;background:var(--bg-card);border:1px solid var(--border);border-radius:6px;padding:1px 3px;box-shadow:0 2px 8px rgba(0,0,0,.3);margin:2px 8px;max-width:240px;width:calc(100% - 16px);flex-shrink:0;align-items:center}
#tab-rose .rose-search-row .rose-search-close-btn{background:none;border:none;color:var(--text-muted);font-size:.75rem;cursor:pointer;padding:0 2px;flex-shrink:0;display:flex;align-items:center;height:20px}
#tab-rose .rose-search-row .rose-search-close-btn:hover{color:var(--text-primary)}
.rose-search-dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--bg-card);border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.5);max-height:240px;overflow-y:auto;z-index:2}
.rose-search-dropdown.hidden{display:none}
.rose-search-item{padding:8px 10px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:.8rem;color:var(--text-primary);border-bottom:1px solid var(--border-light)}
.rose-search-item:last-child{border-bottom:none}
.rose-search-item:hover{background:var(--primary-subtle)}
.rose-search-item-sq{font-size:.68rem;color:var(--text-muted);white-space:nowrap}
.rose-search-empty{padding:10px;font-size:.78rem;color:var(--text-muted);text-align:center}
.rose-player.highlight-flash{animation:rose-highlight-flash 1.8s ease-out}
@keyframes rose-highlight-flash{0%{background:var(--gold-glow);box-shadow:0 0 0 2px var(--gold)}70%{background:var(--gold-glow);box-shadow:0 0 0 2px var(--gold)}100%{background:transparent;box-shadow:none}}
#tab-rose .rose-search-row.hidden{display:none}
.rose-sel,.rose-inp{flex:1;min-width:0;padding:1px 6px;font-size:12px;line-height:1.1;height:20px}
.rose-cerca-btn{padding:1px 8px;border-radius:5px;background:var(--primary-subtle);border:1px solid rgba(139,92,246,.3);color:var(--primary-bright);cursor:pointer;font-size:.62rem;transition:all .15s;white-space:nowrap;height:20px}
.rose-cerca-btn:hover{background:var(--primary);color:#fff}
.rose-sec-hdr{background:var(--bg-main);border:1px solid var(--border);border-radius:8px;padding:8px 12px;margin-bottom:6px;font-size:.78rem;font-weight:700;text-transform:uppercase;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:space-between;transition:all .2s}
.rose-sec-hdr:hover{border-color:var(--primary);color:var(--text-primary)}
.rose-sec-content{overflow:hidden}
.rose-sq-title{font-family:var(--font-display);font-size:.9rem;font-weight:800;color:var(--primary-bright);margin-bottom:8px;text-transform:uppercase}
.rose-giocatore{display:flex;align-items:center;gap:7px;padding:6px 10px;background:var(--bg-main);border-radius:7px;margin-bottom:4px;font-size:.8rem}
.rose-nome{flex:1}.rose-prezzo{font-family:var(--font-display);font-weight:700;color:var(--gold);font-size:.82rem}
.modal-overlay{position:fixed;inset:0;z-index:2000;background:rgba(3,6,10,.85);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:20px}
.modal-overlay.hidden{display:none!important}
.modal{background:var(--bg-card);border:1px solid var(--border-light);border-radius:20px;padding:28px;max-width:480px;width:100%;max-height:90vh;overflow-y:auto;position:relative;box-shadow:0 30px 60px rgba(0,0,0,.6)}
.modal::before{content:'';position:absolute;top:0;left:15%;right:15%;height:1px;background:linear-gradient(90deg,transparent,var(--border-light),transparent)}
.modal.modal-lg{max-width:600px}.modal.hidden{display:none}
.modal-title{font-family:var(--font-display);font-size:1.3rem;font-weight:800;margin-bottom:16px}
.modal-subtitle{font-size:.85rem;color:var(--text-secondary);margin-bottom:16px}
.modal-body{margin-bottom:16px}.modal-body p{margin-bottom:8px;color:var(--text-secondary)}
.modal-body strong{color:var(--text-primary)}.modal-detail{font-size:.85rem}
.modal-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;margin-top:16px}
.modal-actions .btn{flex:1;min-width:120px}
.ac-crediti-lista{max-height:260px;overflow-y:auto;margin-top:8px}
.tradeoff-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0}
.tradeoff-card{background:var(--bg-elevated);border:1px solid var(--border);border-radius:12px;padding:16px;cursor:pointer;transition:all .2s;display:flex;flex-direction:column;align-items:center;gap:6px;font-family:var(--font-main)}
.tradeoff-card:hover{background:var(--primary-subtle);border-color:var(--primary);transform:translateY(-2px)}
.to-cedi{font-size:.85rem;color:var(--text-secondary);font-weight:600}
.to-arrow{font-size:1rem;color:var(--text-muted)}.to-ricevi{font-size:1rem;font-weight:800;color:var(--success)}
.sv-lista{max-height:280px;overflow-y:auto;display:flex;flex-direction:column;gap:5px;margin:12px 0}
.sv-item{display:flex;align-items:center;gap:10px;padding:9px 14px;background:var(--bg-main);border-radius:9px;border:1px solid var(--border);cursor:pointer;transition:all .15s}
.sv-item.selected{border-color:var(--danger);background:rgba(255,23,68,.06)}
.sv-item-nome{flex:1;font-weight:600;font-size:.85rem}.sv-item-costo{font-family:var(--font-display);font-weight:700;color:var(--gold)}
.sv-totale{font-size:.85rem;color:var(--text-secondary);padding:8px 0;border-top:1px solid var(--border);margin-top:4px}
.sv-totale strong{color:var(--text-primary)}
.annulla-storico-lista{max-height:340px;overflow-y:auto;display:flex;flex-direction:column;gap:6px}
.annulla-item{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--bg-main);border-radius:9px;cursor:pointer;transition:all .15s;border:1px solid transparent}
.annulla-item:hover{background:rgba(255,23,68,.06);border-color:rgba(255,23,68,.3)}
.annulla-nome{flex:1;font-weight:600}.annulla-sq{color:var(--text-secondary);font-size:.8rem}
.annulla-prezzo{font-family:var(--font-display);font-weight:700;color:var(--gold)}.mr-lista{max-height:400px;overflow-y:auto}
.toast-container{position:fixed;bottom:20px;right:20px;z-index:9999;display:flex;flex-direction:column;gap:8px;pointer-events:none;max-width:340px}
.toast{background:var(--bg-elevated);border:1px solid var(--border-light);border-radius:12px;padding:12px 16px;font-size:.85rem;font-weight:500;box-shadow:0 8px 24px rgba(0,0,0,.4);animation:toast-in .3s ease-out;pointer-events:auto}
.toast.success{border-left:3px solid var(--success)}.toast.error{border-left:3px solid var(--danger)}
.toast.info{border-left:3px solid var(--primary)}.toast.warning{border-left:3px solid var(--gold)}
@keyframes toast-in{from{opacity:0;transform:translateX(20px) scale(.95)}to{opacity:1;transform:translateX(0) scale(1)}}
.screen-emergenza{position:fixed;inset:0;z-index:5000;background:rgba(3,6,10,.95);backdrop-filter:blur(20px);display:flex;align-items:center;justify-content:center}
.screen-emergenza.hidden{display:none}
.emerg-card{text-align:center;max-width:400px;padding:40px 24px}
.emerg-icon{font-size:3rem;margin-bottom:16px;animation:emerg-pulse 1.5s ease-in-out infinite}
@keyframes emerg-pulse{0%,100%{opacity:1}50%{opacity:.5}}
.emerg-titolo{font-family:var(--font-display);font-size:1.5rem;font-weight:800;color:var(--danger);margin-bottom:8px}
.emerg-msg{color:var(--text-secondary);margin-bottom:20px}
.emerg-spinner{width:36px;height:36px;border-radius:50%;border:3px solid var(--border);border-top-color:var(--primary);animation:spin .9s linear infinite;margin:16px auto}
@keyframes spin{to{transform:rotate(360deg)}}
.emerg-actions{display:flex;flex-direction:column;gap:10px;margin-top:16px}.emerg-btn{width:100%}
.emerg-sub{font-size:.75rem;color:var(--text-muted);margin-top:16px}
.riepilogo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;max-width:1000px;margin:0 auto 16px;padding:0 16px}
.riepilogo-card{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:18px}
.riepilogo-squadra-nome{font-family:var(--font-display);font-size:1rem;font-weight:800;color:var(--primary-bright);margin-bottom:10px;text-transform:uppercase}
.riepilogo-giocatore{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px solid var(--border);font-size:.82rem}
.riepilogo-giocatore:last-child{border-bottom:none}
.riepilogo-crediti{font-family:var(--font-display);font-size:1.2rem;font-weight:800;color:var(--gold);text-align:right;margin-top:10px}
@keyframes screen-flash{0%{box-shadow:inset 0 0 100px rgba(255,184,0,.08)}100%{box-shadow:inset 0 0 0 transparent}}
.arena-center.flash-rilancio,.asta-row-puja.flash-rilancio{animation:screen-flash .4s ease-out}
@media(max-width:768px){
.asta-row-panels{flex-wrap:wrap;max-height:none!important}
.asta-row-panels>#admin-panel,.asta-row-panels>#mio-panel,.panel-budget{max-height:none!important;flex:1 1 200px}
.asta-row-puja .rilancio-box{flex:0 0 auto;width:100%}
.card-timer-group{top:104px}
.timer-ring{width:70px;height:70px}.timer-number{font-size:1.4rem}
.rilancio-box{position:fixed;bottom:0;left:0;right:0;z-index:700;border-radius:16px 16px 0 0;border:1px solid var(--border);border-bottom:none;padding:12px 12px calc(12px + env(safe-area-inset-bottom));background:rgba(15,31,56,.96);backdrop-filter:blur(16px)}
.rilancio-top-row{justify-content:center}
.asta-row-puja .rilancio-box{position:static!important;border-radius:12px;border:1px solid var(--border);padding:12px}
#screen-asta.active{height:auto;overflow-y:auto}
html,body{height:auto!important;min-height:100vh;overflow:auto!important}
.asta-row-tabs{min-height:300px}
.card{max-width:100%;margin:0 0 12px}.modal{padding:20px;border-radius:16px 16px 0 0}
.modal-overlay{align-items:flex-end;padding:0}.tradeoff-grid{grid-template-columns:1fr}
.toast-container{bottom:140px;right:12px;left:12px;max-width:100%}
}
::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--bg-elevated);border-radius:5px}
::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}
/* Lobby escape row */
.lobby-escape-row{display:flex;justify-content:center;margin-top:24px;padding-bottom:16px}
.lobby-escape-row .btn-secondary{opacity:.7;font-size:.8rem}
.lobby-escape-row .btn-secondary:hover{opacity:1}
/* ── Rose columns (full-screen horizontal layout) ── */
.rose-col{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;min-width:140px;flex:0 0 auto;overflow:visible;transition:box-shadow .2s;padding:6px}
.rose-col.attiva{border-color:var(--gold);box-shadow:0 0 20px var(--gold-glow)}
.rose-col-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:6px;border-bottom:1px solid var(--border);margin-bottom:6px}
.rose-col-slots{display:grid;grid-template-columns:1fr 1fr;gap:3px;margin-bottom:6px}.rose-col-slots .slot-chip{font-size:.62rem;padding:2px 5px}
.rose-col-nome{font-family:var(--font-display);font-size:.78rem;font-weight:800;color:var(--text-primary)}
.rose-col-budget{font-size:.74rem;font-weight:700;color:var(--gold)}
.rose-col-budget.attiva{color:var(--fire-bright)}
.rose-section{margin-bottom:5px}
.rose-sec-hdr{cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:3px 7px;background:var(--bg-main);border:1px solid var(--border);border-radius:7px;margin-bottom:3px;font-size:.7rem;font-weight:700;color:var(--text-secondary)}
.rose-sec-hdr:hover{border-color:var(--primary);color:var(--text-primary)}
.rose-sec-hdr.collapsed + .rose-sec-body{display:none}
.rose-sec-body{}
.rose-player{display:flex;align-items:center;gap:5px;padding:2px 4px;border-radius:5px;margin-bottom:1px;background:var(--bg-main);font-size:.68rem}
.rose-player.rose-riga-por{background:rgba(255,217,59,.12);border-left:3px solid #f2b400}
.rose-player.rose-riga-verde{background:rgba(46,204,113,.12);border-left:3px solid #229954}
.rose-player.rose-riga-azzurro{background:rgba(75,123,236,.12);border-left:3px solid #3867d6}
.rose-player.rose-riga-viola{background:rgba(165,94,234,.12);border-left:3px solid #8854d0}
.rose-player.rose-riga-rosso{background:rgba(231,76,60,.12);border-left:3px solid #c0392b}
.rose-badge{font-size:.54rem;font-weight:800;padding:1px 3px;border-radius:4px;background:var(--bg-elevated);color:var(--text-secondary);min-width:15px;text-align:center}
.rose-badge.ruolo-rose-por,.rose-badge.ruolo-rose-p{background:linear-gradient(135deg,#f5a623,#e09000);color:#000}
.rose-badge.ruolo-rose-dc{background:linear-gradient(135deg,#2ecc71,#229954);color:#fff}
.rose-badge.ruolo-rose-ds{background:linear-gradient(135deg,#27ae60,#1e8449);color:#fff}
.rose-badge.ruolo-rose-dd{background:linear-gradient(135deg,#58d68d,#2ecc71);color:#000}
.rose-badge.ruolo-rose-d{background:linear-gradient(135deg,#2ecc71,#229954);color:#fff}
.rose-badge.ruolo-rose-b{background:linear-gradient(135deg,#1abc9c,#16a085);color:#fff}
.rose-badge.ruolo-rose-e{background:linear-gradient(135deg,#00b894,#00a381);color:#fff}
.rose-badge.ruolo-rose-m{background:linear-gradient(135deg,#4b7bec,#3867d6);color:#fff}
.rose-badge.ruolo-rose-c{background:linear-gradient(135deg,#54a0ff,#2e86de);color:#fff}
.rose-badge.ruolo-rose-w{background:linear-gradient(135deg,#a55eea,#8854d0);color:#fff}
.rose-badge.ruolo-rose-t{background:linear-gradient(135deg,#ffa502,#e68900);color:#000}
.rose-badge.ruolo-rose-a{background:linear-gradient(135deg,#ff6b6b,#ee5a24);color:#fff}
.rose-badge.ruolo-rose-pc{background:linear-gradient(135deg,#eb3b5a,#d63031);color:#fff}
.rose-nome{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* ══ Toggle Visione compatta (Rose) ══ */
.rose-compatta-row{display:flex;justify-content:flex-end;padding:4px 10px 0}
.rose-compatta-toggle{display:flex;align-items:center;gap:6px;cursor:pointer;font-size:.76rem;color:var(--text-secondary);font-weight:600;user-select:none}
.rose-compatta-toggle input{display:none}
.rose-compatta-slider{width:32px;height:18px;border-radius:10px;background:var(--bg-elevated);border:1px solid var(--border);position:relative;transition:background .2s;flex-shrink:0}
.rose-compatta-slider::before{content:'';position:absolute;width:14px;height:14px;border-radius:50%;background:var(--text-muted);top:1px;left:1px;transition:transform .2s,background .2s}
.rose-compatta-toggle input:checked + .rose-compatta-slider{background:var(--gold)}
.rose-compatta-toggle input:checked + .rose-compatta-slider::before{transform:translateX(14px);background:#1a1200}
/* ══ Modalità Visione compatta: righe più basse, meno spazio orizzontale, più giocatori a schermo ══ */
.rose-container.rose-compatta{gap:2px;padding:4px}
.rose-container.rose-compatta .rose-col{min-width:110px;padding:4px;border-radius:9px}
.rose-container.rose-compatta .rose-col-header{padding-bottom:3px;margin-bottom:3px}
.rose-container.rose-compatta .rose-col-nome{font-size:.76rem}
.rose-container.rose-compatta .rose-col-budget{font-size:.72rem}
.rose-container.rose-compatta .rose-col-slots{gap:3px;margin-bottom:5px}
.rose-container.rose-compatta .rose-sec-hdr{padding:3px 6px;margin-bottom:3px;font-size:.64rem}
.rose-container.rose-compatta .rose-player{padding:2px 4px;margin-bottom:1px;font-size:.64rem;gap:4px}
.rose-container.rose-compatta .rose-badge{font-size:.5rem;padding:1px 2px;min-width:13px}
.rose-container.rose-compatta .rose-prezzo{font-size:.6rem;padding:1px 5px}
.rose-container.rose-compatta .slot-chip{font-size:.58rem;padding:1px 4px}
.rose-prezzo{font-family:var(--font-display);font-weight:800;color:#1a1200;font-size:.68rem;background:linear-gradient(135deg,var(--gold-bright),var(--gold));padding:1px 7px;border-radius:8px;flex-shrink:0}
.rose-empty{color:var(--text-muted);font-size:.68rem;padding:3px 6px;font-style:italic}
/* ══════ RIGA 1 middle slot (puja per NON-admin) ══════ */
/* ══ Layout partecipante NON-admin: riga puja tutta orizzontale (card+timer+rilancio in fila),
   niente stacking verticale → niente scroll, sfrutta la larghezza extra lasciata da admin-panel nascosto ══ */
.puja-panel-slot{flex:4;min-width:0;overflow:visible;display:flex;flex-direction:row;align-items:stretch;gap:10px}
.puja-panel-slot .card-timer-group{width:auto;flex:1;min-width:0;flex-direction:row;align-items:stretch;gap:10px}
.puja-panel-slot .rilancio-box{width:auto;flex:0 0 220px;min-width:0;display:flex;flex-direction:column;justify-content:center}
/* La card diventa orizzontale (badge+nome+meta a sinistra, offerta a destra) come nel layout admin, per restare bassa */
.puja-panel-slot .chiamata-card{flex:1 1 0%;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;border-radius:14px;text-align:left;overflow:hidden}
.puja-panel-slot .chiamata-card .chiamata-stato{padding:0;font-size:.88rem}
.puja-panel-slot .cc-header{margin-bottom:0;align-items:center;gap:8px;flex:0 0 auto;min-width:0;overflow:visible;flex-shrink:0;min-height:24px}
.puja-panel-slot .cc-avatar{width:56px;height:56px}.puja-panel-slot .cc-avatar-icon{font-size:1.15rem}.puja-panel-slot .cc-avatar-initial{font-size:1rem}.puja-panel-slot .cc-avatar-svg{width:78%;height:78%}
.puja-panel-slot .cc-nome{font-size:.94rem;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.puja-panel-slot .cc-meta{margin-top:0;font-size:.7rem;flex-wrap:wrap;overflow:visible}
.puja-panel-slot .cc-body{margin-bottom:0;display:flex;align-items:center;gap:8px;flex:0 0 auto;white-space:nowrap}
.puja-panel-slot .cc-offerta{font-size:1.7rem;color:var(--gold);text-shadow:0 0 20px var(--gold-glow)}
.puja-panel-slot .cc-offerta-label{font-size:.68rem;margin-top:0;font-weight:700}
.puja-panel-slot .cc-offerente{font-size:.68rem}
.puja-panel-slot .timer-ring-container{padding:0;flex:0 0 auto;width:auto;display:flex;flex-direction:column;align-items:center;justify-content:center}
.puja-panel-slot .timer-ring{width:56px;height:56px}
.puja-panel-slot .timer-number{font-size:1.2rem}
.puja-panel-slot .timer-label-text{font-size:.66rem}
.puja-panel-slot .rilancio-box{padding:8px 12px;gap:6px}
.puja-panel-slot .quick-bids-row{margin-bottom:0;gap:8px}
.puja-panel-slot .btn-quick{padding:6px 12px;font-size:.82rem}
.puja-panel-slot .btn-rilancia{padding:8px 18px;font-size:.88rem;width:100%}
.puja-panel-slot .manual-bid-row{margin:0}
.puja-panel-slot .inp-rilancio{padding:5px!important;font-size:16px!important;width:64px!important}
/* Budget squadre e Mio team più stretti quando è visibile la riga puja del partecipante */
body.layout-partecipante .asta-row-panels{align-items:stretch}
body.layout-partecipante .asta-row-panels>.panel-budget{max-height:28vh;align-self:stretch;overflow-y:auto;flex:0.6}
body.layout-partecipante .asta-row-panels>#mio-panel{max-height:28vh;align-self:stretch;overflow-y:auto;flex:0.7}
/* La card di chiamata (con fascia strategia) non deve mai essere tagliata dal
   limite di altezza dei pannelli laterali: si auto-dimensiona col contenuto
   e non viene 'stretch'-ata alla stessa altezza di budget/team (che restano
   compatti con scroll interno). Solo vista UTENTE (layout-partecipante). */
body.layout-partecipante .asta-row-puja{display:none!important}
body.layout-partecipante .asta-row-panels{max-width:1900px;margin-left:auto;margin-right:auto;width:100%}
@media (min-width:1500px){
body.layout-partecipante .asta-row-panels{justify-content:center}
body.layout-partecipante .asta-row-panels>.panel-budget{flex:0 1 320px!important;max-width:320px}
body.layout-partecipante .puja-panel-slot{flex:0 1 900px!important;max-width:900px}
body.layout-partecipante .asta-row-panels>#mio-panel{flex:0 1 320px!important;max-width:320px}
}
/* ══════ RIGA 2 compatta orizzontale (puja per ADMIN) ══════ */
body.layout-admin .asta-row-puja{align-items:stretch;padding:5px 10px;gap:8px;min-height:clamp(130px,18vh,175px);height:auto;overflow:visible}
body.layout-admin .asta-row-puja .card-timer-group{flex-direction:row;align-items:stretch;gap:10px;flex:1;min-width:0;min-height:0;overflow:visible;height:auto}
body.layout-admin .asta-row-puja .chiamata-card{border-radius:10px;padding:6px 14px;text-align:left;box-shadow:none;min-height:0;overflow:visible;height:auto;flex:1 1 0%;min-width:0}
body.layout-admin .asta-row-puja .cc-attesa-badge{display:block;font-size:.62rem;padding:3px 8px;margin-top:3px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}
body.layout-admin .asta-row-puja .chiamata-card .chiamata-stato{padding:0;font-size:.82rem;white-space:nowrap}
body.layout-admin .asta-row-puja .chiamata-card{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:nowrap;overflow:visible;height:auto}
body.layout-admin .asta-row-puja .cc-header{margin-bottom:0;align-items:center;gap:8px;flex:1 1 auto;min-width:0;overflow:hidden}
body.layout-admin .asta-row-puja .cc-avatar{width:56px;height:56px}body.layout-admin .asta-row-puja .cc-avatar-icon{font-size:1.15rem}body.layout-admin .asta-row-puja .cc-avatar-initial{font-size:1rem}body.layout-admin .asta-row-puja .cc-avatar-svg{width:78%;height:78%}
body.layout-admin .asta-row-puja .cc-info{min-width:0;overflow:hidden}
body.layout-admin .asta-row-puja .cc-nome{font-size:1.05rem;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.layout-admin .asta-row-puja .cc-meta{margin-top:0;flex-wrap:wrap;overflow:visible}
body.layout-admin .asta-row-puja .cc-offerta{font-size:2.6rem;color:var(--gold);text-shadow:0 0 20px var(--gold-glow),0 0 40px rgba(255,184,0,.2)}
body.layout-admin .asta-row-puja .cc-offerta-label{display:block;font-size:.72rem;font-weight:700}
body.layout-admin .asta-row-puja .cc-body{margin-bottom:0;display:flex;align-items:center;gap:8px;flex:0 0 auto;white-space:nowrap}
body.layout-admin .asta-row-puja .cc-offerente{font-size:.76rem;white-space:nowrap}
body.layout-admin .asta-row-puja .timer-ring-container{padding:0;border:none;border-radius:0;width:auto;height:100%;flex:0 0 auto;background:transparent;box-shadow:none;display:flex;align-items:center}
body.layout-admin .asta-row-puja .timer-ring{width:52px;height:52px}
body.layout-admin .asta-row-puja .timer-number{font-size:1.05rem}
body.layout-admin .asta-row-puja .timer-label-text{display:block;font-size:.52rem}
body.layout-admin .asta-row-puja .rilancio-box{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;align-items:center;justify-content:center;padding:6px 10px;gap:6px 8px;flex:0 0 260px;border-radius:10px}
body.layout-admin .asta-row-puja .btn-rilancia{padding:7px 8px;font-size:.72rem;letter-spacing:0;width:100%;white-space:nowrap;grid-column:1 / 3;grid-row:1}
body.layout-admin .asta-row-puja .quick-bids-row{margin-bottom:0;grid-column:1;grid-row:2;display:flex;gap:4px}
body.layout-admin .asta-row-puja .inp-rilancio{width:50px!important;font-size:16px!important}
body.layout-admin .asta-row-puja .manual-bid-row{margin:0;grid-column:2;grid-row:2;display:flex;gap:4px}
body.layout-admin .asta-row-puja .btn-manuale{padding:6px 10px;font-size:.82rem}
/* ══════ Pillola compatta Assegna/Chiama — dentro tabs-nav, attaccata a destra, admin-only ══════ */
.quick-pill{display:none;margin-left:auto;align-items:center;gap:8px;padding:6px 10px}
body.layout-admin .quick-pill{display:flex}
.pill-btn{width:34px;height:34px;border-radius:11px;border:1px solid rgba(255,255,255,.14);font-size:1rem;line-height:1;cursor:pointer;color:var(--text-primary);display:flex;align-items:center;justify-content:center;transition:transform .18s,box-shadow .18s,filter .18s;flex-shrink:0;position:relative;overflow:hidden}
.pill-btn::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.22) 0%,rgba(255,255,255,0) 55%);pointer-events:none}
.pill-btn:hover{transform:translateY(-2px) scale(1.06);filter:brightness(1.1)}
.pill-btn:active{transform:translateY(0) scale(.95)}
#pill-assegna{background:linear-gradient(135deg,var(--success) 0%,#00c853 100%);color:#04220f;box-shadow:0 3px 10px rgba(0,200,83,.35),inset 0 1px 0 rgba(255,255,255,.25)}
#pill-assegna:hover{box-shadow:0 5px 16px rgba(0,200,83,.5),inset 0 1px 0 rgba(255,255,255,.3)}
#pill-chiama{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff;box-shadow:0 3px 10px rgba(139,92,246,.4),inset 0 1px 0 rgba(255,255,255,.2)}
#pill-chiama:hover{box-shadow:0 5px 16px rgba(139,92,246,.55),inset 0 1px 0 rgba(255,255,255,.25)}
/* ══════ Liberi list — nuovo layout con Valore Algoritmico ══════ */
.liberi-list li{gap:6px}
.l-nome{flex:1;font-weight:600;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.l-tipo-badge{font-size:.62rem;font-weight:800;text-transform:uppercase;padding:2px 6px;border-radius:5px;flex-shrink:0}
.l-tipo-badge.tipo-NN{background:var(--bg-elevated);color:var(--text-muted)}
.l-orig{font-size:.68rem;color:var(--text-muted);flex-shrink:0;white-space:nowrap}
.l-valore-wrap{display:flex;flex-direction:column;align-items:flex-end;flex-shrink:0;min-width:44px}
.l-valore{font-family:var(--font-display);font-weight:900;color:var(--gold-bright);font-size:1rem;line-height:1;text-shadow:0 0 12px var(--gold-glow)}
.l-valore-label{font-size:.55rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em}
.l-costo{font-size:.68rem;color:var(--text-muted);flex-shrink:0}
/* ══════ Modal Assegna manuale / Chiama live search ══════ */
.cm-filtri-ruolo{display:flex;gap:5px;flex-wrap:wrap;margin:10px 0}
.cm-filtri-ruolo .filtro-btn{padding:4px 9px;font-size:.72rem}
.cm-lista{max-height:320px;overflow-y:auto;display:flex;flex-direction:column;gap:5px;margin-top:8px}
.cm-item{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--bg-main);border-radius:9px;border:1px solid var(--border);cursor:pointer;transition:all .15s}
.cm-item:hover{background:var(--primary-subtle);border-color:var(--primary)}
.cm-item.selected{border-color:var(--gold);background:var(--gold-subtle)}
.cm-item-nome{flex:1;font-weight:600;font-size:.85rem}
.cm-item-info{font-size:.72rem;color:var(--text-muted)}
.am-prezzo-row{display:flex;gap:10px;align-items:center;margin:12px 0}
/* ══════ Impostazioni Admin — card squadra (Crediti/Slot RIC/Slot PLUS/Recompra) ══════ */
.settings-team-card {
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 10px;
  padding: 10px 12px;
  margin-bottom: 10px;
  background: rgba(255,255,255,.02);
}
.settings-team-nome {
  font-weight: 700;
  margin-bottom: 8px;
  text-transform: uppercase;
  font-size: .8rem;
  opacity: .85;
}
.settings-team-fields {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.settings-field label {
  display: block;
  font-size: .68rem;
  text-transform: uppercase;
  opacity: .7;
  margin-bottom: 4px;
}
@media (max-width: 480px) {
  .settings-team-fields { grid-template-columns: repeat(2, 1fr); }
}
/* ══════ Club reale del giocatore (es. "Inter") — mostrato in card chiamata/Puja e conferme RIC ══════ */
.cc-club {
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  padding: 2px 7px;
  border-radius: 5px;
  background: var(--primary-subtle);
  color: var(--primary-bright);
  letter-spacing: .02em;
}
/* ══════ VISTA PARTICIPANTE: superficie única integrada ══════ */
.puja-panel-slot{
  background:linear-gradient(170deg,var(--bg-card) 0%,var(--bg-main) 100%);
  border:1px solid var(--primary-glow);
  border-radius:18px;
  box-shadow:0 0 40px -12px var(--primary-glow);padding:14px 20px;
}
.puja-panel-slot .chiamata-card{
  background:none;border:none;box-shadow:none;border-radius:0;padding:0;
  flex:0 1 auto;justify-content:flex-start;
}
.puja-panel-slot .chiamata-card::before{display:none}
.puja-panel-slot .card-timer-group{border-right:1px solid var(--border-light);padding-right:18px}
.puja-panel-slot .timer-ring-container{
  flex:1;width:auto;background:none;border:none;box-shadow:none;
}
.puja-panel-slot .timer-ring{width:96px;height:96px}
.puja-panel-slot .timer-number{font-size:1.8rem}
.puja-panel-slot .timer-label-text{font-size:.72rem}
.puja-panel-slot .rilancio-box{
  background:none;border:none;box-shadow:none;padding:0;padding-left:18px;
}
.puja-panel-slot .inp-rilancio{width:85px!important}
.puja-panel-slot .rilancio-box{position:static!important;bottom:auto!important;left:auto!important;right:auto!important;top:auto!important;z-index:auto!important;border-radius:14px!important;border-bottom:none!important}
/* ══════ VISTA ADMIN: superficie única integrada ══════ */
body.layout-admin .asta-row-puja{
  background:linear-gradient(170deg,var(--bg-card) 0%,var(--bg-main) 100%);
  border:1px solid var(--primary-glow);
  border-radius:14px;
}
body.layout-admin .asta-row-puja .chiamata-card{
  background:none;border:none;box-shadow:none;border-radius:0;
  flex:0 1 auto;
}
.asta-row-puja .chiamata-card::before{display:none}
body.layout-admin .asta-row-puja .timer-ring-container{
  flex:1;background:none;border:none;box-shadow:none;
}
body.layout-admin .asta-row-puja .timer-ring{width:72px;height:72px}
body.layout-admin .asta-row-puja .timer-number{font-size:1.3rem}
body.layout-admin .asta-row-puja .timer-label-text{font-size:.6rem}
body.layout-admin .asta-row-puja .rilancio-box{
  background:none;border:none;box-shadow:none;
}
body.layout-admin .asta-row-puja .inp-rilancio{width:85px!important}
/* ══════ Fix v2: timer davvero grande e centrato (card compatta a sinistra, timer domina il centro) ══════ */
body.layout-admin .asta-row-puja .chiamata-card{
  flex:0 1 190px!important;max-width:190px;min-width:120px;
  flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;gap:3px;
}
body.layout-admin .asta-row-puja .cc-body{flex-direction:column!important;align-items:flex-start!important;gap:2px;flex-wrap:wrap;overflow:hidden;width:100%}
body.layout-admin .asta-row-puja .cc-nome{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
body.layout-admin .asta-row-puja .cc-offerente{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
body.layout-admin .asta-row-puja .timer-ring-container{
  flex:1!important;display:flex;align-items:center;justify-content:center;
}
body.layout-admin .asta-row-puja .timer-ring{width:100px!important;height:100px!important}
body.layout-admin .asta-row-puja .timer-number{font-size:1.7rem!important}
body.layout-admin .asta-row-puja .timer-label-text{font-size:.66rem!important}
.puja-panel-slot .chiamata-card{
  flex:0 1 220px!important;max-width:260px;min-width:150px;
  flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;gap:4px;
}
.puja-panel-slot .cc-body{flex-direction:column!important;align-items:flex-start!important;gap:2px;flex-wrap:wrap;overflow:visible;width:100%}
.puja-panel-slot .cc-nome{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.puja-panel-slot .cc-offerente{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.puja-panel-slot .timer-ring-container{flex:1!important;display:flex;align-items:center;justify-content:center}
.puja-panel-slot .timer-ring{width:110px!important;height:110px!important}
.puja-panel-slot .timer-number{font-size:2rem!important}
.puja-panel-slot .timer-label-text{font-size:.78rem!important}
/* ══════ Fallback larghezze strette (admin) — evita che il timer scompaia o la riga vada in overflow ══════ */
body.layout-admin .asta-row-puja .timer-ring-container{flex:1 1 60px!important;min-width:60px}
/* ══ Avatar giocatore ampliato in chiamata-card (admin + partecipante) ══ */
body.layout-admin .asta-row-puja .chiamata-card{position:relative!important;padding:8px 14px 8px 134px!important}
body.layout-admin .asta-row-puja .cc-avatar{width:118px!important;height:auto!important;position:absolute!important;left:8px!important;top:8px!important;bottom:8px!important;border-radius:14px!important}
body.layout-admin .asta-row-puja .cc-avatar-icon{font-size:2.2rem!important}
body.layout-admin .asta-row-puja .cc-avatar-initial{font-size:2rem!important}
body.layout-admin .asta-row-puja .cc-avatar-svg{width:90%!important;height:90%!important}
body.layout-admin .asta-row-puja .cc-avatar-img{border-radius:14px!important}
.puja-panel-slot .chiamata-card{position:relative!important;padding:8px 14px 8px 96px!important;max-width:340px!important;flex:1.4 1 0%!important;min-width:200px!important;min-height:0!important;overflow:visible!important;align-items:flex-start!important;justify-content:flex-start!important}
.puja-panel-slot .cc-avatar{width:78px!important;height:78px!important;position:absolute!important;left:8px!important;top:8px!important;border-radius:12px!important}
.puja-panel-slot .cc-avatar-icon{font-size:1.5rem!important}
.puja-panel-slot .cc-avatar-initial{font-size:1.3rem!important}
.puja-panel-slot .cc-avatar-svg{width:88%!important;height:88%!important}
.puja-panel-slot .cc-avatar-img{border-radius:12px!important}
@media (max-width:700px){
  body.layout-admin .asta-row-puja .chiamata-card{flex:0 1 120px!important;max-width:120px!important;min-width:80px!important;padding:4px 8px 4px 54px!important}
  body.layout-admin .asta-row-puja .cc-nome{font-size:.82rem!important}
  body.layout-admin .asta-row-puja .cc-header{gap:5px!important}
  body.layout-admin .asta-row-puja .badge-ruolo{min-width:18px!important;height:16px!important;font-size:.55rem!important;padding:0 4px!important}
  body.layout-admin .asta-row-puja .cc-avatar{width:38px!important;height:38px!important}
  body.layout-admin .asta-row-puja .cc-avatar-icon{font-size:.85rem!important}body.layout-admin .asta-row-puja .cc-avatar-initial{font-size:.72rem!important}body.layout-admin .asta-row-puja .cc-avatar-svg{width:72%!important;height:72%!important}
  body.layout-admin .asta-row-puja .cc-meta,body.layout-admin .asta-row-puja .cc-offerente{font-size:.62rem!important}
  body.layout-admin .asta-row-puja .cc-offerta{font-size:1.9rem!important}
  body.layout-admin .asta-row-puja .cc-offerta-label{font-size:.62rem!important}
  body.layout-admin .asta-row-puja .timer-ring-container{flex:1 1 56px!important;min-width:56px}
  body.layout-admin .asta-row-puja .timer-ring{width:56px!important;height:56px!important}
  body.layout-admin .asta-row-puja .timer-number{font-size:1.05rem!important}
  body.layout-admin .asta-row-puja .timer-label-text{font-size:.5rem!important}
  body.layout-admin .asta-row-puja .rilancio-box{flex:0 0 180px!important}
  body.layout-admin .asta-row-puja .btn-rilancia{font-size:.6rem!important;padding:6px 4px!important}
  body.layout-admin .asta-row-puja .inp-rilancio{width:48px!important;font-size:16px!important}
  body.layout-admin .asta-row-puja .btn-manuale{font-size:.66rem!important;padding:5px 6px!important}
}
@media (max-width:400px){
  body.layout-admin .asta-row-puja{gap:4px!important;padding:4px 6px!important}
  body.layout-admin .asta-row-puja .chiamata-card{flex:0 1 78px!important;max-width:78px!important;min-width:64px!important;padding:3px 5px 3px 46px!important}
  body.layout-admin .asta-row-puja .cc-nome{font-size:.68rem!important}
  body.layout-admin .asta-row-puja .cc-header{gap:3px!important}
  body.layout-admin .asta-row-puja .badge-ruolo{min-width:14px!important;height:13px!important;font-size:.48rem!important;padding:0 3px!important}
  body.layout-admin .asta-row-puja .cc-avatar{width:30px!important;height:30px!important}
  body.layout-admin .asta-row-puja .cc-avatar-icon{font-size:.65rem!important}body.layout-admin .asta-row-puja .cc-avatar-initial{font-size:.55rem!important}body.layout-admin .asta-row-puja .cc-avatar-svg{width:72%!important;height:72%!important}
  body.layout-admin .asta-row-puja .cc-meta,body.layout-admin .asta-row-puja .cc-offerente{font-size:.52rem!important}
  body.layout-admin .asta-row-puja .cc-offerta{font-size:1.5rem!important}
  body.layout-admin .asta-row-puja .cc-offerta-label{font-size:.5rem!important}
  body.layout-admin .asta-row-puja .timer-ring-container{flex:0 0 46px!important;min-width:46px!important}
  body.layout-admin .asta-row-puja .timer-ring{width:46px!important;height:46px!important}
  body.layout-admin .asta-row-puja .timer-number{font-size:.85rem!important}
  body.layout-admin .asta-row-puja .timer-label-text{font-size:.42rem!important}
  body.layout-admin .asta-row-puja .rilancio-box{flex:0 0 140px!important;padding:4px 6px!important;gap:3px 5px!important}
  body.layout-admin .asta-row-puja .btn-rilancia{font-size:.52rem!important;padding:4px 3px!important}
  body.layout-admin .asta-row-puja .inp-rilancio{width:42px!important;font-size:16px!important}
  body.layout-admin .asta-row-puja .btn-manuale{font-size:.55rem!important;padding:3px 4px!important}
}
@media (max-width:1200px){
  .puja-panel-slot{flex-wrap:nowrap!important;padding:10px 12px!important;gap:8px!important}
  .puja-panel-slot .card-timer-group{flex:1 1 100%!important;border-right:none!important;padding-right:0!important;min-width:0!important}
  .puja-panel-slot .chiamata-card{flex:0 1 220px!important;max-width:220px!important}
  .puja-panel-slot .chiamata-card{padding-left:54px!important;min-height:54px!important}
  .puja-panel-slot .cc-avatar{width:38px!important;height:38px!important;left:8px!important;border-radius:12px!important}
  .puja-panel-slot .cc-avatar-icon{font-size:.85rem!important}
  .puja-panel-slot .cc-avatar-initial{font-size:.72rem!important}
  .puja-panel-slot .timer-ring{width:60px!important;height:60px!important}
  .puja-panel-slot .timer-number{font-size:1.15rem!important}
  .puja-panel-slot .timer-label-text{font-size:.58rem!important}
  .puja-panel-slot .cc-offerta{font-size:1.7rem!important}
  .puja-panel-slot .cc-offerta-label{font-size:.68rem!important}
  .puja-panel-slot .rilancio-box{flex:1 1 100%!important;padding-left:0!important;padding-top:8px!important;border-top:1px solid var(--border-light);position:static!important;bottom:auto!important;left:auto!important;right:auto!important;z-index:auto!important;border-radius:12px!important}
  .puja-panel-slot .cc-meta small.text-muted{display:none!important}
  .puja-panel-slot .cc-strategia-info{display:block!important;margin-top:3px!important;padding-left:6px!important;font-size:.6rem!important;line-height:1.15!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:100%!important}
  .puja-panel-slot .cc-manuale-badge{font-size:.55rem!important;padding:2px 6px!important;margin:0 0 2px!important;line-height:1.2!important}
  .puja-panel-slot .cc-attesa-badge{font-size:.55rem!important;padding:2px 6px!important;margin:2px 0!important;line-height:1.2!important}
  .puja-panel-slot .cc-header{margin-bottom:2px!important}
  .puja-panel-slot .cc-nome{font-size:.85rem!important}
  .puja-panel-slot .cc-meta{font-size:.62rem!important}
  .puja-panel-slot .cc-body{margin-bottom:0!important}
  .puja-panel-slot .cc-offerta-box{padding:3px 12px 6px!important;margin-bottom:2px!important}
  .puja-panel-slot .cc-offerente{font-size:.68rem!important}
}
@media (max-width:400px){
  .puja-panel-slot{padding:8px 10px!important;gap:6px!important}
  .puja-panel-slot .chiamata-card{flex:0 1 165px!important;max-width:165px!important}
  .puja-panel-slot .chiamata-card{padding-left:46px!important;min-height:46px!important}
  .puja-panel-slot .cc-avatar{width:30px!important;height:30px!important;left:8px!important;border-radius:10px!important}
  .puja-panel-slot .cc-avatar-icon{font-size:.65rem!important}
  .puja-panel-slot .cc-avatar-initial{font-size:.55rem!important}
  .puja-panel-slot .cc-nome{font-size:.8rem!important}
  .puja-panel-slot .cc-meta,.puja-panel-slot .cc-offerente{font-size:.6rem!important}
  .puja-panel-slot .cc-offerta{font-size:1.4rem!important}
  .puja-panel-slot .cc-offerta-label{font-size:.58rem!important}
  .puja-panel-slot .timer-ring{width:48px!important;height:48px!important}
  .puja-panel-slot .timer-number{font-size:.9rem!important}
  .puja-panel-slot .timer-label-text{font-size:.48rem!important}
  .puja-panel-slot .btn-rilancia{font-size:.65rem!important;padding:6px 8px!important}
  .puja-panel-slot .inp-rilancio{width:56px!important;font-size:16px!important}
  .puja-panel-slot .cc-manuale-badge,.puja-panel-slot .cc-attesa-badge{font-size:.5rem!important;padding:1px 5px!important;margin:0 0 1px!important}
  .puja-panel-slot .cc-header{margin-bottom:1px!important}
  .puja-panel-slot .cc-offerta-box{padding:2px 10px 5px!important;margin-bottom:1px!important}
  .puja-panel-slot .cc-offerente{font-size:.58rem!important}
  .puja-panel-slot .cc-strategia-info{display:block!important;margin-top:2px!important;padding-left:5px!important;font-size:.52rem!important;line-height:1.1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:100%!important}
}
/* ══ Colori ufficiali ruoli — applicato su Chiamata/Liberi/Rose/Annulla ══ */
/* Base badge per .storico-ruolo (oggi senza stile, solo testo semplice) */
.storico-ruolo{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:24px;height:22px;padding:0 6px;border-radius:6px;
  font-size:.65rem;font-weight:800;text-transform:uppercase;
  letter-spacing:.03em;flex-shrink:0;
}
/* Por → giallo */
.badge-ruolo.r-Por,.badge-ruolo.r-P,
.ruolo-rose-por,.rose-badge.ruolo-rose-p,
.storico-ruolo.ruolo-Por,.storico-ruolo.ruolo-P{
  background:linear-gradient(135deg,#ffd93b,#f2b400);color:#000;
}
/* Dd,Ds,Dc,D,B → verde */
.badge-ruolo.r-Dd,.badge-ruolo.r-Ds,.badge-ruolo.r-Dc,.badge-ruolo.r-D,.badge-ruolo.r-B,
.ruolo-rose-dd,.ruolo-rose-ds,.ruolo-rose-dc,.ruolo-rose-d,.ruolo-rose-b,
.storico-ruolo.ruolo-Dd,.storico-ruolo.ruolo-Ds,.storico-ruolo.ruolo-Dc,.storico-ruolo.ruolo-D,.storico-ruolo.ruolo-B{
  background:linear-gradient(135deg,#2ecc71,#229954);color:#fff;
}
/* M,C,E → azzurro */
.badge-ruolo.r-M,.badge-ruolo.r-C,.badge-ruolo.r-E,
.ruolo-rose-m,.ruolo-rose-c,.ruolo-rose-e,
.storico-ruolo.ruolo-M,.storico-ruolo.ruolo-C,.storico-ruolo.ruolo-E{
  background:linear-gradient(135deg,#4b7bec,#3867d6);color:#fff;
}
/* T,W → viola */
.badge-ruolo.r-T,.badge-ruolo.r-W,
.ruolo-rose-t,.ruolo-rose-w,
.storico-ruolo.ruolo-T,.storico-ruolo.ruolo-W{
  background:linear-gradient(135deg,#a55eea,#8854d0);color:#fff;
}
/* A,Pc → rosso */
.badge-ruolo.r-A,.badge-ruolo.r-Pc,
.ruolo-rose-a,.ruolo-rose-pc,
.storico-ruolo.ruolo-A,.storico-ruolo.ruolo-Pc{
  background:linear-gradient(135deg,#e74c3c,#c0392b);color:#fff;
}
/* ══ Rebalance panel participante: laterales más anchos, medio menos dominante ══ */
body.layout-partecipante .asta-row-panels>.panel-budget{flex:1!important}
body.layout-partecipante .asta-row-panels>#puja-panel-slot{flex:2.8!important}
body.layout-partecipante .asta-row-panels>#mio-panel{flex:1!important}
/* ══ Rebalance panel admin: card/timer/rilancio más homogéneos ══ */
body.layout-admin .asta-row-puja .chiamata-card{
  flex:1.4 1 0%!important;max-width:420px!important;min-width:200px!important;
}
body.layout-admin .asta-row-puja .timer-ring-container{
  flex:0.8 1 auto!important;
}
body.layout-admin .asta-row-puja .rilancio-box{
  flex:1.4 1 0%!important;max-width:420px!important;min-width:220px!important;
}
/* ══ Ajuste móvil: preservar wrap de los 3 paneles participante bajo 768px ══ */
@media (max-width:768px){
  body.layout-partecipante .asta-row-panels>.panel-budget{flex:1 1 200px!important}
  body.layout-partecipante .asta-row-panels>#puja-panel-slot{flex:1 1 280px!important}
  body.layout-partecipante .asta-row-panels>#mio-panel{flex:1 1 200px!important}
}
/* ══ FASE 2 — STRATEGIE ══════════════════════════════════ */
.btn-logout-link{position:absolute;top:16px;right:16px;background:none;border:none;color:var(--text-secondary);font-size:.85rem;font-weight:600;cursor:pointer;padding:6px 10px}
.btn-logout-link:hover{color:var(--text-primary)}
.home-header{position:relative}
.strategia-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;background:var(--bg-main);border-radius:10px;margin-bottom:8px}
.strategia-row-nome{font-weight:700;font-size:.92rem;color:var(--text-primary)}
.strategia-row-meta{font-size:.75rem;color:var(--text-muted);margin-top:2px}
.fascia-section{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:14px;margin-top:14px}
.fascia-header{display:flex;align-items:center;gap:8px;padding:0 0 10px 10px;flex-wrap:wrap}
.fascia-nome-input{background:var(--bg-elevated);border:1px solid var(--border);color:var(--text-primary);border-radius:7px;padding:5px 8px;font-size:16px;font-weight:600;width:140px}
.fascia-colore-input{width:32px;height:32px;border:none;border-radius:7px;padding:0;background:none;cursor:pointer}
.fascia-up-btn,.fascia-down-btn,.fascia-del-btn{background:var(--bg-elevated);border:1px solid var(--border);color:var(--text-secondary);border-radius:7px;padding:4px 9px;cursor:pointer;font-size:.8rem}
.fascia-del-btn{color:var(--danger)}
.fascia-count{margin-left:auto;font-size:.75rem;color:var(--text-muted);background:var(--bg-elevated);border-radius:8px;padding:3px 9px}
.fascia-nome-fissa{font-weight:700;font-size:.9rem;color:var(--text-secondary)}
.fascia-players{display:flex;flex-direction:column;gap:6px}
/* Riga giocatore su UNA sola linea, mai a capo (flex-wrap:nowrap): nome e squadra
   si troncano con ellipsis se non ci stanno (il testo completo resta leggibile
   passandoci sopra grazie al "title"), prezzo/percentuale sono input piccoli. Se
   anche cosi' non basta (schermi molto stretti) la riga scorre in orizzontale
   invece di spezzarsi su piu' righe — a differenza del vecchio flex-wrap:wrap qui
   NON si perde/sovrappone nulla, si scorre per vedere il resto. */
.editor-player-row{display:flex;align-items:center;gap:6px;padding:6px 8px;background:var(--bg-main);border-radius:8px;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;flex-shrink:0;font-size:.76rem}
.editor-player-avatar{width:26px;height:26px;min-width:26px;border-radius:50%;object-fit:cover;flex-shrink:0;background:var(--bg-elevated)}
/* min-width esplicito necessario: un elemento flex con overflow:hidden ha
   automaticamente min-width:0 (invece del min-content), quindi senza questo
   collasserebbe a larghezza 0 (testo del tutto invisibile) su schermi stretti
   invece di limitarsi a troncare con ellipsis. */
.editor-player-nome{font-weight:600;color:var(--text-primary);min-width:46px;max-width:110px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:1}
.editor-player-squadra{color:var(--text-muted);min-width:34px;max-width:70px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:1}
.editor-player-quot,.editor-player-fvm{color:var(--text-secondary);white-space:nowrap;text-align:left;flex-shrink:0}
.editor-preferito-btn{background:none;border:none;font-size:1rem;cursor:pointer;color:var(--text-muted);padding:0 2px;flex-shrink:0}
.editor-preferito-btn.active{color:var(--gold)}
.editor-fascia-select{background:var(--bg-elevated);border:1px solid var(--border);color:var(--text-primary);border-radius:6px;padding:3px 4px;font-size:.7rem;max-width:90px;flex-shrink:0}
input.giocatore-prezzo,input.giocatore-percentuale{background:var(--bg-elevated);border:1px solid var(--border);color:var(--text-primary);border-radius:6px;padding:3px 4px;font-size:.72rem;width:46px;flex-shrink:0}
.editor-ordina-row{display:flex;align-items:center;gap:8px;margin-top:10px;flex-wrap:wrap}
.editor-ordina-row .gk-select{flex:0 1 140px;min-width:110px}
.editor-player-check{width:17px;height:17px;flex-shrink:0;cursor:pointer;accent-color:var(--primary)}
.editor-player-row.selezionato{background:var(--primary-subtle);box-shadow:inset 0 0 0 1px var(--primary)}
/* Barra azioni in blocco: sticky in cima cosi' resta raggiungibile selezionando
   giocatori sia dentro le Fasce (sopra) sia nei Non assegnati (sotto), senza dover
   scorrere avanti e indietro fino in fondo alla pagina ogni volta. */
.editor-bulk-bar{border-color:var(--primary)}
.editor-bulk-bar.hidden{display:none}
.editor-bulk-header{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.editor-bulk-count{font-weight:700;color:var(--primary-bright);white-space:nowrap}
.editor-bulk-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.editor-bulk-chip{display:inline-flex;align-items:center;gap:5px;background:var(--primary-subtle);border:1px solid var(--primary);color:var(--text-primary);border-radius:20px;padding:3px 6px 3px 10px;font-size:.72rem;white-space:nowrap}
.editor-bulk-chip-rm{background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:.9rem;line-height:1;padding:2px}
.editor-bulk-chip-rm:hover{color:var(--danger)}
.editor-bulk-azione-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px}
.editor-bulk-valore-inp{background:var(--bg-main);border:1px solid var(--border);color:var(--text-primary);border-radius:6px;padding:6px 8px;font-size:.8rem;width:80px}
#editor-bulk-fascia{flex:0 1 170px;min-width:140px}
#editor-bulk-campo{flex:0 1 70px;min-width:60px}
/* == FASE 3 == STRATEGIE NELL'ASTA == */
.liberi-strategia-bar{display:flex;align-items:center;gap:6px;flex-wrap:nowrap;flex-shrink:0;margin-left:10px;padding:0}
.liberi-strategia-btn{white-space:nowrap;padding:4px 8px;font-size:.7rem;flex-shrink:0}
.liberi-strategia-attiva-btn{background:var(--primary-subtle);border-color:var(--primary);color:var(--primary-bright)}
.liberi-icon-toggle{flex-shrink:0;width:30px;height:30px;line-height:1;display:flex;align-items:center;justify-content:center;background:var(--bg-elevated);border:1px solid var(--border);border-radius:7px;font-size:1rem;cursor:pointer;padding:0;overflow:visible;opacity:.55;transition:all .15s}
.liberi-icon-toggle.active{opacity:1;background:var(--primary-subtle);border-color:var(--primary)}
.liberi-cerca-input{flex:0 0 auto;width:150px;max-width:150px;padding:5px 10px;font-size:16px;margin:0;background:var(--gold-subtle);border:1.5px solid var(--gold);color:var(--text-primary)}
.liberi-cerca-input::placeholder{color:var(--gold-bright)}
.liberi-filtri-row{display:flex;align-items:center;gap:6px;overflow-x:auto;overflow-y:visible;flex-wrap:nowrap;flex-shrink:0;margin-bottom:6px}
.filtro-ruolo-liberi{flex-wrap:nowrap;flex-shrink:0;margin-bottom:0}
.liberi-toggle input{cursor:pointer}
.l-strategia-badge{font-size:.65rem;font-weight:700;border:1px solid;border-radius:6px;padding:1px 6px;flex-shrink:0}
.cc-strategia-info{margin-top:8px;font-size:.8rem;color:var(--text-secondary);border-left:3px solid var(--border);padding-left:8px}
.cc-strategia-vuota{color:var(--text-muted);border-left-color:var(--border)}
.strategia-modal-lista{display:flex;flex-direction:column;gap:8px;max-height:320px;overflow-y:auto;margin-top:10px}
.strategia-modal-item{display:flex;flex-direction:column;align-items:flex-start;gap:2px;background:var(--bg-main);border:1px solid var(--border);border-radius:10px;padding:10px 12px;cursor:pointer;text-align:left;width:100%}
.strategia-modal-item:hover{border-color:var(--primary)}
.strategia-modal-item-nome{font-weight:700;font-size:.88rem;color:var(--text-primary)}
.strategia-modal-item-meta{font-size:.72rem;color:var(--text-muted)}
.strategia-modal-item-rimuovi .strategia-modal-item-nome{color:var(--danger)}

/* ══════════════════════════════════════════════════════════
   GOALKEEPER PLANNER — modulo Planner (primo di una serie)
   Riutilizza le variabili di design del progetto (colori, font,
   card, badge) per garantire una perfetta integrazione visiva.
   ══════════════════════════════════════════════════════════ */
.gk-pro-badge{display:inline-block;background:linear-gradient(135deg,var(--gold),var(--gold-deep));color:#000;font-size:.6rem;font-weight:800;letter-spacing:.05em;padding:2px 7px;border-radius:20px;margin-left:6px;vertical-align:middle}
.gk-planner-screen{padding:16px;max-width:980px;margin:0 auto}
.gk-header{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.gk-header-title{flex:1}
.gk-header-title h1{font-family:var(--font-display);font-size:1.35rem;font-weight:800;margin:0}
.gk-help-btn{flex-shrink:0}
.gk-header-sub{font-size:.78rem;color:var(--text-muted);margin-top:2px}
.gk-tabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:8px;margin-bottom:14px;border-bottom:1px solid var(--border)}
.gk-tab{flex-shrink:0;background:var(--bg-elevated);border:1px solid var(--border);color:var(--text-secondary);border-radius:10px 10px 0 0;padding:8px 14px;font-size:.8rem;font-weight:600;cursor:pointer;transition:all .15s;white-space:nowrap}
.gk-tab:hover{color:var(--text-primary);border-color:var(--primary)}
.gk-tab.active{background:var(--primary-subtle);border-color:var(--primary);color:var(--primary-bright)}
.gk-view{display:none;animation:card-enter .25s ease-out}
.gk-view.active{display:block}
.gk-view-intro{font-size:.82rem;color:var(--text-secondary);margin-bottom:14px}

/* ── Ranking ── */
.gk-ranking-list{display:flex;flex-direction:column;gap:10px}
.gk-rank-card{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:14px 16px;display:flex;align-items:center;gap:14px;cursor:pointer;transition:all .15s}
.gk-rank-card:hover{border-color:var(--primary);transform:translateY(-1px)}
.gk-rank-pos{font-family:var(--font-mono);font-size:1.1rem;font-weight:800;color:var(--text-muted);min-width:28px;text-align:center}
.gk-rank-pos.top1{color:var(--gold-bright)}.gk-rank-pos.top2{color:#d0d0d0}.gk-rank-pos.top3{color:#e0a05a}
.gk-rank-teams{flex:1;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.gk-rank-team-badge{display:flex;align-items:center;gap:6px;font-size:.85rem;font-weight:600;color:var(--text-primary)}
.gk-rank-team-badge img{width:22px;height:22px;object-fit:contain}
.gk-rank-plus{color:var(--text-muted);font-size:.8rem}
.gk-rank-score{text-align:right;min-width:90px}
.gk-rank-score-num{font-family:var(--font-mono);font-size:1.25rem;font-weight:800}
.gk-rank-score-lvl{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:1px 8px;border-radius:20px;display:inline-block;margin-top:2px}
.gk-lvl-Ottimo{background:rgba(0,224,160,.18);color:var(--success)}
.gk-lvl-Buono{background:rgba(139,92,246,.18);color:var(--primary-bright)}
.gk-lvl-Discreto{background:rgba(255,179,0,.18);color:var(--gold-bright)}
.gk-lvl-Rischioso{background:rgba(255,56,96,.18);color:var(--danger)}
.gk-rank-conf{font-size:.65rem;color:var(--text-muted);margin-top:2px}
.gk-rank-costo{font-size:.68rem;font-weight:700;padding:1px 8px;border-radius:20px;display:inline-flex;align-items:center;gap:3px}
.gk-rank-costo-target{font-weight:500;opacity:.75}
.gk-rank-costo.gk-costo-ok{background:rgba(0,224,160,.14);color:var(--success)}
.gk-rank-costo.gk-costo-over{background:rgba(255,56,96,.14);color:var(--danger)}
.gk-costo-atteso{margin-top:10px;padding:8px 12px;border-radius:10px;background:var(--bg-elevated);border:1px solid var(--border);display:flex;flex-direction:column;gap:2px;font-size:.78rem}
.gk-costo-atteso.gk-costo-ok{border-color:rgba(0,224,160,.35)}
.gk-costo-atteso.gk-costo-over{border-color:rgba(255,56,96,.35)}
.gk-costo-detail{font-size:.68rem;color:var(--text-muted)}
.gk-compare-costo-row{display:flex;justify-content:space-between;gap:10px;margin-top:10px;font-size:.72rem;color:var(--text-muted)}

/* ── Selettori coppia ── */
.gk-pair-picker,.gk-round-picker{display:flex;align-items:center;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.gk-select{background:var(--bg-elevated);border:1px solid var(--border);color:var(--text-primary);border-radius:8px;padding:8px 10px;font-size:.85rem;flex:1;min-width:130px}
.gk-pair-plus{color:var(--text-muted);font-weight:700}

/* ── Team picker "a la FantaLab": card con stemma + select ── */
.gk-pair-picker-fancy{gap:14px}
.gk-team-card{background:linear-gradient(160deg,var(--bg-elevated),var(--bg-card));border-radius:16px;padding:12px 18px;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:104px;border:1px solid var(--border-light)}
.gk-team-card-a{box-shadow:0 0 0 1px var(--primary-glow),0 0 20px var(--primary-glow)}
.gk-team-card-b{box-shadow:0 0 0 1px var(--fire-glow),0 0 20px var(--fire-glow)}
.gk-team-card-badge img{width:44px;height:44px;object-fit:contain}
.gk-select-fancy{background:transparent;border:none;color:var(--text-primary);font-weight:800;font-family:var(--font-display);font-size:.82rem;text-align:center;text-transform:uppercase;letter-spacing:.03em;appearance:none;cursor:pointer;outline:none}
.gk-select-fancy option{background:var(--bg-card);color:var(--text-primary)}
.gk-compare-picker{display:flex;align-items:center;gap:14px}
.gk-compare-col{flex:1;display:flex;flex-direction:column;gap:6px}
.gk-compare-label{font-size:.75rem;color:var(--text-muted);font-weight:700;text-transform:uppercase}
.gk-compare-vs{font-family:var(--font-display);font-weight:800;color:var(--gold-bright);font-size:1.1rem}

/* ── Riepilogo coppia (score + breakdown) ── */
.gk-summary-card{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:20px;margin-bottom:16px}
.gk-summary-top{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.gk-summary-score{text-align:center}
.gk-summary-score-num{font-family:var(--font-mono);font-size:2.2rem;font-weight:800;line-height:1}
.gk-summary-score-label{font-size:.68rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}
.gk-summary-explain{font-size:.85rem;color:var(--text-secondary);margin-top:14px;line-height:1.6;border-left:3px solid var(--primary);padding-left:12px}
.gk-breakdown{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin-top:16px}
.gk-breakdown-item{background:var(--bg-elevated);border-radius:10px;padding:10px 12px}
.gk-breakdown-label{font-size:.7rem;color:var(--text-muted);margin-bottom:6px}
.gk-breakdown-bar{height:6px;border-radius:4px;background:var(--bg-main);overflow:hidden}
.gk-breakdown-bar-fill{height:100%;border-radius:4px;background:linear-gradient(90deg,var(--primary),var(--primary-bright));transition:width .5s ease}
.gk-breakdown-val{font-family:var(--font-mono);font-size:.78rem;font-weight:700;margin-top:4px}
.gk-stats-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px;margin-top:14px}
.gk-stat-box{text-align:center;background:var(--bg-elevated);border-radius:10px;padding:10px}
.gk-stat-num{font-family:var(--font-mono);font-size:1.3rem;font-weight:800;color:var(--text-primary)}
.gk-stat-lbl{font-size:.65rem;color:var(--text-muted);margin-top:2px}

/* ── Gauge circolare punteggio (stile FantaLab) ── */
.gk-gauge{position:relative;width:120px;height:120px;flex-shrink:0}
.gk-gauge-svg{width:100%;height:100%;transform:rotate(-90deg)}
.gk-gauge-track{fill:none;stroke:var(--bg-elevated);stroke-width:10}
.gk-gauge-fill{fill:none;stroke-width:10;stroke-linecap:round;transition:stroke-dashoffset .6s ease}
.gk-gauge-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.gk-gauge-num{font-family:var(--font-mono);font-size:1.9rem;font-weight:800;line-height:1}
.gk-gauge-max{font-size:.65rem;color:var(--text-muted);letter-spacing:.04em}

/* ── Mini stat pills (facili/medie/difficili/casa/fuori) ── */
.gk-mini-stats{display:flex;gap:8px;flex-wrap:wrap;flex:1;justify-content:flex-end}
.gk-mini-stat{background:var(--bg-elevated);border-radius:10px;padding:8px 12px;display:flex;flex-direction:column;align-items:center;min-width:58px}
.gk-mini-stat-num{font-family:var(--font-mono);font-weight:800;font-size:1.1rem;color:var(--text-primary)}
.gk-mini-stat-lbl{font-size:.62rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.03em}
.gk-mini-stat-facile .gk-mini-stat-num{color:var(--success)}
.gk-mini-stat-media .gk-mini-stat-num{color:var(--gold-bright)}
.gk-mini-stat-difficile .gk-mini-stat-num{color:var(--danger)}
.gk-mini-stat-molto-difficile .gk-mini-stat-num{color:#a3001e}

/* ── Card gauge "a la FantaLab": glow oro + grid statistiche 3+2 ── */
.gk-summary-fancy{display:flex;align-items:center;gap:22px;flex-wrap:wrap;background:linear-gradient(135deg,var(--bg-elevated),var(--bg-card));border:1px solid var(--gold-glow);box-shadow:0 0 0 1px var(--gold-glow),0 0 30px var(--gold-glow),inset 0 0 50px rgba(255,179,0,.04)}
.gk-summary-fancy-gauge{flex-shrink:0}
.gk-summary-fancy .gk-gauge{width:132px;height:132px}
.gk-summary-fancy .gk-gauge-num{font-size:2.1rem}
.gk-mini-stats-grid{display:flex;flex-direction:column;gap:8px;flex:1}
.gk-mini-row{display:flex;gap:8px}
.gk-mini-row .gk-mini-stat{flex:1}
.gk-mini-stat{background:var(--bg-main);border:1px solid var(--border);border-radius:12px;padding:10px 8px;display:flex;flex-direction:column;align-items:center;min-width:64px}

/* ── Heatmap 38 giornate ── */
.gk-heatmap-wrap{overflow-x:auto;margin-top:18px;padding-bottom:8px}
.gk-heatmap{display:grid;grid-auto-rows:auto;gap:3px;min-width:max-content}
.gk-heatmap-row-label{font-size:.7rem;font-weight:700;color:var(--text-secondary);display:flex;align-items:center;gap:6px;padding-right:8px;white-space:nowrap;position:sticky;left:0;background:var(--bg-card);z-index:1;width:70px;height:38px}
.gk-heatmap-row-label img{width:18px;height:18px;object-fit:contain}
.gk-heat-corner{width:70px}
.gk-heat-cell{width:34px;height:38px;border-radius:9px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font-size:.52rem;font-weight:700;color:#04120a;cursor:default;transition:transform .1s;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15)}
.gk-heat-cell img{width:16px;height:16px;object-fit:contain;filter:drop-shadow(0 1px 1px rgba(0,0,0,.4))}
.gk-heat-cell span{font-size:.5rem;line-height:1;letter-spacing:.02em}
.gk-heat-ballot{font-size:.75rem}
.gk-heat-cell:hover{transform:scale(1.18);z-index:2}
.gk-heat-facile{background:linear-gradient(135deg,#4ee39a,#00c37a);color:#00250f}
.gk-heat-media{background:linear-gradient(135deg,#ffd166,#ffab00);color:#3a2400}
.gk-heat-difficile{background:linear-gradient(135deg,#ff6b6b,#e8283e);color:#3a0008}
.gk-heat-molto_difficile{background:linear-gradient(135deg,#a3001e,#4a0009);color:#fff}
.gk-heat-cell.gk-heat-reco{box-shadow:0 0 0 2px var(--text-primary) inset}
.gk-heat-header-cell{width:34px;text-align:center;font-size:.62rem;color:var(--text-muted);font-family:var(--font-mono);font-weight:700}
.gk-heat-legend{display:flex;gap:14px;margin-top:10px;font-size:.7rem;color:var(--text-muted);flex-wrap:wrap}
.gk-heat-legend span{display:inline-flex;align-items:center;gap:5px}
.gk-heat-legend i{width:12px;height:12px;border-radius:3px;display:inline-block}



/* ── Confronto ── */
.gk-compare-result{margin-top:18px}
.gk-compare-bars{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.gk-compare-bar-row{display:flex;align-items:center;gap:10px;font-size:.78rem}
.gk-compare-bar-label{min-width:130px;color:var(--text-muted)}
.gk-compare-bar-track{flex:1;display:flex;align-items:center;gap:4px}
.gk-compare-bar-fill{height:10px;border-radius:5px}
.gk-compare-bar-fill.side-a{background:linear-gradient(90deg,var(--success),#00c37a)}
.gk-compare-bar-fill.side-b{background:linear-gradient(90deg,var(--primary),var(--primary-bright))}

/* ── Vista giornata ── */
.gk-round-label{font-family:var(--font-mono);font-weight:800;font-size:1.1rem;min-width:110px;text-align:center}
.gk-round-slider{flex:1;min-width:120px}
.gk-round-teams{display:flex;flex-direction:column;gap:6px;margin-top:12px}
.gk-round-team-row{display:flex;align-items:center;gap:10px;background:var(--bg-elevated);border-radius:8px;padding:8px 12px}
.gk-round-team-pos{font-family:var(--font-mono);font-weight:700;color:var(--text-muted);min-width:22px}
.gk-round-team-name{flex:1;font-weight:600;font-size:.85rem}
.gk-round-team-opp{font-size:.72rem;color:var(--text-muted)}
.gk-round-diff-badge{font-family:var(--font-mono);font-weight:700;font-size:.75rem;padding:3px 10px;border-radius:20px;min-width:44px;text-align:center}

/* ── Impostazioni ── */
.gk-config-section{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:16px;margin-bottom:14px}
.gk-config-section h3{font-size:.9rem;margin-bottom:12px;color:var(--text-primary)}
.gk-config-row{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:.8rem}
.gk-config-row label{flex:0 0 150px;color:var(--text-secondary)}
.gk-config-row input[type=range]{flex:1}
.gk-config-row .gk-config-val{font-family:var(--font-mono);min-width:36px;text-align:right;color:var(--text-primary);font-weight:700}
.gk-strength-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.gk-strength-item{display:flex;flex-direction:column;gap:4px;background:var(--bg-elevated);border-radius:8px;padding:8px 10px}
.gk-strength-item label{font-size:.72rem;color:var(--text-secondary);display:flex;justify-content:space-between}
.gk-config-actions{display:flex;gap:10px;flex-wrap:wrap}
.gk-config-actions .btn{flex:1;min-width:160px}
.gk-admin-only{display:none}
body.app-role-admin .gk-admin-only{display:block}
body.app-role-admin .gk-config-actions.gk-admin-only{display:flex}

@media (max-width:600px){
  .gk-heat-cell,.gk-heat-header-cell{width:24px;height:28px}
  .gk-heat-cell img{width:12px;height:12px}
  .gk-heat-cell span{font-size:.42rem}
  .gk-compare-picker{flex-direction:column}
  .gk-compare-vs{align-self:center}
}

.gk-import-hint{font-size:.78rem;color:var(--text-secondary);margin-bottom:12px;line-height:1.5}
.gk-import-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.gk-import-filename{font-size:.78rem;color:var(--text-muted);font-family:var(--font-mono)}
.gk-import-format-hint{font-size:.68rem;color:var(--text-muted);margin-bottom:10px;line-height:1.5}
.gk-import-format-hint code{background:var(--bg-elevated);padding:1px 5px;border-radius:4px;font-family:var(--font-mono)}
.gk-import-actions{display:flex;gap:8px;flex-wrap:wrap}
.gk-import-status{font-size:.75rem;margin-top:8px;font-weight:600}
.gk-import-status.ok{color:var(--success)}
.gk-import-status.err{color:var(--danger)}


/* ── Modal "Come funziona" del GK Planner ── */
.gk-help-modal{max-width:560px}
.gk-help-body{max-height:60vh;overflow-y:auto;font-size:.85rem;line-height:1.6;color:var(--text-secondary)}
.gk-help-body h3{font-family:var(--font-display);font-size:.95rem;color:var(--text-primary);margin:16px 0 6px}
.gk-help-body ul{margin:6px 0 6px 18px;padding:0}
.gk-help-body li{margin-bottom:6px}
.gk-help-tag{display:inline-block;padding:1px 8px;border-radius:20px;font-size:.72rem;font-weight:700}
.gk-help-tag-facile{background:rgba(0,224,160,.18);color:var(--success)}
.gk-help-tag-media{background:rgba(255,171,0,.18);color:var(--gold-bright)}
.gk-help-tag-difficile{background:rgba(255,56,96,.18);color:var(--danger)}
.gk-help-tag-molto-difficile{background:rgba(163,0,30,.28);color:#ff4d6d}

/* ── Toggle Portieri/Attaccanti ── */
.gk-mode-toggle{display:flex;gap:6px;padding:10px 14px 0;justify-content:center}
.gk-mode-toggle-compact{padding:8px 10px 0}
.gk-mode-btn{flex:1;max-width:160px;padding:7px 14px;border-radius:10px;border:1px solid var(--border);background:var(--bg-elevated);color:var(--text-secondary);font-weight:600;font-size:.8rem;cursor:pointer;transition:all .18s}
.gk-mode-btn.active{background:linear-gradient(135deg,var(--primary),var(--fire));color:#fff;border-color:transparent;box-shadow:0 3px 12px var(--primary-glow)}

/* ── Sub-tab Ranking (Coppie/Terzetti) ── */
.gk-ranking-subtabs{display:flex;gap:6px;padding:10px 14px 6px}
.gk-subtab{padding:5px 14px;border-radius:8px;border:1px solid var(--border);background:var(--bg-elevated);color:var(--text-secondary);font-size:.76rem;font-weight:600;cursor:pointer;transition:all .15s}
.gk-subtab.active{background:var(--primary);color:#fff;border-color:var(--primary)}

/* ── Sub-tab inline Asta (Ranking/Analisi/Confronto) ── */
.gki-subtabs{display:flex;gap:4px;padding:8px 10px 4px;background:var(--bg-main);border-bottom:1px solid var(--border)}
.gki-subtab{flex:1;padding:5px 8px;border-radius:7px;border:1px solid var(--border);background:var(--bg-elevated);color:var(--text-secondary);font-size:.72rem;font-weight:600;cursor:pointer;transition:all .15s;text-align:center}
.gki-subtab.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.gki-view{display:none}.gki-view.active{display:flex;flex-direction:column}

/* ── 3a squadra opzionale ── */
.gk-remove3-btn{padding:3px 7px;font-size:.75rem;line-height:1;border-radius:6px}
.gk-add3-btn{font-size:.72rem;padding:4px 9px}
.gk-team-card-c .gk-team-card-badge{background:rgba(0,200,255,.1)}

/* ── Forza squadre dual (Attacco/Difesa) ── */
.gk-strength-item-dual{grid-column:1/-1;display:grid;grid-template-columns:110px 1fr;gap:4px 10px;align-items:start;padding:8px 0;border-bottom:1px solid var(--border)}
.gk-strength-team-label{display:flex;align-items:center;gap:6px;font-weight:700;font-size:.78rem;color:var(--text-primary);grid-row:1/3}
.gk-strength-team-label img{width:20px;height:20px;object-fit:contain}
.gk-strength-dual-row{display:flex;align-items:center;gap:8px}
.gk-strength-dual-tag{font-size:.68rem;font-weight:700;color:var(--text-muted);min-width:80px}
.gk-strength-dual-row input[type=range]{flex:1}

/* ── Utility ── */
.hidden{display:none!important}

/* ══ Ronda estetica: micro-animazioni per la card di chiamata (nessun cambio funzionale) ══ */
@keyframes cc-topbar-pulse{0%,100%{opacity:.75}50%{opacity:1}}
@keyframes cc-avatar-pulse{0%,100%{box-shadow:0 0 0 3px rgba(139,92,246,.2),0 0 18px var(--primary-glow),inset 0 2px 6px rgba(0,0,0,.18)}50%{box-shadow:0 0 0 3px rgba(139,92,246,.38),0 0 30px var(--primary-glow),inset 0 2px 6px rgba(0,0,0,.18)}}
@keyframes cc-offerta-shimmer{0%,55%{left:-60%}100%{left:130%}}

/* ══════════════════════════════════════════════════════════
   FONDO CAMPO DA CALCIO — foto di stadio notturno con riflettori e nebbia,
   fissa dietro a tutta l'app (div .pitch-bg aggiunto in index.html, prima
   di #app; pointer-events:none). Un overlay scuro/chiaro sopra la foto
   garantisce leggibilità del contenuto nelle zone dove trapela.
   ══════════════════════════════════════════════════════════ */
.pitch-bg{
  position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden;
  background-color:var(--bg-deep);
  background-image:
    linear-gradient(180deg, rgba(8,4,20,.42) 0%, rgba(8,4,20,.22) 35%, rgba(8,4,20,.45) 75%, rgba(8,4,20,.68) 100%),
    url('/img/backgrounds/stadium-bg.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  transition:background .4s;
}
html.theme-light .pitch-bg{
  background-image:
    linear-gradient(180deg, rgba(233,236,247,.42) 0%, rgba(233,236,247,.28) 35%, rgba(233,236,247,.42) 75%, rgba(233,236,247,.65) 100%),
    url('/img/backgrounds/stadium-bg.jpg');
  filter:saturate(1) brightness(1.08);
}
body{background:transparent!important}
body::before{display:none}

/* ══════════════════════════════════════════════════════════
   TEMA CHIARO — override delle variabili colore per html.theme-light
   (attivato via toggle in app.js, persistito in localStorage)
   Palette: bianco/grigio-perla freddo, con header in violetto profondo
   per mantenere un forte accento di brand invece del solito bianco piatto.
   ══════════════════════════════════════════════════════════ */
html.theme-light{
  --bg-abyss:#dfe3f2;
  --bg-deep:#e9ecf7;
  --panel-glass-1:rgba(255,255,255,.72);
  --panel-glass-2:rgba(233,236,247,.78);
  --panel-glass-3:rgba(223,227,242,.65);
  --bg-main:#ffffff;
  --bg-card:#ffffff;
  --bg-elevated:#f1f0fb;
  --bg-glass:rgba(255,255,255,.82);
  --primary:#7c3aed;
  --primary-bright:#6d28d9;
  --primary-dark:#4c1d95;
  --primary-glow:rgba(124,58,237,.28);
  --primary-subtle:rgba(124,58,237,.09);
  --gold:#b8790a;
  --gold-bright:#946000;
  --gold-deep:#7a4f00;
  --gold-glow:rgba(184,121,10,.25);
  --gold-subtle:rgba(184,121,10,.09);
  --fire:#a21caf;
  --fire-bright:#86198f;
  --fire-glow:rgba(162,28,175,.28);
  --success:#00875f;
  --success-glow:rgba(0,135,95,.25);
  --danger:#c81e4f;
  --danger-glow:rgba(200,30,79,.25);
  --text-primary:#181025;
  --text-secondary:#4a3f68;
  --text-muted:#7c729a;
  --border:rgba(24,14,55,.12);
  --border-light:rgba(24,14,55,.20);
}
html.theme-light .card,
html.theme-light .chiamata-card,
html.theme-light .tabs-panel,
html.theme-light .admin-panel,
html.theme-light .mio-panel,
html.theme-light .rilancio-box,
html.theme-light .panel-budget,
html.theme-light .modal-content{
  box-shadow:0 4px 18px rgba(60,40,110,.08),0 1px 3px rgba(60,40,110,.06)!important;
}
html.theme-light .cc-avatar{background:radial-gradient(circle at 35% 28%,#ffffff 0%,#e9eaf1 55%,#d7d9e2 100%)}
/* L'header dell'arena resta scuro/brand per dare identità, invece del solito bianco piatto */
html.theme-light .asta-header{
  background:linear-gradient(120deg,#3b0f8a 0%,#6d28d9 55%,#9333ea 100%);
  border-bottom:1px solid rgba(255,255,255,.12);
  box-shadow:0 1px 0 rgba(255,255,255,.15),0 6px 20px rgba(76,29,149,.25);
}
html.theme-light .asta-header-title{
  background:linear-gradient(90deg,#fff,#ffd76a);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
html.theme-light .btn-sound,
html.theme-light .asta-header-right .btn-secondary{color:#f1e9ff;border-color:rgba(255,255,255,.22)}
html.theme-light .btn-sound:hover,
html.theme-light .asta-header-right .btn-secondary:hover{border-color:#ffd76a;color:#ffd76a}
html.theme-light .home-header{color:var(--text-primary)}
html.theme-light .home-logo{filter:none}
html.theme-light #screen-strategie-lista.active,
html.theme-light #screen-strategia-form.active,
html.theme-light #screen-strategia-editor.active{
  background:
    linear-gradient(rgba(233,236,247,.90), rgba(233,236,247,.94)),
    repeating-linear-gradient(125deg, rgba(0,135,95,.09) 0px 70px, rgba(0,100,70,.05) 70px 140px),
    var(--bg-deep);
}
html.theme-light .badge-ruolo.r-XX{background:#e4e2f2;color:var(--text-muted)}

/* ══ Bottoni toggle tema (icona ☀️/🌙) — versione integrata nell'header asta ══ */
.theme-toggle-btn{font-size:.85rem!important}
/* ══ Versione per gli header delle schermate home/lobby/strategie: piccola icona
   in alto a sinistra, per non sovrapporsi al link "Esci"/"← Menu" che sta a destra ══ */
.theme-toggle-home{
  position:absolute;
  top:52px; left:16px;
  width:32px; height:32px;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:1rem;
  border:1px solid var(--border-light);
  background:var(--bg-elevated);
  color:var(--text-primary);
  cursor:pointer;
  box-shadow:0 4px 12px rgba(0,0,0,.18);
  transition:transform .2s,box-shadow .2s,background .2s;
  z-index:2;
}
.theme-toggle-home:hover{transform:translateY(-1px) scale(1.06);box-shadow:0 6px 16px rgba(0,0,0,.22),0 0 14px var(--primary-glow)}
.theme-toggle-home:active{transform:translateY(0) scale(.94)}
@media (max-width:640px){
  .theme-toggle-home{width:28px;height:28px;font-size:.9rem;top:46px;left:12px}
}

/* ══ Fix: TODA la fila (card + timer + rilancia) con el mismo color uniforme, sin costuras entre secciones ══ */
.puja-panel-slot,
body.layout-admin .asta-row-puja{
  background:linear-gradient(170deg,#3c2a6e 0%,#2d1f58 100%)!important;
  border:2px solid rgba(139,92,246,.5)!important;
  box-shadow:0 0 30px rgba(139,92,246,.16),0 8px 20px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.puja-panel-slot .chiamata-card,
body.layout-admin .asta-row-puja .chiamata-card{
  background:none!important;border:none!important;box-shadow:none!important;
}
html.theme-light .puja-panel-slot,
html.theme-light body.layout-admin .asta-row-puja{
  background:linear-gradient(170deg,#f1e9ff 0%,#e6d9fb 100%)!important;
}

/* ══ Fix: tabs-nav (Storico/Rose/Liberi/Griglia P/A) se cortaba en el borde derecho en movil ══ */
@media (max-width:600px){
  .tabs-nav{overflow-x:auto;-webkit-overflow-scrolling:touch;flex-wrap:nowrap}
  .tab-btn{flex:0 0 auto}
}

/* ══════ Tab Anteprima: campo tattico e assegnazione giocatori ══════ */
.ant-controls{display:flex;gap:8px;padding:8px;flex-wrap:wrap;align-items:center}
.ant-select{background:var(--bg-elevated);color:var(--text-primary);border:1px solid var(--border);border-radius:8px;padding:6px 10px;font-size:.85rem;flex:1;min-width:120px}
.ant-zoom-controls{display:flex;align-items:center;gap:4px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:8px;padding:2px 6px}
.ant-zoom-btn{background:transparent;border:none;color:var(--text-primary);font-size:.95rem;line-height:1;padding:4px 8px;cursor:pointer;border-radius:6px;transition:background .15s}
.ant-zoom-btn:hover{background:rgba(255,255,255,.1)}
.ant-zoom-btn:active{transform:scale(.9)}
.ant-zoom-icon{font-size:.8rem;opacity:.7;padding:0 2px}
.ant-pitch{
  position:relative;width:100%;aspect-ratio:5/6;max-width:var(--ant-pitch-size,300px);flex-shrink:0;margin:0 auto;
  border-radius:14px;overflow:hidden;background-color:#040f09;transition:max-width .15s ease;
  background-image:
    repeating-linear-gradient(90deg, rgba(255,255,255,.028) 0 2px, transparent 2px 26px),
    linear-gradient(rgba(56,255,196,.65), rgba(56,255,196,.65)),
    linear-gradient(rgba(56,255,196,.65), rgba(56,255,196,.65)),
    linear-gradient(rgba(56,255,196,.65), rgba(56,255,196,.65)),
    linear-gradient(rgba(56,255,196,.65), rgba(56,255,196,.65)),
    linear-gradient(rgba(56,255,196,.65), rgba(56,255,196,.65)),
    linear-gradient(rgba(56,255,196,.65), rgba(56,255,196,.65)),
    radial-gradient(ellipse at 50% -10%, rgba(56,255,196,.14), transparent 55%),
    linear-gradient(180deg,#0e3a22 0%,#0a2a19 45%,#061c11 100%);
  background-repeat:no-repeat;
  background-size:
    100% 100%,
    46% 2px, 2px 12%, 2px 12%,
    46% 2px, 2px 12%, 2px 12%,
    100% 100%, 100% 100%;
  background-position:
    0 0,
    50% 12%, 27% 0%, 73% 0%,
    50% 88%, 27% 100%, 73% 100%,
    0 0, 0 0;
  box-shadow:
    inset 0 0 0 2px rgba(56,255,196,.9),
    inset 0 0 45px rgba(56,255,196,.28),
    0 0 12px rgba(56,255,196,.85),
    0 0 34px rgba(56,255,196,.55),
    0 0 60px rgba(56,255,196,.25);
}
.ant-pitch::before{content:'';position:absolute;left:6%;right:6%;top:50%;height:3px;background:#7dffe0;box-shadow:0 0 8px rgba(56,255,196,1),0 0 20px rgba(56,255,196,.9),0 0 34px rgba(56,255,196,.5);transform:translateY(-50%)}
.ant-pitch::after{content:'';position:absolute;top:50%;left:50%;width:64px;height:64px;border:3px solid #7dffe0;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 8px rgba(56,255,196,1),0 0 20px rgba(56,255,196,.9),inset 0 0 16px rgba(56,255,196,.5)}
.ant-slot{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer;width:64px;z-index:2}
.ant-slot-role{font-size:.6rem;font-weight:800;padding:1px 4px;border-radius:4px;background:rgba(2,8,5,.88);color:#dffff2;text-shadow:0 0 4px rgba(56,255,196,.6);border:1px solid rgba(56,255,196,.35)}
.ant-slot-player{font-size:.62rem;font-weight:700;color:#eafff6;background:rgba(2,8,5,.92);border-radius:6px;padding:2px 4px;text-align:center;max-width:64px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:1px solid rgba(56,255,196,.3);box-shadow:0 0 6px rgba(56,255,196,.15),0 1px 4px rgba(0,0,0,.6);transition:box-shadow .15s,transform .15s}
.ant-slot.filled .ant-slot-player{background:linear-gradient(135deg,rgba(0,255,196,.42),rgba(0,180,255,.42)),linear-gradient(rgba(2,8,5,.85),rgba(2,8,5,.85));color:#fff;border-color:rgba(56,255,196,.75);box-shadow:0 0 10px rgba(56,255,196,.55),inset 0 0 8px rgba(56,255,196,.25),0 1px 4px rgba(0,0,0,.6)}
.ant-slot:hover .ant-slot-player{box-shadow:0 0 14px rgba(56,255,196,.85),inset 0 0 8px rgba(56,255,196,.3);transform:scale(1.06)}
#tab-anteprima{position:relative}
.ant-picker{position:absolute;z-index:500;background:var(--bg-elevated);border:1px solid var(--border);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.4);padding:8px;max-height:280px;overflow-y:auto;min-width:200px;max-width:calc(100vw - 16px)}
.ant-picker.hidden{display:none}
.ant-picker-item{display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:6px;cursor:pointer;font-size:.82rem}
.ant-picker-item:hover{background:rgba(255,255,255,.08)}
.ant-picker-hdr{font-size:.7rem;font-weight:700;color:var(--text-muted);padding:4px 8px;text-transform:uppercase}
.ant-picker-empty{padding:8px;color:var(--text-muted);font-size:.8rem;text-align:center}
.ant-picker-remove{margin-top:4px;padding:6px 8px;border-radius:6px;cursor:pointer;font-size:.8rem;color:#e74c3c;text-align:center;background:rgba(231,76,60,.1)}
.ant-picker-remove:hover{background:rgba(231,76,60,.2)}

/* ══ Badge email utente loggato — visibile fisso in alto a sinistra, tranne durante l'asta
   (dove viene mostrato inline nell'header per non sovrapporsi a nessun controllo esistente) ══ */
.user-email-badge{
  position:fixed; top:8px; left:8px; z-index:60;
  background:rgba(20,20,30,.72); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.12); border-radius:20px;
  padding:4px 12px; font-size:.68rem; font-weight:600; color:var(--text-secondary,#c8cad4);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:46vw;
  pointer-events:none; line-height:1.4; box-shadow:0 2px 10px rgba(0,0,0,.25);
}
@media (max-width:520px){
  .user-email-badge{font-size:.6rem; padding:3px 9px; max-width:52vw; top:6px; left:6px}
}
body:has(#screen-asta.active) .user-email-badge{display:none}
.asta-header-email{font-size:.6rem;font-weight:600;color:var(--text-secondary);margin-left:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:110px;opacity:.85}
@media (max-width:520px){.asta-header-email{display:none}}

/* ══════════════════════════════════════════════════════════════
   ══ REDESIGN MOBILE screen-asta: card in cima, pannelli a fisarmonica ══
   Tutto racchiuso in media query (max-width:640px) — non tocca il desktop.
   ══════════════════════════════════════════════════════════════ */
@media (max-width:640px){
  #screen-asta.active{overflow-y:auto!important;height:auto!important;min-height:100vh}

  /* Riordino verticale: card di chiamata sempre in cima, poi pannelli, poi tabs */
  .asta-row-puja{order:1!important;width:100%!important}
  .asta-row-panels{order:2!important;flex-direction:column!important;flex-wrap:nowrap!important;gap:8px!important;padding:0 10px!important;max-height:none!important;align-items:stretch!important}
  .asta-row-tabs{order:3!important}
  .asta-row-panels>*{width:100%!important;max-width:100%!important;flex:0 0 auto!important;max-height:none!important;margin:0!important}
  #puja-panel-slot{order:-1!important}
  #admin-panel{order:1!important}
  .panel-budget{order:2!important}
  #mio-panel{order:3!important}

  /* ══ Accordion: Riepilogo squadre e Mio team collassati di default, si apre toccando l'header ══ */
  .panel-budget-hdr{cursor:pointer;display:flex;align-items:center;justify-content:space-between;font-size:.82rem!important;padding:11px 12px!important;margin-bottom:0!important;border-radius:10px;transition:background .2s}
  .panel-budget-hdr:active{background:rgba(255,255,255,.06)}
  .panel-budget-hdr::after{content:'▾';font-size:.9em;transition:transform .25s;opacity:.7}
  .panel-budget.acc-open .panel-budget-hdr::after{transform:rotate(180deg)}
  #budget-bar{display:none;max-height:46vh;overflow-y:auto;padding-top:8px}
  .panel-budget.acc-open #budget-bar{display:flex}

  .mio-panel-header{cursor:pointer;padding:11px 12px!important;margin-bottom:0!important;border-radius:10px;position:relative;transition:background .2s}
  .mio-panel-header:active{background:rgba(255,255,255,.06)}
  .mio-panel-header::after{content:'▾';font-size:.9em;transition:transform .25s;opacity:.7;margin-left:8px}
  #mio-panel.acc-open .mio-panel-header::after{transform:rotate(180deg)}
  #mio-slot-counter,.mio-panel-actions{display:none!important}
  #mio-panel.acc-open #mio-slot-counter{display:block!important;margin-top:6px}
  #mio-panel.acc-open .mio-panel-actions{display:flex!important;margin-top:8px}
  #mio-panel .mio-panel-actions .btn{font-size:.85rem!important;padding:11px 10px!important}
  /* Fix acordeón cerrado: la regla de tablet (max-width:768px, arriba en el
     archivo) fija flex-basis:200px!important con la misma especificidad, y
     al tener menor prioridad de cascada por orden esta regla de aquí gana:
     obliga al panel a encoger a la altura de su contenido real (solo la
     cabecera) cuando está cerrado, en vez de reservar 200px vacíos. */
  body.layout-partecipante .asta-row-panels>.panel-budget{flex:0 0 auto!important}
  body.layout-partecipante .asta-row-panels>#mio-panel{flex:0 0 auto!important}

  /* ══ Card di chiamata: priorità massima, a piena larghezza, testo e pulsanti leggibili ══ */
  .puja-panel-slot,body.layout-admin .asta-row-puja{
    flex-direction:column!important;padding:14px!important;width:100%!important;border-radius:16px!important;
  }
  .puja-panel-slot .card-timer-group,body.layout-admin .asta-row-puja .card-timer-group{
    flex-direction:column!important;width:100%!important;border-right:none!important;padding-right:0!important;
    border-bottom:1px solid var(--border-light)!important;padding-bottom:12px!important;margin-bottom:12px!important;
    align-items:stretch!important;gap:0!important;height:auto!important;min-height:0!important;overflow:visible!important;
  }
  .puja-panel-slot .chiamata-card,body.layout-admin .asta-row-puja .chiamata-card{
    flex:0 0 auto!important;max-width:100%!important;width:100%!important;padding:10px 14px 10px 96px!important;
    min-height:84px!important;height:auto!important;overflow:visible!important;
  }
  .puja-panel-slot .cc-avatar,body.layout-admin .asta-row-puja .cc-avatar{
    width:74px!important;height:74px!important;position:absolute!important;left:10px!important;top:10px!important;bottom:auto!important;border-radius:12px!important;
  }
  .puja-panel-slot .cc-nome,body.layout-admin .asta-row-puja .cc-nome{
    font-size:1.12rem!important;line-height:1.2!important;white-space:normal!important;overflow:visible!important;
  }
  .puja-panel-slot .cc-offerta,body.layout-admin .asta-row-puja .cc-offerta{
    font-size:2.1rem!important;
  }
  .puja-panel-slot .cc-offerente,body.layout-admin .asta-row-puja .cc-offerente,
  .puja-panel-slot .cc-meta,body.layout-admin .asta-row-puja .cc-meta{
    font-size:.78rem!important;white-space:normal!important;overflow:visible!important;
  }
  .puja-panel-slot .timer-ring-container,body.layout-admin .asta-row-puja .timer-ring-container{
    width:100%!important;height:auto!important;margin-top:10px!important;flex:0 0 auto!important;
  }
  .puja-panel-slot .timer-ring,body.layout-admin .asta-row-puja .timer-ring{
    width:92px!important;height:92px!important;
  }
  .puja-panel-slot .timer-number,body.layout-admin .asta-row-puja .timer-number{
    font-size:1.6rem!important;
  }
  .puja-panel-slot .timer-label-text,body.layout-admin .asta-row-puja .timer-label-text{
    font-size:.68rem!important;
  }

  /* ══ Rilancio box: pulsanti grandi e comodi al tocco ══ */
  .puja-panel-slot .rilancio-box,body.layout-admin .asta-row-puja .rilancio-box{
    display:flex!important;flex-direction:column!important;width:100%!important;padding:0!important;gap:10px!important;
    position:static!important;bottom:auto!important;left:auto!important;right:auto!important;top:auto!important;z-index:auto!important;
  }
  .puja-panel-slot .quick-bids-row,body.layout-admin .asta-row-puja .quick-bids-row{
    display:flex!important;gap:8px!important;margin:0!important;
  }
  .puja-panel-slot .btn-quick,body.layout-admin .asta-row-puja .btn-quick{
    flex:1!important;padding:12px!important;font-size:1rem!important;
  }
  .puja-panel-slot .btn-rilancia,body.layout-admin .asta-row-puja .btn-rilancia{
    width:100%!important;padding:14px!important;font-size:1.05rem!important;grid-column:auto!important;grid-row:auto!important;letter-spacing:.02em!important;
  }
  .puja-panel-slot .manual-bid-row,body.layout-admin .asta-row-puja .manual-bid-row{
    display:flex!important;gap:8px!important;margin:0!important;grid-column:auto!important;grid-row:auto!important;
  }
  .puja-panel-slot .inp-rilancio,body.layout-admin .asta-row-puja .inp-rilancio{
    flex:1!important;width:auto!important;padding:12px!important;font-size:16px!important;
  }
  .puja-panel-slot .btn-manuale,body.layout-admin .asta-row-puja .btn-manuale{
    flex:1!important;padding:12px!important;font-size:.95rem!important;
  }

  /* ══ Tab a tocco più comode ══ */
  .tab-btn{padding:9px 10px!important;min-height:38px!important}
  .tab-label{font-size:.72rem!important}
}

/* ══════ VISTA UTENTE MOBILE: controlli di puja impilati sotto la card ══════
   Il tentativo precedente di far entrare Rilancia/+5/+10/Offri AFFIANCO alla card
   giocatore continuava a tagliarsi sui telefoni stretti, perché flexbox non
   riusciva a comprimerli abbastanza. Soluzione definitiva: SOLO per la vista
   utente (non-admin) su schermi mobile, i controlli di puja vengono impilati
   in verticale, uno sotto l'altro, a piena larghezza — così nulla esce mai
   dallo schermo e tutti i bottoni restano sempre cliccabili. */
@media (max-width:900px){
  body.layout-partecipante .puja-panel-slot{
    display:flex!important;
    flex-direction:column!important;
  }
  body.layout-partecipante .puja-panel-slot .card-timer-group{
    order:1!important;
    flex-direction:row!important;
    width:100%!important;
  }
  body.layout-partecipante .puja-panel-slot .rilancio-box{
    order:2!important;
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    gap:10px!important;
    margin-top:10px!important;
    padding-top:10px!important;
    border-top:1px solid var(--border-light)!important;
  }
  body.layout-partecipante .puja-panel-slot .quick-bids-row{
    display:flex!important;
    flex-direction:row!important;
    width:100%!important;
    gap:8px!important;
    order:2!important;
  }
  body.layout-partecipante .puja-panel-slot .quick-bids-row .btn-quick{
    flex:1 1 0%!important;
    width:auto!important;
  }
  body.layout-partecipante .puja-panel-slot .btn-rilancia{
    order:1!important;
    width:100%!important;
  }
  body.layout-partecipante .puja-panel-slot .manual-bid-row{
    display:flex!important;
    flex-direction:row!important;
    width:100%!important;
    gap:8px!important;
    order:3!important;
  }
  body.layout-partecipante .puja-panel-slot .inp-rilancio{
    flex:1 1 auto!important;
    width:auto!important;
  }
  body.layout-partecipante .puja-panel-slot .manual-bid-row .btn-manuale{
    flex:0 0 auto!important;
  }
}

/* ══════ RETE DI SICUREZZA ANTI-OVERFLOW MOBILE (fix definitivo) ══════
   Diversi breakpoint precedenti (480/400/640/700/768px) potevano entrare in
   conflitto tra loro su larghezze "intermedie" non standard (es. alcuni
   Samsung con impostazioni di scala del display particolari), lasciando la
   card di chiamata nel layout "orizzontale desktop" che non entra nello
   schermo e taglia i bottoni di rilancio a destra. Questo blocco, essendo
   l'ULTIMO nel file con !important, vince sempre su qualsiasi conflitto
   precedente e garantisce l'impilamento verticale su qualunque telefono. */
@media (max-width:1200px){
  html, body { overflow-x:hidden!important; max-width:100vw!important; }
  #screen-asta.active { overflow-x:hidden!important; }
  .asta-row-puja,
  .puja-panel-slot,
  body.layout-partecipante .puja-panel-slot,
  body.layout-admin .asta-row-puja {
    flex-direction:column!important;
    width:100%!important; max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
    overflow-x:hidden!important;
  }
  .asta-row-puja .card-timer-group,
  .puja-panel-slot .card-timer-group,
  body.layout-partecipante .puja-panel-slot .card-timer-group,
  body.layout-admin .asta-row-puja .card-timer-group {
    flex-direction:column!important;
    width:100%!important; max-width:100%!important;
    min-width:0!important;
    border-right:none!important; padding-right:0!important;
  }
  .asta-row-puja .rilancio-box,
  .puja-panel-slot .rilancio-box,
  body.layout-partecipante .puja-panel-slot .rilancio-box,
  body.layout-admin .asta-row-puja .rilancio-box {
    position:static!important; bottom:auto!important; left:auto!important; right:auto!important; top:auto!important;
    width:100%!important; max-width:100%!important; min-width:0!important;
    flex:1 1 100%!important;
    box-sizing:border-box!important;
    display:flex!important; flex-direction:column!important;
  }
  .puja-panel-slot .chiamata-card,
  body.layout-partecipante .puja-panel-slot .chiamata-card,
  body.layout-admin .asta-row-puja .chiamata-card {
    width:100%!important; max-width:100%!important; min-width:0!important;
    box-sizing:border-box!important;
  }
  .quick-bids-row, .manual-bid-row,
  body.layout-partecipante .puja-panel-slot .quick-bids-row,
  body.layout-partecipante .puja-panel-slot .manual-bid-row {
    flex-wrap:wrap!important; width:100%!important; max-width:100%!important; min-width:0!important;
    box-sizing:border-box!important;
  }
  .btn-quick, .btn-rilancia, .inp-rilancio, .btn-manuale,
  body.layout-partecipante .puja-panel-slot .btn-quick,
  body.layout-partecipante .puja-panel-slot .inp-rilancio {
    max-width:100%!important; box-sizing:border-box!important; min-width:0!important; flex:1 1 auto!important;
  }
}

/* ══════ FIX VISTA UTENTE (desktop/tablet/mobile): fascia strategia sempre visibile ══════
   Questo blocco NON è dentro nessuna @media query, quindi si applica SEMPRE
   (schermi larghi e stretti). Prima era erroneamente dentro un blocco
   @media(max-width:768px), quindi su desktop veniva ignorato. */
body.layout-partecipante .puja-panel-slot{align-self:flex-start!important;height:auto!important;max-height:none!important;overflow:visible!important}
body.layout-partecipante .puja-panel-slot .card-timer-group{height:auto!important;overflow:visible!important;align-items:flex-start!important}
body.layout-partecipante .puja-panel-slot .chiamata-card{height:auto!important;max-height:none!important;overflow:visible!important;flex-wrap:nowrap!important;align-items:flex-start!important;row-gap:4px!important}
body.layout-partecipante .puja-panel-slot .cc-body{overflow:visible!important;white-space:normal!important;flex-wrap:nowrap!important;width:100%!important;max-width:100%!important;flex:1 1 100%!important;row-gap:2px!important;box-sizing:border-box!important}
body.layout-partecipante .puja-panel-slot .cc-strategia-info{white-space:normal!important;overflow:visible!important;text-overflow:unset!important;flex:1 1 100%!important;width:100%!important;max-width:100%!important;margin-top:2px!important;box-sizing:border-box!important;overflow-wrap:anywhere!important}
body.layout-partecipante .puja-panel-slot .cc-offerente{white-space:normal!important;max-width:100%!important;overflow-wrap:anywhere!important}
body.layout-partecipante .puja-panel-slot .cc-attesa-badge{flex:1 1 100%!important;width:100%!important;max-width:100%!important;white-space:normal!important;box-sizing:border-box!important;overflow-wrap:anywhere!important}
body.layout-partecipante .puja-panel-slot .cc-nome{white-space:normal!important;overflow:visible!important;text-overflow:unset!important;max-width:100%!important;overflow-wrap:anywhere!important}
body.layout-partecipante .puja-panel-slot .cc-meta{white-space:normal!important;overflow:visible!important;max-width:100%!important;flex-wrap:wrap!important}
body.layout-partecipante .puja-panel-slot .cc-offerta-box{max-width:100%!important;box-sizing:border-box!important;flex-wrap:nowrap!important;flex-shrink:0!important}
body.layout-partecipante .puja-panel-slot .cc-offerta,
body.layout-partecipante .puja-panel-slot .cc-offerta-label{max-width:100%!important;overflow-wrap:anywhere!important;white-space:normal!important}
body.layout-partecipante .asta-row-panels{overflow:visible!important}

/* ══════ FIX: rilancio-box.hidden debe permanecer oculto en mobile ══════
   Los bloques @media(max-width:900px/640px) de más arriba fuerzan
   display:flex!important en .rilancio-box (para mostrarlo bien apilado en
   columna cuando SÍ está visible), pero eso ignora la clase .hidden que JS
   le pone a propósito para congelar la puja (ej. estado "aspettando
   conferma" en llamadas RIC, o antes de la 1ª offerta). Como .hidden por sí
   sola tiene menor especificidad que esos selectores compuestos, pierde el
   empate aunque también tenga !important. Esta regla, más específica y
   colocada al final del archivo (gana también por orden de cascada), la
   anula explícitamente cuando tiene .hidden. Solo vista utente/admin del
   propio rilancio-box, sin afectar ningún otro elemento. */
body.layout-partecipante .puja-panel-slot .rilancio-box.hidden,
.puja-panel-slot .rilancio-box.hidden,
#rilancio-box.hidden {
  display:none!important;
}


/* ── Griglia squadre (matrice compatibilità) ── */
.gk-grid-wrap{overflow:auto;margin-top:18px;max-height:70vh;padding-bottom:8px;border-radius:12px}
.gk-grid{display:grid;gap:3px;min-width:max-content}
.gk-grid-corner{position:sticky;top:0;left:0;z-index:3;background:var(--bg-card);width:84px;height:44px}
.gk-grid-col-header{position:sticky;top:0;z-index:2;background:var(--bg-card);width:44px;height:44px;display:flex;align-items:center;justify-content:center}
.gk-grid-col-header img{width:22px;height:22px;object-fit:contain}
.gk-grid-row-label{position:sticky;left:0;z-index:1;background:var(--bg-card);width:84px;height:44px;display:flex;align-items:center;gap:6px;padding:0 6px;font-size:.7rem;font-weight:700;color:var(--text-secondary);white-space:nowrap}
.gk-grid-row-label img{width:18px;height:18px;object-fit:contain}
.gk-grid-cell{width:44px;height:44px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:800;cursor:pointer;transition:transform .12s;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15)}
.gk-grid-cell:hover{transform:scale(1.15);z-index:5}
.gk-grid-cell-diag{background:transparent!important;box-shadow:none;cursor:default}
.gk-grid-legend{margin-top:10px;font-size:.75rem;color:var(--text-muted)}
@media (max-width:600px){
  .gk-grid-corner,.gk-grid-row-label{width:60px}
  .gk-grid-col-header,.gk-grid-cell{width:36px;height:36px}
  .gk-grid-corner,.gk-grid-col-header{height:36px}
  .gk-grid-row-label{height:36px;font-size:.6rem}
  .gk-grid-cell{font-size:.62rem}
}