.blog-detail-page{--article-ink:var(--text-color);--article-muted:var(--text-secondary);--article-line:var(--border-color);background:var(--card-bg);width:min(1280px,100% - 36px);color:var(--article-ink);margin:0 auto;padding:48px 0 96px}.blog-detail-page-dual{width:min(1600px,100% - 36px)}:root.dark .blog-detail-page{background:var(--bg-color)}.blog-detail-page-lang-vi{font-family:"Be Vietnam Pro",var(--app-font-family),system-ui,sans-serif}.blog-detail-back{color:var(--article-muted);align-items:center;gap:8px;margin-bottom:60px;font-size:13px;font-weight:650;text-decoration:none;transition:color .15s;display:inline-flex}.blog-detail-back:hover{color:var(--app-accent-color);font-weight:750}.blog-detail-back svg{width:16px;height:16px}.blog-detail-header{text-align:left;margin:0 0 52px}.blog-detail-eyebrow,.blog-detail-categories span{color:var(--app-accent-color);letter-spacing:.12em;text-transform:uppercase;font-size:12px;font-weight:750}.blog-detail-categories{flex-wrap:wrap;justify-content:flex-start;gap:10px 18px;display:flex}.blog-detail-header h1{letter-spacing:-.04em;margin:20px 0;font-size:clamp(30px,3.5vw,32px);font-weight:680;line-height:1.1}.blog-detail-header>p{max-width:720px;color:var(--article-muted);margin:0;font-size:18px;line-height:1.7}.blog-detail-meta{color:var(--article-muted);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 24px;margin-top:28px;font-size:13px;font-weight:550;display:flex}.blog-detail-meta-left,.blog-detail-meta-right{flex-wrap:wrap;align-items:center;gap:12px 24px;display:flex}.blog-detail-meta span{align-items:center;gap:7px;display:inline-flex}.blog-detail-meta svg{width:15px;height:15px}.blog-detail-share{border:1px solid var(--article-line);color:var(--article-muted);cursor:pointer;background:0 0;border-radius:999px;align-items:center;gap:5px;padding:4px 10px;font-size:12px;font-weight:600;transition:color .15s,border-color .15s;display:inline-flex}.blog-detail-share:hover{border-color:var(--app-accent-color);color:var(--app-accent-color)}.blog-detail-share svg{width:13px;height:13px}.blog-detail-cover{object-fit:cover;border-radius:26px;width:100%;max-height:610px;margin-bottom:58px;display:block}.blog-detail-body{grid-template-columns:minmax(0,1fr);gap:40px;display:grid}@media (min-width:1024px){.blog-detail-body{grid-template-columns:minmax(0,1fr) 240px;align-items:start;gap:56px}}.blog-detail-content{width:100%;min-width:0}.blog-detail-toc{display:none}@media (min-width:1024px){.blog-detail-toc{align-self:start;max-height:calc(100vh - 64px);display:block;position:sticky;top:32px;overflow-y:auto}}.blog-detail-toc-title{color:var(--article-muted);letter-spacing:.09em;text-transform:uppercase;align-items:center;gap:8px;margin:0 0 14px;font-size:12px;font-weight:750;display:flex}.blog-detail-toc-title svg{width:15px;height:15px}.blog-detail-toc nav ul{border-left:1px solid var(--article-line);flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;display:flex}.blog-detail-toc li{margin:0}.blog-detail-toc a{color:var(--article-muted);border-left:2px solid #0000;margin-left:-1px;padding:5px 0 5px 14px;font-size:13px;font-weight:550;line-height:1.4;text-decoration:none;transition:color .15s,border-color .15s;display:block}.blog-detail-toc-level-2 a{padding-left:28px;font-size:12.5px}.blog-detail-toc a:hover{color:var(--text-color)}.blog-detail-toc a.blog-detail-toc-active{border-left-color:var(--app-accent-color);color:var(--app-accent-color);font-weight:700}.blog-detail-article.lexical-document-editor-readonly{background:0 0}.blog-detail-article .lexical-document-scroll{overflow-x:auto}.blog-detail-article .lexical-document-page{width:100%}.blog-detail-content .blog-detail-article-body{min-height:160px;color:var(--article-ink);overflow-wrap:anywhere;--doc-flow:1.15em;--doc-flow-lg:1.9em;outline:none;font-size:16px;line-height:24px}.blog-detail-article-body>*{margin-top:0;margin-bottom:var(--doc-flow)}.blog-detail-article-body>:last-child{margin-bottom:0}.blog-detail-article-body>:is(blockquote,pre,hr,img,figure),.blog-detail-article-body>.lexical-code-block,.blog-detail-content .blog-detail-article-body>.lexical-table-scroll,.blog-detail-content .blog-detail-article-body>.document-table-wrap{margin-top:var(--doc-flow-lg);margin-bottom:var(--doc-flow-lg)}.blog-detail-content .blog-detail-article-body :where(p,li,span,a,em,strong,b,i,u,mark,sub,sup,del,ins),.blog-detail-content .blog-detail-article-body li>p{font-size:16px;line-height:24px}.blog-detail-content .blog-detail-article-body :is(h1,h2,h3,h4,h5,h6) :where(span,a,em,strong,b,i,u,mark,sub,sup,del,ins,code){font-size:inherit;line-height:inherit}.blog-detail-article-body h1,.blog-detail-article-body h2,.blog-detail-article-body h3,.blog-detail-article-body h4,.blog-detail-article-body h5,.blog-detail-article-body h6{letter-spacing:-.02em;margin-top:1.45em;margin-bottom:.5em;scroll-margin-top:24px;font-weight:680;line-height:1.25}.blog-detail-article-body h1:first-child,.blog-detail-article-body h2:first-child,.blog-detail-article-body h3:first-child,.blog-detail-article-body h4:first-child,.blog-detail-article-body h5:first-child,.blog-detail-article-body h6:first-child{margin-top:0}.blog-detail-article-body :is(h1,h2,h3,h4,h5,h6){cursor:pointer;position:relative}.blog-detail-article-body :is(h1,h2,h3,h4,h5,h6):after{content:"";vertical-align:baseline;background-color:var(--article-muted);opacity:0;pointer-events:none;width:.6em;height:.6em;margin-left:.4em;transition:opacity .15s,background-color .15s;display:inline-block;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E") 50%/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E") 50%/contain no-repeat}.blog-detail-article-body :is(h1,h2,h3,h4,h5,h6):hover:after{opacity:.75;background-color:var(--app-accent-color)}@media (hover:none){.blog-detail-article-body :is(h1,h2,h3,h4,h5,h6):after{opacity:.4}}.blog-detail-copied-toast{z-index:1000;background:var(--text-color);color:var(--card-bg);white-space:nowrap;pointer-events:none;opacity:0;border-radius:6px;padding:4px 10px;font-size:12px;font-weight:600;line-height:1.4;transition:opacity .15s,transform .15s;position:fixed;transform:translate(-50%,-100%)translateY(4px)}.blog-detail-copied-toast.is-visible{opacity:1;transform:translate(-50%,-100%)}.blog-detail-article-body h1,.blog-detail-article-body h2{border-bottom:1px solid var(--article-line);padding-bottom:.3em}.blog-detail-article-body h1{letter-spacing:-.035em;font-size:30px;line-height:1.15}.blog-detail-article-body h2{letter-spacing:-.03em;font-size:25px}.blog-detail-article-body h3{font-size:21px}.blog-detail-article-body h4{letter-spacing:-.01em;font-size:18px}.blog-detail-article-body h5{letter-spacing:0;font-size:16px;font-weight:700}.blog-detail-article-body h6{letter-spacing:.07em;text-transform:uppercase;color:var(--article-muted);font-size:13px;font-weight:700;line-height:1.4}.blog-detail-article-body ul,.blog-detail-article-body ol{padding-left:1.6em}.blog-detail-article-body ul{list-style:outside}.blog-detail-article-body ol{list-style:decimal}.blog-detail-article-body li{margin:.45em 0}.blog-detail-article-body blockquote{border-left:3px solid var(--app-accent-color);color:var(--article-muted);padding:6px 0 6px 24px;font-size:19px;line-height:24px}.blog-detail-article-body a{color:var(--app-accent-color);text-underline-offset:3px;font-weight:650;text-decoration:underline}.blog-detail-article-body a:hover{color:color-mix(in srgb, var(--app-accent-color) 76%, var(--text-color));font-weight:750}.blog-detail-content .blog-detail-article-body code:not(.lexical-code-block){background:var(--code-inline-bg);color:var(--code-inline-fg);border-radius:.25rem;padding:2px 4px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.875em;font-weight:600;line-height:1.4}.blog-detail-article-body .lexical-code-block,.blog-detail-content code.lexical-code-block,.blog-detail-article-body pre{box-sizing:border-box;border:1px solid var(--code-border);border-left:3px solid var(--code-lang-accent,var(--code-border));background:var(--code-surface);width:100%;max-width:100%;color:var(--code-ink);tab-size:2;white-space:pre;border-radius:14px;padding:20px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:14px;line-height:1.65;display:block;overflow-x:auto}.blog-detail-content .lexical-code-block[data-language]{padding-top:14px}.blog-detail-content .lexical-code-block[data-language]:before{content:attr(data-language);border-bottom:1px solid var(--code-border);color:var(--code-header-ink);font-family:var(--app-font-family),system-ui,sans-serif;letter-spacing:.09em;text-transform:capitalize;margin-bottom:16px;padding-bottom:11px;font-size:11px;font-weight:700;line-height:1;display:block;position:sticky;left:0}.blog-detail-content .lexical-code-block[data-language=js],.blog-detail-content .lexical-code-block[data-language=jsx],.blog-detail-content .lexical-code-block[data-language=javascript]{--code-lang-accent:var(--lang-js)}.blog-detail-content .lexical-code-block[data-language=ts],.blog-detail-content .lexical-code-block[data-language=tsx],.blog-detail-content .lexical-code-block[data-language=typescript]{--code-lang-accent:var(--lang-ts)}.blog-detail-content .lexical-code-block[data-language=python],.blog-detail-content .lexical-code-block[data-language=py]{--code-lang-accent:var(--lang-python)}.blog-detail-content .lexical-code-block[data-language=markup],.blog-detail-content .lexical-code-block[data-language=html],.blog-detail-content .lexical-code-block[data-language=xml]{--code-lang-accent:var(--lang-html)}.blog-detail-content .lexical-code-block[data-language=css],.blog-detail-content .lexical-code-block[data-language=scss],.blog-detail-content .lexical-code-block[data-language=sass],.blog-detail-content .lexical-code-block[data-language=less]{--code-lang-accent:var(--lang-css)}.blog-detail-content .lexical-code-block[data-language=json]{--code-lang-accent:var(--lang-json)}.blog-detail-content .lexical-code-block[data-language=bash],.blog-detail-content .lexical-code-block[data-language=shell],.blog-detail-content .lexical-code-block[data-language=sh]{--code-lang-accent:var(--lang-bash)}.blog-detail-content .lexical-code-block[data-language=sql]{--code-lang-accent:var(--lang-sql)}.blog-detail-content .lexical-code-block[data-language=go]{--code-lang-accent:var(--lang-go)}.blog-detail-content .lexical-code-block[data-language=rust],.blog-detail-content .lexical-code-block[data-language=rs]{--code-lang-accent:var(--lang-rust)}.blog-detail-content .lexical-code-block[data-language=java]{--code-lang-accent:var(--lang-java)}.blog-detail-content .lexical-code-block[data-language=c],.blog-detail-content .lexical-code-block[data-language=cpp],.blog-detail-content .lexical-code-block[data-language=csharp],.blog-detail-content .lexical-code-block[data-language=cs]{--code-lang-accent:var(--lang-c)}.blog-detail-content .lexical-code-block[data-language=js]:before,.blog-detail-content .lexical-code-block[data-language=jsx]:before,.blog-detail-content .lexical-code-block[data-language=javascript]:before{content:"JavaScript"}.blog-detail-content .lexical-code-block[data-language=ts]:before,.blog-detail-content .lexical-code-block[data-language=typescript]:before{content:"TypeScript"}.blog-detail-content .lexical-code-block[data-language=jsx]:before{content:"JSX"}.blog-detail-content .lexical-code-block[data-language=tsx]:before{content:"TSX"}.blog-detail-content .lexical-code-block[data-language=markup]:before,.blog-detail-content .lexical-code-block[data-language=html]:before{content:"HTML"}.blog-detail-content .lexical-code-block[data-language=xml]:before{content:"XML"}.blog-detail-content .lexical-code-block[data-language=css]:before{content:"CSS"}.blog-detail-content .lexical-code-block[data-language=scss]:before{content:"SCSS"}.blog-detail-content .lexical-code-block[data-language=json]:before{content:"JSON"}.blog-detail-content .lexical-code-block[data-language=bash]:before,.blog-detail-content .lexical-code-block[data-language=shell]:before,.blog-detail-content .lexical-code-block[data-language=sh]:before{content:"Bash"}.blog-detail-content .lexical-code-block[data-language=sql]:before{content:"SQL"}.blog-detail-content .lexical-code-block[data-language=cpp]:before{content:"C++"}.blog-detail-content .lexical-code-block[data-language=csharp]:before,.blog-detail-content .lexical-code-block[data-language=cs]:before{content:"C#"}.blog-detail-article-body .lexical-code-block-wrapped,.blog-detail-content code.lexical-code-block-wrapped{white-space:pre-wrap;word-break:break-word}.blog-detail-article-body .lexical-code-block *,.blog-detail-content code.lexical-code-block *,.blog-detail-article-body pre code{font-size:inherit;line-height:inherit;white-space:inherit;background:0 0;border:0;padding:0}.blog-detail-content .lexical-token-comment,.blog-detail-content .lexical-token-prolog,.blog-detail-content .lexical-token-doctype,.blog-detail-content .lexical-token-cdata,.blog-detail-content .token.comment,.blog-detail-content .token.prolog,.blog-detail-content .token.doctype,.blog-detail-content .token.cdata{color:var(--syntax-comment)}.blog-detail-content .lexical-token-punctuation,.blog-detail-content .token.punctuation{color:var(--syntax-punctuation)}.blog-detail-content .lexical-token-attr,.blog-detail-content .lexical-token-keyword,.blog-detail-content .token.atrule,.blog-detail-content .token.attr-name,.blog-detail-content .token.keyword{color:var(--syntax-keyword)}.blog-detail-content .lexical-token-property,.blog-detail-content .lexical-token-number,.blog-detail-content .lexical-token-constant,.blog-detail-content .lexical-token-symbol,.blog-detail-content .lexical-token-boolean,.blog-detail-content .token.property,.blog-detail-content .token.number,.blog-detail-content .token.constant,.blog-detail-content .token.symbol,.blog-detail-content .token.boolean{color:var(--syntax-number)}.blog-detail-content .lexical-token-selector,.blog-detail-content .lexical-token-string,.blog-detail-content .lexical-token-char,.blog-detail-content .lexical-token-builtin,.blog-detail-content .token.selector,.blog-detail-content .token.string,.blog-detail-content .token.char,.blog-detail-content .token.builtin{color:var(--syntax-string)}.blog-detail-content .lexical-token-function,.blog-detail-content .token.function,.blog-detail-content .token.class-name{color:var(--syntax-function)}.blog-detail-content .lexical-token-operator,.blog-detail-content .lexical-token-entity,.blog-detail-content .lexical-token-url,.blog-detail-content .token.operator,.blog-detail-content .token.entity,.blog-detail-content .token.url{color:var(--syntax-operator)}.blog-detail-content .lexical-token-variable,.blog-detail-content .lexical-token-important,.blog-detail-content .token.variable,.blog-detail-content .token.important{color:var(--syntax-variable)}.blog-detail-content .lexical-token-deleted,.blog-detail-content .token.deleted{color:var(--syntax-deleted)}.blog-detail-content .lexical-token-inserted,.blog-detail-content .token.inserted{color:var(--syntax-inserted)}.blog-detail-article-body img{max-width:100%;height:auto;margin:var(--doc-flow-lg) auto;border-radius:14px;display:block}.blog-detail-content .lexical-table-scroll,.blog-detail-content .document-table-wrap{width:100%;margin:var(--doc-flow-lg) 0;border:1px solid var(--article-line);-webkit-overflow-scrolling:touch;border-radius:12px;overflow-x:auto}.blog-detail-content .lexical-table,.blog-detail-article-body table{border-collapse:collapse;table-layout:auto;width:100%;min-width:620px;margin:0;font-size:15px;line-height:1.5}.blog-detail-content .lexical-table-cell,.blog-detail-article-body th,.blog-detail-article-body td{border:1px solid var(--article-line);text-align:left;vertical-align:top;padding:12px 14px}.blog-detail-content .lexical-table-cell:first-child,.blog-detail-article-body th:first-child,.blog-detail-article-body td:first-child{border-left:0}.blog-detail-content .lexical-table-cell:last-child,.blog-detail-article-body th:last-child,.blog-detail-article-body td:last-child{border-right:0}.blog-detail-content .lexical-table-row:first-child .lexical-table-cell,.blog-detail-article-body tr:first-child>*{border-top:0}.blog-detail-content .lexical-table-row:last-child .lexical-table-cell,.blog-detail-article-body tr:last-child>*{border-bottom:0}.blog-detail-content .lexical-table-cell-header,.blog-detail-article-body th{background:color-mix(in srgb, var(--app-accent-color) 10%, var(--bg-secondary));font-weight:700}.blog-detail-content .lexical-table-cell p,.blog-detail-article-body th p,.blog-detail-article-body td p{min-height:0;margin:0}.blog-detail-content .lexical-table-row:nth-child(2n) .lexical-table-cell:not(.lexical-table-cell-header),.blog-detail-article-body tbody tr:nth-child(2n) td{background:color-mix(in srgb, var(--app-accent-color) 4%, var(--bg-color))}.blog-detail-tags{border-top:1px solid var(--article-line);flex-wrap:wrap;gap:10px;width:min(100%,780px);margin:52px auto 0;padding-top:28px;display:flex}.blog-detail-tags span{background:color-mix(in srgb, var(--app-accent-color) 12%, var(--bg-color));color:var(--app-accent-color);border-radius:999px;padding:7px 11px;font-size:12px;font-weight:650}.blog-detail-message{text-align:center;align-content:center;place-items:center;min-height:460px;display:grid}.blog-detail-message>svg{width:42px;height:42px;color:var(--app-accent-color);margin-bottom:14px}.blog-detail-message h1,.blog-detail-message p{margin:5px}.blog-detail-message p{color:var(--article-muted)}.blog-detail-message a{color:var(--app-accent-color);align-items:center;gap:8px;margin-top:24px;font-weight:650;text-decoration:none;display:inline-flex}.blog-detail-message a svg{width:16px;height:16px}.blog-detail-skeleton{background:var(--bg-secondary);border-radius:14px}.blog-detail-skeleton-heading{width:min(680px,80%);height:110px;margin:70px auto 48px}.blog-detail-skeleton-cover{height:480px}.blog-detail-skeleton-body{width:min(100%,780px);height:360px;margin:58px auto 0}@media (max-width:620px){.blog-detail-page{width:min(100% - 24px,1280px);padding:30px 0 64px}.blog-detail-back{margin-bottom:42px}.blog-detail-header{margin-bottom:38px}.blog-detail-header h1{font-size:30px}.blog-detail-header>p{font-size:16px}.blog-detail-cover{border-radius:18px;margin-bottom:38px}.blog-detail-content .blog-detail-article-body{--doc-flow:.95em;--doc-flow-lg:1.45em}.blog-detail-article-body h1,.blog-detail-article-body h2,.blog-detail-article-body h3,.blog-detail-article-body h4,.blog-detail-article-body h5,.blog-detail-article-body h6{margin-top:1.25em}.blog-detail-article-body h1{font-size:26px}.blog-detail-article-body h2{font-size:22px}.blog-detail-article-body h3{font-size:19px}.blog-detail-article-body h4{font-size:17px}.blog-detail-article-body .lexical-code-block,.blog-detail-content code.lexical-code-block,.blog-detail-article-body pre{border-radius:10px;padding:16px;font-size:13px}.blog-detail-content .lexical-table,.blog-detail-article-body table{min-width:560px;font-size:14px}}.blog-detail-further{border-top:1px solid var(--article-line);flex-direction:column;gap:56px;margin-top:64px;padding-top:40px;display:flex}.blog-adjacent{grid-template-columns:minmax(0,1fr);gap:16px;display:grid}@media (min-width:640px){.blog-adjacent{grid-template-columns:repeat(2,minmax(0,1fr))}}.blog-adjacent-spacer{display:none}@media (min-width:640px){.blog-adjacent-spacer{display:block}}.blog-adjacent-link{border:1px solid var(--article-line);background:var(--card-bg);border-radius:16px;flex-direction:column;gap:8px;padding:18px 20px;text-decoration:none;transition:border-color .15s,transform .15s;display:flex}:root.dark .blog-adjacent-link{background:color-mix(in srgb, var(--text-color) 4%, transparent)}.blog-adjacent-link:hover{border-color:var(--app-accent-color);transform:translateY(-2px)}.blog-adjacent-link-next{text-align:right}.blog-adjacent-direction{color:var(--article-muted);letter-spacing:.08em;text-transform:uppercase;align-items:center;gap:6px;font-size:12px;font-weight:750;display:inline-flex}.blog-adjacent-link-next .blog-adjacent-direction{justify-content:flex-end}.blog-adjacent-direction svg{width:15px;height:15px}.blog-adjacent-title{color:var(--article-ink);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:16px;font-weight:650;line-height:1.35;display:-webkit-box;overflow:hidden}.blog-adjacent-link:hover .blog-adjacent-title{color:var(--app-accent-color)}.blog-related-heading{color:var(--article-ink);letter-spacing:-.01em;margin:0 0 24px;font-size:22px;font-weight:750}.blog-related-list{border-top:1px solid var(--article-line);margin:0;padding:0;list-style:none}.blog-related-item{border-bottom:1px solid var(--article-line)}.blog-related-item-link{color:inherit;align-items:center;gap:20px;padding:18px 4px;text-decoration:none;transition:padding-left .15s;display:flex}.blog-related-item-link:hover{padding-left:12px}.blog-related-item-main{flex-direction:column;flex:1;gap:6px;min-width:0;display:flex}.blog-related-item-category{color:var(--app-accent-color);letter-spacing:.1em;text-transform:uppercase;font-size:11px;font-weight:750}.blog-related-item-main h3{color:var(--article-ink);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;font-size:18px;font-weight:700;line-height:1.35;transition:color .15s;display:-webkit-box;overflow:hidden}.blog-related-item-link:hover h3{color:var(--app-accent-color)}.blog-related-item-meta{color:var(--article-muted);flex-wrap:wrap;gap:14px;font-size:12px;font-weight:600;display:flex}.blog-related-item-meta span{align-items:center;gap:5px;display:inline-flex}.blog-related-item-meta svg{width:14px;height:14px}.blog-related-item-arrow{width:20px;height:20px;color:var(--article-muted);opacity:0;flex:none;transition:opacity .15s,transform .15s,color .15s;transform:translate(-6px)}.blog-related-item-link:hover .blog-related-item-arrow{opacity:1;color:var(--app-accent-color);transform:translate(0)}