.code-block-wrapper{position:relative;margin:1.5rem 0;border-radius:1.25rem;overflow:hidden}.code-block-wrapper.has-title{border:1px solid rgba(var(--color-border),.5)}.code-block-wrapper pre:has(code){margin:0}.code-block-wrapper.has-title pre:has(code){border:none;border-radius:0}.code-block-header{display:flex;align-items:center;justify-content:space-between;padding:.3rem 1rem;background:rgba(var(--color-card),.98);border-bottom:1px solid rgba(var(--color-border),.3);font-size:.85rem;color:rgba(var(--color-text-base),.8)}.code-block-title{font-weight:500;font-family:var(--font-sans)}.code-block-meta{display:flex;align-items:center;gap:.75rem}.code-block-lang{font-size:.75rem;font-weight:500;letter-spacing:.02em;color:rgba(var(--color-text-base),.5);text-transform:lowercase}pre:has(code){position:relative;border:1px solid rgba(var(--color-border),.5);border-radius:1.25rem;background:rgba(var(--color-card),.95);margin:1.5rem 0;overflow:hidden}pre:has(code) code{display:block;padding:1.25rem 0;overflow-x:auto;background:inherit;font-family:var(--font-mono, "JetBrains Mono", monospace);font-size:.875rem;line-height:1.4!important;-moz-tab-size:2;-o-tab-size:2;tab-size:2}pre:has(code) code>.line{display:inline}.copy-code-btn{position:absolute;top:.375rem;right:.375rem;display:flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;border:none;border-radius:.625rem;background:transparent;color:rgba(var(--color-text-base),.4);cursor:pointer;opacity:0;transition:opacity .2s ease,background-color .15s ease,color .15s ease;z-index:10}pre:has(code):hover .copy-code-btn,.code-block-wrapper:hover .copy-code-btn{opacity:1}.copy-code-btn:hover{background:rgba(var(--color-text-base),.08);color:rgba(var(--color-text-base),.7)}.copy-code-btn:active{background:rgba(var(--color-text-base),.12);transform:scale(.95)}.copy-code-btn svg{width:1.125rem;height:1.125rem}.copy-code-btn.copied{color:rgb(var(--color-accent))}.code-block-header .copy-code-btn{position:static;opacity:1;width:2.25rem;height:2.25rem}pre:has(code) code .line-number{display:inline-block;width:2.5rem;margin-right:1rem;text-align:right;color:rgba(var(--color-text-base),.3);-webkit-user-select:none;-moz-user-select:none;user-select:none}html[data-theme=dark] pre:has(code){background:rgba(var(--color-card),.98)!important;border-color:rgba(var(--color-border),.4)}html[data-theme=dark] .code-block-wrapper.has-title{border-color:rgba(var(--color-border),.4)}html[data-theme=dark] .code-block-wrapper.has-title pre:has(code){border:none!important}html[data-theme=dark] .code-block-header{background:rgba(var(--color-card),.98);border-bottom-color:rgba(var(--color-border),.3)}html[data-theme=dark] .copy-code-btn:hover{background:#ffffff1a}pre:has(code) code::-webkit-scrollbar{height:6px}pre:has(code) code::-webkit-scrollbar-track{background:transparent}pre:has(code) code::-webkit-scrollbar-thumb{background:rgba(var(--color-text-base),.15);border-radius:3px}pre:has(code) code::-webkit-scrollbar-thumb:hover{background:rgba(var(--color-text-base),.25)}@media (max-width: 640px){pre:has(code) code{padding:1rem;font-size:.8rem}.copy-code-btn{top:.375rem;right:.375rem;width:2.25rem;height:2.25rem}.copy-code-btn svg{width:1.125rem;height:1.125rem}}:root{--gradient-accent-1: rgba(167, 216, 245, .5);--gradient-accent-2: rgba(246, 229, 179, .5);--gradient-bg-1: rgba(227, 242, 253, .5);--gradient-bg-2: rgba(252, 228, 236, .5);--gradient-bg-3: rgba(232, 245, 233, .5)}:root[data-theme=dark]{--gradient-accent-1: rgba(67, 116, 145, .4);--gradient-accent-2: rgba(146, 109, 39, .4);--gradient-bg-1: rgba(27, 42, 53, .4);--gradient-bg-2: rgba(52, 28, 36, .4);--gradient-bg-3: rgba(32, 45, 33, .4)}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--gradient-accent-1: rgba(67, 116, 145, .4);--gradient-accent-2: rgba(146, 109, 39, .4);--gradient-bg-1: rgba(27, 42, 53, .4);--gradient-bg-2: rgba(52, 28, 36, .4);--gradient-bg-3: rgba(32, 45, 33, .4)}}.blog-image-wrapper:where(.astro-ql53wvzy){contain:layout style}.aspect-ratio-wrapper:where(.astro-ql53wvzy){will-change:auto}.gradient-placeholder:where(.astro-ql53wvzy){will-change:opacity}.blog-image:where(.astro-ql53wvzy){will-change:opacity}@media print{.gradient-placeholder:where(.astro-ql53wvzy){display:none}}
