*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0}:root{--cf-paper: #ebece9;--cf-ink: #16171a;--cf-face: rgba(255, 255, 255, .82);--cf-side: rgba(255, 255, 255, .35);--cf-line: rgba(255, 255, 255, .7);--cf-card-w: 300px;--cf-card-h: 400px;--cf-depth: 340px}.cf{position:relative;min-height:100svh;background:var(--cf-paper);color:var(--cf-ink);font-family:DM Sans,system-ui,sans-serif;-webkit-font-smoothing:antialiased}.cf-stage{position:relative;width:100%;min-height:100svh;display:flex;gap:3rem;align-items:center;justify-content:center;overflow:hidden;padding:2rem}.cf-stage:before{content:"";position:absolute;left:50%;top:50%;width:60vmax;aspect-ratio:1;transform:translate(-50%,-50%);background:radial-gradient(circle,#ffffffe6,#fff0 60%);opacity:.6;pointer-events:none}.cf-card{position:relative;width:var(--cf-card-w);height:var(--cf-card-h);perspective:2000px;flex-shrink:0}.cf-cube{position:relative;width:100%;height:100%;transform-style:preserve-3d;cursor:pointer;transform:translateZ(calc(var(--cf-depth) / -2));will-change:transform}.cf-face{position:absolute;backface-visibility:hidden;border:1px solid var(--cf-line)}.cf-face--front,.cf-face--back{width:var(--cf-card-w);height:var(--cf-card-h);display:flex;flex-direction:column;padding:1.5rem;background:var(--cf-face);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);box-shadow:inset 0 1px #ffffffe6}.cf-face--front{transform:translateZ(calc(var(--cf-depth) / 2))}.cf-face--back{transform:rotateX(180deg) translateZ(calc(var(--cf-depth) / 2))}.cf-face--right,.cf-face--left{width:var(--cf-depth);height:var(--cf-card-h);left:calc((var(--cf-card-w) - var(--cf-depth)) / 2);background:var(--cf-side)}.cf-face--top,.cf-face--bottom{width:var(--cf-card-w);height:var(--cf-depth);top:calc((var(--cf-card-h) - var(--cf-depth)) / 2);background:var(--cf-side)}.cf-face--right{transform:rotateY(90deg) translateZ(calc(var(--cf-card-w) / 2))}.cf-face--left{transform:rotateY(-90deg) translateZ(calc(var(--cf-card-w) / 2))}.cf-face--top{transform:rotateX(90deg) translateZ(calc(var(--cf-card-h) / 2))}.cf-face--bottom{transform:rotateX(-90deg) translateZ(calc(var(--cf-card-h) / 2))}.cf-face--front:after,.cf-face--back:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,#fff0 30%,#ffffff8c,#fff0 70%);background-size:250% 100%;background-position:var(--cf-shine, 100%) 0;pointer-events:none;mix-blend-mode:screen}.cf-thumb{align-self:flex-end;width:125px;height:155px;margin-bottom:auto;object-fit:cover;display:block;border-radius:6px}.cf-title{margin:0 0 .5rem;font-size:2rem;font-weight:500;letter-spacing:-.03em;line-height:1.05}.cf-meta{display:flex;align-items:flex-end;justify-content:space-between;gap:4px}.cf-desc{margin:0;font-size:.9rem;line-height:1.35;opacity:.75}.cf-arrow{width:1.5rem;height:1.5rem;flex-shrink:0}@media(max-width:1000px){.cf{--cf-card-w: 260px;--cf-card-h: 340px;--cf-depth: 280px}.cf-stage{height:auto;flex-direction:column;padding:20svh 1rem}}