.pile-page{--gutter:max(0px, (100vw - 1600px) / 2);min-height:100vh;padding:110px calc(var(--gutter) + 72px) 60px calc(var(--gutter) + 40px);grid-template-columns:minmax(300px,1fr) minmax(0,2.1fr);align-items:center;gap:72px;display:grid;overflow:clip}.pile-side{z-index:10;flex-direction:column;gap:32px;min-width:0;display:flex;position:relative}.pile-texts{display:grid}.pile-text{visibility:hidden;opacity:0;grid-area:1/1}.pile-text.pile-shown{visibility:visible;opacity:1;animation:.6s pile-rise}.pile-title{font-size:var(--s3);letter-spacing:-.02em;font-weight:700;line-height:1.12}.pile-body{font-size:var(--s2);margin-top:14px;line-height:1.35}.pile-caption{opacity:.6;margin-top:14px}.pile-dashes{gap:8px;display:flex}.pile-dash{cursor:pointer;background:0 0;border:0;width:34px;height:12px;padding:0;position:relative}.pile-dash:after{content:"";background:var(--white);opacity:.25;transition:opacity .3s;position:absolute;inset:5px 0}.pile-dash:hover:after{opacity:.6}.pile-dash.pile-on:after{opacity:1}.pile-stage{--w:min(100%, calc((100vh - 170px) * 1.295));aspect-ratio:8/5;width:var(--w);margin-top:calc(var(--w) * .147);justify-self:end;position:relative}.pile-card{--r:calc(var(--depth) * 3deg);--s:calc(1 - var(--depth) * .02);--b:calc(1 - var(--depth) * .2);width:100%;aspect-ratio:var(--ratio);border:1px solid var(--line);background:var(--surface);transform-origin:100% 100%;transform:rotate(var(--r)) scale(var(--s));filter:brightness(var(--b));z-index:var(--z);border-radius:18px;margin:0;transition:transform .7s cubic-bezier(.3,.7,.2,1),filter .7s;position:absolute;bottom:0;right:0;overflow:hidden;box-shadow:0 18px 50px #0000008c}.pile-card img{width:100%;height:auto;display:block}.pile-front{cursor:grab;touch-action:pan-y;-webkit-user-select:none;user-select:none}.pile-dragging{cursor:grabbing;z-index:20;transition:none}.pile-leaving{animation:1.7s pile-to-back}.pile-swiped{animation:1.4s pile-swiped}@keyframes pile-to-back{0%{transform:translate(var(--fx), var(--fy)) rotate(var(--fr)) scale(1);filter:none;z-index:20;animation-timing-function:cubic-bezier(.55,0,.85,.45)}48%{transform:translate(var(--off), var(--oy)) rotate(var(--or)) scale(1);filter:none;z-index:20}52%{transform:translate(var(--off), var(--oy)) rotate(var(--or)) scale(1);filter:brightness(var(--b));z-index:0;animation-timing-function:cubic-bezier(.15,.55,.35,1)}to{transform:translate(0, 0) rotate(var(--r)) scale(var(--s));filter:brightness(var(--b));z-index:0}}@keyframes pile-swiped{0%{transform:translate(var(--fx), var(--fy)) rotate(var(--fr)) scale(1);filter:none;z-index:20;animation-timing-function:cubic-bezier(.2,.6,.6,1)}48%{transform:translate(var(--off), var(--oy)) rotate(var(--or)) scale(1);filter:none;z-index:20}52%{transform:translate(var(--off), var(--oy)) rotate(var(--or)) scale(1);filter:brightness(var(--b));z-index:0;animation-timing-function:cubic-bezier(.15,.55,.35,1)}to{transform:translate(0, 0) rotate(var(--r)) scale(var(--s));filter:brightness(var(--b));z-index:0}}@keyframes pile-rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@media (max-width:900px){.pile-page{grid-template-columns:minmax(0,1fr);align-items:start;gap:44px;min-height:0;padding:72px 28px 60px 20px}.pile-stage{--w:min(100%, 560px);aspect-ratio:5/4;order:-1;justify-self:center}.pile-card{aspect-ratio:5/4}.pile-card img{max-width:none;width:calc(100% / var(--zw));left:calc(var(--zx) / var(--zw) * -100%);top:calc(var(--zy) / var(--zh) * -100%);position:absolute}}@media (prefers-reduced-motion:reduce){.pile-card{transition:none}.pile-leaving,.pile-swiped,.pile-text.pile-shown{animation:none}}