/* 법무 문서(이용약관·개인정보처리방침) 공용 스타일.
 *
 * 이 파일은 번들을 타지 않는다 — `public/`은 Vite가 그대로 복사한다. 의도한 것이다:
 * **앱 셸이 깨져도 약관은 읽혀야 한다.** WebGL을 못 쓰는 기기(#42)나 스크립트가 막힌
 * 환경에서도 법정 고지 문서는 도달해야 하므로, 여기엔 JS도 빌드 의존도 두지 않는다.
 *
 * 색은 앱과 같은 야간 팔레트(R9)를 따르되, 지도가 아니라 글이므로 대비를 더 준다. */

:root {
  color-scheme: dark;
}

body {
  margin: 0;
  padding: 48px 24px 96px;
  background: #0c0f16;
  color: #d7dee9;
  font: 15px/1.85 system-ui, "Apple SD Gothic Neo", sans-serif;
  /* 한국어는 어절 중간에서 끊으면 읽기가 나빠진다 — 안내 오버레이와 같은 이유 (#42) */
  word-break: keep-all;
}

main {
  max-width: 42rem;
  margin: 0 auto;
}

a {
  color: #7fd4e8;
}

.home {
  display: inline-block;
  margin-bottom: 28px;
  color: #8e9bb5;
  font-size: 13px;
  text-decoration: none;
}
.home:hover {
  color: #d7dee9;
}

h1 {
  margin: 0 0 6px;
  font-size: 26px;
  font-weight: 650;
  letter-spacing: -0.02em;
  color: #e8ecf2;
}

/* 시행일·개정일 — 법정 필수 기재사항이라 제목 바로 아래에 세운다 */
.meta {
  margin: 0 0 36px;
  color: #8e9bb5;
  font-size: 13px;
}

/* 문서가 무엇을 말하는지 한 문단으로 먼저 말한다.
   법률 문서일수록 첫 화면에서 요지가 보여야 실제로 읽힌다 */
.lead {
  margin: 0 0 40px;
  padding: 16px 18px;
  background: rgba(0, 229, 255, 0.06);
  border: 1px solid rgba(0, 229, 255, 0.22);
  border-radius: 10px;
  color: #c6cede;
  font-size: 14px;
}
.lead strong {
  color: #e8ecf2;
}

h2 {
  margin: 40px 0 10px;
  font-size: 16px;
  font-weight: 650;
  color: #e8ecf2;
  letter-spacing: -0.01em;
}

p {
  margin: 0 0 12px;
}

ol,
ul {
  margin: 0 0 12px;
  padding-left: 1.35em;
}

li {
  margin-bottom: 5px;
}

li::marker {
  color: #8e9bb5;
}

strong {
  color: #f0f4fa;
  font-weight: 650;
}

/* 표는 자기 상자 안에서만 가로로 스크롤한다.
   국외이전 표는 5열이라 좁은 화면에서 최소 폭 아래로 줄지 않는다 — 감싸지 않으면
   **본문 전체가 가로로 밀려** 모든 문단이 화면 밖으로 나간다(390px에서 실측). */
.tw {
  overflow-x: auto;
  margin: 10px 0 16px;
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13.5px;
}

th,
td {
  padding: 8px 10px;
  border: 1px solid rgba(255, 255, 255, 0.13);
  text-align: left;
  vertical-align: top;
}

th {
  background: rgba(255, 255, 255, 0.05);
  color: #b6c1d4;
  font-weight: 600;
}

/* 저장소 키 이름·도메인은 공백이 없어 좁은 화면에서 표를 밀어낸다.
   `anywhere`는 여기에만 준다 — 본문에 걸면 keep-all을 이겨 "회원/정보"처럼 끊긴다(실측). */
code {
  font-family: ui-monospace, monospace;
  font-size: 0.9em;
  color: #b6c1d4;
  overflow-wrap: anywhere;
}

/* 문서 하단 — 시행일과 문의처 */
.foot {
  margin-top: 48px;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.13);
  color: #8e9bb5;
  font-size: 13.5px;
}

/* 아직 확정하지 못한 값. **눈에 띄게 남긴다** — 조용한 플레이스홀더는 그대로 공개된다.
   운영 주체·시행일이 비어 있는 채로 배포되면 문서 자체가 미기재 상태가 되므로,
   빈칸이 남아 있으면 화면에서 바로 보이는 편이 낫다. */
.todo {
  padding: 1px 7px;
  border-radius: 4px;
  background: rgba(255, 159, 28, 0.16);
  border: 1px dashed rgba(255, 159, 28, 0.55);
  color: #ffbe5c;
  font-size: 0.92em;
  white-space: nowrap;
}