@font-face{font-family:ZineMetal;src:url('assets/zine-metal.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:ZineTypewriter;src:url('assets/zine-typewriter.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
.home,.photography-page,.film-page{background:#0b0b0b url('assets/zine-notes.svg') top center/1480px auto repeat-y}
.home .collage-split{background:transparent}
.home .poster-scuff{display:none}
.home .collage-side:before{opacity:.24}
.header .brand,.header nav,.header .brand-sub,.home .entry-intro,.home .side-tag,.home .cut-action,.home .loop-toggle,.home .entry-bottom,.footer,.eyebrow,.section-line,.back-link{font-family:ZineTypewriter,'Courier New',monospace;font-weight:400}
.home .cut-title h2,.page-heading h1{font-family:ZineMetal,Georgia,serif;font-weight:400;letter-spacing:-.025em;mask-image:none}
.home .cut-title h2{display:block;width:max-content;font-size:clamp(110px,13.2vw,240px);line-height:1.02;padding:0 10px 5px 5px;text-shadow:1px 2px #080808,2px 3px 0 #070707}
.home .moving-side .cut-title h2{font-size:clamp(95px,11.3vw,205px);letter-spacing:-.04em}
.home .cut-title h2:before{inset:2% -3% -3% -3%;background:#0b0b0bf2}
.home .cut-action{font-size:10px;letter-spacing:0;margin-top:12px}
.home .moving-side .cut-title h2:before{background:#0b0b0bf2}
.home .scrap figcaption,.home .loop-card figcaption{font-family:ZineTypewriter,'Courier New',monospace;font-weight:400;font-size:7px}
.photo-mosaic,.video-pile{perspective:1100px;transform-style:preserve-3d}
.depth-piece{position:absolute;transform-style:preserve-3d;transform:rotate(var(--piece-tilt,0deg)) rotateY(var(--piece-yaw,0deg));filter:drop-shadow(2px 3px 0 #48483d) drop-shadow(8px 11px 4px #000b) drop-shadow(19px 29px 14px #000c);transition:transform .3s,filter .3s}
.depth-piece>.scrap,.depth-piece>.loop-card{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:100%;height:100%;margin:0;transform:none;translate:none;box-shadow:none}
.depth-photo-1{--piece-tilt:-12deg;--piece-yaw:7deg}.depth-photo-2{--piece-tilt:10deg;--piece-yaw:-7deg}.depth-photo-3{--piece-tilt:-9deg;--piece-yaw:8deg}.depth-photo-4{--piece-tilt:11deg;--piece-yaw:-4deg}.depth-photo-5{--piece-tilt:16deg;--piece-yaw:-9deg}
.depth-loop-1{--piece-tilt:11deg;--piece-yaw:-8deg}.depth-loop-2{--piece-tilt:-12deg;--piece-yaw:7deg}.depth-loop-3{--piece-tilt:14deg;--piece-yaw:-10deg}
.depth-piece:hover{transform:rotate(var(--piece-tilt,0deg)) rotateY(0deg) translateY(-6px);filter:drop-shadow(2px 3px 0 #55554a) drop-shadow(10px 15px 6px #000b) drop-shadow(25px 38px 17px #000c)}
.home .collage-side:hover .scrap-3,.home .collage-side:hover .loop-2{translate:none}
.home .marker-cross{display:none}
@media(max-width:1000px) and (min-width:701px){.home .cut-title h2{font-size:13.2vw}.home .moving-side .cut-title h2{font-size:11.3vw}.home .cut-action{font-size:8px}}
@media(max-width:700px){.home,.photography-page,.film-page{background-size:850px auto}.home .cut-title h2{font-size:33vw}.home .moving-side .cut-title h2{font-size:27vw}.home .cut-action{font-size:8px}.header .brand{font-size:9px}.header nav{font-size:10px}.header .brand-sub{font-size:6px}.depth-photo-1{--piece-tilt:-13deg}.depth-photo-2{--piece-tilt:11deg}.depth-photo-3{--piece-tilt:-11deg}.depth-photo-4{--piece-tilt:13deg}.depth-photo-5{--piece-tilt:15deg}.depth-loop-1{--piece-tilt:13deg}.depth-loop-2{--piece-tilt:-14deg}.depth-loop-3{--piece-tilt:16deg}.page-heading h1,.film-page .page-heading h1{font-size:23vw}.about-page .page-heading h1{font-size:14vw}}
@media(prefers-reduced-motion:reduce){.depth-piece{transition:none}.depth-piece:hover{transform:rotate(var(--piece-tilt,0deg)) rotateY(var(--piece-yaw,0deg))}}

@font-face{font-family:PunkBrush;src:url('assets/punk-brush.ttf') format('truetype');font-display:swap}
.home .cut-title h2,.page-heading h1{font-family:PunkBrush,Impact,sans-serif;text-transform:uppercase;letter-spacing:.015em;font-weight:400}
.home .cut-title h2{font-size:clamp(110px,14.5vw,250px);transform:skew(-5deg) rotate(-3deg)}
.home .moving-side .cut-title h2{font-size:clamp(95px,12.4vw,220px);letter-spacing:0;transform:skew(-5deg) rotate(2deg)}
.photography-page{background-image:url('assets/zine-still.svg')}
.film-page{background-image:url('assets/zine-moving.svg')}
.about-page{background:#0b0b0b url('assets/zine-about.svg') top center/1480px auto repeat-y}
.youtube-loop{width:100%;height:100%;position:relative;background:#151515}
.youtube-loop iframe{border:0;width:100%;height:100%;min-height:200px;pointer-events:none}
.pending-clip{height:100%;display:flex;flex-direction:column;justify-content:center;padding:18px;background:#171713;color:#9AFF38;font-family:ZineTypewriter,monospace;font-size:12px;gap:12px}
.pending-clip small{font-size:9px;color:#aaa}
@media(max-width:700px){.home .cut-title h2{font-size:36vw}.home .moving-side .cut-title h2{font-size:29vw}.about-page{background-size:850px auto}.pending-clip{font-size:9px;padding:10px}.pending-clip small{font-size:7px}}
/* Original hand-cut strokes replace the stock heading font. */
.home .cut-title h2{width:clamp(230px,26vw,450px);padding:8px 2px;line-height:0}
.home .moving-side .cut-title h2{width:clamp(290px,32vw,550px)}
.punk-word{display:block;width:100%;height:auto;max-width:none}
.lettered-heading{width:min(50vw,580px);line-height:1}
.film-page .lettered-heading{width:min(60vw,740px)}
/* A thin off-white edge and deeper bottom margin recall a real instant print. */
.home .scrap{padding:9px 9px 29px;background:#dcdcd3}
.home .scrap img{width:100%;height:100%;background:#c8c8bd}
.home .scrap figcaption{bottom:8px;background:none;color:#272720;left:12px}
.home .photo-mosaic.is-developing .scrap img{animation:polaroid-develop 3.1s both;animation-delay:var(--develop-delay,0ms)}
@keyframes polaroid-develop{0%{opacity:0;filter:brightness(1.8) contrast(.3) saturate(0) blur(2px)}30%{opacity:.3;filter:brightness(1.4) contrast(.65) saturate(.1) blur(1px)}100%{opacity:1;filter:contrast(1.18) saturate(.65) blur(0)}}
.tv-screen{overflow:hidden;background:#050505}
.tv-cover{position:absolute;inset:0;z-index:3;pointer-events:none;background:#050505;display:grid;place-items:center;clip-path:inset(0)}
.tv-cover:after{content:'';position:absolute;left:12%;right:12%;top:50%;height:1px;background:#aaa;opacity:.22;box-shadow:0 0 8px #eee}
.tv-signal{font-family:ZineTypewriter,monospace;font-size:8px;color:#797976;letter-spacing:2px;translate:0 20px}
.tv-screen.is-revealing .tv-cover{animation:tv-open .8s ease-in both}
.tv-screen.is-revealing iframe{animation:tv-focus .8s ease-out both}
.tv-screen.is-revealed .tv-cover{visibility:hidden}
@keyframes tv-open{0%{clip-path:polygon(0 0,100% 0,100% 49.8%,0 49.8%,0 50.2%,100% 50.2%,100% 100%,0 100%)}35%{clip-path:polygon(0 0,100% 0,100% 46%,0 46%,0 54%,100% 54%,100% 100%,0 100%)}100%{clip-path:polygon(0 0,100% 0,100% 0,0 0,0 100%,100% 100%,100% 100%,0 100%)}}
@keyframes tv-focus{from{filter:blur(5px) contrast(1.6) grayscale(1)}to{filter:none}}
.pending-clip{color:#9D38FF;background:#111110;border:2px solid #252523}
@media(max-width:700px){.home .cut-title h2{width:64vw}.home .moving-side .cut-title h2{width:80vw}.lettered-heading{width:70vw}.film-page .lettered-heading{width:87vw}.home .scrap{padding:6px 6px 24px}}
@media(prefers-reduced-motion:reduce){.home .photo-mosaic.is-developing .scrap img,.tv-screen.is-revealing .tv-cover,.tv-screen.is-revealing iframe{animation:none}.tv-screen.is-revealing .tv-cover{visibility:hidden}}
.home .depth-loop-1 .pending-clip{align-items:center;text-align:center;padding-left:24%}

.home .photo-mosaic.is-preparing .scrap img{opacity:0}

/* Slightly enlarge The Parade while retaining the three-layer hierarchy. */
.home .depth-loop-3{left:65%;width:43%;height:43%}
@media(max-width:700px){.home .depth-loop-3{left:66%;width:44%;height:40%}}
/* Ransom-note cut-outs: each letter has its own paper, face and imperfect baseline. */
.ransom-word{--ransom-color:#9AFF38;display:inline-flex;align-items:center;gap:.035em;font-size:clamp(38px,4.7vw,74px);line-height:1.05;white-space:nowrap;isolation:isolate}
.ransom-moving{--ransom-color:#9D38FF}
.ransom-letter{display:inline-flex;align-items:center;justify-content:center;color:var(--ransom-color);background:#090909;padding:.035em .09em .015em;min-width:.53em;height:1.08em;font-family:Flyposter,Impact,sans-serif;font-weight:700;box-shadow:2px 3px 1px #0008;position:relative;letter-spacing:-.035em;text-shadow:none;transform:rotate(-6deg);clip-path:polygon(1% 4%,94% 0,100% 95%,3% 100%)}
.ransom-letter:nth-child(even){color:#090909;background:var(--ransom-color)}
.ransom-letter:after{content:'';position:absolute;inset:0;background:url('assets/xerox-grit.svg') center/190px 170px;opacity:.45;mix-blend-mode:exclusion;pointer-events:none}
.ransom-letter.r-1{font-family:Georgia,serif;font-style:italic;font-weight:700;font-size:.9em;height:1.06em;transform:rotate(5deg) translateY(.035em)}
.ransom-letter.r-2{font-family:ZineTypewriter,monospace;font-size:1.05em;font-weight:400;height:1.16em;transform:rotate(-3deg) translateY(-.035em);padding-left:.04em;padding-right:.04em}
.ransom-letter.r-3{font-family:Arial,sans-serif;font-size:.87em;font-weight:900;height:1.1em;transform:rotate(7deg) translateY(.06em)}
.ransom-letter.r-4{font-family:Georgia,serif;font-size:1.02em;font-weight:400;height:1.04em;transform:rotate(-5deg) translateY(-.03em)}
.ransom-letter.r-5{font-family:Flyposter,Impact,sans-serif;font-size:.93em;font-weight:700;transform:rotate(4deg)}
.home .cut-title h2,.home .moving-side .cut-title h2{width:max-content;max-width:100%;font-size:inherit;padding:0;transform:none;line-height:1}
.home .cut-title h2:before{display:none}
.home .cut-title{left:23%;right:auto;bottom:28px;transform:rotate(-2deg);width:max-content;max-width:58%}
.home .moving-side .cut-title{left:36%;right:auto;bottom:25px;transform:rotate(2deg);width:max-content;max-width:62%}
.home .cut-action{margin-top:10px;padding:5px 7px;font-size:8px;gap:18px}
.home .cut-action>span:last-child{font-size:20px}
.lettered-heading,.film-page .lettered-heading{width:max-content;max-width:100%}
.lettered-heading .ransom-word{font-size:clamp(48px,8vw,110px)}
/* Re-space the centre and small photographs, preserving the two large anchors. */
.home .depth-photo-3{left:39%}
.home .depth-photo-5{top:64%;left:51%}
.home .depth-loop-3{left:58%;top:59%}
/* A single smooth opacity curve avoids costly animated blur/contrast and a final snap. */
.home .photo-mosaic.is-developing .scrap img{animation-name:develop-smooth;animation-duration:3.6s;animation-timing-function:cubic-bezier(.33,0,.67,1);animation-fill-mode:both}
@keyframes develop-smooth{from{opacity:0}to{opacity:1}}
/* Film leader, visible over the concealed YouTube startup. */
.tv-cover{background:#171714;clip-path:none;background-image:linear-gradient(90deg,transparent 49.7%,#76766d55 49.7%,#76766d55 50.3%,transparent 50.3%),linear-gradient(transparent 49.7%,#76766d55 49.7%,#76766d55 50.3%,transparent 50.3%)}
.tv-cover:after{inset:0;width:auto;height:auto;background:url('assets/xerox-grit.svg') center/290px 230px;opacity:.35;box-shadow:none}
.leader-ring{position:absolute;width:46%;aspect-ratio:1;border:1px solid #99998a66;border-radius:50%;box-shadow:0 0 0 7px #171714,0 0 0 8px #99998a44}
.tv-signal{font-family:ZineTypewriter,monospace;font-size:clamp(12px,1.5vw,21px);color:#d8d8c9;letter-spacing:1px;translate:none;z-index:1;max-width:80%;text-align:center;line-height:1.2}
.is-counting .tv-signal{font-family:Flyposter,Impact,sans-serif;font-size:clamp(70px,9vw,150px);font-weight:700;letter-spacing:0}
.tv-screen.is-revealing .tv-cover{animation:none}
.tv-screen.is-revealing iframe{animation:tv-focus .25s ease-out both}
@media(max-width:700px){
 .ransom-word{font-size:9vw}.home .cut-title{left:22%;bottom:52px;max-width:68%}.home .moving-side .cut-title{left:24%;bottom:22px;max-width:73%}
 .home .moving-side .ransom-word{font-size:9vw}.home .cut-action{font-size:7px;gap:12px}
 .home .depth-photo-3{left:44%}.home .depth-photo-5{left:64%;top:64%}
 .home .depth-loop-3{left:59%;top:61%}.tv-signal{font-size:12px}.is-counting .tv-signal{font-size:68px}
 .lettered-heading .ransom-word{font-size:11vw}
}
@media(prefers-reduced-motion:reduce){.home .photo-mosaic.is-developing .scrap img,.tv-screen.is-revealing iframe{animation:none}.leader-ring{display:none}}
.home .photo-mosaic .scrap img{filter:contrast(1.18) saturate(.65)}
/* Each print is a single stacking layer: no intersecting 3D planes. */
.home .photo-mosaic,.home .video-pile{perspective:none;transform-style:flat;isolation:isolate}
.home .depth-piece{transform-style:flat;transform:perspective(1100px) rotate(var(--piece-tilt,0deg)) rotateY(var(--piece-yaw,0deg))}
.home .depth-piece:hover{transform:perspective(1100px) rotate(var(--piece-tilt,0deg)) rotateY(0deg) translateY(-6px)}
.home .depth-photo-1{left:-1%;top:3%;width:43%;height:68%;z-index:1}
.home .depth-photo-2{z-index:2}.home .depth-photo-3{z-index:3}.home .depth-photo-4{z-index:4}.home .depth-photo-5{z-index:5}
.home .photo-mosaic.is-preparing .scrap img{opacity:0}
.home .photo-mosaic.is-preparing .scrap img.photo-developed{animation:develop-smooth 3.6s cubic-bezier(.33,0,.67,1) both}
/* Ink is scuffed separately from the torn-paper blocks. */
.ransom-ink{display:block;mask-image:url('assets/ransom-dry-ink.svg');mask-mode:luminance;mask-size:100% 100%;text-shadow:.5px .35px currentColor,-.4px .1px currentColor;transform:skew(-5deg) rotate(-2deg)}
.ransom-letter{clip-path:polygon(3% 1%,31% 3%,61% 0,98% 5%,96% 29%,100% 57%,96% 98%,62% 96%,31% 100%,0 94%,3% 63%,0 30%)}
.ransom-letter.r-0,.ransom-letter.r-4,.ransom-letter.r-5{font-family:PunkBrush,Impact,sans-serif;font-weight:400;font-size:1.15em;line-height:1}
.ransom-letter.r-1 .ransom-ink{transform:skew(5deg) rotate(3deg);mask-position:5px -3px}
.ransom-letter.r-2 .ransom-ink{transform:rotate(3deg);text-shadow:.6px .6px currentColor}
.ransom-moving .r-2{font-family:PunkBrush,Impact,sans-serif;font-size:1.12em}
.ransom-moving .r-3{font-family:ZineTypewriter,'Courier New',monospace;font-size:1.05em;font-weight:400;height:1.1em;min-width:.65em;transform:rotate(5deg)}
.ransom-moving .r-3 .ransom-ink{transform:rotate(-2deg);mask-image:none;text-shadow:none}
.home .cut-title:focus-visible{outline:2px dashed currentColor;outline-offset:8px}
.home .cut-title:hover .cut-action>span:first-child{text-decoration:underline;text-underline-offset:4px}
@media(max-width:700px){.home .depth-photo-1{left:-3%;top:9%;width:52%;height:58%}}
@media(prefers-reduced-motion:reduce){.home .photo-mosaic.is-preparing .scrap img.photo-developed{animation:none;opacity:1}.home .depth-piece:hover{transform:perspective(1100px) rotate(var(--piece-tilt,0deg)) rotateY(var(--piece-yaw,0deg))}}
/* Keep the approved M/O; give the remaining glyphs full, upright ink silhouettes. */
.ransom-word:not(.ransom-moving) .ransom-letter,
.ransom-moving .ransom-letter:nth-child(n+3){font-family:ZineTypewriter,'Courier New',monospace;font-size:1em;font-weight:400;line-height:1.2;height:1.25em;padding:.06em .09em;min-width:.58em;transform:rotate(-3deg);letter-spacing:-.035em}
.ransom-word:not(.ransom-moving) .ransom-letter:nth-child(even),
.ransom-moving .ransom-letter:nth-child(n+3):nth-child(even){transform:rotate(3deg)}
.ransom-word:not(.ransom-moving) .ransom-ink,
.ransom-moving .ransom-letter:nth-child(n+3) .ransom-ink{mask-image:none;transform:none;text-shadow:none}
.home .cut-action{font-size:clamp(11px,1vw,15px);padding:7px 8px;gap:14px}
.home .depth-photo-4{left:0;top:57%;width:34%;height:auto;aspect-ratio:1/1}
.home .depth-loop-2{left:12%;width:53%;height:45%}
@media(max-width:700px){
 .home .cut-action{font-size:10px;gap:10px}
 .home .depth-photo-4{left:-3%;top:60%;width:42%;height:auto;aspect-ratio:1/1}
 .home .depth-loop-2{left:1%;width:64%;height:38%}
}

/* Keep the cut paper separate from the ink so glyphs cannot be trimmed. */
.ransom-letter,.ransom-letter:nth-child(even){background:transparent;clip-path:none;isolation:isolate;overflow:visible}
.ransom-letter:before{content:'';position:absolute;inset:0;z-index:-1;background:#090909;clip-path:polygon(3% 1%,31% 3%,61% 0,98% 5%,96% 29%,100% 57%,96% 98%,62% 96%,31% 100%,0 94%,3% 63%,0 30%)}
.ransom-letter:nth-child(even):before{background:var(--ransom-color)}
.ransom-letter:after{clip-path:polygon(3% 1%,31% 3%,61% 0,98% 5%,96% 29%,100% 57%,96% 98%,62% 96%,31% 100%,0 94%,3% 63%,0 30%)}
.ransom-word:not(.ransom-moving) .ransom-letter{font-style:normal;padding:.08em .16em;min-width:.68em}
/* The supplied logo and a single navigation treatment at every breakpoint. */
.header .brand{display:block;flex:0 0 auto;width:clamp(160px,19vw,250px);line-height:1}
.header .brand-logo{display:block;width:100%;height:auto;object-fit:contain}
.header nav{flex:0 0 auto;white-space:nowrap;font-family:ZineTypewriter,'Courier New',monospace;font-size:12px;font-weight:400;gap:24px}
.header nav a:last-child{font-size:inherit}
.header nav a:last-child:before{content:none}
.header nav a .nav-contact{display:inline;font:inherit;color:inherit;vertical-align:baseline;margin:0}
.about-art .about-aperture{display:block;width:min(100%,350px);height:auto;object-fit:contain;margin:20px 0 35px}
@media(max-width:700px){
 .header,.home .header{height:100px;padding:12px 20px;gap:18px}
 .header .brand{width:170px}
 .header nav{font-size:12px;gap:18px}
 .header nav a .nav-contact{display:none}
}
@media(max-width:480px){
 .header,.home .header{height:128px;flex-direction:column;justify-content:center;gap:8px;padding:12px 16px}
 .header .brand{width:175px}
 .header nav{font-size:13px;gap:30px}
 .header nav a{padding:7px 0}
}

/* Give the identity a quiet, opaque surface above the handwritten page. */
.header,.home .header{background:#0b0b0b}
.header .brand{position:relative;isolation:isolate}
/* Hide only the oversized raster slash; retain the supplied wordmark and tagline. */
.header .brand-logo{clip-path:polygon(0 0,100% 0,100% 100%,49% 100%,49% 77.5%,44% 77.5%,44% 100%,0 100%)}
.header .brand:after{content:'';position:absolute;left:46.4%;top:83%;width:1px;height:10%;background:linear-gradient(to bottom,var(--red) 0 46%,transparent 46% 57%,var(--lime) 57% 100%);transform:rotate(24deg);transform-origin:center;pointer-events:none}
.home .entry-intro{gap:18px;flex-wrap:wrap;height:auto;min-height:64px;padding-top:18px;padding-bottom:18px}
.home .entry-intro h1{font-size:clamp(10px,1vw,13px);line-height:1.5;letter-spacing:.075em}
.home .entry-intro p{font-size:10px;line-height:1.5;letter-spacing:.05em}
@media(max-width:480px){.home .entry-intro{gap:4px;align-items:flex-start;flex-direction:column}.home .entry-intro h1{font-size:10px}}
/* Original films use first-party streams, with a single staggered TV reveal. */
.native-film{position:relative;width:100%;height:100%;background:#101010}
.native-film video{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.native-film.is-revealed .tv-cover{opacity:0;visibility:hidden;transition:opacity .3s ease-out,visibility .3s}
.film-filters{display:flex;gap:12px;flex-wrap:wrap;padding:12px 0 20px}
.film-filters button{border:1px solid var(--line);padding:11px 18px;font-family:ZineTypewriter,monospace;font-size:14px;transform:rotate(-1deg)}
.film-filters button:nth-child(even){transform:rotate(1deg)}
.film-filters button[aria-pressed=true]{background:var(--red);color:#0b0b0b;border-color:var(--red)}
.film-filters button span{font-size:9px;vertical-align:super;margin-left:8px}
.film-result{font-family:ZineTypewriter,monospace;color:var(--muted);font-size:11px;margin-bottom:22px}
.film-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px 22px;align-items:start}
.film-project{display:block;padding:0;text-align:left;width:100%}
.film-project[hidden]{display:none}
.film-project-image{display:block;position:relative;aspect-ratio:16/10;overflow:hidden;background:#090909;border:5px solid #deded2;box-shadow:3px 5px 0 #35352e}
.film-project img{object-fit:cover;transition:transform .3s,filter .3s}
.film-project:hover img{transform:scale(1.035);filter:brightness(.8)}
.film-project-play{position:absolute;right:13px;bottom:13px;font-size:25px;color:var(--red);background:#0b0b0b;padding:0 8px}
.film-duration{position:absolute;bottom:10px;left:10px;font:10px ZineTypewriter,monospace;background:#0b0b0bd9;color:#fff;padding:4px 6px}
.film-project-meta{display:flex;align-items:start;justify-content:space-between;gap:12px;padding-top:15px;font-family:ZineTypewriter,monospace;font-size:14px;line-height:1.5}
.film-project-meta small{font-size:9px;color:var(--red);padding-top:4px}
.elsewhere{margin:65px 0 55px;border-top:1px solid var(--line);padding-top:25px}
.elsewhere h2{font:12px ZineTypewriter,monospace;color:var(--muted);margin-bottom:22px}
.elsewhere>div{display:flex;flex-wrap:wrap;gap:18px 32px}
.elsewhere a{font:12px ZineTypewriter,monospace;border-bottom:1px solid #555;padding-bottom:8px}
.elsewhere a span{color:var(--red);margin-left:9px}
.film-dialog{border:1px solid #555;background:#0b0b0b;color:var(--white);width:min(1100px,94vw);max-width:none;padding:22px;max-height:94svh;overflow:auto}
.film-dialog::backdrop{background:#000e;backdrop-filter:blur(5px)}
.film-dialog-top{display:flex;align-items:start;justify-content:space-between;gap:25px;margin-bottom:18px}
.film-dialog-top h2{font:clamp(17px,2.2vw,28px) ZineTypewriter,monospace;line-height:1.4;margin-top:8px}
.film-dialog-top button{font-size:35px;padding:0 8px}
.film-dialog video{display:block;width:100%;max-height:70svh;aspect-ratio:16/9;background:#000;object-fit:contain}
#project-error{font:12px ZineTypewriter,monospace;color:var(--muted);padding-top:10px}
@media(max-width:1000px){.film-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.film-grid{grid-template-columns:1fr;gap:30px}.film-project-meta{font-size:14px}.film-filters{gap:8px}.film-filters button{font-size:12px;padding:9px 12px}.film-dialog{padding:15px}.film-dialog video{max-height:60svh}}
@media(prefers-reduced-motion:reduce){.film-project img{transition:none}.native-film.is-revealed .tv-cover{transition:none}}
/* Keep the reversed cutout letters legible on the Moving page too. */
.lettered-heading .ransom-letter .ransom-ink{color:inherit}
.film-dialog iframe{width:100%;height:min(68svh,620px);border:0;background:#000;display:block}
.film-dialog iframe[hidden],.film-dialog video[hidden],#drive-options[hidden]{display:none}
#drive-options{font-family:ZineTypewriter,monospace;font-size:12px;padding-top:14px}
#drive-options a{color:var(--red);text-decoration:underline;text-underline-offset:4px}
@media(max-width:600px){.film-dialog iframe{height:52svh}}
/* Three quick paired reveals: 1 print, then 2, then 2. */
.home .photo-mosaic.is-preparing .scrap img.photo-developed{animation:develop-smooth 1.8s cubic-bezier(.25,.1,.35,1) both;animation-delay:var(--pair-delay,0ms)}
.native-film.is-revealed .tv-cover{transition:opacity .16s ease-out,visibility .16s}
/* A hand-cut film wheel, with the selected work pulled forward. */
.moving-work{padding-top:10px}
.film-wheel{padding:35px 0 50px;border-top:1px solid #c9c9bd38;position:relative}
.wheel-heading{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:0 12px}
.wheel-heading h2{font-family:PunkBrush,Impact,sans-serif;font-size:clamp(50px,6vw,88px);font-weight:400;line-height:1.15;text-transform:uppercase;transform:rotate(-3deg);color:#e8e7dc;text-shadow:2px 2px #000}
.wheel-heading h2:after{content:'';display:block;width:75%;height:3px;background:var(--red);transform:rotate(-2deg);margin-top:5px;clip-path:polygon(0 15%,100% 0,92% 70%,4% 100%)}
.wheel-heading>span{font-family:ZineTypewriter,monospace;color:var(--red);font-size:11px;letter-spacing:1px;white-space:nowrap}
.wheel-stage{position:relative;margin:0 calc(-1 * min(3vw,40px));perspective:1600px;isolation:isolate}
.film-wheel.is-ready .wheel-stage{height:clamp(350px,44vw,625px);overflow:hidden;touch-action:pan-y}
.wheel-card{width:100%;margin:30px 0;}
.film-wheel.is-ready .wheel-card{position:absolute;width:min(68vw,880px);left:50%;top:48%;margin:0;transform-origin:50% 50%;transition:transform .48s cubic-bezier(.2,.7,.2,1),opacity .4s ease,filter .4s ease;will-change:transform}
.wheel-card[data-wheel-position=active]{transform:translate(-50%,-50%) translateZ(0) rotate(-1deg);opacity:1;z-index:3;filter:none}
.wheel-card[data-wheel-position=previous]{transform:translate(calc(-50% - min(39vw,510px)),-50%) translateZ(-170px) rotateY(28deg) rotate(-5deg) scale(.86);opacity:.53;z-index:2;filter:brightness(.7)}
.wheel-card[data-wheel-position=next]{transform:translate(calc(-50% + min(39vw,510px)),-50%) translateZ(-170px) rotateY(-28deg) rotate(4deg) scale(.86);opacity:.53;z-index:2;filter:brightness(.7)}
.wheel-card[data-wheel-position=behind]{transform:translate(-50%,-50%) translateZ(-360px) scale(.6);opacity:0;z-index:0;pointer-events:none;visibility:hidden}
.wheel-picture{position:relative;box-shadow:12px 18px 0 #0009,0 25px 45px #000b}
.wheel-card .film-project-image{aspect-ratio:16/9;box-shadow:none}
.wheel-card .film-project{width:100%;display:block;padding:0;border:0;text-align:left}
.wheel-card .film-project img{object-fit:cover}
.wheel-card .film-project-play{border:1px solid #d8d8cf88;background:#090909b8;color:#e8e7dc;font-family:Arial,sans-serif;display:grid;place-items:center;left:calc(50% - 25px);top:calc(50% - 25px);right:auto;bottom:auto;width:50px;height:50px;font-size:17px;padding-left:3px;box-shadow:3px 4px 0 #0008}
.wheel-card .film-project-meta{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;font-family:ZineTypewriter,monospace;font-size:clamp(13px,1.2vw,17px);line-height:1.4;padding:14px 7px 0}
.wheel-card .film-project-meta>span{max-width:85%}
.wheel-card .film-project-meta small{font-size:9px;color:var(--red);padding-top:3px}
.wheel-controls{display:flex;align-items:center;justify-content:center;gap:25px;margin-top:-6px;position:relative;z-index:4}
.wheel-controls button{width:54px;height:46px;border:1px solid #a8a89d80;color:var(--red);font-family:Arial,sans-serif;font-size:30px;line-height:1;transform:rotate(-3deg);background:#0b0b0b;box-shadow:3px 4px #000}
.wheel-controls button:last-child{transform:rotate(3deg)}
.wheel-controls button:hover{background:var(--red);color:#0b0b0b;border-color:var(--red)}
.wheel-controls p{font-family:ZineTypewriter,monospace;font-size:13px;letter-spacing:2px;color:#cecec0;min-width:90px;text-align:center}
.wheel-player-mount{position:absolute;inset:5px;pointer-events:none}
.wheel-playback{position:absolute;inset:0;background:#000;pointer-events:auto;z-index:4}
.wheel-playback[hidden],.wheel-playback video[hidden],.wheel-playback iframe[hidden]{display:none}
.wheel-playback video,.wheel-playback iframe{display:block;border:0;width:100%;height:100%;object-fit:contain;background:#000}
.close-inline-film{position:absolute;z-index:3;top:8px;right:8px;width:34px;height:34px;background:#080808df;color:#f1f1e7;border:1px solid #c1c1b777;font:26px/1 Arial,sans-serif}
.wheel-playback #drive-options{position:absolute;top:10px;left:12px;padding:0;margin:0;background:#080808db;font-size:10px;z-index:2}
.wheel-playback #drive-options a{display:block;padding:7px 9px;color:#e6e6da}
.wheel-playback #project-error{position:absolute;inset:45% 10% auto;font-size:13px;color:#ddd;text-align:center}
.wheel-playback #project-error:empty{display:none}
.wheel-card.is-playing>.wheel-picture>.film-project{visibility:hidden}
@media(max-width:700px){
 .film-wheel{padding:28px 0 40px}.wheel-heading{padding:0;gap:10px}.wheel-heading h2{font-size:52px}.wheel-heading>span{font-size:8px;letter-spacing:.5px}
 .film-wheel.is-ready .wheel-stage{height:clamp(290px,66vw,440px);margin:0 -20px}
 .film-wheel.is-ready .wheel-card{width:82vw;top:49%}
 .wheel-card[data-wheel-position=previous]{transform:translate(calc(-50% - 60vw),-50%) translateZ(-170px) rotateY(28deg) rotate(-5deg) scale(.84)}
 .wheel-card[data-wheel-position=next]{transform:translate(calc(-50% + 60vw),-50%) translateZ(-170px) rotateY(-28deg) rotate(4deg) scale(.84)}
 .wheel-card .film-project-meta{font-size:12px;gap:10px;padding-top:12px}.wheel-card .film-project-meta small{font-size:7px}
 .wheel-controls{gap:18px;margin-top:0}.wheel-controls button{width:48px;height:44px;font-size:27px}.wheel-controls p{font-size:11px;min-width:75px}
 .wheel-card .film-project-play{width:42px;height:42px;left:calc(50% - 21px);top:calc(50% - 21px);font-size:14px}
}
@media(prefers-reduced-motion:reduce){
 .film-wheel.is-ready .wheel-card{transition:none}.home .photo-mosaic.is-preparing .scrap img.photo-developed{animation:none;opacity:1}.native-film.is-revealed .tv-cover{transition:none}
}
.wheel-card .film-project-play{font-size:0;padding:0}
.wheel-card .film-project-play:before{content:'';display:block;width:0;height:0;border-left:12px solid currentColor;border-top:8px solid transparent;border-bottom:8px solid transparent;margin-left:3px}
/* A level headline and quick routes into the three collections. */
.film-page .page-heading{align-items:center;gap:32px;flex-wrap:wrap}
.film-page .lettered-heading,.film-page .lettered-heading .ransom-word,.film-page .lettered-heading .ransom-letter,.film-page .lettered-heading .ransom-ink{transform:none!important}
.film-page .lettered-heading .ransom-letter{font-size:1em;vertical-align:baseline;align-self:center;margin-top:0;margin-bottom:0}
.film-page .lettered-heading .ransom-word{align-items:center}
.film-jumps{display:flex;flex-wrap:wrap;gap:12px 24px;font-family:ZineTypewriter,monospace;font-size:clamp(14px,1.25vw,18px);text-transform:uppercase}
.film-jumps a{color:var(--red);text-underline-offset:6px;padding:12px 0;border-bottom:1px solid #9d38ff70}
.film-jumps a:hover{color:#e8e7dc;border-color:currentColor}
.film-wheel{scroll-margin-top:110px}
/* Playback has its own complete rectangle, with room below for controls. */
.film-wheel.is-ready.has-playback .wheel-stage{height:clamp(460px,53vw,780px)}
.film-wheel.is-ready .wheel-card.is-playing{width:min(76vw,1000px);transform:translate(-50%,-50%);top:50%;will-change:auto}
.wheel-card.is-playing .wheel-picture{padding-bottom:52px;background:#000}
.wheel-card.is-playing .wheel-player-mount{inset:0;overflow:visible}
.wheel-card.is-playing .wheel-playback{overflow:visible;clip-path:none;mask:none}
.wheel-playback video,.wheel-playback iframe{object-fit:contain;clip-path:none;mask:none}
.wheel-playback #drive-options{top:8px;left:8px}
@media(max-width:700px){
 .film-page .page-heading{gap:20px}.film-jumps{gap:20px}.film-wheel{scroll-margin-top:95px}
 .film-wheel.is-ready.has-playback .wheel-stage{height:clamp(350px,78vw + 85px,600px)}
 .film-wheel.is-ready .wheel-card.is-playing{width:92vw}
}
/* Compact title, with a balanced M and a clear stacked index. */
.ransom-moving .ransom-letter.r-0{font-family:ZineTypewriter,'Courier New',monospace;font-weight:400;font-size:1em;line-height:1.2;height:1.25em;padding:.06em .09em;min-width:.68em}
.ransom-moving .ransom-letter.r-0 .ransom-ink{mask-image:none;text-shadow:none}
.film-page .page-heading{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:40px;margin-top:30px}
.film-page .page-heading>div{justify-self:center;position:relative}
.film-page .page-heading>div>.eyebrow{position:absolute;bottom:calc(100% + 16px);left:0;white-space:nowrap}
.film-page .page-heading h1.lettered-heading{font-size:clamp(40px,5vw,70px);line-height:1;margin:0;display:flex;align-items:center}
.film-page .lettered-heading .ransom-word{font-size:inherit;display:flex}
.film-page .lettered-heading .ransom-letter.r-0{min-width:.8em;padding-inline:.12em}
.film-page .lettered-heading .ransom-letter.r-0 .ransom-ink{font-size:1.16em;font-weight:700;line-height:1}
.film-jumps{display:flex;flex-direction:column;align-items:center;justify-self:center;gap:8px;width:max-content;max-width:100%;text-align:center;font-family:ZineTypewriter,'Courier New',monospace;font-size:clamp(22px,2.3vw,34px);line-height:1.2}
.film-jumps a{color:#f4f4f0;border-bottom:0;padding:5px 12px}
.film-jumps a:hover{color:var(--red)}
@media(max-width:700px){
 .film-page .page-heading{grid-template-columns:1fr;gap:28px;margin-top:52px}
 .film-page .page-heading h1.lettered-heading{font-size:clamp(35px,8vw,56px)}
 .film-jumps{font-size:25px;gap:7px}
 .film-page .page-intro{padding-bottom:30px}
}
/* Linked projects use YouTube's standard player preview, in the wheel itself. */
.wheel-card .youtube-preview{position:absolute;inset:5px;width:calc(100% - 10px);height:calc(100% - 10px);border:0;background:#000;pointer-events:none;z-index:2}
.wheel-card[data-film-provider=youtube] .film-project-image{min-height:210px;background:#000;border:5px solid #d8d8cf;display:block}
.wheel-card[data-film-provider=youtube][data-wheel-position=active] .film-project{visibility:hidden}
.wheel-card[data-wheel-position=active] .youtube-preview{pointer-events:auto}
.youtube-original{display:block;width:max-content;max-width:100%;margin:8px 7px 0;font:11px/1.4 ZineTypewriter,'Courier New',monospace;color:#d7d7cd;text-decoration:underline;text-underline-offset:4px}
.youtube-original:hover{color:var(--red)}
.wheel-card .youtube-preview{outline:5px solid #d8d8cf}

/* A centred question and category index for the film portfolio. */
.film-page .film-intro{padding-top:52px;padding-bottom:44px}
.film-intro-heading{display:flex;flex-direction:column;align-items:center;gap:24px;text-align:center}
.film-intro-heading h1{font-family:ZineTypewriter,'Courier New',monospace;font-size:clamp(22px,3.2vw,42px);font-weight:400;line-height:1.3;letter-spacing:-.025em;color:#f4f4f0;margin:0;max-width:100%}
.film-intro-heading h1 span{white-space:nowrap}
.film-intro-heading .film-jumps{margin:0;align-self:center}
@media(max-width:700px){.film-page .film-intro{padding-top:36px;padding-bottom:34px}.film-intro-heading{gap:22px}}
