/* ul-css compatibility sheet, generated by scripts/dist.py. Inert where light-dark() is supported. */
/* The site's sheet re-rooted under .site-shell (scripts/shell.py); edit src/, not this file. */
@layer tokens, reset, typography, layout, components, themes, site;
@supports not (color: light-dark(#000, #fff)) {
  @layer tokens {
    :root { --color-text: #1d1d1f; --color-text-secondary: #6e6e73; --color-text-tertiary: #86868b; --color-bg: #ffffff; --color-bg-alt: #f5f5f7; --color-fill-tertiary: #e8e8ed; --color-code-bg: #f5f5f7; --color-link: #0066cc; --color-accent-fill: var(--color-accent); --color-accent-fill-hover: var(--color-accent-hover); --color-accent-fill-active: var(--color-accent-active); --color-separator: #d2d2d7; --color-hairline: rgba(0, 0, 0, 0.16); --color-selection: #b3d7ff; --color-success: #008009; --color-error: #e30000; --color-error-bg: #fff2f4; --color-warning: #bf4800; --color-warning-bg: #fff9f4; --color-caution: #9e6700; --color-caution-bg: #fffbf2; --color-tip: #3d777d; --color-tip-bg: #faffff; --color-experiment: #8c28c2; --color-experiment-bg: #fcf8ff; --nav-bg: rgba(250, 250, 252, 0.8); --app-nav-bg: #f1f1f1; --field-bg: rgba(255, 255, 255, 0.8); --field-border: #86868b; --field-focus-halo: #c1dffe; --field-error-bg: #fdeced; --field-error-border: #de071c; --btn-disabled-bg: #d1d1d6; --btn-disabled-text: #ffffff; --toggle-off: #86868b; --row-hover: color-mix(in srgb, var(--color-accent) 5%, transparent); --navigator-hover: color-mix(in srgb, var(--color-accent) 20%, transparent); --footer-bg: #f5f5f7; --footer-text: rgba(0, 0, 0, 0.56); --footer-link: rgba(0, 0, 0, 0.72); --footer-title: rgba(0, 0, 0, 0.88); --footer-pipe: rgba(0, 0, 0, 0.48); --note-bg: #f5f5f7; --note-border: #696969; --badge-bg: rgba(29, 29, 31, 0.07); --badge-text: #424245; }
  }
  @layer components {
    :where(.site-shell) .btn-neutral { --btn-bg-hover: #272729; --btn-bg-active: #18181a; }
  }
  @layer components {
    :where(.site-shell) .media-placeholder { background: linear-gradient(135deg, #dbe4ee 0%, #c3d0e0 50%, #aebfd4 100%); }
  }
  @layer themes {
    :where(.site-shell) .accent-indigo, :where(.site-shell) .accent-green, :where(.site-shell) .accent-orange, :where(.site-shell) .accent-purple { --color-text-secondary: color-mix(in oklch, var(--color-accent) var(--accent-tint), #6e6e73); --color-text-tertiary: color-mix(in oklch, var(--color-accent) var(--accent-tint), #86868b); --color-separator: color-mix(in oklch, var(--color-accent) var(--accent-tint), #d2d2d7); --field-border: color-mix(in oklch, var(--color-accent) var(--accent-tint), #86868b); --color-fill-tertiary: color-mix(in oklch, var(--color-accent) var(--accent-tint-surface), #e8e8ed); --color-bg-alt: color-mix(in oklch, var(--color-accent) var(--accent-tint-surface), #f5f5f7); --note-bg: color-mix(in oklch, var(--color-accent) var(--accent-tint-surface), #f5f5f7); --footer-bg: color-mix(in oklch, var(--color-accent) var(--accent-tint-surface), #f5f5f7); --app-nav-bg: color-mix(in oklch, var(--color-accent) var(--accent-tint-surface), #f1f1f1); }
    :where(.site-shell) .accent-indigo { --color-accent: #5856d6; --color-link: #4f4dc2; --color-accent-fill: #5856d6; --color-accent-fill-hover: #5856d6; --color-accent-fill-active: #5856d6; }
    :where(.site-shell) .accent-green { --color-accent: #1f8f45; --color-link: #1b7a3c; --color-accent-fill: #1f8f45; --color-accent-fill-hover: #1f8f45; --color-accent-fill-active: #1f8f45; }
    :where(.site-shell) .accent-orange { --color-accent: #f56300; --color-link: #bf4800; --color-accent-fill: #f56300; --color-accent-fill-hover: #f56300; --color-accent-fill-active: #f56300; }
    :where(.site-shell) .accent-purple { --color-accent: #6d2bff; --color-link: #5b1fe6; --color-accent-fill: #6d2bff; --color-accent-fill-hover: #6d2bff; --color-accent-fill-active: #6d2bff; }
    :where(.site-shell) .accent-graphite { --color-accent-hover: #272729; --color-accent-active: #18181a; }
    :where(.site-shell) .frosted-light { --frost-veil: rgba(255, 255, 255, 0.22); --frost-edge: rgba(255, 255, 255, 0.35); --color-text-secondary: #6e6e73; box-shadow: inset 0 0 0 1px var(--frost-edge), inset 0 1px 0 rgba(255, 255, 255, 0.5), inset 0 0 24px rgba(255, 255, 255, 0.12); }
    :where(.site-shell) .tint-accent { background: color-mix(in oklch, var(--color-accent) 8%, #fff); border-color: color-mix(in oklch, var(--color-accent) 45%, #fff); }
    :where(.site-shell) .wash-accent { background: radial-gradient(120% 70% at 50% 0%, color-mix(in oklch, var(--color-accent) 18%, #fff), transparent 70%), var(--color-bg); }
  }
  @layer site {
    :root { --color-bg: #ffffff; --color-bg-alt: #f5f5f9; --color-code-bg: #f5f5f9; --color-text: #1d1d1f; --color-text-secondary: #6e6e73; --color-text-tertiary: #86868b; --color-separator: #d9d9e3; --color-hairline: rgba(0, 0, 0, 0.16); --color-fill-tertiary: #ececf3; --field-border: #86868b; --field-bg: rgba(255, 255, 255, 0.8); --note-bg: #f5f5f9; --footer-bg: rgba(255, 255, 255, 0.5); --app-nav-bg: #f1f1f5; --surface-elevated: #ffffff; --overlay: rgba(0, 0, 0, 0.4); --color-accent: #6d2bff; --color-accent-hover: #7a3fff; --color-accent-active: #6227e6; --color-accent-contrast: #ffffff; --color-accent-fill: #6d2bff; --color-accent-fill-hover: #7a3fff; --color-accent-fill-active: #6227e6; --color-link: #5b1fe6; --color-selection: #e4d8ff; --field-focus-halo: rgba(var(--accent-rgb), 0.25); --row-hover: rgba(var(--accent-rgb), 0.05); --row-active: #ececf3; --navigator-hover: rgba(var(--accent-rgb), 0.16); --toggle-off: #86868b; --toggle-on: #6d2bff; --btn-disabled-bg: #d1d1d6; --btn-disabled-text: #ffffff; --nav-bg: rgba(250, 250, 252, 0.8); --color-success: #0b9a5f; --color-error: #d9142b; --color-error-bg: #fff1f2; --color-warning: #c25e00; --color-warning-bg: #fff7f0; --color-caution: #9a6b00; --color-caution-bg: rgba(255, 241, 184, 0.62); --color-tip: #0e8aa8; --color-tip-bg: #f0fbff; --color-experiment: #8a2be2; --color-experiment-bg: #faf5ff; --field-error-bg: #fff1f2; --field-error-border: #d9142b; --pane-veil: rgba(255, 255, 255, 0.30); --pane-sub-veil: rgba(76, 58, 140, 0.05); }
  }
  @layer site {
    :where(.site-shell.has-backdrop) { background: radial-gradient(circle at 50% -373px, rgba(var(--accent-rgb), 0.07), transparent 934px), var(--color-bg); }
    :where(.site-shell) .light-bar { background: rgba(var(--accent-rgb), 0.18); box-shadow: 0px 0px 50px 5px rgba(var(--accent-rgb), 0.18); }
    :where(.site-shell:is(.page-blog, .page-blog-post, .page-pricing)) .light-bar { background: rgba(var(--accent-rgb), 0.18); box-shadow: 0px 0px 50px 5px rgba(var(--accent-rgb), 0.18); }
    :where(.site-shell) .backdrop.is-subtle { background: transparent; }
    :where(.site-shell) .backdrop span:nth-child(1) { --c: rgba(168, 60, 235, 0.30); }
    :where(.site-shell) .backdrop span:nth-child(2) { --c: rgba(64, 92, 228, 0.20); }
    :where(.site-shell) .backdrop span:nth-child(3) { --c: rgba(58, 120, 240, 0.26); }
    :where(.site-shell) .backdrop span:nth-child(4) { --c: rgba(60, 60, 220, 0.24); }
    :where(.site-shell) .backdrop span:nth-child(5) { --c: rgba(80, 200, 210, 0.16); }
  }
  @layer site {
    :where(.site-shell) .topbar { background: rgba(250, 250, 253, 0.72); border-bottom: 1px solid #d9d9e3; }
    :where(.site-shell) .topbar-docs { border-bottom-color: rgba(0, 0, 0, 0.08); }
    :where(.site-shell) .topbar-docs .topbar-inner { color: var(--color-text); }
    :where(.site-shell) .topbar-docs .topbar-links > li > a { color: var(--color-text); }
    :where(.site-shell) .topbar-docs .topbar-links > li > a:hover { background: rgba(var(--accent-rgb), 0.07); }
    :where(.site-shell) .topbar-docs .topbar-search { color: #6e6e73; }
    :where(.site-shell) .topbar-docs .topbar-drop.topbar-version > button { color: var(--color-text); }
    :where(.site-shell) .topbar-badge { color: #5b1fe6; background: rgba(var(--accent-rgb), 0.1); }
    :where(.site-shell) .topbar-panel, :where(.site-shell) .menu-panel { background-color: #ffffff; border: 1px solid rgba(0, 0, 0, 0.08); box-shadow: 0 3px 16px rgba(30, 20, 70, 0.16); }
    :where(.site-shell) .topbar-panel a:hover, :where(.site-shell) .topbar-panel button:hover, :where(.site-shell) .menu-panel a:hover, :where(.site-shell) .menu-panel button:hover { background: rgba(var(--accent-rgb), 0.08); box-shadow: none; }
    :where(.site-shell) .topbar-panel .docs-version-tag { color: #6e6e73; }
    :where(.site-shell) .topbar-search kbd { background: rgba(0, 0, 0, 0.05); }
    :where(.site-shell) .topbar-auth { color: #6d2bff; border-color: #6d2bff; background: rgba(var(--accent-rgb), 0.04); }
    :where(.site-shell) .topbar-auth:hover { color: #ffffff; border-color: #6d2bff; background: #6d2bff; }
    :where(.site-shell) .topbar-account:hover > .topbar-auth, :where(.site-shell) .topbar-account:focus-within > .topbar-auth { color: #6d2bff; border-color: #6d2bff; }
    @media (max-width: 899px) {
      :where(.site-shell) .topbar-menu-toggle:checked ~ .topbar:not(.topbar-docs)::before { background: rgba(250, 250, 253, 0.96); }
      :where(.site-shell) .topbar:not(.topbar-docs) .topbar-links > li > a { border-bottom: 1px solid rgba(0, 0, 0, 0.08); }
    }
  }
  @layer site {
    :where(.site-shell) :where(a:not(.btn, .btn-toolbar, .btn-icon-add, .btn-icon-more, .tabs a, .filter-list a, .guide-nav a, .toc a, .app-card-title, .toolbar-select)) { text-shadow: 0 0 7px transparent; }
    :where(.site-shell) .toggle input:checked + .toggle-track::after { background: #ffffff; }
    :where(.site-shell) .card:not(.login-card), :where(.site-shell) .account-nav, :where(.site-shell) .app-hero, :where(.site-shell) .price-card::before, :where(.site-shell) .login-card::before, :where(.site-shell) .frosted-sheet::before, :where(.site-shell) .home-panel::before { --frost-veil: rgba(255, 255, 255, 0.45); --frost-edge: rgba(255, 255, 255, 0.65); --frost-catch: rgba(255, 255, 255, 0.75); --frost-glow: rgba(255, 255, 255, 0.18); }
    :where(.site-shell) .filter-list a:hover, :where(.site-shell) .filter-list a.is-active { color: #5f1fe6; }
    :where(.site-shell) .filter-list a.is-active { background: rgba(var(--accent-list-rgb), 0.16); box-shadow: inset 0 0 0 1px rgba(var(--accent-list-rgb), 0.28), 0 0 18px rgba(var(--accent-list-rgb), 0.12); }
    :where(.site-shell) .filter-list a:not(.is-active):hover { background: rgba(var(--accent-list-rgb), 0.08); }
    :where(.site-shell) .filter-list button:hover { color: #5f1fe6; background: rgba(var(--accent-list-rgb), 0.08); }
    @media (max-width: 734px) {
      :where(.site-shell) .app-layout .filter-list a, :where(.site-shell) .app-layout .filter-list button { border: 1px solid rgba(0, 0, 0, 0.1); }
    }
    :where(.site-shell) .badge-success, :where(.site-shell) .badge-error, :where(.site-shell) .badge-warning, :where(.site-shell) .badge-tip, :where(.site-shell) .badge-accent { text-shadow: 0 0 6px transparent; }
    :where(.site-shell) .app-banner-warning { border-color: rgba(214, 170, 0, 0.4); }
    :where(.site-shell) .app-banner-warning .app-banner-icon { background: #f7c948; }
    :where(.site-shell) .app-band { background: rgba(0, 0, 0, 0.035); }
    :where(.site-shell) .section-alt { background: rgba(255, 255, 255, 0.25); border-top: 1px solid rgba(0, 0, 0, 0.06); border-bottom: 1px solid rgba(0, 0, 0, 0.06); }
    :where(.site-shell) .segmented { background: rgba(255, 255, 255, 0.72); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08); }
    :where(.site-shell) .choice-group span { background: rgba(255, 255, 255, 0.72); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08); }
    :where(.site-shell) .choice-multi span::before { box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.32); }
    :where(.site-shell) .modal { --color-text: #1d1d1f; --color-bg: #ffffff; --color-accent-contrast: #ffffff; --color-link: #5b1fe6; --color-accent: #6d2bff; --color-accent-fill: #6d2bff; --color-text-secondary: #6e6e73; --color-text-tertiary: #86868b; --color-separator: #d9d9e3; --color-hairline: rgba(0, 0, 0, 0.16); --field-border: #86868b; --field-bg: rgba(255, 255, 255, 0.8); --field-focus-halo: rgba(var(--accent-rgb), 0.25); --color-fill-tertiary: #ececf3; --color-code-bg: #f5f5f9; --row-hover: rgba(var(--accent-rgb), 0.05); --row-active: #ececf3; }
    :where(.site-shell) .frosted-sheet::before { --frost-veil: rgba(255, 255, 255, 0.55); }
    :where(.site-shell.id-page) .id-footer { border-top-color: rgba(0, 0, 0, 0.1); }
    :where(.site-shell) .login-card { --color-text-secondary: #6e6e73; }
    :where(.site-shell) .login-card .field-error { color: var(--color-error); }
    :where(.site-shell) .login-card::before { --frost-veil: rgba(255, 255, 255, 0.22); --frost-edge: rgba(255, 255, 255, 0.35); --frost-catch: rgba(255, 255, 255, 0.5); --frost-glow: rgba(255, 255, 255, 0.12); }
    :where(.site-shell) .btn-glass:not(.btn-secondary) { --btn-bg: var(--color-accent-fill); --btn-fg: var(--color-accent-contrast); --btn-bg-hover: var(--color-accent-fill-hover); --btn-bg-active: var(--color-accent-fill-active); --btn-border: transparent; box-shadow: inset 0 1px 0 transparent; }
    :where(.site-shell) .btn-glass:not(.btn-secondary):hover { --btn-border: transparent; box-shadow: inset 0 1px 0 transparent, 0 0 18px transparent; }
    :where(.site-shell) .btn-glass.btn-secondary { --btn-fg: var(--color-link); --btn-border: var(--color-link); --btn-bg-hover: var(--color-accent-fill-hover); --btn-bg-active: var(--color-accent-fill-active); }
    :where(.site-shell) .btn-glass.btn-secondary:hover { --btn-fg: var(--color-accent-contrast); --btn-border: transparent; box-shadow: 0 0 18px transparent; }
    :where(.site-shell) .login .input:focus, :where(.site-shell) .login .code-field input:focus { border-color: var(--color-accent); box-shadow: inset 0 0 0 1px var(--color-accent), 0 0 14px transparent; }
    :where(.site-shell) .login .field-floating > .input:focus ~ label { color: var(--color-text-secondary); }
    :where(.site-shell) .link-button { text-shadow: 0 0 7px transparent; }
    :where(.site-shell) .glyph-tile { background: rgba(var(--accent-rgb), 0.09); }
    :where(.site-shell) .app-hero .menu-panel { background-color: #ffffff; }
    :where(.site-shell) .avatar { color: var(--color-accent); background: rgba(var(--accent-rgb), 0.12); }
    :where(.site-shell) .btn-destructive { --btn-fg: #ffffff; --btn-bg-hover: color-mix(in srgb, var(--color-error) 86%, #000000); --btn-bg-active: color-mix(in srgb, var(--color-error) 76%, #000000); }
    :where(.site-shell) .app-link-row:hover { border-color: rgba(var(--accent-rgb), 0.35); }
    @media (min-width: 735px) {
      :where(.site-shell) .app-layout > section .app-section .menu-panel { background-color: #ffffff; }
    }
    @media (max-width: 734px) {
      :where(.site-shell) .app-layout > section .app-section .menu-panel { background-color: #ffffff; }
    }
    :where(.site-shell) .select-panel { background-color: #ffffff; border: 1px solid rgba(0, 0, 0, 0.08); box-shadow: 0 3px 16px rgba(30, 20, 70, 0.16); }
    :where(.site-shell) .select-option.is-active { background: rgba(var(--accent-rgb), 0.08); box-shadow: none; }
  }
  @layer site {
    :where(.site-shell.page-docs) { --color-text-secondary: #6e6e73; --color-text-tertiary: #86868b; }
    :where(.site-shell.page-docs) .guide-main { color: var(--color-text); }
    :where(.site-shell.page-docs) .guide-main :is(h1, h2, h3, h4, h5, h6), :where(.site-shell.page-docs) .guide-abstract { color: var(--color-text); }
    :where(.site-shell.page-docs) .docs-article a { color: var(--color-link); }
    :where(.site-shell.page-docs) .backdrop { background: transparent; }
    :where(.site-shell.page-docs) .backdrop span:nth-child(1) { --c: rgba(128, 72, 235, 0.30); }
    :where(.site-shell.page-docs) .backdrop span:nth-child(2) { --c: rgba(58, 100, 230, 0.20); }
    :where(.site-shell) .docs-shell::after { background: rgba(255, 255, 255, 0.72); }
    :where(.site-shell) .docs-navigator a, :where(.site-shell) .docs-navigator summary { color: var(--color-text-secondary); }
    :where(.site-shell) .docs-navigator .is-open > summary { color: var(--color-text); }
    :where(.site-shell) .docs-navigator a.is-active, :where(.site-shell) .docs-navigator a:hover, :where(.site-shell) .docs-navigator summary:hover { color: #5f1fe6; }
    :where(.site-shell) .docs-article :not(pre) > code { background: rgba(var(--accent-rgb), 0.07); color: #3b2a72; }
    :where(.site-shell) .docs-article th, :where(.site-shell) .docs-article td { border-color: var(--color-separator); }
    :where(.site-shell) .docs-article pre { background: #f5f5f9; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.06); }
    :where(.site-shell) .docs-article pre.phiki { color: #2f4153; }
    :where(.site-shell) .docs-article .phiki .token[style] { color: var(--phiki-light-color); }
    :where(.site-shell) .docs-tabs { background: #f5f5f9; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.06); }
    :where(.site-shell) .docs-toc .toc a { color: var(--color-text-secondary); }
    :where(.site-shell) .docs-toc .toc a:hover { color: var(--color-text); }
    :where(.site-shell) .docs-toc .toc a.is-active { color: var(--color-text); }
    @media (max-width: 1279px) {
      :where(.site-shell) .docs-toc-mobile { background: rgba(var(--accent-rgb), 0.05); }
    }
    @media (max-width: 1023px) {
      :where(.site-shell) .docs-drawer-sections { background: rgba(var(--accent-rgb), 0.06); }
    }
    :where(.site-shell) .docs-search-overlay { background: rgba(10, 11, 28, 0.35); }
  }
  @layer site {
    :where(.site-shell.page-download) .app-disclosure-body :is(dd, p) code { background: rgba(var(--accent-rgb), 0.07); }
    :where(.site-shell.page-checkout) .checkout-total { background: rgba(0, 0, 0, 0.03); }
    :where(.site-shell) .price-card { --frost-veil: rgba(255, 255, 255, 0.45); --frost-edge: rgba(255, 255, 255, 0.65); }
    :where(.site-shell) .price-card::before { --frost-veil: rgba(255, 255, 255, 0.45); --frost-edge: rgba(255, 255, 255, 0.65); --frost-catch: rgba(255, 255, 255, 0.75); --frost-glow: rgba(255, 255, 255, 0.18); }
    :where(.site-shell) .price-card.is-featured::before { --frost-veil: rgba(255, 255, 255, 0.62); box-shadow: inset 0 0 0 1px var(--color-accent), inset 0 1px 0 rgba(255, 255, 255, 0.75), inset 0 0 32px rgba(255, 255, 255, 0.22), 0 0 40px rgba(var(--accent-rgb), 0.16); }
    :where(.site-shell) .price-perk-icon { background: rgba(var(--accent-rgb), 0.09); box-shadow: inset 0 0 0 1px rgba(var(--accent-rgb), 0.16); }
    :where(.site-shell.page-pricing) { --color-text-tertiary: #86868b; }
    :where(.site-shell.page-pricing) .footnotes { color: #5c5c63; }
    :where(.site-shell) .compare .is-featured { background: rgba(255, 255, 255, 0.35); }
    :where(.site-shell) .compare tbody td.is-featured { color: #3a3a46; }
    :where(.site-shell.page-blog), :where(.site-shell.page-blog-post) { --color-text-secondary: #6f6987; --color-separator: #d9d9e3; }
    :where(.site-shell) .blog-head h1, :where(.site-shell) .blog-lede { color: rgb(12 12 12 / 20%); }
    :where(.site-shell) .blog-head h1::before, :where(.site-shell) .blog-lede::before { color: #606060; }
    :where(.site-shell.page-blog-post) :is(.article-body, .article-subhead) { color: var(--color-text); }
    :where(.site-shell.page-blog-post) .article-body :not(pre) > code { background: rgb(117 105 171 / 8%); color: #321e7d; }
    :where(.site-shell.page-blog-post) .article-body pre { background: #f5f5f9; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.06); }
    :where(.site-shell) .sales-link { text-shadow: 0 0 7px transparent; }
  }
  @layer site {
    :where(.site-shell) .btn-aurora { --btn-fg: #ffffff; --btn-bg: linear-gradient(100deg, #4a6ff0, #6d2bff 52%, #a63fe2); --btn-bg-hover: linear-gradient(100deg, #5a80ff, #7a3fff 52%, #b552f0); --btn-ring: linear-gradient(100deg, rgba(255, 255, 255, 0.35), rgba(255, 255, 255, 0.2) 52%, rgba(255, 255, 255, 0.35)); box-shadow: 0 8px 28px -8px rgba(92, 45, 230, 0.55), 0 0 22px transparent, inset 0 1px 0 rgba(255, 255, 255, 0.28); text-shadow: 0 0 10px transparent; }
    :where(.site-shell) .btn-aurora:hover { box-shadow: 0 10px 34px -8px rgba(92, 45, 230, 0.7), 0 0 34px rgba(140, 90, 255, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.35); }
  }
  @media (prefers-color-scheme: dark) {
    @layer tokens {
      html:not(.theme-light) { --color-text: #f5f5f7; --color-text-secondary: #86868b; --color-text-tertiary: #6e6e73; --color-bg: #000000; --color-bg-alt: #1d1d1f; --color-fill-tertiary: #333336; --color-code-bg: #333336; --color-link: #2997ff; --color-accent-fill: #005bdf; --color-accent-fill-hover: #0064e9; --color-accent-fill-active: #0051d5; --color-separator: #424245; --color-hairline: rgba(255, 255, 255, 0.24); --color-selection: #3f638b; --color-success: #03a10e; --color-error: #ff3037; --color-error-bg: #330000; --color-warning: #f56300; --color-warning-bg: #290d00; --color-caution: #ffb50f; --color-caution-bg: #2b1e00; --color-tip: #7dffe4; --color-tip-bg: #002d2b; --color-experiment: #a95ed2; --color-experiment-bg: #190325; --nav-bg: rgba(22, 22, 23, 0.8); --app-nav-bg: #1d1d1f; --field-bg: rgba(255, 255, 255, 0.04); --field-border: #6e6e73; --field-focus-halo: rgba(41, 151, 255, 0.35); --field-error-bg: #330000; --field-error-border: #ff3037; --btn-disabled-bg: #2c2c2e; --btn-disabled-text: #6e6e73; --toggle-off: #6e6e73; --row-hover: color-mix(in srgb, var(--color-link) 10%, transparent); --navigator-hover: color-mix(in srgb, var(--color-accent) 60%, transparent); --footer-bg: #1d1d1f; --footer-text: rgba(255, 255, 255, 0.56); --footer-link: rgba(255, 255, 255, 0.8); --footer-title: rgba(255, 255, 255, 0.92); --footer-pipe: rgba(255, 255, 255, 0.4); --note-bg: #323232; --note-border: #9a9a9e; --badge-bg: rgba(245, 245, 247, 0.12); --badge-text: #d2d2d7; }
    }
    @layer components {
      html:not(.theme-light) :where(.site-shell) .btn-neutral { --btn-bg-hover: #fff; --btn-bg-active: #ededf2; }
    }
    @layer components {
      html:not(.theme-light) :where(.site-shell) .media-placeholder { background: linear-gradient(135deg, #2c2c2e 0%, #242426 50%, #1c1c1e 100%); }
    }
    @layer themes {
      html:not(.theme-light) :where(.site-shell) .accent-indigo, html:not(.theme-light) :where(.site-shell) .accent-green, html:not(.theme-light) :where(.site-shell) .accent-orange, html:not(.theme-light) :where(.site-shell) .accent-purple { --color-text-secondary: color-mix(in oklch, var(--color-accent) var(--accent-tint), #86868b); --color-text-tertiary: color-mix(in oklch, var(--color-accent) var(--accent-tint), #6e6e73); --color-separator: color-mix(in oklch, var(--color-accent) var(--accent-tint), #424245); --field-border: color-mix(in oklch, var(--color-accent) var(--accent-tint), #6e6e73); --color-fill-tertiary: color-mix(in oklch, var(--color-accent) var(--accent-tint-surface), #333336); --color-bg-alt: color-mix(in oklch, var(--color-accent) var(--accent-tint-surface), #1d1d1f); --note-bg: color-mix(in oklch, var(--color-accent) var(--accent-tint-surface), #323232); --footer-bg: color-mix(in oklch, var(--color-accent) var(--accent-tint-surface), #1d1d1f); --app-nav-bg: color-mix(in oklch, var(--color-accent) var(--accent-tint-surface), #1d1d1f); }
      html:not(.theme-light) :where(.site-shell) .accent-indigo { --color-accent: #5e5ce6; --color-link: #8482ff; --color-accent-fill: #5040e3; --color-accent-fill-hover: #564aed; --color-accent-fill-active: #4a35d9; }
      html:not(.theme-light) :where(.site-shell) .accent-green { --color-accent: #30d158; --color-link: #5ee27f; --color-accent-fill: #00bc25; --color-accent-fill-hover: #00c835; --color-accent-fill-active: #00b00e; }
      html:not(.theme-light) :where(.site-shell) .accent-orange { --color-accent: #ff7d1a; --color-link: #ff9f0a; --color-accent-fill: #f05a00; --color-accent-fill-hover: #fd6700; --color-accent-fill-active: #e34e00; }
      html:not(.theme-light) :where(.site-shell) .accent-purple { --color-accent: #8f5bff; --color-link: #a988ff; --color-accent-fill: #8135fb; --color-accent-fill-hover: #8942ff; --color-accent-fill-active: #7926f0; }
      html:not(.theme-light) :where(.site-shell) .accent-graphite { --color-accent-hover: #fff; --color-accent-active: #ededf2; }
      html:not(.theme-light) :where(.site-shell) .frosted-light { --frost-veil: rgba(255, 255, 255, 0.04); --frost-edge: rgba(255, 255, 255, 0.07); --color-text-secondary: #a1a1a6; box-shadow: inset 0 0 0 1px var(--frost-edge), inset 0 1px 0 rgba(255, 255, 255, 0.10), inset 0 0 24px rgba(255, 255, 255, 0.02); }
      html:not(.theme-light) :where(.site-shell) .tint-accent { background: color-mix(in oklch, var(--color-accent) 16%, #000); border-color: color-mix(in oklch, var(--color-accent) 65%, #000); }
      html:not(.theme-light) :where(.site-shell) .wash-accent { background: radial-gradient(120% 70% at 50% 0%, color-mix(in oklch, var(--color-accent) 26%, #000), transparent 70%), var(--color-bg); }
    }
    @layer site {
      html:not(.theme-light) { --color-bg: #0a0b1c; --color-bg-alt: #12132a; --color-code-bg: #14152c; --color-text: #f2f1fb; --color-text-secondary: #9d9bbf; --color-text-tertiary: #7a789e; --color-separator: #2a2747; --color-hairline: rgba(255, 255, 255, 0.2); --color-fill-tertiary: #1f1e3a; --field-border: #56537c; --field-bg: rgba(255, 255, 255, 0.05); --note-bg: rgba(255, 255, 255, 0.04); --footer-bg: rgba(0, 0, 0, 0.1); --app-nav-bg: #0a0b1c; --surface-elevated: rgba(16, 17, 42, 0.86); --overlay: rgba(0, 0, 0, 0.55); --color-accent: #ffffff; --color-accent-hover: #f2f2f7; --color-accent-active: #e3e3ec; --color-accent-contrast: #0a0b1c; --color-accent-fill: #ffffff; --color-accent-fill-hover: #f2f2f7; --color-accent-fill-active: #e3e3ec; --color-link: #ffffff; --color-selection: #3d3776; --field-focus-halo: rgba(255, 255, 255, 0.28); --row-hover: rgba(255, 255, 255, 0.07); --row-active: #1f1e3a; --navigator-hover: rgba(255, 255, 255, 0.14); --toggle-off: #4a4870; --toggle-on: #ffffff; --btn-disabled-bg: #2a2947; --btn-disabled-text: #6b6990; --nav-bg: rgba(10, 11, 28, 0.8); --color-success: #5cf5a6; --color-error: #ff4757; --color-error-bg: rgba(255, 71, 87, 0.10); --color-warning: #ffa14d; --color-warning-bg: rgba(255, 161, 77, 0.09); --color-caution: #ffe08a; --color-caution-bg: rgba(255, 224, 138, 0.07); --color-tip: #5ce5ff; --color-tip-bg: rgba(92, 229, 255, 0.08); --color-experiment: #c084fc; --color-experiment-bg: rgba(192, 132, 252, 0.09); --field-error-bg: rgba(255, 71, 87, 0.11); --field-error-border: #ff4757; --pane-veil: rgba(255, 255, 255, 0.035); --pane-sub-veil: rgba(255, 255, 255, 0.028); }
    }
    @layer site {
      html:not(.theme-light) :where(.site-shell) .has-backdrop { background: radial-gradient(circle at 50% -373px, hsl(253.76deg 20.65% 59.95% / 22%), transparent 934px), var(--color-bg); }
      html:not(.theme-light) :where(.site-shell) .light-bar { background: #edeaff57; box-shadow: 0px 0px 50px 5px #af9efbba; }
      html:not(.theme-light) :where(.site-shell) body:is(.page-blog, .page-blog-post, .page-pricing) .light-bar { background: #d4c5ff57; box-shadow: 0px 0px 50px 5px #8f72f6c8; }
      html:not(.theme-light) :where(.site-shell) .backdrop.is-subtle { background: rgba(4, 6, 16, 0.32); }
      html:not(.theme-light) :where(.site-shell) .backdrop span:nth-child(1) { --c: rgba(150, 70, 235, 0.28); }
      html:not(.theme-light) :where(.site-shell) .backdrop span:nth-child(2) { --c: rgba(84, 84, 235, 0.16); }
      html:not(.theme-light) :where(.site-shell) .backdrop span:nth-child(3) { --c: rgba(70, 110, 240, 0.22); }
      html:not(.theme-light) :where(.site-shell) .backdrop span:nth-child(4) { --c: rgba(72, 60, 225, 0.20); }
      html:not(.theme-light) :where(.site-shell) .backdrop span:nth-child(5) { --c: rgba(70, 150, 220, 0.12); }
    }
    @layer site {
      html:not(.theme-light) :where(.site-shell) .topbar { background: transparent; border-bottom: 1px solid #241f39; }
      html:not(.theme-light) :where(.site-shell) .topbar-docs { border-bottom-color: rgba(255, 255, 255, 0.08); }
      html:not(.theme-light) :where(.site-shell) .topbar-docs .topbar-inner { color: rgba(236, 234, 255, 0.86); }
      html:not(.theme-light) :where(.site-shell) .topbar-docs .topbar-links > li > a { color: rgba(236, 234, 255, 0.86); }
      html:not(.theme-light) :where(.site-shell) .topbar-docs .topbar-links > li > a:hover { background: rgba(38, 43, 79, 0.65); }
      html:not(.theme-light) :where(.site-shell) .topbar-docs .topbar-search { color: rgba(148, 149, 176, 0.91); }
      html:not(.theme-light) :where(.site-shell) .topbar-docs .topbar-drop.topbar-version > button { color: rgba(236, 234, 255, 0.86); }
      html:not(.theme-light) :where(.site-shell) .topbar-badge { color: #ffffff; background: rgba(255, 255, 255, 0.12); }
      html:not(.theme-light) :where(.site-shell) .topbar-panel, html:not(.theme-light) :where(.site-shell) .menu-panel { background-color: transparent; border: 1px solid rgb(203 190 255 / 32%); box-shadow: 0 3px 16px #140e3563; }
      html:not(.theme-light) :where(.site-shell) .topbar-panel a:hover, html:not(.theme-light) :where(.site-shell) .topbar-panel button:hover, html:not(.theme-light) :where(.site-shell) .menu-panel a:hover, html:not(.theme-light) :where(.site-shell) .menu-panel button:hover { background: rgba(255, 255, 255, 0.08); box-shadow: inset 0 0 2px rgb(195 181 255 / 38%); }
      html:not(.theme-light) :where(.site-shell) .topbar-panel .docs-version-tag { color: #9495b0e8; }
      html:not(.theme-light) :where(.site-shell) .topbar-search kbd { background: rgba(255, 255, 255, 0.08); }
      html:not(.theme-light) :where(.site-shell) .topbar-auth { color: #ffffff; border-color: rgba(255, 255, 255, 0.55); background: rgba(255, 255, 255, 0.06); }
      html:not(.theme-light) :where(.site-shell) .topbar-auth:hover { color: #0a0b1c; border-color: #ffffff; background: #ffffff; }
      html:not(.theme-light) :where(.site-shell) .topbar-account:hover > .topbar-auth, html:not(.theme-light) :where(.site-shell) .topbar-account:focus-within > .topbar-auth { color: #ffffff; border-color: #ffffff; }
      @media (max-width: 899px) {
        html:not(.theme-light) :where(.site-shell) .topbar-menu-toggle:checked ~ .topbar:not(.topbar-docs)::before { background: rgba(10, 11, 28, 0.96); }
        html:not(.theme-light) :where(.site-shell) .topbar:not(.topbar-docs) .topbar-links > li > a { border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
      }
    }
    @layer site {
      html:not(.theme-light) :where(.site-shell) :where(a:not(.btn, .btn-toolbar, .btn-icon-add, .btn-icon-more, .tabs a, .filter-list a, .guide-nav a, .toc a, .app-card-title, .toolbar-select)) { text-shadow: 0 0 7px rgba(255, 255, 255, 0.45); }
      html:not(.theme-light) :where(.site-shell) .toggle input:checked + .toggle-track::after { background: #0a0b1c; }
      html:not(.theme-light) :where(.site-shell) .card:not(.login-card), html:not(.theme-light) :where(.site-shell) .account-nav, html:not(.theme-light) :where(.site-shell) .app-hero, html:not(.theme-light) :where(.site-shell) .price-card::before, html:not(.theme-light) :where(.site-shell) .login-card::before, html:not(.theme-light) :where(.site-shell) .frosted-sheet::before, html:not(.theme-light) :where(.site-shell) .home-panel::before { --frost-veil: rgba(255, 255, 255, 0.05); --frost-edge: rgba(255, 255, 255, 0.10); --frost-catch: rgba(255, 255, 255, 0.14); --frost-glow: rgba(255, 255, 255, 0.03); }
      html:not(.theme-light) :where(.site-shell) .filter-list a:hover, html:not(.theme-light) :where(.site-shell) .filter-list a.is-active { color: #ffffff; }
      html:not(.theme-light) :where(.site-shell) .filter-list a.is-active { background: rgba(255, 255, 255, 0.16); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18), 0 0 18px rgba(255, 255, 255, 0.10); }
      html:not(.theme-light) :where(.site-shell) .filter-list a:not(.is-active):hover { background: rgba(255, 255, 255, 0.08); }
      html:not(.theme-light) :where(.site-shell) .filter-list button:hover { color: #ffffff; background: rgba(255, 255, 255, 0.08); }
      @media (max-width: 734px) {
        html:not(.theme-light) :where(.site-shell) .app-layout .filter-list a, html:not(.theme-light) :where(.site-shell) .app-layout .filter-list button { border: 1px solid rgba(255, 255, 255, 0.12); }
      }
      html:not(.theme-light) :where(.site-shell) .badge-success, html:not(.theme-light) :where(.site-shell) .badge-error, html:not(.theme-light) :where(.site-shell) .badge-warning, html:not(.theme-light) :where(.site-shell) .badge-tip, html:not(.theme-light) :where(.site-shell) .badge-accent { text-shadow: 0 0 6px color-mix(in oklch, currentColor 45%, transparent); }
      html:not(.theme-light) :where(.site-shell) .app-banner-warning { border-color: rgba(255, 224, 138, 0.32); }
      html:not(.theme-light) :where(.site-shell) .app-banner-warning .app-banner-icon { background: #ffe08a; }
      html:not(.theme-light) :where(.site-shell) .app-band { background: rgba(255, 255, 255, 0.035); }
      html:not(.theme-light) :where(.site-shell) .section-alt { background: rgba(255, 255, 255, 0.04); border-top: 1px solid rgba(255, 255, 255, 0.08); border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
      html:not(.theme-light) :where(.site-shell) .segmented { background: rgba(255, 255, 255, 0.08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06); }
      html:not(.theme-light) :where(.site-shell) .choice-group span { background: rgba(255, 255, 255, 0.08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06); }
      html:not(.theme-light) :where(.site-shell) .choice-multi span::before { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.38); }
      html:not(.theme-light) :where(.site-shell) .modal { --color-text: #ffffff; --color-bg: #000000; --color-accent-contrast: #000000; --color-link: #ffffff; --color-accent: #ffffff; --color-accent-fill: #ffffff; --color-text-secondary: rgba(255, 255, 255, 0.62); --color-text-tertiary: rgba(255, 255, 255, 0.45); --color-separator: rgba(255, 255, 255, 0.16); --color-hairline: rgba(255, 255, 255, 0.22); --field-border: rgba(255, 255, 255, 0.3); --field-bg: rgba(255, 255, 255, 0.06); --field-focus-halo: rgba(255, 255, 255, 0.28); --color-fill-tertiary: rgba(255, 255, 255, 0.12); --color-code-bg: rgba(255, 255, 255, 0.06); --row-hover: rgba(255, 255, 255, 0.08); --row-active: rgba(255, 255, 255, 0.12); }
      html:not(.theme-light) :where(.site-shell) .frosted-sheet::before { --frost-veil: rgba(255, 255, 255, 0.06); }
      html:not(.theme-light) :where(.site-shell) body.id-page .id-footer { border-top-color: rgba(255, 255, 255, 0.12); }
      html:not(.theme-light) :where(.site-shell) .login-card { --color-text-secondary: #b5b3d6; }
      html:not(.theme-light) :where(.site-shell) .login-card .field-error { color: #ff9aa2; }
      html:not(.theme-light) :where(.site-shell) .login-card::before { --frost-veil: rgba(255, 255, 255, 0.07); --frost-edge: rgba(255, 255, 255, 0.11); --frost-catch: rgba(255, 255, 255, 0.16); --frost-glow: rgba(255, 255, 255, 0.05); }
      html:not(.theme-light) :where(.site-shell) .btn-glass:not(.btn-secondary) { --btn-bg: rgba(255, 255, 255, 0.16); --btn-fg: #fff; --btn-bg-hover: rgba(255, 255, 255, 0.18); --btn-bg-active: rgba(255, 255, 255, 0.12); --btn-border: rgba(255, 255, 255, 0.35); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28); }
      html:not(.theme-light) :where(.site-shell) .btn-glass:not(.btn-secondary):hover { --btn-border: rgba(255, 255, 255, 0.5); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.36), 0 0 18px rgba(255, 255, 255, 0.16); }
      html:not(.theme-light) :where(.site-shell) .btn-glass.btn-secondary { --btn-fg: rgba(255, 255, 255, 0.9); --btn-border: rgba(255, 255, 255, 0.45); --btn-bg-hover: rgba(255, 255, 255, 0.08); --btn-bg-active: rgba(255, 255, 255, 0.06); }
      html:not(.theme-light) :where(.site-shell) .btn-glass.btn-secondary:hover { --btn-fg: #fff; --btn-border: rgba(255, 255, 255, 0.7); box-shadow: 0 0 18px rgba(255, 255, 255, 0.12); }
      html:not(.theme-light) :where(.site-shell) .login .input:focus, html:not(.theme-light) :where(.site-shell) .login .code-field input:focus { border-color: rgba(255, 255, 255, 0.7); box-shadow: inset 0 0 0 1px transparent, 0 0 14px rgba(255, 255, 255, 0.18); }
      html:not(.theme-light) :where(.site-shell) .login .field-floating > .input:focus ~ label { color: rgba(255, 255, 255, 0.85); }
      html:not(.theme-light) :where(.site-shell) .link-button { text-shadow: 0 0 7px rgba(255, 255, 255, 0.45); }
      html:not(.theme-light) :where(.site-shell) .glyph-tile { background: rgba(255, 255, 255, 0.08); }
      html:not(.theme-light) :where(.site-shell) .app-hero .menu-panel { background-color: var(--color-bg-alt); }
      html:not(.theme-light) :where(.site-shell) .avatar { color: #ffffff; background: rgba(255, 255, 255, 0.14); }
      html:not(.theme-light) :where(.site-shell) .btn-destructive { --btn-fg: #0a0b1c; --btn-bg-hover: color-mix(in srgb, var(--color-error) 86%, #ffffff); --btn-bg-active: color-mix(in srgb, var(--color-error) 76%, #ffffff); }
      html:not(.theme-light) :where(.site-shell) .app-link-row:hover { border-color: rgba(255, 255, 255, 0.3); }
      @media (min-width: 735px) {
        html:not(.theme-light) :where(.site-shell) .app-layout > section .app-section .menu-panel { background-color: var(--color-bg-alt); }
      }
      @media (max-width: 734px) {
        html:not(.theme-light) :where(.site-shell) .app-layout > section .app-section .menu-panel { background-color: var(--color-bg-alt); }
      }
      html:not(.theme-light) :where(.site-shell) .select-panel { background-color: var(--color-bg-alt); border: 1px solid rgb(203 190 255 / 32%); box-shadow: 0 3px 16px #140e3563; }
      html:not(.theme-light) :where(.site-shell) .select-option.is-active { background: rgba(255, 255, 255, 0.08); box-shadow: inset 0 0 2px rgb(195 181 255 / 38%); }
    }
    @layer site {
      html:not(.theme-light) :where(.site-shell) body.page-docs { --color-text-secondary: #eceaffdb; --color-text-tertiary: #c6cbdeeb; }
      html:not(.theme-light) :where(.site-shell) body.page-docs .guide-main { color: #d3d4e6d6; }
      html:not(.theme-light) :where(.site-shell) body.page-docs .guide-main :is(h1, h2, h3, h4, h5, h6), html:not(.theme-light) :where(.site-shell) body.page-docs .guide-abstract { color: #cbcad6; }
      html:not(.theme-light) :where(.site-shell) body.page-docs .docs-article a { color: #ffffff; }
      html:not(.theme-light) :where(.site-shell) body.page-docs .backdrop { background: #040b10d1; }
      html:not(.theme-light) :where(.site-shell) body.page-docs .backdrop span:nth-child(1) { --c: rgba(112, 82, 235, 0.28); }
      html:not(.theme-light) :where(.site-shell) body.page-docs .backdrop span:nth-child(2) { --c: rgba(72, 92, 235, 0.16); }
      html:not(.theme-light) :where(.site-shell) .docs-shell::after { background: rgba(10, 11, 28, 0.52); }
      html:not(.theme-light) :where(.site-shell) .docs-navigator a, html:not(.theme-light) :where(.site-shell) .docs-navigator summary { color: var(--color-text-tertiary); }
      html:not(.theme-light) :where(.site-shell) .docs-navigator .is-open > summary { color: #ffffff; }
      html:not(.theme-light) :where(.site-shell) .docs-navigator a.is-active, html:not(.theme-light) :where(.site-shell) .docs-navigator a:hover, html:not(.theme-light) :where(.site-shell) .docs-navigator summary:hover { color: #ffffff; }
      html:not(.theme-light) :where(.site-shell) .docs-article :not(pre) > code { background: rgba(38, 43, 79, 0.65); color: #eae5f2; }
      html:not(.theme-light) :where(.site-shell) .docs-article th, html:not(.theme-light) :where(.site-shell) .docs-article td { border-color: #737593; }
      html:not(.theme-light) :where(.site-shell) .docs-article pre { background: rgba(0, 0, 0, 0.3); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.07); }
      html:not(.theme-light) :where(.site-shell) .docs-article pre.phiki { color: #efeffb; }
      html:not(.theme-light) :where(.site-shell) .docs-article .phiki .token[style] { color: var(--phiki-dark-color); }
      html:not(.theme-light) :where(.site-shell) .docs-tabs { background: rgba(0, 0, 0, 0.3); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.07); }
      html:not(.theme-light) :where(.site-shell) .docs-toc .toc a { color: var(--color-text-tertiary); }
      html:not(.theme-light) :where(.site-shell) .docs-toc .toc a:hover { color: #ffffff; }
      html:not(.theme-light) :where(.site-shell) .docs-toc .toc a.is-active { color: #ffffff; }
      @media (max-width: 1279px) {
        html:not(.theme-light) :where(.site-shell) .docs-toc-mobile { background: rgba(255, 255, 255, 0.05); }
      }
      @media (max-width: 1023px) {
        html:not(.theme-light) :where(.site-shell) .docs-drawer-sections { background: rgba(255, 255, 255, 0.07); }
      }
      html:not(.theme-light) :where(.site-shell) .docs-search-overlay { background: rgba(0, 0, 0, 0.55); }
    }
    @layer site {
      html:not(.theme-light) :where(.site-shell) body.page-download .app-disclosure-body :is(dd, p) code { background: rgba(255, 255, 255, 0.08); }
      html:not(.theme-light) :where(.site-shell) body.page-checkout .checkout-total { background: rgba(255, 255, 255, 0.04); }
      html:not(.theme-light) :where(.site-shell) .price-card { --frost-veil: rgba(255, 255, 255, 0.05); --frost-edge: rgba(255, 255, 255, 0.10); }
      html:not(.theme-light) :where(.site-shell) .price-card::before { --frost-veil: rgba(255, 255, 255, 0.07); --frost-edge: rgba(255, 255, 255, 0.11); --frost-catch: rgba(255, 255, 255, 0.16); --frost-glow: rgba(255, 255, 255, 0.05); }
      html:not(.theme-light) :where(.site-shell) .price-card.is-featured::before { --frost-veil: rgba(255, 255, 255, 0.09); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.2), inset 0 0 32px rgba(255, 255, 255, 0.05), 0 0 40px rgba(255, 255, 255, 0.07); }
      html:not(.theme-light) :where(.site-shell) .price-perk-icon { background: rgba(255, 255, 255, 0.08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); }
      html:not(.theme-light) :where(.site-shell) body.page-pricing { --color-text-tertiary: #a4a2c8; }
      html:not(.theme-light) :where(.site-shell) body.page-pricing .footnotes { color: var(--color-text-tertiary); }
      html:not(.theme-light) :where(.site-shell) .compare .is-featured { background: rgba(255, 255, 255, 0.045); }
      html:not(.theme-light) :where(.site-shell) .compare tbody td.is-featured { color: #d8d6ee; }
      html:not(.theme-light) :where(.site-shell) body.page-blog, html:not(.theme-light) :where(.site-shell) body.page-blog-post { --color-text-secondary: #aaa3ea; --color-separator: rgba(255, 255, 255, 0.16); }
      html:not(.theme-light) :where(.site-shell) .blog-head h1, html:not(.theme-light) :where(.site-shell) .blog-lede { color: rgba(255, 255, 255, 0.3); }
      html:not(.theme-light) :where(.site-shell) .blog-head h1::before, html:not(.theme-light) :where(.site-shell) .blog-lede::before { color: #aaaaaa; }
      html:not(.theme-light) :where(.site-shell) body.page-blog-post :is(.article-body, .article-subhead) { color: rgba(255, 255, 255, 0.9); }
      html:not(.theme-light) :where(.site-shell) body.page-blog-post .article-body :not(pre) > code { background: rgb(109 104 177 / 23%); color: #ffffff; }
      html:not(.theme-light) :where(.site-shell) body.page-blog-post .article-body pre { background: rgba(0, 0, 0, 0.3); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.07); }
      html:not(.theme-light) :where(.site-shell) .sales-link { text-shadow: 0 0 7px rgba(255, 255, 255, 0.45); }
    }
    @layer site {
      html:not(.theme-light) :where(.site-shell) .btn-aurora { --btn-fg: #ffffff; --btn-bg: linear-gradient(100deg, rgba(98, 158, 254, 0.62), rgba(96, 47, 255, 0.7) 52%, rgba(179, 106, 255, 0.66)); --btn-bg-hover: linear-gradient(100deg, #629efe, #6a3cff 52%, #b36aff); --btn-ring: linear-gradient(100deg, #9fd0ff, rgba(170, 150, 255, 0.8) 52%, #e6b3ff); box-shadow: 0 8px 28px -8px rgba(122, 77, 255, 0.7), 0 0 22px rgba(122, 90, 255, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.25); text-shadow: 0 0 10px rgba(255, 255, 255, 0.35); }
      html:not(.theme-light) :where(.site-shell) .btn-aurora:hover { box-shadow: 0 10px 34px -8px rgba(130, 90, 255, 0.85), 0 0 34px rgba(140, 110, 255, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.4); }
    }
  }
  @layer tokens {
    html.theme-dark { --color-text: #f5f5f7; --color-text-secondary: #86868b; --color-text-tertiary: #6e6e73; --color-bg: #000000; --color-bg-alt: #1d1d1f; --color-fill-tertiary: #333336; --color-code-bg: #333336; --color-link: #2997ff; --color-accent-fill: #005bdf; --color-accent-fill-hover: #0064e9; --color-accent-fill-active: #0051d5; --color-separator: #424245; --color-hairline: rgba(255, 255, 255, 0.24); --color-selection: #3f638b; --color-success: #03a10e; --color-error: #ff3037; --color-error-bg: #330000; --color-warning: #f56300; --color-warning-bg: #290d00; --color-caution: #ffb50f; --color-caution-bg: #2b1e00; --color-tip: #7dffe4; --color-tip-bg: #002d2b; --color-experiment: #a95ed2; --color-experiment-bg: #190325; --nav-bg: rgba(22, 22, 23, 0.8); --app-nav-bg: #1d1d1f; --field-bg: rgba(255, 255, 255, 0.04); --field-border: #6e6e73; --field-focus-halo: rgba(41, 151, 255, 0.35); --field-error-bg: #330000; --field-error-border: #ff3037; --btn-disabled-bg: #2c2c2e; --btn-disabled-text: #6e6e73; --toggle-off: #6e6e73; --row-hover: color-mix(in srgb, var(--color-link) 10%, transparent); --navigator-hover: color-mix(in srgb, var(--color-accent) 60%, transparent); --footer-bg: #1d1d1f; --footer-text: rgba(255, 255, 255, 0.56); --footer-link: rgba(255, 255, 255, 0.8); --footer-title: rgba(255, 255, 255, 0.92); --footer-pipe: rgba(255, 255, 255, 0.4); --note-bg: #323232; --note-border: #9a9a9e; --badge-bg: rgba(245, 245, 247, 0.12); --badge-text: #d2d2d7; }
  }
  @layer components {
    html.theme-dark :where(.site-shell) .btn-neutral { --btn-bg-hover: #fff; --btn-bg-active: #ededf2; }
  }
  @layer components {
    html.theme-dark :where(.site-shell) .media-placeholder { background: linear-gradient(135deg, #2c2c2e 0%, #242426 50%, #1c1c1e 100%); }
  }
  @layer themes {
    html.theme-dark :where(.site-shell) .accent-indigo, html.theme-dark :where(.site-shell) .accent-green, html.theme-dark :where(.site-shell) .accent-orange, html.theme-dark :where(.site-shell) .accent-purple { --color-text-secondary: color-mix(in oklch, var(--color-accent) var(--accent-tint), #86868b); --color-text-tertiary: color-mix(in oklch, var(--color-accent) var(--accent-tint), #6e6e73); --color-separator: color-mix(in oklch, var(--color-accent) var(--accent-tint), #424245); --field-border: color-mix(in oklch, var(--color-accent) var(--accent-tint), #6e6e73); --color-fill-tertiary: color-mix(in oklch, var(--color-accent) var(--accent-tint-surface), #333336); --color-bg-alt: color-mix(in oklch, var(--color-accent) var(--accent-tint-surface), #1d1d1f); --note-bg: color-mix(in oklch, var(--color-accent) var(--accent-tint-surface), #323232); --footer-bg: color-mix(in oklch, var(--color-accent) var(--accent-tint-surface), #1d1d1f); --app-nav-bg: color-mix(in oklch, var(--color-accent) var(--accent-tint-surface), #1d1d1f); }
    html.theme-dark :where(.site-shell) .accent-indigo { --color-accent: #5e5ce6; --color-link: #8482ff; --color-accent-fill: #5040e3; --color-accent-fill-hover: #564aed; --color-accent-fill-active: #4a35d9; }
    html.theme-dark :where(.site-shell) .accent-green { --color-accent: #30d158; --color-link: #5ee27f; --color-accent-fill: #00bc25; --color-accent-fill-hover: #00c835; --color-accent-fill-active: #00b00e; }
    html.theme-dark :where(.site-shell) .accent-orange { --color-accent: #ff7d1a; --color-link: #ff9f0a; --color-accent-fill: #f05a00; --color-accent-fill-hover: #fd6700; --color-accent-fill-active: #e34e00; }
    html.theme-dark :where(.site-shell) .accent-purple { --color-accent: #8f5bff; --color-link: #a988ff; --color-accent-fill: #8135fb; --color-accent-fill-hover: #8942ff; --color-accent-fill-active: #7926f0; }
    html.theme-dark :where(.site-shell) .accent-graphite { --color-accent-hover: #fff; --color-accent-active: #ededf2; }
    html.theme-dark :where(.site-shell) .frosted-light { --frost-veil: rgba(255, 255, 255, 0.04); --frost-edge: rgba(255, 255, 255, 0.07); --color-text-secondary: #a1a1a6; box-shadow: inset 0 0 0 1px var(--frost-edge), inset 0 1px 0 rgba(255, 255, 255, 0.10), inset 0 0 24px rgba(255, 255, 255, 0.02); }
    html.theme-dark :where(.site-shell) .tint-accent { background: color-mix(in oklch, var(--color-accent) 16%, #000); border-color: color-mix(in oklch, var(--color-accent) 65%, #000); }
    html.theme-dark :where(.site-shell) .wash-accent { background: radial-gradient(120% 70% at 50% 0%, color-mix(in oklch, var(--color-accent) 26%, #000), transparent 70%), var(--color-bg); }
  }
  @layer site {
    html.theme-dark { --color-bg: #0a0b1c; --color-bg-alt: #12132a; --color-code-bg: #14152c; --color-text: #f2f1fb; --color-text-secondary: #9d9bbf; --color-text-tertiary: #7a789e; --color-separator: #2a2747; --color-hairline: rgba(255, 255, 255, 0.2); --color-fill-tertiary: #1f1e3a; --field-border: #56537c; --field-bg: rgba(255, 255, 255, 0.05); --note-bg: rgba(255, 255, 255, 0.04); --footer-bg: rgba(0, 0, 0, 0.1); --app-nav-bg: #0a0b1c; --surface-elevated: rgba(16, 17, 42, 0.86); --overlay: rgba(0, 0, 0, 0.55); --color-accent: #ffffff; --color-accent-hover: #f2f2f7; --color-accent-active: #e3e3ec; --color-accent-contrast: #0a0b1c; --color-accent-fill: #ffffff; --color-accent-fill-hover: #f2f2f7; --color-accent-fill-active: #e3e3ec; --color-link: #ffffff; --color-selection: #3d3776; --field-focus-halo: rgba(255, 255, 255, 0.28); --row-hover: rgba(255, 255, 255, 0.07); --row-active: #1f1e3a; --navigator-hover: rgba(255, 255, 255, 0.14); --toggle-off: #4a4870; --toggle-on: #ffffff; --btn-disabled-bg: #2a2947; --btn-disabled-text: #6b6990; --nav-bg: rgba(10, 11, 28, 0.8); --color-success: #5cf5a6; --color-error: #ff4757; --color-error-bg: rgba(255, 71, 87, 0.10); --color-warning: #ffa14d; --color-warning-bg: rgba(255, 161, 77, 0.09); --color-caution: #ffe08a; --color-caution-bg: rgba(255, 224, 138, 0.07); --color-tip: #5ce5ff; --color-tip-bg: rgba(92, 229, 255, 0.08); --color-experiment: #c084fc; --color-experiment-bg: rgba(192, 132, 252, 0.09); --field-error-bg: rgba(255, 71, 87, 0.11); --field-error-border: #ff4757; --pane-veil: rgba(255, 255, 255, 0.035); --pane-sub-veil: rgba(255, 255, 255, 0.028); }
  }
  @layer site {
    html.theme-dark :where(.site-shell) .has-backdrop { background: radial-gradient(circle at 50% -373px, hsl(253.76deg 20.65% 59.95% / 22%), transparent 934px), var(--color-bg); }
    html.theme-dark :where(.site-shell) .light-bar { background: #edeaff57; box-shadow: 0px 0px 50px 5px #af9efbba; }
    html.theme-dark :where(.site-shell) body:is(.page-blog, .page-blog-post, .page-pricing) .light-bar { background: #d4c5ff57; box-shadow: 0px 0px 50px 5px #8f72f6c8; }
    html.theme-dark :where(.site-shell) .backdrop.is-subtle { background: rgba(4, 6, 16, 0.32); }
    html.theme-dark :where(.site-shell) .backdrop span:nth-child(1) { --c: rgba(150, 70, 235, 0.28); }
    html.theme-dark :where(.site-shell) .backdrop span:nth-child(2) { --c: rgba(84, 84, 235, 0.16); }
    html.theme-dark :where(.site-shell) .backdrop span:nth-child(3) { --c: rgba(70, 110, 240, 0.22); }
    html.theme-dark :where(.site-shell) .backdrop span:nth-child(4) { --c: rgba(72, 60, 225, 0.20); }
    html.theme-dark :where(.site-shell) .backdrop span:nth-child(5) { --c: rgba(70, 150, 220, 0.12); }
  }
  @layer site {
    html.theme-dark :where(.site-shell) .topbar { background: transparent; border-bottom: 1px solid #241f39; }
    html.theme-dark :where(.site-shell) .topbar-docs { border-bottom-color: rgba(255, 255, 255, 0.08); }
    html.theme-dark :where(.site-shell) .topbar-docs .topbar-inner { color: rgba(236, 234, 255, 0.86); }
    html.theme-dark :where(.site-shell) .topbar-docs .topbar-links > li > a { color: rgba(236, 234, 255, 0.86); }
    html.theme-dark :where(.site-shell) .topbar-docs .topbar-links > li > a:hover { background: rgba(38, 43, 79, 0.65); }
    html.theme-dark :where(.site-shell) .topbar-docs .topbar-search { color: rgba(148, 149, 176, 0.91); }
    html.theme-dark :where(.site-shell) .topbar-docs .topbar-drop.topbar-version > button { color: rgba(236, 234, 255, 0.86); }
    html.theme-dark :where(.site-shell) .topbar-badge { color: #ffffff; background: rgba(255, 255, 255, 0.12); }
    html.theme-dark :where(.site-shell) .topbar-panel, html.theme-dark :where(.site-shell) .menu-panel { background-color: transparent; border: 1px solid rgb(203 190 255 / 32%); box-shadow: 0 3px 16px #140e3563; }
    html.theme-dark :where(.site-shell) .topbar-panel a:hover, html.theme-dark :where(.site-shell) .topbar-panel button:hover, html.theme-dark :where(.site-shell) .menu-panel a:hover, html.theme-dark :where(.site-shell) .menu-panel button:hover { background: rgba(255, 255, 255, 0.08); box-shadow: inset 0 0 2px rgb(195 181 255 / 38%); }
    html.theme-dark :where(.site-shell) .topbar-panel .docs-version-tag { color: #9495b0e8; }
    html.theme-dark :where(.site-shell) .topbar-search kbd { background: rgba(255, 255, 255, 0.08); }
    html.theme-dark :where(.site-shell) .topbar-auth { color: #ffffff; border-color: rgba(255, 255, 255, 0.55); background: rgba(255, 255, 255, 0.06); }
    html.theme-dark :where(.site-shell) .topbar-auth:hover { color: #0a0b1c; border-color: #ffffff; background: #ffffff; }
    html.theme-dark :where(.site-shell) .topbar-account:hover > .topbar-auth, html.theme-dark :where(.site-shell) .topbar-account:focus-within > .topbar-auth { color: #ffffff; border-color: #ffffff; }
    @media (max-width: 899px) {
      html.theme-dark :where(.site-shell) .topbar-menu-toggle:checked ~ .topbar:not(.topbar-docs)::before { background: rgba(10, 11, 28, 0.96); }
      html.theme-dark :where(.site-shell) .topbar:not(.topbar-docs) .topbar-links > li > a { border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
    }
  }
  @layer site {
    html.theme-dark :where(.site-shell) :where(a:not(.btn, .btn-toolbar, .btn-icon-add, .btn-icon-more, .tabs a, .filter-list a, .guide-nav a, .toc a, .app-card-title, .toolbar-select)) { text-shadow: 0 0 7px rgba(255, 255, 255, 0.45); }
    html.theme-dark :where(.site-shell) .toggle input:checked + .toggle-track::after { background: #0a0b1c; }
    html.theme-dark :where(.site-shell) .card:not(.login-card), html.theme-dark :where(.site-shell) .account-nav, html.theme-dark :where(.site-shell) .app-hero, html.theme-dark :where(.site-shell) .price-card::before, html.theme-dark :where(.site-shell) .login-card::before, html.theme-dark :where(.site-shell) .frosted-sheet::before, html.theme-dark :where(.site-shell) .home-panel::before { --frost-veil: rgba(255, 255, 255, 0.05); --frost-edge: rgba(255, 255, 255, 0.10); --frost-catch: rgba(255, 255, 255, 0.14); --frost-glow: rgba(255, 255, 255, 0.03); }
    html.theme-dark :where(.site-shell) .filter-list a:hover, html.theme-dark :where(.site-shell) .filter-list a.is-active { color: #ffffff; }
    html.theme-dark :where(.site-shell) .filter-list a.is-active { background: rgba(255, 255, 255, 0.16); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18), 0 0 18px rgba(255, 255, 255, 0.10); }
    html.theme-dark :where(.site-shell) .filter-list a:not(.is-active):hover { background: rgba(255, 255, 255, 0.08); }
    html.theme-dark :where(.site-shell) .filter-list button:hover { color: #ffffff; background: rgba(255, 255, 255, 0.08); }
    @media (max-width: 734px) {
      html.theme-dark :where(.site-shell) .app-layout .filter-list a, html.theme-dark :where(.site-shell) .app-layout .filter-list button { border: 1px solid rgba(255, 255, 255, 0.12); }
    }
    html.theme-dark :where(.site-shell) .badge-success, html.theme-dark :where(.site-shell) .badge-error, html.theme-dark :where(.site-shell) .badge-warning, html.theme-dark :where(.site-shell) .badge-tip, html.theme-dark :where(.site-shell) .badge-accent { text-shadow: 0 0 6px color-mix(in oklch, currentColor 45%, transparent); }
    html.theme-dark :where(.site-shell) .app-banner-warning { border-color: rgba(255, 224, 138, 0.32); }
    html.theme-dark :where(.site-shell) .app-banner-warning .app-banner-icon { background: #ffe08a; }
    html.theme-dark :where(.site-shell) .app-band { background: rgba(255, 255, 255, 0.035); }
    html.theme-dark :where(.site-shell) .section-alt { background: rgba(255, 255, 255, 0.04); border-top: 1px solid rgba(255, 255, 255, 0.08); border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
    html.theme-dark :where(.site-shell) .segmented { background: rgba(255, 255, 255, 0.08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06); }
    html.theme-dark :where(.site-shell) .choice-group span { background: rgba(255, 255, 255, 0.08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06); }
    html.theme-dark :where(.site-shell) .choice-multi span::before { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.38); }
    html.theme-dark :where(.site-shell) .modal { --color-text: #ffffff; --color-bg: #000000; --color-accent-contrast: #000000; --color-link: #ffffff; --color-accent: #ffffff; --color-accent-fill: #ffffff; --color-text-secondary: rgba(255, 255, 255, 0.62); --color-text-tertiary: rgba(255, 255, 255, 0.45); --color-separator: rgba(255, 255, 255, 0.16); --color-hairline: rgba(255, 255, 255, 0.22); --field-border: rgba(255, 255, 255, 0.3); --field-bg: rgba(255, 255, 255, 0.06); --field-focus-halo: rgba(255, 255, 255, 0.28); --color-fill-tertiary: rgba(255, 255, 255, 0.12); --color-code-bg: rgba(255, 255, 255, 0.06); --row-hover: rgba(255, 255, 255, 0.08); --row-active: rgba(255, 255, 255, 0.12); }
    html.theme-dark :where(.site-shell) .frosted-sheet::before { --frost-veil: rgba(255, 255, 255, 0.06); }
    html.theme-dark :where(.site-shell) body.id-page .id-footer { border-top-color: rgba(255, 255, 255, 0.12); }
    html.theme-dark :where(.site-shell) .login-card { --color-text-secondary: #b5b3d6; }
    html.theme-dark :where(.site-shell) .login-card .field-error { color: #ff9aa2; }
    html.theme-dark :where(.site-shell) .login-card::before { --frost-veil: rgba(255, 255, 255, 0.07); --frost-edge: rgba(255, 255, 255, 0.11); --frost-catch: rgba(255, 255, 255, 0.16); --frost-glow: rgba(255, 255, 255, 0.05); }
    html.theme-dark :where(.site-shell) .btn-glass:not(.btn-secondary) { --btn-bg: rgba(255, 255, 255, 0.16); --btn-fg: #fff; --btn-bg-hover: rgba(255, 255, 255, 0.18); --btn-bg-active: rgba(255, 255, 255, 0.12); --btn-border: rgba(255, 255, 255, 0.35); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28); }
    html.theme-dark :where(.site-shell) .btn-glass:not(.btn-secondary):hover { --btn-border: rgba(255, 255, 255, 0.5); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.36), 0 0 18px rgba(255, 255, 255, 0.16); }
    html.theme-dark :where(.site-shell) .btn-glass.btn-secondary { --btn-fg: rgba(255, 255, 255, 0.9); --btn-border: rgba(255, 255, 255, 0.45); --btn-bg-hover: rgba(255, 255, 255, 0.08); --btn-bg-active: rgba(255, 255, 255, 0.06); }
    html.theme-dark :where(.site-shell) .btn-glass.btn-secondary:hover { --btn-fg: #fff; --btn-border: rgba(255, 255, 255, 0.7); box-shadow: 0 0 18px rgba(255, 255, 255, 0.12); }
    html.theme-dark :where(.site-shell) .login .input:focus, html.theme-dark :where(.site-shell) .login .code-field input:focus { border-color: rgba(255, 255, 255, 0.7); box-shadow: inset 0 0 0 1px transparent, 0 0 14px rgba(255, 255, 255, 0.18); }
    html.theme-dark :where(.site-shell) .login .field-floating > .input:focus ~ label { color: rgba(255, 255, 255, 0.85); }
    html.theme-dark :where(.site-shell) .link-button { text-shadow: 0 0 7px rgba(255, 255, 255, 0.45); }
    html.theme-dark :where(.site-shell) .glyph-tile { background: rgba(255, 255, 255, 0.08); }
    html.theme-dark :where(.site-shell) .app-hero .menu-panel { background-color: var(--color-bg-alt); }
    html.theme-dark :where(.site-shell) .avatar { color: #ffffff; background: rgba(255, 255, 255, 0.14); }
    html.theme-dark :where(.site-shell) .btn-destructive { --btn-fg: #0a0b1c; --btn-bg-hover: color-mix(in srgb, var(--color-error) 86%, #ffffff); --btn-bg-active: color-mix(in srgb, var(--color-error) 76%, #ffffff); }
    html.theme-dark :where(.site-shell) .app-link-row:hover { border-color: rgba(255, 255, 255, 0.3); }
    @media (min-width: 735px) {
      html.theme-dark :where(.site-shell) .app-layout > section .app-section .menu-panel { background-color: var(--color-bg-alt); }
    }
    @media (max-width: 734px) {
      html.theme-dark :where(.site-shell) .app-layout > section .app-section .menu-panel { background-color: var(--color-bg-alt); }
    }
    html.theme-dark :where(.site-shell) .select-panel { background-color: var(--color-bg-alt); border: 1px solid rgb(203 190 255 / 32%); box-shadow: 0 3px 16px #140e3563; }
    html.theme-dark :where(.site-shell) .select-option.is-active { background: rgba(255, 255, 255, 0.08); box-shadow: inset 0 0 2px rgb(195 181 255 / 38%); }
  }
  @layer site {
    html.theme-dark :where(.site-shell) body.page-docs { --color-text-secondary: #eceaffdb; --color-text-tertiary: #c6cbdeeb; }
    html.theme-dark :where(.site-shell) body.page-docs .guide-main { color: #d3d4e6d6; }
    html.theme-dark :where(.site-shell) body.page-docs .guide-main :is(h1, h2, h3, h4, h5, h6), html.theme-dark :where(.site-shell) body.page-docs .guide-abstract { color: #cbcad6; }
    html.theme-dark :where(.site-shell) body.page-docs .docs-article a { color: #ffffff; }
    html.theme-dark :where(.site-shell) body.page-docs .backdrop { background: #040b10d1; }
    html.theme-dark :where(.site-shell) body.page-docs .backdrop span:nth-child(1) { --c: rgba(112, 82, 235, 0.28); }
    html.theme-dark :where(.site-shell) body.page-docs .backdrop span:nth-child(2) { --c: rgba(72, 92, 235, 0.16); }
    html.theme-dark :where(.site-shell) .docs-shell::after { background: rgba(10, 11, 28, 0.52); }
    html.theme-dark :where(.site-shell) .docs-navigator a, html.theme-dark :where(.site-shell) .docs-navigator summary { color: var(--color-text-tertiary); }
    html.theme-dark :where(.site-shell) .docs-navigator .is-open > summary { color: #ffffff; }
    html.theme-dark :where(.site-shell) .docs-navigator a.is-active, html.theme-dark :where(.site-shell) .docs-navigator a:hover, html.theme-dark :where(.site-shell) .docs-navigator summary:hover { color: #ffffff; }
    html.theme-dark :where(.site-shell) .docs-article :not(pre) > code { background: rgba(38, 43, 79, 0.65); color: #eae5f2; }
    html.theme-dark :where(.site-shell) .docs-article th, html.theme-dark :where(.site-shell) .docs-article td { border-color: #737593; }
    html.theme-dark :where(.site-shell) .docs-article pre { background: rgba(0, 0, 0, 0.3); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.07); }
    html.theme-dark :where(.site-shell) .docs-article pre.phiki { color: #efeffb; }
    html.theme-dark :where(.site-shell) .docs-article .phiki .token[style] { color: var(--phiki-dark-color); }
    html.theme-dark :where(.site-shell) .docs-tabs { background: rgba(0, 0, 0, 0.3); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.07); }
    html.theme-dark :where(.site-shell) .docs-toc .toc a { color: var(--color-text-tertiary); }
    html.theme-dark :where(.site-shell) .docs-toc .toc a:hover { color: #ffffff; }
    html.theme-dark :where(.site-shell) .docs-toc .toc a.is-active { color: #ffffff; }
    @media (max-width: 1279px) {
      html.theme-dark :where(.site-shell) .docs-toc-mobile { background: rgba(255, 255, 255, 0.05); }
    }
    @media (max-width: 1023px) {
      html.theme-dark :where(.site-shell) .docs-drawer-sections { background: rgba(255, 255, 255, 0.07); }
    }
    html.theme-dark :where(.site-shell) .docs-search-overlay { background: rgba(0, 0, 0, 0.55); }
  }
  @layer site {
    html.theme-dark :where(.site-shell) body.page-download .app-disclosure-body :is(dd, p) code { background: rgba(255, 255, 255, 0.08); }
    html.theme-dark :where(.site-shell) body.page-checkout .checkout-total { background: rgba(255, 255, 255, 0.04); }
    html.theme-dark :where(.site-shell) .price-card { --frost-veil: rgba(255, 255, 255, 0.05); --frost-edge: rgba(255, 255, 255, 0.10); }
    html.theme-dark :where(.site-shell) .price-card::before { --frost-veil: rgba(255, 255, 255, 0.07); --frost-edge: rgba(255, 255, 255, 0.11); --frost-catch: rgba(255, 255, 255, 0.16); --frost-glow: rgba(255, 255, 255, 0.05); }
    html.theme-dark :where(.site-shell) .price-card.is-featured::before { --frost-veil: rgba(255, 255, 255, 0.09); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.2), inset 0 0 32px rgba(255, 255, 255, 0.05), 0 0 40px rgba(255, 255, 255, 0.07); }
    html.theme-dark :where(.site-shell) .price-perk-icon { background: rgba(255, 255, 255, 0.08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); }
    html.theme-dark :where(.site-shell) body.page-pricing { --color-text-tertiary: #a4a2c8; }
    html.theme-dark :where(.site-shell) body.page-pricing .footnotes { color: var(--color-text-tertiary); }
    html.theme-dark :where(.site-shell) .compare .is-featured { background: rgba(255, 255, 255, 0.045); }
    html.theme-dark :where(.site-shell) .compare tbody td.is-featured { color: #d8d6ee; }
    html.theme-dark :where(.site-shell) body.page-blog, html.theme-dark :where(.site-shell) body.page-blog-post { --color-text-secondary: #aaa3ea; --color-separator: rgba(255, 255, 255, 0.16); }
    html.theme-dark :where(.site-shell) .blog-head h1, html.theme-dark :where(.site-shell) .blog-lede { color: rgba(255, 255, 255, 0.3); }
    html.theme-dark :where(.site-shell) .blog-head h1::before, html.theme-dark :where(.site-shell) .blog-lede::before { color: #aaaaaa; }
    html.theme-dark :where(.site-shell) body.page-blog-post :is(.article-body, .article-subhead) { color: rgba(255, 255, 255, 0.9); }
    html.theme-dark :where(.site-shell) body.page-blog-post .article-body :not(pre) > code { background: rgb(109 104 177 / 23%); color: #ffffff; }
    html.theme-dark :where(.site-shell) body.page-blog-post .article-body pre { background: rgba(0, 0, 0, 0.3); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.07); }
    html.theme-dark :where(.site-shell) .sales-link { text-shadow: 0 0 7px rgba(255, 255, 255, 0.45); }
  }
  @layer site {
    html.theme-dark :where(.site-shell) .btn-aurora { --btn-fg: #ffffff; --btn-bg: linear-gradient(100deg, rgba(98, 158, 254, 0.62), rgba(96, 47, 255, 0.7) 52%, rgba(179, 106, 255, 0.66)); --btn-bg-hover: linear-gradient(100deg, #629efe, #6a3cff 52%, #b36aff); --btn-ring: linear-gradient(100deg, #9fd0ff, rgba(170, 150, 255, 0.8) 52%, #e6b3ff); box-shadow: 0 8px 28px -8px rgba(122, 77, 255, 0.7), 0 0 22px rgba(122, 90, 255, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.25); text-shadow: 0 0 10px rgba(255, 255, 255, 0.35); }
    html.theme-dark :where(.site-shell) .btn-aurora:hover { box-shadow: 0 10px 34px -8px rgba(130, 90, 255, 0.85), 0 0 34px rgba(140, 110, 255, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.4); }
  }
}
