/* Column page (scripts/lib/insights.mjs renders the markup).
   Hero: title, dek and byline on the left; from 1100px a cover card on the right — the post's cover or the category's
   contour pattern, then 「이 글의 근거」 (sources, as-of date, review, reading time, updates, AI use). Below 1100px the
   card is a compact strip under the byline.
   Body: contents rail · article · margin column (≥1240px), rail · article (≥1024px), one column below that with the
   contents in a collapsed <details> before the summary and the rail's consult box after the FAQ.
   Margin notes (aside.sn, the first citation of each source and the first use of each term) follow the tufte-css
   sidenote pattern — float:right; clear:right; a fixed width — tufte-css by Dave Liepmann, MIT License,
   https://github.com/edwardtufte/tufte-css. Here the article column spans the margin track and its blocks keep to
   --measure, so notes need no negative margins and figures and wide tables break out by dropping the measure (and
   clearing the notes, so nothing overlaps). */

/* ---------- hero ---------- */
.art-hero{padding-top:calc(env(safe-area-inset-top,0px) + 124px);padding-bottom:clamp(28px,4vw,48px);border-bottom:1px solid var(--rule)}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:13.5px;color:var(--ink-2);list-style:none;margin:0;padding:0}
.crumbs li+li::before{content:"›";margin-right:8px;color:var(--ink-3)}
.crumbs a{text-decoration:none;border-bottom:1px solid var(--rule-2)}
.labels{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:24px;font:400 12.5px/1.4 var(--font-mono);color:var(--ink-2)}
.art-hero h1{font-size:clamp(30px,4vw,56px);line-height:1.2;letter-spacing:-.035em;max-width:24ch;margin-top:16px}
.dek{margin-top:16px;font-size:var(--fs-lead);line-height:1.6;color:var(--ink-2);max-width:46em}
.byline{display:flex;flex-wrap:wrap;gap:18px;margin-top:20px;font-size:14px}
.byline span{display:inline-flex;gap:8px;align-items:center}
.byline i{width:30px;height:30px;border-radius:50%;background:var(--paper-2);border:1px solid var(--rule-2);display:grid;place-items:center;font:500 10px var(--font-mono);font-style:normal}
.share{display:flex;gap:8px;margin-top:20px}
.share button,.share a{height:40px;padding:0 13px;border:1px solid var(--rule-2);border-radius:var(--r-s);background:#fff;font:500 13px/1 var(--font-sans);display:inline-flex;align-items:center;cursor:pointer;text-decoration:none;color:var(--ink)}
.draft-note{margin-bottom:22px;padding:10px 14px;border:1.5px dashed var(--forest);border-radius:var(--r-s);background:#fff;font-size:14px;line-height:1.6;color:var(--ink-2)}
.draft-note b{color:var(--forest);margin-right:6px}
.labels .draft-chip{padding:3px 7px;border:1px dashed var(--forest);border-radius:3px;color:var(--forest)}
.disclose{margin-top:14px;max-width:52em;font-size:13.5px;line-height:1.6;color:var(--ink-2)}
.disclose a{color:inherit}
/* cover card; on narrow screens only the evidence strip shows */
.art-card{margin-top:18px;max-width:760px}
.art-cover{display:none;position:relative;aspect-ratio:16/10;background:var(--night);overflow:hidden}
.art-cover canvas,.art-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.art-cover .k{position:absolute;z-index:2;left:18px;top:18px;font:500 11px/1 var(--font-mono);letter-spacing:.08em;color:var(--signal)}
.art-cover.is-light{background:var(--mist)}
.art-cover.is-light .k{color:var(--brand)}
.art-cover.has-img::before{content:"";position:absolute;inset:0 0 auto;z-index:1;height:42%;background:linear-gradient(rgba(4,18,12,.5),rgba(4,18,12,0))}
.art-cover .ai{position:absolute;z-index:2;left:14px;bottom:14px;font:500 11px/1 var(--font-mono);padding:6px 8px;border-radius:3px;background:rgba(4,18,12,.66);color:#fff}
.evidence{border:1px solid var(--rule);border-radius:var(--r-m);background:#fff;padding:12px 16px 14px}
.evidence h2{font:500 11.5px/1.2 var(--font-mono);letter-spacing:.06em;color:var(--forest)}
.evidence dl{margin:10px 0 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:10px 16px}
.evidence dl > div{min-width:0}
.evidence dt{font:500 11px/1.3 var(--font-mono);color:var(--ink-3);letter-spacing:.02em}
.evidence dd{margin:3px 0 0;font-size:14px;line-height:1.4;font-weight:600;color:var(--ink)}
.evidence dd a{display:inline-block;padding:10px 0;margin:-10px 0;color:inherit;text-decoration:underline;text-decoration-color:var(--sprout);text-underline-offset:3px}
@media (min-width:1100px){
  .art-head{display:grid;grid-template-columns:minmax(0,1fr) clamp(340px,28vw,412px);grid-template-areas:"main card" "foot card";grid-template-rows:auto 1fr;column-gap:clamp(48px,5.5vw,96px);align-items:start}
  .hero-main{grid-area:main}
  .hero-foot{grid-area:foot}
  .art-card{grid-area:card;margin-top:0;max-width:none;border:1px solid var(--rule);border-radius:var(--r-m);overflow:hidden;background:#fff}
  .art-cover{display:block}
  .evidence{border:0;border-radius:0;padding:18px 20px 8px}
  .evidence dl{grid-template-columns:1fr 1fr;gap:0 18px;margin-top:8px}
  .evidence dl > div{padding:10px 0 12px;border-top:1px solid var(--rule)}
  .evidence dd{font-size:15px}
}

/* ---------- body grid ---------- */
/* links in the article; :where() keeps this at one class so the components below (contents, notes, refs) restyle theirs */
.art a:where(:not(.btn):not(.src)){color:var(--ink);text-decoration:underline;text-decoration-color:var(--sprout);text-underline-offset:3px}
.art-grid{padding-block:clamp(28px,5vw,64px) clamp(56px,7vw,96px)}
.art{--measure:680px;min-width:0;max-width:var(--measure);margin-inline:auto}
.art-aside{display:none}
@media (min-width:1024px){
  .art-grid{--rail:clamp(196px,15.5vw,224px);display:grid;grid-template-columns:var(--rail) minmax(0,1fr);column-gap:clamp(36px,4vw,64px);align-items:start}
  /* sticky; scrolls on its own when it is taller than the window (padding keeps focus rings inside) */
  .art-aside{display:grid;gap:20px;align-content:start;position:sticky;top:96px;max-height:calc(100vh - 108px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:4px 6px;margin:-4px -6px}
  .art{max-width:none;margin:0}
  .art > *{max-width:var(--measure)}
  .toc-m,.cta-m{display:none!important}
}
@media (min-width:1240px){
  .art{--side:clamp(224px,19.5vw,288px);--measure:min(700px,calc(100% - var(--side) - clamp(40px,3.6vw,56px)))}
  .art > .sn{display:block;float:right;clear:right;width:var(--side);max-width:none}
  .art > .lede{display:grid;grid-template-columns:minmax(0,var(--measure)) var(--side);justify-content:space-between;align-items:start;max-width:none}
  .art > .fig,.art > .tbl--wide{clear:right;max-width:none}
  .art > .fig figcaption{max-width:var(--measure)}
}
.toc h2{font:500 12px/1 var(--font-mono);letter-spacing:.06em;color:var(--ink-3);margin-bottom:12px}
.toc ol{list-style:none;margin:0;padding:0;display:grid;gap:2px;border-left:1px solid var(--rule)}
.toc a{display:block;padding:7px 0 7px 14px;margin-left:-1px;border-left:2px solid transparent;text-decoration:none;font-size:14px;line-height:1.45;color:var(--ink-2)}
.toc a.on{border-left-color:var(--sprout);color:var(--ink);font-weight:600}
.aside-cta{background:var(--paper-2);border-radius:var(--r-m);padding:20px;display:grid;gap:14px}
.aside-cta b{font-size:17px;line-height:1.45}
.aside-cta span{font-size:14.5px;line-height:1.6;color:var(--ink-2)}
.aside-cta .btn{justify-self:start}
/* contents and consult box on one-column layouts */
.toc-m{border:1px solid var(--rule-2);border-radius:var(--r-m);background:#fff}
.toc-m summary{display:flex;align-items:center;gap:8px;min-height:48px;padding:0 16px;cursor:pointer;list-style:none;font-weight:600;font-size:15.5px}
.toc-m summary::-webkit-details-marker{display:none}
.toc-m summary span{font:500 12.5px/1 var(--font-mono);color:var(--ink-3)}
.toc-m summary::after{content:"";margin-left:auto;width:8px;height:8px;border-right:1.5px solid var(--ink-2);border-bottom:1.5px solid var(--ink-2);transform:translateY(-2px) rotate(45deg);transition:transform .2s}
.toc-m[open] summary::after{transform:translateY(2px) rotate(-135deg)}
.toc-m ol{margin:0;padding:4px 16px 10px 38px;border-top:1px solid var(--rule)}
.art .toc-m li{font-size:15px;line-height:1.5}
.toc-m a{display:block;padding:9px 0;color:var(--ink-2);text-decoration:none}
.cta-m{margin-top:40px!important}

/* ---------- article ---------- */
.art > * + *{margin-top:18px}
/* html's scroll-padding-top (main.css) already clears the fixed header; this only adds air */
.art h2{font-size:clamp(22px,2.1vw,28px);line-height:1.35;letter-spacing:-.025em;margin-top:56px;scroll-margin-top:16px}
.art p,.art li{font-size:17px;line-height:1.8}
.art ul,.art ol{padding-left:22px}
/* citation markers: a bigger hit area without moving the line */
.art .src{font:500 12px/1 var(--font-mono);vertical-align:super;margin-left:2px;padding:8px 2px;text-decoration:none;color:var(--forest);border-radius:2px}
.art .src[aria-expanded="true"]{background:var(--signal);color:var(--night)}
.lede > * + *{margin-top:18px}
.summary{border:1.5px solid var(--ink);border-radius:var(--r-m);padding:20px 22px;background:#fff}
.summary h2{margin:0;font:500 12px/1 var(--font-mono);letter-spacing:.06em;color:var(--forest)}
.summary ul{margin:12px 0 0;padding-left:20px}
.summary li{font-size:16px;line-height:1.7}
.answers{background:var(--paper-2);border-radius:var(--r-m);padding:18px 22px}
.answers h2{margin:0;font-size:15px}
.answers ul{margin:10px 0 0;padding-left:20px}
@media (min-width:1240px){
  /* questions in the margin next to the summary */
  .lede > .answers{grid-column:2;margin-top:0;background:none;border-radius:0;border-left:2px solid var(--sprout);padding:4px 0 4px 16px}
  .lede .answers h2{font:500 11.5px/1.3 var(--font-mono);letter-spacing:.06em;color:var(--forest)}
  .lede .answers ul{list-style:none;padding:0;margin-top:12px;display:grid;gap:10px}
  .art .lede .answers li{font-size:14.5px;line-height:1.5}
}
/* margin notes (shown from 1240px, see the top of this file) */
.sn{display:none;font-size:13px;line-height:1.55;color:var(--ink-2);border-left:1px solid var(--rule-2);padding-left:12px}
.art > .sn + .sn{margin-top:14px}
.sn b{color:var(--ink);font-weight:600}
.sn--term{border-left-color:var(--sprout)}
.sn a{display:block;color:inherit;text-decoration:none}
.sn-k{display:block;font:500 11.5px/1.45 var(--font-mono);color:var(--forest);margin-bottom:2px}
.sn-t{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.sn a:hover .sn-t{text-decoration:underline;text-decoration-color:var(--sprout);text-underline-offset:3px}
.callout{border-left:3px solid var(--signal);background:var(--night);color:var(--on-night);border-radius:0 var(--r-m) var(--r-m) 0;padding:18px 20px}
.callout b{color:var(--signal);font:500 12px/1 var(--font-mono);letter-spacing:.06em;display:block;margin-bottom:8px}
.callout p,.callout li{font-size:15.5px;line-height:1.7;color:#D9E7DF}
.art .callout .src{color:var(--signal)}
.caution{border:1px dashed var(--forest);border-radius:var(--r-m);padding:16px 18px;font-size:15px;line-height:1.7}
.caution b{color:var(--forest);display:block;margin-bottom:4px}
.caution p,.caution li{font-size:15px;line-height:1.7}
.caution > * + *,.callout > * + *,.example > * + *{margin-top:8px}
/* tables scroll inside their box; shadows at the edges say there is more (background-attachment: local
   "scrolling shadows", Lea Verou) */
.tbl{overflow-x:auto;border:1px solid var(--rule);border-radius:var(--r-m);background:
  linear-gradient(90deg,#fff 30%,rgba(255,255,255,0)) 0 0/40px 100% no-repeat local,
  linear-gradient(270deg,#fff 30%,rgba(255,255,255,0)) 100% 0/40px 100% no-repeat local,
  radial-gradient(farthest-side at 0 50%,rgba(12,26,19,.22),rgba(12,26,19,0)) 0 0/14px 100% no-repeat scroll,
  radial-gradient(farthest-side at 100% 50%,rgba(12,26,19,.22),rgba(12,26,19,0)) 100% 0/14px 100% no-repeat scroll,#fff}
.tbl table{border-collapse:collapse;width:100%;min-width:520px;font-size:14.5px}
.tbl th,.tbl td{padding:11px 14px;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top;line-height:1.6}
.tbl th{font-weight:600;background:var(--paper);font-size:13.5px}
.tbl tr:last-child td{border-bottom:0}
.tbl caption{caption-side:top;text-align:left;padding:12px 14px 4px;font:500 12.5px/1.5 var(--font-mono);color:var(--ink-2);letter-spacing:.02em}
.flowbox{display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:10px;counter-reset:f}
.flowbox div{border:1px solid var(--rule-2);border-radius:6px;padding:12px;background:#fff;font-size:14px;line-height:1.5;position:relative}
.flowbox div::before{counter-increment:f;content:counter(f);display:block;font:500 12px/1 var(--font-mono);color:var(--forest);margin-bottom:6px}
.flowbox div:not(:last-child)::after{content:"";position:absolute;right:-10px;top:50%;width:10px;height:1.5px;background:var(--sprout)}
.timeline-mini{list-style:none;padding:0!important;margin:0;display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));gap:10px}
.timeline-mini li{border-top:2px solid var(--ink);padding-top:10px;font-size:14px;line-height:1.55}
.timeline-mini b{display:block;font:500 15px/1.2 var(--font-mono)}
.term{font:inherit;color:inherit;background:none;border:0;padding:0;border-bottom:1.5px dotted var(--forest);cursor:help;position:relative}
/* placed under its term by article.js (left/top) */
.tip{position:absolute;z-index:5;left:0;top:0;width:min(300px,calc(100vw - 32px));background:var(--ink);color:#fff;font-size:13.5px;line-height:1.55;padding:10px 12px;border-radius:var(--r-s);text-align:left;font-weight:400;box-shadow:0 10px 30px -10px rgba(0,0,0,.4)}
.art .tip a{color:var(--signal)}
.check{list-style:none;padding-left:0!important}
.check li{display:grid;grid-template-columns:24px 1fr;gap:6px}
.check li::before{content:"";width:16px;height:16px;border:1.5px solid var(--ink);border-radius:3px;margin-top:6px}
.check li.done::before{background:var(--sprout);border-color:var(--sprout)}
.inline-cta{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;background:var(--forest);color:#F1F7EC;border-radius:var(--r-m);padding:20px 22px}
.inline-cta p{font-size:16px!important;line-height:1.5!important;max-width:30em}
.inline-cta .btn{background:var(--signal);border-color:var(--signal);color:var(--night)}
details.faq{border-top:1px solid var(--rule);padding:14px 0}
details.faq summary{cursor:pointer;font-weight:600;font-size:16.5px;list-style:none}
details.faq summary::before{content:"Q. ";color:var(--forest)}
details.faq p{margin-top:10px}
.refs li{font-size:14px!important;line-height:1.6!important;word-break:keep-all;overflow-wrap:anywhere;margin-top:6px;scroll-margin-top:16px}
.art .refs a{color:var(--ink-2);text-decoration:underline;text-decoration-color:var(--rule-2)}
.refs li:target{background:var(--mist);border-radius:2px}
.people{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.person{display:grid;grid-template-columns:56px 1fr;gap:12px;border:1px solid var(--rule);border-radius:var(--r-m);padding:14px;background:#fff}
.person i{width:56px;height:56px;border-radius:6px;background:var(--paper-2);display:grid;place-items:center;font:500 11px var(--font-mono);font-style:normal;color:var(--ink-2)}
.person b{display:block}
.person span{font-size:13.5px;color:var(--ink-2);line-height:1.5}
.art .person a{color:inherit}
.person.is-pending{border-style:dashed;background:transparent}
.history{font:400 13px/1.7 var(--font-mono);color:var(--ink-2);margin-top:28px!important}
.history h2{margin:0 0 8px;font:500 12px/1 var(--font-mono);letter-spacing:.06em;color:var(--ink-3)}
.history ul{list-style:none;padding:0!important;margin:0}
.history li{font:400 13px/1.7 var(--font-mono)!important;color:var(--ink-2)}
.history b{font-weight:500;margin-right:4px}
.related{border-top:1px solid var(--rule);padding-block:clamp(48px,6vw,80px)}
.related h2{font-size:var(--fs-h2);letter-spacing:-.03em;margin-bottom:28px}
.related .cards{grid-template-columns:repeat(3,minmax(0,1fr))}
.related .post{min-height:0}
.related .post .thumb{aspect-ratio:16/10}
/* Markdown columns (content/insights/*.md) */
.art h3{font-size:clamp(18px,1.6vw,21px);line-height:1.4;letter-spacing:-.015em;margin-top:36px;scroll-margin-top:16px}
.art blockquote{margin-left:0;padding:4px 0 4px 18px;border-left:3px solid var(--rule-2);color:var(--ink-2)}
.art code{font:400 .9em/1.5 var(--font-mono);background:var(--paper-2);padding:1px 5px;border-radius:3px}
.art pre{overflow-x:auto;background:var(--paper-2);padding:14px 16px;border-radius:var(--r-s)}
.art pre code{background:none;padding:0}
.art hr{border:0;border-top:1px solid var(--rule);margin-block:36px}
.fig{margin-inline:0;position:relative}
.fig img{display:block;width:100%;height:auto;border:1px solid var(--rule);border-radius:var(--r-m);background:#fff}
.fig.has-zoom img{cursor:zoom-in}
.fig figcaption{margin-top:10px;font-size:13.5px;line-height:1.6;color:var(--ink-2)}
.fig-media{position:relative;display:block}
.fig-zoom{position:absolute;right:10px;bottom:10px;width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--rule-2);border-radius:var(--r-s);background:rgba(255,255,255,.94);color:var(--ink);cursor:zoom-in}
.fig-zoom svg{width:18px;height:18px}
.fig-zoom:hover{border-color:var(--ink)}
.example{border:1px solid var(--rule-2);border-radius:var(--r-m);padding:16px 18px;background:#fff}
.example > b{display:flex;align-items:center;gap:8px;font:500 12.5px/1.3 var(--font-mono);letter-spacing:.04em;color:var(--forest)}
.example p,.example li{font-size:15.5px;line-height:1.7}
.ex{display:inline-flex;align-items:center;font:500 11.5px/1 var(--font-mono);padding:3px 5px;border:1px solid currentColor;border-radius:3px;color:var(--ink-2);white-space:nowrap;letter-spacing:0}
.takeaways{border-top:2px solid var(--ink);padding-top:16px;margin-top:48px!important}
.takeaways h2{margin:0;font:500 12px/1 var(--font-mono);letter-spacing:.06em;color:var(--forest)}
.takeaways ul{margin:12px 0 0}

/* ---------- reading progress, citation popover, figure zoom (src/js/article.js) ---------- */
.read-progress{position:fixed;z-index:61;left:calc(var(--margin) + 4px);right:calc(var(--margin) + 4px);top:calc(env(safe-area-inset-top,0px) + 73px);height:2px;pointer-events:none}
.read-progress span{display:block;height:100%;background:var(--sprout);transform-origin:0 50%;transform:scaleX(0);transition:transform .12s linear}
.cite-pop{position:absolute;z-index:65;width:min(340px,calc(100vw - 32px));background:#fff;color:var(--ink);border:1px solid var(--rule-2);border-radius:var(--r-m);box-shadow:0 18px 44px -18px rgba(10,42,30,.45);padding:14px 48px 6px 16px;font-size:14px;line-height:1.55}
.cite-pop:focus{outline:none}
.cite-pop:focus-visible{outline:2px solid var(--forest);outline-offset:2px}
.cp-k{font:500 11.5px/1.3 var(--font-mono);letter-spacing:.04em;color:var(--forest)}
.cp-t{margin-top:6px;word-break:keep-all;overflow-wrap:anywhere}
.cp-t b{font-weight:600}
.cp-d{margin-top:4px;font:400 12.5px/1.4 var(--font-mono);color:var(--ink-2)}
.cp-a{display:flex;flex-wrap:wrap;gap:0 16px;margin-top:4px}
.cp-a a{display:inline-flex;align-items:center;min-height:40px;font-size:13.5px;font-weight:600;color:var(--ink);text-decoration:underline;text-decoration-color:var(--sprout);text-underline-offset:3px}
.cp-x{position:absolute;right:4px;top:4px;width:40px;height:40px;border:0;border-radius:var(--r-s);background:none;color:var(--ink-2);font:400 22px/1 var(--font-sans);cursor:pointer}
.cp-x:hover{background:var(--paper-2)}
/* medium-zoom 1.1.0 (MIT, github.com/francoischalifour/medium-zoom) injects its own styles; lift it above the fixed header */
.medium-zoom-overlay,.medium-zoom-image--opened{z-index:80}
/* phones: a full-screen viewer that shows the figure at its own size and pans (article.js) */
.figview{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:var(--paper);color:var(--ink);overflow:hidden}
.figview[open]{display:flex;flex-direction:column}
.figview::backdrop{background:var(--paper)}
.fv-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:calc(env(safe-area-inset-top,0px) + 8px) 12px 8px 16px;border-bottom:1px solid var(--rule)}
.fv-bar p{font:500 12px/1.4 var(--font-mono);color:var(--ink-2)}
.fv-x{height:40px;padding:0 16px;border:1px solid var(--rule-2);border-radius:var(--r-s);background:#fff;color:var(--ink);font:600 14px/1 var(--font-sans);cursor:pointer;flex:none}
.fv-pane{flex:1;min-height:0;display:flex;overflow:auto;overscroll-behavior:contain;padding:12px}
.fv-pane img{flex:none;margin:auto;max-width:none;height:auto;background:#fff;border:1px solid var(--rule);border-radius:var(--r-s)}
.fv-cap{flex:none;max-height:26vh;overflow:auto;padding:10px 16px calc(env(safe-area-inset-bottom,0px) + 14px);border-top:1px solid var(--rule);font-size:13px;line-height:1.55;color:var(--ink-2)}

/* ---------- narrower screens ---------- */
@media (max-width:980px){.flowbox{grid-template-columns:repeat(2,minmax(0,1fr))}.timeline-mini{grid-template-columns:repeat(2,minmax(0,1fr))}.flowbox div:nth-child(2n)::after{display:none}.related .cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.art-hero{padding-top:calc(env(safe-area-inset-top,0px) + 104px)}.labels{margin-top:20px}.people,.timeline-mini,.related .cards{grid-template-columns:1fr}.flowbox{grid-template-columns:1fr}.flowbox div::after{display:none}}
@media (prefers-reduced-motion:reduce){
  .read-progress span{transition:none}
  /* medium-zoom marks its transition !important; a more specific rule wins */
  html body .medium-zoom-image,html body .medium-zoom-overlay{transition-duration:.01ms!important}
}
/* 「이 글에 나오는 표준·규칙」 — standards a column names, linked to the standards map (/standards/) */
.post-std{border-top:1px solid var(--rule);padding-top:16px;margin-top:40px!important}
.post-std h2{margin:0;font:500 12px/1 var(--font-mono);letter-spacing:.06em;color:var(--forest)}
.post-std ul{list-style:none;margin:12px 0 0;padding:0!important;display:flex;flex-wrap:wrap;gap:8px}
.post-std li{margin:0}
.post-std a{display:inline-grid;gap:2px;min-height:44px;padding:7px 11px;border:1px solid var(--rule-2);border-radius:var(--r-s);background:#fff;text-decoration:none!important;color:var(--ink)}
.post-std a:hover{border-color:var(--forest)}
.post-std b{font:500 13.5px/1.3 var(--font-mono);letter-spacing:-.01em}
.post-std span{font-size:12px;line-height:1.3;color:var(--ink-2)}
.post-std p{margin-top:12px;font-size:14.5px!important}
.post-std p a{display:inline;min-height:0;padding:0;border:0;background:none;text-decoration:underline!important;text-decoration-color:var(--sprout)!important;text-underline-offset:3px}