/* ============================================================
   LAMBDA — interfaccia · v6 "un solo sistema" (13/09/2026)
   Riscritta sul design di `DEMO LAMBDA NEW DESIGN/LAMBDA.dc.html`.
   Palette: carbone #0F0F0F / #181818 · bordo #2C2C2B · oro #EABA43
   · moss #A9BE4B · amaranto #C24D6E · cinabro #E7695E · muted #9B9E97.
   Semantica del colore, UNA sola: ORO = denaro e azione · AMARANTO =
   live · MOSS = risultato positivo · CINABRO = rischio/perdita.
   Niente colori "per sezione", niente palette alternative, niente
   caroselli: griglie a 1px e liste, tutto visibile insieme.
   Le meccaniche PWA/iOS (body bloccato, barra in basso, fogli) sono
   ereditate dalla v5: erano lezioni pagate, non decorazione.
   ============================================================ */

:root {
  /* safe-area del DISPOSITIVO (13/09/2026): env() se il sistema la
     dichiara, altrimenti la riserva che 00-core.js ricava dal modello di
     iPhone in modalita' app (su alcune installazioni env() vale 0 anche
     col notch: testata sotto il notch, barra sopra i gesti di sistema) */
  --sat-fb: 0px; --sab-fb: 0px;
  --sat: max(env(safe-area-inset-top, 0px), var(--sat-fb));
  --sab: max(env(safe-area-inset-bottom, 0px), var(--sab-fb));
  --font-display: "Space Grotesk", "IBM Plex Sans", system-ui, sans-serif;
  --font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;

  --r-card: 18px;
  --r-hero: 20px;
  --r-tile: 14px;
  --r-input: 12px;
  --r-btn: 12px;
  --r-pill: 999px;

  --ease: cubic-bezier(.32, .72, .28, 1);
  --ease-out: cubic-bezier(.22, .8, .3, 1);
  --ease-sheet: cubic-bezier(.32, .72, 0, 1);
  --t-fast: .16s;
  --t-med: .22s;
  --t-slow: .34s;

  /* colori fissi della demo (identici nei due temi dove sono "marchio") */
  --gold: #EABA43;
  --gold-hi: #F5CE6B;
  --grad-accent: linear-gradient(180deg, #EFC558 0%, #DCA52C 100%);
  --on-accent: #141414;
}

/* ---- Tema scuro (default, quello della demo) ---- */
html[data-theme="dark"] {
  --page: #0F0F0F;
  --card: #181818;
  --card-2: #1B1B1A;
  --sunken: #0A0A0A;
  --input-bg: #101010;
  --head: #121211;
  --nav: #0D0D0C;
  --ink: #FBFFFE;
  --ink-soft: #CBCEC9;
  --muted: #9B9E97;
  --dim: #6E716B;
  --line: #2C2C2B;
  --line-soft: #212120;
  --accent: #EABA43;
  --accent-press: #F5CE6B;
  --accent-wash: rgba(234, 186, 67, .14);
  --accent-wash-2: rgba(234, 186, 67, .18);
  --accent-wash-3: rgba(234, 186, 67, .07);
  --ring: rgba(234, 186, 67, .32);
  --good: #A9BE4B;
  --good-wash: rgba(169, 190, 75, .14);
  --good-line: rgba(169, 190, 75, .35);
  --warn: #E7695E;
  --warn-wash: rgba(231, 105, 94, .14);
  --warn-line: rgba(231, 105, 94, .32);
  --plum: #C24D6E;
  --plum-wash: rgba(194, 77, 110, .16);
  --plum-line: rgba(194, 77, 110, .4);
  --draw: #A6A8A2;
  /* v10 (passo 4.3): i due grigi di superficie delle tavole, stessa coppia
     scuro/chiaro di DARK2LIGHT in `DEMO LAMBDA v10/_genera_v10.py` */
  --inset: #131312;
  --track: #3E3F3A;
  --shadow-1: none;
  --shadow-2: 0 6px 16px rgba(0, 0, 0, .42);
  --shadow-3: 0 24px 60px rgba(0, 0, 0, .5);
  --glass: rgba(18, 18, 17, .78);
  --overlay: rgba(0, 0, 0, .55);
  color-scheme: dark;
}

/* ---- Tema chiaro: stessa struttura, carta chiara neutra ---- */
html[data-theme="light"] {
  --page: #F2F1EC;
  --card: #FFFFFF;
  --card-2: #F7F6F1;
  --sunken: #E9E7E0;
  --input-bg: #FBFAF6;
  --head: #FFFFFF;
  --nav: #F7F6F1;
  --ink: #1B1B19;
  --ink-soft: #3E3F3A;
  --muted: #6B6E67;
  --dim: #8E918A;
  --line: #DDDBD3;
  --line-soft: #E8E6DF;
  --accent: #D9A22B;
  --accent-press: #8A6308;
  --accent-wash: rgba(217, 162, 43, .16);
  --accent-wash-2: rgba(217, 162, 43, .2);
  --accent-wash-3: rgba(217, 162, 43, .08);
  --ring: rgba(217, 162, 43, .35);
  --good: #5E7A1E;
  --good-wash: rgba(94, 122, 30, .13);
  --good-line: rgba(94, 122, 30, .35);
  --warn: #C4362B;
  --warn-wash: rgba(196, 54, 43, .11);
  --warn-line: rgba(196, 54, 43, .3);
  --plum: #9E2F57;
  --plum-wash: rgba(158, 47, 87, .12);
  --plum-line: rgba(158, 47, 87, .35);
  --draw: #7A7C75;
  --inset: #F7F6F1;
  --track: #CFCDC5;
  --shadow-1: 0 1px 2px rgba(30, 28, 20, .05);
  --shadow-2: 0 8px 22px rgba(30, 28, 20, .12);
  --shadow-3: 0 24px 60px rgba(30, 28, 20, .18);
  --glass: rgba(255, 255, 255, .82);
  --overlay: rgba(20, 20, 18, .4);
  color-scheme: light;
}

/* ============================================================
   Base
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0; min-height: 100vh; overflow-x: hidden;
  background: var(--page); color: var(--ink);
  font-family: var(--font-sans); font-size: 14px; line-height: 1.5;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
a { color: var(--accent); text-decoration: none; }
a:hover { color: var(--accent-press); }
button { font-family: inherit; }
button, input, select, textarea { font-size: inherit; color: inherit; }
b, strong { font-weight: 600; }
h1, h2, h3 { font-family: var(--font-display); font-weight: 600; letter-spacing: -.4px; margin: 0; }
svg { flex-shrink: 0; }
::selection { background: var(--accent-wash-2); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
button:focus:not(:focus-visible) { outline: none; }

/* utilita' */
.muted { color: var(--muted); }
.hidden { display: none !important; }
.ta-c { text-align: center; }
.pos { color: var(--good); }
.neg { color: var(--warn); }
.mono { font-family: var(--font-mono); }
.num, .tabular { font-variant-numeric: tabular-nums; }
/* etichetta tecnica: mono, maiuscola, spaziata (la "kicker" della demo) */
.kicker, .dh-label, .set-group-label, .forma > span, .dw-title, .tool-label,
.st-hero-src, .field-lab, .ch-range-lab {
  font-family: var(--font-mono); font-size: .69rem; font-weight: 500;
  letter-spacing: .8px; text-transform: uppercase; color: var(--muted);
}

/* ============================================================
   Testata di comando
   ============================================================ */
.topbar {
  position: relative; z-index: 30;   /* scorre via: resta fissa la barra delle sezioni */
  display: flex; align-items: center; gap: 10px 14px; flex-wrap: wrap;
  padding: 10px 20px;
  padding-top: calc(10px + var(--sat));
  padding-left: max(20px, env(safe-area-inset-left, 20px));
  padding-right: max(20px, env(safe-area-inset-right, 20px));
  background: var(--head);
  border-bottom: 1px solid var(--line-soft);
}
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .topbar { background: var(--glass); -webkit-backdrop-filter: blur(18px) saturate(1.5); backdrop-filter: blur(18px) saturate(1.5); }
}
.brand { display: flex; align-items: center; gap: 10px; color: var(--ink); flex-shrink: 0; }
.brand:hover { color: var(--ink); }
.brand-mark {
  width: 30px; height: 30px; border-radius: 9px; flex-shrink: 0;
  background: var(--grad-accent); color: var(--on-accent);
  font: 700 15px/1 var(--font-display);
  display: flex; align-items: center; justify-content: center;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35);
}
.brand-txt { font: 600 15px/1 var(--font-display); letter-spacing: -.2px; }
.watcher-pill {
  display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0;
  padding: 4px 10px; border-radius: var(--r-pill);
  font: 500 11px var(--font-mono); color: var(--good); background: var(--good-wash);
  white-space: nowrap;
}
.watcher-pill .wp-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.watcher-pill.on .wp-dot { animation: wp-blink 2.4s ease-in-out infinite; }
.watcher-pill.off { color: var(--warn); background: var(--warn-wash); }
@keyframes wp-blink { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }

/* modalita' Test / Conto reale: la pillola scura al centro della testata */
.seg {
  display: inline-flex; gap: 2px; padding: 3px; border-radius: var(--r-pill);
  background: var(--card-2); border: 1px solid var(--line);
}
.seg-btn {
  border: 0; border-radius: var(--r-pill); padding: 6px 14px;
  font: 500 12px var(--font-sans); background: none; color: var(--muted);
  cursor: pointer; white-space: nowrap;
  transition: background var(--t-fast), color var(--t-fast), transform var(--t-fast) var(--ease);
}
.seg-btn:active { transform: scale(.96); }
.seg-btn.active { background: var(--grad-accent); color: var(--on-accent); font-weight: 600; }
.mode-seg { margin: 0 auto; flex-shrink: 0; }
.topnav { display: flex; align-items: center; gap: 10px; margin-left: auto; flex-shrink: 0; }
.user { font: 400 12px var(--font-mono); color: var(--muted); }
.icon-btn {
  width: 30px; height: 30px; border-radius: var(--r-pill); flex-shrink: 0;
  border: 1px solid var(--line); background: none; color: var(--muted);
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
  transition: color var(--t-fast), border-color var(--t-fast), transform var(--t-fast) var(--ease);
}
.icon-btn:hover { color: var(--ink); border-color: var(--muted); }
.icon-btn:active { transform: scale(.92); }
.icon-btn svg { width: 15px; height: 15px; }
html[data-theme="dark"] .theme-ico-dark { display: none; }
html[data-theme="light"] .theme-ico-light { display: none; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .28s; animation-timing-function: var(--ease); }

/* ============================================================
   Navigazione a segmenti (sotto la testata; in basso su telefono)
   ============================================================ */
.tabs {
  position: sticky; top: 0; z-index: 29;
  display: flex; gap: 2px; padding: 8px 16px; overflow-x: auto; scrollbar-width: none;
  background: var(--nav); border-bottom: 1px solid var(--line-soft);
}
.tab-glider, .tab-sep { display: none; }
.tabs::-webkit-scrollbar { display: none; }
.tab {
  display: inline-flex; align-items: center; gap: 8px;
  border: 0; background: none; color: var(--muted);
  font: 500 13px var(--font-display); padding: 9px 15px; border-radius: 10px;
  cursor: pointer; position: relative; white-space: nowrap;
  transition: background var(--t-fast), color var(--t-fast), transform var(--t-fast) var(--ease);
}
.tab:hover { color: var(--ink); background: var(--accent-wash-3); }
.tab:active { transform: scale(.97); }
.tab-ic { display: none; }
.tab-ic svg { width: 17px; height: 17px; display: block; }
.tab.active { background: var(--accent-wash); color: var(--accent-press); font-weight: 600; }
.tab.active .tab-ic { display: inline-flex; }
.tab[data-tab="impostazioni"] { margin-left: auto; padding-right: 13px; }
.nav-badge {
  margin-left: 4px; min-width: 18px; height: 18px; padding: 0 6px;
  border-radius: var(--r-pill); background: var(--accent); color: var(--on-accent);
  font: 600 .66rem/18px var(--font-mono); display: inline-flex; align-items: center; justify-content: center;
}
.tabpane { display: none; max-width: 100%; }
.tabpane.active { display: block; animation: pane-in .28s var(--ease) both; }
.tabpane.active.from-right { animation-name: pane-in-r; }
.tabpane.active.from-left { animation-name: pane-in-l; }
@keyframes pane-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes pane-in-r { from { opacity: 0; } to { opacity: 1; } }
@keyframes pane-in-l { from { opacity: 0; } to { opacity: 1; } }

.container { max-width: 1120px; margin: 0 auto; padding: 24px 20px 40px; }

/* ============================================================
   Testata di pagina: titolo grande + sottotitolo + azioni a destra
   ============================================================ */
.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px 20px; margin-bottom: 18px; flex-wrap: wrap; }
.page-head h2 { font: 600 24px var(--font-display); letter-spacing: -.6px; }
.page-head p { margin: 5px 0 0; font-size: 12.5px; color: var(--muted); }
.page-head .ph-side { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.page-note { font: 500 11px var(--font-mono); letter-spacing: .7px; text-transform: uppercase; color: var(--muted); white-space: nowrap; }
/* titolo di blocco in linea: nome + nota a fianco + azione a destra */
.block-head { display: flex; align-items: baseline; gap: 10px; margin: 26px 2px 10px; }
.block-head .bh-title { font: 600 15px var(--font-display); }
.block-head .bh-sub { font-size: 12px; color: var(--muted); flex: 1; min-width: 0; }
.block-head:first-child { margin-top: 0; }

/* ============================================================
   Card, sezioni, griglie
   ============================================================ */
.card {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-card);
  margin-bottom: 14px; box-shadow: var(--shadow-1);
}
.sec { overflow: hidden; }
.sec-head { display: flex; align-items: baseline; gap: 8px; padding: 18px 20px 10px; flex-wrap: wrap; }
.sec-head > div { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; min-width: 0; flex: 1; }
.sec-ic { display: none !important; }
.sec-num {
  width: 22px; height: 22px; border-radius: 50%; flex-shrink: 0; align-self: center;
  background: var(--accent); color: var(--on-accent);
  font: 700 11px var(--font-mono); display: inline-flex; align-items: center; justify-content: center;
}
.sec-title { font: 600 14px var(--font-display); letter-spacing: -.1px; }
.sec-sub { font-size: 11.5px; color: var(--muted); }
.sec-body { padding: 4px 20px 18px; }
.sec-body.solo { padding-top: 18px; }
.sec-cta {
  margin-left: auto; display: inline-flex; align-items: center; gap: 3px; flex-shrink: 0;
  border: 0; background: none; color: var(--accent-press);
  font: 600 12.5px var(--font-sans); cursor: pointer; padding: 0;
}
.sec-cta svg { width: 13px; height: 13px; stroke-width: 2; transition: transform var(--t-med) var(--ease); }
.sec-cta:hover svg { transform: translateX(3px); }

/* hero: card grande con alone radiale (capitale, verdetto, ricalibrazione) */
.hero { position: relative; overflow: hidden; border-radius: var(--r-hero); }
.hero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(60% 110% at 6% -16%, var(--good-wash), transparent 60%);
}
.hero.neg-edge::before { background: radial-gradient(60% 110% at 6% -16%, var(--warn-wash), transparent 60%); }
.hero.gold-edge::before { background: radial-gradient(60% 110% at 6% -16%, var(--accent-wash), transparent 60%); }
.hero.right-edge::before { background: radial-gradient(60% 120% at 92% -20%, var(--good-wash), transparent 60%); }
.hero > * { position: relative; }

/* griglia a 1px: N riquadri separati da un filo, nessuna card dentro card */
.grid-1px {
  display: grid; gap: 1px; background: var(--line); border: 1px solid var(--line);
  border-radius: var(--r-tile); overflow: hidden; margin-top: 14px;
}
.grid-1px.c2 { grid-template-columns: repeat(2, 1fr); }
.grid-1px.c3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-1px.c4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid-1px > div, .grid-1px > button { background: var(--card); padding: 16px 18px; min-width: 0; text-align: left; border: 0; }
.grid-1px.inset > div { background: var(--inset); }
.grid-1px b, .tile-v {
  display: block; font: 700 22px var(--font-display); letter-spacing: -.3px;
  font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.grid-1px small, .tile-l { display: block; margin-top: 3px; font-size: 11px; color: var(--muted); }
.grid-1px.sm b { font-size: 18px; }
.grid-1px.sm small { font-size: 10.5px; }
.grid-1px button { cursor: pointer; transition: background var(--t-fast); }
.grid-1px button:hover { background: var(--card-2); }
.two-col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 14px; }
.two-col > .card { margin: 0; }

/* (la lista tabellare .tbl e' ridisegnata a griglia nel sistema visivo v10,
   in fondo al file: le vecchie .tbl-head/.tbl-row non erano usate) */
.tbl-group {
  display: flex; align-items: center; gap: 10px; padding: 11px 16px;
  border-bottom: 1px solid var(--line-soft); background: var(--card-2);
  font: 600 11.5px var(--font-sans); text-transform: uppercase; letter-spacing: .6px; color: var(--ink-soft);
}
.count-pill {
  font: 600 10.5px var(--font-mono); color: var(--muted); background: var(--sunken);
  border-radius: var(--r-pill); padding: 2px 8px; text-transform: none; letter-spacing: 0;
}
.row-btn {
  display: flex; align-items: center; gap: 12px; width: 100%; text-align: left;
  background: none; border: 0; border-bottom: 1px solid var(--line-soft);
  padding: 11px 0; cursor: pointer; color: var(--ink); font-family: var(--font-sans);
  transition: background var(--t-fast);
}
.row-btn:last-child { border-bottom: 0; }
.row-btn:hover { background: var(--accent-wash-3); }
.row-chev { color: var(--dim); font-size: 14px; }

/* ============================================================
   Bottoni, chip, interruttori, campi
   ============================================================ */
.btn-primary {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border: 0; border-radius: var(--r-btn); padding: 11px 22px;
  background: var(--grad-accent); color: var(--on-accent);
  font: 700 13.5px var(--font-display); cursor: pointer; white-space: nowrap;
  transition: filter var(--t-fast), transform var(--t-fast) var(--ease);
}
.btn-primary:hover { filter: brightness(1.05); }
.btn-primary:active { transform: scale(.97); }
.btn-primary:disabled { opacity: .55; transform: none; filter: none; cursor: default; }
.btn-primary.sm { padding: 9px 16px; font-size: 12.5px; }
.btn-primary svg { width: 15px; height: 15px; }
.btn-ghost {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  border: 1px solid var(--line); background: none; color: var(--ink-soft);
  border-radius: var(--r-btn); padding: 9px 14px;
  font: 500 12.5px var(--font-sans); cursor: pointer; white-space: nowrap;
  transition: border-color var(--t-fast), color var(--t-fast), background var(--t-fast), transform var(--t-fast) var(--ease);
}
.btn-ghost:hover { border-color: var(--muted); color: var(--ink); }
.btn-ghost:active { transform: scale(.97); }
.btn-ghost:disabled { opacity: .5; transform: none; cursor: default; }
.btn-ghost.sm { padding: 7px 12px; font-size: 12px; }
.btn-ghost svg { width: 15px; height: 15px; }
.btn-ghost.danger { color: var(--warn); }
.btn-ghost.danger:hover { border-color: var(--warn); background: var(--warn-wash); }
.link-btn, .st-cta, .mm-more, .cr-cta {
  display: inline-flex; align-items: center; gap: 4px;
  border: 0; background: none; padding: 0; cursor: pointer;
  color: var(--accent-press); font: 600 12.5px var(--font-sans);
}
.st-cta { margin-top: 14px; }
.st-cta svg { width: 14px; height: 14px; stroke-width: 2; transition: transform var(--t-med) var(--ease); }
.st-cta:hover svg { transform: translateX(3px); }
.cr-cta { border: 1px solid var(--accent); background: var(--accent-wash); border-radius: var(--r-pill); padding: 4px 12px; font-size: .72rem; }
button[aria-busy="true"] { pointer-events: none; opacity: .75; }
button[aria-busy="true"]::before {
  content: ""; display: inline-block; width: 12px; height: 12px;
  border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%;
  margin-right: 8px; vertical-align: -1px; animation: spin .7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* chip: la pillola contornata; attiva = oro (18%) col bordo oro */
.chip, .hf-chip, .liq-chip, .rp, .hist-tool, .dk-tab {
  display: inline-flex; align-items: center; gap: 7px;
  border: 1px solid var(--line); background: none; color: var(--muted);
  border-radius: var(--r-pill); padding: 5px 12px;
  font: 600 11.5px var(--font-sans); cursor: pointer; white-space: nowrap;
  transition: border-color var(--t-fast), background var(--t-fast), color var(--t-fast), transform var(--t-fast) var(--ease);
  -webkit-tap-highlight-color: transparent;
}
.chip:hover, .hf-chip:hover, .liq-chip:hover, .rp:hover, .hist-tool:hover { color: var(--ink); border-color: var(--muted); }
.chip:active, .hf-chip:active, .liq-chip:active, .rp:active, .hist-tool:active { transform: scale(.95); }
.chip.on, .chip.active, .hf-chip.active, .liq-chip.on, .rp.on, .hist-tool.on, .hist-tool[aria-expanded="true"] {
  border-color: var(--accent); background: var(--accent-wash-2); color: var(--accent-press);
}
.chip svg, .hist-tool svg { width: 14px; height: 14px; }
.chip .chip-tick { width: 7px; height: 7px; border-radius: 50%; background: var(--line); }
.chip.on .chip-tick { background: var(--accent); }
.chip.add { color: var(--accent-press); border-style: dashed; }
.chip.busy { opacity: .45; pointer-events: none; }
.chip.ex, .hf-chip.ex { border-color: var(--warn); color: var(--warn); text-decoration: line-through; }
.rp { font: 700 10.5px var(--font-mono); padding: 4px 11px; }
.rp.on { color: var(--ink); }
/* chip a tendina: "Etichetta VALORE ▾" */
.hf-sub { color: var(--ink-soft); font-weight: 500; font-size: 12px; padding: 6px 13px; }
.hf-sub .hf-val { font: 600 12px var(--font-mono); color: var(--ink); }
.hf-sub.on, .hf-sub[aria-expanded="true"] { border-color: var(--accent); background: var(--accent-wash-2); color: var(--ink); }
.hf-caret { font-size: .66rem; color: var(--muted); transition: transform var(--t-med) var(--ease); }
.hf-sub[aria-expanded="true"] .hf-caret { transform: rotate(180deg); }
.tool-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
/* riga di filtri: etichetta mono + chip + nota a destra */
.filter-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.filter-row .kicker { margin-right: 2px; }
.filter-row .f-sep { width: 1px; height: 20px; background: var(--line); margin: 0 4px; }
.filter-row .f-note { margin-left: auto; font-size: 11.5px; color: var(--muted); }
.filter-row .f-reset { margin-left: auto; }
.hf-menu {
  display: flex; flex-wrap: wrap; gap: 6px; width: 100%; max-width: 100%; box-sizing: border-box;
  padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r-tile);
  background: var(--card); animation: panel-in .2s var(--ease);
}
@keyframes panel-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.hf-panel, .hist-panel { display: flex; flex-direction: column; gap: 10px; margin-top: 10px; }
.hf-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.hf-from { display: flex; align-items: center; gap: 8px; width: 100%; padding-bottom: 6px; font: 600 11.5px var(--font-sans); color: var(--muted); }
.hf-from input[type="date"] { width: auto; padding: 5px 10px; font-size: 12px; border-radius: var(--r-pill); }

