/* =====================================================================
   AUDIOSTAFF · cristal líquido — entrada + portal (2026-11-07)
   Versión 1.1.0 · sólo presentación.

   Presupuesto de rendimiento (2026-11-07): como máximo CUATRO superficies con
   backdrop-filter por vista (cabecera, filtros, barra de carrito y tarjeta de
   entrada), sin animaciones infinitas y sin blur en piezas repetidas por fila
   (botones "Añadir", badges, chips de marca, pills). El vidrio se sostiene con
   gradiente + canto + brillo interior, que no cuestan GPU por frame.

   Qué hace: sube el material de las superficies existentes (vidrio ahumado,
   canto luminoso, reflejo, luz de fondo). No cambia layout, medidas, columnas,
   contenido, precios ni comportamiento.

   Por qué los selectores repiten #as-home-compact-root tres veces: el portal
   ya define estas piezas con 8 :root + !important (body.as-dealer-fast ...).
   Sin esa especificidad la capa pierde y no se ve nada.

   Rollback: borrar este archivo y la clase del enqueue; no hay estado en base.
   ===================================================================== */

/* ---------- 1. Tokens ---------- */
:root {
  --lg-blur: 30px;
  --lg-sat: 175%;
  --lg-ease: cubic-bezier(.2, .7, .2, 1);
  --lg-rim: rgba(255, 255, 255, .17);
  --lg-rim-strong: rgba(255, 255, 255, .38);
  --lg-hi: rgba(255, 255, 255, .24);
  --lg-shadow: 0 34px 80px -34px rgba(0, 0, 0, .9);
  --lg-ink: #f6f7fb;
  --lg-ink-soft: rgba(246, 247, 251, .74);
  --lg-accent: #c9b4ff;
}
html[data-as-appearance="light"] {
  --lg-rim: rgba(255, 255, 255, .9);
  --lg-rim-strong: rgba(255, 255, 255, 1);
  --lg-hi: rgba(255, 255, 255, .98);
  --lg-shadow: 0 28px 64px -34px rgba(28, 29, 48, .45);
  --lg-ink: #15161d;
  --lg-ink-soft: rgba(21, 22, 29, .66);
  --lg-accent: #6d4bd8;
}

/* ---------- 2. Ambiente: la luz que el vidrio refracta ---------- */
body::before {
  content: "";
  position: fixed;
  inset: -10vmax;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(38vmax 32vmax at 12% 2%, rgba(133, 96, 235, .55), transparent 62%),
    radial-gradient(34vmax 30vmax at 88% 10%, rgba(84, 186, 230, .38), transparent 64%),
    radial-gradient(46vmax 40vmax at 48% 106%, rgba(212, 138, 255, .26), transparent 66%);
}
html[data-as-appearance="light"] body::before {
  background:
    radial-gradient(38vmax 32vmax at 10% -2%, rgba(158, 128, 244, .38), transparent 60%),
    radial-gradient(34vmax 30vmax at 92% 6%, rgba(120, 200, 232, .34), transparent 62%),
    radial-gradient(50vmax 40vmax at 50% 110%, rgba(255, 196, 232, .38), transparent 66%);
}

/* ---------- 3. Cabecera ---------- */
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-header {
  background:
    radial-gradient(90% 140% at 4% -10%, rgba(158, 120, 245, .26), transparent 58%),
    radial-gradient(70% 120% at 100% 120%, rgba(96, 186, 226, .16), transparent 60%),
    radial-gradient(130% 120% at 0% 0%, rgba(255, 255, 255, .15), transparent 46%),
    linear-gradient(158deg, rgba(255, 255, 255, .085), rgba(255, 255, 255, .022) 58%, rgba(255, 255, 255, .05)) !important;
  border: 1px solid var(--lg-rim) !important;
  border-radius: 24px !important;
  box-shadow: inset 0 1px 0 var(--lg-hi), inset 0 -1px 0 rgba(0, 0, 0, .3), var(--lg-shadow) !important;
  backdrop-filter: blur(20px) saturate(165%) brightness(1.12) !important;
  -webkit-backdrop-filter: blur(20px) saturate(165%) brightness(1.12) !important;
  overflow: hidden;
  position: relative;
  isolation: isolate;
}
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-header::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: -1;
  background:
    linear-gradient(104deg, transparent 4%, rgba(255, 255, 255, .16) 18%, transparent 32%),
    radial-gradient(90% 60% at 50% -10%, rgba(255, 255, 255, .10), transparent 70%);
}
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-header h1 {
  letter-spacing: -.02em !important;
  font-weight: 640 !important;
  color: var(--lg-ink) !important;
}

