.vibrant-frame{--vf-accent:#38bdf8;--vf-accent-soft:#38bdf880;--vf-accent-glow:#67b7e8a6;--vf-warm-glow:#b8ecff8c;--vf-shell-angle:-30deg;--vf-radius:1.5rem;--vf-inner-radius:1.375rem;width:100%;height:100%;display:flex;position:relative}.vibrant-frame[data-variant="1"]{--vf-accent:#a78bb8;--vf-accent-soft:#a78bb880;--vf-accent-glow:#a78bb899;--vf-warm-glow:#c8b4dc80;--vf-shell-angle:45deg}.vibrant-frame[data-variant="2"]{--vf-accent:#67b7e8;--vf-accent-soft:#67b7e880;--vf-accent-glow:#38bdf89e;--vf-warm-glow:#b8ecff8c;--vf-shell-angle:-60deg}.vibrant-frame[data-variant="3"]{--vf-accent:#8b9fd4;--vf-accent-soft:#8b9fd480;--vf-accent-glow:#8b9fd499;--vf-warm-glow:#a7bee680;--vf-shell-angle:30deg}.vibrant-frame[data-variant="4"]{--vf-accent:#2dd4bf;--vf-accent-soft:#2dd4bf7a;--vf-accent-glow:#2dd4bf94;--vf-warm-glow:#a7f3e880;--vf-shell-angle:120deg}.vibrant-frame[data-variant="5"]{--vf-accent:#f472b6;--vf-accent-soft:#f472b673;--vf-accent-glow:#f472b68c;--vf-warm-glow:#fbcfe880;--vf-shell-angle:-45deg}.vibrant-frame[data-variant="6"]{--vf-accent:#fbbf24;--vf-accent-soft:#fbbf246b;--vf-accent-glow:#fbbf2485;--vf-warm-glow:#fef3c77a;--vf-shell-angle:75deg}.vibrant-frame[data-variant="7"]{--vf-accent:#a78bfa;--vf-accent-soft:#a78bfa7a;--vf-accent-glow:#a78bfa94;--vf-warm-glow:#ddd6fe80;--vf-shell-angle:-120deg}.vibrant-frame--shape-pill{--vf-radius:9999px;--vf-inner-radius:9999px}.vibrant-frame--shape-panel{--vf-radius:1.25rem;--vf-inner-radius:1.125rem}.vibrant-frame__svg{pointer-events:none;width:0;height:0;position:absolute;overflow:hidden}.vibrant-frame__shell{width:100%;min-height:inherit;border-radius:var(--vf-radius);background:linear-gradient(var(--vf-shell-angle), var(--vf-accent-soft), transparent, var(--vf-accent-soft)), linear-gradient(to bottom, #081028e0, #081028eb);flex:1;padding:2px;display:flex;position:relative;overflow:hidden}.vibrant-frame__frame{pointer-events:none;position:absolute;inset:0}.vibrant-frame__border-outer{border:2px solid var(--vf-accent-soft);border-radius:var(--vf-inner-radius);padding-bottom:4px;padding-right:4px;position:absolute;inset:2px}.vibrant-frame__main-card{border:2px solid var(--vf-accent);border-radius:var(--vf-inner-radius);filter:var(--vf-filter);margin-top:-4px;margin-left:-4px;position:absolute;inset:0}.vibrant-frame__glow-1{border:2px solid var(--vf-warm-glow);border-radius:var(--vf-inner-radius);filter:blur(1px);position:absolute;inset:2px}.vibrant-frame__glow-2{border:2px solid var(--vf-accent-glow);border-radius:var(--vf-inner-radius);filter:blur(4px);position:absolute;inset:2px}.vibrant-frame__overlay-1,.vibrant-frame__overlay-2{border-radius:var(--vf-radius);mix-blend-mode:overlay;filter:blur(16px);pointer-events:none;background:linear-gradient(-30deg,#ffffffd9,#0000 30% 70%,#ffffffd9);position:absolute;inset:0;transform:scale(1.06)}.vibrant-frame__overlay-1{opacity:.85}.vibrant-frame__overlay-2{opacity:.4}.vibrant-frame__bg-glow{border-radius:var(--vf-radius);filter:blur(32px);opacity:.28;z-index:0;pointer-events:none;background:linear-gradient(-30deg, var(--vf-accent-glow), transparent, var(--vf-accent));position:absolute;inset:0;transform:scale(1.06)}.vibrant-frame__content{z-index:1;width:100%;min-height:inherit;flex-direction:column;flex:1;display:flex;position:relative}.vibrant-frame:hover,.vibrant-frame:focus-within{transform:translateY(-3px)}.vibrant-frame:hover .vibrant-frame__bg-glow,.vibrant-frame:focus-within .vibrant-frame__bg-glow{opacity:.42}.vibrant-frame:hover .vibrant-frame__glow-2,.vibrant-frame:focus-within .vibrant-frame__glow-2{filter:blur(6px)}.vibrant-frame--static:hover,.vibrant-frame--static:focus-within{transform:none}.vibrant-frame--static:hover .vibrant-frame__bg-glow,.vibrant-frame--static:focus-within .vibrant-frame__bg-glow{opacity:.28}.vibrant-frame--static:hover .vibrant-frame__glow-2,.vibrant-frame--static:focus-within .vibrant-frame__glow-2{filter:blur(4px)}.vibrant-frame--interactive{cursor:pointer;transition:transform .35s cubic-bezier(.22,1,.36,1)}.vibrant-frame--interactive:hover,.vibrant-frame--interactive:focus-within{transform:translateY(-5px)}@keyframes vf-snowflake-glow-pulse{0%,to{opacity:.45;transform:scale(.92)}50%{opacity:.95;transform:scale(1.08)}}@keyframes vf-snowflake-icon-shine{0%,to{filter:drop-shadow(0 0 6px #b8ecff8c)drop-shadow(0 0 14px #38bdf859);opacity:.88}50%{filter:drop-shadow(0 0 10px #ffffffd9)drop-shadow(0 0 22px #38bdf8a6)drop-shadow(0 0 34px #b8ecff73);opacity:1}}@keyframes vf-snowflake-shine-sweep{0%{opacity:0;transform:translate(-130%)rotate(22deg)}18%{opacity:.85}45%{opacity:0;transform:translate(130%)rotate(22deg)}to{opacity:0;transform:translate(130%)rotate(22deg)}}@keyframes vf-snowflake-float{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-3px)rotate(6deg)}}.vibrant-frame__snowflake{z-index:3;pointer-events:none;width:3.25rem;height:3.25rem;animation:5s ease-in-out infinite vf-snowflake-float;position:absolute;top:.65rem;right:.65rem}.vibrant-frame--snowflake-sm .vibrant-frame__snowflake{width:2.25rem;height:2.25rem;top:.45rem;right:.45rem}.vibrant-frame__snowflake-glow{background:radial-gradient(circle, #b8ecff8c 0%, var(--vf-accent-glow) 38%, transparent 72%);filter:blur(6px);border-radius:50%;animation:2.8s ease-in-out infinite vf-snowflake-glow-pulse;position:absolute;inset:-35%}.vibrant-frame__snowflake-shine{mix-blend-mode:screen;border-radius:50%;position:absolute;inset:0;overflow:hidden}.vibrant-frame__snowflake-shine:after{content:"";background:linear-gradient(115deg,#0000 42%,#fffffff2 50%,#0000 58%);animation:3.6s ease-in-out infinite vf-snowflake-shine-sweep;position:absolute;inset:-60%}.vibrant-frame__snowflake-icon{z-index:1;object-fit:contain;mix-blend-mode:screen;width:100%;height:100%;animation:2.8s ease-in-out infinite vf-snowflake-icon-shine;position:relative}.vibrant-frame:hover .vibrant-frame__snowflake-icon,.vibrant-frame:focus-within .vibrant-frame__snowflake-icon{animation-duration:1.8s}.vibrant-frame:hover .vibrant-frame__snowflake-glow,.vibrant-frame:focus-within .vibrant-frame__snowflake-glow{animation-duration:1.6s}@media (prefers-reduced-motion:reduce){.vibrant-frame,.vibrant-frame--interactive{transition:none}.vibrant-frame:hover,.vibrant-frame:focus-within,.vibrant-frame--interactive:hover,.vibrant-frame--interactive:focus-within{transform:none}.vibrant-frame__snowflake,.vibrant-frame__snowflake-glow,.vibrant-frame__snowflake-icon,.vibrant-frame__snowflake-shine:after{animation:none}.vibrant-frame__snowflake-icon{filter:drop-shadow(0 0 8px #b8ecff99);opacity:.95}}