body {
    font-family: var(--vyasa-font-body);
    font-size: var(--vyasa-text-md);
    margin: 0;
    padding: 0;
    line-height: var(--vyasa-leading-prose);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-feature-settings: "cv11", "ss01";
}
::highlight(vyasa-text-fragment),
::target-text {
    color: var(--vyasa-ink);
    background: var(--vyasa-accent-4);
    text-decoration: underline;
    text-decoration-color: var(--vyasa-primary);
}
html,
body {
    min-height: 100%;
}
code, pre { font-family: var(--vyasa-font-mono); }
/* ==========================================================================
   Design tokens. Components use these names only; no raw values in rules.
   Base anchors (paper, ink, primary, fonts, button-radius) are what theme
   presets override. Everything else is derived from them, so it is declared
   on #page-container as well: preset values are inline on that element.
   ========================================================================== */
:root {
    /* Type families: one sans for UI and prose, one mono. */
    --vyasa-font-sans: 'Geist', 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
    --vyasa-font-body: var(--vyasa-font-sans);
    --vyasa-font-heading: var(--vyasa-font-sans);
    --vyasa-font-ui: var(--vyasa-font-sans);
    --vyasa-font-mono: 'Geist Mono', 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

    /* Base anchors, light. shadcn neutral. */
    --vyasa-paper: #ffffff;
    --vyasa-paper-raised: #ffffff;
    --vyasa-ink: #0a0a0a;
    --vyasa-ink-soft: #737373;
    --vyasa-primary: #2563eb;
    --vyasa-primary-dim: #1d4ed8;
    --vyasa-primary-text: #ffffff;
    --vyasa-selection-fg: #ffffff;
    --vyasa-button-radius: 8px;
    --vyasa-shadow-alpha: 0.1;

    /* Type scale (px): 12 13 14 16 20 24 32. */
    --vyasa-text-xs: 0.75rem;
    --vyasa-text-sm: 0.8125rem;
    --vyasa-text-base: 0.875rem;
    --vyasa-text-md: 1rem;
    --vyasa-text-lg: 1.25rem;
    --vyasa-text-xl: 1.5rem;
    --vyasa-text-2xl: 2rem;
    --vyasa-leading-tight: 1.25;
    --vyasa-leading-snug: 1.4;
    --vyasa-leading-prose: 1.65;
    --vyasa-weight-regular: 400;
    --vyasa-weight-medium: 500;
    --vyasa-weight-semibold: 600;

    /* Space scale (px): 4 8 12 16 24 32 48. */
    --vyasa-space-1: 0.25rem;
    --vyasa-space-2: 0.5rem;
    --vyasa-space-3: 0.75rem;
    --vyasa-space-4: 1rem;
    --vyasa-space-5: 1.5rem;
    --vyasa-space-6: 2rem;
    --vyasa-space-7: 3rem;

    /* Radii (shadcn): sm 6, md 8 (preset-overridable), lg 10, xl 14; pill only for avatars. */
    --vyasa-radius-sm: 6px;
    --vyasa-radius-lg: 10px;
    --vyasa-radius-xl: 14px;
    --vyasa-radius-pill: 999px;

    /* Motion. */
    --vyasa-duration-fast: 120ms;
    --vyasa-duration-base: 180ms;
    --vyasa-ease: cubic-bezier(0.2, 0, 0, 1);

    /* Icons. */
    --vyasa-icon-size: 16px;
    --vyasa-icon-stroke: 1.5;

    /* Sidebar tree rows (on the space scale). */
    --vyasa-tree-row-px: var(--vyasa-space-2);
    --vyasa-tree-row-py: var(--vyasa-space-1);
    --vyasa-tree-row-gap: 0px;
    --vyasa-tree-row-icon-gap: var(--vyasa-space-2);
    --vyasa-tree-row-action-gap: 0px;
    --vyasa-tree-row-action-pad: 2px;
    --vyasa-tree-row-state-gap: var(--vyasa-space-1);
    --vyasa-tree-item-gap: 1px;
    --vyasa-heading-before-gap: var(--vyasa-space-5);
    --vyasa-heading-after-gap: var(--vyasa-space-2);

    /* Syntax fallbacks; code surfaces are derived per theme below. */
    --vyasa-code-comment: #6e7781;
    --vyasa-code-keyword: #cf222e;
    --vyasa-code-string: #0a3069;
    --vyasa-code-title: #8250df;
    --vyasa-code-number: #0550ae;

    /* Status hues (used sparingly: success, warning, danger, highlight). */
    --vyasa-success: #18794e;
    --vyasa-warning: #ab6400;
    --vyasa-danger: #ce2c31;
    --vyasa-highlight: #ffe629;
}
:root,
#page-container {
    /* Neutral 12-step scale (Radix roles), mixed from paper and ink.
       1-2 app bg, 3-5 component bg (rest/hover/pressed), 6-8 borders,
       9-10 solid, 11-12 text. */
    --vyasa-paper-low: color-mix(in srgb, var(--vyasa-ink) 2%, var(--vyasa-paper));
    --vyasa-gray-1: var(--vyasa-paper);
    --vyasa-gray-2: var(--vyasa-paper-low);
    --vyasa-gray-3: color-mix(in srgb, var(--vyasa-ink) 4%, var(--vyasa-paper));
    --vyasa-gray-4: color-mix(in srgb, var(--vyasa-ink) 6.5%, var(--vyasa-paper));
    --vyasa-gray-5: color-mix(in srgb, var(--vyasa-ink) 8.5%, var(--vyasa-paper));
    --vyasa-gray-6: color-mix(in srgb, var(--vyasa-ink) 10%, var(--vyasa-paper));
    --vyasa-gray-7: color-mix(in srgb, var(--vyasa-ink) 15%, var(--vyasa-paper));
    --vyasa-gray-8: color-mix(in srgb, var(--vyasa-ink) 28%, var(--vyasa-paper));
    --vyasa-gray-9: color-mix(in srgb, var(--vyasa-ink) 46%, var(--vyasa-paper));
    --vyasa-gray-10: color-mix(in srgb, var(--vyasa-ink) 52%, var(--vyasa-paper));
    --vyasa-gray-11: var(--vyasa-ink-soft);
    --vyasa-gray-12: var(--vyasa-ink);

    /* Accent scale from the one primary hue. */
    --vyasa-accent-3: color-mix(in srgb, var(--vyasa-primary) 10%, var(--vyasa-paper));
    --vyasa-accent-4: color-mix(in srgb, var(--vyasa-primary) 16%, var(--vyasa-paper));
    --vyasa-accent-7: color-mix(in srgb, var(--vyasa-primary) 40%, var(--vyasa-paper));
    --vyasa-accent-9: var(--vyasa-primary);
    --vyasa-accent-10: var(--vyasa-primary-dim);
    --vyasa-accent-11: color-mix(in srgb, var(--vyasa-primary) 78%, var(--vyasa-ink));
    --vyasa-accent-contrast: var(--vyasa-primary-text);

    /* Semantic roles. */
    --vyasa-bg: var(--vyasa-gray-1);
    --vyasa-bg-subtle: var(--vyasa-gray-2);
    --vyasa-surface: var(--vyasa-paper-raised);
    --vyasa-hover: var(--vyasa-gray-3);
    --vyasa-active: var(--vyasa-gray-4);
    --vyasa-border: var(--vyasa-gray-6);
    --vyasa-border-strong: var(--vyasa-gray-7);
    --vyasa-text: var(--vyasa-gray-12);
    --vyasa-text-muted: var(--vyasa-gray-11);
    --vyasa-text-faint: var(--vyasa-gray-9);
    --vyasa-paper-accent: var(--vyasa-gray-4);
    --vyasa-outline-ghost: var(--vyasa-border);
    --vyasa-outline: var(--vyasa-gray-8);
    --vyasa-link: var(--vyasa-accent-11);
    --vyasa-link-hover: var(--vyasa-ink);
    --vyasa-selection-bg: var(--vyasa-accent-4);
    --vyasa-focus-ring: var(--vyasa-primary);

    /* Controls keep the theme button radius; containers cap it, so a pill theme keeps rectangle menus. */
    --vyasa-control-radius: var(--vyasa-button-radius);
    --vyasa-radius-md: min(var(--vyasa-button-radius), 1rem);
    --vyasa-rect-radius: var(--vyasa-radius-md);

    /* shadcn shadow scale: xs controls, sm cards, md menus/popovers, lg dialogs. */
    --vyasa-shadow-none: none;
    --vyasa-shadow-xs: 0 1px 2px 0 rgb(0 0 0 / calc(var(--vyasa-shadow-alpha) * 0.5));
    --vyasa-shadow-card: 0 1px 3px 0 rgb(0 0 0 / var(--vyasa-shadow-alpha)), 0 1px 2px -1px rgb(0 0 0 / var(--vyasa-shadow-alpha));
    --vyasa-shadow-sm: 0 4px 6px -1px rgb(0 0 0 / var(--vyasa-shadow-alpha)), 0 2px 4px -2px rgb(0 0 0 / var(--vyasa-shadow-alpha));
    --vyasa-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / var(--vyasa-shadow-alpha)), 0 4px 6px -4px rgb(0 0 0 / var(--vyasa-shadow-alpha));
    --vyasa-ring: color-mix(in srgb, var(--vyasa-primary) 40%, transparent);

    /* Code surfaces follow the theme's own greys and accent. */
    --vyasa-code-bg: var(--vyasa-gray-2);
    --vyasa-code-fg: var(--vyasa-ink);
    --vyasa-code-border: var(--vyasa-border);
    --vyasa-code-highlight-bg: color-mix(in srgb, var(--vyasa-primary) 18%, var(--vyasa-code-bg));
    --vyasa-code-highlight-accent: var(--vyasa-primary);
    --vyasa-inline-code-bg: var(--vyasa-gray-3);
    --vyasa-inline-code-fg: var(--vyasa-code-fg);
    --vyasa-inline-code-border: var(--vyasa-gray-5);

    --vyasa-emphasis-control-text: var(--vyasa-ink);
    --vyasa-emphasis-control-bg: transparent;
    --vyasa-emphasis-control-bg-hover: var(--vyasa-hover);
    --vyasa-emphasis-control-border: transparent;
    --vyasa-emphasis-control-menu-text: var(--vyasa-ink);
    --vyasa-emphasis-control-menu-bg: var(--vyasa-surface);
    --vyasa-emphasis-control-menu-border: var(--vyasa-border);
    --vyasa-emphasis-control-menu-option-hover: var(--vyasa-hover);
}
.dark,
.dark #page-container {
    /* Dark mode from neutral greys (Radix slate dark 1/2/3/12/11). Presets
       keep their own surfaces through the --vyasa-dark-* anchors. */
    --vyasa-paper: var(--vyasa-dark-paper, #0a0a0a) !important;
    --vyasa-paper-low: var(--vyasa-dark-paper-low, #121212) !important;
    --vyasa-paper-raised: var(--vyasa-dark-paper-raised, #171717) !important;
    --vyasa-ink: var(--vyasa-dark-ink, #fafafa) !important;
    --vyasa-ink-soft: var(--vyasa-dark-ink-soft, #a1a1a1) !important;
    --vyasa-primary-text: var(--vyasa-dark-primary-text, var(--vyasa-primary-text)) !important;
    --vyasa-accent-11: color-mix(in srgb, var(--vyasa-primary) 62%, var(--vyasa-ink));
    --vyasa-shadow-alpha: 0.35;
    --vyasa-code-bg: var(--vyasa-dark-code-bg, var(--vyasa-gray-2)) !important;
    --vyasa-code-fg: var(--vyasa-dark-code-fg, var(--vyasa-ink)) !important;
    --vyasa-code-border: var(--vyasa-dark-code-border, var(--vyasa-border)) !important;
    --vyasa-code-highlight-bg: var(--vyasa-dark-code-highlight-bg, color-mix(in srgb, var(--vyasa-primary) 24%, var(--vyasa-code-bg))) !important;
    --vyasa-inline-code-bg: var(--vyasa-dark-inline-code-bg, var(--vyasa-gray-3)) !important;
    --vyasa-inline-code-fg: var(--vyasa-dark-inline-code-fg, var(--vyasa-code-fg)) !important;
    --vyasa-inline-code-border: var(--vyasa-dark-inline-code-border, var(--vyasa-gray-5)) !important;
    --vyasa-outline-ghost: var(--vyasa-dark-outline-ghost, var(--vyasa-border)) !important;
    --vyasa-success: #3dd68c;
    --vyasa-warning: #ffca16;
    --vyasa-danger: #ff9592;
    /* Dark steps need wider gaps to read as distinct. */
    --vyasa-gray-3: color-mix(in srgb, var(--vyasa-ink) 9%, var(--vyasa-paper));
    --vyasa-gray-4: color-mix(in srgb, var(--vyasa-ink) 12%, var(--vyasa-paper));
    --vyasa-gray-5: color-mix(in srgb, var(--vyasa-ink) 14%, var(--vyasa-paper));
    --vyasa-gray-6: color-mix(in srgb, var(--vyasa-ink) 13%, var(--vyasa-paper));
    --vyasa-gray-7: color-mix(in srgb, var(--vyasa-ink) 25%, var(--vyasa-paper));
    --vyasa-gray-8: color-mix(in srgb, var(--vyasa-ink) 35%, var(--vyasa-paper));
    --vyasa-gray-9: color-mix(in srgb, var(--vyasa-ink) 50%, var(--vyasa-paper));
    --vyasa-gray-10: color-mix(in srgb, var(--vyasa-ink) 56%, var(--vyasa-paper));
    --vyasa-accent-3: color-mix(in srgb, var(--vyasa-primary) 16%, var(--vyasa-paper));
    --vyasa-accent-4: color-mix(in srgb, var(--vyasa-primary) 24%, var(--vyasa-paper));
    --vyasa-accent-7: color-mix(in srgb, var(--vyasa-primary) 48%, var(--vyasa-paper));
}
/* Franken UI / shadcn variables (used by MonsterUI, UIkit and the daisyUI
   shim for tables, dividers, inputs, dropdowns, inline code, ...) are fixed
   to the slate theme. Point them at Vyasa tokens so every library component
   follows the active preset in light and dark. Franken reads them as
   hsl(var(--x)), so each is an HSL channel list via relative colour syntax.
   !important beats .uk-theme-* and .dark.uk-theme-* on <html>. */
:root,
#page-container {
    --background: from var(--vyasa-bg) h s l !important;
    --foreground: from var(--vyasa-ink) h s l !important;
    --card: from var(--vyasa-surface) h s l !important;
    --card-foreground: from var(--vyasa-ink) h s l !important;
    --popover: from var(--vyasa-surface) h s l !important;
    --popover-foreground: from var(--vyasa-ink) h s l !important;
    --primary: from var(--vyasa-primary) h s l !important;
    --primary-foreground: from var(--vyasa-accent-contrast) h s l !important;
    --secondary: from var(--vyasa-gray-3) h s l !important;
    --secondary-foreground: from var(--vyasa-ink) h s l !important;
    --muted: from var(--vyasa-gray-3) h s l !important;
    --muted-foreground: from var(--vyasa-text-muted) h s l !important;
    --accent: from var(--vyasa-hover) h s l !important;
    --accent-foreground: from var(--vyasa-ink) h s l !important;
    --destructive: from var(--vyasa-danger) h s l !important;
    --destructive-foreground: from var(--vyasa-gray-1) h s l !important;
    --border: from var(--vyasa-border) h s l !important;
    --input: from var(--vyasa-border) h s l !important;
    --ring: from var(--vyasa-primary) h s l !important;
}
/* Focus: shadcn-style 3px soft accent ring, keyboard focus only. */
:where(a, button, summary, input, select, textarea, [tabindex]):focus-visible {
    outline: 3px solid var(--vyasa-ring);
    outline-offset: 1px;
}
:where(a, button, summary, [tabindex]):focus:not(:focus-visible) { outline: none; }
/* Icons: Lucide at a 1.5 stroke everywhere. */
:where(uk-icon, [uk-icon], .uk-icon) svg { stroke-width: var(--vyasa-icon-stroke); }
.tabular-nums,
time,
.vyasa-read-time,
table td,
table th { font-variant-numeric: tabular-nums; }
@media (prefers-reduced-motion: reduce) {
    :root { --vyasa-duration-fast: 0ms; --vyasa-duration-base: 0ms; }
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

body { color: var(--vyasa-ink); }
a { color: var(--vyasa-link); text-decoration-color: color-mix(in srgb, currentColor 35%, transparent); text-underline-offset: 0.18em; transition: color var(--vyasa-duration-fast) var(--vyasa-ease), text-decoration-color var(--vyasa-duration-fast) var(--vyasa-ease); }
a:hover { color: var(--vyasa-link-hover); text-decoration-color: currentColor; }
.vyasa-mark {
    color: var(--vyasa-ink);
    background: color-mix(in srgb, var(--vyasa-highlight) 45%, transparent);
    border-radius: 2px;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    padding: 0.02em 0.16em;
}
.dark .vyasa-mark {
    background: color-mix(in srgb, var(--vyasa-highlight) 28%, transparent);
}
/* Page surface. !important beats MonsterUI's body bg-background/text-foreground. */
html, body, #page-container { background: var(--vyasa-paper) !important; color: var(--vyasa-ink) !important; }
#page-container { min-height: 100vh; }
/* Dim raster media in dark mode so bright images don't glare; opt out with .vyasa-no-dim. */
.dark img:not(.vyasa-no-dim):not([src$=".svg"]),
.dark video:not(.vyasa-no-dim) { filter: brightness(0.86) contrast(1.04); transition: filter var(--vyasa-duration-base) var(--vyasa-ease); }
.dark img:hover:not(.vyasa-no-dim):not([src$=".svg"]) { filter: none; }
h1, h2, h3, h4, h5, h6 {
    font-family: var(--vyasa-font-heading);
    font-weight: var(--vyasa-weight-semibold);
    color: var(--vyasa-ink);
    letter-spacing: -0.011em;
    line-height: var(--vyasa-leading-tight);
}
h1 { font-size: var(--vyasa-text-2xl); letter-spacing: -0.02em; }
hr {
    border: 0;
    height: 1px;
    width: 100%;
    margin: var(--vyasa-space-6) 0;
    background: var(--vyasa-border);
}
/* Doubled --- (markdown/renderer.py _render_double_rules): the stronger break between posts.
   A 3px bar that fades at both ends, with a diamond in a gap at the centre. */
.vyasa-double-rule {
    position: relative;
    box-sizing: content-box;
    width: 100%;
    height: 1rem;
    /* Padding, not margin: the rule is often a section's last child, where margins are reset. */
    margin: 0 !important;
    padding-block: var(--vyasa-space-5);
}
.vyasa-double-rule::before,
.vyasa-double-rule::after {
    content: "";
    position: absolute;
    top: 50%;
}
.vyasa-double-rule::before {
    left: 0;
    right: 0;
    height: 3px;
    border-radius: 3px;
    transform: translateY(-50%);
    background: linear-gradient(90deg, transparent, var(--vyasa-border-strong) 18%, var(--vyasa-border-strong) 82%, transparent);
    -webkit-mask: linear-gradient(90deg, #000 calc(50% - 1.25rem), transparent calc(50% - 1.25rem), transparent calc(50% + 1.25rem), #000 calc(50% + 1.25rem));
    mask: linear-gradient(90deg, #000 calc(50% - 1.25rem), transparent calc(50% - 1.25rem), transparent calc(50% + 1.25rem), #000 calc(50% + 1.25rem));
}
.vyasa-double-rule::after {
    left: 50%;
    width: 0.7rem;
    height: 0.7rem;
    border: 2px solid var(--vyasa-border-strong);
    border-radius: 2px;
    transform: translate(-50%, -50%) rotate(45deg);
}
.vyasa-double-rule hr {
    display: none;
}
.uk-text-meta, .toc-link, summary, button, .vyasa-caption {
    font-family: var(--vyasa-font-ui);
}

.vyasa-navbar-card,
.vyasa-sidebar,
.vyasa-sidebar-card,
.vyasa-sidebar-toggle,
.vyasa-sidebar-body,
.vyasa-mobile-panel,
.vyasa-mobile-panel-header,
.vyasa-mobile-panel-body,
.vyasa-footer-card,
.toc-link,
.tab-button,
button,
input,
select,
textarea,
label,
summary {
    font-family: var(--vyasa-font-ui);
}

.vyasa-sidebar-body a,
.vyasa-sidebar-body li,
.vyasa-sidebar-body span,
.vyasa-sidebar-body div,
.vyasa-sidebar-body input::placeholder,
.vyasa-mobile-panel-body a,
.vyasa-mobile-panel-body li,
.vyasa-mobile-panel-body span,
.vyasa-mobile-panel-body div {
    font-family: var(--vyasa-font-ui);
}

#main-content,
#main-content .sidenote {
    font-family: var(--vyasa-font-body);
}
#main-content {
    font-size: var(--vyasa-content-font-size, var(--vyasa-text-md));
    letter-spacing: var(--vyasa-body-letter-spacing, -0.006em);
    line-height: var(--vyasa-body-line-height, var(--vyasa-leading-prose));
    -webkit-text-stroke: var(--vyasa-body-stroke-width, 0) currentColor;
}
#main-content p.text-base,
#main-content li.text-base,
#main-content ul.text-base,
#main-content ol.text-base {
    font-size: var(--vyasa-content-font-size, var(--vyasa-text-md));
    font-weight: var(--vyasa-body-font-weight, var(--vyasa-weight-regular));
    line-height: inherit;
}
/* Paragraph gap 16px; list items sit closer (4px) so lists read as one unit. */
#main-content p.text-base { margin-bottom: var(--vyasa-space-4); }
#main-content ul.uk-list,
#main-content ol.uk-list { margin-bottom: var(--vyasa-space-4); }
#main-content .uk-list > li + li {
    margin-top: var(--vyasa-list-item-gap, var(--vyasa-space-1)) !important;
}
#main-content h1, #main-content h2, #main-content h3,
#main-content h4, #main-content h5, #main-content h6 {
    letter-spacing: var(--vyasa-heading-letter-spacing, -0.025em);
    font-weight: var(--vyasa-heading-font-weight, var(--vyasa-weight-semibold));
    line-height: var(--vyasa-leading-tight);
    margin-bottom: var(--vyasa-heading-content-gap, var(--vyasa-space-3));
    -webkit-text-stroke: var(--vyasa-heading-stroke-width, 0) currentColor;
}
/* Off-canvas slide-in panels (translate-x-full) must not widen the page;
   hidden is the fallback for Safari < 16 which lacks overflow clip */
html,
body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    overflow-x: clip;
}
.vyasa-content-grid {
    min-width: 0;
    max-width: 100%;
    overflow: clip;
}
#page-container,
#content-with-sidebars,
.vyasa-main-shell,
#content-with-sidebars > .layout-container {
    min-width: 0;
    box-sizing: border-box;
}
.vyasa-posts-sidebar {
    width: var(--vyasa-posts-sidebar-width, var(--vyasa-sidebar-width, 22rem));
    margin-right: min(0px, calc(var(--vyasa-sidebar-width, 22rem) - var(--vyasa-posts-sidebar-width, var(--vyasa-sidebar-width, 22rem))));
}
.vyasa-toc-sidebar {
    width: var(--vyasa-toc-sidebar-width, var(--vyasa-sidebar-width, 22rem));
    margin-left: min(0px, calc(var(--vyasa-sidebar-width, 22rem) - var(--vyasa-toc-sidebar-width, var(--vyasa-sidebar-width, 22rem))));
}
html {
    --vyasa-reserved-left: 0px;
    --vyasa-reserved-right: 0px;
}
/* Declared on #page-container, which owns the sidebar widths, so var()
   resolves against the resized value instead of html's fallback. Space is
   reserved only for a sidebar the page rendered; a KG page has no TOC. */
