@layer components{.glass{--glass-tint:color-mix(in oklab, var(--color-hueso) 58%, transparent);--glass-edge:color-mix(in oklab, var(--color-hueso) 70%, transparent);--glass-specular:rgb(from var(--color-hueso) r g b / .7);--glass-shadow:rgb(from var(--color-negro) r g b / .08);isolation:isolate;background:var(--glass-tint);-webkit-backdrop-filter:blur(18px)saturate(160%);backdrop-filter:blur(18px)saturate(160%);border:1px solid var(--glass-edge);box-shadow:inset 0 1px 0 var(--glass-specular), 0 10px 30px var(--glass-shadow);transition:background var(--duration-fast) var(--ease-out-expo), box-shadow var(--duration-fast) var(--ease-out-expo);position:relative}.glass:before{content:"";z-index:-1;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg, var(--glass-specular) 0, transparent 24px);opacity:.5;position:absolute;inset:0}.glass--bar{height:var(--nav-height);border-radius:999px;align-items:center;padding:0 1.25rem;display:flex}.glass--pill{font-family:var(--font-sans);letter-spacing:.01em;color:var(--color-negro);border-radius:999px;justify-content:center;align-items:center;padding:.75rem 1.25rem;font-size:.875rem;font-weight:500;line-height:1;display:inline-flex}button.glass--pill,a.glass--pill{cursor:pointer}.glass--pill:hover{--glass-tint:color-mix(in oklab, var(--color-hueso) 78%, transparent)}button.glass--pill:active,a.glass--pill:active{transform:scale(.98)}.glass--pill:disabled{opacity:.5;cursor:default;transform:none}.glass--panel{border-radius:28px;padding:1.5rem}.glass--card{border-radius:20px}.glass--refract:before{filter:url(#freddi-glass)}@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.glass{--glass-tint:color-mix(in oklab, var(--color-hueso) 94%, var(--color-negro));-webkit-backdrop-filter:none;backdrop-filter:none}.glass--pill:hover{--glass-tint:color-mix(in oklab, var(--color-hueso) 88%, var(--color-negro))}.glass--refract:before{filter:none}}}
