/* WebTintKit 0.3.2. Generated; do not edit. */
@layer wtk.tokens, wtk.base, wtk.chrome, wtk.content;
@property --wtk-color-accent {
  syntax: "<color>";
  inherits: true;
  initial-value: rgb(255 48 74);
}
@layer wtk.tokens {
  :root {
    --wtk-color-page-bg: #ffffff;
    --wtk-color-page-text: rgba(0, 0, 0, 0.76);
    --wtk-color-page-title: rgba(0, 0, 0, 0.92);
    --wtk-color-page-muted: rgba(0, 0, 0, 0.6);
    --wtk-color-page-tertiary: rgba(0, 0, 0, 0.4);
    --wtk-color-page-quaternary: rgba(0, 0, 0, 0.2);
    --wtk-color-page-rule: rgba(0, 0, 0, 0.12);
    --wtk-color-page-code-bg: rgba(0, 0, 0, 0.055);
    --wtk-color-glass-background: linear-gradient(135deg, rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.46)), linear-gradient(135deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.02));
    --wtk-color-glass-border: rgba(255, 255, 255, 0.64);
    --wtk-color-glass-shadow-outer: rgba(0, 0, 0, 0.08);
    --wtk-color-glass-shadow-inner: rgba(0, 0, 0, 0.04);
    --wtk-color-glass-highlight: rgba(255, 255, 255, 0.72);
    --wtk-color-glass-solid: #fafafa;
    --wtk-color-glass-topbar-background: rgba(255, 255, 255, 0.72);
    --wtk-color-glass-topbar-shadow: rgba(0, 0, 0, 0.08);
    --wtk-color-glass-topbar-highlight: rgba(255, 255, 255, 0.86);
    --wtk-color-glass-segmented-bg: rgba(255, 255, 255, 0.24);
    --wtk-color-glass-swatch-border: rgba(0, 0, 0, 0.14);
    --wtk-color-app-header-title: #000000;
    --wtk-color-app-header-muted: rgba(0, 0, 0, 0.6);
    --wtk-color-contents-active-bg: rgba(0, 0, 0, 0.04);
    --wtk-color-contents-active-border: rgba(0, 0, 0, 0.08);
    --wtk-font-serif: -apple-system-ui-serif, ui-serif, Gelasio, Georgia, Cambria, "Times New Roman", Times, serif;
    --wtk-font-rounded: ui-rounded, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --wtk-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    --wtk-type-body: clamp(1.6rem, 1.5rem + 0.5vw, 1.8rem);
    --wtk-type-h1: clamp(3rem, 2.3rem + 3.5vw, 4.4rem);
    --wtk-type-h2: clamp(2.4rem, 2.1rem + 1.5vw, 3rem);
    --wtk-type-h3: clamp(2rem, 1.8rem + 1vw, 2.4rem);
    --wtk-type-card-title: clamp(2rem, 1.8rem + 1vw, 2.4rem);
    --wtk-type-card-excerpt: clamp(1.5rem, 1.45rem + 0.25vw, 1.6rem);
    --wtk-type-nav-link: 1.4rem;
    --wtk-type-app-nav: 1.536rem;
    --wtk-type-app-name: 1.9rem;
    --wtk-type-line-height: 1.6;
    --wtk-type-line-height-nav: 1.4;
    --wtk-type-brand: 1.9rem;
    --wtk-type-brand-compact: 1.6rem;
    --wtk-type-control: 1.35rem;
    --wtk-type-footer: 1.35rem;
    --wtk-type-note: 1.3rem;
    --wtk-type-app-nav-compact: 1.44rem;
    --wtk-type-app-nav-phone: 1.376rem;
    --wtk-type-app-name-compact: 1.6rem;
    --wtk-type-weight-brand: 740;
    --wtk-type-weight-nav: 640;
    --wtk-type-weight-link: 600;
    --wtk-type-weight-control: 680;
    --wtk-type-weight-credit: 550;
    --wtk-type-contents-link: 1.35rem;
    --wtk-type-contents-link-weight: 650;
    --wtk-type-contents-link-weight-current: 700;
    --wtk-type-contents-link-line-height: 1.25;
    --wtk-type-contents-summary: 1.35rem;
    --wtk-type-contents-summary-weight: 760;
    --wtk-type-contents-summary-line-height: 1.2;
    --wtk-type-contents-title: 1.85rem;
    --wtk-type-contents-title-line-height: 1.18;
    --wtk-type-contents-date: 1.25rem;
    --wtk-type-contents-date-weight: 650;
    --wtk-type-contents-date-line-height: 1.3;
    --wtk-type-contents-index-date: 1.05rem;
    --wtk-type-contents-index-date-weight: 400;
    --wtk-type-contents-index-date-opacity: 0.5;
    --wtk-type-contents-eyebrow: 1.05rem;
    --wtk-type-contents-eyebrow-weight: 450;
    --wtk-type-contents-eyebrow-line-height: 1.2;
    --wtk-type-contents-eyebrow-separator-opacity: 0.5;
    --wtk-type-contents-chevron: 0.8em;
    --wtk-type-prose-heading-line-height: 1.25;
    --wtk-type-prose-heading-space-before: 1.55em;
    --wtk-type-prose-heading-space-after: 0.65em;
    --wtk-type-prose-h2-rule-gap: 0.28em;
    --wtk-type-prose-block-space: 1.25em;
    --wtk-type-prose-block-space-compact: 1em;
    --wtk-type-prose-list-indent: 1.4em;
    --wtk-type-prose-list-paragraph-gap: 0.5em;
    --wtk-type-prose-quote-rule: 4px;
    --wtk-type-prose-quote-indent: 1em;
    --wtk-type-prose-code-size: 0.9em;
    --wtk-type-prose-code-padding-block: 0.14em;
    --wtk-type-prose-code-padding-inline: 0.34em;
    --wtk-type-prose-pre-padding: 1.8rem;
    --wtk-type-prose-anchor-offset-mobile-contents: 2.333em;
    --wtk-layout-content-width: 90rem;
    --wtk-layout-nav-width: 117rem;
    --wtk-layout-contents-width: 24.6rem;
    --wtk-layout-settings-panel-width: 29.4rem;
    --wtk-layout-gear-edge-gap: 1.4rem;
    --wtk-layout-gear-nav-gap: 0.8rem;
    --wtk-layout-topbar-bleed: 2px;
    --wtk-layout-desktop-content-gap: 1.25em;
    --wtk-layout-footer-gap: 1.25em;
    --wtk-layout-desktop-topbar-top: 1.25em;
    --wtk-layout-desktop-topbar-height: 6.4rem;
    --wtk-layout-mobile-page-gap: 1em;
    --wtk-layout-mobile-topbar-top: 1em;
    --wtk-layout-mobile-topbar-height: 4.8rem;
    --wtk-layout-mobile-contents-max-height: 60vh;
    --wtk-layout-mobile-contents-gap: calc(var(--wtk-layout-mobile-page-gap) / 2);
    --wtk-layout-desktop-contents-top: calc(var(--wtk-layout-desktop-topbar-top) + env(safe-area-inset-top) + var(--wtk-layout-desktop-topbar-height) + var(--wtk-layout-desktop-content-gap));
    --wtk-layout-mobile-contents-top: calc(var(--wtk-layout-mobile-topbar-top) + env(safe-area-inset-top) + var(--wtk-layout-mobile-topbar-height) + var(--wtk-layout-mobile-contents-gap));
    --wtk-layout-app-desktop-contents-top: calc(var(--wtk-layout-app-desktop-gutter) + env(safe-area-inset-top) + var(--wtk-layout-app-header-height) + var(--wtk-layout-app-desktop-gutter));
    --wtk-layout-app-mobile-contents-top: calc(var(--wtk-layout-app-mobile-gutter) + env(safe-area-inset-top) + var(--wtk-layout-app-header-height) + (var(--wtk-layout-app-mobile-gutter) / 2));
    --wtk-layout-contents-min-width: 19rem;
    --wtk-layout-mobile-contents-max-height-dynamic: 60dvh;
    --wtk-layout-app-header-height: 6.4rem;
    --wtk-layout-app-desktop-gutter: clamp(2rem, 1.875rem + 0.625vw, 2.25rem);
    --wtk-layout-app-mobile-gutter: clamp(1.6rem, 1.5rem + 0.5vw, 1.8rem);
    --wtk-layout-app-icon: 4.4rem;
    --wtk-layout-breakpoint-tablet: 48em;
    --wtk-layout-breakpoint-phone: 28.75em;
    --wtk-layout-breakpoint-wide: 62em;
    --wtk-layout-row-min-height: 4.8rem;
    --wtk-layout-ios-content-padding: 20px;
    --wtk-layout-ios-scaffold-max-width: 720px;
    --wtk-layout-ios-onboarding-max-width: 640px;
    --wtk-layout-ios-row-min-height: 48px;
    --wtk-layout-app-icon-compact: 4rem;
    --wtk-layout-panel-margin: 1.6rem;
    --wtk-layout-panel-gap: 2rem;
    --wtk-layout-nav-gear-gap: 0.4rem;
    --wtk-layout-nav-fade: 2.4rem;
    --wtk-safe-area-top: env(safe-area-inset-top);
    --wtk-safe-area-right: env(safe-area-inset-right);
    --wtk-safe-area-bottom: env(safe-area-inset-bottom);
    --wtk-safe-area-left: env(safe-area-inset-left);
    --wtk-radius-glass-card: 1.4rem;
    --wtk-radius-glass-document: 1.6rem;
    --wtk-radius-glass-feature: 2.8rem;
    --wtk-radius-card: var(--wtk-radius-glass-card);
    --wtk-radius-topbar: 1.6rem;
    --wtk-radius-panel: 1.4rem;
    --wtk-radius-app-header: 1.8rem;
    --wtk-radius-input: 1rem;
    --wtk-radius-contents-item: 1rem;
    --wtk-radius-pill: 999px;
    --wtk-radius-ios-card: 26px;
    --wtk-radius-ios-onboarding: 28px;
    --wtk-radius-ios-input: 10px;
    --wtk-radius-segmented: 1.2rem;
    --wtk-radius-segmented-item: 0.9rem;
    --wtk-radius-prose-code: 0.6rem;
    --wtk-radius-prose-pre: 1.2rem;
    --wtk-radius-prose-image: 0.8rem;
    --wtk-shape-corner: squircle;
    --wtk-glass-filter-card: blur(26px) saturate(160%);
    --wtk-glass-filter-topbar: blur(22px) saturate(140%);
    --wtk-glass-shadow-card: 0 0 42px var(--wtk-color-glass-shadow-outer), 0 0 18px var(--wtk-color-glass-shadow-inner), inset 0 0 0 var(--wtk-color-glass-highlight);
    --wtk-glass-shadow-card-soft: 0 0 42px var(--wtk-color-glass-shadow-outer), 0 0 18px var(--wtk-color-glass-shadow-inner), inset 0 0 0 var(--wtk-color-glass-highlight);
    --wtk-glass-shadow-topbar: 0 0 16px var(--wtk-color-glass-topbar-shadow), 0 0 18px var(--wtk-color-glass-shadow-inner), inset 0 0 0 var(--wtk-color-glass-topbar-highlight);
    --wtk-glass-shadow-panel: 0 0 16px var(--wtk-color-glass-topbar-shadow), 0 16px 34px rgba(0, 0, 0, 0.12), inset 0 0 0 var(--wtk-color-glass-topbar-highlight);
    --wtk-shadow-swatch: inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.1);
    --wtk-shadow-app-icon: drop-shadow(0 5px 10px rgba(0, 0, 0, 0.1)) drop-shadow(0 1px 1px rgba(0, 0, 0, 0.2));
    --wtk-motion-accent: 160ms;
    --wtk-motion-surface: 260ms;
    --wtk-motion-panel: 180ms;
    --wtk-motion-hover-close-delay: 300ms;
    --wtk-motion-preview-delay: 120ms;
    --wtk-motion-scheme-transition: 260ms;
    --wtk-motion-ease: cubic-bezier(0.25, 0.1, 0.25, 1);
    --wtk-motion-ease-emphasised: cubic-bezier(0.2, 0.8, 0.2, 1);
    --wtk-motion-ios-snappy: .snappy(duration: 0.32, extraBounce: 0.02);
    --wtk-motion-ios-entrance: .snappy(duration: 0.7);
    --wtk-motion-ios-spring: .spring(response: 0.3, dampingFraction: 0.84);
    --wtk-motion-ios-smooth: .smooth(duration: 0.4);
    --wtk-motion-control: 180ms;
    --wtk-motion-credit: 200ms;
    --wtk-motion-image-reveal: 200ms;
    --wtk-motion-contents-summary: 260ms;
    --wtk-motion-contents-summary-blur: 4px;
    --wtk-motion-contents-panel: 320ms;
    --wtk-motion-contents-fade: 200ms;
    --wtk-motion-panel-translate: -0.6rem;
    --wtk-motion-instant: 0s;
    --wtk-space-1: 0.2rem;
    --wtk-space-2: 0.4rem;
    --wtk-space-3: 0.6rem;
    --wtk-space-4: 0.8rem;
    --wtk-space-5: 1rem;
    --wtk-space-6: 1.2rem;
    --wtk-space-7: 1.4rem;
    --wtk-space-8: 1.6rem;
    --wtk-space-9: 2rem;
    --wtk-space-10: 2.4rem;
    --wtk-space-11: 3.2rem;
    --wtk-space-12: 4.8rem;
    --wtk-space-contents-rail: 1.8rem;
    --wtk-space-contents-rail-end: 1.2rem;
    --wtk-space-contents-index-block: 0.65em;
    --wtk-space-contents-link: 0.8rem;
    --wtk-space-contents-item-bleed: 0.8rem;
    --wtk-space-contents-list-gap: 0.4rem;
    --wtk-space-contents-level-indent: 1em;
    --wtk-space-contents-divider-before: 1.6rem;
    --wtk-space-contents-divider-after: 1.2rem;
    --wtk-space-contents-divider-bleed: 0.2rem;
    --wtk-space-contents-divider-mobile: 0.8rem;
    --wtk-space-contents-time: 0.8rem;
    --wtk-space-contents-date: 0.4rem;
    --wtk-space-contents-summary-gap: 0.45em;
    --wtk-space-contents-bar-block: 1rem;
    --wtk-space-contents-bar-inline: 1em;
    --wtk-space-contents-panel-block: 1.2rem;
    --wtk-space-contents-panel-inline: 1em;
    --wtk-space-contents-panel-offset: -0.6rem;
    --wtk-space-contents-label-clip: 0.8rem;
    --wtk-space-contents-eyebrow-after: 0.2rem;
    --wtk-space-contents-eyebrow-separator: 0.4rem;
    --wtk-space-text-xs: 0.35em;
    --wtk-space-text-sm: 0.6em;
    --wtk-space-text-md: 1em;
    --wtk-size-control: 3.6rem;
    --wtk-size-control-compact: 3.2rem;
    --wtk-size-control-row: 3.4rem;
    --wtk-size-icon: 1.9rem;
    --wtk-size-icon-sm: 1.8rem;
    --wtk-size-swatch: 2.1rem;
    --wtk-size-hairline: 1px;
    --wtk-size-focus-ring: 2px;
    --wtk-size-underline: 0.06em;
    --wtk-size-underline-offset: 0.14em;
    --wtk-color-tint-pink: rgb(255 48 74);
    --wtk-color-tint-pink-rgb: 255, 48, 74;
    --wtk-color-tint-grey: rgb(0 0 0);
    --wtk-color-tint-grey-rgb: 0, 0, 0;
    --wtk-color-tint-red: rgb(255 0 13);
    --wtk-color-tint-red-rgb: 255, 0, 13;
    --wtk-color-tint-green: rgb(42 209 84);
    --wtk-color-tint-green-rgb: 42, 209, 84;
    --wtk-color-tint-blue: rgb(0 73 255);
    --wtk-color-tint-blue-rgb: 0, 73, 255;
    --wtk-color-tint-orange: rgb(255 94 0);
    --wtk-color-tint-orange-rgb: 255, 94, 0;
    --wtk-color-tint-purple: rgb(191 0 255);
    --wtk-color-tint-purple-rgb: 191, 0, 255;
    --wtk-color-tint-yellow: rgb(253 184 39);
    --wtk-color-tint-yellow-rgb: 253, 184, 39;
    --wtk-color-accent: var(--wtk-color-tint-pink);
    --wtk-color-accent-rgb: var(--wtk-color-tint-pink-rgb);
    --wtk-color-control: color-mix(in srgb, var(--wtk-color-accent) 58%, #000);
    --wtk-color-link-dark: color-mix(in srgb, var(--wtk-color-accent) 55%, #fff);
    --wtk-color-settings-active-bg: color-mix(in srgb, var(--wtk-color-accent) 10%, transparent);
    --wtk-color-settings-active-border: color-mix(in srgb, var(--wtk-color-accent) 32%, transparent);
    --wtk-color-link: var(--wtk-color-control);
    --wtk-color-focus-ring: var(--wtk-color-control);
    --wtk-color-on-control: #fff;
  }
  :root[data-blog-tint="pink"] {
    --wtk-color-accent: var(--wtk-color-tint-pink);
    --wtk-color-accent-rgb: var(--wtk-color-tint-pink-rgb);
  }
  :root[data-blog-tint="grey"] {
    --wtk-color-accent: var(--wtk-color-tint-grey);
    --wtk-color-accent-rgb: var(--wtk-color-tint-grey-rgb);
  }
  :root[data-blog-tint="red"] {
    --wtk-color-accent: var(--wtk-color-tint-red);
    --wtk-color-accent-rgb: var(--wtk-color-tint-red-rgb);
  }
  :root[data-blog-tint="green"] {
    --wtk-color-accent: var(--wtk-color-tint-green);
    --wtk-color-accent-rgb: var(--wtk-color-tint-green-rgb);
  }
  :root[data-blog-tint="blue"] {
    --wtk-color-accent: var(--wtk-color-tint-blue);
    --wtk-color-accent-rgb: var(--wtk-color-tint-blue-rgb);
  }
  :root[data-blog-tint="orange"] {
    --wtk-color-accent: var(--wtk-color-tint-orange);
    --wtk-color-accent-rgb: var(--wtk-color-tint-orange-rgb);
  }
  :root[data-blog-tint="purple"] {
    --wtk-color-accent: var(--wtk-color-tint-purple);
    --wtk-color-accent-rgb: var(--wtk-color-tint-purple-rgb);
  }
  :root[data-blog-tint="yellow"] {
    --wtk-color-accent: var(--wtk-color-tint-yellow);
    --wtk-color-accent-rgb: var(--wtk-color-tint-yellow-rgb);
  }
  :root[data-blog-tint="grey"] {
    --wtk-color-control: var(--wtk-color-tint-grey);
    --wtk-color-on-control: var(--wtk-color-page-bg);
    --wtk-color-link: var(--wtk-color-page-title);
    --wtk-color-focus-ring: var(--wtk-color-page-title);
  }
  :root[data-wtk-brand="shared"] {
    --wtk-color-page-title: rgba(0, 0, 0, 0.90);
    --wtk-color-page-muted: rgba(0, 0, 0, 0.58);
    --wtk-layout-contents-width: 27rem;
  }
  :root[data-blog-resolved-scheme="dark"] {
    --wtk-color-page-bg: #222628;
    --wtk-color-page-text: rgba(255, 255, 255, 0.85);
    --wtk-color-page-title: rgba(255, 255, 255, 0.95);
    --wtk-color-page-muted: rgba(255, 255, 255, 0.7);
    --wtk-color-page-tertiary: rgba(255, 255, 255, 0.45);
    --wtk-color-page-quaternary: rgba(255, 255, 255, 0.2);
    --wtk-color-page-rule: rgba(255, 255, 255, 0.14);
    --wtk-color-page-code-bg: rgba(255, 255, 255, 0.08);
    --wtk-color-glass-background: rgba(0, 0, 0, 0.28);
    --wtk-color-glass-border: rgba(255, 255, 255, 0.06);
    --wtk-color-glass-shadow-outer: rgba(0, 0, 0, 0.18);
    --wtk-color-glass-shadow-inner: rgba(0, 0, 0, 0.08);
    --wtk-color-glass-highlight: rgba(255, 255, 255, 0.06);
    --wtk-color-glass-solid: rgb(34, 38, 40);
    --wtk-color-glass-topbar-background: rgba(0, 0, 0, 0.28);
    --wtk-color-glass-topbar-shadow: rgba(0, 0, 0, 0.18);
    --wtk-color-glass-topbar-highlight: rgba(255, 255, 255, 0.06);
    --wtk-color-glass-segmented-bg: rgba(0, 0, 0, 0.12);
    --wtk-color-glass-swatch-border: rgba(255, 255, 255, 0.18);
    --wtk-color-app-header-title: #ffffff;
    --wtk-color-app-header-muted: rgba(255, 255, 255, 0.6);
    --wtk-color-contents-active-bg: rgba(255, 255, 255, 0.06);
    --wtk-color-contents-active-border: rgba(255, 255, 255, 0.08);
    --wtk-type-contents-index-date-opacity: 0.65;
    --wtk-glass-filter-card: blur(22px) saturate(140%);
    --wtk-glass-shadow-card-soft: 0 0 42px rgba(0, 0, 0, 0.12), 0 0 18px rgba(0, 0, 0, 0.06), inset 0 0 0 var(--wtk-color-glass-highlight);
    --wtk-glass-shadow-panel: 0 0 16px var(--wtk-color-glass-topbar-shadow), 0 0 18px var(--wtk-color-glass-shadow-inner), inset 0 0 0 var(--wtk-color-glass-topbar-highlight);
    --wtk-color-tint-grey: rgb(255 255 255);
    --wtk-color-tint-grey-rgb: 255, 255, 255;
    --wtk-color-link: var(--wtk-color-link-dark);
    --wtk-color-focus-ring: var(--wtk-color-link-dark);
  }
  :root[data-blog-resolved-scheme="dark"][data-wtk-brand="shared"] {
    --wtk-color-page-text: rgba(255, 255, 255, 0.72);
    --wtk-color-page-title: rgba(255, 255, 255, 0.94);
    --wtk-color-page-muted: rgba(255, 255, 255, 0.54);
  }
  @media (prefers-color-scheme: dark) {
    :root:not([data-blog-resolved-scheme="light"]) {
      --wtk-color-page-bg: #222628;
      --wtk-color-page-text: rgba(255, 255, 255, 0.85);
      --wtk-color-page-title: rgba(255, 255, 255, 0.95);
      --wtk-color-page-muted: rgba(255, 255, 255, 0.7);
      --wtk-color-page-tertiary: rgba(255, 255, 255, 0.45);
      --wtk-color-page-quaternary: rgba(255, 255, 255, 0.2);
      --wtk-color-page-rule: rgba(255, 255, 255, 0.14);
      --wtk-color-page-code-bg: rgba(255, 255, 255, 0.08);
      --wtk-color-glass-background: rgba(0, 0, 0, 0.28);
      --wtk-color-glass-border: rgba(255, 255, 255, 0.06);
      --wtk-color-glass-shadow-outer: rgba(0, 0, 0, 0.18);
      --wtk-color-glass-shadow-inner: rgba(0, 0, 0, 0.08);
      --wtk-color-glass-highlight: rgba(255, 255, 255, 0.06);
      --wtk-color-glass-solid: rgb(34, 38, 40);
      --wtk-color-glass-topbar-background: rgba(0, 0, 0, 0.28);
      --wtk-color-glass-topbar-shadow: rgba(0, 0, 0, 0.18);
      --wtk-color-glass-topbar-highlight: rgba(255, 255, 255, 0.06);
      --wtk-color-glass-segmented-bg: rgba(0, 0, 0, 0.12);
      --wtk-color-glass-swatch-border: rgba(255, 255, 255, 0.18);
      --wtk-color-app-header-title: #ffffff;
      --wtk-color-app-header-muted: rgba(255, 255, 255, 0.6);
      --wtk-color-contents-active-bg: rgba(255, 255, 255, 0.06);
      --wtk-color-contents-active-border: rgba(255, 255, 255, 0.08);
      --wtk-type-contents-index-date-opacity: 0.65;
      --wtk-glass-filter-card: blur(22px) saturate(140%);
      --wtk-glass-shadow-card-soft: 0 0 42px rgba(0, 0, 0, 0.12), 0 0 18px rgba(0, 0, 0, 0.06), inset 0 0 0 var(--wtk-color-glass-highlight);
      --wtk-glass-shadow-panel: 0 0 16px var(--wtk-color-glass-topbar-shadow), 0 0 18px var(--wtk-color-glass-shadow-inner), inset 0 0 0 var(--wtk-color-glass-topbar-highlight);
      --wtk-color-tint-grey: rgb(255 255 255);
      --wtk-color-tint-grey-rgb: 255, 255, 255;
      --wtk-color-link: var(--wtk-color-link-dark);
      --wtk-color-focus-ring: var(--wtk-color-link-dark);
    }
    :root:not([data-blog-resolved-scheme="light"])[data-wtk-brand="shared"] {
      --wtk-color-page-text: rgba(255, 255, 255, 0.72);
      --wtk-color-page-title: rgba(255, 255, 255, 0.94);
      --wtk-color-page-muted: rgba(255, 255, 255, 0.54);
    }
  }
  @supports (color: color(display-p3 1 0 0)) {
    :root {
      --wtk-color-tint-pink: color(display-p3 1 0.18823529 0.29019608);
      --wtk-color-tint-red: color(display-p3 1 0 0.05098039);
      --wtk-color-tint-green: color(display-p3 0.16470588 0.81960784 0.32941176);
      --wtk-color-tint-blue: color(display-p3 0 0.28627451 1);
      --wtk-color-tint-orange: color(display-p3 1 0.36862745 0);
      --wtk-color-tint-purple: color(display-p3 0.74901961 0 1);
      --wtk-color-tint-yellow: color(display-p3 0.99215686 0.72156863 0.15294118);
    }
    @media (prefers-color-scheme: dark) {
    }
  }
  :root {
    --font-serif: var(--wtk-font-serif);
    --font-monospace: var(--wtk-font-mono);
    --page-bg: var(--wtk-color-page-bg);
    --page-text: var(--wtk-color-page-text);
    --title-text: var(--wtk-color-page-title);
    --muted-text: var(--wtk-color-page-muted);
    --tertiary-text: var(--wtk-color-page-tertiary);
    --quaternary-text: var(--wtk-color-page-quaternary);
    --rule: var(--wtk-color-page-rule);
    --code-bg: var(--wtk-color-page-code-bg);
    --glass-background: var(--wtk-color-glass-background);
    --glass-border: var(--wtk-color-glass-border);
    --topbar-border: var(--wtk-color-glass-border);
    --glass-shadow-outer: var(--wtk-color-glass-shadow-outer);
    --glass-shadow-inner: var(--wtk-color-glass-shadow-inner);
    --glass-highlight: var(--wtk-color-glass-highlight);
    --glass-mobile-solid-background: var(--wtk-color-glass-solid);
    --topbar-background: var(--wtk-color-glass-topbar-background);
    --topbar-shadow: var(--wtk-color-glass-topbar-shadow);
    --toc-active-bg: var(--wtk-color-contents-active-bg);
    --toc-active-border: var(--wtk-color-contents-active-border);
    --settings-active-bg: var(--wtk-color-settings-active-bg);
    --settings-active-border: var(--wtk-color-settings-active-border);
    --settings-panel-width: var(--wtk-layout-settings-panel-width);
    --gear-edge-gap: var(--wtk-layout-gear-edge-gap);
    --gear-nav-gap: var(--wtk-layout-gear-nav-gap);
    --topbar-bleed: var(--wtk-layout-topbar-bleed);
    --content-width: var(--wtk-layout-content-width);
    --nav-width: var(--wtk-layout-nav-width);
    --toc-width: var(--wtk-layout-contents-width);
    --desktop-content-gap: var(--wtk-layout-desktop-content-gap);
    --footer-gap: var(--wtk-layout-footer-gap);
    --desktop-topbar-top: var(--wtk-layout-desktop-topbar-top);
    --desktop-topbar-height: var(--wtk-layout-desktop-topbar-height);
    --mobile-page-gap: var(--wtk-layout-mobile-page-gap);
    --mobile-topbar-top: var(--wtk-layout-mobile-topbar-top);
    --mobile-topbar-height: var(--wtk-layout-mobile-topbar-height);
    --mobile-toc-max-height: var(--wtk-layout-mobile-contents-max-height);
    --desktop-toc-top: var(--wtk-layout-desktop-contents-top);
    --mobile-toc-top: var(--wtk-layout-mobile-contents-top);
    --text-body: var(--wtk-type-body);
    --text-h1: var(--wtk-type-h1);
    --text-h2: var(--wtk-type-h2);
    --text-h3: var(--wtk-type-h3);
    --text-card-title: var(--wtk-type-card-title);
    --text-card-excerpt: var(--wtk-type-card-excerpt);
    --accent-color: var(--wtk-color-accent);
    --accent: var(--wtk-color-accent);
    --accent-strong: var(--wtk-color-accent);
    --accent-rgb: var(--wtk-color-accent-rgb);
    --focus-ring: var(--wtk-color-focus-ring);
    --tint-pink-rgb: var(--wtk-color-tint-pink-rgb);
    --tint-grey-rgb: var(--wtk-color-tint-grey-rgb);
    --tint-red-rgb: var(--wtk-color-tint-red-rgb);
    --tint-green-rgb: var(--wtk-color-tint-green-rgb);
    --tint-blue-rgb: var(--wtk-color-tint-blue-rgb);
    --tint-orange-rgb: var(--wtk-color-tint-orange-rgb);
    --tint-purple-rgb: var(--wtk-color-tint-purple-rgb);
    --tint-yellow-rgb: var(--wtk-color-tint-yellow-rgb);
  }
}
@layer wtk.tokens;

