/* Film selection lives inside the camera monitor; no bitmap UI or extra downloads. */
.screen{background:#101113}
.screen[data-view=films]>.screen-top,.screen[data-view=films]>.screen-bottom,.screen[data-view=films]>.focus-brackets,.screen[data-view=films]>.record-indicator,.screen[data-view=films]>.filter-disabled{visibility:hidden}
.screen>.film-browser{position:absolute;inset:0;z-index:3;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto;gap:0;padding:0;border:0;background:radial-gradient(ellipse at 50% 61%,#34312a 0%,#1b1b1b 40%,#101112 85%);color:#eeece6;overflow:hidden}
.film-browser .film-browser-top{padding:1.8cqw 3cqw 1.3cqw;border-bottom:1px solid #ffffff13;gap:1cqw}
.film-library-title{display:flex;align-items:center;gap:1cqw;font-size:clamp(6px,1.7cqw,12px);letter-spacing:.15em;white-space:nowrap;color:#979895}
.film-library-title strong{font-size:clamp(8px,2.1cqw,15px);font-weight:600;color:#eee;letter-spacing:.17em}
.film-library-title i{width:1.3cqw;height:1.3cqw;border-radius:50%;background:#edbf75;box-shadow:0 0 0 2px #edbf7530;margin-right:.35cqw}
.film-browser .favorite-filter{color:#c9bd9e;background:#ffffff07;border-color:#ffffff1a;padding:.4cqw .9cqw;gap:.5cqw;min-width:4.8cqw;min-height:3cqw;font-size:clamp(6px,1.3cqw,10px);border-radius:.6cqw}
.film-browser .favorite-filter span{font-size:clamp(9px,2.1cqw,15px)}
.film-browser .favorite-filter b{color:#bcb8a9;background:transparent;font-size:clamp(6px,1.2cqw,9px);padding:0}
.film-browser .favorite-filter[aria-pressed=true]{border-color:#ddb87888;background:#ddb87818}
.film-browser .collections{margin:0;padding:1.5cqw 2.8cqw 0;gap:.8cqw;border:0;overflow-x:auto;flex-shrink:0}
.film-browser .collections button{border:1px solid #ffffff1b;border-radius:.7cqw;background:#ffffff03;margin:0;padding:.8cqw 1.4cqw;color:#9d9d98;font-size:clamp(6px,1.5cqw,11px);line-height:1.2;letter-spacing:.05em;min-height:3.7cqw}
.film-browser .collections button[aria-selected=true]{background:linear-gradient(#41413e,#30302e);border-color:#85837c;color:#f0eee7;font-weight:500}
.film-browser .collections button b{font-size:clamp(5px,1cqw,8px);margin-left:.6cqw}
.film-browser>*{min-width:0}
.film-carousel{position:relative;min-width:0;min-height:0;width:100%}
.carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:2;padding:0;border:0;border-radius:50%;height:7cqw;width:5cqw;min-height:20px;min-width:15px;background:#12131488;color:#b4b3a9;font-size:clamp(16px,4.5cqw,32px);line-height:1}
.carousel-previous{left:1.5cqw}.carousel-next{right:1.5cqw}
.carousel-arrow:hover{color:#f0c783;background:#282723}
.film-browser .rolls{position:relative;display:flex;align-items:center;gap:4cqw;min-height:0;height:100%;padding:2cqw calc(50% - 13cqw) 1cqw;scrollbar-width:none;scroll-snap-type:x mandatory;overflow-y:hidden;overscroll-behavior-x:contain;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.film-browser .rolls::-webkit-scrollbar{display:none}
.film-browser .roll-card{flex:0 0 26cqw;height:100%;max-height:34cqw;padding:1.7cqw 0 0;display:flex;align-items:center;justify-content:center;opacity:.62;transform:scale(.8);transition:transform .3s,opacity .3s;background:none!important;border:0;border-radius:1cqw;scroll-snap-align:center;scroll-snap-stop:always}
.film-browser .roll-card.active{opacity:1;transform:scale(1)}
.film-browser .roll-card:hover{opacity:1}
.film-browser .roll-card.active:after,.film-browser .roll-name,.film-browser .roll-code{display:none}
.film-browser .roll{width:19cqw;height:26cqw;max-height:100%;margin:0 2cqw 0 0;transform:rotate(-3deg);border-radius:1.5cqw 1.5cqw 2cqw 2cqw;background:linear-gradient(90deg,#0009 0%,#0002 12%,#fff2 35%,transparent 56%,#0002 80%,#0008 100%),var(--roll-color);box-shadow:.5cqw 1.7cqw 1.8cqw #000a,inset 0 0 0 1px #ffffff1c;color:var(--roll-ink)}
.film-browser .active .roll{transform:rotate(0);box-shadow:0 1.7cqw 2.3cqw #000c,0 2cqw 4cqw #d5a04b25}
.film-browser .roll:before{top:-.9cqw;height:2.1cqw;left:-.2cqw;width:calc(100% + .4cqw);border-radius:50% 50% 15% 15%;background:linear-gradient(#3a3b3c,#0c0c0d 60%,#45413a 85%,#151516);box-shadow:0 .2cqw .3cqw #0008,inset 0 .2cqw .2cqw #a8a49d99;z-index:1}
.film-browser .roll:after{height:4.5cqw;border-radius:0 0 45% 45% / 0 0 25% 25%;background:linear-gradient(90deg,#0a0b0d,#242424 40%,#0b0c0d);box-shadow:inset 0 -.5cqw .4cqw #0006;z-index:-1}
.film-browser .roll-spool{width:7cqw;height:3.2cqw;left:6cqw;top:-3.2cqw;border-radius:45% 45% 10% 10%;background:linear-gradient(90deg,#0a0a0b,#4a4a48 40%,#171719 70%,#050507);box-shadow:inset 0 .3cqw .2cqw #aaa8;z-index:0}
.film-browser .roll-tail{height:18cqw;width:6cqw;right:-5cqw;top:3cqw;border-radius:0 1cqw 1cqw 0;transform:skewY(7deg);background:repeating-linear-gradient(to bottom,#201b17 0 .9cqw,transparent .9cqw 2.3cqw,#201b17 2.3cqw 3cqw) 80% 0/1cqw 100% no-repeat,linear-gradient(90deg,#3d291e,#946246 60%,#593d2e);box-shadow:inset .5cqw 0 1cqw #0005;z-index:-2}
.film-browser .roll-wordmark{font-family:'DM Sans',sans-serif;font-size:2.2cqw;font-weight:750;letter-spacing:.02em;padding-top:3.2cqw}
.film-browser .roll-line{width:75%;margin:1.6cqw auto 1.1cqw;border-bottom:1px solid currentColor;opacity:.6}
.film-browser .roll-series{font-family:'DM Sans',sans-serif;font-size:2.8cqw;letter-spacing:-.07em;line-height:1.05;min-height:5.6cqw;padding:0 .5cqw}
.film-browser .roll-speed{font-size:4.8cqw;font-weight:500;letter-spacing:-.06em;margin:.3cqw 0 0;line-height:1}
.film-browser .roll-foot{position:absolute;left:0;right:0;bottom:1.4cqw;color:#d2cbb8;font-size:.95cqw;letter-spacing:.1em;white-space:nowrap}
.film-browser .roll-favorite{right:1cqw;top:.4cqw;color:#edc785;font-size:2cqw}
.film-browser .film-details{margin:0 3cqw;border:0;padding:.3cqw 0 1.5cqw;min-height:0;gap:1cqw;align-items:center}
.film-browser .film-details>div{display:grid;gap:.7cqw;text-align:center;flex:1;min-width:0}
.film-browser .film-number{font-size:clamp(5px,1.2cqw,9px);color:#7b7b73;letter-spacing:.15em;grid-row:3;padding-top:.3cqw}
.film-browser .film-details strong{font-size:clamp(9px,2.8cqw,20px);font-weight:500;letter-spacing:-.02em;white-space:nowrap;color:#f3efe8}
.film-browser .film-details #detailDescription{font-size:clamp(5.5px,1.6cqw,11px);line-height:1.3;color:#9b9a92;width:auto;padding:0}
.film-browser .film-details button{position:absolute;right:3cqw;margin:0;font-size:3cqw;color:#b6a681;padding:0;background:transparent}
.film-browser .film-details button[aria-pressed=true]{color:#f0c478}
.film-browser .empty-favorites{position:absolute;left:10%;right:10%;top:40%;padding:0;color:#c2bcac;text-align:center;font-size:clamp(7px,1.8cqw,13px);line-height:1.7}
.film-browser-footer{display:flex;justify-content:space-between;align-items:center;gap:1cqw;padding:1.4cqw 3cqw;border-top:1px solid #ffffff12;background:#ffffff02}
.film-browser-footer>span{color:#9c9b93;font-size:clamp(6px,1.5cqw,11px);display:flex;align-items:center;gap:1.4cqw;white-space:nowrap}
.film-browser-footer b{color:#6f716a;font-size:clamp(5px,1.2cqw,9px);font-weight:400}
.film-browser-footer button{border:1px solid #f3d395;background:linear-gradient(110deg,#edc681,#d8ac62);border-radius:.8cqw;padding:1.1cqw 1.8cqw;color:#272016;font-size:clamp(7px,1.8cqw,13px);font-weight:600;white-space:nowrap;display:flex;gap:1.5cqw}
.film-browser :focus-visible{outline:2px solid #e6bb75;outline-offset:-2px}
.screen>.fn-panel{z-index:4}
.screen>.screen-toast{z-index:5}
.screen>.capture-flash{z-index:6}
.open-film-picker{display:flex;align-items:center;gap:12px;width:100%;max-width:880px;min-height:55px;margin:17px auto 0;padding:10px 14px;border:1px solid #c6c8b6;border-radius:7px;background:#f4f2e9;text-align:left;color:#596648}
.open-film-picker>span:nth-child(2){display:grid;gap:4px;min-width:0}
.open-film-picker small{color:#8b907d;font-size:7px;letter-spacing:1.4px}
.open-film-picker strong{font-size:11px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.picker-roll-icon{width:19px;height:25px;background:linear-gradient(90deg,#8b774e,#d6b875 45%,#af925d);border-top:4px solid #292c26;border-bottom:4px solid #292c26;border-radius:3px;position:relative;flex-shrink:0}
.picker-roll-icon:before{content:'';width:7px;height:3px;background:#292c26;position:absolute;top:-7px;left:6px;border-radius:2px 2px 0 0}
.picker-action{margin-left:auto;font-size:10px;white-space:nowrap;display:flex;align-items:center;gap:15px}
.picker-action b{font-size:17px;font-weight:400}
.open-film-picker:hover,.open-film-picker[aria-expanded=true]{border-color:#959f7c;background:#eeefdf}
@media(max-width:650px){
 .screen{aspect-ratio:1.23;min-height:190px}
 .film-browser .film-browser-top{padding:2cqw 3cqw 1.5cqw}
 .film-browser .collections{padding-top:2cqw}
 .film-browser .collections button{padding:1.3cqw 1.5cqw;min-height:5.2cqw}
 .film-browser .collections button b{display:none}
 .film-browser .rolls{padding-top:3.5cqw;padding-bottom:2cqw}
 .film-browser .roll-card{max-height:44cqw}
 .film-browser .roll{height:36cqw;width:22.5cqw}
 .film-browser .roll-spool{left:7cqw}
 .film-browser .roll-series{font-size:3.3cqw;min-height:6.2cqw}
 .film-browser .roll-wordmark{font-size:2.7cqw;padding-top:3.8cqw}
 .film-browser .roll-speed{font-size:5.8cqw;margin:.6cqw 0 0}
 .film-browser .roll-foot{font-size:1.1cqw}
 .film-browser .film-details{padding-bottom:1.7cqw}
 .film-browser .film-details>div{gap:1cqw}
 .film-browser .film-number{display:none}
 .film-browser-footer{padding:1.8cqw 3cqw}
 .film-browser-footer>span{display:grid;gap:.6cqw}
 .film-browser-footer button{padding:1.8cqw 2.4cqw}
 .open-film-picker{margin-top:13px;min-height:50px;padding:9px 11px;gap:10px}
 .open-film-picker strong{font-size:10px}.open-film-picker small{font-size:6px}.picker-action{font-size:9px;gap:7px}
}