/* Motion layer only; existing homepage tokens, photo assets and React UI remain. */
.moments-showcase.moments-motion{position:relative;isolation:isolate;grid-template-columns:minmax(280px,.9fr) minmax(340px,1.1fr);gap:clamp(40px,5vw,100px);padding:clamp(32px,4vw,72px);background:linear-gradient(120deg,#181916,#22221d 65%,#191a17);border:1px solid #dfd1ac12;overflow:hidden}
.moments-motion .moments-feed{max-width:360px;outline:1px solid #e6d8b32b;box-shadow:0 38px 70px #0005,0 8px 16px #0003;transform-origin:50% 85%}
.moments-motion .moments-feed-grid{gap:5px}
.moments-motion .moments-feed-grid button{transition:opacity 400ms ease,box-shadow 400ms ease;outline-offset:2px}
.moments-motion .moments-feed-grid button:after{content:'';position:absolute;inset:0;border:2px solid transparent;pointer-events:none;transition:border-color 350ms ease,box-shadow 350ms ease}
.moments-motion .moments-feed-grid button[aria-pressed=true]:after{border-color:#b79b60;box-shadow:inset 0 0 0 2px #fff9}
.moments-motion .moments-feed-grid button[aria-pressed=true] img{transform:scale(1.045)}
.moments-motion .moments-feed-grid img{transition:transform 800ms cubic-bezier(.2,.7,.2,1)}
.moments-motion .moments-poster-column{max-width:550px;position:relative}
.moments-motion .moments-poster{border-radius:3px;outline:1px solid #ffffff14;box-shadow:0 32px 65px #0005}
.moments-motion .moments-poster>img{transform-origin:50% 55%}
.moments-motion .moments-poster-text{inset:38% 0 0;padding:8%;background:linear-gradient(transparent,rgba(16,19,14,.77))}
.moments-motion .moments-poster-text h4{letter-spacing:.035em;line-height:1.22;margin:15px 0}
.moments-motion-meter{display:flex;gap:6px;height:2px;margin-top:24px}
.moments-motion-meter span{flex:1;background:#d5c59b28;transition:background-color 500ms ease,flex 650ms cubic-bezier(.2,.7,.2,1)}
.moments-motion-meter .is-current{flex:2;background:#d4ba7f}.moments-motion-meter .is-read{background:#d5c59b68}
.moments-motion .moments-poster-controls{margin-top:17px;font-variant-numeric:tabular-nums}
.moments-motion .moments-poster-controls button{border:1px solid #d5c59b26;background:transparent;transition:background-color 220ms ease,transform 220ms ease}
.moments-motion .moments-poster-controls button:hover{background:#d5c59b1a;transform:translateY(-2px)}
.moments-motion .moments-poster-controls button:active{transform:scale(.94)}
/* Generated hand/phone cutout, screen bounds: x240..658, y82..970 of 1024x1536.
 * Anchored to the existing feed (no React reparenting or screenshot replacement).
 * Decorative layer never intercepts a thumbnail click. */
.moments-hand-ready .moments-feed{position:relative;isolation:isolate;max-width:300px;margin:20px 45px 100px 0;overflow:visible;background:transparent;outline:0;box-shadow:none;border-radius:30px}
.moments-hand-ready .moments-feed::before{content:'';position:absolute;z-index:-1;pointer-events:none;left:-57.4163%;top:-9.2342%;width:244.9761%;height:172.973%;background:url('/static/home-moments-hand-20261019.webp') center/100% 100% no-repeat;mask-image:linear-gradient(#000 0 66%,transparent 88%)}
.moments-hand-ready .moments-feed-bar{border-radius:30px 30px 0 0;padding:21px 20px 18px}
.moments-hand-ready .moments-post{background:#fafaf8;border-radius:0 0 30px 30px;padding:22px 15px 25px;gap:10px}
.moments-hand-ready .moments-cover{height:100px}
.moments-hand-ready .moments-avatar{flex-basis:28px;height:28px;font-size:20px}
.moments-hand-ready .moments-post-content>p{font-size:12px}
.moments-hand-ready .moments-poster-column{z-index:1}
@media(max-width:1100px){.moments-showcase.moments-motion{grid-template-columns:minmax(225px,1fr) minmax(240px,1fr);gap:32px;padding:28px}}
@media(max-width:760px){.moments-showcase.moments-motion{grid-template-columns:1fr;gap:32px;padding:24px 16px}.moments-motion .moments-feed,.moments-motion .moments-poster-column{max-width:350px}.moments-motion .moments-poster-text h4{font-size:30px}}
@media(max-width:1100px){.moments-hand-ready .moments-feed{max-width:220px;margin:18px 60px 100px 0}.moments-hand-ready .moments-post{padding:18px 12px 22px;gap:8px}}
@media(max-width:760px){.moments-hand-ready .moments-feed{width:82%;max-width:280px;margin:12px 12% 130px 0}.moments-hand-ready .moments-feed-bar{padding:20px 16px 16px}.moments-hand-ready .moments-avatar{display:none}.moments-hand-ready .moments-post{padding:18px 14px 24px}.moments-hand-ready .moments-cover{height:90px}}
@media(prefers-reduced-motion:reduce){.moments-motion,.moments-motion *,.moments-motion *::before,.moments-motion *::after{animation:none!important;transition:none!important}.moments-motion .moments-feed-grid button[aria-pressed=true] img{transform:none}}