/* Riquadro "Guadagni e traffico" nella home (assets/guadagni.js) */
.pxg {
  --pxg-verde: #1f8a4c; --pxg-verde-f: #e6f5ec;
  --pxg-ambra: #a86500; --pxg-ambra-f: #fff3dc;
  --pxg-rosso: #c0392b; --pxg-rosso-f: #fdeaea;
  margin: 18px 0; padding: 22px; background: #fff; border: 1px solid var(--px-linea, #ede4f2);
  border-radius: var(--px-r, 18px); box-shadow: var(--px-ombra, 0 18px 44px rgba(45,16,50,.1)); color: var(--px-inchiostro, #1d1426);
}
.pxg-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.pxg-head h3 { margin: 0; font-size: 22px; font-weight: 800; letter-spacing: -0.02em; }
.pxg-head p { margin: 4px 0 0; color: var(--px-tenue, #7b6a88); font-size: 13px; }
.pxg-agg { flex: none; }
.pxg-errore { background: var(--pxg-rosso-f); color: var(--pxg-rosso); padding: 10px 14px; border-radius: 12px; font-size: 14px; }
.pxg-vuota { color: var(--px-tenue, #7b6a88); }

.pxg-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.pxg-tile { background: var(--px-chiaro, #fcedf5); border-radius: 14px; padding: 14px 16px; min-width: 0; }
.pxg-tile span { display: block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--px-primoscuro, #8e1f63); }
.pxg-tile b { display: block; font-size: 26px; font-weight: 800; letter-spacing: -0.02em; margin-top: 4px; font-variant-numeric: tabular-nums; }
.pxg-tile small { display: block; color: var(--px-tenue, #7b6a88); font-size: 12px; margin-top: 2px; }
.pxg-tile-forte { background: var(--px-grad); color: #fff; }
.pxg-tile-forte span, .pxg-tile-forte small { color: rgba(255,255,255,.88); }

.pxg-var { font-size: 12px; font-weight: 700; white-space: nowrap; }
.pxg-su { color: var(--pxg-verde); } .pxg-giu { color: var(--pxg-rosso); } .pxg-pari { color: var(--px-tenue, #7b6a88); }
.pxg-tile .pxg-var { display: inline-block; margin-top: 2px; }

.pxg-allarmi { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 6px; }
.pxg-allarmi li { display: flex; gap: 8px; align-items: baseline; padding: 9px 12px; border-radius: 12px; font-size: 14px; line-height: 1.4; }
.pxg-allarmi li.pxg-rosso { background: var(--pxg-rosso-f); } .pxg-allarmi li.pxg-ambra { background: var(--pxg-ambra-f); }
.pxg-icona { flex: none; width: 18px; height: 18px; border-radius: 50%; display: inline-grid; place-items: center; font-size: 12px; font-weight: 800; color: #fff; transform: translateY(2px); }
.pxg-rosso .pxg-icona { background: var(--pxg-rosso); } .pxg-ambra .pxg-icona { background: var(--pxg-ambra); }

.pxg-tabella { border-top: 1px solid var(--px-linea, #ede4f2); }
.pxg-riga { display: grid; grid-template-columns: minmax(0, 2.2fr) 0.9fr 0.9fr 1.3fr 1.3fr 1.7fr; gap: 12px; align-items: center;
  width: 100%; padding: 10px 6px; background: none; border: 0; border-bottom: 1px solid var(--px-linea, #ede4f2);
  border-radius: 0; box-shadow: none; text-align: left; font: inherit; color: inherit; cursor: pointer; min-height: 0; }
button.pxg-riga:hover { background: #fdf8fc; transform: none; box-shadow: none; }
.pxg-testa { cursor: default; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--px-tenue, #7b6a88); }
.pxg-nome { display: flex; gap: 10px; align-items: center; min-width: 0; }
.pxg-nome img, .pxg-nome i { width: 32px; height: 32px; border-radius: 8px; flex: none; object-fit: cover; background: var(--px-chiaro, #fcedf5); }
.pxg-nome > span { min-width: 0; }
.pxg-nome b { display: block; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pxg-n { font-variant-numeric: tabular-nums; font-size: 14px; }
.pxg-chip { display: inline-block; font-style: normal; font-size: 11px; font-weight: 700; padding: 1px 8px; border-radius: 999px; margin: 2px 4px 0 0; }
.pxg-chip.pxg-rosso { background: var(--pxg-rosso-f); color: var(--pxg-rosso); }
.pxg-chip.pxg-ambra { background: var(--pxg-ambra-f); color: var(--pxg-ambra); }
.pxg-chip.pxg-verde { background: var(--pxg-verde-f); color: var(--pxg-verde); }
.pxg-rpm { display: flex; align-items: center; gap: 8px; font-size: 14px; font-variant-numeric: tabular-nums; }
.pxg-barra { flex: 1; height: 8px; background: #f3ebf6; border-radius: 4px; overflow: hidden; }
.pxg-barra span { display: block; height: 100%; background: var(--px-magenta, #cf2578); border-radius: 4px; }
.pxg-muto { color: var(--px-tenue, #7b6a88); font-size: 12px; }

.pxg-dett { padding: 12px 6px 18px; border-bottom: 1px solid var(--px-linea, #ede4f2); background: #fdfafc; }
.pxg-pannello { margin-bottom: 6px; }
.pxg-ptitolo { font-size: 12px; font-weight: 700; color: var(--px-inchiostro, #1d1426); margin: 4px 0; }
.pxg-ptitolo span { font-weight: 400; color: var(--px-tenue, #7b6a88); margin-left: 6px; }
.pxg-pannello svg { display: block; width: 100%; height: 70px; overflow: visible; }
.pxg-base { stroke: #e6dcec; stroke-width: 1; }
.pxg-b-euro { fill: var(--px-magenta, #cf2578); }
.pxg-b-vis { fill: var(--px-viola, #8b4ad8); }
.pxg-b-rpm { fill: var(--px-corallo, #e2584d); }
.pxg-vuoto { fill: #eee6f1; }
.pxg-bersaglio { fill: transparent; }
.pxg-colonna:hover path { opacity: .75; }
.pxg-asse { display: flex; justify-content: space-between; font-size: 11px; color: var(--px-tenue, #7b6a88); margin-bottom: 12px; }
.pxg-numeri { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.pxg-numeri div { background: #fff; border: 1px solid var(--px-linea, #ede4f2); border-radius: 12px; padding: 10px 12px; min-width: 0; }
.pxg-numeri b { display: block; font-size: 16px; font-variant-numeric: tabular-nums; }
.pxg-numeri span { font-size: 11px; color: var(--px-tenue, #7b6a88); }
.pxg-nota { font-size: 12px; color: var(--px-tenue, #7b6a88); margin: 10px 0 0; }

.pxg-link { background: none; border: 0; box-shadow: none; color: var(--px-primoscuro, #8e1f63); font-weight: 700; padding: 12px 0 0; cursor: pointer; font-size: 13px; }
.pxg-link:hover { background: none; transform: none; box-shadow: none; text-decoration: underline; }
.pxg-altre { font-size: 13px; color: var(--px-tenue, #7b6a88); line-height: 1.5; }

.pxg-setup { display: grid; gap: 10px; max-width: 560px; }
.pxg-setup p { margin: 0; line-height: 1.5; }
.pxg-setup label { display: grid; gap: 4px; font-size: 13px; font-weight: 700; }
.pxg-setup input { font: inherit; padding: 10px 12px; border: 1px solid var(--px-linea, #ede4f2); border-radius: 10px; font-weight: 400; }
.pxg-setup button { justify-self: start; }
.pxg-bottone { justify-self: start; display: inline-block; padding: 12px 20px; border-radius: 12px; color: #fff; text-decoration: none; font-weight: 700; background: var(--px-grad); }

@media (max-width: 760px) {
  .pxg { padding: 16px; }
  .pxg-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pxg-tile b { font-size: 21px; }
  .pxg-riga { grid-template-columns: minmax(0, 1fr) auto auto; }
  .pxg-riga > :nth-child(4), .pxg-riga > :nth-child(5), .pxg-riga > :nth-child(6) { display: none; }
  .pxg-rpm .pxg-barra { display: none; }
  .pxg-numeri { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.pxg-chip.pxg-grigio { background: #f1ecf4; color: var(--px-tenue, #7b6a88); }
.pxg-barra-parz span { background: #d9cfe0; }
.pxg-setup2 { margin: 4px 0 16px; padding: 14px 16px; border: 1px dashed var(--px-linea, #ede4f2); border-radius: 14px; background: rgba(139, 74, 216, .04); }
.pxg-conto { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--px-linea, #ede4f2); }
.pxg-conto:first-of-type { border-top: 0; padding-top: 0; }
.pxg-conto h4 { margin: 0 0 12px; font-size: 18px; }
.pxg-conto h4 span { font-size: 13px; font-weight: 500; color: var(--px-testo2, #7b6a88); margin-left: 6px; }
.pxg-nomi { display: block; font-size: 11.5px; font-weight: 400; color: var(--px-testo2, #7b6a88); line-height: 1.35; margin-top: 2px; }

/* 29/09/2026: colonna Oggi */
.pxg-oggi { font-weight: 800; color: #1b7a47; }

/* 29/09/2026: popup per app */
.pxg-pop{position:fixed;inset:0;z-index:9999;background:rgba(29,20,38,.45);display:flex;align-items:flex-start;justify-content:center;padding:28px 12px;overflow:auto;backdrop-filter:blur(2px)}
.pxg-pop-box{background:#fff;border-radius:22px;max-width:760px;width:100%;padding:18px 18px 12px;box-shadow:0 24px 70px rgba(29,20,38,.35)}
.pxg-pop-testa{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.pxg-pop-testa img{width:46px;height:46px;border-radius:12px;object-fit:cover}
.pxg-pop-testa b{display:block;font-size:18px}.pxg-pop-testa small{color:#8a7d99;font-size:12px}
.pxg-pop-testa>div{flex:1;min-width:0}
.pxg-pop-x{border:0;background:#f3ecf8;width:36px;height:36px;border-radius:50%;font-size:22px;cursor:pointer;flex:0 0 36px}
.pxg-pqs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:14px}
.pxg-pq{background:#faf6fa;border:1px solid #ede4f2;border-radius:16px;padding:12px}
.pxg-pq span{display:block;font-size:12px;color:#8a7d99;font-weight:700}
.pxg-pq b{display:block;font-size:22px;margin:4px 0}
.pxg-pq small{display:block;font-size:12.5px;color:#1d1426}
.pxg-pq em{display:block;font-style:normal;font-size:12px;color:#1b7a47;margin-top:4px;font-weight:700}
.pxg-pq em.pxg-basso{color:#b3261e}
.pxg-pop-box .pxg-dett{border:0;padding:0;margin:0}
@media (max-width:640px){.pxg-pqs{grid-template-columns:1fr}.pxg-pop{padding:10px 6px}}
.pxg-psez{border-top:1px solid #ede4f2;padding-top:12px;margin-top:6px}.pxg-psez h4{margin:0 0 10px;font-size:15px}.pxg-psez h4 span{font-size:11px;font-weight:700;color:#8a7d99;background:#f3ecf8;border-radius:99px;padding:2px 8px;margin-left:6px}
.pxg-chip.pxg-sproporzione{background:#fdecec;color:#b3261e;border:1px solid #f5c2c0}
.pxg-chip.pxg-piatt{font-style:normal}.pxg-chip.pxg-ios{background:#eef2ff;color:#3949ab;border:1px solid #d6dcfb}.pxg-chip.pxg-android{background:#e8f5e9;color:#2e7d32;border:1px solid #c8e6c9}