/* interruttore (30×18): oro quando acceso, pomello scuro */
.sw, .scan-follow input {
  appearance: none; -webkit-appearance: none; margin: 0; flex-shrink: 0;
  width: 30px; height: 18px; border-radius: var(--r-pill); cursor: pointer; position: relative;
  background: var(--sunken); border: 1px solid var(--line);
  transition: background var(--t-fast), border-color var(--t-fast);
}
.sw::after, .scan-follow input::after {
  content: ""; position: absolute; top: 2px; left: 2px; width: 12px; height: 12px; border-radius: 50%;
  background: var(--card); border: 1px solid var(--line); box-sizing: border-box;
  transition: transform var(--t-fast) var(--ease), background var(--t-fast);
}
.sw:checked, .scan-follow input:checked { background: var(--accent); border-color: var(--accent); }
.sw:checked::after, .scan-follow input:checked::after { transform: translateX(12px); background: var(--on-accent); border-color: transparent; }
.sw-row { display: inline-flex; align-items: center; gap: 8px; font: 400 12px var(--font-sans); color: var(--muted); cursor: pointer; }
.sw-row:has(input:checked) { color: var(--ink-soft); font-weight: 600; }

/* campi */
input[type="text"], input[type="number"], input[type="password"], input[type="search"],
input[type="email"], input[type="date"], input[type="datetime-local"], select, textarea {
  width: 100%; padding: 11px 13px;
  background: var(--input-bg); color: var(--ink);
  border: 1px solid var(--line); border-radius: var(--r-input);
  font: 500 14px var(--font-sans);
  -webkit-appearance: none; appearance: none;
  transition: border-color var(--t-fast), box-shadow var(--t-fast);
}
input[type="number"], input[type="date"], input[type="datetime-local"] { font-family: var(--font-mono); font-size: 13.5px; }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--ring); }
input::placeholder { color: var(--dim); }
input[type="date"]::-webkit-calendar-picker-indicator, input[type="datetime-local"]::-webkit-calendar-picker-indicator { cursor: pointer; opacity: .7; }
select {
  padding-right: 36px; cursor: pointer;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%239B9E97' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 13px center;
}
input[type="range"] { width: 100%; accent-color: var(--accent); margin: 0; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--accent); }
.tool-label { display: block; margin-bottom: 6px; }
.fld-hint { display: block; margin-top: 5px; font-size: 11.5px; line-height: 1.45; color: var(--muted); }
.tools-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.search-box {
  display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0;
  background: var(--input-bg); border: 1px solid var(--line); border-radius: var(--r-input);
  padding: 0 14px;
  transition: border-color var(--t-fast), box-shadow var(--t-fast);
}
.search-box:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px var(--ring); }
.search-box svg { width: 17px; height: 17px; color: var(--muted); }
.search-box input { border: 0; background: none; padding: 12px 0; box-shadow: none !important; font-weight: 400; font-size: 13.5px; }
.search-box input:focus { border: 0; }

/* pillole di stato: colore semantico al 14%, testo pieno, mono maiuscolo */
.pill, .badge, .wbadge, .vd, .src-tag {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; border-radius: var(--r-pill);
  font: 600 10.5px var(--font-mono); letter-spacing: .5px; text-transform: uppercase;
  color: var(--muted); background: var(--sunken); white-space: nowrap; line-height: 1.25;
  max-width: 100%; overflow: hidden; text-overflow: ellipsis;
}
.pill .dot, .wbadge.w-live::before, .pill.live::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex-shrink: 0;
  animation: wp-blink 2.4s ease-in-out infinite;
}
.pill.live, .wbadge.w-live, .badge.aperta { color: var(--plum); background: var(--plum-wash); }
.pill.win, .wbadge.w-done, .badge.vinta, .vd.good, .wbadge.w-pred { color: var(--good); background: var(--good-wash); }
.pill.loss, .wbadge.w-skip, .badge.persa, .badge.mista, .vd.warn { color: var(--warn); background: var(--warn-wash); }
.pill.gold, .wbadge.w-sched, .badge.auto, .vd.imp, .src-tag.auto { color: var(--accent-press); background: var(--accent-wash-2); }
.vd.mut { color: var(--muted); background: var(--sunken); }
.src-tag { padding: 1px 6px; font-size: 9.5px; margin-left: 4px; vertical-align: 1px; }
.src-tag.bfman { color: var(--plum); background: var(--plum-wash); }

/* pallini esito: ✓ moss / ✕ cinabro / · neutro */
.hc-dot, .fd {
  width: 22px; height: 22px; border-radius: 50%; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 700; color: var(--muted); background: var(--sunken);
}
.hc-dot.win { color: var(--good); background: var(--good-wash); }
.hc-dot.loss { color: var(--warn); background: var(--warn-wash); }
.hc-dot.open { color: var(--muted); }
.fd { width: 9px; height: 9px; background: var(--line); border: 0; padding: 0; cursor: pointer; transition: transform var(--t-fast) var(--ease); }
.fd:hover { transform: scale(1.4); }
.fd.w { background: var(--good); }
.fd.l { background: var(--warn); }
.forma { display: flex; align-items: center; gap: 12px; }
.fd-wrap { display: flex; gap: 4px; }

/* avvisi */
.alert {
  padding: 12px 16px; border-radius: var(--r-input); font-size: 12.5px; line-height: 1.5;
  border: 1px solid var(--line); background: var(--card); margin-bottom: 14px;
}
.alert.warn { border-color: var(--warn-line); color: var(--warn); background: var(--warn-wash); }
.alert.ok { border-color: var(--good-line); color: var(--good); background: var(--good-wash); }
.alert.err { border-color: var(--warn-line); color: var(--warn); background: var(--warn-wash); }
.edit-banner { background: var(--accent-wash); border: 1px solid var(--accent); border-radius: var(--r-input); padding: 10px 14px; font-size: 12.5px; margin-bottom: 14px; }

/* stato vuoto: una frase, un'azione */
.empty-state { text-align: center; padding: 48px 28px; }
.empty-state.small { padding: 24px; }
.empty-state .es-mark {
  width: 56px; height: 56px; margin: 0 auto 14px; border-radius: 16px;
  background: var(--grad-accent); color: var(--on-accent);
  font: 700 26px var(--font-display); display: flex; align-items: center; justify-content: center;
}
.empty-state h2 { margin-bottom: 8px; font-size: 20px; }
.empty-state p { color: var(--muted); line-height: 1.6; margin: 0 0 16px; font-size: 13px; }
.es-actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

/* scheletri di caricamento */
.skel-card { padding: 18px 16px; }
.skel { position: relative; overflow: hidden; background: var(--sunken); border-radius: 8px; }
.skel::after {
  content: ""; position: absolute; inset: 0; transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .06), transparent);
  animation: skel-sweep 1.3s ease-in-out infinite;
}
html[data-theme="light"] .skel::after { background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .6), transparent); }
.skel-line { height: 12px; margin: 12px 0; }
.skel-line.w40 { width: 40%; }
.skel-line.w70 { width: 70%; }
@keyframes skel-sweep { to { transform: translateX(100%); } }

/* toast: scuro, pallino di tono, mai piu' di una riga */
.toast {
  position: fixed; bottom: 26px; left: 50%; transform: translateX(-50%); z-index: 100;
  display: flex; align-items: center; gap: 9px;
  background: var(--ink); color: var(--page);
  padding: 11px 20px; border-radius: var(--r-pill); font-size: 13px;
  box-shadow: var(--shadow-3); animation: toast-in .28s var(--ease-out);
  max-width: min(520px, calc(100vw - 32px));
}
.toast::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--gold); flex-shrink: 0; }
.toast.bad { background: var(--warn); color: #FBFFFE; }
.toast.bad::before { background: #FBFFFE; }
.toast.out { animation: toast-out .25s var(--ease) forwards; }
@keyframes toast-in { from { opacity: 0; transform: translate(-50%, 10px); } to { opacity: 1; transform: translate(-50%, 0); } }
@keyframes toast-out { to { opacity: 0; transform: translate(-50%, 8px); } }

/* dialoghi in-app (conferme, prompt) */
.cf-overlay {
  position: fixed; inset: 0; z-index: 240;
  display: flex; align-items: flex-end; justify-content: center;
  background: var(--overlay); opacity: 0; transition: opacity var(--t-med) var(--ease);
  padding: 16px; padding-bottom: max(16px, var(--sab));
}
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .cf-overlay { -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
}
.cf-overlay.open { opacity: 1; }
.cf-box {
  width: min(420px, 100%); background: var(--card); border: 1px solid var(--line);
  border-radius: var(--r-card); padding: 20px; box-shadow: var(--shadow-3);
  transform: translateY(18px) scale(.98); transition: transform var(--t-med) var(--ease-sheet);
}
.cf-overlay.open .cf-box { transform: none; }
.cf-title { font: 600 16px var(--font-display); letter-spacing: -.3px; }
.cf-msg { margin-top: 8px; font-size: 12.5px; color: var(--muted); line-height: 1.55; }
.cf-input { margin-top: 14px; font-size: 16px; }
.cf-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }
@media (min-width: 720px) { .cf-overlay { align-items: center; } }

/* splash d'avvio */
#splash {
  position: fixed; inset: 0; z-index: 300;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px;
  background: var(--page); transition: opacity .6s var(--ease), visibility .6s;
  animation: splash-failsafe .6s var(--ease) 3.6s forwards;
}
#splash.out { opacity: 0; visibility: hidden; pointer-events: none; }
.splash-mark {
  width: 72px; height: 72px; border-radius: 20px; display: flex; align-items: center; justify-content: center;
  background: var(--grad-accent); color: var(--on-accent); font: 700 34px var(--font-display);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 0 52px rgba(234, 186, 67, .3);
  animation: splash-mark 1s var(--ease-out) both;
}
.splash-name { font: 700 15px var(--font-display); letter-spacing: .18em; text-indent: .18em; animation: splash-name .85s var(--ease-out) .45s both; }
.splash-bar { width: 44px; height: 3px; border-radius: 2px; background: var(--accent); animation: splash-bar .7s var(--ease-out) .85s both; }
@keyframes splash-mark { from { opacity: 0; transform: scale(.86) translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes splash-name { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes splash-bar { from { opacity: 0; transform: scaleX(0); } to { opacity: 1; transform: scaleX(1); } }
@keyframes splash-failsafe { to { opacity: 0; visibility: hidden; } }


/* ============================================================
   PANNELLI (design "Nav v2"): una sotto-sezione alla volta su
   telefono, scelta dalla barra in fondo; tutto visibile da 720px.
   ============================================================ */
.pane-view.on { animation: pane-fade .18s var(--ease); }
@keyframes pane-fade { from { opacity: 0; } to { opacity: 1; } }
.bottom-chrome { display: none; }
.prof-btn { display: none; }
.fs-head { display: none; }
.hist-search + .filters-sheet .hist-tools { margin-top: 8px; }
.md-group + .md-group { margin-top: 14px; }
.md-panebar { display: none; }

/* indicatore pull-to-refresh (creato dal JS, solo smartphone) */
.ptr-pill {
  position: fixed; top: 64px; left: 50%; z-index: 45; transform: translateX(-50%); opacity: 0;
  width: 38px; height: 38px; border-radius: 50%; background: var(--card); border: 1px solid var(--line);
  box-shadow: var(--shadow-2); display: flex; align-items: center; justify-content: center;
  color: var(--muted); pointer-events: none; transition: opacity .2s, transform .25s var(--ease);
}
.ptr-pill[hidden] { display: none; }
.ptr-pill.ready { color: var(--accent-press); border-color: var(--accent); }
.ptr-pill svg { width: 18px; height: 18px; }
.ptr-pill.loading svg { animation: spin .8s linear infinite; }

/* nuova versione pronta */
.upd-pill {
  position: fixed; left: 50%; transform: translate(-50%, 16px); z-index: 60;
  bottom: calc(92px + var(--sab));
  display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px;
  border-radius: var(--r-pill); border: 1px solid var(--line); background: var(--card);
  color: var(--ink); font: 600 12.5px var(--font-sans); white-space: nowrap; cursor: pointer;
  box-shadow: var(--shadow-3); opacity: 0; transition: opacity .3s var(--ease), transform .3s var(--ease);
}
.upd-pill.on { opacity: 1; transform: translate(-50%, 0); }
.upd-pill b { color: var(--accent-press); }
.upd-pill .upd-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); animation: wp-blink 2.4s infinite; }
@media (min-width: 720px) { .upd-pill { bottom: 24px; } }

/* ============================================================
   Accesso
   ============================================================ */
.auth-card {
  max-width: 380px; margin: 10vh auto 0; padding: 30px 28px;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-hero);
  box-shadow: var(--shadow-3);
}
.auth-card h1 { font-size: 22px; margin-bottom: 4px; }
.auth-card > p { margin: 0; font-size: 12.5px; }
.auth-card form { display: flex; flex-direction: column; gap: 12px; margin-top: 18px; }
.auth-card label { display: block; font: 500 10.5px var(--font-mono); letter-spacing: .7px; text-transform: uppercase; color: var(--muted); }
.auth-card label input { margin-top: 6px; font-family: var(--font-sans); }
.auth-card .btn-primary { width: 100%; margin-top: 6px; padding: 12px; }
.auth-foot { text-align: center; margin-top: 14px; font-size: 12.5px; }

/* ============================================================
   PANORAMICA — capitale (hero), le mie partite, 4 numeri, per
   mercato + ultime partite chiuse
   ============================================================ */