/* ---------- 4. Chips de marca ---------- */
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root #as-prominent-brand-filters button.as-b2b-brand {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(158deg, rgba(255, 255, 255, .115), rgba(255, 255, 255, .028) 58%, rgba(255, 255, 255, .06)) !important;
  border: 1px solid rgba(255, 255, 255, .22) !important;
  border-radius: 16px !important;
  box-shadow: inset 0 1px 0 var(--lg-hi), 0 14px 30px -24px rgba(0, 0, 0, .9) !important;
  transition: transform .3s var(--lg-ease), box-shadow .3s var(--lg-ease), border-color .3s var(--lg-ease);
}
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root #as-prominent-brand-filters button.as-b2b-brand::after {
  content: "";
  position: absolute;
  inset: -40% -10%;
  pointer-events: none;
  background: linear-gradient(115deg, transparent 40%, rgba(255, 255, 255, .22) 50%, transparent 60%);
  transform: translateX(-75%);
  transition: transform .75s var(--lg-ease);
  opacity: 0;
  z-index: 2;
}
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root #as-prominent-brand-filters button.as-b2b-brand:hover {
  transform: translateY(-2px);
  border-color: var(--lg-rim-strong) !important;
  box-shadow: inset 0 1px 0 var(--lg-hi), 0 24px 44px -26px rgba(0, 0, 0, .95) !important;
}
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root #as-prominent-brand-filters button.as-b2b-brand:hover::after {
  transform: translateX(75%);
  opacity: .85;
}
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root #as-prominent-brand-filters button.as-b2b-brand.active {
  background:
    linear-gradient(158deg, rgba(255, 255, 255, .30), rgba(255, 255, 255, .09) 62%, rgba(255, 255, 255, .16)) !important;
  border-color: rgba(255, 255, 255, .52) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .6), 0 20px 46px -26px rgba(0, 0, 0, .95), 0 0 0 1px rgba(255, 255, 255, .10) !important;
}

/* ---------- 5. Pills de navegación ---------- */
html:not([data-as-appearance="light"]) body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-header-actions > a,
html:not([data-as-appearance="light"]) body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-header-actions > button,
html:not([data-as-appearance="light"]) body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-header-actions > details > summary {
  background: linear-gradient(158deg, rgba(255, 255, 255, .11), rgba(255, 255, 255, .022)) !important;
  border: 1px solid var(--lg-rim) !important;
  border-radius: 14px !important;
  box-shadow: inset 0 1px 0 var(--lg-hi) !important;
  color: var(--lg-ink) !important;
  transition: transform .22s var(--lg-ease), border-color .22s var(--lg-ease), box-shadow .22s var(--lg-ease);
}
html:not([data-as-appearance="light"]) body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-header-actions > a:hover,
html:not([data-as-appearance="light"]) body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-header-actions > button:hover,
html:not([data-as-appearance="light"]) body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-header-actions > details > summary:hover {
  transform: translateY(-1px);
  border-color: var(--lg-rim-strong) !important;
  box-shadow: inset 0 1px 0 var(--lg-hi), 0 16px 30px -22px rgba(0, 0, 0, .95) !important;
}
html:not([data-as-appearance="light"]) body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-dash-switch > button.active {
  background: linear-gradient(158deg, rgba(255, 255, 255, .97), rgba(234, 236, 255, .84)) !important;
  color: #101018 !important;
  border-color: rgba(255, 255, 255, .95) !important;
  box-shadow: inset 0 1px 0 #fff, 0 18px 38px -24px rgba(0, 0, 0, .9), 0 0 26px -8px rgba(201, 180, 255, .7) !important;
}
html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-dash-switch > button.active {
  background: linear-gradient(158deg, #1b1c26, #2d3042) !important;
  color: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .24), 0 18px 36px -24px rgba(20, 21, 30, .7) !important;
}

