/* 개인정보처리방침 · 이용약관 — [UD-3] privacy · terms. 읽기만 하는 긴 글이라 가독성만 챙깁니다. */

.policy-page { max-width: 880px; padding-top: clamp(36px, 5vw, 56px); }
.policy-doc { padding: clamp(28px, 5vw, 48px); background: var(--surface); border: 1px solid var(--line); }
/* 약속된 형식이 없는 평문 — 관리자가 입력한 줄바꿈을 그대로 살립니다(textContent로 넣습니다). */
.policy-doc.is-plain { white-space: pre-line; font-size: 15px; line-height: 1.95; }

.policy-intro { margin-bottom: 8px; padding-bottom: 22px; border-bottom: 1px solid var(--line); }
.policy-intro p, .sec-para { margin: 0 0 10px; font-size: 15px; line-height: 1.9; }

.policy-sec { padding: 22px 0; border-bottom: 1px solid var(--line); }
.policy-sec > summary { display: flex; align-items: baseline; gap: 12px; list-style: none; cursor: pointer; }
.policy-sec > summary::-webkit-details-marker { display: none; }
.sec-no { min-width: 30px; font-family: var(--font-display); font-size: 19px; font-weight: 700; color: var(--gold-500); }
.sec-title { font-family: var(--font-serif); font-size: 19px; font-weight: 600; color: var(--navy-800); }
/* 머리는 글자 기준선 정렬이라, 기준선이 없는 아이콘만 따로 가운데에 둡니다 */
.sec-chev { flex: none; display: grid; align-self: center; margin-left: auto; font-size: 18px; color: var(--gold-500); transition: transform .2s; }
.policy-sec[open] .sec-chev { transform: rotate(180deg); }
.sec-body { padding: 14px 0 0 42px; }
.sec-item { position: relative; margin: 0 0 8px; padding-left: 18px; font-size: 15px; line-height: 1.85; }
.sec-dot { position: absolute; left: 0; top: 13px; width: 8px; height: 1px; background: var(--gold-500); }

/* 개인정보 보호책임자 — 법정 기재 사항이라 따로 눈에 띄게 둡니다 */
.policy-officer { margin-top: 28px; padding: 24px 26px; background: var(--bg); border-top: 2px solid var(--navy-800); }
.policy-officer h2 { margin: 0 0 12px; font-size: 19px; color: var(--navy-800); }
.policy-officer p { margin: 4px 0; font-size: 14.5px; }
.policy-outro { margin: 24px 0 0; font-size: 13.5px; line-height: 1.8; color: var(--text-mute); }

.policy-links { display: flex; justify-content: center; gap: 10px; margin-top: 28px; }
.policy-links a { padding: 12px 22px; font-size: 14px; font-weight: 700; color: var(--navy-800);
    background: var(--surface); border: 1px solid rgba(21, 34, 56, .2); }
.policy-links a:hover { border-color: var(--gold-500); color: var(--gold-700); }

/* ══════════ 오픈소스 라이선스 (/licenses) — 같은 문서 틀에 표와 원문 펼침을 더합니다 ══════════ */
.oss-sec { padding: 26px 0; border-bottom: 1px solid var(--line); }
.oss-sec:last-of-type { border-bottom: none; }
.oss-sec > h2 { display: flex; align-items: baseline; gap: 12px; margin: 0 0 12px;
    font-family: var(--font-serif); font-size: 19px; font-weight: 600; color: var(--navy-800); }
.oss-sub { margin: 28px 0 8px; font-size: 15px; font-weight: 700; color: var(--navy-800); }
.oss-note { font-size: 13.5px; color: var(--text-mute); }
.oss-note code { font-size: 12.5px; }
.oss-table { width: 100%; min-width: 600px; border-collapse: collapse; margin: 6px 0 14px; font-size: 14px; }
.oss-table th, .oss-table td { padding: 12px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.oss-table th { font-size: 12.5px; font-weight: 700; color: var(--text-mute); white-space: nowrap; background: rgba(21, 34, 56, .03); }
.oss-table td small { display: block; margin-top: 3px; font-size: 12.5px; line-height: 1.6; color: var(--text-mute); }
.oss-table.is-dense td { padding: 8px 12px; font-size: 13px; }
.oss-table code { font-size: 12.5px; word-break: break-all; }
.oss-license { display: inline-block; margin: 2px 0; padding: 2px 9px; border-radius: 100px; white-space: nowrap;
    font-size: 12px; font-weight: 700; background: rgba(201, 164, 92, .15); color: var(--gold-700); }
.oss-table td small.oss-or { display: inline; margin: 0 6px; }
.oss-all { border: 1px solid var(--line); background: var(--bg); }
.oss-all .table-scroll { padding: 0 14px 6px; background: var(--surface); border-top: 1px solid var(--line); }
.oss-all > summary, .oss-texts summary { display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
    list-style: none; cursor: pointer; padding: 13px 16px; font-size: 14.5px; font-weight: 700; color: var(--navy-800); }
.oss-all > summary::-webkit-details-marker, .oss-texts summary::-webkit-details-marker { display: none; }
/* 펼침 표시 +/− — 머리가 기준선 정렬이라 아이콘만 따로 가운데에 둡니다(아이콘: tokens.css) */
.oss-all > summary::after, .oss-texts summary::after { content: ''; flex: none; align-self: center; margin-left: auto;
    width: 16px; height: 16px; background: var(--gold-500);
    -webkit-mask: var(--icon-plus) center / contain no-repeat; mask: var(--icon-plus) center / contain no-repeat; }
.oss-all[open] > summary::after, .oss-texts details[open] > summary::after { -webkit-mask-image: var(--icon-minus); mask-image: var(--icon-minus); }
.oss-texts details { margin-bottom: 8px; border: 1px solid var(--line); background: var(--bg); }
.oss-texts summary small { font-size: 12.5px; font-weight: 500; color: var(--text-mute); }
.oss-texts pre { margin: 0; max-height: 440px; overflow: auto; padding: 16px; border-top: 1px solid var(--line);
    background: var(--surface); font-size: 12px; line-height: 1.6; white-space: pre-wrap; word-break: break-word; }
.oss-links { margin: 16px 0 0; padding-left: 18px; font-size: 13.5px; line-height: 1.9; color: var(--text-mute); }

/* 웹은 조항이 늘 펼쳐진 문서, 모바일은 아코디언입니다 */
@media (min-width: 961px) {
    .policy-sec > summary { pointer-events: none; }
    .sec-chev { display: none; }
}
@media (max-width: 960px) {
    .policy-doc { padding: 22px 18px; }
    .policy-sec { padding: 16px 0; }
    .sec-no { font-size: 16px; }
    .sec-title { font-size: 16.5px; }
    .sec-body { padding-left: 0; }
    .policy-links a { flex: 1; text-align: center; }
    .oss-sec > h2 { font-size: 16.5px; }
    .oss-texts summary { flex-wrap: wrap; row-gap: 2px; }
    .oss-texts summary small { order: 3; flex-basis: 100%; }
}