@font-face{font-family:"Pretendard";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/Pretendard-Regular.woff2?v=5d17c883") format("woff2")}@font-face{font-family:"Pretendard";font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/Pretendard-Medium.woff2?v=5d17c883") format("woff2")}@font-face{font-family:"Pretendard";font-style:normal;font-weight:600;font-display:swap;src:url("/fonts/Pretendard-SemiBold.woff2?v=5d17c883") format("woff2")}@font-face{font-family:"Pretendard";font-style:normal;font-weight:700;font-display:swap;src:url("/fonts/Pretendard-Bold.woff2?v=5d17c883") format("woff2")}@font-face{font-family:"Pretendard";font-style:normal;font-weight:800;font-display:swap;src:url("/fonts/Pretendard-ExtraBold.woff2?v=5d17c883") format("woff2")}@font-face{font-family:"Pretendard Title Fallback";font-style:normal;font-weight:700 800;src:local("Apple SD Gothic Neo Bold"),local("Malgun Gothic Bold"),local("Noto Sans CJK KR Bold"),local("Arial Bold"),local("Arial");size-adjust:107%;ascent-override:90%;descent-override:22%;line-gap-override:0%}@font-face{font-family:"Pretendard Title Fallback";font-style:normal;font-weight:400 600;src:local("Apple SD Gothic Neo"),local("Malgun Gothic"),local("Noto Sans CJK KR"),local("Arial");size-adjust:106%;ascent-override:90%;descent-override:22%;line-gap-override:0%}:root{--bg:#ffffff;--fg:#0a0a0a;--fg-muted:#6e6e6e;--fg-faint:#6f6f6f;--line:#1a1a1a;--line-soft:#e6e6e6;--ease:cubic-bezier(0.16,1,0.3,1);--ease-emph:cubic-bezier(0.87,0,0.13,1);--side-pad:5vw;--container:1100px;--read:760px;--read-cjk:38em;--header-h:72px;--font:"Pretendard Variable","Pretendard","Pretendard Title Fallback","Apple SD Gothic Neo",Inter,system-ui,sans-serif;--mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono","Courier New",monospace;--code-border:#d4d4d4}html{color-scheme:light}:root{accent-color:var(--fg)}html{scrollbar-color:var(--fg) var(--bg);-webkit-text-size-adjust:100%;text-size-adjust:100%}::marker{color:var(--fg)}@media(prefers-reduced-motion:no-preference){@view-transition{navigation:auto}}@media(forced-colors:active){.grain{display:none}.masthead.is-scrolled{background:Canvas!important;backdrop-filter:none!important;border-bottom:1px solid CanvasText}}@media(max-width:900px){:root{--side-pad:20px;--header-h:68px}}@media(max-width:700px){:root{--header-h:72px}}.u-mt-6px{margin:6px 0 0}.u-mt-1{margin-top:1rem}.u-mt-1_2{margin-top:1.2rem}.u-mt-1_4{margin-top:1.4rem}.u-mt-2{margin-top:2rem}.u-mb-10{margin:0 0 10px}.u-num{text-align:right;font-variant-numeric:tabular-nums}.u-embed{width:100%;height:auto;display:block;border:1px solid var(--line-soft)} *{box-sizing:border-box}html,body{margin:0;padding:0}html{background:var(--bg);color:var(--fg);scroll-behavior:smooth;scroll-padding-top:88px}body{min-height:100vh;min-height:100svh;background:var(--bg);color:var(--fg);font-family:var(--font);font-size:15px;line-height:1.7;letter-spacing:-0.012em;-webkit-font-smoothing:antialiased}::selection{background:#0a0a0a;color:#fff}h1,h2,.type-headline,.row-title,.r-title{text-rendering:optimizeLegibility} a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button{color:inherit}:focus-visible{outline:2px solid var(--fg);outline-offset:3px}.skip-link{position:fixed;top:8px;left:8px;z-index:200;background:var(--bg);color:var(--fg);border:1px solid var(--fg);padding:10px 16px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;transform:translateY(-160%);opacity:0;transition:transform 160ms var(--ease),opacity 160ms var(--ease)}.skip-link:focus{transform:translateY(0);opacity:1;outline:2px solid var(--fg);outline-offset:2px}main.shell{scroll-margin-top:88px}main.shell:focus{outline:none}.shell{max-width:var(--container);margin:0 auto;padding:0 var(--side-pad)}.read-shell{max-width:var(--read);margin:0 auto}.micro{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-muted);font-weight:500;font-variant-numeric:tabular-nums}.micro-fg{color:var(--fg);font-weight:600} .masthead{position:fixed;top:0;left:0;right:0;z-index:100;padding:20px var(--side-pad);padding-top:max(20px,env(safe-area-inset-top));transition:all 400ms var(--ease);background:transparent}.masthead.is-scrolled{border-bottom:1px solid var(--line-soft);background:rgba(255,255,255,.85);backdrop-filter:blur(12px)}.mastbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;max-width:var(--container);margin:0 auto}.brand{display:inline-flex;align-items:center;min-height:24px;gap:10px;justify-self:start}.node-mark{width:24px;height:24px;display:block}.wordmark{font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:600}.tagline{font-size:11px;letter-spacing:0;text-transform:none;font-weight:400;color:var(--fg-muted);padding-left:10px;border-left:1px solid var(--line-soft);white-space:nowrap}.mast-title{justify-self:center;text-align:center;max-width:min(46vw,560px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:none;letter-spacing:-.01em;font-size:13px;color:var(--fg);opacity:0;transition:opacity 360ms var(--ease)}.masthead.is-scrolled .mast-title{opacity:1}.nav{display:flex;align-items:center;gap:4px;justify-self:end}.nav a,.nav button,.copy-link,.text-btn,.back{min-height:24px;box-sizing:border-box;border:1px solid transparent;background:transparent;padding:8px 14px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg);cursor:pointer;transition:background 280ms var(--ease),color 280ms var(--ease),border-color 280ms var(--ease)}.nav a:hover,.nav button:hover,.nav a[aria-current=true],.nav button[aria-current=true]{background:var(--fg);color:var(--bg)}.route-no{opacity:.4;margin-right:6px}.progress-track{position:fixed;left:0;right:0;top:72px;height:1px;background:var(--line-soft);z-index:99}.progress-fill{height:1px;background:var(--fg);width:0;transition:width 100ms linear}@keyframes hax-read-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}@supports (animation-timeline:scroll()){@media(prefers-reduced-motion:no-preference){.progress-fill{width:100%;transform-origin:left;transform:scaleX(0);will-change:transform;animation-name:hax-read-progress;animation-duration:auto;animation-timing-function:linear;animation-timeline:scroll(root block)}}} main.shell{padding:168px var(--side-pad) 96px}.back{display:inline-flex;border-color:var(--line);margin-bottom:42px}.back:hover,.copy-link:hover,.text-btn:hover{background:var(--fg);color:var(--bg)}.draft{display:inline-block;border:1px solid var(--line);padding:8px 12px;margin:0 0 28px}.article-head{margin:0 0 42px;padding-bottom:24px;border-bottom:1px solid var(--line-soft)}h1{font-size:clamp(28px,4vw,52px);font-weight:800;letter-spacing:-.03em;line-height:1.05;margin:0 0 18px;word-break:keep-all;text-wrap:balance}.article-meta{display:flex;gap:12px;flex-wrap:wrap;align-items:baseline}.tags{display:inline-flex;gap:10px;flex-wrap:wrap;margin:0;padding:0;list-style:none}.article-lead{max-width:min(var(--read),70ch);margin:0 0 24px;padding:14px 0;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);color:var(--fg);font-size:17px;line-height:1.7}.article-lead strong{font-weight:800}.body,.article-body{max-width:min(var(--read),70ch);font-size:clamp(1rem,0.875rem + 0.5vw,1.125rem);line-height:1.8;letter-spacing:-.003em;color:color-mix(in srgb,var(--fg) 86%,var(--bg));white-space:pre-wrap;word-break:break-word}html[lang="ko"] .body,html[lang="ko"] .article-body,html[lang="ko"] .article-lead{max-width:var(--read-cjk);word-break:keep-all;overflow-wrap:anywhere}/* 측정폭(measure): 한국어=--read-cjk 38em(~38 CJK자/행, WCAG1.4.8 상한40·CJK=Latin½). en(Latin)=min(--read,70ch) — 760px는 18px본문서 ≈84 CPL 과폭이라 66–75 스위트스팟(Bringhurst 66ch·Baymard)으로 캡. 공유 --read(comments/search/related)는 불변 */.article-body p,.body p{margin:0 0 1.6em}.body h2,.article-body h2{font-weight:700;font-size:20px;letter-spacing:-.016em;margin:2.5em 0 .7em}.body h4,.article-body h4{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-muted);font-weight:500;margin:2em 0 .7em}.body blockquote,.article-body blockquote{border-left:2px solid var(--fg);padding-left:14px;margin:1.8em 0;color:var(--fg-muted)}/* ★본문 인라인 링크 가시화(치명) — 기존 a{color:inherit;text-decoration:none}로 마크다운 출처/인용 링크가 본문과 구별 불가였다(미션 '참조=마크다운 링크'·북극성 AI인용과 배치, WCAG1.4.1 위반). 산문 속 링크는 밑줄이 가장 보편·강력한 어포던스(NN/G·WebAIM). skip-ink=디센더/한글받침 관통 방지(난독 가독). 색은 --fg(본문 86%보다 진해 링크-대-텍스트 대비도 확보) + hover/focus-visible에 밑줄 굵기·배경으로 이중 어포던스. 제목앵커 (.rich-anchor '#')는 프로즈 링크 아니라 제외. */ .article-body a:not(.rich-anchor),.body a:not(.rich-anchor),.rich a:not(.rich-anchor),.article-lead a{color:var(--fg);text-decoration:underline;text-decoration-thickness:1px;text-decoration-skip-ink:auto;text-underline-offset:2px;transition:background 120ms var(--ease)} .article-body a:not(.rich-anchor):hover,.article-body a:not(.rich-anchor):focus-visible,.body a:not(.rich-anchor):hover,.body a:not(.rich-anchor):focus-visible,.rich a:not(.rich-anchor):hover,.rich a:not(.rich-anchor):focus-visible,.article-lead a:hover,.article-lead a:focus-visible{text-decoration-thickness:2px;background:var(--line-soft)} /* 인용 마커 프로미넌스(북극성=AI citation 신뢰신호): richbody가 '~에 따르면/according to' 1차출처 링크에 붙이는 .rich-cite를 일반 본문 링크보다 미세 강조 — 선행 인용부호(muted)+weight 500. 밑줄은 본문링크 규칙 상속. 우리 스스로 1차출처 인용을 도드라지게 = 독자 신뢰↑ + '좋은 인용' 패턴 모델링. 인용부호는 장식(SR 무해). */ .rich-cite{font-weight:500} .rich-cite::before{content:"\201C";margin-right:.5px;color:var(--fg-muted);font-weight:400} code{background:var(--line-soft);padding:1px 4px;border-radius:2px;font-family:var(--mono);font-size:.92em}pre{background:var(--line-soft);padding:12px 14px;overflow:auto;font-family:var(--mono);border:1px solid var(--code-border)}.share-row{display:flex;gap:10px;flex-wrap:wrap;margin:28px 0 0}.copy-link,.text-btn{border-color:var(--line);font-size:11px;padding:8px 12px;transition:background 200ms var(--ease),color 200ms var(--ease),border-color 200ms var(--ease)}.copy-link.copied{background:var(--fg);color:var(--bg)} .article-head .section-kicker{margin:0 0 10px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg);font-weight:600}.article-meta .verified{color:var(--fg)}.trust-strip{display:flex;flex-wrap:wrap;align-items:center;gap:0;margin:-18px 0 32px;color:var(--fg-muted)}.trust-strip[data-pos=bottom]{margin:34px 0 0;padding-top:14px;border-top:1px solid var(--line-soft)}.trust-strip .trust-item{display:inline-flex;align-items:center;gap:5px}.trust-strip .trust-item+.trust-item{margin-left:12px;padding-left:12px;border-left:1px solid var(--line)}.trust-strip strong{color:var(--fg);font-weight:700}.trust-strip .trust-model{color:var(--fg-faint)}.article-meta .update-note{color:var(--fg-muted);text-transform:none;letter-spacing:0;font-weight:400} .comments,.related,.subscribe{max-width:var(--read);margin-top:58px;border-top:1px solid var(--line-soft);padding-top:18px;content-visibility:auto;contain-intrinsic-size:auto 480px}.comments h2,.related h2,.subscribe label{margin:0 0 16px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg);font-weight:600}.cmt-list,.r-list{list-style:none;margin:0;padding:0}.cmt{border-bottom:1px solid var(--line-soft);padding:16px 0}.cmt-h{margin-bottom:6px}.cmt-b{white-space:pre-wrap;margin:0}.cmt-form{max-width:var(--read);margin-top:20px;display:flex;flex-direction:column;gap:14px}.cmt-field{display:flex;flex-direction:column;gap:6px}.cmt-field label{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg);font-weight:600}.cmt-opt{color:var(--fg-muted);text-transform:none;letter-spacing:0;font-weight:400}.cmt-input,.cmt-textarea{width:100%;box-sizing:border-box;background:var(--bg);color:var(--fg);border:1px solid var(--line);border-radius:0;font-size:16px;padding:10px 14px;font-family:var(--font)}.cmt-textarea{resize:vertical;min-height:104px;line-height:1.6}.cmt-input:focus,.cmt-textarea:focus{outline:2px solid var(--fg);outline-offset:2px}.cmt-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:2px}.cmt-status{margin:0;font-size:12px;color:var(--fg-muted);text-transform:none;letter-spacing:0}.muted{color:var(--fg-muted)}.r-list a{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:baseline;border-top:1px solid var(--line-soft);padding:18px 0;transition:background 280ms var(--ease),color 280ms var(--ease),margin 280ms var(--ease),padding 280ms var(--ease)}.r-list a:hover{background:var(--fg);color:var(--bg);margin:0 -24px;padding:18px 24px}.r-title{font-size:18px;font-weight:700;letter-spacing:-.024em;line-height:1.1}.search-form{display:flex;gap:8px;margin:6px 0 14px;max-width:var(--read)}.search-input{flex:1;min-width:0;background:var(--bg);color:var(--fg);border:1px solid var(--line);border-radius:0;font-size:16px;padding:10px 14px;font-family:var(--font)}.search-input:focus{outline:2px solid var(--fg);outline-offset:2px}.search-status{text-transform:none;letter-spacing:normal;color:var(--fg-muted);margin:0}.search-suggest{max-width:var(--read);margin-top:40px;border-top:1px solid var(--line-soft);padding-top:20px}.search-suggest .filters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px}.search-suggest .tag-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);color:var(--fg);text-decoration:none;font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:9px 14px;transition:background 200ms var(--ease),color 200ms var(--ease)}.search-suggest .tag-chip:hover,.search-suggest .tag-chip:focus-visible{background:var(--fg);color:var(--bg)}.search-suggest .tag-chip .count{opacity:.5}.r-snip{color:var(--fg-muted);margin:6px 0 0;line-height:1.5;max-width:var(--read);word-break:break-word}.sub-ai-context{display:block;margin:0 0 16px;padding:10px 14px;font-size:13px;line-height:1.5;font-weight:600;color:var(--fg);border-left:2px solid var(--fg);background:var(--line-soft)}.sub-row{display:flex;gap:8px;flex-wrap:wrap}.subscribe input{flex:1;min-width:220px;background:var(--bg);color:var(--fg);border:1px solid var(--line);border-radius:0;font-size:16px;padding:9px 12px}.subscribe input:focus{outline:2px solid var(--fg);outline-offset:2px}.subscribe button{border:1px solid var(--line);background:transparent;color:var(--fg);font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:8px 12px;cursor:pointer;transition:background 200ms var(--ease),color 200ms var(--ease)}.subscribe button:hover{background:var(--fg);color:var(--bg)}.grain{position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.04;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")} .fade-in{opacity:0;transform:translateY(20px);transition:opacity 400ms var(--ease),transform 400ms var(--ease)}.fade-in.is-visible{opacity:1;transform:none}@keyframes blink{0%,49%{opacity:1}50%,100%{opacity:0}}@media(max-width:900px){.masthead{padding-bottom:16px}.mastbar{grid-template-columns:1fr auto}.nav{gap:0}.route-no{display:none}.wordmark{max-width:38vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.progress-track{top:68px}main.shell{padding-top:144px}.grain{display:none}.r-list a{grid-template-columns:1fr}.r-list a:hover{margin:0;padding:18px 0;background:transparent;color:var(--fg)}}@media(max-width:700px){.tagline{max-width:42vw;overflow:hidden;text-overflow:ellipsis;padding-left:8px}.masthead{padding-bottom:14px;background:var(--bg);border-bottom:1px solid var(--line-soft);backdrop-filter:none}.masthead.is-scrolled{background:var(--bg);backdrop-filter:none}.mastbar{grid-template-columns:auto minmax(0,1fr);gap:12px}.mastbar>.micro{display:none}.brand{min-width:0}.wordmark{max-width:28vw}.nav{justify-self:end;min-width:0;gap:2px}.nav a,.nav button{padding:6px 8px;font-size:11px;letter-spacing:.04em}.nav a[href="/about"],.nav a[href$="#about"]{display:none}.progress-track{top:72px}main.shell{padding-top:128px}}@media(max-width:640px){.nav a,.nav button{padding:6px 8px;font-size:11px}.brand{gap:8px}.node-mark{width:24px}.sub-row{display:block}.subscribe button{width:100%;margin-top:8px}.subscribe input{width:100%;min-width:0}} @media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.fade-in{opacity:1;transform:none}.progress-fill{transition:none}} /* ── 표준 컴포넌트 partial: 인라인 구독 CTA + 비교표(B&W 에디토리얼·스캔 가능·접근성) ── */ .inline-cta{max-width:var(--read);margin:40px 0;padding:22px 24px;border:1px solid var(--line);background:transparent} .inline-cta-kicker{margin:0 0 6px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-muted);font-weight:600} .inline-cta-copy{margin:0 0 16px;font-size:15px;line-height:1.5;color:var(--fg)} .inline-cta-form{display:flex;gap:10px;flex-wrap:wrap} .inline-cta-form input{flex:1;min-width:200px;background:var(--bg);color:var(--fg);border:1px solid var(--line);border-radius:0;font-size:16px;padding:9px 12px} .inline-cta-form input:focus{outline:2px solid var(--fg);outline-offset:2px} .inline-cta-form button{border:1px solid var(--line);background:var(--fg);color:var(--bg);font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:9px 16px;cursor:pointer;transition:opacity 200ms var(--ease)} .inline-cta-form button:hover{opacity:.82} .inline-cta-status{margin:10px 0 0;color:var(--fg-muted)}.inline-cta-status:empty{display:none} .citation-hook{max-width:var(--read);margin:0 0 34px;padding:16px 0;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)} .citation-kicker{margin:0 0 6px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-muted);font-weight:600} .citation-copy{margin:0 0 12px;font-size:15px;line-height:1.55;color:var(--fg)} .citation-copy a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;word-break:break-all} .citation-data{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:6px 14px;margin:0;font-size:13px;line-height:1.5} .citation-data dt{color:var(--fg-muted);font-weight:600} .citation-data dd{margin:0;word-break:break-word} .citation-action{margin:12px 0 0;font-size:13px;line-height:1.5;color:var(--fg-muted)} .citation-action a{color:var(--fg);text-decoration:underline;text-underline-offset:3px} .cmp{max-width:var(--read);margin:32px 0;overflow-x:auto} .cmp table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.45} .cmp caption{caption-side:top;text-align:left;margin:0 0 12px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-muted);font-weight:600} .cmp th,.cmp td{padding:11px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line-soft)} .cmp thead th{border-bottom:1px solid var(--line);font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--fg);font-weight:600;white-space:nowrap} .cmp tbody th[scope=row]{font-weight:600;color:var(--fg);white-space:nowrap} .cmp td{color:var(--fg-muted);font-variant-numeric:tabular-nums} .cmp td.cmp-num{text-align:right;white-space:nowrap} .cmp tbody tr:hover{background:color-mix(in srgb,var(--fg) 4%,transparent)} @media(max-width:560px){.inline-cta{padding:18px}.inline-cta-form{flex-direction:column}.inline-cta-form button{width:100%}.citation-data{grid-template-columns:1fr}.cmp table{font-size:13px}.cmp th,.cmp td{padding:9px 10px}} a.section-kicker{display:inline-block;text-decoration:none;transition:color 200ms var(--ease)} a.section-kicker:hover,a.section-kicker:focus-visible{color:var(--fg-muted)} .site-footer{max-width:var(--container);margin:0 auto;padding:0 var(--side-pad) 44px;color:var(--fg-muted);font-size:12px;line-height:1.6} .foot-links{display:flex;gap:14px;flex-wrap:wrap;border-top:1px solid var(--line-soft);padding-top:16px} .foot-links a{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg)} .pillar-assets{max-width:var(--read);margin:40px 0 0;padding-top:18px;border-top:1px solid var(--line-soft)} .pillar-assets-h{margin:0 0 12px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg);font-weight:600} .pillar-assets-nav{display:flex;gap:10px;flex-wrap:wrap} .pillar-assets-sub{display:inline-flex;align-items:center;min-height:24px;color:var(--muted);font-size:11px;font-weight:600} .pillar-assets-nav a{display:inline-flex;align-items:center;min-height:24px;box-sizing:border-box;border:1px solid var(--line);color:var(--fg);text-decoration:none;font-size:12px;padding:6px 12px;transition:background 200ms var(--ease),color 200ms var(--ease)} .pillar-assets-nav a:hover,.pillar-assets-nav a:focus-visible{background:var(--fg);color:var(--bg)} .foot-links a[aria-current="page"]{text-decoration:underline;text-underline-offset:3px} .foot-note{max-width:var(--read);margin:12px 0 0} .foot-note a{text-decoration:underline;text-underline-offset:3px} .post-img{max-width:var(--read);margin:34px 0}.post-img img{width:100%;height:auto;display:block;border:1px solid var(--line-soft)}.post-img img:not([width]){aspect-ratio:16/9;object-fit:contain}.post-img figcaption{margin-top:8px;color:var(--fg-muted)}.post-img.missing-media{margin:22px 0;padding:12px 14px;border:1px dashed var(--line-soft);border-radius:6px;color:var(--fg-muted);background:color-mix(in srgb,currentColor 4%,transparent)} .data-chart{max-width:var(--read);margin:28px 0 8px;overflow-x:auto} .data-chart svg{max-width:100%;height:auto;display:block;border:1px solid var(--line-soft);border-radius:8px;background:#fff} .data-chart figcaption{margin-top:8px;color:var(--fg-muted);font-size:13px} html,body{overflow-x:hidden} .body img,.article-body img,.rich img{max-width:100%;height:auto} .body table,.article-body table,.rich table{max-width:100%} .lang-toggle{display:inline-flex;align-items:center;min-height:24px;box-sizing:border-box;border:1px solid var(--line);padding:8px 12px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg);transition:background 200ms var(--ease),color 200ms var(--ease)}.lang-toggle:hover{background:var(--fg);color:var(--bg)} /* 인쇄/PDF 저장 품질: 크롬·상호작용 요소 숨김, 흑백 본문, 참고 링크 URL 노출, 블록 페이지브레이크 보호. */ @media print{ .masthead,.progress-track,.grain,.skip-link,.toast,.back,.share-row,.subscribe,.subscribe-wrap,.comments,.related,.cmt-form,.lang-toggle,nav{display:none!important} main.shell{padding:0!important;max-width:none} html,body{background:#fff!important;color:#000!important} .body,.article-body,.rich,.article-head h1,h1{color:#000!important;max-width:none} a{color:#000!important} .rich a[href^="http"]::after,.body a[href^="http"]::after,.article-body a[href^="http"]::after{content:" (" attr(href) ")";font-size:.85em;word-break:break-all} .cmp,figure,blockquote,pre,table,img,.rich-h{break-inside:avoid;page-break-inside:avoid} } .r-list li{display:flex;align-items:center;gap:12px}.r-list li>a{flex:1;min-width:0} .r-en{display:inline-flex;align-items:center;min-height:24px;box-sizing:border-box;flex:none;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-muted);border:1px solid var(--line-soft);padding:2px 7px;transition:color 200ms var(--ease),border-color 200ms var(--ease)}.r-en:hover{color:var(--fg);border-color:var(--fg)} .site-footer{max-width:var(--read);margin:72px auto 0;padding:24px var(--side-pad) 56px;border-top:1px solid var(--line-soft);content-visibility:auto;contain-intrinsic-size:auto 160px} .site-footer .foot-links{display:flex;flex-wrap:wrap;gap:6px 20px;margin-bottom:14px} .site-footer .foot-links a{display:inline-flex;align-items:center;min-height:24px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--fg)} .site-footer .foot-links a:hover,.site-footer .foot-links a:focus-visible{text-decoration:underline;text-underline-offset:3px} .site-footer .foot-note{margin:0;font-size:12px;line-height:1.6;color:var(--fg-muted)} .site-footer .foot-note a{color:var(--fg);text-decoration:underline;text-underline-offset:2px} /* Windows 고대비(Forced Colors Mode): 배경색 의존 상태를 시스템 컬러로 복원 + 포커스 대비 + 장식 제거. ref: MDN forced-colors. */ @media(forced-colors:active){ .r-list a:hover,.search-suggest .tag-chip:hover,.search-suggest .tag-chip:focus-visible{background:Highlight;color:HighlightText} .section-kicker,.comments h2,.related h2,.sub-label{color:CanvasText} :focus-visible,.input:focus,.textarea:focus,.search-input:focus,.subscribe input:focus{outline:2px solid Highlight;outline-offset:2px} .progress-fill{background:Highlight} .grain{display:none} } .lang-switch{display:inline-flex;align-items:center;gap:2px;margin-left:6px;padding-left:8px;border-left:1px solid var(--line-soft)}.lang-opt{min-height:24px;box-sizing:border-box;border:1px solid transparent;padding:6px 8px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-muted);text-decoration:none;transition:background 220ms var(--ease),color 220ms var(--ease)}.lang-opt:hover{color:var(--fg)}.lang-opt[aria-current=page]{color:var(--fg);font-weight:600} /* 코드블록 복사버튼 + 언어/파일명 헤더 — richbody가 .rich-codewrap>.rich-copy(+선택 .rich-code-head) 마크업·JS를 이미 방출하나 CSS가 없어 라이브에서 미스타일 렌더됐다(HTML/JS는 셸됨). 여기서 미니멀 보강. pre 우상단 절대배치, hover/포커스에 노출(터치는 상시), [data-copied]로 ✓ 상태. reduced-motion 무전환. */ .rich-codewrap{position:relative;margin:26px 0} .rich-code-head{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--line-soft);border:1px solid var(--code-border);border-bottom:0;padding:7px 14px;font-family:var(--mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--fg-muted)} .rich-codewrap.has-head .rich-pre{margin-top:0} /* 헤더 하단선이 구분선 역할 → pre는 상단선 유지(이중선 아님, 헤더 border-bottom:0) */ /* CSS-only diff 강조(JS 없이 스캔성↑): richbody가 ```diff의 +/- 줄을 .diff-add/.diff-del span으로 감싼다. ★인라인 span+줄바꿈은 텍스트에 유지 → code.textContent 복사가 원본 diff(줄바꿈 포함) 그대로. 색+기호(+/-)로 이중 인코딩(색맹 안전). 색은 무채 미니멀 예외로 저채도 녹/적만(의미 전달 최소). */ .rich-pre .diff-add{background:color-mix(in srgb,#1a7f37 15%,transparent)} .rich-pre .diff-del{background:color-mix(in srgb,#c0392b 13%,transparent)} .rich-copy{position:absolute;top:8px;right:8px;z-index:2;display:inline-flex;align-items:center;gap:6px;box-sizing:border-box;border:1px solid var(--line);background:var(--bg);color:var(--fg);font-family:var(--mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;padding:6px 10px;cursor:pointer;opacity:.6;transition:opacity 180ms var(--ease),background 180ms var(--ease),color 180ms var(--ease)} .rich-codewrap:hover .rich-copy,.rich-copy:focus-visible{opacity:1} .rich-copy:hover,.rich-copy:focus-visible,.rich-copy[data-copied="1"]{background:var(--fg);color:var(--bg);opacity:1} .rich-copy-i{width:14px;height:14px;display:block;flex:none} @media (pointer:coarse){.rich-copy{min-height:44px;padding:9px 13px;opacity:1}} @media (prefers-reduced-motion:reduce){.rich-copy{transition:none}} /* participate_block partial (moved from inline