:root { --auth-ink:#141414; --auth-muted:#65625c; --auth-line:#e7e4de; --auth-accent:#f8a820; }
.auth-page { margin:0; background:#f7f6f3; color:var(--auth-ink); font-family:system-ui,sans-serif; }
.auth-main { width:min(94%,760px); margin:48px auto; }
.auth-main.login { max-width:420px; margin-top:12vh; }
.auth-card { padding:28px; background:white; border:1px solid var(--auth-line); border-radius:16px; margin:20px 0; }
.auth-card h1, .auth-card h2 { margin-top:0; }
.auth-card p, .auth-footer { color:var(--auth-muted); line-height:1.5; }
.auth-form { display:grid; gap:16px; }
.auth-form label { display:grid; gap:7px; font-size:14px; font-weight:600; }
.auth-form input, .auth-form select { box-sizing:border-box; width:100%; font:inherit; padding:12px; border:1px solid #bcb8af; border-radius:8px; background:white; color:var(--auth-ink); }
.auth-form small { font-weight:400; color:var(--auth-muted); }
.auth-form button, .account-bar button { cursor:pointer; border:0; border-radius:8px; padding:11px 16px; font:inherit; font-weight:600; color:var(--auth-ink); background:var(--auth-accent); }
.auth-form button:disabled { cursor:wait; opacity:.6; }
.account-bar { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:12px 20px; padding:10px 24px; border-bottom:1px solid var(--auth-line); background:white; font:14px system-ui,sans-serif; }
.account-bar a, .auth-main a { color:#784b00; text-underline-offset:3px; }
.account-bar button { padding:8px 12px; background:#f0eee8; }
.auth-message { min-height:1.5em; font-size:14px; color:#b3261e; overflow-wrap:anywhere; }
.auth-message.success { color:#24663e; }
.auth-table-wrap { overflow-x:auto; }
.auth-table { width:100%; border-collapse:collapse; text-align:left; }
.auth-table th, .auth-table td { padding:12px 8px; border-bottom:1px solid var(--auth-line); overflow-wrap:anywhere; }
.auth-footer { text-align:center; font-size:13px; }
:focus-visible { outline:3px solid #986300; outline-offset:3px; }
@media(max-width:480px) { .auth-main { margin:24px auto; } .auth-card { padding:20px; } .account-bar { padding:10px 16px; justify-content:flex-start; } }