.dash-hero { padding: 0; margin-bottom: 0; }
.dh-top { display: flex; justify-content: space-between; gap: 24px; padding: 26px 26px 0; }
.dh-cap { display: flex; align-items: baseline; gap: 10px; margin-top: 8px; min-height: 56px; }
.dh-value {
  border: 0; background: none; padding: 0; color: var(--ink); cursor: pointer; text-align: left;
  font: 700 56px/1 var(--font-display); letter-spacing: -2.2px; font-variant-numeric: tabular-nums;
  border-radius: 10px; -webkit-tap-highlight-color: transparent;
  transition: transform var(--t-fast) var(--ease), opacity var(--t-fast);
}
.dh-value:active { opacity: .85; }
.dh-value .dh-cents { color: var(--muted); }
.dh-cur { font: 500 22px var(--font-display); color: var(--muted); }
.dh-meta { display: flex; align-items: center; gap: 10px; margin-top: 14px; min-height: 28px; white-space: nowrap; overflow: hidden; }
.dh-delta {
  display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: var(--r-pill);
  font: 600 12.5px var(--font-sans); font-variant-numeric: tabular-nums; white-space: nowrap;
}
.dh-delta.pos { color: var(--good); background: var(--good-wash); }
.dh-delta.neg { color: var(--warn); background: var(--warn-wash); }
.dh-delta.mov { color: var(--plum); background: var(--plum-wash); }
.dh-sub { font-size: 12.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.dh-side { text-align: right; flex-shrink: 0; }
.dh-roi { font: 700 28px var(--font-display); font-variant-numeric: tabular-nums; margin-top: 2px; letter-spacing: -.5px; }
.dh-roi.pos { color: var(--good); }
.dh-roi.neg { color: var(--warn); }
.dh-side .dh-sub { display: block; margin-top: 6px; font-size: 12px; }
.dh-chart { margin-top: 16px; }
.dh-chart .ch-wrap { margin: 0; }
.dh-chart .ch-wrap svg { height: 150px; }
.dh-chart .ch-axis { padding: 0 26px; }
.dh-foot { display: flex; align-items: center; gap: 12px; padding: 0 26px 20px; margin-top: 4px; min-height: 48px; }
.dh-foot .ch-range { margin: 0 0 0 auto; flex-wrap: nowrap; flex-shrink: 0; }
.dh-foot .kicker { white-space: nowrap; }
.ch-range { display: flex; gap: 6px; flex-wrap: wrap; }
.dh-scrub { font: 400 11.5px var(--font-mono); color: var(--muted); flex: 1; min-width: 0; min-height: 1.3em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* curva del capitale: oro con area, tacca finale */
.ch-card { padding-bottom: 14px; }
.ch-wrap { position: relative; margin-top: 12px; }
.ch-wrap svg { width: 100%; height: 190px; display: block; overflow: visible; }
.ch-eq svg { touch-action: none; cursor: crosshair; -webkit-user-select: none; user-select: none; }
.dh-chart { overscroll-behavior: contain; }
.eq-line { fill: none; stroke: var(--accent); stroke-width: 2.5; stroke-linejoin: round; }
.eq-area { fill: var(--accent-wash); }
.eq-base { stroke: var(--line); stroke-dasharray: 4 4; }
.eq-dot { fill: var(--accent); }
.eq-move { fill: none; stroke: var(--plum); stroke-width: 2; stroke-dasharray: 4 4; stroke-linecap: round; }
.eq-move-dot { fill: var(--plum); stroke: var(--card); stroke-width: 1.5; }
.ch-draw { stroke-dasharray: 1; stroke-dashoffset: 1; animation: ch-draw 1.1s var(--ease-out) .1s forwards; }
@keyframes ch-draw { to { stroke-dashoffset: 0; } }
.ch-area { opacity: 0; animation: ch-fade .8s var(--ease-out) .5s forwards; }
@keyframes ch-fade { to { opacity: 1; } }
.ch-guide { stroke: var(--muted); stroke-width: 1; stroke-dasharray: 3 3; opacity: .7; }
.ch-sdot { fill: var(--accent); stroke: var(--card); stroke-width: 2; }
.ch-gline { stroke: var(--line); stroke-width: 1; opacity: .6; stroke-dasharray: 2 5; }
.eq-lab {
  position: absolute; right: 26px; transform: translateY(-50%); pointer-events: none;
  font: 400 10.5px var(--font-mono); color: var(--muted); font-variant-numeric: tabular-nums;
  background: var(--card); padding: 0 3px; border-radius: 4px;
}
.stat-card .eq-lab { right: 2px; }
.ch-axis { position: relative; height: 16px; margin-top: 4px; }
.ch-xtick:first-child { transform: none; }
.ch-xtick { position: absolute; transform: translateX(-50%); font: 400 10.5px var(--font-mono); color: var(--muted); text-transform: uppercase; letter-spacing: .5px; }
.ch-axis.bars { height: auto; display: flex; margin-top: 8px; }
.ch-axis.bars span { flex: 1; text-align: center; min-width: 0; font: 400 10.5px var(--font-mono); color: var(--muted); text-transform: uppercase; letter-spacing: .4px; }
.ch-axis.bars b { display: block; font: 600 12.5px var(--font-mono); letter-spacing: 0; text-transform: none; margin-bottom: 2px; }
.ch-readout { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-top: 12px; min-height: 46px; align-content: start; }
.cr-val { font: 700 22px var(--font-display); letter-spacing: -.5px; font-variant-numeric: tabular-nums; }
.cr-val.pos { color: var(--good); }
.cr-val.neg { color: var(--warn); }
.cr-delta { font: 600 11.5px var(--font-sans); padding: 2px 9px; border-radius: var(--r-pill); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cr-delta.pos { color: var(--good); background: var(--good-wash); }
.cr-delta.neg { color: var(--warn); background: var(--warn-wash); }
.cr-delta.mov { color: var(--plum); background: var(--plum-wash); }
.cr-sub { width: 100%; font: 400 11px var(--font-mono); color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: -2px; }
.ch-legend { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 8px; font-size: 11px; color: var(--muted); }
.ch-legend span { display: inline-flex; align-items: center; gap: 5px; }
.ch-legend i { display: inline-block; }
.ch-legend .lg-line { width: 14px; border-top: 2.5px solid var(--accent); border-radius: 2px; }
.ch-legend .lg-dash { width: 14px; border-top: 2px dashed var(--line); }
.ch-legend .lg-mov { width: 14px; border-top: 2px dashed var(--plum); }
.ch-bar { animation: ch-bar .5s var(--ease-out) backwards; }
.ch-bar.pos { fill: var(--good); }
.ch-bar.neg { fill: var(--warn); }
@keyframes ch-bar { from { opacity: 0; transform: translateY(8px); } }
.ch-hit { cursor: pointer; }
.ch-hitzone { fill: transparent; }
.ch-hit:hover .ch-hitzone, .ch-hit.sel .ch-hitzone { fill: var(--accent-wash-3); }
.ch-hit.sel .ch-bar { stroke: var(--accent); stroke-width: 2; }
.ch-empty { color: var(--muted); font-size: 12.5px; padding: 34px 8px; text-align: center; }
.ch-foot { margin-top: 10px; font-size: 11.5px; color: var(--muted); font-variant-numeric: tabular-nums; }
.stat-card { margin: 0; padding: 18px 20px; }
.st-title { font: 600 14px var(--font-display); display: flex; align-items: baseline; gap: 8px; }
.st-title span { font: 400 11.5px var(--font-sans); color: var(--muted); }

/* le mie partite: griglia di card con bordo di stato a sinistra */
.mm-strip { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }
.mm-strip:empty { min-height: 96px; }
.mm-card {
  display: flex; min-width: 0; text-align: left; cursor: pointer;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-tile);
  overflow: hidden; position: relative; -webkit-tap-highlight-color: transparent;
  transition: border-color var(--t-fast), transform var(--t-fast) var(--ease);
}
.mm-card:hover { border-color: var(--muted); }
.mm-card:active { transform: scale(.985); }
.mm-card::before { content: ""; width: 3px; flex: none; background: var(--line); }
.mm-card.st-SCHEDULED::before { background: var(--accent); }
.mm-card.st-WAIT_HT::before, .mm-card.st-WAIT_FINAL::before { background: var(--plum); }
.mm-card.st-DONE::before { background: var(--good); }
.mm-card.st-SKIPPED::before { background: var(--warn); }
.mm-card.st-SKIPPED { opacity: .8; }
.mm-in { padding: 12px 14px; flex: 1; min-width: 0; display: flex; flex-direction: column; }
.mm-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mm-top .wbadge { padding: 0; background: none; }
.mm-ko { font: 600 13px var(--font-mono); font-variant-numeric: tabular-nums; color: var(--muted); white-space: nowrap; }
.mm-ko.live { color: var(--ink); }
.mm-ko.pos { color: var(--good); }
.mm-ko.neg { color: var(--warn); }
.mm-ko .mm-min { color: var(--muted); font-weight: 400; }
.mm-teams { margin-top: 9px; font: 600 14.5px/1.35 var(--font-sans); display: flex; flex-direction: column; }
.mm-teams span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mm-meta { margin-top: 7px; font-size: 11.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mm-note { margin-top: 7px; font-size: 11.5px; color: var(--warn); line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mm-foot { display: flex; align-items: center; gap: 6px; margin-top: 8px; min-width: 0; }
.mm-foot .mm-meta, .mm-foot .mm-note { flex: 1; min-width: 0; margin-top: 0; }
.mm-acts { display: flex; gap: 4px; flex-shrink: 0; }
.mm-open { margin-left: auto; flex-shrink: 0; font: 600 11.5px var(--font-sans); color: var(--accent-press); white-space: nowrap; }
.mm-card.loading { opacity: .7; }
.mm-card.loading .mm-open::before {
  content: ""; display: inline-block; width: 10px; height: 10px; margin-right: 6px; vertical-align: -1px;
  border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%; animation: spin .7s linear infinite;
}
.mm-del, .star {
  width: 24px; height: 24px; border-radius: 50%; border: 0; background: var(--card-2);
  color: var(--muted); font-size: 11px; line-height: 1; cursor: pointer; padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
}
.mm-del:hover { color: var(--warn); background: var(--warn-wash); }
.star { font-size: 13px; }
.star.on { color: var(--accent); }
.mm-card.mm-empty {
  grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 12px; padding: 14px 16px;
  border-style: dashed; font-size: 12.5px; color: var(--muted); line-height: 1.5;
}
.mm-card.mm-empty::before { display: none; }
.mm-emp-ic { display: flex; color: var(--muted); }
.mm-emp-ic svg { width: 20px; height: 20px; }
.mm-empty b { color: var(--accent-press); }

/* analisi in corso (45' -> fine partita) */
.live-item { padding: 16px 18px; margin: 0; }
#live-list { display: grid; gap: 12px; }
.live-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.live-head > div:first-child { flex: 1 1 200px; min-width: 0; }
.today-title { font: 600 14.5px var(--font-sans); overflow-wrap: anywhere; }
.today-meta { font-size: 11.5px; color: var(--muted); margin-top: 3px; font-variant-numeric: tabular-nums; }
.live-score {
  display: inline-flex; align-items: baseline; gap: 5px; flex-shrink: 0; padding: 4px 10px;
  border-radius: var(--r-pill); background: var(--plum-wash); color: var(--plum); font-family: var(--font-mono);
}
.live-score b { font-size: 14px; font-weight: 700; letter-spacing: .5px; }
.live-score small { font-size: 11px; opacity: .85; }
.live-wait { display: flex; align-items: center; gap: 8px; margin-top: 8px; font-size: 12.5px; color: var(--muted); }
.pulse { width: 7px; height: 7px; border-radius: 50%; background: var(--plum); flex-shrink: 0; animation: wp-blink 1.8s ease-in-out infinite; }
.hist-bets { display: flex; flex-direction: column; }
.hist-bet { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--line-soft); font-size: 13px; }
.hist-bet:last-child { border-bottom: 0; }
.hist-bet small { display: block; font-family: var(--font-mono); font-size: 11px; }
.bf-bet { font: 600 12px var(--font-sans); color: var(--accent-press); white-space: nowrap; }
.rq-box { margin-top: 10px; }
.rq-box > .btn-ghost { width: 100%; }
.rq-note { margin-top: 8px; font-size: 12.5px; color: var(--muted); padding: 8px 10px; border: 1px dashed var(--line); border-radius: 10px; }
.rq-head { margin-top: 10px; font: 500 10px var(--font-mono); letter-spacing: .8px; text-transform: uppercase; color: var(--dim); }
.rq-line { display: flex; align-items: baseline; gap: 8px; margin-top: 6px; font-size: 13px; line-height: 1.4; }
.rq-line .rq-ic { flex-shrink: 0; width: 18px; text-align: center; font-weight: 800; }
.rq-line.good .rq-ic, .rq-line.good b { color: var(--good); }
.rq-line.bad .rq-ic { color: var(--warn); }
.rq-line.bad span { color: var(--muted); }
.rq-line.res { padding-top: 6px; border-top: 1px dashed var(--line); }
.hc-open {
  display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; padding: 0;
  border: 0; background: none; color: var(--accent-press); font: 600 12.5px var(--font-sans); cursor: pointer;
}
.hc-open svg { width: 14px; height: 14px; }

/* in gioco adesso (conto reale) */
.expo-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line-soft); }
.expo-row:last-child { border-bottom: 0; }
.expo-main { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.expo-main b { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.expo-main small { color: var(--muted); font-size: 11.5px; }
.expo-side { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; flex-shrink: 0; }
.expo-side b { font: 600 13px var(--font-mono); font-variant-numeric: tabular-nums; }
.expo-side small { color: var(--muted); font-size: 11px; }
.expo-side .btn-ghost.sm { padding: 4px 10px; font-size: 11.5px; }

/* per mercato: barre in euro dal migliore */
.mkt-rows { display: flex; flex-direction: column; gap: 12px; margin-top: 4px; }
.mkt-row {
  display: block; width: 100%; padding: 0; background: none; border: 0; cursor: pointer;
  color: var(--ink); text-align: left; font-family: var(--font-sans); -webkit-tap-highlight-color: transparent;
}
.mkt-line { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; font: 500 12.5px var(--font-sans); }
.mkt-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mkt-name small { color: var(--muted); font-weight: 400; margin-left: 6px; font-size: 11px; }
.mkt-val { font-family: var(--font-mono); font-weight: 600; white-space: nowrap; }
.mkt-pbar { height: 6px; border-radius: 3px; background: var(--sunken); margin-top: 6px; overflow: hidden; }
.mkt-pbar i { display: block; height: 100%; width: var(--w); border-radius: 3px; background: var(--good); transition: width .6s var(--ease-out); }
.mkt-pbar.neg i { background: var(--warn); }
.mkt-detail { padding: 6px 0 4px; animation: panel-in .18s var(--ease); }
.mkd-row {
  display: flex; align-items: center; gap: 10px; width: 100%; padding: 7px 4px; background: none; border: 0;
  border-radius: 8px; color: var(--ink); text-align: left; cursor: pointer; font-family: var(--font-sans);
}
.mkd-row:hover { background: var(--accent-wash-3); }
.mkd-row .hc-dot { width: 18px; height: 18px; font-size: 9px; }
.mkd-main { flex: 1; min-width: 0; font: 500 12.5px var(--font-sans); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mkd-main small { display: block; color: var(--muted); font: 400 10.5px var(--font-mono); }
.mkd-row b { font: 600 12px var(--font-mono); white-space: nowrap; }

/* ultime partite chiuse */
.rb-row {
  display: flex; align-items: center; gap: 12px; width: 100%; text-align: left;
  background: none; border: 0; border-bottom: 1px solid var(--line-soft); padding: 11px 0;
  cursor: pointer; color: var(--ink); font-family: var(--font-sans); -webkit-tap-highlight-color: transparent;
  transition: background var(--t-fast);
}
.rb-row:last-of-type { border-bottom: 0; }
.rb-row:hover { background: var(--accent-wash-3); }
.rb-main { flex: 1; min-width: 0; }
.rb-title { font: 500 13px var(--font-sans); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rb-sub { font: 400 11px var(--font-mono); color: var(--muted); margin-top: 2px; }
.rb-pnl { font: 600 13px var(--font-mono); white-space: nowrap; }
.rb-pnl.pos { color: var(--good); }
.rb-pnl.neg { color: var(--warn); }
.rb-chev { width: 14px; height: 14px; color: var(--dim); }
.dash-recent .sec-body { padding-top: 0; }

/* ============================================================
   RICERCA — partite del giorno su Betfair
   ============================================================ */
.search-row { display: flex; gap: 10px; align-items: center; margin-top: 18px; }
.search-row .btn-primary { padding: 12px 20px; }
.scan-panel { margin: 16px 0 0; }
.scan-wait { font-size: 12.5px; color: var(--muted); display: flex; align-items: center; gap: 8px; padding: 18px 16px; border: 1px dashed var(--line); border-radius: var(--r-card); }
.scan-list { border: 1px solid var(--line); border-radius: var(--r-card); background: var(--card); overflow: hidden; }
.scan-panel.searching .scan-group.folded .scan-row:not(.hidden) { display: flex; }
.scan-cols { display: flex; align-items: center; gap: 14px; padding: 9px 16px; background: var(--nav); border-bottom: 1px solid var(--line-soft); font: 500 10px var(--font-mono); letter-spacing: .8px; text-transform: uppercase; color: var(--dim); }
.scan-cols > span:nth-child(1) { width: 20px; }
.scan-cols > span:nth-child(2) { width: 46px; }
.scan-cols > span:nth-child(3) { flex: 1; }
.scan-group { display: contents; }
.scan-comp {
  display: flex; align-items: center; gap: 10px; padding: 11px 16px;
  border-bottom: 1px solid var(--line-soft); background: var(--card-2);
}
.scan-comp-name {
  display: inline-flex; align-items: center; gap: 8px; min-width: 0;
  background: none; border: 0; padding: 0; cursor: pointer; color: var(--ink-soft);
  font: 600 11.5px var(--font-sans); text-transform: uppercase; letter-spacing: .6px;
  border-radius: 6px; -webkit-tap-highlight-color: transparent;
}
.scan-comp-name:hover { color: var(--ink); }
.scan-fold-caret { font-size: 10px; color: var(--muted); transition: transform var(--t-med) var(--ease); }
.scan-group.folded .scan-fold-caret { transform: rotate(-90deg); }
.scan-group.folded .scan-row { display: none; }
.scan-count { font: 600 10.5px var(--font-mono); color: var(--muted); background: var(--sunken); border-radius: var(--r-pill); padding: 2px 8px; letter-spacing: 0; text-transform: none; }
.scan-follow { margin-left: auto; display: inline-flex; align-items: center; gap: 7px; font: 400 12px var(--font-sans); color: var(--muted); cursor: pointer; flex-shrink: 0; }
.scan-follow:has(input:checked) { color: var(--ink-soft); font-weight: 600; }
.scan-all { flex-shrink: 0; border: 1px solid var(--line); background: none; border-radius: var(--r-pill); padding: 3px 10px; font: 600 11px var(--font-sans); color: var(--accent-press); cursor: pointer; }
.scan-row {
  display: flex; align-items: center; gap: 14px; padding: 13px 16px; margin: 0;
  border-bottom: 1px solid var(--line-soft); cursor: pointer; font-size: 14px;
  -webkit-tap-highlight-color: transparent; transition: background var(--t-fast);
}
.scan-row:hover { background: var(--accent-wash-3); }
.scan-row input[data-fid] { position: absolute; opacity: 0; pointer-events: none; }
.scan-check { width: 20px; height: 20px; border-radius: 50%; flex-shrink: 0; border: 2px solid var(--line); position: relative; transition: border-color var(--t-fast), background var(--t-fast); }
.scan-row.sel { background: var(--accent-wash-3); }
.scan-row.sel .scan-check { border-color: var(--accent); background: var(--accent); }
.scan-row.sel .scan-check::after, .scan-row.tracked .scan-check::after {
  content: ""; position: absolute; left: 5px; top: 2px; width: 5px; height: 9px;
  border: solid var(--on-accent); border-width: 0 2px 2px 0; transform: rotate(43deg);
}
.scan-row.tracked { opacity: .55; cursor: default; }
.scan-row.tracked .scan-check { border-color: var(--good); }
.scan-row.tracked .scan-check::after { border-color: var(--good); }
.scan-ko { font: 600 13px var(--font-mono); width: 46px; flex: none; color: var(--muted); white-space: nowrap; }
.scan-ko small { display: block; font: 400 10px var(--font-mono); color: var(--dim); text-transform: uppercase; }
.scan-row.sel .scan-ko { color: var(--ink); }
.scan-main { flex: 1; min-width: 0; }
.scan-teams { display: block; font: 500 14px var(--font-sans); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.scan-row.sel .scan-teams { font-weight: 600; }
.scan-meta { display: none; }
.scan-vol { font: 500 11.5px var(--font-mono); color: var(--muted); white-space: nowrap; }
.scan-vol.hi { color: var(--good); }
.scan-vol.low { color: var(--warn); }
.scan-vol.ok { color: var(--good); font-family: var(--font-sans); }
.scan-empty { font-size: 12.5px; color: var(--muted); padding: 22px 16px; text-align: center; }
/* barra di selezione: sotto la lista, sempre a portata di pollice */
.scan-bar {
  position: sticky; bottom: 16px; z-index: 45;
  display: flex; align-items: center; gap: 12px; margin: 16px 0 0;
  padding: 12px 12px 12px 18px; border: 1px solid var(--accent); border-radius: 16px;
  background: var(--card); box-shadow: var(--shadow-2); animation: panel-in .2s var(--ease);
}
#scan-bar-n { flex: 1; min-width: 0; font: 700 13.5px var(--font-display); color: var(--accent-press); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.scan-bar .btn-primary { padding: 10px 20px; }
/* campionati: chip seguiti + catalogo */
.lg-block { margin-top: 24px; }
.chips-row { display: flex; gap: 8px; flex-wrap: wrap; padding: 4px 0 0; }
.lg-catalog { margin-top: 12px; }
.lg-cat-list { display: flex; flex-wrap: wrap; gap: 8px; max-height: 190px; overflow-y: auto; overscroll-behavior: contain; }

/* ============================================================
   STORICO — righe con bordo di esito, filtri in linea, mese in cifre
   ============================================================ */
.hist-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 18px; }
.hist-tools .search-box { flex: 1 1 260px; min-width: 200px; padding: 0 13px; }
.hist-tools .search-box input { padding: 10px 0; font-size: 13px; }
.hist-panel { margin-top: 10px; }
.hist-bulk {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 12px; padding: 10px 14px;
  border: 1px solid var(--accent); border-radius: 16px; background: var(--card); animation: panel-in .2s var(--ease);
}
.hb-count { flex: 1; font: 700 13px var(--font-display); color: var(--accent-press); }
.hist-grid { margin-top: 14px; }
.hist-list { border: 1px solid var(--line); border-radius: var(--r-card); background: var(--card); overflow: hidden; }
.hist-cols { display: flex; align-items: center; gap: 12px; padding: 9px 18px 9px 21px; background: var(--nav); border-bottom: 1px solid var(--line-soft); font: 500 10px var(--font-mono); letter-spacing: .8px; text-transform: uppercase; color: var(--dim); }
.hc-w-date { width: 52px; flex: none; }
.hc-w-main { flex: 1; min-width: 0; }
.hc-w-bet { width: 150px; flex: none; }
.hc-w-q { width: 54px; flex: none; text-align: right; }
.hc-w-res { width: 84px; flex: none; text-align: right; }
.hc-w-chev { width: 16px; flex: none; text-align: right; }
.hist-card { position: relative; border-bottom: 1px solid var(--line-soft); border-left: 3px solid var(--line); }
.hist-card:last-child { border-bottom: 0; }
.hist-card.hc-win { border-left-color: var(--good); }
.hist-card.hc-loss { border-left-color: var(--warn); }
.hist-card.hc-live { border-left-color: var(--plum); }
.hc-top {
  display: flex; align-items: center; gap: 12px; padding: 13px 18px; cursor: pointer;
  -webkit-tap-highlight-color: transparent; transition: background var(--t-fast);
}
.hc-top:hover { background: var(--accent-wash-3); }
.hc-date { font: 500 11.5px var(--font-mono); color: var(--muted); }
.hc-title { font: 600 13.5px var(--font-sans); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hc-sub { font-size: 11px; color: var(--muted); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hc-bet-lab { font: 500 12px var(--font-sans); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hc-quota { font: 600 12.5px var(--font-mono); font-variant-numeric: tabular-nums; }
.hc-res { font: 600 13px var(--font-mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.hc-res.pos { color: var(--good); }
.hc-res.neg { color: var(--warn); }
.hc-res.live { font: 500 11.5px var(--font-sans); color: var(--plum); }
.hc-res.dim, .hc-quota.dim, .hc-bet-lab.dim { color: var(--dim); font-weight: 500; }
.hc-chev { color: var(--dim); font-size: 14px; transition: transform var(--t-med) var(--ease); }
.hist-card.open .hc-chev { transform: rotate(90deg); }
.hc-tags { display: flex; gap: 6px; margin-top: 4px; flex-wrap: wrap; }
.hc-badges { display: flex; gap: 6px; align-items: center; }
.hc-share { width: 26px; height: 26px; border-radius: 50%; border: 1px solid var(--line); background: none; color: var(--muted); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.hc-share svg { width: 13px; height: 13px; }
.hc-share:hover { color: var(--ink); border-color: var(--muted); }
/* dettaglio aperto sotto la riga: giocate, bilancio, azioni */
.hc-body { padding: 4px 18px 14px 18px; background: var(--card-2); border-top: 1px solid var(--line-soft); animation: panel-in .18s var(--ease); }
.hc-bets { display: flex; flex-direction: column; }
.hc-bet { display: flex; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line-soft); }
.hc-bet:last-child { border-bottom: 0; }
.hc-bet-main { flex: 1; min-width: 0; }
.hc-bet-play { font: 600 13px var(--font-sans); }
.hc-bet-sub { font: 400 11px var(--font-mono); color: var(--muted); margin-top: 2px; }
.hc-bet-pnl { font: 600 13px var(--font-mono); white-space: nowrap; font-variant-numeric: tabular-nums; }
.hc-nobet { font-size: 12.5px; color: var(--muted); padding: 8px 0; line-height: 1.5; }
.hc-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 0 0; font-size: 12px; color: var(--muted); }
.hc-pnl { font: 700 14px var(--font-mono); font-variant-numeric: tabular-nums; }
.hc-pnl.pos { color: var(--good); }
.hc-pnl.neg { color: var(--warn); }
.hc-more { padding-top: 10px; }
.hist-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.final-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 6px 0; }
.final-row input[type="number"] { width: 64px; padding: 7px 8px; text-align: center; }
.final-sep { color: var(--muted); }
.play-edit { margin-top: 8px; }
.hc-selmark {
  width: 20px; height: 20px; border-radius: 50%; flex-shrink: 0;
  border: 2px solid var(--line); display: inline-flex; align-items: center; justify-content: center;
  color: transparent; font-size: 11px; font-weight: 700;
}
.hist-card.hc-selected .hc-selmark { border-color: var(--accent); background: var(--accent); color: var(--on-accent); }
.hist-card.hc-selected .hc-top { background: var(--accent-wash-3); }
/* tessere movimento (conto reale) */
.bank-line .hc-title { font-size: 13px; }
.bank-amt { font: 600 13px var(--font-mono); }
.bank-amt.neg { color: var(--plum); }
.bank-amt.pos { color: var(--good); }
.bank-addline { border-left-color: transparent; cursor: pointer; }
.bank-addline .hc-title { color: var(--muted); font-weight: 500; }
.bank-del { border: 0; background: none; color: var(--muted); cursor: pointer; padding: 4px; }

/* ============================================================
   STATISTICHE — verdetto (hero), filtri, andamento, pannelli
   ============================================================ */
.st-hero { padding: 24px 26px; margin-bottom: 0; }
.st-hero-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.st-hero-pill {
  display: inline-flex; align-items: center; gap: 7px; padding: 5px 12px; border-radius: var(--r-pill);
  font: 700 11.5px var(--font-mono); letter-spacing: .4px; text-transform: uppercase;
}
.st-hero-pill.pos { color: var(--good); background: var(--good-wash); }
.st-hero-pill.neg { color: var(--warn); background: var(--warn-wash); }
.st-hero-pill.wait { color: var(--accent-press); background: var(--accent-wash-2); }
.st-hero-meta { font: 400 11.5px var(--font-mono); color: var(--muted); }
.st-hero-txt { margin: 14px 0 0; font: 600 23px/1.45 var(--font-display); letter-spacing: -.5px; max-width: 680px; text-wrap: pretty; }
.st-hero-txt .pos { color: var(--good); }
.st-hero-txt .neg { color: var(--warn); }
.st-hero .grid-1px { margin-top: 20px; }
.st-hero-src { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); font: 400 11px var(--font-sans); color: var(--muted); text-transform: none; letter-spacing: 0; }
#st-stale { margin-top: 14px; }
.st-deck { margin-top: 14px; }
.st-eqcard { padding: 20px 22px; margin: 0; }
.st-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 14px; align-items: start; }
.st-grid .st-pcard { margin: 0; }
.st-grid .st-wide { grid-column: 1 / -1; }
.st-pcard { padding: 18px 20px; }
.st-pcard .st-title { margin-bottom: 12px; }
/* classifiche: testata mono, righe a filo, barra di resa */
.st-tbl { display: flex; flex-direction: column; margin: 0 -20px; max-width: calc(100% + 40px); }
.st-tr {
  display: grid; grid-template-columns: minmax(96px, 1.4fr) 54px 44px 64px 72px;
  align-items: center; gap: 10px; padding: 11px 20px;
  border-bottom: 1px solid var(--line-soft); font: 500 12.5px var(--font-sans);
}
.st-tr:last-child { border-bottom: 0; }
.st-tr.st-th {
  padding: 8px 20px; background: var(--nav); border-top: 1px solid var(--line-soft);
  font: 500 10px var(--font-mono); letter-spacing: .8px; text-transform: uppercase; color: var(--dim);
}
.st-tr > span:nth-child(2), .st-tr > span:nth-child(3) { text-align: right; font-family: var(--font-mono); color: var(--muted); font-variant-numeric: tabular-nums; }
.st-tr > span:nth-child(4) { text-align: right; font-family: var(--font-mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.st-tr.st-th > span:nth-child(2), .st-tr.st-th > span:nth-child(3), .st-tr.st-th > span:nth-child(4) { font-family: var(--font-mono); color: var(--dim); }
.st-lab { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.good-txt { color: var(--good); }
.warn-txt { color: var(--warn); }
.st-tr .muted b { color: var(--muted); }
.st-bar { height: 6px; border-radius: 3px; background: var(--sunken); overflow: hidden; }
.st-bar i { display: block; height: 100%; border-radius: 3px; min-width: 3px; background: var(--good); transition: width .35s var(--ease); }
.st-bar i.dn { background: var(--warn); }
.st-tbl:not(.open) .st-hid { display: none; }
.st-more { margin: 12px 0 0; }
.st-tr.cmp { grid-template-columns: minmax(88px, 1.3fr) 1fr 1fr 64px; }
.st-tr.cmp > span:nth-child(2), .st-tr.cmp > span:nth-child(3), .st-tr.cmp > span:nth-child(4) { text-align: right; font-family: var(--font-mono); white-space: nowrap; }
.st-tr.cmp small { color: var(--muted); font-size: .86em; }
.st-sec { margin: 10px 0 0; padding: 8px 0 2px; font: 600 10px var(--font-mono); letter-spacing: .6px; text-transform: uppercase; color: var(--dim); border-top: 1px solid var(--line-soft); }
.st-cap { font-size: 11.5px; color: var(--muted); margin-top: 10px; line-height: 1.45; }
/* scoperte: card colorata per verso della resa */
.st-disc { display: flex; flex-direction: column; gap: 10px; }
.st-disc-row {
  display: flex; align-items: center; gap: 12px; padding: 11px 13px; border-radius: var(--r-input);
  border: 1px solid var(--good-line); background: rgba(169, 190, 75, .06);
}
.st-disc-row.neg { border-color: var(--warn-line); background: rgba(231, 105, 94, .05); }
.st-disc-row .sd-main { flex: 1; min-width: 0; }
.st-disc-row .sd-lab { font: 600 13px var(--font-sans); }
.st-disc-row .sd-sub { font: 400 11px var(--font-mono); color: var(--muted); margin-top: 2px; }
.st-disc-row .sd-roi { font: 700 14px var(--font-display); color: var(--good); white-space: nowrap; }
.st-disc-row.neg .sd-roi { color: var(--warn); }
.st-disc-act { display: flex; gap: 6px; flex-shrink: 0; }
.st-disc-act .hf-chip { padding: 4px 10px; font-size: 11px; }
/* affidabilita' e vs mercato */
.st-reli { width: 100%; max-width: 360px; height: 210px; display: block; margin: 0 auto; }
.st-reli-dot { fill: var(--accent); opacity: .85; }
.st-reli-dot.up { fill: var(--good); }
.st-reli-dot.dn { fill: var(--warn); }
.st-grid-line { stroke: var(--line); stroke-width: .6; }
.st-diag { stroke: var(--muted); stroke-width: 1.2; stroke-dasharray: 5 4; }
.st-vs-lead { font-size: 12.5px; color: var(--muted); line-height: 1.45; }
.st-vs-big { font: 700 34px var(--font-display); line-height: 1.1; margin: 4px 0 2px; font-variant-numeric: tabular-nums; letter-spacing: -1px; }
.st-vs-ci { font-size: 11.5px; color: var(--muted); margin-bottom: 8px; }
.st-vs-n { font-size: 11px; color: var(--muted); text-align: right; }
.st-vs-verdict { font-size: 12.5px; margin-top: 10px; font-weight: 600; }
/* risultati (anello) */
.res-flex { display: flex; align-items: center; gap: 20px; margin-top: 4px; }
.ring-wrap { position: relative; width: 104px; height: 104px; flex-shrink: 0; }
.ring { width: 100%; height: 100%; display: block; }
.ring-bg { fill: none; stroke: var(--sunken); stroke-width: 9; }
.ring-fg { fill: none; stroke: var(--good); stroke-width: 9; stroke-linecap: round; animation: ring-in 1s var(--ease-out) .15s backwards; }
@keyframes ring-in { from { stroke-dasharray: 0 100; } }
.ring-txt { position: absolute; inset: 0; display: grid; place-items: center; align-content: center; text-align: center; }
.ring-txt b { font: 700 22px var(--font-display); letter-spacing: -.5px; }
.ring-txt span { font: 500 10px var(--font-mono); color: var(--muted); text-transform: uppercase; letter-spacing: .6px; }
.res-side { flex: 1; min-width: 0; }
.wl-line { font: 700 22px var(--font-display); letter-spacing: -.5px; font-variant-numeric: tabular-nums; }
.wl-line > span { font: 600 12.5px var(--font-sans); color: var(--muted); letter-spacing: 0; }
.wl-dot { padding: 0 2px; }
.wl-bar { height: 8px; border-radius: 4px; overflow: hidden; margin-top: 10px; background: var(--warn-wash); }
.wl-bar i { display: block; height: 100%; width: var(--w); background: var(--good); border-radius: 4px 0 0 4px; }
.wl-bar.dd { background: var(--sunken); }
.wl-bar.dd i { background: var(--plum); border-radius: 4px; }
.st-kv { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 14px; }
.st-kv.two { grid-template-columns: repeat(2, 1fr); }
.st-kv > div { min-width: 0; }
.st-kv b { display: block; font: 600 16px var(--font-mono); white-space: nowrap; }
.st-kv span { display: block; font-size: 10.5px; color: var(--muted); margin-top: 2px; }
/* verdetto forward (pannello) */
.fv-badge { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; font: 600 13px var(--font-sans); margin-bottom: 10px; }
.fv-badge small { color: var(--muted); font-weight: 500; }
.fv-badge.good { color: var(--good); }
.fv-badge.bad { color: var(--warn); }
.fv-bar { position: relative; height: 8px; border-radius: 4px; background: var(--sunken); overflow: hidden; }
.fv-bar i { display: block; height: 100%; border-radius: 4px; min-width: 3px; background: var(--accent); transition: width .35s var(--ease); }
.fv-bar b { position: absolute; top: -1px; bottom: -1px; width: 2px; background: var(--muted); opacity: .7; }
.fv-bar.sm { height: 7px; margin: 6px 0 5px; }
.fv-f { padding: 8px 0 6px; }
.fv-f-top { display: flex; align-items: baseline; gap: 7px; font-size: 13px; }
.fv-f-top small { color: var(--muted); font-size: 11px; }
.fv-f-top > span { margin-left: auto; font: 600 12px var(--font-mono); font-variant-numeric: tabular-nums; }
.fv-f-num { display: flex; justify-content: space-between; font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; }
.fv-f-num b { color: var(--ink); font-family: var(--font-mono); }
.fv-f.verde .fv-f-top > span { color: var(--good); }
.fv-f.rosso .fv-f-top > span { color: var(--warn); }
.fv-sub { margin-top: 8px; font-size: 11.5px; color: var(--muted); line-height: 1.45; }
.fv-tappe { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.fv-tappa { font: 500 10.5px var(--font-mono); padding: 4px 9px; border-radius: var(--r-pill); border: 1px solid var(--line); color: var(--muted); white-space: nowrap; opacity: .65; }
.fv-tappa.on { opacity: 1; border-color: var(--accent); color: var(--ink); }
.fv-guide .fv-d { display: flex; gap: 9px; padding: 9px 2px; border-top: 1px dashed var(--line); align-items: flex-start; }
.fv-guide .fv-d:first-of-type { border-top: none; }
.fv-d-ico { flex-shrink: 0; line-height: 1.35; }
.fv-d > div { display: flex; flex-direction: column; gap: 2px; }
.fv-d b { font-size: 12.5px; }
.fv-d span { font-size: 12px; line-height: 1.5; color: var(--ink-soft); }
.fv-d small { font-size: 10.5px; color: var(--muted); font-family: var(--font-mono); }
.fv-d-h { margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--line); font: 600 10px var(--font-mono); letter-spacing: .6px; text-transform: uppercase; color: var(--dim); }
.fv-t { width: 100%; border-collapse: collapse; margin-top: 6px; font: 500 11.5px var(--font-mono); font-variant-numeric: tabular-nums; }
.fv-t th { text-align: left; font-weight: 500; color: var(--dim); padding: 3px 6px 3px 0; border-bottom: 1px solid var(--line); text-transform: uppercase; font-size: 10px; letter-spacing: .6px; }
.fv-t td { padding: 5px 6px 5px 0; border-bottom: 1px dashed var(--line-soft); }
.fv-more { margin-top: 8px; font-size: 12px; color: var(--muted); }
.fv-more summary { cursor: pointer; font-weight: 600; padding: 6px 0; user-select: none; list-style: none; color: var(--accent-press); }
.fv-more summary::-webkit-details-marker { display: none; }
.fv-more summary::after { content: " \25BE"; opacity: .6; }
.fv-more[open] summary::after { content: " \25B4"; }
.fv-rules { margin-top: 10px; padding-top: 8px; border-top: 1px dashed var(--line); font-size: 11px; color: var(--muted); line-height: 1.45; }
/* andamento interattivo */
.st-eq { width: 100%; height: 190px; display: block; overflow: visible; }
.st-eq-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.st-eq-chips .hf-chip { font: 700 10.5px var(--font-mono); padding: 4px 11px; }
.st-eq-cur { stroke: var(--muted); stroke-width: 1; stroke-dasharray: 3 3; opacity: .8; }
.st-eq-cdot { fill: var(--accent); stroke: var(--card); stroke-width: 1.5; }
.st-eq-selr { fill: var(--accent); opacity: .12; }
.st-eq-read { margin-top: 8px; font: 400 11.5px var(--font-mono); min-height: 1.3em; font-variant-numeric: tabular-nums; }
.st-eq-line { fill: none; stroke-width: 2.5; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.st-eq-line.up { stroke: var(--good); }
.st-eq-line.dn { stroke: var(--warn); }
.st-eq-dot.up { fill: var(--good); }
.st-eq-dot.dn { fill: var(--warn); }
.st-eq-zero { stroke: var(--line); stroke-width: 1; stroke-dasharray: 4 4; }
.st-eq-meta { display: flex; justify-content: space-between; align-items: baseline; font: 400 11px var(--font-mono); color: var(--muted); margin-bottom: 4px; }
.st-eq-meta b { font: 700 16px var(--font-display); }
.st-eq-meta b small { font: 400 11px var(--font-mono); color: var(--muted); }
/* strategie salvate */
.stg-list { display: grid; gap: 6px; width: 100%; }
.stg-row { position: relative; display: flex; align-items: center; gap: 10px; padding: 10px 40px 10px 12px; border: 1px solid var(--line); border-radius: var(--r-input); background: var(--card); cursor: pointer; }
.stg-row:hover { border-color: var(--muted); }
.stg-txt { display: grid; gap: 1px; min-width: 0; }
.stg-txt b { font-size: 13px; }
.stg-txt small { color: var(--muted); font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pal-x { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); border: 0; background: none; color: var(--muted); cursor: pointer; font-size: 12px; padding: 6px; }
.stg-fit { margin-top: 10px; width: 100%; }
.stg-fit-txt { padding: 9px 11px; border: 1px solid var(--line); border-radius: var(--r-input); font-size: 12px; line-height: 1.45; }
.stg-fit-txt.bad, .stg-fit-txt.warn { border-color: var(--warn-line); }
.stg-fit-txt small { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; }
.stg-apply-row { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line-soft); }
.stg-apply-row .btn-primary { margin-left: auto; }
.stf-mrow { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; flex: 1 1 100%; padding: 4px 0; }
.stf-mlab { font-size: 11.5px; color: var(--muted); font-weight: 600; }
.stf-lgwrap { display: flex; flex-wrap: wrap; gap: 8px; }
.st-num { width: 90px; padding: 7px 10px; }
#st-pct { width: 160px; }
.stg-quick { margin: 0 0 12px; }
.stg-quick-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }

/* ============================================================
   IMPOSTAZIONI — indice laterale + pagina
   ============================================================ */
.set-layout { display: grid; grid-template-columns: 228px 1fr; min-height: 560px; border: 1px solid var(--line); border-radius: var(--r-card); background: var(--card); overflow: hidden; }
.set-side { border-right: 1px solid var(--line-soft); padding: 20px 14px; background: var(--head); }
.set-side .set-group-label { padding: 16px 8px 8px; margin: 0; font-size: 10px; letter-spacing: .9px; color: var(--dim); }
.set-side .set-group-label:first-child { padding-top: 0; }
.set-side .set-group { padding: 0; border: 0; background: none; margin: 0; }
.set-row {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%;
  border: 0; background: none; color: var(--ink-soft); font: 500 13px var(--font-sans);
  padding: 9px 10px; border-radius: 10px; text-align: left; cursor: pointer;
  transition: background var(--t-fast), color var(--t-fast);
}
.set-row:hover { background: var(--accent-wash-3); color: var(--ink); }
.set-row.on { background: var(--accent-wash); color: var(--accent-press); font-weight: 600; }
.set-row .set-ic, .set-row .set-chev, .set-row small { display: none; }
.set-row-txt { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.set-row-txt b { font-weight: inherit; }
.set-row-val { font: 400 11px var(--font-mono); color: var(--muted); white-space: nowrap; flex-shrink: 0; }
.set-row.on .set-row-val { color: var(--accent-press); }
.set-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--good); flex-shrink: 0; }
.set-dot.warn { background: var(--warn); }
.set-dot.imp { background: var(--accent); }
.set-main { padding: 26px 26px 30px; min-width: 0; }
.set-view { display: none; }
.set-view.on { display: block; }
.set-view.in-r { animation: pane-in-r .28s var(--ease) both; }
.set-view.in-l { animation: pane-in-l .28s var(--ease) both; }
.sp-head { display: none; }
.sp-title { display: none; }
.set-main h2 { font: 600 22px var(--font-display); letter-spacing: -.5px; }
.set-main .sp-intro { margin: 6px 0 18px; font-size: 12.5px; line-height: 1.6; color: var(--muted); max-width: 520px; }
.set-main .card { background: var(--card); }
.set-main > .set-view > .card, .set-main > .set-view > .grid-1px { margin-top: 20px; }
.set-main .card + .card { margin-top: 14px; }
/* card-valore: etichetta, numero grande, cursore */
.val-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 20px; }
.val-card { padding: 18px 20px; margin: 0; }
.val-card .vc-num { display: flex; align-items: baseline; gap: 8px; margin-top: 8px; }
.val-card .vc-num b { font: 700 30px var(--font-display); letter-spacing: -1px; font-variant-numeric: tabular-nums; }
.val-card .vc-num span { font: 500 16px var(--font-display); color: var(--muted); }
.val-card input[type="range"] { margin-top: 14px; }
.val-card input[type="number"] { margin-top: 12px; }
/* scelte a card (metodo di puntata) */
.choice-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; margin-top: 10px; }
.choice:not(.seg-btn) {
  position: relative; text-align: left; cursor: pointer; font-family: var(--font-sans);
  border: 1px solid var(--line); background: var(--card); border-radius: var(--r-tile); padding: 14px 16px; color: var(--ink);
  display: flex; flex-direction: column; gap: 4px;
  transition: border-color var(--t-fast), background var(--t-fast), transform var(--t-fast) var(--ease);
}
.choice:hover { border-color: var(--muted); }
.choice:active { transform: scale(.985); }
.choice b { font: 600 13.5px var(--font-sans); }
.choice span { font: 400 11px/1.45 var(--font-sans); color: var(--muted); }
.choice:not(.seg-btn).active { border-color: var(--accent); background: var(--accent-wash-3); }
.choice.active b { color: var(--accent-press); }
.choice.active span { color: var(--ink-soft); }
.choice:not(.seg-btn).active::after { content: "\2713"; position: absolute; top: 12px; right: 14px; color: var(--accent); font-weight: 700; }
.mkt-pick { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.mkt-pick .hf-chip:not(.active) { text-decoration: line-through; opacity: .7; }
/* pannello "effetto sul tuo storico" */
.effect-box { margin-top: 22px; padding: 18px 20px; background: var(--card-2); border: 1px solid var(--line); border-radius: var(--r-tile); }
.effect-box .eb-head { display: flex; align-items: center; gap: 12px; }
.effect-box .eb-head span:last-child { flex: 1; height: 1px; background: var(--line-soft); }
.effect-box .eb-row { display: flex; align-items: center; gap: 26px; margin-top: 14px; flex-wrap: wrap; }
.effect-box .eb-row b { display: block; font: 700 24px var(--font-display); font-variant-numeric: tabular-nums; letter-spacing: -.5px; }
.effect-box .eb-row small { display: block; font-size: 11px; color: var(--muted); margin-top: 2px; }
.effect-box .eb-spark { flex: 1; min-width: 160px; }
.effect-box .eb-spark svg { display: block; width: 100%; height: 54px; }
.stake-hint { font-size: 12.5px; margin-top: 14px; }
.stake-hint:empty { display: none; }
.stake-line { color: var(--muted); line-height: 1.5; }
.stake-line b { color: var(--ink); }
.stake-line.warn { margin-top: 6px; color: var(--warn); }
.set-actions { display: flex; align-items: center; gap: 12px; margin-top: 20px; }
.set-actions .set-saved { margin-left: auto; font-size: 11.5px; color: var(--muted); }
.sub-details { margin-top: 16px; border-top: 1px solid var(--line-soft); padding-top: 4px; }
.sub-details > summary { cursor: pointer; list-style: none; user-select: none; padding: 10px 2px; color: var(--muted); font: 600 12.5px var(--font-sans); }
.sub-details > summary::-webkit-details-marker { display: none; }
.sub-details > summary::after { content: " \25BE"; font-size: .8em; }
.sub-details[open] > summary::after { content: " \25B4"; }
.sub-details[open] > summary { color: var(--ink); }
.tiered-config { margin-top: 6px; padding-top: 4px; }
.tiered-grid { grid-template-columns: repeat(5, 1fr); gap: 10px; }
.kv-rows { display: grid; gap: 6px; }
.kv-row { display: grid; grid-template-columns: 170px 1fr; gap: 10px; align-items: baseline; font-size: 13px; }
.kv-row .kv-k { color: var(--muted); font-size: 12px; }
.cr-flag { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r-tile); margin-bottom: 8px; cursor: pointer; transition: border-color var(--t-fast), background var(--t-fast); }
.cr-flag:has(input:checked) { border-color: var(--accent); background: var(--accent-wash-3); }
.cr-flag input { margin-top: 3px; }
.cr-flag span { display: grid; }
.cr-flag b { font-size: 13.5px; }
.cr-flag small { color: var(--muted); font-size: 11.5px; }
/* ricalibrazione / salute: righe agenda, pillole, barre */
.cal-hero { padding: 20px 22px; }
.bk-hero-row { display: flex; align-items: center; gap: 12px; }
.bk-hero-row .sec-title { font-size: 16px; }
.bk-hero-row .sec-sub { display: block; margin-top: 3px; }
.cal-prog { font-size: 11.5px; color: var(--muted); margin-top: 10px; }
.cal-hero-cta { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.ag-list { display: flex; flex-direction: column; }
.ag-row { display: flex; align-items: center; gap: 12px; padding: 12px 2px; }
.ag-row + .ag-row { border-top: 1px solid var(--line-soft); }
.ag-ic { flex: 0 0 34px; width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: var(--accent-wash); color: var(--accent); }
.ag-ic svg { width: 18px; height: 18px; }
.ag-ic.moss { background: var(--good-wash); color: var(--good); }
.ag-ic.red { background: var(--warn-wash); color: var(--warn); }
.ag-txt { flex: 1; min-width: 0; }
.ag-txt b { display: block; font-size: 13px; }
.ag-txt small { display: block; color: var(--muted); font-size: 11.5px; line-height: 1.4; }
.ag-when { flex: 0 0 auto; text-align: right; max-width: 42%; }
.ag-when b { display: block; font: 600 12.5px var(--font-mono); color: var(--accent-press); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ag-when small { display: block; color: var(--muted); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-bar { height: 6px; border-radius: 3px; background: var(--sunken); overflow: hidden; margin-top: 7px; }
.cal-bar i { display: block; height: 100%; border-radius: 3px; background: var(--accent); }
.cal-bar-row { display: flex; align-items: center; gap: 12px; padding: 7px 0; font-size: 12.5px; }
/* etichetta | barra | valore in tre colonne fisse: la barra (vuota di
   contenuto) prima si stringeva a 0 px e i valori finivano sfalsati */
.cal-bar-row > span { flex: 0 0 140px; min-width: 0; color: var(--muted); }
.cal-bar-row > .cal-bar { flex: 1 1 auto; min-width: 48px; margin-top: 0; }
.cal-bar-row > b { flex: 0 0 104px; text-align: right; white-space: nowrap; }
.cal-bar-row + .cal-verdict { margin-top: 10px; }
.cal-steps { display: grid; gap: 14px; padding: 2px 0; }
.cal-step { display: flex; gap: 12px; align-items: flex-start; }
.cs-n { width: 24px; height: 24px; border-radius: 50%; flex-shrink: 0; border: 1px solid var(--line); color: var(--muted); display: grid; place-items: center; font: 600 11px var(--font-mono); }
.cal-step b { display: block; font-size: 13px; margin-bottom: 2px; }
.cal-step small { color: var(--muted); font-size: 12px; line-height: 1.5; display: block; }
.cal-item { padding: 12px 0; border-top: 1px solid var(--line-soft); }
.cal-item:first-child { border-top: none; padding-top: 2px; }
.cal-item-head { display: flex; align-items: center; gap: 8px; justify-content: space-between; }
.cal-item-sub { font-size: 11.5px; color: var(--muted); margin-top: 2px; }
.cal-item-txt { font-size: 12.5px; margin-top: 6px; line-height: 1.5; }
.lgc-row { display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; gap: 4px 16px; align-items: center; padding: 11px 2px; }
/* colonna del nome UGUALE per tutte le righe della lista: con max-content
   ogni riga (griglia a se') la calcolava sulla sua parola e i dettagli
   partivano da x diverse. I controlli hanno nomi piu' lunghi dei campionati */
#cal-suite .lgc-row { grid-template-columns: 250px minmax(0, 1fr) auto; }
.lgc-row + .lgc-row { border-top: 1px solid var(--line-soft); }
.lgc-name { font-size: 13px; line-height: 1.35; min-width: 0; overflow-wrap: break-word; }
.lgc-det { color: var(--muted); font-size: 11.5px; line-height: 1.45; min-width: 0; overflow-wrap: break-word; }
.lgc-row .vd { justify-self: end; white-space: nowrap; }
/* testo di stato in due paragrafi: respiro fra l'uno e l'altro */
.cal-verdict + .cal-verdict { margin-top: 8px; }
.cal-verdict { line-height: 1.5; }
.ag-when b { white-space: normal; line-height: 1.3; }
/* testata dei riquadri: se la pillola non ci sta accanto al titolo scende sotto */
.bk-hero-row { flex-wrap: wrap; row-gap: 10px; }
/* !important: il blocco testo ha style="flex:1;min-width:0" nell'HTML,
   che azzerava la base e teneva la pillola accanto a un testo schiacciato */
.bk-hero-row > div { flex: 1 1 240px !important; }
.bk-list { display: flex; flex-direction: column; gap: 8px; }
.bk-item { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border: 1px solid var(--line); border-radius: var(--r-tile); background: var(--card); }
.bk-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--good); flex-shrink: 0; }
.bk-txt { flex: 1; min-width: 0; }
.bk-txt b { display: block; font-size: 13px; }
.bk-txt small { color: var(--muted); font-size: 11.5px; }
.bk-when { font: 400 11px var(--font-mono); color: var(--muted); white-space: nowrap; }
.bk-actions { display: flex; gap: 6px; flex-shrink: 0; }
.bk-count { font: 700 22px var(--font-display); }
.bk-danger { border-color: var(--warn-line); }
.bk-empty { font-size: 12.5px; color: var(--muted); padding: 14px 0; }
.prof-head { display: flex; align-items: center; gap: 14px; padding: 0 0 14px; }
.prof-avatar { width: 52px; height: 52px; border-radius: 50%; flex-shrink: 0; background: var(--grad-accent); color: var(--on-accent); display: grid; place-items: center; font: 700 22px var(--font-display); }
.prof-name b { display: block; font: 600 16px var(--font-display); }
.prof-name small { color: var(--muted); font-size: 11.5px; }
.prof-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--r-tile); overflow: hidden; }
.prof-kpi { background: var(--card); padding: 14px 16px; }
.prof-kpi small { display: block; color: var(--muted); font-size: 11px; margin-bottom: 3px; }
.prof-kpi b { font: 700 18px var(--font-display); font-variant-numeric: tabular-nums; }
.prof-kpi b.good { color: var(--good); }
.prof-kpi b.bad { color: var(--warn); }
.look-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 10px; }
.lg-item, .lg-grid { display: none; }

/* ============================================================
   ANALISI COMPLETA DELLA PARTITA (foglio) e PANNELLO QUOTE
   ============================================================ */
body.no-scroll { overflow: hidden; }
.drawer-overlay {
  position: fixed; inset: 0; z-index: 60; background: var(--overlay);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  opacity: 0; transition: opacity .3s var(--ease);
}
.drawer-overlay.open { opacity: 1; }
.drawer-overlay[hidden], .odds-drawer[hidden], .match-detail[hidden] { display: none; }
.md-overlay { z-index: 70; }
.odds-drawer {
  position: fixed; z-index: 61; display: flex; flex-direction: column;
  background: var(--card); border: 1px solid var(--line); box-shadow: var(--shadow-3);
  left: 0; right: 0; bottom: 0; max-height: 78vh; border-radius: 22px 22px 0 0; border-bottom: 0;
  transform: translateY(102%); transition: transform .42s var(--ease-sheet);
  padding-bottom: var(--sab); will-change: transform;
}
@supports (max-height: 78dvh) { .odds-drawer { max-height: 78dvh; } }
.odds-drawer.open { transform: translateY(0); }
.odds-drawer.dragging, .match-detail.dragging { transition: none; }
.drawer-grip { width: 40px; height: 4px; border-radius: 2px; background: var(--line); margin: 10px auto 2px; flex-shrink: 0; }
.drawer-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 18px 12px; border-bottom: 1px solid var(--line-soft); flex-shrink: 0; }
.drawer-title { font: 600 16px var(--font-display); letter-spacing: -.3px; }
.drawer-sub { font: 400 11px var(--font-mono); color: var(--muted); margin-top: 2px; }
.drawer-close {
  width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--line); cursor: pointer;
  background: none; color: var(--muted); font-size: 12px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.drawer-close:hover { color: var(--ink); border-color: var(--muted); }
.drawer-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 14px 18px calc(20px + var(--sab)); -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
.dw-group { margin-bottom: 16px; }
.dw-title { margin-bottom: 8px; display: block; }
.dw-odds { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.dw-odds.cols-2 { grid-template-columns: repeat(2, 1fr); }
.dw-cell { background: var(--input-bg); border: 1px solid var(--line); border-radius: 10px; padding: 9px 6px; text-align: center; transition: border-color 1.4s var(--ease), background 1.4s var(--ease); }
.dw-cell small { display: block; font-size: 10.5px; color: var(--muted); margin-bottom: 3px; }
.dw-cell b { font: 500 14px var(--font-mono); font-variant-numeric: tabular-nums; }
.dw-cell.off b { color: var(--muted); font-weight: 400; }
.dw-cell.up { border-color: var(--good-line); background: rgba(169, 190, 75, .07); }
.dw-cell.down { border-color: var(--warn-line); background: rgba(231, 105, 94, .07); }
.dw-cell b.up { animation: dw-up 1.6s var(--ease); }
.dw-cell b.down { animation: dw-down 1.6s var(--ease); }
@keyframes dw-up { 0%, 25% { color: var(--good); } 100% { color: inherit; } }
@keyframes dw-down { 0%, 25% { color: var(--warn); } 100% { color: inherit; } }
.dw-note { font-size: 11.5px; color: var(--muted); margin-top: 4px; display: flex; align-items: center; gap: 6px; }
.dw-empty { text-align: center; color: var(--muted); padding: 26px 10px; font-size: 13px; }

.match-detail {
  position: fixed; z-index: 71; display: flex; flex-direction: column;
  background: var(--page); box-shadow: var(--shadow-3);
  inset: 0; top: max(12px, var(--sat));
  border-radius: 22px 22px 0 0; border: 1px solid var(--line); border-bottom: none;
  transform: translateY(103%); transition: transform .46s var(--ease-sheet);
  will-change: transform; overscroll-behavior: none;
}
.match-detail.open { transform: translateY(0); }
.match-detail .drawer-grip { margin: 10px auto 0; }
.md-head { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-shrink: 0; padding: 8px 14px 10px; border-bottom: 1px solid var(--line-soft); touch-action: none; }
.md-back { display: flex; align-items: center; gap: 6px; padding: 7px 12px 7px 8px; border: 1px solid var(--line); border-radius: var(--r-pill); background: none; color: var(--ink-soft); font: 600 12px var(--font-sans); cursor: pointer; }
.md-back svg { width: 14px; height: 14px; }
.md-head-title { position: absolute; left: 50%; transform: translateX(-50%); max-width: 52%; text-align: center; font: 500 10.5px var(--font-mono); letter-spacing: .7px; text-transform: uppercase; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.md-close { flex-shrink: 0; }
.md-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; touch-action: pan-y; padding: 10px 16px calc(28px + var(--sab)); }
.md-bottom-close { width: 100%; margin-top: 16px; justify-content: center; }
.md-hero { text-align: center; padding: 18px 8px 6px; }
.md-tags { display: flex; gap: 6px; justify-content: center; flex-wrap: wrap; }
.md-tags.sub { margin-top: 8px; }
.ibadge { display: inline-flex; align-items: center; gap: 6px; font: 500 11px var(--font-mono); color: var(--muted); }
.ibadge i { width: 6px; height: 6px; border-radius: 50%; background: var(--line); }
.ib-comp i { background: var(--plum); }
.ib-date i { background: var(--muted); }
.ib-ht i, .ib-bets i { background: var(--accent); }
.md-score { display: flex; align-items: center; justify-content: center; gap: 16px; margin: 12px 0 4px; }
.md-team { font: 700 20px var(--font-display); letter-spacing: -.3px; flex: 1; min-width: 0; }
.md-team:first-child { text-align: right; }
.md-team:last-child { text-align: left; }
.md-ft { font: 700 30px var(--font-display); letter-spacing: 1px; background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 6px 14px; flex-shrink: 0; font-variant-numeric: tabular-nums; }
.md-badges { display: flex; gap: 6px; justify-content: center; margin-top: 10px; }
.md-deck { display: grid; gap: 14px; margin-top: 14px; }
.md-sec { background: var(--card); border: 1px solid var(--line); border-radius: var(--r-card); padding: 16px 18px; margin: 0; }
.md-sec-title { margin-bottom: 12px; display: flex; align-items: baseline; gap: 8px; font: 600 14px var(--font-display); letter-spacing: -.1px; text-transform: none; color: var(--ink); }
.md-sec-title small { font: 400 11.5px var(--font-sans); color: var(--muted); }
.md-note { font-size: 12px; color: var(--muted); line-height: 1.5; margin-top: 10px; }
.md-note b { color: var(--ink); }
.md-legend { display: flex; gap: 16px; margin-top: 12px; }
.md-legend .lg { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--muted); }
.md-legend .sw { width: 14px; height: 8px; border-radius: 4px; display: inline-block; }
.md-legend .sw.model { background: var(--accent); }
.md-legend .sw.market { background: var(--plum); }
.mx-row { display: grid; grid-template-columns: 130px 1fr; gap: 10px; align-items: center; padding: 7px 0; }
.mx-row + .mx-row { border-top: 1px solid var(--line-soft); }
.mx-lab { font: 600 12.5px var(--font-sans); }
.mx-check { color: var(--good); font-weight: 700; }
.mx-row.hit .mx-lab { color: var(--good); }
.mxb { display: flex; align-items: center; gap: 8px; }
.mxb + .mxb { margin-top: 4px; }
.mxb i { display: block; height: 10px; border-radius: 5px; width: 0; transition: width .9s var(--ease-out); }
.mxb.model i { background: var(--accent); }
.mxb.market i { background: var(--plum); }
.mxb span { font: 400 11px var(--font-mono); color: var(--muted); font-variant-numeric: tabular-nums; flex-shrink: 0; }
.match-detail.open .mxb i, #result .mxb i { width: var(--w); }
.md-dist { display: flex; gap: 8px; align-items: flex-end; height: 130px; padding-top: 14px; }
.dist-col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 4px; min-width: 0; height: 100%; }
.dist-col b { font: 500 10px var(--font-mono); color: var(--muted); white-space: nowrap; }
.dist-col i { display: block; width: 100%; max-width: 46px; border-radius: 6px 6px 3px 3px; background: var(--good-wash); border: 1px solid var(--good-line); border-bottom: none; height: 0; transition: height .8s var(--ease-out); }
.match-detail.open .dist-col i, #result .dist-col i { height: var(--h); }
.dist-col span { font: 400 11px var(--font-mono); color: var(--muted); }
.dist-col.actual i { background: var(--good); border-color: var(--good); }
.dist-col.actual span, .dist-col.actual b { color: var(--good); font-weight: 700; }
.ev-rows { margin-top: 12px; display: flex; flex-direction: column; gap: 8px; }
.ev-row { padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r-input); }
.ev-row.gioca { border-color: var(--good-line); background: rgba(169, 190, 75, .06); }
.ev-row.no { opacity: .75; }
.ev-head { display: flex; align-items: center; gap: 10px; }
.ev-dot { width: 20px; height: 20px; border-radius: 50%; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 700; background: var(--warn-wash); color: var(--warn); }
.ev-row.gioca .ev-dot { background: var(--good-wash); color: var(--good); }
.ev-out { flex: 1; min-width: 0; font: 600 13px var(--font-sans); }
.ev-out small { color: var(--muted); font-weight: 400; margin-left: 4px; }
.ev-q { font: 500 12.5px var(--font-mono); font-variant-numeric: tabular-nums; }
.ev-q em { font-style: normal; font: 600 10.5px var(--font-sans); color: var(--warn); margin-left: 4px; }
.ev-v { font: 700 16px var(--font-display); font-variant-numeric: tabular-nums; min-width: 56px; text-align: right; }
.ev-why { font: 400 11.5px var(--font-sans); color: var(--muted); margin-top: 6px; padding-left: 30px; line-height: 1.5; }
.ev-why b { color: var(--ink); }
.ev-bar-track { height: 4px; border-radius: 2px; background: var(--line); margin: 8px 0 0 30px; overflow: hidden; }
.ev-bar-track i { display: block; height: 100%; width: 0; border-radius: 2px; background: var(--good); transition: width .7s var(--ease-out); }
.match-detail.open .ev-bar-track i { width: var(--w); }
.sd-head { display: flex; justify-content: space-between; font: 600 12px var(--font-sans); margin-bottom: 8px; }
.sd-head span:first-child { color: var(--accent-press); }
.sd-head span:last-child { color: var(--plum); }
.sd-row { display: grid; grid-template-columns: 44px 1fr 44px; gap: 10px; align-items: center; padding: 6px 0; }
.sd-row + .sd-row { border-top: 1px solid var(--line-soft); }
.sd-v { font: 500 12.5px var(--font-mono); color: var(--muted); text-align: center; font-variant-numeric: tabular-nums; }
.sd-v.lead { color: var(--ink); font-weight: 700; }
.sd-mid span { display: block; text-align: center; font-size: 11.5px; color: var(--muted); margin-bottom: 4px; }
.sd-track { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; height: 8px; }
.sd-track i { display: block; border-radius: 4px; width: 0; height: 100%; transition: width .8s var(--ease-out); }
.sd-track .h { background: var(--accent); justify-self: end; }
.sd-track .a { background: var(--plum); }
.match-detail.open .sd-track i { width: var(--w); }
/* qualita' del prezzo (eta' e volume, requisito 1 reso visibile) */
.qp-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 10px; }

