/* Waves Studio: demos vivas. Marcos en negro tinta o blanco, acento solo cian hielo. Sin lilas. */
@font-face{font-family:Manrope;font-weight:400;font-display:swap;src:url(fonts/manrope-400.woff2) format("woff2")}
@font-face{font-family:Manrope;font-weight:500;font-display:swap;src:url(fonts/manrope-500.woff2) format("woff2")}
@font-face{font-family:Manrope;font-weight:600;font-display:swap;src:url(fonts/manrope-600.woff2) format("woff2")}
@font-face{font-family:Manrope;font-weight:700;font-display:swap;src:url(fonts/manrope-700.woff2) format("woff2")}

/* Marco: .wv-frame con data-tone="ink" (por defecto) o "white". Se pone en el contenedor de la demo. */
.wv-frame{--wv-ink:#0A0B10;--wv-paper:#fff;--wv-ice:#A3EFF4;--wv-ice-d:#2B9DA6;
  position:relative;border-radius:18px;overflow:hidden;font-family:Manrope,system-ui,sans-serif;font-size:14px;line-height:1.5;
  background:var(--wv-ink);color:#EEF1F6;border:1px solid rgba(255,255,255,.08);box-shadow:0 30px 80px -30px rgba(10,11,16,.55)}
.wv-frame[data-tone=white]{background:var(--wv-paper);color:var(--wv-ink);border-color:rgba(10,11,16,.1);box-shadow:0 30px 80px -34px rgba(10,11,16,.28)}

/* Para las demos ya hechas (sector con --ac/--g1/--g2): pisa el color por sector con tinta y cian hielo */
.wv-skin{--ac:#A3EFF4;--g1:#A3EFF4;--g2:#A3EFF4}

/* Número que respira: un leve brillo mientras cuenta */
.wv-pulse{color:var(--wv-ice);transition:color .6s ease}
.wv-frame[data-tone=white] .wv-pulse{color:var(--wv-ice-d)}

/* El cursor fantasma lleva su propio estilo dentro de vivas.js (así también funciona dentro de un shadow root) */