@media (min-width: 1280px) {
    html:not([data-vyasa-hide-posts-sidebar]) #page-container:has(.vyasa-posts-sidebar) {
        --vyasa-reserved-left: var(--vyasa-posts-sidebar-width, var(--vyasa-sidebar-width, 22rem));
    }
    html:not([data-vyasa-hide-toc-sidebar]) #page-container:has(.vyasa-toc-sidebar) {
        --vyasa-reserved-right: var(--vyasa-toc-sidebar-width, var(--vyasa-sidebar-width, 22rem));
    }
}
#content-with-sidebars {
    padding-left: var(--vyasa-reserved-left);
    padding-right: var(--vyasa-reserved-right);
}
#content-with-sidebars .vyasa-main-shell > *,
#content-with-sidebars .tasks-container,
#content-with-sidebars .mermaid-container,
#content-with-sidebars .d2-container,
#content-with-sidebars .code-block,
#content-with-sidebars .vyasa-tree-doc,
#content-with-sidebars .vyasa-table-scroll {
    max-width: 100% !important;
    box-sizing: border-box;
}
#content-with-sidebars .vyasa-main-shell img,
#content-with-sidebars .vyasa-main-shell video,
#content-with-sidebars .vyasa-main-shell iframe,
#content-with-sidebars .vyasa-main-shell canvas {
    max-width: 100%;
}
#content-with-sidebars .tasks-container:not([data-tasks-maximized="true"]) {
    width: 100% !important;
    left: auto !important;
    transform: none !important;
}
.vyasa-sidebar-docked {
    position: fixed !important;
    top: var(--vyasa-navbar-height, 3.75rem) !important;
    height: calc(100dvh - var(--vyasa-navbar-height, 3.75rem)) !important;
    z-index: 1000;
    background: var(--vyasa-bg-subtle);
}
.vyasa-posts-sidebar.vyasa-sidebar-docked { left: 0 !important; }
.vyasa-toc-sidebar.vyasa-sidebar-docked { right: 0 !important; }
.vyasa-sidebar-docked > .vyasa-sidebar-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}
/* Chrome 131+ wraps details children in ::details-content; without this the
   sidebar body has no bounded height and the column can't scroll */
