/* t461 (18-oct-2026): DISEÑO DE REFERENCIA de Miguel (sus capturas de Salud del 18-oct) en TODAS las
   pantallas de las 4 apps (prueba, Plan Libre, Plan Premium y clientes). Mismo fichero en las dos apps,
   cargado el ÚLTIMO en base.html (después de t457.css). Solo estilo.
   Referencia: fondo blanco-azulado; tarjeta blanca con borde fino, esquinas muy redondeadas y sombra
   suave; cajita azul clara con icono azul; etiqueta pequeña azul en MAYÚSCULAS sobre un título en negrita
   y subtítulo gris; opciones como tarjetas con borde fino y la elegida en azul muy claro con borde azul;
   chips del mismo ancho en rejilla; caja (i) azul clara; botón azul eléctrico con sombra azul;
   barra de abajo con la pestaña activa en píldora azul clara.
   Arreglos de las capturas: letras comidas (C, z) por letter-spacing/overflow, etiquetas de la cabecera
   encima de los iconos, chips de anchos distintos, hoy poco marcado en Mi ciclo. */

:root{
  --t461-pag:#F4F7FE; --t461-card:#FFFFFF; --t461-borde:#E3EAF6; --t461-borde2:#D3DEF2;
  --t461-tx:#0B1430; --t461-tx2:#5B6782; --t461-azul:#1F5BFF; --t461-azul-o:#1747D6; --t461-azul-tx:#1D4ED8;
  --t461-suave:#EEF3FF; --t461-suave2:#E3ECFF; --t461-sombra:0 1px 2px rgba(16,36,94,.04), 0 12px 32px -18px rgba(16,36,94,.22);
  --t461-sombra-azul:0 12px 26px -10px rgba(31,91,255,.55);
  --t461-rojo-f:#FFF0F2; --t461-rojo:#E5485F; --t461-verde-f:#ECFAF3; --t461-verde:#1E9E6A;
  --t461-rosa-f:#FFEFF4; --t461-rosa:#D64F7F; --t461-lila-f:#F2EEFF; --t461-lila:#7357D8;
}
:root:not([data-tema]){
  --t461-pag:#060B1A; --t461-card:#0E1834; --t461-borde:rgba(160,185,255,.14); --t461-borde2:rgba(160,185,255,.24);
  --t461-tx:#F2F5FF; --t461-tx2:#AEBBDD; --t461-azul:#4F84FF; --t461-azul-o:#3B6CFF; --t461-azul-tx:#9DB8FF;
  --t461-suave:rgba(79,132,255,.14); --t461-suave2:rgba(79,132,255,.22); --t461-sombra:none;
  --t461-rojo-f:rgba(229,72,95,.14); --t461-verde-f:rgba(30,158,106,.16); --t461-rosa-f:rgba(214,79,127,.16); --t461-lila-f:rgba(115,87,216,.18);
}
:root[data-tema="noche"]{
  --t461-pag:#0A0406; --t461-card:#1A0D11; --t461-borde:rgba(255,220,200,.10); --t461-borde2:rgba(255,220,200,.18);
  --t461-tx:#F3E4D8; --t461-tx2:#C9AC98; --t461-azul:#D9714B; --t461-azul-o:#A9472A; --t461-azul-tx:#EFA383;
  --t461-suave:rgba(217,113,75,.14); --t461-suave2:rgba(217,113,75,.22); --t461-sombra:none;
  --t461-sombra-azul:0 12px 26px -12px rgba(217,113,75,.5);
  --t461-rojo-f:rgba(229,72,95,.14); --t461-verde-f:rgba(30,158,106,.16); --t461-rosa-f:rgba(214,79,127,.16); --t461-lila-f:rgba(115,87,216,.18);
}

/* ================= 1) fondo y tarjetas (todas las pantallas) ================= */
html:not(:has(.splash-wrap)) body{background:var(--t461-pag)!important}
html body main :is(.card, .t461-card, .t441-t, .t453-t, .n7-sec.t441-sec, a.rx-fila.t453-rxf, a.rx-foto.t453-rxf2,
  .pg-kpi, .hoy-card, .cs-fila, .md-card, .pf-card, .t433-hoja, .rx-grande){
  background:var(--t461-card)!important;border:1px solid var(--t461-borde)!important;border-radius:26px!important;
  box-shadow:var(--t461-sombra)!important}
