/* ═══════════════════════════════════════════════════════════
   운쏠 · 계정/안내 화면 전용 CSS  (Phase 5 커밋 7 — 잔여 템플릿 토큰 소급)
   - GET /login, GET /me, error.html(안내), report_failed.html(생성 실패) 공용.
   - 네 화면 모두 작고 서로 인접한 성격이라 파일 하나로 묶었다(order.css가
     입력4스텝+확인을 함께 담는 것과 동일한 선례).
   - 색·형태는 전부 tokens.css 변수 경유 — 하드코딩 색 0건.
   - OAuth 버튼도 네이버/구글 브랜드 색 대신 우리 토큰(.btn/.btn.ghost)만 사용한다
     — 이 페이지는 이번 커밋 전까지 스타일이 전혀 없었으므로(대체할 기존 브랜드
     색 구현 자체가 없었음) 보존해야 할 기존 색이 없고, DoD 1(하드코딩 색 0건)이
     예외 없는 규칙이라 토큰 시스템 안에서 처리한다.
   Ref: life-manual-990-mvp.phase5-frontend.workorder.md §2, §8 (접근성 자산은 base 경유)
   ═══════════════════════════════════════════════════════════ */

/* ── 로그인 ────────────────────────────────────────────────── */
.lm-logo {
  font-size: 28px; text-align: center; margin: 72px 0 12px;
}
.lm-login-sub { text-align: center; color: var(--ink-soft); font-size: 14px; margin: 0 var(--gutter) 28px; }
.lm-login-err {
  margin: 0 var(--gutter) 16px; padding: 10px 14px; border-radius: var(--r-sm);
  background: var(--berry-tint); color: var(--berry-deep); font-size: 13px; text-align: center;
}
.lm-login-actions { padding: 0 var(--gutter); display: flex; flex-direction: column; gap: 12px; }

/* ── 보관함(/me) ───────────────────────────────────────────── */
.lm-me-name { font-size: 24px; margin: 30px var(--gutter) 8px; }
.lm-badge {
  /* §8 검증 후속(2026-07-13): 대비 AA 미달 — 텍스트 색 ink-soft → ink 상향(크기·배경 무변경) */
  display: inline-block; margin: 0 var(--gutter) 20px; padding: 4px 10px;
  border-radius: 99px; font-size: 12px; background: var(--paper-deep); color: var(--ink);
}
.lm-btn-logout { width: auto; display: inline-flex; margin: 0 var(--gutter) 24px; padding: 10px 18px; font-size: 14px; }

.lm-library { padding: 10px var(--gutter) 60px; }
.lm-library-list { list-style: none; }
.lm-library-card {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 16px; margin-bottom: 12px; box-shadow: var(--shadow);
}
.lm-library-card-name { font-family: var(--disp); font-size: 16px; margin-bottom: 4px; }
.lm-library-card-date { font-size: 12px; color: var(--ink-soft); margin-bottom: 10px; }
.lm-status-badge {
  display: inline-block; font-size: 12px; padding: 3px 9px; border-radius: 99px; margin-right: 10px;
}
/* §8 검증 후속(2026-07-13): 대비 AA 미달 — 텍스트 색 ink-soft → ink 상향(크기·배경 무변경) */
.lm-status-pending { background: var(--paper-deep); color: var(--ink); }
.lm-status-generating { background: var(--berry-tint); color: var(--berry-deep); }
.lm-status-delivered { background: var(--berry); color: var(--on-accent); }
.lm-status-failed { background: transparent; color: var(--berry-deep); border: 1px solid var(--berry); }
.lm-library-card-link { color: var(--berry); font-size: 13px; text-decoration: none; }

.lm-library-empty { text-align: center; color: var(--ink-soft); font-size: 14px; padding: 40px 0 20px; }
.lm-library-cta { margin: 0 var(--gutter); }

/* ── 일시 오류 / 생성 실패 안내(공용 형태) ─────────────────── */
.lm-error, .lm-failed { padding: 70px var(--gutter) 40px; text-align: center; }
.lm-error-title, .lm-failed-title { font-size: 22px; margin-bottom: 12px; }
.lm-error-desc, .lm-failed-desc, .lm-failed-refund { font-size: 14px; color: var(--ink-soft); margin-bottom: 10px; }
.lm-error-back, .lm-failed-back { color: var(--berry); font-size: 14px; }

/* ── 개인정보처리방침(/privacy) — Phase 6 P0 ─────────────────── */
.lm-legal { padding: 10px var(--gutter) 60px; }
.lm-legal-title { font-size: 24px; margin-bottom: 6px; }
.lm-legal-updated { font-size: 13px; color: var(--ink-soft); margin-bottom: 28px; }
.lm-legal-section { margin-bottom: 24px; }
.lm-legal-section h2 { font-size: 16px; margin-bottom: 10px; }
.lm-legal-section p { font-size: 14px; color: var(--ink); margin-bottom: 8px; }
.lm-legal-section ul { list-style: disc; padding-left: 1.2em; }
.lm-legal-section li { font-size: 14px; color: var(--ink); margin-bottom: 6px; }
.lm-legal-section a { color: var(--berry); }
.lm-legal-bizinfo { font-size: 12px; color: var(--ink-soft); margin-top: 32px; padding-top: 16px; border-top: 1px solid var(--line); }

/* ── 로그인 · 하단 법적 링크 ──────────────────────────────── */
.lm-login-legal { text-align: center; font-size: 13px; margin-top: 24px; }
.lm-login-legal a { color: var(--ink-soft); }