.vyasa-sidebar-docked > .vyasa-sidebar-card::details-content {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}
.vyasa-sidebar-docked .vyasa-sidebar-toggle,
.vyasa-sidebar-docked .vyasa-sidebar-body,
.vyasa-sidebar-docked .vyasa-sidebar-card {
    background: transparent;
    border: 0;
    box-shadow: none;
    border-radius: 0;
}
.vyasa-sidebar-docked .vyasa-sidebar-toggle {
    margin: 0;
    border-bottom: 1px solid var(--vyasa-border);
}
.vyasa-sidebar-docked .vyasa-sidebar-body {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none !important;
    overflow-y: auto;
}
.vyasa-sidebar-docked.vyasa-sidebar-hidden,
html[data-vyasa-hide-posts-sidebar] #posts-sidebar,
html[data-vyasa-hide-toc-sidebar] #toc-sidebar {
    display: none !important;
}
[data-vyasa-sidebar-toggle].vyasa-sidebar-toggle-pulse,
.vyasa-sidebar-hover-toggle.vyasa-sidebar-toggle-pulse,
.vyasa-folder-pin.vyasa-sidebar-toggle-pulse {
    animation: vyasa-sidebar-toggle-pulse 1.2s var(--vyasa-ease);
}
@keyframes vyasa-sidebar-toggle-pulse {
    0%, 100% { box-shadow: 0 0 0 0 transparent; }
    30% { box-shadow: 0 0 0 4px var(--vyasa-accent-4); }
}
.vyasa-sidebar-resizer {
    position: absolute; top: 0; bottom: 0; width: 12px; z-index: 20; cursor: col-resize; touch-action: none;
}
.vyasa-posts-sidebar .vyasa-sidebar-resizer { right: -6px; }
.vyasa-toc-sidebar .vyasa-sidebar-resizer { left: -6px; }
.vyasa-sidebar-resizer::after {
    content: ""; position: absolute; top: 1rem; bottom: 1rem; left: 5px; width: 2px; border-radius: 999px;
    background: var(--vyasa-border-strong); opacity: 0; transition: opacity var(--vyasa-duration-fast) var(--vyasa-ease);
}
.vyasa-sidebar:hover .vyasa-sidebar-resizer::after,
.vyasa-sidebar-resizer:focus-visible::after,
.vyasa-sidebar-resizing .vyasa-sidebar-resizer::after { opacity: 1; }
#main-content a,
#main-content a:visited {
    color: var(--vyasa-link) !important;
}
#main-content a:hover {
    color: var(--vyasa-link-hover) !important;
}

#main-content h1,
#main-content h2,
#main-content h3,
#main-content h4,
#main-content h5,
#main-content h6 {
    font-family: var(--vyasa-font-heading);
    color: var(--vyasa-ink) !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

#main-content .vyasa-page-title { font-size: var(--vyasa-text-2xl); letter-spacing: -0.02em; }
#main-content .vyasa-doc-h1 { font-size: var(--vyasa-text-xl); letter-spacing: -0.015em; }
#main-content .vyasa-doc-h2 { font-size: var(--vyasa-text-lg); padding-bottom: var(--vyasa-space-2); border-bottom: 1px solid var(--vyasa-border); }
#main-content .vyasa-heading-fold-summary:has(> .vyasa-doc-h2) { border-bottom: 1px solid var(--vyasa-border); padding-bottom: var(--vyasa-space-2); }
#main-content .vyasa-heading-fold-summary > .vyasa-doc-h2 { border-bottom: 0; padding-bottom: 0; }
#main-content blockquote { margin-block: var(--vyasa-space-4); padding-left: var(--vyasa-space-5); border-left: 2px solid var(--vyasa-border); font-style: italic; color: var(--vyasa-text-muted); }
#main-content .vyasa-doc-h3 { font-size: var(--vyasa-text-md); }
#main-content .vyasa-doc-h4,
#main-content h5,
#main-content h6 { font-size: var(--vyasa-text-base); }

#main-content > div > h1,
#main-content > div > h2,
#main-content > div > h3,
#main-content > div > h4,
#main-content > div > h5,
#main-content > div > h6,
#main-content .text-4xl.font-bold,
#main-content .text-3xl.font-bold,
#main-content .text-2xl.font-semibold,
#main-content .text-xl.font-semibold,
#main-content .text-lg.font-semibold {
    color: var(--vyasa-ink) !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

/* Baseline ink for sidebar chrome. Zero specificity so row and control
   contracts (.vyasa-tree-row, .toc-link, actions) set their own colours. */
:where(.vyasa-sidebar-toggle, .vyasa-sidebar-body, .vyasa-mobile-panel-body),
:where(.vyasa-sidebar-toggle) :where(span, summary, uk-icon, [uk-icon]),
:where(.vyasa-sidebar-body, .vyasa-mobile-panel-body) :where(a, span, div, li, summary) {
    color: var(--vyasa-ink);
}

.vyasa-navbar-shell,
.vyasa-footer-shell,
.vyasa-content-grid {
    position: relative;
}

.vyasa-footer-shell {
    display: block;
    width: 100%;
    margin: auto 0 0 0;
    padding: 0;
    background: var(--vyasa-bg);
    color: var(--vyasa-text-muted);
    border-top: 1px solid var(--vyasa-border);
    box-sizing: border-box;
}

.vyasa-navbar-card {
    /* Local override: navbar text/controls follow ink so they track light/dark.
       Cascades to descendants (search trigger, input, icons) that reference it. */
    --vyasa-primary-text: var(--vyasa-ink);
    background: color-mix(in srgb, var(--vyasa-bg) 88%, transparent);
    -webkit-backdrop-filter: saturate(1.8) blur(12px);
    backdrop-filter: saturate(1.8) blur(12px);
    color: var(--vyasa-ink);
    border-radius: 0;
    box-shadow: none;
    border-bottom: 1px solid var(--vyasa-border);
}


/* Navbar: brand text and borderless icon buttons with grey hover. */
.vyasa-navbar-card a.vyasa-navbar-brand {
    color: var(--vyasa-ink) !important;
    font: var(--vyasa-weight-semibold) var(--vyasa-text-base)/var(--vyasa-leading-tight) var(--vyasa-font-ui);
    letter-spacing: -0.006em;
    text-decoration: none;
}
.vyasa-navbar-icon-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.25rem;
    height: 2.25rem;
    padding: 0 var(--vyasa-space-2);
    border: 0;
    border-radius: var(--vyasa-control-radius);
    background: transparent;
    font: var(--vyasa-weight-medium) var(--vyasa-text-sm)/1 var(--vyasa-font-ui);
    cursor: pointer;
}

.vyasa-navbar-card a,
.vyasa-navbar-card button,
.vyasa-navbar-card summary,
.vyasa-navbar-card :is(uk-icon, [uk-icon]) {
    color: var(--vyasa-text-muted) !important;
}

.vyasa-navbar-card button,
.vyasa-navbar-card summary {
    transition: background-color var(--vyasa-duration-fast) var(--vyasa-ease), color var(--vyasa-duration-fast) var(--vyasa-ease);
}
.vyasa-navbar-card button:hover,
.vyasa-navbar-card summary:hover {
    background: var(--vyasa-hover) !important;
    color: var(--vyasa-ink) !important;
}
.vyasa-navbar-card button:hover :is(uk-icon, [uk-icon]),
.vyasa-navbar-card summary:hover :is(uk-icon, [uk-icon]),
.vyasa-navbar-card button:hover svg,
.vyasa-navbar-card summary:hover svg {
    color: var(--vyasa-ink) !important;
}

/* Git-ref switcher: identical row chrome at every hierarchy level.
   Depth is applied as inline padding-left; everything else is uniform here. */
.vyasa-ref-switcher ul { margin: 0; padding: 0; list-style: none; }
.vyasa-ref-switcher > summary { list-style: none; }
.vyasa-ref-switcher > summary::-webkit-details-marker { display: none; }
.vyasa-ref-row {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    text-align: left;
    box-sizing: border-box;
    width: 100%;
    height: 2rem;
    gap: var(--vyasa-space-2);
    padding: 0 var(--vyasa-space-2);
    line-height: var(--vyasa-leading-tight);
    font-size: var(--vyasa-text-sm);
    font-weight: var(--vyasa-weight-regular);
    border: 0;
    background: transparent;
    cursor: pointer;
    list-style: none;
}
.vyasa-ref-row::-webkit-details-marker { display: none; }
.vyasa-ref-row::marker { content: ""; }
.vyasa-ref-select {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    height: 100%;
    margin: 0;
    border: 0;
    padding: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    line-height: inherit;
    text-align: left;
    appearance: none;
    cursor: pointer;
}
.vyasa-ref-switcher .vyasa-ref-select:hover,
.vyasa-ref-switcher .vyasa-ref-select:focus {
    background: transparent !important;
}
/* Icon buttons (refresh / working-tree): fixed square that fits the row, no
   highlight box of its own (scoped to out-specify .vyasa-navbar-card button). */
.vyasa-ref-refresh {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    height: 1.5rem;
    width: 1.5rem;
    padding: 0;
    border: 0;
    line-height: 1;
    cursor: pointer;
    opacity: 0.55;
    transition: opacity var(--vyasa-duration-fast) var(--vyasa-ease);
}
.vyasa-ref-switcher .vyasa-ref-refresh,
.vyasa-ref-switcher .vyasa-ref-refresh:hover,
.vyasa-ref-switcher .vyasa-ref-refresh:focus {
    background: transparent !important;
}
.vyasa-ref-refresh:hover { opacity: 1; }

.vyasa-navbar-search-trigger {
    border: 1px solid var(--vyasa-border);
    background: var(--vyasa-bg);
    box-shadow: var(--vyasa-shadow-xs);
    color: var(--vyasa-text-muted) !important;
    font-size: var(--vyasa-text-sm);
    transition: border-color var(--vyasa-duration-fast) var(--vyasa-ease), background-color var(--vyasa-duration-fast) var(--vyasa-ease);
}

.vyasa-navbar-search-trigger:hover,
.vyasa-navbar-search-trigger:focus-visible {
    border-color: var(--vyasa-border-strong);
    background: var(--vyasa-hover) !important;
}

