:root{color-scheme:dark;--bg:#080a0e;--panel:#121720;--panel2:#19202b;--text:#f4f6fa;--muted:#aab3c2;--line:#2b3442;--accent:#b7ff5d;--danger:#ff6c68;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);line-height:1.55}a{color:inherit}img{display:block;max-width:100%}.shell{width:min(calc(100% - 28px),1120px);margin-inline:auto}.skip{position:fixed;top:-80px;left:14px;z-index:99;padding:12px;background:var(--accent);color:#081000}.skip:focus{top:14px}.topbar{min-height:70px;padding:12px 16px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:10;background:#080a0eee;border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}.wordmark{font-size:1.35rem;font-weight:900;letter-spacing:-.06em;text-decoration:none}.wordmark span,.eyebrow{color:var(--accent)}.topbar nav{display:flex;gap:4px}.topbar nav a{padding:11px 12px;border-radius:12px;text-decoration:none;font-weight:750}.topbar .upload-link{background:var(--accent);color:#081000}.messages{width:min(calc(100% - 28px),1120px);margin:14px auto}.messages p{padding:12px 16px;border-radius:12px;background:var(--panel);border:1px solid var(--line)}.messages .success{border-color:#5b8d25}.messages .error{border-color:#a93a38}.eyebrow{margin:0 0 10px;font-size:.76rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase}h1,h2{line-height:1.04;letter-spacing:-.04em}h1{margin:10px 0 16px;font-size:clamp(2.8rem,9vw,6.5rem)}h2{font-size:1.35rem}.page-head{display:grid;gap:20px;padding-block:56px 28px}.page-head p,.form-page>p,.confirm>p{color:var(--muted)}.button{min-height:52px;padding:13px 18px;display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;border-radius:13px;font:inherit;font-weight:850;text-decoration:none;cursor:pointer}.primary{background:var(--accent);color:#081000}.quiet{border-color:var(--line);background:var(--panel);color:var(--text)}.danger{background:var(--danger);color:#180202}.toolbar{display:flex;gap:8px;padding-bottom:18px}.toolbar a{padding:9px 12px;border-radius:99px;color:var(--muted);text-decoration:none}.toolbar .active{background:var(--panel2);color:var(--text)}.photo-grid{display:grid;gap:16px;padding-bottom:64px}.photo-card{overflow:hidden;background:var(--panel);border:1px solid var(--line);border-radius:18px;text-decoration:none}.photo-card img{width:100%;aspect-ratio:1;object-fit:cover}.photo-card>div{padding:16px}.photo-card h2{margin:10px 0 5px}.photo-card time{color:var(--muted)}.state{display:inline-flex;padding:6px 9px;border-radius:99px;background:#252d38;color:#d6dce5;font-size:.72rem;font-weight:850;text-transform:uppercase;letter-spacing:.07em}.state.shared{background:#284416;color:#caff91}.empty{grid-column:1/-1;padding:28px;background:var(--panel);border:1px solid var(--line);border-radius:18px}.empty .button{margin-top:12px}.pagination{display:flex;justify-content:space-between;align-items:center;padding-bottom:60px}.form-page{max-width:760px;padding-block:48px 72px}.panel{margin-top:26px;padding:20px;background:var(--panel);border:1px solid var(--line);border-radius:18px}.field{margin-bottom:22px}.field label{display:block;margin-bottom:7px;font-weight:800}.field input:not([type=checkbox]),.field textarea{width:100%;min-height:48px;padding:12px;border:1px solid #3a4453;border-radius:11px;background:#090c11;color:var(--text);font:inherit}.field input[type=file]{padding:18px}.field input[type=checkbox]{width:24px;height:24px;vertical-align:middle}.field small{display:block;margin-top:6px;color:var(--muted)}.errorlist{color:#ff9794}.sharing-field{padding:18px;border:1px solid #526b36;border-radius:14px;background:#121c0b}.disclosure{display:grid;gap:5px;margin:18px 0;padding:17px;border-radius:13px;background:#0d1219;color:var(--muted)}.disclosure b{color:var(--text);margin-top:5px}.detail{padding-block:42px 72px}.detail-head{display:grid;gap:20px;margin-bottom:26px}.detail-head h1{font-size:clamp(2.6rem,8vw,5rem)}.detail-head time{color:var(--muted)}.detail-actions{display:flex;flex-wrap:wrap;gap:9px}.hero-photo{width:100%;max-height:78vh;object-fit:contain;background:#030405;border-radius:18px}.info-grid{display:grid;gap:14px;margin-top:18px}.info-grid section{padding:20px;background:var(--panel);border:1px solid var(--line);border-radius:16px}.private-note{border-color:#5c4c2c!important}.tag{display:inline-flex;margin:3px;padding:5px 9px;border-radius:99px;background:var(--panel2)}dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px}dt{color:var(--muted)}dd{margin:0;overflow-wrap:anywhere}.danger-zone{margin-top:28px;padding-top:22px;border-top:1px solid var(--line)}.danger-zone a{color:#ff8c89}.confirm{max-width:760px;padding-block:70px}.confirm h1{font-size:clamp(2.8rem,8vw,5rem)}.confirm form{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}@media(min-width:680px){.topbar{padding-inline:32px}.page-head{grid-template-columns:1fr auto;align-items:end}.photo-grid{grid-template-columns:repeat(3,1fr)}.panel{padding:30px}.detail-head{grid-template-columns:1fr auto;align-items:end}.info-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1050px){.photo-grid{grid-template-columns:repeat(4,1fr)}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.community-list{display:grid;gap:24px;padding-bottom:68px}.community-memory{display:grid;gap:16px;padding-bottom:24px;border-bottom:1px solid var(--line)}.community-memory img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:18px}.community-memory h2{margin:7px 0}.community-memory h2 a{text-decoration:none}.community-memory time,.community-memory span,.community-memory p{color:var(--muted)}@media(min-width:760px){.community-memory{grid-template-columns:minmax(260px,42%) 1fr;align-items:center}.community-memory img{aspect-ratio:3/2}}

/* Native horizontal scrolling remains the foundation. JavaScript bends the
   individual film segments around the viewport center as progressive enhancement. */
.reel-stage{position:relative;overflow:hidden;padding:4px 0 56px;background:radial-gradient(ellipse at 50% 42%,#202a38 0,#111722 34%,transparent 68%)}
.reel-stage::before{position:absolute;inset:90px 0 80px;content:"";pointer-events:none;background:radial-gradient(ellipse at center,#b7ff5d0c 0,transparent 60%);filter:blur(18px)}
.reel-intro{display:flex;align-items:end;justify-content:space-between;gap:18px;padding-bottom:18px}
.reel-intro p{margin:0;color:var(--muted)}.reel-intro .eyebrow{color:var(--accent);margin-bottom:4px}
.reel-controls{display:flex;gap:8px;flex:none}.reel-button{width:50px;height:50px;border:1px solid #3d4653;border-radius:50%;background:var(--panel);color:var(--text);font:inherit;font-size:1.3rem;font-weight:800;line-height:1;cursor:pointer}.reel-button:hover,.reel-button:focus-visible{border-color:var(--accent);color:var(--accent)}.reel-button:disabled{opacity:.35;cursor:not-allowed}
.film-reel{display:flex;align-items:center;gap:0;width:100%;min-height:min(78vw,510px);padding:64px max(11vw,24px);overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:max(11vw,24px);perspective:1100px;scrollbar-color:var(--accent) #11151b;scrollbar-width:thin}
.film-frame{--reel-distance:1;--reel-y:0px;--reel-rotate:0deg;--reel-tilt:0deg;position:relative;display:flex;flex:0 0 min(76vw,390px);flex-direction:column;min-width:0;padding:24px 8px;background:linear-gradient(105deg,#07090c,#151a21 48%,#080a0d);border-inline:1px solid #30363e;color:var(--text);text-decoration:none;scroll-snap-align:center;transform-origin:center;transform:translate3d(0,var(--reel-y),0) rotate(var(--reel-rotate)) rotateY(var(--reel-tilt)) scale(calc(1 - var(--reel-distance) * .07));opacity:calc(1 - var(--reel-distance) * .25);transition:transform .22s cubic-bezier(.2,.75,.25,1),opacity .22s ease,filter .22s ease,box-shadow .22s ease;filter:saturate(calc(1 - var(--reel-distance) * .22)) brightness(calc(1 - var(--reel-distance) * .12));will-change:transform}
.film-frame::before,.film-frame::after{position:absolute;left:0;width:100%;height:11px;content:"";background:repeating-linear-gradient(90deg,transparent 0 8px,#d9d8cf 8px 19px,transparent 19px 27px);box-shadow:inset 0 1px #ffffff13,inset 0 -1px #000}.film-frame::before{top:6px}.film-frame::after{bottom:6px}
.film-frame:focus-visible,.film-frame.is-current{box-shadow:0 18px 48px #000c,0 0 0 1px #ffffff26;opacity:1;filter:none}
.film-image{display:block;overflow:hidden;background:#020304;aspect-ratio:4/3;box-shadow:inset 0 0 0 1px #ffffff12}.film-image img{width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.2,.75,.2,1)}.film-frame:hover .film-image img,.film-frame:focus-visible .film-image img,.film-frame.is-current .film-image img{transform:scale(1.035)}
.film-caption{display:grid;grid-template-columns:1fr auto;gap:5px 12px;padding:13px 8px 9px}.film-caption .state{grid-column:1/-1;width:max-content}.film-caption strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1.05rem}.film-caption time{color:var(--muted);font-size:.83rem;white-space:nowrap}
.film-caption .film-byline{grid-column:1/-1;overflow:hidden;color:var(--accent);font-size:.76rem;font-weight:800;text-overflow:ellipsis;white-space:nowrap}
.film-leader,.film-tail{display:grid;flex:0 0 16vw;min-height:310px;place-items:center;background:linear-gradient(#080a0d,#151a21,#080a0d);color:#777f88;font-size:.7rem;font-weight:900;letter-spacing:.22em;writing-mode:vertical-rl;transform:rotate(-4deg)}.film-leader{scroll-snap-align:start}.film-tail{scroll-snap-align:end;transform:rotate(4deg)}
.reel-position{margin-top:12px;text-align:center;color:var(--muted);font-variant-numeric:tabular-nums}
@media(min-width:760px){.film-reel{min-height:520px;padding-block:76px}.film-frame{flex-basis:min(42vw,430px)}.film-leader,.film-tail{flex-basis:14vw}}
@media(prefers-reduced-motion:no-preference){.film-reel.is-enhanced{animation:reel-reveal .65s both}@keyframes reel-reveal{from{opacity:0;transform:translateY(12px)}}}
@media(prefers-reduced-motion:reduce){.film-frame,.film-image img,.film-reel{transition:none!important;animation:none!important;transform:none!important;opacity:1!important;filter:none!important}.film-reel{gap:8px}}
@media(max-width:560px){.topbar{flex-wrap:wrap}.topbar nav{order:2;width:100%;overflow-x:auto}.topbar nav a{flex:1;padding:10px 6px;text-align:center;font-size:.84rem}}
.trash-list{display:grid;gap:12px;padding-bottom:70px}.trash-memory{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px;background:var(--panel);border:1px solid var(--line);border-radius:16px}.trash-memory h2{margin:10px 0 4px}.trash-memory p{margin:3px 0;color:var(--muted)}@media(max-width:560px){.trash-memory{align-items:stretch;flex-direction:column}.trash-memory .button{width:100%}}
