.chroma-grid{--x: 50%;--y: 50%;position:relative;display:grid;grid-template-columns:repeat(var(--cols, 3),minmax(0,1fr));gap:clamp(1.5rem,2vw,2.5rem);will-change:transform}.chroma-card{position:relative;border-radius:24px;padding:1px;background:var(--card-gradient, linear-gradient(145deg, #1f2937, #111827));border:1px solid rgba(255,255,255,.1);box-shadow:0 24px 48px #05080f99;transition:transform .5s ease,box-shadow .5s ease}.chroma-card:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(300px circle at var(--mouse-x, 50%) var(--mouse-y, 50%),rgba(148,163,255,.18),transparent 65%);opacity:0;transition:opacity .35s ease}.chroma-card:hover:after,.chroma-card:focus-visible:after,.chroma-card:focus:after{opacity:1}.chroma-card:focus-visible{outline:2px solid rgba(147,197,253,.8);outline-offset:4px}.chroma-card .flip-front,.chroma-card .flip-back{background:#090c14d9;border-radius:22px}.chroma-img-wrapper{position:relative;border-radius:22px;overflow:hidden;isolation:isolate;border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(18px);aspect-ratio:3 / 4;width:100%;flex-shrink:0}.chroma-img-wrapper:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at top,rgba(148,163,255,.18),transparent 70%);pointer-events:none}.chroma-img-wrapper img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;filter:saturate(1.07) contrast(1.04) brightness(1.02)}.chroma-info{text-align:left;padding:0;margin-top:.5rem;color:#e5e7eb;display:flex;flex-direction:column;gap:.35rem}.chroma-info .name{font-size:1.1rem;font-weight:600;color:#f9fafb}.chroma-info .handle{font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:#94a3ffcc}.chroma-info .role{font-size:.95rem;color:#e2e8f0d9}.chroma-overlay{position:absolute;inset:-120px;background:radial-gradient(circle,#4f46e52e,#4c7cf500 55%);filter:blur(120px);opacity:.8;pointer-events:none}.chroma-fade{position:absolute;inset:0;background:radial-gradient(circle at var(--x, 50%) var(--y, 50%),rgba(8,12,20,0) 0%,rgba(8,12,20,.7) 65%);pointer-events:none;transition:opacity .6s ease}.chroma-compact .chroma-fade{opacity:.25}.chroma-grid:before{content:"";position:absolute;inset:12%;background:radial-gradient(circle at var(--x, 50%) var(--y, 50%),rgba(139,92,246,.12),transparent 60%);filter:blur(80px);opacity:.6;pointer-events:none;transition:opacity .4s ease}@media (max-width: 1024px){.chroma-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 768px){.chroma-grid{grid-template-columns:1fr}}.flip-root{perspective:1200px}.flip-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1)}.flip-root.is-flipped .flip-inner{transform:rotateY(180deg)}.no-3d .flip-inner,.no-3d.is-flipped .flip-inner{transform:none!important}.flip-front,.flip-back{position:relative;backface-visibility:hidden;-webkit-backface-visibility:hidden;min-height:360px;border-radius:20px;overflow:hidden}.chroma-compact{gap:clamp(1rem,1.5vw,1.75rem);max-width:1000px;margin:0 auto}.chroma-compact .flip-front,.chroma-compact .flip-back{min-height:260px}.chroma-compact .chroma-img-wrapper{aspect-ratio:1 / 1.15}.chroma-compact .flip-front{padding:.75rem;gap:.75rem}.chroma-compact .chroma-info .name{font-size:1rem}.chroma-compact .chroma-info .role{font-size:.85rem}.flip-front{display:flex;flex-direction:column;padding:clamp(1rem,1.6vw,1.3rem);gap:clamp(1rem,1.8vw,1.4rem);height:100%}.flip-front .chroma-img-wrapper{flex:1 1 auto}.flip-front .chroma-info{margin-top:auto}.flip-back{position:absolute;inset:0;padding:14px;transform:rotateY(180deg);background:#0a0c14e6;border:1px solid #333}.back-content{display:grid;gap:.5rem;color:#e6eaf5}.back-content .bio{color:#cbd5e1}.back-content .fun{color:#a0aec0;font-style:italic}.back-content .links{display:flex;gap:.75rem;flex-wrap:wrap}.back-content .links a{font-size:.875rem;color:#93c5fd;text-decoration:underline}.back-content .close{margin-top:.5rem;background:transparent;color:#e5e7eb;border:1px solid #4b5563;border-radius:10px;padding:.375rem .75rem}@media (prefers-reduced-motion: reduce){.flip-inner{transition:none}.flip-root.is-flipped .flip-front{display:none}.flip-root.is-flipped .flip-back{position:relative;inset:unset;transform:none}.flip-root.is-flipped .flip-inner{transform:none}}