@layer wtk.base {
  @font-face {
    font-family: Gelasio;
    font-style: normal;
    font-display: swap;
    font-weight: 400;
    src: url("/assets/wtk/0.3.2/fonts/gelasio/gelasio-latin-400-normal.woff2") format("woff2");
    unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }

  @font-face {
    font-family: Gelasio;
    font-style: italic;
    font-display: swap;
    font-weight: 400;
    src: url("/assets/wtk/0.3.2/fonts/gelasio/gelasio-latin-400-italic.woff2") format("woff2");
    unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }

  @font-face {
    font-family: Gelasio;
    font-style: normal;
    font-display: swap;
    font-weight: 700;
    src: url("/assets/wtk/0.3.2/fonts/gelasio/gelasio-latin-700-normal.woff2") format("woff2");
    unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }

  @font-face {
    font-family: Gelasio;
    font-style: italic;
    font-display: swap;
    font-weight: 700;
    src: url("/assets/wtk/0.3.2/fonts/gelasio/gelasio-latin-700-italic.woff2") format("woff2");
    unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }

  :root {
    color-scheme: light dark;
    transition: --wtk-color-accent var(--wtk-motion-accent) ease;
  }

  :root[data-blog-scheme="dark"] {
    color-scheme: dark;
  }

  :root[data-blog-scheme="light"] {
    color-scheme: light;
  }

  @supports (corner-shape: squircle) {
    :root {
      --wtk-shape-corner-scale: 1.25;
    }
  }

  .wtk-safe-probe {
    visibility: hidden;
    pointer-events: none;
    padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
    position: fixed;
    inset: 0;
  }

  *, :before, :after {
    box-sizing: border-box;
  }

  html {
    background: var(--wtk-color-page-bg);
    -webkit-tap-highlight-color: transparent;
    min-height: 100%;
    font-size: 62.5%;
  }

  body {
    background: var(--wtk-color-page-bg);
    min-height: 100%;
    color: var(--wtk-color-page-text);
    font-family: var(--wtk-font-serif);
    font-size: var(--wtk-type-body);
    line-height: var(--wtk-type-line-height);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizelegibility;
    transition: background-color var(--wtk-motion-surface) ease,
      color var(--wtk-motion-surface) ease;
    margin: 0;
  }

  [data-wtk-typeface="rounded"] body {
    font-family: var(--wtk-font-rounded);
  }

  a {
    color: var(--wtk-color-link);
    transition: color var(--wtk-motion-accent) var(--wtk-motion-ease);
    text-decoration: none;
  }

  .wtk-main a:not([class]), .wtk-main p a, .wtk-main li a {
    font-weight: var(--wtk-type-weight-link);
  }

  a:hover, a:focus {
    color: var(--wtk-color-accent);
    text-decoration: none;
  }

  :focus-visible {
    outline: var(--wtk-size-focus-ring) solid var(--wtk-color-focus-ring);
    outline-offset: var(--wtk-size-focus-ring);
  }

  [data-wtk-needs-script] {
    visibility: hidden;
  }

  html[data-wtk-ready] [data-wtk-needs-script] {
    visibility: visible;
  }

  .wtk-skip-link {
    top: -100vh;
    left: calc(var(--wtk-space-10) + env(safe-area-inset-left));
    z-index: 30;
    padding: var(--wtk-space-6) var(--wtk-space-8);
    background: var(--wtk-color-page-bg);
    position: absolute;
  }

  .wtk-skip-link:focus {
    top: calc(var(--wtk-space-6) + env(safe-area-inset-top));
  }

  .wtk-visually-hidden {
    width: var(--wtk-size-hairline);
    height: var(--wtk-size-hairline);
    clip-path: inset(50%);
    white-space: nowrap;
    position: absolute;
    overflow: hidden;
  }

  ::view-transition-group(root), ::view-transition-old(root), ::view-transition-new(root) {
    animation-duration: var(--wtk-motion-scheme-transition);
    animation-timing-function: var(--wtk-motion-ease-emphasised);
  }

  :root[data-wtk-scheme-transitioning], :root[data-wtk-scheme-transitioning] *, :root[data-wtk-scheme-transitioning] :before, :root[data-wtk-scheme-transitioning] :after {
    transition-delay: var(--wtk-motion-instant) !important;
    transition-duration: var(--wtk-motion-instant) !important;
  }

  @media (prefers-reduced-motion: reduce) {
    :root, body, a {
      transition: none;
    }

    ::view-transition-group(root), ::view-transition-old(root), ::view-transition-new(root) {
      animation: none;
    }

    *, :before, :after {
      scroll-behavior: auto !important;
    }
  }
}

