:root { color-scheme: light; font: 16px/1.5 system-ui, sans-serif; color: #142f30; background: #eff3f0; }
* { box-sizing: border-box; }
body { min-height: 100dvh; margin: 0; display: grid; place-items: center; padding: 24px; }
main { background: #fff; border: 1px solid #d3ded8; border-radius: 16px; padding: clamp(24px, 6vw, 48px); width: min(100%, 440px); }
header { font-weight: 700; color: #17675c; }
h1 { margin: 6px 0 32px; font-size: 28px; }
label { display: block; margin: 18px 0 6px; font-size: 14px; font-weight: 600; }
input, button { font: inherit; }
input { width: 100%; color: inherit; padding: 10px 12px; border: 1px solid #81938e; border-radius: 6px; background: white; }
.password { position: relative; }
.password input { padding-right: 64px; }
.password button { position: absolute; right: 5px; top: 4px; border: none; background: white; color: #17675c; padding: 6px; }
button { cursor: pointer; }
.primary { width: 100%; border-radius: 6px; border: 1px solid #07564b; background: #07564b; padding: 10px; color: #fff; }
#error { color: #a12925; min-height: 24px; margin: 10px 0; font-size: 14px; }
:focus-visible { outline: 2px solid #146dbe; outline-offset: 2px; }
