:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, sans-serif; background: #08110f; color: #edf8f3; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 1rem; background: radial-gradient(circle at top, #15372f 0, #08110f 42rem); }
.login-card { width: min(100%, 410px); padding: 2rem; border: 1px solid #294b42; border-radius: 20px; background: rgba(12, 28, 24, .96); box-shadow: 0 18px 55px #0008; }
.eyebrow { margin: 0 0 .3rem; color: #64e3b2; font-weight: 750; text-transform: uppercase; letter-spacing: .12em; font-size: .75rem; }
.language { float: right; display: flex; gap: .35rem; margin-top: -1.2rem; color: #6f9186; font-size: .8rem; }
.language a { color: #a6c6bc; text-decoration: none; }
.language a:hover { color: #64e3b2; }
h1 { margin: 0; font-size: 2rem; }
.intro, .notice { color: #94afa6; }
.intro { margin: .65rem 0 1.5rem; }
.notice { margin: 1.25rem 0 0; text-align: center; font-size: .8rem; }
form { display: grid; gap: .6rem; }
label { margin-top: .35rem; color: #b9d0c8; font-size: .9rem; font-weight: 650; }
input { width: 100%; padding: .85rem .9rem; border: 1px solid #3b6257; border-radius: 10px; background: #081713; color: #fff; font: inherit; outline: none; }
input:focus { border-color: #64e3b2; box-shadow: 0 0 0 3px #64e3b229; }
button { margin-top: .65rem; padding: .9rem; border: 0; border-radius: 10px; background: #64e3b2; color: #052019; font: inherit; font-weight: 800; cursor: pointer; }
button:hover { background: #83ecc5; }
.error { padding: .75rem .85rem; border-radius: 10px; background: #8e2030; color: #fff; }