* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; background:#efeeeb; color:#2c332e; font-family:Arial,"Segoe UI",sans-serif; }
button,input { font:inherit; }
.auth-page { min-height:100vh; min-height:100svh; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:36px 20px; }
.brand { display:block; margin-bottom:24px; }
.brand img { width:150px; height:auto; display:block; mix-blend-mode:multiply; }
.auth-card { width:100%; max-width:420px; padding:30px; border:1px solid #deddd7; background:#fff; box-shadow:0 12px 40px #252b2210; }
h1 { margin:0 0 22px; font:400 31px Georgia,"Times New Roman",serif; text-align:center; }
.notice { background:#f4f4ef; color:#697267; padding:12px; margin:0 0 24px; font-size:12px; line-height:1.7; }
.field { margin:0 0 19px; }
label { display:block; margin-bottom:8px; font-size:14px; }
input { width:100%; height:46px; border:1px solid #d3d6cf; padding:0 12px; background:#fff; outline:none; border-radius:0; }
input:focus { border-color:#53624f; box-shadow:0 0 0 2px #53624f15; }
input[aria-invalid=true] { border-color:#ae5050; }
.primary { width:100%; height:46px; margin-top:4px; border:0; background:#2c332e; color:#fff; cursor:pointer; }
.primary:hover { background:#465144; }
a { color:#53624f; text-underline-offset:3px; }
.switch { margin:24px 0 20px; font-size:14px; text-align:center; }
.back { display:block; text-align:center; font-size:13px; text-decoration:none; }
.feedback { padding:10px; font-size:13px; color:#a13939; background:#fff3f3; line-height:1.6; }
.feedback.success { color:#35613d; background:#eef6ef; }
button:focus-visible,a:focus-visible { outline:2px solid #53624f; outline-offset:4px; }
@media(max-width:380px) { .auth-card { padding:24px 20px; } }