/* System fonts keep local previews independent of third-party font services. */
:root {
  --md-text-font: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --md-code-font: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  /* Luma's radius scale, adjusted for Zensical's 20px root size. */
  --strio-radius: .5rem;
  /* Panel corners stay consistent when the native root font size increases. */
  --strio-panel-radius: 8px;
  --strio-header-height: calc(64px + env(safe-area-inset-top, 0px));
  /* Painted extent of Strio's 16px Lucide sun; palette icons share its box size. */
  --strio-header-icon-extent: 14.666667px;
}
html { background-color: #fff; }
html:has(body[data-md-color-scheme="slate"]) { background-color: #151515; }
body {
  padding-left: env(safe-area-inset-left, 0px);
  padding-right: env(safe-area-inset-right, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
[data-md-color-scheme="default"] {
  --md-primary-fg-color: #111;
  --md-primary-bg-color: #fff;
  --md-accent-fg-color: #333;
  --md-accent-fg-color--transparent: #0000000d;
  --md-typeset-a-color: #202020;
  --strio-button-bg: #171717;
  --strio-button-fg: #fafafa;
  --strio-button-muted-bg: #f5f5f5;
  --strio-button-muted-fg: #171717;
  --strio-button-ring: oklch(.708 0 0);
  --strio-surface-ring: color-mix(in srgb, var(--md-default-fg-color) 5%, transparent);
  --strio-footer-border: #d8dcda;
  /* shadcn docs: GitHub Light Default. */
  --md-code-fg-color: #1f2328;
  --md-code-bg-color: #f8f8f8;
  --md-code-bg-color--light: #f8f8f8e6;
  --md-code-bg-color--lighter: #f8f8f880;
  --md-code-hl-keyword-color: #cf222e;
  --md-code-hl-string-color: #0a3069;
  --md-code-hl-number-color: #0550ae;
  --md-code-hl-constant-color: #0550ae;
  --md-code-hl-function-color: #8250df;
  --md-code-hl-name-color: #953800;
  --md-code-hl-variable-color: #953800;
  --md-code-hl-special-color: #0550ae;
  --md-code-hl-operator-color: #cf222e;
  --md-code-hl-punctuation-color: #1f2328;
  --md-code-hl-comment-color: #636c76;
  --md-code-hl-generic-color: #1f2328;
}
[data-md-color-scheme="slate"] {
  --md-default-bg-color: #151515;
  --md-default-fg-color: #ededed;
  --md-default-fg-color--light: #bcbcbc;
  --md-primary-fg-color: #111;
  --md-primary-bg-color: #fff;
  --md-accent-fg-color: #ddd;
  --md-accent-fg-color--transparent: #ffffff12;
  --md-typeset-a-color: #e4e4e4;
  --strio-button-bg: #e5e5e5;
  --strio-button-fg: #171717;
  --strio-button-muted-bg: #262626;
  --strio-button-muted-fg: #fafafa;
  --strio-button-ring: oklch(.556 0 0);
  --strio-surface-ring: color-mix(in srgb, var(--md-default-fg-color) 10%, transparent);
  --strio-footer-border: #3c403d;
  /* shadcn docs: Vesper. Keep comments opaque for readable contrast. */
  --md-code-fg-color: #fff;
  --md-code-bg-color: #202020;
  --md-code-bg-color--light: #202020e6;
  --md-code-bg-color--lighter: #20202080;
  --md-code-hl-keyword-color: #a0a0a0;
  --md-code-hl-string-color: #99ffe4;
  --md-code-hl-number-color: #ffc799;
  --md-code-hl-constant-color: #ffc799;
  --md-code-hl-function-color: #ffc799;
  --md-code-hl-name-color: #ffc799;
  --md-code-hl-variable-color: #fff;
  --md-code-hl-special-color: #a0a0a0;
  --md-code-hl-operator-color: #a0a0a0;
  --md-code-hl-punctuation-color: #a0a0a0;
  --md-code-hl-comment-color: #8b8b8b;
  --md-code-hl-generic-color: #fff;
}
.md-header__button.md-logo { display: inline-flex; align-items: center; min-height: 2.2rem; padding-block: 0; }
.md-header__button.md-logo img { width: auto; height: 31.13px; }
.md-logo img { filter: none; }
[data-md-color-scheme="slate"] .md-logo img { filter: invert(1); }
.md-nav--primary > .md-nav__title[for="__drawer"] { font-size: 0; }
.md-nav--primary > .md-nav__title[for="__drawer"] .md-logo { width: 6rem; height: auto; }
.md-nav--primary > .md-nav__title[for="__drawer"] .md-logo img { width: 100%; height: auto; }
.md-header__title { margin-left: .5rem; }
.md-typeset h1 { font-weight: 650; letter-spacing: -.035em; }
.md-typeset h2 { font-weight: 600; letter-spacing: -.02em; }
.md-typeset a:not(.md-button, .headerlink, .md-footer__link, .md-path__link, .md-nav__link) { text-decoration: underline; text-underline-offset: .15em; }
.md-typeset .md-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .3rem;
  min-height: 2rem;
  padding: .5rem .8rem;
  border-radius: calc(2.6 * var(--strio-radius));
  color: var(--strio-button-muted-fg);
  background: var(--strio-button-muted-bg);
  font-size: .7rem;
  font-weight: 500;
  line-height: 1rem;
  white-space: nowrap;
}
.md-typeset .md-button:is(:hover, :focus) { color: var(--strio-button-muted-fg); opacity: 1; }
.md-content__inner .md-button:not(.md-button--primary):hover { background: color-mix(in srgb, var(--strio-button-muted-bg), var(--strio-button-muted-fg) 5%); }
.md-typeset .md-button--primary,
.md-typeset .md-button--primary:is(:hover, :focus) { background: var(--strio-button-bg); color: var(--strio-button-fg); }
.md-typeset .md-button--primary:hover { background: color-mix(in srgb, var(--strio-button-bg) 80%, transparent); }
.md-typeset .md-button:focus-visible { outline: none; box-shadow: inset 0 0 0 1px var(--strio-button-ring), 0 0 0 3px color-mix(in oklab, var(--strio-button-ring) 30%, transparent); }
/* A 64px title bar matches Strio; native JavaScript measures this box for sticky offsets. */
.md-header__inner { height: var(--strio-header-height); min-height: var(--strio-header-height); padding-top: env(safe-area-inset-top, 0px); }
/* Retain the native anchor gap and heading-specific scroll offsets below the taller bar. */
.md-typeset :target { --md-scroll-margin: calc(var(--strio-header-height) + 1.2rem); }
@media screen and (min-width: 60em) {
  /* Keep the inset inside each column so sticky sidebars retain their gap. */
  .md-main__inner { margin-top: 0; }
  .md-content { padding-top: 1.5rem; }
  .md-sidebar--secondary { top: var(--strio-header-height); padding: 2.6rem 0; }
  /* Match the native viewport bounds before its measurements are available. */
  .md-sidebar--secondary .md-sidebar__scrollwrap { height: calc(100vh - var(--strio-header-height) - 5.2rem); }
}
@media screen and (min-width: 76.25em) {
  .md-sidebar--primary { top: var(--strio-header-height); padding: 2.6rem 0; }
  .md-sidebar--primary .md-sidebar__scrollwrap { height: calc(100vh - var(--strio-header-height) - 5.2rem); }
  .md-header--lifted ~ .md-container .md-sidebar { top: calc(var(--strio-header-height) + 2.4rem); }
  .md-header--lifted ~ .md-container .md-typeset :target { --md-scroll-margin: calc(var(--strio-header-height) + 3.6rem); }
}
/* Apply Luma controls without changing the header's native glass. */
.md-header__button.md-icon { width: 1.8rem; height: 1.8rem; padding: 0; border: 1px solid transparent; border-radius: calc(2.6 * var(--strio-radius)); color: var(--strio-button-muted-fg); }
.md-header__button.md-icon svg { --strio-header-icon-box: calc(var(--strio-header-icon-extent) * 12 / 11); position: absolute; top: 50%; left: 50%; width: var(--strio-header-icon-box); height: var(--strio-header-icon-box); margin: 0; translate: -50% -50%; }
/* Compensate native viewBox padding without stretching the glyphs. */
.md-header__button[for="__drawer"] svg { --strio-header-icon-box: calc(var(--strio-header-icon-extent) * 4 / 3); }
.md-header__button[for="__search"] svg { --strio-header-icon-box: calc(var(--strio-header-icon-extent) * 6 / 5); }
.md-header__button.md-icon:hover,
.md-header .md-source:hover { opacity: 1; color: var(--strio-button-muted-fg); background-color: var(--strio-button-muted-bg); }
[data-md-color-scheme="slate"] .md-header__button.md-icon:hover,
[data-md-color-scheme="slate"] .md-header .md-source:hover { background-color: color-mix(in oklab, var(--strio-button-muted-bg) 50%, transparent); }
.md-header__topic { display: none; }
.md-header .md-search__button { padding-inline: 1.6rem 3.2rem; border: 1px solid transparent; border-radius: calc(2.6 * var(--strio-radius)); background-color: var(--strio-button-muted-bg); color: var(--strio-button-muted-fg); font-weight: 500; line-height: 1rem; }
.md-header .md-search__button:hover { background-color: color-mix(in oklab, var(--strio-button-muted-bg) 80%, transparent); }
.md-header .md-search__button::before { inset-inline: .6rem auto; top: 50%; width: calc(var(--strio-header-icon-extent) * 6 / 5); height: calc(var(--strio-header-icon-extent) * 6 / 5); transform: translateY(-50%); background-color: currentcolor; }
.md-header .md-search__button::after { inset-inline: auto .6rem; top: 50%; transform: translateY(-50%); min-width: 1.1rem; height: 1.1rem; padding: 0 .3rem; border-radius: var(--strio-radius); background: var(--strio-button-muted-bg); color: var(--md-default-fg-color--light); font-family: var(--md-text-font); font-weight: 500; line-height: 1.1rem; }
.md-header .md-header__source { width: auto; max-width: none; margin-inline: .4rem 0; }
.md-header .md-source { display: flex; align-items: center; gap: .4rem; width: fit-content; max-width: 100%; min-height: 1.6rem; padding: .2rem .6rem; border: 1px solid transparent; border-radius: calc(2.6 * var(--strio-radius)); color: var(--strio-button-muted-fg); font-size: .7rem; font-weight: 500; line-height: 1rem; }
.md-header .md-source__icon { flex: none; width: var(--strio-header-icon-extent); height: var(--strio-header-icon-extent); }
.md-header .md-source__icon svg { width: var(--strio-header-icon-extent); height: var(--strio-header-icon-extent); margin: 0; }
.md-header .md-source__icon + .md-source__repository { min-width: 0; max-width: none; padding: 0; margin: 0; }
.md-header .md-source__facts { width: max-content; font-size: .6rem; line-height: .8rem; }
.md-header .md-source__fact { display: inline-flex; align-items: center; gap: .2rem; }
.md-header .md-source__fact::before { flex: none; margin: 0; }
.md-header .md-source__fact--version::before,
.md-header .md-source__fact--stars::before { width: calc(var(--strio-header-icon-extent) * 12 / 11); height: calc(var(--strio-header-icon-extent) * 12 / 11); }
.md-header .md-source__fact--forks::before { width: calc(var(--strio-header-icon-extent) * 6 / 5); height: calc(var(--strio-header-icon-extent) * 6 / 5); }
.md-header__button.md-icon:focus-visible,
.md-header__option input:focus-visible + .md-header__button,
.md-header .md-search__button:focus-visible,
.md-header .md-source:focus-visible { outline: none; border-color: var(--strio-button-ring); box-shadow: 0 0 0 3px color-mix(in oklab, var(--strio-button-ring) 30%, transparent); }
/* Luma scopes the sidebar radius to radius-xl, then rounds rows to xl again. */
.md-nav--primary .md-nav__link { border-radius: calc(1.96 * var(--strio-radius)); }
.md-nav--primary .md-nav__link:not(.md-nav__container):not(.md-nav--secondary .md-nav__link) {
  align-items: center;
  min-height: 1.8rem;
  padding: .4rem .6rem;
  gap: .4rem;
  line-height: 1rem;
}
.md-nav--primary .md-nav__link:not(.md-nav__container):not(.md-nav--secondary .md-nav__link) > .md-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.md-nav--primary .md-nav__list:not(.md-nav--secondary .md-nav__list) { gap: .1rem; }
.md-sidebar--primary .md-nav--primary > .md-nav__list > .md-nav__item--section > .md-nav__link {
  min-height: 1.6rem;
  color: color-mix(in srgb, var(--md-default-fg-color) 70%, transparent);
  font-size: .6rem;
  font-weight: 500;
  line-height: .8rem;
}
.md-sidebar--primary a.md-nav__link:not(.md-nav__container):not(.md-nav--secondary .md-nav__link):focus-visible { outline: 2px solid var(--strio-control-focus); outline-offset: 2px; }
.md-nav--primary .md-nav__link:is(:hover, :active) { --md-default-fg-color: var(--md-accent-fg-color); }
[data-md-color-scheme="default"] .md-nav--primary {
  --md-default-fg-color: #0a0a0a;
  --md-default-fg-color--lightest: #f5f5f5;
  --md-accent-fg-color: #171717;
  --md-accent-fg-color--transparent: #f5f5f5;
}
[data-md-color-scheme="slate"] .md-nav--primary {
  --md-default-fg-color: #fafafa;
  --md-default-fg-color--lightest: #262626;
  --md-accent-fg-color: #fafafa;
  --md-accent-fg-color--transparent: #262626;
}
.md-typeset pre > code { padding: .7rem .8rem; border-radius: calc(1.8 * var(--strio-radius)); }
.md-typeset .highlight span.filename { padding: .5rem .8rem; border-radius: calc(1.8 * var(--strio-radius)) calc(1.8 * var(--strio-radius)) 0 0; }
/* Half the first code line's height: .853333em font size with 1.5 line height. */
.md-typeset .md-code__nav { top: .64em; right: .4rem; padding: 0; }
.md-typeset .md-code__button { display: grid; place-items: center; width: 1.4rem; height: 1.4rem; padding: 0; border: 1px solid transparent; color: var(--md-code-fg-color); background: var(--md-code-bg-color); }
.md-typeset .md-code__button:is(:hover, :focus-visible) { color: var(--md-code-fg-color); background: var(--strio-button-muted-bg); }
.md-typeset .md-code__button:focus-visible { outline: none; border-color: var(--strio-button-ring); box-shadow: 0 0 0 3px color-mix(in oklab, var(--strio-button-ring) 30%, transparent); }
.md-typeset .md-code__button::after { width: .8rem; height: .8rem; }
.md-typeset .md-code__button[data-copy-state="copied"]::after {
  -webkit-mask-image: var(--strio-code-check-icon);
  mask-image: var(--strio-code-check-icon);
}
.md-typeset .highlight:has(> span.filename, > .highlighttable .filename) { position: relative; }
.md-typeset .highlight:has(> span.filename) > pre,
.md-typeset .highlight:has(> .highlighttable .filename) > .highlighttable > tbody > tr > .code > div > pre { position: static; }
/* Numbered and plain titled blocks share the same header copy position. */
.md-typeset .highlight:has(> span.filename, > .highlighttable .filename) .md-code__nav { top: .4rem; }
.md-typeset [data-md-type="copy"] { border-radius: calc(2.6 * var(--strio-radius)); }
/* Chroma/Pygments labels, attributes and constants share the docs palette. */
.md-typeset .highlight .nl { color: var(--md-code-hl-name-color); }
.md-typeset .highlight .na { color: var(--md-code-hl-special-color); }
.md-typeset .highlight .kc { color: var(--md-code-hl-number-color); }
.strio-actions { display: flex; flex-wrap: wrap; gap: .6rem; }
.strio-intro { font-size: .9rem; line-height: 1.65; max-width: 65ch; }
.strio-paths { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 1.5rem 0 2rem; }
.md-content__inner .strio-path { display: flex; flex-direction: column; gap: .6rem; border: 1px solid var(--strio-surface-ring); border-radius: var(--strio-panel-radius); padding: 1.2rem; background: var(--md-default-bg-color); }
.md-content__inner .strio-path > :is(h2, h3, h4):first-child { margin: 0; font-size: .85rem; font-weight: 600; line-height: 1.4; }
.strio-path__title { font-size: .85rem; font-weight: 600; line-height: 1.4; letter-spacing: -.02em; }
.strio-path p { margin: 0; }
.strio-path > p:last-child:has(> a:only-child) { margin-top: auto; }
/* Luma small outline button with a trailing icon. */
.md-typeset .md-button.strio-container-link { min-height: 1.8rem; gap: .3rem; padding: .3rem .7rem; border: 1px solid color-mix(in srgb, var(--md-default-fg-color) 20%, transparent); background: transparent; }
.md-typeset .md-button.strio-container-link:hover { background: var(--strio-button-muted-bg); }
.md-typeset a.strio-tutorial { gap: .6rem; color: var(--md-default-fg-color); background: var(--md-default-bg-color); border-color: var(--strio-surface-ring); text-decoration: none; }
.strio-tutorial > strong { font-size: .85rem; font-weight: 600; line-height: 1.4; }
.strio-tutorial > span { color: var(--md-default-fg-color--light); font-size: .7rem; line-height: 1.65; }
.strio-tutorial > .strio-tutorial__action { display: flex; align-items: center; gap: .3rem; margin-top: .2rem; color: inherit; font-size: .7rem; font-weight: 500; text-decoration: underline; text-underline-offset: .15em; }
.strio-container-link::after { content: ""; flex-shrink: 0; width: .8rem; height: .8rem; background: currentColor; -webkit-mask: var(--strio-chevron-right-icon) center / contain no-repeat; mask: var(--strio-chevron-right-icon) center / contain no-repeat; }
.strio-tutorial__action::after { content: ""; flex-shrink: 0; width: .8rem; height: .8rem; background: currentColor; -webkit-mask: var(--strio-arrow-right-icon) center / contain no-repeat; mask: var(--strio-arrow-right-icon) center / contain no-repeat; }
.md-typeset a.strio-tutorial:hover { background: color-mix(in srgb, var(--md-default-bg-color), var(--md-default-fg-color) 5%); border-color: var(--strio-surface-ring); }
.md-typeset a.strio-tutorial:focus-visible { outline: 2px solid var(--strio-button-ring); outline-offset: 2px; }
@media (max-width: 600px) { .strio-paths { grid-template-columns: 1fr; } }

/* Keep standalone code blocks within the article gutters on mobile. */
@media screen and (max-width: 44.984375em) {
  .md-content__inner > .highlight,
  .md-content__inner > pre {
    margin-inline: 0;
  }

  .md-content__inner > .highlight > pre > code,
  .md-content__inner > pre > code {
    border-radius: calc(1.8 * var(--strio-radius));
  }
}

/* Modern gives slate links a scheme-specific colour; retain the monochrome palette. */
[data-md-color-scheme="default"] .md-typeset { --md-typeset-a-color: #202020; }
[data-md-color-scheme="slate"] .md-typeset { --md-typeset-a-color: #e4e4e4; }
@media (max-width: 76.2344em) {
  .md-header__button[for="__drawer"] { order: -1; }
  body .md-header__button.md-logo { display: inline-flex; padding: .2rem; }
}
@media (max-width: 600px) {
  .md-header__button.md-logo img { height: 27.66px; }
}
/* Keep the existing controls beside wider wordmarks on narrow phones. */
@media (max-width: 360px) {
  .md-header__inner { padding-inline: .2rem; }
  .md-header__title { margin-inline: 0; }
  body .md-header__button.md-logo { margin-inline: 0; padding-inline: 0; }
  .md-header__button { flex-shrink: 0; }
}

/* Luma mobile navigation uses a side sheet; retain the native translucent surface. */
@media (max-width: 76.234375em) {
  .md-sidebar--primary { top: env(safe-area-inset-top, 0px); width: min(14.4rem, 100%); height: calc(100% - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); padding: 0; border-radius: 0; }
  [dir="ltr"] .md-sidebar--primary { left: 0; right: auto; border-left: 0; border-right: 1px solid var(--md-default-fg-color--lightest); transform: translateX(-100%); }
  [dir="rtl"] .md-sidebar--primary { left: auto; right: 0; border-left: 1px solid var(--md-default-fg-color--lightest); border-right: 0; transform: translateX(100%); }
  [dir="ltr"] .md-sidebar--primary .md-sidebar__scrollwrap { padding-left: env(safe-area-inset-left, 0px); }
  [dir="rtl"] .md-sidebar--primary .md-sidebar__scrollwrap { padding-right: env(safe-area-inset-right, 0px); }
  [dir] [data-md-toggle="drawer"]:checked ~ .md-container .md-sidebar--primary { transform: translateX(0); }
  .md-sidebar--primary .md-nav--primary { margin: 0; }
  .md-sidebar--primary .md-nav--primary > .md-nav__title,
  .md-sidebar--primary .md-nav--primary > .md-nav__list { padding: .4rem; }
  /* Match the top-level pill edge: list padding plus its native link margin. */
  .md-sidebar--primary .md-nav__source { margin-inline: .6rem; }
  /* Keep the same content inset, accounting for the card's native border. */
  .md-sidebar--primary .md-nav__source .md-source { padding-inline: calc(.6rem - .05rem); }
  .md-sidebar--primary .md-nav__source .md-source__icon { width: 1.4rem; }
  .md-sidebar--primary .md-nav__source .md-source__icon svg { margin-inline: 0; }
}

.md-sidebar--secondary .md-nav__list { display: flex; flex-direction: column; gap: .1rem; }
.md-sidebar--secondary .md-nav__link { min-height: 1.8rem; padding: .4rem .6rem; margin: 0; border-radius: calc(1.8 * var(--strio-radius)); font-size: .7rem; line-height: 1rem; }
.md-sidebar--secondary .md-nav__link .md-typeset { color: inherit; font-size: inherit; line-height: inherit; }
.md-sidebar--secondary [data-strio-toc-adjusted] .md-nav__link--active:not([aria-current], :hover, :focus-visible) { color: var(--md-default-fg-color--light); font-weight: 400; }
.md-sidebar--secondary .md-nav--secondary .md-nav__link:is(:hover, :focus-visible, [aria-current]),
.md-sidebar--secondary .md-nav--secondary:not([data-strio-toc-adjusted]) .md-nav__link--active { color: var(--strio-button-muted-fg); background-color: var(--strio-button-muted-bg); }
.md-sidebar--secondary .md-nav__link[aria-current],
.md-sidebar--secondary .md-nav--secondary:not([data-strio-toc-adjusted]) .md-nav__link--active { font-weight: 500; }
.md-sidebar--secondary .md-nav__link:focus-visible { outline: 2px solid var(--strio-button-ring); outline-offset: -2px; }

@media (max-width: 59.984375em) {
  .md-sidebar--secondary { bottom: calc(1.6rem + env(safe-area-inset-bottom, 0px)); right: calc(.8rem + env(safe-area-inset-right, 0px)); transition: none; }
  /* Adapt shadcn's anchored popover fade/95% zoom to the native checkbox. */
  .md-sidebar--secondary .md-sidebar__inner,
  .md-sidebar--secondary [type="checkbox"]:checked ~ .md-sidebar__inner {
    transform-origin: bottom right;
    transition: opacity 150ms ease-out, transform 150ms ease-out;
  }
  .md-sidebar--secondary .md-sidebar__inner { transform: translateY(8px) scale(.95); }
  .md-sidebar--secondary [type="checkbox"]:checked ~ .md-sidebar__inner { transform: none; }
  .md-sidebar--secondary .md-sidebar-button { color: var(--strio-button-muted-fg); }
  .md-sidebar--secondary .md-sidebar-button:is(:hover, :focus) { color: var(--strio-button-muted-fg); background-color: var(--strio-button-muted-bg); }
  .md-sidebar--secondary .md-sidebar__inner { padding: .8rem .4rem; border-radius: var(--strio-panel-radius); font-size: .7rem; box-shadow: 0 0 0 1px var(--strio-surface-ring), 0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a; }
  .md-sidebar--secondary .md-sidebar__inner .md-nav__link { border-radius: calc(1.96 * var(--strio-radius)); }
  .md-sidebar--secondary .md-nav--secondary { margin: 0; }
  .md-sidebar--secondary .md-nav__title { padding: 0; margin: 0 .4rem .8rem; font-size: .8rem; font-weight: 500; line-height: 1.2rem; }
}

/* Let the article absorb spare height above pagination and the Strio brand row. */
.md-main:has(.strio-pagination:not([hidden])) { display: flex; flex-direction: column; }
.md-main__inner:has(.strio-pagination:not([hidden])) { flex-grow: 1; width: 100%; height: auto; margin-bottom: 40px; }
.md-content:has(> .strio-pagination-container > .strio-pagination:not([hidden])) { display: flex; flex-direction: column; }
.md-content:has(> .strio-pagination-container > .strio-pagination:not([hidden])) > article { flex-grow: 1; margin-bottom: 0; }
.strio-pagination-container { padding-top: 0; margin-bottom: 0; }
.strio-pagination-container:not(:has(.strio-pagination:not([hidden]))) { display: none; }
.md-typeset .md-footer__inner.strio-pagination { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; width: 100%; max-width: none; margin: 48px 0 0; padding: 0; border: 0; overflow: visible; }
.md-typeset .md-footer__inner.strio-pagination[hidden] { display: none; }
.strio-pagination .md-footer__link { min-width: 0; min-height: 44px; max-width: none; margin: 0; align-items: center; gap: 8px; overflow: visible; }
.strio-pagination .md-footer__link--prev { grid-column: 1; }
.strio-pagination .md-footer__link--next { grid-column: 2; }
.strio-pagination .md-footer__title { display: block; min-width: 0; max-width: none; margin: 0; padding: 0; white-space: normal; line-height: 1.25; }
.strio-pagination .md-footer__direction { display: block; line-height: 1.2; }
.strio-pagination .md-ellipsis { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
.strio-pagination .md-footer__button { flex-shrink: 0; width: 32px; height: 32px; box-sizing: border-box; margin: 0; padding: 8px; }
.md-typeset .strio-pagination a.md-footer__link { color: var(--md-default-fg-color); text-decoration: none; }
.md-typeset .strio-pagination a.md-footer__link:focus-visible { opacity: 1; }
.md-typeset .strio-pagination .md-icon svg { max-width: none; max-height: none; }
.strio-footer { border-top: 0; background: var(--md-default-bg-color); }
/* Homepage spacing and wordmark across the constrained docs layout. */
.strio-footer__brandbar {
  width: 100%;
  max-width: 61rem;
  margin-inline: auto;
  border-top: 1px solid var(--strio-footer-border);
  background: transparent;
}
/* Keep the homepage gutters inside the divider at every width. */
.strio-footer__brand-inner { display: flex; align-items: center; box-sizing: border-box; max-width: none; margin: 0; padding: 27px 40px; }
@media (max-width: 600px) {
  .strio-footer__brand-inner { padding-inline: 24px; }
}
/* Expand the link into the surrounding whitespace without increasing the row. */
.strio-footer-brand { display: flex; align-items: center; width: fit-content; min-height: 44px; padding-block: 10px; margin-block: -10px; color: var(--md-default-fg-color); }
.strio-footer-brand svg { display: block; width: 89px; height: auto; }
.strio-pagination a:focus-visible, .strio-footer a:focus-visible { outline: 2px solid var(--strio-button-ring); outline-offset: 2px; }
[data-md-color-scheme="default"] .strio-pagination a:focus-visible,
[data-md-color-scheme="default"] .strio-footer a:focus-visible { outline-color: var(--md-default-fg-color--light); }
@media (max-width: 600px) { .md-typeset .md-footer__inner.strio-pagination { margin-top: 32px; } }
/* Empty native metadata has no surface when branding is disabled. */
.md-footer-meta:has(.md-copyright):not(:has(.md-copyright > *, .md-social)) { display: none; }

/* Keep the native search UI fixed; these refinements target documentation only. */
.md-content,
.md-sidebar--primary,
.md-sidebar--secondary,
.md-header__option,
.md-header .md-source,
.md-header__button.md-icon:not([for="__search"]) { --strio-control-focus: var(--md-default-fg-color--light); }
[data-md-color-scheme="default"] :is(.md-content, .md-sidebar--primary, .md-sidebar--secondary, .md-header__option, .md-header .md-source, .md-header__button.md-icon:not([for="__search"])) { --strio-control-focus: #737373; }

.md-content__inner > :is(p, ul, ol, dl, blockquote) { max-inline-size: 65ch; }
.md-content__inner .md-typeset__table table:not([class]),
.md-content__inner :is(.admonition, details) { font-size: .7rem; line-height: 1.65; }
.md-content__inner :is(.admonition, details) > p:not(.admonition-title) { max-inline-size: 65ch; }
/* Keep the existing callout rhythm inside the expandable title's hit area. */
.md-content__inner details > summary,
.md-content__inner details:not([open]) > summary { margin-block: 0; padding-block: .6rem; }
.md-content__inner details[open] > summary { padding-block-end: 1em; }
.md-content__inner details > summary::before,
.md-content__inner details > summary::after { top: calc(.6rem + .125em); }

.md-content__inner details > summary:focus-visible,
.md-content__inner .md-button:focus-visible,
.md-content__inner .md-code__button:focus-visible,
.md-content__inner a.strio-tutorial:focus-visible,
.md-header__button.md-icon:not([for="__search"]):focus-visible,
.md-header__option input:focus-visible + .md-header__button,
.md-header .md-source:focus-visible,
.md-sidebar--primary a.md-nav__link:focus-visible,
.md-sidebar--secondary .md-nav__link:focus-visible,
.md-sidebar--secondary .md-sidebar-button:focus-visible,
.strio-panel-close:focus-visible {
  outline: 2px solid var(--strio-control-focus);
  outline-offset: 2px;
  box-shadow: none;
  opacity: 1;
}
.md-content__inner .md-code__button:focus-visible,
.md-header__button.md-icon:not([for="__search"]):focus-visible,
.md-sidebar--secondary .md-sidebar-button:focus-visible { border-color: var(--strio-control-focus); }

.strio-panel-close { display: none; }
@media (max-width: 76.234375em) {
  .md-sidebar--primary { background-color: color-mix(in srgb, var(--md-default-bg-color) 94%, transparent); }
}
@media (max-width: 59.984375em) {
  .md-sidebar--secondary .strio-panel-close:not([hidden]) { display: grid; }
  .md-sidebar--secondary .md-sidebar__inner {
    bottom: 2.7rem;
    right: 0;
    max-height: min(50vh, calc(100dvh - var(--strio-header-height) - 4.7rem - env(safe-area-inset-bottom, 0px)));
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background-color: color-mix(in srgb, var(--md-default-bg-color) 94%, transparent);
    backdrop-filter: blur(8px);
  }
  .md-sidebar--secondary .md-sidebar__inner > .md-nav--secondary {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
  }
  .md-sidebar--secondary .md-nav__title { position: static; flex: none; padding-inline-end: 2rem; background: transparent; }
  .md-sidebar--secondary .md-sidebar__inner > .md-nav--secondary > .md-nav__list {
    flex: 1;
    min-height: 0;
    padding: .2rem;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--md-default-fg-color--light) transparent;
    scroll-padding-block: .4rem;
  }
}
.strio-panel-close {
  position: absolute;
  inset-inline-end: .4rem;
  top: .4rem;
  place-items: center;
  z-index: 2;
  width: 1.8rem;
  height: 1.8rem;
  padding: 0;
  border: 1px solid transparent;
  border-radius: calc(2.6 * var(--strio-radius));
  background: transparent;
  color: var(--strio-button-muted-fg);
  font-size: 0;
  cursor: pointer;
}
.strio-panel-close::before { content: "×"; font: 1.2rem/1 var(--md-text-font); }
.strio-panel-close:hover { background: var(--strio-button-muted-bg); }

/* 44px action, copy and drawer controls on compact and touch layouts. */
@media (max-width: 59.984375em), (pointer: coarse) {
  .md-typeset .md-button {
    min-width: 2.2rem;
    min-height: 2.2rem;
    padding-block: .6rem;
  }
  .md-typeset .md-button.strio-container-link { min-height: 2.2rem; padding-block: .5rem; }

  /* The original 36px icons plus 4px margins already occupy 44px cells. */
  .md-header__button.md-icon:not([for="__search"]) { width: 2.2rem; height: 2.2rem; margin: 0; }
  .md-header__button.md-logo { min-height: 2.2rem; margin-block: 0; align-items: center; }
  .md-header .md-source { min-height: 2.2rem; }
  .strio-panel-close { width: 2.2rem; height: 2.2rem; top: .2rem; inset-inline-end: .2rem; }
  .md-sidebar--primary .md-nav--primary .md-nav__link:not(.md-nav__container):not(.md-nav--secondary .md-nav__link),
  .md-sidebar--primary .md-nav--primary > .md-nav__list > .md-nav__item--section > .md-nav__link,
  .md-sidebar--secondary .md-nav__link { min-height: 2.2rem; padding-block: .6rem; }

  .md-typeset .md-code__button { width: 2.2rem; height: 2.2rem; }
  .md-typeset .md-code__nav,
  .md-typeset .highlight:has(> span.filename, > .highlighttable .filename) .md-code__nav { top: .1rem; right: .2rem; }
  /* A separate gutter keeps scrolling code clear of the copy target. */
  .md-typeset pre:has(> .md-code__nav) { padding-inline-end: 2.6rem; background: var(--md-code-bg-color); border-radius: calc(1.8 * var(--strio-radius)); }
  .md-typeset pre:has(> .md-code__nav) > code { border-start-end-radius: 0; border-end-end-radius: 0; }
  /* Titled blocks place the target in their header, outside the code below. */
  .md-typeset .highlight:has(> span.filename) > pre,
  .md-typeset .highlight:has(> .highlighttable .filename) > .highlighttable > tbody > tr > .code > div > pre { padding-inline-end: 0; }
  .md-typeset .highlight:has(> span.filename) > pre > code { border-radius: 0 0 calc(1.8 * var(--strio-radius)) calc(1.8 * var(--strio-radius)); }
  .md-typeset .highlight:has(> span.filename):has(.md-code__nav) > span.filename,
  .md-typeset .highlight:has(.md-code__nav) > .highlighttable > tbody > tr > .filename > span.filename {
    min-height: 2.4rem;
    padding-block: .7rem;
    padding-inline-end: 2.8rem;
    overflow-wrap: anywhere;
  }
}
@media (max-width: 59.984375em) {
  .md-sidebar--secondary .md-nav__title { padding-inline-end: 2.4rem; }
}

@media (max-width: 59.984375em) and (prefers-reduced-motion: reduce) {
  .md-sidebar--secondary .md-sidebar__inner,
  .md-sidebar--secondary [type="checkbox"]:checked ~ .md-sidebar__inner { transform: none; transition: none; }
}

/* Existing documentation enclosures share one fixed corner size.
   Scope this to the article and navigation panels, leaving native search alone. */
.md-content__inner :is(.admonition, details),
.md-content__inner .grid.cards > :is(ul, ol) > li,
.md-content__inner .grid > .card,
.md-content__inner .md-typeset__table table:not([class]),
.md-sidebar--primary .md-nav__source { border-radius: var(--strio-panel-radius); }

/* Each code surface owns its corners; keep parents open for copy/focus controls. */
.md-content__inner pre > code,
.md-content__inner > .highlight > pre > code,
.md-content__inner pre:has(> .md-code__nav) { border-radius: var(--strio-panel-radius); }
.md-content__inner .highlight span.filename { border-radius: var(--strio-panel-radius) var(--strio-panel-radius) 0 0; }
.md-content__inner .highlight:has(> span.filename) > pre,
.md-content__inner .highlight:has(> span.filename) > pre > code { border-radius: 0 0 var(--strio-panel-radius) var(--strio-panel-radius); }

/* A line-number gutter and code cell form one joined panel. */
.md-content__inner .highlight > .highlighttable > tbody > tr > .filename span.filename { border-radius: var(--strio-panel-radius) var(--strio-panel-radius) 0 0; }
.md-content__inner .highlight > .highlighttable > tbody > tr > .linenos { border-radius: 0 0 0 var(--strio-panel-radius); }
.md-content__inner .highlight > .highlighttable > tbody > tr:first-child > .linenos { border-start-start-radius: var(--strio-panel-radius); }
.md-content__inner .highlight > .highlighttable > tbody > tr > .code > div > pre,
.md-content__inner .highlight > .highlighttable > tbody > tr > .code > div > pre > code { border-radius: 0 var(--strio-panel-radius) var(--strio-panel-radius) 0; }
.md-content__inner .highlight > .highlighttable > tbody > tr:nth-child(2) > .code > div > pre,
.md-content__inner .highlight > .highlighttable > tbody > tr:nth-child(2) > .code > div > pre > code { border-start-end-radius: 0; }

/* Luma line tabs: transparent controls with a foreground underline on the selected tab.
 * Reference: shadcn-ui/ui apps/v4/registry/styles/style-luma.css, Tabs.
 * Fixed pixel sizes retain Luma's scale at Zensical's larger root font sizes. */
@media screen {
  .md-content__inner .tabbed-set { gap: 8px; }
  [dir] .md-content__inner .tabbed-set > .tabbed-labels {
    display: inline-flex; align-self: flex-start; align-items: center; gap: 4px;
    width: fit-content; max-width: 100%; height: 36px; margin: 0; padding: 4px;
    border-radius: 0; background: transparent;
    box-shadow: none; scroll-padding-inline: 4px;
  }
  .md-content__inner .tabbed-set > .tabbed-labels::before,
  .md-content__inner .tabbed-set > .tabbed-labels::after { display: none; }
  .md-content__inner .tabbed-labels > label {
    position: relative; display: inline-flex; flex: 1 0 auto; align-items: center; justify-content: center;
    height: 28px; min-height: 28px; margin: 0; padding: 4px 12px;
    border: 1px solid transparent; border-radius: 9999px;
    border-color: transparent !important; /* Luma also overrides native active borders. */
    color: var(--strio-palette-text-muted); background: transparent;
    font-size: 14px; font-weight: 500; line-height: 20px;
    transition: background-color 150ms, color 150ms, box-shadow 150ms;
  }
  .md-content__inner .tabbed-labels > label::after {
    position: absolute; inset-inline: 0; bottom: -5px; height: 2px;
    content: ""; background: var(--strio-palette-text); opacity: 0;
    transition: opacity 150ms;
  }
  .md-content__inner .tabbed-labels--linked > label { padding: 0; }
  body[data-md-color-scheme] .md-content__inner .tabbed-labels--linked > label > a {
    display: inline-flex; align-items: center; justify-content: center;
    width: 100%; height: 100%; padding: 4px 12px; border-radius: inherit;
    color: inherit; text-decoration: none;
  }
  .md-content__inner .tabbed-labels > label:hover { color: var(--strio-palette-text); }
  .md-content__inner .tabbed-set > input:nth-child(1):checked ~ .tabbed-labels > label:nth-child(1),
  .md-content__inner .tabbed-set > input:nth-child(2):checked ~ .tabbed-labels > label:nth-child(2),
  .md-content__inner .tabbed-set > input:nth-child(3):checked ~ .tabbed-labels > label:nth-child(3),
  .md-content__inner .tabbed-set > input:nth-child(4):checked ~ .tabbed-labels > label:nth-child(4),
  .md-content__inner .tabbed-set > input:nth-child(5):checked ~ .tabbed-labels > label:nth-child(5),
  .md-content__inner .tabbed-set > input:nth-child(6):checked ~ .tabbed-labels > label:nth-child(6),
  .md-content__inner .tabbed-set > input:nth-child(7):checked ~ .tabbed-labels > label:nth-child(7),
  .md-content__inner .tabbed-set > input:nth-child(8):checked ~ .tabbed-labels > label:nth-child(8),
  .md-content__inner .tabbed-set > input:nth-child(9):checked ~ .tabbed-labels > label:nth-child(9),
  .md-content__inner .tabbed-set > input:nth-child(10):checked ~ .tabbed-labels > label:nth-child(10),
  .md-content__inner .tabbed-set > input:nth-child(11):checked ~ .tabbed-labels > label:nth-child(11),
  .md-content__inner .tabbed-set > input:nth-child(12):checked ~ .tabbed-labels > label:nth-child(12),
  .md-content__inner .tabbed-set > input:nth-child(13):checked ~ .tabbed-labels > label:nth-child(13),
  .md-content__inner .tabbed-set > input:nth-child(14):checked ~ .tabbed-labels > label:nth-child(14),
  .md-content__inner .tabbed-set > input:nth-child(15):checked ~ .tabbed-labels > label:nth-child(15),
  .md-content__inner .tabbed-set > input:nth-child(16):checked ~ .tabbed-labels > label:nth-child(16),
  .md-content__inner .tabbed-set > input:nth-child(17):checked ~ .tabbed-labels > label:nth-child(17),
  .md-content__inner .tabbed-set > input:nth-child(18):checked ~ .tabbed-labels > label:nth-child(18),
  .md-content__inner .tabbed-set > input:nth-child(19):checked ~ .tabbed-labels > label:nth-child(19),
  .md-content__inner .tabbed-set > input:nth-child(20):checked ~ .tabbed-labels > label:nth-child(20) {
    border-color: transparent; color: var(--strio-palette-text);
    background: transparent;
  }
  .md-content__inner .tabbed-set > input:nth-child(1):checked ~ .tabbed-labels > label:nth-child(1)::after,
  .md-content__inner .tabbed-set > input:nth-child(2):checked ~ .tabbed-labels > label:nth-child(2)::after,
  .md-content__inner .tabbed-set > input:nth-child(3):checked ~ .tabbed-labels > label:nth-child(3)::after,
  .md-content__inner .tabbed-set > input:nth-child(4):checked ~ .tabbed-labels > label:nth-child(4)::after,
  .md-content__inner .tabbed-set > input:nth-child(5):checked ~ .tabbed-labels > label:nth-child(5)::after,
  .md-content__inner .tabbed-set > input:nth-child(6):checked ~ .tabbed-labels > label:nth-child(6)::after,
  .md-content__inner .tabbed-set > input:nth-child(7):checked ~ .tabbed-labels > label:nth-child(7)::after,
  .md-content__inner .tabbed-set > input:nth-child(8):checked ~ .tabbed-labels > label:nth-child(8)::after,
  .md-content__inner .tabbed-set > input:nth-child(9):checked ~ .tabbed-labels > label:nth-child(9)::after,
  .md-content__inner .tabbed-set > input:nth-child(10):checked ~ .tabbed-labels > label:nth-child(10)::after,
  .md-content__inner .tabbed-set > input:nth-child(11):checked ~ .tabbed-labels > label:nth-child(11)::after,
  .md-content__inner .tabbed-set > input:nth-child(12):checked ~ .tabbed-labels > label:nth-child(12)::after,
  .md-content__inner .tabbed-set > input:nth-child(13):checked ~ .tabbed-labels > label:nth-child(13)::after,
  .md-content__inner .tabbed-set > input:nth-child(14):checked ~ .tabbed-labels > label:nth-child(14)::after,
  .md-content__inner .tabbed-set > input:nth-child(15):checked ~ .tabbed-labels > label:nth-child(15)::after,
  .md-content__inner .tabbed-set > input:nth-child(16):checked ~ .tabbed-labels > label:nth-child(16)::after,
  .md-content__inner .tabbed-set > input:nth-child(17):checked ~ .tabbed-labels > label:nth-child(17)::after,
  .md-content__inner .tabbed-set > input:nth-child(18):checked ~ .tabbed-labels > label:nth-child(18)::after,
  .md-content__inner .tabbed-set > input:nth-child(19):checked ~ .tabbed-labels > label:nth-child(19)::after,
  .md-content__inner .tabbed-set > input:nth-child(20):checked ~ .tabbed-labels > label:nth-child(20)::after { opacity: 1; }
  .md-content__inner .tabbed-set > input:nth-child(1):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(1),
  .md-content__inner .tabbed-set > input:nth-child(2):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(2),
  .md-content__inner .tabbed-set > input:nth-child(3):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(3),
  .md-content__inner .tabbed-set > input:nth-child(4):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(4),
  .md-content__inner .tabbed-set > input:nth-child(5):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(5),
  .md-content__inner .tabbed-set > input:nth-child(6):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(6),
  .md-content__inner .tabbed-set > input:nth-child(7):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(7),
  .md-content__inner .tabbed-set > input:nth-child(8):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(8),
  .md-content__inner .tabbed-set > input:nth-child(9):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(9),
  .md-content__inner .tabbed-set > input:nth-child(10):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(10),
  .md-content__inner .tabbed-set > input:nth-child(11):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(11),
  .md-content__inner .tabbed-set > input:nth-child(12):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(12),
  .md-content__inner .tabbed-set > input:nth-child(13):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(13),
  .md-content__inner .tabbed-set > input:nth-child(14):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(14),
  .md-content__inner .tabbed-set > input:nth-child(15):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(15),
  .md-content__inner .tabbed-set > input:nth-child(16):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(16),
  .md-content__inner .tabbed-set > input:nth-child(17):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(17),
  .md-content__inner .tabbed-set > input:nth-child(18):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(18),
  .md-content__inner .tabbed-set > input:nth-child(19):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(19),
  .md-content__inner .tabbed-set > input:nth-child(20):is(:focus-visible, .focus-visible) ~ .tabbed-labels > label:nth-child(20),
  .md-content__inner .tabbed-labels > label:has(> a:focus-visible) {
    outline: 1px solid var(--strio-button-ring); outline-offset: 0;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--strio-button-ring) 50%, transparent);
  }
  .md-content__inner .tabbed-labels > label > a:focus-visible { outline: none; }
  .md-content__inner .tabbed-content > .tabbed-block > :first-child { margin-top: 0; }
}
@media screen and (max-width: 59.984375em), screen and (pointer: coarse) {
  [dir] .md-content__inner .tabbed-set > .tabbed-labels { height: 52px; }
  .md-content__inner .tabbed-labels > label { min-width: 44px; height: 44px; min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  .md-content__inner .tabbed-labels > label,
  .md-content__inner .tabbed-labels > label::after { transition: none; }
}

/* A separated tab panel keeps the same independent code corners as other panels. */
.md-content__inner .tabbed-block > .highlight:first-child > pre > code,
.md-content__inner .tabbed-block > pre:first-child,
.md-content__inner .tabbed-block > pre:first-child > code { border-start-start-radius: var(--strio-panel-radius); border-start-end-radius: var(--strio-panel-radius); }
.md-content__inner .tabbed-block > .highlight:first-child > span.filename,
.md-content__inner .tabbed-block > .highlight:first-child > .highlighttable > tbody > tr > .filename span.filename { border-start-start-radius: var(--strio-panel-radius); border-start-end-radius: var(--strio-panel-radius); }
.md-content__inner .tabbed-block > .highlight:first-child:has(> span.filename) > pre,
.md-content__inner .tabbed-block > .highlight:first-child:has(> span.filename) > pre > code { border-start-start-radius: 0; border-start-end-radius: 0; }
.md-content__inner .tabbed-block > .highlight:first-child > .highlighttable > tbody > tr:first-child > .linenos { border-start-start-radius: var(--strio-panel-radius); }
.md-content__inner .tabbed-block > .highlight:first-child > .highlighttable > tbody > tr > .code > div > pre > code { border-start-end-radius: var(--strio-panel-radius); }
.md-content__inner .tabbed-block > .highlight:first-child > .highlighttable > tbody > tr:nth-child(2) > .code > div > pre > code { border-start-end-radius: 0; }

/* Rendered output continues the code enclosure instead of rounding the join. */
.md-content__inner .highlight:has(+ .result) > pre,
.md-content__inner .highlight:has(+ .result) > pre > code,
.md-content__inner .highlight:has(+ .result) .highlighttable .linenos,
.md-content__inner .highlight:has(+ .result) .highlighttable > tbody > tr > .code > div > pre,
.md-content__inner .highlight:has(+ .result) .highlighttable > tbody > tr > .code > div > pre > code { border-end-start-radius: 0; border-end-end-radius: 0; }
.md-content__inner .highlight + .result { border-radius: 0 0 var(--strio-panel-radius) var(--strio-panel-radius); }

@media (max-width: 59.984375em), (pointer: coarse) {
  /* The standalone copy gutter completes the right edge, outside scrolling code. */
  .md-content__inner .tabbed-block > .highlight:first-child:not(:has(> span.filename)) > pre:has(> .md-code__nav) > code,
  .md-content__inner .tabbed-block > .highlight:first-child > .highlighttable > tbody > tr > .code > div > pre:has(> .md-code__nav) > code { border-start-end-radius: 0; border-end-end-radius: 0; }
  .md-content__inner pre:has(> .md-code__nav) > code,
  .md-content__inner .highlight > .highlighttable > tbody > tr > .code > div > pre:has(> .md-code__nav) > code { border-start-end-radius: 0; border-end-end-radius: 0; }
  .md-content__inner .highlight:has(> span.filename) > pre > code,
  .md-content__inner .highlight:has(> .highlighttable .filename):not(:has(+ .result)) > .highlighttable > tbody > tr > .code > div > pre > code { border-end-end-radius: var(--strio-panel-radius); }
}

/* A filename header must not re-round the seam above an attached output. */
.md-content__inner .highlight:has(> span.filename):has(+ .result) > pre,
.md-content__inner .highlight:has(> span.filename):has(+ .result) > pre > code { border-end-start-radius: 0; border-end-end-radius: 0; }

@media screen and (max-width: 44.984375em) {
  /* The attached output follows the theme's existing mobile code gutters. */
  .md-content__inner > .highlight + .result { margin-inline: 0; border-inline-width: .05rem; }
}