@font-face{font-family:"Open Sans";src:url("../fonts/OpenSans-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"Open Sans";src:url("../fonts/OpenSans-Semibold.ttf") format("truetype");font-weight:600 800;font-display:swap}
:root{--navy:#0F172A;--muted:#475569;--lime:#C8F431;--border:#64748B;--error:#B91C1C;--focus:#0284C7}
*{box-sizing:border-box}
body.auth-page{margin:0;background:#F7F8FA;color:var(--navy);font:16px/1.5 "Open Sans",sans-serif}
a{color:inherit;text-underline-offset:4px}
button,input{font:inherit}
button,a,input{touch-action:manipulation}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.skip-link{position:absolute;top:-100px;padding:12px;background:white;z-index:2}
.skip-link:focus{top:8px;left:8px}
.auth-shell{display:grid;grid-template-columns:42% 58%;max-width:1240px;min-height:calc(100svh - 80px);margin:40px auto;background:white;border-radius:16px;overflow:clip;border:1px solid #DCE2EA}
.brand-panel{background:#0B1020;color:#F7F9FC;padding:48px;display:flex;flex-direction:column;justify-content:space-between;gap:64px}
.brand{display:flex;align-items:center;gap:12px;white-space:nowrap;font-size:28px;font-weight:700;line-height:1.2}
.brand b{color:var(--lime);font-weight:700;background:var(--navy);padding:0 2px;border-radius:2px}
.brand-mark{width:36px;height:36px;flex:none}
.mark-base{fill:currentColor}
.mark-accent{fill:var(--lime)}
.brand-message h2{font-size:48px;line-height:1.2;letter-spacing:-1.5px;margin:0 0 20px}
.brand-message p{font-size:20px;margin:0;color:#DCE2EA}
.brand-art{display:flex;align-items:flex-end;justify-content:space-between;font-size:140px;line-height:1;opacity:.9}
.brand-art i{height:8px;background:var(--lime);width:28%;margin-bottom:10px}
.auth-main{padding:40px 48px;display:flex;flex-direction:column;justify-content:center;min-width:0}
.login-content{width:100%;max-width:400px;margin:auto}
.mobile-brand{display:none}
.back-link{display:inline-flex;align-items:center;min-height:48px;margin-bottom:16px;border:0;padding:0;background:none;color:var(--muted);cursor:pointer;text-decoration:none}
h1{font-size:32px;line-height:1.25;letter-spacing:-.6px;margin:0 0 8px;font-weight:700}
.intro{color:var(--muted);margin:0 0 24px}
.providers{display:flex;flex-direction:column;gap:12px}
.provider{display:flex;align-items:center;justify-content:center;gap:12px;min-height:52px;padding:12px 16px;border:1px solid var(--border);border-radius:12px;text-decoration:none;background:white;font-weight:600;text-align:center}
.provider img{width:24px;height:24px;flex:none}
.provider .apple{filter:brightness(0)}
.provider:hover{background:#F2F5F8}
.divider{display:flex;gap:16px;align-items:center;color:var(--muted);font-size:14px;margin:24px 0; text-align:center}
.divider:before,.divider:after{content:"";height:1px;background:#CBD5E1;flex:1}
.field{margin:0 0 16px}
.field label{display:block;font-size:14px;font-weight:600;margin-bottom:6px}
.field input{display:block;width:100%;height:48px;border:1px solid var(--border);border-radius:10px;background:white;color:var(--navy);padding:10px 12px;min-width:0}
.field input::placeholder{color:#64748B}
.field input.input-validation-error,.field input[aria-invalid="true"]{border:2px solid var(--error)}
.field-error{display:block;color:var(--error);font-size:14px;margin-top:4px}
.password-wrap{position:relative}
.password-wrap input{padding-right:80px}
.password-toggle{position:absolute;right:2px;top:0;min-height:48px;min-width:76px;border:0;background:transparent;color:var(--muted);cursor:pointer;border-radius:8px}
[hidden]{display:none!important}
.remember{display:flex;align-items:center;gap:10px;min-height:48px;font-size:14px;color:var(--muted);margin:0 0 12px;cursor:pointer}
.remember input{width:20px;height:20px;accent-color:var(--navy);flex:none}
.primary{border:0;border-radius:12px;width:100%;min-height:52px;padding:12px 16px;color:var(--navy);background:var(--lime);font-weight:700;cursor:pointer}
.primary:hover{background:#BBE52B}
.primary[aria-disabled="true"]{cursor:progress}
.return-note{font-size:14px;color:var(--muted);text-align:center;margin:12px 0 0}
.legal-links{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 24px;margin-top:24px;font-size:14px;color:var(--muted)}
.legal-links a{display:inline-flex;align-items:center;min-height:48px}
.form-error,.mock-notice{padding:12px 16px;border:1px solid var(--error);border-radius:10px;background:#FEF2F2;color:var(--error);margin:0 0 16px;font-size:14px}
.mock-notice{border-color:#92400E;background:#FFF4D6;color:#92400E;margin-top:24px}
@media(max-width:1023px){
 .auth-shell{display:block;max-width:560px;margin:0 auto;min-height:100svh;border:0;border-radius:0}
 .brand-panel{display:none}
 .auth-main{padding:24px;display:block}
 .mobile-brand{display:block;max-width:400px;margin:0 auto 16px}
 .mobile-brand .brand{font-size:24px}
 .mobile-brand .mark-accent{fill:var(--navy)}
 .login-content{margin:0 auto}
}
@media(max-width:359px){.auth-main{padding:20px 16px}.brand{font-size:22px}h1{font-size:28px}}
@media(prefers-reduced-motion:no-preference){button,a{transition:background-color 150ms ease}}
