/* ────────────────────────────────────────────────────────────────
   Shared styles for the standalone auth pages (/login/, /signup/).
   These pages do NOT load header.js (no password gate, no sidebar) —
   they are the public entry points to the app.
   ──────────────────────────────────────────────────────────────── */

.auth-wrap {
  min-height: 100vh;
  display: flex; align-items: center; justify-content: center;
  padding: 32px;
  background:
    radial-gradient(120% 90% at 50% -10%, #fbfbfd 0%, #eef0f4 60%, #e7e9ee 100%);
  font-family: var(--brand-font-english, -apple-system, sans-serif);
  color: var(--ui-ink, #1c1d20);
}
.auth-card {
  width: 100%; max-width: 400px;
  background: #fff;
  border: 1px solid var(--ui-rule, #e1e3e7);
  border-radius: 16px;
  padding: 36px 32px 28px;
  box-shadow: 0 12px 40px rgba(0,0,0,.07);
}
.auth-brand {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 22px;
}
.auth-brand-mark { color: var(--brand-primary-red, #cc3300); display: inline-flex; }
.auth-brand-mark svg { width: 26px; height: 26px; display: block; }
.auth-brand-name { font-size: 18px; font-weight: 600; letter-spacing: -.01em; }

.auth-title { font-size: 22px; font-weight: 600; letter-spacing: -.01em; margin: 0 0 4px; }
.auth-sub { font-size: 13px; color: var(--ui-ink-light, #868a92); margin: 0 0 22px; line-height: 1.5; }

.auth-field { margin-bottom: 14px; }
.auth-field label {
  display: block; font-size: 12px; font-weight: 500;
  color: var(--ui-ink-mid, #555a63); margin-bottom: 6px;
}
.auth-field input {
  width: 100%; box-sizing: border-box;
  padding: 11px 13px;
  border: 1px solid var(--ui-rule, #e1e3e7); border-radius: 9px;
  font-family: var(--brand-font-english, inherit); font-size: 14px;
  color: var(--ui-ink, #1c1d20); background: #fff;
  transition: border-color .12s, box-shadow .12s;
}
.auth-field input:focus {
  outline: none; border-color: var(--ui-ink-mid, #555a63);
  box-shadow: 0 0 0 3px rgba(28,29,32,.06);
}

.auth-btn {
  width: 100%; box-sizing: border-box;
  padding: 12px; border-radius: 9px; border: 1px solid transparent;
  font-family: var(--brand-font-english, inherit); font-size: 14px; font-weight: 500;
  cursor: pointer; line-height: 1.3;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  transition: background .12s, border-color .12s, opacity .12s;
}
.auth-btn-primary { background: var(--ui-ink, #1c1d20); color: #fff; border-color: var(--ui-ink, #1c1d20); margin-top: 4px; }
.auth-btn-primary:hover:not(:disabled) { background: #000; }
.auth-btn-primary:disabled { opacity: .55; cursor: not-allowed; }
.auth-btn-google { background: #fff; color: var(--ui-ink, #1c1d20); border-color: var(--ui-rule, #d7dade); }
.auth-btn-google:hover { background: var(--ui-row-bg, #f5f6f8); }
.auth-btn-google svg { width: 17px; height: 17px; display: block; }

.auth-divider {
  display: flex; align-items: center; gap: 12px;
  margin: 18px 0; color: var(--ui-ink-light, #b3b7be);
  font-size: 11px; font-family: var(--brand-font-mono, monospace); text-transform: uppercase; letter-spacing: .08em;
}
.auth-divider::before, .auth-divider::after { content: ''; flex: 1; height: 1px; background: var(--ui-rule, #e8eaee); }

.auth-msg {
  font-size: 13px; line-height: 1.5; border-radius: 9px;
  padding: 10px 12px; margin-bottom: 14px; display: none;
}
.auth-msg.is-error  { display: block; background: #fdeceb; color: #b00020; border: 1px solid #f6cfcb; }
.auth-msg.is-notice { display: block; background: #eef4fd; color: #1f5fb0; border: 1px solid #d3e2f8; }
.auth-msg.is-ok     { display: block; background: #e9f7ee; color: #1a7f37; border: 1px solid #c6ecd2; }

.auth-foot { margin-top: 20px; text-align: center; font-size: 13px; color: var(--ui-ink-light, #868a92); }
.auth-foot a { color: var(--ui-ink, #1c1d20); font-weight: 500; text-decoration: none; }
.auth-foot a:hover { text-decoration: underline; }
.auth-legal { margin-top: 16px; text-align: center; font-size: 11px; color: var(--ui-ink-light, #aeb2b9); line-height: 1.5; }