@media (min-width: 720px) {
  .match-detail {
    inset: auto; top: 50%; left: 50%; width: min(880px, calc(100vw - 48px));
    max-height: min(88vh, 980px); border-radius: 20px; border-bottom: 1px solid var(--line);
    transform: translate(-50%, 46%) scale(.96); opacity: 0;
    transition: transform .42s var(--ease-sheet), opacity .3s var(--ease);
  }
  @supports (max-height: 88dvh) { .match-detail { max-height: min(88dvh, 980px); } }
  .match-detail.open { transform: translate(-50%, -50%) scale(1); opacity: 1; }
  .match-detail .drawer-grip { display: none; }
  .md-back { display: none; }
  .md-body { padding: 22px 28px 30px; }
  .md-deck { grid-template-columns: 1fr 1fr; }
  .md-deck .md-sec.md-wide { grid-column: 1 / -1; }
  .md-bottom-close { display: none; }
}
@media (max-width: 719.98px) {
  .md-close { display: none; }
  .mx-row { grid-template-columns: 96px 1fr; }
  .md-team { font-size: 16px; }
  .md-ft { font-size: 24px; padding: 5px 10px; }
  .md-dist { gap: 5px; height: 110px; }
  .md-sec { padding: 14px; }
  .ev-why { padding-left: 0; }
  .ev-bar-track { margin-left: 0; }
}
@media (min-width: 1100px) {
  .odds-drawer { left: auto; top: 0; bottom: 0; right: 0; width: 420px; max-height: none; border-radius: 0; border: none; border-left: 1px solid var(--line); transform: translateX(102%); }
  .odds-drawer.open { transform: translateX(0); }
  .drawer-grip { display: none; }
  .drawer-head { padding-top: 16px; }
}