/* ---------- 6. Cómo trabajamos + acciones rápidas ---------- */
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root #as-hww-section .as-hww-mini,
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root #as-dealer-commandbar {
  background: linear-gradient(118deg, rgba(255, 255, 255, .10), rgba(255, 255, 255, .022) 55%, rgba(255, 255, 255, .055)) !important;
  border: 1px solid var(--lg-rim) !important;
  border-radius: 20px !important;
  box-shadow: inset 0 1px 0 var(--lg-hi), 0 24px 54px -36px rgba(0, 0, 0, .95) !important;
}

/* ---------- 7. Filtros ---------- */
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-filters {
  background:
    radial-gradient(70% 120% at 50% -20%, rgba(255, 255, 255, .12), transparent 60%),
    linear-gradient(158deg, rgba(255, 255, 255, .11), rgba(255, 255, 255, .028) 60%, rgba(255, 255, 255, .06)) !important;
  border: 1px solid var(--lg-rim) !important;
  border-radius: 22px !important;
  box-shadow: inset 0 1px 0 var(--lg-hi), var(--lg-shadow) !important;
  backdrop-filter: blur(18px) saturate(170%) brightness(1.10) !important;
  -webkit-backdrop-filter: blur(18px) saturate(170%) brightness(1.10) !important;
}
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-filters input,
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-filters select {
  background: rgba(0, 0, 0, .30) !important;
  border: 1px solid rgba(255, 255, 255, .13) !important;
  border-radius: 12px !important;
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, .38) !important;
  color: var(--lg-ink) !important;
}
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-filters input:focus,
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-filters select:focus {
  outline: none !important;
  border-color: rgba(201, 180, 255, .65) !important;
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, .38), 0 0 0 3px rgba(201, 180, 255, .20) !important;
}

/* ---------- 8. Tabla ---------- */
/* La losa de la tabla (1322x2975) es la superficie más cara de pintar: el blur
   de la base se apaga y el vidrio se resuelve con gradiente + canto. */
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-table-wrap {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-table,
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-table tbody,
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-table tr {
  background: transparent !important;
  background-color: transparent !important;
}
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-table-wrap {
  background:
    radial-gradient(60% 40% at 0% 0%, rgba(150, 112, 240, .14), transparent 62%),
    radial-gradient(50% 34% at 100% 0%, rgba(92, 182, 224, .10), transparent 64%),
    linear-gradient(180deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .06) 22%, rgba(255, 255, 255, .04)) !important;
  border: 1px solid var(--lg-rim) !important;
  border-radius: 24px !important;
  box-shadow: inset 0 1px 0 var(--lg-hi), var(--lg-shadow) !important;
  overflow: hidden;
}
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-table thead th {
  background: linear-gradient(180deg, rgba(255, 255, 255, .10), rgba(255, 255, 255, .035)) !important;
  border-bottom: 1px solid var(--lg-rim) !important;
  color: var(--lg-ink-soft) !important;
  font-weight: 600 !important;
}
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root tr.as-pl-v3-row {
  transition: background .2s var(--lg-ease), box-shadow .2s var(--lg-ease);
}
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root tr.as-pl-v3-row:hover {
  background: linear-gradient(90deg, rgba(255, 255, 255, .075), rgba(255, 255, 255, .022)) !important;
  box-shadow: inset 2px 0 0 rgba(201, 180, 255, .75);
}
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root tr.as-pl-v3-row td {
  border-bottom: 1px solid rgba(255, 255, 255, .055) !important;
}
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-thumb {
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .05) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14), 0 10px 20px -14px rgba(0, 0, 0, .95) !important;
}

