@layer theme,base;@layer components{.scene-grid{grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:1rem;padding:0;list-style:none;display:grid}.scene-card{aspect-ratio:4/5;border:1px solid oklch(from var(--color-gray-700) l c h / .7);background:var(--color-gray-900);transition:transform var(--duration-slow) ease, border-color var(--duration-slow) ease, box-shadow var(--duration-slow) ease;border-radius:.875rem;text-decoration:none;display:block;position:relative;overflow:hidden}.scene-card.is-skeleton{background:oklch(from var(--color-gray-800) l c h / .6)}.scene-card-img{object-fit:cover;width:100%;height:100%;transition:transform var(--duration-slow) ease;position:absolute;inset:0}.scene-card-fallback{background:linear-gradient(to bottom right, var(--color-gray-800), var(--color-gray-900))}.scene-card-shade{background:linear-gradient(#00000059 0%,#00000026 38%,#000000b8 68%,#000000eb 100%);background:linear-gradient(lab(0% 0 0/.35) 0%,lab(0% 0 0/.15) 38%,lab(0% 0 0/.72) 68%,lab(0% 0 0/.92) 100%);position:absolute;inset:0}.scene-card-tag{letter-spacing:.04em;text-transform:uppercase;color:var(--color-gray-200);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0000008c;background:lab(0% 0 0/.55);border:1px solid #ffffff24;border:1px solid lab(100% 0 0/.14);border-radius:9999px;padding:.15rem .55rem;font-size:.6875rem;font-weight:600;position:absolute;top:.625rem;left:.625rem}.scene-card-body{inset-inline:0;flex-direction:column;gap:.3rem;padding:.875rem;display:flex;position:absolute;bottom:0}.scene-card-title{color:var(--color-white);text-shadow:0 1px 3px #0009;text-shadow:0 1px 3px lab(0% 0 0/.6);font-size:1.0625rem;font-weight:700;line-height:1.2}.scene-card-premise{color:var(--color-gray-200);-webkit-line-clamp:3;-webkit-box-orient:vertical;font-size:.8125rem;line-height:1.35;display:-webkit-box;overflow:hidden}.scene-card-cta{background:linear-gradient(to right, var(--color-brand-primary), var(--color-brand-secondary));color:var(--color-white);opacity:.85;transition:opacity var(--duration-slow) ease, transform var(--duration-slow) ease;border-radius:9999px;align-self:flex-start;align-items:center;gap:.3rem;margin-top:.4rem;padding:.3rem .8rem;font-size:.75rem;font-weight:600;display:inline-flex}.scene-card-cta:after{content:"→"}@media (hover:hover){.scene-card-cta{opacity:0;transform:translateY(.35rem)}.scene-card:hover{border-color:oklch(from var(--color-brand-primary) l c h / .7);box-shadow:var(--shadow-lg);transform:translateY(-3px)}.scene-card:hover .scene-card-img{transform:scale(1.06)}.scene-card:hover .scene-card-cta{opacity:1;transform:translateY(0)}}.scene-card:focus-visible{outline:2px solid var(--color-brand-primary);outline-offset:2px}}@layer utilities;