/* A single production screen, with a subordinate horizontal IP credit strip. */
.channel-branch{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:0 5vw}
.channel-branch>.branch-heading{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:35px;margin:0 0 26px}
.channel-branch>.branch-heading>.channel-label{flex-shrink:0;margin:0}
.channel-branch>.branch-heading>p:last-child{max-width:540px;font-size:13px;border:0;padding:0;margin:0;color:#76515b}
.channel-branch .channel-scenes{grid-column:1/-1;grid-row:2;position:relative;aspect-ratio:2.35;min-height:390px;max-height:650px;margin:0 0 32px;border-radius:0 64px 0 0;background:#122e32;isolation:isolate}
.channel-branch .channel-scenes:after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#071b22cf,transparent 67%),linear-gradient(0deg,#0d29354d,transparent 45%);pointer-events:none}
.channel-branch .channel-scenes .branch-scene{clip-path:inset(0 0 0 100%);transition:clip-path 1.05s cubic-bezier(.22,.65,.2,1),opacity .8s}
.channel-branch .channel-scenes .branch-scene.is-current{clip-path:inset(0)}
.channel-branch .channel-scenes .branch-scene img{animation:ilaf-film-camera 16s ease-in-out infinite alternate;object-position:60% 50%}
.channel-branch .channel-scenes.film-still .branch-scene img{animation-play-state:paused}
.channel-screen-title{position:absolute;left:6%;top:17%;z-index:2;font:700 clamp(37px,4.8vw,80px)/1.22 Be,Arial,sans-serif;letter-spacing:-.05em;color:#fff5df;max-width:75%;margin:0;pointer-events:none;text-shadow:0 2px 20px #091d3240}
.channel-screen-title em{display:inline-block;font:italic 400 1em/1.3 Editorial,Georgia,serif;color:#f3b49e}
.channel-screen-title:before{content:'';display:block;width:45px;height:2px;margin-bottom:24px;background:#02c1bb}
.channel-branch .channel-scenes .branch-scene figcaption{z-index:2;padding:28px 6% 24px;font-size:9px;color:#fff4e7;background:linear-gradient(transparent,#10282b9c)}
.channel-branch .film-controls{z-index:3;padding:0 15px}
.film-step{width:36px;height:48px;background:#fff9eddb;border:1px solid #fff6;box-shadow:none}
.channel-branch .channel-scenes .branch-scene.is-current:after{content:'';position:absolute;left:6%;bottom:14px;height:1px;width:70px;background:#efb49f;transform-origin:left;animation:ilaf-scene-time 4.5s linear forwards;z-index:3}
.channel-branch .channel-scenes.film-still .branch-scene.is-current:after{animation-play-state:paused}
.channel-branch .channel-worlds-heading{grid-column:1;grid-row:3;margin:0;align-self:center;max-width:420px}
.channel-branch .channel-worlds-heading .eyebrow{font-size:8px;color:#936b5f}
.channel-branch .channel-worlds-heading h4{font-size:clamp(24px,2.35vw,34px);line-height:1.3;margin:10px 0}
.channel-branch .channel-worlds-heading>p{font-size:11px;margin-top:10px;max-width:330px}
.channel-branch .character-rail{grid-column:2;grid-row:3;justify-self:stretch;width:100%;max-width:none;align-self:center;border-block:1px solid #173b3d20;padding:18px 45px;background:none}
.channel-branch .character-card{display:grid;grid-template-columns:105px minmax(0,1fr);align-items:center;gap:28px}
.channel-branch .character-card>a{height:176px;width:105px;justify-content:center}
.channel-branch .character-card img{border-radius:16px 0 0 0;max-width:100%;max-height:100%;width:auto;height:auto}
.channel-branch .character-card figcaption{text-align:left;padding:0}
.channel-branch .character-card h3{font-size:26px;margin:0 0 6px;color:#34383c}
.channel-branch .character-card figcaption>p:not(.character-branch){font-size:12px;color:#76515b}
.channel-branch .character-footer{grid-column:2;grid-row:4;justify-self:stretch;width:100%;min-height:24px;padding:0;margin:0;position:relative}
.channel-branch .character-steps{bottom:108px;left:0;right:0;padding:0;pointer-events:none}
.channel-branch .character-steps button{width:30px;height:42px;font-size:23px;background:transparent;border-color:#bba99c;box-shadow:none}
.channel-branch .character-steps button:hover{background:#c4142a;color:white}
.channel-branch .character-motion{font-size:8px;margin-top:8px}
@keyframes ilaf-film-camera{from{transform:scale(1)}to{transform:scale(1.035)}}
@keyframes ilaf-scene-time{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(max-width:800px){.channel-branch{grid-template-columns:minmax(0,1fr);gap:0}.channel-branch>.branch-heading{display:block;margin-bottom:24px}.channel-branch>.branch-heading>.channel-label{display:flex;gap:8px}.channel-branch>.branch-heading>p:last-child{margin-top:15px;font-size:12px}.channel-branch .channel-scenes{grid-column:1;grid-row:auto;aspect-ratio:1.18;min-height:360px;max-height:none;margin-bottom:30px;border-top-right-radius:42px}.channel-screen-title{left:9%;top:19%;font-size:clamp(33px,7vw,53px);max-width:82%}.channel-screen-title:before{margin-bottom:20px}.channel-branch .film-controls{padding:0 8px}.film-step{width:30px;height:42px}.channel-branch .channel-worlds-heading{grid-column:1;grid-row:auto;margin:0 0 20px}.channel-branch .character-rail{grid-column:1;grid-row:auto;padding:16px 35px}.channel-branch .character-card{grid-template-columns:90px minmax(0,1fr);gap:20px}.channel-branch .character-card>a{width:90px;height:160px}.channel-branch .character-card h3{font-size:23px}.channel-branch .character-footer{grid-column:1;grid-row:auto}.channel-branch .character-steps{bottom:98px}.channel-branch .character-card figcaption>p:not(.character-branch){font-size:11px}}
@media(prefers-reduced-motion:reduce){.channel-branch .channel-scenes .branch-scene{clip-path:none;transition:none}.channel-branch .channel-scenes .branch-scene img,.channel-branch .channel-scenes .branch-scene.is-current:after{animation:none}}

/* One desktop chapter: screen and IP footer share the same bounded composition. */
@media(min-width:801px){
.channel-branch{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);column-gap:32px;row-gap:0}
.channel-branch>.branch-heading{gap:28px;margin-bottom:18px;min-height:48px}
.channel-branch>.branch-heading>p:last-child{font-size:12px;line-height:1.7;max-width:520px}
.channel-branch .channel-scenes{height:clamp(250px,46svh,510px);min-height:0;max-height:none;aspect-ratio:auto;margin-bottom:0;border-top-right-radius:42px}
.channel-screen-title{top:15%;font-size:clamp(35px,4vw,66px)}
.channel-screen-title:before{margin-bottom:17px}
.channel-branch .channel-worlds-heading{grid-column:1;grid-row:3;margin:0;padding:23px 0 12px;max-width:none;align-self:center}
.channel-branch .channel-worlds-heading h4{font-size:clamp(21px,1.65vw,28px);max-width:none;line-height:1.35;margin:9px 0}
.channel-branch .channel-worlds-heading h4 em{white-space:nowrap;display:inline-block}
.channel-branch .channel-worlds-heading>p{margin-top:7px;font-size:10px;max-width:none}
.channel-branch .character-rail{grid-column:2;grid-row:3;border:0;width:100%;padding:0;margin:17px 0 0;gap:0;overflow-x:auto}
.channel-branch .character-card{box-sizing:border-box;flex:0 0 100%;width:100%;max-width:100%;grid-template-columns:64px minmax(0,1fr);padding:0 38px;gap:20px}
.channel-branch .character-card>a{width:64px;height:114px}
.channel-branch .character-card img{border-radius:12px 0 0 0}
.channel-branch .character-card h3{font-size:23px}
.channel-branch .character-card figcaption>p:not(.character-branch){font-size:11px}
.channel-branch .character-footer{min-height:20px;grid-column:2;grid-row:4}
.channel-branch .character-steps{bottom:58px}
.channel-branch .character-motion{font-size:8px;margin-top:4px}
}
.channel-branch .channel-worlds-heading h4 em{white-space:nowrap}
@media(max-width:800px){.channel-branch .character-rail{padding:0;gap:0}.channel-branch .character-card{flex:0 0 100%;box-sizing:border-box;padding:16px 35px}.channel-branch .channel-worlds-heading h4 em{display:inline-block}}

/* Transparent film controls and quiet character dissolves. */
.channel-branch .film-step{background:transparent;border:0;box-shadow:none;color:#fff4df;font-size:34px;width:40px;height:52px;text-shadow:0 1px 8px #061b23b3;border-radius:0}
.channel-branch .film-step:hover{background:transparent;box-shadow:none;color:#f3b49e;transform:translateY(-1px)}
.channel-branch .character-rail.character-fade{display:grid;overflow:hidden;scroll-snap-type:none}
.channel-branch .character-fade .character-card{grid-area:1/1;min-width:0;opacity:0;visibility:hidden;transform:translateY(5px);transition:opacity .7s ease,transform .9s cubic-bezier(.2,.7,.2,1),visibility 0s .7s;pointer-events:none}
.channel-branch .character-fade .character-card.character-current{opacity:1;visibility:visible;transform:none;transition-delay:0s;pointer-events:auto}
.channel-branch .character-rail.character-static{display:flex;flex-wrap:wrap;gap:20px;overflow:visible}
.channel-branch .character-static .character-card{opacity:1;visibility:visible;transform:none;pointer-events:auto;flex:1 1 230px;transition:none}
@media(prefers-reduced-motion:reduce){.channel-branch .character-fade .character-card{transition:none;transform:none}.channel-branch .film-step{transition:none}}

/* A shared cast strip fills the IP area without competing with the production screen. */
.channel-branch{grid-template-columns:minmax(0,.85fr) minmax(0,1.35fr);column-gap:35px}
.channel-branch .character-rail.character-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;overflow:visible;padding:18px 0 0;margin:0;width:100%;border:0}
.channel-branch .character-pair .character-card{display:grid;grid-template-columns:70px minmax(0,1fr);gap:18px;width:auto;min-width:0;max-width:none;padding:0;align-items:center;margin:0}
.channel-branch .character-pair .character-card>a{width:70px;height:125px}
.channel-branch .character-pair .character-card figcaption{text-align:left;padding:0}
.channel-branch .character-pair .character-card h3{font-size:23px}
.channel-branch .character-pair .character-card figcaption>p:not(.character-branch){font-size:11px;line-height:1.7;max-width:180px}
.channel-branch .character-pair .character-card+ .character-card{border-left:1px solid #a68e733b;padding-left:24px}
@media(max-width:1100px) and (min-width:801px){.channel-branch{grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);column-gap:24px}.channel-branch .character-rail.character-pair{gap:16px}.channel-branch .character-pair .character-card{grid-template-columns:55px minmax(0,1fr);gap:12px}.channel-branch .character-pair .character-card>a{width:55px;height:100px}.channel-branch .character-pair .character-card+ .character-card{padding-left:16px}.channel-branch .character-pair .character-card h3{font-size:20px}}
@media(max-width:800px){.channel-branch{grid-template-columns:minmax(0,1fr)}.channel-branch .character-rail.character-pair{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;padding:0}.channel-branch .character-pair .character-card{grid-template-columns:1fr;gap:13px}.channel-branch .character-pair .character-card>a{width:100%;height:170px;justify-content:flex-start}.channel-branch .character-pair .character-card+ .character-card{padding-left:18px}.channel-branch .character-pair .character-card h3{font-size:21px}}

/* Shared caption geometry overrides earlier first/last image composition rules. */
.channel-branch .channel-scenes .branch-scene figcaption,
.channel-branch .channel-scenes .branch-scene:first-child figcaption,
.channel-branch .channel-scenes .branch-scene:last-child figcaption{position:absolute;inset:auto 0 0;box-sizing:border-box;width:100%;max-width:none;margin:0;padding:28px 6% 24px;text-align:left;font-size:9px;font-style:italic;line-height:1.7;color:#fff4e7;background:linear-gradient(transparent,#10282b9c);z-index:2;transform:none}
