/* 또박이 공개 페이지.
 *
 * **빌드 도구를 쓰지 않는다.** 두 장짜리 정적 HTML 이라 <link> 하나로 충분하고,
 * 「git 에 있는 것이 그대로 서비스된다」가 법적 문서에는 값어치가 있다.
 *
 * 앱과 색을 맞추지 않았다 — 앱은 다크 모드를 따라가지만 여기는 문서라
 * 읽기가 먼저다. 시스템 글꼴을 쓰고 폭만 잡는다.
 */
:root {
  --text: #1a1a1a;
  --muted: #5f6368;
  --line: #e3e3e6;
  --bg: #fff;
  --accent: #6b3fd4;
}

@media (prefers-color-scheme: dark) {
  :root {
    --text: #ececf0;
    --muted: #a0a0a8;
    --line: #34343a;
    --bg: #17171a;
    --accent: #b49bff;
  }
}

* { box-sizing: border-box; }

body {
  margin: 0;
  padding: 40px 20px 80px;
  background: var(--bg);
  color: var(--text);
  font: 17px/1.75 -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo",
    "Malgun Gothic", "Noto Sans KR", sans-serif;
  /* 글줄이 길면 읽다가 줄을 놓친다 */
  word-break: keep-all;
}

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

h1 { margin: 0 0 6px; font-size: 26px; letter-spacing: -0.01em; }
h2 { margin: 36px 0 10px; font-size: 19px; }
p, li { margin: 0 0 12px; }
ul { padding-left: 22px; }

a { color: var(--accent); }

.lead { margin-bottom: 28px; color: var(--muted); }
.muted { color: var(--muted); font-size: 15px; }

/* 연락처처럼 눈에 걸려야 하는 것 */
.box {
  margin: 20px 0;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 10px;
}
.box p:last-child { margin-bottom: 0; }

dl { margin: 0; }
dt { margin-top: 14px; font-weight: 600; }
dd { margin: 4px 0 0; }

footer {
  margin-top: 48px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 15px;
}
footer a { margin-right: 14px; }