@layer wtk.chrome {
  .wtk-app-header {
    top: calc(var(--wtk-layout-app-desktop-gutter) + env(safe-area-inset-top));
    z-index: 20;
    min-width: 0;
    width: calc(100% + (var(--wtk-layout-topbar-bleed) * 2));
    max-width: none;
    margin-left: calc(var(--wtk-layout-topbar-bleed) * -1);
    margin-right: calc(var(--wtk-layout-topbar-bleed) * -1);
    min-height: var(--wtk-layout-app-header-height);
    padding: var(--wtk-space-4) calc(var(--wtk-layout-gear-edge-gap) - var(--wtk-size-hairline)) var(--wtk-space-4) var(--wtk-space-4);
    border: var(--wtk-size-hairline) solid var(--wtk-color-glass-border);
    border-radius: calc(var(--wtk-radius-app-header) * var(--wtk-shape-corner-scale, 1));
    corner-shape: var(--wtk-shape-corner);
    background: var(--wtk-color-glass-topbar-background);
    backdrop-filter: var(--wtk-glass-filter-topbar);
    box-shadow: var(--wtk-glass-shadow-topbar);
    justify-content: space-between;
    align-items: center;
    display: flex;
    position: sticky;
  }

  .wtk-app-identity {
    align-items: center;
    gap: var(--wtk-space-6);
    min-width: 0;
    margin-right: var(--wtk-space-6);
    flex: none;
    display: flex;
  }

  .wtk-app-icon-link {
    align-items: center;
    display: flex;
  }

  .wtk-app-icon {
    width: var(--wtk-layout-app-icon);
    height: var(--wtk-layout-app-icon);
    clip-path: url("#wtk-app-icon-shape");
  }

  .wtk-app-name {
    font-size: var(--wtk-type-app-name);
    font-weight: var(--wtk-type-weight-brand);
    white-space: nowrap;
    align-items: center;
    margin: 0;
    line-height: 1;
    text-decoration: none;
    display: flex;
    color: var(--wtk-color-app-header-title) !important;
  }

  .wtk-app-name:hover, .wtk-app-name:focus {
    text-decoration: none;
  }

  .wtk-app-name .brandWordTail {
    font-feature-settings: "smcp" 1, "c2sc" 1;
    font-variant-caps: all-small-caps;
  }

  .wtk-app-nav {
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    min-width: 0;
    padding-block: var(--wtk-space-4);
    flex: auto;
    justify-content: flex-end;
    align-items: center;
    display: flex;
    overflow: auto hidden;
  }

  .wtk-app-nav::-webkit-scrollbar {
    display: none;
  }

  .wtk-app-nav[data-wtk-nav-overflow] {
    --wtk-app-nav-fade-direction: to right;
    --wtk-app-nav-fade-start: black;
    --wtk-app-nav-fade-end: black;
    -webkit-mask-image: linear-gradient(var(--wtk-app-nav-fade-direction), var(--wtk-app-nav-fade-start), black var(--wtk-layout-nav-fade), black calc(100% - var(--wtk-layout-nav-fade)), var(--wtk-app-nav-fade-end));
    mask-image: linear-gradient(var(--wtk-app-nav-fade-direction), var(--wtk-app-nav-fade-start), black var(--wtk-layout-nav-fade), black calc(100% - var(--wtk-layout-nav-fade)), var(--wtk-app-nav-fade-end));
  }

  .wtk-app-nav[data-wtk-nav-overflow]:dir(rtl) {
    --wtk-app-nav-fade-direction: to left;
  }

  .wtk-app-nav[data-wtk-nav-overflow="start"], .wtk-app-nav[data-wtk-nav-overflow="both"] {
    --wtk-app-nav-fade-start: transparent;
  }

  .wtk-app-nav[data-wtk-nav-overflow="end"], .wtk-app-nav[data-wtk-nav-overflow="both"] {
    --wtk-app-nav-fade-end: transparent;
  }

  .wtk-app-nav ul {
    gap: var(--wtk-space-8);
    align-items: center;
    min-width: max-content;
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
  }

  .wtk-app-nav li {
    display: flex;
  }

  .wtk-app-nav-link {
    font-size: var(--wtk-type-app-nav);
    font-weight: var(--wtk-type-weight-nav);
    line-height: var(--wtk-type-line-height-nav);
    text-decoration: none;
    color: var(--wtk-color-app-header-muted) !important;
  }

  @media (hover: hover) and (pointer: fine) {
    a.wtk-app-nav-link:hover, a.wtk-app-nav-link:active {
      text-decoration: none;
      color: var(--wtk-color-app-header-title) !important;
    }
  }

  .wtk-app-nav-link[aria-current="page"] {
    cursor: default;
    color: var(--wtk-color-app-header-title) !important;
  }

  .wtk-app-nav-short {
    display: none;
  }

  .wtk-app-header .wtk-settings {
    margin-left: var(--wtk-layout-nav-gear-gap);
  }

  @media (hover: hover) and (pointer: fine) {
    .wtk-app-header .wtk-settings-button:hover:not([aria-expanded="true"]) {
      color: var(--wtk-color-page-muted);
    }
  }

  .wtk-app-header .wtk-settings-button:focus-visible {
    outline-offset: calc(var(--wtk-space-2) * -1);
  }

  @media (width <= 48em) {
    .wtk-app-header {
      top: calc(var(--wtk-layout-app-mobile-gutter) + env(safe-area-inset-top));
      padding-left: var(--wtk-space-5);
    }

    .wtk-app-name {
      display: none;
    }

    [data-wtk-wordmark="always"] .wtk-app-name {
      font-size: var(--wtk-type-app-name-compact);
      display: flex;
    }

    .wtk-app-nav {
      justify-content: flex-start;
    }

    .wtk-app-nav ul {
      gap: var(--wtk-space-6);
    }

    .wtk-app-nav-link {
      font-size: var(--wtk-type-app-nav-compact);
    }

    .wtk-app-nav-full {
      display: none;
    }

    .wtk-app-nav-short {
      display: inline;
    }
  }

  @media (width <= 28.75em) {
    .wtk-app-header {
      padding-right: calc(var(--wtk-layout-gear-edge-gap) - var(--wtk-size-hairline));
    }

    .wtk-app-identity {
      gap: var(--wtk-space-5);
      margin-right: var(--wtk-space-5);
    }

    .wtk-app-icon {
      width: var(--wtk-layout-app-icon-compact);
      height: var(--wtk-layout-app-icon-compact);
    }

    .wtk-app-nav ul {
      gap: var(--wtk-space-4);
    }

    .wtk-app-nav-link {
      font-size: var(--wtk-type-app-nav-phone);
    }

    .wtk-app-nav-optional {
      width: var(--wtk-size-hairline);
      height: var(--wtk-size-hairline);
      clip-path: inset(50%);
      white-space: nowrap;
      position: absolute;
      overflow: hidden;
    }
  }

  .wtk-footer {
    width: min(100%, var(--wtk-layout-content-width));
    margin: var(--wtk-layout-footer-gap) auto 0;
    color: var(--wtk-color-page-muted);
    font-size: var(--wtk-type-footer);
    text-align: center;
    transition: color var(--wtk-motion-surface) ease,
      border-color var(--wtk-motion-surface) ease;
  }

  .wtk-footer p {
    margin: 0;
  }

  .wtk-footer p + p {
    margin-top: var(--wtk-space-text-sm);
  }

  .wtk-footer-credit {
    color: inherit;
    font-weight: var(--wtk-type-weight-credit);
    transition: color var(--wtk-motion-credit) ease;
    text-decoration: none;
  }

  .wtk-footer-credit:link, .wtk-footer-credit:visited, .wtk-footer-credit:hover, .wtk-footer-credit:active {
    text-decoration: none;
    color: inherit !important;
  }

  .wtk-footer-credit:hover, .wtk-footer-credit:active, .wtk-footer-credit:focus-visible {
    color: var(--wtk-color-accent) !important;
  }

  .wtk-footer-social {
    justify-content: center;
    gap: var(--wtk-space-7);
    margin: var(--wtk-space-text-sm) 0 0;
    padding: 0;
    list-style: none;
    display: flex;
  }

  .wtk-footer-social a {
    width: var(--wtk-size-control-compact);
    height: var(--wtk-size-control-compact);
    border-radius: var(--wtk-radius-pill);
    color: inherit;
    justify-content: center;
    align-items: center;
    display: inline-flex;
  }

  .wtk-footer-social svg {
    width: var(--wtk-size-icon-sm);
    height: var(--wtk-size-icon-sm);
    fill: currentColor;
  }

  .wtk-footer-hidden-rel {
    width: var(--wtk-size-hairline);
    height: var(--wtk-size-hairline);
    clip-path: inset(50%);
    position: absolute;
    overflow: hidden;
  }

  @media (width <= 48em) {
    .wtk-footer {
      margin-top: var(--wtk-layout-mobile-page-gap);
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .wtk-footer, .wtk-footer-credit {
      transition: none;
    }
  }

  .wtk-page {
    min-height: 100dvh;
    padding: var(--wtk-layout-desktop-content-gap) var(--wtk-layout-desktop-content-gap) var(--wtk-layout-footer-gap);
    padding-top: calc(var(--wtk-layout-desktop-content-gap) + env(safe-area-inset-top));
    padding-left: calc(var(--wtk-layout-desktop-content-gap) + env(safe-area-inset-left));
    padding-right: calc(var(--wtk-layout-desktop-content-gap) + env(safe-area-inset-right));
    padding-bottom: calc(var(--wtk-layout-footer-gap) + env(safe-area-inset-bottom));
    flex-direction: column;
    display: flex;
  }

  .wtk-container {
    width: min(100%, var(--wtk-layout-nav-width));
    flex-direction: column;
    flex: 1;
    margin: 0 auto;
    display: flex;
  }

  [data-wtk-width="content"] .wtk-container {
    width: min(100%, var(--wtk-layout-content-width));
  }

  .wtk-main {
    width: min(100%, var(--wtk-layout-content-width));
    margin: var(--wtk-layout-desktop-content-gap) auto 0;
    flex: 1;
  }

  .wtk-page[data-wtk-main-width="nav"] .wtk-main {
    width: min(100%, var(--wtk-layout-nav-width));
  }

  @media (width <= 48em) {
    .wtk-page {
      padding: var(--wtk-layout-mobile-page-gap);
      padding-top: calc(var(--wtk-layout-mobile-page-gap) + env(safe-area-inset-top));
      padding-left: calc(var(--wtk-layout-mobile-page-gap) + env(safe-area-inset-left));
      padding-right: calc(var(--wtk-layout-mobile-page-gap) + env(safe-area-inset-right));
      padding-bottom: calc(var(--wtk-layout-mobile-page-gap) + env(safe-area-inset-bottom));
    }

    .wtk-main {
      margin-top: var(--wtk-layout-mobile-page-gap);
    }
  }

  .wtk-settings {
    flex: none;
    line-height: 1;
    position: static;
  }

  .wtk-settings-button {
    width: var(--wtk-size-control);
    height: var(--wtk-size-control);
    border: var(--wtk-size-hairline) solid transparent;
    border-radius: var(--wtk-radius-pill);
    color: var(--wtk-color-page-muted);
    cursor: pointer;
    transition: color var(--wtk-motion-control) ease,
      transform var(--wtk-motion-control) ease;
    background: none;
    justify-content: center;
    align-items: center;
    margin: 0;
    padding: 0;
    display: inline-flex;
  }

  .wtk-settings-icon {
    width: var(--wtk-size-icon);
    height: var(--wtk-size-icon);
    fill: currentColor;
    pointer-events: none;
    transition: color var(--wtk-motion-control) ease,
      transform var(--wtk-motion-control) ease;
    display: block;
  }

  .wtk-settings .wtk-settings-button[aria-expanded="true"] {
    color: var(--wtk-color-accent);
  }

  .wtk-settings-button[aria-expanded="true"] .wtk-settings-icon {
    transform: scale(1.08);
  }

  @media (hover: hover) and (pointer: fine) {
    .wtk-settings-button:hover {
      color: color-mix(in srgb, var(--wtk-color-accent) 76%, transparent);
    }

    .wtk-settings-button:hover .wtk-settings-icon {
      transform: scale(1.08);
    }
  }

  .wtk-settings-button:active {
    transform: scale(.96);
  }

  .wtk-settings-panel {
    inset: auto;
    top: var(--wtk-settings-top, auto);
    left: var(--wtk-settings-left, auto);
    z-index: 30;
    width: var(--wtk-settings-width, min(var(--wtk-layout-settings-panel-width), calc(100vw - (2 * var(--wtk-layout-panel-margin)) - env(safe-area-inset-left) - env(safe-area-inset-right))));
    max-height: var(--wtk-settings-max-height, calc(100dvh - (2 * var(--wtk-layout-panel-margin)) - var(--wtk-layout-desktop-topbar-height) - env(safe-area-inset-top) - env(safe-area-inset-bottom)));
    overscroll-behavior: contain;
    border: var(--wtk-size-hairline) solid var(--wtk-color-glass-border);
    border-radius: calc(var(--wtk-radius-panel) * var(--wtk-shape-corner-scale, 1));
    corner-shape: var(--wtk-shape-corner);
    padding: var(--wtk-space-8);
    background: var(--wtk-color-glass-solid);
    box-shadow: var(--wtk-glass-shadow-panel);
    color: var(--wtk-color-page-text);
    transform-origin: 100% 0;
    transition: background-color var(--wtk-motion-surface) ease,
      border-color var(--wtk-motion-surface) ease,
      box-shadow var(--wtk-motion-surface) ease,
      color var(--wtk-motion-surface) ease;
    margin: 0;
    font-family: inherit;
    position: fixed;
    overflow: auto;
  }

  [data-wtk-popover="fallback"] .wtk-settings-panel:not(.is-open) {
    display: none;
  }

  :is(.wtk-settings-panel:popover-open, .wtk-settings-panel.is-open) {
    opacity: 1;
    transition: background-color var(--wtk-motion-surface) ease,
      border-color var(--wtk-motion-surface) ease,
      box-shadow var(--wtk-motion-surface) ease,
      color var(--wtk-motion-surface) ease,
      opacity var(--wtk-motion-panel) var(--wtk-motion-ease-emphasised),
      transform var(--wtk-motion-panel) var(--wtk-motion-ease-emphasised),
      display var(--wtk-motion-panel) allow-discrete,
      overlay var(--wtk-motion-panel) allow-discrete;
    transform: translateY(0) scale(1);
  }

  @starting-style {
    :is(.wtk-settings-panel:popover-open, .wtk-settings-panel.is-open) {
      opacity: 0;
      transform: translateY(var(--wtk-motion-panel-translate)) scale(.985);
    }
  }

  .wtk-settings-section {
    margin: 0;
  }

  .wtk-segmented {
    gap: var(--wtk-space-2);
    border: var(--wtk-size-hairline) solid var(--wtk-color-page-rule);
    border-radius: calc(var(--wtk-radius-segmented) * var(--wtk-shape-corner-scale, 1));
    corner-shape: var(--wtk-shape-corner);
    padding: var(--wtk-space-2);
    background: var(--wtk-color-glass-segmented-bg);
    transition: background-color var(--wtk-motion-surface) ease,
      border-color var(--wtk-motion-surface) ease;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    display: grid;
  }

  .wtk-segmented button, .wtk-tint {
    border: var(--wtk-size-hairline) solid transparent;
    border-radius: var(--wtk-radius-segmented-item);
    color: var(--wtk-color-page-muted);
    cursor: pointer;
    font: inherit;
    font-size: var(--wtk-type-control);
    font-weight: var(--wtk-type-weight-control);
    transition: background-color var(--wtk-motion-control) ease,
      border-color var(--wtk-motion-control) ease,
      color var(--wtk-motion-control) ease,
      transform var(--wtk-motion-control) ease;
    background: none;
    margin: 0;
    line-height: 1;
    position: relative;
  }

  .wtk-segmented button {
    justify-content: center;
    align-items: center;
    gap: var(--wtk-space-text-xs);
    min-height: var(--wtk-size-control-row);
    padding: 0 var(--wtk-space-5);
    border-radius: calc(var(--wtk-radius-segmented-item) * var(--wtk-shape-corner-scale, 1));
    corner-shape: var(--wtk-shape-corner);
    display: inline-flex;
  }

  .wtk-segmented button:focus-visible, .wtk-segmented button.is-previewing, .wtk-tint:focus-visible, .wtk-tint.is-previewing {
    color: var(--wtk-color-page-title);
  }

  @media (hover: hover) and (pointer: fine) {
    .wtk-segmented button:hover, .wtk-tint:hover {
      color: var(--wtk-color-page-title);
    }
  }

  .wtk-segmented button[aria-checked="true"], .wtk-tint[aria-checked="true"] {
    border-color: var(--wtk-color-settings-active-border);
    background: var(--wtk-color-settings-active-bg);
    color: var(--wtk-color-page-title);
  }

  .wtk-segmented button:active, .wtk-tint:active {
    transform: scale(.98);
  }

  .wtk-tints {
    align-items: center;
    gap: var(--wtk-space-3);
    border-top: var(--wtk-size-hairline) solid var(--wtk-color-page-rule);
    margin-top: var(--wtk-space-text-md);
    padding-top: var(--wtk-space-text-md);
    flex-wrap: wrap;
    display: flex;
  }

  [data-wtk-scheme-control="tint-only"] .wtk-tints {
    border-top: 0;
    margin-top: 0;
    padding-top: 0;
  }

  .wtk-tint {
    width: var(--wtk-size-control-compact);
    min-height: var(--wtk-size-control-compact);
    border-radius: var(--wtk-radius-pill);
    flex: none;
    justify-content: center;
    align-items: center;
    padding: 0;
    display: flex;
  }

  .wtk-swatch {
    width: var(--wtk-size-swatch);
    height: var(--wtk-size-swatch);
    border: var(--wtk-size-hairline) solid var(--wtk-color-glass-swatch-border);
    border-radius: var(--wtk-radius-pill);
    background: var(--wtk-swatch-color, var(--wtk-color-accent));
    box-shadow: var(--wtk-shadow-swatch);
  }

  .wtk-tint[data-wtk-tint-option="pink"] .wtk-swatch {
    --wtk-swatch-color: var(--wtk-color-tint-pink);
  }

  .wtk-tint[data-wtk-tint-option="grey"] .wtk-swatch {
    --wtk-swatch-color: var(--wtk-color-tint-grey);
  }

  .wtk-tint[data-wtk-tint-option="red"] .wtk-swatch {
    --wtk-swatch-color: var(--wtk-color-tint-red);
  }

  .wtk-tint[data-wtk-tint-option="green"] .wtk-swatch {
    --wtk-swatch-color: var(--wtk-color-tint-green);
  }

  .wtk-tint[data-wtk-tint-option="blue"] .wtk-swatch {
    --wtk-swatch-color: var(--wtk-color-tint-blue);
  }

  .wtk-tint[data-wtk-tint-option="orange"] .wtk-swatch {
    --wtk-swatch-color: var(--wtk-color-tint-orange);
  }

  .wtk-tint[data-wtk-tint-option="purple"] .wtk-swatch {
    --wtk-swatch-color: var(--wtk-color-tint-purple);
  }

  .wtk-tint[data-wtk-tint-option="yellow"] .wtk-swatch {
    --wtk-swatch-color: var(--wtk-color-tint-yellow);
  }

  .wtk-settings-noscript {
    color: var(--wtk-color-page-muted);
    font-size: var(--wtk-type-note);
    margin: 0;
  }

  @media (width <= 48em) {
    .wtk-settings-button {
      width: var(--wtk-size-control-compact);
      height: var(--wtk-size-control-compact);
    }

    .wtk-settings-panel {
      width: var(--wtk-settings-width, min(var(--wtk-layout-settings-panel-width), calc(100vw - (2 * var(--wtk-layout-mobile-page-gap)) - env(safe-area-inset-left) - env(safe-area-inset-right))));
      max-height: var(--wtk-settings-max-height, calc(100dvh - (2 * var(--wtk-layout-panel-margin)) - var(--wtk-layout-mobile-topbar-height) - env(safe-area-inset-top) - env(safe-area-inset-bottom)));
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .wtk-settings-button, .wtk-settings-icon, .wtk-settings-panel, .wtk-settings-panel.is-open, .wtk-segmented, .wtk-segmented button, .wtk-tint {
      transition: none;
    }

    .wtk-settings-panel:popover-open {
      transition: none;
    }
  }

  .wtk-topbar {
    top: var(--wtk-layout-desktop-topbar-top);
    z-index: 10;
    align-items: center;
    gap: var(--wtk-layout-gear-nav-gap);
    min-height: var(--wtk-layout-desktop-topbar-height);
    width: calc(100% + (var(--wtk-layout-topbar-bleed) * 2));
    margin-left: calc(var(--wtk-layout-topbar-bleed) * -1);
    margin-right: calc(var(--wtk-layout-topbar-bleed) * -1);
    padding: var(--wtk-space-4) calc(var(--wtk-layout-gear-edge-gap) - var(--wtk-size-hairline)) var(--wtk-space-4) var(--wtk-layout-desktop-content-gap);
    border: var(--wtk-size-hairline) solid var(--wtk-color-glass-border);
    border-radius: calc(var(--wtk-radius-topbar) * var(--wtk-shape-corner-scale, 1));
    corner-shape: var(--wtk-shape-corner);
    background: var(--wtk-color-glass-topbar-background);
    backdrop-filter: var(--wtk-glass-filter-topbar);
    box-shadow: var(--wtk-glass-shadow-topbar);
    transition: background-color var(--wtk-motion-surface) ease,
      border-color var(--wtk-motion-surface) ease,
      box-shadow var(--wtk-motion-surface) ease;
    justify-content: space-between;
    display: flex;
    position: sticky;
  }

  .wtk-brand {
    font-size: var(--wtk-type-brand);
    font-weight: var(--wtk-type-weight-brand);
    white-space: nowrap;
    transition: color var(--wtk-motion-surface) ease,
      border-color var(--wtk-motion-surface) ease;
    flex: none;
    line-height: 1;
    color: var(--wtk-color-page-title) !important;
  }

  .wtk-brand:hover, .wtk-brand:focus {
    color: var(--wtk-color-page-title);
    text-decoration: none;
  }

  .wtk-topbar-links {
    gap: calc(var(--wtk-space-6) + var(--wtk-layout-gear-nav-gap));
    margin: 0 var(--wtk-space-6) 0 auto;
    padding: 0;
    list-style: none;
    display: flex;
  }

  .wtk-topbar-link {
    font-size: var(--wtk-type-nav-link);
    font-weight: var(--wtk-type-weight-link);
    text-decoration: none;
    display: block;
    color: var(--wtk-color-page-title) !important;
  }

  .wtk-topbar-link:hover, .wtk-topbar-link:focus {
    text-decoration: none;
  }

  a.wtk-topbar-link:hover, a.wtk-topbar-link:focus {
    color: var(--wtk-color-accent) !important;
  }

  .wtk-topbar-link[aria-current="page"] {
    cursor: default;
  }

  .wtk-page .wtk-topbar {
    top: calc(var(--wtk-layout-desktop-topbar-top) + env(safe-area-inset-top));
  }

  @media (width <= 48em) {
    .wtk-topbar {
      top: var(--wtk-layout-mobile-topbar-top);
      min-height: var(--wtk-layout-mobile-topbar-height);
      padding: var(--wtk-space-3) var(--wtk-space-text-md);
      gap: var(--wtk-space-5);
    }

    .wtk-topbar-links {
      gap: calc(var(--wtk-space-6) + var(--wtk-space-5));
    }

    .wtk-page .wtk-topbar {
      top: calc(var(--wtk-layout-mobile-topbar-top) + env(safe-area-inset-top));
    }

    .wtk-brand {
      font-size: var(--wtk-type-brand-compact);
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .wtk-topbar, .wtk-brand {
      transition: none;
    }
  }
}

@layer wtk.content;
@layer wtk.tokens, wtk.base, wtk.chrome;

@layer wtk.content {
  :root {
    --wtk-contents-top: var(--wtk-layout-desktop-contents-top);
    --wtk-contents-gap: var(--wtk-layout-desktop-content-gap);
  }

  :root:has(.wtk-app-header) {
    --wtk-contents-top: var(--wtk-layout-app-desktop-contents-top);
    --wtk-contents-gap: var(--wtk-layout-app-desktop-gutter);
  }

  .wtk-contents {
    display: contents;
  }

  [data-wtk-contents-layout] {
    width: min(100%, calc(var(--wtk-layout-content-width) + var(--wtk-layout-contents-width) + var(--wtk-contents-gap)));
    grid-template-columns: minmax(var(--wtk-layout-contents-min-width), var(--wtk-layout-contents-width)) minmax(0, var(--wtk-layout-content-width));
    justify-content: center;
    align-items: start;
    gap: var(--wtk-contents-gap);
    display: grid;
  }

  [data-wtk-contents-content] {
    margin-bottom: var(--wtk-contents-end-padding, 0);
    grid-column: 2;
  }

  [data-wtk-contents-target] {
    scroll-margin-top: var(--wtk-contents-top);
  }

  .wtk-contents-rail, .wtk-contents-mobile {
    color: var(--wtk-color-page-muted);
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

  .wtk-contents :is(.wtk-contents-rail, .wtk-contents-mobile) {
    transition: background-color var(--wtk-motion-surface) ease,
      border-color var(--wtk-motion-surface) ease,
      box-shadow var(--wtk-motion-surface) ease,
      color var(--wtk-motion-surface) ease;
  }

  .wtk-contents-rail::-webkit-scrollbar {
    display: none;
  }

  .wtk-contents-list::-webkit-scrollbar {
    display: none;
  }

  .wtk-contents-rail {
    top: var(--wtk-contents-top);
    max-height: calc(100vh - var(--wtk-contents-top) - var(--wtk-contents-gap));
    max-height: calc(100dvh - var(--wtk-contents-top) - var(--wtk-contents-gap));
    padding: var(--wtk-space-contents-rail);
    grid-area: 1 / 1;
    position: sticky;
    overflow: auto;
  }

  .wtk-contents-rail:has(.wtk-contents-list) {
    padding-bottom: var(--wtk-space-contents-rail-end);
  }

  [data-wtk-contents-kind="index"] .wtk-contents-rail {
    padding-top: var(--wtk-space-contents-index-block);
    padding-bottom: var(--wtk-space-contents-index-block);
  }

  .wtk-contents-eyebrow {
    margin-bottom: var(--wtk-space-contents-eyebrow-after);
    color: var(--wtk-color-page-muted);
    font-size: var(--wtk-type-contents-eyebrow);
    font-weight: var(--wtk-type-contents-eyebrow-weight);
    line-height: var(--wtk-type-contents-eyebrow-line-height);
  }

  .wtk-contents-eyebrow a {
    font-weight: var(--wtk-type-contents-eyebrow-weight);
    color: var(--wtk-color-page-muted) !important;
  }

  .wtk-contents-eyebrow a:hover, .wtk-contents-eyebrow a:focus {
    color: var(--wtk-color-page-title) !important;
  }

  .wtk-contents-eyebrow-separator {
    margin: 0 var(--wtk-space-contents-eyebrow-separator);
    opacity: var(--wtk-type-contents-eyebrow-separator-opacity);
  }

  .wtk-contents-header h2 {
    color: var(--wtk-color-page-title);
    font-size: var(--wtk-type-contents-title);
    line-height: var(--wtk-type-contents-title-line-height);
    overflow-wrap: anywhere;
    margin: 0;
  }

  .wtk-contents-header time {
    margin-top: var(--wtk-space-contents-time);
    color: var(--wtk-color-page-muted);
    font-size: var(--wtk-type-contents-date);
    font-weight: var(--wtk-type-contents-date-weight);
    line-height: var(--wtk-type-contents-date-line-height);
    display: block;
  }

  .wtk-contents-header h2, .wtk-contents-header time, .wtk-contents-summary {
    transition: color var(--wtk-motion-surface) ease,
      border-color var(--wtk-motion-surface) ease;
  }

  .wtk-contents-divider {
    border: none;
    border-top: var(--wtk-size-hairline) solid var(--wtk-color-page-rule);
    height: 0;
    margin: var(--wtk-space-contents-divider-before) calc(var(--wtk-space-contents-divider-bleed) * -1) var(--wtk-space-contents-divider-after);
  }

  .wtk-contents-divider[data-wtk-contents-divider="actions"] {
    margin-top: var(--wtk-space-contents-divider-after);
  }

  .wtk-contents-mobile {
    display: none;
  }

  .wtk-contents-summary {
    color: var(--wtk-color-page-title);
    font-size: var(--wtk-type-contents-summary);
    font-weight: var(--wtk-type-contents-summary-weight);
    line-height: var(--wtk-type-contents-summary-line-height);
    cursor: pointer;
    list-style: none;
  }

  .wtk-contents-summary::-webkit-details-marker {
    display: none;
  }

  .wtk-contents-list {
    gap: var(--wtk-space-contents-list-gap);
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
  }

  .wtk-contents-item {
    border: var(--wtk-size-hairline) solid transparent;
    border-radius: calc(var(--wtk-radius-contents-item) * var(--wtk-shape-corner-scale, 1));
    corner-shape: var(--wtk-shape-corner);
    margin-left: calc(var(--wtk-space-contents-item-bleed) * -1);
    margin-right: calc(var(--wtk-space-contents-item-bleed) * -1);
    transition: background-color var(--wtk-motion-surface) ease,
      border-color var(--wtk-motion-surface) ease,
      box-shadow var(--wtk-motion-surface) ease;
    -webkit-tap-highlight-color: transparent;
    position: relative;
  }

  .wtk-contents-list[data-wtk-contents-min-level="2"] .wtk-contents-item[data-wtk-contents-level="3"] {
    padding-left: var(--wtk-space-contents-level-indent);
  }

  .wtk-contents-link {
    font-size: var(--wtk-type-contents-link);
    font-weight: var(--wtk-type-contents-link-weight);
    line-height: var(--wtk-type-contents-link-line-height);
    padding: var(--wtk-space-contents-link);
    transition: color var(--wtk-motion-surface) ease,
      font-weight var(--wtk-motion-surface) ease;
    display: block;
    color: var(--wtk-color-page-muted) !important;
  }

  .wtk-contents-link:hover, .wtk-contents-link:focus {
    text-decoration: none;
    color: var(--wtk-color-accent, currentColor) !important;
  }

  .wtk-contents-link-text {
    display: block;
  }

  .wtk-contents-link-date {
    font-size: var(--wtk-type-contents-index-date);
    font-weight: var(--wtk-type-contents-index-date-weight);
    opacity: var(--wtk-type-contents-index-date-opacity);
    margin-top: var(--wtk-space-contents-date);
    display: block;
  }

  .wtk-contents-link[aria-current="location"] {
    font-weight: var(--wtk-type-contents-link-weight-current);
    color: var(--wtk-color-page-title) !important;
  }

  .wtk-contents-item:has( > [aria-current="location"]) {
    border-color: var(--wtk-color-contents-active-border);
    background: var(--wtk-color-contents-active-bg);
  }

  @media (width <= 48em) {
    :root {
      --wtk-contents-top: var(--wtk-layout-mobile-contents-top);
    }

    :root:has(.wtk-app-header) {
      --wtk-contents-top: var(--wtk-layout-app-mobile-contents-top);
    }

    :root:has([data-wtk-contents-mobile]) {
      --wtk-settings-bar-gap: var(--wtk-layout-mobile-contents-gap);
    }

    [data-wtk-contents-layout] {
      width: min(100%, var(--wtk-layout-content-width));
      padding-bottom: var(--wtk-contents-end-padding, 0);
      display: block;
    }

    [data-wtk-contents-content] {
      margin-bottom: 0;
    }

    [data-wtk-contents-target] {
      scroll-margin-top: calc(var(--wtk-contents-top) + var(--wtk-type-prose-anchor-offset-mobile-contents) + var(--wtk-layout-mobile-page-gap));
    }

    .wtk-contents-rail {
      display: none;
    }

    .wtk-contents-mobile {
      top: var(--wtk-contents-top);
      z-index: 9;
      width: calc(100% + (var(--wtk-layout-topbar-bleed) * 2));
      margin: calc(var(--wtk-layout-mobile-contents-gap) * -1) calc(var(--wtk-layout-topbar-bleed) * -1) var(--wtk-layout-mobile-page-gap);
      padding: var(--wtk-space-contents-bar-block) var(--wtk-space-contents-bar-inline);
      border: var(--wtk-size-hairline) solid var(--wtk-color-glass-border);
      border-radius: calc(var(--wtk-radius-glass-card) * var(--wtk-shape-corner-scale, 1));
      corner-shape: var(--wtk-shape-corner);
      background: var(--wtk-color-glass-topbar-background);
      backdrop-filter: var(--wtk-glass-filter-topbar);
      box-shadow: var(--wtk-glass-shadow-topbar);
      display: block;
      position: sticky;
      overflow: visible;
    }

    .wtk-contents-summary {
      justify-content: flex-start;
      align-items: center;
      gap: var(--wtk-space-contents-summary-gap);
      -webkit-tap-highlight-color: transparent;
      transition: color var(--wtk-motion-accent) ease,
        font-weight var(--wtk-motion-surface) ease;
      margin: 0;
      padding: 0;
      display: flex;
    }

    .wtk-contents-summary::marker {
      content: "";
    }

    .wtk-contents-mobile[open] .wtk-contents-summary {
      color: var(--wtk-color-page-title);
      font-weight: var(--wtk-type-contents-summary-weight);
    }

    .wtk-contents-summary-label {
      flex: auto;
      min-width: 0;
      display: grid;
    }

    .wtk-contents-summary-text {
      overflow-clip-margin: var(--wtk-space-contents-label-clip);
      white-space: nowrap;
      text-overflow: ellipsis;
      -webkit-text-size-adjust: 100%;
      -moz-text-size-adjust: 100%;
      text-size-adjust: 100%;
      min-width: 0;
      transition: opacity var(--wtk-motion-contents-summary) ease-in-out,
        filter var(--wtk-motion-contents-summary) ease-in-out;
      will-change: opacity, filter;
      grid-area: 1 / 1;
      overflow: clip;
    }

    .wtk-contents-summary-text[data-wtk-contents-summary-current] {
      opacity: 1;
      filter: blur();
    }

    .wtk-contents-summary-text[data-wtk-contents-summary-next], .wtk-contents-mobile[data-wtk-contents-summary-animating] [data-wtk-contents-summary-current] {
      opacity: 0;
      filter: blur(var(--wtk-motion-contents-summary-blur));
    }

    .wtk-contents-mobile[data-wtk-contents-summary-animating] [data-wtk-contents-summary-next] {
      opacity: 1;
      filter: blur();
    }

    [data-wtk-contents-summary="static"] .wtk-contents-summary-label {
      white-space: nowrap;
      text-overflow: ellipsis;
      display: block;
      overflow: clip;
    }

    [data-wtk-contents-summary="static"] .wtk-contents-summary-text {
      display: inline;
    }

    .wtk-contents-summary:before {
      content: "▶";
      font-family: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif;
      font-size: var(--wtk-type-contents-chevron);
      transform-origin: 50%;
      transition: transform var(--wtk-motion-surface) ease;
      line-height: 0;
      display: block;
    }

    .wtk-contents-mobile[open] .wtk-contents-summary:before {
      transform: rotate(90deg);
    }

    .wtk-contents-panel {
      left: 0;
      right: 0;
      top: calc(100% + var(--wtk-layout-mobile-page-gap));
      padding: var(--wtk-space-contents-panel-block) var(--wtk-space-contents-panel-inline) var(--wtk-space-contents-panel-block);
      border: var(--wtk-size-hairline) solid var(--wtk-color-glass-border);
      border-radius: var(--wtk-radius-glass-card);
      background: var(--wtk-color-glass-solid);
      max-height: 0;
      box-shadow: var(--wtk-glass-shadow-card);
      opacity: 0;
      pointer-events: none;
      transform: translateY(var(--wtk-space-contents-panel-offset));
      transition: max-height var(--wtk-motion-surface) ease,
        opacity var(--wtk-motion-contents-fade) ease,
        transform var(--wtk-motion-surface) ease,
        background-color var(--wtk-motion-surface) ease,
        border-color var(--wtk-motion-surface) ease,
        box-shadow var(--wtk-motion-surface) ease;
      scrollbar-width: none;
      will-change: max-height, opacity, transform;
      margin-top: 0;
      position: absolute;
      overflow: auto;
    }

    .wtk-contents-mobile[open] .wtk-contents-panel, .wtk-contents-mobile[data-wtk-contents-motion] .wtk-contents-panel {
      max-height: var(--wtk-layout-mobile-contents-max-height);
      opacity: 1;
      pointer-events: auto;
      transform: translateY(0);
    }

    @supports (max-height: 1dvh) {
      .wtk-contents-mobile[open] .wtk-contents-panel, .wtk-contents-mobile[data-wtk-contents-motion] .wtk-contents-panel {
        max-height: var(--wtk-layout-mobile-contents-max-height-dynamic);
      }
    }

    .wtk-contents-mobile[data-wtk-contents-motion="closing"] .wtk-contents-panel {
      pointer-events: none;
    }

    .wtk-contents-mobile[data-wtk-contents-motion] .wtk-contents-panel {
      overflow: hidden;
    }

    .wtk-contents-panel .wtk-contents-divider[data-wtk-contents-divider="actions"] {
      margin: var(--wtk-space-contents-divider-mobile) 0 var(--wtk-space-contents-divider-mobile);
    }
  }

  @supports not (backdrop-filter: blur(1px)) {
    .wtk-contents-mobile {
      background: var(--wtk-color-glass-solid);
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .wtk-contents :is(.wtk-contents-rail, .wtk-contents-mobile), .wtk-contents-mobile *, .wtk-contents-mobile :before, .wtk-contents-rail * {
      transition: none;
    }
  }

  .wtk-glass, .glassPane {
    border: var(--wtk-size-hairline) solid var(--wtk-color-glass-border);
    border-radius: calc(var(--wtk-radius-glass-card) * var(--wtk-shape-corner-scale, 1));
    corner-shape: var(--wtk-shape-corner);
    background: var(--wtk-color-glass-background);
    backdrop-filter: var(--wtk-glass-filter-card);
    box-shadow: var(--wtk-glass-shadow-card);
    transition: background-color var(--wtk-motion-surface) ease,
      border-color var(--wtk-motion-surface) ease,
      box-shadow var(--wtk-motion-surface) ease;
  }

  .wtk-glass[data-wtk-glass-size="document"], .glassPane[data-wtk-glass-size="document"] {
    border-radius: calc(var(--wtk-radius-glass-document) * var(--wtk-shape-corner-scale, 1));
  }

  .wtk-glass[data-wtk-glass-size="feature"], .glassPane[data-wtk-glass-size="feature"] {
    border-radius: calc(var(--wtk-radius-glass-feature) * var(--wtk-shape-corner-scale, 1));
  }

  .wtk-glass[data-wtk-glass-emphasis="soft"], .glassPane[data-wtk-glass-emphasis="soft"] {
    box-shadow: var(--wtk-glass-shadow-card-soft);
  }

  @supports not (backdrop-filter: blur(1px)) {
    .wtk-glass, .glassPane {
      background: var(--wtk-color-glass-solid);
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .wtk-glass, .glassPane {
      transition: none;
    }
  }

  :is(.wtk-prose, .markdownBody) {
    color: var(--wtk-color-page-text);
    font-family: var(--wtk-font-serif);
    font-size: var(--wtk-type-body);
    line-height: var(--wtk-type-line-height);
  }

  :is(.wtk-prose, .markdownBody) :is(h2, h3, h4, h5, h6) {
    color: var(--wtk-color-page-title);
    line-height: var(--wtk-type-prose-heading-line-height);
    margin: var(--wtk-type-prose-heading-space-before) 0 var(--wtk-type-prose-heading-space-after);
  }

  :is(.wtk-prose, .markdownBody) h2 {
    border-bottom: var(--wtk-size-hairline) solid var(--wtk-color-page-rule);
    font-size: var(--wtk-type-h2);
    padding-bottom: var(--wtk-type-prose-h2-rule-gap);
  }

  :is(.wtk-prose, .markdownBody) h3 {
    font-size: var(--wtk-type-h3);
  }

  :is(.wtk-prose, .markdownBody) :is(h2, h3)[id] {
    scroll-margin-top: var(--wtk-layout-desktop-contents-top);
  }

  :is(.wtk-prose, .markdownBody) :is(p, li) {
    color: var(--wtk-color-page-text);
    overflow-wrap: anywhere;
  }

  :is(.wtk-prose, .markdownBody) li p {
    margin: 0;
  }

  :is(.wtk-prose, .markdownBody) li p + p {
    margin-top: var(--wtk-type-prose-list-paragraph-gap);
  }

  :is(.wtk-prose, .markdownBody) :is(p, ul, ol, blockquote, pre, table) {
    margin: 0 0 var(--wtk-type-prose-block-space);
  }

  :is(.wtk-prose, .markdownBody) :is(ul, ol) {
    padding-left: var(--wtk-type-prose-list-indent);
  }

  :is(.wtk-prose, .markdownBody) blockquote {
    border-left: var(--wtk-type-prose-quote-rule) solid var(--wtk-color-page-rule);
    color: var(--wtk-color-page-muted);
    padding-left: var(--wtk-type-prose-quote-indent);
  }

  :is(.wtk-prose, .markdownBody) code {
    border-radius: var(--wtk-radius-prose-code);
    background: var(--wtk-color-page-code-bg);
    font-family: var(--wtk-font-mono);
    font-size: var(--wtk-type-prose-code-size);
    padding: var(--wtk-type-prose-code-padding-block) var(--wtk-type-prose-code-padding-inline);
  }

  :is(.wtk-prose, .markdownBody) pre {
    border-radius: var(--wtk-radius-prose-pre);
    background: var(--wtk-color-page-code-bg);
    padding: var(--wtk-type-prose-pre-padding);
    overflow-x: auto;
  }

  :is(.wtk-prose, .markdownBody) pre code {
    background: none;
    padding: 0;
  }

  :is(.wtk-prose, .markdownBody) img {
    border-radius: var(--wtk-radius-prose-image);
    width: 100%;
    max-width: 100%;
    height: auto;
    display: block;
  }

  :is(.wtk-prose, .markdownBody) audio {
    width: 100%;
    margin: var(--wtk-type-prose-block-space) 0;
    display: block;
  }

  :is(.wtk-prose, .markdownBody) hr {
    height: 0;
    margin: var(--wtk-type-prose-block-space) 0;
    border: none;
    border-top: var(--wtk-size-hairline) solid var(--wtk-color-page-rule);
  }

  :is(.wtk-prose, .markdownBody) :is(h2, h3, h4, h5, h6, p, li) {
    transition: color var(--wtk-motion-surface) ease,
      border-color var(--wtk-motion-surface) ease;
  }

  @media (width <= 48em) {
    :is(.wtk-prose, .markdownBody) :is(h2, h3)[id] {
      scroll-margin-top: calc(var(--wtk-layout-mobile-contents-top) + var(--wtk-type-prose-anchor-offset-mobile-contents) + var(--wtk-layout-mobile-page-gap));
    }

    :is(.wtk-prose, .markdownBody) :is(p, ul, ol, blockquote, pre, table) {
      margin: 0 0 var(--wtk-type-prose-block-space-compact);
    }

    :is(.wtk-prose, .markdownBody) :is(audio, hr) {
      margin: var(--wtk-type-prose-block-space-compact) 0;
    }
  }

  :is(.wtk-fade-image, .fadeImage) {
    transition: opacity var(--wtk-motion-image-reveal) ease-in;
  }

  :is(.wtk-fade-image, .fadeImage)[data-wtk-fade-image="pending"] {
    opacity: 0;
  }

  @media (prefers-reduced-motion: reduce) {
    :is(.wtk-prose, .markdownBody) :is(h2, h3, h4, h5, h6, p, li), :is(.wtk-fade-image, .fadeImage) {
      transition: none;
    }
  }
}
