[hidden]{display:none!important}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/barlow-condensed-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/barlow-condensed-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/dm-sans-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/dm-sans-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/dm-sans-latin-700-normal.woff2) format('woff2')}

/* XOR v2. Nero caldo e bianco osso; testo normale (niente tutto maiuscolo), caratteri piccoli e leggibili.
   Colori con un significato solo: arancio = quello che tocchi e selezioni; bianco grande = Over e Under, da giocare;
   viola = la media XOR, secondaria; verde = presa; ambra = persa al limite; rosso = errore.
   Barlow Condensed solo per i numeri. Un solo sistema di raggi (8-14 px). */
:root{color-scheme:dark;
  --bg:#0e0d0b;--bg2:#161512;--bg3:#1e1c18;--bg4:#26231e;
  --ink:#f2ede4;--mut:#a8a196;--dim:#8f897f;--faint:#6f6a62;
  --line:rgba(242,237,228,.09);--line2:rgba(242,237,228,.16);--line3:rgba(242,237,228,.28);
  --acc:#ff8a3d;--acc-hi:#ff9b57;--acc-ink:#1b0e04;--acc-bg:rgba(255,138,61,.13);
  --xor:#a084ff;--vio:#8b5cf6;
  --ok:#4fd18b;--ok-bg:rgba(79,209,139,.12);--edge:#f5b84a;--edge-bg:rgba(245,184,74,.12);--bad:#ff7a6b;--bad-bg:rgba(255,122,107,.12);
  --body:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;--num:'Barlow Condensed','DM Sans',sans-serif;
  --r:10px;--r2:14px;
  --out:cubic-bezier(.22,1,.36,1);--spring:cubic-bezier(.34,1.56,.64,1);
  --sat:env(safe-area-inset-top,0px);--sab:env(safe-area-inset-bottom,0px);--sal:env(safe-area-inset-left,0px);--sar:env(safe-area-inset-right,0px);
  --gut:16px;--wrap:1240px;
  --hdr:rgba(14,13,11,.92);--scrim:rgba(6,5,4,.72);--warn-ink:#ffd99a;--doc-ink:#d9d3c8;--xor-num:#ddd3ff;--tint:rgba(242,237,228,.025);--tint2:rgba(242,237,228,.04);
  /* nomi storici usati negli stili scritti dentro le pagine */
  --fg:var(--ink);--panel:var(--bg2);--panel2:var(--bg3);--ora:var(--acc);--disp:var(--body);--warn:var(--edge)}
*{box-sizing:border-box}
html{background:var(--bg);-webkit-text-size-adjust:100%;text-size-adjust:100%;scrollbar-color:var(--bg4) var(--bg);scrollbar-width:thin}
::selection{background:var(--acc);color:var(--acc-ink)}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--bg4);border:2px solid var(--bg);border-radius:6px}
a,button,summary,label,select{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.5;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;caret-color:var(--acc);-webkit-font-smoothing:antialiased}
#app{display:flex;flex-direction:column;flex:1;overflow-x:clip}
h1,h2,h3,h4{margin:0;text-wrap:balance;font-weight:600;letter-spacing:-.012em;line-height:1.22}
h1{font-size:24px}h2{font-size:19px}h3{font-size:16px}h4{font-size:14.5px}
p{margin:0 0 12px;text-wrap:pretty}
a{color:inherit;text-decoration:none}
button,select,input,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
img{max-width:100%}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:4px}
.num{font-variant-numeric:tabular-nums}
.mut{color:var(--mut)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;z-index:100;background:var(--acc);color:var(--acc-ink);padding:8px 12px;border-radius:8px;font-weight:600}
.skip:focus{left:8px}
.link{color:var(--acc);text-decoration:underline;text-decoration-color:rgba(255,138,61,.4);text-underline-offset:3px}
.link:hover{text-decoration-color:var(--acc)}
button.link{font:inherit}

/* ---------- intestazione ---------- */
.top{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:10px;padding:calc(10px + var(--sat)) max(var(--gut),var(--sar)) 10px max(var(--gut),var(--sal));background:var(--hdr);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px;letter-spacing:-.01em;white-space:nowrap}
.brand img{width:30px;height:20px}
.brand b{font-weight:400;color:var(--mut)}
.top .nav{display:none;gap:2px;margin-left:14px}
.top .nav a{padding:6px 10px;border-radius:8px;font-size:14px;color:var(--mut);transition:color .15s,background .15s}
.top .nav a:hover{color:var(--ink);background:var(--bg2)}
.top .nav a.on{color:var(--ink)}
.top .sp{flex:1}
.top .reg,.top .adm-btn,.top .prof-btn{display:none}
.menu-btn{width:38px;height:38px;border-radius:9px;display:grid;place-items:center;color:var(--ink)}
.menu-btn:hover{background:var(--bg2)}
.menu-btn svg{width:21px;height:21px}
.drop{position:fixed;left:10px;right:10px;top:calc(62px + var(--sat));z-index:40;background:var(--bg3);border:1px solid var(--line2);border-radius:var(--r2);padding:6px;box-shadow:0 18px 40px -12px rgba(0,0,0,.85);display:grid;animation:giu .18s var(--out)}
.drop a,.drop button{display:flex;align-items:center;gap:11px;text-align:left;padding:12px;border-radius:9px;font-size:15px;width:100%}
.drop a:hover,.drop button:hover{background:var(--bg2)}
.drop a.on{color:var(--acc)}
.drop svg{width:19px;height:19px;color:var(--mut);flex:none}
.drop img{width:19px;height:13px;flex:none}
.drop hr{border:0;border-top:1px solid var(--line);margin:4px 6px}
.drop .hint{font-size:12.5px;color:var(--dim);padding:0 12px 8px 42px;margin:0}
.drop-ov{position:fixed;inset:0;z-index:35}
@keyframes giu{from{opacity:0;transform:translateY(-6px)}}
.strip18{font-size:12px;color:var(--dim);display:flex;align-items:center;gap:6px}
.age{display:inline-grid;place-items:center;font-size:10.5px;font-weight:700;border:1px solid var(--line2);border-radius:5px;padding:0 4px;color:var(--mut);line-height:16px}

/* ---------- corpo ---------- */
main{flex:1;width:100%;max-width:var(--wrap);margin:0 auto;padding:18px max(var(--gut),var(--sar)) 40px max(var(--gut),var(--sal));min-width:0}
main.in{animation:velo .12s ease-out}
@keyframes velo{from{opacity:0}}
.lh{margin:4px 0 16px}
.lh h1{display:flex;align-items:center;gap:10px}
.lh p{margin:6px 0 0;color:var(--mut);font-size:14px;max-width:62ch}
.lh .lg{width:28px;height:28px;object-fit:contain;background:#fff;border-radius:7px;padding:3px}
.crumb{font-size:13px;color:var(--mut);margin-bottom:8px}
.crumb a:hover{color:var(--ink)}
.sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:26px 0 10px}
.sec-h h2{font-size:17px}
.sec-h .meta,.sec-h>span{font-size:13px;color:var(--mut)}
.explain{font-size:13.5px;color:var(--mut);margin:0 0 14px;max-width:70ch}
.explain b{color:var(--ink);font-weight:600}
.warn-msg{font-size:13.5px;color:var(--warn-ink);background:var(--edge-bg);border-radius:var(--r);padding:10px 12px;margin:0 0 14px}
.warn-msg b{color:var(--edge)}
.ok-msg{font-size:13.5px;color:var(--ok);background:var(--ok-bg);border-radius:var(--r);padding:10px 12px;margin:0 0 14px}
.err{font-size:13.5px;color:var(--bad);background:var(--bad-bg);border-radius:var(--r);padding:10px 12px;margin:0 0 12px}
.empty{padding:26px 0;color:var(--mut);font-size:14px;border-top:1px solid var(--line)}
.empty h3{color:var(--ink);margin-bottom:6px;font-size:15.5px}
.empty p{margin:0 0 10px}
.skel{display:grid;gap:10px;padding:10px 0}
.skel-r{height:58px;border-radius:var(--r);background:linear-gradient(90deg,var(--bg2) 0%,var(--bg3) 50%,var(--bg2) 100%);background-size:200% 100%;animation:sk 1.3s linear infinite}
@keyframes sk{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* ---------- pulsanti, chip, schede ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:38px;padding:0 15px;border-radius:9px;font-size:14px;font-weight:600;white-space:nowrap;border:1px solid var(--line2);background:none;color:var(--ink);transition:background .15s,border-color .15s,transform .15s var(--out),opacity .15s;cursor:pointer}
.btn:hover{background:var(--bg2);border-color:var(--line3)}
.btn:active{transform:scale(.97)}
.btn svg{width:16px;height:16px}
.btn.pri{background:var(--acc);border-color:var(--acc);color:var(--acc-ink)}
.btn.pri:hover{background:var(--acc-hi);border-color:var(--acc-hi)}
.btn.gh{border-color:transparent}
.btn.bad{color:var(--bad);border-color:rgba(255,122,107,.35)}
.btn.bad:hover{background:var(--bad-bg)}
.btn.sm{height:30px;padding:0 10px;font-size:13px;border-radius:8px}
.btn.big{height:46px;padding:0 20px;font-size:15px}
.btn.block{display:flex;width:100%}
.btn:disabled,.btn[disabled]{opacity:.45;pointer-events:none}
.chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 calc(-1 * var(--gut));padding:0 var(--gut)}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--line2);font-size:13.5px;color:var(--mut);display:inline-flex;align-items:center;gap:6px;transition:background .15s,color .15s,border-color .15s;white-space:nowrap}
.chip:hover{color:var(--ink)}
.chip.on,.chip[aria-pressed="true"]{background:var(--acc-bg);color:var(--acc);border-color:var(--acc);font-weight:600}
.seg{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);padding:3px;border-radius:10px;background:var(--bg2);border:1px solid var(--line);margin-bottom:8px}
.seg button{height:32px;border-radius:7px;font-size:13.5px;color:var(--mut);font-weight:500;transition:background .15s,color .15s;white-space:nowrap;padding:0 8px}
.seg button.on,.seg button[aria-pressed="true"],.seg button[aria-selected="true"]{background:var(--bg4);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.4)}
.tabs{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--line);margin:0 calc(-1 * var(--gut)) 16px;padding:0 var(--gut)}
.tabs::-webkit-scrollbar{display:none}
.tabs button,.tabs a{flex:none;padding:10px 12px;font-size:14px;color:var(--mut);border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.tabs button:hover,.tabs a:hover{color:var(--ink)}
.tabs .on{color:var(--ink);border-bottom-color:var(--acc);font-weight:600}
.pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;border-radius:999px;padding:2px 9px;background:var(--bg3);color:var(--mut);white-space:nowrap}
.pill.ok{background:var(--ok-bg);color:var(--ok)}
.pill.ko,.pill.bad{background:var(--bad-bg);color:var(--bad)}
.pill.edge,.pill.lim{background:var(--edge-bg);color:var(--edge)}
.pill.ora{background:var(--acc-bg);color:var(--acc)}
.tag{display:inline-block;font-size:11px;font-weight:600;color:var(--acc);background:var(--acc-bg);border-radius:6px;padding:1px 6px}

/* ---------- palinsesto: per giorno o per campionato ---------- */
.mode{display:grid;grid-template-columns:1fr 1fr;padding:3px;border-radius:12px;background:var(--bg2);border:1px solid var(--line2);margin-bottom:12px;position:relative}
.mode button{height:38px;border-radius:9px;font-size:14px;font-weight:600;color:var(--mut);display:flex;align-items:center;justify-content:center;gap:7px;position:relative;z-index:1;transition:color .2s}
.mode button svg{width:17px;height:17px}
.mode button[aria-selected="true"]{color:var(--acc-ink)}
.mode .th{position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);border-radius:9px;background:var(--acc);transition:transform .32s var(--out)}
.mode[data-m="camp"] .th{transform:translateX(100%)}
.days{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 calc(-1 * var(--gut)) 10px;padding:0 var(--gut)}
.days::-webkit-scrollbar{display:none}
.day{flex:none;width:62px;padding:7px 0 6px;border-radius:12px;border:1px solid var(--line2);display:grid;justify-items:center;line-height:1.2;transition:background .15s,border-color .15s}
.day small{font-size:11.5px;color:var(--mut)}
.day b{font-size:18px;font-weight:600;font-variant-numeric:tabular-nums}
.day i{font-style:normal;font-size:11px;color:var(--dim)}
.day:hover{border-color:var(--mut)}
.day[aria-pressed="true"]{background:var(--acc-bg);border-color:var(--acc)}
.day[aria-pressed="true"] small,.day[aria-pressed="true"] i{color:var(--acc)}
.day.off{opacity:.45}
.dayv{display:none}
.search{height:40px;border-radius:10px;background:var(--bg2);border:1px solid var(--line);display:flex;align-items:center;gap:8px;padding:0 12px;color:var(--dim);margin-bottom:6px}
.search:focus-within{border-color:var(--line3)}
.search svg{width:16px;height:16px;flex:none}
.search input{background:none;border:0;outline:0;flex:1;min-width:0;font-size:15px;color:var(--ink)}
.search input::placeholder{color:var(--dim)}
.acc{display:grid}
.nat-b{display:flex;align-items:center;gap:10px;width:100%;padding:14px 2px;border-top:1px solid var(--line);font-size:15.5px;font-weight:600;text-align:left}
.nat-b .n{margin-left:auto;font-size:12.5px;font-weight:400;color:var(--dim)}
.nat-b>svg{width:16px;height:16px;color:var(--dim);transition:transform .25s var(--out);flex:none}
.nat-b[aria-expanded="true"]{color:var(--acc)}
.nat-b[aria-expanded="true"]>svg{transform:rotate(90deg);color:var(--acc)}
.lgs{display:grid;padding:0 0 8px 14px;margin-left:2px;border-left:1px solid var(--line2);animation:giu .22s var(--out)}
.lg-b{display:flex;align-items:center;gap:10px;width:100%;padding:10px 4px 10px 8px;border-radius:9px;text-align:left;font-size:14.5px}
.lg-b:hover{background:var(--bg2)}
.lg-b .n{margin-left:auto;font-size:12.5px;color:var(--mut)}
.lg-b.off{color:var(--dim)}
.lg-b svg{width:14px;height:14px;color:var(--dim);flex:none}
.lg-b[aria-pressed="true"]{background:var(--acc-bg);color:var(--acc);font-weight:600}
.lg-b[aria-pressed="true"] .n{color:var(--acc)}
.cur{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:var(--bg2);border:1px solid var(--line2);margin-bottom:6px}
.cur div{flex:1;min-width:0;line-height:1.3}
.cur b{display:block;font-size:15px}
.cur small{font-size:12.5px;color:var(--mut)}
.pal-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:12px 0 2px}
.pal-h h2{font-size:16px}
.pal-h span{font-size:13px;color:var(--mut)}
.grp{font-size:12.5px;color:var(--mut);font-weight:600;padding:16px 0 6px;display:flex;justify-content:space-between;align-items:center;gap:10px}
.grp .gn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.grp .gn em{font-style:normal;font-weight:400;color:var(--dim)}
.grp .xh{display:inline-flex;align-items:center;gap:6px;color:var(--dim);font-weight:500;white-space:nowrap}
.grp .xh img{width:17px;height:11px}
/* riga partita */
.m{display:grid;grid-template-columns:44px minmax(0,1fr) auto 14px;align-items:center;gap:10px;width:100%;text-align:left;padding:11px 0;border-top:1px solid var(--line);transition:background .15s;color:inherit}
.m:active{background:var(--bg2)}
.m .t{font-size:14px;color:var(--mut);font-variant-numeric:tabular-nums}
.teams{display:grid;gap:3px;min-width:0}
.tm{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:500;min-width:0}
.tm span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tm.fav span{color:var(--acc)}
.crest{width:20px;height:20px;object-fit:contain;flex:none}
.kv{display:flex;gap:16px}
.kv div{display:grid;justify-items:end;line-height:1.15}
.kv small{font-size:11.5px;color:var(--dim)}
.kv b{font-family:var(--num);font-weight:600;font-size:19px;letter-spacing:.01em;color:var(--ink)}
.kv div:first-child b{color:var(--xor)}
.kv .x{display:none}
.kv .nd{font-size:12px;color:var(--dim)}
.chev{width:14px;height:14px;color:var(--dim)}

