.codeblock{background:var(--color-ink);color:var(--color-cream);border-radius:var(--radius);font-family:var(--font-mono);margin:24px 0;font-size:14px;line-height:1.7;overflow-x:auto}.codeblock__header{border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:center;padding:10px 20px;font-size:12px;display:flex}.codeblock__title{color:var(--color-cream);font-weight:600}.codeblock__lang{color:var(--color-ink-soft);letter-spacing:.05em;text-transform:uppercase}.codeblock__header-left{align-items:center;gap:10px;min-width:0;display:flex}.codeblock__copy{color:var(--color-ink-soft);font-family:var(--font-display);cursor:pointer;background:0 0;border:1px solid #ffffff2e;border-radius:999px;padding:3px 10px;font-size:11px;font-weight:600;transition:background .15s,color .15s,border-color .15s}.codeblock__copy:hover{color:var(--color-cream);background:#ffffff14;border-color:#ffffff4d}.codeblock pre{white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere;text-align:start;direction:rtl;margin:0;padding:20px 24px;font-family:inherit}.codeblock .hl{color:var(--color-rust-soft)}.codeblock .codemuted{color:var(--color-ink-soft)}@media (max-width:480px){.codeblock{margin:18px 0;font-size:12.5px;line-height:1.6}.codeblock__header{padding:8px 14px}.codeblock pre{padding:14px 16px}}