@font-face{font-family:'League Gothic';src:url('assets/LeagueGothic.ttf');font-weight:400;font-display:swap}
@font-face{font-family:'Courier Prime';src:url('assets/CourierPrime-Regular.ttf');font-weight:400;font-display:swap}
@font-face{font-family:'Courier Prime';src:url('assets/CourierPrime-Bold.ttf');font-weight:700;font-display:swap}
:root{--accent:#ffbd59}
.sticky-contacts{display:flex;align-items:center;justify-content:center;gap:3px;margin-left:auto;flex-shrink:0}.sticky-contacts a{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;color:var(--accent);transition:background .2s,color .2s}.sticky-contacts svg{width:18px;height:18px}.sticky-contacts a:hover,.sticky-contacts a:focus-visible{background:#ffbd5920;color:#fff;outline:1px solid var(--accent)}.motion-bar{padding-block:7px}.motion-bar #annotation{min-width:0;line-height:1.5}html{scroll-padding-bottom:100px}
@media(max-width:760px){.motion-bar{display:grid;grid-template-columns:1fr auto;gap:2px 8px;padding:4px 12px 8px}.sticky-contacts{grid-column:1;grid-row:1;justify-content:flex-start;margin:0;gap:0}.sticky-contacts a{width:36px;height:40px}.motion-bar #motion-toggle{grid-column:2;grid-row:1}.motion-bar #annotation{grid-column:1/-1;grid-row:2;max-width:none;font-size:8px}.mobile-index:not([hidden]){bottom:80px}.intro-cue{bottom:112px}}
.wordmark{font-family:'League Gothic',Inter,Arial,sans-serif;font-weight:400;font-size:34px;letter-spacing:.015em;color:var(--accent)}
h2,h3,figcaption,.eyebrow,.section-num,.intro-cue,.gallery-controls,.history-link,.demo-fallback{font-family:'Courier Prime','Courier New',monospace}
h2{font-size:clamp(28px,2.65vw,40px);letter-spacing:-.045em;line-height:1.15;max-width:none}
h3{font-size:21px;letter-spacing:-.025em}
figcaption strong{font-size:15px;letter-spacing:-.025em}
figcaption>span{font-size:12px}
.hero .josh-name,.resume-print .resume-hero .josh-name{font-family:'League Gothic',Inter,Arial,sans-serif;font-weight:400;color:var(--accent);white-space:nowrap;line-height:.95;letter-spacing:0;max-width:100%;font-size:clamp(86px,11vw,158px);margin:30px 0 25px}
.hero-sub{font-family:'Courier Prime','Courier New',monospace;font-size:clamp(25px,2.8vw,40px);line-height:1.2;letter-spacing:-.04em}
.hero-grid>div{min-width:0}.hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.download-links{flex-wrap:wrap;gap:16px 28px}
.download-links a{min-width:28%}.download-links a:last-child{flex:1}
.download-links a.presskit-download{color:var(--accent)}
.side-index{background:#000;border:1px solid #ffffff29;padding:20px;width:var(--rail);box-shadow:0 15px 60px #0005}
.side-index a{transform:none!important}
/* The drawing sits under opaque reading spreads. It is fully visible in the gaps. */
.backdrop{z-index:0;mix-blend-mode:normal;background:#000;overflow:hidden;opacity:.16}
.backdrop canvas,.backdrop>img{clip-path:inset(0 3px)}
main{z-index:auto}.chapter{background:#090b09;opacity:1;isolation:isolate;z-index:1;contain:paint}.intro,.interlude{position:relative;z-index:1}
body:not(.print-document) .chapter{background:transparent}
.chapter .section-inner,.chapter figure,.chapter img{opacity:1!important}
body.is-intro .backdrop{opacity:.96}
.intro{height:100svh;min-height:500px;position:relative;background:transparent;display:flex;justify-content:center;align-items:end;padding:0 25px 104px}
.intro-cue,.transition-cue{font-family:'Courier Prime','Courier New',monospace;font-size:11px;font-weight:400;letter-spacing:.09em;color:var(--accent);position:absolute;left:var(--background-center,50vw);transform:translateX(-50%);white-space:nowrap;text-align:center}.intro-cue{bottom:104px}.intro-cue span,.transition-cue>span{display:block;text-align:center;font-size:24px;margin-top:12px}
.transition-cues{position:absolute;inset:0;pointer-events:none}.transition-cue{top:var(--cue-position);line-height:1.6}.transition-cue>span{line-height:1.6}body.motion-off .transition-cues{display:none}
@keyframes chapter-solid-enter{from{transform:translateY(20px)}to{transform:none}}
body:not(.motion-off) .chapter.is-entering .section-inner{animation:chapter-solid-enter .5s ease-out both}
.easter-egg{display:flex;align-items:center;gap:15px;margin-top:25px;max-width:320px}
.easter-egg .visual{width:110px;min-width:110px;height:80px!important;aspect-ratio:auto!important}
.easter-egg img{object-fit:cover}.easter-egg figcaption{margin:0}.easter-egg figcaption strong{font-size:12px}.easter-egg figcaption>span{font-size:10px}.easter-egg .play{width:22px;height:22px;font-size:12px;right:5px;bottom:5px}
.demos{max-width:100%;margin-top:28px;border-top:1px solid var(--line);padding-top:18px;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.demos>.eyebrow{grid-column:1/-1}.demo iframe{width:100%;border:0;display:block;height:80px;background:#111}.demo-fallback{font-size:10px;display:inline-block;margin-top:6px;text-decoration:underline;text-underline-offset:3px}
.history-link{font-family:inherit;text-decoration:underline;text-decoration-color:#ffffff44;text-underline-offset:3px}.history-link:hover{color:var(--accent)}
.vancouver-layout>div:first-child>figure:first-child .visual{aspect-ratio:1.35}
.railway-clip{display:grid;grid-template-columns:140px 1fr;gap:18px;align-items:center;margin-top:26px}
.railway-clip .visual{height:90px!important;aspect-ratio:auto!important}.railway-clip figcaption{margin:0}.railway-clip strong{font-size:13px}.railway-clip figcaption>span{font-size:10px}
.media-five{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px 24px}
.media-five .visual{height:240px;aspect-ratio:auto}.media-five .visual img{object-fit:cover}.media-five figcaption{margin-top:13px}.media-five figcaption>span{font-size:12px}
.broadcast-copy p{font-size:12px;line-height:1.8}.broadcast-copy h3{font-size:20px}
.gallery-controls{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:26px;font-size:12px}.gallery-controls>div{display:flex;align-items:center;gap:16px;white-space:nowrap}.gallery-controls button{border:1px solid var(--line);width:36px;height:36px;font-size:20px}.gallery-controls button:hover{color:var(--accent);border-color:var(--accent)}.gallery-controls button:disabled{opacity:.3;cursor:default}
.gallery-track{display:flex;gap:26px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-color:var(--accent) #171b15;position:relative;padding-bottom:24px;overscroll-behavior-inline:contain}
.gallery-slide{flex:0 0 82%;scroll-snap-align:start;min-width:0}.gallery-slide>img{width:100%;height:min(58vh,620px);object-fit:contain;background:#050605}.gallery-slide figcaption strong{font-size:17px}.gallery-slide figcaption>span{font-size:13px}
.print-document h2{font-size:36px;letter-spacing:-.045em}.print-document .section-heading{margin-bottom:32px}.print-document .hero .josh-name{font-size:176px;margin:35px 0 26px}.print-document .hero-sub{font-size:40px;max-width:540px}.print-document .download-links a.presskit-download{display:none}
.print-document figcaption strong,.print-document .trio figcaption strong{font-size:17px}.print-document figcaption>span,.print-document .trio figcaption>span{font-size:13px}
.print-document .artist-photos>figure:first-child .visual{height:390px!important}.print-document .easter-egg{margin-top:22px}.print-document .easter-egg .visual{height:75px!important;width:110px}.print-document .easter-egg strong{font-size:13px}.print-document .easter-egg figcaption>span{font-size:10px}
.print-document .vancouver-layout>div:first-child>figure:first-child .visual{height:380px!important}.print-document .vancouver-layout p{font-size:19px}.print-document .vancouver-layout .lead{font-size:23px}.print-document .railway-clip .visual{height:90px!important}.print-document .railway-clip strong{font-size:14px}.print-document .railway-clip figcaption>span{font-size:11px}
.print-document .demos{margin-top:18px;padding-top:12px;gap:10px}.print-document .demo iframe{display:none}.print-document .demo-fallback{font-size:12px}.print-document .demos>.eyebrow{font-size:10px}
.print-document .media-five{grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}.print-document .media-five .visual{height:290px!important}.print-document .media-five figcaption strong{font-size:17px}.print-document .media-five figcaption>span{font-size:14px;line-height:1.6}.print-document .media-five+.wide-copy{font-size:20px;margin-top:36px;max-width:1100px}
.print-document .media-five figcaption .text-link{font-size:13px;line-height:1.5}.print-document .process figcaption .text-link{font-size:12px;line-height:1.5}
.print-document .broadcast-copy p{font-size:13px}.print-document .broadcast-copy .text-link{font-size:14px}.print-document .broadcast-copy h3{font-size:19px}
.resume-print h2{font-size:21px}.resume-print .resume-hero .josh-name{font-size:94px;margin:22px 0 20px}.resume-print .resume-title h1{font-family:'Courier Prime','Courier New',monospace;font-size:42px}.resume-print .resume-title h1 em{font-family:inherit;font-size:42px;font-style:normal}.resume-print .row strong,.resume-print .recognition-columns h3{font-family:'Courier Prime','Courier New',monospace}.resume-print .row strong{font-size:12px}.resume-print .row p{font-size:10.5px}
@media(max-width:1200px){.media-five .visual{height:210px}.hero .josh-name{font-size:clamp(80px,11.5vw,140px)}}
@media(max-width:960px){.topbar .wordmark{font-size:31px}.topbar nav{gap:18px}.media-five{grid-template-columns:repeat(2,minmax(0,1fr))}.gallery-slide{flex-basis:90%}}
@media(max-width:600px){.topbar .wordmark{font-size:28px}.topbar{padding-inline:18px;gap:10px}.topbar nav{gap:11px;font-size:9px}.topbar nav a:last-child{display:block}.index-toggle{font-size:9px}.hero .josh-name{font-size:112px;margin:25px 0}.hero-sub{font-size:30px}.hero-photo{margin:15px 0 0}.hero .download-links{display:grid;grid-template-columns:1fr 1fr}.download-links a:last-child{grid-column:auto}.hero-grid{gap:25px;grid-template-columns:minmax(0,1fr)}.intro{min-height:450px}h2{font-size:29px}.media-five{grid-template-columns:1fr}.media-five .visual{height:290px}.media-five figcaption strong{font-size:17px}.media-five figcaption>span{font-size:13px}.demos{grid-template-columns:1fr}.gallery-controls{align-items:start;font-size:11px}.gallery-controls>p{max-width:155px}.gallery-controls>div{gap:8px}.gallery-controls button{width:30px;height:30px}.gallery-slide{flex-basis:94%}.gallery-slide>img{height:50svh}.gallery-slide figcaption strong{font-size:15px}.gallery-slide figcaption>span{font-size:12px}.easter-egg{max-width:320px}.railway-clip{grid-template-columns:120px 1fr}.chapter .section-inner{animation:none!important}.hero h1{white-space:nowrap}}
@media(max-width:380px){.topbar{padding-inline:13px;gap:9px}.topbar nav{font-size:8px;gap:8px}.topbar .wordmark{font-size:25px}.index-toggle{font-size:8px}.hero .josh-name{font-size:100px}}
@media(max-width:380px){.sticky-contacts a{width:32px}}
@media print{.gallery-chapter,.intro,.presskit-download{display:none!important}.chapter{opacity:1}.section-inner{animation:none!important;transform:none!important}}
.listen-grid>figure{min-width:0}.print-document .listen-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}.print-document .listen-grid .visual,.print-document .listen-grid .square .visual{width:100%;height:380px!important;aspect-ratio:auto!important;max-width:100%}.print-document .listen-grid img{object-fit:contain;background:#050605}.print-document .listen-grid figcaption{max-width:100%}@media(max-width:600px){.topbar nav{font-size:8px;gap:9px}.topbar{gap:9px;padding-inline:14px}.topbar .wordmark{font-size:26px}}
