
/* ============================================================
   BUYER24 ASTE — brand: dark warm charcoal, accenti blu/verde
   Design system: micro-interazioni 150–300ms, solo transform/
   opacity, numeri tabulari, stati hover/focus espliciti.
   ============================================================ */
:root{
  --bg:#262523; --bg2:#2e2d2a; --bg3:#383632; --bg4:#42403b;
  --line:#45423c; --line2:#565248;
  --ink:#f4f1ea; --ink-dim:#b8b2a6; --ink-faint:#8a857b;
  --blu:#3b7dd8; --blu-chiaro:#6ba3ec; --blu-soft:rgba(59,125,216,.14);
  --verde:#3fae6b; --verde-chiaro:#63cf8e; --verde-soft:rgba(63,174,107,.13);
  --rosso:#d0533f; --rosso-chiaro:#e97a68; --rosso-soft:rgba(208,83,63,.13);
  --giallo:#e0a83d; --giallo-soft:rgba(224,168,61,.15);
  --r-s:8px; --r:12px; --r-l:16px;
  --t-fast:150ms; --t-med:250ms; --ease:cubic-bezier(.22,.61,.36,1);
  --ombra-1:0 1px 2px rgba(0,0,0,.25);
  --ombra-2:0 6px 24px rgba(0,0,0,.30);
  --ombra-3:0 16px 48px rgba(0,0,0,.45);
}
*{box-sizing:border-box; margin:0; padding:0;}
[hidden]{display:none !important;} /* l'attributo hidden vince SEMPRE sul display dei selettori */
/* SCROLL: mai bloccare lo scorrimento verticale del documento — niente height
   fisse né overflow:hidden su html/body; il contenuto spinge la pagina. */
