@font-face{font-family:CinemaManrope;src:url('./manrope.ttf') format('truetype');font-weight:200 800;font-display:swap}
/* Everything is scoped to access. Company workspace and security dialogs keep their styles. */
.cinema-page:has(.login-cinema:not([hidden])){background:#18191b}
.cinema-page:has(.login-cinema:not([hidden]))>header,.cinema-page:has(.login-cinema:not([hidden]))>footer{display:none}
.cinema-page:has(.login-cinema:not([hidden]))>main{max-width:none;margin:0;padding:0}
.login-cinema{--muted:#aaa6a1;--line:#343538;--text:#eeeae5;--orange:#ff894c;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;min-height:100svh;align-items:start;padding:0;font:15px/1.65 CinemaManrope,Manrope,sans-serif;color:var(--text);font-synthesis:none}
.cinema-skip{position:fixed;top:-100px;left:15px;z-index:30;background:#161719;padding:12px}.cinema-skip:focus{top:12px}
.cinema-page:not(:has(.login-cinema:not([hidden])))>.cinema-skip{display:none}
.login-cinema [hidden]{display:none!important}.login-cinema a{text-decoration:none}.login-cinema button,.login-cinema a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}.login-cinema button:focus-visible,.login-cinema a:focus-visible,.login-cinema input:focus-visible{outline:2px solid #ffae7b;outline-offset:3px}
.login-cinema .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.login-cinema .showcase{position:sticky;top:0;height:100svh;height:100dvh;min-width:0;isolation:isolate;overflow:hidden;background:#141110;border-right:1px solid #ffffff12}
.login-cinema .gallery-stage,.login-cinema .screen-stack,.login-cinema .example{position:absolute;inset:0;width:100%;height:100%;margin:0}
.login-cinema .example{opacity:0;visibility:hidden;transition:opacity .65s ease,visibility .65s;pointer-events:none}.login-cinema .example.is-active{opacity:1;visibility:visible}
/* A playing video must paint above its poster, including in the in-app browser. */
.login-cinema .example-poster,.login-cinema .example video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%}.login-cinema .example-poster{z-index:0}.login-cinema .example video{z-index:1;opacity:0}.login-cinema .example.is-playing video{opacity:1}.login-cinema .example.is-playing .example-poster{opacity:0}
.login-cinema .showcase::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,#0b08086b,transparent 23%,transparent 52%,#0b0808ad 82%,#0b0808e8)}
.login-cinema .studio-header{position:absolute;z-index:2;top:32px;left:40px;right:40px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0;border:0;margin:0;max-width:none}
.login-cinema .wordmark{display:flex;align-items:center;gap:10px;font-weight:700;font-size:23px;letter-spacing:-.8px;text-shadow:0 2px 14px #0005}.login-cinema .brand-sun{position:relative;flex:none;width:24px;height:24px;background:linear-gradient(145deg,#ffbd7f,#ff782e);border:1px solid #ffc28f;border-radius:50%}.login-cinema .brand-sun::after{content:'';position:absolute;inset:5px;border:1px solid #ffe0bf;border-radius:50%}.login-cinema .studio-label{display:flex;align-items:center;gap:7px;font-size:8px;letter-spacing:1.4px;color:#eee1d5}.login-cinema .studio-label>span{height:4px;width:4px;border-radius:50%;background:#edbd96}
.login-cinema .showcase-overlay{position:absolute;z-index:2;bottom:24px;left:40px;right:40px}.login-cinema .gallery-caption>span{font-size:9px;letter-spacing:2px;color:#ecc4a6}.login-cinema .gallery-caption p{max-width:470px;font-size:clamp(28px,3.2vw,48px);font-weight:500;line-height:1.12;letter-spacing:-1.7px;margin:14px 0 30px;text-wrap:balance;text-shadow:0 2px 20px #0004}
.login-cinema .example-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;width:100%}.login-cinema .example-picker button{position:relative;display:flex;align-items:center;gap:7px;text-align:left;background:none;border:0;border-radius:0;padding:10px 0 14px;color:#c3b5ab;font-size:11px;font-weight:500;min-height:44px}.login-cinema .example-picker button>span:first-child{font-size:9px;color:#c5a78e}.login-cinema .example-picker button[aria-pressed=true]{color:#fff1e3}.login-cinema .example-picker button[aria-pressed=true]>span:first-child{color:#ffb67f}.login-cinema .example-picker i{position:absolute;height:2px;bottom:0;left:0;width:100%;background:#ffffff38;overflow:hidden}.login-cinema .example-picker b{display:block;width:100%;height:100%;background:#ffa362;transform:scaleX(0);transform-origin:left}.login-cinema .example-picker button:not([aria-pressed=true]) b{opacity:0}
.login-cinema .showcase-bottom{margin-top:12px;display:flex;align-items:center;justify-content:space-between;gap:15px;width:100%;color:#d0bfae;font-size:9px}.login-cinema .motion-toggle{display:flex;align-items:center;gap:7px;border:0;background:none;color:#eddfd2;padding:8px 0 8px 12px;font-size:10px;min-height:44px;font-weight:500}.login-cinema .motion-toggle>span:first-child{font-size:13px}
.login-cinema .cinema-region{display:flex;flex-direction:column;align-items:center;min-width:0;min-height:100svh;padding:28px 60px 22px;background:radial-gradient(ellipse at 90% 0%,#ffffff03,transparent 65%),#18191b}
.login-cinema .cinema-region-header{display:flex;align-items:center;justify-content:space-between;gap:15px;width:100%;max-width:430px;margin-bottom:32px;font-size:8px;letter-spacing:1.3px;color:#aaa6a0}.login-cinema .cinema-region-header span{font-size:9px;letter-spacing:0;color:#89857e}
.login-cinema .cinema-form-wrap{max-width:380px;width:100%;min-width:0;margin:auto 0;padding-bottom:16px;outline:none}.login-cinema .panel{width:100%;padding:0;border:0;border-radius:0;background:none;min-width:0}.login-cinema h2{font-size:34px;line-height:1.15;letter-spacing:-1.5px;font-weight:550;margin:0 0 12px;overflow-wrap:anywhere}.login-cinema .eyebrow{font-size:8px;font-weight:600;letter-spacing:1.8px;color:#c49d7e;margin:0 0 12px}.login-cinema .account-lede{color:#a6a29d;font-size:12px;line-height:1.7;margin:0 0 25px}
.login-cinema .cinema-account-switch{display:flex;padding:4px;background:#222326;border:1px solid #303134;border-radius:9px;margin-bottom:32px}.login-cinema .cinema-account-switch a{display:flex;align-items:center;justify-content:center;flex:1;min-width:0;min-height:40px;border-radius:6px;color:#aaa6a1;font-size:11px;font-weight:600}.login-cinema .cinema-account-switch a[aria-current]{background:#383839;color:#fff2e6;box-shadow:0 1px 3px #0003}
.login-cinema .account-tabs{display:flex;gap:25px;border:0;border-bottom:1px solid #38383a;border-radius:0;padding:0;margin:0 0 22px}.login-cinema .account-tabs button{flex:initial;min-height:44px;font-size:12px;background:none;border:0;border-bottom:2px solid transparent;border-radius:0;padding:0 0 12px;color:#a5a19b;font-weight:500}.login-cinema .account-tabs button[aria-pressed=true]{color:#f2e6db;border-bottom-color:#eea36f}
.login-cinema .google-button{display:flex;align-items:center;justify-content:center;gap:11px;min-height:48px;width:100%;font-size:12px;font-weight:650;background:#eeece7;color:#35302b;border:1px solid #eeece7;border-radius:8px;padding:11px 8px}.login-cinema .google-symbol{font-size:17px}.login-cinema .account-divider{gap:14px;margin:19px 0;color:#97938d;font-size:10px}
.login-cinema label,.login-cinema #credential-fields label{display:block;margin:17px 0;color:#c7c2bb;font-size:11px;font-weight:500}.login-cinema input{min-width:0;width:100%;min-height:46px;background:#202123;border:1px solid #414143;border-radius:7px;padding:12px 14px;font-size:16px;color:#eee8df;margin-top:8px}.login-cinema input::placeholder{color:#a19a90}.login-cinema input[readonly]{color:#d6c7b5}
.login-cinema button[type=submit],.login-cinema #retry{display:flex;align-items:center;justify-content:center;gap:15px;width:100%;min-height:49px;margin-top:22px;background:#ff894c;border:1px solid #ff894c;border-radius:8px;color:#2a1408;font-size:12px;font-weight:750;box-shadow:0 4px 18px #eb6e2010;padding:10px}.login-cinema .text-button{font-size:11px;min-height:44px;color:#d8b69d}
.login-cinema .small{font-size:11px;line-height:1.7;color:#aaa6a1;margin-top:18px;overflow-wrap:anywhere}.login-cinema .small a{color:#e2bfa0;text-decoration:underline;text-underline-offset:3px}.login-cinema .account-boundary{font-size:10px}.login-cinema .company-alternative{padding-top:20px;font-size:11px;margin-top:24px}.login-cinema .service-status{font-size:11px;line-height:1.6;padding:12px;background:#352b23;border:1px solid #715137;color:#e6c2a3;border-radius:7px;margin-bottom:18px}
.login-cinema .cinema-region-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;max-width:430px;width:100%;margin:20px 0 0;padding:18px 0 0;border-top:1px solid #343436;color:#aaa6a1;font-size:10px;flex-wrap:wrap}.login-cinema .request-code{font-size:clamp(16px,3vw,32px);letter-spacing:.1em;overflow-wrap:anywhere}
.cinema-page:has(.login-cinema:not([hidden])) #notice{position:relative;top:0;z-index:5;width:50%;margin:0 0 0 auto;border-radius:0;font-size:12px;padding:12px 20px}
@media(max-width:1100px) and (min-width:801px){.login-cinema .cinema-region{padding-left:36px;padding-right:36px}.login-cinema .studio-header,.login-cinema .showcase-overlay{left:24px;right:24px}.login-cinema .studio-label{display:none}.login-cinema h2{font-size:29px}.login-cinema .example-picker{gap:10px}.login-cinema .example-picker button{font-size:9px}}
/* Deliberately keep equal columns on mobile, matching the approved preview. */
@media(max-width:800px){
 .login-cinema .example[data-example=pyro] .example-poster,.login-cinema .example[data-example=pyro] video{object-position:68% 50%}
 .login-cinema .studio-header{top:24px;left:16px;right:16px}.login-cinema .wordmark{gap:7px;font-size:18px;letter-spacing:-.6px}.login-cinema .brand-sun{width:19px;height:19px}.login-cinema .brand-sun::after{inset:4px}.login-cinema .studio-label{display:none}
 .login-cinema .showcase-overlay{left:16px;right:16px;bottom:16px}.login-cinema .gallery-caption>span{font-size:8px;letter-spacing:1px}.login-cinema .gallery-caption p{font-size:28px;letter-spacing:-1px;line-height:1.2;margin:10px 0 18px}.login-cinema .example-picker{gap:7px}.login-cinema .example-picker button{justify-content:center;gap:0;font-size:12px;min-height:44px}.login-cinema .example-picker button>span:first-child{font-size:12px}.login-cinema .picker-name{display:none}.login-cinema .showcase-bottom{flex-direction:column-reverse;align-items:flex-start;gap:4px;margin-top:8px;font-size:9px;line-height:1.6}.login-cinema .motion-toggle{padding:4px 6px 4px 0;font-size:11px;min-height:44px}
 .login-cinema .cinema-region{padding:24px 18px;min-height:100dvh}.login-cinema .cinema-region-header{flex-direction:column;align-items:flex-start;gap:7px;margin-bottom:26px;font-size:8px}.login-cinema .cinema-form-wrap{padding-bottom:0}.login-cinema .cinema-account-switch{margin-bottom:25px;padding:3px}.login-cinema .cinema-account-switch a{font-size:10px;min-height:44px}
 .login-cinema h2{font-size:29px;letter-spacing:-1px}.login-cinema .eyebrow{font-size:8px;line-height:1.5;letter-spacing:1px}.login-cinema .account-lede{font-size:12px;line-height:1.6;margin-bottom:22px}.login-cinema .account-tabs{gap:8px;margin-bottom:18px;justify-content:space-between}.login-cinema .account-tabs button{flex:1;font-size:11px;line-height:1.5;padding:0 0 8px;min-height:48px}.login-cinema .google-button{gap:7px;font-size:11px;line-height:1.4}.login-cinema .account-divider{gap:6px;font-size:10px;margin:18px 0}.login-cinema .account-divider span{text-align:center}.login-cinema label,.login-cinema #credential-fields label{font-size:12px;line-height:1.5}.login-cinema input,.login-cinema #credential-fields input{font-size:16px;padding:11px 9px;min-height:48px}.login-cinema button[type=submit]{font-size:12px;line-height:1.5;min-height:50px;gap:6px}.login-cinema button[type=submit]>span{display:none}.login-cinema .cinema-region-footer{align-items:flex-start;flex-direction:column;font-size:10px;line-height:1.6;gap:10px;margin-top:26px}.login-cinema .service-status{padding:10px;overflow-wrap:anywhere}.cinema-page:has(.login-cinema:not([hidden])) #notice{padding:10px;font-size:11px}
}
@media(max-width:400px){.login-cinema .studio-header{left:12px;right:12px}.login-cinema .wordmark{font-size:16px;gap:5px}.login-cinema .brand-sun{width:17px;height:17px}.login-cinema .showcase-overlay{left:12px;right:12px}.login-cinema .gallery-caption p{font-size:23px;letter-spacing:-.7px}.login-cinema .gallery-caption>span{font-size:7px}.login-cinema .cinema-region{padding-left:12px;padding-right:12px}.login-cinema .cinema-account-switch{flex-direction:column}.login-cinema .cinema-account-switch a{font-size:11px}.login-cinema h2{font-size:25px}.login-cinema .google-button{font-size:10px;padding:10px 5px;gap:5px}.login-cinema .example-picker{gap:4px}}
@media(prefers-reduced-motion:reduce){.login-cinema .example{transition:none}}