:root{
--c-primary:#011235;
--c-secondary:#C6A06A;
--c-text:#ffffff;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,sans-serif;background:var(--c-primary);color:#fff}
.login-screen{position:relative;width:100%;min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:24px}
.login-lottie{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;opacity:.18}
.login-lottie dotlottie-player{width:min(70vw,900px);height:min(70vw,900px)}
.login-card{position:relative;z-index:2;width:min(100%,420px);display:flex;flex-direction:column;text-align:center;padding:32px;border:1px solid rgba(255,255,255,.08);background:rgba(1,18,53,.55);backdrop-filter:blur(18px);border-radius:24px}
.login-card h1{margin:0 0 12px;font-size:var(--title-level-2)}
.login-card img{
    margin:0 auto;
    font-size:var(--title-level-2);
    max-width: 160px;
    padding: 24px;
}
.login-card p{opacity:.75;margin:0 0 28px}
.login-form{display:flex;flex-direction:column;gap:16px}
.login-form input{height:56px;border-radius:14px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.05);padding:0 18px;color:#fff}
.login-form input:focus{outline:none;border-color:var(--c-secondary)}
.btn-login{height:58px;border:none;border-radius:14px;background:var(--c-secondary,0.5);color:var(--c-primary);font-weight:700;cursor:pointer}
.btn-login:hover{filter:brightness(1.05)}
@media (max-width:1024px){.login-lottie dotlottie-player{width:80vw;height:80vw}.login-card{width:min(100%,460px)}}
@media (max-width:768px){.login-card{padding:24px}.login-lottie{opacity:.12}.login-lottie dotlottie-player{width:95vw;height:95vw}}
@media (max-width:480px){.login-screen{padding:16px}.login-card{border-radius:18px}.login-form input,.btn-login{height:52px}}