html{
  font-size:16px; scroll-behavior:smooth;
  height:auto; overflow-y:auto;
}
body{
  background:
    radial-gradient(1100px 480px at 18% -12%, rgba(59,125,216,.10), transparent 62%),
    radial-gradient(900px 420px at 96% -8%, rgba(63,174,107,.05), transparent 55%),
    var(--bg);
  color:var(--ink);
  font-family:"Plus Jakarta Sans",-apple-system,"Segoe UI",Roboto,sans-serif;
  line-height:1.5;
  height:auto; min-height:0; overflow:visible;
  overscroll-behavior-y:auto; -webkit-overflow-scrolling:touch;
  -webkit-font-smoothing:antialiased;
}
/* la modalità semplice (default, per il commerciante) nasconde tutto ciò che è tecnico */
body:not(.operatore) .soloOperatore{display:none !important;}
button{font-family:inherit; touch-action:manipulation;}
input,select,textarea{
  font-family:inherit; color:var(--ink); background:var(--bg3);
  border:1px solid var(--line); border-radius:var(--r-s);
  transition:border-color var(--t-fast) var(--ease), background var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
input:hover,select:hover,textarea:hover{border-color:var(--line2);}
input:focus,select:focus,textarea:focus{outline:none; border-color:var(--blu); box-shadow:0 0 0 3px var(--blu-soft);}
:focus-visible{outline:2px solid var(--blu); outline-offset:2px;}
::selection{background:rgba(59,125,216,.35);}

/* ---------- header ---------- */
header{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:12px 22px; border-bottom:1px solid rgba(69,66,60,.7);
  background:rgba(38,37,35,.78);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  position:sticky; top:0; z-index:40;
}
.logo{display:flex; align-items:center; gap:11px;}
.logoMark{
  width:32px; height:32px; border-radius:9px; flex:none;
  background:linear-gradient(135deg,#3b7dd8,#2a5da8);
  display:grid; place-items:center;
  box-shadow:0 2px 10px rgba(59,125,216,.35), inset 0 1px 0 rgba(255,255,255,.22);
}
.logoMark svg{display:block;}
.logoTesto{display:flex; align-items:baseline; gap:9px;}
.logoTesto b{font-size:1.18rem; font-weight:800; letter-spacing:-.02em;}
.logoTesto b span{color:var(--blu-chiaro);}
.logoTesto small{color:var(--ink-faint); font-weight:500; font-size:.78rem;}
header .spacer{flex:1;}

/* il tuo buyer: l'allievo che cresce con te */
.chipBuyer{
  display:inline-flex; align-items:center; gap:8px; cursor:pointer;
  border:1px solid var(--line); background:var(--bg3); border-radius:99px;
  padding:6px 13px 6px 9px; font-size:.78rem; color:var(--ink-dim);
  transition:border-color var(--t-fast) var(--ease), background var(--t-fast) var(--ease), transform var(--t-fast) var(--ease);
}
.chipBuyer:hover{border-color:var(--blu); background:var(--blu-soft); transform:translateY(-1px);}
.chipBuyer:active{transform:translateY(0);}
.chipBuyer:focus-visible{outline:none; border-color:var(--blu); box-shadow:0 0 0 3px var(--blu-soft);}
.chipBuyer i{
  width:9px; height:9px; border-radius:50%; flex:none;
  background:var(--verde-chiaro); box-shadow:0 0 0 3px var(--verde-soft);
}
.chipBuyer b{color:var(--ink); font-weight:700;}

/* come funziona: i 3 passi (visibili finché la lista è vuota) */
#comeFunziona{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:12px;
  margin-top:18px; padding-top:16px; border-top:1px dashed var(--line);
}
.passo{display:flex; gap:12px; align-items:flex-start;}
.passo .pNum{
  width:28px; height:28px; border-radius:50%; flex:none;
  display:grid; place-items:center; font-weight:800; font-size:.85rem;
  background:var(--blu-soft); color:var(--blu-chiaro); border:1px solid rgba(59,125,216,.4);
}
.passo div{display:flex; flex-direction:column; gap:1px;}
.passo b{font-size:.88rem;}
.passo span{font-size:.78rem; color:var(--ink-dim);}

/* ---------- bottoni ---------- */
.btn{
  display:inline-flex; align-items:center; gap:7px;
  border:1px solid var(--line); background:var(--bg3); color:var(--ink);
  padding:8px 14px; border-radius:9px; cursor:pointer; font-weight:600; font-size:.85rem;
  transition:background var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease),
             transform var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
  box-shadow:var(--ombra-1);
}
.btn svg{flex:none; opacity:.75;}
.btn:hover{background:var(--bg4); border-color:var(--line2); transform:translateY(-1px); box-shadow:var(--ombra-2);}
.btn:active{transform:scale(.97);}
.btn.blu{background:linear-gradient(180deg,#4487e2,#3572c6); border-color:transparent; color:#fff;}
.btn.blu svg{opacity:.9;}
.btn.blu:hover{background:linear-gradient(180deg,#4c8fe9,#3b7dd8);}
.btn.ghost{background:transparent; box-shadow:none;}
.btn.ghost:hover{background:var(--bg3);}
.btn:disabled{opacity:.45; cursor:default; transform:none;}
.btn.mini{padding:5px 10px; font-size:.76rem; border-radius:8px;}

main{max-width:1280px; margin:0 auto; padding:22px;}

/* ---------- box incolla ---------- */
#boxIncolla{
  border:1px solid var(--line); border-radius:var(--r-l); padding:22px;
  background:linear-gradient(180deg, rgba(255,255,255,.02), transparent 40%), var(--bg2);
  box-shadow:var(--ombra-1);
  transition:border-color var(--t-med) var(--ease), box-shadow var(--t-med) var(--ease);
}
#boxIncolla:focus-within{border-color:rgba(59,125,216,.55); box-shadow:0 0 0 4px var(--blu-soft), var(--ombra-2);}
#boxIncolla h2{font-size:1.05rem; font-weight:800; letter-spacing:-.01em; margin-bottom:4px;}
#boxIncolla p{color:var(--ink-dim); font-size:.85rem; margin-bottom:12px;}
#boxIncolla kbd{
  font-family:inherit; font-size:.75rem; font-weight:700; color:var(--ink);
  background:var(--bg3); border:1px solid var(--line2); border-bottom-width:2px;
  border-radius:5px; padding:1px 6px;
}
#testoLotti{
  width:100%; min-height:118px; padding:12px 14px; font-size:.85rem; resize:vertical;
  background:rgba(0,0,0,.18); border-radius:10px;
}
.rigaAzioni{display:flex; gap:10px; margin-top:14px; flex-wrap:wrap; align-items:center;}
.hint{color:var(--ink-faint); font-size:.78rem;}
#esitoParse{font-size:.85rem; font-weight:600; transition:opacity var(--t-med) var(--ease);}
#esitoParse.ok{color:var(--verde-chiaro);} #esitoParse.warn{color:var(--giallo);} #esitoParse.err{color:var(--rosso);}

/* ---------- pannelli a scomparsa ---------- */
details.pannello{
  margin-top:14px; border:1px solid var(--line); border-radius:var(--r);
  background:var(--bg2); box-shadow:var(--ombra-1);
  transition:border-color var(--t-fast) var(--ease);
}
details.pannello:hover{border-color:var(--line2);}
details.pannello>summary{
  cursor:pointer; padding:13px 18px; font-weight:700; font-size:.9rem; list-style:none;
  display:flex; align-items:center; gap:9px; user-select:none; color:var(--ink-dim);
  transition:color var(--t-fast) var(--ease);
}
details.pannello>summary:hover{color:var(--ink);}
details.pannello>summary::-webkit-details-marker{display:none;}
details.pannello>summary::before{
  content:""; width:7px; height:7px; flex:none;
  border-right:2px solid var(--blu-chiaro); border-bottom:2px solid var(--blu-chiaro);
  transform:rotate(-45deg); transition:transform var(--t-med) var(--ease);
}
details.pannello[open]>summary{color:var(--ink);}
details.pannello[open]>summary::before{transform:rotate(45deg) translate(-1px,-1px);}
@keyframes apriPannello{from{opacity:0; transform:translateY(-6px);} to{opacity:1; transform:none;}}
details.pannello[open] .corpo{animation:apriPannello var(--t-med) var(--ease);}
.pannello .corpo{padding:6px 18px 20px; display:flex; gap:22px; flex-wrap:wrap; align-items:flex-start;}
.campo{display:flex; flex-direction:column; gap:5px; min-width:130px;}
.campo label{font-size:.7rem; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em;}
.campo input,.campo select{padding:8px 10px; font-size:.9rem; width:140px;}
.campo .nota{font-size:.72rem; color:var(--ink-faint);}
.avvisoAI{width:100%; font-size:.78rem; color:var(--giallo);}
.rigaCal{width:100%; display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
.rigaCal + .rigaCal{padding-top:10px; border-top:1px dashed var(--line);}
.rigaCal .hint{flex:1; min-width:220px;}
.rigaCal code{font-size:.75rem; background:var(--bg3); border:1px solid var(--line); border-radius:5px; padding:1px 5px;}

/* esito reale (aggiudicazione + vendita) nella card */
.rigaEsito{margin-top:13px; padding-top:12px; border-top:1px solid var(--line);}
.rigaEsito .etichRiv{display:flex; align-items:center; justify-content:space-between; font-size:.75rem; font-weight:700; color:var(--ink-dim); margin-bottom:6px;}
.rigaEsito .inRiga{display:flex; gap:10px; flex-wrap:wrap;}
.rigaEsito label{display:flex; flex-direction:column; gap:3px; font-size:.7rem; font-weight:600; color:var(--ink-faint);}
.rigaEsito input{width:118px; padding:6px 8px; font-size:.88rem; text-align:right; font-variant-numeric:tabular-nums;}

/* ---------- griglia risultati ---------- */
#areaRisultati{display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:20px; margin-top:22px; align-items:start;}
#areaRisultati[hidden]{display:none;}
@media(max-width:1100px){#areaRisultati{grid-template-columns:1fr;} #cardTetto{position:static; max-height:none; overflow:visible;}}

/* ---------- shortlist ---------- */
#zonaShortlist{min-width:0;}
.testataShortlist{display:flex; align-items:baseline; gap:12px; margin-bottom:10px; flex-wrap:wrap;}
.testataShortlist input#titoloAsta{
  font-size:1.05rem; font-weight:800; letter-spacing:-.01em; padding:6px 10px; min-width:220px;
  background:transparent; border-color:transparent; box-shadow:none;
}
.testataShortlist input#titoloAsta:hover{border-color:var(--line);}
.testataShortlist input#titoloAsta:focus{border-color:var(--blu); background:var(--bg3);}
.quandoIncollato{
  margin-left:auto; font-size:.82rem; color:var(--ink-dim); white-space:nowrap;
  display:inline-flex; align-items:center; gap:6px;
}
.quandoIncollato::before{
  content:""; width:6px; height:6px; border-radius:50%; background:var(--verde-chiaro); opacity:.75;
}
.tabWrap{
  overflow-x:auto; border:1px solid var(--line); border-radius:var(--r-l);
  background:var(--bg2); box-shadow:var(--ombra-1);
}
.tabWrap::-webkit-scrollbar{height:8px;}
.tabWrap::-webkit-scrollbar-thumb{background:var(--bg4); border-radius:4px;}
.tabWrap::-webkit-scrollbar-track{background:transparent;}
/* barra filtri sopra la lista (come Buyer24): menu compatti, contatore, azzera */
.barraFiltri{display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:2px 0 10px;}
.barraFiltri .hint{font-variant-numeric:tabular-nums;}
/* filtro a selezione multipla: bottone + pannello di caselle -------------------*/
.fltMulti{position:relative;}
.fltBtn{display:inline-flex; align-items:center; gap:6px; padding:6px 11px; font-size:.8rem; font-weight:600;
  color:var(--ink-dim); background:var(--bg3); border:1px solid var(--line); border-radius:9px; cursor:pointer;
  transition:border-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease);}
.fltBtn::after{content:"▾"; font-size:.7rem; opacity:.6;}
.fltBtn:hover{border-color:var(--ink-faint);}
.fltBtn.attivo{color:var(--ink); border-color:var(--blu-chiaro);}
.fltBtn .fltN:empty{display:none;}
.fltBtn .fltN{min-width:16px; height:16px; padding:0 4px; display:inline-flex; align-items:center; justify-content:center;
  font-size:.68rem; font-weight:700; color:#fff; background:var(--blu-chiaro); border-radius:8px;}
/* filtri numerici a soglia (Prezzo max, Km max): stessa pillola dei menu */
.fltNum{display:inline-flex; align-items:center; gap:6px; padding:5px 11px; font-size:.8rem; font-weight:600;
  color:var(--ink-dim); background:var(--bg3); border:1px solid var(--line); border-radius:9px;
  transition:border-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease);}
.fltNum:focus-within{border-color:var(--blu-chiaro);}
.fltNum.attivo{color:var(--ink); border-color:var(--blu-chiaro);}
.fltNum input{width:70px; border:none; background:none; color:var(--ink); font:inherit; font-weight:700;
  text-align:right; padding:0; outline:none; appearance:textfield; -moz-appearance:textfield;
  font-variant-numeric:tabular-nums;}
.fltNum input::-webkit-outer-spin-button,.fltNum input::-webkit-inner-spin-button{-webkit-appearance:none; margin:0;}
.fltNum input::placeholder{color:var(--ink-faint); font-weight:600;}
.fltNum .fltNumUnita{color:var(--ink-faint); font-weight:600;}
.fltPanel{position:absolute; z-index:30; top:calc(100% + 5px); left:0; min-width:180px; max-height:280px; overflow:auto;
  background:var(--bg2); border:1px solid var(--line); border-radius:11px; box-shadow:0 12px 34px rgba(0,0,0,.4);
  padding:6px;}
.fltOpz{display:flex; align-items:center; gap:8px; padding:6px 8px; border-radius:7px; cursor:pointer; font-size:.82rem; color:var(--ink-dim);}
.fltOpz:hover{background:var(--bg3);}
.fltOpz input{margin:0; accent-color:var(--blu-chiaro); cursor:pointer;}
.fltOpz .fltOpzNome{flex:1; color:var(--ink);}
.fltOpz .fltConteOpz{font-size:.72rem; color:var(--ink-faint); font-variant-numeric:tabular-nums;}
.fltPulisci{width:100%; margin-top:4px; padding:6px; font-size:.75rem; color:var(--ink-dim); background:none;
  border:none; border-top:1px solid var(--line); cursor:pointer; text-align:center;}
.fltPulisci:hover{color:var(--ink);}

table.shortlist{width:100%; border-collapse:collapse; font-size:.83rem; min-width:680px;}
table.shortlist th{
  text-align:left; padding:10px 8px; color:var(--ink-faint); font-size:.68rem; text-transform:uppercase;
  letter-spacing:.06em; font-weight:700; border-bottom:1px solid var(--line);
  cursor:pointer; white-space:nowrap; user-select:none;
  transition:color var(--t-fast) var(--ease);
}
table.shortlist th:hover{color:var(--ink);}
table.shortlist th .freccia{color:var(--blu-chiaro);}
table.shortlist td{padding:9px 8px; border-bottom:1px solid rgba(69,66,60,.55); white-space:nowrap;}
td.veicolo{max-width:200px; overflow:hidden; text-overflow:ellipsis; font-weight:600;}
table.shortlist tbody tr{cursor:pointer; transition:background var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);}
table.shortlist tbody tr:hover{background:rgba(255,255,255,.035);}
table.shortlist tbody tr.sel{background:var(--blu-soft); box-shadow:inset 3px 0 0 var(--blu);}
table.shortlist tr:last-child td{border-bottom:none;}
td.num{text-align:right; font-variant-numeric:tabular-nums;}
th.num{text-align:right;}
td .tetto{font-weight:800;}
.mPos{color:var(--verde-chiaro); font-weight:700;} .mNeg{color:var(--rosso-chiaro); font-weight:700;}

