:root{--lab:#070806;--film:#12130f;--film-hi:#292b21;--label:#e9e4d6;--mark:#e45032;--safe:#cbdc72;--hair:rgba(233,228,214,.18);--mono:Consolas,"Courier New",monospace;--sans:Arial,Helvetica,sans-serif;--serif:Georgia,"Times New Roman",serif}
html{background:var(--lab);color:var(--label)}body{background:linear-gradient(180deg,#090a07 0,#050604 65%,#0b0c08 100%);font-family:var(--sans)}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.18;background-image:radial-gradient(circle at 20% 10%,#fff 0 1px,transparent 1.2px);background-size:7px 7px;mix-blend-mode:soft-light}.top{height:72px;border-bottom:1px solid var(--hair);padding:0 clamp(18px,4vw,58px);font:10px var(--mono);letter-spacing:.16em}.top .archive-id{display:flex;align-items:center;gap:12px}.archive-mark{width:34px;height:34px;border:1px solid #777565;display:grid;place-items:center;border-radius:50%;position:relative}.archive-mark:after{content:"";width:12px;height:12px;border:4px dotted #aaa68d;border-radius:50%}.top p{opacity:.55}.top span:last-child{color:var(--safe)}.intro{min-height:62vh;padding:clamp(72px,11vw,160px) clamp(20px,5vw,76px) clamp(65px,8vw,110px);display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,430px);gap:50px;align-items:end;border-bottom:1px solid var(--hair)}.intro:after{content:"35 MM / ARCHIVE COPY";position:absolute;right:clamp(20px,5vw,76px);top:105px;font:9px var(--mono);letter-spacing:.2em;color:#777}.intro h1{font:400 clamp(68px,14vw,190px)/.73 var(--serif);letter-spacing:-.075em;text-transform:none}.intro h1 i{color:var(--mark);font-style:italic}.kicker{color:var(--safe);letter-spacing:.18em}.lede{color:#a9a79f;font:clamp(16px,1.5vw,21px)/1.55 var(--sans);max-width:390px}.rolls{padding:clamp(60px,8vw,120px) clamp(20px,5vw,76px) 130px;grid-template-columns:repeat(3,minmax(220px,1fr));gap:clamp(45px,6vw,100px);counter-reset:roll}.roll-card{counter-increment:roll}.roll-art{height:clamp(280px,30vw,440px);background:radial-gradient(circle at 50% 48%,rgba(205,215,130,.08),transparent 43%)}.coil{width:min(76%,330px);background:repeating-radial-gradient(circle,#090a07 0 10px,#313328 11px 14px,#0c0d0a 15px 24px);border-color:#686956;box-shadow:inset 0 0 0 12px #070806,inset 0 0 0 14px #777762,0 30px 45px rgba(0,0,0,.65)}.tail{height:48px;border-block:6px dashed #918e76;background:#141510;right:-2%;bottom:18%}.roll-data{position:relative;padding:18px 0 0;border-top-color:var(--hair);text-transform:uppercase}.roll-data:before{content:"ROLL 0" counter(roll);position:absolute;right:0;top:-20px;color:var(--mark);font:9px var(--mono)}.roll-data strong{font:600 14px var(--mono);letter-spacing:.12em}.roll-data b,.roll-data span{font:9px var(--mono);font-weight:400;color:#8e8c83}.roll-card:hover .coil,.roll-card:focus-visible .coil{border-color:var(--safe)}.layer{background:rgba(5,6,4,.985)}.viewer-head{height:90px;background:#090a07;border-bottom-color:var(--hair);padding-inline:clamp(18px,4vw,58px)}.viewer-head p{color:var(--label);letter-spacing:.18em}.close,.photo-nav{border-color:#4b4c42;background:#0b0c09}.strip-shell{padding:45px 0}.film-strip{gap:6px;padding:25px clamp(20px,5vw,76px);background:#10110d;border-block:10px dotted #817e68;box-shadow:0 25px 60px #000}.frame{border-color:#46483c;background:#090a08}.frame-number{background:var(--label);color:#0a0b08}.password-layer form{background:#10110d;border-color:#525347}.password-layer button[type=submit]{background:var(--safe);border-color:var(--safe)}footer{border-top-color:var(--hair);padding:36px clamp(20px,5vw,76px);color:#86847c}footer strong{font:10px var(--mono);letter-spacing:.16em}footer nav{font:9px var(--mono);letter-spacing:.14em}@media(max-width:900px){.intro{grid-template-columns:1fr;min-height:auto}.rolls{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.top{height:62px}.top p{display:none}.intro{padding-top:80px;gap:28px}.intro:after{top:83px}.intro h1{font-size:clamp(66px,24vw,104px)}.rolls{grid-template-columns:1fr;padding-top:50px}.roll-art{height:320px}.viewer-head{height:82px}.frame{flex-basis:84vw;height:65vw}footer{flex-direction:column;gap:22px}}
