:root {
  --fx: var(--accent);                     
  --fx-dim: rgba(77,171,154,0.12);
  --fx-line: rgba(77,171,154,0.38);
}
body { background: var(--bg); color: var(--text); }
.fx-main { padding-top: 62px; }
.fx-hero {
  position: relative;
  padding: clamp(28px, calc(3.2 * var(--vu)), 54px) 0 clamp(24px, calc(2.8 * var(--vu)), 46px);
  border-bottom: 1px solid var(--border);
  overflow: hidden;
}
.fx-hero::before {
  content: ''; position: absolute; z-index: 0;
  top: -320px; right: -180px; width: 720px; height: 720px;
  border-radius: 50%;
  background: radial-gradient(circle, var(--fx-dim), transparent 62%);
  pointer-events: none;
}
.fx-hero > * { position: relative; z-index: 1; }
.fx-crumb {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  font-size: 12px; color: var(--text-muted); margin-bottom: 26px;
}
.fx-crumb a { color: var(--text-muted); transition: color 0.18s; }
.fx-crumb a:hover { color: var(--fx); }
.fx-crumb i { font-style: normal; opacity: 0.4; }
.fx-crumb b { font-weight: 500; color: var(--text-dim); }
.fx-hero-grid {
  display: grid; grid-template-columns: minmax(0,1.25fr) minmax(0,0.85fr);
  gap: 54px; align-items: start;
}
.fx-kicker {
  display: inline-flex; align-items: center; gap: 0;
  font-size: 11px; line-height: 1.2; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.16em; color: var(--fx); margin-bottom: 16px;
  border: 1px solid rgba(77,171,154,0.28); background: var(--accent-dim);
  border-radius: 999px; padding: 4px 12px;
}
.fx-hero h1 {
  font-size: clamp(30px, calc(3.2 * var(--vu)), 52px);
  line-height: 1.06; letter-spacing: -0.03em; font-weight: 700;
  max-width: 15ch;
}
.fx-lead {
  margin-top: clamp(13px, calc(1.2 * var(--vu)), 20px);
  font-size: clamp(15px, calc(1.2 * var(--vu)), 16.5px); line-height: 1.6;
  color: var(--text-dim); max-width: 56ch;
}
.fx-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: clamp(18px, calc(1.8 * var(--vu)), 30px); }
.fx-quick {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 20px 22px;
}
.fx-quick h2 {
  font-size: 10px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.12em; color: var(--text-muted); margin-bottom: 14px;
}
.fx-quick ul { list-style: none; display: grid; gap: 11px; }
.fx-quick li {
  position: relative; padding-left: 18px;
  font-size: 13.5px; line-height: 1.5; color: var(--text-dim);
}
.fx-quick li::before {
  content: ''; position: absolute; left: 3px; top: 7px;
  width: 6px; height: 6px;
  border-radius: 50%; background: var(--fx);
}
.fx-quick .fx-plan {
  margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--border);
  font-size: 11.5px; color: var(--text-muted);
}
.fx-hero-grid.fx-hero-wg {
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.82fr);
  gap: 48px; align-items: start;
}
.fx-hero-wg .fx-hero-testo { max-width: 60ch; }
.fx-hero-elenco {
  list-style: none; display: grid; gap: 10px;
  margin-top: 30px; padding-top: 26px;
  border-top: 1px solid var(--border);
}
.fx-hero-elenco li {
  position: relative; padding-left: 20px;
  font-size: 13.5px; line-height: 1.5; color: var(--text-dim);
}
.fx-hero-elenco li::before {
  content: ''; position: absolute; left: 3px; top: 7px;
  width: 6px; height: 6px; border-radius: 50%; background: var(--fx);
}
.fx-hero-wg .fx-plan { margin-top: 16px; font-size: 11.5px; color: var(--text-muted); }
.fx-hero-wgbox figure { max-width: 360px; margin: 0 auto; }
.fx-hero-didascalia {
  max-width: 360px; margin: 16px auto 0;
  font-size: 11.5px; line-height: 1.5; color: var(--text-muted);
  text-align: center;
}
@media (max-width: 1000px) {
  .fx-hero-grid.fx-hero-wg { grid-template-columns: 1fr; gap: 34px; }
  .fx-hero-wg .fx-hero-testo { max-width: none; }
}
.fx-shot { padding: clamp(24px, calc(2.6 * var(--vu)), 44px) 0 6px; }
.fx-shot figure {
  max-width: 960px; margin: 0 auto;
  border: 1px solid var(--border-med);
  border-radius: 12px;
  overflow: hidden;
  background: var(--surface);
  box-shadow: 0 34px 80px -34px rgba(0,0,0,0.95);
}
.fx-shot .fx-mock { background: var(--bg); }
.fx-shot figcaption {
  padding: 11px 16px;
  border-top: 1px solid var(--border);
  font-size: 11.5px; color: var(--text-muted);
  background: rgba(255,255,255,0.015);
}
.fx-shot.stretta figure { max-width: 560px; }
.fx-shot.stretta .fx-mock { padding: 26px 0; display: grid; place-items: center; }
.fx-shot.duo figure { max-width: 1180px; }
.fx-mock-duo {
  display: grid; grid-template-columns: 1fr 1fr;
  background: var(--border);
  gap: 1px;
}
.fx-mock-duo > .mock { background: var(--bg); }
@media (max-width: 900px) {
  .fx-mock-duo { grid-template-columns: 1fr; }
}
.fx-lk-tabs { display: flex; gap: 3px; margin-left: auto; }
.fx-lk-tabs i {
  font-style: normal; font-size: 9px; font-weight: 600;
  padding: 3px 7px; border-radius: 999px;
  color: var(--finto-2); border: 1px solid transparent;
}
.fx-lk-tabs i.on { color: var(--accent); background: var(--accent-dim); border-color: var(--accent-line); }
.fx-lk-cap {
  font-size: 9px; font-weight: 700; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--red);
  margin: 4px 0 9px;
}
.fx-lk-cap.edge { color: var(--green); margin-top: 18px; }
.fx-lk-row {
  display: grid; grid-template-columns: 92px 54px 1fr 62px;
  gap: 9px; align-items: center;
  font-size: 11px; margin-bottom: 6px;
  background: var(--surface); border: 1px solid var(--border);
  border-left: 3px solid var(--border-med);
  border-radius: var(--radius-sm); padding: 8px 10px;
}
.fx-lk-row.loss { border-left-color: var(--red);   background: linear-gradient(100deg, var(--red-dim), var(--surface) 55%); }
.fx-lk-row.win  { border-left-color: var(--green); background: linear-gradient(100deg, var(--green-dim), var(--surface) 55%); }
.fx-lk-row .n { font-weight: 600; color: var(--text); white-space: nowrap; }
.fx-lk-row .t { color: var(--finto-2); font-size: 10px; white-space: nowrap; }
.fx-lk-row .bar { height: 6px; border-radius: 3px; background: var(--surface3); overflow: hidden; }
.fx-lk-row .bar i { display: block; height: 100%; border-radius: 3px; width: var(--w); }
.fx-lk-row.loss .bar i { background: var(--red); }
.fx-lk-row.win  .bar i { background: var(--green); }
.fx-lk-row .v {
  text-align: right; font-weight: 700; font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.fx-lk-row.loss .v { color: var(--red); }
.fx-lk-row.win  .v { color: var(--green); }
.js .fx-lk-row .bar i { width: 0; }
.js .fx-shot .fx-up.in .fx-lk-row .bar i {
  animation: fxBarra 0.9s var(--ease-out) forwards;
  animation-delay: var(--d, 0ms);
}
.fx-lk-row:nth-of-type(2) { --d: 120ms; }
.fx-lk-row:nth-of-type(3) { --d: 240ms; }
.fx-lk-row:nth-of-type(4) { --d: 360ms; }
.fx-lk-row:nth-of-type(5) { --d: 480ms; }
@keyframes fxBarra { from { width: 0; } to { width: var(--w); } }
.js .fx-shot .mock-bar-fill { width: 0; }
.js .fx-shot .fx-up.in .mock-bar-fill {
  animation: fxBarra 1.1s var(--ease-out) forwards;
  animation-delay: var(--d, 0ms);
}
.fx-shot .mock-bar-item:nth-child(2) .mock-bar-fill { --d: 130ms; }
.fx-shot .mock-bar-item:nth-child(3) .mock-bar-fill { --d: 260ms; }
.fx-shot .mock-bar-item:nth-child(4) .mock-bar-fill { --d: 390ms; }
.fx-shot [data-cycle].idle { --play: paused; }
@media (prefers-reduced-motion: reduce) {
  .js .fx-lk-row .bar i, .js .fx-shot .mock-bar-fill { width: var(--w); animation: none; }
}
.fx-sec { padding: clamp(32px, calc(3.6 * var(--vu)), 60px) 0; }
.fx-sec + .fx-sec { border-top: 1px solid var(--border); }
.fx-head { max-width: 62ch; margin-bottom: clamp(18px, calc(2.1 * var(--vu)), 34px); }
.fx-head h2 {
  font-size: clamp(22px, calc(2.3 * var(--vu)), 32px);
  line-height: 1.14; letter-spacing: -0.025em; font-weight: 700;
}
.fx-head p { margin-top: clamp(10px, calc(1 * var(--vu)), 14px); font-size: clamp(14.2px, calc(1.15 * var(--vu)), 15.5px); line-height: 1.62; color: var(--text-dim); }
.fx-cards {
  display: grid; gap: clamp(12px, calc(1.25 * var(--vu)), 18px);
  grid-template-columns: repeat(auto-fit, minmax(268px, 1fr));
}
.fx-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: clamp(18px, calc(1.8 * var(--vu)), 26px) clamp(19px, calc(1.9 * var(--vu)), 27px);
  transition: border-color 0.18s, background 0.18s;
}
.fx-card:hover { border-color: var(--border-med); background: var(--surface-hi); }
.fx-card-ico {
  width: 30px; height: 30px; border-radius: 8px;
  display: grid; place-items: center; margin-bottom: 14px;
  background: var(--fx-dim); color: var(--fx);
}
.fx-card-ico svg { width: 16px; height: 16px; }
.fx-card h3 { font-size: 15px; font-weight: 600; letter-spacing: -0.01em; }
.fx-card p { margin-top: 8px; font-size: 13.5px; line-height: 1.58; color: var(--text-muted); }
.fx-split {
  display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  gap: clamp(28px, calc(3 * var(--vu)), 48px); align-items: start;
}
.fx-split + .fx-split { margin-top: 52px; padding-top: 52px; border-top: 1px solid var(--border); }
.fx-split.rovescio .fx-split-a { order: 2; }
.fx-split.centrata { align-items: center; }
.fx-split h3 {
  font-size: 21px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.2;
}
.fx-split p { margin-top: 13px; font-size: 14.5px; line-height: 1.65; color: var(--text-dim); }
.fx-split p + p { margin-top: 12px; }
.fx-list { list-style: none; display: grid; gap: 12px; }
.fx-list li {
  position: relative; padding-left: 28px;
  font-size: 14px; line-height: 1.55; color: var(--text-dim);
}
.fx-list li::before {
  content: ''; position: absolute; left: 0; top: 3px;
  width: 16px; height: 16px;
  border-radius: 5px; background: var(--fx-dim);
  border: 1px solid var(--fx-line);
}
.fx-list li b { color: var(--text); font-weight: 600; }
.fx-facts {
  display: grid; gap: 1px;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  background: var(--border);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}
.fx-fact { background: var(--surface); padding: 18px 20px; }
.fx-fact span {
  display: block; font-size: 10px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.1em; color: var(--text-muted); margin-bottom: 7px;
}
.fx-fact b { font-size: 16px; font-weight: 700; letter-spacing: -0.02em; color: var(--text); }
.fx-fact b.accent { color: var(--fx); }
.fx-fact em { display: block; margin-top: 5px; font-style: normal; font-size: 12px; color: var(--text-muted); }
.fx-nota {
  margin-top: 30px;
  background: linear-gradient(135deg, rgba(234,179,8,0.07), var(--surface2) 60%);
  border: 1px solid var(--border);
  border-left: 3px solid var(--yellow);
  border-radius: var(--radius);
  padding: 16px 19px;
  font-size: 13.5px; line-height: 1.6; color: var(--text-dim);
}
.fx-nota b { color: var(--text); font-weight: 600; }
.fx-real { padding: clamp(32px, calc(3.5 * var(--vu)), 58px) 0 clamp(34px, calc(3.7 * var(--vu)), 62px); border-top: 1px solid var(--border); }
.fx-real .fx-kicker { margin-bottom: 12px; }
.fx-real h2 {
  font-size: clamp(19px, calc(1.6 * var(--vu)), 26px);
  line-height: 1.18; letter-spacing: -0.02em; font-weight: 700;
  margin-bottom: clamp(16px, calc(1.8 * var(--vu)), 26px); max-width: 44ch;
}
.fx-real figure {
  max-width: min(100%, calc((100vh - 290px) * 1.983));
  margin: 0 auto;
  border: 1px solid var(--border-med);
  border-radius: 12px; overflow: hidden;
  background: var(--surface);
  box-shadow: 0 34px 80px -34px rgba(0,0,0,0.95);
}
.fx-real img { display: block; width: 100%; height: auto; }
.fx-real figcaption {
  padding: 11px 16px; border-top: 1px solid var(--border);
  font-size: 11.5px; color: var(--text-muted);
  background: rgba(255,255,255,0.015);
}
.fx-next { padding: 58px 0 66px; border-top: 1px solid var(--border); }
.fx-next h2 {
  font-size: 11px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.12em; color: var(--text-muted); margin-bottom: 20px;
}
.fx-next-grid {
  display: grid; gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}
