:root{color-scheme:dark;font-family:Arial,sans-serif;background:#0a0d0f;color:#f3eee5}
*{box-sizing:border-box}
body{margin:0;min-width:280px;min-height:100vh;background:radial-gradient(ellipse at 50% 85%,#422b0e,#0a0d0f 72%);background-attachment:fixed}
::selection{background:#a17b37;color:#fff7e5}
.login-stage{min-height:100svh;padding:40px 22px;display:flex;align-items:center;justify-content:center;perspective:1000px}
.login-card{position:relative;width:390px;max-width:100%;padding:33px 32px 25px;border:1px solid #b28b3e;border-radius:15px;background:linear-gradient(135deg,#181810,#090c0e 52%,#241a0d);box-shadow:0 24px 45px #0008;transform:perspective(900px) rotateX(var(--login-rx,0deg)) rotateY(var(--login-ry,0deg));transform-style:preserve-3d;transition:transform .25s ease-out}
.login-brand{display:flex;align-items:center;justify-content:center;gap:5px;margin-bottom:30px;color:#eef0f1;font-size:28px;letter-spacing:6px;text-decoration:none;min-height:34px}
.login-brand i{width:5px;height:5px;border-radius:50%;background:#ffc247;box-shadow:0 0 8px #ffbd4360}
h1{font-size:27px;line-height:1.2;font-weight:500;letter-spacing:-.7px;color:#ffe0a0;text-align:center;margin:0 0 10px}
.login-description{text-align:center;font-size:13px;line-height:1.6;color:#c3b79e;margin:0 0 28px}
#login-form{display:flex;flex-direction:column;gap:20px}
.login-row>label{display:block;font-size:12px;line-height:1.5;color:#d1c5ad;margin-bottom:8px}
.login-field{display:flex;align-items:center;position:relative;border:1px solid #6a5126;border-radius:8px;background:rgba(39,32,23,.65);box-shadow:inset 0 1px 0 #ffffff04}
.login-field:focus-within{outline:2px solid #e1b35b;outline-offset:3px}
.login-field>svg{position:absolute;left:13px;width:17px;height:17px;color:#b7a47c;pointer-events:none}
.login-field input{width:100%;min-width:0;height:48px;padding:11px 13px 11px 39px;border:0;outline:0;background:transparent;color:#f5eee1;border-radius:8px;font:14px Arial,sans-serif;caret-color:#ffc247}
.login-password input{padding-right:48px}
.login-field input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px #211c14 inset;-webkit-text-fill-color:#f5eee1;caret-color:#ffc247}
#login-password-toggle{position:absolute;right:3px;top:2px;display:grid;place-items:center;width:42px;height:42px;padding:0;border:0;border-radius:6px;background:transparent;color:#c9b78e;cursor:pointer}
#login-password-toggle svg{width:18px;height:18px}
[hidden]{display:none!important}
.eye-slash[hidden]{display:none}
.login-submit{min-height:48px;display:flex;align-items:center;justify-content:center;gap:12px;border:1px solid #d0a64e;border-radius:8px;background:linear-gradient(125deg,#61461e,#ad853d,#745121);color:#fff7e6;font:500 14px Arial,sans-serif;box-shadow:inset 0 1px 0 #ffe4aa50;cursor:pointer;transition:filter .2s,box-shadow .2s}
.login-submit svg{width:17px;height:17px}
.login-submit:hover{filter:brightness(1.13);box-shadow:inset 0 1px 0 #ffe4aa70,0 5px 15px #0003}
.login-submit:active{filter:brightness(.96)}
.login-back{display:flex;align-items:center;justify-content:center;gap:8px;margin:19px auto 0;padding:9px 0;min-height:38px;font-size:12px;color:#c1b49b;text-decoration:none}
.login-back svg{width:14px;height:14px}
.login-back:hover,.login-reset:hover{color:#ffe0a0}
.login-reset{font-size:12px;color:#c9b78e;text-underline-offset:4px}
button:focus-visible,a:focus-visible{outline:2px solid #ffe0a0;outline-offset:4px}
.login-error,.errorlist{font-size:13px;line-height:1.6;color:#ffc6b4}
.login-error{margin:0 0 20px;padding:11px 13px;background:#71332226;border:1px solid #8b5746;border-radius:8px}
.errorlist{list-style:none;padding:0;margin:9px 0 0}
@media(prefers-reduced-motion:no-preference){.login-card{animation:login-card-enter 1.1s cubic-bezier(.22,1,.36,1)}}
@keyframes login-card-enter{0%{transform:perspective(900px) rotateY(-10deg) rotateX(6deg) translateY(10px)}55%{transform:perspective(900px) rotateY(3deg) rotateX(-1deg) translateY(-2px)}100%{transform:perspective(900px) rotateY(0) rotateX(0) translateY(0)}}
@media(max-width:480px){.login-stage{padding:25px 18px}.login-card{padding:29px 24px 22px;transform:none}.login-field input{font-size:16px}h1{font-size:26px}}
@media(max-height:650px){.login-stage{align-items:flex-start}}
@media(prefers-reduced-motion:reduce){.login-card{transform:none;transition:none;animation:none}.login-submit{transition:none}}
