@font-face{font-family:Space Grotesk;font-weight:600;font-style:normal;font-display:swap;src:url(/blog/fonts/space-grotesk-latin-600-normal.woff2) format("woff2")}@font-face{font-family:Space Grotesk;font-weight:700;font-style:normal;font-display:swap;src:url(/blog/fonts/space-grotesk-latin-700-normal.woff2) format("woff2")}@font-face{font-family:JetBrains Mono;font-weight:400;font-style:normal;font-display:swap;src:url(/blog/fonts/jetbrains-mono-latin-400-normal.woff2) format("woff2")}:root{--indigo-50: #f1f2fb;--indigo-100: #e2e4f4;--indigo-200: #c2c6e8;--indigo-300: #9aa0d6;--indigo-400: #6e75bf;--indigo-500: #4d56a6;--indigo-600: #384090;--indigo-700: #2f367a;--indigo-800: #262b60;--indigo-900: #1c2049;--indigo-950: #11142e;--slate-0: #ffffff;--slate-50: #f7f8fa;--slate-100: #eef0f4;--slate-200: #e1e4ea;--slate-300: #cbd0da;--slate-400: #9aa1b1;--slate-500: #6b7384;--slate-600: #4d5462;--slate-700: #373d48;--slate-800: #252a33;--slate-900: #161a21;--slate-950: #0d0f14;--cyan-100: #d4f3f7;--cyan-300: #79dbe6;--cyan-500: #11a7bb;--cyan-600: #0d8a9c;--cyan-700: #0b6f7e;--green-100: #d8f0e2;--green-500: #1e9e6a;--green-600: #188157;--amber-100: #fbeccb;--amber-500: #c77a0a;--amber-600: #a5640a;--red-100: #fbdede;--red-500: #d64545;--red-600: #b53636;--brand: var(--indigo-600);--brand-hover: var(--indigo-700);--brand-active: var(--indigo-800);--brand-subtle: var(--indigo-50);--brand-subtle-2: var(--indigo-100);--brand-border: var(--indigo-200);--on-brand: #ffffff;--surface-page: var(--slate-50);--surface-card: var(--slate-0);--surface-raised: var(--slate-0);--surface-sunken: var(--slate-100);--surface-inverse: var(--slate-900);--surface-hover: var(--slate-100);--surface-active: var(--slate-200);--surface-brand: var(--indigo-600);--text-strong: var(--slate-900);--text-body: var(--slate-700);--text-muted: var(--slate-500);--text-subtle: var(--slate-400);--text-on-brand: #ffffff;--text-on-inverse: var(--slate-100);--text-link: var(--indigo-600);--border-subtle: var(--slate-200);--border-default: var(--slate-300);--border-strong: var(--slate-400);--border-brand: var(--indigo-600);--border-focus: var(--indigo-500);--success: var(--green-500);--success-subtle: var(--green-100);--warning: var(--amber-500);--warning-subtle: var(--amber-100);--danger: var(--red-500);--danger-subtle: var(--red-100);--info: var(--cyan-500);--info-subtle: var(--cyan-100);--data-1: var(--indigo-600);--data-2: var(--cyan-500);--data-3: var(--green-500);--data-4: var(--amber-500);--data-5: var(--indigo-300);--data-6: var(--slate-400);--focus-ring: 0 0 0 3px rgba(56, 64, 144, .28)}:root{--font-display: "Space Grotesk", "Pretendard", system-ui, sans-serif;--font-body: "Pretendard", system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", monospace;--fw-regular: 400;--fw-medium: 500;--fw-semibold: 600;--fw-bold: 700;--text-2xs: 12px;--text-xs: 13px;--text-sm: 14px;--text-base: 17px;--text-md: 19px;--text-lg: 22px;--text-xl: 27px;--text-2xl: 34px;--text-3xl: 42px;--text-4xl: 54px;--text-5xl: 66px;--text-6xl: 82px;--leading-none: 1;--leading-tight: 1.15;--leading-snug: 1.45;--leading-normal: 1.65;--leading-relaxed: 1.8;--tracking-tighter: -.03em;--tracking-tight: -.025em;--tracking-normal: .01em;--tracking-wide: .03em;--tracking-wider: .07em;--tracking-caps: .13em;--display-font: var(--font-display);--display-weight: var(--fw-bold);--display-tracking: var(--tracking-tight);--heading-font: var(--font-display);--heading-weight: var(--fw-semibold);--body-font: var(--font-body);--body-weight: var(--fw-regular);--label-font: var(--font-body);--label-weight: var(--fw-medium);--eyebrow-font: var(--font-mono);--eyebrow-weight: var(--fw-medium);--eyebrow-tracking: var(--tracking-caps);--mono-font: var(--font-mono)}:root{--space-0: 0;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-7: 32px;--space-8: 40px;--space-9: 48px;--space-10: 64px;--space-11: 80px;--space-12: 96px;--space-13: 128px;--gap-inline: var(--space-2);--gap-tight: var(--space-3);--gap-default: var(--space-4);--gap-loose: var(--space-6);--pad-control: var(--space-3);--pad-card: var(--space-6);--pad-section: var(--space-10);--container-max: 1280px;--sidebar-w: 248px;--topbar-h: 60px}:root{--radius-none: 0;--radius-xs: 2px;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 12px;--radius-2xl: 16px;--radius-pill: 999px;--radius-control: var(--radius-md);--radius-card: var(--radius-lg);--shadow-xs: 0 1px 2px rgba(13, 15, 20, .06);--shadow-sm: 0 1px 2px rgba(13, 15, 20, .06), 0 1px 3px rgba(13, 15, 20, .08);--shadow-md: 0 2px 4px rgba(13, 15, 20, .06), 0 4px 12px rgba(13, 15, 20, .08);--shadow-lg: 0 8px 24px rgba(13, 15, 20, .12), 0 2px 6px rgba(13, 15, 20, .08);--shadow-xl: 0 16px 48px rgba(13, 15, 20, .18), 0 4px 12px rgba(13, 15, 20, .1);--shadow-inset: inset 0 1px 2px rgba(13, 15, 20, .08);--border-w: 1px;--border-w-2: 1.5px;--border-w-3: 2px;--ease-out: cubic-bezier(.22, 1, .36, 1);--ease-in-out: cubic-bezier(.65, 0, .35, 1);--dur-fast: .12s;--dur-base: .18s;--dur-slow: .28s}:root{--measure: 46rem}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--surface-card);color:var(--text-body);font-family:var(--body-font);font-size:var(--text-base);font-weight:var(--body-weight);line-height:var(--leading-relaxed);letter-spacing:var(--tracking-normal);word-break:keep-all;overflow-wrap:break-word}h1,h2,h3{font-family:var(--heading-font);font-weight:var(--heading-weight);letter-spacing:var(--tracking-tight);line-height:var(--leading-tight);color:var(--text-strong)}a{color:var(--text-link);text-underline-offset:.2em}a:hover{color:var(--brand-hover)}code,kbd,samp,pre,time{font-family:var(--mono-font)}img{max-width:100%;height:auto}:focus-visible{outline:2px solid var(--border-focus);outline-offset:2px}.site-header,main{max-width:var(--measure);margin-inline:auto;padding-inline:var(--space-5)}main{padding-block-end:var(--space-11)}.site-header-bar{position:sticky;top:0;z-index:20;background:var(--surface-card);border-bottom:1px solid transparent;transition:border-color var(--dur-fast) var(--ease-out)}.site-header-bar[data-scrolled]{border-bottom-color:var(--border-subtle)}.site-header{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-4) var(--space-6);padding-block:var(--space-6);transition:padding-block var(--dur-fast) var(--ease-out)}.site-header-bar[data-scrolled] .site-header{padding-block:var(--space-3)}.site-brand{display:inline-flex;align-items:center;color:var(--text-strong);text-decoration:none}.site-brand img{height:22px;width:auto}.site-nav{display:flex;align-items:center;gap:var(--space-5);margin-right:auto;padding-left:var(--space-2);border-left:1px solid var(--border-subtle)}.site-nav a{color:var(--text-muted);font-size:var(--text-sm);font-weight:var(--fw-medium);text-decoration:none;padding-left:var(--space-3)}.site-nav a:hover,.site-nav a[aria-current=page]{color:var(--text-strong)}.site-cta{padding:var(--space-2) var(--space-4);border:1px solid var(--border-subtle);border-radius:var(--radius-control);color:var(--text-body);font-size:var(--text-sm);font-weight:var(--fw-medium);text-decoration:none;transition:border-color var(--dur-fast) var(--ease-out),color var(--dur-fast) var(--ease-out)}.site-cta:hover{border-color:var(--border-brand);color:var(--brand)}@media(max-width:640px){.site-header-bar[data-scrolled] .site-nav,.site-header-bar[data-scrolled] .site-cta{display:none}}.to-top{position:fixed;right:var(--space-5);bottom:var(--space-5);z-index:15;padding:var(--space-3) var(--space-5);border:1px solid var(--border-subtle);border-radius:var(--radius-control);background:var(--surface-card);color:var(--text-body);font-family:var(--body-font);font-size:var(--text-sm);font-weight:var(--fw-medium);cursor:pointer;box-shadow:0 2px 12px #00000014}.to-top[hidden]{display:none}.to-top:hover{border-color:var(--border-brand);color:var(--brand)}.intro h1{margin-bottom:var(--space-2);font-size:var(--text-xl)}.intro p{margin-top:0;color:var(--text-muted)}.post-list{list-style:none;margin:var(--space-9) 0 0;padding:0}.post-list>li+li{margin-top:var(--space-8);padding-top:var(--space-8);border-top:1px solid var(--border-subtle)}.post-list h2{margin:0 0 var(--space-2);font-size:var(--text-md);line-height:var(--leading-snug)}.post-list h2 a{color:var(--text-strong);text-decoration:none}.post-list h2 a:hover{color:var(--brand)}.post-list-summary{margin:0 0 var(--space-2);color:var(--text-muted)}.empty{color:var(--text-muted)}.pagination{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;margin-top:var(--space-9);padding-top:var(--space-7);border-top:1px solid var(--border-subtle)}.pagination a{color:var(--text-body);font-size:var(--text-sm);font-weight:var(--fw-medium);text-decoration:none}.pagination a[rel=next]{justify-self:end}.pagination a:hover{color:var(--brand)}.pagination-status{color:var(--text-muted);font-family:var(--mono-font);font-size:var(--text-xs)}.post-header h1{margin-bottom:var(--space-3);font-size:var(--text-2xl)}.post-meta{margin:0;color:var(--text-muted);font-family:var(--mono-font);font-size:var(--text-xs)}.post-meta>*+*:before{content:"·";margin-inline:var(--space-2)}.post-cover{width:100%;margin-top:var(--space-7);border:1px solid var(--border-subtle);border-radius:var(--radius-lg)}.post-summary{margin:var(--space-8) 0;padding:var(--space-5) var(--space-6);background:var(--brand-subtle);border:1px solid var(--brand-border);border-radius:var(--radius-lg);color:var(--text-strong)}.post-summary p{margin:0}.post-body h2{margin-top:var(--space-10);font-size:var(--text-lg)}.post-body h3{margin-top:var(--space-8);font-size:var(--text-md)}.post-body strong{color:var(--text-strong);font-weight:var(--fw-semibold)}.post-body table{width:100%;border-collapse:collapse;margin:var(--space-7) 0;font-size:var(--text-sm)}.post-body th,.post-body td{padding:var(--space-3) var(--space-4);border:1px solid var(--border-subtle);text-align:left}.post-body th{background:var(--surface-sunken);color:var(--text-strong);font-weight:var(--fw-semibold)}.post-body td{font-variant-numeric:tabular-nums}.post-body blockquote{margin:var(--space-7) 0;padding-left:var(--space-5);border-left:2px solid var(--border-default);color:var(--text-muted)}.post-body pre{padding:var(--space-5);overflow-x:auto;border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--surface-sunken);font-size:var(--text-sm);line-height:var(--leading-snug)}.post-body :not(pre)>code{padding:.1em .35em;border-radius:var(--radius-sm);background:var(--surface-sunken);font-size:.9em}.shot{margin:var(--space-8) 0}.shot img{display:block;width:100%;border:1px solid var(--border-subtle);border-radius:var(--radius-lg);background:var(--surface-sunken)}.shot figcaption{margin-top:var(--space-3);color:var(--text-muted);font-size:var(--text-xs);line-height:var(--leading-snug)}.shot-source{color:var(--text-subtle)}.shot-source:before{content:"·";margin-inline:var(--space-2)}.shot-zoom{position:relative;display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}.shot-zoom:focus-visible{outline:2px solid var(--border-focus);outline-offset:3px;border-radius:var(--radius-lg)}.shot-mark{position:absolute;border:3px solid #e11d1d;border-radius:var(--radius-sm);box-shadow:0 0 0 2px #fffffff2,0 0 0 5px #e11d1d8c;pointer-events:none}.shot-mark[hidden]{display:none}.shot-here{color:#c81a1a;font-weight:var(--fw-medium)}.shot-here:after{content:"·";margin-inline:var(--space-2);color:var(--text-subtle)}.shot-viewer{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:var(--space-9) var(--space-5);background:#0d0f14f2}.shot-viewer[hidden]{display:none}.shot-viewer-inner{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);max-width:100%;max-height:100%}.shot-viewer-frame{position:relative;display:inline-block;min-height:0;line-height:0}.shot-viewer-scroll{max-width:100%;max-height:calc(100vh - 11rem);overflow:auto;border-radius:var(--radius-md)}.shot-viewer-frame img{display:block;max-width:100%;max-height:calc(100vh - 11rem);width:auto;height:auto;border-radius:var(--radius-md);background:var(--surface-card)}@media(max-width:640px){.shot-viewer-frame img{width:900px;max-width:none;max-height:none}}.shot-viewer-caption{margin:0;max-width:46rem;color:var(--slate-200);font-size:var(--text-sm);line-height:var(--leading-snug);text-align:center}.shot-viewer-close{position:absolute;top:var(--space-5);right:var(--space-5);padding:var(--space-2) var(--space-4);border:1px solid rgba(255,255,255,.35);border-radius:var(--radius-control);background:none;color:var(--slate-100);font-family:var(--body-font);font-size:var(--text-sm);cursor:pointer}.shot-viewer-close:hover{border-color:var(--slate-100)}.shot-viewer-close:focus-visible{outline:2px solid var(--slate-100);outline-offset:2px}.coming-soon{margin:var(--space-8) 0;padding:var(--space-7) var(--space-6);border:1px dashed var(--border-default);border-radius:var(--radius-lg);background:var(--surface-sunken);text-align:center}.coming-soon strong{display:block;margin-bottom:var(--space-3);color:var(--text-strong);font-size:var(--text-md)}.coming-soon p{margin:0;color:var(--text-muted);font-size:var(--text-sm)}.post-faq{margin-top:var(--space-10);padding-top:var(--space-8);border-top:1px solid var(--border-subtle)}.post-faq h2{font-size:var(--text-lg)}.post-faq dt{margin-top:var(--space-6);color:var(--text-strong);font-weight:var(--fw-semibold)}.post-faq dd{margin:var(--space-2) 0 0}.post-tags{margin-top:var(--space-9);display:flex;flex-wrap:wrap;gap:var(--space-2)}.tag{padding:.1rem var(--space-3);border:1px solid var(--border-subtle);border-radius:var(--radius-pill);background:var(--surface-sunken);color:var(--text-muted);font-family:var(--mono-font);font-size:var(--text-2xs);letter-spacing:var(--tracking-caps);text-decoration:none}a.tag:hover{color:var(--brand);border-color:var(--brand)}.post-tag-links a{color:var(--text-muted);text-decoration:none}.post-tag-links a:hover{color:var(--brand)}.post-tag-links a+a:before{content:", ";color:var(--text-muted)}.site-search-open{display:inline-flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3) var(--space-2) var(--space-4);border:1px solid var(--border-subtle);border-radius:var(--radius-control);background:var(--surface-card);color:var(--text-muted);font-family:var(--body-font);font-size:var(--text-sm);cursor:pointer;transition:border-color var(--dur-fast) var(--ease-out),color var(--dur-fast) var(--ease-out)}.site-search-open:hover{border-color:var(--border-default);color:var(--text-strong)}.site-search-open kbd{padding:1px var(--space-2);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);color:var(--text-subtle);font-family:var(--mono-font);font-size:var(--text-2xs)}@media(max-width:640px){.site-search-open kbd{display:none}}.search-panel{position:fixed;inset:0;z-index:50;display:flex;justify-content:center;align-items:flex-start;padding:var(--space-9) var(--space-5) var(--space-5);background:#0d0f1473}.search-panel[hidden]{display:none}.search-panel-box{width:100%;max-width:640px;max-height:calc(100vh - var(--space-9) - var(--space-5));overflow-y:auto;padding:var(--space-5);border:1px solid var(--border-subtle);border-radius:var(--radius-card);background:var(--surface-card);box-shadow:var(--shadow-xl)}.search-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.search-input{width:100%;padding:var(--space-3) var(--space-4);border:1px solid var(--border-default);border-radius:var(--radius-md);background:var(--surface-card);color:var(--text-body);font-family:var(--body-font);font-size:var(--text-base)}.search-input:focus{outline:2px solid var(--border-focus);outline-offset:1px}.search-hint,.search-empty{margin:var(--space-4) 0 0;color:var(--text-muted);font-size:var(--text-sm)}.search-results{margin:var(--space-4) 0 0;padding:0;list-style:none}.search-results>li+li{border-top:1px solid var(--border-subtle)}.search-results a{display:block;padding:var(--space-4) var(--space-3);border-radius:var(--radius-md);text-decoration:none}.search-results a:hover{background:var(--surface-hover)}.search-result-title{display:block;color:var(--text-strong);font-weight:var(--fw-semibold)}.search-result-desc{display:block;margin-top:var(--space-1);color:var(--text-muted);font-size:var(--text-sm)}.search-result-meta{display:block;margin-top:var(--space-2);color:var(--text-subtle);font-family:var(--mono-font);font-size:var(--text-xs)}.post-nav{display:grid;grid-template-columns:1fr auto 1fr;gap:var(--space-4);align-items:start;margin-top:var(--space-9);padding-top:var(--space-7);border-top:1px solid var(--border-subtle)}.post-nav a{color:var(--text-body);font-size:var(--text-sm);text-decoration:none}.post-nav a:hover{color:var(--brand)}.post-nav-label{display:block;color:var(--text-muted);font-family:var(--mono-font);font-size:var(--text-2xs);letter-spacing:var(--tracking-caps)}.post-nav-next{text-align:right}.post-nav-list{align-self:center;color:var(--text-muted);font-size:var(--text-sm)}@media(max-width:640px){.post-nav{grid-template-columns:1fr}.post-nav-next{text-align:left}}.toc{margin:var(--space-7) 0;padding:var(--space-5) var(--space-6);border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--surface-sunken)}.toc strong{color:var(--text-strong);font-size:var(--text-sm)}.toc ol{margin:var(--space-3) 0 0;padding-left:var(--space-6);font-size:var(--text-sm);line-height:var(--leading-loose)}.toc a{color:var(--text-body);text-decoration:none}.toc a:hover{color:var(--brand)}.post-body h2{scroll-margin-top:calc(var(--space-11) + var(--space-5))}@media(min-width:1240px){.toc{position:fixed;top:calc(var(--space-11) + var(--space-6));left:calc(50% + var(--measure) / 2 + var(--space-7));width:12rem;max-height:calc(100vh - var(--space-11) - var(--space-6) - var(--space-8));overflow-y:auto;margin:0;padding:0 0 0 var(--space-4);border:0;border-left:1px solid var(--border-subtle);border-radius:0;background:none}.toc strong{display:block;margin-bottom:var(--space-3);color:var(--text-muted);font-size:var(--text-2xs);font-weight:var(--fw-medium);letter-spacing:var(--tracking-caps)}.toc ol{margin:0;padding-left:0;list-style:none;line-height:var(--leading-snug)}.toc li+li{margin-top:var(--space-3)}.toc a{display:block;color:var(--text-muted);font-size:var(--text-xs)}.toc a[aria-current=true]{color:var(--brand);font-weight:var(--fw-medium)}}
