@layer components{:where(.mk-code-block,.mk-code-block *){box-sizing:border-box}.mk-code-block{border-radius:var(--radius-lg);color:oklch(92% 0 0);background:oklch(17% .01 260);border:1px solid oklch(30% .01 260);width:100%;margin:0;overflow:hidden}.mk-code-block-head{border-block-end:1px solid oklch(30% .01 260);justify-content:space-between;align-items:center;gap:1rem;padding:.375rem .375rem .375rem .75rem;font-size:.8125rem;display:flex}.mk-code-block-file{color:oklch(75% 0 0);font-family:var(--font-mono);align-items:center;gap:.375rem;display:inline-flex;& svg{width:.875rem;height:.875rem}}.mk-code-block-tabs{gap:.125rem;display:flex;& label{border-radius:var(--radius-sm);color:oklch(70% 0 0);font-family:var(--font-mono);cursor:pointer;padding:.25rem .625rem;position:relative}& input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}& label:has(:checked){color:#fff;background:oklch(28% .01 260)}& label:has(:focus-visible){outline-offset:1px;outline:2px solid oklch(70% .12 250)}}.mk-code-block-copy{border-radius:var(--radius-sm);color:oklch(75% 0 0);cursor:pointer;background:0 0;border:0;place-items:center;width:2rem;height:2rem;padding:0;display:grid;& svg{width:1rem;height:1rem}&:hover{color:#fff;background:oklch(28% .01 260)}&:focus-visible{outline-offset:1px;outline:2px solid oklch(70% .12 250)}}.mk-code-block-copy[data-copied]{color:oklch(75% .15 150)}.mk-code-block pre{box-shadow:none;color:inherit;font-family:var(--font-mono);background:0 0;border:0;border-radius:0;margin:0;padding:1rem 0;font-size:.8125rem;line-height:1.7;overflow-x:auto}.mk-code-block code{color:inherit;font-family:inherit;font-size:inherit;background:0 0;border:0;padding:0;display:grid}.mk-code-block code>span{white-space:pre;padding-inline:1rem;display:block}.mk-code-block pre[data-numbers] code{counter-reset:mk-line}.mk-code-block pre[data-numbers] code>span:before{counter-increment:mk-line;content:counter(mk-line);color:oklch(50% 0 0);text-align:end;user-select:none;width:2rem;margin-inline-end:1rem;display:inline-block}.mk-code-block code>span[data-highlight]{background:oklch(60% .12 250/.16);box-shadow:inset 3px 0 oklch(70% .14 250)}.mk-code-block-c{color:oklch(60% 0 0)}.mk-code-block-k{color:oklch(78% .13 300)}.mk-code-block-s{color:oklch(80% .13 150)}.mk-code-block [data-tab]{display:none}.mk-code-block:has(input[value=npm]:checked) [data-tab=npm],.mk-code-block:has(input[value=pnpm]:checked) [data-tab=pnpm],.mk-code-block:has(input[value=bun]:checked) [data-tab=bun]{display:block}.mk-code-block-status{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.mk-code-block[data-variant=inline]{align-items:center;max-width:30rem;display:flex;& pre{flex:1;padding:.625rem 0}& code>span:before{content:"$ ";color:oklch(55% 0 0);user-select:none}& .mk-code-block-copy{margin-inline-end:.375rem}}@media (forced-colors:active){.mk-code-block{border-color:canvastext}.mk-code-block code>span[data-highlight]{outline:1px solid highlight}}}