/* ASCEN · Apariencia «Liquid Glass» (vista previa). Solo actúa con <html class="lite-glass">.
   Vidrio esmerilado con brillo en el borde superior, fondo con luces suaves para que el vidrio tenga qué refractar,
   y barra inferior flotante en cápsula con una «lente» sobre la pestaña activa, al estilo iOS. */
html.lite-glass body{
  background:
    radial-gradient(60% 38% at 12% 8%,rgba(226,187,85,.30),transparent 70%),
    radial-gradient(55% 34% at 92% 30%,rgba(120,92,255,.20),transparent 72%),
    radial-gradient(70% 40% at 30% 78%,rgba(40,170,160,.16),transparent 72%),
    radial-gradient(50% 30% at 85% 96%,rgba(226,140,85,.20),transparent 72%),
    #08080a!important;
  background-attachment:fixed!important}
/* Superficie de vidrio común */
html.lite-glass .lite-card,html.lite-glass .lite-hero,html.lite-glass .lite-rcard,
html.lite-glass #app .card,html.lite-glass .lite-tile{
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.04))!important;
  -webkit-backdrop-filter:blur(26px) saturate(170%);backdrop-filter:blur(26px) saturate(170%);
  border:1px solid rgba(255,255,255,.14)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(255,255,255,.04),0 10px 30px -12px rgba(0,0,0,.55)!important}
html.lite-glass .lite-hero{background:linear-gradient(160deg,rgba(226,187,85,.22),rgba(255,255,255,.05) 60%)!important;border-color:rgba(241,216,134,.35)!important}
/* Cabecera translúcida */
html.lite-glass .head{background:rgba(10,10,12,.35)!important;-webkit-backdrop-filter:blur(22px) saturate(160%);backdrop-filter:blur(22px) saturate(160%);border-bottom:1px solid rgba(255,255,255,.08)!important}
html.lite-glass #profileBtn,html.lite-glass #sugBtn{background:rgba(255,255,255,.08)!important;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.18)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.25)!important}
/* Barra inferior: cápsula flotante */
html.lite-glass #mobileNav.ascen-mobile-nav,html.lite-glass .ascen-mobile-nav{
  left:14px!important;right:14px!important;bottom:calc(10px + env(safe-area-inset-bottom))!important;
  border-radius:999px!important;padding:6px!important;gap:2px!important;
  background:rgba(28,28,32,.38)!important;
  -webkit-backdrop-filter:blur(28px) saturate(190%)!important;backdrop-filter:blur(28px) saturate(190%)!important;
  border:1px solid rgba(255,255,255,.18)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.30),inset 0 -1px 0 rgba(255,255,255,.05),0 16px 40px -10px rgba(0,0,0,.7)!important}
html.lite-glass .ascen-mobile-nav button{border-radius:999px!important;min-height:54px!important;color:rgba(255,255,255,.72)!important}
/* La «lente» sobre la pestaña activa */
html.lite-glass .ascen-mobile-nav button.active{
  color:var(--lite-gold2)!important;
  background:radial-gradient(120% 90% at 50% 0%,rgba(255,255,255,.26),rgba(255,255,255,.07) 60%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -2px 6px rgba(255,255,255,.06),0 4px 14px -4px rgba(0,0,0,.5)!important;
  border:1px solid rgba(255,255,255,.22)!important}
html.lite-glass #app{padding-bottom:calc(110px + env(safe-area-inset-bottom))!important}
/* Botones secundarios y chips */
html.lite-glass .lite-chip,html.lite-glass .lite-pill{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.14)!important}
html.lite-glass .lite-cta{box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 10px 26px -10px rgba(226,187,85,.7)!important}
/* Más superficies de vidrio: perfil, alimentación, progreso y modo entreno */
html.lite-glass .lite-plist,html.lite-glass #app .ascen-food-meal,html.lite-glass .ascen-guide-card,html.lite-glass .lite-seg,html.lite-glass .lite-apseg{
  background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.035))!important;
  -webkit-backdrop-filter:blur(24px) saturate(165%);backdrop-filter:blur(24px) saturate(165%);
  border:1px solid rgba(255,255,255,.13)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.24)!important}
