/* The same quiet controls on every service showcase. */
.showcase-control{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:48px;padding-top:4px;margin-top:10px;color:var(--muted,#77716a);font-size:10px;line-height:1.4;overflow-anchor:none}
.showcase-progress{position:absolute;top:0;left:0;right:0;height:2px;background:#8b493712;overflow:hidden}
.showcase-progress:after{content:"";display:block;height:100%;background:var(--accent,#a32e26);transform:scaleX(var(--showcase-progress,0));transform-origin:left}
.showcase-toggle{font:inherit;color:var(--accent,#a32e26);min-height:44px;white-space:nowrap;padding:8px 0;cursor:pointer}
.showcase-toggle:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.showcase-frame{overflow-anchor:none}
@keyframes showcase-reveal{from{opacity:.45;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
.showcase-scene:not([hidden]){animation:showcase-reveal .25s ease-out}
@media(prefers-reduced-motion:reduce){.showcase-scene:not([hidden]){animation:none}}
/* Equal geometry lets the film category change without moving the page. */
body[data-page=film] #cinema-reels{--showcase-media-height:clamp(260px,45svh,480px)}
body[data-page=film] #cinema-reels .cinema-screen{display:grid;grid-template-rows:var(--showcase-media-height) auto;height:auto;aspect-ratio:auto}
body[data-page=film] #cinema-reels .cinema-screen>video{width:100%;height:var(--showcase-media-height);aspect-ratio:auto;object-fit:contain}
body[data-page=film] #cinema-reels .cinema-film-caption{min-height:64px}
body[data-page=film] #cinema-reels .cinema-film-note{min-height:360px}
body[data-page=film] #cinema-reels .film-info summary{min-height:60px}
body[data-page=film] .cinema-selection>.showcase-control{margin-top:12px}
@media(max-width:700px){body[data-page=film] #cinema-reels .cinema-film-note{min-height:300px}}