/* Responsive presentation of the finished film board. Its native geometry is untransformed. */
.wk-source-page .workshop-native-board{background:#F8F5EE;color:#11110F;padding-block:82px 70px;overflow:hidden}
.workshop-native-board:after{display:none}
.workshop-native-board .wa-layout{grid-template-columns:.84fr 1.16fr;gap:40px}
.wnb-visual{min-width:0;position:relative;align-self:center}
.wnb-heading{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:0 10px 17px;border-bottom:1px solid #bfc2b5;font:750 10px/1.4 Archivo,Arial,sans-serif;letter-spacing:.1em}
.wnb-heading>[role=status]{font:500 12px/1.4 Archivo,Arial,sans-serif;letter-spacing:0;color:#4e5649;text-align:right}
.wnb-stage{position:relative;width:100%;aspect-ratio:1;overflow:hidden;isolation:isolate}
.wnb-stage>svg.wnb-board{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;transform:none;pointer-events:none}
.wnb-stage>noscript img{width:100%;height:auto}
.wnb-controls{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:16px;border-top:1px solid #bfc2b5;padding-top:14px}
.wnb-controls>button,.wnb-controls>div>button{border:0;border-radius:0;background:transparent;color:#11110F;min-height:44px;font:650 12px/1.4 Archivo,Arial,sans-serif;padding:10px 0;cursor:pointer}
.wnb-controls>button{display:flex;align-items:center;justify-content:space-between;gap:23px;font-weight:800}
.wnb-controls>button>span{color:#F04417;font-size:17px}
.wnb-controls>div{display:flex;align-items:center;gap:20px}
.wnb-controls>div>button{font-weight:500;white-space:nowrap}
.wnb-controls button:hover:not(:disabled){color:#C2330C}
.wnb-controls button:disabled{opacity:.42;cursor:default}
.wnb-controls button:focus-visible{outline:3px solid #278FAE;outline-offset:4px}


@media(max-width:1150px){.workshop-native-board .wa-layout{gap:25px;grid-template-columns:.9fr 1.1fr}.wnb-controls{flex-wrap:wrap;gap:0 20px}.wnb-controls>div{gap:25px}.wnb-heading{gap:14px;padding-inline:0}.wnb-heading>span:first-child{font-size:9px}.wnb-heading>[role=status]{font-size:11px}}
@media(max-width:800px){.wk-source-page .workshop-native-board{padding-block:65px 55px}.workshop-native-board .wa-layout{grid-template-columns:1fr;gap:30px}.wnb-visual{max-width:680px;width:100%;margin-inline:auto}.wnb-controls{flex-wrap:nowrap}.wnb-heading>span:first-child{font-size:10px}.wnb-heading>[role=status]{font-size:12px}}
@media(max-width:520px){.wk-source-page .workshop-native-board{padding-block:52px 45px}.workshop-native-board .wa-layout{gap:30px}.wnb-heading{align-items:start;gap:14px;padding-bottom:14px}.wnb-heading>span:first-child{font-size:9px;max-width:130px}.wnb-heading>[role=status]{font-size:11px;max-width:155px}.wnb-stage{width:calc(100% + 24px);margin-left:-12px}.wnb-controls{flex-wrap:wrap;gap:0 20px;padding-top:10px}.wnb-controls>button{font-size:12px;flex-basis:100%}.wnb-controls>div{width:100%;justify-content:space-between;gap:20px}.wnb-controls>div>button{font-size:12px}}
@media(prefers-reduced-motion:reduce){.wnb-controls [data-native-board-pause]{display:none}}

/* One unlettered artwork, carried from quiet editorial fragments into the final board. */
.wk-source-page .wk-floating-card,.wk-source-page svg.wk-you{animation:none!important}
.wk-source-page svg.wnb-fragment{height:auto;overflow:visible;filter:drop-shadow(2px 4px 3px #11110f23)}
.wk-source-page .wk-floating-a{transform:rotate(-6deg)}
.wk-source-page .wk-floating-b{transform:rotate(5deg)}
.wk-source-page svg.wk-you.wnb-fragment{transform:rotate(-8deg)}
.wk-source-page .wk-editorial .we-puzzle.wnb-fragment{transform:rotate(-4deg);filter:drop-shadow(3px 6px 4px #11110f22)}
.wk-source-page .we-materials .we-puzzle.wnb-fragment{transform:rotate(2deg)}
.wk-source-page .we-brain-pieces .we-puzzle.wnb-fragment{transform:rotate(-3deg)}
.wk-source-page .wk-ribbon svg.wnb-fragment{width:100%;max-height:115px;transform:none}
.wk-source-page .wk-puzzle-cover svg.wnb-fragment{max-height:100px;transform:none}
@media(max-width:520px){.wnb-controls{flex-wrap:nowrap;gap:18px}.wnb-controls>button{flex-basis:auto}.wnb-controls>div{width:auto}.wnb-controls>div>button{font-size:11px}.wk-source-page .wk-ribbon svg.wnb-fragment{max-height:95px}}

/* Accessible controls for the original two-sided center. */
.wnb-controls [data-native-board-turn] span{font-size:16px;color:#C2330C;margin-left:4px}
@media(max-width:1150px){.wnb-controls{flex-wrap:wrap;gap:0 20px}.wnb-controls>button{flex-basis:100%}.wnb-controls>div{width:100%;justify-content:space-between;gap:20px}}
@media(min-width:801px){.wnb-controls>div>button{font-size:11px}}
@media(prefers-reduced-motion:reduce){.wnb-controls>div{justify-content:flex-end}}

/* The depth is in the native SVG perimeter; the page composition owns movement. */
.wk-source-page svg.wnb-fragment{filter:drop-shadow(5px 10px 8px #11110f21)}
.wnb-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:0 20px}
.wnb-controls>div{display:contents}
.wnb-controls>button{display:inline-flex;justify-content:flex-start;gap:8px;flex-basis:auto;width:max-content;max-width:100%;white-space:nowrap}
.wnb-controls [data-native-board-play]{grid-column:1;grid-row:1}
.wnb-controls [data-native-board-turn]{grid-column:2;grid-row:1;justify-self:end;white-space:nowrap}
.wnb-controls [data-native-board-pause]{grid-column:1/-1;grid-row:2;justify-self:center}
.wnb-controls button[hidden]{display:none!important}
.wnb-controls [data-native-board-turn] span{margin-left:5px}
@media(max-width:520px){.wnb-controls{gap:0 12px}.wnb-controls>button,.wnb-controls>div>button{font-size:11px}.wnb-controls>button{flex-basis:auto}.wnb-controls [data-native-board-turn] span{margin-left:3px}.wnb-controls [data-native-board-play]>span{font-size:14px}}

/* Playback status remains available to assistive technology without narrating the artwork. */
.wnb-heading{position:absolute;width:1px;height:1px;padding:0;margin:-1px;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}