/* las de dentro de una tarjeta: sin sombra, borde fino */
html body main :is(.card, .t461-card) :is(.card, .pg-kpi, .sh-op, .fx-fila){box-shadow:none!important;
  border:1px solid var(--t461-borde)!important;background:var(--t461-card)!important;border-radius:18px!important}

/* ================= 2) cajita de icono azul clara ================= */
html body :is(.fx-ico, .fx-ico.chico, .n7-ico, .mv-ico, .ru-hero-ico, .r10-accion-ico, .r10-kico, .t457-ico, .t461-ico,
  .sa-ico, .r10-ico, .t441-ico, .t453-ico){
  background:var(--t461-suave)!important;color:var(--t461-azul)!important;border-radius:14px!important}
html body :is(.fx-ico, .n7-ico, .mv-ico, .r10-kico, .t457-ico, .sa-ico, .r10-ico, .t441-ico, .t453-ico) .ic-m{background:var(--t461-azul)!important}

/* ================= 3) etiqueta azul en mayúsculas sobre el título ================= */
/* La «C» y la «z» comidas: venían de letter-spacing negativo + overflow:hidden en los títulos y de la
   etiqueta con letter-spacing ancho pegada al borde. Ahora: espaciado positivo en la etiqueta, un pelo de
   margen interior y nada de recortar texto que no lleve puntos suspensivos. */
html body :is(.t453-n, .t461-et, .sa-et, .ciclo-et, .t441-n, .ciclo-dia){
  display:block;font:800 11.5px/1.25 Manrope, system-ui, sans-serif!important;letter-spacing:.08em!important;
  text-transform:uppercase;color:var(--t461-azul-tx)!important;padding:0 .12em 0 .04em;overflow:visible!important}
html body main :is(h1, h2, h3, .mg-tt, .mg-rot, .t441-txt b, .t453-txt b){letter-spacing:-.01em!important;
  overflow:visible!important;padding-right:.06em}
html body main :is(h1, h2, h3, p, small, label, legend, .mg-rot, .mg-tt):not([class*="elip"]){text-overflow:clip}
html body .mg-cabt .min-w-0{overflow:visible!important;min-width:0}

/* ================= 4) botones ================= */
html body main :is(.btn-primary, button.btn-primary, a.btn-primary, .sh-guardar){
  background:linear-gradient(135deg, var(--t461-azul) 0%, var(--t461-azul-o) 100%)!important;color:#fff!important;
  border:0!important;border-radius:16px!important;min-height:52px;font:800 16px/1.2 Manrope, system-ui, sans-serif!important;
  box-shadow:var(--t461-sombra-azul)!important;letter-spacing:0!important;text-transform:none!important}
html body main :is(.btn-ghost, .btn-outline, .btn-secundario){background:var(--t461-card)!important;color:var(--t461-tx)!important;
  border:1px solid var(--t461-borde2)!important;border-radius:16px!important;box-shadow:none!important;min-height:48px;
  font-weight:800!important;text-transform:none!important;letter-spacing:0!important}
html body main .btn-peligro{color:var(--t461-rojo)!important;border-color:color-mix(in srgb, var(--t461-rojo) 35%, transparent)!important}

/* ================= 5) chips: mismo ancho, rejilla de 2 columnas ================= */
html body main :is(.sh-chapas, .t461-chips){display:grid!important;grid-template-columns:repeat(2, minmax(0, 1fr));gap:10px}
html body main .sh-chapas:has(.sh-chapa.e1){grid-template-columns:repeat(3, minmax(0, 1fr))}
html body main .sh-chapa{width:100%;margin:0!important}
html body main .sh-chapa > span{display:flex!important;width:100%;min-height:46px;align-items:center;justify-content:center;
  text-align:center;border-radius:14px!important;border:1px solid var(--t461-borde2)!important;background:var(--t461-card)!important;
  color:var(--t461-tx)!important;font-weight:700!important;white-space:normal!important;padding:8px 10px!important}
