/* 이 페이지는 앱 CSS 의 토큰에 기대지 않는다. 그쪽이 바뀌거나 못 받으면
     본문 색이 브라우저 기본값으로 떨어져 라이트/다크가 뒤섞인다.
     값은 앱과 같은 것을 쓴다 — 두 화면의 배경이 미묘하게 다르면
     정책을 읽다가 제작으로 넘어갈 때 깜빡인다. */
  :root { color-scheme: light dark; }
  body { margin: 0; background: #fdfdff; background: oklch(0.995 0.003 250);
         color: #26262e; color: oklch(0.2 0.02 265); }
  .wrap { max-width: 44rem; margin: 0 auto; padding: 1.5rem 1.25rem 4rem; }
  .top { display: flex; align-items: center; gap: .5rem; font-size: .8125rem; }
  .badge { display: inline-block; border-radius: 999px; padding: .15rem .55rem;
           font-size: .6875rem; font-weight: 700; color: #fff; }
  h1 { font-size: 1.6rem; line-height: 1.35; margin: 1rem 0 .5rem; letter-spacing: -.02em; }
  .meta { color: #52525b; font-size: .8125rem; display: flex; flex-wrap: wrap; gap: .25rem .75rem; }
  .lead { margin: 1.25rem 0; line-height: 1.75; }
  dl { margin: 1.5rem 0; border-top: 1px solid #e5e7eb; }
  .row { display: flex; gap: 1rem; padding: .7rem 0; border-bottom: 1px solid #e5e7eb; }
  dt { flex: 0 0 5.5rem; color: #52525b; font-size: .8125rem; }
  dd { margin: 0; flex: 1; line-height: 1.6; }
  h2 { font-size: .8125rem; color: #52525b; margin: 1.75rem 0 .5rem; font-weight: 600; }
  ul { margin: 0; padding-left: 1.1rem; line-height: 1.7; }
  .cta { display: flex; flex-wrap: wrap; gap: .5rem; margin: 2rem 0 1rem; }
  .btn { display: inline-flex; align-items: center; border-radius: 999px; padding: .6rem 1.1rem;
         font-size: .875rem; font-weight: 600; text-decoration: none; }
  .btn-primary { background: #111827; color: #fff; }
  .btn-ghost { border: 1px solid #d1d5db; color: #111827; }
  .note { color: #52525b; font-size: .75rem; line-height: 1.7; margin-top: 1.5rem; }
  @media (prefers-color-scheme: dark) {
    body { background: #0b0b0c; color: #e5e7eb; }
    .meta, dt, h2, .note { color: #a1a1aa; }
    dl, .row { border-color: #26262a; }
    .btn-primary { background: #e5e7eb; color: #111827; }
    .btn-ghost { border-color: #3f3f46; color: #e5e7eb; }
  }
  /* 허브(부처별·대상별) 목록 */
  .wrap ul { list-style: none; padding: 0; margin: 0 0 2rem; }
  .wrap ul li { padding: .7rem 0; border-top: 1px solid rgba(120,113,108,.18); }
  .wrap ul li a { font-weight: 600; text-decoration: none; }
  .wrap ul li a:hover { text-decoration: underline; }
  .wrap ul li .m { display: block; margin-top: .2rem; font-size: .75rem; opacity: .6; }
  .wrap h2 .n { font-size: .8rem; opacity: .5; font-weight: 400; }
  .wrap ul.rel { display: flex; flex-wrap: wrap; gap: .5rem; }
  .wrap ul.rel li { border: 0; padding: 0; }
  .wrap ul.rel li a {
    display: inline-flex; align-items: center; gap: .35rem; min-height: 2.25rem;
    padding: 0 .8rem; border: 1px solid rgba(120,113,108,.3); border-radius: 9999px;
    font-size: .8125rem; font-weight: 500;
  }
  .wrap ul.rel li a .m { display: inline; margin: 0; font-size: .75rem; }