:root{--gold:#d7a84c;--dark:#121212;--muted:#737373;--border:#e2e4e8;--bg:#f5f6f8}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Arial,Helvetica,sans-serif;color:#202124}
body{background:var(--bg)}
a{text-decoration:none;color:inherit}
button,input{font:inherit}
.login-shell{min-height:100vh;display:grid;grid-template-columns:minmax(420px,1.05fr) minmax(480px,.95fr)}
.login-visual{position:relative;overflow:hidden;background:linear-gradient(145deg,#101010 0%,#1b1b1b 58%,#2c2114 100%);color:#fff;padding:48px 7vw;display:flex;flex-direction:column}
.login-brand,.mobile-brand{display:flex;align-items:center;gap:13px;position:relative;z-index:2}
.login-brand-mark{width:48px;height:48px;display:grid;place-items:center;background:var(--gold);color:#111;border-radius:13px;font-weight:900;letter-spacing:-1px;box-shadow:0 10px 30px rgba(215,168,76,.25)}
.login-brand span:last-child,.mobile-brand span:last-child{display:flex;flex-direction:column}
.login-brand small,.mobile-brand small{font-size:10px;letter-spacing:3px;color:var(--gold);margin-bottom:4px}
.login-brand strong,.mobile-brand strong{font-size:18px;letter-spacing:.3px}
.visual-content{position:relative;z-index:2;margin:auto 0;max-width:650px}
.visual-kicker{display:inline-block;font-size:12px;letter-spacing:2.2px;color:var(--gold);font-weight:800;margin-bottom:20px}
.visual-content h1{font-size:clamp(42px,5vw,72px);line-height:1.02;letter-spacing:-3px;margin:0 0 25px}
.visual-content p{font-size:18px;line-height:1.75;color:#cfcfcf;max-width:590px}
.visual-points{display:grid;gap:12px;margin-top:30px;color:#ededed}
.visual-points span{display:flex;align-items:center;gap:10px}
.visual-points span::first-letter{color:var(--gold)}
.visual-footer{position:relative;z-index:2;font-size:13px;color:#8f8f8f}
.visual-shape{position:absolute;border-radius:50%;filter:blur(1px);opacity:.16}
.visual-shape.one{width:520px;height:520px;background:var(--gold);right:-220px;top:-140px}
.visual-shape.two{width:280px;height:280px;border:55px solid #fff;left:-120px;bottom:-100px}
.login-form-side{display:flex;align-items:center;justify-content:center;padding:48px}
.login-card{width:100%;max-width:480px}
.mobile-brand{display:none;margin-bottom:45px}
.login-heading>span{font-size:12px;letter-spacing:2px;font-weight:800;color:#a7782d}
.login-heading h2{font-size:40px;letter-spacing:-1.5px;margin:12px 0 10px}
.login-heading p{color:var(--muted);font-size:16px;line-height:1.6;margin:0}
.login-error{display:flex;align-items:flex-start;gap:11px;background:#fff0f0;color:#a12626;border:1px solid #ffcaca;padding:13px 15px;border-radius:10px;margin-top:24px}
.login-error span{width:22px;height:22px;display:grid;place-items:center;background:#c73838;color:#fff;border-radius:50%;font-weight:900}
.login-error p{margin:1px 0 0}
.login-form{margin-top:34px}
.login-field{margin-bottom:21px}
.login-field label{display:block;font-weight:800;font-size:14px;margin-bottom:9px}
.input-wrap{position:relative}
.input-wrap input{width:100%;height:54px;border:1px solid var(--border);border-radius:11px;padding:0 82px 0 47px;background:#fff;outline:none;font-size:15px;transition:.2s}
.input-wrap input:focus{border-color:var(--gold);box-shadow:0 0 0 4px rgba(215,168,76,.13)}
.input-icon{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:#777}
.input-icon svg{width:100%;height:100%;fill:currentColor}
.password-toggle{position:absolute;right:9px;top:50%;transform:translateY(-50%);border:0;background:#f0f1f3;border-radius:7px;padding:8px 10px;font-size:12px;font-weight:800;cursor:pointer}
.login-submit{width:100%;height:55px;border:0;border-radius:11px;background:#161616;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 21px;font-weight:800;font-size:16px;cursor:pointer;transition:.2s}
.login-submit:hover{background:#2a2114;transform:translateY(-1px)}
.login-submit span:last-child{font-size:23px;color:var(--gold)}
.login-help{margin-top:25px;padding-top:23px;border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:15px;font-size:13px;color:var(--muted)}
.login-help a{font-weight:800;color:#222}
@media(max-width:920px){
.login-shell{grid-template-columns:1fr}
.login-visual{display:none}
.login-form-side{min-height:100vh;padding:36px 20px}
.mobile-brand{display:flex}
.login-card{max-width:500px}
.login-heading h2{font-size:34px}
}
@media(max-width:520px){
.login-form-side{align-items:flex-start;padding-top:28px}
.mobile-brand{margin-bottom:50px}
.login-help{flex-direction:column}
}
.login-success{display:flex;align-items:flex-start;gap:11px;background:#effbf3;color:#216b39;border:1px solid #bce8c8;padding:13px 15px;border-radius:10px;margin-top:24px}.login-success span{width:22px;height:22px;display:grid;place-items:center;background:#2f9a52;color:#fff;border-radius:50%;font-weight:900}.login-success p{margin:1px 0 0}.forgot-row{display:flex;justify-content:flex-end;margin:-8px 0 18px}.forgot-row a{font-size:13px;font-weight:800;color:#8b6428}.forgot-row a:hover{text-decoration:underline}