.vyasa-navbar-search-kbd {
    border-left: 1px solid var(--vyasa-border);
    padding-left: var(--vyasa-space-2);
    font: var(--vyasa-weight-medium) var(--vyasa-text-xs)/1 var(--vyasa-font-ui);
    color: var(--vyasa-text-faint);
}

/* One text-input contract (shadcn Input): 36px, 1px border, md radius,
   xs shadow; focus = accent border plus a soft 3px accent ring. */
.vyasa-navbar-search-input,
.posts-search-input {
    box-sizing: border-box;
    height: 2.25rem;
    padding: 0 var(--vyasa-space-3);
    border: 1px solid var(--vyasa-border);
    border-radius: var(--vyasa-control-radius);
    background: transparent;
    color: var(--vyasa-ink) !important;
    font: var(--vyasa-weight-regular) var(--vyasa-text-base)/1 var(--vyasa-font-ui);
    box-shadow: var(--vyasa-shadow-xs);
    transition: border-color var(--vyasa-duration-fast) var(--vyasa-ease), box-shadow var(--vyasa-duration-fast) var(--vyasa-ease);
}
.vyasa-navbar-search-input::placeholder,
.posts-search-input::placeholder { color: var(--vyasa-text-faint); opacity: 1; }
.dark .vyasa-navbar-search-input,
.dark .posts-search-input { background: color-mix(in srgb, var(--vyasa-border) 30%, transparent); }
.vyasa-navbar-search-input:focus,
.vyasa-navbar-search-input:focus-visible,
.posts-search-input:focus,
.posts-search-input:focus-visible {
    outline: none;
    border-color: var(--vyasa-primary);
    box-shadow: 0 0 0 3px var(--vyasa-ring);
}
.vyasa-navbar-search-input::-webkit-search-cancel-button,
.posts-search-input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }

.vyasa-navbar-search-results {
    position: absolute;
    top: calc(100% + 0.5rem);
    left: 0;
    width: 100%;
    max-height: min(26rem, 70vh);
    overflow-y: auto;
    border-radius: var(--vyasa-radius-md);
    border: 1px solid var(--vyasa-border);
    background: var(--vyasa-surface);
    box-shadow: var(--vyasa-shadow-sm);
    padding: var(--vyasa-space-1);
    z-index: 1500;
}

.vyasa-navbar-search-results:empty {
    display: none;
}

.vyasa-emphasis-control {
    color: var(--vyasa-emphasis-control-text) !important;
    background: var(--vyasa-emphasis-control-bg) !important;
    border: 1px solid var(--vyasa-emphasis-control-border) !important;
    border-radius: var(--vyasa-control-radius) !important;
    box-shadow: none;
    transition: color var(--vyasa-duration-fast) var(--vyasa-ease), background-color var(--vyasa-duration-fast) var(--vyasa-ease), border-color var(--vyasa-duration-fast) var(--vyasa-ease);
}

.vyasa-emphasis-control:hover,
.vyasa-emphasis-control:focus {
    color: var(--vyasa-emphasis-control-text) !important;
    background: var(--vyasa-emphasis-control-bg-hover) !important;
    border-color: var(--vyasa-emphasis-control-border) !important;
}

.vyasa-emphasis-control-field {
    min-height: 2rem;
}

.vyasa-emphasis-control-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    min-height: 2rem;
}

#theme-mode-toggle,
#theme-mode-toggle:hover,
#theme-mode-toggle:focus,
#theme-mode-toggle:focus-visible {
    --vyasa-emphasis-control-text: var(--vyasa-ink);
    color: var(--vyasa-ink) !important;
}

#theme-mode-toggle :is(uk-icon, [uk-icon]),
#theme-mode-toggle svg {
    color: currentColor !important;
    stroke: currentColor !important;
}

#theme-mode-toggle [data-theme-mode-icon] {
    display: none;
}

html:not([data-theme-mode]) #theme-mode-toggle [data-theme-mode-icon="system"],
html[data-theme-mode="light"] #theme-mode-toggle [data-theme-mode-icon="light"],
html[data-theme-mode="dark"] #theme-mode-toggle [data-theme-mode-icon="dark"],
html[data-theme-mode="system"] #theme-mode-toggle [data-theme-mode-icon="system"] {
    display: inline-block;
}

.vyasa-emphasis-control-menu {
    --vyasa-emphasis-control-text: var(--vyasa-emphasis-control-menu-text);
    --vyasa-emphasis-control-bg-hover: var(--vyasa-emphasis-control-menu-option-hover);
    --vyasa-emphasis-control-border: var(--vyasa-emphasis-control-menu-border);
    border-radius: var(--vyasa-radius-md);
    background: var(--vyasa-emphasis-control-menu-bg);
    color: var(--vyasa-emphasis-control-menu-text);
    padding: var(--vyasa-space-1);
    box-shadow: var(--vyasa-shadow-sm);
    border: 1px solid var(--vyasa-emphasis-control-border);
}

.vyasa-emphasis-control-option {
    color: var(--vyasa-emphasis-control-text) !important;
    border-radius: var(--vyasa-radius-sm);
    font-size: var(--vyasa-text-sm);
    transition: background-color var(--vyasa-duration-fast) var(--vyasa-ease), color var(--vyasa-duration-fast) var(--vyasa-ease);
}

.vyasa-emphasis-control-option:hover,
.vyasa-emphasis-control-option:focus,
.vyasa-emphasis-control-option.is-active {
    color: var(--vyasa-emphasis-control-text) !important;
    background: var(--vyasa-emphasis-control-bg-hover) !important;
}

.vyasa-sidebar-body,
.vyasa-sidebar-toggle {
    background: var(--vyasa-bg-subtle);
    color: var(--vyasa-ink);
    border-color: var(--vyasa-border);
    box-shadow: var(--vyasa-shadow-card);
}

.vyasa-mobile-panel,
.vyasa-mobile-panel-header,
.vyasa-mobile-panel-body {
    /* !important beats the bg/border utility classes the mobile panel markup still carries. */
    background: var(--vyasa-bg) !important;
    color: var(--vyasa-ink);
    border-color: var(--vyasa-border) !important;
    box-shadow: none !important;
}

.vyasa-mobile-panel {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 100%;
    height: 100vh;
    height: 100dvh;
    box-sizing: border-box;
    overflow: hidden;
    overscroll-behavior: contain;
}

.vyasa-mobile-panel-header {
    flex: 0 0 auto;
    padding-top: max(0.5rem, env(safe-area-inset-top)) !important;
}

.vyasa-mobile-panel-body {
    flex: 1 1 auto;
    min-height: 0;
    padding-bottom: max(1rem, env(safe-area-inset-bottom)) !important;
    overflow: hidden;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
}

.vyasa-mobile-panel-body > .vyasa-sidebar-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

.vyasa-mobile-panel-body > .vyasa-sidebar-card::details-content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.vyasa-mobile-panel-body > .vyasa-sidebar-card .vyasa-sidebar-body {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none !important;
    overflow-y: auto;
}

.vyasa-sidebar-toggle,
.vyasa-sidebar-body {
    border-radius: var(--vyasa-radius-lg);
}

.vyasa-sidebar-toggle {
    margin-bottom: var(--vyasa-space-3);
}
.vyasa-sidebar-toggle {
    font: var(--vyasa-weight-semibold) var(--vyasa-text-sm)/var(--vyasa-leading-tight) var(--vyasa-font-ui);
}
.vyasa-sidebar-section-toggle {
    color: var(--vyasa-text-muted) !important;
    font: var(--vyasa-weight-medium) var(--vyasa-text-xs)/var(--vyasa-leading-tight) var(--vyasa-font-ui);
    border-radius: var(--vyasa-control-radius);
    transition: background-color var(--vyasa-duration-fast) var(--vyasa-ease), color var(--vyasa-duration-fast) var(--vyasa-ease);
}
.vyasa-sidebar-section-toggle:hover { background: var(--vyasa-hover); color: var(--vyasa-ink) !important; }

.vyasa-main-shell {
    background: transparent;
    padding-top: var(--vyasa-space-4) !important;
}

.vyasa-main-shell:not(.vyasa-zen-present) > *:not(.vyasa-table-scroll):not(.mermaid-container):not(.d2-container):not(.code-block):not(.vyasa-tree-doc) {
    max-width: 46rem;
}

#content-with-sidebars .vyasa-main-shell > *:not(.vyasa-table-scroll):not(.mermaid-container):not(.d2-container):not(.code-block):not(.vyasa-tree-doc) {
    max-width: none;
    width: 100%;
}

.vyasa-main-shell > h1,
.vyasa-main-shell > h2,
.vyasa-main-shell > h3,
.vyasa-main-shell > p,
.vyasa-main-shell > ul,
.vyasa-main-shell > ol,
.vyasa-main-shell > blockquote,
.vyasa-main-shell > .vyasa-prev-next {
    margin-left: 0;
}

#content-with-sidebars .vyasa-main-shell > h1,
#content-with-sidebars .vyasa-main-shell > h2,
#content-with-sidebars .vyasa-main-shell > h3,
#content-with-sidebars .vyasa-main-shell > p,
#content-with-sidebars .vyasa-main-shell > ul,
#content-with-sidebars .vyasa-main-shell > ol,
#content-with-sidebars .vyasa-main-shell > blockquote,
#content-with-sidebars .vyasa-main-shell > .vyasa-prev-next {
    margin-left: 0;
}

.vyasa-footer-card {
    background: var(--vyasa-bg);
    color: var(--vyasa-text-muted);
    font-size: var(--vyasa-text-sm);
    display: block;
    width: 100%;
    box-sizing: border-box;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    margin: 0;
}

.vyasa-footer-card a,
.vyasa-footer-card a:visited,
.vyasa-footer-card button,
.vyasa-footer-card summary,
.vyasa-footer-card :is(uk-icon, [uk-icon]) {
    color: var(--vyasa-text-muted) !important;
}

.vyasa-footer-card a:hover,
.vyasa-footer-card button:hover,
.vyasa-footer-card summary:hover {
    color: var(--vyasa-ink) !important;
}

.vyasa-breadcrumbs {
    color: var(--vyasa-text-muted) !important;
    font: var(--vyasa-weight-medium) var(--vyasa-text-sm)/var(--vyasa-leading-tight) var(--vyasa-font-ui);
}

.vyasa-breadcrumbs a,
.vyasa-breadcrumbs a:visited {
    color: var(--vyasa-text-muted) !important;
    text-decoration: none;
}

.vyasa-breadcrumbs a:hover,
.vyasa-breadcrumbs a:focus {
    color: var(--vyasa-ink) !important;
}

.vyasa-read-time {
    color: var(--vyasa-text-muted) !important;
    font-size: var(--vyasa-text-sm);
}

.vyasa-admin-field {
    font: var(--vyasa-weight-regular) var(--vyasa-text-base)/var(--vyasa-leading-snug) var(--vyasa-font-ui);
    color: var(--vyasa-ink);
}

.vyasa-admin-json {
    font: var(--vyasa-weight-regular) var(--vyasa-text-sm)/var(--vyasa-leading-prose) var(--vyasa-font-mono);
    color: var(--vyasa-ink);
    min-height: 14rem;
    resize: vertical;
    white-space: pre;
    tab-size: 2;
}

.chat-row-block { padding: var(--vyasa-space-3) 0; }
.chat-panel {
    background: var(--vyasa-surface);
    border: 1px solid var(--vyasa-border);
    border-radius: var(--vyasa-radius-lg);
    padding: var(--vyasa-space-5);
}

.folder-chevron {
    display: inline-block;
    width: 0.45rem;
    height: 0.45rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(-45deg);
    transition: transform var(--vyasa-duration-base) var(--vyasa-ease);
}

details.is-open > summary .folder-chevron { transform: rotate(45deg); }
.vyasa-folder-pin {
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--vyasa-duration-fast) var(--vyasa-ease), color var(--vyasa-duration-fast) var(--vyasa-ease);
}
.vyasa-folder-pin[hidden] { display: none !important; }
.vyasa-folder-pin > uk-icon { transform: rotate(-45deg); transition: transform var(--vyasa-duration-fast) var(--vyasa-ease); }
.vyasa-folder-pin[aria-pressed="true"] > uk-icon { transform: rotate(0deg); }
.vyasa-tree-row:hover > .vyasa-folder-pin,
.vyasa-folder-pin[aria-pressed="true"],
details[data-folder-pinned-child="true"] > summary > .vyasa-folder-pin {
    opacity: 1;
    pointer-events: auto;
}
.vyasa-folder-pin[aria-pressed="true"] { color: var(--vyasa-primary) !important; }
details { border: none !important; box-shadow: none !important; }
h1, h2, h3, h4, h5, h6 { scroll-margin-top: 7rem; }

