.chroma-shell{isolation:isolate;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.75rem;width:100%;display:grid;position:relative}@media (width<=1024px){.chroma-shell{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=640px){.chroma-shell{grid-template-columns:1fr;gap:1.25rem}}.chroma-cell{isolation:isolate;border-radius:1.25rem;transition:filter .45s,opacity .45s,transform .45s;position:relative}.chroma-cell:before{content:"";background:radial-gradient(120% 100% at 50% 50%, color-mix(in srgb, var(--card-border) 32%, transparent) 0%, color-mix(in srgb, var(--card-border) 18%, transparent) 35%, color-mix(in srgb, var(--card-border) 6%, transparent) 65%, transparent 100%);filter:blur(22px);z-index:-1;opacity:.85;pointer-events:none;border-radius:1.6rem;transition:opacity .45s;position:absolute;inset:-14px}.chroma-cell>*{z-index:1;box-shadow:inset 0 0 0 1.5px color-mix(in srgb, var(--card-border) 65%, transparent), 0 18px 50px -28px color-mix(in srgb, var(--card-border) 70%, transparent), 0 6px 18px -12px #00000014;border-radius:1.25rem;transition:box-shadow .45s,transform .45s;position:relative;overflow:hidden}.chroma-shell.is-hovering .chroma-cell:not(:hover){filter:grayscale(.85)brightness(.96);opacity:.55}.chroma-shell.is-hovering .chroma-cell:not(:hover):before{opacity:.15}.chroma-cell:hover{z-index:2;transform:translateY(-3px)}.chroma-cell:hover:before{opacity:1}.chroma-cell:hover>*{box-shadow:inset 0 0 0 1.5px color-mix(in srgb, var(--card-border) 90%, transparent), 0 28px 70px -28px color-mix(in srgb, var(--card-border) 80%, transparent), 0 10px 28px -14px #0000002e}@media (prefers-reduced-motion:reduce){.chroma-cell,.chroma-cell:before,.chroma-cell>*{transition:none}}