/* precio / ganancia */
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-oi-unit .woocommerce-Price-amount {
  font-variant-numeric: tabular-nums;
  letter-spacing: -.02em;
}
/* añadir */
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-add {
  background: linear-gradient(158deg, rgba(255, 255, 255, .17), rgba(255, 255, 255, .06)) !important;
  border: 1px solid var(--lg-rim-strong) !important;
  border-radius: 12px !important;
  box-shadow: inset 0 1px 0 var(--lg-hi), 0 12px 24px -18px rgba(0, 0, 0, .9) !important;
  color: var(--lg-ink) !important;
  transition: transform .2s var(--lg-ease), box-shadow .2s var(--lg-ease), background .2s var(--lg-ease);
}
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-add:hover {
  transform: translateY(-1px);
  background: linear-gradient(158deg, rgba(255, 255, 255, .28), rgba(255, 255, 255, .10)) !important;
  box-shadow: inset 0 1px 0 var(--lg-hi), 0 18px 32px -20px rgba(0, 0, 0, .95), 0 0 20px -6px rgba(201, 180, 255, .55) !important;
}
html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-add {
  background: linear-gradient(158deg, #1d1e2a, #34374c) !important;
  color: #fff !important;
  border-color: rgba(20, 21, 30, .5) !important;
}

/* ---------- 9. Command bar ---------- */
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-cb-btn {
  background: linear-gradient(158deg, rgba(255, 255, 255, .15), rgba(255, 255, 255, .05)) !important;
  border: 1px solid var(--lg-rim) !important;
  border-radius: 13px !important;
  box-shadow: inset 0 1px 0 var(--lg-hi) !important;
  color: var(--lg-ink) !important;
}
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-cb-btn--primary {
  background: linear-gradient(158deg, #efe9ff, #c9b4ff 68%, #b79cf7) !important;
  color: #17121f !important;
  border-color: rgba(255, 255, 255, .72) !important;
  box-shadow: inset 0 1px 0 #fff, 0 14px 32px -16px rgba(183, 156, 247, .85) !important;
}

/* ---------- 10. Utilidades flotantes ---------- */
html:not([data-as-appearance="light"]) body #as-home-compact-root#as-home-compact-root#as-home-compact-root #as-portal-utilities > * > *,
html:not([data-as-appearance="light"]) body #as-home-compact-root#as-home-compact-root#as-home-compact-root #as-portal-utilities > * {
  --lg-u: 1;
}
html:not([data-as-appearance="light"]) body #as-home-compact-root#as-home-compact-root#as-home-compact-root #as-portal-utilities :is(.as-i18n-switcher, #as-display-mode-control, #as-tour-header-launch, #as-studio-motion, .as-nc-bell, .asdc-portal-entry) {
  background: linear-gradient(158deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .03)) !important;
  border: 1px solid var(--lg-rim) !important;
  border-radius: 14px !important;
  box-shadow: inset 0 1px 0 var(--lg-hi), 0 12px 26px -20px rgba(0, 0, 0, .9) !important;
  color: var(--lg-ink) !important;
  transition: transform .25s var(--lg-ease), border-color .25s var(--lg-ease), box-shadow .25s var(--lg-ease);
}
html:not([data-as-appearance="light"]) body #as-home-compact-root#as-home-compact-root#as-home-compact-root #as-portal-utilities :is(.as-i18n-switcher, #as-display-mode-control, #as-tour-header-launch, #as-studio-motion, .as-nc-bell):hover {
  transform: translateY(-1px);
  border-color: var(--lg-rim-strong) !important;
  box-shadow: inset 0 1px 0 var(--lg-hi), 0 18px 34px -22px rgba(0, 0, 0, .95) !important;
}

