/* Phase 1: homepage/sign-in and Mijn films dashboard only.
   Existing layout metrics, content, brand colours and control order stay intact.
   Reusable tokens are local: no :root or unscoped component overrides. */
:is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage){
 --premium-accent:#4966ff;--premium-violet:#8055ff;--premium-surface:#151b2a;
 --premium-border:#7287bf3d;--premium-text:#fff;--premium-muted:#a4aec2;
 --premium-radius:12px;--premium-motion:180ms;
 font-family:Inter,'DM Sans',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
:is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage) .cinema-topbar{
 background:#0e1420f7;border-color:var(--premium-border);box-shadow:0 4px 20px #0003;backdrop-filter:none;
}
:is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage) button:not(.cinema-brand):not(.cinema-movie-cover):not(.cinema-new-movie),
:is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage) .social-login{
 font-family:inherit;font-weight:600;border-radius:var(--premium-radius);
 background:#1c2435;border-color:var(--premium-border);color:var(--premium-text);
 box-shadow:0 2px 6px #0003;
 transition:background-color var(--premium-motion),border-color var(--premium-motion),box-shadow var(--premium-motion),color var(--premium-motion);
}
:is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage) button.primary{
 background:linear-gradient(110deg,var(--premium-accent),var(--premium-violet));border-color:#9ca8ff66;
 box-shadow:0 3px 10px #4966ff22;color:#fff;
}
:is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage) button:not(:disabled):hover,
:is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage) .social-login:hover{
 background:#283249;border-color:#8a9bff8c;box-shadow:0 3px 10px #0003;
}
:is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage) button.primary:not(:disabled):hover{
 background:linear-gradient(110deg,#5873ff,#8f68ff);box-shadow:0 4px 14px #4966ff30;
}
:is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage) button:not(:disabled):active{box-shadow:inset 0 2px 5px #0005}
:is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage) .cinema-topnav button{
 background:transparent;border-color:transparent;box-shadow:none;font-weight:550;
}
:is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage) .cinema-topnav button.active{
 background:#4966ff22;border-color:#8195ff40;color:#fff;box-shadow:none;
}
:is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage) :is(.cinema-composer form,.cinema-auth-card){
 background:var(--premium-surface);border-color:var(--premium-border);box-shadow:0 12px 36px #0004;
}
:is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage) .cinema-movie-cover{
 border-color:var(--premium-border);box-shadow:0 8px 24px #0004;
}
:is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage) .cinema-new-movie{
 background:#141c2c;border-color:var(--premium-border);box-shadow:0 4px 16px #0003;
}
:is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage) :is(input:not([type=radio]):not([type=checkbox]):not([type=file]),textarea,select){
 background:#101725;border-color:var(--premium-border);border-radius:var(--premium-radius);
 box-shadow:inset 0 1px 3px #0003;transition:border-color var(--premium-motion),box-shadow var(--premium-motion);
}
:is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage) .cinema-composer textarea{background:#101725!important}
:is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage) :is(input,textarea,select):focus{
 border-color:var(--premium-accent);outline-color:var(--premium-accent);box-shadow:0 0 0 3px #4966ff26;
}
body.cinema-home-page #app .cinema-shell .cinema-account-panel{
 width:288px;min-width:0;max-width:calc(100vw - 24px);box-sizing:border-box;
 max-height:calc(100dvh - 100px);overflow-y:auto;overscroll-behavior:contain;
 padding:18px;border-radius:18px;background:#192132;border:1px solid #7287bf45;
 box-shadow:0 20px 55px #0008;transform-origin:top right;
}
body.cinema-home-page #app .cinema-shell .cinema-account[open] .cinema-account-panel{animation:premium-account-in 180ms ease-out}
body.cinema-home-page #app .cinema-shell .premium-account-identity{text-align:center;padding:8px 0 18px;border-bottom:1px solid var(--premium-border);margin-bottom:8px}
body.cinema-home-page #app .cinema-shell .premium-account-identity .profile-avatar{
 width:64px;height:64px;margin:0 auto 12px;font-size:22px;border:2px solid #8195ff55;box-shadow:0 0 20px #4966ff26;
}
body.cinema-home-page #app .cinema-shell .premium-account-identity strong{
 padding:0;color:#fff;font-size:16px;line-height:1.5;overflow-wrap:anywhere;
}
body.cinema-home-page #app .cinema-shell .premium-account-email{display:block;font-size:12px;color:var(--premium-muted);line-height:1.6;overflow-wrap:anywhere;margin-top:3px}
body.cinema-home-page #app .cinema-shell .cinema-account-panel button{
 display:flex;align-items:center;gap:12px;background:transparent;border:0;box-shadow:none;
 font-size:14px;font-weight:500;line-height:1.5;white-space:normal;overflow-wrap:anywhere;
}
body.cinema-home-page #app .cinema-shell .cinema-account-panel button:hover{background:#4966ff14;box-shadow:none}
body.cinema-home-page #app .cinema-shell .premium-account-icon{width:19px;height:19px;flex:none;color:var(--premium-muted)}
body.cinema-home-page #app .cinema-shell .cinema-account-panel [data-cloud-logout]{color:#eea0a9}
body.cinema-home-page #app .cinema-shell .cinema-account-panel [data-cloud-logout] svg{color:inherit}
body.cinema-home-page #app .cinema-shell .cinema-account-existing{border-color:var(--premium-border)}
body.cinema-home-page #app .cinema-shell .cinema-account summary:focus-visible{outline:2px solid var(--premium-accent);outline-offset:4px;border-radius:24px}
@keyframes premium-account-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){
 :is(body.cinema-home-page #app .cinema-shell,#app .cinema-auth-stage) *{transition:none!important;animation:none!important}
}