/* Replay chapters: the film is the visual anchor, especially on phones. */
html{overflow-x:clip}
.goal-screen[data-video-src]{overflow:hidden}
.goal-screen[data-video-src] video{background:#080a09}
.replay-film-label{position:absolute;z-index:1;left:18px;top:17px;padding:8px 10px;border-left:2px solid #dec798;background:#090b09b8;color:#f7f0dc;font:700 9px/1.35 'Segoe UI',sans-serif;letter-spacing:1.5px;text-transform:uppercase;pointer-events:none;opacity:0;transform:translateY(-7px);transition:opacity .3s,transform .3s}
.goal-screen.is-playing .replay-film-label{opacity:1;transform:none}
.goal-screen.is-playing.is-settled .replay-film-label{opacity:0}
.goal-screen:fullscreen{aspect-ratio:auto!important;width:100vw;height:100dvh;display:grid;place-items:center;background:#050505}
.goal-screen:fullscreen video{object-fit:contain!important}
.goal-screen:fullscreen .replay-film-label{top:22px;left:24px}
.goal-controls .goal-fullscreen{margin-left:auto}
.goal-screen[data-video-src] .goal-play:focus-visible{outline:3px solid #e7cb92;outline-offset:-4px}
@media(max-width:760px){
  .topbar-nav .collection-position{position:static;display:flex;max-width:none;width:100%;height:24px;margin:7px auto -3px;padding:6px 2px 0;border-top:1px solid #d8c3982d;justify-content:space-between;font-size:9px;letter-spacing:.3px}
  .topbar-nav .collection-position[hidden]{display:none}
  .topbar-nav .collection-position>span:first-child{max-width:58%;color:#e0cfad}
  .topbar-nav .collection-track{width:36%;max-width:120px;height:2px;background:#d8c39830}
  .topbar-nav .collection-track i{background:#d8c398}
  .goal-chapter{margin:38px -16px 28px!important;padding:32px 0 28px!important;overflow:hidden}
  .goal-chapter .goal-heading{padding:0 22px;margin-bottom:21px}
  .goal-chapter .goal-heading h2,.selection-replay .goal-heading h2{font-size:clamp(36px,10.5vw,49px);line-height:.96;max-width:350px}
  .goal-chapter .goal-layout{display:block}
  .goal-chapter .goal-layout>div:first-child{padding:0;border:0;box-shadow:none;background:#0a0d0b}
  .goal-chapter .replay-slate{margin:0 22px;padding:11px 0 13px;border-top:1px solid #d8c39843}
  .goal-chapter .goal-screen[data-video-src]{width:100%;aspect-ratio:4/3;min-height:0;background:radial-gradient(circle at 50% 50%,#252019,#070807 75%)}
  .goal-chapter #goal-screen video{object-fit:cover!important}
  .goal-chapter #ronaldo-screen video{object-fit:contain!important}
  .goal-chapter #ronaldo-screen{background:#0d1712}
  .goal-chapter .goal-play img{object-fit:cover}
  .goal-chapter #goal-screen .goal-play img{right:0;width:72%;height:100%;object-fit:contain;object-position:right bottom}
  .goal-chapter .goal-play:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#070806dc,transparent 75%);pointer-events:none}
  .goal-chapter .goal-play-icon,.goal-chapter .goal-screen-caption{z-index:3}
  .goal-chapter .goal-play-icon{left:22px;top:22px;width:56px;height:56px;background:#d8c398;color:#111713;border:0;font-size:18px;box-shadow:0 6px 24px #0009}
  .goal-chapter .goal-screen-caption{left:22px;bottom:24px;font-size:9px;letter-spacing:1.5px}
  .goal-chapter .goal-screen-caption strong{font-size:clamp(26px,8vw,36px);max-width:245px;line-height:1}
  .goal-chapter .goal-screen-caption small{font-size:11px;color:#f0dfb9}
  .goal-chapter .goal-controls{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px 12px;padding:15px 22px 7px;background:#101411}
  .goal-chapter .goal-controls button{min-height:44px;padding:9px 13px;font-size:11px;border-color:#d8c39861}
  .goal-chapter .goal-controls button:first-child{background:#d8c398;color:#111611;font-weight:700;border-color:#d8c398}
  .goal-chapter .goal-controls input[type=range]{grid-column:2;grid-row:1;width:100%;min-width:0;accent-color:#d8c398}
  .goal-chapter .goal-time{grid-column:3;grid-row:1;font-size:11px}
  .goal-chapter .goal-controls button:nth-of-type(2){grid-column:1 / 3;grid-row:2;text-align:left}
  .goal-chapter .goal-controls .goal-fullscreen{grid-column:3;grid-row:2;margin:0}
  .goal-chapter .goal-controls .goal-restart{grid-column:1 / -1;grid-row:3;justify-self:start;min-height:32px;padding:4px 0;border:0;color:#d8c398;background:none}
  .goal-chapter .goal-playback-help{padding:0 22px 12px;margin:0;background:#101411;font-size:10px;min-height:27px}
  .goal-chapter .goal-source{padding:10px 22px 13px;font-size:8px;letter-spacing:.5px;line-height:1.35;background:#101411;border-top:1px solid #ffffff18}
  .goal-chapter .goal-source a{font-size:10px}
  .goal-chapter .goal-product,.goal-chapter .selection-story{margin:20px 22px 0;padding:22px 0 0;border-top:1px solid #d8c3984d}
  .goal-chapter .goal-product h3{font-size:26px;margin:9px 0 18px}
  .goal-chapter .goal-product button{grid-template-columns:112px minmax(0,1fr);gap:7px 14px;align-items:start;padding:10px;background:#ffffff0b;border:1px solid #d8c39838;border-radius:4px}
  .goal-chapter .goal-product button>img{grid-column:1;grid-row:1/4;width:112px;height:128px;border:0;object-fit:cover;object-position:center}
  .goal-chapter .goal-product button>span{grid-column:2;font-size:13px;line-height:1.35;margin:4px 0 0}
  .goal-chapter .goal-product button>strong{grid-column:2;font-size:16px}
  .goal-chapter .goal-product button>small{grid-column:2;font-size:11px;line-height:1.4}
  .goal-chapter .goal-product p{font-size:11px;margin:12px 0 0}
  .goal-chapter .selection-story h3{font-size:25px;max-width:270px}
  .goal-chapter .selection-story p{font-size:13px;line-height:1.6}
}
@media(max-width:360px){.goal-chapter .goal-controls{gap:7px}.goal-chapter .goal-controls button{padding:8px 9px}.goal-chapter .goal-product button{grid-template-columns:100px minmax(0,1fr)}.goal-chapter .goal-product button>img{width:100px}}
@media(max-width:760px){.goal-chapter .goal-controls{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:12px 10px 8px}.goal-chapter .goal-controls input[type=range],.goal-chapter .goal-controls .goal-time,.goal-chapter .goal-controls .goal-restart{display:none}.goal-chapter .goal-controls button:first-child,.goal-chapter .goal-controls button:nth-of-type(2),.goal-chapter .goal-controls .goal-fullscreen{grid-column:auto!important;grid-row:1!important;width:100%;margin:0;min-width:0;text-align:center;padding:8px 5px;font-size:10px}.goal-chapter .goal-source{font-size:9px}.goal-chapter .goal-source a{font-size:10px}}
@media(prefers-reduced-motion:reduce){.replay-film-label{transition:none}}
