:root{--cristal-velo:78%;--cristal-desenfoque:20px;--cristal-radio:22px;--cristal-canto:color-mix(in srgb,white 62%,transparent);--cristal-canto-bajo:color-mix(in srgb,white 16%,transparent);--cristal-sombra:color-mix(in srgb,var(--color-marca-700) 34%,transparent);--cristal-sombra-corta:color-mix(in srgb,var(--color-marca-700) 22%,transparent)}@media (prefers-color-scheme:dark){:root{--cristal-velo:82%;--cristal-canto:color-mix(in srgb,white 20%,transparent);--cristal-canto-bajo:color-mix(in srgb,white 6%,transparent);--cristal-sombra:color-mix(in srgb,black 55%,transparent);--cristal-sombra-corta:color-mix(in srgb,black 38%,transparent)}}@layer components{[data-tema=oscuro],[data-theme=dark],html.dark,html.oscuro{--cristal-velo:82%;--cristal-canto:color-mix(in srgb,white 20%,transparent);--cristal-canto-bajo:color-mix(in srgb,white 6%,transparent);--cristal-sombra:color-mix(in srgb,black 55%,transparent);--cristal-sombra-corta:color-mix(in srgb,black 38%,transparent)}[data-tema=claro],[data-theme=light],html.claro{--cristal-velo:78%;--cristal-canto:color-mix(in srgb,white 62%,transparent);--cristal-canto-bajo:color-mix(in srgb,white 16%,transparent);--cristal-sombra:color-mix(in srgb,var(--color-marca-700) 34%,transparent);--cristal-sombra-corta:color-mix(in srgb,var(--color-marca-700) 22%,transparent)}.cristal{--cristal-tinte:var(--color-papel);position:relative;background-color:color-mix(in srgb,var(--cristal-tinte) var(--cristal-velo),transparent);-webkit-backdrop-filter:blur(var(--cristal-desenfoque)) saturate(180%);backdrop-filter:blur(var(--cristal-desenfoque)) saturate(180%);border:1px solid color-mix(in srgb,var(--color-linea) 65%,transparent);border-radius:var(--cristal-radio);box-shadow:inset 0 1px 0 0 var(--cristal-canto),inset 0 -1px 0 0 var(--cristal-canto-bajo),0 18px 40px -20px var(--cristal-sombra),0 2px 10px -6px var(--cristal-sombra-corta);color:var(--color-tinta)}@supports (corner-shape:squircle){.cristal{corner-shape:squircle}}.cristal--denso{--cristal-velo:92%;--cristal-desenfoque:26px}.cristal--ligero{--cristal-velo:62%;--cristal-desenfoque:16px}.cristal--marca{--cristal-tinte:var(--color-marca-50)}.cristal-barra{border-radius:0;border:0;border-bottom:1px solid color-mix(in srgb,var(--color-linea) 75%,transparent);box-shadow:inset 0 1px 0 0 var(--cristal-canto),0 10px 24px -22px var(--cristal-sombra)}.cristal-panel{border-radius:var(--cristal-radio) 0 0 var(--cristal-radio);border-right:0;box-shadow:inset 1px 0 0 0 var(--cristal-canto),-24px 0 60px -30px var(--cristal-sombra)}.cristal-panel--izquierda{border-radius:0 var(--cristal-radio) var(--cristal-radio) 0;border-left:0;border-right:1px solid color-mix(in srgb,var(--color-linea) 65%,transparent);box-shadow:inset -1px 0 0 0 var(--cristal-canto),24px 0 60px -30px var(--cristal-sombra)}.cristal-hoja{--cristal-radio:26px;box-shadow:inset 0 1px 0 0 var(--cristal-canto),0 40px 80px -32px var(--cristal-sombra),0 4px 16px -8px var(--cristal-sombra-corta)}.cristal-pastilla{--cristal-radio:18px;--cristal-velo:88%;box-shadow:inset 0 1px 0 0 var(--cristal-canto),0 22px 44px -22px var(--cristal-sombra),0 2px 8px -5px var(--cristal-sombra-corta)}.cristal-velo{background-color:color-mix(in srgb,var(--color-tinta) 32%,transparent);-webkit-backdrop-filter:blur(3px) saturate(120%);backdrop-filter:blur(3px) saturate(120%)}.cristal-reflejo:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(120px 120px at var(--cristal-x,50%) var(--cristal-y,0),color-mix(in srgb,white 22%,transparent),transparent 70%);opacity:0;transition:opacity .35s ease}.cristal-reflejo:hover:after{opacity:1}@media (prefers-reduced-transparency:reduce){.cristal{background-color:var(--cristal-tinte)}.cristal,.cristal-velo{-webkit-backdrop-filter:none;backdrop-filter:none}.cristal-velo{background-color:color-mix(in srgb,var(--color-tinta) 55%,transparent)}.cristal-reflejo:after{display:none}}@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.cristal{background-color:var(--cristal-tinte)}.cristal-velo{background-color:color-mix(in srgb,var(--color-tinta) 55%,transparent)}}@media (prefers-reduced-motion:reduce){.cristal,.cristal-reflejo:after{transition:none!important}.cristal-entra{animation:none!important}}@keyframes cristal-subir{0%{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}.cristal-entra{animation:cristal-subir .28s cubic-bezier(.22,.9,.3,1) both}}