/* Tema Convinco: chiaro, carta calda e luminosa, inchiostro blu notte WIT, oro per ciò che conta.
   Un solo look chiaro, voluto. Si carica dopo stile.css e ne sovrascrive token e componenti. */
html:root:root{
  --paper:#f6f4ee; --grid:transparent; --sheet:#ffffff; --rule:#e6e2d6;
  --ink:#121a33; --muted:#69708a; --red:#c9402f; --green:#1f8a5b; --amber:#b77d14;
  --gold:#c9a95f; --gold-2:#e6cf94; --gold-deep:#8f6c22; --gold-ink:#121a33; --hi:#f3e6c2; --hi-ink:#121a33;
  --navy:#1d2340; --navy-2:#2b3360;
  --tab:#1d2340; --tab-ink:#ffffff; --on-color:#ffffff;
  --glass-border:#e6e2d6; --glow:0 1px 0 rgba(18,26,51,.04), 0 18px 40px -26px rgba(18,26,51,.35);
  --f-brand:"Unbounded","Sora","Segoe UI",system-ui,sans-serif;
  --f-display:"Sora","Segoe UI",system-ui,sans-serif; --f-body:"Manrope","Segoe UI",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
  color-scheme:light;
}
html:root:root body{
  background:
    radial-gradient(900px 420px at 92% -8%, rgba(201,169,95,.20), transparent 62%),
    radial-gradient(800px 420px at -10% 0%, rgba(43,51,96,.08), transparent 60%),
    var(--paper);
  background-attachment:fixed; color:var(--ink); font-family:var(--f-body);
}
::selection{background:var(--hi);color:var(--ink)}