* { scrollbar-width: thin; scrollbar-color: var(--vyasa-gray-7) transparent; }
*::-webkit-scrollbar { width: 6px; height: 6px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background-color: var(--vyasa-gray-7); border-radius: var(--vyasa-radius-pill); }
*::-webkit-scrollbar-thumb:hover { background-color: var(--vyasa-gray-8); }

/* Shared row contract: sidebar tree rows and TOC links. Grey hover, grey
   active with ink text. No accent fills on navigation. */
.vyasa-tree-row,
.toc-link {
    color: var(--vyasa-text-muted) !important;
    border-radius: var(--vyasa-radius-md) !important;
    transition: background-color var(--vyasa-duration-fast) var(--vyasa-ease), color var(--vyasa-duration-fast) var(--vyasa-ease);
}
.vyasa-tree-row * { color: inherit !important; }
.vyasa-tree-row svg, .vyasa-tree-row :is(uk-icon, [uk-icon]) { stroke: currentColor !important; fill: none !important; stroke-width: var(--vyasa-icon-stroke); }
.vyasa-tree-row:hover,
.toc-link:hover { background: var(--vyasa-hover) !important; color: var(--vyasa-ink) !important; }
.vyasa-tree-row.is-active,
.toc-link.is-active { background: var(--vyasa-active) !important; color: var(--vyasa-ink) !important; font-weight: var(--vyasa-weight-medium); }
.toc-link.font-semibold { font-weight: var(--vyasa-weight-medium) !important; }
.folder-note-link,
.folder-note-link span {
    text-decoration-line: underline !important;
    text-decoration-thickness: 1px !important;
    text-underline-offset: 0.14em !important;
}

body.pdf-focus { overflow: hidden; }
body.pdf-focus #site-navbar,
body.pdf-focus #site-footer,
body.pdf-focus #posts-sidebar,
body.pdf-focus #toc-sidebar,
body.pdf-focus #mobile-posts-panel,
body.pdf-focus #mobile-toc-panel { display: none !important; }
body.pdf-focus #content-with-sidebars { max-width: none !important; width: 100vw !important; padding: 0 !important; margin: 0 !important; gap: 0 !important; }
body.pdf-focus #main-content { padding: 1rem !important; }
body.pdf-focus .pdf-viewer { height: calc(100vh - 6rem) !important; }

body.iframe-fullscreen-open { overflow: hidden; }
.iframe-fullscreen-overlay { position: fixed; inset: 0; z-index: 1000; background: var(--vyasa-bg); display: flex; flex-direction: column; }
.iframe-fullscreen-header { display: flex; align-items: center; justify-content: space-between; gap: var(--vyasa-space-4); padding: var(--vyasa-space-2) var(--vyasa-space-4); color: var(--vyasa-ink); font: var(--vyasa-weight-medium) var(--vyasa-text-sm)/var(--vyasa-leading-tight) var(--vyasa-font-ui); background: var(--vyasa-bg-subtle); border-bottom: 1px solid var(--vyasa-border); }
.iframe-fullscreen-body { flex: 1; padding: var(--vyasa-space-3); }
.iframe-fullscreen-frame { width: 100%; height: 100%; border: 1px solid var(--vyasa-border); border-radius: var(--vyasa-radius-md) !important; background: var(--vyasa-surface); }

.vyasa-markdown-image { display: block; width: auto; height: auto; max-width: 60vw; max-height: 40vh; margin-inline: auto; }
/* An image an author places in a document opens in focus; a UI image opts out with data-vyasa-no-image-focus. */
:is(#main-content, .vyasa-zen-slide-body) img:not([data-vyasa-no-image-focus]) { cursor: zoom-in; }
html:has(.image-focus-dialog[open]), body.image-focus-open { overflow: hidden; }
.image-focus-dialog { padding: 0; border: 0; max-width: 94vw; max-height: 94vh; background: transparent; overflow: visible; animation: image-focus-fade-in var(--vyasa-duration-base) var(--vyasa-ease); }
.image-focus-dialog::backdrop { background: rgb(0 0 0 / 0.8); animation: image-focus-backdrop-in var(--vyasa-duration-base) var(--vyasa-ease); }
.image-focus-dialog img { display: block; max-width: 94vw; max-height: 94vh; object-fit: contain; cursor: default; animation: image-focus-zoom-in var(--vyasa-duration-base) var(--vyasa-ease); touch-action: none; }
.image-focus-dialog[data-zoomed] img { cursor: grab; }
.image-focus-dialog[data-zoomed] img:active { cursor: grabbing; }
.image-focus-dialog.is-closing { animation: image-focus-fade-out var(--vyasa-duration-fast) ease-in forwards; }
.image-focus-dialog.is-closing::backdrop { animation: image-focus-backdrop-out var(--vyasa-duration-fast) ease-in forwards; }
.image-focus-dialog.is-closing img { animation: image-focus-zoom-out var(--vyasa-duration-fast) ease-in forwards; }
@keyframes image-focus-fade-in { from { opacity: 0; } }
@keyframes image-focus-zoom-in { from { transform: scale(.97); } }
@keyframes image-focus-fade-out { to { opacity: 0; } }
@keyframes image-focus-zoom-out { to { transform: scale(.97); } }
@keyframes image-focus-backdrop-in { from { background: transparent; } }
@keyframes image-focus-backdrop-out { to { background: transparent; } }

.layout-fluid {
    --layout-breakpoint: 1280px;
    --layout-blend: 240px;
    max-width: calc(100% - (100% - var(--layout-max-width)) * clamp(0, (100vw - var(--layout-breakpoint)) / var(--layout-blend), 1)) !important;
}

.tabs-container { max-width: 100%; margin: var(--vyasa-space-5) 0; border: 0; border-radius: 0 !important; overflow: visible; background: transparent; box-shadow: none; }
.tabs-header { max-width: 100%; display: inline-flex; align-items: center; height: 2.25rem; background: var(--vyasa-gray-3); border-radius: var(--vyasa-radius-lg); gap: 0; padding: 3px; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: thin; }
.tab-button { flex: 0 0 auto; height: 100%; padding: 0 var(--vyasa-space-3); background: transparent; border: 1px solid transparent; cursor: pointer; font-weight: var(--vyasa-weight-medium); font-size: var(--vyasa-text-base); color: var(--vyasa-text-muted); transition: color var(--vyasa-duration-fast) var(--vyasa-ease), background-color var(--vyasa-duration-fast) var(--vyasa-ease), box-shadow var(--vyasa-duration-fast) var(--vyasa-ease); position: relative; border-radius: var(--vyasa-radius-md) !important; }
.tab-button:hover:not(.active) { color: var(--vyasa-ink); }
.tab-button.active { color: var(--vyasa-ink); background: var(--vyasa-bg); box-shadow: var(--vyasa-shadow-xs); }
.dark .tab-button.active { background: color-mix(in srgb, var(--vyasa-border) 60%, transparent); border-color: var(--vyasa-border); }
.tabs-content { background: transparent; position: relative; overflow: visible; }
.tab-panel { padding: var(--vyasa-space-3) 0 0; animation: fadeIn var(--vyasa-duration-base) var(--vyasa-ease); position: absolute; top: 0; left: 0; right: 0; opacity: 0; visibility: hidden; pointer-events: none; overflow: visible; }
.tab-panel.active { position: relative; opacity: 1; visibility: visible; pointer-events: auto; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.tab-panel > *:first-child { margin-top: 0 !important; }
.tab-panel > *:last-child { margin-bottom: 0 !important; }
.tab-panel pre { border-radius: var(--vyasa-radius-md); font-size: var(--vyasa-text-sm); }
.tab-panel code { font-family: var(--vyasa-font-mono); }
@media (max-width: 640px) {
    .tabs-container { width: 100%; }
    .tabs-header { justify-content: flex-start; }
    .tab-button { flex: 0 0 auto; min-width: max-content; white-space: nowrap; }
    .tab-panel { padding: var(--vyasa-space-3) 0 0; }
}

/* Author-written <details> in content: indent the body, keep the summary flush.
   Padding on the details plus a negative summary margin gives one more indent
   step at each nesting level. Vyasa-owned details (callouts, heading folds,
   frontmatter, sidebar, tree) keep their own spacing. */
#main-content details:not([class*="vyasa-"]) {
    --vyasa-details-indent: var(--vyasa-space-5);
    padding-left: var(--vyasa-details-indent);
    margin-block: var(--vyasa-space-2);
}
#main-content details:not([class*="vyasa-"]) > summary {
    display: flex;
    align-items: center;
    gap: var(--vyasa-space-2);
    margin-left: calc(-1 * var(--vyasa-details-indent));
    padding: var(--vyasa-space-1) var(--vyasa-space-2);
    border-radius: var(--vyasa-radius-md);
    line-height: var(--vyasa-leading-snug);
    list-style: none;
    cursor: pointer;
    transition: background-color var(--vyasa-duration-fast) var(--vyasa-ease);
}
#main-content details:not([class*="vyasa-"]) > summary::-webkit-details-marker { display: none; }
#main-content details:not([class*="vyasa-"]) > summary::before {
    content: "";
    flex: 0 0 auto;
    width: 0.42rem;
    height: 0.42rem;
    margin: 0 0.2rem 0 0.25rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(-45deg);
    opacity: 0.55;
    transition: transform var(--vyasa-duration-fast) var(--vyasa-ease), opacity var(--vyasa-duration-fast) var(--vyasa-ease);
}
#main-content details:not([class*="vyasa-"])[open] > summary::before { transform: rotate(45deg); opacity: 0.85; }
#main-content details:not([class*="vyasa-"]) > summary:hover { background: var(--vyasa-hover); }
#main-content details:not([class*="vyasa-"]) > summary:hover::before { opacity: 0.9; }
#main-content details:not([class*="vyasa-"]) > summary > code { padding: 0.12em 0.45em; }
#main-content details:not([class*="vyasa-"])[open] { margin-block: var(--vyasa-space-2) var(--vyasa-space-4); }
#main-content details:not([class*="vyasa-"])[open] > summary { margin-bottom: var(--vyasa-space-1); }
/* Guide line under the chevron, beside the body only; browsers without ::details-content skip it */
#main-content details:not([class*="vyasa-"])::details-content {
    margin-left: calc(0.85rem - var(--vyasa-details-indent));
    padding-left: calc(var(--vyasa-details-indent) - 0.85rem - 1px);
    border-left: 1px solid var(--vyasa-border);
}

