:root{--bg:#0f1419;--pn:#171d25;--pn2:#1e2630;--tx:#e6e9ee;--mu:#8b97a7;--ac:#2f7df6;--ok:#3ec28f;--wa:#f0b429;--ko:#ef5b5b;--ln:#2a3441}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--tx);font:14px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
a{color:var(--ac)}h1{font-size:20px;margin:0 0 14px}h2{font-size:15px;margin:0 0 10px}
.logo{display:flex;align-items:center;gap:9px;font-weight:700;font-size:21px;letter-spacing:-.5px;margin-right:14px}.logo img{width:28px;height:28px;display:block}.logo i{font-style:normal;color:var(--ac)}.logo.grande{font-size:34px;gap:12px;margin:0 0 20px}.logo.grande img{width:42px;height:42px}
.top{display:flex;align-items:center;gap:6px;padding:10px 20px;border-bottom:1px solid var(--ln);background:#0b0f14;flex-wrap:wrap}
.top .sp{flex:1}.top .me{color:var(--mu);font-size:13px}
.tab{background:none;border:0;color:var(--mu);padding:7px 12px;border-radius:8px;cursor:pointer;font:inherit}.tab.on{background:var(--ac);color:#fff}
main{max-width:1240px;margin:0 auto;padding:22px 24px}
.card{background:var(--pn);border:1px solid var(--ln);border-radius:12px;padding:16px;margin-bottom:16px}
.grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.kpi{background:var(--pn2);border-radius:10px;padding:12px}.kpi small{color:var(--mu);display:block}.kpi strong{font-size:20px}
table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--ln);vertical-align:top}th{color:var(--mu);font-weight:500;font-size:12px}
input,select,textarea{background:#0b0f14;color:var(--tx);border:1px solid var(--ln);border-radius:8px;padding:8px 10px;font:inherit;width:100%}
label{display:block;color:var(--mu);font-size:12px;margin:8px 0 3px}
button.b{background:var(--ac);color:#fff;border:0;border-radius:8px;padding:8px 14px;cursor:pointer;font:inherit}button.b.g{background:var(--pn2);color:var(--tx);border:1px solid var(--ln)}button.b.r{background:#5a2328}
button.b:disabled{opacity:.5}.row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}.row>*{flex:1;min-width:150px}.row>.fix{flex:0 0 auto;min-width:0}
.pill{display:inline-block;padding:1px 9px;border-radius:99px;font-size:12px;background:var(--pn2);color:var(--mu)}.pill.ok{color:var(--ok)}.pill.wa{color:var(--wa)}.pill.ko{color:var(--ko)}
.bar{height:10px;background:var(--pn2);border-radius:6px;overflow:hidden;margin:6px 0}.bar i{display:block;height:100%;background:var(--ok)}.bar i.wa{background:var(--wa)}.bar i.ko{background:var(--ko)}
.msg{padding:10px 12px;border-radius:8px;margin-bottom:12px;background:#3a2a10;color:#ffd78a}.msg.ok{background:#12372a;color:#9be3c4}.msg.ko{background:#40181b;color:#ffb3b3}
.login{max-width:360px;margin:12vh auto;padding:0 16px}.mu{color:var(--mu)}.chk{display:flex;gap:8px;align-items:center;margin:4px 0;color:var(--tx);font-size:14px}.chk input{width:auto}
.bar i.ind{width:35%;animation:ind 1.2s ease-in-out infinite alternate}@keyframes ind{from{margin-left:0}to{margin-left:65%}}
table.gare tr.cl{cursor:pointer}table.gare tr.cl:hover td{background:var(--pn2)}
.ov{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:30;padding:16px}.dlg{max-width:440px;width:100%;margin:0}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(640px,100%);background:var(--bg);border-left:1px solid var(--ln);padding:18px;overflow:auto;z-index:20;box-shadow:-10px 0 30px rgba(0,0,0,.4)}
.kvs{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}.kv small{color:var(--mu);display:block;font-size:12px}
@media(max-width:700px){main{padding:12px}.top{padding:8px 10px}}

/* colori dei menu: viola = c'è l'AI, verde acqua = strategia */
.card.ai{border-left:3px solid #8b5cf6}.card.str{border-left:3px solid #14b8a6}
.card.ai>h2:first-child::after,.card.str>h2:first-child::after{font-size:11px;font-weight:600;border-radius:99px;padding:1px 8px;margin-left:8px;vertical-align:2px}
.card.ai>h2:first-child::after{content:"AI";background:#8b5cf620;color:#b99cf8}.card.str>h2:first-child::after{content:"strategia";background:#14b8a620;color:#4fd1c0}


/* ---------- menu a sinistra ---------- */
.layout{display:flex;min-height:100vh}.cont{flex:1;min-width:0}
.side{width:224px;flex:0 0 224px;background:#0b0f14;border-right:1px solid var(--ln);position:sticky;top:0;height:100vh;overflow:auto;display:flex;flex-direction:column;padding:14px 10px 12px}
.side .logo{margin:2px 8px 14px}
.side .gruppo{margin-bottom:8px}.side h4{margin:10px 10px 4px;font-size:11px;font-weight:600;letter-spacing:.7px;text-transform:uppercase;color:#5d6b7d}
.side .tab{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:7px 10px;color:#b4bfcd;border-radius:8px}.side .tab:hover{background:var(--pn)}
.side .tab.on{background:var(--pn2);color:#fff;font-weight:600;box-shadow:inset 3px 0 0 var(--ac)}
.pt{display:inline-block;width:8px;height:8px;border-radius:50%;flex:none;background:transparent}
.pt.ai,.tab.ai .pt{background:#8b5cf6}.pt.str,.tab.str .pt{background:#14b8a6}.pt.adatta,.tab.adatta .pt{background:#f0b429}
.side .sp{flex:1;min-height:12px}
.leg{display:flex;flex-wrap:wrap;gap:4px 12px;padding:8px 10px;margin-bottom:6px;border:1px solid var(--ln);border-radius:8px;font-size:12px;color:var(--mu)}.leg span{display:inline-flex;align-items:center;gap:5px;cursor:help}
.side .utente{border-top:1px solid var(--ln);padding-top:10px}.side .utente .nome{font-weight:600;padding:0 10px}.side .utente .mu{font-size:12px;padding:0 10px 6px;word-break:break-word}
.mbar{display:none}
@media(max-width:860px){.layout{flex-direction:column}.mbar{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:#0b0f14;border-bottom:1px solid var(--ln);position:sticky;top:0;z-index:15}.mbar .logo{margin:0}
 .side{display:none;position:fixed;inset:48px 0 0 0;width:auto;height:auto;z-index:14}.side.aperto{display:flex}main{padding:14px 12px}}
/* barra di ricerca stile Google */
.barra{margin-bottom:6px}.sq-box{display:flex;gap:8px;position:relative}.sq{font-size:16px;padding:11px 14px;border-radius:10px}.sq:focus{outline:2px solid var(--ac);border-color:transparent}
.sug{position:absolute;left:0;right:110px;top:100%;margin-top:4px;background:var(--pn);border:1px solid var(--ln);border-radius:10px;z-index:10;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.45)}.sug[hidden],.guida[hidden]{display:none}
.sug-v{display:flex;justify-content:space-between;gap:12px;padding:8px 14px;cursor:pointer}.sug-v small{color:var(--mu)}.sug-v.on,.sug-v:hover{background:var(--pn2)}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.chips:empty{display:none}
.chip{display:inline-flex;align-items:center;gap:6px;background:#1a2a44;color:#9cc2ff;border-radius:99px;padding:2px 4px 2px 11px;font-size:13px}.chip.ko{background:#40181b;color:#ffb3b3}
.chip button{background:none;border:0;color:inherit;cursor:pointer;font-size:16px;line-height:1;padding:0 6px}
.guida{margin-top:10px;padding:12px;background:var(--pn2);border-radius:10px}.guida table td{padding:3px 10px 3px 0;border:0}.guida code,.guida a{font-family:ui-monospace,Menlo,monospace;font-size:13px}.guida code{color:#9cc2ff}.esempi{display:flex;flex-wrap:wrap;gap:6px 16px;margin:6px 0 8px}
.filtri{margin-top:10px}.filtri label{margin-top:0}
button.tg.on{background:var(--ac);border-color:var(--ac);color:#fff}.fasce{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}.fasce .fix{flex:1}
/* pannello laterale: concorrenti e schede sovrapposte */
.drawer.conc{width:min(700px,100%)}.drawer.sopra{z-index:25;width:min(620px,96%);box-shadow:-14px 0 40px rgba(0,0,0,.6)}
table.gare tr.cl.sel td{background:#16233a}
.drawer.conc .kvs{grid-template-columns:repeat(4,minmax(0,1fr))}
/* con il pannello del concorrente aperto, l'elenco a sinistra si restringe invece di restare coperto (solo su schermi larghi) */
@media(min-width:1280px){body:has(.drawer.conc) .cont{margin-right:700px}}
@media(max-width:860px){.side .logo{display:none}}

/* Assistente */
.chat-fab{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:30;display:flex;align-items:center;gap:8px;background:var(--ac);color:#fff;border:0;border-radius:999px;padding:12px 18px;font:600 14px system-ui;cursor:pointer;box-shadow:0 6px 20px #0008}.chat-fab .pt{background:#fff}
.chat-pan{display:none;position:fixed;right:max(16px,env(safe-area-inset-right));bottom:76px;z-index:31;width:380px;max-width:calc(100vw - 24px);height:min(560px,calc(100vh - 110px));background:var(--pn);border:1px solid var(--ln);border-radius:14px;box-shadow:0 12px 40px #000a;flex-direction:column;overflow:hidden}.chat-pan.on{display:flex}
.chat-hd{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-bottom:1px solid var(--ln)}.chat-hd .b{padding:2px 10px}
.chat{display:flex;flex-direction:column;min-height:0;flex:1}.chat-pan .chat{flex:1}
.chat-log{flex:1;overflow:auto;padding:12px;display:flex;flex-direction:column;gap:8px;min-height:220px;max-height:60vh}.chat-pan .chat-log{max-height:none}
.cm{max-width:88%;padding:8px 11px;border-radius:12px;white-space:pre-wrap;word-break:break-word;font-size:14px}.cm.a{background:var(--pn2);align-self:flex-start}.cm.u{background:var(--ac);color:#fff;align-self:flex-end}
.chat-sugg{display:flex;flex-direction:column;gap:6px;align-items:flex-start}.chat-sugg .b{text-align:left}
.chat-in{display:flex;gap:8px;padding:8px 10px;border-top:1px solid var(--ln)}.chat-in textarea{flex:1;resize:none;background:#0b0f14;color:var(--tx);border:1px solid var(--ln);border-radius:8px;padding:8px;font:inherit;font-size:16px;max-height:90px}
.chat-ft{padding:6px 12px 10px;font-size:12px;color:var(--mu)}
/* Demo */
.demo-bar{white-space:nowrap;overflow:hidden;position:fixed;top:0;left:0;right:0;z-index:40;background:#7c3aed;color:#fff;text-align:center;font:600 12px system-ui;padding:5px 8px}body:has(.demo-bar){padding-top:26px}body:has(.demo-bar) .side{top:26px;height:calc(100vh - 26px)}
.demo-box{margin-top:18px;max-width:420px;text-align:left;border-color:#7c3aed}.demo-cred{display:flex;gap:22px;margin:0 0 14px}.demo-cred small{display:block;color:var(--mu)}.demo-cred code{font-size:15px;user-select:all}
/* Telefono (PWA) */
html{-webkit-text-size-adjust:100%}button,.b,.tab,select{min-height:38px}input,select,textarea{font-size:16px}
@media(max-width:860px){
 .mbar{padding-top:max(8px,env(safe-area-inset-top))}.side{inset:calc(48px + env(safe-area-inset-top)) 0 0 0;padding-bottom:max(12px,env(safe-area-inset-bottom))}
 body:has(.demo-bar) .mbar{top:26px}body:has(.demo-bar) .side{top:calc(74px + env(safe-area-inset-top));height:auto}
 .chat-pan{right:0;left:0;bottom:0;width:auto;max-width:none;height:85vh;border-radius:14px 14px 0 0}.chat-fab{bottom:max(14px,env(safe-area-inset-bottom))}
 .drawer{width:100vw!important;max-width:100vw!important}.dlg{width:calc(100vw - 20px)!important;max-width:none}
 table{font-size:13px}.grid{grid-template-columns:1fr 1fr!important}.row{flex-direction:column;align-items:stretch}
}
@media(display-mode:standalone){body{overscroll-behavior-y:contain}}

.demo-link{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:14px;margin-top:24px;padding:16px 22px;border-radius:16px;text-decoration:none;color:#fff;background:linear-gradient(120deg,#7c3aed,#2f7df6,#14b8a6,#7c3aed);background-size:300% 100%;animation:dgrad 8s linear infinite;box-shadow:0 10px 30px #7c3aed55,inset 0 1px 0 #ffffff40;transition:transform .18s,box-shadow .18s}
.demo-link:hover{transform:translateY(-3px) scale(1.01);box-shadow:0 16px 40px #7c3aed88,inset 0 1px 0 #ffffff55}.demo-link:active{transform:translateY(-1px)}
.demo-link::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,#ffffff40,transparent);transform:skewX(-20deg);animation:dshine 4.5s ease-in-out infinite}
.demo-link b{font-size:19px;font-weight:700;letter-spacing:.3px}.demo-link .dl-fr{font-size:22px;line-height:1;transition:transform .18s}.demo-link:hover .dl-fr{transform:translateX(5px)}
.demo-link .dl-ic{position:relative;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#ffffff2e}.demo-link .dl-ic i{width:0;height:0;border-left:10px solid #fff;border-top:6px solid transparent;border-bottom:6px solid transparent;margin-left:3px}
.demo-link .dl-ic::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #fff;opacity:.6;animation:dping 2.2s ease-out infinite}
@keyframes dgrad{to{background-position:300% 0}}@keyframes dshine{0%,60%{left:-60%}100%{left:130%}}@keyframes dping{0%{transform:scale(1);opacity:.6}100%{transform:scale(1.7);opacity:0}}
@media(prefers-reduced-motion:reduce){.demo-link,.demo-link::after,.demo-link .dl-ic::before{animation:none}}
/* pannelli (schede gara, concorrenti) su telefono: scorrono da soli, il fondo resta fermo, «Chiudi» sempre raggiungibile */
.drawer{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y}
.drawer>div:first-child{position:sticky;top:-18px;z-index:3;background:var(--bg);margin:-18px -18px 0;padding:calc(12px + env(safe-area-inset-top)) 18px 10px;border-bottom:1px solid var(--ln)}
@media(max-width:900px){
 .drawer{top:0;left:0;right:0;bottom:auto;height:100vh;height:100dvh;width:100vw!important;padding-bottom:calc(90px + env(safe-area-inset-bottom))}
 body:has(.drawer){overflow:hidden}
 body:has(.drawer) .chat-fab{display:none}
}
a.b{display:inline-block;text-decoration:none;background:var(--ac);color:#fff;border:0;border-radius:8px;padding:8px 14px;font:inherit;cursor:pointer}a.b.g{background:var(--pn2);color:var(--tx);border:1px solid var(--ln)}