/* 오답노트AI 문서 페이지 공용 스타일 — 앱 브랜드(다크·블루)와 같은 결.
   법적 고지 페이지는 심사자와 이용자가 **읽으러** 오는 곳이라 가독성이 먼저다. */

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  background: #050505;
  color: rgba(255, 255, 255, 0.72);
  font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont,
    'Apple SD Gothic Neo', sans-serif;
  line-height: 1.78;
  -webkit-font-smoothing: antialiased;
  word-break: keep-all;
}
::selection { background: rgba(94, 139, 255, 0.35); }

.wrap { max-width: 720px; margin: 0 auto; padding: 56px 24px 96px; }

/* 상단 브랜드 — 어느 페이지에 있어도 같은 앱의 문서라는 걸 보여준다 */
.brand {
  display: inline-flex; align-items: center; gap: 9px;
  text-decoration: none; margin-bottom: 40px;
}
/* 마크는 **앱 아이콘 그대로**. 체크 획만 떼어내면 서비스가 아니라 무슨 표시처럼 읽힌다 —
   유저가 홈 화면에서 보게 될 모습이 곧 브랜드다 */
.brand .mark {
  width: 27px; height: 27px; border-radius: 8px; display: block;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.14), 0 0 0 1px rgba(255,255,255,0.12);
}
.brand .name { font-size: 15.5px; font-weight: 700; color: #fff; letter-spacing: -0.3px; }

h1 { font-size: 27px; color: #fff; letter-spacing: -0.5px; margin-bottom: 6px; }
.date { color: rgba(255, 255, 255, 0.38); font-size: 13px; margin-bottom: 36px; }

h2 {
  font-size: 17px; color: #fff; font-weight: 700;
  margin: 38px 0 10px; letter-spacing: -0.2px;
}
h3 { font-size: 15px; color: rgba(255, 255, 255, 0.92); margin: 22px 0 6px; }

p, li { font-size: 15px; }
p + p { margin-top: 10px; }
ul, ol { padding-left: 20px; margin: 8px 0; }
li { margin-bottom: 7px; }
li::marker { color: rgba(255, 255, 255, 0.35); }

a { color: #5E8BFF; text-decoration: none; }
a:hover { text-decoration: underline; }
strong, b { color: rgba(255, 255, 255, 0.95); font-weight: 600; }

/* 요약 박스 — 다 읽지 않는 사람에게 핵심만 먼저 준다 */
.box {
  background: rgba(94, 139, 255, 0.07);
  border: 1px solid rgba(94, 139, 255, 0.18);
  border-radius: 16px; padding: 18px 20px; margin: 18px 0;
}
.box .title { color: #fff; font-weight: 700; font-size: 15px; display: block; margin-bottom: 8px; }
.box ul { margin-bottom: 0; }
.box li:last-child { margin-bottom: 0; }

/* 표 — 수집 항목처럼 "무엇을·왜"가 짝인 정보에 쓴다 */
.table-scroll { overflow-x: auto; margin: 14px 0; }
table { border-collapse: collapse; width: 100%; min-width: 480px; font-size: 14px; }
th, td {
  text-align: left; padding: 11px 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.09); vertical-align: top;
}
th { color: rgba(255, 255, 255, 0.95); font-weight: 600; white-space: nowrap; }

footer {
  margin-top: 56px; padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.09);
  font-size: 13px; color: rgba(255, 255, 255, 0.4);
}
footer a { color: rgba(255, 255, 255, 0.55); }
footer .links { margin-bottom: 14px; display: flex; gap: 16px; flex-wrap: wrap; }

/* 사업자 정보 — 전자상거래법 제10조 표시 의무.
   읽으라고 두는 게 아니라 **찾으면 있어야** 하는 정보라 톤을 한 단계 낮춘다 */
footer .biz {
  font-size: 12px; line-height: 1.85; color: rgba(255, 255, 255, 0.32);
  margin-bottom: 12px;
}
footer .biz .sep { opacity: 0.4; margin: 0 6px; }