/* ---------- scheda partita ---------- */
.split .pane{display:none}
.split.has-sel .pane{display:block}
.split.has-sel .lst{display:none}
.dt{padding:2px 0 22px}
.back{display:inline-flex;align-items:center;gap:4px;font-size:14px;color:var(--mut);height:36px;margin-left:-4px;padding-right:8px}
.back svg{width:18px;height:18px}
.dt-h{display:grid;gap:6px;margin:6px 0 14px}
.dt-h .lg{font-size:13px;color:var(--mut)}
.dt-h h2{display:grid;gap:4px}
.dt-h h2 .tm{font-size:20px;font-weight:600;gap:10px;letter-spacing:-.01em}
.dt-h h2 .crest{width:26px;height:26px}
.dt-h .live{color:var(--edge);font-size:13px;font-weight:600}
.basis{font-size:12.5px;color:var(--dim);margin:0 0 14px}
.blk{border-radius:var(--r2);padding:12px 14px 6px;margin-bottom:12px;background:var(--bg2);border:1px solid var(--line2)}
.blk.nor{background:none}
.blk-h{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;margin:0 0 2px}
.blk-h img{width:17px;height:11px}
.blk-h .tg2{margin-left:auto;font-size:11.5px;font-weight:500;color:var(--mut);display:inline-flex;align-items:center;gap:6px}
.blk-h .tg2 i{width:8px;height:8px;border-radius:50%;background:var(--xor);display:block}
.blk-h .tg2 i.w{background:var(--ink)}
.blk-s{font-size:12.5px;color:var(--dim);margin:0 0 6px}
.blk .seg{margin:8px 0 2px}
table.ln{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.ln th{font-size:11.5px;font-weight:500;color:var(--dim);text-align:right;padding:8px 0 6px;border-bottom:1px solid var(--line);white-space:nowrap}
.ln th:first-child{text-align:left}
.ln th.oh{color:var(--ink);font-weight:600}
.ln th .ar{width:10px;height:10px;vertical-align:-1px;margin-left:2px}
.ln td{padding:9px 0;border-bottom:1px solid var(--line);text-align:right;font-size:14px;color:var(--mut)}
.ln tr:last-child td{border-bottom:0}
.ln td:first-child{text-align:left;color:var(--ink);font-weight:500;font-size:14.5px}
.ln td.ou{font-family:var(--num);font-weight:600;font-size:20px;color:var(--ink);line-height:1.1}
.ln td.ou.na{font-family:var(--body);font-size:12.5px;color:var(--dim);font-weight:400}
.ln td.xm{font-size:13.5px;color:var(--xor);font-weight:500}
.ln .c{width:62px}.ln .cx{width:58px}
.ln tr.r1 td{border-bottom:0;padding-bottom:0}
.ln tr.r2 td{text-align:left;font-size:12.5px;color:var(--dim);font-weight:400;padding:2px 0 9px}
.ln tr.r2 .v{color:var(--mut)}
.ln tr.r2 .av{color:var(--acc)}
.ln.tw td.ou{font-size:17px}
.ln .thg{color:var(--mut);text-align:center;padding-bottom:0;border-bottom:0}
.ln.tw .sep,.ln.nl .sep{border-left:1px solid var(--line)}
.ln.nl td{color:var(--ink)}
.ln.nl .c{width:50px}
.out{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;margin:8px 0 10px}
.out div{border-top:1px solid var(--line);padding-top:10px}
.out small{display:block;font-size:12px;color:var(--mut)}
.out b{font-size:15.5px;font-weight:600}
.out .xs{display:block;font-size:12px;color:var(--dim);margin-top:2px}
.arbn{display:block;font-size:12px;color:var(--dim);margin:6px 0 4px}
.legal-mini{font-size:12px;color:var(--dim);margin:12px 0 0}
.legal-mini b{color:var(--mut)}

/* ---------- home ---------- */
.hero{padding:6px 0 18px;display:grid;gap:12px;border-bottom:1px solid var(--line);margin-bottom:16px}
.hero h1{font-size:22px;line-height:1.22;max-width:24ch}
.hero h1 span{color:var(--acc)}
.hero p{margin:0;color:var(--mut);font-size:14.5px;max-width:52ch}
.hero p b{color:var(--ink);font-weight:600}
.hero .row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
.hero .free{font-size:13px;color:var(--mut)}
.hero .free b{color:var(--ink);font-weight:600}
.mine-next{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--r2);background:var(--bg2);border:1px solid var(--line2);margin-bottom:14px}
.mine-next div{flex:1;min-width:0}
.mine-next small{display:block;font-size:12.5px;color:var(--mut)}
.mine-next b{font-size:15px}
/* scelte */
.picks{display:grid}
.pk{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;padding:12px 0;border-top:1px solid var(--line);text-align:left;width:100%}
.pk .a{font-size:13px;color:var(--mut);display:flex;align-items:center;gap:6px}
.pk .a img{width:16px;height:10px}
.pk .b{font-size:14.5px;font-weight:500}
.pk .a,.pk .b{grid-column:1}
.pk .c{font-size:16px;font-weight:600;grid-column:1/-1;margin-top:4px;display:block}
.pk .c li{list-style:none}
.pk .c ul{margin:0;padding:0;display:grid;gap:2px}
.pk .n2{grid-column:1/-1;font-size:12.5px;color:var(--dim)}
.pk .d{grid-row:1/3;grid-column:2;align-self:start;text-align:right;line-height:1.2}
.pk .d small{display:block;font-size:11.5px;color:var(--dim)}
.pk .d b{font-size:13.5px;font-weight:600;color:var(--xor)}
.pk:hover .b{color:var(--acc)}
.nw{white-space:nowrap}
/* bilancio */
.rec{display:grid;gap:14px;padding:14px 0 6px;border-top:1px solid var(--line)}
.rec .big{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.rec .big b{font-family:var(--num);font-size:40px;font-weight:600;line-height:1;color:var(--ok)}
.rec .big span{font-size:14px;color:var(--mut)}
.bar{height:6px;border-radius:3px;background:var(--bg3);overflow:hidden}
.bar i{display:block;height:100%;background:var(--ok);border-radius:3px}
.rec dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px;margin:0}
.rec dt{font-size:12.5px;color:var(--mut)}
.rec dd{margin:0;font-size:16px;font-weight:600}
.rec dd small{font-weight:400;color:var(--dim);font-size:12.5px;margin-left:4px}
.rec dd.ok{color:var(--ok)}.rec dd.edge{color:var(--edge)}
.rec .exp{font-size:12.5px;color:var(--dim);margin:0;line-height:1.5}
.rec .exp b.ok{color:var(--ok)}.rec .exp b.edge{color:var(--edge)}
/* seguici e lancio */
.lancio{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;padding:14px 16px;border-radius:var(--r2);background:var(--bg2);border:1px solid var(--line2);margin:18px 0}
.lancio img{width:30px;height:20px}
.lancio>div{flex:1 1 220px}
.lancio b{display:block;font-size:14.5px}
.lancio p{margin:2px 0 0;font-size:13.5px;color:var(--mut)}
.tg{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;padding:16px 0;border-top:1px solid var(--line);margin-top:26px}
.tg>svg{width:34px;height:34px;flex:none}
.tg>div{flex:1 1 240px}
.tg h3{font-size:15px}
.tg p{margin:2px 0 0;font-size:13.5px;color:var(--mut)}
.tg-b{display:flex;gap:8px;flex-wrap:wrap}

