@charset "UTF-8";
:root{color-scheme:dark;--ink:#f5f3ff;--muted:#abaec7;--subtle:#80869f;--line:#ffffff13;--surface:#141829;--lavender:#d4caff;--ease:cubic-bezier(.2,.8,.2,1);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-synthesis:none}
*{box-sizing:border-box}html,body{margin:0;width:100%;min-height:100%;background:#101625;color:var(--ink)}body{min-height:100dvh;display:grid;place-items:center;padding:12px 16px;background:radial-gradient(ellipse at 8% 15%,#25475288,transparent 53%),radial-gradient(ellipse at 95% 90%,#50396d99,transparent 60%),linear-gradient(140deg,#101d2a,#171729 58%,#252036);overflow:hidden}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{color:inherit;cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #e0d8ff;outline-offset:4px}button,a{touch-action:manipulation}button{transition:background .22s var(--ease),color .22s var(--ease),border-color .22s var(--ease),transform .18s var(--ease),opacity .22s var(--ease)}button:active:not(:disabled){transform:scale(.96)}button:disabled{opacity:.38}button svg{width:19px;height:19px;flex:none}button span{pointer-events:none}h1,h2,p{margin:0}button,input,select{font-size:1rem}a{color:inherit;text-decoration:none}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.ambient{position:fixed;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent,#ffffff02 50%,transparent)}
.app{position:relative;display:flex;flex-direction:column;width:min(1760px,100%);height:calc(100dvh - 24px);max-height:none;min-height:0;background:linear-gradient(145deg,#181f31ed,#1b1c31ed);border:1px solid #ffffff12;border-radius:28px;box-shadow:0 30px 100px #06091255;overflow:hidden;animation:shell-in .55s var(--ease) both}.app-header{height:76px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 34px;gap:16px}.brand{font-weight:550;font-size:1.08rem;display:flex;align-items:center;gap:11px;letter-spacing:-.025em}.brand-mark{font-size:1.5rem;color:var(--lavender);line-height:1}.sample-label{font-size:.75rem;color:var(--subtle);white-space:nowrap}.workspace{min-height:0;flex:1;display:flex;flex-direction:column}.view{display:flex;flex-direction:column;min-height:0;height:100%}.view-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:24px 34px 20px;min-height:80px;flex-shrink:0}.view-heading{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}h1{font-size:1.4rem;letter-spacing:-.04em;font-weight:500}.meta{font-size:.875rem;line-height:1.5;color:var(--muted);font-variant-numeric:tabular-nums}.plain-button{background:transparent;border:0;min-height:44px;padding:9px 2px;color:var(--muted);display:inline-flex;gap:7px;align-items:center}.plain-button:hover{color:var(--ink)}.scroll-region{overflow:auto;min-height:0;flex:1;max-width:100%;overscroll-behavior:contain;scrollbar-gutter:stable;padding:2px 34px 28px;scrollbar-width:thin;scrollbar-color:#ffffff28 transparent}.scroll-region::-webkit-scrollbar{width:5px}.scroll-region::-webkit-scrollbar-thumb{background:#ffffff28;border-radius:5px}.movie-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:26px 20px;align-items:start}.movie-tile{min-width:0}.poster{position:relative;aspect-ratio:2/3;width:100%;max-height:340px;min-height:0;border-radius:12px;overflow:hidden;background:radial-gradient(ellipse at 25% 22%,var(--glow),transparent 64%),linear-gradient(150deg,var(--color),#13172a 110%);border:1px solid #ffffff12;display:flex;align-items:flex-end;padding:20px;color:#fff;text-align:left;isolation:isolate}.poster:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#11142599,transparent 58%)}.poster-title{font-family:Georgia,"Times New Roman",serif;font-size:clamp(1.45rem,2.7vw,2.2rem);line-height:1.08;font-weight:400;letter-spacing:-.035em;text-wrap:balance;max-width:100%}.tone-0{--color:#28475f;--glow:#76969d}.tone-1{--color:#7e453e;--glow:#d3a574}.tone-2{--color:#743e65;--glow:#c98f99}.tone-3{--color:#344847;--glow:#71826d}.tone-4{--color:#4b6053;--glow:#9da878}.tone-5{--color:#484275;--glow:#9986bc}.tone-6{--color:#4f566c;--glow:#91a2b3}.tone-7{--color:#5d4968;--glow:#cda38e}.movie-info{padding:11px 1px 0}.movie-info .meta{display:flex;justify-content:space-between;gap:5px;flex-wrap:wrap;font-size:.8125rem}.description{font-size:.94rem;line-height:1.55;color:#cacbdc;margin-top:7px;text-wrap:pretty}.saved-grid .description{font-size:.9rem}.bottom-bar{flex-shrink:0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:18px 34px;border-top:0;background:transparent;min-height:86px}.button{border-radius:14px;min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:12px 22px;border:1px solid #ffffff19;background:#ffffff05;font-weight:500;font-size:.94rem;white-space:nowrap}.button:hover:not(:disabled){background:#ffffff0d;border-color:#ffffff30}.button.primary{background:var(--lavender);color:#282037;border-color:transparent}.button.primary:hover:not(:disabled){background:#e4dcff}.bottom-bar .button{min-width:180px}.empty-state{min-height:210px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px;color:var(--muted);text-align:center}.empty-state h2{color:var(--ink);font-weight:400;font-size:1.4rem}.empty-state p{font-size:1rem;line-height:1.5;max-width:310px}
.deck-region{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:14px}.deck-shell{width:100%;max-width:330px;position:relative;margin:0 auto;flex:none}.deck-shadow{position:absolute;top:7px;left:10px;right:10px;height:min(42dvh,345px);max-height:345px;background:#ffffff06;border:1px solid #ffffff09;border-radius:17px;transform:rotate(4deg);pointer-events:none}.swipe-card{position:relative;touch-action:pan-y;user-select:none;will-change:transform,opacity;cursor:grab}.swipe-card:active{cursor:grabbing}.swipe-card .poster{width:100%;height:min(42dvh,345px);max-height:345px;aspect-ratio:auto;padding:28px;border-radius:17px}.swipe-card .poster-title{font-size:2.6rem;max-width:240px}.swipe-card .movie-info{padding:19px 2px 4px}.swipe-card .description{font-size:1rem;line-height:1.6}.swipe-card .movie-info .meta{font-size:.875rem}.deck-progress{margin:24px 0 0;min-height:24px;width:100%;max-width:330px;display:flex;justify-content:space-between;align-items:center;gap:12px}.deck-progress .plain-button{min-height:40px;padding:5px 0}.deck-footer{display:flex;gap:14px;width:100%;max-width:390px;justify-content:center}.deck-footer .button{flex:1;min-width:0}.choice-stamp{position:absolute;top:30px;border:2px solid currentColor;border-radius:8px;padding:6px 13px;font-size:1rem;text-transform:uppercase;letter-spacing:.06em;opacity:0;pointer-events:none;z-index:2}.choice-stamp.yes{left:24px;color:#edebff;transform:rotate(-12deg)}.choice-stamp.no{right:24px;color:#ffd9d9;transform:rotate(12deg)}.genre-card{min-height:290px;height:min(44dvh,365px);max-height:365px;border-radius:18px;padding:32px;display:flex;flex-direction:column;justify-content:flex-end;border:1px solid #ffffff14;background:radial-gradient(ellipse at 20% 10%,var(--glow),transparent 90%),linear-gradient(140deg,var(--color),#19192a);position:relative;overflow:hidden}.genre-card h2{font-family:Georgia,serif;font-size:3.2rem;font-weight:400;letter-spacing:-.05em;line-height:1.05}.genre-card p{font-size:1rem;line-height:1.5;color:#f1edf4d9;margin-top:14px;max-width:220px}.genre-selection{margin:20px 0 0;min-height:24px;width:100%;max-width:330px;text-align:center;color:var(--muted);font-size:.875rem;line-height:1.5}.swipe-hint{text-align:center;font-size:.8125rem;color:var(--subtle);margin:4px 0 0}
@keyframes shell-in{from{opacity:0;transform:translateY(18px) scale(.988)}to{opacity:1;transform:none}}@media(min-width:1200px){.deck-region{padding-top:20px}.deck-shell{max-width:350px}.swipe-card .poster{height:min(43dvh,370px);max-height:370px}.deck-shadow{height:min(43dvh,370px);max-height:370px}}
@media(max-width:800px){.movie-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.app-header{padding:0 26px}.view-head{padding-left:26px;padding-right:26px}.scroll-region{padding-left:26px;padding-right:26px}.bottom-bar{padding-left:26px;padding-right:26px}}
@media(max-width:560px){body{padding:12px 10px;padding-top:max(12px,env(safe-area-inset-top));padding-bottom:max(12px,env(safe-area-inset-bottom))}.app{height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));max-height:none;border-radius:22px}.app-header{height:62px;padding:0 20px}.brand{font-size:1rem;gap:9px}.sample-label{font-size:.6875rem}.view-head{padding:17px 20px 14px;min-height:71px}.view-heading{gap:9px}h1{font-size:1.25rem}.scroll-region{padding:2px 18px 24px}.movie-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:23px 13px}.poster{padding:16px 13px;border-radius:11px}.poster-title{font-size:1.7rem}.description,.saved-grid .description{font-size:.9rem;line-height:1.5}.movie-info .meta{font-size:.75rem}.bottom-bar{padding:15px 18px;gap:9px;min-height:80px}.bottom-bar .button{min-width:0;flex:1;padding:12px 15px;font-size:.9rem}.deck-region{padding-top:12px}.deck-shell{max-width:280px}.swipe-card .poster{height:min(39dvh,330px);max-height:330px;padding:23px}.deck-shadow{height:min(39dvh,330px);max-height:330px}.swipe-card .poster-title{font-size:2.3rem}.swipe-card .description{font-size:.94rem;line-height:1.55}.swipe-card .movie-info{padding-top:16px}.deck-progress{max-width:280px;margin-top:15px}.genre-card{height:min(43dvh,350px);min-height:230px;padding:27px}.genre-card h2{font-size:2.8rem}.genre-card p{font-size:1rem}.genre-selection{max-width:280px}.swipe-hint{font-size:.75rem}}
@media(max-width:350px){.app-header{padding:0 15px}.view-head{padding-left:15px;padding-right:15px}.scroll-region{padding-left:13px;padding-right:13px}.poster-title{font-size:1.4rem}.poster{padding:13px 10px}.sample-label{max-width:65px;white-space:normal;text-align:right}.view-heading{gap:5px}.view-heading .meta{font-size:.75rem}.bottom-bar{padding:12px}.button{font-size:.875rem}.deck-shell{max-width:250px}}
@media(max-height:590px){body{padding-top:8px;padding-bottom:8px}.app{height:calc(100dvh - 16px)}.app-header{height:50px}.view-head{min-height:57px;padding-top:9px;padding-bottom:9px}.bottom-bar{padding-top:10px;padding-bottom:10px;min-height:66px}.deck-region{justify-content:flex-start}.swipe-card .poster{min-height:170px}.genre-card{min-height:210px}}
@media(prefers-reduced-motion:reduce){.app{animation-duration:.12s}button{transition-duration:.1s}}

/* Both cards share a slot, so the incoming card starts before the old one leaves. */
.deck-shell{display:grid;align-items:start}
.swipe-card{grid-area:1 / 1;min-width:0;width:100%;z-index:1;transform-origin:50% 45%}
.swipe-card.leaving{position:absolute;inset:0 0 auto;z-index:2;pointer-events:none}
.swipe-card:focus-visible{outline:2px solid var(--lavender);outline-offset:7px;border-radius:17px}
.swipe-hint{margin-top:22px}
.bottom-bar.swipe-bottom-bar .button{min-width:120px;max-width:150px;flex:0 1 150px}
button{transition:background .22s var(--ease),color .22s var(--ease),border-color .22s var(--ease),transform .32s cubic-bezier(.2,1.65,.35,1),opacity .22s var(--ease)}
button:active:not(:disabled){transform:scale(.92)}
@media(prefers-reduced-motion:reduce){button{transition-duration:.1s}}

.app-header{transition:height .5s var(--ease),opacity .4s var(--ease),border-color .4s var(--ease)}
.app.on-title .app-header{height:0;opacity:0;border-bottom-color:transparent;pointer-events:none;visibility:hidden}
.title-screen{position:relative;isolation:isolate;flex:1;min-height:0;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px;overflow:auto;padding:34px 24px;text-align:center}
.title-screen h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2.8rem,7vw,4.7rem);font-weight:400;line-height:1.08;letter-spacing:-.055em;flex-shrink:0}
.title-screen .button{min-width:190px;max-width:100%;min-height:52px}
.title-glow{position:absolute;z-index:-1;top:15%;left:20%;width:60%;height:65%;border-radius:50%;background:radial-gradient(ellipse,#a28cc529,transparent 70%);pointer-events:none}
.title-fan{position:relative;width:min(100%,420px);aspect-ratio:1.3;max-height:325px;flex-shrink:0;margin-bottom:2px}
.fan-card{position:absolute;top:18px;left:50%;width:42%;max-width:176px;transform-origin:50% 75%;animation-duration:.85s;animation-timing-function:ease-out;animation-fill-mode:both}
.fan-card .poster{max-height:none;padding:20px 16px;border-radius:13px;border-color:#ffffff2c;box-shadow:0 18px 34px #080e2559}
.fan-card .poster-title{font-size:clamp(1.2rem,3vw,1.75rem)}
.fan-left{transform:translate(-86%,18px) rotate(-16deg);animation-name:fan-left-in;animation-delay:.06s}
.fan-right{transform:translate(-14%,18px) rotate(16deg);animation-name:fan-right-in;animation-delay:.12s}
.fan-front{z-index:1;transform:translate(-50%,-5px);animation-name:fan-front-in}
@keyframes fan-left-in{0%{opacity:0;transform:translate(-50%,48px) rotate(0) scale(.86)}55%{opacity:1;transform:translate(-91%,11px) rotate(-19deg) scale(1.025)}79%{opacity:1;transform:translate(-84%,21px) rotate(-15deg) scale(.995)}100%{opacity:1;transform:translate(-86%,18px) rotate(-16deg) scale(1)}}
@keyframes fan-right-in{0%{opacity:0;transform:translate(-50%,48px) rotate(0) scale(.86)}55%{opacity:1;transform:translate(-9%,11px) rotate(19deg) scale(1.025)}79%{opacity:1;transform:translate(-16%,21px) rotate(15deg) scale(.995)}100%{opacity:1;transform:translate(-14%,18px) rotate(16deg) scale(1)}}
@keyframes fan-front-in{0%{opacity:0;transform:translate(-50%,38px) scale(.87)}55%{opacity:1;transform:translate(-50%,-14px) scale(1.04)}79%{opacity:1;transform:translate(-50%,-1px) scale(.995)}100%{opacity:1;transform:translate(-50%,-5px) scale(1)}}
@keyframes fan-fade-in{from{opacity:0}to{opacity:1}}
@media(max-width:560px){.title-screen{gap:27px}.title-fan{width:min(100%,310px)}.fan-card .poster{padding:15px 12px}.title-screen .button{min-width:210px}}
@media(max-height:590px){.title-screen{gap:20px;padding:25px;justify-content:flex-start}.title-fan{width:min(100%,250px)}.title-screen h1{font-size:2.5rem}.title-screen .button{flex-shrink:0}}
@media(prefers-reduced-motion:reduce){.app-header{transition-duration:.1s}.fan-card{animation-name:fan-fade-in;animation-duration:.14s;animation-delay:0s}}


/* One count, on a thumb-driven half-circle carousel. */
.count-nav{padding:14px 34px 0;flex-shrink:0}
.count-region{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding-top:12px;padding-bottom:28px}
.count-region h1{font-size:clamp(1.7rem,4.5vw,2.3rem);font-weight:400;letter-spacing:-.05em;margin:0 0 32px;flex-shrink:0}
.count-wheel{position:relative;width:min(100%,430px);height:260px;flex-shrink:0;touch-action:pan-y;user-select:none;cursor:grab;--dial-radius:110px;--dial-center:227px}
.count-wheel.dragging{cursor:grabbing}
.count-wheel:has(.count-input:focus-visible){outline:2px solid var(--lavender);outline-offset:6px;border-radius:20px}
.count-input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;pointer-events:none}
.arc-numbers{position:absolute;inset:0;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 5% 95%,transparent)}
.arc-number{position:absolute;left:50%;top:0;display:block;min-width:44px;min-height:44px;padding:3px;opacity:0;font-size:clamp(1.8rem,7vw,2.4rem);line-height:1.2;font-weight:400;letter-spacing:-.04em;font-variant-numeric:tabular-nums;color:var(--ink);will-change:transform,opacity}

.count-unit{position:absolute;top:97px;left:50%;transform:translateX(-50%);color:var(--muted);font-size:1rem;pointer-events:none}
.count-hint{color:var(--muted);font-size:.875rem;line-height:1.5;margin:0}
.count-availability{min-height:44px;max-width:300px;margin:12px 0 0;color:var(--muted);font-size:.875rem;line-height:1.5}
.footer-actions{grid-column:2;display:flex;justify-content:center;align-items:center;gap:12px;min-width:0}
.bottom-bar>.credits-link{grid-column:3;justify-self:end}
.count-bottom-bar .footer-actions{width:330px;max-width:100%}
.count-bottom-bar .button{min-width:210px;max-width:330px;flex:0 1 330px}
.deck-region{overflow-x:hidden}
.deck-flight{position:absolute;top:0;left:0;width:100%;z-index:0;pointer-events:none;opacity:0;transform-origin:50% 70%;will-change:transform,opacity}
.deck-flight .poster{height:min(42dvh,345px);max-height:345px;aspect-ratio:auto;padding:28px;border-radius:17px;box-shadow:0 15px 40px #090a1e44}
.deck-flight .poster-title{font-size:2.6rem}
@media(min-width:1200px){.deck-flight .poster{height:min(43dvh,370px);max-height:370px}}
@media(max-width:560px){.count-nav{padding:10px 20px 0}.count-region{padding-left:16px;padding-right:16px}.count-region h1{margin-bottom:26px}.count-wheel{height:235px}.deck-flight .poster{height:min(39dvh,330px);max-height:330px;padding:23px}.deck-flight .poster-title{font-size:2.3rem}}
@media(max-height:670px){.count-region{justify-content:flex-start;padding-top:12px}.count-region h1{margin-bottom:20px}.count-availability{min-height:24px}}

/* The tick ring and its tangent-aligned numerals share one angular position. */
.dial-window{position:absolute;inset:0;height:var(--dial-center);overflow:hidden;pointer-events:none}
.dial-rotor{position:absolute;left:calc(50% - var(--dial-radius));top:calc(var(--dial-center) - var(--dial-radius));width:calc(var(--dial-radius)*2);height:calc(var(--dial-radius)*2);border-radius:50%;background:repeating-conic-gradient(from -.5deg,#d4caffba 0deg 1deg,transparent 1deg 24deg),repeating-conic-gradient(from -.4deg,#d4caff40 0deg .8deg,transparent .8deg 4deg);mask-image:radial-gradient(farthest-side,transparent calc(100% - 12px),#000 calc(100% - 11px));will-change:transform}
.dial-needle{position:absolute;left:calc(50% - 1px);top:117px;width:2px;height:15px;border-radius:2px;background:var(--lavender);pointer-events:none}
.years-region{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding-top:20px;padding-bottom:30px}
.years-region h1{font-size:clamp(1.7rem,4.5vw,2.3rem);font-weight:400;letter-spacing:-.05em;margin:0 0 34px;flex-shrink:0}
.year-wheels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:24px;width:min(100%,370px);flex-shrink:0;margin-bottom:25px}
.year-column{min-width:0;width:100%}
.year-column>label{display:block;font-size:1rem;color:var(--muted);margin-bottom:12px}
.year-wheel{position:relative;isolation:isolate;height:272px;touch-action:none;user-select:none;cursor:grab}
.year-wheel.dragging{cursor:grabbing}
.year-wheel:has(.count-input:focus-visible){outline:2px solid var(--lavender);outline-offset:5px;border-radius:14px}
.year-numbers{position:absolute;inset:0;overflow:hidden;mask-image:linear-gradient(transparent,#000 20% 80%,transparent)}
.year-number{position:absolute;top:50%;left:50%;font-size:clamp(1.65rem,6vw,2rem);font-weight:400;line-height:1.2;font-variant-numeric:tabular-nums;min-height:44px;min-width:100%;padding:3px 0;display:grid;place-items:center;opacity:0;will-change:transform,opacity}
.year-selection{position:absolute;top:50%;left:0;width:100%;height:56px;transform:translateY(-50%);border-radius:12px;background:#d4caff12;border:1px solid #d4caff13;pointer-events:none}
@media(max-width:560px){.year-wheels{gap:18px}.years-region{padding-left:24px;padding-right:24px}}
@media(max-height:670px){.years-region{justify-content:flex-start;padding-top:12px}.years-region h1{margin-bottom:22px}.year-wheels{margin-bottom:18px}}
.genre-actions{display:flex;align-items:center;gap:16px;flex-shrink:0;margin-left:auto}
.view-head:has(.genre-actions){flex-wrap:wrap;row-gap:0}
.view-head:has(.clear-movies){flex-wrap:wrap;row-gap:0}
.clear-movies{margin-left:auto}
.poster-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#111524;pointer-events:none}
.has-poster .poster-title{visibility:hidden}
.movie-title{font-size:1.15rem;font-weight:500;line-height:1.3;margin:0 0 7px;letter-spacing:-.025em}
.swipe-card .movie-title{font-size:1.4rem}
.movie-rating{font-size:.875rem;color:var(--muted);margin-top:7px}
.catalog-status p{color:var(--muted);font-size:1rem}
.brand-logo{display:block;flex:none;width:36px;height:36px}
.title-brand{display:flex;align-items:center;justify-content:center;gap:18px;flex-shrink:0}
.title-brand img{display:block;width:clamp(42px,7vw,64px);height:auto;flex:none}
.app-footer{display:flex;justify-content:flex-end;align-items:center;flex-shrink:0;padding:0 26px 6px;min-height:44px}
.credits-link{font-size:.8rem;padding:10px 8px;min-height:38px;color:var(--subtle)}
.app:not(.on-title)>.app-footer{display:none}
.shortlist-region{scroll-behavior:smooth;touch-action:pan-y;overflow-x:hidden;overflow-anchor:none;-webkit-overflow-scrolling:touch}
.shortlist-region:focus-visible{outline:2px solid var(--lavender);outline-offset:-3px;border-radius:8px}
.saved-grid .movie-tile{contain:layout}
@media(max-width:560px){.title-brand{gap:12px}.title-brand h1{font-size:clamp(2.2rem,9vw,3.1rem)}.brand-logo{width:32px;height:32px}.app-footer{padding:0 12px 4px}.credits-link{min-height:40px}}
@media(prefers-reduced-motion:reduce){.shortlist-region{scroll-behavior:auto}}
#credits-dialog{width:min(420px,calc(100% - 40px));padding:28px;border-radius:20px;border:1px solid #ffffff25;background:#1b1c31;color:var(--ink);box-shadow:0 25px 90px #0008}
#credits-dialog::backdrop{background:#080c18bd}
#credits-dialog h2{font-weight:500;font-size:1.5rem;margin-bottom:24px}
#credits-dialog p{font-size:1rem;line-height:1.6;margin:20px 0}
#credits-dialog form{display:flex;justify-content:flex-end}
@media(max-width:560px){.catalog-source{gap:10px}.catalog-source .sample-label{font-size:.8rem}.movie-title{font-size:1rem}.swipe-card .movie-title{font-size:1.25rem}}

/* Scrollable areas stay usable with a mouse, keyboard, or touch, without rails. */
*{scrollbar-width:none}
*::-webkit-scrollbar{display:none;width:0;height:0}
.scroll-region{scrollbar-gutter:auto;scrollbar-width:none}
.scroll-region::-webkit-scrollbar{display:none;width:0;height:0}
.movie-info,.movie-title,.movie-rating,.description{display:block}
.shortlist-region{padding-top:18px}
.movie-select{display:block;width:100%;padding:0;border:0;border-radius:12px;background:transparent;text-align:left;color:inherit}
.movie-select .poster{max-height:none;aspect-ratio:2/3;border:0;pointer-events:auto;transition:transform .28s var(--ease),box-shadow .28s var(--ease);box-shadow:0 3px 8px #05091730}
.movie-select .poster.has-poster{padding:0}
.movie-select .poster-image{object-fit:cover}
.movie-select .movie-info{padding:12px 8px 0}
.movie-select:active:not(:disabled){transform:none}
.movie-select:focus-visible{outline:none}
.movie-select:focus-visible .poster{outline:2px solid var(--lavender);outline-offset:4px}
@media(hover:hover){.movie-select .poster:hover{transform:translateY(-10px) scale(1.02);box-shadow:0 20px 30px #05091780,0 6px 12px #05091755}}
@media(max-width:560px){.bottom-bar{grid-template-columns:minmax(0,1fr) auto;padding:12px;gap:8px;min-height:74px}.footer-actions{grid-column:1;gap:8px}.bottom-bar>.credits-link{grid-column:2;padding:10px 2px}.bottom-bar .button{padding:11px 10px;font-size:.82rem;gap:5px}.count-bottom-bar .footer-actions{width:100%}.count-bottom-bar .button{min-width:0}.bottom-bar.swipe-bottom-bar .button{min-width:100px}}
@media(max-width:350px){.bottom-bar .button{padding:11px 7px;gap:4px;font-size:.76rem}.bottom-bar>.credits-link{font-size:.73rem}}

/* Let the image's intrinsic aspect ratio determine the visible poster card. */
.movie-deck .deck-shadow{display:none}
.swipe-card .poster.has-poster,.deck-flight .poster.has-poster{width:fit-content;height:auto;max-height:none;max-width:100%;aspect-ratio:auto;padding:0;margin-inline:auto;border-radius:15px}
.swipe-card .poster-image,.deck-flight .poster-image{position:static;display:block;width:auto;height:auto;max-width:100%;max-height:min(42dvh,345px);object-fit:contain}
.has-poster .poster-title{display:none}
.movie-deck .description{font-size:.94rem;line-height:1.55}
.movie-deck .swipe-card .movie-info{padding-top:15px}

#movie-detail-dialog{width:min(940px,calc(100% - 48px));max-width:none;max-height:none;padding:0;border:0;overflow:visible;background:transparent;color:var(--ink)}
#movie-detail-dialog::backdrop{background:#070b17b8;backdrop-filter:blur(8px);animation:detail-backdrop-in .48s ease both}
#movie-detail-dialog[data-closing]::backdrop{animation:detail-backdrop-out .38s ease both}
.movie-detail-panel{position:relative;border:1px solid #ffffff20;border-radius:26px;background:linear-gradient(135deg,#232940,#191b2e);box-shadow:0 30px 100px #0009;overflow:hidden}
.detail-close{position:absolute;right:14px;top:14px;z-index:2;display:grid;place-items:center;width:44px;height:44px;border:1px solid #ffffff1c;border-radius:50%;background:#171b2ded;backdrop-filter:blur(12px);font-size:1.8rem;line-height:1;color:var(--ink)}
.detail-close:hover{background:#393a54}
.detail-body{display:grid;grid-template-columns:minmax(0,230px) minmax(0,1fr);align-items:start;gap:28px;max-height:calc(100dvh - 80px);overflow:auto;overscroll-behavior:contain;padding:38px}
.detail-poster .poster{padding:0;max-height:none;aspect-ratio:2/3;border-radius:15px}
.detail-poster .poster-image{object-fit:contain}
.detail-poster .poster:not(.has-poster){padding:20px}
.detail-copy{min-width:0}
.detail-eyebrow{color:var(--lavender);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;margin:2px 32px 12px 0}
#movie-detail-title{font-family:Georgia,'Times New Roman',serif;font-size:clamp(1.7rem,4vw,2.3rem);font-weight:400;line-height:1.12;letter-spacing:-.035em;margin-right:20px;text-wrap:balance}
.detail-facts{display:grid;grid-template-columns:1fr 1fr;gap:16px 22px;margin:24px 0}
.detail-facts>div:nth-child(3){grid-column:1/-1}
.detail-facts dt{font-size:.72rem;color:var(--muted);margin-bottom:4px}
.detail-facts dd{font-size:.9rem;line-height:1.5;margin:0}
.detail-copy h3{font-size:.9rem;font-weight:500;margin:0 0 10px}
.detail-synopsis{font-size:.96rem;line-height:1.7;color:#d8d8e7}
.detail-links{display:flex;gap:20px;flex-wrap:wrap;margin-top:24px;font-size:.84rem;color:var(--lavender)}
.detail-links a:hover{text-decoration:underline;text-underline-offset:4px}
@keyframes detail-backdrop-in{from{opacity:0}to{opacity:1}}
@keyframes detail-backdrop-out{from{opacity:1}to{opacity:0}}
@media(max-width:620px){#movie-detail-dialog{width:calc(100% - 24px)}.movie-detail-panel{border-radius:22px}.detail-body{grid-template-columns:1fr;gap:24px;padding:28px 24px;max-height:calc(100dvh - 48px)}.detail-poster{width:min(180px,65%);margin-inline:auto}.detail-eyebrow{margin-right:0}.detail-facts{gap:14px}#movie-detail-title{margin-right:0}.detail-close{top:10px;right:10px}}
@media(prefers-reduced-motion:reduce){.movie-select .poster{transition:none}.movie-select .poster:hover{transform:none}#movie-detail-dialog::backdrop,#movie-detail-dialog[data-closing]::backdrop{animation-duration:.01s}}

/* Discovery preferences stay close to the shortlist and apply to every new batch. */
.app.on-shortlist{width:min(1760px,var(--shortlist-width),100%)}
.header-actions{display:flex;align-items:center;justify-content:flex-end;gap:24px;margin-left:auto}
.preference-controls{display:flex;gap:10px;flex-wrap:wrap;flex-shrink:0;padding:0 34px 16px}
.preference-controls .plain-button{border:1px solid var(--line);border-radius:999px;padding:8px 15px;min-height:38px;font-size:.82rem;white-space:nowrap}
.saved-grid:has(>.movie-tile:only-child){grid-template-columns:minmax(0,320px);justify-content:center}
.movie-select.detail-source .poster{opacity:0}

/* A fresh wall of movie art grows with the available screen space. */
.title-screen{overflow:hidden;isolation:isolate;padding:24px}
.title-gallery{position:absolute;z-index:-2;inset:-35px;display:grid;gap:18px;align-content:center;transform:rotate(-7deg) scale(1.08);pointer-events:none}
.title-gallery:after{content:'';position:absolute;inset:-10%;background:radial-gradient(ellipse at center,#10152520,#10152580 60%,#101525cc),linear-gradient(#14182930,#14182975)}
.title-poster{min-width:0;animation:poster-wall-in .8s var(--ease) both;animation-delay:var(--poster-delay)}
.title-poster .poster{max-height:none;padding:0;border:0;box-shadow:0 10px 24px #0005}
.title-poster .poster-image{object-fit:cover}
.title-hero{display:flex;flex-direction:column;align-items:center;gap:34px;padding:44px 48px;border:1px solid #ffffff20;border-radius:30px;background:#151a2ce0;backdrop-filter:blur(16px);box-shadow:0 22px 80px #080b1aaa;max-width:100%}
.title-hero h1{font-size:clamp(2.8rem,5vw,4.7rem)}
.title-hero .title-brand{flex-wrap:nowrap}
@keyframes poster-wall-in{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:none}}

/* Shared poster travels independently so its artwork does not stretch with the panel. */
.movie-detail-panel{transform-origin:0 0}
.detail-shared-poster{position:fixed;pointer-events:none;z-index:4;transform-origin:0 0;border-radius:12px;overflow:hidden;box-shadow:0 12px 32px #0005}
.detail-shared-poster .poster{width:100%;height:100%;max-height:none;aspect-ratio:auto;padding:0;border:0;border-radius:0}
.detail-shared-poster .poster-image{object-fit:cover}
.detail-trailer{grid-column:1/-1;min-width:0}
.detail-trailer h3{font-size:1rem;font-weight:500;margin:0 0 14px}
.trailer-player{aspect-ratio:16/9;min-height:200px;width:100%;background:#080b12;border-radius:16px;overflow:hidden}
.trailer-preview{position:relative;display:block;width:100%;height:100%;border:0;padding:0;background:#080b12}
.trailer-preview img{width:100%;height:100%;object-fit:cover;opacity:.7;display:block}
.trailer-play{position:absolute;inset:0;display:grid;place-items:center;font-size:3rem;text-shadow:0 4px 24px #000}
.trailer-label{position:absolute;bottom:20px;left:0;right:0;font-size:1rem;font-weight:500;text-shadow:0 2px 6px #000}
.trailer-preview:hover img{opacity:.9}
.trailer-preview:active:not(:disabled){transform:none}
.trailer-player iframe{display:block;border:0;width:100%;height:100%;min-height:200px}
.trailer-caption{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:12px;color:var(--muted);font-size:.8rem;line-height:1.5}
.trailer-caption a{color:var(--lavender);white-space:nowrap}
@media(max-width:800px){.preference-controls{padding-left:26px;padding-right:26px}}
@media(max-width:560px){.header-actions{gap:16px}.header-actions .plain-button{font-size:.85rem}.preference-controls{padding:0 18px 12px;gap:7px}.preference-controls .plain-button{font-size:.74rem;padding:7px 10px;min-height:36px}.title-hero{padding:30px 20px;gap:28px;border-radius:24px}.title-hero h1{font-size:clamp(2rem,9vw,3rem)}.title-gallery{gap:10px}.title-hero .title-brand{gap:10px}.title-hero .title-brand img{width:36px}.title-hero .button{min-width:180px}.detail-body{padding-top:36px}.detail-trailer{grid-column:1}.trailer-caption a{min-height:40px;display:inline-flex;align-items:center}}
@media(prefers-reduced-motion:reduce){.title-poster{animation:none}.detail-shared-poster{display:none}}

/* The first real swipe teaches the gesture, without adding action buttons. */
.view.swipe-learning{position:relative;isolation:isolate}
.view.swipe-learning:before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:#080c187a;opacity:1;transition:opacity .44s ease}
.view.lesson-complete:before{opacity:0}
.app-header{transition:opacity .3s ease}
.app.swipe-learning .app-header{opacity:.38}
.swipe-learning .view-head{min-height:48px;padding-top:4px;padding-bottom:4px}
.swipe-learning .deck-shell,.swipe-walkthrough{position:relative;z-index:3}
.swipe-learning .deck-shell{max-width:400px}
.swipe-learning .deck-shadow{opacity:0}
.swipe-learning .genre-card,.swipe-learning .swipe-card>.poster{box-shadow:0 0 0 2px #d5caff7a,0 20px 55px #05081766}
.swipe-learning .genre-card{height:clamp(220px,calc(100dvh - 465px),420px);min-height:0;padding:34px}
.swipe-learning .genre-card h2{font-size:3.7rem}
.swipe-learning .movie-deck .poster-image{max-height:clamp(190px,calc(100dvh - 470px),390px)}
.swipe-learning .movie-deck .movie-info{text-align:center}
.swipe-learning .movie-deck .movie-info .meta,.swipe-learning .movie-deck .movie-rating,.swipe-learning .movie-deck .description{display:none}
.swipe-learning .genre-selection,.swipe-learning .swipe-hint{display:none}
.swipe-walkthrough{flex:none;width:min(100%,560px);margin:0 auto 22px;text-align:center;overflow:hidden;--swipe-progress:0}
.swipe-walkthrough h2{font-size:clamp(1.8rem,3vw,2.5rem);line-height:1.2;letter-spacing:-.035em;font-weight:500;margin:0 0 12px}
.swipe-walkthrough p{font-size:1.15rem;line-height:1.5;color:#e1ddec;min-height:28px}
.walkthrough-directions{display:flex;justify-content:space-between;gap:40px;margin-top:20px}
.walkthrough-direction{position:relative;flex:1;display:flex;align-items:center;justify-content:center;gap:16px;padding:0 0 11px;font-size:1.22rem;color:#c0b9d6;transition:color .15s ease}
.walkthrough-arrow{font-size:2rem;line-height:1}
.walkthrough-direction:before,.walkthrough-direction:after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;border-radius:2px;background:#d5caff24}
.walkthrough-direction:after{background:var(--lavender);transform:scaleX(0);transform-origin:center right}
.walkthrough-direction[data-direction="right"]:after{transform-origin:center left}
.swipe-walkthrough[data-direction="left"] [data-direction="left"],.swipe-walkthrough[data-direction="right"] [data-direction="right"]{color:#fff}
.swipe-walkthrough[data-direction="left"] [data-direction="left"]:after,.swipe-walkthrough[data-direction="right"] [data-direction="right"]:after{transform:scaleX(var(--swipe-progress))}
.swipe-walkthrough.is-ready #swipe-lesson-status{color:#ddffd9}
.swipe-walkthrough.is-ready .walkthrough-direction:after{background:#ddffd9}

/* A looping press, drag and release demo never casts a vote. */
.lesson-demo{--demo-distance:clamp(24px,5vw,58px);transform-origin:50% 45%;animation:lesson-card-drag 6.4s 1s ease-in-out infinite}
.swipe-gesture-guide{position:absolute;left:50%;top:min(42%,180px);width:76px;height:92px;z-index:4;transform:translate(-30%,-5%);pointer-events:none;opacity:0}
.swipe-gesture-guide svg{position:relative;width:100%;height:100%;filter:drop-shadow(0 5px 8px #100b2199)}
.gesture-contact{position:absolute;left:47%;top:16%;width:72px;height:72px;border:3px solid #ece4ff;border-radius:50%;transform:translate(-50%,-50%);background:#d4caff22;opacity:0}
.lesson-demo .swipe-gesture-guide{animation:lesson-hand 6.4s 1s ease-in-out infinite}
.lesson-demo .gesture-contact{animation:lesson-contact 6.4s 1s ease-out infinite}
.is-demonstrating [data-direction="left"]{animation:lesson-choice-left 6.4s 1s ease-in-out infinite}
.is-demonstrating [data-direction="right"]{animation:lesson-choice-right 6.4s 1s ease-in-out infinite}
.is-demonstrating [data-direction="left"]:after{animation:lesson-progress-left 6.4s 1s ease-in-out infinite}
.is-demonstrating [data-direction="right"]:after{animation:lesson-progress-right 6.4s 1s ease-in-out infinite}
@keyframes lesson-card-drag{0%,10%,44%,56%,94%,100%{transform:translateX(0) rotate(0)}26%,32%{transform:translateX(calc(-1 * var(--demo-distance))) rotate(-7deg)}74%,80%{transform:translateX(var(--demo-distance)) rotate(7deg)}}
@keyframes lesson-hand{0%,5%,39%,50%,53%,87%,100%{opacity:0;transform:translate(-30%,-5%) scale(1)}10%,58%{opacity:1;transform:translate(-30%,-5%) scale(1)}15%,28%,63%,76%{opacity:1;transform:translate(-30%,-5%) scale(.88)}34%,82%{opacity:.8;transform:translate(-30%,-12%) scale(1.08)}}
@keyframes lesson-contact{0%,8%,24%,56%,72%,100%{opacity:0;transform:translate(-50%,-50%) scale(.45)}12%,60%{opacity:.9;transform:translate(-50%,-50%) scale(.55)}23%,71%{opacity:0;transform:translate(-50%,-50%) scale(1.6)}}
@keyframes lesson-choice-left{0%,12%,44%,100%{color:#c0b9d6}26%,34%{color:#fff;text-shadow:0 0 24px #d4caff90}}
@keyframes lesson-choice-right{0%,60%,92%,100%{color:#c0b9d6}74%,82%{color:#fff;text-shadow:0 0 24px #d4caff90}}
@keyframes lesson-progress-left{0%,12%,44%,100%{transform:scaleX(0)}26%,34%{transform:scaleX(1)}}
@keyframes lesson-progress-right{0%,60%,92%,100%{transform:scaleX(0)}74%,82%{transform:scaleX(1)}}
@media(max-width:560px){.swipe-walkthrough{max-width:350px}.swipe-walkthrough h2{font-size:1.8rem}.swipe-walkthrough p{font-size:1rem;min-height:24px}.walkthrough-directions{gap:24px;margin-top:16px}.walkthrough-direction{font-size:1.05rem;gap:12px}.walkthrough-arrow{font-size:1.8rem}.swipe-learning .deck-shell{max-width:min(310px,calc(100% - 40px))}.swipe-learning .genre-card{height:clamp(215px,calc(100dvh - 430px),370px);padding:28px}.swipe-learning .genre-card h2{font-size:3.2rem}.swipe-learning .movie-deck .poster-image{max-height:clamp(180px,calc(100dvh - 470px),345px)}.lesson-demo{--demo-distance:24px}.swipe-gesture-guide{width:66px;height:80px}}
@media(max-height:670px){.swipe-learning .deck-region{padding-top:8px}.swipe-walkthrough h2{font-size:1.65rem;margin-bottom:8px}.swipe-walkthrough p{font-size:1rem}.walkthrough-directions{margin-top:12px}.swipe-learning .genre-card{height:clamp(175px,calc(100dvh - 430px),240px)}}
@media(prefers-reduced-motion:reduce){.view.swipe-learning:before,.app-header,.walkthrough-direction{transition:none}.lesson-demo,.lesson-demo .swipe-gesture-guide,.lesson-demo .gesture-contact,.is-demonstrating .walkthrough-direction,.is-demonstrating .walkthrough-direction:after{animation:none}.lesson-demo .swipe-gesture-guide{opacity:.85}}