.stimulus-playback{max-width:1280px;margin:0 auto;padding-top:25px;padding-bottom:135px}
.playback-heading{display:grid;grid-template-columns:30% minmax(0,1fr);gap:3vw;margin-bottom:65px}
.playback-heading h3{font-size:clamp(35px,4vw,58px);font-weight:400;line-height:1.2;letter-spacing:-.05em;margin:0 0 28px}
.playback-heading p{max-width:640px;font-size:16px;line-height:1.9;color:#71816c}
.playback-layout{display:grid;grid-template-columns:minmax(220px,330px) minmax(0,1fr);gap:clamp(60px,9vw,140px);align-items:start;margin:0 5%}
.stimulus-movie{margin:0;max-width:330px}
.stimulus-movie video{display:block;width:100%;aspect-ratio:120/169;object-fit:contain;background:#070808}
.stimulus-movie figcaption,.playback-frames figcaption{display:flex;justify-content:space-between;gap:12px;margin-top:13px;font:10px 'DM Mono',monospace;color:#82907a;line-height:1.7}
.playback-reading{padding-top:4px;min-width:0}
.playback-status{display:flex;justify-content:space-between;gap:20px;padding-bottom:23px;border-bottom:1px solid var(--line);font:10px 'DM Mono',monospace;letter-spacing:.04em;color:#7b8b71}
#stimulus-state{color:#3f694f}
.playback-time{margin:30px 0 8px;display:flex;align-items:baseline;gap:15px;flex-wrap:wrap}
#stimulus-clock{font:clamp(39px,4.1vw,60px) 'DM Mono',monospace;letter-spacing:-.065em;color:#293b2c;font-variant-numeric:tabular-nums}
.playback-duration{font:12px 'DM Mono',monospace;color:#91a085}
.playback-origin{font-size:11px;color:#7d8d71;margin:0}
.playback-origin span{font-family:'DM Mono',monospace;margin-left:5px}
.playback-trace{margin:38px 0 33px;padding:10px 0 0;--progress:0%}
.playback-track{height:37px;position:relative;background:repeating-linear-gradient(90deg,#dce3d6 0px,#dce3d6 1px,transparent 1px,transparent 5%);border-bottom:1px solid #b9c6ae;overflow:hidden}
.playback-progress{position:absolute;bottom:0;left:0;height:3px;width:var(--progress);background:#557852}
.playback-cursor{position:absolute;bottom:0;top:0;left:clamp(0px,var(--progress),calc(100% - 1px));width:1px;background:#3e6848}
.playback-cursor:before{content:'';position:absolute;top:0;left:-3px;width:7px;height:7px;background:#3e6848;border-radius:50%}
.playback-ticks{display:flex;justify-content:space-between;margin-top:9px;font:10px 'DM Mono',monospace;color:#8a987d}
.playback-stages{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.playback-stages li{border-top:1px solid #dae1d4;padding-top:14px;opacity:.55;transition:opacity .35s,border-color .35s}
.playback-stages li.is-current{opacity:1;border-color:#537953}
.playback-stages li.is-seen{opacity:.85}
.playback-stages span{font:9px 'DM Mono',monospace;color:#7e9070}
.playback-stages strong{display:block;margin:12px 0 8px;font-size:16px;font-weight:400;color:#3f5c39}
.playback-stages p{font-size:11px;line-height:1.9;color:#7e8e75;margin:0}
.playback-actions{display:flex;gap:15px 23px;flex-wrap:wrap;margin-top:34px;padding-top:20px;border-top:1px solid var(--line);align-items:center}
.playback-actions a,.playback-actions button{font-size:11px;line-height:1.8;color:#5c7850}
.playback-actions button{border:0;background:none;padding:0;cursor:pointer;font-family:inherit}
.playback-actions button:hover,.playback-actions a:hover{color:#253e28;text-decoration:underline;text-underline-offset:4px}
.playback-actions :focus-visible{outline:2px solid #527651;outline-offset:5px}
.playback-footnote{margin:22px 0 0;font-size:11px;line-height:2;color:#87967b;max-width:500px}
.playback-frames{margin:90px 5% 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(35px,6vw,90px);padding-top:30px;border-top:1px solid var(--line)}
.playback-frames figure{margin:0;min-width:0;max-width:195px}
.playback-frames figure:nth-child(2){justify-self:center}.playback-frames figure:nth-child(3){justify-self:end}
.playback-frames img{display:block;width:100%;aspect-ratio:120/169;object-fit:contain;background:#060707;cursor:zoom-in}
.playback-source-note{margin:30px 5% 0;max-width:830px!important;font-size:10px!important;line-height:2!important}
@media(max-width:900px){.playback-layout{margin:0;gap:45px;grid-template-columns:minmax(180px,260px) minmax(0,1fr)}.playback-stages{gap:12px}.playback-stages strong{font-size:14px}.playback-frames{margin-left:0;margin-right:0}}
@media(max-width:650px){.stimulus-playback{padding-top:15px;padding-bottom:85px}.playback-heading{display:block;margin-bottom:38px}.playback-heading h3{margin-top:25px;font-size:39px}.playback-heading p{font-size:14px}.playback-layout{grid-template-columns:1fr;gap:37px}.stimulus-movie{max-width:255px;justify-self:center;width:100%}.playback-time{margin-top:22px}.playback-trace{margin-top:27px}.playback-stages{gap:16px}.playback-stages span{font-size:8px}.playback-stages p{font-size:10px}.playback-frames{margin-top:52px;gap:23px}.playback-frames figcaption{flex-direction:column;gap:0;font-size:9px}.playback-source-note{margin:25px 0 0}.playback-actions{gap:12px 20px}}
@media(prefers-reduced-motion:reduce){.playback-stages li{transition:none}}