
:root{--ink:#1d1d1b;--mute:#5d5b55;--line:#e3e1db;--bg:#fbfaf7;--side:#f1efe9;--accent:#2a78d6}
*{box-sizing:border-box} html{scroll-padding-top:16px}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Noto Sans","Noto Sans KR",system-ui,-apple-system,"Segoe UI",sans-serif;font-weight:400;-webkit-font-smoothing:antialiased;word-break:keep-all;overflow-wrap:break-word}
b,strong{font-weight:700} h1,h2,h3{font-weight:700;letter-spacing:-0.01em}
a{color:var(--accent)} header.top{display:none}
nav.side{position:fixed;top:0;left:0;bottom:0;width:300px;overflow:auto;background:var(--side);border-right:1px solid var(--line);padding:18px 14px 40px;font-size:13.5px;line-height:1.45}
nav.side .brand{display:block;text-decoration:none;color:var(--ink);font-weight:800;font-size:16px}
nav.side .brand small{display:block;font-weight:500;color:var(--mute);font-size:12.5px;margin-top:2px}
nav.side input{width:100%;margin:12px 0 8px;padding:7px 9px;border:1px solid #cfccc3;border-radius:6px;font:inherit;background:#fff}
nav.side a.top,nav.side a.sub{display:block;text-decoration:none;color:#333;padding:4px 6px;border-radius:5px}
nav.side a.top{font-weight:700;margin-top:7px} nav.side a.sub{padding-left:18px;color:#555}
nav.side a.folded{display:none} nav.side a.current{background:#dcd9d0;color:#000}
nav.side a.part{display:block;text-decoration:none;color:#0d1f4a;font-weight:800;font-size:14px;margin:16px 0 2px;padding:5px 6px;border-radius:5px;border-top:1px solid #d6d2c8}
nav.side a.chap{padding-left:12px} nav.side a.sec{padding-left:26px}
nav.side a:hover{background:#e4e1d9} .nav-part{margin:14px 6px 2px;font-weight:800;color:var(--mute);font-size:12px}
#results a{display:block;padding:5px 6px;border-radius:5px;text-decoration:none;color:#222}
#results a small{display:block;color:var(--mute)} #results a:hover{background:#e4e1d9}
main{margin-left:300px;padding:34px 48px 60px;max-width:980px}
article h1{font-size:28px;line-height:1.35;margin:0 0 18px} article h2{font-size:21px;margin:34px 0 10px}
article h3{font-size:17.5px;margin:24px 0 8px}
article p,article li{font-size:17px;line-height:1.75;letter-spacing:-0.003em} article li{margin:3px 0}
article img{max-width:100%;height:auto;border:1px solid #dddad2;border-radius:8px;margin:14px 0 4px;background:#fff}
article p>em:only-child{display:block;color:var(--mute);font-size:13.8px;line-height:1.6;margin-top:-4px}
article table{border-collapse:collapse;margin:14px 0;font-size:14.5px;display:block;overflow-x:auto}
article th,article td{border:1px solid #d9d6ce;padding:6px 10px;vertical-align:top} article th{background:#efede7}
article blockquote{margin:14px 0;padding:6px 16px;border-left:4px solid #c9c5ba;background:#f2f0ea;color:#3d3c38}
article code{background:#efede7;padding:1px 5px;border-radius:4px;font-size:.92em}
.callout{margin:18px 0;padding:10px 18px 6px;border-radius:10px;border:1px solid #d9e4f7;background:#f3f7fe}
.callout.tip{border-color:#cfe6d6;background:#f1f8f3} .callout.warning{border-color:#f1d9b8;background:#fdf6ec}
.callout-title{margin:2px 0 4px!important;font-weight:700;font-size:13px!important;letter-spacing:.04em;color:#1d56d8}
.callout.tip .callout-title{color:#1f7a45} .callout.warning .callout-title{color:#a8630b}
.callout.site{border:2px solid #1d56d8;background:linear-gradient(180deg,#eef4ff,#f7faff);padding:14px 20px 8px;box-shadow:0 4px 14px rgba(29,86,216,.10)}
.callout.site .callout-title{font-size:15px!important;letter-spacing:0;color:#0d1f4a}
.callout.site a{font-weight:700}
.footnote{font-size:13.5px;color:var(--mute)} .footnote hr{border:0;border-top:1px solid var(--line)}
.cover-img{width:230px;max-width:40%;float:right;margin:0 0 16px 24px;border-radius:10px;box-shadow:0 6px 24px rgba(10,20,48,.25)}
.pager{display:flex;justify-content:space-between;gap:16px;margin-top:40px;padding-top:18px;border-top:1px solid var(--line)}
.pager a{text-decoration:none;max-width:48%} .pager small{display:block;color:var(--mute);font-size:12px}
footer{margin-top:40px;color:var(--mute);font-size:12.5px;line-height:1.7}
.cover{padding:28px 0 8px} .cover h1{font-size:34px;margin:0} .cover .sub{font-size:20px;color:var(--mute);margin:6px 0 18px}
.cover .by{font-weight:700} .toc h2{font-size:17px;margin:22px 0 6px} .toc a{display:block;padding:3px 0;text-decoration:none}
.toc a.sub{padding-left:18px;color:#444;font-size:15px}
.toc h2.part{font-size:19px;margin:30px 0 4px;padding-top:12px;border-top:2px solid #0d1f4a} .toc h2.part a{color:#0d1f4a}
.toc h3{font-size:16px;margin:14px 0 4px;padding-left:10px}
@media (max-width:900px){nav.side{position:static;width:auto;border-right:0;border-bottom:1px solid var(--line)}
 nav.side a.sub{display:none} nav.side.open a.sub{display:block} main{margin-left:0;padding:22px 18px 40px}
 header.top{display:block;padding:10px 16px;background:var(--side)}}
/* sitebtn */.sitebtns{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}.sitebtns a{display:inline-flex;align-items:center;gap:6px;box-sizing:border-box;padding:4px 10px;border:1px solid;border-radius:6px;font-size:13px;line-height:1.3;font-weight:400;text-decoration:none;color:#fff;white-space:nowrap}.sitebtns a.p{background:#2b4c9b;border-color:#2b4c9b}.sitebtns a.r{background:#0e6b6b;border-color:#0e6b6b}.sitebtns a svg{flex:none;display:block}.sitebtns a:hover{filter:brightness(.88)}.sitesocial{position:sticky;bottom:-40px;margin:14px -14px -40px;padding:8px 14px 10px;background:var(--side);border-top:1px solid var(--line);z-index:2}.sitesocial>div{margin:0!important}.sitesocial a[data-social]:hover{border-color:#8a93a6!important}@media (max-width:768px){.sitebtns a{min-height:44px;padding:2px 14px}.sitesocial a[data-social]{width:44px!important;height:44px!important}}

.d-nocover{display:block!important}.d-hero{display:grid;grid-template-columns:minmax(0,260px) 1fr;gap:28px;align-items:start;margin:8px 0 22px}
.d-hero img{width:100%;height:auto;border-radius:6px;box-shadow:0 6px 22px rgba(18,22,31,.2)}
.d-series{font-size:12.5px;font-weight:700;letter-spacing:.6px;color:#0e6b6b;margin:0 0 6px}
.d-sub{color:#5b6475;font-size:1.05em;margin:.2em 0 .6em}
.d-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:10px 0}
.d-card{border:1px solid #d9dde7;border-radius:12px;padding:14px 16px;background:#fff}
.d-card b.big{display:block;font-size:1.35em;color:#0e6b6b;margin-bottom:4px}.d-card p{margin:0;font-size:.95em}
.d-how{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:10px 0}.d-how div{border:1px solid #d9dde7;border-radius:12px;padding:12px 14px;background:#f5f8f8}.d-how h3{margin:0 0 4px;font-size:1em}.d-how p{margin:0;font-size:.95em}
.d-open{border-left:3px solid #c9a24a;background:#fffaf0;border-radius:0 10px 10px 0;padding:10px 14px}.d-open li{margin:5px 0}
.d-fig img{max-width:100%;height:auto;border:1px solid #d9dde7;border-radius:8px}.d-fig figcaption{font-size:.9em;color:#5b6475;margin-top:6px}
.d-log{background:#e3f2f1;border:1px solid #d9dde7;border-radius:12px;padding:14px 16px}
.d-btn{display:inline-block;margin-top:8px;padding:9px 16px;border-radius:8px;background:#0e6b6b;color:#fff!important;font-weight:700;text-decoration:none}
.d-btn.sub{background:#fff;color:#0e6b6b!important;border:1px solid #0e6b6b}
.d-note{color:#5b6475;font-size:.9em}.d-notice{margin-top:22px;padding-top:12px;border-top:1px solid #d9dde7;color:#5b6475;font-size:.9em}
.d-pager{display:flex;justify-content:space-between;gap:12px;margin:28px 0 8px;font-size:.95em}
@media (max-width:760px){.d-hero{grid-template-columns:1fr}.d-hero img{max-width:220px}.d-cards,.d-how{grid-template-columns:1fr}}
