.code-tabs{margin:var(--space-4) 0;border:1px solid var(--line);border-radius:var(--radius-l);background:var(--surface-sunken);overflow:hidden}.code-tabs__bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--line);background:var(--surface)}.code-tabs__list{display:flex;flex-wrap:wrap;gap:var(--space-1)}.code-tabs__tab,.code-tabs__copy{min-height:2rem;padding:0 var(--space-3);border:1px solid transparent;border-radius:var(--radius-l);background:transparent;font:inherit;font-size:var(--text-s);font-weight:500;color:var(--ink-3);cursor:pointer;transition:color var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out)}.code-tabs__tab:hover,.code-tabs__copy:hover{color:var(--ink)}.code-tabs__tab[aria-selected=true]{color:var(--brand);border-color:var(--brand)}.code-tabs__copy{border-color:var(--line);color:var(--ink-2)}.code-tabs__tab:focus-visible,.code-tabs__copy:focus-visible{outline:2px solid var(--brand);outline-offset:2px}.code-tabs__panel{min-width:0}.code-tabs__pre{margin:0;padding:var(--space-4);font-family:var(--font-mono, ui-monospace, monospace);font-size:var(--text-s);line-height:1.6;color:var(--ink);white-space:pre;overflow-x:auto}.code-tabs__pre code{font:inherit}.reading .code-tabs__pre code{padding:0;border-radius:0;background:none}