html body main .sh-chapa input:checked + span{background:var(--t461-suave)!important;border-color:var(--t461-azul)!important;
  color:var(--t461-azul-tx)!important;box-shadow:inset 0 0 0 1px var(--t461-azul)}

/* ================= 6) barra de abajo: píldora azul clara en la activa ================= */
html body .navbaja{background:color-mix(in srgb, var(--t461-card) 94%, transparent)!important;border-top:1px solid var(--t461-borde)!important;
  box-shadow:0 -10px 30px -22px rgba(16,36,94,.35)!important}
html body .navbaja a{color:var(--t461-tx2)!important;font-weight:700!important}
html body .navbaja a:is(.on, [aria-current="page"]){color:var(--t461-azul-tx)!important;background:var(--t461-suave)!important;
  border-radius:18px!important;box-shadow:none!important}
html body .navbaja a:is(.on, [aria-current="page"]) :is(svg, .ic-m){color:var(--t461-azul)!important}
html body .navbaja a:is(.on, [aria-current="page"]) svg :is(path, rect, circle){fill:currentColor;fill-opacity:.22}

/* ================= 7) cabecera: nada encima de los iconos ================= */
/* «Cómo funciona»: la burbuja flotante tapaba el icono del chat; t461.js la cambia por una pastilla
   en su sitio, debajo de la cabecera. */
html body :is(#sp-ayuda-burbuja, #cl-ayuda-burbuja){display:none!important}
html body .t461-como{display:flex;justify-content:flex-end;margin:4px 0 8px}
html body .t461-como a{display:inline-flex;align-items:center;gap:6px;padding:6px 12px 6px 8px;border-radius:999px;
  background:var(--t461-suave);color:var(--t461-azul-tx);font:800 12.5px/1 Manrope, system-ui, sans-serif;text-decoration:none}
html body .t461-como a svg{width:16px;height:16px}
html body:has(.t461-como) :is(main.wrap, main.zona){margin-top:0!important}
html body .cl-ayuda-on, html body .sp-ayuda-on{animation:none!important}
/* «Vista cliente» plegada: de arriba a la derecha (encima del perfil y del chat) a abajo a la izquierda */
html body .cinta-mirando.plegada{top:auto!important;right:auto!important;left:10px!important;
  bottom:calc(84px + env(safe-area-inset-bottom, 0px))!important}

/* ================= 8) campos ================= */
html body main :is(input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], select, textarea){
  border:1px solid var(--t461-borde2)!important;border-radius:14px!important;background:var(--t461-card)!important;color:var(--t461-tx)!important}
html body main :is(input, select, textarea):focus{border-color:var(--t461-azul)!important;box-shadow:0 0 0 4px var(--t461-suave)!important;outline:0}

/* ================= 9) componentes t461 (Mi ciclo y lo que se monte con ellos) ================= */
.t461-pag{display:flex;flex-direction:column;gap:16px;padding-bottom:12px}
.t461-pag > *{margin:0!important}
.t461-hero h1{margin:4px 0 4px!important}
.t461-hero p{margin:0;font:500 15px/1.45 Manrope, system-ui, sans-serif}
.t461-card{padding:20px!important;color:var(--t461-tx)}
.t461-card form{display:flex;flex-direction:column;gap:14px;margin:0}
.t461-cab{display:flex;gap:14px;align-items:flex-start;margin-bottom:16px}
.t461-ico{width:48px;height:48px;min-width:48px;display:grid;place-items:center;border-radius:15px!important}
.t461-ico svg{width:24px;height:24px}
.t461-cab-t{min-width:0;flex:1;padding-top:1px}
.t461-tit{margin:4px 0 0!important;font:800 21px/1.2 Manrope, system-ui, sans-serif!important;color:var(--t461-tx)!important}
.t461-sub{margin:5px 0 0!important;font:500 14px/1.45 Manrope, system-ui, sans-serif!important;color:var(--t461-tx2)!important}
.t461-horm{margin:-6px 0 14px;font:500 13.5px/1.45 Manrope, system-ui, sans-serif;color:var(--t461-tx2)}
.t461-pie{margin:12px 0 0!important;font:500 13px/1.45 Manrope, system-ui, sans-serif;color:var(--t461-tx2)}
.t461-sec{display:flex;align-items:center;gap:8px;margin:6px 0 10px;font:800 12.5px/1.2 Manrope, system-ui, sans-serif;
  letter-spacing:.07em;text-transform:uppercase;color:var(--t461-azul-tx);padding-left:.04em}
