:root{
    --login-bg:#f3f7fc;
    --login-card:#ffffff;
    --login-text:#10233f;
    --login-muted:#63728a;
    --login-line:#dfe8f4;
    --login-primary:#124b9f;
    --login-primary-dark:#0d3f86;
    --login-success:#1f8f5f;
    --login-danger:#c43d3d;
    --login-warning:#f5a623;
    --login-shadow:0 28px 90px rgba(16,35,63,.16);
}
*{box-sizing:border-box}
html,body{min-height:100%}
body{
    margin:0;
    font-family:Inter,Arial,Helvetica,sans-serif;
    background:
        radial-gradient(circle at top left, rgba(18,75,159,.16), transparent 34%),
        radial-gradient(circle at bottom right, rgba(245,166,35,.16), transparent 32%),
        linear-gradient(135deg,#f6f9fe,#edf4fb);
    color:var(--login-text);
}
a{text-decoration:none;color:inherit}
.auth-page{
    min-height:100vh;
    display:grid;
    grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr);
}
.auth-visual{
    position:relative;
    overflow:hidden;
    padding:54px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    color:#fff;
    background:linear-gradient(145deg,#0f2341,#124b9f 58%,#0d3f86);
}
.auth-visual:before{
    content:"";
    position:absolute;
    inset:-20%;
    background:
        radial-gradient(circle at 22% 20%, rgba(255,255,255,.18), transparent 28%),
        radial-gradient(circle at 80% 70%, rgba(255,255,255,.12), transparent 28%);
    pointer-events:none;
}
.auth-brand,.auth-hero,.auth-badges{position:relative;z-index:1}
.auth-brand{display:flex;align-items:center;gap:14px}
.auth-logo{
    width:64px;height:64px;border-radius:22px;background:#fff;display:grid;place-items:center;overflow:hidden;
    box-shadow:0 18px 42px rgba(0,0,0,.22);font-weight:950;font-size:26px;color:var(--login-primary)
}
.auth-logo img{width:100%;height:100%;object-fit:cover;display:block}
.auth-brand strong{display:block;font-size:24px;line-height:1;font-weight:950;letter-spacing:-.03em}
.auth-brand span{display:block;margin-top:5px;color:#c9dcf7;font-size:13px;font-weight:700}
.auth-hero{max-width:640px;padding:70px 0}
.auth-kicker{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.16);font-size:12px;font-weight:900;color:#e8f2ff;margin-bottom:18px}
.auth-hero h1{margin:0;font-size:clamp(34px,5vw,58px);line-height:.98;letter-spacing:-.055em}
.auth-hero p{margin:18px 0 0;color:#d8e7fb;font-size:17px;line-height:1.75;max-width:560px}
.auth-badges{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.auth-badge{padding:14px;border-radius:18px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(8px)}
.auth-badge strong{display:block;font-size:19px;line-height:1}
.auth-badge span{display:block;margin-top:6px;color:#c9dcf7;font-size:12px;font-weight:700;line-height:1.45}
.auth-form-side{display:grid;place-items:center;padding:28px}
.auth-card{
    width:min(470px,100%);
    background:rgba(255,255,255,.92);
    border:1px solid rgba(223,232,244,.95);
    border-radius:34px;
    box-shadow:var(--login-shadow);
    padding:30px;
    backdrop-filter:blur(14px);
}
.auth-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:22px}
.auth-card h2{margin:0;font-size:31px;line-height:1.06;letter-spacing:-.04em}
.auth-card p{margin:8px 0 0;color:var(--login-muted);font-size:14px;line-height:1.7}
.auth-pill{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 12px;border-radius:999px;background:#edf4ff;color:var(--login-primary);font-size:12px;font-weight:900;white-space:nowrap}
.auth-alert{padding:13px 14px;border-radius:16px;font-size:13px;line-height:1.55;font-weight:800;margin-bottom:14px;border:1px solid transparent}
.auth-alert.error{background:#fff0f0;color:#9f2f2f;border-color:#ffd2d2}
.auth-alert.success{background:#eefaf4;color:#16724b;border-color:#ccefdc}
.auth-form{display:grid;gap:14px}
.auth-field{display:grid;gap:7px}
.auth-field label{font-size:12px;font-weight:950;color:#1b2d48;letter-spacing:.01em}
.auth-input-wrap{position:relative}
.auth-input-wrap .icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:#8292aa;font-size:16px;pointer-events:none}
.auth-field input{
    width:100%;min-height:50px;border:1px solid #d6e2f1;border-radius:15px;background:#fbfdff;outline:none;
    padding:0 14px 0 40px;color:var(--login-text);transition:.18s ease;font-size:14px
}
.auth-field input:focus{border-color:#8ab3ea;box-shadow:0 0 0 5px rgba(18,75,159,.09);background:#fff}
.auth-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:-2px}
.auth-check{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--login-muted);font-weight:700}
.auth-check input{width:17px;height:17px;accent-color:var(--login-primary)}
.auth-link{border:0;background:transparent;padding:0;color:var(--login-primary);font-size:12px;font-weight:950;cursor:pointer}
.auth-link:hover{text-decoration:underline}
.auth-btn{
    width:100%;min-height:52px;border:0;border-radius:16px;background:linear-gradient(135deg,var(--login-primary),var(--login-primary-dark));
    color:#fff;font-weight:950;cursor:pointer;box-shadow:0 16px 38px rgba(18,75,159,.24);transition:.18s ease
}
.auth-btn:hover{transform:translateY(-1px);box-shadow:0 20px 44px rgba(18,75,159,.28)}
.auth-btn.secondary{background:#fff;color:var(--login-primary);border:1px solid #cadef4;box-shadow:none}
.auth-help{margin-top:16px;padding:14px;border:1px dashed #d7e4f5;background:#f8fbff;border-radius:18px;color:var(--login-muted);font-size:12px;line-height:1.65}
.auth-help strong{color:var(--login-text)}
.auth-switch{margin-top:16px;display:flex;justify-content:center;gap:8px;align-items:center;color:var(--login-muted);font-size:13px;flex-wrap:wrap}
.auth-switch a,.auth-switch button{color:var(--login-primary);font-weight:950;background:transparent;border:0;padding:0;cursor:pointer}
.auth-hidden{display:none!important}
.auth-footer-link{position:fixed;left:18px;bottom:18px;color:rgba(255,255,255,.82);font-size:12px;font-weight:800;z-index:2}
@media (max-width:980px){
    .auth-page{grid-template-columns:1fr;background:linear-gradient(135deg,#0f2341,#124b9f)}
    .auth-visual{min-height:auto;padding:26px 20px 0;background:transparent}
    .auth-hero{padding:34px 0 22px}.auth-hero h1{font-size:36px}.auth-hero p{font-size:14px}
    .auth-badges{display:none}.auth-form-side{padding:20px}.auth-card{border-radius:26px;padding:22px}.auth-footer-link{position:static;display:block;margin:0 0 20px 20px}
}
@media (max-width:540px){
    .auth-card-head{display:grid}.auth-card h2{font-size:27px}.auth-pill{justify-self:start}.auth-row{align-items:flex-start}.auth-page{min-height:100vh}
}