.vyasa-callout { --vyasa-callout-accent: var(--vyasa-primary); background: var(--vyasa-surface); border: 1px solid var(--vyasa-border); border-radius: var(--vyasa-radius-lg) !important; box-shadow: none; }
.vyasa-callout-danger, .vyasa-callout-failure, .vyasa-callout-bug { color: var(--vyasa-danger); }
.vyasa-callout-body { color: var(--vyasa-text-muted); }
.vyasa-callout-summary { list-style: none; }
.vyasa-callout-summary::-webkit-details-marker { display: none; }
.vyasa-callout-summary .vyasa-callout-head { cursor: pointer; }
.vyasa-callout-head-with-body { margin-bottom: var(--vyasa-space-2); }
.vyasa-callout-icon { color: var(--vyasa-callout-accent); display: inline-flex; align-items: center; justify-content: center; width: 1.25rem; height: 1.25rem; flex: 0 0 1.25rem; overflow: visible; }
.vyasa-callout-icon svg, .vyasa-callout-icon uk-icon { width: var(--vyasa-icon-size); height: var(--vyasa-icon-size); overflow: visible; stroke-width: var(--vyasa-icon-stroke); stroke-linecap: round; stroke-linejoin: round; }
.vyasa-callout-chevron { margin-left: auto; width: 0.55rem; height: 0.55rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(-45deg); transition: transform var(--vyasa-duration-fast) var(--vyasa-ease); opacity: 0.65; }
details[open] > .vyasa-callout-summary .vyasa-callout-chevron { transform: rotate(45deg); }
.vyasa-callout-label { color: inherit; font: var(--vyasa-weight-medium) var(--vyasa-text-base)/var(--vyasa-leading-tight) var(--vyasa-font-ui); letter-spacing: -0.006em; }
.vyasa-callout-body .vyasa-callout { position: relative; margin-top: var(--vyasa-space-3); margin-bottom: 0; background: var(--vyasa-surface); }
.vyasa-callout-body > *:first-child { margin-top: 0 !important; }
.vyasa-callout-body > *:last-child { margin-bottom: 0 !important; }
.vyasa-callout-note, .vyasa-callout-info, .vyasa-callout-abstract, .vyasa-callout-todo, .vyasa-callout-important, .vyasa-callout-question, .vyasa-callout-example { --vyasa-callout-accent: var(--vyasa-primary); }
.vyasa-callout-tip, .vyasa-callout-success { --vyasa-callout-accent: var(--vyasa-success); }
.vyasa-callout-warning { --vyasa-callout-accent: var(--vyasa-warning); }
.vyasa-callout-failure, .vyasa-callout-danger, .vyasa-callout-bug { --vyasa-callout-accent: var(--vyasa-danger); }
.vyasa-callout-quote { --vyasa-callout-accent: var(--vyasa-gray-8); }
.vyasa-code-lines { display: block; white-space: normal !important; }
.vyasa-code-line { display: block; width: calc(100% + 2rem); box-sizing: border-box; white-space: pre; margin: 0 -1rem; padding: 0 1rem; }
.code-block pre.vyasa-code-wrap .vyasa-code-line { white-space: pre-wrap; overflow-wrap: anywhere; }
.code-block .vyasa-code-line-highlight {
    background: var(--vyasa-code-highlight-bg);
    box-shadow: inset 3px 0 0 var(--vyasa-code-highlight-accent);
}
.code-block .vyasa-code-line-highlight-start {
    border-top-right-radius: var(--vyasa-radius-sm);
    margin-top: 2px;
}
.code-block .vyasa-code-line-highlight-end {
    border-bottom-right-radius: var(--vyasa-radius-sm);
    margin-bottom: 2px;
}
.code-block .vyasa-code-line-highlight-start.vyasa-code-line-highlight-end {
    border-radius: 0 var(--vyasa-radius-sm) var(--vyasa-radius-sm) 0;
}
.vyasa-heading-permalink { opacity: 0; transition: opacity var(--vyasa-duration-fast) var(--vyasa-ease); }
.vyasa-heading-action { opacity: 0; border: 0; border-radius: var(--vyasa-radius-sm); background: transparent; color: var(--vyasa-text-faint); width: 1.5rem; height: 1.5rem; flex: 0 0 1.5rem; display: inline-flex; align-items: center; justify-content: center; padding: 0; margin: 0; line-height: 1; text-decoration: none; transition: opacity var(--vyasa-duration-fast) var(--vyasa-ease), color var(--vyasa-duration-fast) var(--vyasa-ease), background-color var(--vyasa-duration-fast) var(--vyasa-ease); cursor: pointer; }
.vyasa-heading-action :is(uk-icon, [uk-icon]), .vyasa-heading-permalink :is(uk-icon, [uk-icon]) { display: inline-flex; align-items: center; justify-content: center; width: var(--vyasa-icon-size); height: var(--vyasa-icon-size); }
.vyasa-heading-action :is(uk-icon, [uk-icon]) svg, .vyasa-heading-permalink :is(uk-icon, [uk-icon]) svg { width: var(--vyasa-icon-size); height: var(--vyasa-icon-size); stroke-width: var(--vyasa-icon-stroke); }
.vyasa-heading-permalink-icon, .vyasa-heading-permalink-copied { display: inline-flex; align-items: center; justify-content: center; }
.vyasa-heading-permalink-copied {
    gap: var(--vyasa-space-1);
    padding: 0 var(--vyasa-space-2);
    border-radius: var(--vyasa-radius-pill);
    background: color-mix(in srgb, var(--vyasa-success) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--vyasa-success) 28%, transparent);
    color: var(--vyasa-success);
    font: var(--vyasa-weight-medium) var(--vyasa-text-xs)/1.75 var(--vyasa-font-ui);
    white-space: nowrap;
}
.vyasa-heading-permalink-copied :is(uk-icon, [uk-icon]) { width: var(--vyasa-text-sm); height: var(--vyasa-text-sm); }
.vyasa-heading-permalink-copied :is(uk-icon, [uk-icon]) svg { width: var(--vyasa-text-sm); height: var(--vyasa-text-sm); }
.vyasa-heading-permalink.is-copied {
    opacity: 1;
    width: auto;
    flex: 0 0 auto;
    color: var(--vyasa-success) !important;
}
.vyasa-heading-permalink.is-copied .vyasa-heading-permalink-icon { display: none; }
.vyasa-heading-permalink.is-copied .vyasa-heading-permalink-copied { display: inline-flex; }
.vyasa-heading-permalink:not(.is-copied) .vyasa-heading-permalink-copied { display: none; }
.vyasa-doc-heading { position: relative; display: flex; align-items: center; width: 100%; gap: var(--vyasa-space-1); justify-content: flex-start; }
.vyasa-doc-heading > .vyasa-heading-level {
    display: none;
    position: absolute;
    top: 50%;
    right: 100%;
    color: var(--vyasa-text-faint);
    font: var(--vyasa-weight-medium) var(--vyasa-text-xs)/1 var(--vyasa-font-mono);
    border: 0;
    background: transparent;
    padding: 0;
    padding-right: var(--vyasa-space-2);
    opacity: 0;
    pointer-events: none;
    user-select: none;
    white-space: nowrap;
    cursor: pointer;
    transform: translate(0.2rem, -50%);
    transition: opacity var(--vyasa-duration-fast) var(--vyasa-ease), transform var(--vyasa-duration-fast) var(--vyasa-ease);
}
@media (hover: hover) and (min-width: 768px) {
    .vyasa-doc-heading > .vyasa-heading-level { display: block; }
    .vyasa-doc-heading:hover > .vyasa-heading-level,
    .vyasa-doc-heading:focus-within > .vyasa-heading-level {
        opacity: 1;
        pointer-events: auto;
        transform: translate(0, -50%);
    }
}
.vyasa-heading-text { flex: 0 1 auto; min-width: 0; }
.vyasa-heading-fold-summary .vyasa-heading-text::after {
    content: "";
    display: inline-block;
    width: 0.75em;
    height: 0.75em;
    margin-left: var(--vyasa-space-2);
    background-color: var(--vyasa-text-faint);
    opacity: 0;
    transition: opacity var(--vyasa-duration-fast) var(--vyasa-ease);
    vertical-align: middle;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}
.vyasa-heading-fold[open] .vyasa-heading-text::after {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 4.25 6 8l4-3.75' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 4.25 6 8l4-3.75' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.vyasa-heading-fold:not([open]) .vyasa-heading-text::after,
.vyasa-heading-fold-summary:hover .vyasa-heading-text::after,
.vyasa-heading-fold-summary:focus-visible .vyasa-heading-text::after { opacity: 1; }
.vyasa-heading-fold:not([open]) .vyasa-heading-text::after {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M4.25 2 8 6l-3.75 4' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M4.25 2 8 6l-3.75 4' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.vyasa-heading-icon-expand { display: inline-flex; }
.vyasa-heading-icon-collapse { display: none; }
.vyasa-heading-action-children[data-subtree-state="collapse"] .vyasa-heading-icon-expand { display: none; }
.vyasa-heading-action-children[data-subtree-state="collapse"] .vyasa-heading-icon-collapse { display: inline-flex; }
.vyasa-doc-heading:hover .vyasa-heading-action, .vyasa-doc-heading:hover .vyasa-heading-permalink, .vyasa-heading-action:hover, .vyasa-heading-action:focus, .vyasa-heading-permalink:hover, .vyasa-heading-permalink:focus { opacity: 1; }
.vyasa-heading-action:hover, .vyasa-heading-action:focus, .vyasa-heading-permalink:hover, .vyasa-heading-permalink:focus { color: var(--vyasa-ink) !important; background: var(--vyasa-hover); }
#main-content .vyasa-doc-heading {
    margin-block: var(--vyasa-heading-before-gap) var(--vyasa-heading-after-gap) !important;
}
#main-content .vyasa-heading-fold {
    margin-block: var(--vyasa-heading-before-gap) 0 !important;
}
/* The fold owns the gap above its heading; the heading inside adds none. */
#main-content .vyasa-heading-fold-summary > .vyasa-doc-heading { margin: 0 !important; }
.vyasa-page-action-button,
.vyasa-fold-all-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--vyasa-space-2);
    height: 2.25rem;
    padding: 0 var(--vyasa-space-4);
    border: 1px solid transparent;
    border-radius: var(--vyasa-control-radius) !important;
    background: var(--vyasa-accent-9);
    color: var(--vyasa-accent-contrast) !important;
    font: var(--vyasa-weight-medium) var(--vyasa-text-base)/1 var(--vyasa-font-ui);
    text-decoration: none;
    box-shadow: var(--vyasa-shadow-xs);
    transition: color var(--vyasa-duration-fast) var(--vyasa-ease), background-color var(--vyasa-duration-fast) var(--vyasa-ease);
}
#main-content a.vyasa-page-action-button,
#main-content a.vyasa-page-action-button:visited {
    color: var(--vyasa-accent-contrast) !important;
}
.vyasa-page-action-button:hover,
.vyasa-page-action-button:focus,
.vyasa-fold-all-button:hover,
.vyasa-fold-all-button:focus {
    background: color-mix(in srgb, var(--vyasa-accent-9) 90%, transparent);
    color: var(--vyasa-accent-contrast) !important;
    text-decoration: none;
}
#main-content a.vyasa-page-action-button:hover,
#main-content a.vyasa-page-action-button:focus,
#main-content a.vyasa-page-action-button:active {
    color: var(--vyasa-accent-contrast) !important;
}
.vyasa-page-action-tooltip {
    position: relative;
}
.vyasa-page-action-tooltip::after {
    content: attr(data-tooltip);
    position: absolute;
    left: 50%;
    bottom: calc(100% + 0.5rem);
    transform: translateX(-50%);
    opacity: 0;
    pointer-events: none;
    width: max-content;
    max-width: min(24rem, calc(100vw - 2rem));
    white-space: pre-line;
    text-align: left;
    padding: var(--vyasa-space-1) var(--vyasa-space-2);
    border-radius: var(--vyasa-radius-sm);
    background: var(--vyasa-gray-12);
    color: var(--vyasa-gray-1) !important;
    box-shadow: var(--vyasa-shadow-sm);
    font: var(--vyasa-weight-medium) var(--vyasa-text-xs)/var(--vyasa-leading-snug) var(--vyasa-font-ui);
    z-index: 20;
}
.vyasa-page-action-tooltip:hover::after,
.vyasa-page-action-tooltip:focus-visible::after {
    opacity: 1;
}
.vyasa-page-action-tooltip:not([data-tooltip])::after { content: none; }
.vyasa-page-action-tooltip-trigger {
    appearance: none;
    display: inline;
    margin: 0;
    padding: 0;
    border: 0;
    border-bottom: 1px dotted color-mix(in srgb, currentColor 58%, transparent);
    background: transparent;
    color: inherit;
    font: inherit;
    line-height: inherit;
    text-align: inherit;
    cursor: help;
}
.vyasa-page-action-tooltip-trigger:hover { border-bottom-style: solid; }
.vyasa-page-action-tooltip-content {
    position: fixed;
    inset: auto;
    width: min(34rem, calc(100vw - 2rem));
    max-height: min(70vh, 36rem);
    margin: 0;
    padding: var(--vyasa-space-4);
    overflow: auto;
    border: 1px solid var(--vyasa-border);
    border-radius: var(--vyasa-radius-lg);
    background: var(--vyasa-surface);
    color: var(--vyasa-ink);
    box-shadow: var(--vyasa-shadow-sm);
    font: var(--vyasa-weight-regular) var(--vyasa-text-base)/var(--vyasa-leading-prose) var(--vyasa-font-ui);
}
.vyasa-page-action-tooltip-content::backdrop { background: transparent; }
.vyasa-page-action-tooltip-content > :last-child { margin-bottom: 0 !important; }

