.shell{flex-direction:column;min-height:100dvh;display:flex}.shell .site-header{max-width:1160px;padding-block:16px 8px}.shell .wordmark{font-family:var(--font-mono);letter-spacing:0;color:var(--ink-3);font-size:13px}.shell .wordmark:hover{color:var(--ink-2)}.shell .icon-button{color:var(--ink-3);background:0 0}.shell .site-footer{font-family:var(--font-mono);letter-spacing:0;font-size:12px}.shelf-screen{flex-direction:column;flex:1;justify-content:center;width:100%;max-width:1160px;margin:0 auto;padding-block:clamp(12px,3vh,40px) 32px;display:flex}.shelf,.shelf__row{margin:0;padding:0;list-style:none}.shelf{align-items:flex-end;gap:20px;display:flex}.shelf__hero{flex:1.6 1 0;min-width:0}.shelf__warmups{flex-direction:column;flex:3 1 0;gap:12px;min-width:0;display:flex}.shelf__label{color:var(--ink-3);letter-spacing:0;padding-left:4px;font-size:12px}.shelf__row{gap:20px;display:flex}.shelf__row>li{flex:1 1 0;min-width:0}.shelf li{animation:shelf-in .62s var(--ease-out) both}.shelf__row>li:first-child{animation-delay:80ms}.shelf__row>li:nth-child(2){animation-delay:.14s}.shelf__row>li:nth-child(3){animation-delay:.2s}@keyframes shelf-in{0%{opacity:0;transform:translateY(18px)scale(.985)}}.scard{--lift:0px;aspect-ratio:4/5;background:var(--raised);color:var(--ink);isolation:isolate;transform:translate3d(var(--part,0px), var(--lift), 0);transition:transform .52s var(--ease-out), box-shadow .52s var(--ease-out);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;border-radius:22px;text-decoration:none;display:block;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ece9e20a;container-type:inline-size}.scard--hero{border-radius:28px}.scard[data-active=true]{--lift:-8px;box-shadow:inset 0 0 0 1px #ece9e212,0 28px 60px -24px #000000bf}.scard:active{transform:translate3d(var(--part,0px), var(--lift), 0) scale(.97);transition-duration:90ms}.scard:focus-visible{outline-offset:4px}.scard--hero:before{content:"";z-index:-1;background:radial-gradient(80% 60% at 42% 52%, var(--tint-face), transparent 70%);opacity:.14;position:absolute;inset:0}.scard__cast{aspect-ratio:1;filter:drop-shadow(0 18px 24px #00000059);width:50%;position:absolute;top:50%;left:40%;transform:translate(-50%,-40%)}.hdemo__pop{color:var(--ink);letter-spacing:0;white-space:nowrap;will-change:transform, opacity;background:#141416b8;border-radius:999px;padding:3px 9px;font-size:clamp(13px,4.2cqw,20px);position:absolute;top:-6%;left:50%}.hdemo__pad{width:30cqw;height:30cqw;position:absolute;top:44%;right:7.5cqw;overflow:visible}.hdemo__frame{fill:#ece9e209;stroke:#ece9e229;stroke-width:.8px}.hdemo__axis{stroke:#ece9e224;stroke-width:.6px;stroke-dasharray:1.5 2.5}.hdemo__trail{fill:none;stroke:var(--you);stroke-width:1.1px;stroke-linecap:round;stroke-linejoin:round}.hdemo__dot{fill:var(--you)}.hdemo__ring{fill:none;stroke:var(--you);stroke-width:1.8px;stroke-linecap:round}.hdemo__tip{fill:#ece9e21f;stroke:#ece9e2b3;stroke-width:1px}.scard__head{pointer-events:none;flex-direction:column;gap:6px;display:flex;position:absolute;top:7cqw;left:7.5cqw;right:7.5cqw}.scard__title{letter-spacing:-.06em;margin-left:-.04em;font-size:clamp(64px,18cqw,128px);line-height:.82}.scard--warmup .scard__title{font-size:clamp(34px,17cqw,64px)}.scard__tag{color:var(--ink-3);letter-spacing:0;font-size:12px}.scard__foot{flex-direction:column;gap:10px;display:flex;position:absolute;bottom:6.5cqw;left:7.5cqw;right:7.5cqw}.scard__premise{color:var(--ink-2);text-wrap:pretty;max-width:24ch;font-size:15px;line-height:1.3}.scard--warmup .scard__premise{-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:13px;display:-webkit-box;overflow:hidden}.scard__meta{justify-content:space-between;align-items:center;gap:8px;display:flex}.scard__last{color:var(--ink-3);letter-spacing:0;font-size:12px}.scard__demo{opacity:.85;width:62%;position:absolute;top:50%;left:50%;transform:translate(-50%,-44%)}.scard__demo .demo-canvas{background:0 0;margin:0}.scard--warmup:before{content:"";z-index:-1;background:radial-gradient(90% 70% at 50% 55%, var(--tint,transparent), transparent 70%);opacity:.16;position:absolute;inset:0}.scard--shade{--tint:var(--tint-shade)}.scard--circle{--tint:var(--tint-circle)}.scard--count{--tint:var(--tint-count)}@media (max-width:760px){.shelf{flex-direction:column;align-items:stretch;gap:28px}.shelf__row{scroll-snap-type:x mandatory;scrollbar-width:none;gap:12px;margin-inline:-16px;padding:12px 16px 16px;overflow-x:auto}.shelf__row::-webkit-scrollbar{display:none}.shelf__row>li{scroll-snap-align:center;flex:0 0 62%}.scard{--part:0px!important}}@media (prefers-reduced-motion:reduce){.shelf li{animation:none}.scard,.scard[data-active=true]{transition:none;transform:none}}.shelf__featured{transform:translateX(var(--part,0px));transition:transform .52s var(--ease-out)}.scard--lights{aspect-ratio:21/8;border-radius:24px}.scard--lights:before{content:"";z-index:-1;opacity:.12;background:radial-gradient(70% 90% at 72% 60%,#e8412f,#0000 70%);position:absolute;inset:0}.scard--lights .scard__head{top:5.5cqw;left:4.5cqw}.scard--lights .scard__title{font-size:clamp(40px,9cqw,76px)}.scard--lights .scard__foot{gap:6px;width:34%;bottom:4.5cqw;left:4.5cqw;right:auto}.scard--lights .scard__premise{font-size:13px}.minigantry{background:linear-gradient(#26262b,#1e1e22 40%,#19191c);border-radius:3cqw;gap:2.2cqw;padding:2.4cqw 2.8cqw;display:flex;position:absolute;top:50%;right:4.5cqw;transform:translateY(-50%);box-shadow:inset 0 1px #ece9e214,0 18px 30px -18px #000000e6}.minigantry__lamp{background:linear-gradient(145deg,#efebe2,#b9b3a6 60%,#8e897e);border-radius:50%;width:7.4cqw;height:7.4cqw;position:relative}.minigantry__lamp:after{content:"";background:radial-gradient(circle at 50% 55%,#2a1714 0%,#140c0b 55%,#070606 100%);border-radius:50%;transition:background 80ms linear,box-shadow .2s;position:absolute;inset:9%}.minigantry__lamp[data-on=true]:after{background:radial-gradient(circle at 50% 44%,#fff1e8 0%,#ffae92 26%,#ff6a4a 64%,#c2331d 100%);box-shadow:0 0 3cqw .6cqw #ff6a4a73}@media (max-width:760px){.shelf__featured{margin-bottom:8px}.scard--lights{aspect-ratio:3/2}.scard--lights .scard__head{top:6cqw;left:6cqw}.scard--lights .scard__title{font-size:clamp(44px,14cqw,72px)}.scard--lights .scard__foot{width:auto;bottom:6cqw;left:6cqw;right:6cqw}.minigantry{gap:2.6cqw;padding:2.6cqw 3cqw;top:52%;right:6cqw}.minigantry__lamp{width:8.6cqw;height:8.6cqw}}
