.magic-bento{min-width:0;color:var(--foreground);container-type:inline-size}.magic-bento__grid{grid-template-columns:repeat(var(--mb-columns,4), minmax(0, 1fr));grid-auto-rows:var(--mb-row-height,200px);gap:var(--mb-gap,12px);display:grid}.magic-bento__cell{grid-column:span min(var(--mb-columns,4), var(--mb-col-span,1));grid-row:span var(--mb-row-span,1);min-width:0;min-height:0}.magic-bento__card{--mb-near:0;--mb-hot:0;--mb-wa:0;--mb-wr:0px;isolation:isolate;border:1px solid var(--border);border-radius:var(--mb-radius,20px);background:var(--card);width:100%;min-width:0;height:100%;color:inherit;flex-direction:column;text-decoration:none;display:flex;position:relative;overflow:hidden}.magic-bento__card:focus-visible{outline:2px solid var(--foreground);outline-offset:3px}.magic-bento__border,.magic-bento__light{border-radius:inherit;pointer-events:none;position:absolute;inset:0}.magic-bento__border{z-index:2;background:radial-gradient(circle at var(--mb-wx,50%) var(--mb-wy,50%), transparent max(0px, calc(var(--mb-wr) - 45px)), color-mix(in oklch, var(--foreground) calc(var(--mb-wa) * 65%), transparent) var(--mb-wr), transparent calc(var(--mb-wr) + 45px));mask:linear-gradient(var(--foreground) 0 0) content-box, linear-gradient(var(--foreground) 0 0);padding:1px;mask-composite:exclude}.magic-bento__light{z-index:-1;opacity:0;background:radial-gradient(circle var(--mb-spotlight-radius,300px) at var(--mb-x,50%) var(--mb-y,50%), color-mix(in oklch, var(--foreground) 7%, transparent), transparent 70%)}@container (width<=799px){.magic-bento__grid{grid-template-columns:repeat(min(2, var(--mb-columns,4)), minmax(0, 1fr))}.magic-bento__cell{grid-column:span min(2, var(--mb-col-span,1))}}@container (width<=349px){.magic-bento__grid{grid-template-columns:minmax(0,1fr)}.magic-bento__cell{grid-area:span 1/span 1}}.magic-bento--features .magic-bento__grid,.magic-bento--categories .magic-bento__grid{grid-template-columns:repeat(var(--mb-columns), minmax(0, 1fr))}.magic-bento--features .magic-bento__grid{--mb-columns:1;grid-auto-rows:320px}.magic-bento--features .magic-bento__cell{grid-area:span 1/span 1}.feature-bento-art{background:var(--muted);border-radius:12px;flex:1;min-height:0;margin:12px 12px 0;overflow:hidden}.feature-bento-art img{display:block}.feature-bento-copy{flex:none;padding:20px}@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.feature-bento-art img{transition:transform .4s cubic-bezier(.22,1,.36,1)}.feature-bento-card:hover .feature-bento-art img{transform:scale(1.035)}}.magic-bento--categories .magic-bento__grid{--mb-columns:2}@media (width>=640px){.magic-bento--features .magic-bento__grid{--mb-columns:2;grid-auto-rows:var(--mb-row-height)}.magic-bento--features .magic-bento__cell{grid-column:span min(var(--mb-columns), var(--mb-col-span));grid-row:span var(--mb-row-span)}}@media (width>=1024px){.magic-bento--features .magic-bento__grid,.magic-bento--categories .magic-bento__grid{--mb-columns:4}}@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.magic-bento[data-border-glow]:not([data-disabled]) .magic-bento__border{background:radial-gradient(circle var(--mb-spotlight-radius,300px) at var(--mb-x,50%) var(--mb-y,50%), color-mix(in oklch, var(--foreground) calc(var(--mb-near) * 45%), transparent), transparent 70%), radial-gradient(circle at var(--mb-wx,50%) var(--mb-wy,50%), transparent max(0px, calc(var(--mb-wr) - 45px)), color-mix(in oklch, var(--foreground) calc(var(--mb-wa) * 65%), transparent) var(--mb-wr), transparent calc(var(--mb-wr) + 45px))}.magic-bento[data-spotlight]:not([data-disabled]) .magic-bento__light{opacity:var(--mb-hot)}}@media (prefers-reduced-motion:no-preference){.magic-bento[data-intro]:not([data-disabled]) .magic-bento__grid{animation:.5s ease-out both magic-bento-arrive}}@media (prefers-reduced-motion:reduce){.magic-bento__border,.magic-bento__light{display:none}}.magic-bento[data-disabled] .magic-bento__border,.magic-bento[data-disabled] .magic-bento__light{display:none}@keyframes magic-bento-arrive{0%{transform:translateY(6px)}to{transform:translateY(0)}}