.vyasa-inline-action-demo {
    position: relative;
    top: -0.14em;
    vertical-align: middle;
}

.vyasa-page-action-icon,
.vyasa-fold-all-icon { width: var(--vyasa-icon-size); height: var(--vyasa-icon-size); stroke: currentColor; stroke-width: var(--vyasa-icon-stroke); fill: none; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }
.vyasa-floating-actions { position: fixed; right: 0; bottom: var(--vyasa-space-5); z-index: 30; display: flex; flex-direction: column; align-items: center; gap: var(--vyasa-space-2); isolation: isolate; transform: translateX(60%); transition: transform var(--vyasa-duration-base) var(--vyasa-ease); }
.vyasa-floating-actions::before { position: absolute; inset: -5rem 0 -1.25rem -5rem; z-index: 0; content: ""; }
.vyasa-floating-actions:hover,
.vyasa-floating-actions:focus-within { transform: translateX(calc(-1 * var(--vyasa-space-5))); }
.vyasa-floating-bubble { position: relative; z-index: 1; width: 2.5rem; height: 2.5rem; padding: 0; display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; border: 1px solid var(--vyasa-border); border-radius: var(--vyasa-radius-pill); background: var(--vyasa-surface); color: var(--vyasa-text-muted); box-shadow: var(--vyasa-shadow-sm); transition: opacity var(--vyasa-duration-fast) var(--vyasa-ease), transform var(--vyasa-duration-fast) var(--vyasa-ease), background-color var(--vyasa-duration-fast) var(--vyasa-ease), color var(--vyasa-duration-fast) var(--vyasa-ease); cursor: pointer; }
.vyasa-floating-bubble:hover { background: var(--vyasa-hover); color: var(--vyasa-ink); }
.vyasa-shortcuts-launcher { order: -1; opacity: 1; }
.vyasa-shortcuts { position: fixed; inset: 0; z-index: 1700; display: flex; align-items: center; justify-content: center; padding: var(--vyasa-space-5); background: rgb(0 0 0 / 0.5); }
.vyasa-shortcuts.hidden { display: none; }
.vyasa-shortcuts-card { width: min(32rem, calc(100vw - 3rem)); max-height: calc(100vh - 3rem); overflow-y: auto; padding: var(--vyasa-space-5); border: 1px solid var(--vyasa-border); border-radius: var(--vyasa-radius-lg); color: var(--vyasa-ink); background: var(--vyasa-bg); box-shadow: var(--vyasa-shadow-lg); font-family: var(--vyasa-font-ui); font-size: var(--vyasa-text-base); }
.vyasa-shortcuts-card h2 { margin: 0 0 var(--vyasa-space-4); font-size: var(--vyasa-text-md); font-weight: var(--vyasa-weight-semibold); }
.vyasa-shortcuts-card section + section { margin-top: var(--vyasa-space-5); }
.vyasa-shortcuts-card small { color: var(--vyasa-text-muted); font-size: var(--vyasa-text-xs); font-weight: var(--vyasa-weight-medium); }
.vyasa-shortcuts-card section > div { display: grid; grid-template-columns: 6rem minmax(0, 1fr); gap: var(--vyasa-space-4); align-items: center; margin-top: var(--vyasa-space-2); }
.vyasa-shortcuts-card kbd { display: inline-flex; min-width: 1.5rem; height: 1.5rem; align-items: center; justify-content: center; justify-self: start; padding: 0 var(--vyasa-space-2); border: 1px solid var(--vyasa-border); border-radius: var(--vyasa-radius-sm); color: var(--vyasa-text-muted); background: var(--vyasa-bg-subtle); font: var(--vyasa-weight-medium) var(--vyasa-text-xs)/1 var(--vyasa-font-ui); }
.vyasa-scroll-top-button { position: absolute; visibility: hidden; opacity: 0; pointer-events: none; transform: translateY(0.4rem) scale(0.96); }
.vyasa-scroll-top-button.is-visible { position: relative; visibility: visible; opacity: 1; pointer-events: auto; transform: translateY(0); }
.vyasa-scroll-top-icon { width: var(--vyasa-icon-size); height: var(--vyasa-icon-size); stroke: currentColor; stroke-width: var(--vyasa-icon-stroke); fill: none; stroke-linecap: round; stroke-linejoin: round; }
.vyasa-heading-fold-summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: var(--vyasa-space-1); }
.vyasa-heading-fold-summary::-webkit-details-marker { display: none; }
.vyasa-heading-fold-summary::marker { content: ""; }
.vyasa-heading-fold-summary > h1, .vyasa-heading-fold-summary > h2, .vyasa-heading-fold-summary > h3, .vyasa-heading-fold-summary > h4, .vyasa-heading-fold-summary > h5, .vyasa-heading-fold-summary > h6 { margin: 0 !important; flex: 1; order: 2; }
.vyasa-heading-fold-chevron { display: none; }
.vyasa-heading-fold-body { padding-left: 0; }
#main-content .vyasa-heading-fold-body > :first-child { margin-top: var(--vyasa-heading-after-gap) !important; }
#main-content .vyasa-heading-fold-body > :last-child { margin-bottom: 0 !important; }
#main-content :where(p, ul, ol, blockquote):has(+ :is(.vyasa-doc-heading, .vyasa-heading-fold)) {
    margin-bottom: 0 !important;
}
.vyasa-heading-fold-body ul,
.vyasa-heading-fold-body ol { margin-top: var(--vyasa-space-3); margin-bottom: var(--vyasa-space-4); }
.vyasa-heading-fold-body li > p { margin: 0; }
.vyasa-heading-fold-body li > ul,
.vyasa-heading-fold-body li > ol { margin-top: var(--vyasa-space-1); margin-bottom: 0; }
.code-block pre, .code-block pre *, .code-block pre code, .code-block pre code *, pre code.hljs, pre code.hljs * { font-family: var(--vyasa-font-mono) !important; }
.code-block pre, .code-block pre code, pre code.hljs { background: var(--vyasa-code-bg); color: var(--vyasa-code-fg); }
:not(pre) > code, a.vyasa-code-link:not(:has(code)) { background: var(--vyasa-inline-code-bg); border: 0; padding: 0.2em 0.3em; border-radius: 4px; font-size: 0.875em; font-weight: var(--vyasa-weight-semibold); }
:not(pre) > code { color: var(--vyasa-inline-code-fg); }
a.vyasa-code-link, a.vyasa-code-link code { font-family: var(--vyasa-font-mono); }
a.vyasa-code-link code { color: inherit; }
.code-block { margin: var(--vyasa-space-4) 0 var(--vyasa-space-5); }
.code-block pre { border: 1px solid var(--vyasa-code-border); border-radius: var(--vyasa-radius-xl) !important; padding: var(--vyasa-space-4) !important; box-shadow: none; }
.code-block pre code, pre code.hljs { display: block; width: 100%; box-sizing: border-box; font-size: var(--vyasa-text-sm); line-height: 1.6; }
.code-block pre.vyasa-code-wrap code, .code-block pre.vyasa-code-wrap code.hljs { white-space: pre-wrap; overflow-wrap: anywhere; }
.code-block code.vyasa-code-lines { counter-reset: vyasa-code-line; }
.code-block code[data-code-line-numbers="true"] {
    --vyasa-code-line-number-width: 3ch;
}
.code-block code[data-code-line-numbers="true"] .vyasa-code-line { padding-left: calc(var(--vyasa-code-line-number-width) + 1.9rem); position: relative; }
.code-block code[data-code-line-numbers="true"] .vyasa-code-line::before { content: attr(data-source-line); position: absolute; left: var(--vyasa-space-4); width: var(--vyasa-code-line-number-width); text-align: right; font-variant-numeric: tabular-nums; color: color-mix(in srgb, var(--vyasa-code-fg) 40%, transparent); }
.code-block code[data-code-line-numbers="true"] .vyasa-code-line-highlight::before { color: color-mix(in srgb, var(--vyasa-code-highlight-accent) 48%, var(--vyasa-code-fg) 52%); }
.code-block [class*="copy"], .code-copy-button { font-family: var(--vyasa-font-ui); font-size: var(--vyasa-text-xs); }
.vyasa-prev-next { display: flex; justify-content: space-between; gap: var(--vyasa-space-4); margin-top: var(--vyasa-space-7); padding-top: var(--vyasa-space-5); border-top: 1px solid var(--vyasa-border); }
.vyasa-prev-link, .vyasa-next-link { max-width: 48%; text-decoration: none; color: var(--vyasa-ink); font: var(--vyasa-weight-medium) var(--vyasa-text-base)/var(--vyasa-leading-snug) var(--vyasa-font-ui); }
.vyasa-next-link { text-align: right; margin-left: auto; }
.vyasa-prev-link:hover, .vyasa-next-link:hover { color: var(--vyasa-link); }
.vyasa-frontmatter-block {
    border: 1px solid var(--vyasa-border);
    border-radius: var(--vyasa-radius-lg);
    background: var(--vyasa-bg-subtle);
    box-shadow: none;
}
.vyasa-frontmatter-summary {
    color: var(--vyasa-text-muted);
    font: var(--vyasa-weight-medium) var(--vyasa-text-sm)/var(--vyasa-leading-tight) var(--vyasa-font-ui);
}

