*{box-sizing:border-box}
body{margin:0;min-height:100vh;min-height:100svh;display:grid;place-items:center;background:radial-gradient(ellipse at 18% 12%,#244c73 0,transparent 52%),linear-gradient(145deg,#142c46,#0c1c30);font:15px Arial,sans-serif;color:#203b56;padding:28px 18px}
.login-card{position:relative;background:linear-gradient(155deg,#f0f8ff 0%,#e3f1ff 100%);border:1px solid #c4def4;border-top:5px solid #569be2;border-radius:24px;max-width:460px;width:100%;padding:30px 36px 25px;box-shadow:0 24px 70px #04132566,0 2px 6px #07172b22}
.login-card>img{width:104px;height:94px;object-fit:contain;display:block;margin:auto;background:#fff;border:1px solid #d5e7f8;border-radius:18px;padding:7px;box-shadow:0 5px 14px #325f8720}
.brand{font-size:12px;font-weight:bold;text-align:center;letter-spacing:1.1px;margin:15px 0 26px;color:#264e74}
h1{font-size:28px;letter-spacing:-.4px;margin:0 0 10px;text-align:center;color:#153b62}
#intro{color:#607a95;line-height:1.6;margin:0 0 24px;text-align:center;font-size:13px}
label{display:block;font-size:12px;font-weight:bold;letter-spacing:.3px;margin:16px 0}
input:not([type=checkbox]),select{display:block;width:100%;min-height:48px;padding:12px 14px;border:1px solid #b9d2e9;border-radius:10px;background:#fff;color:#203b56;font:16px Arial,sans-serif;margin-top:8px;box-shadow:0 1px 2px #2a588a08;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus{outline:2px solid #5b9fe3;outline-offset:2px;border-color:#5b9fe3;box-shadow:0 0 0 4px #589ee31a}
.show{display:flex;align-items:center;gap:9px;font-weight:normal;font-size:12px;letter-spacing:0;color:#4c6781;margin:18px 0}
.show input{width:16px;height:16px;accent-color:#286bb1;margin:0}
button{width:100%;border:0;border-radius:10px;padding:14px;background:linear-gradient(135deg,#2d79c5,#205c9c);color:#fff;font-size:15px;font-weight:bold;cursor:pointer;box-shadow:0 5px 12px #2669ac25;transition:filter .15s,box-shadow .15s}
button:hover{filter:brightness(1.06)}button:focus-visible{outline:3px solid #81b7ed;outline-offset:3px}button:disabled{opacity:.6;cursor:wait}
#login-form+button{display:block;margin:20px 0 0;padding:17px 4px 0;border:0;border-top:1px solid #c4dcef;border-radius:0;background:transparent;color:#3b6891;font-size:12px;font-weight:normal;line-height:1.6;box-shadow:none;text-transform:none!important;text-decoration:underline;text-underline-offset:3px}
#login-form+button:hover{color:#124e88;filter:none}
#error{color:#ad332d;line-height:1.5;font-size:13px}#error:empty{display:none}
.offline{color:#68819a;text-align:center;font-size:10px;line-height:1.6;margin:20px 0 0;letter-spacing:.2px}
#setup-note{font-size:12px;line-height:1.5;color:#68798b}
#recovery-form{margin-top:22px;padding-top:6px}#recovery-form h2{font-size:20px;color:#153b62}#recovery-form>p{font-size:13px;line-height:1.6;color:#607a95}
[hidden]{display:none!important}
body,body *{text-transform:uppercase!important}
input[type="password"],input[name="password"],input[name="confirm"],input[name="username"],input[type="email"]{text-transform:none!important}
@media(max-width:480px){body{padding:20px 14px}.login-card{padding:26px 23px 23px;border-radius:20px}h1{font-size:26px}.brand{font-size:11px;letter-spacing:.7px}#intro{font-size:12px}#login-form+button{font-size:12px}}
@media(prefers-reduced-motion:reduce){input,select,button{transition:none!important}}