:root{--ink:#111a29;--ink-soft:#1a2639;--gold:#b89b5e;--gold-light:#d7c48e;--paper:#f7f6f2;--muted:#6b7280;--line:#e3e5e8;--danger:#b42318}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink)}
body{background:var(--paper)}
button,input{font:inherit}
.login-shell{min-height:100vh;display:grid;grid-template-columns:minmax(430px,1.08fr) minmax(460px,.92fr)}
.brand-panel{position:relative;overflow:hidden;display:flex;flex-direction:column;padding:42px 54px 34px;color:#fff;background:linear-gradient(145deg,#0c1421 0%,#142035 50%,#1c2a3e 100%)}
.brand-grid{position:absolute;inset:0;opacity:.045;background-image:linear-gradient(rgba(255,255,255,.9) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.9) 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(to bottom,black,transparent 88%)}
.brand-panel:after{content:"";position:absolute;width:420px;height:420px;right:-180px;bottom:-210px;border:1px solid rgba(215,196,142,.2);border-radius:50%;box-shadow:0 0 0 64px rgba(215,196,142,.035),0 0 0 128px rgba(215,196,142,.025)}
.brand-glow{position:absolute;border-radius:50%;filter:blur(2px);pointer-events:none}.brand-glow-one{width:420px;height:420px;left:-210px;top:25%;background:radial-gradient(circle,rgba(184,155,94,.16),transparent 70%)}.brand-glow-two{width:280px;height:280px;right:-80px;top:-100px;background:radial-gradient(circle,rgba(85,119,165,.18),transparent 70%)}
.brand-top{position:relative;z-index:1;display:flex;align-items:center;gap:15px}
.brand-logo{display:block;width:210px;height:76px;object-fit:contain;object-position:left center}
.brand-mark{width:54px;height:54px;display:flex;align-items:center;justify-content:center;gap:4px;border:1px solid rgba(215,196,142,.55);color:var(--gold-light);font-family:Georgia,serif;font-size:20px;letter-spacing:-1px}.brand-mark i{width:1px;height:24px;background:rgba(215,196,142,.55);transform:rotate(24deg)}
.brand-name{font-size:14px;letter-spacing:.18em;font-weight:700}.brand-tagline{font-size:8px;letter-spacing:.28em;color:#9aa8bb;margin-top:5px}
.brand-copy{position:relative;z-index:1;margin:auto 0;max-width:610px;padding:60px 0}
.eyebrow{display:flex;align-items:center;gap:10px;color:var(--gold-light);font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase}.eyebrow i{display:block;width:34px;height:1px;background:var(--gold)}
.brand-copy h1{margin:25px 0 24px;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(48px,5.5vw,78px);line-height:.99;letter-spacing:-.045em}.brand-copy h1 em{color:var(--gold-light);font-weight:400}.brand-copy p{max-width:510px;margin:0;color:#aeb9c8;font-size:16px;line-height:1.75}
.brand-footer{position:relative;z-index:1;display:flex;align-items:center;gap:9px;color:#8390a2;font-size:10px;letter-spacing:.08em;text-transform:uppercase}.status-dot{width:7px;height:7px;border-radius:50%;background:#5dc98a;box-shadow:0 0 0 4px rgba(93,201,138,.1)}.footer-separator{width:1px;height:12px;background:#354257;margin:0 7px}
.form-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;padding:54px 8vw;background:radial-gradient(circle at 100% 0,rgba(184,155,94,.09),transparent 35%),var(--paper)}
.login-card{width:100%;max-width:430px}
.microsoft-login{height:56px;display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:22px;border:1px solid #cfd4da;border-radius:5px;background:#fff;color:#172033;text-decoration:none;font-size:13px;font-weight:700;box-shadow:0 3px 10px rgba(15,23,42,.05)}.microsoft-login:hover{border-color:#9da8b5;background:#fbfcfd}.microsoft-mark{width:18px;height:18px;display:grid;grid-template-columns:1fr 1fr;gap:2px}.microsoft-mark i:nth-child(1){background:#f35325}.microsoft-mark i:nth-child(2){background:#81bc06}.microsoft-mark i:nth-child(3){background:#05a6f0}.microsoft-mark i:nth-child(4){background:#ffba08}.login-divider{display:flex;align-items:center;gap:10px;margin:0 0 20px;color:#969da7;font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.login-divider:before,.login-divider:after{content:"";height:1px;flex:1;background:#dfe2e6}
.form-heading{margin-bottom:36px}.form-kicker{font-size:10px;font-weight:800;letter-spacing:.2em;color:var(--gold)}.form-heading h2{margin:10px 0 8px;font-family:Georgia,"Times New Roman",serif;font-size:38px;font-weight:500;letter-spacing:-.025em}.form-heading p{margin:0;color:var(--muted);font-size:14px}
.field{margin-bottom:20px}.field label{display:block;margin-bottom:8px;font-size:11px;font-weight:750;letter-spacing:.06em;color:#3b4657;text-transform:uppercase}
.input-wrap{position:relative}.input-wrap>svg{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:18px;height:18px;fill:none;stroke:#8a93a1;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.input-wrap input{width:100%;height:54px;padding:0 48px 0 46px;border:1px solid var(--line);border-radius:5px;background:rgba(255,255,255,.84);outline:none;color:var(--ink);box-shadow:0 1px 2px rgba(15,23,42,.02);transition:border-color .2s,box-shadow .2s,background .2s}.input-wrap input::placeholder{color:#a7adb6}.input-wrap input:focus{border-color:var(--gold);background:#fff;box-shadow:0 0 0 4px rgba(184,155,94,.11)}
.password-toggle{position:absolute;right:8px;top:8px;width:38px;height:38px;border:0;border-radius:4px;background:transparent;display:grid;place-items:center;cursor:pointer;color:#8a93a1}.password-toggle:hover{background:#f0eee8;color:var(--ink)}.password-toggle svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.error-message{display:none;margin:-5px 0 15px;padding:10px 12px;border-left:3px solid var(--danger);background:#fff1f0;color:var(--danger);font-size:12px}.error-message:not(:empty){display:block}
.login-button{width:100%;height:56px;border:0;border-radius:5px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;gap:12px;font-size:13px;font-weight:700;letter-spacing:.025em;cursor:pointer;box-shadow:0 10px 24px rgba(17,26,41,.16);transition:transform .18s,background .18s,box-shadow .18s}.login-button svg{width:18px;height:18px;fill:none;stroke:var(--gold-light);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .18s}.login-button:hover{background:#1c2a3f;box-shadow:0 13px 28px rgba(17,26,41,.22);transform:translateY(-1px)}.login-button:hover svg{transform:translateX(3px)}.login-button:disabled{opacity:.7;cursor:wait;transform:none}
.security-note{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:20px;color:#89919b;font-size:11px}.security-note svg{width:15px;height:15px;fill:none;stroke:var(--gold);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.form-footer{position:absolute;bottom:25px;color:#9da3aa;font-size:10px;letter-spacing:.08em;text-transform:uppercase}.mobile-brand{display:none}
@media(max-width:900px){.login-shell{grid-template-columns:1fr}.brand-panel{display:none}.form-panel{min-height:100vh;padding:45px 24px 70px}.mobile-brand{display:flex;align-items:center;width:100%;max-width:430px;margin-bottom:auto}.mobile-brand .brand-logo{width:165px;height:60px}.login-card{margin:auto 0}.form-footer{bottom:20px}}
@media(max-width:480px){.form-heading h2{font-size:32px}.form-heading{margin-bottom:30px}.input-wrap input{height:52px}.login-button{height:54px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