.vyasa-table-scroll { --vyasa-edge-shadow: rgb(0 0 0 / calc(var(--vyasa-shadow-alpha) * 2)); width: 100%; max-width: 100%; position: static; left: auto; transform: none; margin: var(--vyasa-space-5) 0; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-gutter: stable both-edges; box-shadow: none; transition: box-shadow var(--vyasa-duration-fast) var(--vyasa-ease); }
.vyasa-table-scroll.vyasa-table-breakout { width: min(var(--vyasa-breakout-width, 80vw), 80vw); max-width: 80vw; position: relative; left: 50%; transform: translateX(-50%); }
.vyasa-table-scroll.has-right-overflow { box-shadow: inset -16px 0 12px -12px var(--vyasa-edge-shadow); }
.vyasa-table-scroll.has-left-overflow { box-shadow: inset 16px 0 12px -12px var(--vyasa-edge-shadow); }
.vyasa-table-scroll.has-left-overflow.has-right-overflow { box-shadow: inset 16px 0 12px -12px var(--vyasa-edge-shadow), inset -16px 0 12px -12px var(--vyasa-edge-shadow); }
.katex-display {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    padding: var(--vyasa-space-1) 0;
    margin: var(--vyasa-space-5) 0;
    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: stable both-edges;
    box-shadow: none;
    transition: box-shadow var(--vyasa-duration-fast) var(--vyasa-ease);
}
.katex-display > .katex {
    display: inline-block;
    max-width: none;
}
@media (min-width: 641px) {
    .katex-display {
        width: min(var(--vyasa-breakout-width, 80vw), 80vw);
        max-width: 80vw;
        position: relative;
        left: 50%;
        transform: translateX(-50%);
    }
    .katex-display::before,
    .katex-display::after {
        content: "";
        position: sticky;
        top: 0;
        z-index: 1;
        display: inline-block;
        width: var(--vyasa-space-5);
        min-height: 1.2em;
        pointer-events: none;
    }
    .katex-display::before {
        left: 0;
        margin-right: calc(-1 * var(--vyasa-space-5));
        background: linear-gradient(90deg, var(--vyasa-bg), transparent);
    }
    .katex-display::after {
        right: 0;
        margin-left: calc(-1 * var(--vyasa-space-5));
        background: linear-gradient(270deg, var(--vyasa-bg), transparent);
    }
}
@media (max-width: 640px) {
    .katex-display {
        width: 100%;
        max-width: 100%;
        margin: var(--vyasa-space-4) 0;
        scrollbar-width: thin;
    }
    .katex-display > .katex {
        font-size: 0.94em;
    }
}
.vyasa-table-scroll > table, .vyasa-table-scroll > .uk-table { width: max-content !important; min-width: 0; table-layout: auto; margin: 0 auto; }
.vyasa-table-scroll th, .vyasa-table-scroll td { max-width: var(--vyasa-table-col-max, 45vw); white-space: normal; overflow-wrap: anywhere; word-break: normal; }
.uk-table { font-size: var(--vyasa-text-base); }
.uk-table td, .uk-table th { padding: var(--vyasa-space-2) var(--vyasa-space-3); }
.uk-table-striped tbody tr:nth-of-type(odd) { background-color: transparent; }
.uk-table-striped tbody tr:hover, .uk-table-hover tbody tr:hover { background-color: var(--vyasa-hover); }
.uk-table thead { border-bottom: 1px solid var(--vyasa-border); }
.uk-table thead th { height: 2.5rem; font: var(--vyasa-weight-medium) var(--vyasa-text-base)/var(--vyasa-leading-tight) var(--vyasa-font-ui); text-transform: none; letter-spacing: 0; color: var(--vyasa-ink); }
.uk-table tbody tr:last-child > td { border-bottom: 0; }
.uk-table th:not(:last-child), .uk-table td:not(:last-child) { border-right: none; }
.uk-table td, .uk-table th { border-bottom-color: var(--vyasa-border); }
.toc-link { padding-left: var(--vyasa-space-2) !important; font-size: var(--vyasa-text-sm); line-height: var(--vyasa-leading-snug); }
.vyasa-sidebar-body .post-search-link:hover { background: var(--vyasa-hover) !important; color: var(--vyasa-ink) !important; border-radius: var(--vyasa-radius-md) !important; }
.vyasa-sidebar-action-rail {
    border-left: 1px solid var(--vyasa-border);
    padding-left: var(--vyasa-space-2);
}
.vyasa-sidebar-action-button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    padding: 0;
    border-radius: var(--vyasa-control-radius) !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--vyasa-text-muted) !important;
    transition: background-color var(--vyasa-duration-fast) var(--vyasa-ease), color var(--vyasa-duration-fast) var(--vyasa-ease);
}
.vyasa-sidebar-action-button::after {
    content: attr(data-tooltip);
    position: absolute;
    right: calc(100% + var(--vyasa-space-2));
    top: 50%;
    transform: translateY(-50%) translateX(0.2rem);
    opacity: 0;
    pointer-events: none;
    white-space: nowrap;
    padding: var(--vyasa-space-1) var(--vyasa-space-2);
    border-radius: var(--vyasa-radius-sm);
    background: var(--vyasa-gray-12);
    color: var(--vyasa-gray-1) !important;
    box-shadow: var(--vyasa-shadow-sm);
    transition: opacity var(--vyasa-duration-fast) var(--vyasa-ease), transform var(--vyasa-duration-fast) var(--vyasa-ease);
    font: var(--vyasa-weight-medium) var(--vyasa-text-xs)/var(--vyasa-leading-snug) var(--vyasa-font-ui);
    z-index: 20;
}
.vyasa-sidebar-action-button:hover,
.vyasa-sidebar-action-button:focus-visible {
    background: var(--vyasa-hover) !important;
    color: var(--vyasa-ink) !important;
}
.vyasa-sidebar-action-button:hover::after,
.vyasa-sidebar-action-button:focus-visible::after {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}
.vyasa-sidebar-hover-toggle[data-hover-expand-enabled="true"] {
    color: var(--vyasa-ink) !important;
    background: var(--vyasa-active) !important;
}
.posts-search-block { background: transparent; margin-bottom: var(--vyasa-space-2); }
.posts-search-label { color: var(--vyasa-text-muted) !important; font: var(--vyasa-weight-medium) var(--vyasa-text-xs)/var(--vyasa-leading-tight) var(--vyasa-font-ui); }
.posts-search-input { padding-right: 3.25rem; }
.posts-search-preview-button,
.posts-search-clear-button {
    width: 1.25rem;
    height: 1.25rem;
    padding: 0;
    border: 0;
    border-radius: var(--vyasa-radius-sm) !important;
    background: transparent !important;
    color: var(--vyasa-text-faint) !important;
    font: var(--vyasa-weight-medium) var(--vyasa-text-sm)/1 var(--vyasa-font-ui);
    text-decoration: none !important;
}
.posts-search-preview-button:hover,
.posts-search-clear-button:hover { background: var(--vyasa-hover) !important; color: var(--vyasa-ink) !important; }
.posts-search-empty,
.posts-search-error {
    padding: var(--vyasa-space-1) var(--vyasa-space-2);
    color: var(--vyasa-text-faint);
    font: var(--vyasa-weight-regular) var(--vyasa-text-xs)/var(--vyasa-leading-snug) var(--vyasa-font-ui);
}
.posts-search-error { color: var(--vyasa-warning); }
.vyasa-command-palette-results .post-search-link.is-active {
    background: var(--vyasa-active) !important;
    color: var(--vyasa-ink) !important;
}
.vyasa-tree-doc {
    --vyasa-tree-line: var(--vyasa-border);
    --vyasa-tree-chip-bg: var(--vyasa-gray-3);
    margin: var(--vyasa-space-5) 0 var(--vyasa-space-6);
    overflow-x: auto;
}
.vyasa-tree-root,
.vyasa-tree-children { list-style: none; margin: 0; padding: 0; }
.vyasa-tree-children {
    margin-left: 0;
    padding-left: 0;
    border-left: 0;
}
.vyasa-tree-item { position: relative; margin: 2px 0; }
.vyasa-tree-children > .vyasa-tree-item::before {
    content: none;
}
.vyasa-tree-summary { display: block; list-style: none; cursor: pointer; }
.vyasa-tree-summary::-webkit-details-marker { display: none; }
.vyasa-tree-row {
    display: block;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    padding: var(--vyasa-space-1) var(--vyasa-space-2);
    color: var(--vyasa-ink);
}
.vyasa-tree-link {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    line-height: var(--vyasa-leading-tight);
    white-space: nowrap;
    gap: 0;
}
.vyasa-sidebar-body .vyasa-tree-row-shell {
    display: inline-flex;
    align-items: center;
    width: max-content;
    gap: var(--vyasa-tree-row-gap);
    padding: var(--vyasa-tree-row-py) var(--vyasa-tree-row-px);
    font-size: var(--vyasa-text-sm);
    line-height: var(--vyasa-leading-tight);
}
.vyasa-sidebar-body .vyasa-tree-row-shell > .w-4.mr-2,
.vyasa-sidebar-body .vyasa-tree-link > .w-4.mr-2 {
    margin-right: var(--vyasa-tree-row-icon-gap) !important;
}
.vyasa-sidebar-body .vyasa-action-row {
    gap: var(--vyasa-tree-row-action-gap) !important;
}
.vyasa-sidebar-body .vyasa-tree-row + .vyasa-tree-row,
.vyasa-sidebar-body .vyasa-bookmarks-list > :not([hidden]) ~ :not([hidden]),
.vyasa-sidebar-body .sidebar-scroll-container > :not([hidden]) ~ :not([hidden]),
.vyasa-sidebar-body ul > :not([hidden]) ~ :not([hidden]) {
    margin-top: var(--vyasa-tree-item-gap) !important;
}
.vyasa-sidebar-body li.my-1 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
.vyasa-sidebar-tree-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.25rem;
    height: 1.25rem;
    padding: var(--vyasa-tree-row-action-pad) !important;
    border-radius: var(--vyasa-radius-sm) !important;
    background: transparent !important;
    box-shadow: none !important;
    line-height: 1 !important;
    color: var(--vyasa-text-muted) !important;
}
.vyasa-sidebar-tree-action:hover,
.vyasa-sidebar-tree-action:focus-visible {
    color: var(--vyasa-ink) !important;
    background: var(--vyasa-active) !important;
}
.vyasa-sidebar-tree-action[data-git-ref-picker="true"] {
    gap: var(--vyasa-space-1);
}
.vyasa-sidebar-tree-action[data-git-ref-picker="true"] .vyasa-row-action-state {
    margin-left: 0 !important;
}
.vyasa-sidebar-body .vyasa-row-action-state {
    margin-left: var(--vyasa-tree-row-state-gap) !important;
}
.vyasa-tree-branch > details > .vyasa-tree-summary .vyasa-tree-label::before {
    content: "";
    display: inline-block;
    width: 0.4rem;
    height: 0.4rem;
    margin-right: var(--vyasa-space-2);
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg) translateY(-0.08rem);
    opacity: 0.6;
}
.vyasa-tree-branch > details:not([open]) > .vyasa-tree-summary .vyasa-tree-label::before { transform: rotate(-45deg); }
.vyasa-tree-section-row {
    margin-top: var(--vyasa-space-3);
    background: var(--vyasa-bg-subtle);
    border: 1px solid var(--vyasa-border);
    font-weight: var(--vyasa-weight-semibold);
}
.vyasa-tree-label {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
    padding-left: calc(var(--vyasa-tree-level, 0) * var(--vyasa-space-5));
}
.vyasa-tree-meta {
    display: grid;
    grid-template-columns: 2rem 2rem 5.6rem 4.2rem 5.8rem;
    align-items: center;
    justify-content: start;
    gap: var(--vyasa-space-1);
    width: max-content;
    margin-top: var(--vyasa-space-1);
    padding-left: calc((var(--vyasa-tree-level, 0) * var(--vyasa-space-5)) + var(--vyasa-space-5));
}
.vyasa-tree-chip {
    display: inline-flex;
    align-items: center;
    justify-self: start;
    width: max-content;
    min-height: 1.25rem;
    padding: 2px var(--vyasa-space-2);
    border: 1px solid var(--vyasa-border);
    border-radius: var(--vyasa-control-radius);
    background: var(--vyasa-tree-chip-bg);
    color: var(--vyasa-text-muted);
    font: var(--vyasa-weight-medium) var(--vyasa-text-xs)/1 var(--vyasa-font-ui);
    font-variant-numeric: tabular-nums;
}
.vyasa-tree-empty { color: var(--vyasa-text-muted); }
.vyasa-tree-table-wrap {
    width: 100%;
    overflow-x: auto;
    border: 1px solid var(--vyasa-border);
    border-radius: var(--vyasa-radius-lg);
}
.vyasa-tree-table {
    width: 100%;
    min-width: 58rem;
    border-collapse: separate;
    border-spacing: 0;
    color: var(--vyasa-ink);
    font-size: var(--vyasa-text-base);
}
.vyasa-tree-table th,
.vyasa-tree-table td {
    padding: var(--vyasa-space-2) var(--vyasa-space-3);
    border-bottom: 1px solid var(--vyasa-border);
    text-align: left;
    vertical-align: top;
}
.vyasa-tree-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--vyasa-bg-subtle);
    color: var(--vyasa-text-muted);
    font: var(--vyasa-weight-medium) var(--vyasa-text-sm)/var(--vyasa-leading-tight) var(--vyasa-font-ui);
}
.vyasa-tree-table tbody tr:last-child > td { border-bottom: 0; }
.vyasa-tree-table tbody tr:hover > td {
    background: var(--vyasa-hover);
}
.vyasa-tree-table-h1,
.vyasa-tree-table-h2 {
    font-weight: var(--vyasa-weight-semibold);
    color: var(--vyasa-ink);
}
.vyasa-tree-table-h3 { min-width: 16rem; }
.vyasa-tree-table-meta {
    white-space: nowrap;
    font-family: var(--vyasa-font-ui);
    font-size: var(--vyasa-text-sm);
    font-variant-numeric: tabular-nums;
}
@media (max-width: 720px) {
    .vyasa-tree-doc { overflow-x: auto; }
    .vyasa-tree-row {
        min-width: 0;
    }
}
.vyasa-spacer-rule {
    border: 0 !important;
    height: 1px !important;
    width: 100% !important;
    margin: var(--vyasa-space-6) 0 !important;
    background: var(--vyasa-border) !important;
}

/* Cmd+K search: matched characters in a result label. */
.search-match {
    font-weight: var(--vyasa-weight-semibold);
    color: var(--vyasa-ink);
    background: var(--vyasa-accent-4);
    border-radius: 2px;
    padding: 0 1px;
}