/* semaforo: pillola leggibile in 3 secondi, non solo colore (regola a11y) */
.pillSem{
  display:inline-flex; align-items:center; gap:6px;
  font-size:.68rem; font-weight:800; letter-spacing:.05em;
  padding:3px 9px 3px 7px; border-radius:99px; border:1px solid transparent;
  transition:background var(--t-med) var(--ease), color var(--t-med) var(--ease);
}
.pillSem .dot{width:7px; height:7px; border-radius:50%; background:currentColor; flex:none;}
.pillSem.verde{color:var(--verde-chiaro); background:var(--verde-soft); border-color:rgba(63,174,107,.35);}
.pillSem.giallo{color:var(--giallo); background:var(--giallo-soft); border-color:rgba(224,168,61,.35);}
.pillSem.rosso{color:var(--rosso-chiaro); background:var(--rosso-soft); border-color:rgba(208,83,63,.35);}
.pillSem.grigio{color:var(--ink-faint); background:rgba(255,255,255,.04); border-color:var(--line);}

.tagIva{font-size:.66rem; border:1px solid var(--line); border-radius:5px; padding:1px 5px; color:var(--ink-dim); margin-left:6px; font-weight:500;}

/* colonna "Rif." (Stock ID): l'ancora univoca del lotto, o "—" se assente.
   Un CLIC lo copia negli appunti (la selezione manuale morirebbe al primo
   re-render della tabella); selezionabile comunque, anche su Safari. */
