/* 처리방침·약관·관리 화면 공통. 토큰은 index.html 수묵 토큰과 같은 값(화선지·먹 3단계, 인주는 쓰지 않음)
   글꼴: Song Myung · IBM Plex Sans KR (둘 다 SIL OFL 1.1) */
:root{
  --paper:#F4F6F7; --sheet:#F8F9FA; --ink:#141618; --ink-2:#565C61; --ink-3:#5F666B; --ink-faint:#686E73; --line:#DCE1E3; --line-2:#E8EBED; --rule:#C3C9CC; --wash-face:#E3E7E9;
  --inju:#B5302A; --seal:var(--ink); --seal-soft:var(--wash-face); --grow:var(--ink); --grow-soft:var(--wash-face);
  --serif:"Song Myung",serif; --sans:"IBM Plex Sans KR",system-ui,sans-serif; --r:0;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#111315; --sheet:#16191B; --ink:#ECEEEF; --ink-2:#A3A9AE; --ink-3:#9AA1A6; --ink-faint:#7E868C; --line:#2A2F33; --line-2:#202427; --rule:#454C51; --wash-face:#1F2326; --inju:#E0513F;
  }
}
:root[data-theme="dark"]{
  --paper:#111315; --sheet:#16191B; --ink:#ECEEEF; --ink-2:#A3A9AE; --ink-3:#9AA1A6; --ink-faint:#7E868C; --line:#2A2F33; --line-2:#202427; --rule:#454C51; --wash-face:#1F2326; --inju:#E0513F;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.7;word-break:keep-all;-webkit-font-smoothing:antialiased}
.doc{max-width:640px;margin:0 auto;padding:16px 16px 72px}
.top{display:flex;justify-content:space-between;align-items:center;min-height:48px;border-bottom:1px solid var(--line);margin-bottom:28px}
.top a{color:var(--ink-2);text-decoration:none;font-size:.92rem;padding:12px 0;min-height:44px;display:inline-flex;align-items:center}
.top a:hover{color:var(--ink)}
.brand{font-family:var(--serif);font-weight:400;font-size:.95rem}
h1{font-family:var(--serif);font-weight:400;font-size:1.8rem;line-height:1.3;letter-spacing:-.02em;margin:0 0 8px}
h2{font-family:var(--serif);font-weight:400;font-size:1.12rem;line-height:1.4;margin:40px 0 10px}
p,li{color:var(--ink-2)}
p{margin:0 0 10px}
ul,ol{padding-left:1.2em;margin:0 0 10px}li{margin:4px 0}
b,strong{color:var(--ink)}
a{color:var(--ink);text-underline-offset:3px}
.lead{font-size:1.02rem;color:var(--ink-2);margin-bottom:6px}
.meta{font-size:.84rem;color:var(--ink-3)}
.draft{display:inline-block;font-size:.875rem;font-weight:500;color:var(--ink);border:1.5px solid var(--ink-faint);border-radius:0;padding:1px 7px;margin-left:6px;vertical-align:2px}
.ph{background:var(--seal-soft);color:var(--ink);border-radius:4px;padding:0 4px;font-weight:600}
.key{border:0;background:var(--wash-face);padding:12px 14px;border-radius:0;margin:18px 0}
.key p{color:var(--ink);margin:0}
.tbl{width:100%;border-collapse:collapse;font-size:.9rem;margin:6px 0 12px}
.tbl th,.tbl td{text-align:left;vertical-align:top;padding:10px 8px;border-bottom:1px solid var(--line)}
.tbl th{color:var(--ink);font-weight:700;white-space:nowrap}
.tbl td{color:var(--ink-2)}
.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.btn{display:inline-flex;justify-content:center;align-items:center;border:0;border-radius:var(--r);padding:12px 18px;min-height:44px;font:inherit;font-weight:700;font-size:.95rem;cursor:pointer;background:var(--ink);color:var(--paper)}
.btn.soft{background:transparent;color:var(--ink);border:1.5px solid var(--line)}
.btn:disabled{opacity:.4;cursor:not-allowed}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--inju);outline-offset:2px}
.box{border:1.5px solid var(--line);border-radius:var(--r);padding:14px;margin:12px 0;background:var(--sheet)}
.box p:last-child{margin-bottom:0}
footer.end{margin-top:56px;padding-top:14px;border-top:1px solid var(--line);font-size:.8rem;color:var(--ink-3)}
footer.end a{color:var(--ink-2);display:inline-flex;align-items:center;min-height:44px;padding:0 4px}

html,body{font-synthesis:none}
body{background-color:var(--paper)}
.meta{color:var(--ink-3)}
.box{border-color:var(--rule)}
.btn.soft{border-color:var(--ink-faint)}

/* 관리 화면·문서 입력칸: 앱과 같은 각진 담묵 테두리(둥근 모서리·회색 면 없음) */
input,select,textarea{border-radius:0!important;background:transparent!important;border:1.5px solid var(--ink-faint)!important;color:var(--ink)}
input:focus,select:focus,textarea:focus{border-color:var(--ink)!important;outline:none}
/* 좁은 화면·큰 글자: 표 머리도 줄바꿈해서 가로로 넘치지 않게 */
.tbl th{white-space:normal;word-break:keep-all;overflow-wrap:anywhere}
.tbl td{overflow-wrap:anywhere}
:where(.doc a){color:var(--ink);text-underline-offset:3px}

/* 10-16 버튼 체계(index.html 과 같은 세 단계): 주 = 먹 면 700 · 보조 = 직선 2px 중간 먹 600 · 링크 = 먹 글자 + 1.5px 밑줄. 초점은 먹 고리 */
.btn{min-height:48px;font-size:1rem;font-weight:700;letter-spacing:0}
.btn:active{background:var(--ink-2)}
.btn.soft{background:transparent;color:var(--ink);border:2px solid var(--ink-2);font-weight:600}
.btn.soft:active{background:var(--wash-face);border-color:var(--ink)}
@media (hover:hover){.btn.soft:hover{border-color:var(--ink)}}
.btn.btn:disabled{opacity:1;background:var(--wash-face);color:var(--ink-3);border:0;cursor:not-allowed}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2.5px solid var(--ink);outline-offset:3px}
.top a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--ink-2);text-decoration-thickness:1.5px;text-underline-offset:4px;font-weight:500}
:where(.doc a){text-decoration-color:var(--ink-2);text-decoration-thickness:1.5px}
footer.end a{color:var(--ink)}

/* 11-02 맨 아래 사업자 정보(앱 js/biz.js 와 같은 값) */
footer.end .biz{margin:12px 0 0;font-size:.8rem;line-height:1.65;color:var(--ink-3);overflow-wrap:anywhere}
footer.end .biz a{display:inline;min-height:0;padding:0;color:inherit}
.biz .nw{white-space:nowrap}
main.doc h3{font-family:var(--serif);font-weight:400;font-size:1rem;line-height:1.4;margin:24px 0 8px;color:var(--ink)}