/* ---------- campionato: classifica, marcatori, statistiche ---------- */
.card{border:1px solid var(--line2);border-radius:var(--r2);background:var(--bg)}
.card.pad{padding:14px 16px}
.card h3{font-size:14.5px}
.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tbl{width:100%;border-collapse:collapse;font-size:13.5px;font-variant-numeric:tabular-nums}
.tbl th{font-size:12px;font-weight:500;color:var(--dim);text-align:right;padding:10px 10px;border-bottom:1px solid var(--line2);white-space:nowrap}
.tbl td{padding:10px 10px;border-bottom:1px solid var(--line);text-align:right;vertical-align:middle}
.tbl tr:last-child td{border-bottom:0}
.tbl th:nth-child(2),.tbl td:nth-child(2),.tbl.left th,.tbl.left td,.tbl td.l,.tbl th.l{text-align:left}
.tbl td b{font-weight:600}
.tbl td .crest{vertical-align:-5px;margin-right:6px}
.tbl tr.mine td{background:var(--acc-bg)}
.tbl .pts{font-weight:700;color:var(--ink)}
.tbl .sep{border-left:1px solid var(--line)}
.forma{display:inline-flex;gap:3px}
.forma i{width:18px;height:18px;border-radius:5px;display:grid;place-items:center;font-style:normal;font-size:10.5px;font-weight:700}
.forma .fW{background:var(--ok-bg);color:var(--ok)}.forma .fD{background:var(--bg3);color:var(--mut)}.forma .fL{background:var(--bad-bg);color:var(--bad)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));border:1px solid var(--line2);border-radius:var(--r2);overflow:hidden;margin-bottom:16px}
.stat{padding:12px 14px;display:grid;gap:2px;border-left:1px solid var(--line);border-top:1px solid var(--line);margin:0 0 -1px -1px}
.stat small{font-size:12.5px;color:var(--mut)}
.stat strong{font-size:22px;font-weight:600;letter-spacing:-.02em;line-height:1.2}
.stat em{font-style:normal;font-size:12px;color:var(--dim)}
.stat em.up{color:var(--ok)}
.two,.three{display:grid;gap:14px}
.hb{display:grid;gap:9px}
.hb-r{display:grid;grid-template-columns:minmax(90px,140px) minmax(0,1fr) 40px;gap:10px;align-items:center;font-size:13px}
.hb-l{color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hb-l .crest{width:16px;height:16px;vertical-align:-3px;margin-right:5px}
.hb-t{height:8px;border-radius:4px;background:var(--bg3);overflow:hidden}
.hb-t i{display:block;height:100%;background:var(--ink);opacity:.75;border-radius:4px}
.hb-v{font-weight:600;text-align:right}
.bars{display:flex;align-items:flex-end;gap:3px;height:120px;border-bottom:1px solid var(--line)}
.bars i{flex:1;background:var(--acc);border-radius:3px 3px 0 0;opacity:.85;min-height:3px}
.bars i:last-child{background:var(--ink)}
.bars-x{display:flex;justify-content:space-between;font-size:11.5px;color:var(--dim);margin-top:6px}
.lrow{display:flex;align-items:center;gap:10px;padding:11px 14px;border-top:1px solid var(--line)}
.lrow:first-child{border-top:0}
.lrow .m-teams{display:flex;align-items:center;gap:6px;font-size:14.5px}
.lrow .m-teams i{font-style:normal;color:var(--dim)}

/* ---------- moduli ---------- */
.form{max-width:440px;margin:10px auto 0}
.panel{border:1px solid var(--line2);border-radius:var(--r2);padding:18px;background:var(--bg)}
.panel h1{font-size:21px;margin-bottom:6px}
.panel h3{font-size:15px}
.panel>.mut{font-size:14px}
.fld{display:grid;gap:6px;margin-bottom:14px}
.fld label,.fld .lb{font-size:13.5px;font-weight:500;color:var(--ink)}
.fld input,.fld select,.fld textarea,.copy input,.sel-data select,.adm input[type=number],.adm select{width:100%;height:42px;border-radius:9px;border:1px solid var(--line2);background:var(--bg2);padding:0 12px;font-size:15px;color:var(--ink);outline:0;transition:border-color .15s}
.fld textarea{height:auto;min-height:90px;padding:10px 12px}
.fld input:focus,.fld select:focus,.fld textarea:focus,.copy input:focus{border-color:var(--acc)}
.fld input:disabled{opacity:.6}
.fld input::placeholder{color:var(--faint)}
.hint{font-size:12.5px;color:var(--dim)}
.tagopt{font-size:11.5px;font-weight:400;color:var(--dim);margin-left:4px}
.chk{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;color:var(--mut);margin:0 0 12px;cursor:pointer;line-height:1.45}
.chk b{color:var(--ink);font-weight:600}
.chk input{appearance:none;-webkit-appearance:none;flex:none;width:20px;height:20px;margin:1px 0 0;border-radius:6px;border:1px solid var(--line3);background:var(--bg2);display:grid;place-items:center;cursor:pointer;transition:background .15s,border-color .15s}
.chk input:checked{background:var(--acc);border-color:var(--acc)}
.chk input:checked::after{content:"";width:10px;height:6px;border:2px solid var(--acc-ink);border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg)}
.alt{text-align:center;font-size:14px;color:var(--mut);margin:14px 0 0}
.copy{display:flex;gap:8px}
.copy input{flex:1;min-width:0}
.sel-data{display:grid;grid-template-columns:1fr 1.4fr 1.1fr;gap:8px}
.profile-grid{display:grid;gap:14px}
.stretto{max-width:520px}
.mfa-passi{padding-left:18px;font-size:14px;color:var(--mut)}
.mfa-passi li{margin-bottom:8px}
.qr{background:#fff;padding:10px;border-radius:10px;width:max-content;max-width:100%}
.qr svg,.qr img{display:block;width:180px;height:180px}
.chiave{font-family:ui-monospace,Menlo,monospace;font-size:13px;word-break:break-all;background:var(--bg2);padding:8px 10px;border-radius:8px}
.pw-w{position:relative;display:block}
.pw-w input{padding-right:44px}
.occhio{position:absolute;right:4px;top:50%;translate:0 -50%;width:36px;height:36px;display:grid;place-items:center;color:var(--mut);border-radius:8px}
.occhio svg{width:18px;height:18px}
.acts{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end;margin-top:14px}
.row-act{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}

/* ---------- finestre e avvisi ---------- */
.ov{position:fixed;inset:0;z-index:90;background:var(--scrim);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:grid;place-items:center;padding:16px;animation:velo .2s ease-out}
.modal{width:min(460px,100%);max-height:calc(100dvh - 32px);overflow-y:auto;background:var(--bg2);border:1px solid var(--line2);border-radius:16px;padding:20px;box-shadow:0 30px 60px -20px rgba(0,0,0,.9);animation:finestra .26s var(--out)}
@keyframes finestra{from{opacity:0;transform:translateY(10px) scale(.98)}}
.modal h2{font-size:18px;margin-bottom:8px}
.modal .mut{font-size:14px}
.ov.gate .modal .acts{justify-content:stretch}
.ov.gate .modal .acts .btn{flex:1}
.toast{position:fixed;left:50%;bottom:calc(24px + var(--sab));translate:-50% 0;z-index:95;background:var(--ink);color:var(--bg);font-size:14px;font-weight:600;border-radius:10px;padding:10px 16px;box-shadow:0 12px 30px -8px rgba(0,0,0,.7);animation:avviso .25s var(--out);max-width:calc(100vw - 32px)}
@keyframes avviso{from{opacity:0;transform:translateY(8px)}}
html.app .toast{bottom:calc(96px + var(--sab))}

/* ---------- pagine di testo: guida e note legali ---------- */
.doc{max-width:720px}
.doc h1{font-size:24px;margin-bottom:8px}
.doc h2{font-size:17px;margin:28px 0 8px}
.doc h3{font-size:15px;margin:18px 0 6px}
.doc p,.doc li,.doc dd{font-size:14.5px;color:var(--doc-ink);line-height:1.6}
.doc ul,.doc ol{padding-left:20px}
.doc .upd{font-size:13px;color:var(--dim)}
.gloss{margin:0}
.gloss dt{font-weight:600;font-size:14.5px;margin-top:12px}
.gloss dd{margin:2px 0 0}
.help{font-size:13.5px;color:var(--mut);background:var(--bg2);border-radius:var(--r);padding:12px 14px;margin-top:24px}
.passi{padding-left:20px}
.gex{border:1px solid var(--line2);border-radius:var(--r);padding:10px 12px;margin:10px 0}
.gex-r{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:14.5px}
.pk-ou{display:inline-flex;gap:6px;flex-wrap:wrap}
.pick{display:inline-flex;align-items:baseline;gap:6px;border:1px solid var(--line2);border-radius:8px;padding:3px 9px}
.pick .ou{font-size:12px;color:var(--mut)}
.pick .lv{font-family:var(--num);font-size:18px;font-weight:600}
.pick.xm .ou,.pick.xm .lv{color:var(--xor)}
.pick.xm .lv{font-family:var(--body);font-size:13.5px}

/* ---------- piede ---------- */
.foot{border-top:1px solid var(--line);padding:22px max(var(--gut),var(--sar)) calc(28px + var(--sab)) max(var(--gut),var(--sal));font-size:13px;color:var(--mut)}
.foot .in{max-width:var(--wrap);margin:0 auto;display:grid;gap:12px}
.foot .rg{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;color:var(--dim)}
.foot .links{display:flex;flex-wrap:wrap;gap:6px 16px}
.foot .links a{color:var(--ink)}
.foot .links a:hover{color:var(--acc)}
.foot p{margin:0;font-size:12px;color:var(--dim)}
html.app .foot{display:none}

/* ---------- installazione (finestra e pagina App) ---------- */
.appm .app-top{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.appm .app-top img{border-radius:12px}
.appm h2{margin:0 0 2px}
.come{margin:14px 0 0;border-top:1px solid var(--line);padding-top:10px}
.come summary{cursor:pointer;font-size:14px;color:var(--acc);font-weight:600}
.ptabs{margin:12px 0}
.app-hero{display:flex;align-items:center;gap:16px;margin-bottom:16px}
.app-hero img{border-radius:18px;width:72px;height:72px}
.why{padding-left:18px;color:var(--mut);font-size:14px}
.isteps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:20px}
.isteps li{display:grid;grid-template-columns:34px 1fr;gap:12px}
.inum{width:28px;height:28px;border-radius:50%;background:var(--acc);color:var(--acc-ink);font-weight:700;font-size:14px;display:grid;place-items:center}
.ibody h4{font-size:15px;margin-bottom:4px}
.ibody p{font-size:14px;color:var(--mut);margin:0 0 10px}
.ill{width:100%;max-width:340px;height:auto;display:block;color:var(--ink);overflow:visible}
.ill text{font-family:var(--body);font-size:12px;fill:var(--ink)}
.ill .i-bg{fill:var(--bg);stroke:var(--line3)}
.ill .i-row{fill:var(--bg3)}
.ill .i-rowhl{fill:var(--acc-bg);stroke:var(--acc);stroke-width:1.6}
.ill .i-t{fill:var(--ink)}.ill .i-tb{fill:var(--ink);font-weight:700}.ill .i-m{fill:var(--mut);font-size:10.5px}
.ill .i-hint{fill:var(--acc);font-weight:700;font-size:12.5px}
.ill .i-line{stroke:var(--line3)}
.ill .i-ic{color:var(--mut)}
.ill .i-hlicon{color:var(--acc)}
.ill .i-ring{fill:none;stroke:var(--acc);stroke-width:3.5}
.ill .i-ring2{fill:none;stroke:var(--acc);stroke-width:2.5;transform-box:fill-box;transform-origin:center;animation:ping 1.8s ease-out infinite}
@keyframes ping{0%{transform:scale(1);opacity:.9}100%{transform:scale(1.35);opacity:0}}

/* ---------- barra in basso: solo nell'app installata ---------- */
.bnav{display:none}
html.app .bnav{display:grid;position:fixed;left:0;right:0;bottom:0;z-index:40;grid-template-columns:repeat(5,1fr);align-items:end;background:var(--hdr);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line2);padding:0 calc(4px + var(--sar)) calc(6px + var(--sab)) calc(4px + var(--sal))}
.bnav .ind{position:absolute;top:-1px;left:calc(4px + var(--sal));width:calc((100% - 8px - var(--sal) - var(--sar))/5);height:2px;display:flex;justify-content:center;transition:transform .38s var(--spring),opacity .2s}
.bnav .ind::before{content:"";width:44%;height:2px;border-radius:2px;background:var(--acc)}
.bnav a{display:grid;justify-items:center;gap:3px;font-size:11px;font-weight:500;color:var(--dim);padding:9px 0 3px;position:relative;transition:color .2s;min-width:0}
.bnav a span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.bnav a svg{width:23px;height:23px;transition:transform .32s var(--spring)}
.bnav a.on{color:var(--ink)}
.bnav a.on svg{color:var(--acc)}
.bnav a.pop svg{animation:pop .42s var(--spring)}
@keyframes pop{0%{transform:scale(1)}35%{transform:scale(.78) translateY(1px)}100%{transform:scale(1)}}
.bnav .bx{padding-top:0}
.bx-c{position:relative;display:grid;place-items:center;width:58px;height:58px;margin-top:-24px;margin-bottom:1px;border-radius:50%;background:var(--bg2);border:1px solid rgba(139,92,246,.55);box-shadow:0 0 0 4px var(--bg),0 0 22px rgba(255,138,61,.28),0 0 34px rgba(139,92,246,.24);transition:transform .2s var(--out),box-shadow .3s ease,border-color .3s}
.bx-c img{width:38px;height:auto}
.bnav .bx:active .bx-c{transform:scale(.92)}
.bnav .bx.on .bx-c{border-color:var(--acc);box-shadow:0 0 0 4px var(--bg),0 0 26px rgba(255,138,61,.45),0 0 44px rgba(139,92,246,.36)}
.bnav .bx.pop .bx-c{animation:glow .6s var(--out)}
@keyframes glow{0%{transform:scale(.9)}40%{transform:scale(1.06)}100%{transform:scale(1)}}
.bnav .bx.pop .bx-c::after{content:"";position:absolute;inset:-1px;border-radius:50%;border:1px solid var(--vio);animation:ring .6s var(--out) forwards}
@keyframes ring{from{transform:scale(1);opacity:.8}to{transform:scale(1.5);opacity:0}}
.ios-hap{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;overflow:hidden;left:0;top:0}
/* app installata: niente presentazione, intestazione compatta, spazio per la barra */
html.app .hero,html.app .how,html.app .lancio,html.app .tg{display:none}
html.app .apph~.lh{display:none}
html.app main{padding-bottom:calc(110px + var(--sab))}
html.app .top{display:none}
html.app main{padding-top:calc(14px + var(--sat))}
html.app .lh:has(+ *) {margin-top:0}
.apph{display:none}
html.app .apph{display:flex;align-items:center;gap:10px;margin:0 0 10px}
html.app .apph h1{font-size:21px}
html.app .apph small{display:block;font-size:12.5px;color:var(--mut)}