.fx-nx {
  display: block; background: var(--surface);
  border: 1px solid var(--border); border-radius: var(--radius);
  padding: 17px 19px;
  transition: border-color 0.18s, background 0.18s, transform 0.24s var(--e-ts);
}
.fx-nx:hover { border-color: var(--accent-line); background: var(--surface-hi); transform: translateY(-2px); }
.fx-nx span {
  display: block; font-size: 10px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.1em; color: var(--text-muted); margin-bottom: 8px;
}
.fx-nx b { display: block; font-size: 14.5px; font-weight: 600; letter-spacing: -0.01em; }
.fx-nx em {
  display: block; margin-top: 6px; font-style: normal;
  font-size: 12.5px; line-height: 1.5; color: var(--text-muted);
}
.fx-end {
  border-top: 1px solid var(--border);
  padding: 66px 0 72px;
  text-align: center;
  background:
    radial-gradient(ellipse 60% 100% at 50% 0%, var(--fx-dim), transparent 70%);
}
.fx-end h2 {
  font-size: clamp(26px, 3.4vw, 38px);
  line-height: 1.14; letter-spacing: -0.03em; font-weight: 700;
  max-width: 20ch; margin: 0 auto;
}
.fx-end p {
  margin: 16px auto 0; max-width: 52ch;
  font-size: 15px; line-height: 1.6; color: var(--text-dim);
}
.fx-end .fx-cta { justify-content: center; margin-top: 28px; }
.fx-end small { display: block; margin-top: 16px; font-size: 12px; color: var(--text-muted); }
@media (max-width: 1000px) {
  .fx-hero-grid { grid-template-columns: 1fr; gap: 34px; }
  .fx-hero h1 { max-width: none; }
  .fx-split { grid-template-columns: 1fr; gap: 26px; }
  .fx-split.rovescio .fx-split-a { order: 0; }
}
@media (max-width: 720px) {
  .fx-hero { padding: 38px 0 34px; }
  .fx-sec { padding: 46px 0; }
  .fx-lead { font-size: 15.5px; }
  .fx-crumb { margin-bottom: 20px; }
  .fx-cta .btn { flex: 1 1 auto; justify-content: center; }
}
.js .fx-up { opacity: 0; transform: translateY(16px); }
.js .fx-up.in {
  opacity: 1; transform: none;
  transition: opacity 0.6s var(--ease-out), transform 0.6s var(--ease-out);
}
@media (prefers-reduced-motion: reduce) {
  .js .fx-up { opacity: 1; transform: none; }
  .js .fx-up.in { transition: none; }
  .fx-card, .fx-nx { transition: none; }
  .fx-nx:hover { transform: none; }
}
.apri-col {
  position: relative; width: 400px; max-width: 100%; margin: 0 auto;
  display: grid; place-items: center;
}
.apri-box {
  position: relative;
  width: 100%; max-width: 400px; margin: 0 auto;
  justify-self: stretch;
  background: var(--bg);
  border: 1px solid var(--border-med);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 50px 110px -40px rgba(0,0,0,0.96), 0 0 0 1px rgba(255,255,255,0.02);
  font-size: 12px;
}
.js .apri .apri-box {
  width: var(--w, 100%); height: var(--h, auto);
  transition:
    width 0.62s var(--ease-out) 0.02s,
    height 0.76s var(--ease-out) 0.1s,
    border-radius 0.52s var(--ease-out),
    background-color 0.38s ease 0.06s,
    border-color 0.4s ease 0.1s,
    box-shadow 0.7s ease;
}
.js .apri.chiuso .apri-box {
  width: 74px; height: 74px; border-radius: 50%;
  background: var(--accent); border-color: transparent;
  box-shadow:
    0 0 0 1px rgba(77,171,154,0.4),
    0 0 34px 5px rgba(77,171,154,0.34),
    0 0 96px 12px rgba(77,171,154,0.15),
    0 16px 40px -14px rgba(0,0,0,0.9);
}
.js .apri .apri-dentro { width: var(--w, auto); }
.js .apri .apri-testa { transition: opacity 0.34s ease 0.34s; }
.js .apri .apri-corpo { transition: opacity 0.4s ease 0.5s; }
.js .apri.chiuso .apri-testa,
.js .apri.chiuso .apri-corpo { opacity: 0; transition-delay: 0s; transition-duration: 0.14s; }
.apri-testa { position: relative; }
.apri.aperto .apri-testa::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--accent), transparent);
  transform: scaleX(0); opacity: 0; pointer-events: none;
  animation: apriLuce 1.1s var(--ease-out) 0.34s forwards;
}
@keyframes apriLuce {
  0%   { transform: scaleX(0.1); opacity: 0; }
  32%  { transform: scaleX(1);   opacity: 0.95; }
  100% { transform: scaleX(1);   opacity: 0; }
}
.apri-fx {
  display: none; position: absolute; left: 0; right: 0;
  top: 50%; height: 74px; margin-top: -37px;
  z-index: 4; pointer-events: none;
}
.js .apri.chiuso .apri-fx,
.js .apri.aperto:not(.finito) .apri-fx { display: block; }
.apri-fx > * { position: absolute; left: 50%; top: 50%; }
.apri-piu {
  width: 21px; height: 21px; opacity: 0;
  transform: translate(-50%, -50%) rotate(45deg) scale(0.4);
  transition: opacity 0.26s ease, transform 0.42s var(--ease-out);
}
.apri-piu::before, .apri-piu::after {
  content: ''; position: absolute; background: var(--on-accent); border-radius: 1px;
}
.apri-piu::before { left: 50%; top: 0; width: 2.2px; height: 100%; margin-left: -1.1px; }
.apri-piu::after  { top: 50%; left: 0; height: 2.2px; width: 100%; margin-top: -1.1px; }
.js .apri.chiuso .apri-piu { opacity: 1; transform: translate(-50%, -50%) rotate(0deg) scale(1); }
.apri-pulse {
  width: 74px; height: 74px; border-radius: 50%;
  border: 1px solid var(--accent); opacity: 0;
  transform: translate(-50%, -50%);
}
.js .apri.chiuso .apri-pulse { animation: apriRespiro 2.6s var(--ease-out) infinite; }
@keyframes apriRespiro {
  0%   { transform: translate(-50%, -50%) scale(1);    opacity: 0.5; }
  70%  { transform: translate(-50%, -50%) scale(2.05); opacity: 0; }
  100% { transform: translate(-50%, -50%) scale(2.05); opacity: 0; }
}
.apri-alone {
  width: 190px; height: 190px; border-radius: 50%;
  opacity: 0; transform: translate(-50%, -50%);
  background: radial-gradient(circle closest-side,
    rgba(77,171,154,0.26), rgba(77,171,154,0.07) 55%, transparent 78%);
  transition: opacity 0.5s ease;
}
.js .apri.chiuso .apri-alone { opacity: 1; }
.apri-onda {
  width: 74px; height: 74px; border-radius: 50%;
  border: 2px solid var(--accent); opacity: 0;
  transform: translate(-50%, -50%) scale(0.9);
}
.js .apri.tocca .apri-onda { animation: apriOnda 0.85s var(--ease-out) 0.54s forwards; }
@keyframes apriOnda {
  0%   { transform: translate(-50%, -50%) scale(0.9); opacity: 0.9; }
  100% { transform: translate(-50%, -50%) scale(2.9); opacity: 0; }
}
.apri-tap { width: 21px; height: 21px; opacity: 0; margin: -3px 0 0 -3px; }
.apri-tap path { fill: var(--text); stroke: rgba(0,0,0,0.55); stroke-width: 1; }
.js .apri.tocca .apri-tap { animation: apriTap 1s var(--ease-out) forwards; }
@keyframes apriTap {
  0%   { opacity: 0; transform: translate(84px, 68px) scale(1); }
  14%  { opacity: 1; }
  54%  { opacity: 1; transform: translate(0, 0) scale(1); }
  62%  { transform: translate(0, 0) scale(0.78); }
  74%  { transform: translate(0, 0) scale(1); }
  86%  { opacity: 1; }
  100% { opacity: 0; transform: translate(0, -12px) scale(1); }
}
.js .apri.tocca.chiuso .apri-box { animation: apriPressa 0.34s var(--ease-out) 0.52s; }
@keyframes apriPressa {
  0%, 100% { transform: scale(1); }
  40%      { transform: scale(0.91); }
}
.js .apri.finito .apri-box { width: 100%; max-width: 400px; height: auto; transition: none; }
.js .apri.finito .apri-dentro { width: auto; }
.js .apri.muto, .js .apri.muto * { transition: none !important; animation: none !important; }
.apri-testa { display: flex; align-items: center; gap: 9px; padding: 11px 13px; border-bottom: 1px solid var(--border); }
.apri-logo { width: 17px; height: 17px; border-radius: 5px; background: var(--accent-dim); border: 1px solid var(--accent-line); display: flex; align-items: center; justify-content: center; }
.apri-logo i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); display: block; }
.apri-nome { font-size: 12px; font-weight: 700; letter-spacing: -0.01em; line-height: 1.15; }
.apri-data { font-size: 9.5px; color: var(--finto-2); }
.apri-ctl { margin-left: auto; display: flex; gap: 9px; color: var(--finto-2); font-size: 11px; }
.apri-schede { display: flex; border-bottom: 1px solid var(--border); }
.apri-scheda { flex: 1; padding: 9px 2px; text-align: center; font-size: 11.5px; font-weight: 600; color: var(--finto-2); border-bottom: 2px solid transparent; }
.apri-scheda.on { color: var(--accent); border-bottom-color: var(--accent); }
.apri-pagina { padding: 14px 15px; height: 300px; }
.apri-campo { background: var(--surface); border: 1px solid var(--border-med); border-radius: 9px; padding: 9px 11px; color: var(--finto-2); font-size: 11px; min-height: 62px; }
.apri-chip-riga { display: flex; gap: 5px; margin-top: 8px; flex-wrap: wrap; }
.apri-chip { font-size: 10px; padding: 4px 9px; border-radius: 20px; background: var(--surface2); color: var(--finto-1); white-space: nowrap; }
.apri-chip.on { background: var(--accent-dim); color: var(--accent); border: 1px solid var(--accent-line); }
.apri-salva { margin-top: 10px; margin-left: auto; width: max-content; font-size: 10.5px; font-weight: 600; padding: 6px 13px; border-radius: 7px; background: var(--accent); color: var(--on-accent); }
.fx-apri-wrap {
  position: relative;
  display: grid; place-items: center;
  padding: 30px 0 14px;
  min-height: 470px;
}
.fx-apri-wrap .apri { position: relative; z-index: 1; }
.fx-scena {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: clamp(30px, calc(3.5 * var(--vu)), 58px); align-items: center;
}
.fx-scena .fx-scena-testo h2 {
  font-size: clamp(23px, calc(2.25 * var(--vu)), 36px);
  line-height: 1.12; letter-spacing: -0.03em; font-weight: 700;
}
.fx-scena .fx-scena-occhiello {
  margin-top: 14px; font-size: 15.5px; line-height: 1.62; color: var(--text-dim);
}
.fx-scena h3 {
  margin-top: clamp(18px, calc(1.9 * var(--vu)), 30px);
  padding-top: clamp(16px, calc(1.7 * var(--vu)), 26px);
  border-top: 1px solid var(--border);
  font-size: 20px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.22;
}
.fx-scena p { margin-top: 13px; font-size: 14.5px; line-height: 1.65; color: var(--text-dim); }
.fx-scena .fx-list { margin-top: clamp(14px, calc(1.5 * var(--vu)), 24px); }
@media (max-width: 1000px) {
  .fx-scena { grid-template-columns: 1fr; gap: 24px; }
  .fx-apri-wrap { min-height: 440px; }
}
@media (prefers-reduced-motion: reduce) {
  .js .apri .apri-box, .js .apri .apri-testa, .js .apri .apri-corpo { transition: none; }
  .apri.aperto .apri-testa::after { animation: none; opacity: 0; }
  .js .apri .apri-fx { display: none; }
}
.fx-reg {
  position: relative;
  background: var(--bg);
  border: 1px solid var(--border-med);
  border-radius: 12px;
  overflow: hidden;
  padding: 16px;
  min-height: 224px;
  display: flex; flex-direction: column;
  box-shadow: 0 34px 80px -34px rgba(0,0,0,0.9);
}
.fx-reg-sfondo { position: absolute; inset: 0; opacity: 0.5; pointer-events: none; }
.fx-reg-sfondo svg { width: 100%; height: 100%; display: block; }
.fx-reg-top {
  position: relative; display: flex; align-items: center; gap: 8px;
  font-size: 11px; color: var(--finto-2);
}
.fx-reg-pill {
  display: inline-flex; align-items: center; gap: 6px;
  margin-left: auto;
  font-size: 11px; font-weight: 600;
  padding: 6px 12px; border-radius: 999px;
  background: rgba(34,197,94,0.14); color: var(--green);
  border: 1px solid rgba(34,197,94,0.32);
  transition: background 0.3s, color 0.3s, border-color 0.3s;
}
.js .fx-reg.in .fx-reg-pill { animation: regPill 9s var(--ease) infinite; }
@keyframes regPill {
  0%, 34%   { background: rgba(34,197,94,0.14); color: #22c55e; border-color: rgba(34,197,94,0.32); }
  38%, 80%  { background: rgba(244,63,94,0.16); color: #f43f5e; border-color: rgba(244,63,94,0.36); }
  86%, 100% { background: rgba(34,197,94,0.14); color: #22c55e; border-color: rgba(34,197,94,0.32); }
}
.fx-reg-trades { position: relative; margin-top: auto; display: flex; flex-direction: column; gap: 6px; }
.fx-reg-t {
  display: flex; align-items: center; gap: 9px;
  font-size: 11px; padding: 8px 11px; border-radius: 7px;
  background: linear-gradient(100deg, var(--red-dim), var(--surface) 55%);
  border: 1px solid var(--border); border-left: 3px solid var(--red);
}
.js .fx-reg-t { opacity: 0; transform: translateY(6px); }
.fx-reg-t b { color: var(--text); font-weight: 600; }
.fx-reg-t span { color: var(--finto-2); }
.fx-reg-t i { margin-left: auto; font-style: normal; font-weight: 700; color: var(--red); font-variant-numeric: tabular-nums; }
.js .fx-reg.in .fx-reg-t { animation: regTrade 9s var(--ease) infinite; }
.fx-reg-t:nth-child(2) { animation-delay: 0.5s !important; }
@keyframes regTrade {
  0%, 8%    { opacity: 0; transform: translateY(6px); }
  16%, 88%  { opacity: 1; transform: none; }
  96%, 100% { opacity: 0; transform: translateY(6px); }
}
.fx-reg-alert {
  position: relative; margin-top: 10px;
  display: flex; align-items: flex-start; gap: 10px;
  padding: 11px 13px; border-radius: 9px;
  background: linear-gradient(120deg, rgba(244,63,94,0.16), var(--surface2) 62%);
  border: 1px solid rgba(244,63,94,0.34);
  box-shadow: 0 14px 34px -14px rgba(244,63,94,0.5);
}
.js .fx-reg-alert { opacity: 0; transform: translateY(14px); }
.js .fx-reg.in .fx-reg-alert { animation: regAlert 9s var(--ease) infinite; }
@keyframes regAlert {
  0%, 32%   { opacity: 0; transform: translateY(14px); }
  40%, 80%  { opacity: 1; transform: none; }
  88%, 100% { opacity: 0; transform: translateY(14px); }
}
.fx-reg-alert .segno {
  flex: 0 0 20px; width: 20px; height: 20px; border-radius: 50%;
  display: grid; place-items: center;
  background: rgba(244,63,94,0.2); color: var(--red);
  font-size: 11px; font-weight: 700;
}
.fx-reg-alert b { display: block; font-size: 12px; font-weight: 600; color: var(--text); }
.fx-reg-alert em { display: block; margin-top: 3px; font-style: normal; font-size: 11px; line-height: 1.45; color: var(--finto-1); }
@media (prefers-reduced-motion: reduce) {
  .js .fx-reg.in .fx-reg-pill,
  .js .fx-reg.in .fx-reg-t,
  .js .fx-reg.in .fx-reg-alert { animation: none; }
  .js .fx-reg-t, .js .fx-reg-alert { opacity: 1; transform: none; }
}
.fx-log {
  position: relative;
  background: var(--bg);
  border: 1px solid var(--border-med);
  border-radius: 12px;
  padding: 16px 18px;
  box-shadow: 0 34px 80px -34px rgba(0,0,0,0.9);
}
.fx-log-top {
  display: flex; align-items: center; gap: 8px;
  font-size: 11px; font-weight: 600; color: var(--finto-2);
  text-transform: uppercase; letter-spacing: 0.1em;
  padding-bottom: 11px; margin-bottom: 12px;
  border-bottom: 1px solid var(--border);
}
.fx-log-top span { margin-left: auto; text-transform: none; letter-spacing: 0; font-weight: 500; }
.fx-log-lista { position: relative; padding-left: 16px; }
.fx-log-lista::before {
  content: ''; position: absolute; left: 3px; top: 4px; bottom: 4px; width: 1px;
  background: var(--border-med);
}
.fx-log-e {
  position: relative; margin-bottom: 9px;
  padding: 9px 12px; border-radius: 8px;
  background: var(--surface); border: 1px solid var(--border);
  border-left: 3px solid var(--border-med);
}
.js .fx-log-e { opacity: 0; transform: translateX(-8px); }
.fx-log-e::before {
  content: ''; position: absolute; left: -16px; top: 15px;
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--bg); border: 1.5px solid var(--border-med);
}
.fx-log-e.nota  { border-left-color: var(--accent); }
.fx-log-e.nota::before  { border-color: var(--accent); }
.fx-log-e.fatto { border-left-color: var(--green);  background: linear-gradient(100deg, var(--green-dim), var(--surface) 55%); }
.fx-log-e.fatto::before { border-color: var(--green); }
.fx-log-e.guaio { border-left-color: var(--red);    background: linear-gradient(100deg, var(--red-dim), var(--surface) 55%); }
.fx-log-e.guaio::before { border-color: var(--red); }
.fx-log-e.idea  { border-left-color: var(--yellow); }
.fx-log-e.idea::before  { border-color: var(--yellow); }
.fx-log-e .riga { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.fx-log-e time { font-size: 10.5px; color: var(--finto-2); font-variant-numeric: tabular-nums; }
.fx-log-e .tipo {
  font-size: 9.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 2px 7px; border-radius: 999px;
}
.fx-log-e.nota  .tipo { background: var(--accent-dim); color: var(--accent); }
.fx-log-e.fatto .tipo { background: rgba(34,197,94,0.14); color: var(--green); }
.fx-log-e.guaio .tipo { background: rgba(244,63,94,0.14); color: var(--red); }
.fx-log-e.idea  .tipo { background: rgba(234,179,8,0.14); color: var(--yellow); }
.fx-log-e p { font-size: 12.5px; line-height: 1.5; color: var(--finto-1); }
.js .fx-log .fx-log-e {   
  animation: logEntra 0.5s var(--ease-out) both;
  animation-delay: var(--d, 0ms);
}
@keyframes logEntra {
  from { opacity: 0; transform: translateX(-8px); }
  to   { opacity: 1; transform: none; }
}
.fx-log-piede {
  display: flex; align-items: center; gap: 10px;
  margin-top: 14px; padding-top: 13px;
  border-top: 1px solid var(--border);
  font-size: 11.5px; color: var(--finto-2);
}
.fx-log-exp {
  margin-left: auto;
  font-size: 11px; font-weight: 600;
  padding: 6px 13px; border-radius: 999px;
  background: var(--accent-dim); color: var(--accent);
  border: 1px solid var(--accent-line);
}
@media (prefers-reduced-motion: reduce) {
  .js .fx-log .fx-log-e { animation: none; opacity: 1; transform: none; }
  .js .fx-log-e { opacity: 1; transform: none; }
}
.fx-wg-col { display: grid; place-items: center; }
.fx-wg-col .wg { margin: 0 auto; }
.intro { display: none; }
.js .intro {
  display: grid; place-items: center;
  position: fixed; inset: 0; z-index: 200;
  cursor: pointer;
  overflow: hidden;
}
.js .intro.preme { pointer-events: none; }
.js .intro.finita { visibility: hidden; pointer-events: none; }
.intro-buco {
  position: absolute; left: 50%; top: 50%;
  width: 0; height: 0; border-radius: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 0 100vmax #050506, inset 0 0 0 0 rgba(77,171,154,0);
  pointer-events: none;
}
.intro.preme .intro-buco { animation: introApertura 2.2s var(--ease-out) 0.35s forwards; }
@keyframes introApertura {
  0% {
    width: 104px; height: 104px;
    box-shadow: 0 0 0 100vmax #050506, inset 0 0 30px 4px rgba(77,171,154,0.75);
  }
  55% {
    box-shadow: 0 0 0 100vmax #050506, inset 0 0 60px 6px rgba(77,171,154,0.22);
  }
  100% {
    width: 260vmax; height: 260vmax;
    box-shadow: 0 0 0 100vmax #050506, inset 0 0 90px 8px rgba(77,171,154,0);
  }
}
.js body.intro-aperta { overflow: hidden; }
.js body.intro-prima .fx-main,
.js body.intro-prima .nav { visibility: hidden; }
.intro-cerchio {
  position: relative;
  width: 104px; height: 104px; border-radius: 50%;
  background: var(--accent);
  box-shadow:
    0 0 0 1px rgba(77,171,154,0.45),
    0 0 48px 8px rgba(77,171,154,0.38),
    0 0 130px 20px rgba(77,171,154,0.18),
    0 20px 50px -16px rgba(0,0,0,0.9);
  transition: transform 0.3s var(--ease-out);
}
.intro-cerchio::before, .intro-cerchio::after {
  content: ''; position: absolute; background: var(--on-accent); border-radius: 2px;
}
.intro-cerchio::before { left: 50%; top: 34px; width: 3px; height: 36px; margin-left: -1.5px; }
.intro-cerchio::after  { top: 50%; left: 34px; height: 3px; width: 36px; margin-top: -1.5px; }
.intro-anello {
  position: absolute; left: 50%; top: 50%;
  width: 104px; height: 104px; margin: -52px 0 0 -52px;
  border-radius: 50%; border: 1px solid var(--accent);
  opacity: 0; pointer-events: none;
  animation: introRespiro 3s var(--ease-out) infinite;
}
.intro-anello.due { animation-delay: 1.5s; }
@keyframes introRespiro {
  0%   { transform: scale(1);   opacity: 0.55; }
  75%  { transform: scale(2.4); opacity: 0; }
  100% { transform: scale(2.4); opacity: 0; }
}
.intro-invito {
  position: absolute; left: 0; right: 0; bottom: 14%;
  text-align: center;
  font-size: 11px; font-weight: 600;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--text-muted);
  animation: introInvito 2.6s ease-in-out infinite;
}
@keyframes introInvito { 0%, 100% { opacity: 0.35; } 50% { opacity: 0.85; } }
.intro.preme .intro-cerchio { transform: scale(0.9); }
.intro.preme .intro-anello,
.intro.preme .intro-invito { animation: none; opacity: 0; transition: opacity 0.2s; }
.intro-onda {
  position: absolute; left: 50%; top: 50%;
  width: 104px; height: 104px; margin: -52px 0 0 -52px;
  border-radius: 50%; border: 2px solid var(--accent);
  opacity: 0; pointer-events: none;
}
.intro.preme .intro-onda { animation: introOnda 1.3s var(--ease-out) forwards; }
@keyframes introOnda {
  0%   { transform: scale(1);   opacity: 0.9; }
  100% { transform: scale(3.4); opacity: 0; }
}
.intro.preme .intro-cerchio {
  animation: introSvanisce 0.72s var(--ease-out) 0.35s forwards;
}
@keyframes introSvanisce {
  0%   { transform: scale(0.9); opacity: 1; }
  100% { transform: scale(1.9); opacity: 0; }
}
.js .fx-main.entra .fx-hero-wgbox,
.js .fx-main.entra .fx-hero-testo {
  animation: introDalCentro 1.65s var(--ease-out) both;
}
.js .fx-main.entra .fx-hero-wgbox { animation-delay: 0s; }
.js .fx-main.entra .fx-hero-testo { animation-delay: 0.3s; }
@keyframes introDalCentro {
  from {
    opacity: 0;
    transform: translate(var(--dx, 0px), var(--dy, 0px)) scale(0.55);
  }
  to { opacity: 1; transform: none; }
}
.js .fx-main.entra .fx-hero .fx-crumb,
.js .fx-main.entra .fx-hero-testo .fx-kicker,
.js .fx-main.entra .fx-hero-testo h1,
.js .fx-main.entra .fx-hero-testo .fx-lead,
.js .fx-main.entra .fx-hero-testo .fx-cta,
.js .fx-main.entra .fx-hero-testo .fx-hero-elenco,
.js .fx-main.entra .fx-hero-testo .fx-plan,
.js .nav.entra { animation: introAccende 0.85s ease both; }
.js .fx-main.entra .fx-hero .fx-crumb                 { animation-delay: 0.55s; }
.js .nav.entra                                        { animation-delay: 0.65s; }
.js .fx-main.entra .fx-hero-testo .fx-kicker          { animation-delay: 0.75s; }
.js .fx-main.entra .fx-hero-testo h1                  { animation-delay: 0.88s; }
.js .fx-main.entra .fx-hero-testo .fx-lead            { animation-delay: 1.05s; }
.js .fx-main.entra .fx-hero-testo .fx-cta             { animation-delay: 1.20s; }
.js .fx-main.entra .fx-hero-testo .fx-hero-elenco     { animation-delay: 1.32s; }
.js .fx-main.entra .fx-hero-testo .fx-plan            { animation-delay: 1.44s; }
@keyframes introAccende {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.js .fx-main.entra .fx-hero-didascalia {
  animation: introAccende 0.85s ease 1.6s both;
}
@media (max-width: 720px) {
  .intro-cerchio { width: 84px; height: 84px; }
  .intro-cerchio::before { top: 27px; height: 30px; }
  .intro-cerchio::after  { left: 27px; width: 30px; }
  .intro-anello, .intro-onda { width: 84px; height: 84px; margin: -42px 0 0 -42px; }
  .intro-invito { bottom: 12%; font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .js .intro { display: none; }
  .js .nav.entra,
  .js .fx-main.entra .fx-hero-wgbox,
  .js .fx-main.entra .fx-hero-testo,
  .js .fx-main.entra .fx-hero-testo *,
  .js .fx-main.entra .fx-hero .fx-crumb,
  .js .fx-main.entra .fx-hero-didascalia { animation: none; }
}
.fx-wm {
  position: relative;
  background: var(--bg);
  border: 1px solid var(--border-med);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 34px 80px -34px rgba(0,0,0,0.9);
  font-size: 12px;
}
.fx-wm-bar {
  display: flex; align-items: center; gap: 7px;
  padding: 10px 13px; background: var(--surface2);
  border-bottom: 1px solid var(--border);
}
.fx-wm-bar i { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.13); }
.fx-wm-bar b {
  margin-left: 6px; font-size: 11px; font-weight: 600;
  color: var(--finto-2); letter-spacing: 0.02em;
}
.fx-wm-bar .oggi { margin-left: auto; font-size: 10.5px; color: var(--finto-2); }
.fx-wm-body { padding: 14px; }
.fx-wm-tabs { display: flex; border-bottom: 1px solid var(--border); }
.fx-wm-tabs span {
  flex: 1; padding: 8px 2px; text-align: center;
  font-size: 11px; font-weight: 600; color: var(--finto-2);
  border-bottom: 2px solid transparent;
}
.fx-wm-tabs span.on { color: var(--accent); border-bottom-color: var(--accent); }
.fx-wm-chips { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 9px; }
.fx-wm-chip {
  font-size: 10.5px; padding: 5px 10px; border-radius: 20px;
  background: var(--surface2); color: var(--finto-1);
  border: 1px solid transparent; white-space: nowrap;
}
.fx-wm-btn {
  margin-top: 11px; margin-left: auto; width: max-content;
  font-size: 10.5px; font-weight: 600;
  padding: 6px 14px; border-radius: 7px;
  background: var(--accent); color: var(--on-accent);
}
.fx-nt-campo {
  position: relative;
  background: var(--surface); border: 1px solid var(--border-med);
  border-radius: 9px; padding: 10px 12px;
  min-height: 84px; font-size: 11.5px; color: var(--finto-1);
}
.fx-nt-scritto { display: inline-block; overflow: hidden; white-space: nowrap; vertical-align: bottom; }
.js .fx-nt-scritto { width: 0; }
.js .fx-nt.in .fx-nt-scritto { animation: ntScrive 10s steps(40, end) infinite; }
@keyframes ntScrive {
  0%, 3%    { width: 0; }
  30%, 94%  { width: 20.5em; }     
  98%, 100% { width: 0; }
}
.fx-nt-cursore {
  display: inline-block; width: 1.5px; height: 12px;
  background: var(--accent); vertical-align: -2px;
}
.js .fx-nt.in .fx-nt-cursore { animation: ntCursore 0.9s steps(1, end) infinite; }
@keyframes ntCursore { 0%, 49% { opacity: 1; } 50%, 100% { opacity: 0.15; } }
.fx-nt-shot {
  display: block; margin-top: 9px;
  height: 34px; border-radius: 5px; overflow: hidden;
  background: var(--surface2); border: 1px solid var(--border);
}
.fx-nt-shot svg { width: 100%; height: 100%; display: block; }
.js .fx-nt-shot { opacity: 0; transform: scale(0.94); transform-origin: left center; }
.js .fx-nt.in .fx-nt-shot { animation: ntShot 10s var(--ease-out) infinite; }
@keyframes ntShot {
  0%, 32%   { opacity: 0; transform: scale(0.94); }
  38%, 94%  { opacity: 1; transform: none; }
  98%, 100% { opacity: 0; transform: scale(0.94); }
}
.js .fx-nt.in .fx-wm-chip.lampo { animation: ntLampo 10s var(--ease) infinite; }
@keyframes ntLampo {
  0%, 28%   { background: var(--surface2); color: var(--finto-1); border-color: transparent; }
  32%, 40%  { background: var(--accent-dim); color: var(--accent); border-color: var(--accent-line); }
  46%, 100% { background: var(--surface2); color: var(--finto-1); border-color: transparent; }
}
.js .fx-nt.in .fx-wm-chip.scelto { animation: ntCat 10s var(--ease) infinite; }
@keyframes ntCat {
  0%, 44%   { background: var(--surface2); color: var(--finto-1); border-color: transparent; }
  50%, 94%  { background: rgba(124,110,220,0.18); color: #a99bf0; border-color: rgba(124,110,220,0.4); }
  98%, 100% { background: var(--surface2); color: var(--finto-1); border-color: transparent; }
}
.js .fx-nt.in .fx-wm-btn { animation: wmPreme 10s var(--ease) infinite; }
@keyframes wmPreme {
  0%, 56%   { transform: scale(1); filter: none; }
  60%       { transform: scale(0.94); filter: brightness(1.15); }
  66%, 100% { transform: scale(1); filter: none; }
}
.fx-nt-salvata {
  margin-top: 12px; padding: 9px 11px; border-radius: 8px;
  background: linear-gradient(100deg, rgba(124,110,220,0.10), var(--surface) 55%);
  border: 1px solid var(--border); border-left: 3px solid #7c6edc;
}
.fx-nt-salvata .riga { display: flex; align-items: center; gap: 8px; margin-bottom: 5px; }
.fx-nt-salvata .cat {
  font-size: 9.5px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  color: #a99bf0; background: rgba(124,110,220,0.16);
  padding: 2px 7px; border-radius: 999px;
}
.fx-nt-salvata time { margin-left: auto; font-size: 10px; color: var(--finto-2); font-variant-numeric: tabular-nums; }
.fx-nt-salvata p { font-size: 11.5px; line-height: 1.45; color: var(--finto-1); }
.js .fx-nt-salvata { opacity: 0; transform: translateY(10px); }
.js .fx-nt.in .fx-nt-salvata { animation: ntSalvata 10s var(--ease-out) infinite; }
@keyframes ntSalvata {
  0%, 62%   { opacity: 0; transform: translateY(10px); }
  70%, 94%  { opacity: 1; transform: none; }
  98%, 100% { opacity: 0; transform: translateY(10px); }
}
.fx-td-riga { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 6px; }
.fx-td-riga.tre { grid-template-columns: repeat(3, 1fr); }
.fx-td-opt {
  text-align: center; font-size: 11px; font-weight: 600;
  padding: 8px 4px; border-radius: 7px;
  background: var(--surface2); color: var(--finto-2);
  border: 1px solid var(--border);
}
.js .fx-td.in .fx-td-opt.short { animation: tdShort 10s var(--ease) infinite; }
@keyframes tdShort {
  0%, 10%   { background: var(--surface2); color: var(--finto-2); border-color: var(--border); }
  16%, 94%  { background: rgba(244,63,94,0.14); color: var(--red); border-color: rgba(244,63,94,0.4); }
  98%, 100% { background: var(--surface2); color: var(--finto-2); border-color: var(--border); }
}
.js .fx-td.in .fx-td-opt.stop { animation: tdStop 10s var(--ease) infinite; }
@keyframes tdStop {
  0%, 24%   { background: var(--surface2); color: var(--finto-2); border-color: var(--border); }
  30%, 94%  { background: rgba(244,63,94,0.14); color: var(--red); border-color: rgba(244,63,94,0.4); }
  98%, 100% { background: var(--surface2); color: var(--finto-2); border-color: var(--border); }
}
.fx-td-meta { display: flex; gap: 5px; flex-wrap: wrap; margin: 9px 0 0; }
.fx-td-meta .p {
  font-size: 10.5px; padding: 4px 9px; border-radius: 6px;
  background: var(--surface); border: 1px solid var(--border);
  color: var(--finto-2); white-space: nowrap;
}
.fx-td-meta .p b { color: var(--finto-1); font-weight: 600; }
.fx-td-meta .p.setup { background: var(--accent-dim); border-color: var(--accent-line); color: var(--accent); }
.js .fx-td-meta .p { opacity: 0; transform: translateY(5px); }
.js .fx-td.in .fx-td-meta .p {
  animation: tdEntra 10s var(--ease-out) infinite;
  animation-delay: var(--d, 0ms);
}
@keyframes tdEntra {
  0%, 34%   { opacity: 0; transform: translateY(5px); }
  40%, 94%  { opacity: 1; transform: none; }
  98%, 100% { opacity: 0; transform: translateY(5px); }
}
.fx-td-tags { display: flex; gap: 5px; margin-top: 8px; align-items: center; }
.fx-td-tags .t {
  font-size: 10px; padding: 3px 8px; border-radius: 999px;
  background: rgba(77,171,154,0.12); color: var(--accent);
  border: 1px solid rgba(77,171,154,0.26); white-space: nowrap;
}
.fx-td-tags .piu {
  font-size: 10px; font-weight: 700; padding: 3px 8px; border-radius: 999px;
  background: var(--surface3); color: var(--finto-2);
}
.js .fx-td-tags > * { opacity: 0; }
.js .fx-td.in .fx-td-tags > * {
  animation: tdTag 10s ease infinite;
  animation-delay: var(--d, 0ms);
}
@keyframes tdTag {
  0%, 46%   { opacity: 0; }
  54%, 94%  { opacity: 1; }
  98%, 100% { opacity: 0; }
}
.js .fx-td.in .fx-wm-btn { animation: wmPreme 10s var(--ease) infinite; }
.js .fx-cards.a-turno.in .fx-card {
  animation: fxTurno 7s var(--ease) infinite;
  animation-delay: var(--d, 0ms);
}
@keyframes fxTurno {
  0%, 16%, 100% { border-color: var(--border); background: var(--surface); }
  6%            { border-color: var(--accent-line); background: var(--surface-hi); }
}
.js .fx-cards.a-turno.in .fx-card .fx-card-ico {
  animation: fxTurnoIco 7s var(--ease) infinite;
  animation-delay: var(--d, 0ms);
}
@keyframes fxTurnoIco {
  0%, 16%, 100% { background: var(--fx-dim); transform: none; }
  6%            { background: rgba(77,171,154,0.24); transform: translateY(-2px); }
}
@media (prefers-reduced-motion: reduce) {
  .js .fx-nt.in *, .js .fx-td.in *,
  .js .fx-cards.a-turno.in .fx-card,
  .js .fx-cards.a-turno.in .fx-card .fx-card-ico { animation: none !important; }
  .js .fx-nt-scritto { width: auto; }
  .js .fx-nt-shot, .js .fx-nt-salvata,
  .js .fx-td-meta .p, .js .fx-td-tags > * { opacity: 1; transform: none; }
}
.js [data-cycle].idle { --play: paused; }
.fx-pila { margin-top: clamp(18px, calc(1.9 * var(--vu)), 30px); }
.fx-pila-scr {
  position: relative; width: 100%; aspect-ratio: 16 / 8.4;
  border: 1px solid var(--border); border-radius: 14px; overflow: hidden;
  background:
    radial-gradient(120% 90% at 22% -10%, rgba(77,171,154,0.10), transparent 58%),
    linear-gradient(180deg, #0e0f11, #08090a);
}
.fx-fin {
  position: absolute; border: 1px solid var(--border-med); border-radius: 9px;
  background: var(--surface); overflow: hidden;
  box-shadow: 0 26px 60px -26px rgba(0,0,0,0.95);
}
.fx-fin-bar {
  display: flex; align-items: center; gap: 6px;
  padding: 0 10px; height: 26px;
  border-bottom: 1px solid var(--border);
  font-size: 9.5px; font-weight: 600; color: var(--finto-2);
  background: var(--surface2);
}
.fx-fin-bar i { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,0.14); }
.fx-fin-bar span { margin-left: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fx-fin-corpo { position: absolute; inset: 26px 0 0 0; padding: 10px 11px; }
.fx-pila-scr .f1 { left: 3.5%; top: 8%;  width: 56%; height: 62%; }
.fx-pila-scr .f2 { left: 15%;  top: 24%; width: 54%; height: 62%; }
.fx-pila-scr .f3 { left: 27%;  top: 40%; width: 52%; height: 56%; }
.fx-fin-graf { position: absolute; inset: 10px 11px; }
.fx-fin-graf i {
  position: absolute; width: 3.2%; border-radius: 1px;
  top: var(--t); height: var(--h);
}
.fx-fin-graf i:nth-child(1)  { left: 1%; }
.fx-fin-graf i:nth-child(2)  { left: 7%; }
.fx-fin-graf i:nth-child(3)  { left: 13%; }
.fx-fin-graf i:nth-child(4)  { left: 19%; }
.fx-fin-graf i:nth-child(5)  { left: 25%; }
.fx-fin-graf i:nth-child(6)  { left: 31%; }
.fx-fin-graf i:nth-child(7)  { left: 37%; }
.fx-fin-graf i:nth-child(8)  { left: 43%; }
.fx-fin-graf i:nth-child(9)  { left: 49%; }
.fx-fin-graf i:nth-child(10) { left: 55%; }
.fx-fin-graf i:nth-child(11) { left: 61%; }
.fx-fin-graf i:nth-child(12) { left: 67%; }
.fx-fin-graf i:nth-child(13) { left: 73%; }
.fx-fin-graf i:nth-child(14) { left: 79%; }
.fx-fin-graf i:nth-child(15) { left: 85%; }
.fx-fin-graf i:nth-child(16) { left: 91%; }
.fx-fin-graf i.up { background: rgba(34,197,94,0.34); }
.fx-fin-graf i.dn { background: rgba(244,63,94,0.32); }
.fx-fin-righe { display: flex; flex-direction: column; gap: 7px; }
.fx-fin-righe i {
  height: 5px; border-radius: 3px; width: var(--w, 70%);
  background: rgba(255,255,255,0.10);
}
.fx-fin-righe i.v { background: rgba(34,197,94,0.22); }
.fx-fin-righe i.r { background: rgba(244,63,94,0.20); }
.fx-fin-pag { display: flex; flex-direction: column; gap: 7px; }
.fx-fin-pag b { height: 13px; border-radius: 4px; background: rgba(255,255,255,0.07); }
.fx-fin-pag i { height: 5px; border-radius: 3px; width: var(--w, 70%); background: rgba(255,255,255,0.08); }
.js .fx-pila.in .fx-fin:not(.wgin) {
  animation: fxTurnoFin 12s var(--ease) infinite;
  animation-play-state: var(--play, running);
}
.js .fx-pila.in .fx-fin.f2 { animation-delay: -8s; }
.js .fx-pila.in .fx-fin.f3 { animation-delay: -4s; }
@keyframes fxTurnoFin {
  0%, 27%      { z-index: 4; transform: translateY(0) scale(1);
                 filter: none; border-color: rgba(255,255,255,0.17);
                 box-shadow: 0 34px 74px -26px rgba(0,0,0,1); }
  27.01%, 100% { z-index: 1; transform: translateY(7px) scale(0.972);
                 filter: brightness(0.6) saturate(0.45); border-color: var(--border);
                 box-shadow: 0 18px 44px -26px rgba(0,0,0,0.9); }
}
.fx-pila-wg { position: absolute; right: 3.5%; top: 10%; width: 30%; z-index: 9; }
.fx-pila-wg .fx-fin {
  position: relative; left: auto; top: auto; width: 100%; height: auto;
  border-color: var(--accent-line);
  box-shadow: 0 34px 70px -26px rgba(0,0,0,1), 0 0 0 1px rgba(77,171,154,0.10),
              0 0 46px -14px rgba(77,171,154,0.35);
}
.fx-pila-wg .fx-fin-corpo { position: relative; inset: auto; }
.fx-fin-bar .pallino { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); margin-right: 2px; flex: 0 0 auto; }
.fx-fin-bar span { color: var(--finto-1); }
.fx-fin-tabs {
  display: flex; border-bottom: 1px solid var(--border);
  font-size: 9px; font-weight: 600; color: var(--finto-2);
}
.fx-fin-tabs > * { flex: 1; text-align: center; padding: 7px 0; border-bottom: 1.5px solid transparent; }
.fx-fin-tabs b { color: var(--accent); border-bottom-color: var(--accent); font-weight: 600; }
.fx-fin-righe.wg { padding: 11px; }
.fx-pila-eti {
  display: block; margin-top: 9px; text-align: center;
  font-size: 9.5px; font-weight: 700; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--accent);
}
.fx-pila-leg {
  list-style: none; display: flex; flex-wrap: wrap; gap: 10px 30px;
  margin-top: 20px; font-size: 12.5px; color: var(--text-muted);
}
.fx-pila-leg li { display: flex; align-items: center; gap: 9px; }
.fx-pila-leg i { width: 7px; height: 7px; border-radius: 2px; background: var(--border-med); flex: 0 0 auto; }
.fx-pila-leg .fisso { color: var(--text); margin-left: auto; }
.fx-pila-leg .fisso i { background: var(--accent); border-radius: 50%; }
.js .fx-pila.in .fx-pila-leg li:not(.fisso) {
  animation: fxTurnoLeg 12s var(--ease) infinite;
  animation-delay: var(--d, 0s);
  animation-play-state: var(--play, running);
}
@keyframes fxTurnoLeg {
  0%, 27%     { color: var(--text); }
  33%, 100%   { color: var(--text-muted); }
}
.js .fx-pila.in .fx-pila-leg li:not(.fisso) i {
  animation: fxTurnoLegP 12s var(--ease) infinite;
  animation-delay: var(--d, 0s);
  animation-play-state: var(--play, running);
}
@keyframes fxTurnoLegP {
  0%, 27%   { background: var(--accent); }
  33%, 100% { background: var(--border-med); }
}
@media (max-width: 760px) {
  .fx-pila-scr { aspect-ratio: 16 / 12; }
  .fx-pila-wg { width: 38%; top: 6%; }
  .fx-pila-leg .fisso { margin-left: 0; }
}
.fx-rail { position: relative; margin-top: clamp(20px, calc(2.2 * var(--vu)), 34px); }
.fx-rail-pista {
  position: relative; height: 1px; margin: 0 0 0 5px;
  background: linear-gradient(90deg, transparent, var(--border-med) 4%, var(--border-med) 96%, transparent);
}
.fx-rail-ora {
  position: absolute; top: 50%; left: 0; width: 8px; height: 8px;
  margin: -4px 0 0 -4px; border-radius: 50%;
  background: var(--accent); box-shadow: 0 0 0 4px rgba(77,171,154,0.14), 0 0 18px 2px rgba(77,171,154,0.5);
}
.fx-rail-ora::before {
  content: ''; position: absolute; right: 4px; top: 50%;
  width: 120px; height: 1px; margin-top: -0.5px;
  background: linear-gradient(270deg, rgba(77,171,154,0.55), transparent);
}
.js .fx-rail .fx-rail-ora {
  animation: fxOra 16.2s linear infinite;
  animation-play-state: var(--play, running);
}
@keyframes fxOra { from { left: 0; } to { left: 100%; } }
.fx-rail-tappe { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 26px; }
.fx-tappa { position: relative; padding: 26px 22px 0 0; }
.fx-tappa .pun {
  position: absolute; left: 0; top: -4px; width: 9px; height: 9px;
  border-radius: 50%; background: var(--bg);
  border: 1.5px solid var(--border-med);
}
.fx-tappa .ora {
  display: block; font-size: 12px; font-weight: 700;
  font-variant-numeric: tabular-nums; letter-spacing: 0.02em;
  color: var(--text-muted);
}
.fx-tappa h3 { margin-top: 8px; font-size: 17px; color: var(--text); }
.fx-tappa .sch {
  display: inline-block; margin-top: 9px;
  font-size: 9.5px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--text-muted); border: 1px solid var(--border-med);
  border-radius: 20px; padding: 3px 10px;
}
.fx-tappa p { margin-top: 11px; font-size: 13.5px; line-height: 1.55; color: var(--text-dim); }
.js .fx-rail .fx-tappa .pun,
.js .fx-rail .fx-tappa .ora,
.js .fx-rail .fx-tappa .sch {
  animation-duration: 16.2s; animation-iteration-count: infinite;
  animation-timing-function: var(--ease);
  animation-delay: var(--d, 0s);
  animation-play-state: var(--play, running);
}
.js .fx-rail .fx-tappa .pun { animation-name: fxTappaPun; }
.js .fx-rail .fx-tappa .ora { animation-name: fxTappaOra; }
.js .fx-rail .fx-tappa .sch { animation-name: fxTappaSch; }
@keyframes fxTappaPun {
  0%       { background: var(--bg); border-color: var(--border-med); box-shadow: none; }
  2%, 30%  { background: var(--accent); border-color: var(--accent); box-shadow: 0 0 0 5px rgba(77,171,154,0.13); }
  40%,100% { background: var(--bg); border-color: var(--border-med); box-shadow: none; }
}
@keyframes fxTappaOra {
  0%       { color: var(--text-muted); }
  2%, 30%  { color: var(--accent); }
  40%,100% { color: var(--text-muted); }
}
@keyframes fxTappaSch {
  0%       { color: var(--text-muted); border-color: var(--border-med); }
  2%, 30%  { color: var(--accent); border-color: var(--accent-line); }
  40%,100% { color: var(--text-muted); border-color: var(--border-med); }
}
@media (max-width: 760px) {
  .fx-rail-pista { display: none; }
  .fx-rail-tappe { grid-template-columns: 1fr; gap: 26px; }
  .fx-tappa { padding: 0 0 0 20px; border-left: 1px solid var(--border-med); }
  .fx-tappa .pun { left: -5px; top: 4px; }
}
.fx-momento { padding: clamp(48px, calc(5.6 * var(--vu)), 96px) 0; position: relative; }
.fx-sec + .fx-momento, .fx-momento + .fx-sec { border-top: 1px solid var(--border); }
.fx-momento .ghostword { left: 74%; opacity: 0.62; }
.fx-momento-t {
  max-width: 26ch; text-wrap: balance; font-size: clamp(24px, calc(3 * var(--vu)), 52px);
  font-weight: 700; letter-spacing: -0.03em; line-height: 1.14;
  color: var(--text-muted);
}
.fx-momento-t b { color: var(--text); font-weight: 700; }
@media (max-width: 760px) { .fx-momento { padding: 64px 0; } }
.fx-sec[data-ghost], .fx-momento[data-ghost] { position: relative; }
.fx-sec[data-ghost] > .wrap, .fx-momento[data-ghost] > .wrap { position: relative; z-index: 1; }
@media (prefers-reduced-motion: reduce) {
  .js .fx-pila.in .fx-fin:not(.wgin),
  .js .fx-pila.in .fx-pila-leg li:not(.fisso),
  .js .fx-pila.in .fx-pila-leg li:not(.fisso) i,
  .js .fx-rail .fx-rail-ora,
  .js .fx-rail .fx-tappa .pun,
  .js .fx-rail .fx-tappa .ora,
  .js .fx-rail .fx-tappa .sch { animation: none !important; }
  .fx-pila-scr .f1 { z-index: 3; } .fx-pila-scr .f2 { z-index: 2; }
  .fx-rail-ora { display: none; }
}
@media (min-width: 1001px) and (max-height: 900px) {
  .fx-hero-wgbox figure, .fx-apri-wrap, .fx-wm, .fx-reg, .fx-log,
  .fx-shot figure { zoom: 0.88; }
}
@media (min-width: 1001px) and (max-height: 820px) {
  .fx-hero-wgbox figure, .fx-apri-wrap, .fx-wm, .fx-reg, .fx-log,
  .fx-shot figure { zoom: 0.8; }
}
@media (min-width: 1001px) and (max-height: 720px) {
  .fx-hero-wgbox figure, .fx-apri-wrap, .fx-wm, .fx-reg, .fx-log,
  .fx-shot figure { zoom: 0.73; }
}
@media (min-width: 1001px) and (max-height: 640px) {
  .fx-hero-wgbox figure, .fx-apri-wrap, .fx-wm, .fx-reg, .fx-log,
  .fx-shot figure { zoom: 0.66; }
}
@media (min-width: 1001px) {
  .fx-pila-scr {
    width: min(100%, calc((100vh - 300px) * 16 / 8.4));
    margin: 0 auto;
  }
}
@media (min-width: 1001px) {
  .fx-sec, .fx-momento, .fx-real, .fx-hero, .fx-shot {
    min-height: min(90vh, 820px);
    display: flex; flex-direction: column; justify-content: center;
    position: relative;
  }
  .fx-hero::before { position: absolute; }
}
.fx-sec::before, .fx-momento::before, .fx-real::before, .fx-shot::before {
  content: ''; position: absolute; left: 50%; top: 0;
  width: 1px; height: clamp(30px, 5vh, 54px);
  background: linear-gradient(180deg, rgba(77,171,154,0.5), transparent);
  transform: translateX(-50%);
  pointer-events: none;
}
.fx-hero + .fx-sec::before, .fx-hero + .fx-real::before,
.fx-hero + .fx-shot::before { display: none; }
.fx-cue {
  position: absolute; left: 50%; bottom: clamp(14px, 2.6vh, 30px);
  transform: translateX(-50%); z-index: 2;
  display: flex; flex-direction: column; align-items: center; gap: 9px;
  font-size: 10px; font-weight: 600; letter-spacing: 0.22em;
  text-transform: uppercase; color: var(--text-muted);
  pointer-events: none;
}
.fx-cue .filo {
  position: relative; width: 1px; height: clamp(26px, 4.4vh, 42px);
  background: linear-gradient(180deg, rgba(77,171,154,0.55), transparent);
}
.fx-cue .filo::after {
  content: ''; position: absolute; left: -1px; top: 0;
  width: 3px; height: 3px; border-radius: 50%; background: var(--accent);
}
.js .fx-cue .filo::after { animation: fxCue 2.6s var(--ease) infinite; }
@keyframes fxCue {
  0%        { top: 0;    opacity: 0; }
  22%       { opacity: 1; }
  70%, 100% { top: 100%; opacity: 0; }
}
@media (max-width: 1000px) { .fx-cue { display: none; } }
@media (prefers-reduced-motion: reduce) {
  .js .fx-cue .filo::after { animation: none; top: 0; }
}
.ap { font-size: 12px; }
.ap-body { display: flex; flex-direction: column; gap: 12px; padding: 16px 18px 16px; }
.ap-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.ap-t { display: block; font-size: 19px; font-weight: 700; letter-spacing: -0.02em; color: var(--text); }
.ap-s { font-size: 11px; color: var(--finto-2); }
.ap-btns { display: flex; gap: 6px; }
.ap-btns span {
  font-size: 10px; padding: 4px 10px; border-radius: 999px; white-space: nowrap;
  border: 1px solid var(--border-med); color: var(--finto-1);
}
.ap-how { display: flex; align-items: center; gap: 8px; font-size: 11px; }
.ap-how b { font-weight: 600; color: var(--text); }
.ap-pill {
  font-size: 9.5px; padding: 2px 9px; border-radius: 999px;
  color: var(--accent); background: var(--accent-dim); border: 1px solid var(--accent-line);
}
.ap-cols {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
  padding-bottom: 12px; border-bottom: 1px solid var(--border);
}
.ap-cols b { display: block; margin-bottom: 2px; font-size: 10.5px; font-weight: 600; color: var(--text); }
.ap-cols span { font-size: 10px; line-height: 1.45; color: var(--finto-2); }
.ap-list { display: flex; flex-direction: column; gap: 7px; }
.ap-acc {
  position: relative; overflow: hidden;
  border: 1px solid var(--border); border-left: 3px solid var(--green);
  border-radius: var(--radius-sm);
  background: linear-gradient(135deg, rgba(34,197,94,0.11), var(--surface) 60%);
}
.ap-acc.giallo {
  border-left-color: var(--yellow);
  background: linear-gradient(135deg, rgba(234,179,8,0.11), var(--surface) 60%);
}
.ap-anim::before {
  content: ''; position: absolute; inset: 0; z-index: 0; opacity: 0; pointer-events: none;
  background: linear-gradient(135deg, rgba(234,179,8,0.13), var(--surface) 60%);
}
.ap-riga {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: 28px minmax(0, 1.6fr) 92px minmax(0, 1fr) 250px;
  gap: 12px; align-items: center; padding: 9px 12px;
}
.ap-av {
  width: 28px; height: 28px; border-radius: 7px; display: grid; place-items: center;
  font-size: 9.5px; font-weight: 700; color: var(--green); background: rgba(34,197,94,0.12);
}
.giallo .ap-av { color: var(--yellow); background: rgba(234,179,8,0.12); }
.ap-nome { min-width: 0; }
.ap-nome b { display: block; font-size: 12.5px; font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ap-nome > span { display: block; font-size: 9.5px; color: var(--finto-2); white-space: nowrap; }
.ap-nome i { font-style: normal; font-weight: 600; }
.ap-nome .ok { color: var(--green); }
.ap-nome .no { color: var(--yellow); }
.ap-pnl { text-align: right; }
.ap-pnl b { display: block; font-size: 15px; font-weight: 700; color: var(--green); font-variant-numeric: tabular-nums; }
.giallo .ap-pnl b { color: var(--finto-2); }
.ap-pnl span { font-size: 8.5px; color: var(--finto-2); white-space: nowrap; }
.ap-num, .ap-num .v-a, .ap-num .v-c { display: flex; gap: 14px; }
.ap-num span { font-size: 8px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--finto-2); }
.ap-num b { display: block; font-size: 12px; letter-spacing: 0; color: var(--text); font-variant-numeric: tabular-nums; }
.ap-mai { font-size: 9.5px; line-height: 1.4; color: var(--finto-1); }
.ap-az { position: relative; display: flex; gap: 6px; justify-content: flex-end; }
.ap-sel {
  flex: 1; min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 6px;
  padding: 5px 9px; border-radius: 6px;
  background: var(--surface2); border: 1px solid var(--border-med);
  font-size: 10px; color: var(--finto-1); white-space: nowrap; overflow: hidden;
}
.ap-sel::after { content: '\2304'; color: var(--finto-2); line-height: 0.6; }
.ap-bt {
  padding: 5px 9px; border-radius: 6px; white-space: nowrap;
  border: 1px solid var(--border-med); font-size: 10px; color: var(--finto-1);
}
.ap-more { align-self: center; font-size: 10px; padding: 4px 12px; border-radius: 999px; border: 1px solid var(--border); color: var(--finto-2); }
.ap-due { display: grid; }
.ap-nome > .ap-due { display: grid; }
.ap-due > * { grid-area: 1 / 1; }
.ap-anim .v-a { opacity: 0; }
.ap-sel .s1 { opacity: 0; }
.ap-prev { position: relative; z-index: 1; max-height: 0; opacity: 0; overflow: hidden; }
.ap-prev-i {
  display: flex; align-items: center; gap: 12px;
  margin: 0 12px 10px 52px; padding: 7px 8px 7px 11px; border-radius: 6px;
  background: rgba(77,171,154,0.07); border: 1px dashed rgba(77,171,154,0.38);
  font-size: 10px; color: var(--finto-1); font-variant-numeric: tabular-nums;
}
.ap-prev-i b { color: var(--text); font-weight: 600; }
.ap-prev-k { font-size: 8.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--accent); }
.ap-go {
  position: relative; margin-left: auto;
  padding: 4px 12px; border-radius: 6px;
  background: var(--accent); color: var(--on-accent); font-weight: 700; font-size: 10px;
}
.ap-cur {
  position: absolute; width: 16px; height: 16px; opacity: 0; pointer-events: none; z-index: 3;
  fill: #f0f0f2; stroke: #0b0b0c; stroke-width: 1.3;
  filter: drop-shadow(0 2px 3px rgba(0,0,0,0.6));
}
.ap-cur.c1 { left: 38%; top: 55%; }
.ap-cur.c2 { left: 55%; top: 45%; }
.js .ap-anim::before   { animation: apVelo  10s var(--ease) infinite; }
.js .ap-anim           { animation: apBordo 10s var(--ease) infinite; }
.js .ap-anim .v-a      { animation: apA     10s var(--ease) infinite; }
.js .ap-anim .v-c      { animation: apC     10s var(--ease) infinite; }
.js .ap-anim .ap-sel   { animation: apFoc   10s var(--ease) infinite; }
.js .ap-sel .s1        { animation: apS1    10s steps(1, end) infinite; }
.js .ap-sel .s2        { animation: apS2    10s steps(1, end) infinite; }
.js .ap-prev           { animation: apPrev  10s var(--ease) infinite; }
.js .ap-go             { animation: apGo    10s var(--ease) infinite; }
.js .ap-cur.c1         { animation: apCur1  10s var(--ease) infinite; }
.js .ap-cur.c2         { animation: apCur2  10s var(--ease) infinite; }
.js .ap *, .js .ap *::before, .js .ap-anim { animation-play-state: var(--play, running); }
@keyframes apVelo  { 0%, 49% { opacity: 1; } 53%, 93% { opacity: 0; } 97%, 100% { opacity: 1; } }
@keyframes apBordo { 0%, 49% { border-left-color: var(--yellow); } 53%, 93% { border-left-color: var(--green); } 97%, 100% { border-left-color: var(--yellow); } }
@keyframes apA     { 0%, 49% { opacity: 1; } 52%, 94% { opacity: 0; } 97%, 100% { opacity: 1; } }
@keyframes apC     { 0%, 49% { opacity: 0; } 52%, 94% { opacity: 1; } 97%, 100% { opacity: 0; } }
@keyframes apS1    { 0% { opacity: 1; } 24% { opacity: 0; } 96% { opacity: 1; } }
@keyframes apS2    { 0% { opacity: 0; } 24% { opacity: 1; } 96% { opacity: 0; } }
@keyframes apFoc {
  0%, 18%   { border-color: var(--border-med); box-shadow: none; }
  21%, 32%  { border-color: var(--accent-line); box-shadow: 0 0 0 2px rgba(77,171,154,0.30); }
  38%, 100% { border-color: var(--border-med); box-shadow: none; }
}
@keyframes apPrev {
  0%, 26%   { max-height: 0; opacity: 0; }
  32%, 48%  { max-height: 60px; opacity: 1; }
  54%, 100% { max-height: 0; opacity: 0; }
}
@keyframes apGo {
  0%, 43%   { transform: none; filter: none; }
  44.5%     { transform: scale(0.93); filter: brightness(1.2); }
  47%, 100% { transform: none; filter: none; }
}
@keyframes apCur1 {
  0%, 12%   { opacity: 0; transform: translate(70px, 34px); }
  15%       { opacity: 1; }
  20%       { opacity: 1; transform: none; }
  21%       { transform: scale(0.84); }
  22.5%     { transform: none; }
  26%       { opacity: 1; transform: none; }
  29%, 100% { opacity: 0; transform: none; }
}
@keyframes apCur2 {
  0%, 34%   { opacity: 0; transform: translate(-46px, 8px); }
  37%       { opacity: 1; }
  42%       { opacity: 1; transform: none; }
  44%       { transform: scale(0.84); }
  45.5%     { transform: none; }
  48%       { opacity: 1; transform: none; }
  51%, 100% { opacity: 0; transform: none; }
}
@media (max-width: 760px) {
  .ap-cols { grid-template-columns: 1fr; gap: 6px; }
  .ap-btns, .ap-num, .ap-mai { display: none; }
  .ap-riga { grid-template-columns: 28px minmax(0, 1fr) auto; }
  .ap-az { grid-column: 1 / -1; }
  .ap-prev-i { margin-left: 12px; flex-wrap: wrap; }
  .ap-nome > span { white-space: normal; }
  .ap-pnl span { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .js .ap *, .js .ap *::before, .js .ap-anim { animation: none !important; }
}
.fx-shot.app figure { max-width: 1180px; }
.rp { font-size: 11px; }
.rp i { font-style: normal; }
.rp-app { display: grid; grid-template-columns: 158px minmax(0, 1fr); }
.rp .pos { color: var(--green); }
.rp .neg { color: var(--red); }
.rp-side {
  display: flex; flex-direction: column; gap: 6px;
  padding: 11px 10px; background: var(--bg-raised); border-right: 1px solid var(--border);
  height: 0; min-height: 100%; overflow: hidden;
}
.rp-brand { display: flex; align-items: center; gap: 6px; margin-bottom: 3px; font-size: 11px; font-weight: 700; color: var(--text); white-space: nowrap; }
.rp-grp { display: flex; flex-direction: column; gap: 0; }
.rp-lab { margin: 0 0 2px 4px; font-size: 7px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--finto-2); }
.rp-it {
  display: flex; align-items: center; gap: 7px; padding: 2px 6px;
  border-radius: 5px; border-left: 2px solid transparent;
  font-size: 9.5px; line-height: 1.25; color: var(--finto-1); white-space: nowrap;
}
.rp-it > i { width: 7px; height: 7px; border-radius: 2px; border: 1px solid currentColor; opacity: 0.6; }
.rp-it.on { background: var(--surface2); border-left-color: var(--accent); color: var(--text); }
.rp-foot { margin-top: auto; display: flex; flex-direction: column; gap: 5px; padding-top: 6px; }
.rp-acc { display: flex; justify-content: space-between; padding: 5px 8px; border-radius: 6px; border: 1px solid var(--border-med); font-size: 9px; color: var(--text); }
.rp-saved { display: flex; align-items: center; gap: 5px; font-size: 8px; color: var(--finto-2); }
.rp-saved::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--green); }
.rp-user { display: flex; align-items: center; gap: 7px; padding: 6px; border-radius: 6px; background: var(--surface); }
.rp-user .av { width: 16px; height: 16px; border-radius: 50%; background: var(--accent-dim); border: 1px solid var(--accent-line); flex: 0 0 auto; }
.rp-user b { display: block; font-size: 9px; color: var(--text); }
.rp-user em { display: inline-block; margin-top: 2px; padding: 0 5px; border-radius: 3px; font-style: normal; font-size: 6.5px; font-weight: 700; letter-spacing: 0.08em; color: var(--accent); background: var(--accent-dim); }
.rp-main { min-width: 0; display: flex; flex-direction: column; gap: 10px; padding: 14px 16px 16px; }
.rp-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.rp-t { display: block; font-size: 20px; font-weight: 700; letter-spacing: -0.02em; color: var(--text); }
.rp-t em { margin-left: 8px; font-style: normal; font-size: 10px; font-weight: 500; letter-spacing: 0; color: var(--finto-2); }
.rp-s { font-size: 9.5px; color: var(--finto-2); }
.rp-tools { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 5px; }
.rp-b {
  padding: 4px 9px; border-radius: 999px; white-space: nowrap;
  border: 1px solid var(--border-med); background: var(--surface);
  font-size: 9px; color: var(--finto-1);
}
.rp-b.tut, .rp-b.vai { color: var(--accent); border-color: var(--accent-line); background: var(--accent-dim); }
.rp-b.pieno { color: var(--on-accent); background: var(--accent); border-color: transparent; font-weight: 700; }
.rp-b.rosso { color: var(--red); border-color: rgba(244,63,94,0.4); background: rgba(244,63,94,0.08); }
.rp-k { font-size: 7.5px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--finto-2); }
.rp-box { padding: 10px 12px; border-radius: var(--radius-sm); border: 1px solid var(--border); background: var(--surface); }
.rp-chip { display: inline-block; padding: 2px 8px; border-radius: 5px; border: 1px solid var(--border); background: var(--surface2); font-size: 8.5px; color: var(--finto-1); }
.rp-chip.v { color: var(--green); background: rgba(34,197,94,0.14); border-color: rgba(34,197,94,0.35); font-weight: 700; }
.rp-tr { display: block; height: 3px; border-radius: 2px; background: var(--surface3); overflow: hidden; }
.rp-tr > i { display: block; height: 100%; width: var(--w); border-radius: 2px; background: var(--green); }
.rp-tr > i.r { background: var(--red); }
.rp-tr > i.g { background: var(--yellow); }
.rp-due { display: inline-grid; }
.rp .rp-due { display: inline-grid; }
.rp-pt-st b.rp-due, .rp-kv b.rp-due { display: grid; }
.rp-due > * { grid-area: 1 / 1; }
.rp-due > .v-a { opacity: 0; }
.rp-pt-st b, .rp-kv b, .rp-4 b, .rp-str b, .rp-sc span b, .rp-prob-s b, .rp-ht-kpi b { text-transform: none; }
.rp-vt { display: flex; overflow: hidden; border: 1px solid var(--border-med); border-radius: 7px; }
.rp-vt i { padding: 3px 7px; font-size: 9.5px; color: var(--finto-2); }
.rp-vt .r { color: var(--accent); background: var(--accent-dim); }
.rp-week-h { display: flex; align-items: center; gap: 8px; font-size: 10.5px; }
.rp-week-h > i { width: 16px; height: 16px; display: grid; place-items: center; border-radius: 5px; border: 1px solid var(--border); font-size: 10px; color: var(--finto-2); }
.rp-week-h b { color: var(--text); }
.rp-week-h em { margin-left: auto; font-style: normal; font-size: 9.5px; font-weight: 700; color: var(--green); }
.rp-days { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; margin-top: 6px; }
.rp-day {
  display: grid; grid-template-columns: 1fr auto; gap: 2px 6px;
  padding: 7px 9px; border-radius: 7px; border: 1px solid var(--border); background: var(--surface);
  font-size: 8px; color: var(--finto-2);
}
.rp-day b { font-size: 8px; letter-spacing: 0.06em; color: var(--text); }
.rp-day em { font-style: normal; text-align: right; }
.rp-day strong { font-size: 13px; color: var(--finto-2); }
.rp-day u { align-self: end; text-align: right; text-decoration: none; }
.rp-day.win { border-color: rgba(34,197,94,0.35); background: linear-gradient(135deg, rgba(34,197,94,0.12), var(--surface) 65%); }
.rp-day.win strong { color: var(--green); }
.rp-day.oggi { border-color: rgba(234,179,8,0.55); }
.rp-tot { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); padding: 8px 12px; border-radius: 7px; border: 1px solid var(--border); background: var(--surface); }
.rp-tot span { padding-left: 10px; border-left: 1px solid var(--border); font-size: 8px; color: var(--finto-2); }
.rp-tot span:first-child { padding-left: 0; border-left: 0; }
.rp-tot b { display: block; font-size: 13px; color: var(--text); }
.rp-tot b.pos { color: var(--green); }
.rp-filt { display: flex; flex-wrap: wrap; gap: 5px; padding: 9px 10px; border-radius: 7px; border: 1px solid var(--border); background: var(--surface); }
.rp-filt .rp-b { border-radius: 6px; background: var(--surface2); }
.rp-filt .rp-b.pieno { background: var(--accent); }
.rp-filt .cerca { flex: 1; min-width: 110px; }
.rp-views { display: grid; }
.rp-rows, .rp-grid { grid-area: 1 / 1; min-width: 0; }
.rp-row {
  display: grid; grid-template-columns: 1.75fr .55fr .55fr .75fr .75fr .32fr .75fr 1.45fr .45fr .6fr .6fr .7fr;
  gap: 6px; align-items: center; margin-bottom: 4px; padding: 7px 10px;
  border-radius: 6px; border: 1px solid var(--border); border-left: 3px solid transparent; background: var(--surface);
  font-size: 9px; color: var(--finto-1); white-space: nowrap; font-variant-numeric: tabular-nums;
}
.rp-row > span { overflow: hidden; text-overflow: ellipsis; }
.rp-row > span:first-child { color: var(--text); }
.rp-row.h { margin-bottom: 2px; padding-top: 0; padding-bottom: 2px; border-color: transparent; background: none; font-size: 7px; letter-spacing: 0.09em; text-transform: uppercase; color: var(--finto-2); }
.rp-row.h > span:first-child { color: var(--finto-2); }
.rp-row.win  { border-left-color: var(--green); background: linear-gradient(100deg, var(--green-dim), var(--surface) 55%); }
.rp-row.loss { border-left-color: var(--red);   background: linear-gradient(100deg, var(--red-dim),   var(--surface) 55%); }
.rp-dir { font-weight: 700; }
.rp-dir.long { color: var(--green); }
.rp-dir.short { color: var(--red); }
.rp-ses, .rp-su, .rp-tag, .rp-pl { display: inline-block; padding: 1.5px 6px; border-radius: 4px; font-size: 7.5px; }
.rp-ses { background: var(--surface2); color: var(--finto-2); }
.rp-su { background: var(--accent-dim); color: var(--accent); }
.rp-tag { margin-left: 3px; letter-spacing: 0.06em; background: var(--surface3); color: var(--finto-2); }
.rp-pl.y { color: var(--green); background: rgba(34,197,94,0.12); }
.rp-pl.p { color: var(--yellow); background: rgba(234,179,8,0.12); }
.rp-gr {
  display: inline-grid; place-items: center; width: 15px; height: 15px; border-radius: 50%;
  font-size: 8px; font-weight: 700;
  color: var(--yellow); border: 1px solid rgba(234,179,8,0.5); background: rgba(234,179,8,0.10);
}
.rp-gr.gA { color: var(--green); border-color: rgba(34,197,94,0.5); background: rgba(34,197,94,0.10); }
.rp-gr.gB { color: #60a5fa; border-color: rgba(96,165,250,0.5); background: rgba(96,165,250,0.10); }
.rp-pnl { text-align: right; font-weight: 700; }
.rp-row.win .rp-pnl, .rp-card.win .rp-pnl { color: var(--green); }
.rp-row.loss .rp-pnl, .rp-card.loss .rp-pnl { color: var(--red); }
.rp-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; align-content: start; }
.rp-sel, .rp-n { font-size: 7px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--finto-2); }
.rp-sel { grid-column: 1 / 4; }
.rp-n { grid-column: 4 / 6; text-align: right; }
.rp-card { display: flex; flex-direction: column; overflow: hidden; border-radius: 8px; border: 1px solid var(--border); background: var(--surface); }
.rp-cov { height: 58px; border-bottom: 1px solid var(--border); }
.rp-cov svg { display: block; width: 100%; height: 100%; }
.rp-cov .a { fill: rgba(34,197,94,0.16); }
.rp-cov .l { fill: none; stroke: var(--green); stroke-width: 1.4; vector-effect: non-scaling-stroke; }
.rp-card.loss .rp-cov .a { fill: rgba(244,63,94,0.16); }
.rp-card.loss .rp-cov .l { stroke: var(--red); }
.rp-cov .cu { fill: var(--green); stroke: var(--green); stroke-width: 0.6; }
.rp-cov .cg { fill: var(--red); stroke: var(--red); stroke-width: 0.6; }
.rp-cov .lv { stroke: var(--accent); stroke-width: 0.6; stroke-dasharray: 2 2; }
.rp-cb { display: flex; flex-direction: column; gap: 4px; padding: 8px 9px; }
.rp-cb .rp-dir { font-size: 9.5px; }
.rp-cm { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; font-size: 7.5px; color: var(--finto-2); }
.rp-cb .rp-pnl { margin-top: 5px; padding-top: 6px; border-top: 1px solid var(--border); text-align: left; font-size: 14px; }
.rp-grid { opacity: 0; visibility: hidden; }
.js .rp-jr .rp-rows { animation: rpJrA 8s var(--ease) infinite; }
.js .rp-jr .rp-grid { animation: rpJrB 8s var(--ease) infinite; }
.js .rp-jr .rp-vt .r { animation: rpVtA 8s steps(1, end) infinite; }
.js .rp-jr .rp-vt .g { animation: rpVtB 8s steps(1, end) infinite; }
@keyframes rpJrA {
  0%, 44%   { opacity: 1; transform: none; visibility: visible; }
  48%, 94%  { opacity: 0; transform: translateY(-8px); visibility: hidden; }
  98%, 100% { opacity: 1; transform: none; visibility: visible; }
}
@keyframes rpJrB {
  0%, 45%   { opacity: 0; transform: translateY(8px); visibility: hidden; }
  50%, 93%  { opacity: 1; transform: none; visibility: visible; }
  97%, 100% { opacity: 0; transform: none; visibility: hidden; }
}
@keyframes rpVtA { 0% { color: var(--accent); background: var(--accent-dim); } 46% { color: var(--finto-2); background: transparent; } 96% { color: var(--accent); background: var(--accent-dim); } }
@keyframes rpVtB { 0% { color: var(--finto-2); background: transparent; } 46% { color: var(--accent); background: var(--accent-dim); } 96% { color: var(--finto-2); background: transparent; } }
.rp-dy { background: var(--bg); border: 1px solid var(--border-med); border-radius: var(--radius); overflow: hidden; }
.rp-dy-body { display: flex; flex-direction: column; gap: 10px; padding: 14px; }
.rp-dy .dr-grid { zoom: 1.35; }
.rp-dy .dr-chips .dr-cot { background: var(--surface3); color: var(--finto-2); }
.rp-dy .dr-chart .l { vector-effect: none; stroke-width: 1.6; }
.js .rp-dy .dr-chart .l { stroke-dasharray: 1; animation: rpDisegna 10s var(--ease) infinite; animation-play-state: var(--play, running); }
.js .rp-dy .dr-chart .a { animation: rpArea 10s var(--ease) infinite; animation-play-state: var(--play, running); }
.js .rp-dy .dr-c:nth-child(2) .dr-chart * { animation-delay: 0.25s; }
.js .rp-dy .dr-c:nth-child(3) .dr-chart * { animation-delay: 0.5s; }
.js .rp-dy .dr-c:nth-child(4) .dr-chart * { animation-delay: 0.75s; }
@keyframes rpDisegna { 0%, 4% { stroke-dashoffset: 1; } 26%, 92% { stroke-dashoffset: 0; } 97%, 100% { stroke-dashoffset: 1; } }
@keyframes rpArea    { 0%, 16% { opacity: 0; } 30%, 90% { opacity: 1; } 96%, 100% { opacity: 0; } }
.rp-focus {
  display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 8px;
  border: 1px solid rgba(234,179,8,0.35); border-left: 3px solid var(--yellow);
  background: linear-gradient(135deg, rgba(234,179,8,0.12), var(--surface) 60%);
}
.rp-focus > div { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.rp-focus .rp-k { color: var(--yellow); }
.rp-focus b { font-size: 12.5px; color: var(--text); }
.rp-focus span:not(.rp-k):not(.rp-b) { font-size: 9px; color: var(--finto-1); }
.rp-ico { width: 22px; height: 22px; flex: 0 0 auto; border-radius: 6px; background: rgba(234,179,8,0.18); box-shadow: inset 0 0 0 1px rgba(234,179,8,0.4); }
.rp-ins { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; }
.rp-in {
  position: relative; display: flex; flex-direction: column; gap: 3px; min-height: 84px; padding: 9px 10px;
  border-radius: 8px; border: 1px solid var(--border); border-left: 3px solid var(--green);
  background: linear-gradient(135deg, rgba(34,197,94,0.10), var(--surface) 65%);
}
.rp-in.r { border-left-color: var(--red); background: linear-gradient(135deg, rgba(244,63,94,0.10), var(--surface) 65%); }
.rp-in.g { border-left-color: var(--yellow); background: linear-gradient(135deg, rgba(234,179,8,0.10), var(--surface) 65%); }
.rp-in.a { border-left-color: var(--accent); background: linear-gradient(135deg, rgba(77,171,154,0.10), var(--surface) 65%); }
.rp-in b { font-size: 9.5px; color: var(--text); }
.rp-in span { font-size: 8px; line-height: 1.4; color: var(--finto-2); }
.rp-in > i { margin-top: auto; align-self: flex-start; padding: 2px 7px; border-radius: 999px; border: 1px solid var(--border-med); font-size: 7.5px; color: var(--finto-1); }
.rp-str { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; margin: 7px 0 2px; }
.rp-str span {
  padding: 6px 9px; border-radius: 7px; border: 1px solid var(--border); border-left: 3px solid var(--border-med);
  background: var(--surface2); font-size: 7px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--finto-2);
}
.rp-str .v { border-left-color: var(--green); background: linear-gradient(135deg, rgba(34,197,94,0.10), var(--surface2) 65%); }
.rp-str .r { border-left-color: var(--red);   background: linear-gradient(135deg, rgba(244,63,94,0.10), var(--surface2) 65%); }
.rp-str b { display: block; font-size: 15px; letter-spacing: 0; color: var(--text); }
.rp-str .v b { color: var(--green); }
.rp-str .r b { color: var(--red); }
.rp-str em { font-style: normal; font-size: 7.5px; letter-spacing: 0; text-transform: none; }
.rp-al { display: flex; flex-direction: column; gap: 1px; margin-top: 5px; padding: 5px 10px; border-radius: 6px; border-left: 3px solid var(--green); background: linear-gradient(100deg, rgba(34,197,94,0.10), transparent 70%); }
.rp-al.r { border-left-color: var(--red); background: linear-gradient(100deg, rgba(244,63,94,0.10), transparent 70%); }
.rp-al b { font-size: 9px; color: var(--green); }
.rp-al.r b { color: var(--red); }
.rp-al span { font-size: 8px; color: var(--finto-2); }
.rp-sc { display: flex; align-items: flex-end; gap: 16px; margin: 6px 0 8px; }
.rp-sc > b { font-size: 30px; line-height: 0.9; font-weight: 700; letter-spacing: -0.03em; color: var(--green); }
.rp-sc > em { margin-left: -12px; font-style: normal; font-size: 8px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--finto-2); }
.rp-sc span { font-size: 7px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--finto-2); }
.rp-sc span b { display: block; font-size: 12px; letter-spacing: 0; color: var(--text); }
.rp-bars { display: flex; align-items: flex-end; gap: 2px; height: 56px; }
.rp-bars i { flex: 1; height: var(--h); border-radius: 1.5px 1.5px 0 0; background: var(--green); transform-origin: bottom; }
.rp-bars i.g { background: #e0a526; }
.rp-bars i.r { background: var(--red); }
.rp-leg { display: flex; justify-content: space-between; margin-top: 4px; font-size: 6.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--finto-2); }
.js .rp-bars i { transform: scaleY(0); }
.js .rp-bars i { animation: rpCresce 0.55s var(--ease-out) var(--d) both; }
@keyframes rpCresce { to { transform: scaleY(1); } }
.rp-in::after {
  content: ''; position: absolute; inset: -1px; border-radius: 8px; pointer-events: none; opacity: 0;
  box-shadow: 0 0 0 1px var(--accent-line), 0 0 22px -6px rgba(77,171,154,0.55);
}
.js .rp-co .rp-in::after { animation: rpLuce 10s var(--ease) infinite; animation-delay: calc(var(--k) * 2s); animation-play-state: var(--play, running); }
@keyframes rpLuce { 0% { opacity: 0; } 5%, 16% { opacity: 1; } 21%, 100% { opacity: 0; } }
.rp-ht { display: flex; flex-direction: column; gap: 10px; width: 100%; max-width: 360px; margin: 0 auto; font-size: 11px; }
.rp-ht i { font-style: normal; }
.rp-ht-win {
  display: flex; flex-direction: column; gap: 10px; padding: 16px;
  border-radius: 14px; border: 1px solid var(--border-med); background: var(--surface2);
  box-shadow: 0 30px 60px -30px rgba(0,0,0,0.9);
}
.rp-ht-top { display: flex; justify-content: space-between; }
.rp-ht-top b { display: block; font-size: 19px; font-weight: 700; letter-spacing: -0.02em; color: var(--text); }
.rp-ht-top span { font-size: 9.5px; color: var(--finto-2); }
.rp-ht-nav { display: flex; gap: 4px; }
.rp-ht-nav i { width: 18px; height: 18px; display: grid; place-items: center; border-radius: 5px; border: 1px solid var(--border-med); font-size: 10px; color: var(--finto-2); }
.rp-ht-pnl {
  display: flex; justify-content: space-between; align-items: center; padding: 11px 14px;
  border-radius: 8px; border: 1px solid var(--border); border-left: 3px solid var(--green);
  background: linear-gradient(135deg, rgba(34,197,94,0.14), var(--surface) 60%);
}
.rp-ht-pnl span { font-size: 8px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--finto-2); }
.rp-ht-pnl b { font-size: 20px; font-weight: 700; color: var(--green); }
.rp-ht-kpi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.rp-ht-kpi span { padding: 8px 10px; border-radius: 7px; border: 1px solid var(--border); background: var(--surface); font-size: 7px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--finto-2); }
.rp-ht-kpi b { display: block; font-size: 15px; letter-spacing: 0; color: var(--text); }
.rp-ht-kpi b.v { color: var(--green); }
.rp-ht-kpi span > i { display: block; height: 3px; width: var(--w); margin-top: 5px; border-radius: 2px; background: var(--green); }
.rp-ht-curva { height: 44px; }
.rp-ht-curva svg { display: block; width: 100%; height: 100%; }
.rp-ht-curva .a { fill: rgba(244,63,94,0.14); }
.rp-ht-curva .l { fill: none; stroke: var(--red); stroke-width: 1.6; vector-effect: non-scaling-stroke; }
.rp-ht-k { display: flex; align-items: center; gap: 6px; font-size: 8px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--finto-2); }
.rp-ht-k i { padding: 1px 6px; border-radius: 999px; border: 1px solid var(--border-med); font-size: 7px; letter-spacing: 0.08em; }
.rp-ht-k.linea { color: var(--accent); }
.rp-ht-k.linea::after { content: ''; flex: 1; height: 1px; background: var(--border-med); }
.rp-ht-p { margin: 0; padding: 10px 12px; border-radius: 8px; border: 1px solid var(--border); background: var(--surface); font-size: 10.5px; line-height: 1.5; color: var(--text); }
.rp-ht-r { display: flex; justify-content: space-between; gap: 8px; padding: 8px 10px; border-radius: 7px; border-left: 3px solid var(--green); background: linear-gradient(100deg, rgba(34,197,94,0.10), var(--surface) 70%); font-size: 9.5px; }
.rp-ht-r b { color: var(--text); }
.rp-ht-r em { font-style: normal; color: var(--finto-2); }
.rp-ht-go { padding: 9px; border-radius: 8px; text-align: center; font-size: 11px; font-weight: 700; color: var(--on-accent); background: var(--accent); }
.rp-ht-bt { padding: 8px; border-radius: 8px; border: 1px solid var(--border-med); text-align: center; font-size: 10px; color: var(--finto-1); }
.rp-ht-nota {
  display: grid; grid-template-columns: 1fr auto; gap: 0 8px; padding: 10px 12px; border-radius: 10px;
  border: 1px solid rgba(234,179,8,0.4); border-left: 3px solid var(--yellow);
  background: linear-gradient(135deg, rgba(234,179,8,0.10), var(--surface) 65%);
}
.rp-ht-nota span { font-size: 8px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--yellow); }
.rp-ht-nota em { font-size: 8px; color: var(--finto-2); }
.rp-ht-nota p { grid-column: 1 / -1; margin: 4px 0 0; font-size: 10.5px; color: var(--text); }
.js .rp-ht-p span { animation: rpParola 11s linear infinite backwards; animation-delay: calc(var(--i) * 90ms); animation-play-state: var(--play, running); }
.js .rp-ht-k i { animation: rpBatte 1.4s ease-in-out infinite; animation-play-state: var(--play, running); }
@keyframes rpParola { 0%, 8% { opacity: 0; } 9%, 70% { opacity: 1; } 73%, 100% { opacity: 0; } }
@keyframes rpBatte { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }
.rp-pt-bar { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 8px; border: 1px solid var(--border); background: var(--surface); }
.rp-pt-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; align-items: start; }
.rp-ch { display: flex; flex-direction: column; gap: 7px; padding: 11px 12px; border-radius: 9px; border: 1px solid var(--border); background: var(--surface); }
.rp-ch.ko { border-color: rgba(244,63,94,0.35); background: linear-gradient(160deg, rgba(244,63,94,0.08), var(--surface) 55%); }
.rp-ch-h { display: flex; justify-content: space-between; align-items: center; }
.rp-firm { padding: 2px 6px; border-radius: 3px; font-size: 7px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.rp-firm.ap { color: #f59e0b; background: rgba(245,158,11,0.14); border: 1px solid rgba(245,158,11,0.35); }
.rp-firm.mf { color: #a78bfa; background: rgba(167,139,250,0.14); border: 1px solid rgba(167,139,250,0.35); }
.rp-st { padding: 2px 7px; border-radius: 999px; font-size: 7.5px; }
.rp-st.on { color: var(--green); background: rgba(34,197,94,0.12); }
.rp-st.ko { color: var(--red); background: rgba(244,63,94,0.12); }
.rp-ch-t { font-size: 12.5px; color: var(--text); }
.rp-ch-s { margin-top: -5px; font-size: 8px; color: var(--finto-2); }
.rp-over { padding: 6px 9px; border-radius: 6px; border: 1px solid rgba(244,63,94,0.4); background: rgba(244,63,94,0.08); font-size: 8.5px; color: var(--red); }
.rp-pt-st { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px 8px; padding: 8px 10px; border-radius: 7px; background: var(--surface2); }
.rp-pt-st span { font-size: 6.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--finto-2); }
.rp-pt-st b { display: block; font-size: 10.5px; letter-spacing: 0; color: var(--text); white-space: nowrap; }
.rp-pt-st b.pos { color: var(--green); }
.rp-pt-st b.neg { color: var(--red); }
.rp-pb { display: grid; grid-template-columns: 1fr auto; gap: 3px 6px; font-size: 8px; color: var(--finto-1); }
.rp-pb b { font-size: 8px; font-weight: 600; color: var(--text); white-space: nowrap; }
.rp-pb em { padding: 1px 4px; border-radius: 3px; font-style: normal; font-size: 6px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--finto-2); background: var(--surface3); }
.rp-pb .rp-tr { grid-column: 1 / -1; }
.rp-prob { display: grid; grid-template-columns: 1fr auto; gap: 1px 6px; padding: 9px 10px; border-radius: 7px; background: var(--surface2); }
.rp-prob > i { font-size: 7.5px; text-align: right; color: var(--accent); }
.rp-prob > b { grid-column: 1 / -1; font-size: 24px; line-height: 1.1; color: var(--green); }
.rp-prob > em { grid-column: 1 / -1; font-style: normal; font-size: 7px; color: var(--finto-2); }
.rp-prob-s { grid-column: 1 / -1; display: flex; gap: 14px; margin-top: 5px; }
.rp-prob-s span { font-size: 6.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--finto-2); }
.rp-prob-s b { display: block; font-size: 10px; letter-spacing: 0; color: var(--text); }
.rp-prob-s b.pos { color: var(--green); }
.rp-bt-f { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto; gap: 7px 9px; align-items: end; }
.rp-f { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.rp-f span { font-size: 6.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--finto-2); }
.rp-f i { padding: 5px 8px; border-radius: 6px; border: 1px solid var(--border-med); background: var(--surface2); font-size: 8.5px; color: var(--finto-1); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rp-bt-go { display: flex; gap: 5px; }
.rp-q { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 5px; font-size: 7px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--finto-2); }
.rp-q i { padding: 2px 8px; border-radius: 999px; border: 1px solid var(--border-med); font-size: 8px; letter-spacing: 0; text-transform: none; color: var(--finto-2); }
.rp-sim-h { display: flex; align-items: baseline; gap: 10px; }
.rp-sim-h b { font-size: 10.5px; color: var(--text); }
.rp-sim-h > span { font-size: 8px; color: var(--finto-2); }
.rp-en { margin-left: auto; display: flex; align-items: center; gap: 5px; font-size: 7.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--finto-2); }
.rp-sim-r { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.rp-reg { display: flex; align-items: center; gap: 5px; padding: 4px 8px; border-radius: 6px; border: 1px solid var(--border); background: var(--surface2); font-size: 8.5px; color: var(--finto-2); }
.rp-reg.acc { color: var(--text); border-color: var(--accent-line); }
.rp-ck { position: relative; display: inline-block; width: 10px; height: 10px; border-radius: 3px; border: 1px solid var(--border-med); }
.rp-ck.acc, .rp-reg.acc .rp-ck { background: var(--accent); border-color: var(--accent); }
.rp-ck.acc::after, .rp-reg.acc .rp-ck::after { content: '\2713'; position: absolute; inset: 0; display: grid; place-items: center; font-size: 7.5px; font-weight: 700; color: var(--on-accent); }
.rp-num { padding: 1px 6px; border-radius: 4px; background: var(--surface3); color: var(--text); }
.rp-scrivi { display: flex; gap: 6px; margin-top: 4px; }
.rp-inp { position: relative; flex: 1; display: grid; align-items: center; min-height: 26px; padding: 5px 9px; border-radius: 6px; border: 1px solid var(--border-med); background: var(--surface2); font-size: 9.5px; }
.rp-inp > i { grid-area: 1 / 1; }
.rp-inp .ph { color: var(--finto-2); opacity: 0; }
.rp-inp .tx { color: var(--text); }
.rp-cmp { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 8px; align-items: center; }
.rp-kv { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px 10px; margin-top: 6px; }
.rp-kv span { font-size: 6.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--finto-2); }
.rp-kv b { display: block; font-size: 12px; letter-spacing: 0; color: var(--text); }
.rp-kv b.pos { color: var(--green); }
.rp-simres { border-color: rgba(34,197,94,0.35); background: linear-gradient(135deg, rgba(34,197,94,0.12), var(--surface) 60%); }
.rp-delta { margin-left: 8px; padding: 1px 7px; border-radius: 999px; font-size: 8.5px; letter-spacing: 0; color: var(--green); background: rgba(34,197,94,0.14); }
.rp-freccia { font-size: 14px; color: var(--finto-2); }
.rp-eq svg { display: block; width: 100%; height: 60px; margin-top: 4px; }
.rp-eq .tutti { fill: none; stroke: rgba(162,162,173,0.5); stroke-width: 1.3; stroke-dasharray: 4 3; vector-effect: non-scaling-stroke; }
.rp-eq .sim { fill: none; stroke: var(--green); stroke-width: 1.8; }
.js .rp-bt .tx > i { animation: rpBtW 10s steps(1, end) infinite backwards; animation-delay: calc(0.5s + var(--i) * 0.18s);    }
.js .rp-bt .ph { animation: rpBtPh 10s steps(1, end) infinite; }
.js .rp-bt .int { animation: rpBtI 10s var(--ease) infinite; }
.js .rp-bt .rp-reg.acc { animation: rpBtRg 10s steps(1, end) infinite; }
.js .rp-bt .rp-reg.acc .rp-ck, .js .rp-bt .rp-ck.acc { animation: rpBtCb 10s steps(1, end) infinite; }
.js .rp-bt .rp-reg.acc .rp-ck::after, .js .rp-bt .rp-ck.acc::after { animation: rpBtV 10s steps(1, end) infinite; }
.js .rp-bt .rp-reg .v-a { animation: rpBtA1 10s steps(1, end) infinite; }
.js .rp-bt .rp-reg .v-c { animation: rpBtC1 10s steps(1, end) infinite; }
.js .rp-bt .rp-simres .v-a { animation: rpBtA2 10s var(--ease) infinite; }
.js .rp-bt .rp-simres .v-c { animation: rpBtC2 10s var(--ease) infinite; }
.js .rp-bt .rp-delta { animation: rpBtD 10s var(--ease-out) infinite; }
.js .rp-bt .sim { stroke-dasharray: 1; animation: rpBtS 10s var(--ease) infinite; }
.js .rp-bt *, .js .rp-bt *::after { animation-play-state: var(--play, running) !important; }
@keyframes rpBtW  { 0% { opacity: 0; } 1% { opacity: 1; } 70% { opacity: 0; } }
@keyframes rpBtPh { 0% { opacity: 1; } 6% { opacity: 0; } 96% { opacity: 1; } }
@keyframes rpBtI  { 0%, 25% { transform: none; filter: none; } 26.5% { transform: scale(0.92); filter: brightness(1.25); } 29%, 100% { transform: none; filter: none; } }
@keyframes rpBtRg { 0% { color: var(--finto-2); border-color: var(--border); } 30% { color: var(--text); border-color: var(--accent-line); } 96% { color: var(--finto-2); border-color: var(--border); } }
@keyframes rpBtCb { 0% { background: transparent; border-color: var(--border-med); } 30% { background: var(--accent); border-color: var(--accent); } 96% { background: transparent; border-color: var(--border-med); } }
@keyframes rpBtV  { 0% { opacity: 0; } 30% { opacity: 1; } 96% { opacity: 0; } }
@keyframes rpBtA1 { 0% { opacity: 1; } 30% { opacity: 0; } 96% { opacity: 1; } }
@keyframes rpBtC1 { 0% { opacity: 0; } 30% { opacity: 1; } 96% { opacity: 0; } }
@keyframes rpBtA2 { 0%, 33% { opacity: 1; } 36%, 93% { opacity: 0; } 96%, 100% { opacity: 1; } }
@keyframes rpBtC2 { 0%, 33% { opacity: 0; } 36%, 93% { opacity: 1; } 96%, 100% { opacity: 0; } }
@keyframes rpBtD  { 0%, 34% { opacity: 0; transform: scale(0.7); } 38%, 93% { opacity: 1; transform: none; } 96%, 100% { opacity: 0; transform: none; } }
@keyframes rpBtS  { 0%, 34% { stroke-dashoffset: 1; } 52%, 93% { stroke-dashoffset: 0; } 97%, 100% { stroke-dashoffset: 1; } }
.js .fx-split .fx-lk-row .bar i { animation: fxBarra 0.9s var(--ease-out) both; animation-delay: var(--d, 0ms); }   
.fx-split-b > .fx-lk { border: 1px solid var(--border-med); border-radius: var(--radius); overflow: hidden; }
.rp-sw { position: relative; display: flex; padding: 2px; border-radius: 7px; border: 1px solid var(--border); background: var(--surface2); }
.rp-sw > i { position: relative; z-index: 1; padding: 3px 10px; font-size: 9px; color: var(--finto-2); }
.rp-sw > i.a { color: var(--text); }
.rp-sw .knob { position: absolute; z-index: 0; top: 2px; bottom: 2px; left: 2px; width: calc(50% - 2px); padding: 0; border-radius: 5px; background: var(--surface3); }
.rp-ver { padding: 10px 14px; border-radius: 8px; border: 1px solid var(--border); border-left: 3px solid var(--green); background: linear-gradient(135deg, rgba(34,197,94,0.08), var(--surface) 55%); }
.rp-ver > span { display: flex; align-items: center; gap: 8px; }
.rp-ver em { font-style: normal; font-size: 8.5px; color: var(--finto-2); }
.rp-ver p { margin: 5px 0 2px; font-size: 10px; line-height: 1.5; color: var(--text); }
.rp-ver small { font-size: 7.5px; color: var(--finto-2); }
.rp-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
.rp-4 span { padding: 8px 11px; border-radius: 7px; border: 1px solid var(--border); background: var(--surface); font-size: 7px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--finto-2); }
.rp-4 b { display: block; font-size: 15px; letter-spacing: 0; color: var(--text); }
.rp-4 b.pos { color: var(--green); }
.rp-4 b em { font-style: normal; font-size: 8px; color: var(--finto-2); }
.rp-pos-h { display: flex; justify-content: space-between; }
.rp-pos-h em { margin-left: 6px; font-style: normal; font-weight: 500; letter-spacing: 0; text-transform: none; }
.rp-rng { display: flex; gap: 2px; }
.rp-rng i { padding: 1px 6px; border-radius: 4px; font-size: 8px; color: var(--finto-2); }
.rp-rng i.on { color: var(--text); background: var(--surface3); }
.rp-leg2 { display: flex; flex-wrap: wrap; gap: 5px; margin: 7px 0 4px; }
.rp-leg2 > i { display: flex; align-items: center; gap: 5px; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--border); font-size: 8px; color: var(--finto-2); }
.rp-leg2 > i.on { color: var(--text); border-color: var(--border-med); background: var(--surface2); }
.rp-leg2 u { width: 6px; height: 6px; border-radius: 50%; }
.rp-leg2 .nc u { background: var(--green); }
.rp-leg2 .cm u { background: #a78bfa; }
.rp-leg2 .rt u { background: #f59e0b; }
.rp-leg2 .px u { background: var(--text); }
.rp-leg2 .bd u { border-radius: 2px; background: rgba(77,171,154,0.45); }
.rp-lg { display: inline-grid; font-weight: 400; }
.rp-lg > i { grid-area: 1 / 1; }
.rp-lg .cd { opacity: 0; }
.rp-pos svg { display: block; width: 100%; height: 150px; }
.rp-pos .band { fill: rgba(77,171,154,0.10); }
.rp-pos .zero { fill: none; stroke: rgba(255,255,255,0.12); stroke-width: 1; vector-effect: non-scaling-stroke; }
.rp-pos .nc-a { fill: rgba(34,197,94,0.12); }
.rp-pos .nc, .rp-pos .hf { fill: none; stroke: var(--green); stroke-width: 1.6; }
.rp-pos .in { fill: none; stroke: #a78bfa; stroke-width: 1.4; }
.rp-pos .px { fill: none; stroke: rgba(240,240,242,0.6); stroke-width: 1.3; }
.rp-pos .a2 { opacity: 0; }
.rp-ax { display: flex; justify-content: space-between; font-size: 7px; color: var(--finto-2); }
.rp-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.rp-who { display: grid; grid-template-columns: 1fr auto; gap: 3px 8px; margin-top: 7px; }
.rp-who span { font-size: 9px; color: var(--text); }
.rp-who em { display: block; font-style: normal; font-size: 7px; color: var(--finto-2); }
.rp-who b { font-size: 10px; }
.rp-who > i { grid-column: 1 / -1; display: block; height: 3px; width: var(--w); border-radius: 2px; }
.rp-who > i.l { background: var(--green); }
.rp-who > i.s { background: var(--red); opacity: 0.8; }
.rp-crowd { position: relative; height: 5px; margin: 12px 0 5px; border-radius: 3px; background: linear-gradient(90deg, #7f2a1d, #3a2a26 25%, #26262a 50%, #1f3a2a 75%, #1f6a35); }
.rp-crowd > i { position: absolute; left: var(--p); top: -4px; width: 2px; height: 13px; border-radius: 1px; background: var(--text); }
.rp-crowd-l { display: flex; justify-content: space-between; font-size: 7px; color: var(--finto-2); }
.rp-2 p { margin: 8px 0 0; font-size: 9px; color: var(--finto-1); }
.js .rp-ct path.nc { stroke-dasharray: 1; animation: rpCtNc 10s var(--ease) infinite; }
.js .rp-ct path.px { stroke-dasharray: 1; animation: rpCtPx 10s var(--ease) infinite; }
.js .rp-ct path.nc-a { animation: rpCtNa 10s var(--ease) infinite; }
.js .rp-ct rect.band { animation: rpCtB 10s var(--ease) infinite; }
.js .rp-ct .rp-leg2 .bd { animation: rpCtBd 10s steps(1, end) infinite; }
.js .rp-ct path.a2 { animation: rpCtX2 10s var(--ease) infinite; }
.js .rp-ct .rp-sw .knob { animation: rpCtK 10s var(--ease) infinite; }
.js .rp-ct .rp-sw .a { animation: rpCtLa 10s steps(1, end) infinite; }
.js .rp-ct .rp-sw .d { animation: rpCtLd 10s steps(1, end) infinite; }
.js .rp-ct .rp-lg .ca { animation: rpCtX1 10s var(--ease) infinite; }
.js .rp-ct .rp-lg .cd { animation: rpCtX2 10s var(--ease) infinite; }
.js .rp-ct *, .js .rp-ct *::after { animation-play-state: var(--play, running) !important; }
@keyframes rpCtNc { 0% { stroke-dashoffset: 1; opacity: 1; } 22% { stroke-dashoffset: 0; } 47% { opacity: 1; } 52%, 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes rpCtPx { 0% { stroke-dashoffset: 1; opacity: 1; } 22% { stroke-dashoffset: 0; } 94% { opacity: 1; } 99%, 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes rpCtNa { 0%, 16% { opacity: 0; } 24%, 47% { opacity: 1; } 52%, 100% { opacity: 0; } }
@keyframes rpCtB  { 0%, 24% { opacity: 0; } 32%, 94% { opacity: 1; } 98%, 100% { opacity: 0; } }
@keyframes rpCtBd { 0% { color: var(--finto-2); } 28% { color: var(--text); } 96% { color: var(--finto-2); } }
@keyframes rpCtX1 { 0%, 47% { opacity: 1; } 52%, 94% { opacity: 0; } 98%, 100% { opacity: 1; } }
@keyframes rpCtX2 { 0%, 47% { opacity: 0; } 52%, 94% { opacity: 1; } 98%, 100% { opacity: 0; } }
@keyframes rpCtK  { 0%, 47% { transform: none; } 51%, 94% { transform: translateX(100%); } 98%, 100% { transform: none; } }
@keyframes rpCtLa { 0% { color: var(--text); } 49% { color: var(--finto-2); } 96% { color: var(--text); } }
@keyframes rpCtLd { 0% { color: var(--finto-2); } 49% { color: var(--text); } 96% { color: var(--finto-2); } }
.rp-read { font-size: 8px; color: var(--finto-2); }
.rp-mc .rp-t em { font-size: 10px; }
.rp-mc-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.rp-mc-row.s > span { font-size: 8.5px; color: var(--finto-2); }
.rp-cd { display: flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 8px; border: 1px solid var(--border-med); background: var(--surface); font-size: 9.5px; color: var(--finto-1); }
.rp-cd > b { font-weight: 700; color: var(--text); }
.rp-cd > b .v-c { color: var(--green); }
.rp-cd em { font-style: normal; color: var(--finto-2); }
.rp-tabs { display: flex; gap: 4px; }
.rp-tabs i { padding: 3px 9px; border-radius: 6px; border: 1px solid var(--border); font-size: 8.5px; color: var(--finto-2); }
.rp-tabs i.on { color: var(--green); border-color: rgba(34,197,94,0.4); background: rgba(34,197,94,0.08); }
.rp-mc-g { display: grid; grid-template-columns: minmax(0, 1fr) 250px; gap: 10px; align-items: start; }
.rp-mc-l { display: flex; flex-direction: column; gap: 9px; min-width: 0; }
.rp-score { display: flex; align-items: center; gap: 12px; }
.rp-score > b { font-size: 30px; font-weight: 700; color: var(--green); }
.rp-score > em { align-self: flex-end; margin: 0 0 6px -10px; font-style: normal; font-size: 11px; color: var(--finto-2); }
.rp-score strong { display: block; font-size: 11.5px; color: var(--text); }
.rp-score span { font-size: 8.5px; color: var(--finto-2); }
.rp-luci { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
.rp-luce { display: flex; flex-direction: column; gap: 3px; padding: 9px 10px; border-radius: 8px; border: 1px solid var(--border); border-top: 2px solid var(--green); background: var(--surface); }
.rp-luce.g { border-top-color: var(--yellow); }
.rp-luce-h { display: flex; align-items: center; gap: 5px; font-size: 8px; color: var(--text); }
.rp-luce-h > i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); }
.rp-luce.g .rp-luce-h > i { background: var(--yellow); }
.rp-luce-h em { margin-left: auto; font-style: normal; font-size: 6.5px; color: var(--finto-2); }
.rp-luce > b { font-size: 19px; color: var(--green); }
.rp-luce.g > b { color: var(--yellow); }
.rp-luce-s { font-size: 7px; color: var(--finto-2); }
.rp-luce .rp-tr { margin-top: 4px; }
.rp-luce.g .rp-tr > i { background: var(--yellow); }
.rp-luce-f { display: flex; justify-content: space-between; font-size: 6.5px; color: var(--finto-2); }
.rp-luce-f em { font-style: normal; }
.rp-clima b { display: block; margin: 4px 0 2px; font-size: 12px; color: var(--green); }
.rp-clima > span:last-child { font-size: 8.5px; color: var(--finto-2); }
.rp-cal { display: flex; flex-direction: column; gap: 5px; }
.rp-cal small { font-size: 7px; color: var(--finto-2); }
.rp-cal-d { margin-top: 4px; font-size: 9px; font-weight: 700; color: var(--text); }
.rp-cal-d em { margin-left: 6px; font-style: normal; font-size: 6.5px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--finto-2); }
.rp-ev { display: grid; grid-template-columns: 28px 36px minmax(0, 1fr); gap: 1px 6px; padding: 5px 8px; border-radius: 6px; border: 1px solid var(--border); border-left: 3px solid var(--yellow); background: var(--surface2); font-size: 8px; color: var(--finto-1); }
.rp-ev.h { border-left-color: var(--red); }
.rp-ev .o { color: var(--finto-2); }
.rp-ev .p { font-size: 6.5px; color: var(--finto-2); }
.rp-ev .n { color: var(--text); }
.rp-ev .pf { grid-column: 3; font-size: 7px; color: var(--finto-2); }
.rp-ev .pf b { color: var(--finto-1); }
.rp-act { margin-left: 6px; padding: 1px 5px; border-radius: 4px; font-size: 7px; color: var(--green); background: rgba(34,197,94,0.14); }
.js .rp-luce .rp-tr > i { width: 0; transition: width 1.1s var(--ease-out) 0.3s; }
.js .fx-up.in .rp-luce .rp-tr > i { width: var(--w); }
.js .rp-mc .rp-cd .v-a { animation: rpMcA 9s steps(1, end) infinite; }
.js .rp-mc .rp-cd .v-c { animation: rpMcC 9s steps(1, end) infinite; }
.js .rp-mc .rp-act { animation: rpMcAct 9s var(--ease-out) infinite; }
.js .rp-mc .rp-ev.esce { animation: rpMcEv 9s var(--ease) infinite; }
.js .rp-mc *, .js .rp-mc *::after { animation-play-state: var(--play, running) !important; }
@keyframes rpMcA   { 0% { opacity: 1; } 40% { opacity: 0; } 96% { opacity: 1; } }
@keyframes rpMcC   { 0% { opacity: 0; } 40% { opacity: 1; } 96% { opacity: 0; } }
@keyframes rpMcAct { 0%, 40% { opacity: 0; transform: scale(0.7); } 44%, 94% { opacity: 1; transform: none; } 98%, 100% { opacity: 0; } }
@keyframes rpMcEv  { 0%, 40% { background: var(--surface2); } 43% { background: rgba(34,197,94,0.16); } 55%, 100% { background: var(--surface2); } }
.rp-fig {
  max-width: 1180px; margin: 0 auto; overflow: hidden;
  border: 1px solid var(--border-med); border-radius: 12px; background: var(--surface);
  box-shadow: 0 34px 80px -34px rgba(0,0,0,0.95);
}
.rp-fig figcaption { padding: 11px 16px; border-top: 1px solid var(--border); font-size: 11.5px; color: var(--text-muted); background: rgba(255,255,255,0.015); }
@media (min-width: 1001px) and (max-height: 900px) { .rp-fig { zoom: 0.86; } .rp-ht { zoom: 0.9; }  .rp-dy { zoom: 0.92; } }
@media (min-width: 1001px) and (max-height: 820px) { .rp-fig { zoom: 0.74; } .rp-ht { zoom: 0.78; } .rp-dy { zoom: 0.8; } }
@media (min-width: 1001px) and (max-height: 720px) { .rp-fig { zoom: 0.66; } .rp-ht { zoom: 0.68; } .rp-dy { zoom: 0.7; }  .fx-split-b > .fx-lk { zoom: 0.85; } }
@media (min-width: 1001px) and (max-height: 640px) { .rp-fig { zoom: 0.6; }  .rp-ht { zoom: 0.6; }  .rp-dy { zoom: 0.62; } .fx-split-b > .fx-lk { zoom: 0.75; } }
.rp .ap-body { padding: 0; }
@media (max-width: 760px) {
  .rp-app { grid-template-columns: 1fr; }
  .rp-side { display: none; }
  .rp-main { padding: 12px; }
  .rp-head { flex-direction: column; }
  .rp-tools { justify-content: flex-start; }
  .rp-days, .rp-tot { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .rp-days .rp-day:nth-child(n+4), .rp-tot span:nth-child(n+4) { display: none; }
  .rp-filt .rp-b:nth-child(n+3):not(.cerca):not(.pieno) { display: none; }
  .rp-row { grid-template-columns: 1.6fr .6fr .8fr; }
  .rp-row > span:nth-child(n+4):not(.rp-pnl) { display: none; }
  .rp-row > span:nth-child(3) { display: none; }
  .rp-row { grid-template-columns: 1.7fr .6fr .8fr; }
  .rp-grid { grid-template-columns: 1fr 1fr; }
  .rp-grid .rp-card:nth-of-type(n+3) { display: none; }
  .rp-ins { grid-template-columns: 1fr 1fr; }
  .rp-ins .rp-in:nth-child(n+5) { display: none; }
  .rp-str { grid-template-columns: 1fr 1fr; }
  .rp-focus { flex-wrap: wrap; }
  .rp-pt-grid { grid-template-columns: 1fr; }
  .rp-pt-grid .rp-ch:nth-child(n+2) { display: none; }
  .rp-bt-f { grid-template-columns: 1fr 1fr; }
  .rp-bt-f .rp-f:nth-child(n+5) { display: none; }
  .rp-cmp { grid-template-columns: 1fr; }
  .rp-freccia { display: none; }
  .rp-kv { grid-template-columns: 1fr 1fr; }
  .rp-kv span:nth-child(n+5) { display: none; }
  .rp-4 { grid-template-columns: 1fr 1fr; }
  .rp-2 { grid-template-columns: 1fr; }
  .rp-mc-g { grid-template-columns: 1fr; }
  .rp-luci { grid-template-columns: 1fr 1fr; }
  .rp-tabs, .rp-read { display: none; }
  .rp-dy .dr-grid { zoom: 1.15; }
}
@media (prefers-reduced-motion: reduce) {
  .js .rp *, .js .rp *::after, .js .rp-dy *, .js .rp-ht * { animation: none !important; }
  .js .rp-bars i { transform: none; }
  .js .rp-luce .rp-tr > i { width: var(--w); transition: none; }
}
.ap-sim { position: relative; z-index: 1; margin: -3px 12px 9px 52px; font-size: 9px; color: var(--yellow); }
.ap-tag { margin-left: 4px; padding: 0 5px; border-radius: 3px; font-style: normal; font-size: 7.5px; font-weight: 700; letter-spacing: 0.04em; color: var(--yellow); background: rgba(234,179,8,0.14); }
@media (max-width: 400px) {
  .fx-split-b > .fx-lk { zoom: 0.86; }
}
.fx-split-b { min-width: 0; }
.fx-invito {
  position: absolute; right: 12px; bottom: 12px; z-index: 6; pointer-events: none;
  display: inline-flex; align-items: center; gap: 7px;
  padding: 5px 11px; border-radius: 999px;
  border: 1px solid var(--accent-line); background: rgba(11,11,12,0.86);
  font-size: 11px; font-weight: 600; letter-spacing: 0.01em; color: var(--accent);
  opacity: 0; transform: translateY(4px);
  transition: opacity 0.35s var(--ease-out) 0.5s, transform 0.35s var(--ease-out) 0.5s;
}
.fx-invito::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px var(--accent-dim); }
.col-mouse:not(.vivo) > .fx-invito { opacity: 1; transform: none; }
.col-mouse.vivo > .fx-invito { transition-delay: 0s; }
.js .rp-luce .rp-tr > i { width: 0; transition: none; }
.js .rp-luce .rp-tr > i { animation: rpLuceW 1.1s var(--ease-out) 0.3s both; }   
@keyframes rpLuceW { from { width: 0; } to { width: var(--w); } }
.rp-app { position: relative; }
.rp-full { position: relative; justify-self: end; display: inline-block; font-size: 7.5px; color: var(--accent); }
.rp-cur {
  position: absolute; left: 45%; top: 55%; z-index: 3; width: 19px; height: 19px;
  opacity: 0; pointer-events: none;
  fill: #f0f0f2; stroke: #0b0b0c; stroke-width: 1.3;
  filter: drop-shadow(0 2px 3px rgba(0,0,0,0.6));
}
.js .rp-pt .rp-cur  { animation: rpCurF 10s var(--ease) infinite; }
.js .rp-pt .rp-full.preme { animation: rpFullF 10s var(--ease) infinite; }
.rp-full::after {
  content: ''; position: absolute; left: 50%; top: 50%; width: 22px; height: 22px;
  margin: -11px 0 0 -11px; border-radius: 50%; border: 1.5px solid var(--accent);
  opacity: 0; pointer-events: none;
}
.js .rp-pt .rp-full.preme::after { animation: rpOndaF 10s var(--ease-out) infinite; }
@keyframes rpOndaF {
  0%, 13.3% { opacity: 0; transform: scale(0.5); }
  13.6%     { opacity: 0.9; transform: scale(0.5); }
  19%, 100% { opacity: 0; transform: scale(2.6); }
}
@keyframes rpCurF {
  0%, 3%    { opacity: 0; transform: translate(-70px, 46px); }
  5%        { opacity: 1; }
  12%       { opacity: 1; transform: none; }
  13.5%     { transform: scale(0.82); }
  15%       { opacity: 1; transform: none; }
  18%, 100% { opacity: 0; transform: none; }
}
@keyframes rpFullF {
  0%, 13%   { transform: none; color: var(--accent); }
  13.8%     { transform: scale(0.92); color: #8fe0cf; }
  16%, 100% { transform: none; color: var(--accent); }
}
.rp-mcx {
  position: absolute; inset: 0; z-index: 8;
  display: flex; align-items: center; justify-content: center; padding: 14px;
  background: rgba(0,0,0,0.62);
  visibility: hidden; opacity: 0; pointer-events: none;
}
.rp-mcx-box {
  width: min(560px, 100%); max-height: 100%; overflow: auto;
  border-radius: 12px; border: 1px solid var(--border-med); background: var(--surface);
  box-shadow: 0 30px 70px -20px rgba(0,0,0,0.9);
}
.rp-mcx-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 16px; border-bottom: 1px solid var(--border); }
.rp-mcx-h b { font-size: 12px; color: var(--text); }
.rp-mcx-x { padding: 0 2px; font-size: 12px; color: var(--finto-2); }
.rp-mcx-b { display: flex; flex-direction: column; gap: 9px; padding: 11px 16px 13px; }
.rp-mcx-base { font-size: 8.5px; color: var(--finto-2); }
.rp-mcx-base em { font-style: italic; }
.rp-mcx-top { display: flex; align-items: center; gap: 16px; }
.rp-mcx-n { font-size: 36px; line-height: 1; font-weight: 700; letter-spacing: -0.03em; color: var(--green); }
.rp-mcx-top ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 2px; }
.rp-mcx-top li { display: flex; align-items: center; gap: 6px; font-size: 9px; color: var(--finto-1); }
.rp-mcx-top li b { color: var(--text); }
.rp-mcx-top li i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); }
.rp-mcx-top li.f i { background: var(--red); }
.rp-mcx-top li.i i { background: rgba(162,162,173,0.7); }
.rp-mcx-fan { position: relative; padding: 8px 8px 6px; border-radius: 8px; border: 1px solid var(--border); background: var(--bg); }
.rp-mcx-fan svg { display: block; width: 100%; height: 150px; }
.rp-mcx-fan .lin { fill: none; stroke-width: 1; stroke-dasharray: 4 3; vector-effect: non-scaling-stroke; }
.rp-mcx-fan .lin.t { stroke: rgba(34,197,94,0.6); }
.rp-mcx-fan .lin.l { stroke: rgba(244,63,94,0.6); }
.rp-mcx-fan path.p, .rp-mcx-fan path.f, .rp-mcx-fan path.i { fill: none; stroke-width: 0.9; stroke-linejoin: round; }
.rp-mcx-fan path.p { stroke: rgba(34,197,94,0.62); }
.rp-mcx-fan path.f { stroke: rgba(244,63,94,0.62); }
.rp-mcx-fan path.i { stroke: rgba(162,162,173,0.55); }
.rp-mcx-et { position: absolute; left: 12px; font-size: 7.5px; }
.rp-mcx-et.t { top: calc(8px + 150px * 46 / 214 - 5px); color: var(--green); }
.rp-mcx-et.l { top: calc(8px + 150px * 190 / 214 - 5px); color: var(--red); }
.rp-mcx-leg { display: flex; gap: 14px; margin: 4px 0 0 8px; }
.rp-mcx-leg i { display: flex; align-items: center; gap: 5px; font-size: 7.5px; color: var(--finto-2); }
.rp-mcx-leg i::before { content: ''; width: 12px; height: 1.5px; background: var(--green); }
.rp-mcx-leg i.f::before { background: var(--red); }
.rp-mcx-leg i.i::before { background: rgba(162,162,173,0.7); }
.rp-mcx-2 { display: grid; grid-template-columns: 1.3fr 1fr; gap: 16px; }
.rp-mcx-2 .rp-k { display: block; margin-bottom: 5px; }
.rp-mcx-c { display: grid; grid-template-columns: 1fr auto; gap: 2px 6px; margin-bottom: 5px; font-size: 8.5px; color: var(--text); }
.rp-mcx-c b { font-size: 8.5px; }
.rp-mcx-c .rp-tr { grid-column: 1 / -1; }
.rp-mcx-d { display: flex; gap: 18px; }
.rp-mcx-d span { font-size: 7px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--finto-2); }
.rp-mcx-d b { display: block; font-size: 12px; letter-spacing: 0; color: var(--text); }
.rp-mcx-nota { margin: 0; font-size: 8px; line-height: 1.5; color: var(--finto-2); }
.js .rp-pt .rp-mcx { animation: rpMcxF 10s var(--ease) infinite; }
.js .rp-pt .rp-mcx-box { animation: rpMcxBoxF 10s var(--ease-out) infinite; }
.js .rp-pt .rp-mcx-fan path:not(.lin) { stroke-dasharray: 1; animation: rpMcxCorsaF 10s var(--ease-out) infinite; animation-delay: calc(var(--k) * 12ms); }
.js .rp-pt .rp-mcx-c .rp-tr > i { animation: rpMcxBarF 10s var(--ease-out) infinite; }
@keyframes rpMcxF      { 0%, 14.5% { opacity: 0; visibility: hidden; } 17%, 84% { opacity: 1; visibility: visible; } 88%, 100% { opacity: 0; visibility: hidden; } }
@keyframes rpMcxBoxF   { 0%, 14.5% { transform: translateY(12px) scale(0.98); } 19%, 100% { transform: none; } }
@keyframes rpMcxCorsaF { 0%, 16% { stroke-dashoffset: 1; } 24%, 100% { stroke-dashoffset: 0; } }
@keyframes rpMcxBarF   { 0%, 19% { width: 0; } 26%, 100% { width: var(--w); } }
@media (max-width: 760px) {
  .rp-mcx { padding: 8px; }
  .rp-mcx-2 { grid-template-columns: 1fr; }
  .rp-mcx-fan svg { height: 120px; }
  .rp-mcx-et.t { top: calc(8px + 120px * 46 / 214 - 5px); }
  .rp-mcx-et.l { top: calc(8px + 120px * 190 / 214 - 5px); }
}
@media (prefers-reduced-motion: reduce) {
  .js .rp-luce .rp-tr > i { width: var(--w); animation: none; }
}
.hs-box figure { max-width: 420px; }
.hs-box .fx-hero-didascalia { max-width: 400px; }
.hs-win {
  position: relative; width: 420px; margin: 0 auto; text-align: left;
  background: var(--bg); border: 1px solid var(--border-med);
  border-radius: 14px; overflow: hidden;
  box-shadow: 0 50px 110px -40px rgba(0,0,0,0.96), 0 0 0 1px rgba(255,255,255,0.02);
  font-size: 11.5px; line-height: 1.35; color: var(--finto-1);
  font-variant-numeric: tabular-nums;
}
.hs-win i { font-style: normal; }
.hs-head { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--border); }
.hs-logo {
  display: flex; align-items: center; justify-content: center; flex: 0 0 auto;
  width: 19px; height: 19px; border-radius: 5px;
  background: var(--accent-dim); border: 1px solid var(--accent-line);
}
.hs-logo i { display: block; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); }
.hs-t { display: block; font-size: 12.5px; font-weight: 700; letter-spacing: -0.01em; line-height: 1.2; color: var(--text); }
.hs-d { display: block; font-style: normal; font-size: 10px; color: var(--finto-2); }
.hs-ctl { margin-left: auto; display: flex; gap: 10px; font-size: 11px; color: var(--finto-2); }
.hs-tabs { position: relative; display: flex; border-bottom: 1px solid var(--border); }
.hs-tabs span { flex: 1; padding: 10px 2px; text-align: center; font-size: 11.5px; font-weight: 600; color: var(--finto-2); }
.hs-tabs span:nth-child(4) { color: var(--accent); }
.hs-ul { position: absolute; left: 0; bottom: -1px; width: 25%; height: 2px; background: var(--accent); transform: translateX(300%); }
.hs-body {
  display: flex; flex-direction: column; justify-content: space-between; gap: 12px;
  min-height: 430px; padding: 16px;
}
.hs-win .k {
  display: flex; align-items: baseline; gap: 8px; margin-bottom: 6px;
  font-size: 9px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--finto-2);
}
.hs-win .k em { margin-left: auto; font-style: normal; font-weight: 500; font-size: 10px; letter-spacing: 0; text-transform: none; }
.hs-win .pos { color: var(--green); }
.hs-win .neg { color: var(--red); }
.hs-card { padding: 10px 12px; border-radius: 9px; border: 1px solid var(--border); background: var(--surface); }
.hs-card.win { border-left: 3px solid var(--green); background: linear-gradient(110deg, var(--green-dim), var(--surface) 60%); }
.hs-row { display: flex; align-items: baseline; gap: 8px; white-space: nowrap; }
.hs-row b { font-size: 12.5px; font-weight: 600; color: var(--text); }
.hs-row em { font-style: normal; font-size: 10.5px; color: var(--finto-2); }
.hs-row strong { margin-left: auto; font-size: 16px; font-weight: 700; }
.hs-row.dim { margin-top: 5px; font-size: 10.5px; color: var(--finto-2); }
.hs-row.dim em { margin-left: auto; }
.hs-chip {
  display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 999px; white-space: nowrap;
  border: 1px solid var(--border-med); background: var(--surface2); font-size: 10px; color: var(--finto-1);
}
.hs-chip.big { padding: 5px 11px; font-size: 11px; font-weight: 600; }
.hs-chip.v { color: var(--green); border-color: rgba(34,197,94,0.35); background: rgba(34,197,94,0.10); }
.hs-chip.r { color: var(--red); border-color: rgba(244,63,94,0.35); background: rgba(244,63,94,0.10); }
.hs-chip.g { color: var(--yellow); border-color: rgba(234,179,8,0.35); background: rgba(234,179,8,0.10); }
.hs-chip.a { color: var(--accent); border-color: var(--accent-line); background: var(--accent-dim); }
.hs-chips { display: flex; flex-wrap: wrap; gap: 5px; }
.hs-spark { display: block; width: 60px; height: 18px; }
.hs-spark path { fill: none; stroke: var(--green); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.hs-spark.r path { stroke: var(--red); }
.hs-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.hs-tiles span {
  padding: 8px 10px; border-radius: 8px; border: 1px solid var(--border); background: var(--surface);
  font-size: 8.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--finto-2);
}
.hs-tiles b { display: block; margin-top: 2px; font-size: 14px; letter-spacing: 0; text-transform: none; color: var(--text); }
.hs-elenco { gap: 2px; }
.hs-elenco li { margin: 0 -8px; padding: 5px 8px 5px 28px; border-radius: 7px; }
.hs-elenco li::before { left: 11px; top: 12px; }
.hs-j-fills { display: flex; flex-direction: column; gap: 4px; }
.hs-fill {
  display: grid; grid-template-columns: 38px 46px 1fr auto; align-items: center; gap: 6px;
  padding: 5px 10px; border-radius: 6px; border: 1px solid var(--border); background: var(--surface); font-size: 11px;
}
.hs-fill b { font-size: 9.5px; letter-spacing: 0.06em; }
.hs-fill b.b { color: var(--green); }
.hs-fill b.s { color: var(--red); }
.hs-fill em { font-style: normal; font-size: 10px; color: var(--finto-2); }
.hs-merge { display: block; margin-bottom: 6px; font-size: 10.5px; color: var(--accent); }
.hs-j-rev { display: flex; align-items: flex-start; gap: 10px; }
.hs-gr {
  display: inline-grid; place-items: center; flex: 0 0 auto; width: 26px; height: 26px; border-radius: 50%;
  font-size: 13px; font-weight: 700; color: var(--green);
  border: 1px solid rgba(34,197,94,0.5); background: rgba(34,197,94,0.10);
}
.hs-j-rev .tx { display: flex; flex-direction: column; gap: 7px; font-size: 12px; color: var(--text); }
.hs-j-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.hs-mini { display: flex; flex-direction: column; gap: 5px; padding: 8px 9px; border-radius: 8px; border: 1px solid var(--border); background: var(--surface); }
.hs-mini em { font-style: normal; font-size: 9.5px; color: var(--finto-2); }
.hs-mini .hs-spark { width: 100%; }
.hs-mini b { font-size: 13px; color: var(--green); }
.hs-mini.loss b { color: var(--red); }
.hs-c-focus { border-left: 3px solid var(--yellow); background: linear-gradient(110deg, rgba(234,179,8,0.12), var(--surface) 60%); }
.hs-c-focus .k { color: var(--yellow); margin-bottom: 3px; }
.hs-c-focus b { display: block; font-size: 14px; color: var(--text); }
.hs-c-focus em { display: block; margin-top: 3px; font-style: normal; font-size: 10.5px; color: var(--finto-1); }
.hs-c-row { display: grid; grid-template-columns: 130px 1fr; gap: 14px; align-items: center; }
.hs-c-g { position: relative; text-align: center; }
.hs-c-g svg { display: block; width: 130px; height: 72px; }
.hs-c-g .tr, .hs-c-g .fi { fill: none; stroke-width: 9; stroke-linecap: round; }
.hs-c-g .tr { stroke: var(--surface3); }
.hs-c-g .fi { stroke: var(--green); stroke-dasharray: 1; stroke-dashoffset: 0.22; }
.hs-c-g b { position: absolute; left: 0; right: 0; top: 32px; font-size: 26px; line-height: 1; color: var(--text); }
.hs-c-g em { display: block; margin-top: 2px; font-style: normal; font-size: 8.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--finto-2); }
.hs-c-bd { display: flex; flex-direction: column; gap: 8px; }
.hs-bd { display: grid; grid-template-columns: 92px 1fr 20px; gap: 8px; align-items: center; font-size: 10.5px; }
.hs-bd em { font-style: normal; color: var(--finto-1); white-space: nowrap; }
.hs-bd i { position: relative; display: block; height: 5px; border-radius: 3px; background: var(--surface3); overflow: hidden; }
.hs-bd i::after { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: var(--w); border-radius: 3px; background: var(--green); }
.hs-bd b { text-align: right; font-size: 11px; color: var(--text); }
.hs-c-al { display: flex; flex-direction: column; gap: 6px; }
.hs-al {
  display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 7px;
  border: 1px solid var(--border); background: var(--surface); font-size: 11px; white-space: nowrap;
}
.hs-al i { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; }
.hs-al.r i { background: var(--red); box-shadow: 0 0 0 3px rgba(244,63,94,0.15); }
.hs-al.g i { background: var(--yellow); box-shadow: 0 0 0 3px rgba(234,179,8,0.15); }
.hs-al.v i { background: var(--green); box-shadow: 0 0 0 3px rgba(34,197,94,0.15); }
.hs-al b { font-weight: 600; color: var(--text); }
.hs-al em { margin-left: auto; font-style: normal; font-size: 10px; color: var(--finto-2); }
.hs-c-sum p { display: flex; flex-direction: column; gap: 1px; font-size: 11.5px; line-height: 1.45; color: var(--text); }
.hs-c-sum p span { display: block; white-space: nowrap; }
.hs-prog { margin-top: 9px; }
.hs-prog span { display: flex; justify-content: space-between; font-size: 10.5px; }
.hs-prog b { font-weight: 600; color: var(--text); }
.hs-prog i { position: relative; display: block; margin-top: 5px; height: 6px; border-radius: 3px; background: var(--surface3); overflow: hidden; }
.hs-prog i::after { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: var(--w); border-radius: 3px; background: var(--green); }
.hs-p-dd .bar { position: relative; display: block; height: 7px; margin: 12px 0 10px; border-radius: 4px; background: linear-gradient(90deg, rgba(244,63,94,0.35), var(--surface3) 45%); }
.hs-p-dd .floor, .hs-p-dd .hwm { position: absolute; top: -4px; width: 3px; height: 15px; border-radius: 2px; }
.hs-p-dd .floor { left: 40%; background: var(--red); }
.hs-p-dd .hwm { left: 64%; background: var(--green); }
.hs-p-dd .hs-row.dim { justify-content: space-between; margin-top: 0; }
.hs-p-dd .hs-row.dim b { font-size: 11.5px; }
.hs-p-mc { display: grid; grid-template-columns: 1fr 96px; gap: 12px; align-items: center; }
.hs-p-mc .fan { position: relative; }
.hs-p-mc svg { display: block; width: 100%; height: 130px; border-radius: 8px; background: var(--surface); }
.hs-p-mc .tg, .hs-p-mc .lm { position: absolute; left: 6px; font-size: 8.5px; letter-spacing: 0.06em; text-transform: uppercase; }
.hs-p-mc .tg { top: 13px; color: var(--green); }
.hs-p-mc .lm { top: 101px; color: var(--red); }
.hs-p-mc .lin { fill: none; stroke-width: 1; stroke-dasharray: 4 3; vector-effect: non-scaling-stroke; }
.hs-p-mc .lin.t { stroke: rgba(34,197,94,0.6); }
.hs-p-mc .lin.l { stroke: rgba(244,63,94,0.6); }
.hs-p-mc path.p, .hs-p-mc path.f, .hs-p-mc path.i { fill: none; stroke-width: 2.4; stroke-linejoin: round; }
.hs-p-mc path.p { stroke: rgba(34,197,94,0.7); }
.hs-p-mc path.f { stroke: rgba(244,63,94,0.7); }
.hs-p-mc path.i { stroke: rgba(162,162,173,0.6); }
.hs-p-mc .pct { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.hs-p-mc .pct b { font-size: 34px; line-height: 1; color: var(--green); }
.hs-p-mc .pct em { font-style: normal; font-size: 10.5px; color: var(--text); }
.hs-p-mc .pct span { margin-top: 5px; font-size: 10px; line-height: 1.5; color: var(--finto-2); }
.hs-p-st, .hs-m-rule { display: flex; align-items: center; gap: 10px; }
.hs-p-st .tx, .hs-m-rule .tx { font-size: 11px; }
.hs-p-st .tx b, .hs-m-rule .tx b { color: var(--text); font-weight: 600; }
.hs-l-bars { display: flex; flex-direction: column; gap: 5px; }
.hs-l-bars .k { margin-bottom: 2px; }
.hs-l-bars .row { display: grid; grid-template-columns: 112px 1fr 56px; gap: 8px; align-items: center; }
.hs-l-bars .row span { font-size: 10.5px; color: var(--finto-1); white-space: nowrap; }
.hs-l-bars .row i { display: block; height: 7px; width: var(--w); border-radius: 4px; background: var(--red); opacity: 0.85; }
.hs-l-bars .row.v i { background: var(--green); }
.hs-l-bars .row b { text-align: right; font-size: 11px; color: var(--red); }
.hs-l-bars .row.v b { color: var(--green); }
.hs-l-eq .leg { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; font-size: 10px; white-space: nowrap; }
.hs-l-eq .leg span:not(.hs-chip) { display: inline-flex; align-items: center; gap: 5px; }
.hs-l-eq .leg i { display: block; width: 14px; height: 0; border-top: 2px solid var(--green); }
.hs-l-eq .leg i.a { border-top: 2px dashed rgba(162,162,173,0.6); }
.hs-l-eq .leg .hs-chip { margin-left: auto; }
.hs-l-eq svg { display: block; width: 100%; height: 70px; border-radius: 8px; background: var(--surface); }
.hs-l-eq .all { fill: none; stroke: rgba(162,162,173,0.55); stroke-width: 1.3; stroke-dasharray: 4 3; vector-effect: non-scaling-stroke; }
.hs-l-eq .rule { fill: none; stroke: var(--green); stroke-width: 2; }
.hs-l-in { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 7px; border: 1px solid var(--border-med); background: var(--surface2); }
.hs-l-in .tx { flex: 1; font-size: 11.5px; color: var(--text); white-space: nowrap; }
.hs-l-ok { display: block; margin-top: 7px; font-size: 10.5px; color: var(--accent); }
.hs-l-ok b { font-weight: 600; color: var(--text); }
.hs-l-ab { display: grid; gap: 6px; }
.hs-l-ab .ab {
  display: grid; grid-template-columns: 22px 1fr auto 64px; gap: 8px; align-items: center;
  padding: 7px 10px; border-radius: 8px; border: 1px solid var(--border); background: var(--surface); font-size: 11px; color: var(--text);
}
.hs-l-ab .ab b { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 5px; font-size: 10px; background: var(--accent-dim); color: var(--accent); }
.hs-l-ab .ab em { font-style: normal; font-size: 10px; color: var(--finto-2); }
.hs-l-ab .ab strong { text-align: right; font-size: 12.5px; }
.hs-m-mk { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.hs-m-mk i { padding: 3px 9px; border-radius: 999px; border: 1px solid var(--border); background: var(--surface2); font-size: 10px; color: var(--finto-2); }
.hs-m-mk i.on { color: var(--accent); border-color: var(--accent-line); background: var(--accent-dim); }
.hs-m-mk i.piu { border-style: dashed; }
.hs-m-mk em { width: 100%; margin-top: 2px; font-style: normal; font-size: 10px; color: var(--finto-2); }
.hs-m-pos .lab { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.hs-m-pos .sw { display: inline-flex; padding: 2px; border-radius: 999px; border: 1px solid var(--border-med); background: var(--surface2); }
.hs-m-pos .sw b { padding: 3px 10px; border-radius: 999px; font-size: 10px; font-weight: 600; color: var(--finto-2); }
.hs-m-pos .sw .c2 { background: var(--accent-dim); color: var(--accent); }
.hs-m-pos .leg { display: flex; gap: 10px; font-size: 10px; }
.hs-m-pos .leg .v { color: var(--green); }
.hs-m-pos .leg .p { color: #a78bfa; }
.hs-m-pos svg { display: block; width: 100%; height: 100px; border-radius: 8px; background: var(--surface); }
.hs-m-pos .z { fill: none; stroke: rgba(255,255,255,0.12); stroke-width: 1; vector-effect: non-scaling-stroke; }
.hs-m-pos path.nc, .hs-m-pos path.hf { fill: none; stroke: var(--green); stroke-width: 2; }
.hs-m-pos path.in { fill: none; stroke: #a78bfa; stroke-width: 2; }
.hs-m-pos path.nc { opacity: 0; }
.hs-m-cd .k { margin-bottom: 2px; }
.hs-m-cd .ev { display: grid; grid-template-columns: 38px 1fr auto; gap: 8px; align-items: center; padding: 7px 0 0; margin-top: 6px; border-top: 1px solid var(--border); font-size: 11px; }
.hs-m-cd .ev em { font-style: normal; color: var(--finto-2); }
.hs-m-cd .ev b { font-weight: 500; color: var(--text); white-space: nowrap; }
.hs-m-cd .ev.dim b { color: var(--finto-1); }
.hs-m-cd .due { display: inline-grid; font-weight: 700; }
.hs-m-cd .due > i { grid-area: 1 / 1; text-align: right; white-space: nowrap; }
.hs-m-cd .due .a { color: var(--yellow); opacity: 0; }
.hs-m-cd .due .c { color: var(--green); }
.hs-a-flow { display: flex; align-items: center; gap: 8px; }
.hs-a-flow .n { padding: 7px 12px; border-radius: 7px; border: 1px solid var(--border-med); background: var(--surface); font-size: 11px; font-weight: 600; color: var(--text); }
.hs-a-flow .n.j { border-color: var(--accent-line); }
.hs-a-flow .line { position: relative; flex: 1; height: 1px; background: var(--border-med); }
.hs-a-flow .line i { position: absolute; top: -2px; left: 0; width: 5px; height: 5px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 6px var(--accent); opacity: 0; }
.hs-a-flow .orb { width: 26px; height: 26px; flex: 0 0 auto; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 1px rgba(77,171,154,0.4), 0 0 18px 3px rgba(77,171,154,0.3); }
.hs-a-map + .hs-a-map { margin-top: 5px; }
.hs-a-map { display: flex; align-items: center; gap: 8px; margin-top: 10px; padding: 7px 10px; border-radius: 7px; border: 1px solid var(--border); background: var(--surface); font-size: 11px; white-space: nowrap; }
.hs-a-map em { font-style: normal; color: var(--finto-2); }
.hs-a-map b { font-weight: 600; color: var(--text); }
.hs-a-map .hs-chip { margin-left: auto; }
.hs-a-rate { display: block; margin-top: 6px; font-size: 10.5px; color: var(--finto-2); }
.hs-a-note { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; padding: 9px 10px; border-radius: 8px; border: 1px dashed rgba(77,171,154,0.4); background: rgba(77,171,154,0.06); }
.hs-a-note .k { width: 100%; margin-bottom: 2px; color: var(--accent); }
.js .hs-hero .hs-f1 { animation: hsF1 12s var(--ease-out) infinite; }
.js .hs-hero .hs-f2 { animation: hsF2 12s var(--ease-out) infinite; }
.js .hs-hero .hs-f3 { animation: hsF3 12s var(--ease-out) infinite; }
.js .hs-hero .hs-f4 { animation: hsF4 12s var(--ease-out) infinite; }
@keyframes hsF1 { 0%, 1.5% { opacity: 0; transform: translateY(10px); } 4.5%, 95% { opacity: 1; transform: none; } 99%, 100% { opacity: 0; transform: none; } }
@keyframes hsF2 { 0%, 24%  { opacity: 0; transform: translateY(10px); } 27%, 95%  { opacity: 1; transform: none; } 99%, 100% { opacity: 0; transform: none; } }
@keyframes hsF3 { 0%, 47%  { opacity: 0; transform: translateY(10px); } 50%, 95%  { opacity: 1; transform: none; } 99%, 100% { opacity: 0; transform: none; } }
@keyframes hsF4 { 0%, 70%  { opacity: 0; transform: translateY(10px); } 73%, 95%  { opacity: 1; transform: none; } 99%, 100% { opacity: 0; transform: none; } }
.js .hs-hero .hs-tabs span { animation: hsTab 12s var(--ease) infinite backwards; animation-delay: calc(0.18s + var(--i) * 2.76s); }
.js .hs-hero .hs-elenco li { animation: hsLi 12s var(--ease) infinite backwards; animation-delay: calc(0.18s + var(--i) * 2.76s); }
.js .hs-hero .hs-elenco li::before { animation: hsPunto 12s var(--ease) infinite backwards; animation-delay: calc(0.18s + var(--i) * 2.76s); }
.js .hs-hero .hs-ul { animation: hsUl 12s var(--ease) infinite; }
@keyframes hsTab   { 0% { color: var(--finto-2); } 2%, 22.5% { color: var(--accent); } 23.5%, 100% { color: var(--finto-2); } }
@keyframes hsLi    { 0% { background: transparent; color: var(--text-dim); } 2%, 22.5% { background: var(--fx-dim, var(--accent-dim)); color: var(--text); } 23.5%, 100% { background: transparent; color: var(--text-dim); } }
@keyframes hsPunto { 0% { box-shadow: none; transform: none; } 2%, 22.5% { box-shadow: 0 0 0 4px var(--fx-dim, var(--accent-dim)); transform: scale(1.25); } 23.5%, 100% { box-shadow: none; transform: none; } }
@keyframes hsUl {
  0%, 1.5% { transform: translateX(0);    opacity: 0; }
  4.5%, 24% { transform: translateX(0);   opacity: 1; }
  27%, 47%  { transform: translateX(100%); }
  50%, 70%  { transform: translateX(200%); }
  73%, 95%  { transform: translateX(300%); opacity: 1; }
  99%, 100% { transform: translateX(300%); opacity: 0; }
}
.js .hs-hero .hs-f1.hs-j-fills { animation: hsJF 12s var(--ease-out) infinite; }
@keyframes hsJF { 0%, 1.5% { opacity: 0; transform: translateY(10px); } 4.5%, 24% { opacity: 1; transform: none; } 28%, 95% { opacity: 0.4; transform: none; } 99%, 100% { opacity: 0; } }
.js .hs-hero .hs-c-g .fi { animation: hsArco 12s var(--ease-out) infinite; }
@keyframes hsArco { 0%, 25% { stroke-dashoffset: 1; } 36%, 95% { stroke-dashoffset: 0.22; } 99%, 100% { stroke-dashoffset: 1; } }
.js .hs-hero .hs-bd i::after { animation: hsPieno 12s var(--ease-out) infinite; }
@keyframes hsPieno { 0%, 26% { width: 0; } 37%, 100% { width: var(--w); } }
.js .hs-hero .hs-c-sum p span:nth-child(1) { animation: hsScr1 12s linear infinite; }
.js .hs-hero .hs-c-sum p span:nth-child(2) { animation: hsScr2 12s linear infinite; }
.js .hs-hero .hs-c-sum p span:nth-child(3) { animation: hsScr3 12s linear infinite; }
@keyframes hsScr1 { 0%, 73% { clip-path: inset(0 100% 0 0); } 79%, 100% { clip-path: inset(0 0 0 0); } }
@keyframes hsScr2 { 0%, 79% { clip-path: inset(0 100% 0 0); } 85%, 100% { clip-path: inset(0 0 0 0); } }
@keyframes hsScr3 { 0%, 85% { clip-path: inset(0 100% 0 0); } 91%, 100% { clip-path: inset(0 0 0 0); } }
.js .hs-hero .hs-prog i::after { animation: hsPieno1 12s var(--ease-out) infinite; }
@keyframes hsPieno1 { 0%, 3% { width: 0; } 14%, 100% { width: var(--w); } }
.js .hs-hero .hs-p-dd .hwm   { animation: hsHwm 12s var(--ease) infinite; }
.js .hs-hero .hs-p-dd .floor { animation: hsFloor 12s var(--ease) infinite; }
@keyframes hsHwm   { 0%, 27% { left: 34%; } 40%, 100% { left: 64%; } }
@keyframes hsFloor { 0%, 30% { left: 10%; } 43%, 100% { left: 40%; } }
.js .hs-hero .hs-p-mc path:not(.lin) { stroke-dasharray: 1; animation: hsCorsa 12s var(--ease-out) infinite; }
@keyframes hsCorsa { 0%, 48% { stroke-dashoffset: 1; } 60%, 100% { stroke-dashoffset: 0; } }
.js .hs-hero .hs-l-bars .row i { animation: hsBarra 12s var(--ease-out) infinite; }
@keyframes hsBarra { 0%, 3% { width: 0; } 15%, 100% { width: var(--w); } }
.js .hs-hero .hs-l-eq .rule { stroke-dasharray: 1; animation: hsRegola 12s var(--ease-out) infinite; }
@keyframes hsRegola { 0%, 26% { stroke-dashoffset: 1; } 40%, 100% { stroke-dashoffset: 0; } }
.js .hs-hero .hs-l-in .tx { animation: hsScrivi 12s linear infinite; }
@keyframes hsScrivi { 0%, 49% { clip-path: inset(0 100% 0 0); animation-timing-function: steps(33, end); } 59%, 100% { clip-path: inset(0 0 0 0); } }
.js .hs-hero .hs-l-ok { animation: hsOk 12s var(--ease-out) infinite; }
@keyframes hsOk { 0%, 60% { opacity: 0; } 63%, 100% { opacity: 1; } }
.js .hs-hero .hs-m-pos path.nc { stroke-dasharray: 1; animation: hsNc 12s var(--ease-out) infinite; }
.js .hs-hero .hs-m-pos path.hf, .js .hs-hero .hs-m-pos path.in { stroke-dasharray: 1; animation: hsSplit 12s var(--ease-out) infinite; }
.js .hs-hero .hs-m-pos .leg { animation: hsF2 12s var(--ease-out) infinite; }
.js .hs-hero .hs-m-pos .sw .c1 { animation: hsSw1 12s var(--ease) infinite; }
.js .hs-hero .hs-m-pos .sw .c2 { animation: hsSw2 12s var(--ease) infinite; }
@keyframes hsNc    { 0%, 2% { stroke-dashoffset: 1; opacity: 1; } 15% { stroke-dashoffset: 0; } 24% { opacity: 1; } 28%, 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes hsSplit { 0%, 24% { stroke-dashoffset: 1; } 37%, 95% { stroke-dashoffset: 0; opacity: 1; } 99%, 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes hsSw1 { 0%, 24% { background: var(--accent-dim); color: var(--accent); } 26%, 100% { background: transparent; color: var(--finto-2); } }
@keyframes hsSw2 { 0%, 24% { background: transparent; color: var(--finto-2); } 26%, 100% { background: var(--accent-dim); color: var(--accent); } }
.js .hs-hero .hs-m-cd .due .a { animation: hsCdA 12s steps(1, end) infinite; }
.js .hs-hero .hs-m-cd .due .c { animation: hsCdC 12s steps(1, end) infinite; }
@keyframes hsCdA { 0% { opacity: 1; } 58% { opacity: 0; } 99% { opacity: 1; } }
@keyframes hsCdC { 0% { opacity: 0; } 58% { opacity: 1; } 99% { opacity: 0; } }
.js .hs-hero .hs-a-flow .line i { animation: hsPunti 1.2s linear infinite; }
.js .hs-hero .hs-a-flow .line i:nth-child(2) { animation-delay: -0.4s; }
.js .hs-hero .hs-a-flow .line i:nth-child(3) { animation-delay: -0.8s; }
@keyframes hsPunti { 0% { left: 0; opacity: 0; } 15% { opacity: 1; } 85% { opacity: 1; } 100% { left: calc(100% - 5px); opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .js .hs-hero *, .js .hs-hero *::before, .js .hs-hero *::after { animation: none !important; }
}
@media (max-width: 470px) { .hs-win { zoom: 0.8; } }
@media (min-width: 1001px) and (max-height: 900px) { .hs-box figure { zoom: 1; } }
@media (min-width: 1001px) and (max-height: 720px) { .hs-box figure { zoom: 0.86; } }
@media (min-width: 1001px) and (max-height: 640px) { .hs-box figure { zoom: 0.76; } }
@media (max-width: 374px) { .hs-win { zoom: 0.68; } }
.vg, .pl-win {
  position: relative; width: 100%; text-align: left;
  background: var(--bg); border: 1px solid var(--border-med);
  border-radius: 14px; overflow: hidden;
  box-shadow: 0 50px 110px -40px rgba(0,0,0,0.96), 0 0 0 1px rgba(255,255,255,0.02);
  font-size: 11.5px; line-height: 1.35; color: var(--finto-1);
  font-variant-numeric: tabular-nums;
}
.vg { max-width: 440px; margin: 0 auto; }
.vg i, .pl-win i, .vg s, .pl-win s { font-style: normal; text-decoration: none; }
.vg-body { display: flex; flex-direction: column; gap: 12px; min-height: 290px; padding: 16px; }
.vg .k, .pl-win .k {
  display: flex; align-items: baseline; gap: 8px; margin-bottom: 6px;
  font-size: 9px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--finto-2);
}
.vg .k em, .pl-win .k em { margin-left: auto; font-style: normal; font-weight: 500; font-size: 10px; letter-spacing: 0; text-transform: none; }
.vg .pos, .pl-win .pos { color: var(--green); }
.vg .neg, .pl-win .neg { color: var(--red); }
.vg .tx, .pl-win .tx { font-size: 11px; line-height: 1.45; color: var(--finto-1); }
.vg .tx b, .pl-win .tx b { color: var(--text); font-weight: 600; }
.hs-tiles.vg-t4 { grid-template-columns: repeat(4, 1fr); }
.vg-btn {
  display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; padding: 7px 13px; border-radius: 8px;
  background: var(--accent); color: #06231e; font-size: 11px; font-weight: 700; white-space: nowrap;
}
.vg-leg { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; font-size: 10px; white-space: nowrap; }
.vg-leg span:not(.hs-chip) { display: inline-flex; align-items: center; gap: 5px; }
.vg-leg i { display: block; width: 14px; height: 0; border-top: 2px solid var(--green); }
.vg-leg i.a, .vg-leg i.c { border-top: 2px dashed rgba(162,162,173,0.6); }
.vg-leg .hs-chip { margin-left: auto; }
.vg-eq { display: block; width: 100%; height: 84px; border-radius: 8px; background: var(--surface); }
.vg-eq .all { fill: none; stroke: rgba(162,162,173,0.55); stroke-width: 1.3; stroke-dasharray: 4 3; vector-effect: non-scaling-stroke; }
.vg-eq .rule { fill: none; stroke: var(--green); stroke-width: 2.2; }
.vg-sub { display: block; margin-top: 6px; font-size: 10px; color: var(--finto-2); }
.vg-csv { display: flex; flex-direction: column; gap: 3px; }
.vg-csvr {
  display: grid; grid-template-columns: 58px 34px 16px 1fr 50px; gap: 6px; align-items: center;
  padding: 5px 10px; border-radius: 6px; border: 1px solid var(--border); background: var(--surface); font-size: 10.5px;
}
.vg-csvr em { font-style: normal; color: var(--finto-2); }
.vg-csvr b { font-size: 9.5px; letter-spacing: 0.06em; }
.vg-csvr b.b { color: var(--green); }
.vg-csvr b.s { color: var(--red); }
.vg-csvr s { text-align: right; color: var(--red); }
.vg-badge { margin-left: 4px; padding: 1px 7px; font-size: 9.5px; }
.vg-fold { display: flex; align-items: center; gap: 10px; }
.vg-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; margin-top: 8px; border-radius: 8px; overflow: hidden; background: var(--border); }
.vg-stats span { padding: 7px 9px; background: var(--surface); font-size: 8.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--finto-2); }
.vg-stats b { display: block; margin-top: 1px; font-size: 13px; letter-spacing: 0; text-transform: none; color: var(--text); }
.vg-trs { display: flex; flex-direction: column; gap: 4px; }
.vg-tr {
  display: grid; grid-template-columns: 12px 42px 1fr auto 62px; gap: 8px; align-items: center;
  padding: 6px 10px; border-radius: 7px; border: 1px solid var(--border); border-left-width: 3px; background: var(--surface); font-size: 11px;
}
.vg-tr.win { border-left-color: var(--green); }
.vg-tr.loss { border-left-color: var(--red); }
.vg-tr.be { border-left-color: var(--yellow); }
.vg-tr em { font-style: normal; color: var(--finto-2); }
.vg-tr b { font-weight: 600; color: var(--text); }
.vg-tr strong { text-align: right; font-size: 11.5px; }
.vg-tr.win strong { color: var(--green); }
.vg-tr.loss strong { color: var(--red); }
.vg-tr.be strong { color: var(--yellow); }
.vg-tr .ck { width: 12px; height: 12px; border-radius: 3px; border: 1px solid var(--border-med); }
.vg-tr.sel .ck { background: var(--accent); border-color: var(--accent); }
.vg-bulk { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 8px 10px; border-radius: 8px; border: 1px solid var(--accent-line); background: var(--accent-dim); }
.vg-bulk b { margin-right: 4px; font-size: 11px; color: var(--text); }
.vg-cand { display: flex; flex-direction: column; gap: 5px; }
.vg-cr { display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; align-items: center; padding: 8px 10px; border-radius: 8px; border: 1px solid var(--border); background: var(--surface); }
.vg-cr b { font-size: 11.5px; font-weight: 600; color: var(--text); }
.vg-cr strong { font-size: 12px; }
.vg-cr .hs-chip { grid-column: 1 / -1; justify-self: start; }
.vg-cr.uno { border-color: rgba(234,179,8,0.45); background: linear-gradient(110deg, rgba(234,179,8,0.10), var(--surface) 60%); }
.vg-cmp { display: flex; flex-direction: column; gap: 6px; }
.vg-cb { display: grid; grid-template-columns: 104px 1fr 24px; gap: 8px; align-items: center; font-size: 10.5px; }
.vg-cb em { font-style: normal; }
.vg-cb i { display: block; height: 7px; width: var(--w); border-radius: 4px; background: var(--surface3); }
.vg-cb.on i { background: var(--green); }
.vg-cb b { text-align: right; font-size: 12px; color: var(--text); }
.vg-btnrow { display: flex; align-items: center; justify-content: space-between; }
.vg-btnrow .k { margin: 0; }
.vg-typed p { display: flex; flex-direction: column; gap: 2px; font-size: 11.5px; line-height: 1.5; color: var(--text); }
.vg-typed p span { white-space: nowrap; }
.vg-arch { display: flex; flex-direction: column; gap: 4px; }
.vg-arch span:not(.k) { display: flex; justify-content: space-between; padding: 6px 10px; border-radius: 7px; border: 1px solid var(--border); background: var(--surface); }
.vg-arch b { font-size: 11px; font-weight: 600; color: var(--text); }
.vg-arch em { font-style: normal; font-size: 10px; color: var(--finto-2); }
.vg-rules { display: flex; flex-direction: column; }
.vg-rules .k .hs-chip { margin-left: auto; font-size: 10px; letter-spacing: 0; text-transform: none; }
.vg-rules span:not(.k):not(.hs-chip) { display: flex; justify-content: space-between; padding: 6px 0; border-top: 1px solid var(--border); font-size: 11px; }
.vg-rules span em { font-style: normal; color: var(--finto-1); }
.vg-rules span b { font-weight: 600; color: var(--text); }
.vg-own { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.vg-own > span:first-child { padding: 5px 10px; border-radius: 7px; border: 1px dashed var(--border-med); font-size: 11px; }
.vg-fan { position: relative; }
.vg-fan svg { display: block; width: 100%; height: 104px; border-radius: 8px; background: var(--surface); }
.vg-fan .tg, .vg-fan .lm { position: absolute; left: 6px; font-size: 8.5px; letter-spacing: 0.06em; text-transform: uppercase; }
.vg-fan .tg { top: 12px; color: var(--green); }
.vg-fan .lm { top: 80px; color: var(--red); }
.vg-fan .lin { fill: none; stroke-width: 1; stroke-dasharray: 4 3; vector-effect: non-scaling-stroke; }
.vg-fan .lin.t { stroke: rgba(34,197,94,0.6); }
.vg-fan .lin.l { stroke: rgba(244,63,94,0.6); }
.vg-fan path.p, .vg-fan path.f, .vg-fan path.i { fill: none; stroke-width: 2.4; stroke-linejoin: round; }
.vg-fan path.p { stroke: rgba(34,197,94,0.7); }
.vg-fan path.f { stroke: rgba(244,63,94,0.7); }
.vg-fan path.i { stroke: rgba(162,162,173,0.6); }
.vg-out { display: flex; flex-direction: column; gap: 5px; }
.vg-out span { display: grid; grid-template-columns: 70px 1fr 38px; gap: 8px; align-items: center; font-size: 11px; }
.vg-out em { font-style: normal; }
.vg-out i { display: block; height: 7px; width: var(--w); border-radius: 4px; background: var(--finto-2); }
.vg-out i.v { background: var(--green); }
.vg-out i.r { background: var(--red); }
.vg-out b { text-align: right; font-size: 12px; }
.vg-verd b { display: block; font-size: 12.5px; color: var(--text); }
.vg-verd em { display: block; margin-top: 3px; font-style: normal; font-size: 10.5px; color: var(--finto-2); }
.vg-mk { display: grid; grid-template-columns: repeat(5, 1fr); gap: 5px; }
.vg-mk span { padding: 6px 4px; border-radius: 7px; border: 1px solid var(--border); background: var(--surface); text-align: center; }
.vg-mk b { display: block; font-size: 11.5px; color: var(--text); }
.vg-mk em { display: block; font-style: normal; font-size: 8.5px; color: var(--finto-2); white-space: nowrap; }
.vg-mk .on { border-color: var(--accent-line); background: var(--accent-dim); }
.vg-mk .on b { color: var(--accent); }
.vg-arr { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 8px; border: 1px solid var(--accent-line); background: rgba(77,171,154,0.06); }
.vg-arr .tx { flex: 1; }
.vg-pos svg { display: block; width: 100%; height: 88px; border-radius: 8px; background: var(--surface); }
.vg-pos rect.g { fill: rgba(34,197,94,0.5); }
.vg-pos rect.r { fill: rgba(244,63,94,0.5); }
.vg-pos .px { fill: none; stroke: #e7e7ea; stroke-width: 1.8; }
.vg-sw { display: inline-flex; align-self: flex-start; padding: 2px; border-radius: 999px; border: 1px solid var(--border-med); background: var(--surface2); }
.vg-sw b { padding: 3px 11px; border-radius: 999px; font-size: 10.5px; font-weight: 600; color: var(--finto-2); }
.vg-sw .c2 { background: var(--accent-dim); color: var(--accent); }
.vg-stack { display: grid; }
.vg-stack > * { grid-area: 1 / 1; }
.vg-solo1 { opacity: 0; }
.vg-nbs { display: flex; flex-direction: column; gap: 8px; }
.vg-nb { display: grid; grid-template-columns: 104px 1fr 62px; gap: 8px; align-items: center; font-size: 11px; }
.vg-nb em { font-style: normal; }
.vg-nb i { display: block; height: 9px; width: var(--w); border-radius: 4px; }
.vg-nb.v i { background: var(--green); }
.vg-nb.r i { background: var(--red); }
.vg-nb b { text-align: right; font-size: 12px; }
.vg-nb.v b { color: var(--green); }
.vg-nb.r b { color: var(--red); }
.vg-call b { display: block; font-size: 12px; color: var(--text); }
.vg-call em { display: block; margin-top: 3px; font-style: normal; font-size: 10.5px; color: var(--finto-1); }
.vg-lcs { display: flex; flex-direction: column; gap: 7px; }
.vg-lc { display: grid; grid-template-columns: 124px 1fr 42px 44px; gap: 8px; align-items: center; font-size: 11px; }
.vg-lc em { font-style: normal; }
.vg-lc i { display: block; height: 6px; width: var(--w); border-radius: 3px; background: var(--green); }
.vg-lc.g i { background: var(--yellow); }
.vg-lc b { text-align: right; color: var(--text); }
.vg-lc s { text-align: right; font-size: 9.5px; color: var(--finto-2); }
.vg-clima { display: flex; align-items: baseline; gap: 8px; }
.vg-clima b { font-size: 40px; line-height: 1; color: var(--green); }
.vg-clima em { font-style: normal; font-size: 12px; color: var(--finto-2); }
.vg-clima span { display: flex; flex-direction: column; margin-left: 8px; font-size: 10.5px; }
.vg-clima strong { font-size: 13px; color: var(--text); }
.vg-ind { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: center; margin-top: 8px; padding: 7px 10px; border-radius: 7px; border: 1px solid var(--border); background: var(--surface); font-size: 11px; }
.vg-ind em { font-style: normal; color: var(--text); }
.vg-ind s { font-size: 10px; color: var(--finto-2); }
.vg-acs { display: flex; flex-direction: column; gap: 5px; }
.vg-ac { display: grid; grid-template-columns: 66px 62px 1fr auto; gap: 8px; align-items: center; padding: 8px 10px; border-radius: 8px; border: 1px solid var(--border); background: var(--surface); font-size: 11px; white-space: nowrap; }
.vg-ac b { font-weight: 600; color: var(--text); }
.vg-ac em { font-style: normal; color: var(--finto-2); }
.vg-ac .dove { color: var(--finto-1); overflow: hidden; }
.vg-sel { display: inline-grid; }
.vg-sel > i { grid-area: 1 / 1; }
.vg-sel .a { color: var(--yellow); opacity: 0; }
.vg-sel .c { color: var(--text); }
.vg-nl { opacity: 0; }
.vg-prev .vg-btn { margin-top: 10px; }
.plc {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 440px);
  gap: clamp(28px, calc(3 * var(--vu)), 56px); align-items: center;
}
.pl-list { display: flex; flex-direction: column; gap: 2px; }
.pl-r {
  position: relative; display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 14px; align-items: start;
  padding: 11px 14px; border-radius: 12px; border: 1px solid transparent; overflow: hidden;
}
.pl-r .fx-card-ico { margin: 0; }
.pl-r h3 { font-size: 14.5px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.3; }
.pl-r p { margin-top: 3px; font-size: 13px; line-height: 1.5; color: var(--text-muted); }
.pl-r::after {
  content: ''; position: absolute; left: 14px; right: 14px; bottom: 0; height: 2px; border-radius: 1px;
  background: var(--fx); transform-origin: left; transform: scaleX(0);
}
.pl-stage { position: relative; display: grid; height: 272px; padding: 18px; }
.pl-st { grid-area: 1 / 1; display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.pl-st + .pl-st { opacity: 0; }
.pl-dots { display: flex; justify-content: center; gap: 6px; padding-bottom: 14px; }
.pl-dots i { display: block; width: 6px; height: 6px; border-radius: 3px; background: var(--surface3); }
.pl-dots i:first-child { width: 18px; background: var(--accent); }
.pl-win .hs-card { display: block; }
.pl-st > div { display: flex; flex-direction: column; gap: 10px; }
.pl-tl { position: relative; height: 10px; border-radius: 5px; background: var(--surface3); }
.pl-tl .seg { position: absolute; left: 18%; width: 3%; top: -3px; bottom: -3px; border-radius: 3px; background: var(--accent); box-shadow: 0 0 10px var(--accent); }
.pl-tlab { display: flex; justify-content: space-between; font-size: 9.5px; color: var(--finto-2); margin-top: -4px; }
.pl-st .hs-chip { align-self: flex-start; }
.pl-shot svg { display: block; width: 100%; height: 118px; border-radius: 8px; background: var(--surface); }
.pl-shot rect.g { fill: rgba(34,197,94,0.75); }
.pl-shot rect.r { fill: rgba(244,63,94,0.75); }
.pl-fields span { display: flex; flex-direction: column; gap: 2px; padding: 8px 11px; border-radius: 8px; border: 1px solid var(--border); background: var(--surface); }
.pl-fields em { font-style: normal; font-size: 8.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--finto-2); }
.pl-fields b { font-size: 12px; font-weight: 500; color: var(--text); }
.pl-fields b.neg { color: var(--red); }
.pl-grade .sc { display: flex; gap: 8px; }
.pl-grade .sc i { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 10px; border: 1px solid var(--border); background: var(--surface); font-size: 14px; font-weight: 700; color: var(--finto-2); }
.pl-grade .sc i.on { border-color: rgba(34,197,94,0.5); background: rgba(34,197,94,0.12); color: var(--green); transform: scale(1.1); }
.pl-grade .hs-card b, .pl-link .hs-card b, .pl-src .hs-card b, .pl-dup .hs-card b { display: block; font-size: 12px; color: var(--text); }
.pl-grade .hs-card em, .pl-link .hs-card em, .pl-src .hs-card em, .pl-dup .hs-card em, .pl-match .hs-card em { display: block; font-style: normal; font-size: 10px; color: var(--finto-2); }
.pl-mood span:not(.tx) { display: flex; align-items: center; gap: 12px; padding: 9px 12px; border-radius: 8px; border: 1px solid var(--border); background: var(--surface); }
.pl-mood em { width: 48px; font-style: normal; font-size: 10px; color: var(--finto-2); }
.pl-mood b { flex: 1; font-size: 13px; color: var(--text); }
.pl-mood i { width: 10px; height: 10px; border-radius: 50%; }
.pl-mood i.v { background: var(--green); box-shadow: 0 0 0 4px rgba(34,197,94,0.15); }
.pl-mood i.r { background: var(--red); box-shadow: 0 0 0 4px rgba(244,63,94,0.15); }
.pl-tags .k { margin: 0; }
.pl-bars { position: relative; display: flex; align-items: flex-end; gap: 10px; height: 120px; padding: 10px 12px 0; border-radius: 8px; background: var(--surface); }
.pl-bars i { flex: 1; height: var(--h); border-radius: 4px 4px 0 0; background: var(--green); opacity: 0.85; }
.pl-bars i.r { background: var(--red); }
.pl-avg { position: absolute; left: 8px; right: 8px; bottom: var(--y); border-top: 1px dashed rgba(234,179,8,0.8); }
.pl-seq, .pl-src, .pl-link, .pl-dup, .pl-match, .pl-plat { align-items: stretch; }
.pl-seq .hs-card, .pl-plat .hs-card { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.pl-seq .hs-card b, .pl-plat .hs-card b { font-size: 12px; color: var(--text); }
.pl-seq .rev { border-color: rgba(244,63,94,0.45); background: linear-gradient(110deg, rgba(244,63,94,0.10), var(--surface) 60%); }
.pl-gap { align-self: center; padding: 2px 10px; border-left: 1px dashed var(--accent); font-size: 10.5px; color: var(--accent); }
.pl-streak .dots { display: flex; flex-wrap: wrap; gap: 6px; }
.pl-streak .dots i { width: 18px; height: 18px; border-radius: 50%; }
.pl-streak .dots i.v { background: rgba(34,197,94,0.75); }
.pl-streak .dots i.r { background: rgba(244,63,94,0.75); }
.pl-heat .grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.pl-heat .grid i { height: 24px; border-radius: 4px; }
.pl-heat .grid i.v { background: rgba(34,197,94,0.55); }
.pl-heat .grid i.g { background: rgba(234,179,8,0.45); }
.pl-heat .grid i.r { background: rgba(244,63,94,0.55); }
.pl-hlab { display: flex; justify-content: space-between; font-size: 9.5px; color: var(--finto-2); margin-top: -4px; }
.pl-prog .bar, .pl-re .bar { position: relative; display: block; height: 8px; border-radius: 4px; background: var(--surface3); overflow: hidden; }
.pl-prog .bar > i, .pl-re .bar > i { position: absolute; left: 0; top: 0; bottom: 0; width: var(--w); border-radius: 4px; background: var(--green); }
.pl-status { flex-direction: row !important; flex-wrap: wrap; }
.pl-status .tx { width: 100%; }
.pl-dd .bar { position: relative; display: block; height: 8px; margin: 6px 0; border-radius: 4px; background: linear-gradient(90deg, rgba(244,63,94,0.35), var(--surface3) 45%); }
.pl-dd .floor, .pl-dd .hwm { position: absolute; top: -5px; width: 3px; height: 18px; border-radius: 2px; }
.pl-dd .floor { left: 40%; background: var(--red); }
.pl-dd .hwm { left: 64%; background: var(--green); }
.pl-dd .hs-row.dim { justify-content: space-between; }
.pl-chain { align-self: center; font-size: 18px; color: var(--accent); }
.pl-many .hs-card { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: center; }
.pl-many .hs-card b { font-size: 12px; color: var(--text); }
.pl-many .hs-card em { font-style: normal; font-size: 10.5px; color: var(--finto-2); }
.pl-rank span:not(.k) { display: grid; grid-template-columns: 110px 1fr 58px; gap: 8px; align-items: center; font-size: 11px; }
.pl-rank em { font-style: normal; }
.pl-rank i { display: block; height: 8px; width: var(--w); border-radius: 4px; background: var(--red); }
.pl-rank b { text-align: right; }
.pl-write .inp { padding: 10px 12px; border-radius: 8px; border: 1px solid var(--border-med); background: var(--surface2); }
.pl-write .inp i { display: block; font-size: 12.5px; color: var(--text); white-space: nowrap; }
.pl-write .ok { font-size: 11px; color: var(--accent); }
.pl-write .ok b { color: var(--text); }
.pl-slice { flex-direction: row !important; flex-wrap: wrap; align-items: center; }
.pl-slice .tx { width: 100%; }
.pl-desk .rule { display: flex; align-items: center; gap: 10px; }
.pl-desk .rule b { font-size: 13px; color: var(--text); }
.pl-desk .ck { position: relative; width: 18px; height: 18px; flex: 0 0 auto; border-radius: 5px; background: var(--accent); }
.pl-desk .ck::after { content: '\2713'; position: absolute; inset: 0; display: grid; place-items: center; font-size: 12px; font-weight: 700; color: #06231e; }
.pl-desk em { font-style: normal; font-size: 10.5px; color: var(--finto-1); }
.pl-bands svg { display: block; width: 100%; height: 120px; border-radius: 8px; background: var(--surface); }
.pl-bands .bd { fill: rgba(77,171,154,0.14); }
.pl-bands .nc { fill: none; stroke: var(--green); stroke-width: 2; }
.pl-after span:not(.k) { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px; border-radius: 8px; border: 1px solid var(--border); background: var(--surface); }
.pl-after em { font-style: normal; font-size: 11px; }
.pl-after b { font-size: 15px; }
.pl-week .days, .pl-7 .days { display: grid; gap: 6px; }
.pl-week .days { grid-template-columns: repeat(5, 1fr); }
.pl-7 .days { grid-template-columns: repeat(7, 1fr); }
.pl-week .days span, .pl-7 .days span { position: relative; padding: 12px 0; border-radius: 8px; border: 1px solid var(--border); background: var(--surface); text-align: center; font-size: 11px; }
.pl-week .fri, .pl-7 .on { border-color: var(--accent-line) !important; background: var(--accent-dim) !important; color: var(--accent); }
.pl-week .fri i { position: absolute; left: 50%; bottom: -9px; transform: translateX(-50%); padding: 1px 6px; border-radius: 999px; background: var(--accent); color: #06231e; font-size: 8.5px; font-weight: 700; }
.pl-cd .due { display: inline-grid; font-size: 34px; font-weight: 700; line-height: 1.1; }
.pl-cd .due > i { grid-area: 1 / 1; }
.pl-cd .due .a { color: var(--yellow); opacity: 0; }
.pl-cd .due .c { color: var(--green); }
.pl-cd em { font-style: normal; font-size: 11px; color: var(--text); }
.pl-free { align-items: flex-start; }
.pl-free > span:not(.hs-chip):not(.tx) { font-size: 13px; color: var(--text); }
.pl-file .lines { display: flex; flex-direction: column; gap: 5px; padding: 12px; border-radius: 8px; border: 1px solid var(--border); background: var(--surface); font-family: ui-monospace, Consolas, monospace; font-size: 10.5px; color: var(--text); white-space: nowrap; }
.pl-no span { display: grid; grid-template-columns: 22px 1fr auto; gap: 10px; align-items: center; padding: 9px 12px; border-radius: 8px; border: 1px solid var(--border); background: var(--surface); font-size: 12px; color: var(--text); }
.pl-no i { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: rgba(244,63,94,0.12); color: var(--red); font-size: 10px; }
.pl-no em { font-style: normal; font-size: 10.5px; color: var(--finto-2); }
.pl-orb { align-items: center; text-align: center; }
.pl-orb .orb { width: 56px; height: 56px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 1px rgba(77,171,154,0.4), 0 0 30px 6px rgba(77,171,154,0.3); }
.pl-orb b { font-size: 13px; color: var(--text); }
.pl-orb em { font-style: normal; font-size: 11px; }
.pl-dup .x { opacity: 0.45; }
.pl-dup .x b { text-decoration: line-through; }
.pl-match .nota { border-style: dashed; border-color: rgba(77,171,154,0.45); background: rgba(77,171,154,0.06); }
.pl-match .hs-card b { font-size: 12px; color: var(--text); }
.pl-match .win { display: flex; justify-content: space-between; }
.pl-re { align-items: flex-start; }
.pl-re .bar { width: 100%; }
.js .vg .vg-f1 { animation: vgF1 9s var(--ease-out) infinite; }
.js .vg .vg-f2 { animation: vgF2 9s var(--ease-out) infinite; }
.js .vg .vg-f3 { animation: vgF3 9s var(--ease-out) infinite; }
.js .vg .vg-solo1 { animation: vgSolo 9s var(--ease-out) infinite; }
@keyframes vgF1   { 0%, 1.5% { opacity: 0; transform: translateY(8px); } 5%, 95%  { opacity: 1; transform: none; } 99%, 100% { opacity: 0; transform: none; } }
@keyframes vgF2   { 0%, 33%  { opacity: 0; transform: translateY(8px); } 37%, 95% { opacity: 1; transform: none; } 99%, 100% { opacity: 0; transform: none; } }
@keyframes vgF3   { 0%, 63%  { opacity: 0; transform: translateY(8px); } 67%, 95% { opacity: 1; transform: none; } 99%, 100% { opacity: 0; transform: none; } }
@keyframes vgSolo { 0%, 1.5% { opacity: 0; transform: translateY(8px); } 5%, 31%  { opacity: 1; transform: none; } 35%, 100% { opacity: 0; transform: none; } }
.js .vg .vg-f1.vg-csv { animation: vgDim 9s var(--ease-out) infinite; }
@keyframes vgDim { 0%, 1.5% { opacity: 0; transform: translateY(8px); } 5%, 32% { opacity: 1; transform: none; } 37%, 95% { opacity: 0.4; transform: none; } 99%, 100% { opacity: 0; } }
.js .vg .vg-tr.sel .ck { animation: vgCk 9s steps(1, end) infinite; }
@keyframes vgCk { 0% { background: transparent; border-color: var(--border-med); } 65% { background: var(--accent); border-color: var(--accent); } 99% { background: transparent; border-color: var(--border-med); } }
.js .vg .vg-cr.uno { animation: vgUno 9s var(--ease) infinite; }
@keyframes vgUno { 0%, 33% { border-color: var(--border); background: var(--surface); } 37%, 95% { border-color: rgba(234,179,8,0.45); background: rgba(234,179,8,0.08); } 99%, 100% { border-color: var(--border); background: var(--surface); } }
.js .vg .vg-cb i, .js .vg .vg-out i { animation: vgW3 9s var(--ease-out) infinite; }
@keyframes vgW3 { 0%, 64% { width: 0; } 76%, 100% { width: var(--w); } }
.js .vg .vg-lc i, .js .vg .vg-solo1 .vg-nb i { animation: vgW1 9s var(--ease-out) infinite; }
@keyframes vgW1 { 0%, 2% { width: 0; } 14%, 100% { width: var(--w); } }
.js .vg .vg-f2 .vg-nb i { animation: vgW2 9s var(--ease-out) infinite; }
@keyframes vgW2 { 0%, 34% { width: 0; } 46%, 100% { width: var(--w); } }
.js .vg .vg-btn { animation: vgPress 9s var(--ease) infinite; }
@keyframes vgPress { 0%, 11% { transform: none; filter: none; } 13% { transform: scale(0.93); filter: brightness(1.2); } 16%, 100% { transform: none; filter: none; } }
.js .vg .vg-typed p span:nth-child(1) { animation: vgL1 9s linear infinite; }
.js .vg .vg-typed p span:nth-child(2) { animation: vgL2 9s linear infinite; }
.js .vg .vg-typed p span:nth-child(3) { animation: vgL3 9s linear infinite; }
.js .vg .vg-typed p span:nth-child(4) { animation: vgL4 9s linear infinite; }
@keyframes vgL1 { 0%, 36% { clip-path: inset(0 100% 0 0); } 43%, 100% { clip-path: inset(0 0 0 0); } }
@keyframes vgL2 { 0%, 43% { clip-path: inset(0 100% 0 0); } 50%, 100% { clip-path: inset(0 0 0 0); } }
@keyframes vgL3 { 0%, 50% { clip-path: inset(0 100% 0 0); } 57%, 100% { clip-path: inset(0 0 0 0); } }
@keyframes vgL4 { 0%, 57% { clip-path: inset(0 100% 0 0); } 64%, 100% { clip-path: inset(0 0 0 0); } }
.js .vg .vg-eq .rule, .js .vg .vg-fan path:not(.lin) { stroke-dasharray: 1; animation: vgDraw2 9s var(--ease-out) infinite; }
@keyframes vgDraw2 { 0%, 34% { stroke-dashoffset: 1; } 48%, 100% { stroke-dashoffset: 0; } }
.js .vg .vg-pos .px { stroke-dasharray: 1; animation: vgDraw3 9s var(--ease-out) infinite; }
@keyframes vgDraw3 { 0%, 64% { stroke-dashoffset: 1; } 78%, 100% { stroke-dashoffset: 0; } }
.js .vg .vg-sw .c1 { animation: vgSw1 9s var(--ease) infinite; }
.js .vg .vg-sw .c2 { animation: vgSw2 9s var(--ease) infinite; }
@keyframes vgSw1 { 0%, 32% { background: var(--accent-dim); color: var(--accent); } 34%, 100% { background: transparent; color: var(--finto-2); } }
@keyframes vgSw2 { 0%, 32% { background: transparent; color: var(--finto-2); } 34%, 100% { background: var(--accent-dim); color: var(--accent); } }
.js .vg .vg-sel .a { animation: vgSelA 9s steps(1, end) infinite; }
.js .vg .vg-sel .c { animation: vgSelC 9s steps(1, end) infinite; }
.js .vg .vg-nl { animation: vgSelA 9s steps(1, end) infinite; }
@keyframes vgSelA { 0% { opacity: 1; } 36% { opacity: 0; } 99% { opacity: 1; } }
@keyframes vgSelC { 0% { opacity: 0; } 36% { opacity: 1; } 99% { opacity: 0; } }
.js .pl-4 { --T: 12s; }
.js .pl-6 { --T: 18s; }
.js .pl-6 .pl-st      { animation: plSt6 18s var(--ease) infinite backwards; animation-delay: calc(var(--k) * 3s); }
.js .pl-4 .pl-st      { animation: plSt4 12s var(--ease) infinite backwards; animation-delay: calc(var(--k) * 3s); }
.js .pl-6 .pl-r       { animation: plRow6 18s var(--ease) infinite backwards; animation-delay: calc(var(--k) * 3s); }
.js .pl-4 .pl-r       { animation: plRow4 12s var(--ease) infinite backwards; animation-delay: calc(var(--k) * 3s); }
.js .pl-6 .pl-r::after { animation: plBar6 18s linear infinite backwards; animation-delay: calc(var(--k) * 3s); }
.js .pl-4 .pl-r::after { animation: plBar4 12s linear infinite backwards; animation-delay: calc(var(--k) * 3s); }
.js .pl-6 .pl-dots i  { animation: plDot6 18s var(--ease) infinite backwards; animation-delay: calc(var(--k) * 3s); }
.js .pl-4 .pl-dots i  { animation: plDot4 12s var(--ease) infinite backwards; animation-delay: calc(var(--k) * 3s); }
@keyframes plSt6  { 0% { opacity: 0; transform: translateY(10px); } 2%, 15.5% { opacity: 1; transform: none; } 16.6%, 100% { opacity: 0; transform: none; } }
@keyframes plSt4  { 0% { opacity: 0; transform: translateY(10px); } 3%, 23.5% { opacity: 1; transform: none; } 25%, 100% { opacity: 0; transform: none; } }
@keyframes plRow6 { 0% { background: transparent; border-color: transparent; } 1.5%, 15.8% { background: var(--surface); border-color: var(--border-med); } 16.6%, 100% { background: transparent; border-color: transparent; } }
@keyframes plRow4 { 0% { background: transparent; border-color: transparent; } 2%, 24% { background: var(--surface); border-color: var(--border-med); } 25%, 100% { background: transparent; border-color: transparent; } }
@keyframes plBar6 { 0% { transform: scaleX(0); opacity: 1; } 16.5% { transform: scaleX(1); opacity: 1; } 16.6%, 100% { transform: scaleX(0); opacity: 0; } }
@keyframes plBar4 { 0% { transform: scaleX(0); opacity: 1; } 24.9% { transform: scaleX(1); opacity: 1; } 25%, 100% { transform: scaleX(0); opacity: 0; } }
@keyframes plDot6 { 0% { width: 6px; background: var(--surface3); } 1.5%, 15.8% { width: 18px; background: var(--accent); } 16.6%, 100% { width: 6px; background: var(--surface3); } }
@keyframes plDot4 { 0% { width: 6px; background: var(--surface3); } 2%, 24% { width: 18px; background: var(--accent); } 25%, 100% { width: 6px; background: var(--surface3); } }
.js .pl-6 .pl-p  { animation: plIn6 18s var(--ease-out) infinite backwards; animation-delay: calc(var(--k) * 3s + 0.5s); }
.js .pl-6 .pl-p2 { animation: plIn6 18s var(--ease-out) infinite backwards; animation-delay: calc(var(--k) * 3s + 1s); }
.js .pl-6 .pl-p3 { animation: plIn6 18s var(--ease-out) infinite backwards; animation-delay: calc(var(--k) * 3s + 1.5s); }
.js .pl-4 .pl-p  { animation: plIn4 12s var(--ease-out) infinite backwards; animation-delay: calc(var(--k) * 3s + 0.5s); }
.js .pl-4 .pl-p2 { animation: plIn4 12s var(--ease-out) infinite backwards; animation-delay: calc(var(--k) * 3s + 1s); }
.js .pl-4 .pl-p3 { animation: plIn4 12s var(--ease-out) infinite backwards; animation-delay: calc(var(--k) * 3s + 1.5s); }
@keyframes plIn6 { 0% { opacity: 0; transform: translateY(6px); } 3%, 15% { opacity: 1; transform: none; } 16.6%, 100% { opacity: 0; transform: none; } }
@keyframes plIn4 { 0% { opacity: 0; transform: translateY(6px); } 4%, 22% { opacity: 1; transform: none; } 25%, 100% { opacity: 0; transform: none; } }
.js .plc .pl-bars i { animation: plH var(--T) var(--ease-out) infinite; animation-delay: calc(var(--k) * 3s); }
@keyframes plH { 0% { height: 0; } 8%, 100% { height: var(--h); } }
.js .plc .pl-rank i, .js .plc .pl-prog .bar > i, .js .plc .pl-re .bar > i { animation: plW var(--T) var(--ease-out) infinite; animation-delay: calc(var(--k) * 3s); }
@keyframes plW { 0% { width: 0; } 9%, 100% { width: var(--w); } }
.js .plc .vg-eq .rule, .js .plc .pl-bands .nc { stroke-dasharray: 1; animation: plD var(--T) var(--ease-out) infinite; animation-delay: calc(var(--k) * 3s); }
@keyframes plD { 0% { stroke-dashoffset: 1; } 10%, 100% { stroke-dashoffset: 0; } }
.js .plc .pl-write .inp i { animation: plType var(--T) linear infinite; animation-delay: calc(var(--k) * 3s); }
@keyframes plType { 0%, 1% { clip-path: inset(0 100% 0 0); animation-timing-function: steps(38, end); } 9%, 100% { clip-path: inset(0 0 0 0); } }
.js .plc .pl-dd .hwm   { animation: plHwm var(--T) var(--ease) infinite; animation-delay: calc(var(--k) * 3s); }
.js .plc .pl-dd .floor { animation: plFloor var(--T) var(--ease) infinite; animation-delay: calc(var(--k) * 3s); }
@keyframes plHwm   { 0%, 1% { left: 34%; } 8%, 100% { left: 64%; } }
@keyframes plFloor { 0%, 2% { left: 10%; } 9%, 100% { left: 40%; } }
.js .plc .pl-cd .due .a { animation: plCdA var(--T) steps(1, end) infinite; animation-delay: calc(var(--k) * 3s); }
.js .plc .pl-cd .due .c { animation: plCdC var(--T) steps(1, end) infinite; animation-delay: calc(var(--k) * 3s); }
@keyframes plCdA { 0% { opacity: 1; } 9% { opacity: 0; } }
@keyframes plCdC { 0% { opacity: 0; } 9% { opacity: 1; } }
.js .plc .pl-orb .orb { animation: plOrb 1.6s var(--ease) infinite; }
@keyframes plOrb { 0%, 100% { box-shadow: 0 0 0 1px rgba(77,171,154,0.4), 0 0 18px 3px rgba(77,171,154,0.25); } 50% { box-shadow: 0 0 0 10px rgba(77,171,154,0.08), 0 0 36px 8px rgba(77,171,154,0.4); } }
@media (prefers-reduced-motion: reduce) {
  .js .vg *, .js .plc *, .js .plc *::after { animation: none !important; }
}
@media (max-width: 1000px) {
  .plc { grid-template-columns: 1fr; }
  .pl-win { order: -1; max-width: 440px; margin: 0 auto; }
}
@media (max-width: 470px) { .vg, .pl-win { zoom: 0.84; } }
@media (max-width: 374px) { .vg, .pl-win { zoom: 0.74; } }
@media (min-width: 1001px) and (max-height: 720px) {
  .pl-r { padding: 8px 12px; }
  .pl-r p { font-size: 12.5px; line-height: 1.45; }
  .pl-stage { height: 250px; }
}
@media (max-width: 374px) { .pl-week .days { gap: 3px; } }
.fx-split-a p + .fx-list { margin-top: 18px; }
.pl-streak .dots { gap: 5px; }
.pl-streak .dots i { width: 16px; height: 16px; }
.fx-facts {
  gap: 12px; background: none; border: 0; overflow: visible;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.fx-fact {
  position: relative; overflow: hidden;
  padding: 24px 22px 22px; border: 1px solid var(--border); border-radius: var(--radius);
  background: linear-gradient(160deg, var(--fx-dim), var(--surface) 55%);
}
.fx-fact::before {
  content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 2px;
  background: var(--fx); transform-origin: left;
}
.js .fx-fact::before { transform: scaleX(0); transition: transform 1.1s var(--ease-out); }
.js .fx-facts.in .fx-fact::before { transform: scaleX(1); }
.js .fx-facts.in .fx-fact:nth-child(2)::before { transition-delay: 0.15s; }
.js .fx-facts.in .fx-fact:nth-child(3)::before { transition-delay: 0.3s; }
.js .fx-facts.in .fx-fact:nth-child(4)::before { transition-delay: 0.45s; }
.fx-fact span { margin-bottom: 12px; }
.fx-fact b { display: block; font-size: clamp(19px, calc(1.9 * var(--vu)), 25px); line-height: 1.2; }
.fx-fact em { margin-top: 8px; font-size: 13px; line-height: 1.45; }
@media (prefers-reduced-motion: reduce) { .js .fx-fact::before { transform: none; transition: none; } }
@media (prefers-reduced-motion: reduce) {
  .js .fx-split .fx-lk-row .bar i { width: var(--w); animation: none; }
}
.fx-main h1, .fx-main h2, .fx-main h3 { text-wrap: balance; }
.fx-card p a { color: var(--accent); white-space: nowrap; }
.fx-card p a:hover { text-decoration: underline; text-underline-offset: 3px; }
.fx-list li a { color: var(--accent); white-space: nowrap; }
.fx-list li a:hover { text-decoration: underline; text-underline-offset: 3px; }
.js.da-fuori .intro { display: none; }