td.rif{white-space:nowrap;}
.rifCode{font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.74rem; letter-spacing:.02em;
  background:var(--bg3); border:1px solid var(--line); border-radius:5px; padding:1px 6px; color:var(--ink-dim);
  cursor:copy; -webkit-user-select:all; user-select:all;
  transition:color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);}
.rifCode:hover{color:var(--ink); border-color:var(--blu-chiaro);}
.rifVuoto{color:var(--ink-faint); cursor:help;}

/* lotti IVA esclusa/deducibile: in tabella il prezzo mostrato è il costo VERO
   (+22%), col tag che lo dichiara; il netto esposto vive nel tooltip */
.prezzoIvato{cursor:pointer; white-space:nowrap;}
.tagIvato{font-size:.62rem; font-weight:600; letter-spacing:.02em; margin-left:5px;
  border:1px solid rgba(224,168,61,.4); color:var(--giallo); background:var(--giallo-soft);
  border-radius:5px; padding:1px 4px; vertical-align:1px;}
.margineOra.ivaRiga{border-bottom:1px dashed var(--line);}
.margineOra.ivaRiga .tagIva{margin-left:2px;}

/* fonte del prezzo di rivendita: il buyer deve sapere da dove esce il numero */
.badgeFonte{
  display:inline-block; font-size:.62rem; font-weight:800; letter-spacing:.04em;
  border-radius:5px; padding:0 5px; margin-left:6px; vertical-align:1px;
  text-transform:uppercase;
}
/* in tabella il badge va a capo sotto il prezzo: la colonna resta stretta */
td .badgeFonte{display:block; margin:2px 0 0 auto; width:fit-content;}
.badgeFonte.seed{color:var(--giallo); background:var(--giallo-soft); border:1px solid rgba(224,168,61,.3);}
.badgeFonte.override{color:var(--blu-chiaro); background:var(--blu-soft); border:1px solid rgba(59,125,216,.35);}
.badgeFonte.mercato_dealer{color:var(--verde-chiaro); background:var(--verde-soft); border:1px solid rgba(63,174,107,.3);}
.badgeFonte.buyer24{color:#b3a2f0; background:rgba(139,123,216,.16); border:1px solid rgba(139,123,216,.4);}
/* fiducia nel prezzo di mercato: dichiara quanto è solido il numero (S8a) */
.chipFiducia{
  display:inline-block; font-size:.6rem; font-weight:800; letter-spacing:.03em;
  border-radius:5px; padding:0 5px; margin-left:6px; vertical-align:1px; text-transform:uppercase;
}
.chipFiducia.solido{color:var(--verde-chiaro); background:var(--verde-soft); border:1px solid rgba(63,174,107,.32);}
.chipFiducia.medio{color:var(--blu-chiaro); background:var(--blu-soft); border:1px solid rgba(59,125,216,.32);}
.chipFiducia.da_verificare{color:var(--giallo); background:var(--giallo-soft); border:1px solid rgba(224,168,61,.32);}
.avvisoKm{font-size:.75rem; color:var(--giallo); margin-top:5px;}

/* fascia di mercato p25–p75 coi tre prezzi posizionati (identità via etichetta, mai solo colore) */
.bandaMercato{margin-top:14px; padding-top:12px; border-top:1px solid var(--line);}
/* testa su due righe: titolo sopra, dettaglio sotto a tutta larghezza (mai
   schiacciato sulla destra a spezzarsi in tre righe) */
.bandaMercato .bandaTesta{display:flex; flex-direction:column; gap:3px; margin-bottom:13px;}
.bandaMercato .bandaTesta .bandaTitolo{display:flex; align-items:center; gap:7px; font-size:.79rem; font-weight:700; color:var(--ink-dim);}
.bandaMercato .bandaTesta .hint{font-weight:500; text-align:left; line-height:1.4;}
.bandaTrack{position:relative; height:28px;}
.bandaTrack .binario{position:absolute; left:0; right:0; top:12px; height:4px; border-radius:2px; background:var(--bg4);}
.bandaTrack .fascia{position:absolute; top:10px; height:8px; border-radius:4px; background:rgba(244,241,234,.13);}
.bandaTrack .medianaTick{position:absolute; top:7px; width:2px; height:14px; border-radius:1px; background:var(--ink-faint); transform:translateX(-50%);}
.bandaTrack .mk{position:absolute; top:9px; width:10px; height:10px; border-radius:50%; transform:translateX(-50%); box-shadow:0 0 0 2px var(--bg2);}
.mkAsta{background:var(--giallo);} .mkTetto{background:var(--blu-chiaro);} .mkRiv{background:var(--verde-chiaro);}
.bandaLegenda{display:flex; gap:7px 18px; flex-wrap:wrap; font-size:.74rem; color:var(--ink-dim); margin-top:10px;}
.bandaLegenda span{display:inline-flex; align-items:center;}
.bandaLegenda i{display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:5px;}
.bandaLegenda b{color:var(--ink); font-variant-numeric:tabular-nums; font-weight:600; margin-left:4px;}
/* margine in % accanto all'euro, in tono minore */
.margPct{font-size:.82em; font-weight:600; opacity:.7; font-variant-numeric:tabular-nums;}

.cellaVuota{background:var(--giallo-soft); border-radius:6px; color:var(--giallo); font-weight:700; padding:1px 7px; cursor:pointer; transition:background var(--t-fast) var(--ease);}
.cellaVuota:hover{background:rgba(224,168,61,.28);}
.campoIncerto{background:var(--giallo-soft); border-radius:6px; padding:0 5px; color:var(--giallo); cursor:pointer; transition:background var(--t-fast) var(--ease);}
.campoIncerto:hover{background:rgba(224,168,61,.28);}
/* campi solo-lettura (email salone ecc.): copiabili, ma dichiaratamente non editabili */
input[readonly]{color:var(--ink-dim); background:var(--bg3); cursor:text;}

/* prezzo mancante = occasione di addestramento: invito positivo, mai un vicolo cieco */
.occasioneBuyer{
  margin-top:8px; padding:8px 12px; border-radius:8px; font-size:.8rem; line-height:1.5;
  color:var(--ink-dim); background:rgba(94,175,120,.08); border:1px solid rgba(94,175,120,.25);
}
.occasioneBuyer b{color:var(--verde-chiaro); font-weight:600;}

/* seconda riga del box tetto (lotti esteri): il prezzo equivalente in Italia */
.sottoTetto{font-size:.82rem; color:var(--ink-dim); margin:-2px 0 6px;}
.sottoTetto b{color:var(--ink); font-variant-numeric:tabular-nums;}

/* pannello "come leggere questi numeri": spiegazione IVA+offerta per lotto */
.spiegaOfferta{margin:10px 0 14px;}
.spiegaOfferta .spiegaCorpo{padding:0 18px 12px; font-size:.82rem; color:var(--ink-dim); line-height:1.55;}
.spiegaOfferta .spiegaCorpo p{margin:6px 0;}
.spiegaOfferta .spiegaCorpo b{color:var(--ink); font-weight:600;}

/* barra "l'app si è aggiornata": visibile ma mai invadente, non ruba il focus */
#barraAggiorna{
  position:fixed; left:50%; bottom:18px; transform:translateX(-50%); z-index:80;
  display:flex; align-items:center; gap:12px; padding:10px 16px;
  background:var(--bg2); border:1px solid var(--blu-chiaro); border-radius:12px;
  box-shadow:0 8px 30px rgba(0,0,0,.35); font-size:.85rem; color:var(--ink);
  animation:cardIn var(--t-med) var(--ease);
}

