/* Pannello "Agente Claude" — tutto è confinato dentro #agentDesk per non toccare lo stile della control room.
   Le variabili di colore valgono anche per #companyDesk ("Approfondimento azienda", company_desk.css). */
#agentDesk, #companyDesk, #nrcAskSlot{
  --ad-bg:#eef1f4; --ad-panel:#ffffff; --ad-ink:#14202b; --ad-muted:#5d6b78; --ad-line:#d6dde4;
  --ad-accent:#c2620a; --ad-accent-soft:#fbe9d8;
  --ad-up:#13795b; --ad-up-soft:#dcf1e8; --ad-down:#b4232f; --ad-down-soft:#f8dfe1; --ad-wait:#6b5b00; --ad-wait-soft:#f3edc8;
  --ad-grid:#e5eaef;
  --ad-f-body:inherit;
  --ad-f-data:"IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --ad-r:10px;
  color:var(--ad-ink); font-size:14px; line-height:1.45;
}
@media (prefers-color-scheme: dark){ html:not([data-theme="light"]) #agentDesk, html:not([data-theme="light"]) #companyDesk, html:not([data-theme="light"]) #nrcAskSlot{
  --ad-bg:#0f1720; --ad-panel:#16212c; --ad-ink:#e4ebf1; --ad-muted:#93a3b2; --ad-line:#283643;
  --ad-accent:#f0a14a; --ad-accent-soft:#3a2a17;
  --ad-up:#3fbf8f; --ad-up-soft:#173329; --ad-down:#ef6f78; --ad-down-soft:#3a1d22; --ad-wait:#d9c35a; --ad-wait-soft:#33301a;
  --ad-grid:#1f2c38; }}
html[data-theme="dark"] #agentDesk, #agentDesk[data-theme="dark"], html[data-theme="dark"] #companyDesk, html[data-theme="dark"] #nrcAskSlot{
  --ad-bg:#0f1720; --ad-panel:#16212c; --ad-ink:#e4ebf1; --ad-muted:#93a3b2; --ad-line:#283643;
  --ad-accent:#f0a14a; --ad-accent-soft:#3a2a17;
  --ad-up:#3fbf8f; --ad-up-soft:#173329; --ad-down:#ef6f78; --ad-down-soft:#3a1d22; --ad-wait:#d9c35a; --ad-wait-soft:#33301a;
  --ad-grid:#1f2c38; }

#agentDesk *{box-sizing:border-box}
#agentDesk [hidden]{display:none !important}
#agentDesk .ad-wrap{display:flex; flex-direction:column; gap:16px; min-width:0}
#agentDesk h2{font-size:13px; text-transform:uppercase; letter-spacing:.08em; font-weight:700; color:var(--ad-muted); margin:0}
#agentDesk h3{margin:0}
#agentDesk .num{font-family:var(--ad-f-data); font-variant-numeric:tabular-nums}
#agentDesk .muted{color:var(--ad-muted)}
#agentDesk .small{font-size:12px}
#agentDesk button{font:inherit; cursor:pointer; border-radius:8px; border:1px solid var(--ad-line); background:var(--ad-panel); color:var(--ad-ink); padding:7px 12px}
#agentDesk button:hover{border-color:var(--ad-muted)}
#agentDesk button:focus-visible, #agentDesk a:focus-visible, #agentDesk tr:focus-visible{outline:2px solid var(--ad-accent); outline-offset:2px}
#agentDesk button.primary{background:var(--ad-ink); color:var(--ad-bg); border-color:var(--ad-ink)}
/* control_room.css forza ogni .primary/.approve a verde con !important: il pannello tiene i suoi colori */
#agentDesk button.primary, #agentDesk button.approve{background:var(--ad-ink)!important; color:var(--ad-bg)!important; border-color:var(--ad-ink)!important}
#agentDesk button.danger{color:var(--ad-down); border-color:var(--ad-down)}
#agentDesk button[disabled]{opacity:.55; cursor:default}
#agentDesk a{color:inherit}

#agentDesk .ad-head{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px 18px}
#agentDesk .ad-brand{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap}
#agentDesk .ad-brand h1{font-size:22px; margin:0; letter-spacing:-.01em}
#agentDesk .ad-actions{display:flex; gap:8px; flex-wrap:wrap; align-items:center}
#agentDesk .pill{display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; padding:3px 9px; border-radius:999px; background:var(--ad-grid); color:var(--ad-muted); white-space:nowrap}
#agentDesk .pill.up{background:var(--ad-up-soft); color:var(--ad-up)} #agentDesk .pill.down{background:var(--ad-down-soft); color:var(--ad-down)}
#agentDesk .pill.wait{background:var(--ad-wait-soft); color:var(--ad-wait)} #agentDesk .pill.acc{background:var(--ad-accent-soft); color:var(--ad-accent)}
#agentDesk .banner{border:1px solid var(--ad-line); background:var(--ad-panel); border-radius:var(--ad-r); padding:10px 14px}
#agentDesk .banner.err{border-color:var(--ad-down); color:var(--ad-down)}

#agentDesk .ad-top{display:grid; grid-template-columns:minmax(0,1fr); gap:16px}
/* restyling: watchlist dell'agente in una colonna a destra del grafico, alta quanto grafico + piano
   (agent_watchlist.js la mette nello slot; scorre dentro se le schede sono tante). Sotto 1100px torna sotto. */
#agentDesk .ad-plan-body{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:16px; align-items:stretch}
#agentDesk .ad-plan-main{display:flex; flex-direction:column; gap:12px; min-width:0}
#agentDesk .ad-wl-slot{position:relative; min-width:0; min-height:260px}
#agentDesk .ad-wl-slot > #awlSection{position:absolute; inset:0; overflow-y:auto; overscroll-behavior:contain}
/* "Rendimento del metodo" sotto il piano, in tre colonne: statistiche, piani in corso, ultimi esiti */
#agentDesk .ad-method{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); grid-template-rows:auto auto; grid-auto-flow:column; gap:10px 24px; align-items:start}
@media (max-width:1100px){
  #agentDesk .ad-plan-body{grid-template-columns:minmax(0,1fr)}
  #agentDesk .ad-wl-slot{min-height:0}
  #agentDesk .ad-wl-slot > #awlSection{position:static; overflow:visible}
}
@media (max-width:760px){ #agentDesk .ad-method{grid-template-columns:minmax(0,1fr); grid-auto-flow:row} }
#agentDesk .panel{background:var(--ad-panel); border:1px solid var(--ad-line); border-radius:var(--ad-r); padding:16px; display:flex; flex-direction:column; gap:12px; min-width:0}
#agentDesk .panel-head{display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap}

/* approvazioni */
#agentDesk .appr{display:flex; flex-direction:column; gap:10px}
#agentDesk .appr-card{border:1px solid var(--ad-line); border-left:3px solid var(--ad-accent); border-radius:8px; padding:12px; display:flex; flex-direction:column; gap:8px}
#agentDesk .appr-card.done{border-left-color:var(--ad-line)}
#agentDesk .appr-row{display:flex; flex-wrap:wrap; gap:8px 14px; align-items:baseline}
#agentDesk .appr-row strong{font-size:17px}
#agentDesk .appr-lv{display:flex; flex-wrap:wrap; gap:6px 16px; font-family:var(--ad-f-data); font-size:13px}
#agentDesk .appr-lv .s{color:var(--ad-down)} #agentDesk .appr-lv .t{color:var(--ad-up)} #agentDesk .appr-lv .e{color:var(--ad-accent)}
#agentDesk .appr-msg{font-size:13px}
#agentDesk .appr [data-price]{color:var(--ad-muted)}
#agentDesk button.linkish{background:none; border:0; padding:4px 0; color:var(--ad-accent); cursor:pointer; font:inherit; font-size:13px; align-self:flex-start}
#agentDesk .appr-msg.err{color:var(--ad-down)}

/* piano */
#agentDesk .hero-title{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap}
#agentDesk .hero-title h3{font-size:30px; line-height:1}
#agentDesk .chart{height:520px; width:100%; min-width:0}
/* grafico compatto in Oggi (app shell): altezza fissa (nessun salto quando arrivano i dati), sola lettura */
#agentDesk .ad-mini .panel-head{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap}
#agentDesk .ad-mini .panel-head h2{margin:0}
#agentDesk .ad-mini-chart{height:260px; width:100%; min-width:0; touch-action:pan-y}
#agentDesk .ad-mini-empty{display:grid; place-items:center; height:260px; margin:0; text-align:center}
#agentDesk .ad-mini-empty[hidden]{display:none}
#agentDesk .ad-mini-legend{margin:8px 0 0}
/* piano mostrato nel grafico (compatto in Oggi e completo in Analisi): toccando un piano si passa a quell'asset */
#agentDesk .appr-card[data-sym]{cursor:pointer}
#agentDesk .appr-card[data-selected]{border-color:var(--ad-accent); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ad-accent) 35%, transparent)}
#agentDesk .appr-chart{display:block; font-size:13px}
#agentDesk .appr-chart[aria-pressed="true"]{color:var(--ad-accent); font-weight:700}
@media (max-width:767px){ #agentDesk .appr-chart{min-height:44px} }
@media (max-width:767px){ #agentDesk :is(.ad-mini-chart, .ad-mini-empty){height:220px} #agentDesk .ad-mini-open{min-height:44px} }
/* checkpoint 23: riga "Chiedi a Claude"; restyling: riquadro con la rete neurale (canvas di ask_network.js, colore
   --ad-net o l'accento) e campo + microfono + "Chiedi". Vive nella finestra a comparsa (#nrcAskSlot dentro
   #nrcAskSheet, agent_desk.js ci sposta il nodo); senza la finestra resta nel pannello: le regole valgono in entrambi. */
#nrcAskSlot{color:var(--ad-ink); font-size:14px; line-height:1.45}
#nrcAskSlot *{box-sizing:border-box}
#nrcAskSlot [hidden]{display:none !important}
#nrcAskSlot button{font:inherit; cursor:pointer; border-radius:8px; border:1px solid var(--ad-line); background:var(--ad-panel); color:var(--ad-ink); padding:7px 12px}
#nrcAskSlot button.primary{background:var(--ad-ink)!important; color:var(--ad-bg)!important; border-color:var(--ad-ink)!important}
#nrcAskSlot :is(button, input):focus-visible{outline:2px solid var(--ad-accent); outline-offset:2px}
#nrcAskSlot .muted{color:var(--ad-muted)} #nrcAskSlot .small{font-size:12px}
:is(#agentDesk, #nrcAskSlot) .ask-row{display:flex; flex-wrap:wrap; align-items:stretch; gap:16px; padding:14px 16px; border:1px solid var(--ad-line); border-radius:var(--ad-r); background:var(--ad-panel)}
:is(#agentDesk, #nrcAskSlot) .ask-net{flex:0 0 260px; height:104px; min-width:0; border-radius:calc(var(--ad-r) - 2px); background:color-mix(in srgb, var(--ad-ink) 3%, transparent); overflow:hidden}
:is(#agentDesk, #nrcAskSlot) .ask-net canvas{display:block; width:100%; height:100%}
:is(#agentDesk, #nrcAskSlot) .ask-main{flex:1 1 320px; min-width:0; display:flex; flex-direction:column; justify-content:center; gap:8px}
:is(#agentDesk, #nrcAskSlot) .ask-top{display:flex; align-items:baseline; justify-content:space-between; gap:10px; flex-wrap:wrap}
:is(#agentDesk, #nrcAskSlot) .ask-label{font-weight:700; white-space:nowrap}
:is(#agentDesk, #nrcAskSlot) .ask-state{font-variant-numeric:tabular-nums}
:is(#agentDesk, #nrcAskSlot) .ask-controls{display:flex; align-items:center; gap:8px}
:is(#agentDesk, #nrcAskSlot) .ask-row input{flex:1 1 260px; min-width:0; font:inherit; color:var(--ad-ink); background:var(--ad-bg); border:1px solid var(--ad-line); border-radius:8px; padding:9px 11px}
:is(#agentDesk, #nrcAskSlot) .ask-controls [data-id="askMic"]{display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; padding:0; flex:none}
:is(#agentDesk, #nrcAskSlot) .ask-controls [data-id="askMic"] svg{flex:none; width:16px; height:16px}
:is(#agentDesk, #nrcAskSlot) .ask-row button[aria-pressed="true"]{border-color:var(--ad-down); color:var(--ad-down)}
:is(#agentDesk, #nrcAskSlot) .ask-msg{flex-basis:100%; margin:0}
:is(#agentDesk, #nrcAskSlot) .ask-msg.err{color:var(--ad-down)}
@media (max-width:767px){ :is(#agentDesk, #nrcAskSlot) .ask-net{flex-basis:100%; height:64px} :is(#agentDesk, #nrcAskSlot) .ask-controls{flex-wrap:wrap} }
/* telefono: campo e microfono sulla stessa riga, "Chiedi" a riga intera sotto (mai a capo in modo disordinato) */
@media (max-width:767px){
  :is(#agentDesk, #nrcAskSlot) .ask-controls input{flex:1 1 0; width:0; min-width:0}
  :is(#agentDesk, #nrcAskSlot) .ask-controls [data-id="askMic"]{order:1}
  :is(#agentDesk, #nrcAskSlot) .ask-controls [data-id="askBtn"]{order:2; flex:1 1 100%}
}
/* nella finestra a comparsa (app shell): il riquadro della finestra fa da cornice; rete in alto, poi campo +
   microfono + Chiedi, poi lo stato in testo e il messaggio. L'etichetta resta per i lettori di schermo (il titolo
   visibile è quello della finestra). Schermo basso: rete ridotta. */
html:root #nrcAskSlot .ask-row.ask-sheet{flex-direction:column; flex-wrap:nowrap; gap:12px; padding:0; border:0; border-radius:0; background:none; box-shadow:none}
#nrcAskSlot .ask-sheet .ask-net{flex:none; width:100%; height:120px}
#nrcAskSlot .ask-sheet .ask-main{flex:none; width:100%; gap:8px}
#nrcAskSlot .ask-sheet .ask-top{display:contents}
#nrcAskSlot .ask-sheet .ask-label{position:absolute; width:1px; height:1px; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
#nrcAskSlot .ask-sheet .ask-controls{order:1}
#nrcAskSlot .ask-sheet .ask-state{order:2}
#nrcAskSlot .ask-sheet .ask-msg{order:3; overflow-wrap:anywhere}
@media (max-width:767px){ #nrcAskSlot .ask-sheet .ask-net{height:96px} }
@media (max-height:560px){ #nrcAskSlot .ask-sheet .ask-net{height:56px} }
/* checkpoint 21: grafico a tutta larghezza, barra sopra e schede sotto (il riquadro a destra è stato tolto) */
#agentDesk .pat-bar{display:flex; flex-direction:column; gap:6px; margin-bottom:8px}
#agentDesk .pat-bar-row{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:6px 14px}
#agentDesk .pat-title{display:flex; flex-wrap:wrap; align-items:center; gap:8px}
#agentDesk .pat-title h3{margin:0; font-size:22px}
#agentDesk .pat-right{text-align:right}
#agentDesk .pat-pills{display:flex; flex-wrap:wrap; gap:6px}
#agentDesk .pat-pill{border-radius:999px; padding:3px 12px; font-size:12px}
#agentDesk .pat-pill[aria-pressed="true"]{background:var(--ad-ink); color:var(--ad-bg); border-color:var(--ad-ink)}
#agentDesk .pat-cards{margin-top:10px}
#agentDesk .pat-card-grid{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:10px}
#agentDesk .pat-card{border:1px solid var(--ad-line); border-radius:8px; padding:10px 12px; min-width:0}
#agentDesk .pat-card h4{margin:0 0 6px; font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:var(--ad-muted)}
#agentDesk .pat-card p{margin:2px 0}
#agentDesk .pat-card ul{list-style:none; margin:0; padding:0}
#agentDesk .pat-card li{display:flex; justify-content:space-between; gap:8px; font-size:12px}
#agentDesk .pat-score{font-size:20px; font-weight:700}
#agentDesk .pat-progress{height:8px; border-radius:999px; background:var(--ad-grid); overflow:hidden; margin-top:6px}
#agentDesk .pat-progress span{display:block; height:100%; background:var(--ad-accent)}
#agentDesk .pat-note{margin-top:8px}
@media (max-width:960px){ #agentDesk .pat-card-grid{grid-template-columns:repeat(2, minmax(0,1fr))} #agentDesk .pat-right{text-align:left} }
@media (max-width:560px){ #agentDesk .pat-card-grid{grid-template-columns:minmax(0,1fr)} }
#agentDesk .asset-sel{display:flex; gap:6px; align-items:center}
#agentDesk .asset-sel select{font:inherit; color:var(--ad-ink); background:var(--ad-panel); border:1px solid var(--ad-line); border-radius:8px; padding:5px 8px}
#agentDesk .chart-empty{height:380px; display:grid; place-items:center; color:var(--ad-muted); border:1px dashed var(--ad-line); border-radius:8px; text-align:center; padding:16px}
#agentDesk .ticket{display:grid; grid-template-columns:repeat(auto-fit,minmax(118px,1fr)); gap:1px; background:var(--ad-line); border:1px solid var(--ad-line); border-radius:8px; overflow:hidden}
#agentDesk .ticket div{background:var(--ad-panel); padding:9px 11px; display:flex; flex-direction:column; gap:2px; min-width:0}
#agentDesk .ticket .k{font-size:11px; text-transform:uppercase; letter-spacing:.07em; color:var(--ad-muted)}
#agentDesk .ticket .v{font-family:var(--ad-f-data); font-size:15px; font-variant-numeric:tabular-nums}
#agentDesk .ticket .v.stop{color:var(--ad-down)} #agentDesk .ticket .v.tp{color:var(--ad-up)} #agentDesk .ticket .v.en{color:var(--ad-accent)}
#agentDesk .why{max-width:72ch; margin:0}
#agentDesk .notes{font-size:13px; color:var(--ad-muted); margin:0; padding-left:18px}
#agentDesk .company{border:1px solid var(--ad-line); border-radius:8px; padding:10px 12px; font-size:13px}
#agentDesk .tabs{display:flex; gap:6px; flex-wrap:wrap}
#agentDesk .tabs button[aria-pressed="true"]{background:var(--ad-ink); color:var(--ad-bg); border-color:var(--ad-ink)}
#agentDesk .tf button{padding:4px 10px; font-family:var(--ad-f-data); font-size:12px}
#agentDesk .mtf{display:flex; gap:8px; flex-wrap:wrap; align-items:center; font-size:12px; color:var(--ad-muted)}

/* laterale */
#agentDesk .stats{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
#agentDesk .stat{border:1px solid var(--ad-line); border-radius:8px; padding:10px 12px; min-width:0}
#agentDesk .stat .k{font-size:11px; text-transform:uppercase; letter-spacing:.07em; color:var(--ad-muted)}
#agentDesk .stat .v{font-family:var(--ad-f-data); font-size:21px; font-variant-numeric:tabular-nums}
#agentDesk .stat .s{font-size:12px; color:var(--ad-muted)}
#agentDesk .list{display:flex; flex-direction:column}
#agentDesk .row{display:flex; justify-content:space-between; gap:10px; padding:8px 0; border-top:1px solid var(--ad-line); align-items:center}
#agentDesk .row:first-child{border-top:0}
#agentDesk .row .l{min-width:0}

/* scanner */
#agentDesk .scan-wrap{overflow-x:auto}
#agentDesk table{border-collapse:collapse; width:100%; min-width:720px}
#agentDesk table.mini{min-width:0}
#agentDesk th{font-size:11px; text-transform:uppercase; letter-spacing:.07em; color:var(--ad-muted); text-align:left; font-weight:600; padding:6px 10px; border-bottom:1px solid var(--ad-line)}
#agentDesk td{padding:8px 10px; border-bottom:1px solid var(--ad-line); vertical-align:middle}
#agentDesk tbody tr[data-sym]{cursor:pointer}
#agentDesk tbody tr[data-sym]:hover td{background:var(--ad-bg)}
#agentDesk tbody tr[aria-selected="true"] td{background:var(--ad-accent-soft)}
#agentDesk td.r, #agentDesk th.r{text-align:right}
#agentDesk .bar{width:90px; height:6px; background:var(--ad-grid); border-radius:3px; overflow:hidden; display:inline-block; vertical-align:middle}
#agentDesk .bar i{display:block; height:100%; background:var(--ad-accent)}
#agentDesk .reason{font-size:12px; color:var(--ad-muted); max-width:42ch}
#agentDesk svg.spark{display:block}

/* notizie, calendario, metodo, lezioni */
#agentDesk .news{display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:12px}
#agentDesk .news article{border:1px solid var(--ad-line); border-radius:8px; padding:12px; display:flex; flex-direction:column; gap:6px; min-width:0}
#agentDesk .news h4{margin:0; font-size:15px; font-weight:600; line-height:1.3}
#agentDesk .news h4 a{text-decoration:none} #agentDesk .news h4 a:hover{text-decoration:underline}
#agentDesk .news .meta{display:flex; flex-wrap:wrap; gap:6px; align-items:center; font-size:12px; color:var(--ad-muted)}
#agentDesk .news p{margin:0; font-size:13px; color:var(--ad-muted); display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden}
#agentDesk .cal{display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:12px}
#agentDesk .day{display:flex; flex-direction:column; gap:6px; min-width:0}
#agentDesk .day h4{margin:0; font-size:12px; text-transform:uppercase; letter-spacing:.07em; color:var(--ad-muted); font-weight:600}
#agentDesk .ev{border:1px solid var(--ad-line); border-left:3px solid var(--ad-line); border-radius:6px; padding:7px 9px; display:flex; flex-direction:column; gap:2px}
#agentDesk .ev.high{border-left-color:var(--ad-down)} #agentDesk .ev.medium{border-left-color:var(--ad-wait)}
#agentDesk .ev .t{display:flex; gap:6px; align-items:baseline; font-size:12px; color:var(--ad-muted)}
#agentDesk .ev .n{font-weight:600; font-size:13px; line-height:1.3}
#agentDesk .ev .c{font-size:12px; color:var(--ad-muted)}
#agentDesk .ev.past{opacity:.6}
#agentDesk .two{display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:16px}
#agentDesk .col{display:flex; flex-direction:column; gap:10px; min-width:0}
#agentDesk h3.sub{font-size:12px; text-transform:uppercase; letter-spacing:.07em; color:var(--ad-muted); font-weight:600; margin:4px 0 0}
#agentDesk .hist .row{align-items:flex-start}
#agentDesk .hist .d{font-family:var(--ad-f-data); font-size:12px; color:var(--ad-muted); white-space:nowrap}
#agentDesk .hist .t{font-size:13px; flex:1; min-width:0}

@media (max-width:960px){ #agentDesk .ad-top{grid-template-columns:minmax(0,1fr)} #agentDesk .chart, #agentDesk .chart-empty{height:340px} #agentDesk .hero-title h3{font-size:26px} }
@media (prefers-reduced-motion: reduce){ #agentDesk *, #nrcAskSlot *{transition:none!important; animation:none!important} }
#agentDesk .ad-capital{display:inline-flex; flex-wrap:wrap; align-items:center; gap:6px; color:var(--ad-muted)}

/* grafico a schermo intero (telefono): pulsante sopra il grafico solo sotto i 768px; overlay fisso a tutto
   schermo che funziona anche senza l'API (aree sicure dell'iPhone rispettate) */
#agentDesk .chart-wrap{position:relative; min-width:0}
#agentDesk .chart-full-btn{display:none}
/* gesti: sul grafico il browser lascia passare solo lo scorrimento verticale della pagina; trascinamento
   orizzontale e pizzico li gestisce il grafico. Fuori dal grafico nulla cambia. A schermo intero: tutto al grafico. */
#agentDesk .chart{touch-action:pan-y}
#agentDesk .chart-wrap.is-full .chart{touch-action:none}
@media (max-width:767px){
  #agentDesk .chart-full-btn{display:inline-flex!important; align-items:center; gap:8px; min-height:44px; margin:0 0 8px auto; padding:8px 14px}
  #agentDesk .chart-wrap{display:flex; flex-direction:column}
}
#agentDesk .chart-wrap.is-full{position:fixed; inset:0; z-index:200; display:flex; flex-direction:column; gap:8px;
  padding:max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));
  background:var(--ad-bg-full, #0C0E12)}
#agentDesk .chart-wrap.is-full .chart-full-btn{display:none!important}
#agentDesk .chart-wrap.is-full .chart{flex:1 1 auto; height:auto!important; min-height:0; width:auto; margin:0}
#agentDesk .chart-full-bar{display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:44px}
#agentDesk .chart-full-bar strong{font-size:16px; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
#agentDesk .chart-close{min-height:44px; padding:8px 16px; font-weight:700}
html.nrc-chart-full, html.nrc-chart-full body{overflow:hidden}
/* a schermo intero gli antenati non devono fare da riferimento all'overlay fisso: backdrop-filter, transform e
   contain lo chiuderebbero dentro il riquadro invece che sullo schermo */
html.nrc-chart-full #agentDesk :is(.panel, .ad-top, .ad-plan-body, .ad-plan-main){-webkit-backdrop-filter:none!important; backdrop-filter:none!important; transform:none!important; contain:none!important}
/* livelli del grafico (telefono): sul grafico solo la sigla minuscola, qui colore, sigla, nome e prezzo; il tocco
   su una linea del grafico evidenzia la sua riga (.is-hit). Il JS la riempie solo sotto i 768px. */
#agentDesk .lv-list:not([hidden]){display:grid; grid-template-columns:minmax(0, 1fr); gap:2px; margin:8px 0 0; padding:0; list-style:none}
#agentDesk .lv-list li{display:grid; grid-template-columns:12px 3.2em minmax(0, 1fr) auto; align-items:center; gap:8px;
  min-height:32px; padding:4px 8px; border-radius:8px; font-size:13px; transition:background-color .2s ease}
#agentDesk .lv-list i{width:12px; height:3px; border-radius:2px}
#agentDesk .lv-list .lv-short{font-family:"IBM Plex Mono", monospace; color:var(--ad-muted)}
#agentDesk .lv-list .lv-name{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
#agentDesk .lv-list .lv-price{font-variant-numeric:tabular-nums; white-space:nowrap}
#agentDesk .lv-list li.is-hit{background:color-mix(in srgb, var(--ad-accent) 22%, transparent); font-weight:700}
#agentDesk .chart-wrap.is-full .lv-list:not([hidden]){flex:0 0 auto; max-height:28%; overflow-y:auto; margin:0}
@media (prefers-reduced-motion: reduce){ #agentDesk .lv-list li{transition:none} }

/* scheda del pattern sotto il grafico (telefono): nome, stato, qualità e obiettivo misurato in poco spazio, come
   la riga del PC; sopra il grafico la riga del titolo sparisce per non ripetere gli stessi dati */
#agentDesk .pat-sum{display:none}
@media (max-width:767px){
  #agentDesk .pat-sum:not([hidden]){display:block; margin-top:10px; padding:10px 12px; border:1px solid var(--ad-line); border-radius:10px}
  #agentDesk .ad-plan-main:has(.pat-sum:not([hidden])) .pat-bar .pat-head{display:none}
  #agentDesk .pat-sum-head{display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px}
  #agentDesk .pat-sum-head strong{font-size:17px; margin-right:2px}
  #agentDesk .pat-sum dl{display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:8px; margin:8px 0 4px}
  #agentDesk .pat-sum dl div{min-width:0}
  #agentDesk .pat-sum dt{font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--ad-muted)}
  #agentDesk .pat-sum dd{margin:2px 0 0; font-size:15px; font-weight:700; overflow-wrap:anywhere}
  #agentDesk .pat-sum p{margin:4px 0 0}
  #agentDesk .pat-sum dd.up{color:var(--ad-up)}
  #agentDesk .pat-sum dd.wait{color:var(--ad-wait)}
}
