/* Confirmed edge treatment: one contour per visible screen. */
.final-preview main img{outline:none;border:1px solid var(--ds-edge);border-radius:var(--ds-radius);background:#fff}
.final-preview img[data-source*="assets/riot-"]{background:#080808}
.final-preview .ds-visual-screen,.final-preview .vbl-screen,.final-preview .pm3__tile-window,.final-preview .fp-screen{background:#fff;clip-path:none;border:1px solid var(--ds-edge)}
.final-preview .visual:is(.riot,.navigation) .ds-visual-screen,.final-preview .pm3__tile-window{background:#050505}
.final-preview .ds-visual-screen::after,.final-preview .vbl-screen::after,.final-preview .pm3__tile-window::after,.final-preview .fp-screen::after{display:none}
.final-preview .visual .ds-visual-screen{filter:none}
.final-preview .ds-visual-screen>img,.final-preview .vbl-screen img,.final-preview .pm3__tile-window img,.final-preview .fp-screen img{border:0;border-radius:0;outline:none;background:transparent}
.final-preview .visual .ds-visual-screen>img{object-fit:cover;border:0;border-radius:0;outline:none;background:transparent}
.final-preview .pm3 .pm3__panel .fp-paris-grid img{border:0;border-radius:0;outline:none;background:transparent}
.final-preview img:is([data-source$="riot-separate-pages.webp"],[data-source$="riot-continuous-feed.webp"]){border:0;outline:none;border-radius:0;background:transparent}
.final-preview .next-project a{display:block}
.final-preview .next-project h2{justify-content:space-between}
.final-preview .next-project .round-arrow{flex:none}
.final-preview .next-project .round-arrow svg{width:22px;height:22px}
.final-preview .next-project a:is(:hover,:focus-visible) .visual-inner{transform:scale(1.025)}
.final-preview .next-project a:is(:hover,:focus-visible) .round-arrow{transform:rotate(45deg);background:var(--ink);color:var(--bg)}
/* Gray hero and next-project frames stay; only chapter presentation wells are removed. */
.final-preview .case-page .visual{background:var(--stage)}
.final-preview .visual.volleyball.case-hero{background:var(--stage);padding:var(--ds-stage-inset)}
.final-preview[data-surface] .figure-grid.phones,
.final-preview[data-surface] .case-date-feature,
.final-preview[data-surface] .case-flow,
.final-preview[data-surface] .pm3 .pm3__pin,
.final-preview[data-surface] .final-scroll__pin{background:transparent}
.final-preview[data-surface] .figure-grid.phones,
.final-preview[data-surface] .case-date-feature,
.final-preview[data-surface] .case-flow,
.final-preview[data-surface] .pm3.pm3--01 .pm3__pin{padding-inline:0}
.final-preview .visual.navigation[data-surface] .ds-visual-screen{margin:0;max-height:none}
.final-preview .visual.navigation[data-surface] .visual-inner{gap:6%;height:82%;width:90%}
.final-preview .visual.navigation[data-surface="01"] .ds-visual-screen.tv{width:min(77%,calc(90cqh * var(--media-ratio)))}
.final-preview .visual.navigation[data-surface="01"] .ds-visual-screen.phone{width:min(16%,calc(90cqh * var(--media-ratio)))}
.final-preview .visual.balanced-pair .visual-inner{gap:6%;height:82%;width:90%}
.final-preview .visual.balanced-pair .ds-visual-screen.desktop{width:min(77%,calc(90cqh * var(--media-ratio)))}
.final-preview .visual.balanced-pair .ds-visual-screen.phone{width:min(16%,calc(90cqh * var(--media-ratio)));margin:0}
.final-preview .visual.navigation[data-surface="02"] .visual-inner{gap:5%;width:94%}
.final-preview .visual.navigation[data-surface="02"] .ds-visual-screen.tv{width:min(82%,calc(90cqh * var(--media-ratio)))}
.final-preview .visual.navigation[data-surface="02"] .ds-visual-screen.phone{width:min(12%,calc(74cqh * var(--media-ratio)))}
.final-preview .visual.navigation[data-surface="03"] .visual-inner{flex-direction:column;gap:8%;height:90%}
.final-preview .visual.navigation[data-surface="03"] .ds-visual-screen.tv{width:min(86%,calc(50cqh * var(--media-ratio)))}
.final-preview .visual.navigation[data-surface="03"] .ds-visual-screen.phone{width:min(16%,calc(40cqh * var(--media-ratio)))}
.final-preview .visual.navigation[data-surface="04"] .visual-inner{gap:8%;height:75%}
.final-preview .visual.navigation[data-surface="04"] .ds-visual-screen.tv{align-self:flex-start;width:min(76%,calc(75cqh * var(--media-ratio)))}
.final-preview .visual.navigation[data-surface="04"] .ds-visual-screen.phone{align-self:flex-end;width:min(15%,calc(75cqh * var(--media-ratio)))}
.surface-handoff-crop{position:relative;aspect-ratio:1200/469;overflow:hidden;border:1px solid var(--ds-edge);border-radius:var(--ds-radius);background:#0072fb}
.final-preview .surface-handoff-crop img{width:150%;max-width:none;position:absolute;inset:0;border:0;border-radius:0;background:transparent}
.surface-review .surface-options{display:grid;grid-template-columns:1fr 1fr;gap:64px 40px;margin-top:40px}
.surface-mini .visual{aspect-ratio:1.6;background:transparent}
.surface-option-title{display:flex;gap:16px;justify-content:space-between;align-items:center;margin-top:24px}
.surface-review h3{font-size:22px;line-height:1.3;letter-spacing:-.025em}
.surface-option-title>span{font-size:13px}
.surface-review article>p{font-size:15px;line-height:1.7;color:var(--muted);margin-top:12px;max-width:55ch}
.surface-project-links{display:flex;flex-wrap:wrap;gap:4px 24px;margin-top:16px}
.surface-project-links a{display:flex;align-items:center;min-height:44px;font-size:14px;text-decoration:underline;text-underline-offset:5px}
.surface-corner-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-top:40px}
.surface-corner-samples{display:flex;gap:32px;align-items:start;margin-bottom:24px;padding:24px;background:var(--stage);border-radius:12px}
.surface-corner-phone,.surface-corner-vb{position:relative;width:calc(50% - 16px);aspect-ratio:200/280;overflow:hidden;isolation:isolate;border-radius:12px}
.final-preview .surface-corner-samples img{display:block;width:100%;height:auto;max-width:none;border:0;outline:0;border-radius:0;background:transparent}
.surface-corner-samples.before>div{background:transparent;clip-path:inset(0 round 12px)}
.surface-corner-samples.before img{border-radius:12px;outline:1px solid #dcdcdc;outline-offset:-1px}
.surface-corner-samples.after .surface-corner-phone{background:#050505}
.surface-corner-samples.after .surface-corner-vb{background:#fff}
.surface-corner-samples>div::after{content:'';position:absolute;inset:0;border:1px solid #dcdcdc;border-radius:inherit;pointer-events:none}
.surface-corner-samples.after>div{border:1px solid #dcdcdc}
.surface-corner-samples.after>div::after{display:none}
.surface-nav-example{margin-top:48px}
.surface-nav-example img{width:100%;height:auto}
.surface-nav-example p{color:var(--muted);font-size:15px;line-height:1.7;margin-top:16px}
.surface-review section[id]{scroll-margin-top:var(--ds-anchor-offset)}
.selected-pair-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px;margin-top:32px}
.selected-pair-grid .visual{aspect-ratio:1.6}
.selected-surfaces .source-link{text-decoration:underline;text-underline-offset:4px}
@media(max-width:900px){.selected-pair-grid{grid-template-columns:1fr;gap:48px}.selected-pair-grid .visual{aspect-ratio:1.2}.selected-pair-grid .surface-option-title{align-items:start;flex-direction:column;gap:8px}}
@media(max-width:760px){.surface-review .surface-options,.surface-corner-grid{grid-template-columns:1fr;gap:48px}.surface-review h3{font-size:21px}.surface-corner-samples{gap:20px;padding:20px}.surface-corner-phone,.surface-corner-vb{width:calc(50% - 10px)}.final-preview .next-project .round-arrow svg{width:17px;height:17px}}
@media(prefers-reduced-motion:reduce){.final-preview .next-project a:is(:hover,:focus-visible) .visual-inner,.final-preview .next-project a:is(:hover,:focus-visible) .round-arrow{transform:none}}
html[data-motion=off] .final-preview .next-project a:is(:hover,:focus-visible) .visual-inner,html[data-motion=off] .final-preview .next-project a:is(:hover,:focus-visible) .round-arrow{transform:none}