/* animazione estrazione "a vista" */
@keyframes arrivo{from{opacity:0; transform:translateY(9px);} to{opacity:1; transform:none;}}
tr.arrivo{animation:arrivo .34s var(--ease) both;}

/* ---------- card tetto ---------- */
#cardTetto{
  /* La scheda del margine è alta (voce per voce + prezzo di vendita in fondo).
     Scorre INSIEME alla pagina (position:static): così il fondo — dove c'è il
     prezzo di vendita da aggiornare — è sempre raggiungibile con lo scroll
     normale. Niente scroll interno pinnato: intrappolava la parte bassa, che si
     muoveva solo a fine pagina. */
  position:static; align-self:start; border:1px solid var(--line); border-radius:var(--r-l);
  background:linear-gradient(180deg, rgba(255,255,255,.025), transparent 30%), var(--bg2);
  padding:20px; min-height:200px; box-shadow:var(--ombra-2);
}
#cardTetto .vuoto{color:var(--ink-faint); font-size:.9rem; text-align:center; padding:48px 12px;}
@keyframes cardIn{from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;}}
.cardContenuto{animation:cardIn var(--t-med) var(--ease);}
.cardTitolo{font-weight:800; font-size:1.02rem; line-height:1.3; letter-spacing:-.01em;}
/* provenienza del lotto: targa/Rif. per ritrovarlo in piattaforma + fonte e asta */
.cardProvenienza{display:flex; align-items:center; gap:8px; margin-top:5px; font-size:.78rem;}
.cardProvenienza .rifCode{font-size:.78rem;}
.cardSotto{color:var(--ink-dim); font-size:.78rem; margin-top:3px; margin-bottom:14px;}
.cardSotto .campoIncerto{font-size:.78rem;}
.tettoBig{
  border-radius:var(--r); padding:16px; text-align:center; margin-bottom:8px;
  border:1px solid var(--line);
  transition:background var(--t-med) var(--ease), border-color var(--t-med) var(--ease);
}
.tettoBig.verde{background:var(--verde-soft); border-color:rgba(63,174,107,.5);}
.tettoBig.giallo{background:var(--giallo-soft); border-color:rgba(224,168,61,.5);}
.tettoBig.rosso{background:var(--rosso-soft); border-color:rgba(208,83,63,.5);}
.tettoBig.grigio{background:var(--bg3);}
.tettoBig .etich{font-size:.68rem; text-transform:uppercase; letter-spacing:.1em; font-weight:700; color:var(--ink-dim);}
.tettoBig .cifra{
  font-size:2.15rem; font-weight:800; letter-spacing:-.02em; margin:2px 0;
  font-variant-numeric:tabular-nums; transition:color var(--t-med) var(--ease);
}
.tettoBig.verde .cifra{color:var(--verde-chiaro);} .tettoBig.giallo .cifra{color:var(--giallo);}
.tettoBig.rosso .cifra{color:var(--rosso-chiaro);}
.tettoBig .verdetto{font-size:.82rem; font-weight:600; color:var(--ink-dim);}
.tettoBig.verde .verdetto{color:var(--verde-chiaro);} .tettoBig.rosso .verdetto{color:var(--rosso-chiaro);}
.tettoBig.giallo .verdetto{color:var(--giallo);}
.margineOra{
  display:flex; justify-content:space-between; align-items:center; gap:10px;
  margin-top:10px; padding:10px 13px; border-radius:10px; background:var(--bg3); font-size:.84rem;
}
.margineOra b{font-variant-numeric:tabular-nums; font-size:.95rem;}
.scomposizione{font-size:.8rem; margin-top:13px; border-top:1px solid var(--line); padding-top:11px;}
.scomposizione .voce{display:flex; justify-content:space-between; padding:2.5px 0; color:var(--ink-dim);}
.scomposizione .voce b{color:var(--ink); font-variant-numeric:tabular-nums; font-weight:600;}
.scomposizione .voce.tot{border-top:1px dashed var(--line); margin-top:6px; padding-top:8px; color:var(--ink); font-weight:700;}
.scomposizione .voce.tot b{font-weight:800;}

