:root { color-scheme: light; font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', sans-serif; color: #17201d; background: #f4f6f5; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; padding: 24px; }
main { width: min(420px, 100%); margin-block: auto; padding: 36px; background: white; border: 1px solid #dce2df; border-radius: 18px; box-shadow: 0 16px 50px #17201d12; }
.mark { display: grid; place-items: center; width: 44px; height: 44px; background: #18664b; color: white; border-radius: 12px; font-size: 24px; }
h1 { margin: 20px 0 8px; } p { color: #65706c; line-height: 1.6; }
form { display: grid; gap: 12px; margin-top: 28px; }
input, button { font: inherit; min-height: 44px; border-radius: 8px; padding: 10px 14px; }
input { width: 100%; border: 1px solid #c9d1cd; } button { border: 0; background: #17201d; color: white; cursor: pointer; }
button:disabled { opacity: .6; } #loginStatus { color: #b43a31; margin: 0; }
:focus-visible { outline: 3px solid #8cc9af; outline-offset: 3px; }

.remember{display:flex;align-items:center;gap:8px;font-size:13px}.remember input{width:18px;margin:0;min-height:18px}