/* JohnFlix 0.2 additive theme: retains the layout approved in the local demo. */
:root{--red:#e3293f;--red-strong:#bc0e25}
.brand-name{font-size:19px;letter-spacing:.008em;font-weight:800}.brand-name strong{color:#f22941}.brand-mark{display:grid;place-items:center;width:27px;height:31px;transform:none;font-weight:1000;font-size:33px;line-height:1;color:#e72640;text-shadow:0 5px 18px #b51130aa}.brand-mark span,.brand-mark span:nth-child(1),.brand-mark span:nth-child(2),.brand-mark span:nth-child(3){display:none}
.jf-splash{position:fixed;inset:0;z-index:500;background:#030305;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:21px;transition:opacity .55s ease,visibility .55s ease}.jf-splash.out{opacity:0;visibility:hidden;pointer-events:none}.jf-splash-logo{display:flex;align-items:center;gap:17px;opacity:0;animation:jf-appear .9s .28s both}.jf-splash-logo>span{font-size:clamp(110px,19vw,235px);font-weight:1000;line-height:.9;font-style:italic;letter-spacing:-.14em;color:#ed1838;text-shadow:0 8px 65px #bc0c25b8;animation:jf-red-glow 2.3s ease-in-out both}.jf-splash-logo strong{font-size:clamp(40px,8vw,100px);letter-spacing:-.075em;white-space:nowrap}.jf-splash-logo strong span{color:#eb1b37}.jf-splash small{letter-spacing:.3em;color:#9c9ca2;opacity:0;animation:jf-appear .7s .9s forwards;text-transform:uppercase}
@keyframes jf-appear{from{opacity:0;filter:blur(12px);transform:scale(.91)}to{opacity:1;filter:blur(0);transform:scale(1)}}@keyframes jf-red-glow{0%{text-shadow:0 0 0 #eb1b37}45%{text-shadow:0 0 80px #f22645}100%{text-shadow:0 8px 34px #ad112999}}
.jf-login{min-height:100vh;display:grid;place-items:center;padding:90px 20px;background:radial-gradient(ellipse at 70% 30%,#2c1019,#09090c 58%)}.jf-login-card{width:min(430px,100%);padding:40px;background:rgba(18,18,24,.93);border:1px solid #ffffff21;border-radius:20px;box-shadow:0 30px 100px #000a}.jf-login-card h1{font-size:42px;margin:0 0 8px;letter-spacing:-.04em}.jf-login-card h1 span{color:#f03249}.jf-login-card p{font-size:13px;color:#b6b6c0;line-height:1.7;margin-bottom:30px}.jf-login-card label{display:block;margin-bottom:9px;font-weight:700;font-size:12px}.jf-login-card input{width:100%;background:#0a0b11;border:1px solid #ffffff35;color:#fff;padding:15px;border-radius:10px;outline:0}.jf-login-card input:focus{border-color:#f03249}.jf-login-card .btn{width:100%;justify-content:center;margin-top:20px}.jf-login-card .jf-login-error{min-height:20px;color:#ff909e;margin-top:12px}.jf-auth-text{margin-top:18px;font-size:11px;color:#a3a4b0}
.jf-hero-category{position:absolute;z-index:4;top:102px;left:var(--page);color:#ddd;font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:800}.jf-live-tag{position:absolute;top:70px;left:5%;font-weight:700;font-size:10px;letter-spacing:.14em;color:#d8d8df}.jf-rewatch{margin-top:14px;background:#282831;color:#f7f7f7;border:1px solid #ffffff28;padding:10px 16px;border-radius:8px;font-weight:700}.jf-series-section{margin-top:25px;padding-top:22px;border-top:1px solid #ffffff23}.jf-series-section .episode-button{display:flex;align-items:center;gap:12px;padding:13px 16px;border-radius:10px;background:#24232d;font-weight:700;color:#fff}.jf-series-section .episode-button:hover{background:#373440}.jf-episodes{display:grid;gap:10px;margin-top:15px}.jf-episode{display:grid;grid-template-columns:112px minmax(0,1fr);gap:13px;padding:10px;background:#ffffff0b;border-radius:10px}.jf-episode img{width:112px;height:65px;object-fit:cover;border-radius:5px;background:#292833}.jf-episode h4{margin:0 0 5px}.jf-episode p{margin:0;font-size:11px;color:#b9b8c1}.jf-episode .bar{height:3px;background:#4a4650;margin-top:8px}.jf-episode .bar span{display:block;background:#e92841;height:100%}
.jf-profile-photo{width:100%;height:100%;object-fit:cover;border-radius:inherit}.jf-connected-pill{color:#c6c3ca;border:1px solid #ffffff29;border-radius:20px;padding:6px 11px;font-size:10px}.tv-mode .overlay-screen:not(:has(.player-screen)){position:fixed;inset:0;padding:0;background:#0a0b10}.tv-mode .detail-sheet,.tv-mode .profile-dialog,.tv-mode .settings-dialog,.tv-mode .small-dialog,.tv-mode .notification-drawer{border-radius:0;width:100%;max-width:none;max-height:none;height:100vh;overflow-y:auto;margin:0;padding-top:65px}.tv-mode .overlay-close{position:fixed;z-index:20}.tv-mode button:focus-visible{outline:3px solid #fff;outline-offset:4px;box-shadow:0 0 0 6px #dd2540b8}.tv-mode .nav-shell{z-index:180}.tv-mode .channel-screen .player-topbar{padding-top:95px}.tv-mode .tv-layout{display:none}.tv-mode .player-screen{position:fixed;z-index:200;inset:0}.tv-mode .player-close{border-radius:8px;background:#111a;padding:10px}
@media(max-width:540px){.jf-splash-logo{gap:9px}.jf-splash-logo>span{font-size:95px}.jf-splash-logo strong{font-size:37px}.jf-login-card{padding:28px}.brand-name{font-size:15px}}
@media(prefers-reduced-motion:reduce){.jf-splash-logo,.jf-splash-logo>span,.jf-splash small{animation:none;opacity:1}.jf-splash{transition:none}}

.jf-player-episodes{position:absolute;right:0;top:0;bottom:0;z-index:22;width:min(510px,95vw);background:#111219f7;box-shadow:-25px 0 80px #000d;padding:40px 27px;overflow-y:auto;animation:slide-in-right .28s ease}.jf-player-episodes[hidden]{display:none}.jf-player-episodes .drawer-heading{display:flex;justify-content:space-between;align-items:center;padding-bottom:20px}.jf-player-episodes label{font-size:12px;color:#ccc;display:block;margin:8px 0}.jf-player-episodes select{width:100%;background:#20212a;border:1px solid #ffffff30;color:white;border-radius:8px;padding:10px}.jf-player-episodes .jf-episode{grid-template-columns:90px minmax(0,1fr)}.jf-player-episodes .jf-episode img{width:90px;height:57px}

/* v0.3 production identity and accessibility additions */
.jf-brand-mark{width:25px;height:34px;object-fit:contain;display:block}.jf-brand-word{width:105px;height:26px;object-fit:contain;display:block}
.jf-splash-approved{flex-direction:column;gap:0;animation:jf-appear .7s .4s both;justify-content:center}
.jf-splash-approved .jf-splash-j{width:clamp(120px,15vw,210px);height:clamp(145px,18vw,240px);object-fit:contain;filter:drop-shadow(0 8px 30px #9d001d80);animation:jf-logo-assemble 1.25s .18s both}
.jf-splash-approved .jf-splash-word{width:clamp(250px,31vw,420px);max-height:96px;object-fit:contain;animation:jf-appear .65s 1.28s both}
.jf-light-streak{position:absolute;top:5%;bottom:25%;width:2px;background:linear-gradient(180deg,transparent,#fa3156,transparent);box-shadow:0 0 16px #ef2f45;opacity:0;animation:jf-beam 1.2s both}
.jf-light-streak.s1{left:41%;animation-delay:.12s}.jf-light-streak.s2{left:55%;animation-delay:.3s}.jf-light-streak.s3{left:65%;animation-delay:.48s}
@keyframes jf-beam{0%{transform:translateY(-60%) scaleY(.4);opacity:0}30%{opacity:1}85%{opacity:.65}100%{transform:translateY(10%) scaleY(1);opacity:0}}
@keyframes jf-logo-assemble{0%{transform:scale(.84) rotateY(24deg);opacity:0;filter:blur(7px)}50%{opacity:1}100%{transform:scale(1);opacity:1;filter:drop-shadow(0 7px 24px #97021788)}}
.jf-replay-opening{position:fixed;bottom:24px;right:24px;z-index:501;background:#c11932;color:#fff;border:1px solid #f66;border-radius:25px;padding:12px 19px;font-weight:750;cursor:pointer}
.jf-login-logo{display:block;width:min(260px,85%);height:auto;margin:0 auto 10px}.jf-remember{display:flex!important;align-items:center;gap:9px;font-weight:500!important;color:#bcbcc7;font-size:12px!important;margin:14px 0 0}.jf-remember input{width:auto!important;accent-color:#e92d48}
.jf-no-tv{padding:140px 6%;min-height:80vh}.jf-no-tv p{max-width:520px;color:#b9b9c6;line-height:1.7}.jf-logout{border:1px solid #ffffff2a;border-radius:999px}
@media(max-width:700px){.jf-brand-mark{width:20px}.jf-brand-word{width:87px}.jf-logout{display:flex!important}}
@media(prefers-reduced-motion:reduce){.jf-light-streak{animation:none;display:none}.jf-splash-approved,.jf-splash-approved .jf-splash-j,.jf-splash-approved .jf-splash-word{animation:none;opacity:1}}