/* Sin cajas dentro de cajas: lo anidado queda transparente */
html.lite-glass #app .card .card,html.lite-glass .ascen-weight-metrics>*,html.lite-glass .lite-card .lite-card{background:none!important;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none!important;border-color:rgba(255,255,255,.08)!important}
/* Modo entreno: barra superior e inferior de vidrio */
html.lite-glass .lite-focus .lite-ftop,html.lite-glass.lite-focus .lite-ftop,html.lite-glass body.lite-focus .lite-ftop,
html.lite-glass body.lite-focus .lite-fbot{background:rgba(14,14,18,.42)!important;-webkit-backdrop-filter:blur(26px) saturate(180%)!important;backdrop-filter:blur(26px) saturate(180%)!important;border-color:rgba(255,255,255,.1)!important}
html.lite-glass body.lite-focus .lite-fbot>*:not(.lite-rest) button,html.lite-glass .lite-fbot [data-lite-prev],html.lite-glass .lite-fbot [data-lite-next]{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.16)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.25)!important}
html.lite-glass .lite-fbot [data-lite-next].is-ready{background:linear-gradient(180deg,var(--lite-gold2),var(--lite-gold))!important;color:var(--lite-ink)!important}
html.lite-glass .lite-rest{background:rgba(22,22,26,.5)!important;-webkit-backdrop-filter:blur(24px)!important;backdrop-filter:blur(24px)!important;border:1px solid rgba(255,255,255,.16)!important}
/* Hojas que suben desde abajo: vidrio flotante separado de los bordes, como en iOS */
html.lite-glass .ascen-sheet{background:rgba(26,26,30,.55)!important;-webkit-backdrop-filter:blur(30px) saturate(180%)!important;backdrop-filter:blur(30px) saturate(180%)!important;
  border:1px solid rgba(255,255,255,.16)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 -10px 40px rgba(0,0,0,.45)!important;
  margin:0 10px calc(10px + env(safe-area-inset-bottom))!important;border-radius:28px!important;width:min(560px,calc(100% - 20px))!important}
html.lite-glass .ascen-sheet-backdrop{background:rgba(0,0,0,.35)!important}
/* Si el teléfono pide menos transparencia, el vidrio se vuelve casi sólido */
@media (prefers-reduced-transparency:reduce){
  html.lite-glass .lite-card,html.lite-glass .lite-hero,html.lite-glass #app .card,html.lite-glass .lite-plist,html.lite-glass #app .ascen-food-meal,html.lite-glass .ascen-guide-card,
  html.lite-glass .ascen-mobile-nav,html.lite-glass .ascen-sheet,html.lite-glass body.lite-focus .lite-ftop,html.lite-glass body.lite-focus .lite-fbot{background:#17171b!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}}
/* Márgenes: en el entreno el ejercicio no va dentro de una caja de vidrio (la imagen y el nombre no tocan el borde) */
html.lite-glass #app .card.routine,html.lite-glass #app .lite-routine{background:none!important;border:0!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
/* La barra inferior desenfoca más: lo que pasa por debajo no se lee ni parece cortado */
html.lite-glass #mobileNav.ascen-mobile-nav,html.lite-glass .ascen-mobile-nav{background:linear-gradient(180deg,rgba(42,42,48,.88),rgba(18,18,22,.93))!important;-webkit-backdrop-filter:blur(34px) saturate(190%)!important;backdrop-filter:blur(34px) saturate(190%)!important}
html.lite-glass body.lite-focus .lite-fbot,html.lite-glass body.lite-focus .lite-ftop{background:rgba(14,14,18,.80)!important}
/* ---- Modo entreno en Liquid Glass ----
   El ejercicio va en una tarjeta de vidrio con margen interior (nada toca el borde) y cada pieza lleva su propio vidrio. */
html.lite-glass #app .lite-active .training-ex:not(.lite-off){
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.035))!important;
  -webkit-backdrop-filter:blur(26px) saturate(170%);backdrop-filter:blur(26px) saturate(170%);
  border:1px solid rgba(255,255,255,.14)!important;border-radius:26px!important;padding:16px 14px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 14px 34px -14px rgba(0,0,0,.6)!important}
