:root{
  --tinta:#F2F8FC; --suave:#A9BCCD; --tenue:#8296A9;
  --v-fondo:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,0) 46%),linear-gradient(150deg,rgba(26,39,53,.82),rgba(12,19,27,.7));
  --v-suave:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,0) 60%),linear-gradient(150deg,rgba(23,34,46,.66),rgba(13,20,29,.52));
  --v-borde:rgba(125,212,240,.2);
  --v-borde-fuerte:rgba(125,212,240,.5);
  --v-luz:inset 0 1px 0 rgba(255,255,255,.09),inset 0 -1px 0 rgba(0,0,0,.28);
  --v-sombra:0 1.375rem 3rem -1.125rem rgba(0,0,0,.72),0 2px 0.375rem rgba(0,0,0,.28);
  --v-brillo:0 0 0 1px rgba(0,180,224,.3),0 0.875rem 2.125rem -0.625rem rgba(0,180,224,.5);
  --v-flecha:#131d28;
  --v-blur:blur(0.875rem) saturate(1.45);
  --v-titulo:#F6FBFE;
  --v-verde:linear-gradient(180deg,#2DE57F,#17B35A);
  --v-cian:linear-gradient(180deg,#27C9EF,#0098C4);
}
html[data-tema=claro]{
  --v-fondo:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.62));
  --v-suave:linear-gradient(180deg,rgba(255,255,255,.88),rgba(255,255,255,.62));
  --v-borde:rgba(0,100,127,.17);
  --v-borde-fuerte:rgba(0,121,160,.5);
  --v-luz:inset 0 1px 0 #fff;
  --v-sombra:0 1.125rem 2.5rem -1.125rem rgba(20,60,90,.38),0 1px 0.1875rem rgba(20,60,90,.12);
  --v-brillo:0 0 0 1px rgba(0,121,160,.32),0 0.75rem 1.75rem -0.625rem rgba(0,121,160,.42);
  --v-flecha:#fbfdff;
  --v-titulo:var(--tinta);
  --v-verde:linear-gradient(180deg,#139A55,#0C7A40);
  --v-cian:linear-gradient(180deg,#0A8DB8,#00709A);
}

.globo,.t-globo,.tarjeta,.pie-dato,.item,.aviso,.hoja,.nodite-aviso,.pieza,.ficha-cab{
  background:var(--v-fondo); border:1px solid var(--v-borde);
  box-shadow:var(--v-luz),var(--v-sombra);
  -webkit-backdrop-filter:var(--v-blur); backdrop-filter:var(--v-blur);
}
.globo::before,.t-globo::before{background:var(--v-flecha); border-color:var(--v-borde)}
.ficha-cab{padding:0.75rem; border-radius:0.875rem}

.op:not(.op--wa2),.t-resp:not(.t-resp--volver),.pager button,.parte-btn,.chip,.producto,.red,.libro,.tema,.cats-cruz a{
  background:var(--v-suave); border:1px solid var(--v-borde);
  box-shadow:var(--v-luz);
  -webkit-backdrop-filter:blur(0.625rem); backdrop-filter:blur(0.625rem);
  transition:border-color .16s,box-shadow .16s,transform .16s,color .16s;
}
.op:not(.op--wa2):hover,.t-resp:not(.t-resp--volver):hover,.parte-btn:hover,.chip:hover,.producto:hover,.red:hover,.libro:hover,.tema:hover,.cats-cruz a:hover,.pie-dato:hover{
  border-color:var(--v-borde-fuerte); box-shadow:var(--v-luz),var(--v-brillo); transform:translateY(-1px);
}
.op:focus-visible,.t-resp:focus-visible,.accion:focus-visible{outline:2px solid var(--cian2); outline-offset:0.1875rem}
.parte-btn[aria-pressed=true],.chip[aria-pressed=true]{border-color:var(--v-borde-fuerte); box-shadow:var(--v-luz),var(--v-brillo)}
.t-resp--volver,.pager button:disabled{box-shadow:none}

.accion--primaria{background:var(--v-cian); color:#031219; border:1px solid rgba(255,255,255,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 0.75rem 1.625rem -0.625rem rgba(0,180,224,.7)}
html[data-tema=claro] .accion--primaria{color:#fff}
.accion--wa,.pie-wa,.btn--wa,.btn--wa2,.op--wa2{background:var(--v-verde); color:#04210F; border:1px solid rgba(255,255,255,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 0.75rem 1.625rem -0.625rem rgba(37,211,102,.7)}
html[data-tema=claro] .accion--wa,html[data-tema=claro] .pie-wa,html[data-tema=claro] .btn--wa{color:#fff}
.op--wa2{color:var(--waTexto)!important;
  background:linear-gradient(150deg,rgba(37,211,102,.2),rgba(14,38,28,.6));
  border:1px solid rgba(37,211,102,.4); box-shadow:var(--v-luz),0 0.625rem 1.625rem -0.75rem rgba(37,211,102,.55)}
.op--wa2 small{color:inherit; opacity:.85}
.accion:not(.accion--primaria):not(.accion--wa){background:var(--v-suave); border:1px solid var(--v-borde)}
.accion:not(.accion--primaria):not(.accion--wa):hover{border-color:var(--v-borde-fuerte); box-shadow:var(--v-luz),var(--v-brillo)}

h1{color:var(--v-titulo); letter-spacing:-.015em}
html:not([data-tema=claro]) h1 span{text-shadow:0 0 1.875rem rgba(0,180,224,.5)}
html:not([data-tema=claro]) .entrada h1 span,html:not([data-tema=claro]) .nodite h1 span{text-shadow:0 0 2.125rem rgba(0,180,224,.55)}
.lista b,.dice b{text-shadow:0 0 1.125rem rgba(0,180,224,.25)}

html:not([data-tema=claro]) .fig,html:not([data-tema=claro]) .nodite-img,html:not([data-tema=claro]) .figuron img{
  filter:drop-shadow(0 1.375rem 1.875rem rgba(0,0,0,.6)) drop-shadow(0 0 1.625rem rgba(0,180,224,.2));
}

.foto{box-shadow:var(--v-luz),0 0.875rem 1.875rem -0.875rem rgba(0,0,0,.6); border-color:var(--v-borde)}
.etiquetas span,.pill{background:var(--v-suave); border-color:var(--v-borde)}
.etiquetas .estado-etq,.pill--ok{background:var(--waFondo); border-color:var(--waBorde)}
.parte h2{text-shadow:0 0 1rem rgba(0,180,224,.3)}
.pie{background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,0)); backdrop-filter:blur(0.375rem)}

@media (prefers-reduced-transparency:reduce){
  .globo,.t-globo,.tarjeta,.pie-dato,.item,.aviso,.hoja,.nodite-aviso,.pieza,.ficha-cab,.op,.t-resp,.parte-btn,.chip,.producto{
    -webkit-backdrop-filter:none; backdrop-filter:none; background:var(--panel)}
}