/* ============================================================
   TABLET (< 1000px): le griglie a due colonne si stringono
   ============================================================ */
@media (max-width: 999.98px) {
  .two-col, .st-grid, .val-cards { grid-template-columns: minmax(0, 1fr); }
  .set-layout { grid-template-columns: 200px 1fr; }
  .set-side .set-row-val { display: none; }
  .choice-grid { grid-template-columns: repeat(2, 1fr); }
  .md-deck { grid-template-columns: 1fr; }
  .mm-strip { grid-template-columns: repeat(2, 1fr); }
  .hc-w-bet { width: 110px; }
}

/* ============================================================
   SMARTPHONE (< 720px): testata compatta + barra delle sezioni
   in basso (pillola flottante). Il body NON scorre: scorre <main>,
   cosi' testata e barra restano inchiodate anche nella PWA iOS.
   ============================================================ */
@media (max-width: 719.98px) {
  html, body { height: 100%; }
  @supports (height: 100dvh) { html, body { height: 100dvh; } }
  html { overscroll-behavior-y: none; }
  @supports (overflow-x: clip) { html { overflow-x: clip; } }
  body { display: flex; flex-direction: column; position: relative; overflow: hidden; overscroll-behavior: none; }
  .topbar { flex-shrink: 0; position: relative; gap: 8px; padding-left: 14px; padding-right: 14px; }
  .brand-txt { display: none; }
  .watcher-pill .wp-txt { display: none; }
  .watcher-pill { padding: 6px; }
  .mode-seg .seg-btn { padding: 6px 11px; font-size: 11.5px; }
  .user { display: none; }
  .topnav { gap: 6px; }
  main.container {
    flex: 1 1 auto; min-height: 0; width: 100%; padding: 14px 12px;
    overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain; overflow-anchor: none; touch-action: pan-y;
    padding-bottom: calc(var(--chrome-h, 110px) + 18px);
  }
  .tabpane { touch-action: pan-y; }
  /* chrome in fondo: barra dei pannelli + sezioni (4 voci), a filo schermo */
  .bottom-chrome {
    /* FIXED, non absolute (13/09/2026): su iPhone la barra si muoveva col
       rimbalzo del body e con la tastiera; fissata alla finestra resta
       ferma sempre */
    display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
    background: var(--glass); border-top: 1px solid var(--line-soft);
    -webkit-backdrop-filter: blur(18px) saturate(1.4); backdrop-filter: blur(18px) saturate(1.4);
    /* le voci stanno SOPRA la zona dei gesti di iOS (indicatore home,
       swipe per uscire o cambiare app): ESATTAMENTE la safe-area che il
       dispositivo dichiara (e' gia' la zona riservata ai gesti), niente
       margine aggiunto; senza safe-area (browser) 12px dal bordo */
    padding-bottom: max(var(--sab), 12px);
    transform: translateZ(0);
    transition: transform .25s var(--ease);
  }
  body.kb-open .bottom-chrome, body.no-scroll .bottom-chrome { transform: translateY(110%); pointer-events: none; }
  body.has-tabbar::after {
    content: ""; position: fixed; left: 0; right: 0; bottom: var(--chrome-h, 110px); height: 26px;
    background: linear-gradient(to top, var(--page), transparent);
    pointer-events: none; z-index: 39; transition: opacity .25s;
  }
  body.has-tabbar.kb-open::after, body.no-scroll.has-tabbar::after { opacity: 0; }
  .pane-view:not(.on) { display: none; }
  .pane-bar { display: flex; gap: 6px; padding: 8px 12px 2px; overflow-x: auto; scrollbar-width: none; }
  .pane-bar::-webkit-scrollbar { display: none; }
  .pane-bar:empty { display: none; }
  .pane-chip {
    flex: 1 1 0; min-width: max-content; min-height: 34px; padding: 0 12px;
    border: 1px solid var(--line); background: none; color: var(--muted); border-radius: 10px;
    font: 600 12px var(--font-sans); white-space: nowrap; cursor: pointer; -webkit-tap-highlight-color: transparent;
    transition: color var(--t-fast), border-color var(--t-fast), background var(--t-fast);
  }
  .pane-chip.on { border-color: var(--accent); background: var(--accent-wash-2); color: var(--ink); }
  .pane-chip:active { transform: scale(.97); }
  .pane-chip.fs-chip { flex: 0 0 auto; }
  .bottom-chrome .tabs {
    position: static; display: flex; gap: 2px; margin: 0; padding: 2px 6px 4px;
    background: none; border: 0; border-radius: 0; box-shadow: none; overflow: visible; touch-action: auto; transform: none;
  }
  .bottom-chrome .tab-glider { display: none !important; }
  .bottom-chrome .tab {
    flex: 1 1 0; min-width: 0; min-height: 50px; margin: 0; padding: 0; border-radius: 12px;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    background: none; color: var(--dim); font: 600 10px var(--font-sans); letter-spacing: 0;
  }
  .bottom-chrome .tab[data-tab="impostazioni"] { display: none; }
  .tab-txt { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .tab-ic { display: inline-flex; }
  .tab-ic svg { width: 21px; height: 21px; }
  .bottom-chrome .tab.active { color: var(--accent); background: none; }
  .tab:hover { background: none; }
  .prof-btn { display: inline-flex; }
  #theme-toggle { display: none; }
  /* filtri di Storico e Statistiche: foglio sopra il chrome */
  .filters-sheet {
    position: fixed; left: 0; right: 0; bottom: var(--chrome-h, 110px); z-index: 38;
    max-height: min(70vh, 560px); overflow-y: auto; overscroll-behavior: contain;
    padding: 0 14px 16px; background: var(--card); border: 1px solid var(--line); border-bottom: 0;
    border-radius: 18px 18px 0 0; box-shadow: 0 -14px 34px rgba(0, 0, 0, .42);
    transform: translateY(calc(100% + var(--chrome-h, 110px))); visibility: hidden;
    transition: transform .28s var(--ease-sheet), visibility 0s linear .28s;
  }
  .filters-sheet.open { transform: none; visibility: visible; transition: transform .28s var(--ease-sheet); }
  .fs-head {
    display: flex; align-items: center; justify-content: space-between; position: sticky; top: 0; z-index: 1;
    padding: 14px 0 10px; background: var(--card); font: 600 15px var(--font-display);
  }
  .filters-sheet .filter-row { margin-top: 0; }
  .filters-sheet .filter-row > .kicker { display: none; }
  .filters-sheet .hf-menu { margin-top: 8px; }
  body.kb-open .filters-sheet.open { bottom: 0; }
  .toast { bottom: calc(var(--chrome-h, 110px) + 12px); }
  .scan-bar { bottom: calc(var(--chrome-h, 110px) + 10px); }
  .upd-pill { bottom: calc(var(--chrome-h, 110px) + 12px); }
  /* foglio partita: barra dei pannelli in fondo al foglio */
  .md-panebar {
    display: flex; gap: 6px; flex-shrink: 0; padding: 8px 12px calc(8px + var(--sab));
    background: var(--nav); border-top: 1px solid var(--line-soft);
  }
  .md-panebar .pane-chip { min-height: 40px; }
  .match-detail .md-body { padding-bottom: 20px; }
  /* Panoramica compatta: niente doppioni, partite in righe */
  .dh-side { display: none; }
  .dh-top { padding-top: 16px; }
  .mm-strip { gap: 0; border: 1px solid var(--line); border-radius: var(--r-tile); background: var(--card); overflow: hidden; }
  .mm-card { border: 0; border-radius: 0; border-bottom: 1px solid var(--line-soft); }
  .mm-card:last-child { border-bottom: 0; }
  .mm-card.mm-empty { border: 0; }
  .mm-in { padding: 10px 12px; }
  .mm-teams { display: block; margin-top: 4px; font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mm-teams span + span::before { content: " – "; color: var(--dim); }
  .mm-foot { margin-top: 4px; }
  .card { margin-bottom: 10px; }
  .block-head { margin: 18px 2px 8px; }
  .odds-drawer { max-height: calc(100vh - 120px); }
  @supports (max-height: 100dvh) { .odds-drawer { max-height: calc(100dvh - 120px); } }
  input[type="text"], input[type="number"], input[type="password"], input[type="search"], input[type="email"], select { font-size: 16px; }

  .page-head { flex-direction: column; align-items: flex-start; gap: 10px; }
  .page-head h2 { font-size: 22px; }
  .dh-top { flex-direction: column; gap: 14px; padding: 20px 18px 0; }
  .dh-value { font-size: 40px; letter-spacing: -1.6px; }
  .dh-side { text-align: left; }
  .dh-side .dh-sub { margin-top: 2px; }
  .dh-foot { padding: 0 18px 16px; flex-wrap: wrap; gap: 8px 12px; }
  .dh-scrub { flex-basis: 100%; order: 3; }
  .tab { font-size: 9.5px; letter-spacing: -.2px; }
  .dh-chart .ch-axis { padding: 0 18px; }
  .eq-lab { right: 18px; }
  .mm-strip { grid-template-columns: 1fr; }
  .grid-1px.c4 { grid-template-columns: repeat(2, 1fr); }
  .grid-1px.c3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .grid-1px > div { padding: 12px 14px; }
  .grid-1px b { font-size: 18px; }
  .sec-head { padding: 16px 16px 8px; }
  .sec-head > div { flex-direction: column; align-items: flex-start; gap: 4px; }
  .sec-sub { line-height: 1.45; }
  .sec-body { padding: 6px 16px 16px; }
  .card { margin-bottom: 12px; }
  .set-main .card + .card { margin-top: 12px; }
  .set-main .sp-intro { margin-bottom: 16px; }
  .cal-hero { padding: 16px; }
  .bk-hero-row .sec-sub { margin-top: 4px; }
  /* righe lega/controlli: nome e pillola sulla prima riga, dettaglio sotto.
     Nel DOM il dettaglio sta FRA nome e pillola: senza posizioni esplicite
     la pillola scendeva da sola su una terza riga */
  .lgc-row, #cal-suite .lgc-row { grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; }
  .lgc-name { grid-column: 1; grid-row: 1; }
  .lgc-row .vd { grid-column: 2; grid-row: 1; align-self: start; }
  .lgc-det { grid-column: 1 / -1; grid-row: 2; }
  .cal-bar-row > span { flex-basis: 108px; }
  .cal-bar-row > b { flex-basis: 92px; }
  .ag-row { align-items: flex-start; }
  .ag-when { max-width: 46%; }
  /* testate delle card di Statistiche: titolo sopra, sottotitolo sotto,
     come le .sec-head (affiancati il titolo andava a capo in una colonna
     stretta con il sottotitolo di lato) */
  .st-title { flex-direction: column; align-items: flex-start; gap: 4px; }
  .st-title span { line-height: 1.45; }
  /* riga di una tappa della prova: nome e contatore sopra, descrizione sotto */
  .fv-f-top { flex-wrap: wrap; row-gap: 2px; }
  .fv-f-top small { flex: 1 1 100%; order: 3; }
  /* Panoramica: il blocco "Le mie partite" non tocca la card che segue */
  .mm-block { margin-bottom: 12px; }
  .search-row { flex-wrap: wrap; }
  .search-row .btn-primary { width: 100%; }
  .filter-row .f-note { margin-left: 0; width: 100%; }
  .scan-cols { display: none; }
  .scan-row { gap: 10px; padding: 12px 14px; }
  .scan-ko { width: 40px; font-size: 12px; }
  .scan-comp { padding: 10px 14px; }
  .hist-tools .search-box { min-width: 0; width: 100%; }
  .hist-cols { display: none; }
  .hc-top { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; padding: 12px 14px; align-items: center; }
  .hc-w-date { width: auto; grid-column: 1; grid-row: 1; font-size: 10.5px; }
  .hc-w-main { grid-column: 1; grid-row: 2; }
  .hc-w-res { width: auto; grid-column: 2; grid-row: 1 / 3; text-align: right; }
  .hc-w-bet { width: auto; grid-column: 1; grid-row: 3; margin-top: 4px; }
  .hc-w-q { width: auto; grid-column: 2; grid-row: 3; text-align: right; margin-top: 4px; }
  .hc-w-chev { display: none; }
  .hist-card.hc-selectable .hc-top { grid-template-columns: 24px 1fr auto; }
  .hist-card.hc-selectable .hc-selmark { grid-row: 1 / 4; }
  .hist-card.hc-selectable .hc-w-date, .hist-card.hc-selectable .hc-w-main, .hist-card.hc-selectable .hc-w-bet { grid-column: 2; }
  .hist-card.hc-selectable .hc-w-res, .hist-card.hc-selectable .hc-w-q { grid-column: 3; }
  .grid-1px.c3 b { font-size: 16px; }
  .st-hero { padding: 18px 16px; }
  .st-hero-txt { font-size: 18px; }
  .st-tr { grid-template-columns: minmax(0, 1.3fr) 40px 36px 54px; gap: 8px; padding: 10px 16px; font-size: 12px; }
  .st-pcard, .st-eqcard { min-width: 0; max-width: 100%; }
  .st-tr > span:nth-child(5) { display: none; }
  .st-tbl { margin: 0 -16px; max-width: calc(100% + 32px); }
  .st-tr.st-th { padding: 8px 16px; }
  .st-pcard, .st-eqcard { padding: 16px; }
  .st-disc-row { flex-wrap: wrap; }
  .st-disc-row .st-disc-act { flex-basis: 100%; justify-content: flex-end; }
  .tools-grid, .tiered-grid { grid-template-columns: 1fr; }
  .kv-row { grid-template-columns: 1fr; gap: 2px; }
  .choice-grid { grid-template-columns: 1fr; }
  .prof-grid { grid-template-columns: repeat(2, 1fr); }
  .look-grid { grid-template-columns: 1fr; }
  /* Impostazioni: indice come elenco, la pagina scelta scorre da destra */
  .set-layout { display: block; border: 0; background: none; border-radius: 0; }
  .set-side { border: 0; padding: 0; background: none; }
  .set-side.off { display: none; }
  .set-side .set-group { border: 1px solid var(--line); border-radius: var(--r-card); background: var(--card); padding: 4px; margin-bottom: 6px; }
  .set-side .set-group-label { padding: 14px 6px 6px; }
  .set-row { padding: 13px 12px; font-size: 14px; border-radius: 12px; }
  .set-row + .set-row { border-top: 1px solid var(--line-soft); border-radius: 0; }
  .set-row .set-chev { display: inline-flex; color: var(--dim); }
  .set-side .set-row-val { display: inline; }
  .set-row .set-chev svg { width: 16px; height: 16px; }
  .set-row.on { background: none; color: var(--ink); font-weight: 500; }
  .set-main { padding: 0; }
  .set-main.off { display: none; }
  .sp-head { display: flex; align-items: center; gap: 6px; margin: 0 0 14px; }
  .sp-back { display: inline-flex; align-items: center; gap: 2px; padding: 8px 12px 8px 6px; border: 0; background: none; color: var(--accent-press); font: 600 13px var(--font-sans); cursor: pointer; }
  .sp-back svg { width: 18px; height: 18px; }
  .set-main h2 { font-size: 20px; }
}

/* ============================================================
   SISTEMA VISIVO v10 (passo 4.3, 17/09/2026)
   I componenti delle tavole `DEMO LAMBDA v10/` (funzioni di
   `_base_telefono_v9.py` e `_genera_v10.py`: kpi, panel, table, gapbar,
   statrow, nodata, formrow, toggle, heat, book) come classi che usano
   SOLO le variabili qui sopra: i due temi funzionano da soli (R-UI5).
   Misure prese dalle tavole; colori sempre dai token (R-UI1).
   ============================================================ */
.kick { font: 500 10px var(--font-mono); letter-spacing: .8px; text-transform: uppercase; color: var(--muted); }
.disp { font-family: var(--font-display); }

/* titolo di blocco: nome + nota + azione a destra (h2 desktop, section telefono) */
.h2 { display: flex; align-items: baseline; gap: 10px; margin-bottom: 12px; min-width: 0; }
.h2 > .h2-t { font: 600 15px var(--font-display); white-space: nowrap; }
.h2 > .h2-s { font-size: 12px; color: var(--muted); flex: 1; min-width: 0; }
.h2 > .h2-t:last-child { margin-right: auto; }
.sect { display: flex; align-items: baseline; gap: 8px; margin: 22px 2px 9px; min-width: 0; }
.sect > .h2-t { font: 600 14.5px var(--font-display); white-space: nowrap; }
.sect > .h2-s { font-size: 11.5px; color: var(--muted); flex: 1; min-width: 0; }

/* riquadro: panel (desktop 18/20) e card compatta (telefono 15/16) */
.panel {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-card);
  padding: 18px 20px; min-width: 0; box-shadow: var(--shadow-1);
}
.panel.tight { padding: 15px 16px; }
.panel.flush { padding: 0; overflow: hidden; }
.panel.hi { border-color: var(--ring); border-radius: var(--r-hero); }

/* cifra con etichetta (Oggi, Laboratorio) */
.kpi {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-card);
  padding: 15px 17px; min-width: 0; box-shadow: var(--shadow-1);
}
.kpi-v {
  font: 600 25px var(--font-mono); font-variant-numeric: tabular-nums; letter-spacing: -.8px;
  margin-top: 8px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.kpi-s { font: 400 11px var(--font-mono); color: var(--dim); margin-top: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kpi-x { margin-top: 12px; }
.kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 1079.98px) { .kpis { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); } }

