/* Shared poster treatment: one link, desktop hover, and persistent mobile text. */
.movie-card{aspect-ratio:auto;align-self:start;transform:none;filter:none;transition:none;animation:card-entry .5s cubic-bezier(.22,1,.36,1) both;animation-delay:var(--card-entry-delay,0ms)}
.movie-card:hover,.movie-card:focus-within{transform:none;filter:none;z-index:50}
.movie-card .poster-open{position:relative;inset:auto;display:block;width:100%;height:auto;padding:0;border:0;background:none;text-align:left;text-decoration:none;cursor:pointer;transform-origin:center;transition:transform .3s cubic-bezier(0,0,.2,1),filter .3s cubic-bezier(0,0,.2,1)}
.movie-card .poster{height:auto;aspect-ratio:2/3;border-radius:12px;background:#ffffff0d;transform:translateZ(0);backface-visibility:hidden;box-shadow:0 20px 25px -5px #0006,0 8px 10px -6px #0006;transition:none}
.movie-card .poster-art{display:block;transform:none;filter:none;transition:filter .3s cubic-bezier(.4,0,.2,1)}
.movie-card:hover .poster-art,.movie-card:focus-within .poster-art{transform:none}
.movie-card .poster-shade{background:linear-gradient(135deg,#ffffff1a,transparent);opacity:0;pointer-events:none;transition:opacity .5s cubic-bezier(.4,0,.2,1)}
.movie-card:hover .poster-shade,.movie-card:focus-within .poster-shade{opacity:0}
.movie-card .card-hover-content{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;padding:16px;text-align:center;opacity:0;transform:translateY(6px);transition:opacity .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1);pointer-events:none}
.movie-card .card-hover-content .play-overlay{position:static;display:grid;place-items:center;flex:none;width:48px;height:48px;margin:0 0 12px;padding:12px;border:0;border-radius:50%;background:#fff;color:#000;opacity:1;transform:none;box-shadow:0 10px 15px -3px #fff3,0 4px 6px -4px #fff3;transition:transform .15s cubic-bezier(0,0,.2,1);pointer-events:auto}
.movie-card .card-hover-content .play-overlay:hover{transform:scale(1.04)}
.movie-card .card-hover-content .play-overlay svg{width:24px;height:24px;margin:0;fill:currentColor;stroke:none}
.movie-card .card-hover-content .poster-title{position:static;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;max-width:100%;max-height:35px;margin:0;padding:0;overflow:hidden;color:#fff;font-size:14px;font-weight:700;line-height:1.25;letter-spacing:0;text-align:center;text-shadow:none;filter:drop-shadow(0 4px 3px #00000012) drop-shadow(0 2px 2px #0000000f);opacity:1;transform:none}
.movie-card .card-hover-content .card-info{position:static;display:flex;align-items:center;justify-content:center;gap:8px;max-width:100%;margin:4px 0 0;padding:0;font-size:12px;font-weight:500;line-height:16px;color:#fffc;text-align:center;opacity:1;transform:none}
.movie-card .card-info:empty,.movie-card .card-mobile-info:empty{display:none}
.movie-card .card-rating{display:inline-flex;align-items:center;gap:2px;font:inherit;color:inherit;white-space:nowrap}
.movie-card .card-rating svg{width:12px;height:12px;fill:currentColor;stroke:none;color:var(--af-rating,#facc15)}
.movie-card .card-mobile-meta{display:block;margin-top:8px;padding-bottom:4px}
.movie-card .card-mobile-title{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;font-size:12px;font-weight:500;line-height:15px;letter-spacing:0;color:#fff}
.movie-card .card-mobile-info{display:flex;align-items:center;gap:8px;margin-top:4px;font-size:10px;font-weight:400;line-height:15px;color:#fff9}
.movie-card .card-mobile-info .card-rating svg{width:8px;height:8px}
.movie-card .card-save,.movie-card:hover .card-save,.movie-card:focus-within .card-save,.movie-card .card-save[aria-pressed=true]{opacity:0;pointer-events:none;transform:none}
.movie-card .card-save:focus-visible{opacity:1;pointer-events:auto;z-index:51}
.movie-card .poster-open:focus-visible{outline:2px solid #fff;outline-offset:4px}
.movie-card .poster.art-unavailable:after,.movie-card .poster:has(.image-failed):after{content:'No image';position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(#ffffff1a,transparent);color:#fff6;font-size:12px;pointer-events:none;z-index:-1}
.discovery-content .shelf:has(>.poster-grid){margin-bottom:32px;--rail-height:250px;--rail-top:60px}
.discovery-content .shelf:has(>.poster-grid) .section-heading{margin-bottom:16px;min-height:28px}
/* Fade only the outer gutter, keeping the expanded edge poster and its focus
   ring fully opaque. Clamp the bleed to the page gutter on compact screens. */
.discovery-content .poster-grid{--rail-bleed:min(40px,var(--page-gutter));--rail-fade:calc(var(--rail-bleed) - 12px);width:calc(100% + var(--rail-bleed) + var(--rail-bleed));grid-auto-columns:140px;gap:16px;align-items:start;margin:0 calc(-1 * var(--rail-bleed));padding:16px var(--rail-bleed) 40px;scroll-padding-inline:var(--rail-bleed);scroll-snap-type:none;overflow-x:auto;overflow-y:hidden;isolation:isolate;mask-image:linear-gradient(to right,transparent 0,black var(--rail-fade),black calc(100% - var(--rail-fade)),transparent);-webkit-mask-image:linear-gradient(to right,transparent 0,black var(--rail-fade),black calc(100% - var(--rail-fade)),transparent);transform:translateZ(0)}
.discovery-content .poster-grid>*{scroll-snap-align:none}
.discovery-content .shelf:has(>.poster-grid) .rail-controls button{display:none;top:calc(44px + (var(--rail-height) + 56px)/2);bottom:auto;width:48px;height:48px;padding:0;background:transparent;color:#fff;scale:1;transform:translateY(-50%) scale(1);transform-origin:center;filter:drop-shadow(0 10px 8px #0000000a) drop-shadow(0 4px 3px #0000001a);transition:opacity .3s cubic-bezier(.4,0,.2,1),transform .3s cubic-bezier(.4,0,.2,1);z-index:60}
.discovery-content .shelf:has(>.poster-grid) .rail-controls button[data-direction="-1"]{left:calc(16px - var(--page-gutter))}
.discovery-content .shelf:has(>.poster-grid) .rail-controls button[data-direction="1"]{right:calc(16px - var(--page-gutter))}
.discovery-content .shelf:has(>.poster-grid) .rail-controls button:hover{transform:translateY(-50%) scale(1.1)}
.discovery-content .shelf:has(>.poster-grid) .rail-controls button svg{width:40px;height:40px;stroke-width:1.5;filter:drop-shadow(0 3px 3px #0000001f)}
@media(min-width:1024px){
  .movie-card .card-hover-content{display:flex}
  .movie-card .card-mobile-meta{display:none}
  .movie-card:hover .poster-art,.movie-card:has(.poster-open:focus-visible) .poster-art,.movie-card:has(.card-save:focus-visible) .poster-art{filter:brightness(.5)}
  .movie-card:hover .poster-shade,.movie-card:has(.poster-open:focus-visible) .poster-shade,.movie-card:has(.card-save:focus-visible) .poster-shade{opacity:1}
  .movie-card:hover .card-hover-content,.movie-card:has(.poster-open:focus-visible) .card-hover-content,.movie-card:has(.card-save:focus-visible) .card-hover-content{opacity:1;transform:translateY(0)}
  .movie-card:hover .poster.art-unavailable:after,.movie-card:hover .poster:has(.image-failed):after{opacity:.2}
  .discovery-content .shelf:has(>.poster-grid){margin-bottom:48px;--rail-height:300px}
  .discovery-content .poster-grid{grid-auto-columns:200px}
  .discovery-content .shelf:has(>.poster-grid) .rail-controls button:not(:disabled){display:grid}
}
@media(hover:hover) and (pointer:fine){.movie-card .poster-open:hover{transform:scale(1.02)}}
@keyframes card-entry{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){:where(html:not([data-motion=full])) .movie-card{animation:none}:where(html:not([data-motion=full])) .movie-card .poster-open,:where(html:not([data-motion=full])) .movie-card .poster-art,:where(html:not([data-motion=full])) .movie-card .poster-shade,:where(html:not([data-motion=full])) .movie-card .card-hover-content,:where(html:not([data-motion=full])) .movie-card .play-overlay{transition:none}:where(html:not([data-motion=full])) .movie-card .poster-open:hover,:where(html:not([data-motion=full])) .movie-card .card-hover-content .play-overlay:hover{transform:none}}
:where(html[data-motion=reduced]) .movie-card{animation:none}
:where(html[data-motion=reduced]) .movie-card .poster-open,:where(html[data-motion=reduced]) .movie-card .poster-art,:where(html[data-motion=reduced]) .movie-card .poster-shade,:where(html[data-motion=reduced]) .movie-card .card-hover-content,:where(html[data-motion=reduced]) .movie-card .play-overlay{transition:none}
:where(html[data-motion=reduced]) .movie-card .poster-open:hover,:where(html[data-motion=reduced]) .movie-card .card-hover-content .play-overlay:hover{transform:none}