/* ---------- pannello admin ---------- */
.adm{display:grid;gap:18px}
.adm-side{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;margin:0 calc(-1 * var(--gut));padding:0 var(--gut) 4px;border-bottom:1px solid var(--line)}
.adm-side::-webkit-scrollbar{display:none}
.adm-side .glab{display:none}
.an{flex:none;display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:8px;font-size:14px;color:var(--mut);text-align:left;transition:background .15s,color .15s;white-space:nowrap}
.an:hover{background:var(--bg2);color:var(--ink)}
.an.on{background:var(--bg3);color:var(--ink)}
.an.on svg{color:var(--acc)}
.an svg{width:18px;height:18px;flex:none}
.an img{width:18px;height:12px;flex:none}
.an .badge{margin-left:auto;font-size:11.5px;font-weight:600;border-radius:999px;padding:0 7px;line-height:18px;background:var(--acc-bg);color:var(--acc)}
.an .badge.bad{background:var(--bad-bg);color:var(--bad)}
.adm-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.adm-top h1{font-size:22px}
.adm-top p{margin:2px 0 0;font-size:13px;color:var(--mut)}
.adm-top .grow{flex:1;min-width:200px}
.live2{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--mut);border:1px solid var(--line2);border-radius:999px;padding:5px 11px}
.live2 i{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px var(--ok-bg)}
.todo{display:grid;gap:12px}
.td{border:1px solid var(--line2);border-radius:var(--r2);padding:14px 16px;display:grid;gap:10px;align-content:start;background:var(--bg2)}
.td .h{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600}
.td .h i{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex:none}
.td .h i svg{width:17px;height:17px}
.td .h i img{width:18px;height:12px}
.td p{margin:0;font-size:13px;color:var(--mut)}
.td .btn{justify-self:start}
.td.ok-t{background:none}
.ic-acc{background:var(--acc-bg);color:var(--acc)}.ic-bad{background:var(--bad-bg);color:var(--bad)}.ic-ok{background:var(--ok-bg);color:var(--ok)}.ic-edge{background:var(--edge-bg);color:var(--edge)}
/* impostazioni: interruttori al posto delle caselle */
.adm .panel{padding:0;overflow:hidden}
.adm .panel>h3{padding:14px 16px 10px;margin:0!important}
.adm .panel>.fld,.adm .panel>p{padding:0 16px}
.adm .panel>.fld{padding-top:4px}
.adm .chk{display:flex;align-items:center;justify-content:space-between;flex-direction:row-reverse;gap:16px;margin:0;padding:13px 16px;border-top:1px solid var(--line);font-size:14px;color:var(--ink)}
.adm .chk input{width:42px;height:24px;border-radius:999px;background:var(--bg4);border:1px solid var(--line2);position:relative;margin:0;display:block}
.adm .chk input::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:var(--ink);border:0;transform:none;transition:transform .25s var(--spring)}
.adm .chk input:checked{background:var(--acc);border-color:var(--acc)}
.adm .chk input:checked::after{transform:translateX(18px);background:#fff;width:18px;height:18px;border:0}
.adm .panel>.mut{padding:0 16px 14px;margin:0}
/* scelte XOR: tre passi */
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line2);border-radius:var(--r2);overflow:hidden;margin-bottom:12px}
.st2{display:flex;align-items:center;gap:10px;padding:11px 14px;border-left:1px solid var(--line);font-size:13.5px;color:var(--mut);min-width:0}
.st2:first-child{border-left:0}
.st2 i{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:700;border:1px solid var(--line2);flex:none}
.st2.on{color:var(--ink);background:var(--bg2)}
.st2.on i{background:var(--acc);border-color:var(--acc);color:var(--acc-ink)}
.st2.done i{background:var(--ok-bg);border-color:transparent;color:var(--ok)}
.st2 b{display:block;font-weight:600}
.st2 small{display:block;font-size:12px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st2>span{min-width:0}
.xc-w{display:grid;gap:14px}
.xc-s{border:1px solid var(--line2);border-radius:var(--r2);padding:10px;display:grid;gap:8px;align-content:start}
.xc-f{display:grid;gap:6px}
.xc-f select,.xc-f input{height:36px;border-radius:9px;border:1px solid var(--line2);background:var(--bg2);padding:0 10px;font-size:14px;width:100%}
.xc-lista{max-height:400px;overflow-y:auto;display:grid;scrollbar-width:thin}
.xc-p{display:grid;grid-template-columns:62px minmax(0,1fr);gap:2px 8px;text-align:left;padding:8px;border-radius:9px;align-items:center}
.xc-p:hover{background:var(--bg2)}
.xc-p.on{background:var(--acc-bg)}
.xc-p .m-time{font-size:12.5px;color:var(--mut);grid-row:1/3}
.xc-p b{font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xc-p .m-lega{font-size:12px;color:var(--dim)}
.xc-c{border:1px solid var(--line2);border-radius:var(--r2);padding:16px;display:grid;gap:14px;align-content:start}
.xc-t b{display:block;font-size:16px}
.xc-t .mut{font-size:13px}
.xc-g h4{margin:0 0 6px;font-size:12.5px;font-weight:600;color:var(--mut)}
.xc-o{display:flex;flex-wrap:wrap;gap:6px}
.xc-l{display:inline-flex;align-items:center;gap:8px;min-height:32px;padding:4px 11px;border-radius:9px;border:1px solid var(--line2);font-size:13px;transition:background .15s,border-color .15s;text-align:left}
.xc-l:hover{border-color:var(--mut)}
.xc-l i{font-style:normal;font-size:12px;color:var(--xor)}
.xc-l.on{background:var(--acc-bg);border-color:var(--acc);color:var(--acc);font-weight:600}
.xc-a{position:sticky;bottom:0;display:grid;gap:10px;padding:12px 14px;border-radius:12px;background:var(--bg3);border:1px solid var(--line2)}
.xc-r b{display:block;font-size:14px}
.xc-r .mut{font-size:13px}
.xc-r ul{margin:4px 0 0;padding-left:18px;font-size:13px;color:var(--mut)}
.xc h2{font-size:18px}
.adm .two,.adm .three{gap:14px}
.mrg{max-width:90px}

/* ---------- computer ---------- */
@media (min-width:900px){
  :root{--gut:28px}
  h1{font-size:28px}
  .top{gap:16px}
  .top .nav{display:flex}
  .top .menu-btn{display:none}
  .top .reg,.top .adm-btn,.top .prof-btn{display:inline-flex}
  .top .acc-btn{display:inline-flex}
  .hero{grid-template-columns:minmax(0,1fr) auto;align-items:end;padding:10px 0 22px}
  .hero h1{font-size:28px;max-width:30ch}
  .hero .btn{display:none}
  main{padding-top:22px}
  .cols{display:grid;grid-template-columns:260px minmax(0,1fr) 410px;align-items:start;border-top:1px solid var(--line);margin:0 calc(-1 * var(--gut))}
  .cols>.filt{position:sticky;top:61px;max-height:calc(100dvh - 61px);overflow-y:auto;padding:16px 14px 24px 28px;border-right:1px solid var(--line);display:grid;gap:2px;align-content:start;scrollbar-width:thin}
  .cols>.lst{padding:6px 24px 24px;border-right:1px solid var(--line);min-height:70vh;min-width:0}
  .cols>.pane{position:sticky;top:61px;max-height:calc(100dvh - 61px);overflow-y:auto;padding:14px 28px 24px 22px;scrollbar-width:thin}
  .cols.two-c{grid-template-columns:minmax(0,1fr) 420px}
  .cols.two-c>.lst{padding-left:28px}
  .split .pane,.split .lst{display:block!important}
  .filt .mode button{height:34px;font-size:12.5px;padding:0 4px}
  .filt .mode button svg{display:none}
  .filt .search{margin-bottom:10px}
  .filt .days{display:none}
  .filt .dayv{display:grid;gap:2px}
  .dv{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:9px;font-size:14px;color:var(--mut);text-align:left;transition:background .15s,color .15s}
  .dv:hover{background:var(--bg2);color:var(--ink)}
  .dv b{font-weight:600;color:var(--ink);width:60px}
  .dv .n{margin-left:auto;font-size:12.5px;color:var(--dim)}
  .dv[aria-pressed="true"]{background:var(--acc-bg);color:var(--acc)}
  .dv[aria-pressed="true"] b,.dv[aria-pressed="true"] .n{color:var(--acc)}
  .dv.off{opacity:.45}
  .filt .nat-b{font-size:14px;padding:10px 4px}
  .filt .lg-b{font-size:13.5px;padding:7px 4px 7px 8px}
  .kv .x{display:grid}
  .m{grid-template-columns:52px minmax(0,1fr) auto 14px;padding:12px 10px;margin:0 -10px;width:calc(100% + 20px);border-radius:8px}
  .m:hover{background:var(--bg2)}
  .m[aria-current="true"]{background:var(--bg2);box-shadow:inset 2px 0 0 var(--acc)}
  .dt .back{display:none}
  .low{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;border-top:1px solid var(--line);margin-top:8px}
  .rec dl{grid-template-columns:repeat(4,minmax(0,1fr))}
  .foot .in{grid-template-columns:minmax(0,1fr) auto;align-items:start}
  .two{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .three{grid-template-columns:repeat(3,minmax(0,1fr))}
  .profile-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .tabs{margin-left:0;margin-right:0;padding:0}
  .chips{margin:0;padding:0;flex-wrap:wrap}
  /* admin a due colonne */
  .adm{grid-template-columns:220px minmax(0,1fr);align-items:start;gap:28px}
  .adm-side{position:sticky;top:76px;flex-direction:column;overflow:visible;margin:0;padding:0;border:0;gap:2px}
  .adm-side .glab{display:block;font-size:11.5px;color:var(--dim);font-weight:500;padding:14px 10px 4px}
  .adm-main{min-width:0;display:grid;gap:18px;align-content:start}
  .todo{grid-template-columns:repeat(3,minmax(0,1fr))}
  .xc-w{grid-template-columns:330px minmax(0,1fr);align-items:start}
}
@media (max-width:899px){
  .low .sec-h:first-child{margin-top:26px}
  .steps{grid-template-columns:1fr}
  .st2{border-left:0;border-top:1px solid var(--line)}
  .st2:first-child{border-top:0}
}
@media (max-width:380px){.kv{gap:10px}.m{grid-template-columns:40px minmax(0,1fr) auto 12px;gap:8px}}

/* ---------- schermata di caricamento: solo il marchio, fermo ---------- */
#splash{display:grid;position:fixed;inset:0;z-index:200;place-items:center;background:var(--bg);padding:var(--sat) var(--sar) var(--sab) var(--sal);transition:opacity .35s var(--out),visibility .35s;animation:sp-out .35s var(--out) 14s both}
#splash.esci{opacity:0;visibility:hidden}
.sp-logo{width:min(46vw,200px);height:auto;margin-top:-4vh}
@keyframes sp-out{to{opacity:0;visibility:hidden}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  #splash{display:none!important}
  .ill .i-ring2{animation:none;opacity:.4}
}
@media (forced-colors:active){.btn.pri,.pill,.chip.on{border:1px solid CanvasText}}

/* ===================== v2.1 (19 ott): spaziature a regola, riquadri neon, scheda rifatta ===================== */
/* scala delle spaziature: 4 · 8 · 12 · 16 · 20 · 24 · 32 · 40 */
:root{--s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:20px;--s6:24px;--s7:32px;--s8:40px;--neon-o:rgba(255,138,61,.55);--neon-v:rgba(139,92,246,.6)}
main{padding-top:var(--s5);padding-bottom:var(--s8)}
.sec-h{margin:var(--s8) 0 var(--s3)}
.lh{margin:0 0 var(--s5)}
.panel{padding:var(--s5)}
.panel h3{margin-bottom:var(--s3)!important}
.panel form{display:block}
.card.pad{padding:var(--s4) var(--s5)}
.stats{margin-bottom:var(--s5)}
.stat{padding:var(--s4)}
.empty{padding:var(--s6) 0}
.crest-fb{width:20px;height:20px;border-radius:50%;background:var(--bg3);border:1px solid var(--line2);display:inline-grid;place-items:center;font-size:8.5px;font-weight:700;color:var(--mut);flex:none;letter-spacing:0}
.lg{width:20px;height:20px;object-fit:contain;background:#fff;border-radius:5px;padding:2px;flex:none}
.flag{display:inline-flex;flex:none;border-radius:3px;overflow:hidden;box-shadow:0 0 0 1px var(--line2)}
.flag svg{display:block;width:22px;height:15px}

/* riquadri neon: Over arancio, XOR viola, Under neutro (come nel sito di prima, in piccolo) */
.nb{display:inline-flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;padding:7px 10px 6px;border-radius:9px;border:1px solid var(--line3);background:var(--tint)}
.nb i{font-style:normal;font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
.nb b{font-family:var(--num);font-weight:700;font-size:22px;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums}
.nb.o{border-color:var(--neon-o);background:rgba(255,138,61,.08);box-shadow:0 0 18px -8px rgba(255,138,61,.55)}
.nb.o i{color:var(--acc)}
.nb.x{border-color:var(--neon-v);background:rgba(139,92,246,.1);box-shadow:0 0 18px -8px rgba(139,92,246,.6)}
.nb.x i{color:var(--xor)}
.nb.x b{font-size:18px;color:var(--xor-num)}
.nb.na{border-style:dashed;background:none;box-shadow:none}
.nb.na b{font-family:var(--body);font-size:12px;font-weight:500;color:var(--dim)}
.nbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s2)}
.nbs.two{grid-template-columns:repeat(2,minmax(0,1fr))}

/* elenco: tutti i numeri uguali (bianchi) */
.kv div:first-child b{color:var(--ink)}
.grp .gn{display:flex;align-items:center;gap:var(--s2)}
.grp .gn .lg{width:18px;height:18px}

/* ---------- home: card iniziale, tre passi, lancio ---------- */
.hero{gap:var(--s5);padding:var(--s2) 0 var(--s7);margin-bottom:var(--s6)}
.hero-t{display:grid;gap:var(--s3);align-content:start}
.hero-t h1{font-size:24px;line-height:1.2;max-width:22ch}
.hero-t h1 span{color:var(--acc)}
.hp{border:1px solid var(--line2);border-radius:var(--r2);background:var(--bg2);box-shadow:inset 0 3px 0 var(--acc),0 30px 60px -30px rgba(0,0,0,.8);overflow:hidden;display:block}
.hp-h{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);padding:var(--s4) var(--s5) 0;font-size:12.5px;color:var(--mut)}
.hp-h span:first-child{display:flex;align-items:center;gap:var(--s2)}
.hp-t{display:grid;gap:6px;padding:var(--s3) var(--s5) var(--s4);border-bottom:1px solid var(--line)}
.hp-t .tm{font-size:19px;font-weight:600}
.hp-t .tm .crest{width:24px;height:24px}
.hp-r{display:grid;grid-template-columns:minmax(76px,.8fr) minmax(0,3fr);gap:var(--s3);align-items:center;padding:var(--s3) var(--s5);border-top:1px solid var(--line)}
.hp-r:first-of-type{border-top:0}
.hp-r>span{font-size:14px;font-weight:500}
.hp-f{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);flex-wrap:wrap;padding:var(--s3) var(--s5);border-top:1px solid var(--line);font-size:12.5px;color:var(--dim)}
.hp-f .pill{font-size:12.5px}
.how{list-style:none;margin:0 0 var(--s7);padding:0;display:grid;gap:var(--s4)}
.how li{display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:var(--s3);align-items:start}
.how .n{grid-row:span 2;font-family:var(--num);font-weight:700;font-size:40px;line-height:.9;color:var(--acc)}
.how h3{font-size:15px;margin:2px 0 2px}
.how p{margin:0;color:var(--mut);font-size:13.5px}
.lancio{position:relative;border:1px solid var(--neon-v);background:linear-gradient(90deg,rgba(139,92,246,.12),rgba(139,92,246,.05));box-shadow:inset 3px 0 0 var(--acc),0 0 30px -14px rgba(139,92,246,.7);padding:var(--s4) var(--s5);gap:var(--s3) var(--s5);margin:var(--s7) 0}
.lancio img{width:34px;height:22px}
.palw{margin-top:var(--s2)}

/* ---------- scheda della partita ---------- */
.dt{padding:0 0 var(--s6)}
.dt-h{gap:var(--s2);margin:var(--s1) 0 var(--s4)}
.dt-h .lg-n{display:flex;align-items:center;gap:var(--s2);font-size:13px;color:var(--mut)}
.dt-h h2{gap:6px}
.modo{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2);margin-bottom:var(--s3)}
.modo button{display:flex;align-items:center;justify-content:center;gap:var(--s2);height:44px;border-radius:11px;border:1px solid var(--line2);font-size:14px;font-weight:600;color:var(--mut);transition:background .2s,border-color .2s,color .2s,box-shadow .2s}
.modo button img{width:22px;height:15px}
.modo button:hover{color:var(--ink)}
.modo button.lab[aria-pressed="true"]{color:var(--ink);border-color:var(--neon-v);background:linear-gradient(90deg,rgba(255,138,61,.12),rgba(139,92,246,.16));box-shadow:0 0 22px -10px rgba(139,92,246,.8)}
.modo button.real[aria-pressed="true"]{color:var(--ink);border-color:var(--line3);background:var(--bg3)}
.dt .seg{margin-bottom:var(--s2)}
.basis{margin:0 0 var(--s4)}
.lines{display:grid}
.line{display:grid;gap:var(--s2);padding:var(--s3) 0;border-top:1px solid var(--line)}
.line:first-child{border-top:0;padding-top:var(--s1)}
.line .nm{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s3)}
.line .nm b{font-size:15px;font-weight:600}
.line .nm small{font-size:12px;color:var(--dim);text-align:right}
.line .sub{font-size:12.5px;color:var(--dim)}
.line .sub .av{color:var(--acc)}
.tline{display:grid;grid-template-columns:minmax(72px,auto) minmax(0,1fr);gap:var(--s2);align-items:center}
.tline>span{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--mut);min-width:0}
.tline>span em{font-style:normal;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tline .crest{width:16px;height:16px}
.res{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--s2);margin-top:var(--s3)}
.res>div{border:1px solid var(--line2);border-radius:11px;padding:var(--s3)}
.res>div.o{border-color:var(--neon-o);background:rgba(255,138,61,.07)}
.res small{display:block;font-size:12px;color:var(--mut)}
.res b{display:block;font-size:16px;font-weight:600;margin-top:2px}
.res .xs{display:block;font-size:12px;color:var(--dim);margin-top:2px}
.blk{padding:var(--s4)}
.blk-h{margin:0 0 var(--s1)}
.blk-s{margin:0 0 var(--s3)}
.blk .seg{margin:0 0 var(--s3)}
.real-t th .crest{width:18px;height:18px;vertical-align:-4px;margin-right:4px}
.pane .dt{padding-bottom:var(--s4)}
.open-full{display:inline-flex;align-items:center;gap:4px;font-size:13px;color:var(--acc);margin-top:var(--s3)}
.open-full svg{width:14px;height:14px}

