/* 개인정보 처리방침 · 이용약관 (#privacy, #terms; dist/policy.mjs) and their links in the drawer and the page foot.
   Reading pages: one narrow column, body text at 15px, tables that scroll sideways on their own on small screens.
   The links are <nav> elements, so the global nav rules of style.css/theme.css are reset here (class beats element). */

.policy{max-width:760px;margin:0 auto;color:var(--ink);word-break:keep-all;overflow-wrap:anywhere}
.policy-head{margin:0 0 28px;padding:0 0 22px;border-bottom:1px solid var(--line)}
.policy-head h1{margin:12px 0 8px;font-family:var(--serif-ko);font-size:clamp(28px,4vw,38px);font-weight:700;line-height:1.3;letter-spacing:-.02em}
.policy-head h1:focus{outline:none}
.policy-head h1:focus-visible{outline:3px solid #1682a2;outline-offset:6px}
.policy-meta{margin:0;font-size:13px;color:var(--muted)}
.policy-draft{margin:16px 0 0;padding:12px 16px;border:1px solid var(--line-2);border-left:3px solid var(--brand-ink);border-radius:var(--r-s);background:var(--surface);font-size:13px;line-height:1.7;color:var(--ink-2)}

.policy-toc{margin:0 0 32px;padding:16px 20px;border:1px solid var(--line);border-radius:var(--r-m);background:var(--surface)}
.policy-toc ol{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:2px 24px;margin:0;padding:0 0 0 22px;font-size:13px;color:var(--muted)}
.policy-toc li{padding-left:2px}
.policy-toc button{display:block;width:100%;min-height:40px;margin:0;padding:6px 0;border:0;border-radius:0;background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.policy-toc button:hover{background:none;color:var(--brand-ink);text-decoration:underline}

.policy-section{margin:0 0 34px}
/* Clear of the sticky site bar (journal.css, taller on narrow screens) when a contents button scrolls here. */
.policy-section h2{margin:0 0 12px;scroll-margin-top:120px;font-family:var(--serif-ko);font-size:21px;font-weight:700;line-height:1.4}
.policy-section h2:focus{outline:none}
.policy-section h2:focus-visible{outline:3px solid #1682a2;outline-offset:4px}
.policy-section p,.policy-section li{font-size:15px;line-height:1.85}
.policy-section p{margin:0 0 12px}
.policy-section ul{margin:0 0 14px;padding-left:20px}
.policy-section li+li{margin-top:4px}
.policy-note{padding:12px 16px;border-radius:var(--r-s);background:var(--surface);border:1px solid var(--line)}
.policy-pending{padding:1px 8px;border:1px dashed var(--line-2);border-radius:999px;font-size:13px;color:var(--muted);white-space:nowrap}
.policy a{color:var(--brand-ink);text-decoration:underline;text-underline-offset:3px}

.policy-table{margin:0 0 16px;overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-s);background:var(--surface)}
.policy-table:focus-visible{outline:3px solid #1682a2;outline-offset:2px}
.policy-table table{width:100%;min-width:620px;border-collapse:collapse;font-size:13px;line-height:1.7}
.policy-table caption{padding:10px 14px 0;text-align:left;font-size:12px;font-weight:700;color:var(--muted)}
.policy-table th,.policy-table td{padding:10px 14px;border-top:1px solid var(--line);text-align:left;vertical-align:top}
.policy-table thead th{border-top:0;font-size:12px;color:var(--muted);white-space:nowrap}
.policy-table tbody th{font-weight:700;white-space:nowrap}

.policy-section .policy-links{list-style:none;padding:0}
/* A <footer> inside #main: experience.css resets those to nothing; the class rule adds its own back. */
.policy-foot{display:flex;flex-wrap:wrap;gap:10px 22px;margin:40px 0 0;padding:20px 0 0;border-top:1px solid var(--line)}
.policy-foot a{display:inline-flex;align-items:center;min-height:44px;font-size:14px;font-weight:600}

/* Drawer (내 공간): one quiet row of text links under the shortcuts. */
.drawer-legal{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:0 18px;width:auto;margin:14px 0 0;padding:0}
.drawer-legal a{display:inline-flex;align-items:center;min-height:44px;padding:0;font-size:13px;font-weight:500;color:var(--muted);text-decoration:underline;text-underline-offset:3px;white-space:normal}
.drawer-legal a:hover{color:var(--brand-ink)}

/* Page foot. */
.footer-legal{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:0 16px;width:auto;margin:0;padding:0}
.footer-legal a{display:inline-flex;align-items:center;min-height:44px;padding:0;font-size:12px;font-weight:600;color:var(--ink-2);white-space:normal}
.footer-legal a:hover{color:var(--brand-ink);text-decoration:underline}

@media (max-width:700px){
 .policy-section p,.policy-section li{font-size:14px}
 .policy-toc{padding:12px 14px}
 .policy-toc ol{grid-template-columns:1fr}
}
