:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#071322;color:#f4f7fb}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{min-height:100vh}
button,input{font:inherit}
a{color:inherit;text-decoration:none}
.login-layout{display:grid;grid-template-columns:minmax(0,57fr) minmax(420px,43fr);min-height:100vh}
.studio-panel{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:100vh;padding:36px clamp(28px,4vw,72px) 66px;overflow:hidden;background:#07111c url('/assets/broadcaster-studio-hero.png') center center/cover no-repeat;isolation:isolate}
.studio-panel::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,10,19,.27) 0%,rgba(3,10,19,.05) 35%,rgba(2,9,18,.85) 100%),linear-gradient(90deg,rgba(3,10,19,.22),transparent 65%);z-index:-1}
.studio-top,.studio-copy{position:relative}
.brand{display:inline-block;width:max-content;max-width:100%}
.brand img{display:block;width:clamp(210px,18vw,340px);height:auto;max-width:100%;object-fit:contain;filter:drop-shadow(0 7px 18px rgba(0,0,0,.35))}
.studio-copy{max-width:760px}
.studio-kicker,.form-kicker{color:#f0b980;font-size:.76rem;font-weight:800;letter-spacing:.2em}
.studio-copy h1{margin:18px 0 12px;font-size:clamp(3.3rem,5.2vw,6rem);font-weight:800;letter-spacing:-.065em;line-height:1.04;text-wrap:balance;text-shadow:0 5px 25px rgba(0,0,0,.4)}
.studio-copy h1 span{color:#eab888}
.studio-description{margin:0;color:#d7dee7;font-size:clamp(1rem,1.45vw,1.3rem);line-height:1.5}
.studio-features{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0 0;padding:0;list-style:none}
.studio-features li{border:1px solid rgba(232,172,111,.48);border-radius:999px;background:rgba(6,19,32,.66);padding:9px 15px;color:#f6eee7;font-size:.86rem;font-weight:650;backdrop-filter:blur(8px)}
.form-panel{position:relative;display:flex;align-items:center;justify-content:center;min-height:100vh;padding:88px clamp(26px,3.5vw,72px) 66px;background:radial-gradient(circle at 70% 5%,#14253e 0,transparent 45%),#071322}
.privacy-pill{position:absolute;top:38px;right:clamp(26px,3.5vw,72px);display:inline-flex;align-items:center;gap:9px;border:1px solid #9c754e;border-radius:999px;padding:9px 15px;color:#f3d1ac;font-size:.8rem;font-weight:650}
.language-switch{position:absolute;top:38px;left:clamp(26px,3.5vw,72px);display:flex;gap:4px;border:1px solid #52627a;border-radius:999px;padding:3px;background:#102239}
.language-switch a{padding:6px 10px;border-radius:999px;color:#b6c3d3;font-size:.8rem;font-weight:800}
.language-switch a[aria-current="page"]{background:#eab888;color:#071322}
.language-switch a:focus-visible{outline:3px solid #f5ca9d;outline-offset:3px}
.privacy-pill span{color:#efba82;font-size:.62rem}
.form-card{width:min(100%,510px);padding:clamp(26px,3vw,54px);border:1px solid #35465c;border-radius:24px;background:linear-gradient(155deg,rgba(18,32,52,.84),rgba(8,20,36,.86));box-shadow:0 28px 80px rgba(0,0,0,.19)}
.form-kicker{margin:0 0 18px}
.form-card h2{margin:0;color:#fff;font-size:clamp(2rem,2.4vw,2.8rem);font-weight:760;letter-spacing:-.045em;line-height:1.12}
.form-description{margin:16px 0 0;color:#b6c3d3;font-size:1rem;line-height:1.5}
.login-error{margin-top:24px;border:1px solid #a44c5c;border-radius:12px;background:#46212c;padding:12px 15px;color:#ffd5da;font-size:.9rem;line-height:1.45}
.login-form{display:grid;gap:11px;margin-top:38px}
.login-form label{color:#f2f5fa;font-size:.88rem;font-weight:650}
.login-form input{width:100%;min-height:54px;margin-bottom:14px;border:1px solid #52627a;border-radius:10px;outline:none;background:#152238;padding:12px 15px;color:#fff}
.login-form input:hover{border-color:#b38258}
.login-form input:focus{border-color:#f1bb85;box-shadow:0 0 0 3px rgba(238,179,119,.17)}
.login-form button{min-height:56px;margin-top:3px;border:1px solid #e3aa75;border-radius:11px;background:linear-gradient(125deg,#f6c795,#c8895a);color:#161923;font-size:1rem;font-weight:800;cursor:pointer;box-shadow:0 12px 30px rgba(207,137,84,.17)}
.login-form button:hover{filter:brightness(1.08);transform:translateY(-1px)}
.login-form button:focus-visible,.admin-link:focus-visible,.brand:focus-visible{outline:3px solid #f5ca9d;outline-offset:4px}
.admin-link{display:block;width:max-content;margin:27px auto 0;color:#edb782;font-size:.88rem;font-weight:700;text-align:center}
.admin-link:hover{text-decoration:underline}
.form-footer{position:absolute;bottom:22px;left:0;right:0;margin:0;color:#8496aa;font-size:.75rem;text-align:center}
@media(max-width:920px){.login-layout{grid-template-columns:1fr}.studio-panel{min-height:350px;padding:25px 26px 30px;background-position:center 56%}.studio-copy h1{font-size:clamp(2.7rem,8vw,4.5rem)}.studio-kicker{margin:20px 0 0}.studio-features{margin-top:20px}.form-panel{min-height:650px;padding:85px 24px 70px}.privacy-pill{top:22px;right:24px}.language-switch{top:22px;left:24px}}
@media(max-width:520px){.studio-panel{min-height:330px}.brand img{width:220px}.studio-copy h1{font-size:2.65rem}.studio-description{font-size:.94rem}.studio-features{gap:7px}.studio-features li{padding:7px 10px;font-size:.74rem}.form-panel{align-items:flex-start;min-height:0;padding:82px 16px 58px}.privacy-pill{top:18px;right:16px;font-size:.72rem}.language-switch{top:18px;left:16px}.form-card{padding:25px 21px;border-radius:18px}.form-card h2{font-size:2rem}.form-footer{bottom:16px}}