:root{--basalt:#2F2F2F;--wool:#F6F3EE;--wool2:#EEEAE3;--turf:#4D4033;--lava:#6B2D2A;--stone:#6E6E6E;--line:#D9D1C5;--ease:cubic-bezier(.23,1,.32,1)}
*{box-sizing:border-box}
html{-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;min-height:100dvh;background:var(--wool);color:var(--basalt);font:400 14px/1.6 Montserrat,"Helvetica Neue",Helvetica,sans-serif;display:flex;align-items:center;justify-content:center;padding:24px 16px calc(24px + env(safe-area-inset-bottom))}
.box{width:100%;max-width:380px;background:#FFFDFA;border:1px solid var(--line);padding:34px 28px 26px;animation:in 220ms var(--ease)}
@keyframes in{from{opacity:0;transform:translateY(6px)}}
.logo{height:46px;width:auto;display:block}
.cap{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--stone);margin:8px 0 22px}
h1{font-size:16px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;margin:0 0 16px}
label{display:flex;flex-direction:column;gap:6px;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--stone);margin-bottom:14px}
input{height:46px;border:1px solid var(--line);background:#fff;padding:0 12px;font:400 16px Montserrat,sans-serif;color:var(--basalt);text-transform:none;letter-spacing:0;border-radius:0}
input:focus{outline:0;border-color:var(--basalt)}
.btn{width:100%;height:46px;background:var(--basalt);color:var(--wool);border:1px solid var(--basalt);font:600 11px/1 Montserrat,sans-serif;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;margin-top:4px;touch-action:manipulation;transition:transform 120ms var(--ease),background-color 160ms ease}
.btn:active{transform:scale(.97)}
.btn[disabled]{opacity:.6;cursor:default}
@media (hover:hover) and (pointer:fine){.btn:hover{background:var(--turf);border-color:var(--turf)}}
.msg{min-height:20px;margin:12px 0 0;color:var(--lava);font-size:13px}
.msg.ok{color:var(--turf)}
.note{font-size:13px;color:var(--stone);margin:-6px 0 14px}
.foot{font-size:11px;color:var(--stone);margin:22px 0 0}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
html{color-scheme:light}
:focus-visible{outline:2px solid var(--basalt);outline-offset:2px}