/* ---------- 11. Tema claro: vidrio blanco ---------- */
html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-header {
  background:
    radial-gradient(130% 120% at 0% 0%, rgba(255, 255, 255, .95), transparent 55%),
    linear-gradient(158deg, rgba(255, 255, 255, .96), rgba(252, 251, 255, .90) 60%, rgba(255, 255, 255, .94)) !important;
  border-color: rgba(28, 30, 48, .10) !important;
  box-shadow: inset 0 1px 0 #fff, 0 26px 60px -40px rgba(30, 31, 52, .55) !important;
}
html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root #as-prominent-brand-filters button.as-b2b-brand {
  background: linear-gradient(158deg, rgba(255, 255, 255, .97), rgba(248, 247, 253, .93)) !important;
  border-color: rgba(28, 30, 48, .10) !important;
  box-shadow: inset 0 1px 0 #fff, 0 14px 30px -26px rgba(30, 31, 52, .5) !important;
}
html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root #as-prominent-brand-filters button.as-b2b-brand.active {
  background: linear-gradient(158deg, #ffffff, #f1edff 70%, #e9e2ff) !important;
  border-color: rgba(120, 92, 200, .38) !important;
  box-shadow: inset 0 1px 0 #fff, 0 16px 34px -26px rgba(90, 70, 160, .55), 0 0 0 1px rgba(120, 92, 200, .10) !important;
}
html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root #as-hww-section .as-hww-mini,
html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root #as-dealer-commandbar {
  background: linear-gradient(120deg, rgba(255, 255, 255, .97), rgba(251, 250, 255, .92) 58%, rgba(255, 255, 255, .96)) !important;
  border-color: rgba(28, 30, 48, .10) !important;
  box-shadow: inset 0 1px 0 #fff, 0 22px 48px -40px rgba(30, 31, 52, .55) !important;
}
html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root #as-dealer-commandbar .as-cb-title,
html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root #as-hww-section .as-hww-mini-copy {
  color: #2a2c3a !important;
}
html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-filters {
  background: linear-gradient(158deg, rgba(255, 255, 255, .97), rgba(250, 249, 255, .92)) !important;
  border-color: rgba(28, 30, 48, .10) !important;
  box-shadow: inset 0 1px 0 #fff, 0 26px 54px -42px rgba(30, 31, 52, .55) !important;
}
html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-filters input,
html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-filters select {
  background: rgba(255, 255, 255, .92) !important;
  border-color: rgba(28, 30, 48, .14) !important;
  box-shadow: inset 0 1px 2px rgba(20, 22, 40, .10) !important;
  color: #23242f !important;
}
html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-table-wrap {
  background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(252, 251, 255, .95) 22%, rgba(255, 255, 255, .94)) !important;
  border-color: rgba(28, 30, 48, .10) !important;
  box-shadow: inset 0 1px 0 #fff, 0 30px 70px -50px rgba(30, 31, 52, .55) !important;
}
html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-table thead th {
  background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(247, 245, 253, .90)) !important;
  border-bottom-color: rgba(28, 30, 48, .10) !important;
  color: #5b5e70 !important;
}
html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root tr.as-pl-v3-row:hover {
  background: linear-gradient(90deg, rgba(124, 99, 174, .07), rgba(255, 255, 255, .30)) !important;
  box-shadow: inset 2px 0 0 rgba(124, 99, 174, .55);
}
html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root tr.as-pl-v3-row td {
  border-bottom-color: rgba(28, 30, 48, .07) !important;
}

/* =====================================================================
   ENTRADA · "Bienvenido al backstage" (#as-studio-login)
   ===================================================================== */
