@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
    'Noto Color Emoji';
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
    monospace;
    --color-slate-500: oklch(55.4% 0.046 257.417);
    --color-slate-700: oklch(37.2% 0.044 257.287);
    --color-slate-800: oklch(27.9% 0.041 260.031);
    --color-gray-400: oklch(70.7% 0.022 261.325);
    --color-gray-500: oklch(55.1% 0.027 264.364);
    --color-gray-600: oklch(44.6% 0.03 256.802);
    --color-gray-800: oklch(27.8% 0.033 256.848);
    --spacing: 0.25rem;
    --text-xs: 0.75rem;
    --text-xs--line-height: calc(1 / 0.75);
    --text-sm: 0.875rem;
    --text-sm--line-height: calc(1.25 / 0.875);
    --text-base: 1rem;
    --text-base--line-height: calc(1.5 / 1);
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
    --text-3xl: 1.875rem;
    --text-3xl--line-height: calc(2.25 / 1.875);
    --text-4xl: 2.25rem;
    --text-4xl--line-height: calc(2.5 / 2.25);
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;
    --tracking-wider: 0.05em;
    --leading-tight: 1.25;
    --radius-lg: 0.5rem;
    --radius-xl: 0.75rem;
    --ease-out: cubic-bezier(0, 0, 0.2, 1);
    --blur-sm: 8px;
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --color-primary: #2563eb;
    --color-neutral: #f3f4f6;
    --color-base-100: #ffffff;
    --color-base-200: #f8fafc;
    --color-base-300: #f1f5f9;
    --color-base-content: #111827;
    --color-primary-content: #ffffff;
    --color-neutral-content: #111827;
    --radius-field: 0.375rem;
    --radius-box: 0.5rem;
  }
}
@layer base {
  *, ::after, ::before, ::backdrop, ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
  }
  html, :host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji');
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }
  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }
  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }
  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }
  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }
  b, strong {
    font-weight: bolder;
  }
  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }
  small {
    font-size: 80%;
  }
  sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }
  :-moz-focusring {
    outline: auto;
  }
  ol, ul {
    list-style: none;
  }
  img, svg, video, canvas, audio, iframe, embed, object {
    display: block;
    vertical-align: middle;
  }
  img, video {
    max-width: 100%;
    height: auto;
  }
  button, input, select, optgroup, textarea, ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    border-radius: 0;
    background-color: transparent;
    opacity: 1;
  }
  ::placeholder {
    opacity: 1;
    color: color-mix(in srgb, currentcolor 50%, transparent);
  }
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  button, input:where([type='button'], [type='reset'], [type='submit']) {
    appearance: button;
  }
  [hidden]:where(:not([hidden='until-found'])) {
    display: none !important;
  }
  [data-theme="goyo-dark"] {
    color-scheme: dark;
    --color-primary: #9ca3af;
    --color-neutral: #1e293b;
    --color-base-100: #0f172a;
    --color-base-200: #1e293b;
    --color-base-300: #334155;
    --color-base-content: #e2e8f0;
    --color-primary-content: #111827;
    --color-neutral-content: #f1f5f9;
    --goyo-bg-from: #0f172a;
    --goyo-bg-to: #1e293b;
  }
  [data-theme="goyo-light"] {
    color-scheme: light;
    --goyo-bg-from: #ffffff;
    --goyo-bg-to: #f8fafc;
  }
  :root, [data-theme] {
    background: var(--page-scroll-bg, var(--root-bg));
    color: var(--color-base-content);
  }
  :where(:root, [data-theme]) {
    --root-bg: var(--color-base-100);
  }
  html {
    scroll-padding-top: 130px;
    scroll-behavior: smooth;
  }
  body {
    line-height: 1.5;
    color: var(--color-base-content);
    font-size: 16px;
    font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-feature-settings: "liga" 1, "kern" 1;
    min-height: 100vh;
    background: linear-gradient(135deg, var(--goyo-bg-from) 0%, var(--goyo-bg-to) 100%);
  }
  h1 {
    margin-top: calc(var(--spacing) * 12);
    margin-bottom: calc(var(--spacing) * 8);
    background-clip: text;
    font-size: var(--text-4xl);
    font-weight: var(--font-weight-extrabold);
    color: transparent;
    line-height: 1.1;
    letter-spacing: -0.03em;
  }
  h2 {
    margin-top: calc(var(--spacing) * 16);
    margin-bottom: calc(var(--spacing) * 8);
    font-size: var(--text-3xl);
    line-height: var(--text-3xl--line-height);
    font-weight: var(--font-weight-bold);
    color: var(--color-base-content);
    line-height: 1.2;
    letter-spacing: -0.025em;
    position: relative;
  }
  h3 {
    margin-top: calc(var(--spacing) * 12);
    margin-bottom: calc(var(--spacing) * 6);
    font-size: var(--text-2xl);
    line-height: var(--text-2xl--line-height);
    font-weight: var(--font-weight-semibold);
    color: var(--color-base-content);
    line-height: 1.3;
    letter-spacing: -0.02em;
  }
  h4 {
    margin-top: calc(var(--spacing) * 10);
    margin-bottom: calc(var(--spacing) * 5);
    font-size: var(--text-xl);
    line-height: var(--text-xl--line-height);
    font-weight: var(--font-weight-semibold);
    color: var(--color-base-content);
    line-height: 1.4;
  }
  p {
    margin-block: calc(var(--spacing) * 6);
    color: color-mix(in srgb, var(--color-base-content) 90%, transparent);
    line-height: 1.8;
    font-size: 16px;
  }
  main ul {
    margin-bottom: calc(var(--spacing) * 8);
    list-style-type: none;
    padding-left: 0;
  }
  main ul li {
    position: relative;
    margin-bottom: calc(var(--spacing) * 4);
    padding-left: calc(var(--spacing) * 8);
    line-height: 1.8;
  }
  main ul li::before {
    content: "•";
    position: absolute;
    top: -0.1em;
    left: calc(var(--spacing) * 0);
    color: var(--color-primary);
    font-size: 1.2em;
    font-weight: normal;
  }
  main ol {
    margin-bottom: calc(var(--spacing) * 8);
    list-style-type: none;
    padding-left: 0;
    counter-reset: list-counter;
  }
  main ol li {
    position: relative;
    margin-bottom: calc(var(--spacing) * 5);
    padding-left: calc(var(--spacing) * 12);
    line-height: 1.8;
    counter-increment: list-counter;
  }
  main ol li::before {
    content: counter(list-counter);
    position: absolute;
    top: 0;
    left: 0;
    color: var(--color-primary-content);
    height: calc(var(--spacing) * 8);
    width: calc(var(--spacing) * 8);
    border-radius: calc(infinity * 1px);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    font-weight: var(--font-weight-semibold);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    min-width: 2rem;
    min-height: 2rem;
  }
  .footnotes {
    margin-top: calc(var(--spacing) * 16);
    padding-top: calc(var(--spacing) * 8);
    border-top-style: solid;
    border-top-width: 1px;
    border-color: color-mix(in srgb, var(--color-base-content) 20%, transparent);
    position: relative;
  }
  .footnotes::before {
    content: "Footnotes";
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    font-weight: var(--font-weight-semibold);
    letter-spacing: var(--tracking-wider);
    text-transform: uppercase;
    color: color-mix(in srgb, var(--color-base-content) 70%, transparent);
    position: absolute;
    top: -0.75rem;
    left: 0;
    background-color: var(--color-base-100);
    padding: 0 0.5rem;
  }
  .footnotes-list {
    margin-bottom: calc(var(--spacing) * 4);
    list-style-type: decimal;
    padding-left: 1.5rem;
  }
  .footnotes-list li {
    position: relative;
    margin-bottom: calc(var(--spacing) * 3);
    padding-left: 0.5rem;
    line-height: 1.7;
  }
  .footnotes-list li::before {
    content: none;
  }
  .footnotes-list li::marker {
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    font-weight: var(--font-weight-normal);
    color: var(--color-primary);
  }
  .footnotes-list li p {
    margin-block: calc(var(--spacing) * 0);
    display: inline;
    font-size: 0.9rem;
    color: color-mix(in srgb, var(--color-base-content) 80%, transparent);
  }
  .footnotes-list li a {
    color: color-mix(in srgb, var(--color-primary) 70%, transparent);
    &:hover {
      @media (hover: hover) {
        color: var(--color-primary);
      }
    }
    font-size: 0.85rem;
    text-decoration: none;
    margin-left: 0.25rem;
  }
  .footnote-reference {
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
    font-weight: var(--font-weight-medium);
    vertical-align: super;
    line-height: 0;
  }
  .footnote-reference a {
    color: color-mix(in srgb, var(--color-primary) 80%, transparent);
    &:hover {
      @media (hover: hover) {
        color: var(--color-primary);
      }
    }
    text-decoration: none;
    padding: 0 0.15rem;
  }
  a {
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    transition: all 200ms var(--default-transition-timing-function);
    text-decoration: none;
    position: relative;
  }
  main a {
    border-bottom: 1px solid transparent;
    transition: border-color 0.2s ease;
  }
  main a:hover {
    border-bottom-color: currentColor;
  }
  img {
    height: auto;
    width: 100%;
    border-radius: var(--radius-lg);
  }
  pre {
    margin-block: calc(var(--spacing) * 6);
    overflow-x: auto;
    border-radius: var(--radius-lg);
    padding: calc(var(--spacing) * 5);
    word-break: break-all;
    white-space: pre;
    position: relative;
  }
  pre code {
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    white-space: pre;
  }
  :not(pre) > code {
    line-height: var(--text-sm--line-height);
    border-style: solid;
    border-width: 1px;
  }
  blockquote {
    color: color-mix(in srgb, var(--color-base-content) 90%, transparent);
    border-left: 4px solid var(--color-primary);
    border-radius: 12px;
    margin: 30px 0;
    padding: 30px 30px 30px 40px;
    font-size: 18px;
    font-style: italic;
    font-weight: 400;
    line-height: 1.6;
    position: relative;
    box-shadow: 0 4px 16px #0000001a;
  }
  blockquote p {
    padding-block: calc(var(--spacing) * 0);
    font-size: var(--text-lg);
    line-height: var(--text-lg--line-height);
    margin: 0;
  }
  table {
    margin-block: calc(var(--spacing) * 8);
    display: table;
    width: 100%;
    overflow: hidden;
    border-radius: var(--radius-lg);
    background-color: color-mix(in srgb, var(--color-base-200) 30%, transparent);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  }
  th {
    border-bottom-style: solid;
    border-bottom-width: 2px;
    padding-inline: calc(var(--spacing) * 6);
    padding-block: calc(var(--spacing) * 4);
    font-weight: var(--font-weight-semibold);
    border-color: var(--color-primary);
    background-color: var(--color-base-200);
    color: var(--color-primary);
  }
  td {
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-color: color-mix(in srgb, var(--color-base-content) 10%, transparent);
    padding-inline: calc(var(--spacing) * 6);
    padding-block: calc(var(--spacing) * 4);
  }
  tr:hover {
    background-color: color-mix(in srgb, var(--color-base-content) 5%, transparent);
  }
  em {
    font-size: var(--text-base);
    line-height: var(--text-base--line-height);
    color: var(--color-primary);
    font-style: italic;
  }
}
@layer utilities {
  .modal {
    @layer daisyui.l1.l2.l3 {
      pointer-events: none;
      visibility: hidden;
      position: fixed;
      inset: calc(0.25rem * 0);
      margin: calc(0.25rem * 0);
      display: grid;
      height: 100%;
      max-height: none;
      width: 100%;
      max-width: none;
      align-items: center;
      justify-items: center;
      background-color: transparent;
      padding: calc(0.25rem * 0);
      color: inherit;
      transition: visibility 0.3s allow-discrete, background-color 0.3s ease-out, opacity 0.1s ease-out;
      overflow: clip;
      overscroll-behavior: contain;
      z-index: 999;
      scrollbar-gutter: auto;
      &::backdrop {
        display: none;
      }
    }
    @layer daisyui.l1.l2 {
      &.modal-open, &[open], &:target, .modal-toggle:checked + & {
        pointer-events: auto;
        visibility: visible;
        opacity: 100%;
        transition: visibility 0s allow-discrete, background-color 0.3s ease-out, opacity 0.1s ease-out;
        background-color: oklch(0% 0 0/ 0.4);
        .modal-box {
          translate: 0 0;
          scale: 1;
          opacity: 1;
        }
        :root:has(&) {
          --page-has-backdrop: 1;
          --page-overflow: hidden;
          --page-scroll-bg: var(--page-scroll-bg-on);
          --page-scroll-gutter: stable;
          --page-scroll-transition: var(--page-scroll-transition-on);
          animation: set-page-has-scroll forwards;
          animation-timeline: scroll();
        }
      }
      @starting-style {
        &.modal-open, &[open], &:target, .modal-toggle:checked + & {
          opacity: 0%;
        }
      }
    }
  }
  .drawer-side {
    :where(&) {
      @layer daisyui.l1.l2.l3 {
        overflow-x: hidden;
        overflow-y: hidden;
      }
    }
    @layer daisyui.l1.l2.l3 {
      pointer-events: none;
      visibility: hidden;
      position: fixed;
      inset-inline-start: calc(0.25rem * 0);
      top: calc(0.25rem * 0);
      z-index: 10;
      grid-column-start: 1;
      grid-row-start: 1;
      display: grid;
      width: 100%;
      grid-template-columns: repeat(1, minmax(0, 1fr));
      grid-template-rows: repeat(1, minmax(0, 1fr));
      align-items: flex-start;
      justify-items: start;
      overscroll-behavior: contain;
      background-color: transparent;
      opacity: 0%;
      transition: opacity 0.2s ease-out 0.1s allow-discrete, visibility 0.3s ease-out 0.1s allow-discrete;
      height: 100vh;
      height: 100dvh;
      > .drawer-overlay {
        position: sticky;
        top: calc(0.25rem * 0);
        cursor: pointer;
        place-self: stretch;
        background-color: oklch(0% 0 0 / 40%);
      }
      > * {
        grid-column-start: 1;
        grid-row-start: 1;
      }
      > :not(.drawer-overlay) {
        will-change: transform;
        transition: translate 0.3s ease-out, width 0.2s ease-out;
        translate: -100%;
        [dir="rtl"] & {
          translate: 100%;
        }
      }
    }
  }
  .drawer-toggle {
    @layer daisyui.l1.l2.l3 {
      position: fixed;
      height: calc(0.25rem * 0);
      width: calc(0.25rem * 0);
      appearance: none;
      opacity: 0%;
      :where(&:checked ~ .drawer-side) {
        scrollbar-color: color-mix(in srgb, currentColor 35%, #0000) oklch(0 0 0 / calc(var(--page-has-backdrop, 0) * 0.4));
      }
      :where(:root:has(&:checked)) {
        --page-has-backdrop: 1;
        --page-overflow: hidden;
        --page-scroll-bg: var(--page-scroll-bg-on);
        --page-scroll-gutter: stable;
        --page-scroll-transition: var(--page-scroll-transition-on);
        animation: set-page-has-scroll forwards;
        animation-timeline: scroll();
      }
    }
    @layer daisyui.l1.l2 {
      :where(&:checked ~ .drawer-side) {
        pointer-events: auto;
        visibility: visible;
        overflow-y: auto;
        opacity: 100%;
        > :not(.drawer-overlay) {
          translate: 0%;
        }
      }
      &:focus-visible ~ .drawer-content label.drawer-button {
        outline: 2px solid;
        outline-offset: 2px;
      }
    }
  }
  .menu {
    @layer daisyui.l1.l2.l3 {
      display: flex;
      width: fit-content;
      flex-direction: column;
      flex-wrap: wrap;
      padding: calc(0.25rem * 2);
      --menu-active-fg: var(--color-neutral-content);
      --menu-active-bg: var(--color-neutral);
      font-size: 0.875rem;
      :where(li ul) {
        position: relative;
        margin-inline-start: calc(0.25rem * 4);
        padding-inline-start: calc(0.25rem * 2);
        white-space: nowrap;
        &:before {
          position: absolute;
          inset-inline-start: calc(0.25rem * 0);
          top: calc(0.25rem * 3);
          bottom: calc(0.25rem * 3);
          background-color: var(--color-base-content);
          opacity: 10%;
          width: var(--border);
          content: "";
        }
      }
      :where(li > .menu-dropdown:not(.menu-dropdown-show)) {
        display: none;
      }
      :where(li:not(.menu-title) > *:not(ul, details, .menu-title, .btn)), :where(li:not(.menu-title) > details > summary:not(.menu-title)) {
        display: grid;
        grid-auto-flow: column;
        align-content: flex-start;
        align-items: center;
        gap: calc(0.25rem * 2);
        border-radius: var(--radius-field);
        padding-inline: calc(0.25rem * 3);
        padding-block: calc(0.25rem * 1.5);
        text-align: start;
        transition-property: color, background-color, box-shadow;
        transition-duration: 0.2s;
        transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
        grid-auto-columns: minmax(auto, max-content) auto max-content;
        text-wrap: balance;
        user-select: none;
      }
      :where(li > details > summary) {
        outline-style: none;
        @media (forced-colors: active) {
          outline: 2px solid transparent;
          outline-offset: 2px;
        }
        &::-webkit-details-marker {
          display: none;
        }
      }
      :where(li > details > summary), :where(li > .menu-dropdown-toggle) {
        &:after {
          justify-self: flex-end;
          display: block;
          height: 0.375rem;
          width: 0.375rem;
          rotate: -135deg;
          translate: 0 -1px;
          transition-property: rotate, translate;
          transition-duration: 0.2s;
          content: "";
          transform-origin: 50% 50%;
          box-shadow: 2px 2px inset;
          pointer-events: none;
        }
      }
      details {
        overflow: hidden;
        interpolate-size: allow-keywords;
      }
      details::details-content {
        block-size: 0;
        @media (prefers-reduced-motion: no-preference) {
          transition-behavior: allow-discrete;
          transition-property: block-size, content-visibility;
          transition-duration: 0.2s;
          transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
        }
      }
      details[open]::details-content {
        block-size: auto;
      }
      :where(li > details[open] > summary):after, :where(li > .menu-dropdown-toggle.menu-dropdown-show):after {
        rotate: 45deg;
        translate: 0 1px;
      }
      :where( li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title), li:not(.menu-title, .disabled) > details > summary:not(.menu-title) ):not(.menu-active, :active, .btn) {
        &.menu-focus, &:focus-visible {
          cursor: pointer;
          background-color: color-mix(in srgb, var(--color-base-content) 10%, transparent);
          color: var(--color-base-content);
          outline-style: none;
          @media (forced-colors: active) {
            outline: 2px solid transparent;
            outline-offset: 2px;
          }
        }
      }
      :where( li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title):not(.menu-active, :active, .btn):hover, li:not(.menu-title, .disabled) > details > summary:not(.menu-title):not(.menu-active, :active, .btn):hover ) {
        cursor: pointer;
        background-color: color-mix(in srgb, var(--color-base-content) 10%, transparent);
        outline-style: none;
        @media (forced-colors: active) {
          outline: 2px solid transparent;
          outline-offset: 2px;
        }
        box-shadow: 0 1px oklch(0% 0 0 / 0.01) inset, 0 -1px oklch(100% 0 0 / 0.01) inset;
      }
      :where(li:empty) {
        background-color: var(--color-base-content);
        opacity: 10%;
        margin: 0.5rem 1rem;
        height: 1px;
      }
      :where(li) {
        position: relative;
        display: flex;
        flex-shrink: 0;
        flex-direction: column;
        flex-wrap: wrap;
        align-items: stretch;
        .badge {
          justify-self: flex-end;
        }
        & > *:not(ul, .menu-title, details, .btn):active, & > *:not(ul, .menu-title, details, .btn).menu-active, & > details > summary:active {
          outline-style: none;
          @media (forced-colors: active) {
            outline: 2px solid transparent;
            outline-offset: 2px;
          }
          color: var(--menu-active-fg);
          background-color: var(--menu-active-bg);
          background-size: auto, calc(var(--noise) * 100%);
          background-image: none, var(--fx-noise);
          &:not(&:active) {
            box-shadow: 0 2px calc(var(--depth) * 3px) -2px var(--menu-active-bg);
          }
        }
        &.menu-disabled {
          pointer-events: none;
          color: color-mix(in srgb, var(--color-base-content) 20%, transparent);
        }
      }
    }
  }
  .btn {
    :where(&) {
      @layer daisyui.l1.l2.l3 {
        width: unset;
      }
    }
    @layer daisyui.l1.l2.l3 {
      display: inline-flex;
      flex-shrink: 0;
      cursor: pointer;
      flex-wrap: nowrap;
      align-items: center;
      justify-content: center;
      gap: calc(0.25rem * 1.5);
      text-align: center;
      vertical-align: middle;
      outline-offset: 2px;
      webkit-user-select: none;
      user-select: none;
      padding-inline: var(--btn-p);
      color: var(--btn-fg);
      height: var(--size);
      font-size: var(--fontsize, 0.875rem);
      font-weight: 600;
      outline-color: var(--btn-color, var(--color-base-content));
      transition-property: color, background-color, border-color, box-shadow;
      transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
      transition-duration: 0.2s;
      border-start-start-radius: var(--join-ss, var(--radius-field));
      border-start-end-radius: var(--join-se, var(--radius-field));
      border-end-start-radius: var(--join-es, var(--radius-field));
      border-end-end-radius: var(--join-ee, var(--radius-field));
      background-color: var(--btn-bg);
      background-size: auto, calc(var(--noise) * 100%);
      background-image: none, var(--btn-noise);
      border-width: var(--border);
      border-style: solid;
      border-color: var(--btn-border);
      text-shadow: 0 0.5px oklch(100% 0 0 / calc(var(--depth) * 0.15));
      touch-action: manipulation;
      box-shadow: 0 0.5px 0 0.5px oklch(100% 0 0 / calc(var(--depth) * 6%)) inset, var(--btn-shadow);
      --size: calc(var(--size-field, 0.25rem) * 10);
      --btn-bg: var(--btn-color, var(--color-base-200));
      --btn-fg: var(--color-base-content);
      --btn-p: 1rem;
      --btn-border: color-mix(in srgb, var(--btn-bg), #000 calc(var(--depth) * 5%));
      --btn-shadow: 0 3px 2px -2px color-mix(in srgb, var(--btn-bg) calc(var(--depth) * 30%), #0000),
      0 4px 3px -2px color-mix(in srgb, var(--btn-bg) calc(var(--depth) * 30%), #0000);
      --btn-noise: var(--fx-noise);
      @media (hover: hover) {
        &:hover {
          --btn-bg: color-mix(in srgb, var(--btn-color, var(--color-base-200)), #000 7%);
        }
      }
      &:focus-visible, &:has(:focus-visible) {
        outline-width: 2px;
        outline-style: solid;
        isolation: isolate;
      }
      &:active:not(.btn-active) {
        translate: 0 0.5px;
        --btn-bg: color-mix(in srgb, var(--btn-color, var(--color-base-200)), #000 5%);
        --btn-border: color-mix(in srgb, var(--btn-color, var(--color-base-200)), #000 7%);
        --btn-shadow: 0 0 0 0 oklch(0% 0 0/0), 0 0 0 0 oklch(0% 0 0/0);
      }
      &:is(input[type="checkbox"], input[type="radio"]) {
        appearance: none;
        &[aria-label]::after {
          content: attr(aria-label);
        }
      }
      &:where(input:checked:not(.filter .btn)) {
        --btn-color: var(--color-primary);
        --btn-fg: var(--color-primary-content);
        isolation: isolate;
      }
    }
    &:disabled, &[disabled] {
      @layer daisyui.l1.l2 {
        &:not(.btn-link, .btn-ghost) {
          background-color: color-mix(in srgb, var(--color-base-content) 10%, transparent);
          box-shadow: none;
        }
        pointer-events: none;
        --btn-border: #0000;
        --btn-noise: none;
        --btn-fg: color-mix(in srgb, var(--color-base-content) 20%, #0000);
      }
    }
  }
  .navbar {
    @layer daisyui.l1.l2.l3 {
      display: flex;
      width: 100%;
      align-items: center;
      padding: 0.5rem;
      min-height: 4rem;
    }
    :where(&) {
      @layer daisyui.l1.l2 {
        position: relative;
      }
    }
  }
  .drawer {
    @layer daisyui.l1.l2.l3 {
      position: relative;
      display: grid;
      width: 100%;
      grid-auto-columns: max-content auto;
    }
  }
  .modal-toggle {
    @layer daisyui.l1.l2.l3 {
      position: fixed;
      height: calc(0.25rem * 0);
      width: calc(0.25rem * 0);
      appearance: none;
      opacity: 0%;
    }
  }
  .modal-box {
    @layer daisyui.l1.l2.l3 {
      grid-column-start: 1;
      grid-row-start: 1;
      max-height: 100vh;
      width: calc(11/12 * 100%);
      max-width: 32rem;
      background-color: var(--color-base-100);
      padding: calc(0.25rem * 6);
      transition: translate 0.3s ease-out, scale 0.3s ease-out, opacity 0.2s ease-out 0.05s, box-shadow 0.3s ease-out;
      border-top-left-radius: var(--modal-tl, var(--radius-box));
      border-top-right-radius: var(--modal-tr, var(--radius-box));
      border-bottom-left-radius: var(--modal-bl, var(--radius-box));
      border-bottom-right-radius: var(--modal-br, var(--radius-box));
      scale: 95%;
      opacity: 0;
      box-shadow: oklch(0% 0 0/ 0.25) 0px 25px 50px -12px;
      overflow-y: auto;
      overscroll-behavior: contain;
    }
  }
  .drawer-content {
    @layer daisyui.l1.l2.l3 {
      grid-column-start: 2;
      grid-row-start: 1;
      min-width: calc(0.25rem * 0);
    }
  }
  .drawer-end {
    @layer daisyui.l1.l2 {
      grid-auto-columns: auto max-content;
      > .drawer-toggle {
        ~ .drawer-content {
          grid-column-start: 1;
        }
        ~ .drawer-side {
          grid-column-start: 2;
          justify-items: end;
        }
        ~ .drawer-side > :not(.drawer-overlay) {
          translate: 100%;
          [dir="rtl"] & {
            translate: -100%;
          }
        }
        &:checked ~ .drawer-side > :not(.drawer-overlay) {
          translate: 0%;
        }
      }
    }
  }
  .kbd {
    box-shadow: none;
    @layer daisyui.l1.l2.l3 {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: var(--radius-field);
      background-color: var(--color-base-200);
      vertical-align: middle;
      padding-inline: 0.5em;
      border: var(--border) solid color-mix(in srgb, var(--color-base-content) 20%, #0000);
      border-bottom: calc(var(--border) + 1px) solid color-mix(in srgb, var(--color-base-content) 20%, #0000);
      --size: calc(var(--size-selector, 0.25rem) * 6);
      font-size: 0.875rem;
      height: var(--size);
      min-width: var(--size);
    }
  }
  .modal-middle {
    @layer daisyui.l1.l2 {
      place-items: center;
      .modal-box {
        height: auto;
        width: calc(11/12 * 100%);
        max-width: 32rem;
        max-height: calc(100vh - 5em);
        translate: 0 2%;
        scale: 98%;
        --modal-tl: var(--radius-box);
        --modal-tr: var(--radius-box);
        --modal-bl: var(--radius-box);
        --modal-br: var(--radius-box);
      }
    }
  }
  .btn-circle {
    @layer daisyui.l1.l2 {
      border-radius: calc(infinity * 1px);
      padding-inline: calc(0.25rem * 0);
      width: var(--size);
      height: var(--size);
    }
  }
  .btn-square {
    @layer daisyui.l1.l2 {
      padding-inline: calc(0.25rem * 0);
      width: var(--size);
      height: var(--size);
    }
  }
  .menu-sm {
    @layer daisyui.l1.l2 {
      :where(li:not(.menu-title) > *:not(ul, details, .menu-title)), :where(li:not(.menu-title) > details > summary:not(.menu-title)) {
        border-radius: var(--radius-field);
        padding-inline: calc(0.25rem * 2.5);
        padding-block: calc(0.25rem * 1);
        font-size: 0.75rem;
      }
      .menu-title {
        padding-inline: calc(0.25rem * 3);
        padding-block: calc(0.25rem * 2);
      }
    }
  }
  .kbd-xs {
    @layer daisyui.l1.l2 {
      --size: calc(var(--size-selector, 0.25rem) * 4);
      font-size: 0.625rem;
    }
  }
  .btn-ghost {
    @layer daisyui.l1 {
      &:not(.btn-active, :hover, :active:focus, :focus-visible, input:checked:not(.filter .btn)) {
        --btn-shadow: "";
        --btn-bg: #0000;
        --btn-border: #0000;
        --btn-noise: none;
        &:not(:disabled, [disabled], .btn-disabled) {
          outline-color: currentcolor;
          --btn-fg: var(--btn-color, currentColor);
        }
      }
      @media (hover: none) {
        &:not(.btn-active, :active, :focus-visible, input:checked:not(.filter .btn)):hover {
          outline-color: currentcolor;
          --btn-shadow: "";
          --btn-bg: #0000;
          --btn-fg: var(--btn-color, currentColor);
          --btn-border: #0000;
          --btn-noise: none;
        }
      }
    }
  }
  .btn-sm {
    @layer daisyui.l1.l2 {
      --fontsize: 0.75rem;
      --btn-p: 0.75rem;
      --size: calc(var(--size-field, 0.25rem) * 8);
    }
  }
  @media (min-width: 1024px) {
    .lg\:menu-horizontal {
      @layer daisyui.l1.l2 {
        display: inline-flex;
        flex-direction: row;
        & > li:not(.menu-title) > details {
          & > ul {
            position: absolute;
            margin-inline-start: calc(0.25rem * 0);
            margin-top: calc(0.25rem * 4);
            transform-origin: top;
            border-radius: var(--radius-box);
            background-color: var(--color-base-100);
            padding-block: calc(0.25rem * 2);
            padding-inline-end: calc(0.25rem * 2);
            opacity: 0%;
            scale: 95%;
            box-shadow: 0 1px 3px 0 oklch(0% 0 0/0.1), 0 1px 2px -1px oklch(0% 0 0/0.1);
            @media (prefers-reduced-motion: no-preference) {
              @starting-style {
                scale: 95%;
                opacity: 0;
              }
              animation: menu 0.2s;
              transition-property: opacity, scale, display;
              transition-behavior: allow-discrete;
              transition-duration: 0.2s;
              transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
            }
          }
          &[open] > ul {
            opacity: 100%;
            scale: 100%;
          }
        }
        & > li > details > ul {
          &:before {
            content: none;
          }
        }
      }
    }
    .lg\:drawer-open {
      @layer daisyui.l1.l2.l3 {
        > .drawer-toggle:checked {
          ~ .drawer-side {
            scrollbar-color: revert-layer;
          }
          :root:has(&) {
            --page-overflow: revert-layer;
            --page-scroll-gutter: revert-layer;
            --page-scroll-bg: revert-layer;
            --page-scroll-transition: revert-layer;
            --page-has-backdrop: revert-layer;
            animation: revert-layer;
            animation-timeline: revert-layer;
          }
        }
      }
      @layer daisyui.l1.l2 {
        > .drawer-side {
          overflow-y: auto;
        }
        > .drawer-toggle {
          display: none;
          ~ .drawer-side {
            pointer-events: auto;
            visibility: visible;
            position: sticky;
            display: block;
            width: auto;
            overscroll-behavior: auto;
            opacity: 100%;
            > .drawer-overlay {
              cursor: default;
              background-color: transparent;
            }
          }
          &:checked ~ .drawer-side {
            pointer-events: auto;
            visibility: visible;
          }
        }
      }
      @layer daisyui.l1 {
        > .drawer-toggle ~ .drawer-side > :not(.drawer-overlay) {
          translate: 0%;
          [dir="rtl"] & {
            translate: 0%;
          }
        }
      }
    }
  }
}
@keyframes set-page-has-scroll {
  0%, to {
    --page-has-scroll: 1;
  }
}
@keyframes menu {
  0% {
    opacity: 0;
  }
}
[data-theme="goyo-dark"] h1 {
  background-image: linear-gradient(135deg, #9ca3af 0%, #6b7280 100%);
}
[data-theme="goyo-light"] h1 {
  background-image: linear-gradient(135deg, #1f2937 0%, #111827 100%);
}
[data-theme="goyo-dark"] main ul li::before {
  color: #9ca3af;
}
[data-theme="goyo-light"] main ul li::before {
  color: #64748b;
}
[data-theme="goyo-dark"] pre {
  background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
  border: 1px solid rgba(100, 116, 139, 0.2);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
}
[data-theme="goyo-light"] pre {
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
  border: 1px solid rgba(100, 116, 139, 0.15);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
}
[data-theme="goyo-dark"] pre code {
  color: #e5e7eb;
}
[data-theme="goyo-light"] pre code {
  color: #1e293b;
}
[data-theme="goyo-dark"] :not(pre) > code {
  background: rgba(100, 116, 139, 0.15);
  color: #9ca3af;
  border: 1px solid rgba(100, 116, 139, 0.3);
}
[data-theme="goyo-light"] :not(pre) > code {
  background: rgba(100, 116, 139, 0.08);
  color: #475569;
  border: 1px solid rgba(100, 116, 139, 0.2);
}
[data-theme="goyo-dark"] .hero-title {
  background: linear-gradient(135deg, #d1d5db 0%, #9ca3af 50%, #6b7280 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}
[data-theme="goyo-light"] .hero-title {
  background: linear-gradient(135deg, #1f2937 0%, #111827 50%, #030712 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}
[data-theme="goyo-dark"] .hero-badge {
  color: #64748b;
  background: #64748b33;
  border: 1px solid #64748b4d;
}
[data-theme="goyo-light"] .hero-badge {
  color: #475569;
  background: #47556926;
  border: 1px solid #47556940;
}
[data-theme="goyo-dark"] .hero-description {
  color: #9ca3af;
}
[data-theme="goyo-light"] .hero-description {
  color: #374151;
}
[data-theme="goyo-dark"] .hero-cta-secondary {
  color: #d1d5db;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  background: #ffffff0d;
  border: 1px solid #64748b33;
}
[data-theme="goyo-light"] .hero-cta-secondary {
  color: #374151;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  background: #fffc;
  border: 1px solid #94a3b84d;
  box-shadow: 0 2px 8px #0000001a;
}
[data-theme="goyo-dark"] .hero-cta-secondary:hover {
  background: #ffffff1a;
}
[data-theme="goyo-light"] .hero-cta-secondary:hover {
  background: #f8fafcf2;
  border-color: #94a3b866;
  box-shadow: 0 4px 12px #00000026;
}
[data-theme="goyo-dark"] .feature-card {
  background: #1e293b4d;
  border: 1px solid #64748b4d;
}
[data-theme="goyo-light"] .feature-card {
  background: #f8fafccc;
  border: 1px solid #cbd5e166;
  box-shadow: 0 4px 16px #0000000d;
}
[data-theme="goyo-dark"] .feature-icon-bg {
  background: linear-gradient(135deg,#64748b33,#94a3b833);
  border: 1px solid #64748b4d;
}
[data-theme="goyo-dark"] .feature-icon {
  color: #64748b;
}
[data-theme="goyo-dark"] .btn-final-cta-section {
  color: #fff;
  background: linear-gradient(135deg,#64748b,#6b7280);
  box-shadow: 0 4px 16px #64748b40;
}
[data-theme="goyo-light"] .btn-final-cta-section {
  color: #fff;
  background: linear-gradient(135deg,#374151,#1f2937);
  box-shadow: 0 4px 16px #37415140;
}
[data-theme="goyo-dark"] .copy-heading-link-button {
  color: #9ca3af;
  background: #9ca3af26;
  border: 1px solid #9ca3af33;
}
[data-theme="goyo-light"] .copy-heading-link-button {
  color: #6b7280;
  background: #6b72801a;
  border: 1px solid #6b728033;
}
[data-theme="goyo-dark"] .copy-heading-link-button:hover {
  color: #e5e7eb;
  background: #9ca3af40;
  border-color: #9ca3af66;
  transform: scale(1.05);
}
[data-theme="goyo-light"] .copy-heading-link-button:hover {
  color: #374151;
  background: #6b728033;
  border-color: #6b72804d;
  transform: scale(1.05);
}
main ol li::before {
  background: linear-gradient(135deg, rgb(156, 163, 175), rgb(107, 114, 128));
}
blockquote {
  border-left-color: #9ca3af;
  background: linear-gradient(135deg, #64748b1a 0%, #94a3b81a 100%);
}
th {
  border-color: #9ca3af;
  background: linear-gradient(135deg, rgba(100, 116, 139, 0.15) 0%, rgba(148, 163, 184, 0.15) 100%);
  color: #9ca3af;
}
.footnotes {
  border-top: 1px solid rgba(100, 116, 139, 0.2);
}
[data-theme="goyo-dark"] .footnotes::before {
  background: linear-gradient(135deg,#0f172a 0%,#1e293b 100%);
}
[data-theme="goyo-light"] .footnotes::before {
  color: #64748b;
  background: linear-gradient(135deg,#fff 0%,#f8fafc 100%);
}
[data-theme="goyo-dark"] .footnotes-list li::marker {
  color: #9ca3af;
}
[data-theme="goyo-light"] .footnotes-list li::marker {
  color: #64748b;
}
@layer components {
  .icon {
    display: inline-flex;
    align-items: center;
    color: color-mix(in srgb, var(--color-base-content) 80%, transparent);
  }
  .icon svg {
    width: 1em;
    height: 1em;
    display: inline-block;
    vertical-align: -0.125em;
    fill: currentColor;
    stroke: currentColor;
  }
}
.toc-link.active {
  font-weight: var(--font-weight-semibold);
  color: var(--color-base-content);
}
.menu a {
  color: color-mix(in srgb, var(--color-base-content) 80%, transparent);
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke;
  transition-duration: 200ms;
  transition-timing-function: var(--default-transition-timing-function);
}
@media (hover: hover) {
  .menu:not(.sidebar) a:hover {
    background-color: color-mix(in srgb, var(--color-base-content) 10%, transparent);
    color: var(--color-base-content);
    text-decoration-line: none;
  }
}
h1, h2, h3, h4, h5, h6 {
  position: relative;
}
.copy-heading-link-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
  cursor: pointer;
  border-radius: 0.375rem;
  text-decoration: none !important;
  margin-left: 0.5rem;
  vertical-align: middle;
  border-style: solid;
  border-width: 1px;
  border-color: color-mix(in srgb, var(--color-base-content) 20%, transparent);
  background-color: color-mix(in srgb, var(--color-base-content) 10%, transparent);
  color: color-mix(in srgb, var(--color-base-content) 60%, transparent);
}
.copy-heading-link-button:hover {
  border-color: color-mix(in srgb, var(--color-base-content) 30%, transparent);
  background-color: color-mix(in srgb, var(--color-base-content) 20%, transparent);
  color: var(--color-base-content);
  transform: scale(1.05);
}
.copy-heading-link-button svg {
  width: 1rem;
  height: 1rem;
}
h1:hover .copy-heading-link-button, h2:hover .copy-heading-link-button, h3:hover .copy-heading-link-button, h4:hover .copy-heading-link-button, h5:hover .copy-heading-link-button, h6:hover .copy-heading-link-button {
  opacity: 1;
  visibility: visible;
}
.nav-button {
  display: block;
  width: 100%;
  border-radius: var(--radius-xl);
  padding: calc(var(--spacing) * 8);
  transition: all 500ms var(--ease-out);
  color: var(--color-base-content);
  text-decoration-line: none;
  background: linear-gradient(135deg, #64748b14 0%, #94a3b814 100%);
  border: 1px solid #64748b33;
  min-height: 6rem;
}
.nav-button:focus {
  outline: none;
  border-color: color-mix(in srgb, var(--color-primary) 50%, transparent);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-primary) 30%, transparent);
}
.nav-button:hover {
  border-color: #64748b66;
  box-shadow: 0 8px 25px -5px #0003;
}
.nav-button-content {
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: center;
  gap: calc(var(--spacing) * 3);
}
.nav-button-direction {
  display: flex;
  align-items: center;
  gap: calc(var(--spacing) * 3);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-semibold);
  color: #9ca3af;
}
.nav-button-title {
  font-size: var(--text-xl);
  line-height: var(--leading-tight);
  font-weight: var(--font-weight-bold);
  color: var(--color-base-content);
}
.nav-button-next .nav-button-content {
  align-items: flex-end;
}
.nav-button-next .nav-button-direction {
  flex-direction: row-reverse;
}
.nav-button-next .nav-button-title {
  text-align: right;
}
.hero-badge {
  border-style: solid;
  border-width: 1px;
  border-color: color-mix(in srgb, var(--color-base-content) 20%, transparent);
  background-color: color-mix(in srgb, var(--color-base-300) 50%, transparent);
  color: color-mix(in srgb, var(--color-base-content) 70%, transparent);
}
.hero-title {
  background-image: linear-gradient(in oklab to bottom right,
    var(--color-base-content),
    color-mix(in srgb, var(--color-base-content) 80%, transparent),
    color-mix(in srgb, var(--color-base-content) 50%, transparent));
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}
.hero-description {
  color: color-mix(in srgb, var(--color-base-content) 70%, transparent);
}
.feature-card {
  border-style: solid;
  border-width: 1px;
  border-color: color-mix(in srgb, var(--color-base-content) 10%, transparent);
  background-color: color-mix(in srgb, var(--color-base-200) 50%, transparent);
}
.feature-icon-bg {
  border: 1px solid color-mix(in srgb, var(--color-primary) 20%, transparent);
}
.feature-icon {
  color: var(--color-primary);
}
.feature-title {
  color: var(--color-base-content);
}
.feature-description {
  color: color-mix(in srgb, var(--color-base-content) 70%, transparent);
}
.prev-nav-item:empty, .next-nav-item:empty {
  display: none;
}
.search-input::-webkit-search-cancel-button {
  appearance: none;
}
.search-results-container {
  scrollbar-width: thin;
  scrollbar-color: rgb(17 24 39 / 20%) transparent;
}
.search-results-container::-webkit-scrollbar {
  width: 6px;
}
.search-results-container::-webkit-scrollbar-track {
  background: transparent;
}
.search-results-container::-webkit-scrollbar-thumb {
  background-color: color-mix(in srgb, var(--color-base-content) 20%, transparent);
  border-radius: 3px;
}
.search-results-container::-webkit-scrollbar-thumb:hover {
  background-color: color-mix(in srgb, var(--color-base-content) 40%, transparent);
}
.search-result-item {
  list-style-type: none;
}
.search-result-link {
  display: block;
  padding: 0.75rem 1rem;
  border-radius: var(--radius-lg);
  border: 1px solid color-mix(in srgb, var(--color-gray-500) 15%, transparent);
  cursor: pointer;
  text-decoration: none;
  transition: background-color 150ms;
}
.search-result-link:hover {
  background-color: color-mix(in srgb, var(--color-base-200) 50%, transparent);
}
.search-result-link.search-result-selected {
  border-color: color-mix(in srgb, var(--color-primary) 50%, transparent);
}
.search-result-row {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}
.search-result-icon,
.search-result-arrow {
  flex-shrink: 0;
}
.search-result-icon {
  margin-top: 0.25rem;
  color: color-mix(in srgb, var(--color-base-content) 50%, transparent);
}
.search-result-icon svg,
.search-result-arrow svg {
  width: 1rem;
  height: 1rem;
}
.search-result-arrow {
  opacity: 0;
  color: color-mix(in srgb, var(--color-base-content) 40%, transparent);
  transition: opacity 150ms;
}
.search-result-link:hover .search-result-arrow,
.search-result-link.search-result-selected .search-result-arrow {
  opacity: 1;
}
.search-result-body {
  flex: 1;
  min-width: 0;
}
.search-result-title {
  margin-bottom: 0.25rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-base-content);
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.search-result-excerpt {
  font-size: 0.75rem;
  color: color-mix(in srgb, var(--color-base-content) 60%, transparent);
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.search-result-excerpt b {
  font-weight: 600;
  color: var(--color-primary);
}
.search-footer {
  background-color: color-mix(in srgb, var(--color-base-200) 50%, transparent);
}
.modal-box {
  border: 1px solid color-mix(in srgb, var(--color-base-content) 10%, transparent);
  background-color: color-mix(in srgb, var(--color-base-100) 90%, transparent);
  -webkit-backdrop-filter: blur(var(--blur-sm));
  backdrop-filter: blur(var(--blur-sm));
}
.modal.modal-open .modal-box {
  animation: searchModalSlideIn 0.2s ease-out;
}
@keyframes searchModalSlideIn {
  from {
    opacity: 0;
    transform: scale(0.95) translateY(-20px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}
.btn-ghost:hover {
  background-color: color-mix(in srgb, var(--color-base-content) 10%, transparent);
}
@media (max-width: 768px) {
  .nav-button {
    padding: calc(var(--spacing) * 6);
    min-height: 5rem;
  }
  .nav-button-title {
    font-size: var(--text-lg);
    line-height: var(--text-lg--line-height);
  }
}