.play-overlay{z-index:10;background:0 0;border:0;justify-content:center;align-items:center;transition:all .3s;display:flex;position:absolute;inset:0}.play-overlay:focus-visible{outline:2px solid hsl(var(--primary));outline-offset:2px}.play-overlay__backdrop{-webkit-backdrop-filter:blur(2px);background:linear-gradient(#0006,#0000004d,#00000080);transition:background .3s;position:absolute;inset:0}.play-overlay:hover .play-overlay__backdrop{background:linear-gradient(#00000080,#0006,#0009)}.play-overlay__inner{position:relative}.play-overlay__glow{filter:blur(20px);opacity:0;background:linear-gradient(90deg,#10b981,#14b8a6,#06b6d4);border-radius:9999px;transition:opacity .3s;position:absolute;inset:0}.play-overlay:hover .play-overlay__glow{opacity:.6}.play-overlay__circle{background:linear-gradient(to bottom right,#fff,#ecfdf5,#ccfbf1);border:2px solid #34d39980;border-radius:9999px;justify-content:center;align-items:center;transition:transform .3s,box-shadow .3s,border-color .3s,background .3s;display:flex;position:relative;box-shadow:0 25px 50px #00000040}.dark .play-overlay__circle{background:linear-gradient(to bottom right,#1e293b,#064e3b80,#134e4a80);border-color:#34d399b3}.play-overlay:hover .play-overlay__circle{border-color:#10b981;transform:scale(1.1);box-shadow:0 30px 60px #00000059}.dark .play-overlay:hover .play-overlay__circle{border-color:#34d399}.play-overlay--sm .play-overlay__circle{width:3rem;height:3rem}.play-overlay--md .play-overlay__circle{width:4rem;height:4rem}@media (min-width:640px){.play-overlay--md .play-overlay__circle{width:4.5rem;height:4.5rem}}@media (min-width:768px){.play-overlay--md .play-overlay__circle{width:5rem;height:5rem}}.play-overlay--lg .play-overlay__circle{width:5rem;height:5rem}@media (min-width:640px){.play-overlay--lg .play-overlay__circle{width:6rem;height:6rem}}.play-overlay__icon{color:#059669;filter:drop-shadow(0 10px 18px #0003);transition:color .3s,transform .3s}.dark .play-overlay__icon{color:#6ee7b7}.play-overlay:hover .play-overlay__icon{color:#047857}.dark .play-overlay:hover .play-overlay__icon{color:#a7f3d0}.play-overlay--sm .play-overlay__icon{width:1.5rem;height:1.5rem}.play-overlay--md .play-overlay__icon{width:2rem;height:2rem}@media (min-width:768px){.play-overlay--md .play-overlay__icon{width:2.25rem;height:2.25rem}}.play-overlay--lg .play-overlay__icon{width:2.5rem;height:2.5rem}