/* --- oscuro --- */
html:not([data-as-appearance="light"]) #as-studio-login {
  background:
    radial-gradient(at 16% 42%, rgba(129, 92, 200, .32), transparent 55%),
    radial-gradient(at 86% 22%, rgba(74, 150, 210, .24), transparent 52%),
    radial-gradient(at 62% 92%, rgba(190, 120, 230, .22), transparent 58%),
    #0a0c10 !important;
}
html:not([data-as-appearance="light"]) #as-studio-login .asl-card {
  background:
    radial-gradient(120% 90% at 8% 0%, rgba(255, 255, 255, .16), transparent 52%),
    linear-gradient(158deg, rgba(38, 40, 54, .72), rgba(16, 18, 26, .58) 62%, rgba(28, 30, 42, .66)) !important;
  border: 1px solid rgba(255, 255, 255, .20) !important;
  border-radius: 28px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .34),
    inset 0 -1px 0 rgba(0, 0, 0, .35),
    0 40px 110px -40px rgba(0, 0, 0, .9),
    0 0 70px -30px rgba(150, 120, 240, .45) !important;
  backdrop-filter: blur(28px) saturate(175%) brightness(1.05) !important;
  -webkit-backdrop-filter: blur(28px) saturate(175%) brightness(1.05) !important;
  position: relative;
  overflow: hidden;
}
html:not([data-as-appearance="light"]) #as-studio-login .asl-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    linear-gradient(112deg, transparent 6%, rgba(255, 255, 255, .20) 20%, transparent 34%),
    radial-gradient(90% 60% at 50% -12%, rgba(255, 255, 255, .14), transparent 70%);
}
html:not([data-as-appearance="light"]) #as-studio-login .asl-card-head h2 {
  letter-spacing: -.02em !important;
  font-weight: 640 !important;
}
html:not([data-as-appearance="light"]) #as-studio-login .asl-card-head {
  padding-bottom: 14px !important;
  border-bottom: 1px solid rgba(255, 255, 255, .10) !important;
}
html:not([data-as-appearance="light"]) #as-studio-login .asl-native input.woocommerce-Input,
html:not([data-as-appearance="light"]) #as-studio-login .asl-native input.input-text {
  background: rgba(255, 255, 255, .055) !important;
  border: 1px solid rgba(255, 255, 255, .16) !important;
  border-radius: 13px !important;
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, .32), inset 0 1px 0 rgba(255, 255, 255, .06) !important;
  color: #f7f7fc !important;
  transition: border-color .2s var(--lg-ease), box-shadow .2s var(--lg-ease), background .2s var(--lg-ease);
}
html:not([data-as-appearance="light"]) #as-studio-login .asl-native input.woocommerce-Input:focus,
html:not([data-as-appearance="light"]) #as-studio-login .asl-native input.input-text:focus {
  outline: none !important;
  background: rgba(255, 255, 255, .085) !important;
  border-color: rgba(201, 180, 255, .72) !important;
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, .28), 0 0 0 3px rgba(201, 180, 255, .22) !important;
}
html:not([data-as-appearance="light"]) #as-studio-login .asl-native .woocommerce-form-login__submit {
  background: linear-gradient(158deg, #f0eaff, #cbb7ff 58%, #b79cf7) !important;
  border: 1px solid rgba(255, 255, 255, .72) !important;
  border-radius: 13px !important;
  box-shadow:
    inset 0 1px 0 #fff,
    inset 0 -2px 6px rgba(120, 90, 200, .35),
    0 18px 40px -18px rgba(170, 140, 245, .85) !important;
  color: #191322 !important;
  letter-spacing: .01em;
  transition: transform .22s var(--lg-ease), box-shadow .22s var(--lg-ease), filter .22s var(--lg-ease);
}
html:not([data-as-appearance="light"]) #as-studio-login .asl-native .woocommerce-form-login__submit:hover {
  transform: translateY(-1px);
  filter: brightness(1.04);
  box-shadow:
    inset 0 1px 0 #fff,
    inset 0 -2px 6px rgba(120, 90, 200, .30),
    0 24px 50px -18px rgba(170, 140, 245, .95) !important;
}
html:not([data-as-appearance="light"]) #as-studio-login .as-access-log,
html:not([data-as-appearance="light"]) #as-studio-login .as-access-invite-link,
html:not([data-as-appearance="light"]) #as-studio-login .asl-native p > a {
  color: #cfd0e2 !important;
}
html:not([data-as-appearance="light"]) #as-studio-login .asl-card-head p { color: #b9bacb !important; }
html:not([data-as-appearance="light"]) #as-studio-login .asl-utility,
html:not([data-as-appearance="light"]) #as-studio-login .asl-lang,
html:not([data-as-appearance="light"]) #as-studio-login .asl-actions > * {
}

/* --- claro: vidrio blanco, misma estructura --- */
html[data-as-appearance="light"] #as-studio-login .asl-card {
  background:
    radial-gradient(120% 90% at 8% 0%, rgba(255, 255, 255, .98), transparent 55%),
    linear-gradient(158deg, rgba(255, 255, 255, .95), rgba(250, 248, 255, .86) 62%, rgba(255, 255, 255, .92)) !important;
  border: 1px solid rgba(255, 255, 255, .95) !important;
  border-radius: 28px !important;
  box-shadow:
    inset 0 1px 0 #fff,
    0 34px 90px -44px rgba(52, 44, 90, .50),
    0 0 60px -34px rgba(150, 120, 240, .35) !important;
  backdrop-filter: blur(24px) saturate(170%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(170%) !important;
}
html[data-as-appearance="light"] #as-studio-login .asl-card-head {
  padding-bottom: 14px !important;
  border-bottom: 1px solid rgba(32, 35, 44, .08) !important;
}
html[data-as-appearance="light"] #as-studio-login .asl-native input.woocommerce-Input,
html[data-as-appearance="light"] #as-studio-login .asl-native input.input-text {
  background: rgba(255, 255, 255, .92) !important;
  border: 1px solid rgba(32, 35, 44, .12) !important;
  border-radius: 13px !important;
  box-shadow: inset 0 1px 3px rgba(32, 35, 44, .08) !important;
  transition: border-color .2s var(--lg-ease), box-shadow .2s var(--lg-ease);
}
html[data-as-appearance="light"] #as-studio-login .asl-native input.woocommerce-Input:focus {
  outline: none !important;
  border-color: rgba(124, 92, 208, .55) !important;
  box-shadow: 0 0 0 3px rgba(124, 92, 208, .16) !important;
}
html[data-as-appearance="light"] #as-studio-login .asl-native .woocommerce-form-login__submit {
  border-radius: 13px !important;
  border: 1px solid rgba(124, 92, 208, .35) !important;
  box-shadow: inset 0 1px 0 #fff, 0 16px 34px -20px rgba(124, 92, 208, .65) !important;
  transition: transform .22s var(--lg-ease), box-shadow .22s var(--lg-ease);
}
html[data-as-appearance="light"] #as-studio-login .asl-native .woocommerce-form-login__submit:hover {
  transform: translateY(-1px);
}