.rigaRivendita{margin-top:14px; padding-top:12px; border-top:1px solid var(--line);}
.rigaRivendita .etichRiv{display:flex; align-items:center; justify-content:space-between; font-size:.75rem; font-weight:700; color:var(--ink-dim); margin-bottom:6px;}
.rigaRivendita .inRiga{display:flex; align-items:center; gap:8px;}
.rigaRivendita input{width:120px; padding:7px 9px; font-size:.95rem; font-weight:700; text-align:right; font-variant-numeric:tabular-nums;}
.rigaRivendita input.manca{border-color:var(--giallo); background:var(--giallo-soft);}
.rigaRivendita .hint{flex:1;}
.badgeManca{color:var(--giallo); font-weight:700; font-size:.78rem;}

/* ricondizionamento: preset a portata di dito + slider */
.rigaSlider{margin-top:14px;}
.rigaSlider .etichSlider{font-size:.75rem; font-weight:700; color:var(--ink-dim); display:flex; justify-content:space-between; margin-bottom:7px;}
.rigaSlider .etichSlider b{color:var(--ink); font-variant-numeric:tabular-nums;}
.presetDanno{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:9px;}
.chip{
  border:1px solid var(--line); background:var(--bg3); color:var(--ink-dim);
  font-size:.74rem; font-weight:700; padding:5px 11px; border-radius:99px; cursor:pointer;
  transition:background var(--t-fast) var(--ease), color var(--t-fast) var(--ease),
             border-color var(--t-fast) var(--ease), transform var(--t-fast) var(--ease);
}
.chip:hover{border-color:var(--line2); color:var(--ink); transform:translateY(-1px);}
.chip:active{transform:scale(.95);}
.chip.attivo{background:var(--blu-soft); border-color:rgba(59,125,216,.55); color:var(--blu-chiaro);}
.chip small{font-weight:600; opacity:.75;}
input[type=range]{
  -webkit-appearance:none; appearance:none; width:100%; height:26px;
  background:transparent; border:none; cursor:pointer; padding:0;
}
input[type=range]:focus{box-shadow:none;}
input[type=range]::-webkit-slider-runnable-track{height:6px; border-radius:3px; background:var(--bg4);}
input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none; width:20px; height:20px; border-radius:50%;
  background:#fff; border:none; margin-top:-7px;
  box-shadow:0 0 0 4px rgba(59,125,216,.4), var(--ombra-1);
  transition:box-shadow var(--t-fast) var(--ease), transform var(--t-fast) var(--ease);
}
input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.12);}
input[type=range]:active::-webkit-slider-thumb{box-shadow:0 0 0 7px rgba(59,125,216,.30), var(--ombra-1); transform:scale(1.12);}
input[type=range]::-moz-range-track{height:6px; border-radius:3px; background:var(--bg4);}
input[type=range]::-moz-range-thumb{
  width:20px; height:20px; border-radius:50%; background:#fff; border:none;
  box-shadow:0 0 0 4px rgba(59,125,216,.4);
}