/* ---------- scelte: riquadri con il bordo neon ---------- */
.picks{display:grid;gap:var(--s3)}
.pk{display:grid;grid-template-columns:none;gap:var(--s2);padding:var(--s4);border:1px solid var(--line2);border-radius:var(--r2);background:var(--bg2);transition:border-color .2s,box-shadow .2s,transform .2s var(--out)}
.pk:hover{border-color:var(--neon-o);box-shadow:0 0 26px -12px rgba(255,138,61,.7)}
.pk.xor{border-color:var(--neon-v);box-shadow:0 0 26px -14px rgba(139,92,246,.8)}
.pk .a{display:flex;align-items:center;justify-content:space-between;gap:var(--s2);font-size:12.5px;color:var(--mut);grid-column:auto}
.pk .a span{display:flex;align-items:center;gap:6px;min-width:0}
.pk .tag2{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--acc);display:flex;align-items:center;gap:6px}
.pk.xor .tag2{color:var(--xor)}
.pk .tms{display:grid;gap:4px}
.pk .tms .tm{font-size:15px}
.pk .giu{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);padding:var(--s3);border-radius:11px;border:1px solid var(--neon-o);background:rgba(255,138,61,.08)}
.pk.xor .giu{border-color:var(--neon-v);background:rgba(139,92,246,.1)}
.pk .giu b{font-size:16px;font-weight:700;line-height:1.3}
.pk .giu ul{margin:0;padding:0;list-style:none;display:grid;gap:2px;font-size:15px;font-weight:700}
.pk .giu small{display:block;text-align:right;font-size:11px;color:var(--dim);white-space:nowrap}
.pk .giu small b{display:block;font-size:14px;color:var(--xor);font-weight:600}
.pk .n2{font-size:12px;color:var(--dim)}
.pk .c,.pk .d,.pk .b{display:none}

/* ---------- bilancio con i filtri ---------- */
.flt{display:grid;gap:var(--s3);padding:var(--s4);border:1px solid var(--line2);border-radius:var(--r2);background:var(--bg2);margin-bottom:var(--s5)}
.flt .r{display:grid;gap:6px}
.flt .r>span{font-size:12px;color:var(--mut);font-weight:500}
.flt .chips{margin:0;padding:0;flex-wrap:wrap;overflow:visible}
.flt select{height:36px;border-radius:9px;border:1px solid var(--line2);background:var(--bg);padding:0 10px;font-size:14px;max-width:100%}
.flt .reset{justify-self:start;font-size:13px;color:var(--acc)}
.ins{display:grid;gap:var(--s2);margin-top:var(--s5)}
.ins h3{font-size:14.5px;margin-bottom:var(--s1)}
.insr{display:grid;grid-template-columns:minmax(110px,1.2fr) minmax(0,2fr) 92px;gap:var(--s3);align-items:center;font-size:13.5px;padding:6px 0;border-top:1px solid var(--line)}
.insr:first-of-type{border-top:0}
.insr .t2{height:8px;border-radius:4px;background:var(--bg3);overflow:hidden}
.insr .t2 i{display:block;height:100%;border-radius:4px;background:var(--ok)}
.insr b{text-align:right;font-variant-numeric:tabular-nums}
.insr b small{font-weight:400;color:var(--dim);font-size:12px;margin-left:4px}
.tip{display:flex;gap:var(--s2);align-items:flex-start;font-size:13.5px;color:var(--mut);padding:var(--s3) var(--s4);border-radius:11px;border:1px solid rgba(79,209,139,.35);background:var(--ok-bg);margin-top:var(--s4)}
.tip b{color:var(--ok)}

/* ---------- admin: niente pannelli a filo ---------- */
.adm .panel{padding:var(--s5);overflow:visible}
.adm .panel>h3{padding:0;margin:0 0 var(--s3)!important}
.adm .panel>.fld,.adm .panel>p{padding:0}
.adm .panel>.fld{padding-top:0}
.adm .panel>.mut{padding:0;margin:var(--s2) 0 0}
.adm .chk{display:flex;align-items:flex-start;flex-direction:row;justify-content:flex-start;gap:10px;margin:0 0 var(--s3);padding:0;border:0;font-size:13.5px;color:var(--mut)}
.adm .chk input{width:20px;height:20px;border-radius:6px;background:var(--bg2);border:1px solid var(--line3);display:grid;place-items:center}
.adm .chk input::after{content:none}
.adm .chk input:checked{background:var(--acc);border-color:var(--acc)}
.adm .chk input:checked::after{content:"";position:static;width:10px;height:6px;border:2px solid var(--acc-ink);border-top:0;border-right:0;border-radius:0;background:none;transform:translateY(-1px) rotate(-45deg)}
/* interruttori solo nei riquadri delle impostazioni */
.adm .panel.sw{padding:0;overflow:hidden}
.adm .panel.sw>h3{padding:var(--s4) var(--s5) var(--s2);margin:0!important}
.adm .panel.sw>.fld{padding:0 var(--s5)}
.adm .panel.sw>.mut{padding:0 var(--s5) var(--s4);margin:0}
.adm .panel.sw .chk{align-items:center;justify-content:space-between;flex-direction:row-reverse;gap:var(--s4);margin:0;padding:var(--s3) var(--s5);border-top:1px solid var(--line);font-size:14px;color:var(--ink)}
.adm .panel.sw .chk input{width:42px;height:24px;border-radius:999px;background:var(--bg4);border:1px solid var(--line2);position:relative;display:block}
.adm .panel.sw .chk input::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:var(--ink);border:0;transform:none;transition:transform .25s var(--spring)}
.adm .panel.sw .chk input:checked{background:var(--acc);border-color:var(--acc)}
.adm .panel.sw .chk input:checked::after{transform:translateX(18px);background:#fff;width:18px;height:18px;border:0}
.adm .profile-grid{gap:0 var(--s4)}
.adm .card.scroll{margin-bottom:var(--s5)}
.adm .tbl th,.adm .tbl td{padding:var(--s3) var(--s4)}
.adm .explain{margin-bottom:var(--s5)}
.adm-main{gap:var(--s5)}
.howto{display:grid;gap:var(--s2);font-size:13.5px;color:var(--mut);padding:var(--s4) var(--s5);border:1px solid var(--line2);border-radius:var(--r2);background:var(--bg2)}
.howto b{color:var(--ink)}
.howto ol{margin:0;padding-left:18px;display:grid;gap:4px}

@media (min-width:900px){
  .hero{grid-template-columns:minmax(0,1fr) minmax(0,460px);align-items:center;gap:var(--s8)}
  .hero-t h1{font-size:32px}
  .how{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s6)}
  .picks{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--s4)}
  .low .picks{grid-template-columns:1fr}
  .low{gap:var(--s8)}
  .flt{grid-template-columns:repeat(4,minmax(0,1fr));align-items:start}
  .flt .reset{grid-column:1/-1}
  .cols>.pane{padding:var(--s5) var(--s7) var(--s6) var(--s6)}
  .cols>.lst{padding:var(--s2) var(--s6) var(--s6)}
  .cols>.filt{padding:var(--s5) var(--s4) var(--s6) var(--s7)}
  .line{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);align-items:center;column-gap:var(--s4)}
  .line .nm{flex-direction:column;align-items:flex-start;gap:2px}
  .line .nm small{text-align:left}
  .line .sub{grid-column:1/-1;margin-top:-4px}
  .pane .line{grid-template-columns:1fr}
  .pane .line .nm{flex-direction:row;align-items:baseline}
  .pane .line .nm small{text-align:right}
}
.mode button,.modo button{white-space:nowrap}
.pane .modo button{font-size:13px;padding:0 8px;gap:6px}
.pane .modo button img{width:18px;height:12px}
@media (min-width:900px){.filt .mode button{font-size:12px;padding:0 2px}.cols{grid-template-columns:270px minmax(0,1fr) 420px}}
.nb{flex-wrap:nowrap}
.nb b{white-space:nowrap}
@media (max-width:600px){
  .hp-r{grid-template-columns:1fr;gap:6px}
  .nb{padding:6px 8px 5px;gap:4px}
  .nb i{font-size:9.5px;letter-spacing:.08em}
  .nb b{font-size:19px}
  .nb.x b{font-size:16px}
  .tline{grid-template-columns:1fr;gap:4px}
}
.ln thead tr:first-child th{border-bottom:0}
.pk .a{flex-direction:column;align-items:flex-start;gap:4px}
/* filtro 18+ e proposta dell'app: bordo neon come nel sito di prima */
.ov.gate .modal{border-color:var(--neon-o);box-shadow:0 0 0 1px rgba(255,138,61,.15),0 0 40px -12px rgba(255,138,61,.55),0 30px 60px -20px rgba(0,0,0,.9)}
.ov.gate .age{border-color:var(--acc);color:var(--acc);border-radius:50%;width:46px!important;height:46px!important;font-size:15px!important;box-shadow:0 0 16px -4px rgba(255,138,61,.6)}
.ov.app .modal{border-color:var(--neon-v);box-shadow:0 0 40px -14px rgba(139,92,246,.7),0 30px 60px -20px rgba(0,0,0,.9)}
.lg-b{color:var(--ink)}.lg-b.off{color:var(--dim)}

.nb i{line-height:1}
.flag svg{transform:none!important}

/* striscia 18+ in cima a tutte le pagine (anche nell'app installata) */
.strip{display:flex;align-items:center;justify-content:center;gap:var(--s2);padding:7px max(var(--gut),var(--sar)) 7px max(var(--gut),var(--sal));font-size:12.5px;color:var(--mut);background:var(--bg2);border-bottom:1px solid var(--line);text-align:center}
.strip .age{border-color:var(--acc);color:var(--acc)}
html.app .strip{padding-top:calc(7px + var(--sat))}
html.app main{padding-top:var(--s4)}

/* social con le icone */
.so,.tg-b .btn{display:inline-flex;align-items:center;gap:8px}
.tg-b .btn svg,.so svg{width:18px;height:18px;flex:none}
.so-ig svg{color:#e1306c}.so-tt svg{color:#25f4ee}.so-tg svg{color:#2aabee}
.tg{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s4) var(--s6);padding:var(--s5);margin-top:var(--s8);border:1px solid var(--line2);border-radius:var(--r2);background:var(--bg2)}
.tg>div:first-child{flex:1 1 260px}
.tg h3{font-size:16px;margin-bottom:var(--s1)}
.tg p{margin:0;color:var(--mut);font-size:13.5px}
.tg-b{display:flex;flex-wrap:wrap;gap:var(--s2)}