/* ---------- 12. Detalles finales ---------- */
html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-nc-new-badge {
  background: rgba(10, 10, 14, .55) !important;
  border: 1px solid rgba(255, 255, 255, .26) !important;
  border-radius: 999px !important;
  color: #f2f3f8 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22) !important;
}
html body #as-pl-v3-cartbar#as-pl-v3-cartbar#as-pl-v3-cartbar {
  background: linear-gradient(158deg, rgba(255, 255, 255, .13), rgba(255, 255, 255, .04)) !important;
  border: 1px solid var(--lg-rim) !important;
  border-radius: 18px !important;
  box-shadow: inset 0 1px 0 var(--lg-hi), 0 26px 60px -26px rgba(0, 0, 0, .9) !important;
  backdrop-filter: blur(16px) saturate(170%) brightness(1.10) !important;
  -webkit-backdrop-filter: blur(16px) saturate(170%) brightness(1.10) !important;
}
html[data-as-appearance="light"] body #as-pl-v3-cartbar#as-pl-v3-cartbar#as-pl-v3-cartbar {
  background: linear-gradient(158deg, rgba(255, 255, 255, .97), rgba(250, 249, 255, .92)) !important;
  border-color: rgba(28, 30, 48, .10) !important;
  box-shadow: inset 0 1px 0 #fff, 0 22px 48px -30px rgba(30, 31, 52, .55) !important;
}
/* entrada: botón fantasma y secundarios también de vidrio */
#as-studio-login .asl-native a.button,
#as-studio-login .asl-native button:not(.woocommerce-form-login__submit):not(.show-password-input),
#as-studio-login .as-access-log a,
#as-studio-login .as-access-log button {
  background: linear-gradient(158deg, rgba(255, 255, 255, .10), rgba(255, 255, 255, .03)) !important;
  border: 1px solid rgba(255, 255, 255, .18) !important;
  border-radius: 12px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22) !important;
}

/* ---------- 14. Móvil: mismo vidrio, menos GPU ---------- */
@media (max-width: 720px) {
  html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-header,
  html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-filters,
  html:not([data-as-appearance="light"]) #as-studio-login .asl-card {
    backdrop-filter: blur(14px) saturate(150%) !important;
    -webkit-backdrop-filter: blur(14px) saturate(150%) !important;
  }
  html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-header::after,
  html:not([data-as-appearance="light"]) #as-studio-login .asl-card::after {
    animation: none !important;
  }
}

/* ---------- 15. Sin backdrop-filter: superficies casi opacas ---------- */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  body::before { display: none !important; }
  html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-header,
  html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-filters,
  html body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-table-wrap {
    background: rgba(18, 18, 22, .96) !important;
  }
  html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-header,
  html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-filters,
  html[data-as-appearance="light"] body #as-home-compact-root#as-home-compact-root#as-home-compact-root .as-pl-v3-table-wrap {
    background: #fff !important;
  }
  html:not([data-as-appearance="light"]) #as-studio-login .asl-card { background: #16181f !important; }
  html[data-as-appearance="light"] #as-studio-login .asl-card { background: #fff !important; }
}