.t461-sec-ico{width:26px;height:26px;display:grid;place-items:center;border-radius:9px;background:var(--t461-suave);color:var(--t461-azul)}
.t461-sec-ico svg{width:16px;height:16px}
.t461-grupo{border:0;margin:0;padding:0;min-width:0}
.t461-grupo legend{padding:0;width:100%}
.t461-lista{margin:0 0 12px;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.t461-lista li{position:relative;padding-left:22px;font:500 14.5px/1.45 Manrope, system-ui, sans-serif;color:var(--t461-tx)}
.t461-lista li::before{content:"";position:absolute;left:4px;top:.5em;width:8px;height:8px;border-radius:50%;background:var(--t461-azul)}
.t461-fases{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.t461-fase{border:1px solid var(--t461-borde);border-radius:16px;padding:12px;display:flex;flex-direction:column;gap:3px}
.t461-fase b{font:800 14px/1.2 Manrope, system-ui, sans-serif;color:var(--t461-tx)}
.t461-fase span{font:500 12.5px/1.35 Manrope, system-ui, sans-serif;color:var(--t461-tx2)}

/* opciones como tarjetas (¿En qué momento estás?) */
.t461-ops{display:flex;flex-direction:column;gap:10px}
.t461-op{position:relative;display:flex;align-items:center;gap:12px;padding:14px;border:1px solid var(--t461-borde2);
  border-radius:18px;background:var(--t461-card);cursor:pointer;transition:background .15s, border-color .15s}
.t461-op input{position:absolute;opacity:0;pointer-events:none}
.t461-op-ilus{width:46px;height:46px;min-width:46px;border-radius:50%;display:grid;place-items:center}
.t461-op-ilus svg{width:23px;height:23px}
.t461-rosa{background:var(--t461-rosa-f);color:var(--t461-rosa)}
.t461-lila{background:var(--t461-lila-f);color:var(--t461-lila)}
.t461-verde{background:var(--t461-verde-f);color:var(--t461-verde)}
.t461-op-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.t461-op-t b{font:800 15px/1.25 Manrope, system-ui, sans-serif;color:var(--t461-tx)}
.t461-op-t small{font:500 13px/1.35 Manrope, system-ui, sans-serif;color:var(--t461-tx2)}
.t461-radio{width:22px;height:22px;min-width:22px;border-radius:50%;border:2px solid var(--t461-borde2);display:grid;place-items:center}
.t461-op:has(input:checked){background:var(--t461-suave);border-color:var(--t461-azul);box-shadow:inset 0 0 0 1px var(--t461-azul)}
.t461-op:has(input:checked) .t461-radio{border-color:var(--t461-azul);background:var(--t461-azul);
  box-shadow:inset 0 0 0 4px var(--t461-card)}
.t461-op:has(input:focus-visible){outline:3px solid var(--t461-suave2);outline-offset:2px}

/* energía: Baja (rojo suave), Normal (azul), Alta (verde suave), con pila */
.t461-ener{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:10px}
.t461-ener-op{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 6px 12px;border-radius:18px;
  border:1px solid transparent;cursor:pointer;text-align:center;font-family:Manrope, system-ui, sans-serif}
button.t461-ener-op{appearance:none;-webkit-appearance:none}
.t461-ener-op input{position:absolute;opacity:0;pointer-events:none}
.t461-ener-op b{font:800 15px/1.2 Manrope, system-ui, sans-serif;color:var(--t461-tx)}
.t461-ener-op small{font:600 11.5px/1.25 Manrope, system-ui, sans-serif;color:var(--t461-tx2)}
.t461-ener-op.e1{background:var(--t461-rojo-f);--c:var(--t461-rojo)}
.t461-ener-op.e2{background:var(--t461-suave);--c:var(--t461-azul)}
.t461-ener-op.e3{background:var(--t461-verde-f);--c:var(--t461-verde)}
.t461-ener-op:has(input:checked){border-color:var(--c);box-shadow:inset 0 0 0 1px var(--c), 0 8px 20px -14px var(--c)}
.t461-ener-op:has(input:checked)::after{content:"";position:absolute;top:8px;right:8px;width:18px;height:18px;border-radius:50%;
  background:var(--c) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/12px no-repeat}
.t461-pila{position:relative;display:flex;gap:2px;width:36px;height:20px;padding:3px;border:2px solid var(--c);border-radius:6px;margin-right:4px}
.t461-pila::after{content:"";position:absolute;right:-6px;top:5px;width:3px;height:6px;border-radius:0 2px 2px 0;background:var(--c)}
.t461-pila i{flex:1;border-radius:2px;background:var(--c);opacity:.18}
.t461-pila.b1 i:nth-child(-n+1), .t461-pila.b2 i:nth-child(-n+2), .t461-pila.b3 i{opacity:1}

/* chips de ánimo (2x2) y de «¿Cómo te notas?» (2 columnas, mismo ancho) */
.t461-chips{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:10px}
.t461-chip{position:relative;display:block;min-width:0}
.t461-chip input{position:absolute;opacity:0;pointer-events:none}
.t461-chip > span{display:flex;align-items:center;gap:8px;width:100%;min-height:50px;padding:9px 12px;border-radius:15px;
  border:1px solid var(--t461-borde2);background:var(--t461-card);color:var(--t461-tx);font:700 14px/1.25 Manrope, system-ui, sans-serif;
  cursor:pointer;box-sizing:border-box}
.t461-chip em{font-style:normal;font-size:19px;line-height:1;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif}
.t461-chip-ico{width:28px;height:28px;min-width:28px;border-radius:50%;display:grid;place-items:center;background:var(--t461-suave);color:var(--t461-azul)}
.t461-chip-ico svg{width:16px;height:16px}
.t461-chip input:checked + span{background:var(--t461-suave);border-color:var(--t461-azul);color:var(--t461-azul-tx);box-shadow:inset 0 0 0 1px var(--t461-azul)}
.t461-chip input:focus-visible + span{outline:3px solid var(--t461-suave2);outline-offset:2px}

.t461-grupo textarea{width:100%;box-sizing:border-box;min-height:96px;padding:12px 14px;font:500 15px/1.45 Manrope, system-ui, sans-serif}
.t461-cuenta{margin:4px 0 0!important;text-align:right;font:600 12px/1 Manrope, system-ui, sans-serif;color:var(--t461-tx2)}

/* caja informativa (i) */
.t461-info{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:16px;background:var(--t461-suave);
  border:1px solid color-mix(in srgb, var(--t461-azul) 14%, transparent)}
.t461-info-i{color:var(--t461-azul);flex:none;width:22px;height:22px;display:grid;place-items:center}
.t461-info-i svg{width:20px;height:20px}
.t461-info p{margin:0!important;font:600 13.5px/1.45 Manrope, system-ui, sans-serif;color:var(--t461-azul-tx)!important}

/* botones de la referencia */
.t461-botones{display:grid;grid-template-columns:auto 1fr;gap:10px;margin-top:4px}
.t461-volver{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 18px;border-radius:16px;
  border:1px solid var(--t461-borde2);background:var(--t461-card);color:var(--t461-tx);font:800 15px/1 Manrope, system-ui, sans-serif;text-decoration:none}
.t461-volver svg, .t461-continuar svg, .t461-grande svg, .t461-borrar svg{width:20px;height:20px;flex:none}
.t461-volver-arriba{align-self:flex-start;min-height:42px;padding:0 14px 0 10px;border-radius:999px}
.t461-continuar, .t461-grande{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 20px;
  border:0;border-radius:16px;background:linear-gradient(135deg, var(--t461-azul) 0%, var(--t461-azul-o) 100%);color:#fff;
  font:800 16px/1 Manrope, system-ui, sans-serif;box-shadow:var(--t461-sombra-azul);cursor:pointer;text-decoration:none}
.t461-grande{width:100%;min-height:56px;font-size:16.5px;margin-top:4px}
.t461-ancho{width:100%}
.t461-borrar{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;border-radius:16px;cursor:pointer;
  border:1px solid color-mix(in srgb, var(--t461-rojo) 35%, transparent);background:var(--t461-rojo-f);color:var(--t461-rojo);
  font:800 15px/1 Manrope, system-ui, sans-serif}
.t461-peligro .t461-ico{background:var(--t461-rojo-f)!important;color:var(--t461-rojo)!important}
.t461-enlace{background:none;border:0;padding:6px 0;color:var(--t461-azul-tx);font:800 13.5px/1 Manrope, system-ui, sans-serif;cursor:pointer}
.t461-quitar-hoy{align-items:center;margin-top:8px!important}
.t461-campo{display:flex;flex-direction:column;gap:6px}
.t461-campo > span{font:700 13px/1.2 Manrope, system-ui, sans-serif;color:var(--t461-tx2)}
.t461-campo input{min-height:50px;padding:0 14px;font:600 15px/1 Manrope, system-ui, sans-serif;box-sizing:border-box;width:100%}
.t461-acepto{display:flex;gap:10px;align-items:flex-start;font:500 13.5px/1.45 Manrope, system-ui, sans-serif;color:var(--t461-tx2)}
.t461-acepto input{width:20px;height:20px;accent-color:var(--t461-azul);flex:none;margin-top:1px}
.t461-fechas{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.t461-fechas li{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--t461-borde);border-radius:16px}
.t461-fechas li b{flex:1;font:800 15px/1 Manrope, system-ui, sans-serif;color:var(--t461-tx)}
.t461-fechas form{margin:0}
.t461-fecha-ico{width:34px;height:34px;border-radius:50%;display:grid;place-items:center}
.t461-fecha-ico svg{width:18px;height:18px}
.t461-otro{margin-top:14px;border-top:1px solid var(--t461-borde);padding-top:12px}
.t461-otro summary{cursor:pointer;font:800 14px/1.2 Manrope, system-ui, sans-serif;color:var(--t461-azul-tx)}
.t461-otro form{margin-top:12px}
.t461-ajuste.nivel-1 .t461-ico{background:var(--t461-rojo-f)!important;color:var(--t461-rojo)!important}
.t461-ajuste.nivel-3 .t461-ico{background:var(--t461-verde-f)!important;color:var(--t461-verde)!important}

/* calendario: HOY bien marcado y el día de regla distinto */
.t461-cal .cl-mes{margin-bottom:6px}
html body .ciclo-d.t461-hoy{background:var(--t461-azul)!important;color:#fff!important;font-weight:800!important;
  box-shadow:0 8px 18px -8px rgba(31,91,255,.7)!important;outline:0!important;border-color:transparent!important;z-index:1}
html body .ciclo-d.t461-hoy::before{content:"HOY";position:absolute;bottom:2px;left:0;right:0;text-align:center;
  font:800 7.5px/1 Manrope, system-ui, sans-serif;letter-spacing:.06em;color:#fff;opacity:.95}
html body .ciclo-d.es-regla{outline:0!important;box-shadow:inset 0 0 0 2px var(--t461-rosa)!important}
html body .ciclo-d.es-regla::after{content:""!important;position:absolute;top:3px;right:3px;left:auto;bottom:auto;width:8px;height:10px;
  background:var(--t461-rosa)!important;border-radius:50% 50% 50% 50% / 60% 60% 40% 40%;clip-path:polygon(50% 0, 100% 60%, 85% 100%, 15% 100%, 0 60%);
  inset:3px 3px auto auto}
html body .ciclo-d.t461-hoy.es-regla{box-shadow:inset 0 0 0 2px #fff, 0 8px 18px -8px rgba(31,91,255,.7)!important}
html body .ciclo-d.t461-hoy.es-regla::after{background:#fff!important}
.t461-leyenda{display:flex;gap:16px;margin:12px 0 4px;font:700 12.5px/1 Manrope, system-ui, sans-serif;color:var(--t461-tx)}
.t461-leyenda span{display:inline-flex;align-items:center;gap:6px}
.t461-leyenda i{width:16px;height:16px;border-radius:5px;display:inline-block}
.t461-l-hoy{background:var(--t461-azul)}
.t461-l-regla{box-shadow:inset 0 0 0 2px var(--t461-rosa);background:var(--t461-rosa-f)}

/* ================= 10) entrada (login): fondo claro y tarjeta de la referencia ================= */
html body .splash-card{border:1px solid var(--t461-borde)!important;border-radius:28px!important;box-shadow:var(--t461-sombra)!important}
html body .splash-card .btn-primary{border-radius:16px!important;box-shadow:var(--t461-sombra-azul)!important}
html body .splash-card .btn-outline{border-radius:16px!important}
html body .splash-card label{letter-spacing:.06em!important;padding-left:.04em}
html body .splash-card :is(input[type=email], input[type=password], input[type=text]){border-radius:14px!important}

@media (prefers-reduced-motion:reduce){.t461-op, .t461-chip > span{transition:none}}

/* app.css pone «form label{margin:16px 0 6px}»: en rejillas descolocaba una de cada dos opciones */
html body main :is(.t461-chip, .t461-ener-op, .t461-op, .t461-acepto, .t461-campo, .sh-chapa){margin:0!important}
.t461-ener{align-items:stretch}

/* ================= 11) Inicio · «Tu ciclo» (encuesta del día) con las piezas de la referencia ================= */
html body main .cic-preg{display:flex!important;align-items:center;gap:8px;font:800 12.5px/1.3 Manrope, system-ui, sans-serif!important;
  letter-spacing:.06em;text-transform:uppercase;color:var(--t461-azul-tx)!important;padding-left:.04em}
html body main .cic-preg > span{width:26px;height:26px;min-width:26px;border-radius:9px;display:grid;place-items:center;border:0!important;
  background:var(--t461-suave)!important;color:var(--t461-azul)!important;font:800 12px/1 Manrope, system-ui, sans-serif}
html body main .cic-preg em{display:block;text-transform:none;letter-spacing:0;font:500 12.5px/1.3 Manrope, system-ui, sans-serif;color:var(--t461-tx2)}
html body main .cic-bt{display:grid!important;grid-template-columns:repeat(3, minmax(0, 1fr));gap:10px}
html body main .cic-b{margin:0!important;border-radius:18px!important;border:1px solid transparent!important;box-shadow:none!important}
html body main .cic-b:nth-child(1){background:var(--t461-rojo-f)!important;--c:var(--t461-rojo)}
html body main .cic-b:nth-child(2){background:var(--t461-suave)!important;--c:var(--t461-azul)}
html body main .cic-b:nth-child(3){background:var(--t461-verde-f)!important;--c:var(--t461-verde)}
html body main .cic-b:has(input:checked){border-color:var(--c)!important;box-shadow:inset 0 0 0 1px var(--c)!important}
html body main :is(.cic-b, .cic-ya) .cic-pila i.lleno{background:var(--c, var(--t461-azul))!important}
html body main .cic-ya:has(.cic-pila i:nth-child(2).lleno){--c:var(--t461-azul)}
html body main .cic-ya:has(.cic-pila i:nth-child(3).lleno){--c:var(--t461-verde)}
html body main .cic-ya:not(:has(.cic-pila i:nth-child(2).lleno)){--c:var(--t461-rojo)}
html body main .cic-mol{display:grid!important;grid-template-columns:repeat(2, minmax(0, 1fr));gap:10px}
html body main .cic-mol label{margin:0!important;display:block;min-width:0}
html body main .cic-mol label span{display:flex!important;align-items:center;justify-content:center;text-align:center;width:100%;
  min-height:46px;box-sizing:border-box;padding:8px 10px!important;border-radius:14px!important;white-space:normal!important;
  border:1px solid var(--t461-borde2)!important;background:var(--t461-card)!important;color:var(--t461-tx)!important;font-weight:700!important}
html body main .cic-mol label input:checked + span{background:var(--t461-suave)!important;border-color:var(--t461-azul)!important;
  color:var(--t461-azul-tx)!important;box-shadow:inset 0 0 0 1px var(--t461-azul)}
/* energía «Normal» en azul también en los puntos del calendario y la leyenda (antes amarillo) */
html body .ener-n2{background:var(--t461-azul)!important}
html body .ener-n1{background:var(--t461-rojo)!important}
html body .ener-n3{background:var(--t461-verde)!important}

/* hoy en el calendario: t453 pinta la fase con «:root[data-tema] body .ciclo-d.f-x !important»; esto pesa más */
html:root body main .ciclo-rej .ciclo-d.t461-hoy{background:var(--t461-azul)!important;background-image:none!important;color:#fff!important;
  box-shadow:0 8px 18px -8px rgba(31,91,255,.75)!important;font-weight:800!important}
html:root body main .ciclo-rej .ciclo-d.t461-hoy.es-regla{box-shadow:inset 0 0 0 2px #fff, 0 8px 18px -8px rgba(31,91,255,.75)!important}
html:root body main .ciclo-rej .ciclo-d.es-regla:not(.t461-hoy){box-shadow:inset 0 0 0 2px var(--t461-rosa)!important;color:var(--t461-rosa)!important;font-weight:800!important}
.t461-card form > .t461-continuar + *, .t461-card form + .t461-info{margin-top:4px}
.t461-card form + .t461-info{margin-top:14px!important}

/* Perfil: «Elegir de la galería» se salía por la derecha en 390 px */
html body main .pf-foto-btns{display:grid!important;grid-template-columns:repeat(2, minmax(0, 1fr));gap:10px}
html body main .pf-foto-btns .btn{min-width:0;white-space:normal!important;text-align:center;line-height:1.2!important;
  padding:8px 10px!important;gap:8px;font-size:14px!important;background:var(--t461-card)!important}
html body main .pf-foto-btns .btn svg{flex:none}

/* ================= 12) etiquetas pequeñas de sección: azul y en mayúsculas, como «CAMBIAR DE MOMENTO» ================= */
html body main :is(.vt-etq, .pr-etq, .pg-etq:not(.ok):not(.baja), .n7-et, .vida-et, .hoy-etq, .cic-etq, .gn-et, .ar-etq, .vb-et,
  .pf-h, .mg-etq, .hs-etq, .fx-et, .fs-et, .dia-etq, .pg-kpi .k-t){
  font:800 11.5px/1.3 Manrope, system-ui, sans-serif!important;letter-spacing:.08em!important;text-transform:uppercase!important;
  color:var(--t461-azul-tx)!important;padding:0 .12em 0 .04em;overflow:visible!important}
/* dentro de tarjetas azules (Te toca, Plan Premium...) la etiqueta se queda blanca */
html body main :is(.mg-accion, .r10-te-toca, .t433-plan.prem) :is(.mg-etq, .mg-rot, .t453-n, .hoy-etq){color:rgba(255,255,255,.85)!important}

/* cabecera de tarjeta con título debajo (Feedback de Miguel / Todavía no hay ninguno): el rótulo pasa a ser la
   etiqueta azul en mayúsculas con su número, y el título va en negrita grande, como en la referencia */
html body main .mg-cabt:has(.mg-tt) .min-w-0 > :is(.t453-n, .mg-rot){display:inline!important}
html body main .mg-cabt:has(.mg-tt) .t453-n{margin-right:6px}
html body main .mg-cabt:has(.mg-tt) .mg-rot{font:800 11.5px/1.3 Manrope, system-ui, sans-serif!important;letter-spacing:.08em!important;
  text-transform:uppercase!important;color:var(--t461-azul-tx)!important}
html body main .mg-cabt:has(.mg-tt) .mg-tt{display:block;margin-top:4px;font:800 20px/1.22 Manrope, system-ui, sans-serif!important;color:var(--t461-tx)}

/* Perfil > Apariencia: el tema elegido se leía blanco sobre azul claro */
html body main [data-tema-op]{background:var(--t461-card)!important;border:1px solid var(--t461-borde2)!important;color:var(--t461-tx)!important}
html body main [data-tema-op].on{background:var(--t461-suave)!important;border-color:var(--t461-azul)!important;color:var(--t461-azul-tx)!important;
  box-shadow:inset 0 0 0 1px var(--t461-azul)!important}
html body main [data-tema-op] :is(svg, .ic-m){color:currentColor}