.rigaDanno{margin-top:13px;}
.rigaStoria{margin-top:11px; padding-top:10px; border-top:1px solid rgba(69,66,60,.5);}
.rigaStoria b{color:var(--ink);}
.rigaDanno textarea{width:100%; min-height:44px; font-size:.8rem; padding:9px; margin-top:5px;}
.rigaDanno .stimaAI{font-size:.75rem; color:var(--giallo); margin-top:5px;}

/* ---------- modale mapping excel ---------- */
.velo{
  position:fixed; inset:0; background:rgba(15,14,13,.6);
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
  display:none; align-items:center; justify-content:center; z-index:100;
}
.velo.on{display:flex; animation:veloIn var(--t-fast) var(--ease);}
@keyframes veloIn{from{opacity:0;} to{opacity:1;}}
@keyframes modaleIn{from{opacity:0; transform:scale(.96) translateY(8px);} to{opacity:1; transform:none;}}
.modale{
  background:var(--bg2); border:1px solid var(--line2); border-radius:var(--r-l);
  padding:22px; width:min(680px,92vw); max-height:86vh; overflow:auto;
  box-shadow:var(--ombra-3);
}
.velo.on .modale{animation:modaleIn var(--t-med) var(--ease);}
.modale h3{margin-bottom:4px; letter-spacing:-.01em;}
.modale p{color:var(--ink-dim); font-size:.83rem; margin-bottom:14px;}
.modale table{width:100%; border-collapse:collapse; font-size:.85rem;}
.modale td,.modale th{padding:8px; border-bottom:1px solid rgba(69,66,60,.55); text-align:left;}
.modale select{padding:6px 8px; width:100%;}
.modale .anteprima{color:var(--ink-faint); font-size:.75rem; max-width:200px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.modale .piede{display:flex; justify-content:flex-end; gap:10px; margin-top:16px;}

/* ---------- toast ---------- */
#toast{
  position:fixed; bottom:22px; left:50%; transform:translateX(-50%) translateY(90px);
  background:var(--bg4); border:1px solid var(--line2); color:var(--ink);
  padding:10px 18px; border-radius:11px; font-size:.85rem; font-weight:600;
  transition:transform .32s cubic-bezier(.34,1.4,.5,1); z-index:200; box-shadow:var(--ombra-3);
}
#toast.on{transform:translateX(-50%) translateY(0);}

