@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;600;700&family=Inter:wght@400;500;600;700&display=swap');
@font-face{font-family:'TWK Lausanne';src:url('assets/fonts/TWKLausanne-400.otf') format('opentype');font-weight:400;font-display:swap}
@font-face{font-family:'TWK Lausanne';src:url('assets/fonts/TWKLausanne-700.otf') format('opentype');font-weight:700;font-display:block}
:root{--paper:#f8f8f5;--green:#193b32;--blue:#5b94f7;--solar:#e6f81a;--nav:134px;--scale:.5;color:#1b1b1b;background:var(--paper)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:var(--nav)}body{margin:0;overflow-x:hidden;font-family:'TWK Lausanne',Arial,sans-serif}button{font:inherit;cursor:pointer}.skip{position:fixed;z-index:100;top:-80px;left:16px;background:var(--green);color:white;padding:10px}.skip:focus{top:8px}
header{position:fixed;z-index:40;top:0;left:0;right:0;background:var(--paper);border-bottom:2px solid var(--green)}.masthead{height:68px;padding:18px 38px;display:flex;align-items:flex-start;justify-content:space-between;position:relative}.wordmark img{display:block;width:112px;height:auto}.collection{font:11px/1.2 'IBM Plex Mono',monospace;letter-spacing:.16em;position:absolute;left:50%;top:32px;transform:translateX(-50%);white-space:nowrap}.header-actions{display:flex;gap:12px;align-items:center}.header-actions button{font:11px 'IBM Plex Mono',monospace;border:0;background:transparent;color:#555}.header-actions #reset-collage{padding:8px 10px;border:1px solid #c5cec7;color:var(--green)}#reset-collage:disabled{opacity:.45;cursor:default}#reset-collage:not(:disabled):hover{background:#e6ede7}
nav{min-height:65px;display:flex;justify-content:center;align-items:flex-start;gap:8px;padding:8px 16px 16px;flex-wrap:wrap}nav button{background:transparent;border:1px solid #c9d0c9;padding:10px 20px;border-radius:0;font:14px 'TWK Lausanne',Arial,sans-serif;white-space:nowrap}nav button:hover,nav button:focus-visible{border-color:var(--green);background:#e5ece7}nav button.selected{background:var(--green);color:white;border-color:var(--green)}.progress{height:2px;position:absolute;bottom:-2px;left:0;right:0;overflow:hidden}.progress i{display:block;width:100%;height:100%;background:var(--green);transform-origin:left;transform:scaleX(0)}
#grid{position:fixed;inset:var(--nav) 0 0;z-index:-1;pointer-events:none;background-color:var(--paper);background-image:linear-gradient(to right,#193b3225 1px,transparent 1px),linear-gradient(to bottom,#193b3224 1px,transparent 1px);background-size:calc(154px * var(--scale)) calc(50.2px * var(--scale));background-position:var(--grid-x,0px) var(--grid-y,0px)}#grid:after{content:'';position:absolute;left:var(--spine-x,20%);top:0;bottom:0;width:1px;background-image:repeating-linear-gradient(to bottom,#597066 0 calc(10px * var(--scale)),transparent calc(10px * var(--scale)) calc(25.1px * var(--scale)));background-size:1px calc(50.2px * var(--scale));background-position-y:var(--grid-y,0px);opacity:.9}
.opening{height:calc(100svh + 32px);min-height:450px;padding-top:var(--nav)}.title-card{height:calc(100svh - var(--nav));min-height:450px;background:var(--green);color:var(--paper);position:relative;display:grid;place-items:center;transform-origin:center;will-change:transform}.title-card h1{font-size:clamp(58px,10vw,150px);line-height:1;letter-spacing:-.055em;margin:0;font-weight:700}.hero-meta,.hero-foot{position:absolute;left:3%;right:3%;display:flex;justify-content:space-between;align-items:center}.hero-meta{top:26px;font:11px 'IBM Plex Mono',monospace;letter-spacing:.15em}.hero-foot{bottom:27px;font-size:16px}.hero-foot a{color:inherit;text-decoration:none}.hero-foot a span{margin-left:12px}
.chapter{height:calc(1807.2px * var(--scale));position:relative}.chapter-pin{position:relative;padding-top:calc(100.4px * var(--scale));display:flex;justify-content:center;align-items:flex-start}.frame-shell{width:calc(1920px * var(--scale));height:calc(1512px * var(--scale));position:relative;flex:none}.frame{width:1920px;height:1512px;position:absolute;left:0;top:0;transform:scale(var(--scale));transform-origin:top left}.piece,.block,.art-label,.frame-copy,.frame-title,.title-back,.copy-back,.spine-dot{position:absolute}.piece{overflow:hidden;z-index:2;cursor:grab;touch-action:none;user-select:none;translate:var(--drag-x,0px) var(--drag-y,0px)}.piece:active{cursor:grabbing}.piece img{width:100%;height:100%;object-fit:contain;display:block;pointer-events:none;user-select:none;-webkit-user-drag:none}.piece.cover img{object-fit:cover}.piece.framed{border:1px solid #161b19}.piece.multiply img{mix-blend-mode:multiply}.block{z-index:0;background:var(--blue)}.block.green{background:var(--green)}.block.black{background:#141414}.block.solar{background:var(--solar)}.title-back,.copy-back{left:190px;background:var(--paper);z-index:10;clip-path:inset(calc(1px / var(--scale)) 0 0 calc(1px / var(--scale)))}.title-back{top:54.2px;height:100.4px;width:var(--title-w,770px)}.copy-back{top:154.6px;height:var(--copy-h,251px);width:var(--copy-w,1386px)}.frame-title{z-index:11;left:230px;top:81px;font:700 44px/1 'IBM Plex Mono',monospace;letter-spacing:-.44px;margin:0}.frame-copy{z-index:11;left:230px;top:180.6px;width:var(--text-w,1290px);font:300 43.5px/55.2px 'IBM Plex Mono',monospace;margin:0}.spine-dot{z-index:12;left:174px;top:88px;width:32px;height:32px;background:var(--blue);border-radius:50%}.mobile-copy{display:none}.art-label{z-index:7;font:600 29px/1.1 'IBM Plex Mono',monospace}.art-label.small{font-size:19px}.art-label.white{color:white}.art-label.blue{color:var(--blue)}.art-label.solar{background:var(--solar);padding:8px 14px}.art-label.green{background:var(--green);color:white;padding:12px 18px}
.chapter-index{position:fixed;z-index:20;left:22px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:14px}.chapter-index a{display:block;width:8px;height:8px;border-radius:50%;background:#94a49a;transition:transform .2s,background .2s}.chapter-index a.active{background:var(--green);transform:scale(1.9)}.position{position:fixed;z-index:20;bottom:20px;left:38px;right:38px;display:flex;justify-content:space-between;color:var(--green);font:10px 'IBM Plex Mono',monospace;letter-spacing:.15em;pointer-events:none}
.closing{height:150svh;position:relative}.ending-stage{position:fixed;inset:var(--nav) 0 0;z-index:30;visibility:hidden;opacity:0;pointer-events:none;overflow:hidden}.ending-stage.visible{visibility:visible;opacity:1}.ending-panel{position:absolute;inset:0;background:var(--green);color:var(--paper);transform-origin:center;display:grid;place-items:center}.ending-panel h2{font-size:clamp(55px,10vw,150px);line-height:1;letter-spacing:-.05em;margin:0}.ending-actions{position:absolute;bottom:28px;left:28px;right:28px;display:grid;grid-template-columns:1fr auto 1fr;gap:10px;pointer-events:auto}.ending-actions[hidden]{display:none}.ending-actions button{border:1px solid #ffffff70;color:white;background:transparent;padding:11px 16px;font-size:11px;transition:background-color .2s,border-color .2s,color .2s}.ending-actions button:hover,.ending-actions button:focus-visible{background:var(--blue);border-color:var(--blue);color:var(--green)}.ending-actions button:first-child{justify-self:start}.ending-actions button:last-child{justify-self:end}body.ending-fullscreen .chapter-index,body.ending-fullscreen .position{visibility:hidden}
dialog{border:0;max-width:430px;padding:42px;background:var(--green);color:white;box-shadow:0 20px 60px #0005}dialog::backdrop{background:#122821a8}dialog h2{font-size:36px;margin:8px 0}dialog p{font:15px/1.5 'IBM Plex Mono',monospace}dialog .eyebrow{font:11px 'IBM Plex Mono',monospace;letter-spacing:.13em}dialog .muted{opacity:.65}dialog button{border:1px solid white;color:white;background:none;padding:10px}#close-dialog{position:absolute;right:14px;top:14px;border:0;font-size:24px;padding:2px}.sr-only{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important}
/* Individual collage treatments follow the Frame.io sequence. */
#impossible .speaking-machine{transform:rotate(-9deg)}#impossible .speaking-machine img{object-fit:contain}#impossible .machine-drawing{mix-blend-mode:multiply}#impossible .machine-photo{filter:grayscale(1)}
#lektor .founders{z-index:5}#lektor .founders img{object-fit:contain}#lektor .lektor-photo{filter:grayscale(1)}.cassette{position:absolute;z-index:6;background:#161b1a;border:16px solid #242928;box-shadow:18px 18px 0 #0003;transform:rotate(-8deg)}.cassette:before,.cassette:after{content:'';position:absolute;top:23%;width:94px;height:94px;border:13px solid #d6d8d3;border-radius:50%;background:radial-gradient(circle,#161b1a 0 22%,#8b918c 24% 32%,#191e1a 35%);box-sizing:border-box}.cassette:before{left:18%}.cassette:after{right:18%}.cassette span{position:absolute;left:20%;right:20%;bottom:20%;height:16%;background:#ddd9c9;transform:skewX(-15deg)}
#lektor .audio-toggle,#borders .audio-toggle,#finance .audio-toggle{display:flex;align-items:center;justify-content:center;border:1px solid transparent;border-radius:50%;background:transparent;color:#1a1919;padding:0;cursor:pointer;transition:background-color .18s ease,transform .18s ease}
#lektor .audio-toggle:hover,#borders .audio-toggle:hover,#finance .audio-toggle:hover{background:#dce9e4;transform:scale(1.06)}
#lektor .audio-toggle[aria-pressed="true"],#borders .audio-toggle[aria-pressed="true"],#finance .audio-toggle[aria-pressed="true"]{background:var(--green)}
#lektor .audio-toggle[aria-pressed="true"] img,#borders .audio-toggle[aria-pressed="true"] img,#finance .audio-toggle[aria-pressed="true"] img{filter:invert(1)}
#lektor .audio-toggle img,#borders .audio-toggle img,#finance .audio-toggle img{display:block;width:40px;height:40px;pointer-events:none}
#lektor .frame-audio{position:absolute;left:790px;top:69px;width:68px;height:68px;z-index:14}
#borders .frame-audio{position:absolute;left:910px;top:69px;width:68px;height:68px;z-index:14}
#finance .frame-audio{position:absolute;left:936px;top:69px;width:68px;height:68px;z-index:14}
#lektor .mobile-audio,#borders .mobile-audio,#finance .mobile-audio{display:none}
@media(max-width:700px){#lektor .frame-audio,#borders .frame-audio,#finance .frame-audio{display:none}#lektor .mobile-audio,#borders .mobile-audio,#finance .mobile-audio{display:inline-flex;width:44px;height:44px;vertical-align:middle;margin-bottom:12px}#lektor .mobile-audio img,#borders .mobile-audio img,#finance .mobile-audio img{width:24px;height:24px}}
#speak .television{filter:grayscale(.3)}#speak .television.secondary{filter:grayscale(1);opacity:.84}#speak .tv-block{background:var(--blue)}
#born .number-eleven{font:700 430px/1 'TWK Lausanne',Arial,sans-serif;letter-spacing:-.09em;color:white}#born .month{font-size:72px;letter-spacing:-.04em}#born .apollo{filter:grayscale(1)}.media-strip{position:absolute;z-index:5;background:var(--green);color:#f8f8f3;display:flex;align-items:center;justify-content:space-around;font:32px 'IBM Plex Mono',monospace}.media-strip .track{height:4px;background:#f8f8f3;width:38%}
#borders .studio{filter:grayscale(1)}#borders .waveform{mix-blend-mode:multiply}.newspaper{position:absolute;z-index:4;color:var(--green);background:#e7ebec;border:1px solid #9da8a4;box-shadow:10px 10px 0 #193b3229;padding:20px 26px;font:700 31px/1.14 'IBM Plex Mono',monospace;transform:rotate(-6deg)}.newspaper small{display:block;font:16px/1.4 'IBM Plex Mono',monospace;border-bottom:2px solid currentColor;padding-bottom:8px;margin-bottom:16px}
#finance .map{opacity:.58;mix-blend-mode:multiply}.currency{position:absolute;z-index:3;color:#fff;background:var(--blue);font:700 290px/1 'TWK Lausanne',Arial,sans-serif;text-align:center;overflow:hidden}.currency span{position:absolute;inset:0;display:grid;place-items:center;opacity:0;animation:currency-one 8s steps(1,end) infinite}.currency span:nth-child(2){animation-name:currency-two}.currency span:nth-child(3){animation-name:currency-three}.currency span:nth-child(4){animation-name:currency-four}.bar-chart{position:absolute;z-index:4;display:flex;align-items:end;gap:12px}.bar-chart i{display:block;width:72px;background:var(--green);animation:bars 3.2s steps(1,end) infinite}.bar-chart i:nth-child(1){height:30%}.bar-chart i:nth-child(2){height:48%}.bar-chart i:nth-child(3){height:62%}.bar-chart i:nth-child(4){height:80%}.bar-chart i:nth-child(5){height:96%}.finance-note{background:var(--solar);padding:14px 22px}.finance-mark{font:700 90px/1 'TWK Lausanne',Arial,sans-serif;letter-spacing:-.08em;background:var(--solar);padding:14px 24px}
.step-a,.step-b{animation:step-a 5.8s steps(1,end) infinite}.step-b{animation-name:step-b}@keyframes step-a{0%,8%{opacity:0}9%,68%{opacity:1}69%,100%{opacity:0}}@keyframes step-b{0%,32%{opacity:0}33%,88%{opacity:1}89%,100%{opacity:0}}@keyframes currency-one{0%,24.9%{opacity:1}25%,100%{opacity:0}}@keyframes currency-two{0%,24.9%{opacity:0}25%,49.9%{opacity:1}50%,100%{opacity:0}}@keyframes currency-three{0%,49.9%{opacity:0}50%,74.9%{opacity:1}75%,100%{opacity:0}}@keyframes currency-four{0%,74.9%{opacity:0}75%,100%{opacity:1}}@keyframes bars{0%,100%{scale:1 1}35%{scale:1 .76}65%{scale:1 1.09}}
.chapter .piece img,.chapter .block:not(.step-a):not(.step-b){animation:held 3.8s steps(1,end) infinite;animation-play-state:paused}.chapter.motion-active .piece img,.chapter.motion-active .block,.chapter.motion-active .step-a,.chapter.motion-active .step-b{animation-play-state:running}@keyframes held{0%,100%{translate:0 0}34%{translate:6px -4px}68%{translate:-3px 3px}}
body.reduced *,body.reduced *:before,body.reduced *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}body.reduced .step-a,body.reduced .step-b,body.reduced .currency span:first-child{opacity:1}

/* Match the reverse-intro closing transition used by the other stories. */
.closing{height:calc(100svh - var(--nav));min-height:0;scroll-snap-align:none}
.ending-stage{position:relative;inset:auto;width:100%;height:100%;z-index:30;visibility:hidden;opacity:1;pointer-events:none;overflow:hidden}
.ending-stage.visible{visibility:visible}
.ending-panel{will-change:transform}
@media(max-width:700px){:root{--nav:125px}.masthead{height:55px;padding:11px 15px}.wordmark img{width:94px}.collection{display:none}.header-actions{gap:2px}.header-actions button{font-size:9px}.header-actions #reset-collage{padding:5px 6px}nav{min-height:70px;gap:4px;padding:4px 8px 8px}nav button{font-size:10px;padding:7px 9px}.opening{min-height:420px}.title-card{min-height:420px}.title-card h1{font-size:clamp(46px,13vw,80px)}.hero-meta{font-size:8px}.hero-foot{font-size:11px}.chapter{height:auto;min-height:calc(100svh - var(--nav));padding:30px 0 70px}.chapter-pin{position:relative;top:auto;height:auto;display:flex;flex-direction:column;align-items:center;overflow:hidden;gap:18px}.mobile-copy{display:block;width:calc(100% - 74px);position:relative;z-index:12;font-family:'IBM Plex Mono',monospace}.mobile-copy h2{font-size:20px;line-height:1.25;margin:0 0 12px;background:var(--paper);padding:8px}.mobile-copy h2:before{content:'';display:inline-block;width:8px;height:8px;margin-right:10px;border-radius:50%;background:var(--blue)}.mobile-copy p{font:300 14px/1.5 'IBM Plex Mono',monospace;background:var(--paper);padding:8px;margin:0}.frame-shell{max-width:100vw}.frame .frame-title,.frame .frame-copy,.frame .title-back,.frame .copy-back,.frame .spine-dot{display:none}.chapter-index{left:11px;gap:12px}.position{left:18px;right:18px;font-size:8px}.ending-actions{left:12px;right:12px;bottom:20px;gap:4px}.ending-actions button{font-size:9px;padding:7px 6px}.ending-panel h2{font-size:12vw}}

/* Reference pass: free-flowing chapters and panels aligned to the 154 × 50.2 grid. */
.frame{isolation:isolate}
.frame-title{white-space:nowrap}
.art-label.aligned-label{height:50.2px;display:flex;align-items:center;padding:0 12px;background:var(--paper);font:300 25px/1 'IBM Plex Mono',monospace;white-space:nowrap;clip-path:inset(calc(1px / var(--scale)))}
.years-stack,.eleven-column{position:absolute;font:300 25px/50.2px 'IBM Plex Mono',monospace}
.years-stack{font-size:25pt;line-height:1}
.years-stack span{display:flex;align-items:center;height:50.2px}
.eleven-column{width:154px;text-align:right;padding-right:12px}
.eleven-column span{display:block;height:50.2px}
.machine-detail img{object-fit:cover;object-position:bottom}
#born .piece img{filter:none}
#borders .press{z-index:12}
.finance-stair{position:absolute;background:var(--green);clip-path:polygon(66.666% 0,100% 0,100% 100%,0 100%,0 38.46%,33.333% 38.46%,33.333% 30.77%,66.666% 30.77%)}
.currency-band{position:absolute;background:var(--blue);color:var(--paper);overflow:hidden}
.currency-procession{height:100%;display:flex;width:max-content;animation:eleven-currency-pan 22s linear infinite;animation-play-state:paused}
.currency-procession span{width:280px;flex:none;font:400 440px/.9 'TWK Lausanne',sans-serif;display:flex;align-items:center;justify-content:center}
.motion-active .currency-procession{animation-play-state:running}
@keyframes eleven-currency-pan{to{transform:translateX(-280px)}}
.voice-wave{position:absolute;z-index:6;height:150.6px;display:flex;align-items:center;justify-content:space-evenly;background:var(--blue);padding:20px}
.voice-wave.green{background:var(--green)}
.voice-wave i{width:9px;border-radius:10px;background:var(--paper);height:var(--height);animation:voice-pulse 2s ease-in-out infinite alternate;animation-delay:calc(var(--bar) * -90ms);animation-play-state:paused}
.motion-active .voice-wave i{animation-play-state:running}
@keyframes voice-pulse{to{height:calc(var(--height) * .45)}}
#voices .angelou img{object-position:top center}
#voices .caine img{object-position:center}
.chapter .piece img,.chapter .block:not(.step-a):not(.step-b){animation:none}
@media(min-width:701px){.chapter-pin{overflow:visible}}
@media(max-width:700px){.chapter-pin{padding-top:0}.frame-shell{height:calc(1100px * var(--scale));overflow:hidden}.frame{top:calc(-405.6px * var(--scale))}.chapter{min-height:0}.frame-title{white-space:normal}}

/* Use the same full-height intro and reverse-intro outro as the other stories. */
main{padding-top:var(--nav);overflow-x:clip}
.opening{height:calc(100svh - var(--nav) + 32px);min-height:560px;padding-top:0}
.reduced .opening{height:calc(100svh - var(--nav))}
.title-card{height:calc(100svh - var(--nav));min-height:0;color:#fff}
.closing{height:calc(100svh - var(--nav));min-height:0}
.ending-stage{z-index:19}
.ending-panel{color:#fff}
.closing h2{font:700 clamp(40px,7.3vw,112px)/1.05 'TWK Lausanne',Inter,Arial,sans-serif;letter-spacing:-.04em;margin:0}
.ending-actions{left:30px;right:30px;bottom:29px;align-items:center;gap:12px}
.ending-actions button{border:1px solid #ffffff88;padding:12px 17px;font-size:11px}
@media(max-width:700px){.opening{min-height:0}.closing h2{font-size:clamp(35px,11vw,72px);white-space:nowrap}.ending-actions{left:10px;right:10px;gap:5px}.ending-actions button{font-size:9px;padding:8px 6px}}

/* Keep the recovered artwork, with the baked-in video grid masked away. */
#lektor .lektor-cutout{mask:url('assets/elevenlabs-lektor-building-mask.svg') 0 0 / 100% 100% no-repeat}
#lektor .founders-cutout{mask:url('assets/elevenlabs-founders-art-mask.svg') 0 0 / 100% 100% no-repeat}

/* Separate player layer; each held offset stays down/right of its original position. */
#lektor .lektor-blue-back{background:#73a4f4}
#lektor .lektor-player{z-index:3;clip-path:polygon(0% 41.06%,45.60% 0%,100% 29.14%,98.27% 43.71%,62.18% 100%,.69% 53.86%);animation:lektor-player-held 5.6s steps(1,end) infinite;animation-play-state:paused;will-change:transform}
#lektor.motion-active .lektor-player{animation-play-state:running}
#lektor .lektor-player img{position:absolute;left:-20px;top:-17px;width:1230px;height:956px;max-width:none;object-fit:fill}
@keyframes lektor-player-held{0%,100%{transform:translate(0,0)}20%{transform:translate(4px,2px)}40%{transform:translate(9px,5px)}60%{transform:translate(6px,9px)}80%{transform:translate(2px,4px)}}

#impossible .speaking-machine-back{background:#73a4f4}
#impossible .machine-cutout{mask:url('assets/elevenlabs-speaking-machine-mask.svg') 0 0 / 100% 100% no-repeat;animation:speaking-machine-held 5.2s steps(1,end) infinite;animation-play-state:paused;will-change:transform}
#impossible.motion-active .machine-cutout{animation-play-state:running}
@keyframes speaking-machine-held{0%,100%{transform:translate(0,0)}20%{transform:translate(3px,2px)}40%{transform:translate(7px,5px)}60%{transform:translate(4px,8px)}80%{transform:translate(1px,4px)}}

.television-loop video,.studio-loop video{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none}

/* The player head and white fill advance together at the reference video's pace. */
#born .player-progress-cover{position:absolute;left:0;top:0;width:100%;height:68px;background:#193b32 url('assets/elevenlabs-ref-player.png') 0 -425px / 2015px 505px no-repeat}
#born .player-progress-track{position:absolute;left:38px;right:0;top:34px;height:9px;background:#ffffff70}
#born .player-progress-fill{position:absolute;inset:0;background:#fff;transform:scaleX(.4);transform-origin:left;animation:player-progress-fill 40s linear infinite;animation-delay:-16s;animation-play-state:paused}
#born .player-progress-dot{position:absolute;left:40%;top:50%;width:24px;height:24px;border-radius:50%;background:#fff;transform:translate(-50%,-50%);animation:player-progress-head 40s linear infinite;animation-delay:-16s;animation-play-state:paused}
#born.motion-active .player-progress-fill,#born.motion-active .player-progress-dot{animation-play-state:running}
@keyframes player-progress-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes player-progress-head{from{left:0%}to{left:100%}}

/* Reference finance loops: held currency changes, grid-sized bar steps, and banknote cuts. */

.currency-cascade{display:flex;width:max-content;height:100%}
.currency-column{width:280px;height:401.6px;overflow:hidden;flex:none}
.currency-reel{animation:finance-currency-rise 8s cubic-bezier(.45,0,.25,1) infinite;animation-delay:calc(var(--column) * .16s);animation-play-state:paused}
.currency-reel span{display:flex;align-items:center;justify-content:center;width:280px;height:401.6px;overflow:hidden;font:700 440px/.9 'TWK Lausanne',sans-serif}
.motion-active .currency-reel{animation-play-state:running}
@keyframes finance-currency-rise{0%,18%{transform:translateY(0)}25%,43%{transform:translateY(-401.6px)}50%,68%{transform:translateY(-803.2px)}75%,93%{transform:translateY(-1204.8px)}100%{transform:translateY(-1606.4px)}}
.finance-bars{position:absolute;z-index:1}
.finance-bars i{position:absolute;bottom:0;display:block;width:154px;height:var(--bar-height);background:var(--green);animation:finance-bar-0 6s steps(7,end) infinite;animation-play-state:paused}
.motion-active .finance-bars i{animation-play-state:running}
.finance-bars i:nth-child(1){animation-name:finance-bar-0;animation-timing-function:steps(7,end)}
@keyframes finance-bar-0{0%,5.3333%{height:50.2px}13.3333%,99.999%{height:401.6px}100%{height:50.2px}}
.finance-bars i:nth-child(2){animation-name:finance-bar-1;animation-timing-function:steps(8,end)}
@keyframes finance-bar-1{0%,18.6667%{height:50.2px}26.6667%,99.999%{height:451.8px}100%{height:50.2px}}
.finance-bars i:nth-child(3){animation-name:finance-bar-2;animation-timing-function:steps(12,end)}
@keyframes finance-bar-2{0%,32.0000%{height:50.2px}40.0000%,99.999%{height:652.6px}100%{height:50.2px}}
.finance-bars i:nth-child(4){animation-name:finance-bar-3;animation-timing-function:steps(15,end)}
@keyframes finance-bar-3{0%,45.3333%{height:50.2px}53.3333%,99.999%{height:803.2px}100%{height:50.2px}}
.finance-bars i:nth-child(5){animation-name:finance-bar-4;animation-timing-function:steps(19,end)}
@keyframes finance-bar-4{0%,58.6667%{height:50.2px}66.6667%,99.999%{height:1004px}100%{height:50.2px}}
#finance .banknote-cuts img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;animation:finance-banknote-cut 3s steps(1,end) infinite;animation-delay:calc(var(--note) * .5s - 3s);animation-play-state:paused}
#finance .banknote-cuts img:first-child{opacity:1}
#finance.motion-active .banknote-cuts img{animation-play-state:running}
@keyframes finance-banknote-cut{0%,16.666%{opacity:1}16.667%,100%{opacity:0}}
body.reduced #finance .banknote-cuts img{opacity:0}
body.reduced #finance .banknote-cuts img:first-child{opacity:1}

.piece[data-hover-name]:focus-visible{outline:calc(3px / var(--scale)) solid var(--blue);outline-offset:calc(4px / var(--scale))}
.image-caption{position:fixed;z-index:50;max-width:260px;padding:13px 16px 14px;background:var(--green);color:#fff;font:14px/1.45 'IBM Plex Mono',monospace;letter-spacing:.01em;white-space:pre-line;overflow-wrap:anywhere;box-shadow:0 8px 24px #29230026;pointer-events:none}
.image-caption[hidden]{display:none}

/* Fit the glyph ink inside each clipped slot, rather than clipping its font box. */
.currency-reel span{line-height:1}
.currency-reel span b{display:block;flex:none;font:inherit;transform:scale(var(--glyph-x,.9),var(--glyph-y,1));transform-origin:center}
.currency-reel span[data-currency="£"]{--glyph-x:.9}
.currency-reel span[data-currency="$"]{--glyph-x:.94;--glyph-y:.83}
.currency-reel span[data-currency="€"]{--glyph-x:.79}
.currency-reel span[data-currency="¥"]{--glyph-x:.92}