/* piede: allineato al contenuto, colonne ordinate */
.foot{padding:var(--s7) max(var(--gut),var(--sar)) calc(var(--s7) + var(--sab)) max(var(--gut),var(--sal));margin-top:var(--s8)}
.foot .in{max-width:var(--wrap);margin:0 auto;display:grid;gap:var(--s6);grid-template-columns:1fr}
.f-l{display:grid;gap:var(--s4);align-content:start}
.f-l .rg{display:flex;gap:var(--s3);align-items:flex-start;font-size:13px;color:var(--mut)}
.f-l .rg p{margin:0 0 6px}
.f-l .rg b{color:var(--ink)}
.f-s p{margin:0;font-size:12.5px;color:var(--dim);line-height:1.6}
.f-c{display:grid;gap:10px;align-content:start;font-size:14px}
.f-c b{font-size:12px;font-weight:600;color:var(--dim);letter-spacing:.04em}
.f-c a{color:var(--ink);width:max-content;max-width:100%}
.f-c a:hover{color:var(--acc)}
.f-so{display:grid;gap:10px}
.f-so .so{color:var(--ink)}
.f-b{grid-column:1/-1;margin:0;padding-top:var(--s5);border-top:1px solid var(--line);font-size:12.5px;color:var(--dim)}
@media (min-width:640px){.foot .in{grid-template-columns:repeat(3,minmax(0,1fr))}.f-l{grid-column:1/-1}}
@media (min-width:1000px){.foot .in{grid-template-columns:minmax(0,2fr) repeat(3,minmax(0,1fr));column-gap:var(--s8)}.f-l{grid-column:auto}}
@media (min-width:900px){.todo{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}}

/* statistiche reali: griglia ordinata (colonne fisse, numeri allineati, separatore tra le squadre con il suo spazio) */
.ln.nl{table-layout:fixed;width:100%}
.ln.nl th,.ln.nl td{padding:12px 8px;text-align:right;vertical-align:middle;line-height:1.3}
.ln.nl th:first-child,.ln.nl td:first-child{padding-left:0;text-align:left;width:34%}
.ln.nl th:last-child,.ln.nl td:last-child{padding-right:0}
.ln.nl td{font-size:15px;color:var(--ink);font-variant-numeric:tabular-nums}
.ln.nl td:first-child{font-size:14.5px;font-weight:500}
.ln.nl .sep{border-left:1px solid var(--line2);padding-left:14px}
.ln.nl thead tr:first-child th{padding:0 8px 6px;border-bottom:0}
.ln.nl thead tr:first-child th.thg{text-align:center}
.ln.nl thead tr:first-child th.thg:last-child{padding-right:0}
.ln.nl .thg{font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ln.nl .thg .crest{width:18px;height:18px;vertical-align:-4px;margin-right:6px}
.ln.nl thead tr:last-child th{padding-top:4px;padding-bottom:10px;font-size:11.5px;font-weight:500;color:var(--dim);border-bottom:1px solid var(--line2)}
.ln.nl tbody tr:nth-child(even) td{background:var(--tint2)}
.ln.nl tbody td:first-child{padding-left:8px}
.ln.nl thead th:first-child{padding-left:8px}
.ln.nl tbody tr:last-child td{border-bottom:0}
@media (max-width:420px){.ln.nl th,.ln.nl td{padding-left:6px;padding-right:6px}.ln.nl .sep{padding-left:10px}.ln.nl td{font-size:14.5px}.ln.nl th:first-child,.ln.nl td:first-child{width:31%}}
.ln.nl th:last-child,.ln.nl td:last-child{padding-right:8px}
.ln.nl thead tr:first-child th.thg:last-child{padding-right:8px}
.ln.nl tbody td{border-bottom:0}
.ln.nl tbody tr:nth-child(even) td:first-child{border-radius:8px 0 0 8px}
.ln.nl tbody tr:nth-child(even) td:last-child{border-radius:0 8px 8px 0}
.ln.nl thead tr:last-child th{border-bottom:0}
.ln.nl tbody tr:first-child td{padding-top:12px}

/* ===== riquadri neon v3: scritta sopra, numero sotto, sempre dentro il bordo ===== */
.nbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s2);min-width:0}
.nb{display:grid;grid-template-rows:auto auto;justify-items:center;align-content:center;gap:3px;min-width:0;padding:8px 6px 7px;border-radius:10px;text-align:center;overflow:hidden}
.nb i{font-size:10px;letter-spacing:.1em;line-height:1;white-space:nowrap}
.nb b{font-size:21px;line-height:1;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:clip}
.nb.x b{font-size:17px;line-height:21px}
.nb.na b{font-size:12px;line-height:21px}
/* per squadra: il nome sopra, i tre riquadri sotto, a tutta larghezza */
.tline{display:grid;grid-template-columns:1fr;gap:6px}
.tline>span{font-size:13px;font-weight:500;color:var(--ink)}
.tline+.tline{margin-top:var(--s2)}
.line .nm{align-items:baseline}
@media (min-width:900px){
  .line{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr)}
  .line.sq{grid-template-columns:1fr}
  .pane .line,.pane .line.sq{grid-template-columns:1fr}
}
@media (max-width:600px){.nb b{font-size:19px}.nb.x b{font-size:16px;line-height:19px}.nb{padding:7px 4px 6px}}
.nb{justify-content:stretch;grid-template-columns:minmax(0,1fr)}
/* statistiche reali v3: niente riga verticale; numeri centrati nelle loro colonne, spazio tra le due squadre */
.ln.nl .sep{border-left:0;padding-left:20px}
.ln.nl td:not(:first-child),.ln.nl thead tr:last-child th:not(:first-child){text-align:center}
.ln.nl thead tr:first-child th.thg{text-align:center}
.ln.nl thead tr:first-child th.thg span{display:inline-flex;align-items:center;gap:6px}
.ln.nl thead tr:last-child th:not(:first-child){position:relative}
.ln.nl thead tr:last-child th{padding-bottom:12px}

/* esito e gol + multigol: sezione a parte, spiegata in parole */
.blk.es{border-color:var(--neon-o);box-shadow:0 0 30px -16px rgba(255,138,61,.6)}
.es-big{display:inline-flex;align-items:center;padding:10px 16px;border-radius:12px;border:1px solid var(--neon-o);background:rgba(255,138,61,.1);font-family:var(--num);font-weight:700;font-size:26px;line-height:1;letter-spacing:.01em;margin:0 0 var(--s3)}
.es-sp{list-style:none;margin:0;padding:0;display:grid;gap:var(--s2)}
.es-sp li{display:grid;grid-template-columns:76px minmax(0,1fr);gap:var(--s3);align-items:baseline;font-size:14px}
.es-sp b{font-weight:700;color:var(--acc)}
.es-sp span{color:var(--ink)}
.es-no{font-size:14px;color:var(--mut);margin:0}
.mg{margin-top:var(--s5);padding-top:var(--s4);border-top:1px solid var(--line)}
.mg h4{font-size:14px;font-weight:600;margin:0 0 2px}
.mg-r{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);padding:var(--s2) 0}
.mg-r+.mg-r{border-top:1px solid var(--line)}
.mg-r .tm{font-size:14.5px}
.mg-v{display:grid;justify-items:end;gap:2px;text-align:right}
.mg-v b{font-family:var(--num);font-weight:700;font-size:20px;line-height:1;padding:5px 10px;border-radius:9px;border:1px solid var(--line3)}
.mg-v small{font-size:12px;color:var(--dim)}
/* il Multigol è una giocata come l'esito: stesso riquadro neon arancio */
.mg-v b{border-color:var(--neon-o);background:rgba(255,138,61,.1);box-shadow:0 0 18px -8px rgba(255,138,61,.55);color:var(--ink);font-size:22px;padding:7px 12px}

/* esito e Multigol: due colonne gemelle, stesso riquadro, stessa grandezza */
.es-g{display:grid;gap:var(--s3)}
.es-c{display:grid;gap:var(--s2);align-content:start;padding:var(--s4);border:1px solid var(--line2);border-radius:12px;background:var(--tint)}
.es-c h4{font-size:14.5px;font-weight:600;margin:0}
.es-c .blk-s{margin:0 0 var(--s1)}
.gx{display:grid;gap:6px;justify-items:start}
.gx-v{display:inline-flex;align-items:center;padding:8px 14px;border-radius:11px;border:1px solid var(--neon-o);background:rgba(255,138,61,.1);box-shadow:0 0 18px -8px rgba(255,138,61,.55);font-family:var(--num);font-weight:700;font-size:22px;line-height:1;letter-spacing:.01em;color:var(--ink);white-space:nowrap}
.gx-s{font-size:13px;color:var(--mut);line-height:1.5}
.gx-s b{color:var(--acc);font-weight:700;margin-right:4px}
.mg-t{display:grid;gap:6px}
.mg-t+.mg-t{margin-top:var(--s3);padding-top:var(--s3);border-top:1px solid var(--line)}
.mg-t .tm{font-size:14px}
.blk.es .es-no{margin:0;font-size:13px}
@media (min-width:640px){.es-g{grid-template-columns:1fr 1fr}}
.pane .es-g{grid-template-columns:1fr}
@media (min-width:640px){.es-g.uno{grid-template-columns:1fr}}
/* Multigol compatto: squadra e lato a sinistra, fascia a destra, spiegazione sotto */
.mg-r2{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px var(--s3)}
.mg-r2+.mg-r2{margin-top:var(--s3);padding-top:var(--s3);border-top:1px solid var(--line)}
.mg-r2 .tm{font-size:14.5px;min-width:0}
.mg-r2 .tm em{font-style:normal;font-size:12px;color:var(--dim);margin-left:2px;flex:none}
.mg-r2 .gx-s{grid-column:1/-1}


/* ===================== modalità chiara (interruttore sole/luna; la scelta resta salvata) ===================== */
html[data-tema="chiaro"]{color-scheme:light;
  --bg:#f6f3ec;--bg2:#ffffff;--bg3:#efe9de;--bg4:#e3dbcc;
  --ink:#1a1611;--mut:#5c554b;--dim:#6f685d;--faint:#776f63;
  --line:rgba(26,22,17,.09);--line2:rgba(26,22,17,.15);--line3:rgba(26,22,17,.28);
  --acc:#a84700;--acc-hi:#bb5205;--acc-ink:#ffffff;--acc-bg:rgba(194,82,0,.09);
  --xor:#5b34d1;--vio:#6d45e6;--xor-num:#4a27b8;
  --ok:#137a42;--ok-bg:rgba(19,122,66,.1);--edge:#9a5d06;--edge-bg:rgba(200,130,20,.13);--bad:#c0392b;--bad-bg:rgba(192,57,43,.09);
  --neon-o:rgba(194,82,0,.5);--neon-v:rgba(91,52,209,.45);
  --hdr:rgba(246,243,236,.92);--scrim:rgba(26,22,17,.4);--warn-ink:#6b4500;--doc-ink:#2e2923;--tint:rgba(26,22,17,.03);--tint2:rgba(26,22,17,.045)}
html[data-tema="chiaro"] .nb.o,html[data-tema="chiaro"] .gx-v,html[data-tema="chiaro"] .es-big,html[data-tema="chiaro"] .mg-v b{background:rgba(194,82,0,.07);box-shadow:none}
html[data-tema="chiaro"] .nb.x{background:rgba(91,52,209,.07);box-shadow:none}
html[data-tema="chiaro"] .nb{background:var(--bg2)}
html[data-tema="chiaro"] .blk.es,html[data-tema="chiaro"] .pk:hover,html[data-tema="chiaro"] .pk.xor,html[data-tema="chiaro"] .lancio,html[data-tema="chiaro"] .modo button.lab[aria-pressed="true"],html[data-tema="chiaro"] .hp{box-shadow:none}
html[data-tema="chiaro"] .hp{box-shadow:inset 0 3px 0 var(--acc)}
html[data-tema="chiaro"] .lancio{background:linear-gradient(90deg,rgba(91,52,209,.08),rgba(91,52,209,.03));box-shadow:inset 3px 0 0 var(--acc)}
html[data-tema="chiaro"] .bx-c{box-shadow:0 0 0 4px var(--bg),0 0 18px rgba(194,82,0,.25),0 0 26px rgba(91,52,209,.2)}
html[data-tema="chiaro"] .toast{background:var(--ink);color:var(--bg)}
html[data-tema="chiaro"] .lg{box-shadow:0 0 0 1px var(--line2)}
html[data-tema="chiaro"] .so-tt svg{color:#111}
html[data-tema="chiaro"] .modal{box-shadow:0 30px 60px -20px rgba(26,22,17,.35)}
html[data-tema="chiaro"] #splash{background:#0e0d0b;color:#f2ede4}
/* pulsante sole/luna */
.tema-btn{width:38px;height:38px;border-radius:9px;display:grid;place-items:center;color:var(--mut);flex:none;transition:background .15s,color .15s}
.tema-btn:hover{background:var(--bg2);color:var(--ink)}
.tema-btn svg{width:19px;height:19px}
.tema-btn .sole{display:none}
html[data-tema="chiaro"] .tema-btn .sole{display:block}
html[data-tema="chiaro"] .tema-btn .luna{display:none}
.strip .tema-btn{display:none;width:30px;height:30px;margin-left:auto}
html.app .strip .tema-btn{display:grid}
html.app .strip{justify-content:flex-start}

/* ===== scheda a schede (Linee XOR, Esito e Multigol, Ultime 10, Statistiche reali) ===== */
.dtabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;margin:0 0 var(--s3);padding:3px;border-radius:12px;background:var(--bg2);border:1px solid var(--line2)}
.dtabs::-webkit-scrollbar{display:none}
.dtabs button{flex:1 0 auto;display:inline-flex;align-items:center;justify-content:center;gap:6px;height:38px;padding:0 12px;border-radius:9px;font-size:13.5px;font-weight:600;color:var(--mut);white-space:nowrap;transition:background .2s,color .2s}
.dtabs button img{width:17px;height:11px}
.dtabs button:hover{color:var(--ink)}
.dtabs button[aria-selected="true"]{background:var(--acc);color:var(--acc-ink)}
.pane .dtabs button{padding:0 10px;font-size:12.5px}
/* arbitro con cartellino */
.cartellino{display:inline-block;width:8px;height:11px;border-radius:2px;background:#f5c518;flex:none;box-shadow:0 0 0 1px rgba(0,0,0,.25)}
.arb-x{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--dim);margin-top:2px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.arb-x b{color:var(--mut);font-weight:600}
.dt-arb{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--mut);margin-top:2px}
.dt-arb b{color:var(--ink);font-weight:600}
.dt-arb small{flex-basis:100%;padding-left:18px;font-size:12px;color:var(--dim)}
.dt-arb small b{color:var(--mut)}
@media (min-width:600px){.dt-arb small{flex-basis:auto;padding-left:0}.dt-arb small::before{content:'· ';}}
/* ultime 10 */
.ok-t{color:var(--ok)}.ko-t{color:var(--bad)}
.chips.uk{margin-bottom:var(--s3)}
.u-ctl{display:grid;gap:var(--s2);margin-bottom:var(--s4)}
.u-ctl .seg{margin:0}
.ub{padding:var(--s4) 0;border-top:1px solid var(--line)}
.ub-h{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);margin-bottom:var(--s2)}
.ub-h .tm{font-size:15px;font-weight:600}
.ub-r{font-size:13px;color:var(--mut);white-space:nowrap}
.ub-r b{color:var(--ok);font-size:14px}
.ub-r.na{color:var(--dim)}
.ub-bar{height:5px;border-radius:3px;background:var(--bad-bg);overflow:hidden;margin-bottom:var(--s3)}
.ub-bar i{display:block;height:100%;background:var(--ok);border-radius:3px}
.ucs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.uc{display:grid;justify-items:center;gap:3px;padding:8px 4px 6px;border-radius:10px;border:1px solid var(--line2);background:var(--tint);min-width:0}
.uc b{font-family:var(--num);font-weight:700;font-size:20px;line-height:1}
.uc.si{border-color:rgba(79,209,139,.55);background:var(--ok-bg)}
.uc.si b{color:var(--ok)}
.uc.no{border-color:rgba(255,122,107,.45);background:var(--bad-bg)}
.uc.no b{color:var(--bad)}
.uc.nd b{font-family:var(--body);font-size:11px;color:var(--dim)}
.uc-a{display:flex;align-items:center;gap:3px}
.uc-a .crest,.uc-a .crest-fb{width:16px;height:16px}
.uc-a em{font-style:normal;font-size:10.5px;font-weight:700;color:var(--dim)}
.uc small{font-size:10.5px;color:var(--dim)}
@media (min-width:900px){.u-ctl{grid-template-columns:1fr 1fr}.ucs{grid-template-columns:repeat(10,minmax(0,1fr))}.pane .ucs{grid-template-columns:repeat(5,minmax(0,1fr))}.pane .u-ctl{grid-template-columns:1fr}}
/* classifiche per statistica */
.hb.rank .hb-r{grid-template-columns:22px minmax(110px,180px) minmax(0,1fr) 48px}
.hb-n{color:var(--dim);font-size:12px;text-align:right}