/* ---------- testata e marchio ---------- */
.top{position:relative;padding-block:28px 18px}
.brandrow{gap:12px}
.brandrow span{color:var(--muted);letter-spacing:.14em}
.brandrow .mark{background:var(--navy);color:#fff;border-radius:6px;padding:4px 10px}
.brandrow .logo{height:56px;width:auto;display:block;border-radius:10px;box-shadow:0 10px 24px -14px rgba(29,35,64,.7)}
.brandrow .logo + .mark{display:none}
.nome{display:flex;align-items:center;gap:14px;margin-top:14px}
.simbolo{width:clamp(46px,7vw,64px);height:auto;flex:none;filter:drop-shadow(0 12px 18px rgba(29,35,64,.28))}
.top h1{font-family:var(--f-brand);font-weight:800;font-stretch:normal;text-transform:none;letter-spacing:-.035em;font-size:clamp(2.3rem,6.4vw,3.9rem);line-height:1;color:var(--navy);margin:0}
.top h1 em{font-style:normal;background:linear-gradient(100deg,var(--gold-deep),var(--gold) 60%,#d9bd78);-webkit-background-clip:text;background-clip:text;color:transparent}
.top .payoff{font-family:var(--f-display);font-weight:600;font-size:clamp(.98rem,2vw,1.12rem);color:var(--navy-2);margin:10px 0 0;letter-spacing:-.005em}
.top .payoff::before{content:"";display:inline-block;width:22px;height:2px;background:var(--gold);vertical-align:middle;margin-right:10px;border-radius:2px}
.top p{color:var(--muted)}
.top::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,var(--gold),rgba(201,169,95,.15) 60%,transparent)}
.utente b{color:var(--ink)}

/* ---------- schede ---------- */
.tabs{border:1px solid var(--rule);background:#fff;border-radius:999px;padding:5px;margin-top:22px;gap:4px;width:max-content;max-width:100%;box-shadow:var(--glow)}
.tabs button{border-radius:999px;font-family:var(--f-display);font-stretch:normal;font-weight:700;color:var(--muted);padding:9px 18px;transition:color .2s,background .2s}
.tabs button:hover{color:var(--ink)}
.tabs button[aria-selected="true"]{background:var(--navy);color:#fff;box-shadow:0 8px 18px -10px rgba(29,35,64,.8)}
.tabs button .n{color:var(--gold)}

/* ---------- carte ---------- */
.sheet,.consul,.el-detail,.tri,.mkt-cat{background:var(--sheet);border:1px solid var(--rule);border-radius:16px;box-shadow:var(--glow)}
.sheet{padding:26px clamp(18px,3vw,34px)}
.tri{overflow:hidden}
.tri>div{border-color:var(--rule)}
.banner{background:#fbf6e8;border:1px solid #efe1b9;border-radius:12px;color:var(--gold-deep)}
.lbl{color:var(--gold-deep);letter-spacing:.14em}
h2,h3,h4{font-family:var(--f-display);font-stretch:normal;color:var(--ink)}
.part>header{border-bottom:1px solid var(--rule)}
.part>header h3{font-weight:800;letter-spacing:-.015em;text-transform:none;font-size:1.4rem}
.part>header h3::before{content:"";display:inline-block;width:18px;height:3px;border-radius:2px;background:var(--gold);vertical-align:middle;margin-right:10px;transform:translateY(-3px)}
.mkt-cat h4{color:var(--navy-2)}

/* ---------- voto ---------- */
.intest h2{font-weight:800;font-size:clamp(1.6rem,3.6vw,2.4rem);letter-spacing:-.025em}
.voto{position:relative;padding:16px 24px;border-radius:20px;background:linear-gradient(160deg,var(--navy),var(--navy-2));box-shadow:0 20px 40px -24px rgba(29,35,64,.9)}
.voto .lbl{color:var(--gold-2)}
.voto .big{font-family:var(--f-brand);font-stretch:normal;font-weight:800;font-size:clamp(3.8rem,8vw,5.4rem);letter-spacing:-.05em;line-height:1;
  background:linear-gradient(180deg,#fff 15%,var(--gold-2) 60%,var(--gold) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.voto .big.ins{background:linear-gradient(180deg,#ffd6cf,#ff8a7a);-webkit-background-clip:text;background-clip:text;color:transparent}
.voto .giud{display:inline-block;margin-top:8px;padding:4px 12px;border-radius:999px;border:1px solid rgba(230,207,148,.45);color:var(--gold-2);font-stretch:normal}
.voto .pts{color:rgba(255,255,255,.65)}
.reg{border-top-color:var(--rule)} .reg div{border-bottom-color:var(--rule)}

/* ---------- riquadri chiave ---------- */
.compiti{border-top:1px solid var(--rule)}
.hl{background:linear-gradient(transparent 12%,var(--hi) 12%,var(--hi) 88%,transparent 88%);color:var(--hi-ink)}
.chiudere,.app{background:linear-gradient(135deg,#fbf6e8,#fff);border:1px solid #ecdcae;border-radius:14px}
.target{background:#fff;border-radius:14px}
.carica{border:1px solid #ecdcae;background:linear-gradient(135deg,#fbf3dc,#fff 70%)}
.salto{color:var(--gold-deep)}
.carica-fine{border-left-color:var(--gold)}
.prob{font-stretch:normal}
.sg .s{background:#fbfaf6;border:1px solid var(--rule);border-top-width:3px;border-radius:12px;padding:12px 14px}
.sg .s b{font-size:2.3rem;font-family:var(--f-brand)}
.crit.ok{color:var(--green)} .crit.bad{color:var(--red)}

/* ---------- striscia degli elementi ---------- */
.strip{gap:8px}
.strip .blk{border-radius:12px;height:66px;box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 10px 20px -14px rgba(18,26,51,.6);transition:transform .15s}
.strip .ok .blk{background:linear-gradient(160deg,#45c48a,#1f8a5b)} .strip .parziale .blk{background:linear-gradient(160deg,#f0c56b,#c58a1c)} .strip .mancante .blk{background:linear-gradient(160deg,#ef8476,#c9402f)}
.strip .non_previsto .blk{background:#efece3;color:var(--muted);box-shadow:none}
.strip button:hover .blk{transform:translateY(-3px)}
.strip button[aria-pressed="true"] .blk{outline:2px solid var(--navy);outline-offset:3px}
.strip .blk .vv{font-family:var(--f-brand);font-stretch:normal;font-size:1.9rem}

/* ---------- bottoni e campi ---------- */
.go{background:var(--navy);color:#fff;border-radius:999px;padding:13px 26px;font-family:var(--f-display);font-stretch:normal;letter-spacing:.03em;box-shadow:0 12px 24px -14px rgba(29,35,64,.9);transition:transform .15s,box-shadow .15s,background .15s}
.go:hover{transform:translateY(-2px);background:var(--navy-2)}
#btnGo,#salva,#eSave{background:linear-gradient(135deg,var(--gold-2),var(--gold));color:var(--gold-ink);box-shadow:0 12px 26px -12px rgba(201,169,95,.95)}
.go.ink{background:transparent;color:var(--navy);border:1.5px solid var(--navy);box-shadow:none}
.go.ink:hover{background:var(--navy);color:#fff}
.txtbtn{color:var(--navy-2);text-decoration-color:var(--gold);font-weight:600}
.txtbtn:hover{color:var(--gold-deep)}
.field input,.field select{border-bottom-color:#d6d0bf;color:var(--ink)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--gold)}
.field textarea{background:#fbfaf6;border:1px solid var(--rule);border-radius:12px;color:var(--ink)}
.seg{border:1px solid var(--rule);border-radius:999px;overflow:hidden;background:#fff}
.seg button{color:var(--muted);border-right-color:var(--rule)}
.seg button[aria-pressed="true"]{background:var(--hi);color:var(--ink)}
.seg button[aria-pressed="true"][data-s="vinto"],.seg button[aria-pressed="true"][data-s="presentato"]{background:var(--green);color:#fff}
.seg button[aria-pressed="true"][data-s="perso"],.seg button[aria-pressed="true"][data-s="no_show"],.seg button[aria-pressed="true"][data-s="non_fissato"]{background:var(--red);color:#fff}
.seg button[aria-pressed="true"][data-s="in_trattativa"],.seg button[aria-pressed="true"][data-s="appuntamento"],.seg button[aria-pressed="true"][data-s="in_attesa"]{background:linear-gradient(135deg,var(--gold-2),var(--gold));color:var(--gold-ink)}
.modo{background:#fff;border-color:var(--rule)}
.modo button[aria-pressed="true"]{background:var(--navy) !important;color:#fff !important}
.msg{border:1px solid var(--rule);border-radius:12px;background:#fbfaf6}
.msg.ok{border-color:rgba(31,138,91,.4);color:var(--green)} .msg.err{border-color:rgba(201,64,47,.45);color:var(--red)}
.tipo-info{background:#fbf6e8;border:1px solid #efe1b9;border-radius:12px}
.chip{border-radius:999px}
.chip.modo-setting{color:var(--gold-deep)}
.filtri button{border-color:var(--rule);color:var(--muted);background:#fff}
.filtri button[aria-pressed="true"]{background:var(--navy);color:#fff;border-color:var(--navy)}
.del{border-color:var(--rule);color:var(--muted);background:#fff}
.sticky-save{background:rgba(255,255,255,.92);border-color:var(--gold)}

/* ---------- tabelle, kpi, archivio ---------- */
th{color:var(--gold-deep);border-bottom-color:var(--ink)}
td{border-bottom-color:var(--rule)}
.kpis div{border-top:0;background:#fbfaf6;border:1px solid var(--rule);border-radius:12px;padding:12px 14px}
.kpis b{font-family:var(--f-brand);font-size:1.9rem;color:var(--navy)}
.cmp .b{height:9px}
.cmp .b.w{background:linear-gradient(90deg,#1f8a5b,#45c48a)} .cmp .b.l{background:linear-gradient(90deg,#c9402f,#ef8476)}
.lez-text{background:#fbf6e8;border:1px solid #efe1b9;border-radius:12px}
details.rif{border-bottom-color:var(--rule)}
.consul{border:1px solid #ecdcae;background:linear-gradient(135deg,#fbf3dc,#fff)}
.arco .bar{background:linear-gradient(180deg,var(--gold),var(--navy-2))}

/* ---------- entrata ---------- */
@media (prefers-reduced-motion:no-preference){
  .view>*{animation:sale .45s ease both}
  .view>*:nth-child(2){animation-delay:.05s} .view>*:nth-child(3){animation-delay:.1s}
  @keyframes sale{from{opacity:.001;transform:translateY(8px)}to{opacity:1;transform:none}}
}