/* 약관·방침 페이지 (로그인 없이 보는 글) */
:root { --text: #1f2a44; --muted: #5b6785; --line: #e3e8f2; --brand: #3b5bdb; --bg: #f5f7fb; --card: #fff; }
@media (prefers-color-scheme: dark) {
  :root { --text: #e6ebf5; --muted: #a3adc4; --line: #2c3550; --brand: #7c93f5; --bg: #11162a; --card: #1a2038; }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); font: 15px/1.75 -apple-system, "Apple SD Gothic Neo", "Malgun Gothic", "Pretendard", sans-serif; word-break: keep-all; }
main { max-width: 820px; margin: 0 auto; padding: 32px 16px 64px; }
.doc { background: var(--card); border: 1px solid var(--line); border-radius: 20px; padding: 32px clamp(18px, 4vw, 44px); }
/* 머리: 로고 + 로그인·시작하기 (소개 페이지와 같은 모양) */
.lg-head { position: sticky; top: 0; z-index: 10; background: color-mix(in srgb, var(--card) 88%, transparent); backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); }
.lg-in { max-width: 1120px; margin: 0 auto; padding: 14px 20px; display: flex; align-items: center; gap: 16px; }
.lg-brand { display: block; line-height: 0; }
.lg-brand img { height: 36px; width: auto; }
.lg-cta { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.lg-link { color: var(--text); text-decoration: none; font-weight: 600; font-size: 14px; padding: 9px 14px; border-radius: 12px; }
.lg-link:hover { background: color-mix(in srgb, var(--brand) 8%, transparent); }
.lg-btn { background: var(--brand); color: #fff; text-decoration: none; font-weight: 700; font-size: 14px; padding: 10px 16px; border-radius: 12px; box-shadow: 0 10px 22px -12px rgb(59 91 219 / .7); }
/* 문서 탭 */
.lg-tabs { display: flex; gap: 6px; margin: 0 0 18px; padding: 6px; background: var(--card); border: 1px solid var(--line); border-radius: 16px; overflow-x: auto; scrollbar-width: none; font-size: 14px; }
.lg-tabs a { flex: none; color: var(--muted); text-decoration: none; padding: 9px 14px; border-radius: 11px; font-weight: 600; white-space: nowrap; }
.lg-tabs a:hover { color: var(--brand); }
.lg-tabs a.on { color: #fff; background: var(--brand); }
@media (max-width: 560px) { .lg-in { padding: 12px 14px; } .lg-brand img { height: 30px; } .lg-link { display: none; } .lg-btn { padding: 9px 13px; font-size: 13px; } }
h1 { font-size: 26px; margin: 0 0 4px; }
.meta { color: var(--muted); font-size: 13px; margin: 0 0 24px; }
h2 { font-size: 17px; margin: 28px 0 8px; padding-top: 18px; border-top: 1px solid var(--line); }
h2:first-of-type { border-top: 0; padding-top: 0; }
p, li { margin: 6px 0; }
ol, ul { padding-left: 22px; }
table { width: 100%; border-collapse: collapse; margin: 10px 0; font-size: 14px; }
th, td { border: 1px solid var(--line); padding: 8px 10px; text-align: left; vertical-align: top; }
th { background: color-mix(in srgb, var(--brand) 8%, transparent); white-space: nowrap; }
.box { border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px; background: color-mix(in srgb, var(--brand) 5%, transparent); }
footer { color: var(--muted); font-size: 13px; text-align: center; margin-top: 22px; }
@media (max-width: 560px) { table { font-size: 13px; } th, td { padding: 6px; } }
h3 { font-size: 15px; margin: 18px 0 4px; }