/* scheda partita: due colonne quando c'è spazio (pagina completa), una sola nella colonna di destra e sul telefono */
.dt{container-type:inline-size}
.dt-cols,.dt-b{display:grid;gap:var(--s4);align-items:start}
.dt-cols>*,.dt-b>*{margin-top:0!important;margin-bottom:0!important;min-width:0}
@container (min-width:860px){.dt-cols{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}}
.dt .full-btn{display:inline-flex;align-items:center;gap:6px;margin-top:var(--s3);border-color:var(--acc);color:var(--acc);font-weight:600}
.dt .full-btn svg{width:15px;height:15px}
.partita-full{max-width:1200px}
.partita-full .dt-h h2{font-size:28px}
/* scheda completa: «Torna a…» ben visibile in cima e in fondo */
.partita-full .torna{display:inline-flex;align-items:center;gap:6px;font-weight:600;margin:0 0 var(--s3)}
.partita-full .torna svg{width:18px;height:18px}

/* ---------- formazioni e indisponibili ---------- */
.fo-b{display:inline-flex;align-items:center;height:18px;padding:0 6px;border-radius:999px;background:var(--ok-bg);color:var(--ok);font-size:10.5px;font-weight:700;font-style:normal;letter-spacing:.02em;margin-left:8px;vertical-align:2px}
.m .sub{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;min-width:0}
.m .sub .fo-b{margin:0;height:20px;padding:0 9px;font-size:11px;white-space:nowrap}
.fo-g{display:grid;gap:var(--s3);margin-top:var(--s3)}
@container (min-width:520px){.fo-g{grid-template-columns:1fr 1fr}}
.fo-t{border:1px solid var(--line2);border-radius:var(--r);padding:var(--s3);background:var(--bg);min-width:0}
.fo-h{display:flex;align-items:center;gap:8px;margin-bottom:var(--s2);font-size:14px;min-width:0}
.fo-h b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fo-h .crest{width:20px;height:20px}
.fo-mod{margin-left:auto;font-size:12px;color:var(--mut);border:1px solid var(--line2);border-radius:6px;padding:1px 6px}
.fo-xi,.in-l{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.fo-xi li,.in-l li{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:8px;align-items:center;font-size:13.5px;padding:3px 0;border-top:1px solid var(--line)}
.fo-xi li:first-child,.in-l li:first-child{border-top:0}
.fo-xi .num{color:var(--dim);text-align:right;font-size:12px}
.fo-n{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fo-xi em{font-style:normal;font-size:11.5px;color:var(--dim)}
.fo-all{display:block;margin-top:var(--s2);font-size:12px;color:var(--mut)}
.fo-s{font-size:13px;font-weight:600;color:var(--mut);margin:var(--s4) 0 0}
.in-l li{grid-template-columns:minmax(0,1fr) auto;row-gap:0}
.in-l small{grid-column:1/-1;font-size:12px;color:var(--dim)}
.in-p{font-size:11px;font-weight:700;border-radius:999px;padding:1px 7px}
.in-p.out{background:var(--bad-bg);color:var(--bad)}
.in-p.dub{background:var(--tint);color:var(--warn)}

/* ---------- preferiti ---------- */
.pref-btn{display:inline-flex;align-items:center;gap:6px;margin-left:var(--s3);height:30px;padding:0 12px;border-radius:999px;border:1px solid var(--line2);font-size:13px;font-weight:500;color:var(--mut);vertical-align:middle}
.pref-btn svg{width:15px;height:15px}
.pref-btn.on{color:var(--acc);border-color:var(--acc)}
.pref-b{display:grid;gap:2px;margin-bottom:var(--s3);padding-bottom:var(--s3);border-bottom:1px solid var(--line)}
.pref-t{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--acc);margin:0 0 4px}
.pref-t svg{width:14px;height:14px}

/* ---------- Cerca linee ---------- */
.cls{display:grid;gap:var(--s2)}
.cl{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s2) var(--s3);align-items:center;padding:var(--s3) var(--s4);border:1px solid var(--line2);border-radius:var(--r2);background:var(--bg2);transition:border-color .15s}
.cl:hover{border-color:var(--line3)}
.cl-q{grid-column:1/-1;display:flex;justify-content:space-between;gap:var(--s2);font-size:12px;color:var(--mut);min-width:0}
.cl-q small{font-size:12px;white-space:nowrap}
.cl-lg{display:inline-flex;align-items:center;gap:6px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cl-lg .lg{width:18px;height:18px}
.cl-m{display:grid;gap:4px;min-width:0;font-size:15px;font-weight:600}
.cl-m .tm{display:flex;align-items:center;gap:8px;min-width:0}
.cl-m .tm span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cl-v{display:grid;justify-items:end;gap:2px;text-align:right}
.cl-l{display:inline-flex;align-items:center;gap:4px;font-size:17px;font-weight:700;white-space:nowrap;font-family:var(--num)}
.cl-l.o{color:var(--acc)}
.cl-l .ar{width:13px;height:13px}
.cl-v small{font-size:12px;color:var(--dim)}
.xn{color:var(--xor-num)}
.cl-p{grid-column:1/-1;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:var(--s3);align-items:center;font-size:13px}
.cl-p .ub-bar{margin:0;background:var(--bg4)}
.cl-p .ub-bar i{display:block;height:100%;background:var(--ok);border-radius:3px}
.cl-p b{color:var(--ok)}
.cl-p small{color:var(--mut);white-space:nowrap}


.fo-xi{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 12px;margin:0;font-size:13.5px}
.fo-xi dt{color:var(--dim);font-size:12px;padding-top:1px}
.fo-xi dd{margin:0;line-height:1.45}
/* piede: il riquadro 18+ sopra il testo (niente rientro), tutto sullo stesso bordo; sul telefono tutto al centro */
.f-l .rg{flex-direction:column;gap:var(--s2)}
@media (max-width:639px){
  .foot .in{text-align:center;justify-items:center}
  .f-l,.f-c,.f-so{justify-items:center}
  .f-l .rg{align-items:center}
  .f-l .brand{justify-self:center}
  .f-c a{margin:0 auto}
  .f-so .so{justify-content:center}
  .f-b{justify-self:stretch}
}
/* barra in alto: le voci non vanno mai a capo; tra 900 e 1200 px si stringono e la Guida resta nel piede */
.top .nav a{white-space:nowrap}
@media (min-width:900px) and (max-width:1199px){.top .nav a{padding:6px 7px;font-size:13.5px}.top .nav a[href="/guida"]{display:none}}
.cl-k{font-size:11.5px;color:var(--mut);font-weight:500}

/* home: i due banner sotto il titolo (registrati con il primo mese in regalo, scarica l'app) */
.bans{display:grid;gap:var(--s3);margin-top:var(--s2)}
.ban{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s2) var(--s3);align-items:center;padding:var(--s4);border:1px solid var(--line2);border-radius:var(--r2);background:var(--bg2)}
.ban.reg{border-color:color-mix(in srgb,var(--acc) 45%,var(--line2));background:linear-gradient(135deg,color-mix(in srgb,var(--acc) 10%,var(--bg2)),var(--bg2) 70%)}
.ban.app-b{border-color:color-mix(in srgb,var(--vio) 40%,var(--line2))}
.ban-i{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:var(--bg3);color:var(--acc)}
.ban-i svg{width:22px;height:22px}
.ban b{font-size:15px;color:var(--ink)}
.ban p{margin:4px 0 0;font-size:13px;color:var(--mut);max-width:none}
.ban .btn{grid-column:1/-1;justify-self:start}
@media (min-width:640px){.ban{grid-template-columns:auto minmax(0,1fr) auto}.ban .btn{grid-column:auto;justify-self:end;white-space:nowrap}}
html.app .ban.app-b{display:none}
.hero .ban .btn{display:inline-flex}
/* telefono: banner compatti, pulsante accanto al testo, le partite restano vicine */
@media (max-width:639px){
  .ban{grid-template-columns:minmax(0,1fr) auto;padding:var(--s3);gap:var(--s2)}
  .ban .ban-i{display:none}
  .ban b{font-size:14px}
  .ban p{font-size:12px;line-height:1.4}
  .ban .btn{grid-column:auto;justify-self:end;height:36px;padding:0 12px;font-size:13px;white-space:nowrap}
}
/* pannello admin sul telefono: la fila delle sezioni scorre, non allarga la pagina */
.adm{grid-template-columns:minmax(0,1fr)}
.adm>*{min-width:0}
.adm-side{max-width:100%;min-width:0}
@media (min-width:900px){.adm{grid-template-columns:220px minmax(0,1fr)}}
/* pannello admin sul telefono: le tabelle diventano schede una sotto l'altra, pulsanti sempre a vista */
@media (max-width:639px){
  .adm .card.scroll{overflow:visible}
  .adm .tbl thead{display:none}
  .adm .tbl,.adm .tbl tbody{display:block;width:100%}
  .adm .tbl tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;padding:12px 14px;border-top:1px solid var(--line)}
  .adm .tbl tr:first-child{border-top:0}
  .adm .tbl td{display:block;padding:0;border:0;min-width:0;text-align:left}
  .adm .tbl td:first-child{grid-column:1/-1}
  .adm .tbl td:last-child{grid-column:1/-1}
  .adm .row-act{justify-content:flex-start;flex-wrap:wrap}
}
/* tabella delle statistiche giocabili: resta una tabella anche sul telefono (scorre di lato) */
.tbl.gioc .c{text-align:center}
.tbl.gioc input{width:18px;height:18px;accent-color:var(--acc);cursor:pointer}
.nogioco{margin-top:var(--s3)}
@media (max-width:639px){
  .adm .card.scroll:has(.tbl.gioc){overflow-x:auto}
  .adm .tbl.gioc{display:table;width:max-content;min-width:100%}
  .adm .tbl.gioc thead{display:table-header-group}
  .adm .tbl.gioc tbody{display:table-row-group}
  .adm .tbl.gioc tr{display:table-row;padding:0}
  .adm .tbl.gioc td,.adm .tbl.gioc th{display:table-cell;padding:10px 12px;border-top:1px solid var(--line)}
}

/* scheda completa: testata chiara, filtri su una riga, barra fissa per saltare alle sezioni */
.partita-full .torna{margin:0 0 var(--s2)}
.partita-full .crumb{margin-bottom:var(--s3)}
.partita-full .dt-h h2 .tm{font-size:22px}
.partita-full .dt-h h2 .crest{width:30px;height:30px}
@media (min-width:640px){
  .partita-full .dt-h h2{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px}
  .partita-full .dt-h h2 .tm{font-size:28px}
  .partita-full .dt-h h2 .tm+.tm::before{content:'–';color:var(--dim);font-weight:400;margin-right:4px}
}

