.magic-bento,.magic-bento-spotlight{--mb-glow-rgb:67 82 225}.magic-bento-card{--glow-x:50%;--glow-y:50%;--glow-intensity:0;--glow-radius:12.5rem;background:linear-gradient(#0b0c0e, #0b0c0e) padding-box, radial-gradient(var(--glow-radius) circle at var(--glow-x) var(--glow-y), rgb(var(--mb-glow-rgb) / calc(var(--glow-intensity) * .9)) 0%, rgb(var(--mb-glow-rgb) / calc(var(--glow-intensity) * .5)) 30%, transparent 60%) border-box, linear-gradient(#292b32, #292b32) border-box;border-color:#0000;transition:box-shadow .3s}.magic-bento-card.is-glowing{box-shadow:0 4px 20px #2e184e66, 0 0 30px rgb(var(--mb-glow-rgb) / .15)}.magic-bento-card h3,.magic-bento-card p{transition:color .3s}.magic-bento-card:hover h3{color:#fff}.magic-bento-card:hover p{color:#e6e6e6}.magic-bento-spotlight{background:radial-gradient(circle, rgb(var(--mb-glow-rgb) / .12) 0%, rgb(var(--mb-glow-rgb) / .06) 15%, rgb(var(--mb-glow-rgb) / .03) 25%, rgb(var(--mb-glow-rgb) / .015) 40%, rgb(var(--mb-glow-rgb) / .008) 65%, transparent 70%);mix-blend-mode:screen;pointer-events:none;opacity:0;z-index:60;border-radius:50%;width:50rem;height:50rem;transition:opacity .25s;position:fixed;top:0;left:0;transform:translate(-50%,-50%)}.magic-bento-particle{background:rgb(var(--mb-glow-rgb));width:.25rem;height:.25rem;box-shadow:0 0 6px rgb(var(--mb-glow-rgb) / .6);pointer-events:none;z-index:25;animation:mb-particle-enter .3s ease both, mb-particle-float var(--mb-dur,3s) ease-in-out .3s infinite alternate;border-radius:50%;position:absolute}@keyframes mb-particle-enter{0%{opacity:0;scale:0}to{opacity:.9;scale:1}}@keyframes mb-particle-float{to{translate:var(--mb-tx,0) var(--mb-ty,-1.5rem);opacity:.3}}.magic-bento-ripple{background:radial-gradient(circle, rgb(var(--mb-glow-rgb) / .4) 0%, rgb(var(--mb-glow-rgb) / .2) 30%, transparent 70%);pointer-events:none;z-index:30;border-radius:50%;animation:.8s ease-out forwards mb-ripple;position:absolute}@keyframes mb-ripple{0%{opacity:1;scale:0}to{opacity:0;scale:1}}@media (prefers-reduced-motion:reduce){.magic-bento-particle,.magic-bento-ripple{display:none}}@property --mb-arc-hover-progress{syntax:"<number>";inherits:false;initial-value:0}@property --mb-arc-hover-blur{syntax:"<length>";inherits:false;initial-value:0}.mb-arc{width:100%;height:100%;position:relative}.mb-channel-orbit{aspect-ratio:1;pointer-events:none;position:absolute;left:50%;translate:-50% -50%}.mb-channel-orbit-outer{width:128.571%;top:164%}.mb-channel-orbit-inner{width:101.224%;top:164%}.mb-channel-orbit-rotator{pointer-events:none;animation:48s linear infinite mb-channel-orbit-spin;position:absolute;inset:0}.mb-channel-orbit-rotator-reverse{animation-direction:reverse}.mb-arc-tile{--mb-arc-hover-blur:0px;--mb-arc-hover-progress:0;aspect-ratio:1;isolation:isolate;background:linear-gradient(194deg, rgb(0 0 0/var(--mb-arc-hover-progress)) 9.88%, rgb(0 0 0/calc(var(--mb-arc-hover-progress) * .1)) 102.69%), linear-gradient(158deg, rgb(23 24 29/calc(1 - var(--mb-arc-hover-progress))) 0%, rgb(10 10 13/calc(1 - var(--mb-arc-hover-progress))) 48%, rgb(6 6 8/calc(1 - var(--mb-arc-hover-progress))) 100%);-webkit-backdrop-filter:blur(var(--mb-arc-hover-blur));backdrop-filter:blur(var(--mb-arc-hover-blur));cursor:pointer;translate:-50% -50%;transform:rotate(var(--mb-tile-rot,0deg));will-change:transform;pointer-events:auto;border:0;border-radius:28.18%;justify-content:center;align-items:center;transition:--mb-arc-hover-blur .25s,--mb-arc-hover-progress .25s,box-shadow .25s,transform .25s;display:flex;position:absolute}.mb-arc-tile:before{content:"";position:absolute;inset:-12.5%}.mb-arc-mascot{aspect-ratio:1;translate:-50% -50%;transform:rotate(var(--mb-tile-rot,0deg));pointer-events:none;position:absolute}.mb-channel-orbit-outer .mb-arc-tile,.mb-channel-orbit-outer .mb-arc-mascot{width:8.73%}.mb-channel-orbit-inner .mb-arc-tile,.mb-channel-orbit-inner .mb-arc-mascot{width:11.09%}.mb-arc-tile:hover,.mb-arc-tile:focus-visible{--mb-arc-hover-blur:2px;--mb-arc-hover-progress:1;transform:rotate(var(--mb-tile-rot,0deg)) scale(1.09091);outline:none}@keyframes mb-channel-orbit-spin{to{transform:rotate(360deg)}}.mb-channel-orbit[data-paused=true] .mb-channel-orbit-rotator,.connect-channel-arc[data-in-view=false] .mb-channel-orbit-rotator{animation-play-state:paused}@media (prefers-reduced-motion:reduce){.mb-channel-orbit-rotator{animation:none}}.magic-bento-card:hover .notify-live-inbox h3,.magic-bento-card:hover .notify-live-inbox p{color:revert-layer}