:root{--ink:#0c0c0a;--paper:#eeeade;--acid:#d8ff3e;--line:rgba(238,234,222,.2);--mono:Consolas,"Courier New",monospace;--display:"Arial Black","Arial Narrow",Arial,sans-serif;--body:"Trebuchet MS",Arial,sans-serif;--pad:clamp(20px,4vw,64px)}*{box-sizing:border-box}html{background:var(--ink);color:var(--paper);scrollbar-color:#777 #171714}body{margin:0;font-family:var(--body);min-height:100vh;background:radial-gradient(circle at 72% 8%,#24251b 0,transparent 34%),repeating-linear-gradient(90deg,transparent 0 119px,rgba(255,255,255,.016) 120px),var(--ink)}button,a,input{font:inherit}a{color:inherit;text-underline-offset:4px}.skip{position:fixed;z-index:100;top:10px;left:10px;transform:translateY(-150%);background:var(--acid);color:#080a08;padding:12px}.skip:focus{transform:none}.top{height:78px;padding:0 var(--pad);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:25px;font:10px var(--mono);letter-spacing:.12em}.brand{font-weight:800;text-decoration:none}.brand span{display:inline-grid;place-items:center;width:31px;height:31px;margin-right:9px;background:var(--paper);color:var(--ink)}.top p{opacity:.55}.intro{padding:clamp(70px,10vw,150px) var(--pad) clamp(60px,8vw,110px);display:grid;grid-template-columns:1fr minmax(240px,520px);align-items:end}.kicker{font:10px var(--mono);letter-spacing:.14em;color:var(--acid)}h1{grid-row:1/3;margin:0;font:900 clamp(72px,15vw,210px)/.73 var(--display);letter-spacing:-.085em;text-transform:uppercase}h1 i{font-family:Georgia,serif;font-weight:400}.lede{font-size:clamp(17px,1.6vw,23px);line-height:1.45;color:#c5c1b7}.rolls{min-height:45vh;padding:0 var(--pad) 100px;display:grid;grid-template-columns:repeat(3,minmax(240px,1fr));gap:clamp(35px,5vw,80px)}.roll-card{appearance:none;border:0;background:none;color:inherit;text-align:left;padding:0;cursor:pointer}.roll-art{height:clamp(260px,28vw,430px);display:grid;place-items:center;position:relative;filter:drop-shadow(0 25px 25px #000)}.coil{width:min(78%,320px);aspect-ratio:1;border-radius:50%;position:relative;background:repeating-radial-gradient(circle,#12120f 0 11px,#353629 12px 16px,#0a0a08 17px 27px);border:2px solid #575845;box-shadow:inset 0 0 0 13px #090907,inset 0 0 0 15px #73735d}.coil:after{content:"";position:absolute;inset:37%;border-radius:50%;background:#070706;border:10px dotted #9b9a7a;box-shadow:0 0 0 13px #161711}.tail{position:absolute;width:46%;height:55px;right:0;bottom:17%;background:repeating-linear-gradient(90deg,#111 0 11px,#303126 12px 14px),#151610;border-block:7px dashed #b3ae86;transform:rotate(9deg);transform-origin:left}.roll-data{border-top:1px solid var(--line);padding-top:15px;display:grid;grid-template-columns:1fr auto;gap:5px;font:10px/1.5 var(--mono);letter-spacing:.1em}.roll-data strong{font-size:15px}.roll-data span{opacity:.65}.roll-card:hover .coil,.roll-card:focus-visible .coil{border-color:var(--acid)}:focus-visible{outline:2px solid var(--acid);outline-offset:5px}.state{font:12px var(--mono);color:#aaa}.layer,.password-layer{position:fixed;inset:0;z-index:20;background:rgba(8,8,7,.98)}[hidden]{display:none!important}.strip-layer{display:flex;flex-direction:column;overflow:hidden}.viewer-head{height:100px;padding:20px var(--pad);display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);font:11px/1.7 var(--mono);letter-spacing:.1em}.viewer-head p{margin:0;font-weight:800}.viewer-head span{opacity:.6}.close{width:48px;height:48px;border:1px solid var(--line);background:none;color:inherit;font-size:28px;cursor:pointer}.reel-echo{position:absolute;top:124px;left:var(--pad);width:120px;height:120px;opacity:.3;pointer-events:none}.reel-echo i{position:absolute;border:1px solid #aaa;border-radius:50%}.reel-echo i:first-child{inset:0}.reel-echo i:nth-child(2){inset:18px}.reel-echo i:nth-child(3){inset:36px}.strip-shell{margin:auto 0;padding:65px 0;overflow:hidden}.film-strip{display:flex;gap:8px;overflow-x:auto;padding:28px var(--pad);scroll-snap-type:x proximity;overscroll-behavior-inline:contain;background:#181912;border-block:12px dotted #aaa77e;box-shadow:0 20px 45px #000;cursor:grab}.frame{flex:0 0 min(62vw,520px);height:min(47vw,390px);padding:0;border:1px solid #575747;background:#222;color:white;position:relative;scroll-snap-align:center;cursor:pointer}.frame img{width:100%;height:100%;display:block;object-fit:cover}.frame.locked img{image-rendering:pixelated;filter:blur(10px) brightness(.55);transform:scale(1.08)}.frame-number{position:absolute;left:8px;bottom:7px;background:#090a08;padding:5px 7px;font:10px var(--mono)}.lock{position:absolute;inset:0;display:grid;place-items:center;font:20px var(--mono)}.viewer-status{min-height:24px;text-align:center;font:10px var(--mono);color:#aaa}.strip-layer.opening .film-strip{animation:unspool .65s cubic-bezier(.2,.75,.2,1) both}@keyframes unspool{from{transform:translateX(-35%) scaleX(.15);opacity:.3}to{transform:none;opacity:1}}.photo-layer{display:grid;grid-template-columns:80px 1fr 80px;place-items:center;padding:clamp(20px,4vw,55px)}.photo-layer figure{margin:0;display:grid;place-items:center}.photo-layer img{display:block;max-width:calc(100vw - 220px);max-height:calc(100dvh - 100px);width:auto;height:auto;object-fit:contain}.photo-layer figcaption{margin-top:15px;font:11px var(--mono);letter-spacing:.12em}.photo-close{position:absolute;right:24px;top:20px}.photo-nav{width:52px;height:52px;border:1px solid var(--line);background:#111;color:white;font-size:21px;cursor:pointer}.password-layer{z-index:40;display:grid;place-items:center;padding:20px;background:rgba(0,0,0,.82)}.password-layer form{width:min(100%,440px);background:#151611;border:1px solid #555747;padding:35px}.password-layer h2{font:26px var(--display);margin:15px 0 30px}.password-layer label{font:10px var(--mono);letter-spacing:.1em}.password-layer input{display:block;width:100%;margin-top:9px;padding:14px;background:#090a08;border:1px solid #777;color:white}.password-layer form>div{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.password-layer button{padding:12px 16px;background:none;border:1px solid #777;color:white}.password-layer button[type=submit]{background:var(--acid);color:#080a08;border-color:var(--acid)}.form-error{min-height:18px;color:#ff806a;font:11px var(--mono)}footer{border-top:1px solid var(--line);padding:40px var(--pad);display:flex;justify-content:space-between;gap:20px;font:10px var(--mono);letter-spacing:.1em}footer nav{display:flex;gap:24px}@media(max-width:900px){.intro{grid-template-columns:1fr}.intro h1{grid-row:auto}.rolls{grid-template-columns:repeat(2,1fr)}.top p{display:none}}@media(max-width:600px){.top{height:66px}.rolls{grid-template-columns:1fr}.roll-art{height:330px}.intro{padding-top:65px}.frame{flex-basis:82vw;height:62vw}.photo-layer{grid-template-columns:1fr;padding:65px 16px 80px}.photo-layer img{max-width:100%;max-height:calc(100dvh - 155px)}.photo-nav{position:absolute;bottom:18px}.photo-nav.prev{left:20px}.photo-nav.next{right:20px}.photo-close{right:16px;top:12px}footer{flex-direction:column}.viewer-head{height:86px;padding-inline:20px}.reel-echo{display:none}.strip-shell{padding-block:35px}.film-strip{padding-inline:20px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}