/* ---------- Cerca linee, come il Props Finder: filtri a sinistra, risultati a destra ---------- */
.cf{display:grid;gap:var(--s4);align-items:start}
.cf-p{display:grid;gap:var(--s4);padding:var(--s4);border:1px solid var(--line2);border-radius:var(--r2);background:var(--bg2)}
.cf-g{display:grid;gap:8px;min-width:0}
.cf-g>b{display:flex;align-items:center;justify-content:space-between;font-size:12.5px;font-weight:600;color:var(--mut)}
.cf-g>b output{font-size:15px;color:var(--acc);font-weight:700}
.cf-g .chips{flex-wrap:wrap;margin:0;padding:0;overflow:visible}
.cf-g .seg{margin:0}
.cf-g .seg .ar{width:12px;height:12px;margin-right:4px}
.cf-g input[type=range]{width:100%;accent-color:var(--acc);margin:0}
.cf-h{font-size:11.5px;color:var(--dim)}
.cf-altro{justify-self:start;font-size:13px;font-weight:600;color:var(--acc)}
.cf-piu{display:none;gap:var(--s4)}
.cf-p.aperto .cf-piu{display:grid}
.cf-tutti{font-size:12px;color:var(--acc);font-weight:600}
.cf-l{display:grid;gap:2px;max-height:280px;overflow-y:auto;margin:0 -6px;padding:0 6px}
.cf-l label{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;gap:8px;align-items:center;font-size:13.5px;padding:6px 4px;border-radius:8px;cursor:pointer}
.cf-l label:hover{background:var(--bg3)}
.cf-l label.off{color:var(--dim)}
.cf-l input{accent-color:var(--acc);width:16px;height:16px;margin:0}
.cf-l .lg{width:18px;height:18px}
.cf-l span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cf-l em{font-style:normal;font-size:12px;color:var(--dim)}
.cf-t{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s3);margin-bottom:6px}
.cf-t h2{font-size:18px;margin:0}
.cf-t span{font-size:12.5px;color:var(--dim)}
.cf-leg{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;font-size:12px;color:var(--mut);margin:0 0 var(--s3)}
.cf-leg span{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--ink)}
.cf-leg i{width:12px;height:12px;border-radius:3px;display:inline-block}
.cf-leg i.si,.cr-s i.si{background:color-mix(in srgb,var(--ok) 22%,transparent);color:var(--ok);border:1px solid color-mix(in srgb,var(--ok) 45%,transparent)}
.cf-leg i.no,.cr-s i.no{background:color-mix(in srgb,var(--bad) 18%,transparent);color:var(--bad);border:1px solid color-mix(in srgb,var(--bad) 40%,transparent)}
.crs{display:grid;gap:var(--s2);margin-bottom:var(--s4)}
.cr{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"q p" "m p" "l l" "v v";gap:6px var(--s3);align-items:center;padding:var(--s3) var(--s4);border:1px solid var(--line2);border-radius:var(--r2);background:var(--bg2);transition:border-color .15s}
.cr:hover{border-color:var(--line3)}
.cr-q{grid-area:q;display:flex;align-items:center;gap:6px;font-size:12px;color:var(--mut);min-width:0}
.cr-q span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cr-q .lg{width:16px;height:16px}
.cr-m{grid-area:m;display:grid;gap:3px;font-size:14.5px;font-weight:600;min-width:0}
.cr-m .tm{display:flex;align-items:center;gap:8px;min-width:0}
.cr-m .tm span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cr-m .crest{width:18px;height:18px}
.cr-l{grid-area:l;display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px}
.cr-l small{font-size:12px;color:var(--mut)}
.cr-l>b{display:inline-flex;align-items:center;gap:4px;font-family:var(--num);font-size:18px;font-weight:700}
.cr-l>b.o{color:var(--acc)}
.cr-l .ar{width:13px;height:13px}
.cr-p{grid-area:p;display:grid;justify-items:center;align-content:center;min-width:72px;padding:8px 10px;border-radius:12px;border:1px solid var(--line2)}
.cr-p b{font-family:var(--num);font-size:22px;line-height:1}
.cr-p small{font-size:11px;color:var(--mut);margin-top:3px;white-space:nowrap}
.cr-p.alta{border-color:color-mix(in srgb,var(--ok) 50%,transparent);background:color-mix(in srgb,var(--ok) 10%,transparent)}.cr-p.alta b{color:var(--ok)}
.cr-p.media{border-color:color-mix(in srgb,var(--warn) 50%,transparent);background:color-mix(in srgb,var(--warn) 9%,transparent)}.cr-p.media b{color:var(--warn)}
.cr-p.bassa b{color:var(--bad)}
.cr-v{grid-area:v;display:grid;gap:4px;min-width:0}
.cr-s{display:flex;align-items:center;gap:3px;min-width:0;overflow-x:auto;scrollbar-width:none}
.cr-s::-webkit-scrollbar{display:none}
.cr-s em{flex:none;width:70px;font-style:normal;font-size:11.5px;color:var(--mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cr-s i{flex:none;display:grid;place-items:center;width:24px;height:22px;border-radius:5px;font-style:normal;font-size:11.5px;font-weight:700}
@media (min-width:900px){
  .cf{grid-template-columns:280px minmax(0,1fr);gap:var(--s5)}
  .cf-p{position:sticky;top:calc(var(--top-h,58px) + 12px);max-height:calc(100vh - var(--top-h,58px) - 24px);overflow-y:auto}
  .cf-altro{display:none}
  .cf-piu{display:grid}
  .cr{grid-template-columns:minmax(0,1fr) 150px 84px minmax(0,1.15fr);grid-template-areas:"q l p v" "m l p v";gap:4px var(--s4)}
  .cr-l{flex-direction:column;align-items:flex-start;gap:2px}
}
@media (max-width:639px){.cr-s em{width:54px}.cr-s i{width:22px;height:21px;font-size:11px}.cr-s{gap:2px}.cr{padding:var(--s3)}}

/* scheda completa a pagine: schede in alto (come nel campionato), filtri uno sotto l'altro, una sezione per volta */
.partita-full{max-width:960px}
.partita-full .dt-tabs{margin:0 0 var(--s4)}
.partita-full .dt-tabs a{white-space:nowrap}
.partita-full .dt-ctl{display:grid;gap:var(--s2);margin-bottom:var(--s1)}
.partita-full .dt-ctl>*{margin:0}
.partita-full .dt-one{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s4);margin-top:var(--s3)}
.partita-full .dt-one>*{margin:0}
/* home: la prossima della tua squadra (al posto di «Registrati» per chi è già registrato) */
.ban.mia{border-color:color-mix(in srgb,var(--acc) 45%,var(--line2))}
.ban.mia .ban-i .crest{width:28px;height:28px}
.ban.mia .mia-p{color:var(--ink);font-weight:600}
a.ban:hover{border-color:var(--acc)}

/* ---------- lingua ---------- */
.lingua-btn{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 10px;border-radius:9px;color:var(--mut);font-size:12.5px;font-weight:600;letter-spacing:.06em;flex:none;transition:background .15s,color .15s}
.lingua-btn:hover,.lingua-btn[aria-expanded=true]{background:var(--bg2);color:var(--ink)}
.lingua-btn svg{width:18px;height:18px}
.lingua-pop{position:fixed;z-index:45;background:var(--bg3);border:1px solid var(--line2);border-radius:var(--r2);padding:6px;box-shadow:0 18px 40px -12px rgba(0,0,0,.85);display:grid;min-width:170px;animation:giu .18s var(--out)}
.lingua-pop a{padding:11px 12px;border-radius:9px;font-size:15px;color:var(--ink)}
.lingua-pop a:hover{background:var(--bg2)}
.lingua-pop a.on,.lingue-riga a.on{color:var(--acc)}
.lingue-riga{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;padding:6px 12px 8px;font-size:14px}
.lingue-riga svg{width:18px;height:18px;color:var(--mut)}
.lingue-riga a{width:auto!important;padding:6px 0!important;display:inline!important;gap:0!important}
.f-lingue{display:inline-flex;flex-wrap:wrap;gap:4px 14px;margin-left:14px}
.f-lingue a{color:var(--mut)}.f-lingue a:hover,.f-lingue a.on{color:var(--acc)}
.lingua-sug{position:fixed;left:12px;right:12px;bottom:calc(14px + var(--sab,0px));z-index:60;display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 14px;background:var(--bg3);border:1px solid var(--line3);border-radius:var(--r2);box-shadow:0 18px 40px -12px rgba(0,0,0,.85);font-size:14.5px;max-width:560px;margin:0 auto}
.lingua-sug span{flex:1 1 220px}
html.app .lingua-sug{bottom:calc(86px + var(--sab,0px))}

/* ---------- formazioni sul campo ---------- */
.campo-w{margin:6px 0 8px}
.cm-h{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.cm-t{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:15px;min-width:0}
.cm-t b{font-weight:700;min-width:0;overflow-wrap:anywhere}
.cm-t.tr{justify-content:flex-end;text-align:right}
.cm-t small{flex-basis:100%;color:var(--mut);font-size:12.5px}
.campo{position:relative;width:100%;aspect-ratio:68/122;border-radius:var(--r2);overflow:hidden;border:1px solid var(--line2);
  background:repeating-linear-gradient(0deg,#14130f 0 9.09%,#1a1914 9.09% 18.18%)}
.cp-l{position:absolute;inset:0;width:100%;height:100%}
.cp-l *{fill:none;stroke:rgba(239,237,232,.26);stroke-width:.35;vector-effect:non-scaling-stroke;stroke-width:1.4px}
.cp-l .pt{fill:rgba(239,237,232,.4)}
.pl{position:absolute;display:grid;justify-items:center;gap:3px;width:68px;margin:-18px 0 0 -34px;left:calc(var(--c)*1%);top:calc((100 - var(--a))*1%);pointer-events:none}
.pl i{font-style:normal;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;font-size:13px;font-weight:700;box-shadow:0 2px 8px rgba(0,0,0,.55)}
.pl.ca i{background:var(--acc);color:var(--acc-ink)}
.pl.tr i{background:#efeae0;color:#171612}
.pl span{font-size:11px;line-height:1.1;font-weight:600;color:var(--ink);text-align:center;text-shadow:0 1px 3px #000,0 0 6px #000;max-width:68px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cp-h{display:none}   /* telefono: campo in piedi; computer: campo disteso */
@media (min-width:760px){
  .campo{aspect-ratio:105/68;max-width:1040px;margin:0 auto}
  .cp-h{display:block}.cp-v{display:none}
  .pl{left:calc(var(--a)*1%);top:calc(var(--c)*1%);width:92px;margin:-20px 0 0 -46px}
  .pl span{font-size:12.5px;max-width:92px}.pl i{width:34px;height:34px;font-size:14px}
}
html[data-tema="chiaro"] .campo{background:repeating-linear-gradient(0deg,#e8e3d6 0 9.09%,#efeadd 9.09% 18.18%);border-color:rgba(0,0,0,.18)}
html[data-tema="chiaro"] .cp-l *{stroke:rgba(23,22,18,.32)}
html[data-tema="chiaro"] .pl span{color:#171612;text-shadow:none}
html[data-tema="chiaro"] .pl.tr i{background:#171612;color:#efeae0}
.cr,.pm{content-visibility:auto;contain-intrinsic-size:auto 190px}

.flag{width:22px;height:15px;flex:none;border-radius:3px;box-shadow:0 0 0 1px rgba(255,255,255,.18)}.lingua-pop a,.lingue-riga a,.f-lingue a{display:inline-flex;align-items:center;gap:10px}.lingua-pop a{display:flex}.lingua-btn .flag{width:20px;height:14px}

.ban.sblocca{border-color:color-mix(in srgb,#27a7e7 45%,var(--line2))}.ban.sblocca .ban-i{color:#27a7e7}

.pa-g{display:grid;gap:var(--s3);margin-top:var(--s2)}
@container (min-width:520px){.pa-g{grid-template-columns:1fr 1fr}}
.pa-t{border:1px solid var(--line2);border-radius:var(--r);padding:var(--s3);background:var(--bg);min-width:0}
.pa-t ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.pa-t li{display:flex;align-items:center;gap:10px;font-size:14px;min-width:0}
.pa-t li i{font-style:normal;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--bg3);border:1px solid var(--line2);font-size:12px;font-weight:700;flex:none}
.pa-t li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.pa-t li small{margin-left:auto;color:var(--dim);font-size:11.5px}

/* foto di giocatori e allenatore: il numero resta come etichetta, se la foto manca torna grande al centro */
.pl i,.pa-t li i{position:relative}
.pl i.f,.pa-t li i.f{width:40px;height:40px;font-size:0}
.pa-t li i.f{width:34px;height:34px}
.pl i img.ph,.pa-t li i img.ph{position:absolute;inset:0;width:100%;height:100%;border-radius:50%;object-fit:cover;background:var(--bg3)}
.pl i.f em,.pa-t li i.f em{position:absolute;right:-6px;bottom:-4px;min-width:17px;height:17px;padding:0 3px;border-radius:9px;font-style:normal;font-size:10.5px;font-weight:700;line-height:17px;text-align:center;box-shadow:0 0 0 1.5px var(--bg)}
.pl.ca i.f em{background:var(--acc);color:var(--acc-ink)}.pl.tr i.f em{background:#efeae0;color:#171612}
.pa-t li i.f em{background:var(--bg3);color:var(--ink)}
.pl i em,.pa-t li i em{font-style:normal}
.cm-t small img.ph.al{width:20px;height:20px;border-radius:50%;object-fit:cover;vertical-align:middle;margin-right:6px}
.pa-t li i{width:34px;height:34px;font-size:13px}.pa-t li i.f{font-size:0}