html.lite-glass #app .lite-active .training-chips>span,
html.lite-glass #app .lite-active .set-row input,
html.lite-glass #app .lite-active .series-check,
html.lite-glass #app .lite-active .series-num,
html.lite-glass .lite-more{
  background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.13)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.14)!important}
html.lite-glass #app .lite-active .set-row.done{background:rgba(226,187,85,.12)!important}
html.lite-glass #app .lite-active .set-row.done .series-check{background:var(--lite-gold)!important;border-color:transparent!important}
html.lite-glass #app .lite-active .ascen-add-set{border-color:rgba(255,255,255,.22)!important;background:rgba(255,255,255,.03)!important}
html.lite-glass #app .lite-active .ex-thumb,html.lite-glass #app .lite-active .ex-head img{box-shadow:0 6px 18px -6px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.2)!important}
/* Botones de la barra superior: cerrar y «Terminar» de vidrio */
html.lite-glass .lite-ftop .lite-iconbtn{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.18)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.25)!important}
html.lite-glass .lite-ftop .lite-pillbtn{background:rgba(226,187,85,.20)!important;border:1px solid rgba(241,216,134,.35)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.25)!important}
html.lite-glass #app .lite-active .set-row:not(.done){background:transparent!important}
html.lite-glass #app .lite-active .set-row .prev-load{background:rgba(255,255,255,.04)!important;border:1px solid rgba(255,255,255,.10)!important}
html.lite-glass body.lite-focus .lite-fbot [data-lite-prev]{background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.14)!important}
/* Los tres puntos (⋮) van sin vidrio: solo el ícono */
html.lite-glass #app .lite-active .ex-menu{background:none!important;border:0!important;box-shadow:none!important}
/* v649: sin luces de fondo ni sombras. Fondo liso como en Sólido; el vidrio conserva su borde y su brillo superior. */
html.lite-glass body{background:var(--lite-bg,#0c0c0e)!important}
html.lite-glass .lite-card,html.lite-glass .lite-hero,html.lite-glass .lite-rcard,html.lite-glass #app .card,html.lite-glass .lite-tile,
html.lite-glass #app .lite-active .training-ex:not(.lite-off),html.lite-glass .lite-plist,html.lite-glass #app .ascen-food-meal,html.lite-glass .ascen-guide-card,
html.lite-glass .lite-seg,html.lite-glass .lite-apseg,html.lite-glass .lite-cta{box-shadow:inset 0 1px 0 rgba(255,255,255,.22)!important}
html.lite-glass .lite-hero{background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.035))!important;border-color:rgba(241,216,134,.30)!important}
html.lite-glass .head,html.lite-glass body.lite-focus .lite-ftop{background:var(--lite-bg,#0c0c0e)!important}
html.lite-glass .ascen-mobile-nav{box-shadow:inset 0 1px 0 rgba(255,255,255,.26)!important}
/* Burbuja de la barra inferior (se arrastra manteniendo pulsado) */
.lite-lens{display:none}
html.lite-glass .ascen-mobile-nav{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
html.lite-glass .lite-lens{display:block;position:absolute;left:0;top:6px;z-index:0;border-radius:999px;pointer-events:none;will-change:transform;
  background:radial-gradient(120% 90% at 50% 0%,rgba(255,255,255,.26),rgba(255,255,255,.07) 60%);
  border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -2px 6px rgba(255,255,255,.06),0 4px 14px -4px rgba(0,0,0,.5);
  transition:transform .42s cubic-bezier(.3,1.35,.45,1),width .3s ease,background .2s,box-shadow .2s}
html.lite-glass .lite-lens.sin-anim{transition:none}
html.lite-glass .lite-lens.is-drag{transition:transform .12s ease-out,background .2s,box-shadow .2s;
  background:radial-gradient(120% 90% at 50% 0%,rgba(255,255,255,.30),rgba(255,255,255,.10) 65%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -3px 10px rgba(255,255,255,.10),0 10px 26px -6px rgba(0,0,0,.6)}
html.lite-glass .ascen-mobile-nav button{position:relative;z-index:1;background:none!important;box-shadow:none!important;border-color:transparent!important}
html.lite-glass .ascen-mobile-nav button svg{transition:transform .2s cubic-bezier(.3,1.4,.5,1)}
html.lite-glass .ascen-mobile-nav.is-drag button.active{color:rgba(255,255,255,.72)!important}
html.lite-glass .ascen-mobile-nav button.is-hover{color:var(--lite-gold2)!important}
html.lite-glass .ascen-mobile-nav button.is-hover svg{transform:scale(1.18)}
@media(prefers-reduced-motion:reduce){html.lite-glass .lite-lens,html.lite-glass .ascen-mobile-nav button svg{transition:none}}
html.lite-glass .ascen-mobile-nav button.active{background:none!important;box-shadow:none!important;border-color:transparent!important}
/* v651: burbuja fluida. Solo se anima transform (GPU); 0,25 s con curva suave. */
html.lite-glass .lite-lens{left:0;will-change:transform;transform:translate3d(0,0,0);backface-visibility:hidden;contain:layout paint;
  transition:transform .25s cubic-bezier(.4,0,.2,1),background .2s,box-shadow .2s!important}
html.lite-glass .lite-lens.is-drag{transition:transform 60ms linear,background .2s,box-shadow .2s!important}
html.lite-glass .lite-lens.sin-anim{transition:none!important}
html.lite-glass .ascen-mobile-nav button{transition:color .2s ease!important}
/* «Siguiente ejercicio» listo: dorado con letras oscuras (antes el vidrio lo dejaba negro) */
html.lite-glass body.lite-focus .lite-fbot button[data-lite-next].is-ready,html.lite-glass .lite-fbot [data-lite-next].is-ready{background:linear-gradient(180deg,var(--lite-gold2),var(--lite-gold))!important;color:var(--lite-ink)!important;border-color:transparent!important}
html.lite-glass .lite-fbot [data-lite-next].is-ready *{color:var(--lite-ink)!important}
/* ---- v651: todos los botones en vidrio (solo en Liquid Glass) ----
   Secundarios: vidrio claro con brillo arriba. Principales (dorados): «oro líquido», el mismo dorado con brillo de vidrio. */
html.lite-glass .smallBtn,html.lite-glass .lite-ghost,html.lite-glass .lite-iconbtn,html.lite-glass .sheet-item:not(.danger):not(.lite-sheet-gold),
html.lite-glass .lite-chipbtn:not(.is-on),html.lite-glass .ascen-food-chip,html.lite-glass #profileBtn,
html.lite-glass .pay-plan,html.lite-glass .pay-method,html.lite-glass .pay-copy-all,html.lite-glass .lite-rplay,html.lite-glass .substitute-toggle,
html.lite-glass .lite-pillbtn,html.lite-glass .lite-mealtoggle,html.lite-glass .hx-seg button:not(.is-on),html.lite-glass .lite-seg button:not(.is-on):not([aria-selected=true]),
html.lite-glass .exercise-detail-close,html.lite-glass .ss-chip,html.lite-glass .lite-share [data-x],html.lite-glass #app .btn.secondary{
  background:linear-gradient(180deg,rgba(255,255,255,.11),rgba(255,255,255,.04))!important;
  -webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);
  border:1px solid rgba(255,255,255,.16)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.28)!important}
html.lite-glass .smallBtn{border-color:rgba(226,187,85,.45)!important}
html.lite-glass .sheet-item.danger,html.lite-glass .lite-ghost.is-danger{background:rgba(255,120,110,.10)!important;border:1px solid rgba(255,138,122,.4)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.18)!important}
html.lite-glass .lite-cta,html.lite-glass .sheet-item.lite-sheet-gold,html.lite-glass .lite-chipbtn.is-on,html.lite-glass .hx-seg button.is-on,html.lite-glass #app .btn:not(.secondary),
html.lite-glass .lite-apseg button[aria-checked=true]{
  background:linear-gradient(180deg,#f6e3a1 0%,#e9c665 48%,#d8b04a 100%)!important;border:1px solid rgba(255,244,210,.55)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65),inset 0 -2px 6px rgba(120,80,0,.18)!important}
html.lite-glass .sheet-item.danger *{color:inherit}
html.lite-glass .lite-lens.oculta{opacity:0}html.lite-glass .lite-lens{transition-property:transform,opacity,background,box-shadow!important}

/* ---- v652: «Tu semana» con días en círculos de vidrio (estilo iOS) ----
   El botón del día no lleva fondo; el círculo (b) es la burbuja de vidrio. Entrenado: oro líquido. Hoy: anillo dorado. */
html.lite-glass button.lite-day{background:transparent!important;border:0!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border-radius:0!important}
html.lite-glass .lite-day b{width:38px;height:38px;border-radius:50%!important;
  background:radial-gradient(120% 90% at 30% 15%,rgba(255,255,255,.22),rgba(255,255,255,.05) 55%,rgba(255,255,255,.03))!important;
  -webkit-backdrop-filter:blur(14px) saturate(170%);backdrop-filter:blur(14px) saturate(170%);
  border:1px solid rgba(255,255,255,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -1px 2px rgba(0,0,0,.25);color:#b4b4bc}
html.lite-glass .lite-day.is-done b{background:radial-gradient(120% 90% at 30% 15%,#fbecbb,#e9c665 50%,#cfa640)!important;border-color:rgba(255,244,210,.6);color:var(--lite-ink);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -2px 4px rgba(120,80,0,.25)}
html.lite-glass .lite-day.is-today:not(.is-done) b{border:2px solid var(--lite-gold);color:var(--lite-gold2)}
html.lite-glass .lite-day.is-sel b{box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 0 0 2px #f1d886,0 0 0 5px rgba(241,216,134,.18)}
html.lite-glass .lite-day small{color:var(--lite-muted)}
html.lite-glass .lite-pillbtn.is-gold{background:linear-gradient(180deg,#f6e3a1 0%,#e9c665 48%,#d8b04a 100%)!important;border:1px solid rgba(255,244,210,.55)!important;color:var(--lite-ink)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.65)!important}
html.lite-glass .lite-ver{background:transparent!important;border:0!important;box-shadow:none!important}
html.lite-glass #app .pay-cards .pay-copy-all,html.lite-glass .pay-cards .pay-copy-all{color:var(--lite-gold2,#f1d886)!important;background:rgba(226,187,85,.10)!important;border:0!important;border-top:1px solid rgba(255,255,255,.12)!important;box-shadow:none!important;-webkit-backdrop-filter:none;backdrop-filter:none}
/* v652: debajo de la barra flotante el contenido ya no se ve pasar: un velo con el color del fondo cubre esa franja. */
@media(max-width:899px){html.lite-glass body:not(.lite-focus)::after{content:"";position:fixed;left:0;right:0;bottom:0;height:calc(96px + env(safe-area-inset-bottom));z-index:59;pointer-events:none;
  background:linear-gradient(180deg,rgba(12,12,14,0) 0%,rgba(12,12,14,.82) 38%,#0c0c0e 62%)}}