:root{--bg:#fff;--fg:#1d1d1f;--body:#3a3a3c;--muted:#8a8a8e;--line:#e8e8ea;--tile:#f2f2f3;--accent:#1d1d1f;--link:#2f6fde;--code-bg:#f6f6f7;--sans:"Pretendard Variable", Pretendard, -apple-system, system-ui, sans-serif;--mono:"JetBrains Mono", ui-monospace, Consolas, monospace}html.dark{--bg:#141416;--fg:#f2f2f3;--body:#c9c9ce;--muted:#8e8e93;--line:#2a2a2e;--tile:#1f1f23;--accent:#f2f2f3;--link:#7aa7ff;--code-bg:#1c1c20}*{box-sizing:border-box}html{scroll-padding-top:24px}body{background:var(--bg);color:var(--fg);font-family:var(--sans);-webkit-font-smoothing:antialiased;word-break:keep-all;overflow-wrap:break-word;margin:0;transition:background .25s,color .25s}a{color:inherit;text-decoration:none}.skip{position:absolute;left:-9999px}.sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;position:absolute;overflow:hidden}.skip:focus{z-index:100;background:var(--bg);border-radius:8px;padding:8px 12px;top:8px;left:16px}.label{font:500 12px/1.4 var(--sans);color:var(--muted)}.site-header{justify-content:space-between;align-items:center;max-width:1080px;margin:0 auto;padding:36px 32px;display:flex}.logo{font:700 16px var(--sans);letter-spacing:-.01em}.nav{align-items:center;gap:26px;display:flex}.nav a{font:500 13px var(--sans);color:var(--muted)}.nav a:hover{color:var(--fg)}.theme-btn{border:1px solid var(--line);color:var(--fg);font:500 12px var(--sans);cursor:pointer;background:0 0;border-radius:999px;align-items:center;gap:6px;padding:6px 12px;display:inline-flex}.theme-btn:hover{border-color:var(--muted)}.theme-btn>span{display:none}html[data-theme=system] .theme-btn .ti-system,html[data-theme=system] .theme-btn .tl-system,html[data-theme=light] .theme-btn .ti-light,html[data-theme=light] .theme-btn .tl-light,html[data-theme=dark] .theme-btn .ti-dark,html[data-theme=dark] .theme-btn .tl-dark{display:inline}footer.site{max-width:1080px;color:var(--muted);border-top:1px solid var(--line);justify-content:space-between;gap:16px;margin:0 auto;padding:28px 32px 48px;font-size:12.5px;display:flex}.home{max-width:1080px;margin:0 auto;padding:0 32px 120px}.hero{text-align:center;padding:48px 0 88px}.hero .avatar{box-shadow:0 0 0 6px var(--bg), 0 0 0 7px var(--line);margin:0 auto 28px;display:block}.avatar{object-fit:cover;background:var(--tile);border-radius:50%;flex:none}.hero h1{font:600 28px/1.45 var(--sans);letter-spacing:-.02em;text-wrap:balance;max-width:620px;margin:0 auto 18px}.hero p{color:var(--muted);max-width:520px;margin:0 auto 26px;font-size:16px;line-height:1.85}.bar{border-bottom:1px solid var(--line);justify-content:space-between;align-items:flex-end;margin-bottom:28px;padding-bottom:14px;display:flex}.bar h2{font:700 18px var(--sans);letter-spacing:-.01em;margin:0}.toggle{border:1px solid var(--line);border-radius:999px;margin-left:auto;padding:3px;display:flex}.toggle button{color:var(--muted);font:500 12px var(--sans);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:6px 14px}html:not([data-view=list]) .toggle [data-view-set=card],html[data-view=list] .toggle [data-view-set=list]{background:var(--fg);color:var(--bg)}html[data-view=list] .posts-card,html:not([data-view=list]) .posts-list{display:none}.item-link:after{content:"";position:absolute;inset:0}.label a{z-index:1;position:relative}.label a:hover{color:var(--fg);text-decoration:underline}.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;display:grid}.card{position:relative}.card .tile{aspect-ratio:1;background:var(--tile);place-items:center;transition:transform .35s;display:grid;position:relative;overflow:hidden}.card:hover .tile{transform:translateY(-3px)}.card .meta{padding:14px 2px 0}.card h3{font:500 17px/1.5 var(--sans);letter-spacing:-.01em;margin:6px 0 4px}.card .date{color:var(--muted);font-size:12.5px}.tile .th-img{object-fit:cover;grid-area:1/1;width:100%;height:100%;display:block}.tile .th-yt{transform:scale(1.34)}.tile .th-dark,html.dark .tile .th-light{display:none}html.dark .tile .th-dark{display:block}.th-play{background:#f03;border-radius:10px;grid-area:1/1;place-items:center;width:54px;height:38px;display:grid;position:relative}.th-play:after{content:"";border-top:9px solid #0000;border-bottom:9px solid #0000;border-left:14px solid #fff;margin-left:3px}.th-fallback{font:600 44px var(--sans);color:var(--muted);opacity:.45;letter-spacing:-.03em}.list .item{border-bottom:1px solid var(--line);grid-template-columns:120px minmax(0,1fr) auto;align-items:center;gap:28px;padding:22px 0;display:grid;position:relative}.list .item .tile{aspect-ratio:1;background:var(--tile);place-items:center;width:120px;display:grid;overflow:hidden}.list .item h3{font:500 19px/1.5 var(--sans);margin:6px 0}.list .item p{color:var(--muted);margin:0;font-size:14.5px;line-height:1.7}.list .item .date{color:var(--muted);white-space:nowrap;font-size:12.5px}.list .th-fallback{font-size:34px}.list .th-play{transform:scale(.7)}.more{font:500 13px var(--sans);color:var(--muted);border-bottom:1px solid var(--line);margin-top:28px;padding-bottom:3px;display:inline-block}.more:hover{color:var(--fg);border-color:var(--fg)}.empty{color:var(--muted);padding:26px 0}.below{grid-template-columns:repeat(2,minmax(0,1fr));gap:56px;margin-top:88px;display:grid}.below:not(:has(>*)){display:none}.below h2{font:700 18px var(--sans);letter-spacing:-.01em;border-bottom:1px solid var(--line);margin:0 0 16px;padding-bottom:12px}.pop ol{counter-reset:n;margin:0;padding:0;list-style:none}.pop li{counter-increment:n;border-bottom:1px solid var(--line);grid-template-columns:34px 1fr;padding:12px 0;font-size:15px;line-height:1.55;display:grid}.pop li:before{content:counter(n, decimal-leading-zero);font:500 14px var(--sans);color:var(--muted);font-variant-numeric:tabular-nums}.pop ol.ph li{height:49px}.pop ol.ph li:before{content:none}.pop li a{color:inherit;text-decoration:none}.pop li a:hover{text-decoration:underline}.pop li.pin:before{content:"📌";font-size:12px}.series-card{border-bottom:1px solid var(--line);padding:14px 0;display:block}.series-card b{font:500 15px var(--sans);display:block}.series-card:hover b{text-underline-offset:3px;text-decoration:underline}.series-card span{color:var(--muted);font-size:12.5px}.list-page{max-width:1080px}.list-head{text-align:center;padding:24px 0 36px}.list-head h1{font:700 32px/1.3 var(--sans);letter-spacing:-.02em;margin:14px 0 0}.series-grid{max-width:560px;margin:0 auto}.about{max-width:720px;padding-top:24px}.about .avatar{margin-bottom:20px;display:block}.post-wrap{max-width:1080px;margin:0 auto;padding:8px 32px 140px}.post-wrap>article{min-width:0;max-width:40rem;margin:0 auto}.preview-banner{background:var(--tile);max-width:1080px;color:var(--fg);margin:0 auto;padding:10px 32px;font-size:14px}.post-head{text-align:center;max-width:720px;margin:24px auto 56px}.post-head h1{font:700 38px/1.32 var(--sans);letter-spacing:-.03em;text-wrap:balance;margin:18px 0 20px}.post-head .sub{color:var(--muted);max-width:560px;margin:0 auto 22px;font-size:17px;line-height:1.75}.post-head .row{color:var(--muted);flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;font-size:13px;display:flex}.post-head .dot{opacity:.5}.lang{font:500 12px var(--sans);border:1px solid var(--line);border-radius:999px;padding:5px 10px}.lang:hover{color:var(--fg);border-color:var(--muted)}.hero-media{aspect-ratio:16/8;background:var(--tile);width:100%;max-width:880px;margin:0 auto 64px;position:relative;overflow:hidden}.hero-media img{object-fit:cover;width:100%;height:100%;display:block;position:absolute;inset:0}.toc{display:none}.toc .label{margin-bottom:14px;display:block}.toc a{border-left:1px solid var(--line);color:var(--muted);padding:6px 0 6px 14px;line-height:1.45;display:block}.toc a.sub{padding-left:28px;font-size:13px}.toc a:hover{color:var(--fg)}.toc a.active{color:var(--fg);border-left:2px solid var(--fg);padding-left:13px;font-weight:600}.toc a.sub.active{padding-left:27px}.toc-mobile{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:0 0 32px;padding:14px 0;font-size:14px;display:block}.toc-mobile summary{cursor:pointer}.toc-mobile a{color:var(--muted);padding:6px 0;display:block}.toc-mobile a.sub{padding-left:14px}@media (width>=1200px){.post-wrap{grid-template-columns:minmax(0,1fr) minmax(0,40rem) minmax(0,1fr);display:grid}.post-wrap>.post-head,.post-wrap>.hero-media{grid-column:1/-1}.post-wrap>article{grid-column:2;margin:0}.toc{grid-column:1;place-self:start end;width:200px;margin-right:56px;font-size:13.5px;display:block;position:sticky;top:72px}.toc-mobile{display:none}}.prose{color:var(--body);font-size:17.5px;line-height:1.9}.prose p{margin:0 0 1.55em}.prose strong{color:var(--fg)}.prose h2{font:700 24px/1.4 var(--sans);color:var(--fg);letter-spacing:-.02em;margin:2.3em 0 .8em}.prose h3{font:600 19px var(--sans);color:var(--fg);margin:2em 0 .6em}.prose ul,.prose ol{margin:0 0 1.5em;padding-left:1.4em}.prose li{margin:.3em 0}.prose a{color:var(--link);text-underline-offset:3px;text-decoration:underline 1px}.prose img{max-width:100%;height:auto}.prose hr{border:0;border-top:1px solid var(--line);margin:2.4em 0}.prose code{font:500 .84em var(--mono);background:var(--code-bg);color:var(--fg);border-radius:4px;padding:.15em .4em}.prose pre{background:var(--code-bg);font:14px/1.75 var(--mono);border-left:2px solid var(--fg);word-break:normal;margin:0 0 1.7em;padding:22px 24px;overflow-x:auto}.prose pre code{font:inherit;background:0 0;padding:0}.prose pre.astro-code{background-color:var(--code-bg)!important}.astro-code,.astro-code span{color:var(--shiki-light)}html.dark .astro-code,html.dark .astro-code span{color:var(--shiki-dark)}.prose blockquote{border-top:1px solid var(--line);border-bottom:1px solid var(--line);text-align:center;font:500 16px/1.8 var(--sans);color:var(--fg);margin:2.2em 0;padding:26px 0}.prose blockquote p{margin:0}.prose table{border-collapse:collapse;margin:0 0 1.5em;font-size:16px;display:block;overflow-x:auto}.prose th,.prose td{border:1px solid var(--line);text-align:left;padding:8px 12px}.prose .youtube{margin:0 0 1.9em}.prose .math{text-align:center;margin:0 0 1.9em;overflow-x:auto}.prose .demo{border:1px solid var(--line);margin:0 0 1.9em;padding:20px 22px 22px}.prose .demo .dh{justify-content:space-between;align-items:center;margin:0 0 14px;display:flex}.prose .demo .dh b{font:600 15px var(--sans);color:var(--fg)}.prose .demo .iso-figure{margin:0}.prose .demo canvas{background:var(--tile);max-width:100%;display:block}.prose .demo label{color:var(--muted);align-items:center;gap:12px;margin-top:12px;font-size:13px;display:flex}.prose .demo input{accent-color:var(--fg);flex:1}.post-foot{margin-top:72px}.series-label{margin-bottom:12px}.series-nav{border-top:1px solid var(--line);border-bottom:1px solid var(--line);grid-template-columns:1fr 1fr;display:grid}.series-nav a{padding:22px 0}.series-nav a:hover .t{text-underline-offset:4px;text-decoration:underline}.series-nav .prev{grid-column:1}.series-nav .next{text-align:right;border-left:1px solid var(--line);grid-column:2;padding-left:20px}.series-nav .t{font:600 16px var(--sans);color:var(--fg);margin-top:8px;display:block}.tags{flex-wrap:wrap;justify-content:center;gap:16px;margin-top:28px;display:flex}.tags a:hover{color:var(--fg)}.not-found{max-width:42rem;margin:0 auto;padding:64px 32px 120px}.not-found h1{font:700 28px/1.3 var(--sans);margin:0 0 12px}.not-found p{color:var(--muted);line-height:1.7}.not-found a{color:var(--link);font-weight:600}@media (width<=900px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=820px){.below{grid-template-columns:1fr;gap:44px;margin-top:56px}}@media (width<=640px){.site-header{padding:20px}.nav{gap:14px}.nav .nav-link{display:none}.home{padding:0 20px 60px}.hero{padding:16px 0 52px}.hero h1{font-size:25px}.grid{gap:12px}.card h3{font-size:14.5px}.below{margin-top:56px}.post-wrap{padding:0 20px 60px}.post-head{margin-bottom:36px}.post-head h1{font-size:30px}.hero-media{margin-bottom:36px}.prose{font-size:16.5px}.prose h2{font-size:23px}.list .item{grid-template-columns:76px minmax(0,1fr);gap:16px}.list .item .tile{width:76px}.list .item .date,.list .item p{display:none}.list .th-fallback{font-size:26px}footer.site{padding:24px 20px 36px}.preview-banner{padding:10px 20px}.not-found{padding:40px 20px 80px}}