/* barra di avanzamento sottile */
.bar { height: 5px; border-radius: 5px; background: var(--sunken); overflow: hidden; }
.bar > i { display: block; height: 100%; width: 0; background: var(--muted); }
.bar.good > i { background: var(--good); } .bar.gold > i { background: var(--accent); }
.bar.warn > i { background: var(--warn); } .bar.plum > i { background: var(--plum); }

/* griglia di cifre a 1 px: variante compatta delle tavole */
.cells {
  display: grid; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); gap: 1px;
  background: var(--line); border: 1px solid var(--line); border-radius: var(--r-tile); overflow: hidden;
}
.cells > div { background: var(--card); padding: 11px 11px 10px; min-width: 0; }
.cells.inset > div { background: var(--inset); }
.cells .kick { font-size: 9px; white-space: nowrap; }
.cells .c-v { font: 600 15.5px var(--font-mono); font-variant-numeric: tabular-nums; margin-top: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cells .c-s { font: 400 10.5px var(--font-mono); color: var(--dim); margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* tabella a griglia: le colonne le dichiara chi la usa (--cols) */
.tbl { display: grid; grid-template-columns: var(--cols); column-gap: 12px; min-width: 0; }
.tbl > .tr { display: contents; }
.tbl > .tr > * {
  padding: 11px 0; border-top: 1px solid var(--line-soft); min-width: 0; align-self: stretch;
  display: flex; align-items: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  font: 500 13px var(--font-mono); font-variant-numeric: tabular-nums;
}
.tbl > .th > * { padding: 0 0 9px; border-top: 0; font: 500 10px var(--font-mono); letter-spacing: .8px; text-transform: uppercase; color: var(--muted); }
.tbl.dense > .tr:not(.th) > * { padding: 8px 0; }
.tbl .r { justify-content: flex-end; text-align: right; }
.tbl .sans { font-family: var(--font-sans); }
.tbl .team { font: 600 13.5px var(--font-sans); }
.tbl > .tr.go { cursor: pointer; }
.tbl > .tr.go:hover > * { background: var(--accent-wash-3); }

/* lista a righe dentro un riquadro: tocco minimo 44 px (R-UI7) */
.lcard { border: 1px solid var(--line); border-radius: var(--r-card); background: var(--card); overflow: hidden; }
.lrow {
  display: flex; align-items: center; gap: 11px; padding: 12px 15px; min-height: 44px;
  border-bottom: 1px solid var(--line-soft); width: 100%; text-align: left;
  background: none; border-left: 0; border-right: 0; border-top: 0; color: var(--ink); font: inherit;
}
.lrow:last-child { border-bottom: 0; }
.lcard.dense .lrow { padding: 9px 13px; }
button.lrow { cursor: pointer; transition: background var(--t-fast); }
button.lrow:hover { background: var(--accent-wash-3); }
.lrow .kv-k { font-size: 12.5px; color: var(--muted); width: 104px; flex-shrink: 0; }
.lrow .kv-v { font: 400 13px var(--font-mono); flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lrow .kv-s { font: 400 11px var(--font-mono); color: var(--dim); white-space: nowrap; }
.lrow .chev { width: 15px; height: 15px; color: var(--muted); flex-shrink: 0; }
.dot7 { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); flex-shrink: 0; }
.dot7.good { background: var(--good); } .dot7.warn { background: var(--warn); }
.dot7.plum { background: var(--plum); } .dot7.gold { background: var(--accent); }

/* modello contro mercato: la parte comune grigia, lo scarto in oro */
.gapbar-h { display: flex; justify-content: space-between; margin-bottom: 6px; gap: 8px; }
.gapbar-h .num { font: 400 11px var(--font-mono); color: var(--muted); }
.gapbar { height: 9px; border-radius: 5px; background: var(--sunken); position: relative; overflow: hidden; }
.gapbar > .g-base { position: absolute; left: 0; top: 0; bottom: 0; background: var(--track); }
.gapbar > .g-gap { position: absolute; top: 0; bottom: 0; background: var(--accent); }
.gapbar-f { display: flex; justify-content: space-between; margin-top: 6px; font: 400 10.5px var(--font-mono); color: var(--dim); }
.gapbar-f .g-lab { color: var(--accent); }

/* statistica a due lati (casa · ospite) */
.statrow { padding: 7px 0; }
.statrow .s-top { display: flex; align-items: baseline; }
.statrow .s-h, .statrow .s-a { width: 44px; font: 400 13px var(--font-mono); font-variant-numeric: tabular-nums; color: var(--ink-soft); }
.statrow .s-a { text-align: right; }
.statrow .s-h.lead, .statrow .s-a.lead { font-weight: 600; color: var(--ink); }
.statrow .s-l { flex: 1; text-align: center; font-size: 12px; color: var(--muted); }
.statrow .s-bars { display: flex; gap: 4px; margin-top: 5px; }
.statrow .s-bars > span { flex: 1; height: 4px; border-radius: 2px; background: var(--sunken); overflow: hidden; display: flex; }
.statrow .s-bars > span:first-child { justify-content: flex-end; }
.statrow .s-bars i { display: block; height: 100%; background: var(--dim); }
.statrow .s-bars i.lead { background: var(--ink-soft); }

/* contributo di una variabile (barra divergente dal centro) */
.contrib { display: flex; align-items: center; gap: 10px; }
.contrib .c-n { font-size: 12px; color: var(--ink-soft); width: 150px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.contrib .c-b { flex: 1; height: 8px; position: relative; }
.contrib .c-b::before { content: ""; position: absolute; left: 50%; top: -3px; bottom: -3px; width: 1px; background: var(--line); }
.contrib .c-b > i { position: absolute; top: 0; bottom: 0; border-radius: 2px; background: var(--ink-soft); }
.contrib .c-b > i.up { background: var(--dim); }
.contrib .c-v { font: 400 11.5px var(--font-mono); color: var(--muted); width: 44px; text-align: right; }

/* stato unico «campione ancora insufficiente» (R-UI2) */
.nodata { display: flex; align-items: center; gap: 12px; padding: 11px 14px; border: 1px dashed var(--line); border-radius: var(--r-tile); }
.nodata .nd-t { font-size: 12px; color: var(--ink-soft); }
.nodata .nd-bar { height: 4px; border-radius: 2px; background: var(--sunken); margin-top: 7px; overflow: hidden; }
.nodata .nd-bar > i { display: block; height: 100%; background: var(--plum); }
.nodata .nd-n { font: 400 12px var(--font-mono); color: var(--muted); text-align: right; white-space: nowrap; }
.nodata .nd-n small { display: block; font-size: 10px; color: var(--dim); }

/* regola superata / non superata */
.rulechip {
  display: inline-flex; align-items: center; gap: 5px; padding: 5px 9px; border-radius: 8px;
  background: var(--sunken); border: 1px solid var(--line);
  font: 500 11px var(--font-mono); color: var(--ink-soft); white-space: nowrap;
}
.rulechip svg { width: 11px; height: 11px; stroke: var(--good); stroke-width: 3.2; }
.rulechip.ko svg { stroke: var(--warn); }
.rulechips { display: flex; gap: 6px; flex-wrap: wrap; }

/* passo numerato del ragionamento */
.steps { display: flex; flex-direction: column; gap: 13px; }
.step { display: flex; gap: 11px; }
.step > .st-n {
  width: 20px; height: 20px; border-radius: 6px; background: var(--sunken); border: 1px solid var(--line);
  color: var(--ink-soft); font: 400 10.5px var(--font-mono); display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.step .st-t { font-size: 13px; font-weight: 500; }
.step .st-d { font: 400 11.5px var(--font-mono); color: var(--muted); margin-top: 3px; line-height: 1.5; }

/* forma: V · P · S in quadratini */
.formbox { display: inline-flex; gap: 3px; }
.formbox > span {
  width: 20px; height: 20px; border-radius: 5px; font: 400 10.5px var(--font-mono);
  display: flex; align-items: center; justify-content: center; color: var(--muted); background: var(--sunken);
}
.formbox > .v { color: var(--good); background: var(--good-wash); }
.formbox > .s { color: var(--warn); background: var(--warn-wash); }

/* livello del libro: quota · profondita' · euro · EV */
.book-lvl { display: flex; align-items: center; gap: 9px; }
.book-lvl .b-q { font: 400 12.5px var(--font-mono); width: 34px; color: var(--ink); }
.book-lvl:nth-child(2) .b-q { color: var(--ink-soft); }
.book-lvl:nth-child(n+3) .b-q { color: var(--dim); }
.book-lvl .b-bar { flex: 1; height: 7px; background: var(--sunken); border-radius: 4px; overflow: hidden; }
.book-lvl .b-bar > i { display: block; height: 100%; background: var(--accent); opacity: .55; }
.book-lvl:nth-child(2) .b-bar > i { opacity: .32; }
.book-lvl:nth-child(n+3) .b-bar > i { opacity: .18; }
.book-lvl .b-e { font: 400 11.5px var(--font-mono); color: var(--muted); width: 50px; text-align: right; }
.book-lvl .b-ev { font: 400 11.5px var(--font-mono); color: var(--accent); width: 54px; text-align: right; }
.book { display: flex; flex-direction: column; gap: 6px; }

/* interruttore delle tavole (44×26): un vero <button role="switch"> */
.toggle {
  width: 44px; height: 26px; border-radius: var(--r-pill); border: 0; padding: 0; flex-shrink: 0;
  background: var(--track); position: relative; cursor: pointer;
  transition: background var(--t-fast);
}
.toggle::after {
  content: ""; position: absolute; left: 3px; top: 3px; width: 20px; height: 20px; border-radius: 50%;
  background: var(--muted); transition: transform var(--t-med) var(--ease), background var(--t-fast);
}
.toggle[aria-checked="true"] { background: var(--accent); }
.toggle[aria-checked="true"]::after { transform: translateX(18px); background: var(--on-accent); }
.toggle:disabled { opacity: .5; cursor: default; }

/* mappa del vantaggio: intensita' in --a (0..1) dal dato, colore dal segno */
.heat { display: grid; grid-template-columns: 56px repeat(var(--n, 4), minmax(0, 1fr)); gap: 6px; }
.heat > .kick { text-align: center; align-self: end; }
.heat > .h-row { font: 400 12px var(--font-mono); color: var(--ink-soft); align-self: center; }
.heat-cell {
  border-radius: 10px; padding: 10px; min-height: 58px; min-width: 0;
  background: color-mix(in srgb, var(--good) calc(var(--a, .1) * 100%), transparent);
}
.heat-cell.neg { background: color-mix(in srgb, var(--warn) calc(var(--a, .1) * 100%), transparent); }
.heat-cell .h-v { font: 600 15px var(--font-mono); color: var(--good); }
.heat-cell.neg .h-v { color: var(--warn); }
.heat-cell .h-n { font: 400 10.5px var(--font-mono); color: var(--muted); margin-top: 3px; }
.heat-cell.empty { background: none; border: 1px dashed var(--line); }
.heat-cell.empty .h-v, .heat-cell.empty .h-n { font-size: 11px; font-weight: 400; color: var(--dim); }

/* distribuzione a colonne (gol del 2° tempo) */
.dist { display: flex; gap: 10px; align-items: flex-end; }
.dist > div { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 5px; }
.dist .d-p { font: 400 11px var(--font-mono); color: var(--ink); }
.dist .d-col { width: 100%; height: 64px; display: flex; align-items: flex-end; }
.dist .d-col > i { display: block; width: 100%; border-radius: 5px 5px 2px 2px; background: var(--good-line); }
.dist .d-lab { font: 400 11px var(--font-mono); color: var(--muted); }
.dist > .out .d-p { color: var(--warn); }
.dist > .out .d-col > i { background: var(--warn-line); }

/* bottoni delle tavole: primario oro, secondario a filo (40 px, 44 al tocco) */
.btn-v10 {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 18px;
  border-radius: var(--r-btn); border: 0; background: var(--accent); color: var(--on-accent);
  font: 700 13.5px var(--font-display); white-space: nowrap; cursor: pointer;
}
.btn-v10.line { background: none; border: 1px solid var(--line); color: var(--ink-soft); font: 400 13px var(--font-sans); padding: 0 16px; }
@media (pointer: coarse) { .btn-v10 { height: 44px; } }

/* striscia delle schede della Partita (telefono): scorre di lato (R-UI6) */
.mtabs { display: flex; gap: 2px; padding: 0 12px; border-bottom: 1px solid var(--line-soft); overflow-x: auto; scrollbar-width: none; }
.mtabs::-webkit-scrollbar { display: none; }
.mtab {
  flex: 0 0 auto; padding: 12px 11px 10px; min-height: 44px; border: 0; background: none; cursor: pointer;
  color: var(--muted); font: 500 12.5px var(--font-display); border-bottom: 2px solid transparent; white-space: nowrap;
}
.mtab[aria-selected="true"] { color: var(--ink); font-weight: 600; border-bottom-color: var(--accent); }
/* viste della Partita (desktop): pillole */
.dtabs { display: flex; gap: 4px; flex-wrap: wrap; }
.dtab {
  padding: 9px 14px; border-radius: 10px; border: 0; background: none; cursor: pointer; white-space: nowrap;
  font: 500 13px var(--font-display); color: var(--muted);
}
.dtab[aria-selected="true"] { background: var(--accent-wash); color: var(--accent-press); font-weight: 600; }

/* ---- impaginazione: guscio con barra laterale e tre colonne ---- */
/* la barra laterale e' fissa a sinistra; il contenuto le lascia 236 px
   (passo 4.4): testata e barra orizzontale delle sezioni spariscono */
.side { display: none; }
@media (min-width: 1080px) {
  .side {
    position: fixed; left: 0; top: 0; bottom: 0; z-index: 31;
    width: 236px; background: var(--nav); border-right: 1px solid var(--line-soft);
    padding: 20px 14px; box-sizing: border-box; display: flex; flex-direction: column; overflow-y: auto;
  }
  body.has-side { padding-left: 236px; }
  body.has-side .topbar, body.has-side > .tabs { display: none; }
  body.has-side .side .mode-seg { margin: 0; }
  body.has-side .side-out .icon-btn, #side-out .icon-btn { margin-left: auto; }
}
/* telefono: la testata (marchio + Prova/Reale) vive solo su Oggi, come
   `TelMain`; stato, tema e uscita stanno in Impostazioni */
@media (max-width: 719.98px) {
  body.has-side .topbar .topnav, body.has-side .topbar .watcher-pill { display: none; }
  body.has-side .topbar .mode-seg { margin: 0 0 0 auto; }
  body.has-side[data-tab]:not([data-tab="dashboard"]) .topbar { display: none; }
  /* cinque tab come le tavole: Impostazioni torna in barra (prima era nella testata) */
  body.has-side .bottom-chrome .tab[data-tab="impostazioni"] { display: flex; margin-left: 0; padding-right: 0; }
  body.has-side .bottom-chrome .tab.active { color: var(--accent-press); }
}
.set-exit {
  display: block; text-align: center; padding: 14px; margin-top: 8px; min-height: 44px;
  color: var(--muted); font-size: 13.5px;
}
.set-exit:hover { color: var(--ink); }
@media (min-width: 720px) { .set-exit { display: none; } }
.side-brand { display: flex; align-items: center; gap: 10px; padding: 0 10px 24px; }
.side-brand .brand-mark { width: 30px; height: 30px; }
.side-brand .brand-txt { font-size: 17px; }
.side-mode { padding: 0 4px 16px; }
.side-nav { display: flex; flex-direction: column; gap: 2px; }
.side-link {
  display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; min-height: 44px;
  border: 0; background: none; color: var(--muted); cursor: pointer; text-align: left; width: 100%;
  font: 500 14px var(--font-display); transition: background var(--t-fast), color var(--t-fast);
}
.side-link svg { width: 18px; height: 18px; }
.side-link:hover { color: var(--ink); background: var(--accent-wash-3); }
.side-link.active { background: var(--accent-wash); color: var(--accent-press); font-weight: 600; }
.side-link .nav-badge { margin-left: auto; }
.side-fill { flex: 1; }
.side-status { border: 1px solid var(--line); border-radius: var(--r-tile); padding: 12px 13px; background: var(--card); }
.side-status .ss-t { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 500; }
.side-status .ss-d { font: 400 11px var(--font-mono); color: var(--muted); margin-top: 6px; line-height: 1.6; }
.side-user { display: flex; align-items: center; gap: 10px; padding: 14px 6px 0; }
.side-user .su-av {
  width: 30px; height: 30px; border-radius: 50%; background: var(--card-2); border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center; font: 600 11.5px var(--font-display); color: var(--ink-soft);
}
.side-user .su-n { font-size: 12.5px; }
.side-user .su-s { font: 400 10.5px var(--font-mono); color: var(--dim); }

/* testata di pagina v10: domanda in kicker, titolo, risposta, azioni */
.phead { display: flex; align-items: flex-end; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; }
.phead .ph-main { flex: 1; min-width: 0; }
.phead .ph-t { font: 600 28px var(--font-display); letter-spacing: -.7px; margin-top: 6px; }
.phead .ph-a { font-size: 13px; color: var(--muted); margin-top: 4px; }
.phead .ph-act { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
@media (max-width: 719.98px) {
  .phead { padding: 2px 0 0; margin-bottom: 14px; }
  .phead .ph-t { font-size: 24px; letter-spacing: -.6px; margin-top: 8px; }
  .phead .ph-a { font-size: 12.5px; line-height: 1.4; }
}

.cols-3 { display: grid; grid-template-columns: 340px minmax(0, 1fr) 340px; gap: 16px; align-items: start; }
.cols-wide { display: grid; grid-template-columns: minmax(0, 2.1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.stack { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
@media (max-width: 1079.98px) {
  .cols-3, .cols-wide { grid-template-columns: minmax(0, 1fr); }
}

/* ============================================================
   PARTITA v10 (passo 4.5): una schermata, schede che crescono
   Telefono: una scheda alla volta (.mtabs). Desktop: viste (.dtabs),
   «Analisi al 45'» = Decisione | Primo tempo | Mercato su tre colonne.
   ============================================================ */
.pt-head { padding: 4px 2px 12px; }
.pt-top { display: flex; align-items: center; gap: 12px; }
.pt-top .kick { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pt-score { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: center; padding: 10px 0 4px; }
.pt-team { font-size: 16px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pt-team.r { text-align: right; }
.pt-res { font: 600 28px var(--font-mono); text-align: center; letter-spacing: -1px; white-space: nowrap; }
.pt-sub { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); font: 400 11px var(--font-mono); color: var(--dim); }
.pt-sub .c { text-align: center; } .pt-sub .r { text-align: right; }
.pt .mtabs { margin: 0 -12px; }
.pt .dtabs { margin: 4px 0 14px; }
.pt-desk { display: none; }
.pt-q { margin: 14px 0 10px; }
.pt-sec { display: none; min-width: 0; }
.pt-sec > .sect:first-of-type { margin-top: 0; }
.pt[data-show="decisione"] .pt-sec[data-v="decisione"],
.pt[data-show="primo"] .pt-sec[data-v="primo"],
.pt[data-show="squadre"] .pt-sec[data-v="squadre"],
.pt[data-show="mercato"] .pt-sec[data-v="mercato"],
.pt[data-show="dopo"] .pt-sec[data-v="dopo"] { display: block; }
.pt-bet-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.pt-bet-top .r { text-align: right; }
.pt-bet-n { font-size: 23px; font-weight: 600; letter-spacing: -.5px; margin-top: 5px; }
.pt-ev { font: 600 27px var(--font-mono); color: var(--accent); letter-spacing: -.8px; margin-top: 4px; line-height: 1; white-space: nowrap; }
.pt-mono { font: 400 11.5px var(--font-mono); color: var(--muted); margin-top: 4px; }
.pt-mono.dim { color: var(--dim); width: 20px; }
.pt-note-row { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.pt-note-row .pt-mono { margin: 0; }
.pt-formula { font: 400 12px var(--font-mono); color: var(--ink-soft); line-height: 1.9; }
.pt-formula .gold { color: var(--accent); }
.pt-foot { font: 400 10.5px var(--font-mono); color: var(--dim); margin-top: 10px; line-height: 1.5; }
.pt-teams { display: flex; justify-content: space-between; padding-bottom: 5px; border-bottom: 1px solid var(--line-soft); font-size: 12.5px; font-weight: 600; }
.pt-lu { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.pt-lu-h { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 6px; font-size: 14px; font-weight: 600; }
.pt-lu-h .pt-mono { margin: 0; }
.pt-lu-r { display: flex; gap: 8px; padding: 5px 0; border-top: 1px solid var(--line-soft); font-size: 12.5px; min-width: 0; }
.pt-lu-r > span:nth-child(2) { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pt-lu-r .pt-mono { margin: 0; }
.pt-card { width: 10px; height: 14px; border-radius: 2px; background: var(--accent); flex-shrink: 0; }
.pt-card.red { background: var(--warn); }
@media (min-width: 1080px) {
  .pt-tel { display: none; }
  .pt-desk { display: flex; }
  .pt-head { padding: 16px 20px; background: var(--card); border: 1px solid var(--line); border-radius: var(--r-card); margin-bottom: 14px; }
  .pt-team { font-size: 24px; }
  /* v3 4.7b (R-UI12): «Analisi al 45'» in fasce fisse, principale a sinistra
     e secondario a destra: decisione e perché → partita → mercato → dettaglio */
  .pt[data-show="analisi"] .pt-body { display: grid; grid-template-columns: minmax(0, 1fr) 360px; column-gap: 20px; row-gap: 14px; align-items: start; }
  .pt[data-show="analisi"] .pt-sec[data-v="decisione"],
  .pt[data-show="analisi"] .pt-sec[data-v="primo"],
  .pt[data-show="analisi"] .pt-sec[data-v="mercato"] { display: contents; }
  .pt[data-show="analisi"] .pt-q { grid-column: 1 / -1; margin: 18px 0 -2px; padding-top: 16px; border-top: 1px solid var(--line-soft); }
  .pt[data-show="analisi"] .pt-q[data-q="decisione"] { margin-top: 0; padding-top: 0; border-top: 0; }
  .pt[data-show="analisi"] .pt-g > .sect:first-child { margin-top: 0; }
  .pt[data-show="analisi"] .pt-g { grid-column: 1; min-width: 0; }
  .pt[data-show="analisi"] .pt-g[data-g="perche"], .pt[data-show="analisi"] .pt-g[data-g="gol"],
  .pt[data-show="analisi"] .pt-g[data-g="prezzo"], .pt[data-show="analisi"] .pt-g[data-g="clv"],
  .pt[data-show="analisi"] .pt-g[data-g="calcolo"] { grid-column: 2; }
  .pt[data-show="analisi"] .pt-g[data-g="quote"] { grid-row: span 2; }
  .pt[data-show="analisi"] .pt-q[data-q="decisione"] { order: 1; }
  .pt[data-show="analisi"] .pt-g[data-g="giocate"] { order: 2; display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; }
  .pt[data-show="analisi"] .pt-g[data-g="giocate"] .pt-bet { margin: 0; }
  .pt[data-show="analisi"] .pt-g[data-g="perche"] { order: 3; }
  .pt[data-show="analisi"] .pt-q[data-q="primo"] { order: 4; }
  .pt[data-show="analisi"] .pt-g[data-g="stat"] { order: 5; }
  .pt[data-show="analisi"] .pt-g[data-g="gol"] { order: 6; }
  .pt[data-show="analisi"] .pt-q[data-q="mercato"] { order: 7; }
  .pt[data-show="analisi"] .pt-g[data-g="quote"] { order: 8; }
  .pt[data-show="analisi"] .pt-g[data-g="prezzo"] { order: 9; }
  .pt[data-show="analisi"] .pt-g[data-g="clv"] { order: 10; }
  .pt[data-show="analisi"] .pt-dett { display: block; order: 11; }
  .pt[data-show="analisi"] .pt-g[data-g="pesato"] { order: 12; }
  .pt[data-show="analisi"] .pt-g[data-g="calcolo"] { order: 13; }
  .pt[data-show="analisi"] .pt-g[data-g="calcolo"] .sub-details { margin-top: 0; border-top: 0; padding-top: 0; }
  /* le quote sono già a vista: il rimando alle scartate serve solo al telefono */
  .pt[data-show="analisi"] .pt-g[data-g="scartate"] { display: none; }
}
.pt-dett { display: none; }
.pt-bet + .pt-bet { margin-top: 12px; }
.pt-g[data-g="scartate"] { margin-top: 18px; }
/* desktop: la Partita occupa lo spazio della pagina accanto alla barra
   laterale (tavole Desk*), non una finestrella al centro */
@media (min-width: 1080px) {
  .match-detail:has(.pt) {
    top: 20px; bottom: 20px; left: calc(236px + 20px); right: 20px; width: auto; max-height: none;
    transform: translateY(14px); 
  }
  .match-detail:has(.pt).open { transform: none; }
  .match-detail:has(.pt) .md-body { padding: 20px 24px 28px; }
}

/* ============================================================
   OGGI v10 (passo 4.5): tavole `Main` (desktop) e `TelMain`
   ============================================================ */
.og-tel { display: block; }
.og-desk, .phead .og-desk-flex { display: none; }
.og-cols { margin-top: 0; }
.og-side { display: none; }
.og-hero { padding: 16px; }
.og-hero-top { display: flex; justify-content: space-between; gap: 12px; }
.og-hero-top .r { text-align: right; }
.og-cap { font: 600 34px var(--font-mono); letter-spacing: -1.2px; margin-top: 6px; white-space: nowrap; }
.og-cap .dh-cents { color: var(--muted); }
.og-eur { font-size: 20px; color: var(--muted); }
.og-t { font-size: 13.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.og-t.num { font-family: var(--font-mono); }
.og-s { font: 400 11px var(--font-mono); color: var(--muted); margin-top: 3px; line-height: 1.5; }
.og-live { align-items: stretch; gap: 12px; }
.og-live .og-bar { width: 3px; border-radius: 2px; background: var(--plum); flex-shrink: 0; }
.og-live .r { text-align: right; align-self: center; }
.og-empty { padding: 14px 16px; border: 1px dashed var(--line); border-radius: var(--r-tile); font-size: 12.5px; color: var(--muted); }
.og-empty .linkish { border: 0; background: none; padding: 0; color: var(--accent-press); font: 600 12.5px var(--font-sans); cursor: pointer; }
.og-bf { font: 500 11px var(--font-mono); color: var(--accent-press); white-space: nowrap; }
.og-glossa { font-size: 11.5px; color: var(--dim); margin: 22px 2px 0; line-height: 1.5; }
.og-search {
  display: inline-flex; align-items: center; gap: 9px; width: 280px; height: 40px; padding: 0 13px;
  border: 1px solid var(--line); border-radius: var(--r-input); background: var(--input-bg);
  color: var(--dim); font: 400 13px var(--font-sans); cursor: pointer; text-align: left;
}
.og-search svg { width: 15px; height: 15px; color: var(--muted); }
#tab-dashboard .sect:first-child { margin-top: 22px; }
@media (min-width: 1080px) {
  .og-tel { display: none; }
  .og-desk { display: block; }
  .phead .og-desk-flex { display: flex; }
  .kpis.og-desk { display: grid; }
  .og-side { display: flex; }
  .og-cols { margin-top: 16px; }
  #tab-dashboard .panel.og-desk + .panel, #oggi-live .panel { margin: 0; }
}
@media (min-width: 1080px) { body.has-side main.container { max-width: 1320px; padding: 24px 28px 32px; margin: 0; } }

/* ============================================================
   DESKTOP largo (>= 1400px): la Panoramica respira di piu'
   ============================================================ */
@media (min-width: 1400px) {
  .container { max-width: 1240px; }
}

/* ============================================================
   Accessibilita': meno movimento per chi lo chiede
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important; animation-delay: 0s !important;
    animation-iteration-count: 1 !important; transition-duration: .01ms !important;
  }
  html { scroll-behavior: auto; }
  .tabs .tab-glider { transition-duration: .32s !important; }
  .ch-draw { stroke-dashoffset: 0; }
  .ch-area { opacity: 1; }
}
@media (pointer: coarse) {
  .btn-ghost.sm, .chip, .hf-chip, .liq-chip { min-height: 36px; }
  .icon-btn { width: 36px; height: 36px; }
  .rb-row, .mkd-row { padding-top: 12px; padding-bottom: 12px; }
}

/* nell'hero la curva parla da sola: niente cifre sull'asse */
.dh-chart .eq-lab { display: none; }

/* ===== v3 4.5 · Risultati (72-risultati.js) — solo variabili --* ===== */
.ris .ris-big { font: 600 40px var(--font-display); letter-spacing: -1px; margin: 6px 0 2px; font-variant-numeric: tabular-nums; }
.ris .ris-big.pos { color: var(--good); } .ris .ris-big.neg { color: var(--warn); }
.ris .ris-lett { font-size: 13px; color: var(--ink-soft); margin-top: 10px; line-height: 1.45; }
.ris .kpi-s { white-space: normal; }
.ris .ris-note { font-size: 12px; color: var(--muted); line-height: 1.45; }
.ris .ris-ic { position: relative; height: 10px; margin-top: 14px; background: var(--sunken); border-radius: 5px; }
.ris .ris-ic-r { position: absolute; top: 0; bottom: 0; background: var(--good-wash); border: 1px solid var(--good-line); border-radius: 5px; }
.ris .ris-ic-z { position: absolute; top: -3px; bottom: -3px; width: 1px; background: var(--muted); }
.ris .ris-ic-p { position: absolute; top: -2px; width: 3px; height: 14px; margin-left: -1px; border-radius: 2px; background: var(--ink); }
.ris .ris-ic-l { display: flex; justify-content: space-between; font: 400 10px var(--font-mono); color: var(--dim); margin-top: 4px; }
.ris .ris-curve { display: block; width: 100%; height: 150px; margin-top: 16px; }
.ris .ris-curve path { fill: none; vector-effect: non-scaling-stroke; }
.ris .ris-curve .ris-live { stroke: var(--good); stroke-width: 2; }
.ris .ris-curve .ris-bt { stroke: var(--accent); stroke-width: 1.5; stroke-dasharray: 5 4; }
.ris .ris-curve .ris-zero { stroke: var(--line); stroke-width: 1; }
.ris .ris-leg { display: flex; flex-wrap: wrap; gap: 4px 16px; font: 400 11px var(--font-mono); margin-top: 6px; }
.ris .ris-leg-live { color: var(--good); } .ris .ris-leg-bt { color: var(--accent); }
.ris .ris-tappe { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ris .ris-tappa { display: flex; align-items: baseline; gap: 8px; margin: 6px 0 8px; }
.ris .ris-tappa b { font: 600 18px var(--font-mono); font-variant-numeric: tabular-nums; }
.ris .ris-formula { font-family: var(--font-mono); margin-top: 4px; }
.ris .ris-cal { display: block; width: 100%; max-width: 260px; margin: 8px auto 0; }
.ris .ris-cal .ris-diag { stroke: var(--line); stroke-dasharray: 3 3; fill: none; }
.ris .ris-cal .ris-dot { fill: var(--accent); fill-opacity: .85; }
.ris .ris-cal .ris-ax { font: 400 8px var(--font-mono); fill: var(--dim); }
@media (max-width: 719.98px) { .ris .ris-tappe { grid-template-columns: 1fr; gap: 8px; } .ris .ris-big { font-size: 34px; } }

/* ===== v3 4.5 · Laboratorio (74-laboratorio.js) — solo variabili --* ===== */
.lab .kpi-s { white-space: normal; }
.lab .lab-nome { font-size: 13px; color: var(--ink); line-height: 1.35; }
.lab .lab-clamp { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.lab .lab-data { min-width: 52px; font-family: var(--font-mono); }
.lab .lab-kpis .kpi-v { font-size: 22px; }
.lab .lab-g { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 9px 0; border-top: 1px solid var(--line-soft); }
.lab .lab-g:first-of-type { border-top: 0; }
.lab .lab-r { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 10px; align-items: center; padding: 9px 0; border-top: 1px solid var(--line-soft); }
.lab .lab-r:first-child { border-top: 0; }
.lab .lab-g.lab-app { grid-template-columns: 150px minmax(0, 1fr); }
.lab .lab-g-t { min-width: 0; }

/* ===== ACCESSO v10 ===== (login.html, register.html — tavole TelAccesso*; solo variabili --*) */
body:has(.auth-v10) .topbar .brand { visibility: hidden; }
.auth-card.auth-v10 {
  max-width: 390px; margin: 0 auto; padding: 56px 24px 40px;
  background: transparent; border: 0; border-radius: 0; box-shadow: none;
}
.auth-v10 .av-mark {
  width: 50px; height: 50px; border-radius: var(--r-tile);
  background: var(--accent); color: var(--on-accent);
  display: flex; align-items: center; justify-content: center;
  font: 700 27px var(--font-display);
}
.auth-v10 h1.av-name {
  font: 600 30px var(--font-display); letter-spacing: -1px;
  margin: 20px 0 0; color: var(--ink);
}
.auth-v10 > p.av-lead { margin: 8px 0 0; font-size: 14px; line-height: 1.5; color: var(--ink-soft); }
.auth-v10 .alert { margin-top: 20px; }
.auth-v10 form { gap: 12px; margin-top: 30px; }
.auth-v10 label { font: 500 10px var(--font-mono); letter-spacing: .8px; color: var(--muted); }
.auth-v10 label input {
  margin-top: 7px; height: 48px; padding: 0 14px; font-size: 14px;
  border: 1px solid var(--line); border-radius: var(--r-input);
  background: var(--input-bg); color: var(--ink);
}
.auth-v10 label input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--ring); }
.auth-v10 .btn-primary {
  height: 50px; margin-top: 8px; padding: 0; border-radius: var(--r-btn);
  font: 700 15px var(--font-display);
}
.auth-v10 .auth-foot { margin-top: 16px; font-size: 13px; color: var(--muted); }
.auth-v10 .auth-foot a { color: var(--accent); text-decoration: none; }
.auth-v10 .auth-foot a:hover { color: var(--accent-press); }
@media (min-width: 720px) { .auth-card.auth-v10 { padding-top: 10vh; } }

/* ============================================================
   PARTITE v10 (passo 4.5): tavole `DeskPartite` e `TelPartite`
   ============================================================ */
#tab-oggi .pz-cols { margin-top: 0; }
.pz-main { min-width: 0; }
.pz-tools { display: flex; flex-direction: column; gap: 10px; }
.pz-tools .search-box { width: 100%; }
.pz-filters { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.pz-filters .kick { margin-right: 2px; }
.pz-filters .pz-k2 { display: none; }
.pz-count { display: flex; align-items: baseline; gap: 8px; margin: 18px 2px 8px; font: 400 11px var(--font-mono); color: var(--muted); }
.pz-count .h2-t { font: 600 14.5px var(--font-display); color: var(--ink); margin-right: auto; }
#tab-oggi .scan-panel { margin: 0; }
.pz-grid { display: grid !important; align-items: center; column-gap: 10px;
  grid-template-columns: 20px 44px minmax(0, 1fr) 44px 52px; }
.pz-grid .r { text-align: right; justify-self: end; }
.scan-cols.pz-grid > span:nth-child(4), .scan-cols.pz-grid > span:nth-child(6), .scan-cols.pz-grid > span:nth-child(8) { display: none; }
#scan-age:not(:empty)::before { content: "· "; }
#scan-bar-n small { font: inherit; }
@media (max-width: 719.98px) { #scan-bar-n small { display: none; } }
.scan-row.pz-grid > .pz-desk { display: none; }
.scan-row.pz-grid { padding: 12px 14px; gap: 0 10px; }
.scan-row.pz-grid > input { grid-column: 1; }
.pz-comp { font: 400 11.5px var(--font-sans); color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pz-comp.on::before { content: ""; display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: var(--accent); margin: 0 6px 2px 0; vertical-align: middle; }
.pz-comp.pz-tel { display: block; font: 400 10px var(--font-mono); letter-spacing: .6px; text-transform: uppercase; margin-top: 2px; }
.pz-num { font: 500 12px var(--font-mono); color: var(--ink-soft); white-space: nowrap; font-variant-numeric: tabular-nums; }
.pz-st .pill { white-space: nowrap; }
.scan-row.tracked { opacity: 1; }
.scan-row.tracked .scan-teams { color: var(--ink-soft); }
.pz-glossa { margin-top: 12px; }
.pz-side .lg-block { margin-top: 0; }
.pz-lgq { margin-top: 12px; width: 100%; }
.pz-why p { font-size: 12.5px; color: var(--muted); line-height: 1.5; margin: 0; }
#league-chips .chip small { font: 400 10.5px var(--font-mono); color: var(--muted); }
#league-chips .chip small:empty { display: none; }
@media (max-width: 1079.98px) {
  .pz-side { margin-top: 18px; }
  #tab-oggi .scan-cols { display: grid !important; padding: 8px 14px; }
  #tab-oggi .scan-cols > span:nth-child(-n+3) { visibility: hidden; }
}
@media (min-width: 1080px) {
  .pz-main { background: var(--card); border: 1px solid var(--line); border-radius: var(--r-card); padding: 16px 18px; align-self: start; }
  .pz-tools { flex-direction: row; align-items: center; flex-wrap: wrap; }
  .pz-tools .search-box { width: 260px; flex: none; }
  .pz-filters .pz-k2 { display: inline; margin-left: 10px; }
  .pz-tel { display: none !important; }
  .pz-count { justify-content: flex-end; margin: 12px 0 0; }
  #tab-oggi .scan-list { border: 0; border-radius: 0; background: none; }
  #tab-oggi .scan-cols { background: none; padding: 9px 0; }
  .pz-grid { grid-template-columns: 20px 50px minmax(0, 1.5fr) minmax(0, 1fr) 72px 96px 46px 118px; column-gap: 14px; }
  .scan-cols.pz-grid > span:nth-child(4), .scan-cols.pz-grid > span:nth-child(6), .scan-cols.pz-grid > span:nth-child(8) { display: block; }
  .scan-row.pz-grid > .pz-desk { display: block; }
  .scan-row.pz-grid { padding: 11px 0; border-top: 1px solid var(--line-soft); }
  .scan-row.pz-grid:hover, .scan-row.pz-grid.sel { background: none; }
  .scan-row.pz-grid.sel .scan-teams { color: var(--ink); }
  #tab-oggi .scan-bar { position: static; box-shadow: none; border-color: var(--line); background: var(--inset); margin: 12px 0 0; }
  #tab-oggi .scan-bar.hidden { display: none; }
  /* campionati seguiti: una riga per campionato, il puntino fa da interruttore */
  .pz-side #league-chips { flex-direction: column; gap: 0; }
  .pz-side #league-chips .chip { justify-content: flex-start; gap: 10px; border: 0; border-top: 1px solid var(--line-soft); border-radius: 0; background: none; padding: 10px 2px; min-height: 0; width: 100%; }
  .pz-side #league-chips .chip:first-child { border-top: 0; }
  .pz-side #league-chips .chip > span { flex: 1; text-align: left; color: var(--ink); font-weight: 500; }
  .pz-side #league-chips .chip:not(.on) > span { color: var(--muted); }
  .pz-side #league-chips .chip .chip-tick { order: 3; width: 28px; height: 16px; border-radius: 8px; background: var(--track); position: relative; }
  .pz-side #league-chips .chip .chip-tick::after { content: ""; position: absolute; top: 2px; left: 2px; width: 12px; height: 12px; border-radius: 50%; background: var(--card); transition: transform var(--t-fast); }
  .pz-side #league-chips .chip.on .chip-tick { background: var(--accent); }
  .pz-side #league-chips .chip.on .chip-tick::after { transform: translateX(12px); background: var(--on-accent); }
  .pz-side #league-chips .chip.add { justify-content: center; border: 1px dashed var(--line); border-radius: var(--r-pill); margin-top: 8px; padding: 8px; }
  .pz-side #league-chips .chip.add > span { flex: none; }
}

/* ============================================================
   IMPOSTAZIONI v10 (passo 4.5): testata, Come decide
   ============================================================ */
.set-phead { margin-bottom: 16px; }
@media (max-width: 719.98px) {
  #tab-impostazioni:has(#set-main:not(.off)) .set-phead { display: none; }
}
.cd .phead { margin: 4px 0 16px; }
.cd .step { align-items: flex-start; }
.cd .cd-tt { display: flex; align-items: baseline; gap: 10px; }
.cd .cd-tt .st-t { flex: 1; min-width: 0; }
.cd .cd-v { font: 600 12.5px var(--font-mono); font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--ink); }
.cd .cd-inv { flex: 1; min-width: 0; font-size: 12.5px; color: var(--ink-soft); line-height: 1.4; }
.cd .lrow .kv-k { width: 92px; }
/* Salute del sistema v10 (78-salute.js) */
.sa .phead { margin: 4px 0 16px; }
.sa .sa-t { flex: 1; min-width: 0; font-size: 13px; }
.sa .sa-t .kv-s { white-space: normal; margin-top: 2px; }
.sa .sa-disk { display: flex; align-items: baseline; gap: 8px; margin-bottom: 8px; }
.sa .sa-disk b { font: 600 22px var(--font-mono); font-variant-numeric: tabular-nums; }
.sa .sa-note { font: 400 11px var(--font-mono); color: var(--muted); line-height: 1.5; margin-top: 8px; }
.sa .sa-note-i { font: 400 11px var(--font-mono); color: var(--muted); }
.sa .lrow .kv-v { white-space: normal; }
.sa .lrow .kv-k { width: 118px; }

/* ===== STORICO v10 ===== (60-storico.js, tavole DeskStorico e TelStorico; solo variabili) */
.sto-desk { display: none; }
.sto-daygroup {
  padding: 10px 14px 4px; font: 500 10px var(--font-mono); letter-spacing: .6px;
  text-transform: uppercase; color: var(--muted); background: var(--nav);
  border-bottom: 1px solid var(--line-soft);
}
.hc-w-ev, .hc-w-clv { display: none; }
.sto-nobet-desk { display: none; }
.sto-extra { display: none; }
.sto-prom { color: var(--accent); }
@media (min-width: 1080px) {
  .sto-desk { display: block; }
  .sto-daygroup { display: none; }
  .hc-w-ev, .hc-w-clv { display: block; width: 54px; flex: none; text-align: right; font: 400 12.5px var(--font-mono); }
  .sto-nobet-desk { display: inline; }
  .sto-nobet-tel { display: none; }
  .sto-extra { display: block; margin-top: 16px; }
  .grid-1px.c3:has(.sto-desk) { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
/* Conto reale v10 (79-conto.js) */
.co .phead { margin: 4px 0 16px; }
.co .c-v.neg { color: var(--warn); }
.co-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.co-m { border: 1px solid var(--line); border-radius: var(--r-tile); background: var(--card); padding: 12px 13px; min-width: 0; }
.co-m.on { border-color: var(--accent); background: var(--accent-wash-3); }
.co-m-t { font-size: 13.5px; font-weight: 600; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.co-m .kv-s { font: 400 11px var(--font-mono); color: var(--muted); margin-top: 2px; }
.co-m-v { display: flex; justify-content: space-between; align-items: baseline; gap: 6px; margin-top: 10px; font: 400 11.5px var(--font-mono); color: var(--muted); flex-wrap: wrap; }
.co-m-v b { font: 600 14px var(--font-mono); color: var(--ink); font-variant-numeric: tabular-nums; }
.co-warn { margin-top: 12px; padding: 11px 13px; border: 1px solid var(--warn); border-radius: var(--r-tile); background: var(--warn-wash); color: var(--ink-soft); font-size: 12.5px; line-height: 1.5; }
@media (min-width: 1080px) { .co-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 719.98px) { .co .cells { --n: 2 !important; } }
/* Storico v10: testata (Opus) — sul telefono i due bottoni vanno sotto il titolo */
@media (max-width: 719.98px) { .sto-head { align-items: flex-start; } .sto-head .ph-act { width: 100%; } .sto-head .ph-act .btn-ghost { flex: 1; } }
/* Storico v10 (Opus, differenze): quota media su telefono e desktop */
.sto-desk-i { display: none; }
@media (min-width: 1080px) { .sto-desk-i { display: inline; } }
@media (max-width: 1079.98px) { #hist-summary.grid-1px.c3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Partita v10 (17/09, correzioni sul telefono): niente testo tagliato con «…» nella scheda */
#md-body .c-s, #md-body .kv-s.pt-wrap, #md-body .contrib .c-n, #md-body .tbl small { white-space: normal; overflow: visible; text-overflow: clip; }
#md-body .cells .c-v { white-space: normal; }
#md-body .lrow.pt-stack { align-items: flex-start; }
#md-body .pt-stack-v { flex: 1; min-width: 0; font-size: 13px; line-height: 1.4; overflow-wrap: anywhere; }
#md-body .pt-stack-v .kv-s { display: block; white-space: normal; margin-top: 2px; }
#md-body .kv-s.pt-wrap { text-align: right; max-width: 45%; }
#md-body .tbl .sans { min-width: 0; }
#md-body .tbl small { line-height: 1.35; }
#md-body button.lrow .kv-s, #md-body .lcard .kv-s { white-space: normal; }
/* Telefono (17/09): Safari su iPhone non sempre conta il padding in fondo a un
   contenitore che scorre → «Salva» del conto di prova restava sotto la barra.
   Uno spazio vero in fondo alla pagina aperta, alto quanto la barra + margine. */
@media (max-width: 719.98px) {
  main.container { padding-bottom: 14px; }
  main.container > .tabpane.active::after { content: ""; display: block; height: calc(var(--chrome-h, 110px) + 32px); }
}

/* B38 (07/10): previsioni del sistema nuovo nella scheda Partita — un blocco per giocatore (nome, poi cinque
   caselle), che si apre per tutte le soglie; niente tabella a colonne fisse (le scritte si sovrapponevano) */
.pv-lista { padding-top: 4px; padding-bottom: 4px; }
details.pv-g { border-top: 1px solid var(--line-soft); }
details.pv-g:first-child { border-top: 0; }
details.pv-g > summary { list-style: none; cursor: pointer; padding: 10px 0; display: block; }
details.pv-g > summary::-webkit-details-marker { display: none; }
.pv-nome { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.pv-nome b { font-weight: 500; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.pv-nome small { color: var(--muted); font: 400 10.5px var(--font-mono); white-space: nowrap; }
.pv-apri { margin-left: auto; color: var(--dim); transition: transform var(--t-fast, .16s); }
details.pv-g[open] .pv-apri { transform: rotate(90deg); }
.pv-celle { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; margin-top: 7px; }
.pv-c { background: var(--inset); border-radius: 9px; padding: 6px 7px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pv-c .kick { font-size: 9px; letter-spacing: .4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pv-v { font: 600 13px var(--font-mono); white-space: nowrap; }
details.pv-g .pv-tutte { display: grid; grid-template-columns: minmax(0,1fr) 58px 64px 18px; gap: 4px 10px; padding: 2px 2px 12px; font-size: 12.5px; }
details.pv-g .pv-tutte .r { text-align: right; font-family: var(--font-mono); }
.pt[data-show="previsioni"] .pt-sec[data-v="previsioni"],
.pt[data-show="vivo"] .pt-sec[data-v="vivo"] { display: block; }
@media (min-width: 1080px) {
  .pt-sec[data-v="previsioni"], .pt-sec[data-v="vivo"] { display: none; }
  .pt[data-show="vivo"] .pt-sec[data-v="vivo"] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); column-gap: 20px; align-items: start; }
  .pt[data-show="vivo"] .pt-sec[data-v="vivo"] > .pt-q,
  .pt[data-show="vivo"] .pt-sec[data-v="vivo"] > .cells,
  .pt[data-show="vivo"] .pt-sec[data-v="vivo"] > .pt-foot { grid-column: 1 / -1; }
  .pt[data-show="previsioni"] .pt-sec[data-v="previsioni"] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); column-gap: 20px; align-items: start; }
  .pt[data-show="previsioni"] .pt-sec[data-v="previsioni"] > .pt-q,
  .pt[data-show="previsioni"] .pt-sec[data-v="previsioni"] > .cells,
  .pt[data-show="previsioni"] .pt-sec[data-v="previsioni"] > .pt-foot { grid-column: 1 / -1; }
}