.film-page{padding-block:34px 74px}
.film-page h2{font-size:clamp(24px,3.3vw,36px)}
.film-page p{max-width:60ch}
.film-hero{display:grid;grid-template-columns:minmax(0,.83fr) minmax(0,1.17fr);align-items:center;gap:32px;padding:31px 33px;border:1px solid var(--line);border-radius:23px;background:radial-gradient(ellipse at 85% 65%,#dae8ff,transparent 72%),var(--surface)}
.film-kicker,.film-label,.film-output>span{font:650 .76rem/1.55 ui-monospace,SFMono-Regular,monospace;letter-spacing:.085em}
.film-kicker,.film-label{color:var(--clay)}
.film-hero h1{font-size:clamp(60px,8vw,102px);line-height:1.02;letter-spacing:-.065em;margin:5px 0 11px}
.film-hero h2{font-size:clamp(23px,2.8vw,34px)}
.film-hero-copy>p:not(.film-kicker){color:var(--body-emphasis);margin:11px 0 19px}
.film-hero .actions{gap:10px}
.film-cover{position:relative;isolation:isolate;min-width:0;border-radius:17px;overflow:hidden;background:#101e34;color:#f4f7ff;box-shadow:0 18px 32px #18345223}
.film-cover img,.film-still img,.film-camera-samples img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;background:#d9e7ff}
.film-cover img{aspect-ratio:16/10}
.film-cover figcaption{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:4px 12px;padding:10px 13px;background:#14213c}
.film-cover figcaption span{font-size:12px;color:#d3e0fb}
.film-section{margin-top:28px;padding-top:27px;border-top:1px solid var(--line)}
.film-section h2{margin-top:3px}
.film-section h2+p{margin-top:7px;color:var(--muted)}
.film-mcp{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:25px;padding:24px 28px;border:1px solid var(--line);border-radius:19px;background:var(--surface)}
.film-mcp .button{margin-top:15px}
.film-steps{margin:0;padding:0;list-style:none;counter-reset:film-counter}
.film-steps li{display:grid;grid-template-columns:36px 1fr;column-gap:13px;counter-increment:film-counter;padding-block:9px}
.film-steps li+li{border-top:1px solid var(--line)}
.film-steps li::before{content:counter(film-counter,decimal-leading-zero);grid-row:span 2;align-self:start;text-align:center;padding:6px 0;border-radius:8px;color:var(--clay);background:var(--sage-soft);font:650 .8rem/1.4 ui-monospace,monospace}
.film-steps li span{color:var(--muted);font-size:14px}
.film-section-head{display:flex;justify-content:space-between;align-items:end;flex-wrap:wrap;gap:10px 18px;margin-bottom:15px}
.film-featured{margin-bottom:15px;padding:22px 23px;border-radius:17px;border:1px solid var(--border-strong);background:linear-gradient(105deg,#e4edff,#f6f9ff)}
.film-featured-head{display:flex;justify-content:space-between;align-items:center;gap:12px 28px;flex-wrap:wrap}
.film-featured h3{margin-top:3px;font-size:clamp(23px,3vw,29px)}
.film-featured h3+p{margin-top:7px;color:var(--body-emphasis)}
.film-stills{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;margin-top:17px}
.film-still,.film-camera-samples figure{min-width:0;border:1px solid var(--line);border-radius:11px;background:var(--surface);overflow:hidden}
.film-still figcaption{display:grid;gap:2px;padding:8px 10px}
.film-still figcaption span,.film-media-credit{color:var(--muted);font-size:12px}
.film-featured .film-media-credit{margin-top:9px}
.film-skill-grid,.film-prompt-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.film-skill-grid .film-skill:nth-child(4){grid-column:span 2}
.film-skill,.film-prompt{display:flex;flex-direction:column;align-items:flex-start;min-width:0;border:1px solid var(--line);border-radius:16px;background:var(--surface);padding:17px 19px}
.film-prompt{padding:0;overflow:hidden}
.film-prompt-visual{width:100%;margin:0;background:#10223d;color:#edf4ff}
.film-prompt-visual img,.film-prompt-visual video{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;background:#132643}
.film-prompt-visual video,.film-prompt-visual[data-portrait] img{object-fit:contain}
.film-prompt-visual figcaption{padding:6px 14px;color:#d4e3fd;font-size:12px;line-height:1.5}
.film-prompt-body{display:flex;flex:1;flex-direction:column;align-items:flex-start;width:100%;padding:15px 17px 6px}
.film-prompt-use strong{color:var(--body-emphasis)}
.film-prompt-links{display:flex;flex-wrap:wrap;align-items:center;column-gap:14px;margin-top:auto}
.film-prompt-links .text-link:last-child{font-size:12px;color:var(--muted)}
.film-label{display:flex;gap:8px;align-items:center;margin-bottom:7px}
.film-label span:last-child{background:var(--sage-soft);border-radius:6px;padding:3px 6px;letter-spacing:0}
.film-skill h3,.film-prompt h3{font-size:19px}
.film-skill p,.film-prompt p{margin-top:7px;color:var(--muted);font-size:14px}
.film-skill .film-credit{margin-top:4px;font-size:12px}
.film-output{margin-top:13px;width:100%;border:1px solid var(--line);border-radius:9px;background:#edf3ff;padding:9px 10px;color:var(--body-emphasis)}
.film-output>span,.film-output>strong{display:block}
.film-output>span{font-size:11px;color:var(--clay)}
.film-output>strong{margin:2px 0 5px;font-size:13px}
.film-output>div{display:flex;flex-wrap:wrap;gap:4px}
.film-output>div span{padding:1px 6px;border:1px solid var(--line);border-radius:5px;background:var(--surface);font-size:11px}
.film-camera-samples{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%;margin-top:12px}
.film-camera-samples figcaption{padding:5px 8px;color:var(--muted);font-size:12px}
.film-skill .text-link,.film-prompt .text-link{font-size:14px;min-height:44px;margin-top:auto;padding-top:6px;white-space:normal}
.film-prompt .film-example{width:100%;margin:11px 0 2px;padding:9px 11px;border-left:2px solid var(--border-strong);border-radius:0 8px 8px 0;background:#edf3ff;color:var(--body-emphasis);font-size:13px;overflow-wrap:anywhere}
.film-example strong{display:block;font-size:11px;color:var(--clay)}
.film-example q{white-space:pre-wrap}
.film-prompts-empty{padding:15px 17px;border:1px solid var(--line);border-radius:12px;color:var(--muted);background:var(--surface)}
.film-reel{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,.8fr);align-items:center;gap:22px;margin-top:17px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}
.film-reel video{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;border-radius:9px;background:#101a2b}
.film-reel figcaption strong{font-size:20px}
.film-reel figcaption p{margin-top:6px;color:var(--muted);font-size:14px}
@media (max-width:930px){.film-hero{gap:24px;padding:27px 25px}.film-skill-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.film-skill-grid .film-skill:nth-child(4){grid-column:auto}.film-skill-grid .film-skill:last-child{grid-column:span 2}}
@media (max-width:700px){
 .film-page{padding-block:21px 53px}
 .film-hero,.film-mcp,.film-prompt-grid,.film-reel{grid-template-columns:1fr}
 .film-hero{padding:22px 18px}
 .film-cover img{aspect-ratio:16/9}
 .film-mcp{padding:19px 17px;gap:13px}
 .film-featured{padding:19px 17px}
 .film-hero .button{font-size:13px;padding-inline:13px}
 .film-stills{grid-template-columns:1fr}
 .film-reel{gap:10px}
}
@media (max-width:430px){.film-skill-grid{grid-template-columns:1fr}.film-skill-grid .film-skill:last-child{grid-column:auto}}