/* ---------- stampa: solo la shortlist, pulita ---------- */
@media print{
  body{background:#fff; color:#111;}
  header, #boxIncolla, details.pannello, #cardTetto, .rigaAzioni, .noPrint, #toast, .velo{display:none !important;}
  main{padding:0; max-width:none;}
  #areaRisultati{display:block; margin-top:0;}
  .testataShortlist input#titoloAsta{color:#111; font-size:1.2rem; border:none; background:none; padding:0;}
  .tabWrap{border:none; background:none; overflow:visible; box-shadow:none;}
  table.shortlist{min-width:0; font-size:10.5pt;}
  table.shortlist th{color:#333; border-bottom:1.5pt solid #111; cursor:default;}
  table.shortlist td{border-bottom:.5pt solid #999; color:#111;}
  table.shortlist tbody tr.sel{background:none; box-shadow:none;}
  .mPos{color:#0a7a3d;} .mNeg{color:#b3341f;}
  .pillSem{border:.75pt solid #999; padding:1px 6px;}
  .pillSem.verde{color:#0a7a3d; background:none;} .pillSem.giallo{color:#c8901a; background:none;}
  .pillSem.rosso{color:#b3341f; background:none;} .pillSem.grigio{color:#777; background:none;}
  .badgeFonte{border:.5pt solid #999; background:none;}
  .badgeFonte.seed{color:#c8901a;} .badgeFonte.override,.badgeFonte.mercato_dealer{color:#333;}
  .cellaVuota,.campoIncerto{background:none; color:#b3341f;}
  .tagIva{color:#333; border-color:#999;}
  #firmaStampa{display:block !important; margin-top:14px; color:#555; font-size:8.5pt;}
}
#firmaStampa{display:none;}

/* rispetto della preferenza sistema: niente animazioni se ridotte */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important;}
  html{scroll-behavior:auto;}
}

/* ---- CRM piazzale: riepilogo + editor costi -------------------------------- */
.riepPiazzale{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px;
  margin:4px 0 16px;
}
.riepCella{
  background:var(--bg2); border:1px solid var(--line); border-radius:12px; padding:11px 13px;
}
.riepCella .et{font-size:.68rem; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em;}
.riepCella .vl{font-size:1.28rem; font-weight:800; letter-spacing:-.01em; margin-top:3px;}
.riepCella .vl.pos{color:var(--verde-chiaro);} .riepCella .vl.neg{color:var(--rosso-chiaro);}
.riepCella small{color:var(--ink-faint); font-size:.72rem;}
.invMargine.pos{color:var(--verde-chiaro); font-weight:700;}
.invMargine.neg{color:var(--rosso-chiaro); font-weight:700;}

/* ---- Radar aste (admin): mappa del mercato --------------------------------- */
.radarNumeri{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:10px; margin:6px 0 4px;
}
.radarCella{
  background:var(--bg2); border:1px solid var(--line); border-radius:12px; padding:11px 13px; text-align:center;
}
.radarVal{font-size:1.5rem; font-weight:800; letter-spacing:-.02em;}
.radarEt{font-size:.68rem; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em; margin-top:2px;}
.radarCampione{color:var(--ink-faint); font-size:.76rem; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; max-width:420px;}
.invMargine .stim{color:var(--ink-faint); font-weight:500; font-size:.72rem;}
.vaSez{margin:16px 0 6px; font-size:.72rem; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em;}
.vaCosti{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px;}
.vaCosti label{display:flex; flex-direction:column; gap:3px; font-size:.72rem; font-weight:600; color:var(--ink-faint);}
.vaCosti input{padding:7px 9px;}
.vaConti{
  display:flex; flex-wrap:wrap; gap:18px; align-items:baseline;
  background:var(--bg2); border:1px solid var(--line); border-radius:12px; padding:12px 14px; margin-top:12px;
}
.vaConti .voce{display:flex; flex-direction:column; gap:2px;}
.vaConti .voce .et{font-size:.68rem; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em;}
.vaConti .voce .vl{font-size:1.12rem; font-weight:800;}
.vaConti .voce .vl.pos{color:var(--verde-chiaro);} .vaConti .voce .vl.neg{color:var(--rosso-chiaro);}

/* ---- invito a compilare le regole (colonna tetto/margine vuota) ------------- */
.vaiRegole{
  display:inline-block; cursor:pointer; white-space:nowrap;
  font-size:.76rem; font-weight:700; color:var(--giallo);
  background:var(--giallo-soft); border:1px solid rgba(224,168,61,.45);
  border-radius:7px; padding:3px 9px; transition:all var(--t-fast) var(--ease);
}
.vaiRegole:hover{ color:var(--ink); border-color:var(--giallo); box-shadow:0 0 0 3px var(--giallo-soft); }

/* ---- nota sul prezzo (CarOnSale: ricavato dall'IVA o da inserire) ---------- */
.notaPrezzo{font-size:.75rem; color:var(--ink-faint); margin:6px 0 2px; line-height:1.4;}
.notaPrezzo.manca{color:var(--giallo);}
.notaAzione{cursor:pointer; font-weight:700; color:var(--giallo); white-space:nowrap;}
.notaAzione:hover{text-decoration:underline;}

/* ---- tab per sito d'asta (stile browser) ----------------------------------- */
.tabFonti{
  display:flex; flex-wrap:wrap; gap:4px; align-items:flex-end;
  margin:2px 0 0; padding:0 2px;
  border-bottom:1px solid var(--line);
}
.tabFonte{
  display:inline-flex; align-items:center; gap:7px; cursor:pointer;
  border:1px solid var(--line); border-bottom:none;
  background:var(--bg); color:var(--ink-dim);
  padding:8px 14px; font-size:.82rem; font-weight:600;
  border-radius:9px 9px 0 0; position:relative; top:1px;
  transition:background var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.tabFonte:hover{background:var(--bg3); color:var(--ink);}
.tabFonte.attiva{
  background:var(--bg2); color:var(--ink); border-color:var(--line);
  box-shadow:0 -2px 0 var(--blu-chiaro) inset;
}
.tabConta{
  font-size:.72rem; font-weight:700; color:var(--ink-faint);
  background:var(--bg4); border-radius:99px; padding:1px 7px; min-width:20px; text-align:center;
}
.tabFonte.attiva .tabConta{color:var(--blu-chiaro); background:var(--blu-soft);}
.tabChiudi{
  display:inline-flex; align-items:center; justify-content:center;
  width:17px; height:17px; margin:-1px -5px -1px 1px; border-radius:99px;
  font-size:1rem; line-height:1; color:var(--ink-faint);
  opacity:.55; cursor:pointer;
  transition:background var(--t-fast) var(--ease), color var(--t-fast) var(--ease), opacity var(--t-fast) var(--ease);
}
.tabChiudi:hover{opacity:1; color:#fff; background:var(--rosso, #dc2626);}
