@font-face{font-family:Plex;src:url('../../fonts/brandbook/ibm-plex-sans-400.ttf')}@font-face{font-family:Plex;src:url('../../fonts/brandbook/ibm-plex-sans-600.ttf');font-weight:600}@font-face{font-family:Condensed;src:url('../../fonts/brandbook/barlow-condensed-700.ttf');font-weight:700}@font-face{font-family:Mono;src:url('../../fonts/brandbook/ibm-plex-mono-400.ttf')}
:root{--paper:#f8f5ed;--ink:#393630;--muted:#746e64;--orange:#be4b0a;--line:#d9d1c3;color-scheme:light}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Plex,Arial,sans-serif}button,a,input{touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer;background:transparent;border:1px solid var(--line);padding:10px 16px;border-radius:3px}button:hover{background:#ede7db}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--orange);outline-offset:4px}button:disabled{cursor:default;opacity:.45}header{height:65px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 4vw;gap:20px}header a{color:var(--ink);text-decoration:none;font-size:25px;font-weight:600}header a span,h1 span{color:var(--orange)}header small,.edition,.eyebrow,.sheet-mark,.stage-bottom,footer,#time{font:10px Mono,monospace;letter-spacing:1.2px}header small{margin-left:13px}.edition{color:var(--muted)}header button{font-size:12px;border:0}main{max-width:1660px;margin:auto;padding:0 4vw}.intro{display:flex;align-items:center;justify-content:space-between;padding:29px 0 10px;gap:20px}.eyebrow{color:var(--orange);margin:0 0 9px}h1{font:700 clamp(31px,3.1vw,52px)/1.05 Condensed,Arial,sans-serif;margin:0}.intro-note{font-size:13px;line-height:1.6;color:var(--muted);margin:0}.stage{position:relative;isolation:isolate;overflow:hidden;margin-top:15px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#faf7ef;aspect-ratio:2/1;max-height:67vh}svg{display:block;width:100%;height:100%}.sheet-mark{position:absolute;top:18px;left:0;z-index:2;pointer-events:none;background:#f8f5ede6;padding:5px 8px}.sheet-mark span{margin-left:12px;color:var(--muted)}.stage-bottom{position:absolute;bottom:12px;left:8px;right:8px;display:flex;justify-content:space-between;pointer-events:none;color:#625d55;font-size:8px}.stage-bottom span{background:#faf7efdd;padding:4px 6px}.note-title{font-weight:600;fill:#a64106;letter-spacing:1px}.leader{fill:none;stroke:#9a8067;stroke-width:1.2}#notes>g{opacity:0}#loading{position:absolute;inset:0;display:grid;place-items:center;background:var(--paper);font:12px Mono,monospace}#loading[hidden]{display:none}.narration{display:flex;align-items:flex-start;gap:22px;min-height:108px;padding:20px 0 15px}#chapter-number{font:29px Condensed,Arial;color:var(--orange);border-bottom:2px solid var(--orange);padding-bottom:5px}.narration h2{font:700 27px/1.1 Condensed,Arial;margin:0 0 7px}.narration p{font-size:14px;line-height:1.5;margin:0;max-width:850px}.narration #time{margin-left:auto;white-space:nowrap;padding-top:5px;color:var(--muted)}.transport{display:flex;align-items:center;gap:10px;padding:0 0 18px;border-bottom:1px solid var(--line)}#play{background:var(--ink);color:var(--paper);border-color:var(--ink);min-width:160px;font-size:12px}#replay{font-size:12px}.timeline-label{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}#timeline{flex:1;min-width:50px;accent-color:var(--orange);margin-left:15px}#chapters{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;padding:16px 0}#chapters button{text-align:left;border:0;border-bottom:2px solid transparent;font-size:11px;line-height:1.4;padding:9px 7px}#chapters button span{display:block;font:9px Mono;margin-bottom:6px;color:var(--muted)}#chapters button[aria-current=true]{border-bottom-color:var(--orange);background:#ede7db}details{border-top:1px solid var(--line);font-size:13px;padding:15px 0;color:var(--muted)}summary{cursor:pointer}details li{padding:6px;max-width:850px;line-height:1.5}details p{max-width:900px;line-height:1.6}#motion-note{font-size:13px;color:var(--orange)}footer{display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:8px;padding:16px 0 24px}footer span{letter-spacing:0}
@media(min-width:1600px){.stage{margin-top:24px}}@media(max-width:700px){header{padding:0 18px;height:55px}.edition{display:none}header small{font-size:8px;margin-left:6px}header button{padding:6px;font-size:11px}main{padding:0 18px}.intro{padding-top:22px}.intro-note{display:none}.stage{aspect-ratio:1.2;max-height:none;margin-top:18px}.sheet-mark{top:8px;font-size:8px}.stage-bottom{font-size:7px;bottom:5px}.stage-bottom span:last-child{display:none}.narration{gap:12px;min-height:150px;padding-top:18px}.narration h2{font-size:24px}.narration p{font-size:13px}.narration #time{display:none}.transport{flex-wrap:wrap}#play{min-width:140px}#timeline{flex-basis:100%;margin:10px 0 0}#chapters{grid-template-columns:repeat(4,1fr);gap:4px}#chapters button{font-size:10px;padding:8px 4px}footer{display:block;line-height:1.7}footer span{display:block;margin-top:7px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

@media(max-width:700px){#notes{display:none}}

.stage{width:100%}

.note-card{filter:drop-shadow(0 2px 2px #29272220)}
#work-item,#workshop-motion{pointer-events:none}

.intro-definition{font-size:14px;line-height:1.5;max-width:62ch;margin:10px 0 0;color:var(--muted)}

/* Preserve the range and disabled states while keeping active controls explicit. */
a[href], button:not(:disabled), summary { cursor: pointer; }
