/* Stile B · «Vape shop moderno» — scuro, neon viola/ciano, caratteri larghi.
   Si attiva con <html data-stile="vape">. */

:root[data-stile="vape"]{
  color-scheme:dark;
  --bg:#07060d;
  --bg-fx:
    radial-gradient(ellipse 60% 45% at 8% 0%,rgba(168,85,247,.22),transparent 70%),
    radial-gradient(ellipse 50% 40% at 100% 18%,rgba(34,211,238,.16),transparent 70%),
    radial-gradient(ellipse 60% 40% at 50% 110%,rgba(168,85,247,.14),transparent 70%);
  --surface:#110f1c;
  --surface-2:#0c0a15;
  --ink:#f4f1ff;
  --muted:#a59fc0;
  --faint:#6d6789;
  --line:rgba(167,139,250,.14);
  --line-strong:rgba(167,139,250,.28);
  --accent:#c084fc;
  --accent-ink:#12051f;
  --accent-soft:rgba(192,132,252,.14);
  --accent-2:#22d3ee;
  --danger:#fb5f8a;
  --danger-soft:rgba(251,95,138,.12);
  --riga-alterna:rgba(255,255,255,.015);

  --font-title:"Unbounded","Inter",ui-sans-serif,system-ui,sans-serif;
  --font-body:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,Consolas,monospace;
  --title-weight:700;
  --title-case:none;
  --title-track:-.02em;
  --brand-case:uppercase;
  --brand-track:.04em;
  --em-style:normal;

  --radius:18px;
  --radius-sm:12px;
  --radius-btn:999px;
  --shadow:0 20px 50px -30px rgba(0,0,0,.9);

  --topbar-bg:rgba(7,6,13,.78);
  --topbar-ink:#f4f1ff;
  --topbar-muted:#a59fc0;
  --topbar-hover:rgba(192,132,252,.10);
  --topbar-line:1px solid rgba(167,139,250,.18);
  --footer-bg:rgba(7,6,13,.6);

  --btn-bg:linear-gradient(110deg,#a855f7,#22d3ee);
  --btn-ink:#0b0614;
  --btn-border:0;
  --btn-shadow:0 0 0 1px rgba(255,255,255,.08) inset,0 10px 30px -10px rgba(168,85,247,.7),0 6px 24px -12px rgba(34,211,238,.6);
  --btn-track:.02em;
  --btn-case:none;
  --ghost-bg:rgba(255,255,255,.03);
  --ghost-hover:rgba(192,132,252,.10);

  --card-bg:linear-gradient(180deg,rgba(23,19,38,.92),rgba(14,12,24,.92));
  --card-border:1px solid var(--line);

  --receipt-bg:#05040a;
  --receipt-ink:#7ff0ff;
  --receipt-border:1px solid rgba(34,211,238,.28);

  --marchio-fondo:#12051f;
  --marchio-filetto:#a855f7;
  --marchio-segno:#7ff0ff;
  --marchio-brace:#c084fc;
}

/* Bordo neon sfumato sulle schede, alone sotto l'insegna */
[data-stile="vape"] .card{border:1px solid transparent;
  background:linear-gradient(180deg,rgba(23,19,38,.96),rgba(12,10,21,.96)) padding-box,
             linear-gradient(140deg,rgba(168,85,247,.45),rgba(167,139,250,.08) 45%,rgba(34,211,238,.35)) border-box}
[data-stile="vape"] .hero-card{background:radial-gradient(circle at 50% 30%,rgba(168,85,247,.25),transparent 60%) padding-box,
  linear-gradient(180deg,#141024,#0a0812) padding-box,linear-gradient(140deg,#a855f7,rgba(255,255,255,.05) 50%,#22d3ee) border-box}
[data-stile="vape"] .hero-card .marchio{filter:drop-shadow(0 0 22px rgba(168,85,247,.55)) drop-shadow(0 0 8px rgba(34,211,238,.4))}
[data-stile="vape"] .brand .marchio{filter:drop-shadow(0 0 8px rgba(168,85,247,.5))}
[data-stile="vape"] .hero h1{font-size:clamp(2.1rem,4.8vw,4rem)}
[data-stile="vape"] .hero h1 em{background:linear-gradient(100deg,#c084fc,#22d3ee);-webkit-background-clip:text;background-clip:text;color:transparent}
[data-stile="vape"] .eyebrow{color:var(--accent-2)}
[data-stile="vape"] .eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent-2);box-shadow:0 0 10px var(--accent-2)}
[data-stile="vape"] .servizio-icona,
[data-stile="vape"] .kpi-icona{color:#e9d5ff;background:linear-gradient(140deg,rgba(168,85,247,.35),rgba(34,211,238,.18));box-shadow:0 0 18px -6px rgba(168,85,247,.8)}
[data-stile="vape"] .servizio.warning .servizio-icona,
[data-stile="vape"] .kpi.allarme .kpi-icona{color:var(--danger);background:var(--danger-soft);box-shadow:0 0 18px -6px rgba(251,95,138,.8)}
[data-stile="vape"] .kpi.allarme{background:linear-gradient(180deg,rgba(40,14,26,.96),rgba(18,10,16,.96)) padding-box,linear-gradient(140deg,#fb5f8a,rgba(251,95,138,.15)) border-box}
[data-stile="vape"] .btn{position:relative}
[data-stile="vape"] .btn.ghost{background:rgba(255,255,255,.03);border:1px solid var(--line-strong)}
[data-stile="vape"] .result{box-shadow:0 0 24px -12px rgba(34,211,238,.5) inset;text-shadow:0 0 8px rgba(34,211,238,.35)}
[data-stile="vape"] th{background:rgba(168,85,247,.07)}
[data-stile="vape"] input:focus,
[data-stile="vape"] select:focus{border-color:var(--accent-2);box-shadow:0 0 0 3px rgba(34,211,238,.15),0 0 18px -6px rgba(34,211,238,.6)}
[data-stile="vape"] .stile-switch button[aria-pressed="true"]{background:linear-gradient(110deg,#a855f7,#22d3ee);color:#0b0614}