/* Intentional, visitor-controlled interaction. No media fetched before play. */
.film-room{box-sizing:border-box;width:min(1180px,calc(100% - 40px));max-width:none;max-height:calc(100dvh - 32px);padding:0;border:1px solid #ffffff30;background:#1b1919;color:#f2eddf;overflow:auto;overscroll-behavior:contain}
.film-room::backdrop{background:#080707e8}
.film-room-shell{padding:20px 26px 24px}
.film-room-header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:16px}
.film-room-header>span{font:10px/1.4 'Courier New',monospace;letter-spacing:.1em;color:#d5cabb}
.film-room-close{display:flex;align-items:center;gap:16px;min-height:44px;border:0;background:none;color:inherit;font:14px 'DM Sans',Arial,sans-serif;cursor:pointer}
.film-room-close>span{font-size:32px;font-weight:300;line-height:1}
.film-room-screen{background:#080707;position:relative}
.film-room-screen video{display:block;width:100%;height:min(54dvh,590px);min-height:180px;object-fit:contain}
.film-room-caption{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:22px 0}
.film-room-caption h2{font:500 clamp(25px,3vw,40px)/1.1 'DM Sans',Arial,sans-serif;letter-spacing:-.04em;margin:0 0 9px}
.film-room-note{font-size:14px;line-height:1.5;color:#c7bdb0;margin:0;max-width:55ch}
.film-room-actions{display:flex;flex-direction:column;gap:12px;align-items:flex-end;flex-shrink:0;font-size:13px}
.film-room-actions a{color:inherit;text-underline-offset:4px;min-height:24px}
.film-room-inquiry{color:#f0e69d!important}
.film-room-program{display:flex;gap:12px;border-top:1px solid #ffffff24;padding-top:18px;overflow-x:auto;scrollbar-width:thin}
.film-room-program button{display:flex;flex:1 0 160px;align-items:center;gap:12px;text-align:left;color:#d1c6b8;background:transparent;border:1px solid transparent;padding:5px;cursor:pointer;font:12px/1.3 'DM Sans',Arial,sans-serif}
.film-room-program img{width:64px;height:44px;object-fit:cover;filter:grayscale(.5);opacity:.65}
.film-room-program button[aria-pressed=true]{border-color:#f0e69d;color:#fff}
.film-room-program button[aria-pressed=true] img,.film-room-program button:hover img{filter:none;opacity:1}
.film-room :focus-visible{outline:2px solid #f0e69d;outline-offset:4px}
.film-room-error{padding:14px;margin:0;font-size:14px}.film-room-error a{color:inherit;text-decoration:underline}
.work-film-image{position:relative;display:block;overflow:hidden}
.work-film-badge{position:absolute;bottom:16px;left:16px;background:#f2eddfef;color:#24201f;padding:11px 16px;border:1px solid #ffffff80;font:12px/1.2 'DM Sans',Arial,sans-serif}
.work-film-badge>span{display:inline-block;margin-right:9px;font-size:10px}
.home-work-grid [data-film]:hover .work-film-badge{background:#f0e69d}
.capture-preview{display:inline-flex;align-items:center;gap:8px;margin-top:7px;font-size:13px;text-underline-offset:4px}
.keepsake-choices{display:flex;gap:6px;margin-bottom:12px}
.keepsake-choices[hidden]{display:none}
.keepsake-choices button{background:none;color:var(--ink);padding:10px 16px;min-height:44px;border:1px solid var(--line);font:13px 'DM Sans',Arial,sans-serif;cursor:pointer}
.keepsake-choices button[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.keepsake-sample{margin:0}
.keepsake-sample[hidden]{display:none}
.keepsake-display{height:340px;background:#e7e1d3;display:flex;justify-content:center;align-items:center;gap:35px;padding:28px;overflow:hidden}
.keepsake-display img{width:190px;height:285px;object-fit:contain;transform:rotate(-5deg);box-shadow:7px 9px 0 #24201f14}
.keepsake-display>span{font:600 clamp(24px,3vw,39px)/1.05 'DM Sans',Arial,sans-serif;letter-spacing:-.04em;max-width:190px}
.keepsake-display.cards{padding:0;background:#662e2c}
.keepsake-display.cards img{width:100%;height:100%;object-fit:contain;transform:none;box-shadow:none}
.keepsake-sample figcaption{font:10px/1.5 'Courier New',monospace;color:var(--muted);margin-top:10px}
.keepsake-sample .keepsake-selection{display:flex;justify-content:space-between;gap:20px;align-items:center;padding-top:16px;font-size:14px}
.keepsake-selection a{text-underline-offset:4px}
.keepsake-selection p{margin:0}.keepsake-selection strong{font-weight:600}
.magic-reveal{border:1px solid #b8aa58;cursor:pointer;position:relative;transition:transform .24s ease,box-shadow .24s ease}
.magic-reveal[hidden],.magic-static[hidden],.magic-reveal [hidden]{display:none!important}
.magic-reveal:hover{transform:rotate(-3deg) translateY(-5px);box-shadow:10px 12px 0 #24201f25}
.magic-reveal[aria-pressed=true]{transform:rotate(5deg);background:var(--wine);color:var(--butter)}
.magic-reveal:focus-visible{outline:3px solid var(--wine);outline-offset:7px}
.magic-reveal.magic-card>span{display:flex;flex-direction:column;justify-content:space-between;align-items:center;width:100%;height:100%;transform:none}
.magic-reveal .magic-corner{font:18px/1 Georgia,serif;align-self:start}.magic-reveal .magic-corner:last-child{align-self:end;transform:rotate(180deg)}
.magic-reveal .magic-back strong{font-size:25px;line-height:1.1}.magic-reveal small{font:10px/1.4 'Courier New',monospace;letter-spacing:.08em}
@media(max-width:760px){
 .film-room{width:100%;height:100dvh;max-height:100dvh;margin:0;border:0}
 .film-room-shell{padding:max(12px,env(safe-area-inset-top)) 16px max(20px,env(safe-area-inset-bottom))}
 .film-room-header{gap:10px;margin-bottom:12px}.film-room-header>span{font-size:8px;max-width:150px}.film-room-close{font-size:12px;gap:10px}
 .film-room-screen video{height:clamp(200px,42dvh,430px)}
 .film-room-caption{display:block;padding:20px 0}.film-room-caption h2{font-size:30px}.film-room-note{font-size:13px}
 .film-room-actions{flex-direction:row;flex-wrap:wrap;gap:14px 22px;align-items:center;margin-top:20px;font-size:12px}
 .film-room-program button{flex:0 0 128px;flex-direction:column;align-items:start;gap:8px;padding:6px}.film-room-program img{width:114px;height:64px}
 .keepsake-display{height:285px;padding:22px;gap:22px}.keepsake-display img{width:150px;height:225px}.keepsake-display>span{font-size:28px}
 .keepsake-sample .keepsake-selection{align-items:start;font-size:13px;gap:15px}.keepsake-selection a{max-width:145px}
 .magic-reveal .magic-back strong{font-size:21px}
}
@media(max-width:420px){.keepsake-display:not(.cards){padding:18px;gap:16px}.keepsake-display:not(.cards) img{width:42%;height:auto;max-height:225px}.keepsake-display>span{flex:1;font-size:clamp(22px,6vw,28px)}}
@media(prefers-reduced-motion:reduce){.magic-reveal{transition:none}.magic-reveal:hover{transform:rotate(-8deg)}.magic-reveal[aria-pressed=true]{transform:none}}
