/* RobertDeVore.com v1.0.2; generated by scripts/bundle_css.py. */
/* source: assets/css/sitekit/reset.css */
@layer reset { *, *::before, *::after { box-sizing: border-box; } html { text-size-adjust: 100%; } body { margin: 0; min-block-size: 100vh; } img, svg, video { display: block; max-inline-size: 100%; } button, input, textarea, select { font: inherit; } table { border-collapse: collapse; inline-size: 100%; } }
/* source: assets/css/sitekit/tokens.css */
@layer tokens {
  :root {
    --sk-color-black: #060606;
    --sk-color-white: #ffffff;
    --sk-color-paper: #f9f9f9;
    --sk-color-ink: #060606;
    --sk-color-gray-50: #f9f9f9;
    --sk-color-gray-100: #eeeeee;
    --sk-color-gray-300: #b8b8b8;
    --sk-color-gray-500: #5d5d5d;
    --sk-color-gray-700: #2b2b2b;
    --sk-color-gray-900: #111111;
    --sk-color-blue-600: #1646d2;
    --sk-color-green-600: #0f7a3b;
    --sk-color-yellow-500: #b47805;
    --sk-color-red-600: #b21d1d;
    --sk-color-cyan-600: #0b7285;
    --sk-font-sans: "SFMono-Regular", "Cascadia Code", "Roboto Mono", "Liberation Mono", Menlo, Consolas, monospace;
    --sk-font-mono: "Departure Mono", "SFMono-Regular", "Cascadia Code", "Roboto Mono", "Liberation Mono", Menlo, Consolas, monospace;
    --sk-type-size-xs: 0.75rem;
    --sk-type-size-sm: 0.875rem;
    --sk-type-size-md: 1rem;
    --sk-type-size-lg: 1.125rem;
    --sk-type-size-xl: 1.375rem;
    --sk-type-size-2xl: 1.75rem;
    --sk-type-size-3xl: 2.25rem;
    --sk-type-size-4xl: 3rem;
    --sk-type-size-5xl: 5.375rem;
    --sk-type-line-tight: 1.1;
    --sk-type-line-normal: 1.5;
    --sk-type-line-loose: 1.7;
    --sk-type-weight-regular: 400;
    --sk-type-weight-medium: 520;
    --sk-type-weight-bold: 700;
    --sk-space-0: 0;
    --sk-space-1: 0.25rem;
    --sk-space-2: 0.5rem;
    --sk-space-3: 0.75rem;
    --sk-space-4: 1rem;
    --sk-space-5: 1.25rem;
    --sk-space-6: 1.5rem;
    --sk-space-8: 2rem;
    --sk-space-10: 2.5rem;
    --sk-space-12: 3rem;
    --sk-space-16: 4rem;
    --sk-space-20: 5rem;
    --sk-space-24: 6rem;
    --sk-size-content-sm: 42rem;
    --sk-size-content-md: 64rem;
    --sk-size-content-lg: 78rem;
    --sk-size-content-xl: 92rem;
    --sk-size-control-sm: 2rem;
    --sk-size-control-md: 2.5rem;
    --sk-size-control-lg: 3rem;
    --sk-border-0: 0;
    --sk-border-1: 1px;
    --sk-border-2: 2px;
    --sk-border-heavy: 3px;
    --sk-radius-0: 0;
    --sk-radius-1: 2px;
    --sk-radius-2: 4px;
    --sk-radius-3: 6px;
    --sk-shadow-none: none;
    --sk-shadow-hard: none;
    --sk-shadow-hard-sm: none;
    --sk-motion-fast: 120ms;
    --sk-motion-base: 180ms;
    --sk-motion-slow: 260ms;
    --sk-motion-ease: cubic-bezier(.2,0,0,1);
    --sk-z-base: 0;
    --sk-z-dropdown: 20;
    --sk-z-sticky: 30;
    --sk-z-modal: 80;
    --sk-z-toast: 90;
    --sk-focus-width: 2px;
    --sk-focus-offset: 3px;
    --sk-breakpoint-sm: 36rem;
    --sk-breakpoint-md: 48rem;
    --sk-breakpoint-lg: 64rem;
    --sk-breakpoint-xl: 80rem;
    --sk-surface-page: var(--sk-color-paper);
    --sk-surface-raised: var(--sk-color-white);
    --sk-surface-card: var(--sk-color-white);
    --sk-surface-inverse: var(--sk-color-black);
    --sk-surface-subtle: var(--sk-color-white);
    --sk-surface-accent: var(--sk-color-ink);
    --sk-text-primary: var(--sk-color-black);
    --sk-text-secondary: var(--sk-color-gray-700);
    --sk-text-muted: var(--sk-color-gray-500);
    --sk-text-inverse: var(--sk-color-white);
    --sk-text-link: var(--sk-color-black);
    --sk-text-danger: var(--sk-color-red-600);
    --sk-text-success: var(--sk-color-green-600);
    --sk-text-warning: var(--sk-color-yellow-500);
    --sk-action-primary: var(--sk-color-black);
    --sk-action-primary-text: var(--sk-color-white);
    --sk-action-secondary: var(--sk-color-white);
    --sk-action-secondary-text: var(--sk-color-black);
    --sk-action-danger: var(--sk-color-red-600);
    --sk-action-danger-text: var(--sk-color-white);
    --sk-action-ghost: transparent;
    --sk-border-default: var(--sk-color-black);
    --sk-border-subtle: var(--sk-color-gray-300);
    --sk-border-strong: var(--sk-color-black);
    --sk-border-inverse: var(--sk-color-white);
    --sk-focus-ring: var(--sk-color-black);
    --sk-focus-ring-offset: var(--sk-color-paper);
    --sk-shadow-color: var(--sk-color-black);
    --sk-code-surface: var(--sk-color-white);
    --sk-code-text: var(--sk-color-black);
    --sk-code-border: var(--sk-color-black);
    --sk-state-success: var(--sk-color-green-600);
    --sk-state-warning: var(--sk-color-yellow-500);
    --sk-state-danger: var(--sk-color-red-600);
    --sk-state-info: var(--sk-color-cyan-600);
    --sk-component-button-height: var(--sk-size-control-md);
    --sk-component-button-gap: var(--sk-space-2);
    --sk-component-card-padding: var(--sk-space-5);
    --sk-component-card-gap: var(--sk-space-5);
    --sk-component-hero-padding-block: var(--sk-space-6);
    --sk-component-hero-max-width: var(--sk-size-content-lg);
    --sk-component-grid-gap: var(--sk-space-5);
  }
}
/* source: assets/css/sitekit/themes.css */
@layer tokens {
  [data-theme="bzby"] {
    --sk-surface-page: #fffaf0;
    --sk-surface-raised: #ffffff;
    --sk-surface-card: #ffffff;
    --sk-surface-inverse: #111111;
    --sk-surface-subtle: #ffffff;
    --sk-surface-accent: #111111;
    --sk-text-primary: #111111;
    --sk-text-secondary: #403b33;
    --sk-text-muted: #766b5f;
    --sk-text-inverse: #fffaf0;
    --sk-text-link: #085f63;
    --sk-action-primary: #111111;
    --sk-action-primary-text: #fffaf0;
    --sk-action-secondary: #ffffff;
    --sk-action-secondary-text: #111111;
    --sk-border-default: #111111;
    --sk-border-subtle: #766b5f;
    --sk-focus-ring: #085f63;
    --sk-focus-ring-offset: #fffaf0;
    --sk-shadow-color: #111111;
  }
  [data-theme="kujo-dark"] {
    --sk-surface-page: var(--sk-color-black);
    --sk-surface-raised: var(--sk-color-gray-900);
    --sk-surface-card: var(--sk-color-gray-900);
    --sk-surface-inverse: var(--sk-color-white);
    --sk-surface-subtle: var(--sk-color-gray-900);
    --sk-surface-accent: var(--sk-color-white);
    --sk-text-primary: var(--sk-color-white);
    --sk-text-secondary: var(--sk-color-gray-100);
    --sk-text-muted: var(--sk-color-gray-300);
    --sk-text-inverse: var(--sk-color-black);
    --sk-text-link: var(--sk-color-cyan-600);
    --sk-action-primary: var(--sk-color-white);
    --sk-action-primary-text: var(--sk-color-black);
    --sk-action-secondary: var(--sk-color-gray-900);
    --sk-action-secondary-text: var(--sk-color-white);
    --sk-border-default: var(--sk-color-white);
    --sk-border-subtle: var(--sk-color-gray-300);
    --sk-focus-ring: var(--sk-color-cyan-600);
    --sk-focus-ring-offset: var(--sk-color-black);
    --sk-shadow-color: var(--sk-color-white);
  }
  [data-theme="kujo-light"] {
    --sk-surface-page: var(--sk-color-paper);
    --sk-surface-raised: var(--sk-color-white);
    --sk-surface-card: var(--sk-color-white);
    --sk-surface-inverse: var(--sk-color-black);
    --sk-surface-subtle: var(--sk-color-white);
    --sk-surface-accent: var(--sk-color-black);
    --sk-text-primary: var(--sk-color-black);
    --sk-text-secondary: var(--sk-color-gray-700);
    --sk-text-muted: var(--sk-color-gray-500);
    --sk-text-inverse: var(--sk-color-paper);
    --sk-text-link: var(--sk-color-black);
    --sk-action-primary: var(--sk-color-black);
    --sk-action-primary-text: var(--sk-color-white);
    --sk-action-secondary: var(--sk-color-white);
    --sk-action-secondary-text: var(--sk-color-black);
    --sk-border-default: var(--sk-color-black);
    --sk-border-subtle: var(--sk-color-gray-500);
    --sk-focus-ring: var(--sk-color-black);
    --sk-focus-ring-offset: var(--sk-color-paper);
    --sk-shadow-color: var(--sk-color-black);
  }
  [data-theme="personal-dark"] {
    --sk-surface-page: #0f1115;
    --sk-surface-raised: #171a20;
    --sk-surface-card: #171a20;
    --sk-surface-inverse: #f7f4ed;
    --sk-surface-subtle: #171a20;
    --sk-surface-accent: #f7f4ed;
    --sk-text-primary: #f7f4ed;
    --sk-text-secondary: #d7d2c8;
    --sk-text-muted: #a69f94;
    --sk-text-inverse: #0f1115;
    --sk-text-link: #8cc9ff;
    --sk-action-primary: #f7f4ed;
    --sk-action-primary-text: #0f1115;
    --sk-action-secondary: #171a20;
    --sk-action-secondary-text: #f7f4ed;
    --sk-border-default: #f7f4ed;
    --sk-border-subtle: #a69f94;
    --sk-focus-ring: #8cc9ff;
    --sk-focus-ring-offset: #0f1115;
    --sk-shadow-color: #f7f4ed;
  }
}
/* source: assets/css/sitekit/base.css */
@font-face {
  font-family: "Departure Mono";
  src:
    url("../fonts/DepartureMono-Regular.woff2?v=1.0.2") format("woff2"),
    url("../fonts/DepartureMono-Regular.woff?v=1.0.2") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@layer base { :root { color-scheme: light; } [data-theme="kujo-dark"], [data-theme="personal-dark"] { color-scheme: dark; } body { background: var(--sk-surface-page); color: var(--sk-text-primary); font-family: var(--sk-font-sans); line-height: var(--sk-type-line-normal); letter-spacing: 0; } a { color: var(--sk-text-link); text-underline-offset: .2em; } :focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } h1, h2 { font-family: var(--sk-font-mono); font-weight: var(--sk-type-weight-regular); letter-spacing: 0; } h1, h2, h3, h4 { line-height: var(--sk-type-line-tight); margin-block: 0 var(--sk-space-4); } p { margin-block: 0 var(--sk-space-4); } code, kbd, samp { font-family: var(--sk-font-mono); } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 1ms !important; scroll-behavior: auto !important; transition-duration: 1ms !important; } } }
/* source: assets/css/sitekit/components.css */
@layer components { .sk-accordion { display: grid; gap: var(--sk-space-3); } .sk-accordion details { border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-card); padding: var(--sk-space-4); } .sk-accordion summary { cursor: pointer; font-family: var(--sk-font-mono); font-weight: var(--sk-type-weight-bold); } .sk-accordion p { color: var(--sk-text-secondary); } .sk-accordion a:focus-visible, .sk-accordion button:focus-visible, .sk-accordion input:focus-visible, .sk-accordion select:focus-visible, .sk-accordion textarea:focus-visible, .sk-accordion summary:focus-visible, .sk-accordion [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-alert { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--sk-space-3); align-items: start; border: var(--sk-border-1) solid var(--sk-border-default); border-inline-start-width: var(--sk-border-heavy); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-4); } .sk-alert::before { content: "!"; display: grid; place-items: center; inline-size: var(--sk-size-control-sm); block-size: var(--sk-size-control-sm); border: var(--sk-border-1) solid currentColor; font-family: var(--sk-font-mono); font-weight: var(--sk-type-weight-bold); line-height: 1; } .sk-alert > * { min-inline-size: 0; grid-column: 2; } .sk-alert p { color: var(--sk-text-secondary); margin: 0; } .sk-alert strong { font-family: var(--sk-font-mono); text-transform: uppercase; } .sk-alert[data-variant="danger"] { border-color: var(--sk-state-danger); color: var(--sk-text-danger); } .sk-alert[data-variant="warning"] { border-color: var(--sk-state-warning); color: var(--sk-text-warning); } .sk-alert[data-variant="success"] { border-color: var(--sk-state-success); color: var(--sk-text-success); } .sk-alert[data-variant="neutral"] { border-color: var(--sk-state-info); } .sk-alert a:focus-visible, .sk-alert button:focus-visible, .sk-alert input:focus-visible, .sk-alert select:focus-visible, .sk-alert textarea:focus-visible, .sk-alert summary:focus-visible, .sk-alert [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-avatar { display: inline-grid; place-items: center; inline-size: var(--sk-size-control-lg); block-size: var(--sk-size-control-lg); aspect-ratio: 1; overflow: hidden; border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-raised); color: var(--sk-text-primary); } .sk-avatar img, .sk-avatar svg { inline-size: 100%; block-size: 100%; object-fit: cover; display: block; }  .sk-avatar a:focus-visible, .sk-avatar button:focus-visible, .sk-avatar input:focus-visible, .sk-avatar select:focus-visible, .sk-avatar textarea:focus-visible, .sk-avatar summary:focus-visible, .sk-avatar [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-badge { display: inline-flex; align-items: center; min-block-size: 1.5rem; padding-inline: var(--sk-space-2); border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-subtle); color: var(--sk-text-primary); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); font-weight: var(--sk-type-weight-bold); text-transform: uppercase; } .sk-badge[data-variant="success"] { border-color: var(--sk-state-success); color: var(--sk-state-success); } .sk-badge[data-variant="warning"] { border-color: var(--sk-state-warning); color: var(--sk-state-warning); } .sk-badge[data-variant="danger"] { border-color: var(--sk-state-danger); color: var(--sk-state-danger); } }

@layer components {
  .sk-bento-grid {
    inline-size: 100%;
    min-block-size: 100%;
    display: grid;
    gap: var(--sk-component-grid-gap);
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-rows: repeat(3, minmax(10rem, 1fr));
    grid-auto-rows: minmax(10rem, 1fr);
    grid-auto-flow: dense;
    container-type: inline-size;
  }

  .sk-bento-grid__intro,
  .sk-bento-grid__item {
    display: grid;
    gap: var(--sk-space-4);
    border: var(--sk-border-1) solid var(--sk-border-default);
    border-radius: var(--sk-radius-0);
    background: var(--sk-surface-card);
    padding: var(--sk-space-5);
  }

  .sk-bento-grid__intro {
    grid-template-rows: auto 1fr;
    align-content: stretch;
    background: var(--sk-surface-raised);
  }

  .sk-bento-grid__intro .sk-badge {
    justify-self: start;
  }

  .sk-bento-grid__content {
    align-self: end;
    display: grid;
    gap: var(--sk-space-4);
  }

  .sk-bento-grid__item {
    min-block-size: 11rem;
    align-content: end;
  }

  .sk-bento-grid__intro {
    grid-column: span 2;
    grid-row: span 3;
  }

  .sk-bento-grid__item[data-span="hero"] {
    grid-column: span 2;
    grid-row: span 3;
  }

  .sk-bento-grid__item[data-span="wide"] {
    grid-column: 3 / span 2;
    grid-row: 1;
  }

  .sk-bento-grid__item[data-span="tall"] {
    grid-column: 3;
    grid-row: 2 / span 2;
  }

  .sk-bento-grid__item:not([data-span]):last-child {
    grid-column: 4;
    grid-row: 3;
  }

  .sk-bento-grid__kicker,
  .sk-bento-grid h2,
  .sk-bento-grid h3 {
    margin: 0;
    font-family: var(--sk-font-mono);
  }

  .sk-bento-grid p {
    color: var(--sk-text-secondary);
  }

  .sk-bento-grid__kicker {
    color: var(--sk-text-muted);
    font-size: var(--sk-type-size-xs);
    text-transform: uppercase;
  }

  @container (max-width: 56rem) {
    .sk-bento-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      grid-template-rows: none;
    }

    .sk-bento-grid__intro,
    .sk-bento-grid__item[data-span="hero"],
    .sk-bento-grid__item[data-span="wide"] {
      grid-column: span 2;
      grid-row: auto;
    }

    .sk-bento-grid__item[data-span="tall"],
    .sk-bento-grid__item:not([data-span]):last-child {
      grid-column: auto;
      grid-row: auto;
    }
  }

  @container (max-width: 34rem) {
    .sk-bento-grid {
      grid-template-columns: 1fr;
    }

    .sk-bento-grid__intro,
    .sk-bento-grid__item[data-span] {
      grid-column: auto;
      grid-row: auto;
    }
  }

  .sk-bento-grid a:focus-visible,
  .sk-bento-grid button:focus-visible,
  .sk-bento-grid input:focus-visible,
  .sk-bento-grid select:focus-visible,
  .sk-bento-grid textarea:focus-visible,
  .sk-bento-grid summary:focus-visible,
  .sk-bento-grid [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }
}

@layer components { .sk-breadcrumbs ol { display: flex; flex-wrap: wrap; gap: var(--sk-space-2); padding: 0; margin: 0; list-style: none; } .sk-breadcrumbs li { font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); text-transform: uppercase; } .sk-breadcrumbs li + li::before { content: "/"; margin-inline-end: var(--sk-space-2); color: var(--sk-text-muted); } .sk-breadcrumbs a { color: var(--sk-text-primary); } .sk-breadcrumbs a:focus-visible, .sk-breadcrumbs button:focus-visible, .sk-breadcrumbs input:focus-visible, .sk-breadcrumbs select:focus-visible, .sk-breadcrumbs textarea:focus-visible, .sk-breadcrumbs summary:focus-visible, .sk-breadcrumbs [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components {
  .sk-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--sk-component-button-gap);
    min-block-size: var(--sk-component-button-height);
    padding-inline: var(--sk-space-4);
    border: var(--sk-border-1) solid var(--sk-border-strong);
    border-radius: var(--sk-radius-0);
    background: var(--sk-action-primary);
    color: var(--sk-action-primary-text);
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-sm);
    font-weight: var(--sk-type-weight-bold);
    line-height: var(--sk-type-line-tight);
    text-decoration: none;
    text-transform: uppercase;
    box-shadow: var(--sk-shadow-none);
    cursor: pointer;
    transition: background-color var(--sk-motion-fast) var(--sk-motion-ease), color var(--sk-motion-fast) var(--sk-motion-ease);
  }

  .sk-button:hover {
    background: var(--sk-action-secondary);
    color: var(--sk-action-secondary-text);
  }

  .sk-button:active {
    background: var(--sk-action-primary);
    color: var(--sk-action-primary-text);
  }

  .sk-button:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

  .sk-button:disabled,
  .sk-button[aria-disabled="true"] {
    opacity: .55;
    cursor: not-allowed;
  }

  .sk-button[data-variant="secondary"] {
    background: var(--sk-action-secondary);
    color: var(--sk-action-secondary-text);
  }

  .sk-button[data-variant="secondary"]:hover,
  .sk-button[data-variant="ghost"]:hover {
    background: var(--sk-action-primary);
    color: var(--sk-action-primary-text);
  }

  .sk-button[data-variant="ghost"] {
    background: transparent;
    color: var(--sk-text-primary);
  }

  .sk-button[data-variant="danger"] {
    background: var(--sk-action-danger);
    color: var(--sk-action-danger-text);
  }
}

@layer components {
  .sk-card {
    position: relative;
    border: var(--sk-border-1) solid var(--sk-border-default);
    border-radius: var(--sk-radius-0);
    background: var(--sk-surface-card);
    color: var(--sk-text-primary);
    padding: var(--sk-component-card-padding);
    box-shadow: var(--sk-shadow-none);
    container-type: inline-size;
  }

  .sk-card::before,
  .sk-card::after {
    content: "";
    position: absolute;
    inline-size: var(--sk-space-4);
    block-size: var(--sk-space-4);
    border-color: var(--sk-border-default);
    pointer-events: none;
  }

  .sk-card::before {
    inset-block-start: var(--sk-space-2);
    inset-inline-start: var(--sk-space-2);
    border-block-start: var(--sk-border-1) solid;
    border-inline-start: var(--sk-border-1) solid;
  }

  .sk-card::after {
    inset-block-end: var(--sk-space-2);
    inset-inline-end: var(--sk-space-2);
    border-block-end: var(--sk-border-1) solid;
    border-inline-end: var(--sk-border-1) solid;
  }

  .sk-card > * + * {
    margin-block-start: var(--sk-component-card-gap);
  }

  .sk-card__actions,
  .sk-card > div:last-child {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sk-space-3);
  }

  .sk-card p {
    color: var(--sk-text-secondary);
  }

  .sk-card[aria-busy="true"] {
    cursor: progress;
  }

  .sk-card[data-state="error"] {
    border-color: var(--sk-state-danger);
  }

  .sk-card a:focus-visible,
  .sk-card button:focus-visible,
  .sk-card input:focus-visible,
  .sk-card select:focus-visible,
  .sk-card textarea:focus-visible,
  .sk-card summary:focus-visible,
  .sk-card [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }
}

@layer components { .sk-carousel { display: grid; gap: var(--sk-space-4); border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-5); } .sk-carousel > * { min-inline-size: 0; } .sk-carousel p { color: var(--sk-text-secondary); } .sk-carousel__track { display: grid; grid-auto-flow: column; grid-auto-columns: 100%; gap: var(--sk-space-4); overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; } .sk-carousel__track::-webkit-scrollbar { display: none; } .sk-carousel__track > * { scroll-snap-align: start; border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-raised); padding: var(--sk-space-4); min-block-size: 12rem; } .sk-carousel__controls { display: flex; justify-content: flex-end; gap: var(--sk-space-3); } .sk-carousel__controls .sk-button { font-family: var(--sk-font-mono); } .sk-carousel a:focus-visible, .sk-carousel button:focus-visible, .sk-carousel input:focus-visible, .sk-carousel select:focus-visible, .sk-carousel textarea:focus-visible, .sk-carousel summary:focus-visible, .sk-carousel [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-checkbox { display: grid; gap: var(--sk-space-2); color: var(--sk-text-primary); } .sk-checkbox label, .sk-checkbox legend, .sk-checkbox__label { color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); line-height: var(--sk-type-line-tight); text-transform: uppercase; } .sk-checkbox input, .sk-checkbox select, .sk-checkbox textarea { border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-3); font: inherit; } .sk-checkbox label { display: flex; align-items: center; gap: var(--sk-space-3); color: var(--sk-text-primary); font-family: inherit; font-size: inherit; text-transform: none; cursor: pointer; } .sk-checkbox input[type="checkbox"] { appearance: none; display: inline-grid; place-items: center; inline-size: var(--sk-size-control-sm); block-size: var(--sk-size-control-sm); padding: 0; flex: 0 0 auto; cursor: pointer; } .sk-checkbox input[type="checkbox"]::before { content: ""; inline-size: var(--sk-space-3); block-size: var(--sk-space-3); background: transparent; } .sk-checkbox input[type="checkbox"]:checked::before { background: var(--sk-action-primary); } .sk-checkbox a:focus-visible, .sk-checkbox button:focus-visible, .sk-checkbox input:focus-visible, .sk-checkbox select:focus-visible, .sk-checkbox textarea:focus-visible, .sk-checkbox summary:focus-visible, .sk-checkbox [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components {
  .sk-checkout-summary {
    position: relative;
    border: var(--sk-border-1) solid var(--sk-border-default);
    border-radius: var(--sk-radius-0);
    background: var(--sk-surface-card);
    color: var(--sk-text-primary);
    padding: var(--sk-component-card-padding);
    box-shadow: var(--sk-shadow-none);
    container-type: inline-size;
  }

  .sk-checkout-summary::before,
  .sk-checkout-summary::after {
    content: "";
    position: absolute;
    inline-size: var(--sk-space-4);
    block-size: var(--sk-space-4);
    border-color: var(--sk-border-default);
    pointer-events: none;
  }

  .sk-checkout-summary::before {
    inset-block-start: var(--sk-space-2);
    inset-inline-start: var(--sk-space-2);
    border-block-start: var(--sk-border-1) solid;
    border-inline-start: var(--sk-border-1) solid;
  }

  .sk-checkout-summary::after {
    inset-block-end: var(--sk-space-2);
    inset-inline-end: var(--sk-space-2);
    border-block-end: var(--sk-border-1) solid;
    border-inline-end: var(--sk-border-1) solid;
  }

  .sk-checkout-summary > * + * {
    margin-block-start: var(--sk-component-card-gap);
  }

  .sk-checkout-summary h2 {
    margin: 0;
    font-family: var(--sk-font-mono);
  }

  .sk-checkout-summary__items {
    display: grid;
    gap: var(--sk-space-3);
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .sk-checkout-summary__items li {
    display: flex;
    justify-content: space-between;
    gap: var(--sk-space-4);
    border: var(--sk-border-1) solid var(--sk-border-subtle);
    padding: var(--sk-space-3);
  }

  .sk-checkout-summary p {
    color: var(--sk-text-secondary);
  }

  .sk-checkout-summary dl {
    display: grid;
    gap: 0;
    margin: 0;
    border-block: var(--sk-border-1) solid var(--sk-border-subtle);
  }

  .sk-checkout-summary dl > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--sk-space-4);
    padding-block: var(--sk-space-3);
    border-block-end: var(--sk-border-1) solid var(--sk-border-subtle);
  }

  .sk-checkout-summary dl > div:last-child {
    border-block-end: 0;
  }

  .sk-checkout-summary dt {
    color: var(--sk-text-secondary);
  }

  .sk-checkout-summary dd {
    margin: 0;
    font-family: var(--sk-font-mono);
    font-weight: var(--sk-type-weight-bold);
    text-align: end;
  }

  .sk-checkout-summary [data-total] {
    padding-block: var(--sk-space-4);
    border-block-start: var(--sk-border-2) solid var(--sk-border-default);
  }

  .sk-checkout-summary__actions {
    display: grid;
    gap: var(--sk-space-3);
  }

  .sk-checkout-summary [data-total] dt,
  .sk-checkout-summary [data-total] dd {
    color: var(--sk-text-primary);
  }

  .sk-checkout-summary[aria-busy="true"] {
    cursor: progress;
  }

  .sk-checkout-summary[data-state="error"] {
    border-color: var(--sk-state-danger);
  }

  .sk-checkout-summary a:focus-visible,
  .sk-checkout-summary button:focus-visible,
  .sk-checkout-summary input:focus-visible,
  .sk-checkout-summary select:focus-visible,
  .sk-checkout-summary textarea:focus-visible,
  .sk-checkout-summary summary:focus-visible,
  .sk-checkout-summary [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }
}

@layer components { .sk-code-block { background: var(--sk-code-surface); color: var(--sk-code-text); border: var(--sk-border-1) solid var(--sk-code-border); border-radius: var(--sk-radius-0); overflow: auto; } .sk-code-block figcaption { display: flex; align-items: center; justify-content: space-between; gap: var(--sk-space-3); padding: var(--sk-space-3); border-block-end: var(--sk-border-1) solid var(--sk-code-border); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-sm); } .sk-code-block button { min-block-size: var(--sk-size-control-md); border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-action-secondary); color: var(--sk-action-secondary-text); padding: 0 var(--sk-space-3); font-family: var(--sk-font-mono); cursor: pointer; } .sk-code-block button:hover { background: var(--sk-action-primary); color: var(--sk-action-primary-text); } .sk-code-block pre { margin: 0; padding: var(--sk-space-4); overflow: auto; } .sk-code-block a:focus-visible, .sk-code-block button:focus-visible, .sk-code-block input:focus-visible, .sk-code-block select:focus-visible, .sk-code-block textarea:focus-visible, .sk-code-block summary:focus-visible, .sk-code-block [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-color-picker { display: inline-grid; gap: var(--sk-space-2); color: var(--sk-text-primary); justify-items: start; } .sk-color-picker label, .sk-color-picker legend, .sk-color-picker__label { color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); line-height: var(--sk-type-line-tight); text-transform: uppercase; } .sk-color-picker input, .sk-color-picker select, .sk-color-picker textarea { border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-3); font: inherit; } .sk-color-picker input[type="color"] { inline-size: var(--sk-size-control-lg); block-size: var(--sk-size-control-lg); padding: var(--sk-space-1); cursor: pointer; } .sk-color-picker a:focus-visible, .sk-color-picker button:focus-visible, .sk-color-picker input:focus-visible, .sk-color-picker select:focus-visible, .sk-color-picker textarea:focus-visible, .sk-color-picker summary:focus-visible, .sk-color-picker [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-combobox { display: grid; gap: var(--sk-space-2); color: var(--sk-text-primary); position: relative; } .sk-combobox label, .sk-combobox legend, .sk-combobox__label { color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); line-height: var(--sk-type-line-tight); text-transform: uppercase; } .sk-combobox input { inline-size: 100%; border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-3); font: inherit; } .sk-combobox [role="listbox"] { display: grid; gap: var(--sk-border-1); margin: 0; padding: 0; border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-border-default); list-style: none; } .sk-combobox [role="option"] { background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-3); font-family: var(--sk-font-mono); cursor: pointer; } .sk-combobox [role="option"]:hover, .sk-combobox [aria-selected="true"] { background: var(--sk-action-primary); color: var(--sk-action-primary-text); } .sk-combobox [hidden] { display: none; } .sk-combobox a:focus-visible, .sk-combobox button:focus-visible, .sk-combobox input:focus-visible, .sk-combobox select:focus-visible, .sk-combobox textarea:focus-visible, .sk-combobox summary:focus-visible, .sk-combobox [role="tab"]:focus-visible, .sk-combobox [role="option"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components {
  .sk-command-strip {
    display: grid;
    gap: var(--sk-border-1);
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr));
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-border-default);
    color: var(--sk-text-primary);
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-xs);
    line-height: var(--sk-type-line-tight);
    text-transform: uppercase;
    overflow: hidden;
  }

  .sk-command-strip > * {
    min-inline-size: 0;
    padding: var(--sk-space-3) var(--sk-space-4);
    background: var(--sk-surface-card);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .sk-command-strip a:focus-visible,
  .sk-command-strip button:focus-visible,
  .sk-command-strip input:focus-visible,
  .sk-command-strip select:focus-visible,
  .sk-command-strip textarea:focus-visible,
  .sk-command-strip summary:focus-visible,
  .sk-command-strip [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

}

@layer components {
  .sk-content-section {
    display: grid;
    gap: var(--sk-space-6);
    align-items: center;
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-card);
    padding: var(--sk-space-6);
    container-type: inline-size;
  }

  .sk-content-section__copy {
    display: grid;
    justify-items: start;
    gap: var(--sk-space-4);
  }

  .sk-content-section__copy p {
    max-inline-size: 65ch;
    color: var(--sk-text-secondary);
  }

  .sk-content-section__media {
    margin: 0;
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-page);
    padding: var(--sk-space-5);
  }

  .sk-content-section__media figcaption {
    margin-block-end: var(--sk-space-4);
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-sm);
    text-transform: uppercase;
  }

  .sk-content-section dl {
    display: grid;
    gap: var(--sk-space-3);
    margin: 0;
  }

  .sk-content-section dl div {
    display: flex;
    justify-content: space-between;
    gap: var(--sk-space-4);
    border-block-start: var(--sk-border-1) solid var(--sk-border-subtle);
    padding-block-start: var(--sk-space-3);
  }

  .sk-content-section dt {
    color: var(--sk-text-muted);
  }

  .sk-content-section dd {
    margin: 0;
    font-family: var(--sk-font-mono);
  }

  @container (min-width: 54rem) {
    .sk-content-section {
      grid-template-columns: minmax(0, 1fr) minmax(18rem, .75fr);
    }

    .sk-content-section[data-layout="media-left"] .sk-content-section__media {
      order: -1;
    }
  }

    .sk-content-section a:focus-visible,
    .sk-content-section button:focus-visible,
    .sk-content-section input:focus-visible,
    .sk-content-section select:focus-visible,
    .sk-content-section textarea:focus-visible,
    .sk-content-section summary:focus-visible,
    .sk-content-section [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

}

@layer components {
  .sk-cta {
    border: var(--sk-border-1) solid var(--sk-border-default);
    border-radius: var(--sk-radius-0);
    background: var(--sk-surface-card);
    padding: var(--sk-space-5);
    container-type: inline-size;
  }

  .sk-cta .sk-cta__inner {
    inline-size: 100%;
    margin-inline: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sk-space-5);
  }

  .sk-cta h1,
  .sk-cta h2 {
    max-inline-size: none;
    margin: 0;
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-xl);
    line-height: var(--sk-type-line-tight);
  }

  .sk-cta p {
    max-inline-size: 44ch;
    margin: 0;
    color: var(--sk-text-secondary);
    font-size: var(--sk-type-size-md);
    line-height: var(--sk-type-line-loose);
  }

  .sk-cta__copy {
    display: grid;
    gap: var(--sk-space-2);
  }

  .sk-cta__actions,
  .sk-cta .sk-cta__inner > div:last-child {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sk-space-3);
  }

  .sk-cta a:focus-visible,
  .sk-cta button:focus-visible,
  .sk-cta input:focus-visible,
  .sk-cta select:focus-visible,
  .sk-cta textarea:focus-visible,
  .sk-cta summary:focus-visible,
  .sk-cta [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

  @container (min-width: 56rem) {
    .sk-cta[data-layout="split"] .sk-cta__inner {
      align-items: center;
    }
  }
}

@layer components { .sk-date-input { display: grid; gap: var(--sk-space-2); color: var(--sk-text-primary); } .sk-date-input label, .sk-date-input legend, .sk-date-input__label { color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); line-height: var(--sk-type-line-tight); text-transform: uppercase; } .sk-date-input input, .sk-date-input select, .sk-date-input textarea { inline-size: 100%; border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-3); font: inherit; } .sk-date-input p { color: var(--sk-text-secondary); margin: 0; } .sk-date-input a:focus-visible, .sk-date-input button:focus-visible, .sk-date-input input:focus-visible, .sk-date-input select:focus-visible, .sk-date-input textarea:focus-visible, .sk-date-input summary:focus-visible, .sk-date-input [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-date-picker { display: grid; gap: var(--sk-space-4); inline-size: min(100%, 24rem); border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-5); } .sk-date-picker > * { min-inline-size: 0; } .sk-date-picker header { display: flex; align-items: center; justify-content: space-between; gap: var(--sk-space-3); } .sk-date-picker h2 { margin: 0; font-family: var(--sk-font-mono); font-size: var(--sk-type-size-lg); } .sk-date-picker [data-weekdays], .sk-date-picker [role="grid"] { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: var(--sk-border-1); } .sk-date-picker [data-weekdays] { color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); text-align: center; } .sk-date-picker button { min-block-size: var(--sk-size-control-md); border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-raised); color: var(--sk-text-primary); padding: var(--sk-space-2); font: inherit; cursor: pointer; } .sk-date-picker button:hover { background: var(--sk-surface-subtle); } .sk-date-picker [aria-current="date"], .sk-date-picker [aria-pressed="true"] { background: var(--sk-action-primary); color: var(--sk-action-primary-text); font-weight: var(--sk-type-weight-bold); } .sk-date-picker [disabled] { color: var(--sk-text-muted); background: var(--sk-surface-subtle); cursor: not-allowed; } .sk-date-picker a:focus-visible, .sk-date-picker button:focus-visible, .sk-date-picker input:focus-visible, .sk-date-picker select:focus-visible, .sk-date-picker textarea:focus-visible, .sk-date-picker summary:focus-visible, .sk-date-picker [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-drawer-shell { display: grid; grid-template-columns: 1fr minmax(18rem, 28rem); min-block-size: 28rem; border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-page); overflow: hidden; } .sk-drawer-scrim { background: var(--sk-surface-subtle); border-inline-end: var(--sk-border-1) solid var(--sk-border-default); } .sk-drawer { display: grid; grid-template-rows: auto 1fr auto; gap: var(--sk-space-4); border: 0; border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-5); inline-size: 100%; min-block-size: 100%; box-shadow: var(--sk-shadow-none); } .sk-drawer > * { min-inline-size: 0; } .sk-drawer header { display: flex; align-items: start; justify-content: space-between; gap: var(--sk-space-4); border-block-end: var(--sk-border-1) solid var(--sk-border-default); padding-block-end: var(--sk-space-4); } .sk-drawer h2, .sk-drawer p { margin: 0; } .sk-drawer p { color: var(--sk-text-secondary); } .sk-drawer nav { display: grid; gap: var(--sk-border-1); border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-border-default); } .sk-drawer nav a { background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-3); text-decoration: none; } .sk-drawer nav a:hover { background: var(--sk-surface-subtle); } .sk-drawer a:focus-visible, .sk-drawer button:focus-visible, .sk-drawer input:focus-visible, .sk-drawer select:focus-visible, .sk-drawer textarea:focus-visible, .sk-drawer summary:focus-visible, .sk-drawer [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-dropdown-menu { position: relative; display: inline-grid; gap: var(--sk-space-2); inline-size: max-content; color: var(--sk-text-primary); } .sk-dropdown-menu > * { min-inline-size: 0; } .sk-dropdown-menu ul { position: absolute; inset-block-start: calc(100% + var(--sk-space-2)); inset-inline-start: 0; z-index: var(--sk-z-dropdown); display: grid; gap: var(--sk-border-1); min-inline-size: 12rem; padding: 0; margin: 0; border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-border-default); list-style: none; } .sk-dropdown-menu ul[hidden] { display: none; } .sk-dropdown-menu li, .sk-dropdown-menu [role="menuitem"] { inline-size: 100%; } .sk-dropdown-menu [role="menuitem"] { border: 0; background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-3); text-align: start; cursor: pointer; } .sk-dropdown-menu [role="menuitem"]:hover { background: var(--sk-action-primary); color: var(--sk-action-primary-text); } .sk-dropdown-menu a:focus-visible, .sk-dropdown-menu button:focus-visible, .sk-dropdown-menu input:focus-visible, .sk-dropdown-menu select:focus-visible, .sk-dropdown-menu textarea:focus-visible, .sk-dropdown-menu summary:focus-visible, .sk-dropdown-menu [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components {
  .sk-ecosystem-map {
    display: grid;
    gap: var(--sk-component-grid-gap);
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
  }

  .sk-ecosystem-map > * {
    border: var(--sk-border-1) solid var(--sk-border-default);
    border-radius: var(--sk-radius-0);
    background: var(--sk-surface-card);
    padding: var(--sk-space-5);
  }

  .sk-ecosystem-map a:focus-visible,
  .sk-ecosystem-map button:focus-visible,
  .sk-ecosystem-map input:focus-visible,
  .sk-ecosystem-map select:focus-visible,
  .sk-ecosystem-map textarea:focus-visible,
  .sk-ecosystem-map summary:focus-visible,
  .sk-ecosystem-map [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

  .sk-ecosystem-map[data-density="dense"] {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr));
  }
}

@layer components {
  .sk-empty-state {
    display: grid;
    justify-items: center;
    gap: var(--sk-space-4);
    text-align: center;
    position: relative;
    border: var(--sk-border-1) dashed var(--sk-border-default);
    border-radius: var(--sk-radius-0);
    background: var(--sk-surface-card);
    color: var(--sk-text-primary);
    padding: var(--sk-component-card-padding);
    box-shadow: var(--sk-shadow-none);
    container-type: inline-size;
  }

  .sk-empty-state::before,
  .sk-empty-state::after {
    content: "";
    position: absolute;
    inline-size: var(--sk-space-4);
    block-size: var(--sk-space-4);
    border-color: var(--sk-border-default);
    pointer-events: none;
  }

  .sk-empty-state::before {
    inset-block-start: var(--sk-space-2);
    inset-inline-start: var(--sk-space-2);
    border-block-start: var(--sk-border-1) solid;
    border-inline-start: var(--sk-border-1) solid;
  }

  .sk-empty-state::after {
    inset-block-end: var(--sk-space-2);
    inset-inline-end: var(--sk-space-2);
    border-block-end: var(--sk-border-1) solid;
    border-inline-end: var(--sk-border-1) solid;
  }

  .sk-empty-state > * + * {
    margin-block-start: 0;
  }

  .sk-empty-state__mark {
    display: grid;
    place-items: center;
    inline-size: var(--sk-size-control-lg);
    block-size: var(--sk-size-control-lg);
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-page);
    font-family: var(--sk-font-mono);
  }

  .sk-empty-state h2 {
    margin: 0;
    font-family: var(--sk-font-mono);
  }

  .sk-empty-state p {
    max-inline-size: 42ch;
    color: var(--sk-text-secondary);
  }

  .sk-empty-state[aria-busy="true"] {
    cursor: progress;
  }

  .sk-empty-state[data-state="error"] {
    border-color: var(--sk-state-danger);
  }

  .sk-empty-state a:focus-visible,
  .sk-empty-state button:focus-visible,
  .sk-empty-state input:focus-visible,
  .sk-empty-state select:focus-visible,
  .sk-empty-state textarea:focus-visible,
  .sk-empty-state summary:focus-visible,
  .sk-empty-state [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }
}

@layer components {
  .sk-error-state {
    display: grid;
    gap: var(--sk-space-4);
    position: relative;
    border: var(--sk-border-2) solid var(--sk-state-danger);
    border-inline-start-width: var(--sk-border-heavy);
    border-radius: var(--sk-radius-0);
    background: var(--sk-surface-card);
    color: var(--sk-text-primary);
    padding: var(--sk-component-card-padding);
    box-shadow: var(--sk-shadow-none);
    container-type: inline-size;
  }

  .sk-error-state::before,
  .sk-error-state::after {
    content: "";
    position: absolute;
    inline-size: var(--sk-space-4);
    block-size: var(--sk-space-4);
    border-color: var(--sk-border-default);
    pointer-events: none;
  }

  .sk-error-state::before {
    inset-block-start: var(--sk-space-2);
    inset-inline-start: var(--sk-space-2);
    border-block-start: var(--sk-border-1) solid;
    border-inline-start: var(--sk-border-1) solid;
  }

  .sk-error-state::after {
    inset-block-end: var(--sk-space-2);
    inset-inline-end: var(--sk-space-2);
    border-block-end: var(--sk-border-1) solid;
    border-inline-end: var(--sk-border-1) solid;
  }

  .sk-error-state > * + * {
    margin-block-start: 0;
  }

  .sk-error-state h2 {
    margin: 0;
    font-family: var(--sk-font-mono);
    color: var(--sk-text-danger);
  }

  .sk-error-state p {
    color: var(--sk-text-secondary);
  }

  .sk-error-state [data-error-code] {
    display: inline-block;
    inline-size: fit-content;
    border: var(--sk-border-1) solid var(--sk-state-danger);
    padding: var(--sk-space-1) var(--sk-space-2);
    color: var(--sk-text-danger);
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-xs);
    text-transform: uppercase;
  }

  .sk-error-state[aria-busy="true"] {
    cursor: progress;
  }

  .sk-error-state[data-state="error"] {
    border-color: var(--sk-state-danger);
  }

  .sk-error-state a:focus-visible,
  .sk-error-state button:focus-visible,
  .sk-error-state input:focus-visible,
  .sk-error-state select:focus-visible,
  .sk-error-state textarea:focus-visible,
  .sk-error-state summary:focus-visible,
  .sk-error-state [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }
}

@layer components {
  .sk-feature-grid {
    display: grid;
    gap: var(--sk-component-grid-gap);
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
  }

  .sk-feature-grid > * {
    display: grid;
    gap: var(--sk-space-3);
    border: var(--sk-border-1) solid var(--sk-border-default);
    border-radius: var(--sk-radius-0);
    background: var(--sk-surface-card);
    padding: var(--sk-space-5);
  }

  .sk-feature-grid [data-feature-icon] {
    display: grid;
    place-items: center;
    inline-size: var(--sk-size-control-lg);
    block-size: var(--sk-size-control-lg);
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-raised);
    font-family: var(--sk-font-mono);
  }

  .sk-feature-grid h3 {
    margin: 0;
    font-family: var(--sk-font-mono);
  }

  .sk-feature-grid a:focus-visible,
  .sk-feature-grid button:focus-visible,
  .sk-feature-grid input:focus-visible,
  .sk-feature-grid select:focus-visible,
  .sk-feature-grid textarea:focus-visible,
  .sk-feature-grid summary:focus-visible,
  .sk-feature-grid [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

  .sk-feature-grid[data-density="dense"] {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr));
  }
}

@layer components { .sk-fieldset { display: grid; gap: var(--sk-space-3); color: var(--sk-text-primary); border: var(--sk-border-1) solid var(--sk-border-default); padding: var(--sk-space-4); } .sk-fieldset label, .sk-fieldset legend, .sk-fieldset__label { color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); line-height: var(--sk-type-line-tight); text-transform: uppercase; } .sk-fieldset input, .sk-fieldset select, .sk-fieldset textarea { border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-3); font: inherit; } .sk-fieldset label { display: flex; align-items: center; gap: var(--sk-space-3); color: var(--sk-text-primary); font-family: inherit; font-size: inherit; text-transform: none; cursor: pointer; } .sk-fieldset input[type="radio"], .sk-fieldset input[type="checkbox"] { appearance: none; display: inline-grid; place-items: center; inline-size: var(--sk-size-control-sm); block-size: var(--sk-size-control-sm); padding: 0; flex: 0 0 auto; } .sk-fieldset input[type="radio"]::before, .sk-fieldset input[type="checkbox"]::before { content: ""; inline-size: var(--sk-space-3); block-size: var(--sk-space-3); background: transparent; } .sk-fieldset input[type="radio"]:checked::before, .sk-fieldset input[type="checkbox"]:checked::before { background: var(--sk-action-primary); } .sk-fieldset a:focus-visible, .sk-fieldset button:focus-visible, .sk-fieldset input:focus-visible, .sk-fieldset select:focus-visible, .sk-fieldset textarea:focus-visible, .sk-fieldset summary:focus-visible, .sk-fieldset [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-file { display: grid; gap: var(--sk-space-4); border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-5); } .sk-file > * { min-inline-size: 0; } .sk-file p { color: var(--sk-text-secondary); } .sk-file { grid-template-columns: auto 1fr auto; align-items: center; } .sk-file > span { display: inline-grid; place-items: center; inline-size: var(--sk-size-control-lg); block-size: var(--sk-size-control-lg); border: var(--sk-border-1) solid var(--sk-border-default); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); } .sk-file h3 { margin: 0; } .sk-file a:focus-visible, .sk-file button:focus-visible, .sk-file input:focus-visible, .sk-file select:focus-visible, .sk-file textarea:focus-visible, .sk-file summary:focus-visible, .sk-file [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-file-upload { display: grid; gap: var(--sk-space-4); color: var(--sk-text-primary); border: var(--sk-border-1) dashed var(--sk-border-default); padding: var(--sk-space-8); place-items: center; text-align: center; } .sk-file-upload label, .sk-file-upload legend, .sk-file-upload__label { color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); line-height: var(--sk-type-line-tight); text-transform: uppercase; } .sk-file-upload input[type="file"] { max-inline-size: 100%; justify-self: center; border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-3); font: inherit; } .sk-file-upload input[type="file"]::file-selector-button { margin-inline-end: var(--sk-space-3); border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-action-secondary); color: var(--sk-action-secondary-text); padding: var(--sk-space-2) var(--sk-space-3); font-family: var(--sk-font-mono); cursor: pointer; } .sk-file-upload input[type="file"]::file-selector-button:hover { background: var(--sk-action-primary); color: var(--sk-action-primary-text); } .sk-file-upload p { color: var(--sk-text-secondary); margin: 0; } .sk-file-upload a:focus-visible, .sk-file-upload button:focus-visible, .sk-file-upload input:focus-visible, .sk-file-upload select:focus-visible, .sk-file-upload textarea:focus-visible, .sk-file-upload summary:focus-visible, .sk-file-upload [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components {
  .sk-footer {
    background: var(--sk-surface-page);
    padding-block: var(--sk-space-4);
  }

  .sk-footer a {
    color: var(--sk-text-primary);
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-xs);
    line-height: var(--sk-type-line-tight);
    text-decoration: none;
    text-transform: uppercase;
  }

  .sk-footer a:hover {
    text-decoration: underline;
  }

  .sk-footer a[aria-current="page"] {
    font-weight: var(--sk-type-weight-bold);
  }

  .sk-footer .sk-footer__inner {
    inline-size: min(100% - (2 * var(--sk-space-5)), var(--sk-size-content-lg));
    margin-inline: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sk-space-4);
    padding: var(--sk-space-4);
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-raised);
  }

  .sk-footer nav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sk-space-4);
  }

  .sk-footer p,
  .sk-footer small {
    margin: 0;
    line-height: var(--sk-type-line-tight);
  }

  .sk-footer a:focus-visible,
  .sk-footer button:focus-visible,
  .sk-footer input:focus-visible,
  .sk-footer select:focus-visible,
  .sk-footer textarea:focus-visible,
  .sk-footer summary:focus-visible,
  .sk-footer [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }
}

@layer components { .sk-form { display: grid; gap: var(--sk-space-3); color: var(--sk-text-primary); border: var(--sk-border-1) solid var(--sk-border-default); padding: var(--sk-space-5); background: var(--sk-surface-card); } .sk-form label, .sk-form legend, .sk-form__label { color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); line-height: var(--sk-type-line-tight); text-transform: uppercase; } .sk-form input, .sk-form select, .sk-form textarea { inline-size: 100%; border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-3); font: inherit; } .sk-form textarea { min-block-size: 8rem; } .sk-form .sk-button { justify-self: start; margin-block-start: var(--sk-space-3); } .sk-form a:focus-visible, .sk-form button:focus-visible, .sk-form input:focus-visible, .sk-form select:focus-visible, .sk-form textarea:focus-visible, .sk-form summary:focus-visible, .sk-form [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-form-field { display: grid; gap: var(--sk-space-2); } .sk-form-field label { font-weight: var(--sk-type-weight-bold); } .sk-form-field input, .sk-form-field textarea, .sk-form-field select { inline-size: 100%; min-block-size: var(--sk-size-control-md); border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-raised); color: var(--sk-text-primary); padding: var(--sk-space-2) var(--sk-space-3); } .sk-form-field .sk-form-field__help { color: var(--sk-text-muted); font-size: var(--sk-type-size-sm); } .sk-form-field a:focus-visible, .sk-form-field button:focus-visible, .sk-form-field input:focus-visible, .sk-form-field select:focus-visible, .sk-form-field textarea:focus-visible, .sk-form-field summary:focus-visible, .sk-form-field [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components {
  .sk-generator-panel {
    display: grid;
    gap: var(--sk-space-5);
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-card);
    padding: var(--sk-space-5);
    container-type: inline-size;
  }

  .sk-generator-panel form {
    display: grid;
    gap: var(--sk-space-3);
  }

  .sk-generator-panel label {
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-sm);
  }

  .sk-generator-panel input,
  .sk-generator-panel select {
    min-block-size: var(--sk-size-control-md);
    border: var(--sk-border-1) solid var(--sk-border-default);
    border-radius: var(--sk-radius-0);
    background: var(--sk-surface-page);
    color: var(--sk-text-primary);
    padding: var(--sk-space-3);
    font: inherit;
  }

  .sk-generator-panel select {
    appearance: none;
    background: linear-gradient(45deg, transparent 50%, var(--sk-text-primary) 50%) calc(100% - var(--sk-space-4)) 50% / var(--sk-space-2) var(--sk-space-2) no-repeat, var(--sk-surface-page);
    padding-inline-end: var(--sk-space-8);
  }

  .sk-generator-panel__preview {
    aspect-ratio: 16 / 9;
    display: grid;
    place-items: center;
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-page);
    font-family: var(--sk-font-mono);
  }

  @container (min-width: 56rem) {
    .sk-generator-panel {
      grid-template-columns: minmax(18rem, .7fr) minmax(24rem, 1fr);
    }
  }

    .sk-generator-panel a:focus-visible,
    .sk-generator-panel button:focus-visible,
    .sk-generator-panel input:focus-visible,
    .sk-generator-panel select:focus-visible,
    .sk-generator-panel textarea:focus-visible,
    .sk-generator-panel summary:focus-visible,
    .sk-generator-panel [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

}

@layer components {
  .sk-header {
    background: var(--sk-surface-page);
    padding-block: var(--sk-space-4);
  }

  .sk-header a {
    color: var(--sk-text-primary);
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-xs);
    line-height: var(--sk-type-line-tight);
    text-decoration: none;
    text-transform: uppercase;
  }

  .sk-header a:hover {
    text-decoration: underline;
  }

  .sk-header a.sk-button {
    color: var(--sk-action-primary-text);
  }

  .sk-header a.sk-button:hover {
    color: var(--sk-action-secondary-text);
    text-decoration: none;
  }

  .sk-header a.sk-button[data-variant="secondary"],
  .sk-header a.sk-button[data-variant="ghost"] {
    color: var(--sk-action-secondary-text);
  }

  .sk-header a.sk-button[data-variant="secondary"]:hover,
  .sk-header a.sk-button[data-variant="ghost"]:hover {
    color: var(--sk-action-primary-text);
  }

  .sk-header a[aria-current="page"] {
    font-weight: var(--sk-type-weight-bold);
  }

  .sk-header .sk-header__inner {
    inline-size: min(100% - (2 * var(--sk-space-5)), var(--sk-size-content-lg));
    margin-inline: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sk-space-4);
    padding: var(--sk-space-4);
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-raised);
  }

  .sk-header nav {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sk-space-4);
  }

  .sk-header__actions,
  .sk-header .sk-header__inner > div {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sk-space-3);
    align-items: center;
  }

  .sk-header a:focus-visible,
  .sk-header button:focus-visible,
  .sk-header input:focus-visible,
  .sk-header select:focus-visible,
  .sk-header textarea:focus-visible,
  .sk-header summary:focus-visible,
  .sk-header [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }
}

@layer components { .sk-heading { display: grid; gap: var(--sk-space-2); color: var(--sk-text-primary); } .sk-heading p { margin: 0; color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); text-transform: uppercase; } .sk-heading h2 { margin: 0; } .sk-heading span { color: var(--sk-text-secondary); }  .sk-heading a:focus-visible, .sk-heading button:focus-visible, .sk-heading input:focus-visible, .sk-heading select:focus-visible, .sk-heading textarea:focus-visible, .sk-heading summary:focus-visible, .sk-heading [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components {
  .sk-hero {
    border: var(--sk-border-1) solid var(--sk-border-default);
    border-radius: var(--sk-radius-0);
    background: var(--sk-surface-card);
    padding-block: var(--sk-component-hero-padding-block);
    container-type: inline-size;
  }

  .sk-hero .sk-hero__inner {
    inline-size: min(100% - (2 * var(--sk-space-5)), var(--sk-component-hero-max-width));
    margin-inline: auto;
    display: grid;
    gap: var(--sk-space-5);
    justify-items: center;
    text-align: center;
  }

  .sk-hero[data-layout="centered"] .sk-hero__inner {
    justify-items: center;
    text-align: center;
  }

  .sk-hero .sk-button {
    justify-self: center;
  }

  .sk-hero__actions,
  .sk-hero .sk-hero__inner > div:last-child {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--sk-space-3);
  }

  .sk-hero h1,
  .sk-hero h2 {
    max-inline-size: 15ch;
    font-size: var(--sk-type-size-4xl);
    line-height: .9;
  }

  .sk-hero p {
    max-inline-size: 67ch;
    color: var(--sk-text-secondary);
    font-size: var(--sk-type-size-md);
    line-height: var(--sk-type-line-loose);
  }

  .sk-hero a:focus-visible,
  .sk-hero button:focus-visible,
  .sk-hero input:focus-visible,
  .sk-hero select:focus-visible,
  .sk-hero textarea:focus-visible,
  .sk-hero summary:focus-visible,
  .sk-hero [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

  @container (min-width: 56rem) {
    .sk-hero h1,
    .sk-hero h2 {
      font-size: var(--sk-type-size-5xl);
    }

    .sk-hero[data-layout="split"] .sk-hero__inner {
      grid-template-columns: minmax(0, 1.1fr) minmax(18rem, .9fr);
      align-items: start;
    }
  }
}

@layer components { .sk-icon { display: inline-grid; place-items: center; inline-size: var(--sk-size-control-md); block-size: var(--sk-size-control-md); aspect-ratio: 1; border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-card); color: var(--sk-text-primary); font-family: var(--sk-font-mono); line-height: 1; }  .sk-icon a:focus-visible, .sk-icon button:focus-visible, .sk-icon input:focus-visible, .sk-icon select:focus-visible, .sk-icon textarea:focus-visible, .sk-icon summary:focus-visible, .sk-icon [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-image { display: grid; gap: var(--sk-space-3); margin: 0; } .sk-image div { display: grid; place-items: center; aspect-ratio: 16 / 9; border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-raised); color: var(--sk-text-muted); font-family: var(--sk-font-mono); } .sk-image figcaption { color: var(--sk-text-secondary); font-size: var(--sk-type-size-sm); }  .sk-image a:focus-visible, .sk-image button:focus-visible, .sk-image input:focus-visible, .sk-image select:focus-visible, .sk-image textarea:focus-visible, .sk-image summary:focus-visible, .sk-image [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-label { display: inline-block; color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); line-height: var(--sk-type-line-tight); text-transform: uppercase; }  .sk-label a:focus-visible, .sk-label button:focus-visible, .sk-label input:focus-visible, .sk-label select:focus-visible, .sk-label textarea:focus-visible, .sk-label summary:focus-visible, .sk-label [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-link { color: var(--sk-text-primary); font-family: var(--sk-font-mono); text-decoration: underline; text-underline-offset: var(--sk-border-2); } .sk-link:hover { text-decoration-thickness: var(--sk-border-2); } .sk-link:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-list { display: grid; gap: var(--sk-space-2); padding-inline-start: var(--sk-space-5); color: var(--sk-text-primary); } .sk-list li::marker { color: var(--sk-text-muted); }  .sk-list a:focus-visible, .sk-list button:focus-visible, .sk-list input:focus-visible, .sk-list select:focus-visible, .sk-list textarea:focus-visible, .sk-list summary:focus-visible, .sk-list [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components {
  .sk-metadata-panel {
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-card);
    color: var(--sk-text-primary);
    padding: var(--sk-space-4);
    container-type: inline-size;
  }

  .sk-metadata-panel dl {
    display: grid;
    gap: 0;
    margin: 0;
  }

  .sk-metadata-panel div {
    display: flex;
    justify-content: space-between;
    gap: var(--sk-space-4);
    padding-block: var(--sk-space-3);
    border-block-end: var(--sk-border-1) dashed var(--sk-border-subtle);
    font-size: var(--sk-type-size-sm);
  }

  .sk-metadata-panel div:last-child {
    border-block-end: 0;
  }

  .sk-metadata-panel dt {
    color: var(--sk-text-muted);
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-xs);
    line-height: var(--sk-type-line-tight);
    text-transform: uppercase;
  }

  .sk-metadata-panel dd {
    margin: 0;
    font-weight: var(--sk-type-weight-bold);
    text-align: end;
  }

  .sk-metadata-panel a:focus-visible,
  .sk-metadata-panel button:focus-visible,
  .sk-metadata-panel input:focus-visible,
  .sk-metadata-panel select:focus-visible,
  .sk-metadata-panel textarea:focus-visible,
  .sk-metadata-panel summary:focus-visible,
  .sk-metadata-panel [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }
}

@layer components { .sk-modal { max-inline-size: min(100% - (2 * var(--sk-space-4)), 42rem); border: var(--sk-border-2) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-raised); color: var(--sk-text-primary); padding: var(--sk-space-6); box-shadow: var(--sk-shadow-none); } .sk-modal::backdrop { background: color-mix(in srgb, var(--sk-surface-inverse) 72%, transparent); } .sk-modal .sk-modal__actions { display: flex; flex-wrap: wrap; gap: var(--sk-space-3); justify-content: flex-start; } .sk-modal a:focus-visible, .sk-modal button:focus-visible, .sk-modal input:focus-visible, .sk-modal select:focus-visible, .sk-modal textarea:focus-visible, .sk-modal summary:focus-visible, .sk-modal [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-navigation { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sk-space-4); border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-card); padding: var(--sk-space-4); } .sk-navigation a { color: var(--sk-text-primary); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); text-transform: uppercase; } .sk-navigation a:focus-visible, .sk-navigation button:focus-visible, .sk-navigation input:focus-visible, .sk-navigation select:focus-visible, .sk-navigation textarea:focus-visible, .sk-navigation summary:focus-visible, .sk-navigation [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components {
  .sk-newsletter-signup {
    display: grid;
    gap: var(--sk-space-6);
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-card);
    padding: var(--sk-space-5);
    container-type: inline-size;
  }

  .sk-newsletter-signup__copy {
    display: grid;
    gap: var(--sk-space-3);
    align-content: center;
  }

  .sk-newsletter-signup__copy h2,
  .sk-newsletter-signup__copy p {
    margin: 0;
  }

  .sk-newsletter-signup__copy h2 {
    font-family: var(--sk-font-mono);
  }

  .sk-newsletter-signup p {
    color: var(--sk-text-secondary);
  }

  .sk-newsletter-signup__form {
    display: grid;
    gap: var(--sk-space-4);
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-page);
    padding: var(--sk-space-4);
  }

  .sk-newsletter-signup__form label {
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-sm);
  }

  .sk-newsletter-signup__form div {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sk-space-3);
    align-items: center;
  }

  .sk-newsletter-signup input {
    min-inline-size: min(100%, 18rem);
    min-block-size: var(--sk-size-control-md);
    border: var(--sk-border-1) solid var(--sk-border-default);
    border-radius: var(--sk-radius-0);
    background: var(--sk-surface-page);
    color: var(--sk-text-primary);
    padding: var(--sk-space-3);
  }

  @container (min-width: 48rem) {
    .sk-newsletter-signup[data-layout="split"],
    .sk-newsletter-signup:not([data-layout]) {
      grid-template-columns: minmax(0, 1fr) minmax(20rem, .9fr);
      align-items: center;
    }
  }

    .sk-newsletter-signup a:focus-visible,
    .sk-newsletter-signup button:focus-visible,
    .sk-newsletter-signup input:focus-visible,
    .sk-newsletter-signup select:focus-visible,
    .sk-newsletter-signup textarea:focus-visible,
    .sk-newsletter-signup summary:focus-visible,
    .sk-newsletter-signup [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

}

@layer components { .sk-pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--sk-space-2); } .sk-pagination a { border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-2) var(--sk-space-3); text-decoration: none; } .sk-pagination a:first-child, .sk-pagination a:last-child { font-family: var(--sk-font-mono); } .sk-pagination [aria-current="page"] { background: var(--sk-action-primary); color: var(--sk-action-primary-text); font-weight: var(--sk-type-weight-bold); } .sk-pagination a:focus-visible, .sk-pagination button:focus-visible, .sk-pagination input:focus-visible, .sk-pagination select:focus-visible, .sk-pagination textarea:focus-visible, .sk-pagination summary:focus-visible, .sk-pagination [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components {
  .sk-partners-strip {
    display: grid;
    gap: var(--sk-space-4);
    border-block: var(--sk-border-1) solid var(--sk-border-default);
    padding-block: var(--sk-space-5);
  }

  .sk-partners-strip h2 {
    font-size: var(--sk-type-size-lg);
  }

  .sk-partners-strip ul {
    display: grid;
    gap: var(--sk-space-3);
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr));
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .sk-partners-strip li {
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-card);
    padding: var(--sk-space-4);
    font-family: var(--sk-font-mono);
    text-align: center;
    text-transform: uppercase;
  }

    .sk-partners-strip a:focus-visible,
    .sk-partners-strip button:focus-visible,
    .sk-partners-strip input:focus-visible,
    .sk-partners-strip select:focus-visible,
    .sk-partners-strip textarea:focus-visible,
    .sk-partners-strip summary:focus-visible,
    .sk-partners-strip [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

}

@layer components { .sk-popover { position: relative; display: inline-grid; gap: var(--sk-space-2); color: var(--sk-text-primary); inline-size: max-content; } .sk-popover > * { min-inline-size: 0; } .sk-popover p { color: var(--sk-text-secondary); margin: 0; } .sk-popover [role="dialog"] { position: absolute; inset-block-start: calc(100% + var(--sk-space-2)); inset-inline-start: 0; z-index: var(--sk-z-dropdown); inline-size: min(80vw, 22rem); border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-raised); padding: var(--sk-space-4); opacity: 1; transform: translateY(0); transition: opacity var(--sk-motion-base) var(--sk-motion-ease), transform var(--sk-motion-base) var(--sk-motion-ease); } .sk-popover [role="dialog"][hidden] { display: block; visibility: hidden; opacity: 0; transform: translateY(calc(-1 * var(--sk-space-2))); pointer-events: none; } .sk-popover a:focus-visible, .sk-popover button:focus-visible, .sk-popover input:focus-visible, .sk-popover select:focus-visible, .sk-popover textarea:focus-visible, .sk-popover summary:focus-visible, .sk-popover [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components {
  .sk-pricing-table {
    overflow-x: visible;
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-raised);
  }

  .sk-pricing-table table {
    inline-size: 100%;
    min-inline-size: 0;
    table-layout: fixed;
    border-collapse: collapse;
    border: 0;
  }

  .sk-pricing-table caption {
    padding: var(--sk-space-4);
    border-block-end: var(--sk-border-1) solid var(--sk-border-default);
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-sm);
    font-weight: var(--sk-type-weight-bold);
    text-align: start;
    text-transform: uppercase;
  }

  .sk-pricing-table th,
  .sk-pricing-table td {
    border-block-start: var(--sk-border-1) solid var(--sk-border-subtle);
    border-inline-start: var(--sk-border-1) solid var(--sk-border-subtle);
    padding: var(--sk-space-3);
    text-align: start;
    vertical-align: top;
    overflow-wrap: anywhere;
  }

  .sk-pricing-table th:first-child,
  .sk-pricing-table td:first-child {
    border-inline-start: 0;
  }

  .sk-pricing-table tbody tr:last-child th,
  .sk-pricing-table tbody tr:last-child td {
    border-block-end: 0;
  }

  .sk-pricing-table td[data-price] {
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-xl);
    font-weight: var(--sk-type-weight-bold);
  }

  .sk-pricing-table th {
    background: var(--sk-surface-subtle);
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-sm);
  }

  .sk-pricing-table a:focus-visible,
  .sk-pricing-table button:focus-visible,
  .sk-pricing-table input:focus-visible,
  .sk-pricing-table select:focus-visible,
  .sk-pricing-table textarea:focus-visible,
  .sk-pricing-table summary:focus-visible,
  .sk-pricing-table [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }
}

@layer components {
  .sk-product-card {
    position: relative;
    border: var(--sk-border-1) solid var(--sk-border-default);
    border-radius: var(--sk-radius-0);
    background: var(--sk-surface-card);
    color: var(--sk-text-primary);
    padding: var(--sk-component-card-padding);
    box-shadow: var(--sk-shadow-none);
    container-type: inline-size;
  }

  .sk-product-card::before,
  .sk-product-card::after {
    content: "";
    position: absolute;
    inline-size: var(--sk-space-4);
    block-size: var(--sk-space-4);
    border-color: var(--sk-border-default);
    pointer-events: none;
  }

  .sk-product-card::before {
    inset-block-start: var(--sk-space-2);
    inset-inline-start: var(--sk-space-2);
    border-block-start: var(--sk-border-1) solid;
    border-inline-start: var(--sk-border-1) solid;
  }

  .sk-product-card::after {
    inset-block-end: var(--sk-space-2);
    inset-inline-end: var(--sk-space-2);
    border-block-end: var(--sk-border-1) solid;
    border-inline-end: var(--sk-border-1) solid;
  }

  .sk-product-card > * + * {
    margin-block-start: var(--sk-component-card-gap);
  }

  .sk-product-card__layout {
    display: grid;
    gap: var(--sk-space-4);
    align-items: stretch;
  }

  .sk-product-card__layout > * {
    min-inline-size: 0;
  }

  .sk-product-card [data-product-media] {
    display: grid;
    place-items: center;
    min-block-size: 10rem;
    aspect-ratio: 1;
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-subtle);
    color: var(--sk-text-muted);
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-xs);
    text-transform: uppercase;
  }

  .sk-product-card h2,
  .sk-product-card h3 {
    margin: 0;
    font-family: var(--sk-font-mono);
  }

  .sk-product-card__price {
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-xl);
    font-weight: var(--sk-type-weight-bold);
  }

  .sk-product-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sk-space-3);
  }

  @container (min-width: 30rem) {
    .sk-product-card__layout {
      grid-template-columns: minmax(0, 1fr) minmax(9rem, .7fr);
    }
  }

  .sk-product-card p {
    color: var(--sk-text-secondary);
  }

  .sk-product-card[aria-busy="true"] {
    cursor: progress;
  }

  .sk-product-card[data-state="error"] {
    border-color: var(--sk-state-danger);
  }

  .sk-product-card a:focus-visible,
  .sk-product-card button:focus-visible,
  .sk-product-card input:focus-visible,
  .sk-product-card select:focus-visible,
  .sk-product-card textarea:focus-visible,
  .sk-product-card summary:focus-visible,
  .sk-product-card [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }
}

@layer components {
  .sk-product-grid {
    display: grid;
    gap: var(--sk-component-grid-gap);
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
  }

  .sk-product-grid > * {
    display: grid;
    gap: var(--sk-space-3);
    align-content: start;
    border: var(--sk-border-1) solid var(--sk-border-default);
    border-radius: var(--sk-radius-0);
    background: var(--sk-surface-card);
    padding: var(--sk-space-5);
  }

  .sk-product-grid [data-product-media] {
    display: grid;
    place-items: center;
    aspect-ratio: 4 / 3;
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-subtle);
    color: var(--sk-text-muted);
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-xs);
    text-transform: uppercase;
  }

  .sk-product-grid h3 {
    margin: 0;
    font-family: var(--sk-font-mono);
  }

  .sk-product-grid a:focus-visible,
  .sk-product-grid button:focus-visible,
  .sk-product-grid input:focus-visible,
  .sk-product-grid select:focus-visible,
  .sk-product-grid textarea:focus-visible,
  .sk-product-grid summary:focus-visible,
  .sk-product-grid [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

  .sk-product-grid[data-density="dense"] {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr));
  }
}

@layer components {
  .sk-product-showcase {
    display: grid;
    gap: var(--sk-space-5);
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-card);
    padding: var(--sk-space-5);
    container-type: inline-size;
  }

  .sk-product-showcase__intro {
    display: grid;
    justify-items: start;
    gap: var(--sk-space-3);
  }

  .sk-product-showcase__intro p {
    color: var(--sk-text-secondary);
  }

  .sk-product-showcase__items {
    display: grid;
    gap: var(--sk-space-4);
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
  }

  .sk-product-showcase__hero {
    display: grid;
    place-items: center;
    min-block-size: 16rem;
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-subtle);
    font-family: var(--sk-font-mono);
    text-transform: uppercase;
  }

  .sk-product-showcase article {
    display: grid;
    gap: var(--sk-space-3);
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-page);
    padding: var(--sk-space-4);
  }

  @container (min-width: 58rem) {
    .sk-product-showcase {
      grid-template-columns: minmax(0, 1.1fr) minmax(18rem, .9fr);
      align-items: stretch;
    }

    .sk-product-showcase__intro {
      align-content: center;
    }

    .sk-product-showcase__items {
      grid-column: 1 / -1;
    }
  }

  .sk-product-showcase h3 {
    font-family: var(--sk-font-mono);
  }

    .sk-product-showcase a:focus-visible,
    .sk-product-showcase button:focus-visible,
    .sk-product-showcase input:focus-visible,
    .sk-product-showcase select:focus-visible,
    .sk-product-showcase textarea:focus-visible,
    .sk-product-showcase summary:focus-visible,
    .sk-product-showcase [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

}

@layer components { .sk-progress-bar { overflow: hidden; block-size: var(--sk-space-4); border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-card); } .sk-progress-bar span { display: block; block-size: 100%; background: var(--sk-text-primary); }  .sk-progress-bar a:focus-visible, .sk-progress-bar button:focus-visible, .sk-progress-bar input:focus-visible, .sk-progress-bar select:focus-visible, .sk-progress-bar textarea:focus-visible, .sk-progress-bar summary:focus-visible, .sk-progress-bar [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-progress-indicator { display: flex; flex-wrap: wrap; gap: var(--sk-space-3); padding: 0; margin: 0; list-style: none; } .sk-progress-indicator li { border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-card); padding: var(--sk-space-2) var(--sk-space-3); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); text-transform: uppercase; } .sk-progress-indicator [data-current] { font-weight: var(--sk-type-weight-bold); }  .sk-progress-indicator a:focus-visible, .sk-progress-indicator button:focus-visible, .sk-progress-indicator input:focus-visible, .sk-progress-indicator select:focus-visible, .sk-progress-indicator textarea:focus-visible, .sk-progress-indicator summary:focus-visible, .sk-progress-indicator [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components {
  .sk-promo-banner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sk-space-4);
    position: relative;
    border: var(--sk-border-1) solid var(--sk-border-default);
    border-radius: var(--sk-radius-0);
    background: var(--sk-surface-card);
    color: var(--sk-text-primary);
    padding: var(--sk-component-card-padding);
    box-shadow: var(--sk-shadow-none);
    container-type: inline-size;
  }

  .sk-promo-banner::before,
  .sk-promo-banner::after {
    content: "";
    position: absolute;
    inline-size: var(--sk-space-4);
    block-size: var(--sk-space-4);
    border-color: var(--sk-border-default);
    pointer-events: none;
  }

  .sk-promo-banner::before {
    inset-block-start: var(--sk-space-2);
    inset-inline-start: var(--sk-space-2);
    border-block-start: var(--sk-border-1) solid;
    border-inline-start: var(--sk-border-1) solid;
  }

  .sk-promo-banner::after {
    inset-block-end: var(--sk-space-2);
    inset-inline-end: var(--sk-space-2);
    border-block-end: var(--sk-border-1) solid;
    border-inline-end: var(--sk-border-1) solid;
  }

  .sk-promo-banner > * + * {
    margin-block-start: 0;
  }

  .sk-promo-banner h2 {
    margin: 0;
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-lg);
  }

  .sk-promo-banner p {
    margin: 0;
    color: var(--sk-text-secondary);
  }

  .sk-promo-banner__copy {
    display: grid;
    gap: var(--sk-space-2);
  }

  .sk-promo-banner__actions,
  .sk-promo-banner > div:last-child {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sk-space-3);
  }

  .sk-promo-banner[aria-busy="true"] {
    cursor: progress;
  }

  .sk-promo-banner[data-state="error"] {
    border-color: var(--sk-state-danger);
  }

  .sk-promo-banner a:focus-visible,
  .sk-promo-banner button:focus-visible,
  .sk-promo-banner input:focus-visible,
  .sk-promo-banner select:focus-visible,
  .sk-promo-banner textarea:focus-visible,
  .sk-promo-banner summary:focus-visible,
  .sk-promo-banner [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }
}

@layer components { .sk-quote { display: grid; gap: var(--sk-space-3); margin: 0; border-inline-start: var(--sk-border-2) solid var(--sk-border-default); background: var(--sk-surface-card); padding: var(--sk-space-5); } .sk-quote blockquote { margin: 0; font-size: var(--sk-type-size-lg); } .sk-quote figcaption { color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); text-transform: uppercase; }  .sk-quote a:focus-visible, .sk-quote button:focus-visible, .sk-quote input:focus-visible, .sk-quote select:focus-visible, .sk-quote textarea:focus-visible, .sk-quote summary:focus-visible, .sk-quote [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-radio-button { display: grid; gap: var(--sk-space-3); color: var(--sk-text-primary); border: var(--sk-border-1) solid var(--sk-border-default); padding: var(--sk-space-4); } .sk-radio-button label, .sk-radio-button legend, .sk-radio-button__label { color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); line-height: var(--sk-type-line-tight); text-transform: uppercase; } .sk-radio-button input, .sk-radio-button select, .sk-radio-button textarea { border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-3); font: inherit; } .sk-radio-button label { display: flex; align-items: center; gap: var(--sk-space-3); color: var(--sk-text-primary); font-family: inherit; font-size: inherit; text-transform: none; cursor: pointer; } .sk-radio-button input[type="radio"] { appearance: none; display: inline-grid; place-items: center; inline-size: var(--sk-size-control-sm); block-size: var(--sk-size-control-sm); padding: 0; flex: 0 0 auto; } .sk-radio-button input[type="radio"]::before { content: ""; inline-size: var(--sk-space-3); block-size: var(--sk-space-3); background: transparent; } .sk-radio-button input[type="radio"]:checked::before { background: var(--sk-action-primary); } .sk-radio-button a:focus-visible, .sk-radio-button button:focus-visible, .sk-radio-button input:focus-visible, .sk-radio-button select:focus-visible, .sk-radio-button textarea:focus-visible, .sk-radio-button summary:focus-visible, .sk-radio-button [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-rating { display: flex; gap: var(--sk-space-1); color: var(--sk-text-primary); font-family: var(--sk-font-sans); font-size: var(--sk-type-size-lg); line-height: 1; }  .sk-rating a:focus-visible, .sk-rating button:focus-visible, .sk-rating input:focus-visible, .sk-rating select:focus-visible, .sk-rating textarea:focus-visible, .sk-rating summary:focus-visible, .sk-rating [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components {
  .sk-recent-posts {
    display: grid;
    gap: var(--sk-space-4);
  }

  .sk-recent-posts > div {
    display: grid;
    gap: var(--sk-space-4);
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
  }

  .sk-recent-posts article {
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-card);
    padding: var(--sk-space-5);
  }

  .sk-recent-posts__meta {
    color: var(--sk-text-muted);
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-xs);
    text-transform: uppercase;
  }

  .sk-recent-posts h3 {
    font-family: var(--sk-font-mono);
  }

  .sk-recent-posts p {
    color: var(--sk-text-secondary);
  }

    .sk-recent-posts a:focus-visible,
    .sk-recent-posts button:focus-visible,
    .sk-recent-posts input:focus-visible,
    .sk-recent-posts select:focus-visible,
    .sk-recent-posts textarea:focus-visible,
    .sk-recent-posts summary:focus-visible,
    .sk-recent-posts [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

}

@layer components {
  .sk-resource-links {
    display: grid;
    gap: var(--sk-space-4);
  }

  .sk-resource-links ul {
    display: grid;
    gap: var(--sk-space-3);
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .sk-resource-links li {
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-card);
    padding: var(--sk-space-4);
  }

  .sk-resource-links a {
    color: var(--sk-text-primary);
    font-family: var(--sk-font-mono);
  }

  .sk-resource-links p {
    color: var(--sk-text-secondary);
  }

    .sk-resource-links a:focus-visible,
    .sk-resource-links button:focus-visible,
    .sk-resource-links input:focus-visible,
    .sk-resource-links select:focus-visible,
    .sk-resource-links textarea:focus-visible,
    .sk-resource-links summary:focus-visible,
    .sk-resource-links [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

}

@layer components { .sk-rich-text-editor { display: grid; gap: var(--sk-space-4); border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-5); } .sk-rich-text-editor > * { min-inline-size: 0; } .sk-rich-text-editor p { color: var(--sk-text-secondary); } .sk-rich-text-editor [role="toolbar"] { display: flex; gap: var(--sk-space-2); } .sk-rich-text-editor button { border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-raised); padding: var(--sk-space-2) var(--sk-space-3); } .sk-rich-text-editor [contenteditable] { min-block-size: 10rem; border: var(--sk-border-1) solid var(--sk-border-default); padding: var(--sk-space-4); } .sk-rich-text-editor a:focus-visible, .sk-rich-text-editor button:focus-visible, .sk-rich-text-editor input:focus-visible, .sk-rich-text-editor select:focus-visible, .sk-rich-text-editor textarea:focus-visible, .sk-rich-text-editor summary:focus-visible, .sk-rich-text-editor [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components {
  .sk-roadmap {
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-card);
    padding: var(--sk-space-5);
  }

  .sk-roadmap ol {
    display: grid;
    gap: var(--sk-space-4);
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .sk-roadmap li {
    border-inline-start: var(--sk-border-heavy) solid var(--sk-border-default);
    padding-inline-start: var(--sk-space-4);
  }

  .sk-roadmap time,
  .sk-roadmap h3 {
    font-family: var(--sk-font-mono);
  }

  .sk-roadmap time {
    color: var(--sk-text-muted);
    font-size: var(--sk-type-size-xs);
    text-transform: uppercase;
  }

  .sk-roadmap p {
    color: var(--sk-text-secondary);
  }

    .sk-roadmap a:focus-visible,
    .sk-roadmap button:focus-visible,
    .sk-roadmap input:focus-visible,
    .sk-roadmap select:focus-visible,
    .sk-roadmap textarea:focus-visible,
    .sk-roadmap summary:focus-visible,
    .sk-roadmap [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

}

@layer components { .sk-search-input { display: grid; gap: var(--sk-space-2); color: var(--sk-text-primary); } .sk-search-input label, .sk-search-input legend, .sk-search-input__label { color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); line-height: var(--sk-type-line-tight); text-transform: uppercase; } .sk-search-input input, .sk-search-input select, .sk-search-input textarea { inline-size: 100%; border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-3); font: inherit; } .sk-search-input > div { display: flex; gap: var(--sk-space-3); } .sk-search-input input { flex: 1; } .sk-search-input a:focus-visible, .sk-search-input button:focus-visible, .sk-search-input input:focus-visible, .sk-search-input select:focus-visible, .sk-search-input textarea:focus-visible, .sk-search-input summary:focus-visible, .sk-search-input [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-segmented-control { display: inline-flex; border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-border-default); gap: var(--sk-border-1); } .sk-segmented-control button { border: 0; background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-2) var(--sk-space-3); font-family: var(--sk-font-mono); cursor: pointer; } .sk-segmented-control button:hover { background: var(--sk-surface-subtle); } .sk-segmented-control [aria-pressed="true"] { background: var(--sk-action-primary); color: var(--sk-action-primary-text); font-weight: var(--sk-type-weight-bold); } .sk-segmented-control a:focus-visible, .sk-segmented-control button:focus-visible, .sk-segmented-control input:focus-visible, .sk-segmented-control select:focus-visible, .sk-segmented-control textarea:focus-visible, .sk-segmented-control summary:focus-visible, .sk-segmented-control [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-select { display: grid; gap: var(--sk-space-2); color: var(--sk-text-primary); } .sk-select label, .sk-select legend, .sk-select__label { color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); line-height: var(--sk-type-line-tight); text-transform: uppercase; } .sk-select select { appearance: none; inline-size: 100%; min-block-size: var(--sk-size-control-lg); border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: linear-gradient(45deg, transparent 50%, var(--sk-text-primary) 50%) calc(100% - var(--sk-space-4)) 50% / var(--sk-space-2) var(--sk-space-2) no-repeat, var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-3) var(--sk-space-8) var(--sk-space-3) var(--sk-space-3); font: inherit; } .sk-select option { background: var(--sk-surface-card); color: var(--sk-text-primary); } .sk-select a:focus-visible, .sk-select button:focus-visible, .sk-select input:focus-visible, .sk-select select:focus-visible, .sk-select textarea:focus-visible, .sk-select summary:focus-visible, .sk-select [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-separator { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: var(--sk-space-3); inline-size: 100%; border: 0; color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); } .sk-separator::before, .sk-separator::after { content: ""; block-size: var(--sk-border-1); background: var(--sk-border-default); }  .sk-separator a:focus-visible, .sk-separator button:focus-visible, .sk-separator input:focus-visible, .sk-separator select:focus-visible, .sk-separator textarea:focus-visible, .sk-separator summary:focus-visible, .sk-separator [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-skeleton { display: grid; gap: var(--sk-space-4); inline-size: min(100%, 26rem); border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-card); padding: var(--sk-space-5); } .sk-skeleton__media, .sk-skeleton span { display: block; border: var(--sk-border-1) solid var(--sk-border-subtle); background: linear-gradient(90deg, var(--sk-surface-subtle), var(--sk-surface-raised), var(--sk-surface-subtle)); background-size: 200% 100%; } .sk-skeleton__media { aspect-ratio: 16 / 9; } .sk-skeleton span { block-size: var(--sk-space-4); } .sk-skeleton span:nth-child(3) { inline-size: 82%; } .sk-skeleton span:nth-child(4) { inline-size: 64%; } @media (prefers-reduced-motion: no-preference) { .sk-skeleton__media, .sk-skeleton span { animation: sk-skeleton-pulse 1400ms var(--sk-motion-ease) infinite; } } @keyframes sk-skeleton-pulse { 0% { background-position: 100% 0; } 100% { background-position: -100% 0; } } .sk-skeleton a:focus-visible, .sk-skeleton button:focus-visible, .sk-skeleton input:focus-visible, .sk-skeleton select:focus-visible, .sk-skeleton textarea:focus-visible, .sk-skeleton summary:focus-visible, .sk-skeleton [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-skip-link { display: inline-block; border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-2) var(--sk-space-3); font-family: var(--sk-font-mono); } .sk-skip-link:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-slider { display: grid; gap: var(--sk-space-2); color: var(--sk-text-primary); } .sk-slider label, .sk-slider legend, .sk-slider__label { color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); line-height: var(--sk-type-line-tight); text-transform: uppercase; } .sk-slider input, .sk-slider select, .sk-slider textarea { inline-size: 100%; border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-3); font: inherit; }  .sk-slider a:focus-visible, .sk-slider button:focus-visible, .sk-slider input:focus-visible, .sk-slider select:focus-visible, .sk-slider textarea:focus-visible, .sk-slider summary:focus-visible, .sk-slider [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-spinner { display: inline-grid; grid-template-columns: repeat(3, var(--sk-space-4)); grid-auto-rows: var(--sk-space-4); gap: var(--sk-space-1); inline-size: auto; block-size: auto; } .sk-spinner span:not(.sk-sr-only) { display: block; border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-subtle); animation: none; } @media (prefers-reduced-motion: no-preference) { .sk-spinner span:not(.sk-sr-only) { animation: sk-spinner-blink 1800ms var(--sk-motion-ease) infinite; } .sk-spinner span:nth-child(2) { animation-delay: 120ms; } .sk-spinner span:nth-child(3) { animation-delay: 360ms; } .sk-spinner span:nth-child(4) { animation-delay: 720ms; } .sk-spinner span:nth-child(5) { animation-delay: 240ms; } .sk-spinner span:nth-child(6) { animation-delay: 960ms; } .sk-spinner span:nth-child(7) { animation-delay: 480ms; } .sk-spinner span:nth-child(8) { animation-delay: 1320ms; } .sk-spinner span:nth-child(9) { animation-delay: 600ms; } } @keyframes sk-spinner-blink { 0%, 100% { background: var(--sk-surface-subtle); } 35% { background: var(--sk-state-success); } 68% { background: var(--sk-surface-raised); } } .sk-spinner a:focus-visible, .sk-spinner button:focus-visible, .sk-spinner input:focus-visible, .sk-spinner select:focus-visible, .sk-spinner textarea:focus-visible, .sk-spinner summary:focus-visible, .sk-spinner [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-stack-component { display: grid; gap: var(--sk-space-4); } .sk-stack-component > * { border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-card); padding: var(--sk-space-4); }  .sk-stack a:focus-visible, .sk-stack button:focus-visible, .sk-stack input:focus-visible, .sk-stack select:focus-visible, .sk-stack textarea:focus-visible, .sk-stack summary:focus-visible, .sk-stack [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components {
  .sk-stats-bar {
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-card);
    padding: var(--sk-space-4);
  }

  .sk-stats-bar dl {
    display: grid;
    gap: var(--sk-space-3);
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr));
    margin: 0;
  }

  .sk-stats-bar div {
    border: var(--sk-border-1) solid var(--sk-border-subtle);
    padding: var(--sk-space-4);
  }

  .sk-stats-bar dt {
    color: var(--sk-text-muted);
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-xs);
    text-transform: uppercase;
  }

  .sk-stats-bar dd {
    margin: 0;
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-3xl);
    line-height: var(--sk-type-line-tight);
  }

    .sk-stats-bar a:focus-visible,
    .sk-stats-bar button:focus-visible,
    .sk-stats-bar input:focus-visible,
    .sk-stats-bar select:focus-visible,
    .sk-stats-bar textarea:focus-visible,
    .sk-stats-bar summary:focus-visible,
    .sk-stats-bar [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

}

@layer components { .sk-stepper { display: grid; gap: var(--sk-space-2); color: var(--sk-text-primary); } .sk-stepper label, .sk-stepper legend, .sk-stepper__label { color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); line-height: var(--sk-type-line-tight); text-transform: uppercase; } .sk-stepper input, .sk-stepper select, .sk-stepper textarea { border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-3); font: inherit; } .sk-stepper > div { display: inline-flex; gap: var(--sk-border-1); border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-border-default); justify-self: start; } .sk-stepper button, .sk-stepper input { min-block-size: var(--sk-size-control-md); border: 0; background: var(--sk-surface-card); } .sk-stepper button { inline-size: var(--sk-size-control-md); padding: 0; font-family: var(--sk-font-mono); cursor: pointer; } .sk-stepper button:hover { background: var(--sk-action-primary); color: var(--sk-action-primary-text); } .sk-stepper input { inline-size: var(--sk-size-control-lg); text-align: center; appearance: textfield; } .sk-stepper input::-webkit-outer-spin-button, .sk-stepper input::-webkit-inner-spin-button { appearance: none; margin: 0; } .sk-stepper a:focus-visible, .sk-stepper button:focus-visible, .sk-stepper input:focus-visible, .sk-stepper select:focus-visible, .sk-stepper textarea:focus-visible, .sk-stepper summary:focus-visible, .sk-stepper [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-table { overflow-x: auto; } .sk-table table { inline-size: 100%; border-collapse: collapse; border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-card); } .sk-table caption { padding: var(--sk-space-3); font-family: var(--sk-font-mono); text-align: start; } .sk-table th, .sk-table td { border: var(--sk-border-1) solid var(--sk-border-default); padding: var(--sk-space-3); text-align: start; }  .sk-table a:focus-visible, .sk-table button:focus-visible, .sk-table input:focus-visible, .sk-table select:focus-visible, .sk-table textarea:focus-visible, .sk-table summary:focus-visible, .sk-table [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components {
  .sk-tabs {
    display: grid;
    gap: 0;
  }

  .sk-tabs [role="tablist"] {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    border-block-end: 0;
  }

  .sk-tabs [role="tab"] {
    border: var(--sk-border-1) solid var(--sk-border-default);
    border-inline-end: 0;
    border-block-end: 0;
    background: var(--sk-surface-subtle);
    color: var(--sk-text-primary);
    padding: var(--sk-space-2) var(--sk-space-3);
    font-family: var(--sk-font-mono);
    cursor: pointer;
  }

  .sk-tabs [role="tab"]:last-child {
    border-inline-end: var(--sk-border-1) solid var(--sk-border-default);
  }

  .sk-tabs [role="tab"][aria-selected="true"] {
    background: var(--sk-surface-raised);
    font-weight: var(--sk-type-weight-bold);
  }

  .sk-tabs [role="tabpanel"] {
    margin: 0;
    border: var(--sk-border-1) solid var(--sk-border-default);
    padding: var(--sk-space-4);
    background: var(--sk-surface-raised);
  }

  .sk-tabs a:focus-visible,
  .sk-tabs button:focus-visible,
  .sk-tabs input:focus-visible,
  .sk-tabs select:focus-visible,
  .sk-tabs textarea:focus-visible,
  .sk-tabs summary:focus-visible,
  .sk-tabs [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }
}

@layer components {
  .sk-team-grid {
    display: grid;
    gap: var(--sk-space-4);
  }

  .sk-team-grid ul {
    display: grid;
    gap: var(--sk-space-4);
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .sk-team-grid li {
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-card);
    padding: var(--sk-space-5);
  }

  .sk-team-grid span {
    inline-size: var(--sk-size-control-lg);
    block-size: var(--sk-size-control-lg);
    display: grid;
    place-items: center;
    border: var(--sk-border-1) solid var(--sk-border-default);
    margin-block-end: var(--sk-space-4);
    font-family: var(--sk-font-mono);
  }

  .sk-team-grid h3 {
    font-family: var(--sk-font-mono);
  }

  .sk-team-grid p {
    color: var(--sk-text-secondary);
  }

    .sk-team-grid a:focus-visible,
    .sk-team-grid button:focus-visible,
    .sk-team-grid input:focus-visible,
    .sk-team-grid select:focus-visible,
    .sk-team-grid textarea:focus-visible,
    .sk-team-grid summary:focus-visible,
    .sk-team-grid [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

}

@layer components {
  .sk-testimonial-rail {
    display: grid;
    gap: var(--sk-space-4);
  }

  .sk-testimonial-rail > div {
    display: grid;
    gap: var(--sk-space-4);
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
  }

  .sk-testimonial-rail figure {
    margin: 0;
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-surface-card);
    padding: var(--sk-space-5);
  }

  .sk-testimonial-rail blockquote {
    margin: 0 0 var(--sk-space-4);
    color: var(--sk-text-primary);
  }

  .sk-testimonial-rail figcaption {
    color: var(--sk-text-muted);
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-sm);
  }

    .sk-testimonial-rail a:focus-visible,
    .sk-testimonial-rail button:focus-visible,
    .sk-testimonial-rail input:focus-visible,
    .sk-testimonial-rail select:focus-visible,
    .sk-testimonial-rail textarea:focus-visible,
    .sk-testimonial-rail summary:focus-visible,
    .sk-testimonial-rail [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }

}

@layer components { .sk-text-input { display: grid; gap: var(--sk-space-2); color: var(--sk-text-primary); } .sk-text-input label, .sk-text-input legend, .sk-text-input__label { color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); line-height: var(--sk-type-line-tight); text-transform: uppercase; } .sk-text-input input, .sk-text-input select, .sk-text-input textarea { inline-size: 100%; border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-3); font: inherit; }  .sk-text-input a:focus-visible, .sk-text-input button:focus-visible, .sk-text-input input:focus-visible, .sk-text-input select:focus-visible, .sk-text-input textarea:focus-visible, .sk-text-input summary:focus-visible, .sk-text-input [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-textarea { display: grid; gap: var(--sk-space-2); color: var(--sk-text-primary); } .sk-textarea label, .sk-textarea legend, .sk-textarea__label { color: var(--sk-text-muted); font-family: var(--sk-font-mono); font-size: var(--sk-type-size-xs); line-height: var(--sk-type-line-tight); text-transform: uppercase; } .sk-textarea input, .sk-textarea select, .sk-textarea textarea { inline-size: 100%; border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-3); font: inherit; } .sk-textarea textarea { min-block-size: 9rem; } .sk-textarea a:focus-visible, .sk-textarea button:focus-visible, .sk-textarea input:focus-visible, .sk-textarea select:focus-visible, .sk-textarea textarea:focus-visible, .sk-textarea summary:focus-visible, .sk-textarea [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-toast { display: grid; gap: var(--sk-space-3) var(--sk-space-4); grid-template-columns: 1fr auto; align-items: start; inline-size: min(100%, 26rem); border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-4); } .sk-toast[hidden] { display: none; } .sk-toast > * { min-inline-size: 0; } .sk-toast p { color: var(--sk-text-secondary); } .sk-toast strong, .sk-toast p { grid-column: 1; margin: 0; } .sk-toast button { grid-column: 2; grid-row: 1 / span 2; display: inline-grid; place-items: center; inline-size: var(--sk-size-control-md); block-size: var(--sk-size-control-md); border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-raised); color: var(--sk-text-primary); padding: 0; font-family: var(--sk-font-mono); cursor: pointer; } .sk-toast button:hover { background: var(--sk-action-primary); color: var(--sk-action-primary-text); } .sk-toast a:focus-visible, .sk-toast button:focus-visible, .sk-toast input:focus-visible, .sk-toast select:focus-visible, .sk-toast textarea:focus-visible, .sk-toast summary:focus-visible, .sk-toast [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-toggle { display: inline-flex; align-items: center; gap: var(--sk-space-3); color: var(--sk-text-primary); cursor: pointer; } .sk-toggle input { appearance: none; position: relative; inline-size: calc(var(--sk-size-control-lg) + var(--sk-space-2)); block-size: var(--sk-size-control-md); border: var(--sk-border-1) solid var(--sk-border-default); border-radius: var(--sk-radius-0); background: var(--sk-surface-card); cursor: pointer; } .sk-toggle input::before { content: ""; position: absolute; inset-block-start: var(--sk-space-1); inset-inline-start: var(--sk-space-1); inline-size: calc(var(--sk-size-control-md) - (2 * var(--sk-space-1)) - (2 * var(--sk-border-1))); block-size: calc(var(--sk-size-control-md) - (2 * var(--sk-space-1)) - (2 * var(--sk-border-1))); background: var(--sk-border-default); transition: transform var(--sk-motion-base) var(--sk-motion-ease); } .sk-toggle input:checked { background: var(--sk-action-primary); } .sk-toggle input:checked::before { background: var(--sk-action-primary-text); transform: translateX(var(--sk-size-control-md)); } .sk-toggle:focus-within { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); }  .sk-toggle a:focus-visible, .sk-toggle button:focus-visible, .sk-toggle input:focus-visible, .sk-toggle select:focus-visible, .sk-toggle textarea:focus-visible, .sk-toggle summary:focus-visible, .sk-toggle [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-tooltip { position: relative; display: inline-grid; gap: var(--sk-space-2); justify-items: center; } .sk-tooltip [role="tooltip"] { position: absolute; inset-block-end: calc(100% + var(--sk-space-2)); inset-inline-start: 50%; transform: translateX(-50%); inline-size: max-content; max-inline-size: 18rem; border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-card); color: var(--sk-text-primary); padding: var(--sk-space-2) var(--sk-space-3); font-size: var(--sk-type-size-sm); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity var(--sk-motion-base) var(--sk-motion-ease), visibility var(--sk-motion-base) var(--sk-motion-ease); z-index: var(--sk-z-dropdown); } .sk-tooltip:focus-within [role="tooltip"], .sk-tooltip:hover [role="tooltip"], .sk-tooltip [role="tooltip"]:not([hidden]) { opacity: 1; visibility: visible; } .sk-tooltip a:focus-visible, .sk-tooltip button:focus-visible, .sk-tooltip input:focus-visible, .sk-tooltip select:focus-visible, .sk-tooltip textarea:focus-visible, .sk-tooltip summary:focus-visible, .sk-tooltip [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-tree-view ul { display: grid; gap: var(--sk-space-2); padding-inline-start: var(--sk-space-5); margin: 0; } .sk-tree-view > ul { padding-inline-start: 0; list-style: none; } .sk-tree-view button, .sk-tree-view a { color: var(--sk-text-primary); font-family: var(--sk-font-mono); } .sk-tree-view a:focus-visible, .sk-tree-view button:focus-visible, .sk-tree-view input:focus-visible, .sk-tree-view select:focus-visible, .sk-tree-view textarea:focus-visible, .sk-tree-view summary:focus-visible, .sk-tree-view [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components {
  .sk-trust-strip {
    display: grid;
    gap: var(--sk-space-4);
    position: relative;
    border: var(--sk-border-1) solid var(--sk-border-default);
    border-radius: var(--sk-radius-0);
    background: var(--sk-surface-card);
    color: var(--sk-text-primary);
    padding: var(--sk-component-card-padding);
    box-shadow: var(--sk-shadow-none);
    container-type: inline-size;
  }

  .sk-trust-strip::before,
  .sk-trust-strip::after {
    content: "";
    position: absolute;
    inline-size: var(--sk-space-4);
    block-size: var(--sk-space-4);
    border-color: var(--sk-border-default);
    pointer-events: none;
  }

  .sk-trust-strip::before {
    inset-block-start: var(--sk-space-2);
    inset-inline-start: var(--sk-space-2);
    border-block-start: var(--sk-border-1) solid;
    border-inline-start: var(--sk-border-1) solid;
  }

  .sk-trust-strip::after {
    inset-block-end: var(--sk-space-2);
    inset-inline-end: var(--sk-space-2);
    border-block-end: var(--sk-border-1) solid;
    border-inline-end: var(--sk-border-1) solid;
  }

  .sk-trust-strip > * + * {
    margin-block-start: 0;
  }

  .sk-trust-strip h2 {
    margin: 0;
    font-family: var(--sk-font-mono);
    font-size: var(--sk-type-size-lg);
  }

  .sk-trust-strip ul {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr));
    gap: var(--sk-border-1);
    margin: 0;
    padding: 0;
    border: var(--sk-border-1) solid var(--sk-border-default);
    background: var(--sk-border-default);
    list-style: none;
  }

  .sk-trust-strip li {
    display: grid;
    gap: var(--sk-space-2);
    background: var(--sk-surface-card);
    padding: var(--sk-space-3);
  }

  .sk-trust-strip strong {
    font-family: var(--sk-font-mono);
  }

  .sk-trust-strip p {
    margin: 0;
    color: var(--sk-text-secondary);
  }

  .sk-trust-strip[aria-busy="true"] {
    cursor: progress;
  }

  .sk-trust-strip[data-state="error"] {
    border-color: var(--sk-state-danger);
  }

  .sk-trust-strip a:focus-visible,
  .sk-trust-strip button:focus-visible,
  .sk-trust-strip input:focus-visible,
  .sk-trust-strip select:focus-visible,
  .sk-trust-strip textarea:focus-visible,
  .sk-trust-strip summary:focus-visible,
  .sk-trust-strip [role="tab"]:focus-visible {
    outline: var(--sk-focus-width) solid var(--sk-focus-ring);
    outline-offset: var(--sk-focus-offset);
  }
}

@layer components { .sk-video { display: grid; gap: var(--sk-space-3); margin: 0; } .sk-video div { display: grid; place-items: center; aspect-ratio: 16 / 9; border: var(--sk-border-1) solid var(--sk-border-default); background: var(--sk-surface-raised); color: var(--sk-text-muted); font-family: var(--sk-font-mono); } .sk-video figcaption { color: var(--sk-text-secondary); }  .sk-video a:focus-visible, .sk-video button:focus-visible, .sk-video input:focus-visible, .sk-video select:focus-visible, .sk-video textarea:focus-visible, .sk-video summary:focus-visible, .sk-video [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }

@layer components { .sk-visually-hidden { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }  .sk-visually-hidden a:focus-visible, .sk-visually-hidden button:focus-visible, .sk-visually-hidden input:focus-visible, .sk-visually-hidden select:focus-visible, .sk-visually-hidden textarea:focus-visible, .sk-visually-hidden summary:focus-visible, .sk-visually-hidden [role="tab"]:focus-visible { outline: var(--sk-focus-width) solid var(--sk-focus-ring); outline-offset: var(--sk-focus-offset); } }
/* source: assets/css/sitekit/utilities.css */
@layer utilities { .sk-container { inline-size: min(100% - (2 * var(--sk-space-4)), var(--sk-size-content-xl)); margin-inline: auto; } .sk-stack { display: grid; gap: var(--sk-space-4); } .sk-cluster { display: flex; flex-wrap: wrap; gap: var(--sk-space-3); align-items: center; } .sk-grid { display: grid; gap: var(--sk-component-grid-gap); grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); } .sk-sr-only { position: absolute; inline-size: 1px; block-size: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; } }
/* source: assets/css/site.css */
@font-face{font-family:"Departure Mono";src:url("../fonts/DepartureMono-Regular.woff2?v=1.0.2") format("woff2"),url("../fonts/DepartureMono-Regular.woff?v=1.0.2") format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url("../fonts/inter-latin-400.woff2?v=1.0.2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url("../fonts/inter-latin-700.woff2?v=1.0.2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@layer theme{:root{--sk-font-sans:"Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--rd-red:var(--sk-color-red-600);--rd-paper:var(--sk-color-paper);--rd-measure:72ch}}
@layer base{
html{scroll-behavior:smooth;scrollbar-gutter:stable}body{overflow-x:hidden;background:var(--rd-paper);font-family:var(--sk-font-sans);font-size:clamp(1rem,.96rem + .18vw,1.08rem)}main{min-block-size:60vh}::selection{background:var(--rd-red);color:var(--sk-color-white)}a{text-decoration-thickness:var(--sk-border-1)}a:hover{text-decoration-thickness:var(--sk-border-2)}img{block-size:auto}
}
@layer components{
.sk-skip-link{position:fixed;inset:var(--sk-space-2) auto auto var(--sk-space-2);z-index:var(--sk-z-toast);translate:0 -160%}.sk-skip-link:focus{translate:0}
.site-header{position:relative;z-index:var(--sk-z-sticky);padding:0;border-block-end:var(--sk-border-1) solid var(--sk-border-default)}.site-header .sk-header__inner{inline-size:min(100%,var(--sk-size-content-xl));min-block-size:4.5rem;padding:var(--sk-space-4) clamp(var(--sk-space-4),3vw,var(--sk-space-8));border:0;background:color-mix(in srgb,var(--rd-paper) 94%,transparent)}.site-brand{display:inline-flex;gap:var(--sk-space-2);font-size:var(--sk-type-size-sm)!important;letter-spacing:.04em}.site-brand span,.signal-kicker,.section-index,.card-signal{color:var(--rd-red)}
.site-brand,.site-nav a,.site-menu summary,.site-menu nav a,.signal-kicker,.section-index,.card-signal,.sk-button,.listing-card-tags,.listing-card-button,.pagination,.article-meta,.article-taxonomy,.article-terms,.heading-anchor{font-family:var(--sk-font-mono)}
.site-nav a{position:relative;padding-block:var(--sk-space-2);text-decoration:none}.site-menu a{text-decoration:none}.site-nav a:hover{text-decoration:none}.site-nav a::after{content:"";position:absolute;inset:auto 0 0;block-size:var(--sk-border-2);background:var(--rd-red);scale:0 1;transform-origin:right;transition:scale var(--sk-motion-fast) var(--sk-motion-ease)}.site-nav a:hover::after,.site-nav a[aria-current=page]::after{scale:1;transform-origin:left}
.site-menu{display:none;position:relative}.site-menu summary{min-block-size:var(--sk-size-control-md);display:inline-flex;align-items:center;border:var(--sk-border-1) solid var(--sk-border-default);padding-inline:var(--sk-space-3);cursor:pointer;font-size:var(--sk-type-size-xs);text-transform:uppercase}.site-menu nav{position:absolute;inset:calc(100% + var(--sk-space-2)) 0 auto auto;min-inline-size:min(80vw,18rem);display:grid;border:var(--sk-border-1) solid var(--sk-border-default);background:var(--sk-surface-raised)}.site-menu nav a{padding:var(--sk-space-4);border-block-end:var(--sk-border-1) solid var(--sk-border-subtle)}
.signal-hero{position:relative;isolation:isolate;min-block-size:clamp(28rem,68vh,48rem);display:grid;align-items:end;overflow:hidden;border-block-end:var(--sk-border-1) solid var(--sk-border-default);background:var(--rd-paper)}.signal-hero__field{position:absolute;z-index:-2;inset:0;overflow:hidden}.signal-hero__field img{inline-size:100%;block-size:100%;max-inline-size:none;object-fit:cover;object-position:50% 0}.signal-hero__inner{inline-size:min(100% - 2*clamp(var(--sk-space-4),5vw,var(--sk-space-12)),var(--sk-size-content-xl));margin-inline:auto;padding-block:clamp(var(--sk-space-16),14vh,var(--sk-space-24)) clamp(var(--sk-space-8),8vh,var(--sk-space-16))}.signal-hero--article{min-block-size:clamp(32rem,78vh,54rem)}.signal-hero--page{min-block-size:clamp(24rem,58vh,40rem)}.signal-hero--error{min-block-size:calc(100vh - 12rem)}
.signal-kicker,.section-index,.card-signal{margin-block-end:var(--sk-space-4);font-size:var(--sk-type-size-xs);letter-spacing:.1em;text-transform:uppercase}.signal-kicker::before,.section-index::before,.card-signal::before{content:"["}.signal-kicker::after,.section-index::after,.card-signal::after{content:"]"}
.signal-title{position:relative;z-index:1;inline-size:min(18ch,100%);max-inline-size:100%;margin:0 0 var(--sk-space-6);font-size:clamp(2.6rem,8vw,7.8rem);line-height:.9;letter-spacing:0;overflow-wrap:anywhere;text-wrap:balance}.signal-hero--article .signal-title,.signal-hero--project .signal-title{inline-size:min(22ch,100%);font-size:clamp(2.35rem,6.6vw,6.5rem)}.signal-title::before,.signal-title::after{content:none}.signal-title[data-scrambling],.section-heading h2[data-scrambling],.flagship-panel h3[data-scrambling],.home-focus .sk-card h3[data-scrambling],.home-principles h3[data-scrambling],.project-secondary h3[data-scrambling],.project-link-bank h2[data-scrambling],.project-link-bank__columns a[data-scrambling],.article-related-grid .listing-card a[data-scrambling],.about-page h2[data-scrambling],.about-page h3[data-scrambling]{color:inherit}.signal-lede,.signal-kicker,.signal-hero .sk-breadcrumbs,.article-terms{inline-size:fit-content;padding:.08em .12em;background:color-mix(in srgb,var(--rd-paper) 88%,transparent);box-decoration-break:clone;-webkit-box-decoration-break:clone}.signal-lede{max-inline-size:64ch;margin-block-end:var(--sk-space-6);color:var(--sk-text-secondary);font-size:clamp(var(--sk-type-size-md),2vw,var(--sk-type-size-xl));line-height:var(--sk-type-line-normal)}.signal-actions,.article-terms{display:flex;flex-wrap:wrap;gap:var(--sk-space-3)}.article-terms .tag{padding:var(--sk-space-2) var(--sk-space-3);border:var(--sk-border-1) solid var(--sk-border-default);background:var(--sk-surface-raised);font-size:var(--sk-type-size-xs);text-transform:uppercase}
.section-heading{display:grid;grid-template-columns:minmax(8rem,.35fr) minmax(0,1fr);gap:var(--sk-space-8);margin-block-end:var(--sk-space-8);padding-block-end:var(--sk-space-6);border-block-end:var(--sk-border-1) solid var(--sk-border-default)}.section-heading h2{max-inline-size:24ch;font-size:clamp(var(--sk-type-size-2xl),4.4vw,var(--sk-type-size-4xl));letter-spacing:-.04em}.section-heading>p:last-child{grid-column:2;max-inline-size:66ch;color:var(--sk-text-secondary)}
.home-focus,.home-flagship,.home-closing,.writing-index,.page-content,.article-shell{padding-block:clamp(var(--sk-space-12),9vw,var(--sk-space-24))}.home-focus .sk-card{transition:background-color var(--sk-motion-fast) var(--sk-motion-ease),border-color var(--sk-motion-fast) var(--sk-motion-ease),box-shadow var(--sk-motion-fast) var(--sk-motion-ease),translate var(--sk-motion-fast) var(--sk-motion-ease)}.home-focus .sk-card:hover{translate:0 calc(-1*var(--sk-border-2));border-color:var(--rd-red);background:linear-gradient(135deg,color-mix(in srgb,var(--sk-surface-card) 92%,var(--rd-red)),var(--sk-surface-card));box-shadow:inset var(--sk-border-2) 0 0 var(--rd-red),0 var(--sk-space-2) 0 color-mix(in srgb,var(--sk-color-black) 18%,transparent)}.home-focus .sk-card h3{font-family:var(--sk-font-mono);font-size:var(--sk-type-size-xl);letter-spacing:0}.home-focus .sk-card .sk-button{inline-size:fit-content;margin-block-start:auto}.home-principles,.home-projects{padding-block:clamp(var(--sk-space-16),10vw,var(--sk-space-24));background:var(--sk-surface-inverse);color:var(--sk-text-inverse)}.section-heading--inverse{border-color:var(--sk-color-gray-500)}.section-heading--inverse h2,.home-principles h3,.home-principles a,.home-projects h3,.home-projects a{color:var(--sk-text-inverse)}.section-heading--inverse .section-index{color:var(--sk-color-gray-200)}
.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-block-start:var(--sk-border-1) solid var(--sk-color-gray-500);border-inline-start:var(--sk-border-1) solid var(--sk-color-gray-500)}.project-grid article{min-block-size:20rem;display:flex;flex-direction:column;padding:var(--sk-space-6);border-inline-end:var(--sk-border-1) solid var(--sk-color-gray-500);border-block-end:var(--sk-border-1) solid var(--sk-color-gray-500)}.project-grid article>p:first-child{color:var(--sk-color-gray-200);font-size:var(--sk-type-size-xs);letter-spacing:.08em;text-transform:uppercase}.project-grid h3{margin-block-start:auto;font-family:var(--sk-font-mono);font-size:var(--sk-type-size-2xl);letter-spacing:0}.project-grid article>p:not(:first-child){color:var(--sk-color-gray-300)}.project-grid a{margin-block-start:var(--sk-space-4);inline-size:fit-content}.home-page:not([data-page="1"]) .home-intro,.home-page:not([data-page="1"]) .home-projects{display:none}
.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:0;padding:0;border-block-start:var(--sk-border-1) solid var(--sk-border-default);border-inline-start:var(--sk-border-1) solid var(--sk-border-default);list-style:none}.listing-card{min-inline-size:0;min-block-size:22rem;display:flex;flex-direction:column;padding:var(--sk-space-5);border-inline-end:var(--sk-border-1) solid var(--sk-border-default);border-block-end:var(--sk-border-1) solid var(--sk-border-default);background:var(--sk-surface-card)}.listing-card-body{display:flex;flex:1;flex-direction:column}.listing-card-tags{display:flex;gap:var(--sk-space-1);margin-block-end:var(--sk-space-4);color:var(--rd-red);font-size:var(--sk-type-size-xs);text-transform:uppercase}.listing-card-title{font-size:clamp(var(--sk-type-size-lg),2vw,var(--sk-type-size-2xl));overflow-wrap:anywhere}.listing-card-title a{text-decoration:none}.listing-card-excerpt{color:var(--sk-text-secondary);font-size:var(--sk-type-size-sm)}.listing-card-button{margin-block-start:auto;padding-block-start:var(--sk-space-4);border-block-start:var(--sk-border-1) solid var(--sk-border-subtle);font-size:var(--sk-type-size-xs);text-transform:uppercase}
.pagination{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--sk-space-2);margin-block-start:var(--sk-space-8)}.pagination a,.pagination strong,.pagination-gap{min-inline-size:var(--sk-size-control-md);min-block-size:var(--sk-size-control-md);display:grid;place-items:center;border:var(--sk-border-1) solid var(--sk-border-default);padding:var(--sk-space-2);background:var(--sk-surface-card);color:var(--sk-text-primary);text-decoration:none}.pagination strong{background:var(--sk-action-primary);color:var(--sk-action-primary-text)}
.article-shell{display:grid;grid-template-columns:minmax(12rem,16rem) minmax(0,var(--rd-measure));justify-content:center;gap:clamp(var(--sk-space-8),7vw,var(--sk-space-20))}.article-meta{position:sticky;inset-block-start:100px;align-self:start}.article-meta .sk-metadata-panel div,.article-meta dl>div{align-items:center}.article-content,.page-content{min-inline-size:0;line-height:var(--sk-type-line-loose)}.page-content{max-inline-size:var(--sk-size-content-lg)}.article-content>*+*,.page-content>*+*{margin-block-start:var(--sk-space-6)}.article-content p,.article-content li,.page-content p,.page-content li{max-inline-size:var(--rd-measure)}.article-content h2,.page-content h2{margin-block-start:var(--sk-space-16);padding-block-start:0;border-block-start:0;font-size:clamp(var(--sk-type-size-2xl),4vw,var(--sk-type-size-4xl));letter-spacing:-.045em;scroll-margin-block-start:100px}.article-content h3,.page-content h3{margin-block-start:var(--sk-space-10);font-size:clamp(var(--sk-type-size-xl),3vw,var(--sk-type-size-2xl));scroll-margin-block-start:100px}.heading-anchor{color:var(--rd-red);font-size:.55em;text-decoration:none;vertical-align:middle}
.article-taxonomy{display:flex;flex-wrap:wrap;gap:var(--sk-space-2);margin-block-end:var(--sk-space-8)}.article-taxonomy a{border:var(--sk-border-1) solid var(--sk-border-default);padding:var(--sk-space-2) var(--sk-space-3);font-size:var(--sk-type-size-xs);text-transform:uppercase;text-decoration:none}.article-content blockquote,.page-content blockquote{margin-inline:0;border-inline-start:var(--sk-border-2) solid var(--rd-red);background:var(--sk-surface-card);padding:var(--sk-space-5);font-size:var(--sk-type-size-lg)}.article-content img,.page-content img,.article-content video,.article-content iframe{max-inline-size:100%;border:var(--sk-border-1) solid var(--sk-border-default)}.article-content iframe,.article-content video{inline-size:100%;aspect-ratio:16/9}.article-content figure,.page-content figure{margin-inline:0}.article-content :not(pre)>code,.page-content :not(pre)>code{border:var(--sk-border-1) solid var(--sk-border-subtle);background:var(--sk-surface-raised);padding:.08em .28em;overflow-wrap:anywhere}.sk-code-block{max-inline-size:100%}.sk-code-block pre{max-inline-size:100%;font-size:var(--sk-type-size-sm);line-height:var(--sk-type-line-normal);tab-size:2}
.article-toc{margin-block-end:var(--sk-space-12);border:var(--sk-border-1) solid var(--sk-border-default);padding:var(--sk-space-5);background:var(--sk-surface-card)}.article-toc h2,.article-toc__title{margin:0 0 var(--sk-space-4);padding:0;border:0;font-family:var(--sk-font-mono);font-size:var(--sk-type-size-lg);text-transform:uppercase}.article-toc ol{display:grid;gap:var(--sk-space-2);margin:0;padding:0;list-style:none;counter-reset:toc}.article-toc li{counter-increment:toc;display:grid;grid-template-columns:3ch minmax(0,1fr);gap:var(--sk-space-2);align-items:start}.article-toc li::before{content:counter(toc) ".";color:var(--sk-text-muted);font-family:var(--sk-font-mono);text-align:right}.article-toc a{min-inline-size:0}.article-toc__nested{margin-inline-start:var(--sk-space-4)}.article-footer{margin-block-start:var(--sk-space-16);padding-block-start:var(--sk-space-8);border-block-start:var(--sk-border-1) solid var(--sk-border-default)}.article-sequence{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sk-space-4);margin-block-start:var(--sk-space-8)}.article-sequence a{display:grid;min-block-size:9rem;border:var(--sk-border-1) solid var(--sk-border-default);padding:var(--sk-space-4);text-decoration:none}.article-sequence a:last-child{grid-column:2}.article-sequence span{margin-block-end:var(--sk-space-3);color:var(--rd-red);font-size:var(--sk-type-size-xs);text-transform:uppercase}
.archive-list ol{margin:0;padding:0;border-block-start:var(--sk-border-1) solid var(--sk-border-default);list-style:none}.archive-list li{display:grid;grid-template-columns:8rem minmax(0,1fr);gap:var(--sk-space-4);padding-block:var(--sk-space-4);border-block-end:0}.archive-list time{color:var(--sk-text-muted);font-size:var(--sk-type-size-xs)}.legacy-notice{margin-block-end:var(--sk-space-12)}.sk-content-section+section,.page-content>section+section{margin-block-start:var(--sk-space-16)}.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(16rem,.65fr);gap:var(--sk-space-8);align-items:start}.site-footer{border-block-start:var(--sk-border-1) solid var(--sk-border-default)}.site-footer .sk-footer__inner{inline-size:min(100%,var(--sk-size-content-xl));border:0}
@keyframes acquire{0%{opacity:.72;clip-path:inset(0 0 78%);translate:.06em -.02em}35%{clip-path:inset(42% 0 34%)}70%{opacity:.4;clip-path:inset(18% 0 56%);translate:-.03em 0}100%{opacity:0;clip-path:inset(0);translate:0}}@keyframes acquire2{0%{opacity:.55;clip-path:inset(76% 0 0)}50%{clip-path:inset(12% 0 63%);translate:-.05em 0}100%{opacity:0;clip-path:inset(0);translate:0}}
}
@media(max-width:64rem){.card-grid,.project-grid,.project-secondary__grid,.home-principles .project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.article-shell{grid-template-columns:minmax(0,var(--rd-measure))}.article-meta{position:static}.project-feature__panel,.flagship-layout{grid-template-columns:1fr}}
@media(max-width:48rem){.site-nav--desktop{display:none!important}.site-menu{display:block}.signal-hero{min-block-size:30rem}.signal-hero__field img{block-size:78%;object-position:42% 0}.signal-art--b .signal-hero__field img{object-position:64% 0}.signal-art--c .signal-hero__field img{object-position:28% 0}.signal-hero__inner{inline-size:calc(100% - 2*var(--sk-space-4));padding-block:var(--sk-space-20) var(--sk-space-10)}.signal-title,.signal-hero--article .signal-title{max-inline-size:100%;font-size:clamp(2.4rem,13vw,4.75rem)}.section-heading,.contact-grid{grid-template-columns:1fr;gap:var(--sk-space-2)}.section-heading>p:last-child{grid-column:1}.card-grid,.project-grid,.project-secondary__grid,.home-principles .project-grid{grid-template-columns:1fr}.listing-card{min-block-size:auto}.article-sequence{grid-template-columns:1fr}.article-sequence a:last-child{grid-column:1}.archive-list li{grid-template-columns:1fr;gap:var(--sk-space-1)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.signal-title::before,.signal-title::after{content:none;animation:none}.home-focus .sk-card{transition:none}.home-focus .sk-card:hover{translate:0}}
@media(forced-colors:active){.signal-hero__field{display:none}.signal-title,.signal-lede,.signal-kicker,.signal-hero .sk-breadcrumbs,.article-terms{background:Canvas;color:CanvasText}}
@media print{.site-header,.site-footer,.sk-skip-link,.signal-hero__field,.article-meta,.article-toc,.article-footer,.heading-anchor{display:none!important}.signal-hero{min-block-size:auto;display:block;border:0}.signal-hero__inner{inline-size:100%;padding:0 0 2rem}.signal-title{max-inline-size:none;font-size:2.5rem}.article-shell{display:block;inline-size:100%;padding:0}}

/* Site-specific refinements applied after the shared component layers. */
.site-header{position:sticky;inset-block-start:0;z-index:var(--sk-z-sticky);border-block-end:var(--sk-border-1) solid color-mix(in srgb,var(--sk-border-default) 72%,transparent);background:rgba(255,255,255,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.site-header .sk-header__inner{background:transparent}

.home-page>.signal-hero{place-items:center;min-block-size:clamp(34rem,calc(100vh - 4.5rem),56rem);border:0;background:var(--sk-color-black)}
.home-page>.signal-hero .signal-hero__field img{block-size:100%;object-position:center}
.home-page>.signal-hero .signal-hero__inner{display:grid;justify-items:center;padding-block:clamp(var(--sk-space-16),10vh,var(--sk-space-24));text-align:center}
.home-page>.signal-hero .signal-title{inline-size:min(18ch,100%);margin-inline:auto;padding:0;background:transparent;color:var(--sk-color-black);-webkit-text-stroke:8px var(--sk-color-white);overflow-wrap:anywhere}
.home-page>.signal-hero .signal-kicker,.home-page>.signal-hero .signal-lede{margin-inline:auto;padding:.18em .35em;background:color-mix(in srgb,var(--sk-color-white) 90%,transparent);color:var(--sk-color-black)}
.home-page>.signal-hero .signal-actions{justify-content:center}
.home-page .section-heading{padding-block-end:0;border-block-end:0}
.home-page h1,.home-page h2,.home-page h3,.home-page h4{font-family:var(--sk-font-mono);letter-spacing:0}
.home-page .home-flagship,.home-page .home-focus,.home-page .home-principles,.home-page .writing-index,.home-page .home-closing{font-family:var(--sk-font-mono)}
.home-writing-list .listing-card:nth-child(n+4){display:none}
.writing-more{display:flex;justify-content:center;margin-block-start:var(--sk-space-8)}
.leap-callout{max-inline-size:93ch;margin:var(--sk-space-8) auto 0;color:var(--sk-color-gray-200);font-size:1rem;text-align:center}
.leap-callout a{font-family:var(--sk-font-mono)}
.inline-links{display:inline-flex;flex-wrap:wrap;gap:var(--sk-space-3);margin-inline-start:var(--sk-space-2);font-family:var(--sk-font-mono);font-size:var(--sk-type-size-sm)}
.flagship-layout{display:grid;grid-template-columns:minmax(8rem,.35fr) minmax(0,1fr);gap:clamp(var(--sk-space-8),6vw,var(--sk-space-16));align-items:start;padding-block:clamp(var(--sk-space-6),5vw,var(--sk-space-12));border-block-end:var(--sk-border-1) solid var(--sk-border-default)}.flagship-content h2{max-inline-size:24ch;font-size:clamp(var(--sk-type-size-2xl),4.4vw,var(--sk-type-size-4xl));line-height:var(--sk-type-line-tight)}.flagship-content>p{max-inline-size:62ch;color:var(--sk-text-secondary);font-size:clamp(var(--sk-type-size-md),2vw,var(--sk-type-size-xl));line-height:var(--sk-type-line-normal)}
.home-closing{position:relative;isolation:isolate;overflow:hidden}
.home-principles .project-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.home-principles .project-grid article{min-block-size:22rem}.listing-card-tags a.tag,.article-terms a.tag{color:var(--rd-red);text-decoration:none}.listing-card-tags a.tag:hover,.article-terms a.tag:hover{text-decoration:underline}

.article-related{margin-block-start:var(--sk-space-16)}
.article-content .article-related__title{margin-block:0 var(--sk-space-6);padding:0;border:0}
.article-related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;padding:0;border-block-start:var(--sk-border-1) solid var(--sk-border-default);border-inline-start:var(--sk-border-1) solid var(--sk-border-default);list-style:none}
.article-related-grid .listing-card{min-block-size:12rem;padding:var(--sk-space-5)}
.article-related-grid .listing-card a{display:flex;flex:1;flex-direction:column;justify-content:space-between;color:var(--sk-text-primary);font-size:clamp(var(--sk-type-size-md),1.8vw,var(--sk-type-size-xl));font-weight:var(--sk-type-weight-bold);line-height:var(--sk-type-line-tight);text-decoration:none}
.article-related-grid .listing-card a::before{content:"Related";color:var(--rd-red);font-size:var(--sk-type-size-xs);font-weight:var(--sk-type-weight-regular);letter-spacing:.08em;text-transform:uppercase}
.article-related-grid .listing-card a{font-family:var(--sk-font-mono);letter-spacing:0}

.archive-list{max-inline-size:var(--sk-size-content-xl)}
.archive-list ul{margin:0;padding:0;border-block-start:var(--sk-border-1) solid var(--sk-border-default);list-style:none}
.archive-list li{max-inline-size:none;display:grid;grid-template-columns:8rem minmax(0,1fr);align-items:start;gap:var(--sk-space-4);padding-block:var(--sk-space-4);border-block-end:0;color:var(--sk-text-muted);font-size:var(--sk-type-size-xs)}
.archive-list li a{display:block;min-inline-size:0;max-inline-size:100%;color:var(--sk-text-primary);font-size:var(--sk-type-size-md);line-height:var(--sk-type-line-normal);overflow-wrap:anywhere}

.about-page .page-content h2,.contact-page .page-content h2{padding-block-start:0;border-block-start:0}
.about-page .page-content{max-inline-size:var(--sk-size-content-xl)}
.about-overview{display:block}.tools-overview{display:grid;grid-template-columns:minmax(0,.8fr) minmax(18rem,1fr);gap:clamp(var(--sk-space-8),6vw,var(--sk-space-16));align-items:start}
.about-timeline,.tools-section{padding-block:clamp(var(--sk-space-10),7vw,var(--sk-space-16))}
.about-page h2,.about-page h3,.tools-overview h2,.tools-section h2,.tools-feature h3{font-family:var(--sk-font-mono);letter-spacing:0}
.timeline-list{inline-size:100%;max-inline-size:none;display:grid;gap:0;margin:0;padding:0;border:0;list-style:none}
.timeline-list li{max-inline-size:none;display:grid;grid-template-columns:8rem minmax(0,1fr);gap:var(--sk-space-4);padding-block:var(--sk-space-5);border:0}
.timeline-list strong{font-family:var(--sk-font-mono);color:var(--rd-red);font-weight:var(--sk-type-weight-regular)}
.about-proof,.tools-feature{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-block-start:var(--sk-border-1) solid var(--sk-border-default);border-inline-start:var(--sk-border-1) solid var(--sk-border-default)}
.about-proof article,.tools-feature article{display:flex;min-block-size:16rem;flex-direction:column;padding:var(--sk-space-5);border-inline-end:var(--sk-border-1) solid var(--sk-border-default);border-block-end:var(--sk-border-1) solid var(--sk-border-default);background:var(--sk-surface-card)}
.about-proof h3,.tools-feature h3,.tools-section h2{font-family:var(--sk-font-mono);letter-spacing:0}
.about-proof a{inline-size:fit-content;margin-block-start:auto}
.tools-hero-card{border:var(--sk-border-1) solid var(--sk-border-default);padding:var(--sk-space-5);background:var(--sk-surface-card)}
.tools-hero-card img{inline-size:100%;border:var(--sk-border-1) solid var(--sk-border-default)}
.tools-feature a{inline-size:fit-content;margin-block-start:auto}
.contact-layout{display:grid;grid-template-columns:minmax(0,.8fr) minmax(20rem,1.2fr);gap:clamp(var(--sk-space-8),6vw,var(--sk-space-20));padding-block:clamp(var(--sk-space-12),9vw,var(--sk-space-24));align-items:start}
.contact-layout .page-content{padding-block:0}
.contact-form{display:grid;gap:var(--sk-space-5);border:var(--sk-border-1) solid var(--sk-border-default);padding:clamp(var(--sk-space-5),4vw,var(--sk-space-8));background:var(--sk-surface-card)}
.contact-form>div{display:grid;gap:var(--sk-space-2)}
.contact-form label{font-size:var(--sk-type-size-xs);letter-spacing:.06em;text-transform:uppercase}
.contact-form label span,.contact-form__note{color:var(--sk-text-muted);text-transform:none}
.contact-form input,.contact-form textarea{inline-size:100%;border:var(--sk-border-1) solid var(--sk-border-default);border-radius:0;padding:var(--sk-space-3);background:var(--sk-surface-raised);color:var(--sk-text-primary);font:inherit}
.contact-form input:focus-visible,.contact-form textarea:focus-visible{outline:var(--sk-border-2) solid var(--rd-red);outline-offset:var(--sk-border-2)}
.contact-form textarea{resize:vertical}
.contact-form .sk-button{justify-self:start}
.contact-form__note{margin:0;font-size:var(--sk-type-size-xs);line-height:var(--sk-type-line-normal)}

.project-landing{max-inline-size:var(--sk-size-content-xl)}
.project-landing>p:first-of-type{max-inline-size:60ch;font-size:clamp(var(--sk-type-size-lg),2.2vw,var(--sk-type-size-2xl));line-height:var(--sk-type-line-normal)}
.project-landing h2{max-inline-size:24ch}
.project-landing ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sk-space-3);max-inline-size:none;margin-inline:0;padding:0;list-style:none}
.project-landing li{max-inline-size:none;border:var(--sk-border-1) solid var(--sk-border-default);padding:var(--sk-space-4);background:var(--sk-surface-card)}
.project-landing>p:last-child a{display:inline-flex;align-items:center;min-block-size:var(--sk-size-control-lg);border:var(--sk-border-1) solid var(--sk-action-primary);padding-inline:var(--sk-space-5);background:var(--sk-action-primary);color:var(--sk-action-primary-text);font-weight:var(--sk-type-weight-bold);text-decoration:none}

.projects-page .signal-hero{border-block-end:var(--sk-border-1) solid var(--sk-border-default)}
.project-feature{padding-block:clamp(var(--sk-space-12),9vw,var(--sk-space-24))}
.project-feature__panel{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1fr);gap:clamp(var(--sk-space-8),6vw,var(--sk-space-16));align-items:end;border-block-start:0;border-block-end:0;padding-block:clamp(var(--sk-space-8),7vw,var(--sk-space-16))}
.project-feature__meta,.project-secondary__eyebrow,.project-link-bank__eyebrow{color:var(--rd-red);font-family:var(--sk-font-mono);font-size:var(--sk-type-size-xs);letter-spacing:.1em;text-transform:uppercase}
.project-link-bank__eyebrow{color:var(--sk-color-gray-200)}
.project-feature h2{font-family:var(--sk-font-mono);font-size:clamp(var(--sk-type-size-3xl),6vw,var(--sk-type-size-5xl));letter-spacing:0}.project-feature p{max-inline-size:62ch;color:var(--sk-text-secondary);font-size:clamp(var(--sk-type-size-md),2vw,var(--sk-type-size-xl));line-height:var(--sk-type-line-normal)}
.project-feature__actions{display:flex;flex-wrap:wrap;gap:var(--sk-space-3);margin-block-start:var(--sk-space-6)}
.project-secondary{padding-block:clamp(var(--sk-space-12),8vw,var(--sk-space-20));background:var(--sk-surface-subtle)}
.project-secondary__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-block-start:var(--sk-border-1) solid var(--sk-border-default);border-inline-start:var(--sk-border-1) solid var(--sk-border-default)}
.project-secondary article{min-block-size:18rem;display:flex;flex-direction:column;padding:var(--sk-space-6);border-inline-end:var(--sk-border-1) solid var(--sk-border-default);border-block-end:var(--sk-border-1) solid var(--sk-border-default);background:var(--sk-surface-card)}
.project-secondary h2{margin-block-end:var(--sk-space-8);font-family:var(--sk-font-mono);letter-spacing:0}.project-secondary h3{margin-block-start:auto;font-family:var(--sk-font-mono)!important;font-size:var(--sk-type-size-2xl);letter-spacing:0}.project-secondary p:not(.project-secondary__eyebrow){color:var(--sk-text-secondary)}.project-secondary a{inline-size:fit-content;margin-block-start:var(--sk-space-4)}
.project-link-bank{padding-block:clamp(var(--sk-space-12),8vw,var(--sk-space-20));background:var(--sk-color-black);color:var(--sk-text-inverse)}
.project-link-bank h2,.project-link-bank a{color:var(--sk-text-inverse)}.project-link-bank__intro{max-inline-size:62ch;color:var(--sk-color-gray-300)}
.project-link-bank__columns{columns:3 16rem;column-gap:clamp(var(--sk-space-8),6vw,var(--sk-space-16));margin-block-start:var(--sk-space-8);padding:0;list-style:none}.project-link-bank__columns li{break-inside:avoid;border-block-end:var(--sk-border-1) solid var(--sk-color-gray-700)}.project-link-bank__columns a{display:block;padding-block:var(--sk-space-3);font-family:var(--sk-font-mono)!important;font-size:var(--sk-type-size-sm);letter-spacing:0;text-decoration:none}.project-link-bank__columns a:hover{color:var(--rd-red)}

.site-footer{border:0;background:var(--sk-color-white)}
.site-footer .sk-footer__inner{inline-size:min(100%,var(--sk-size-content-xl));display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:var(--sk-space-6);border:0;background:var(--sk-color-white)}
.site-footer small{justify-self:start;color:var(--sk-text-primary)}
.footer-nav{display:flex;justify-content:center;gap:var(--sk-space-5)}
.footer-social{display:flex;justify-self:end;gap:var(--sk-space-3)}
.footer-social a{inline-size:var(--sk-size-control-md);block-size:var(--sk-size-control-md);display:grid;place-items:center;color:var(--sk-text-primary)}
.footer-social svg{inline-size:1.35rem;block-size:1.35rem;fill:currentColor}

@media(max-width:48rem){.contact-layout,.about-overview,.tools-overview{grid-template-columns:1fr;gap:var(--sk-space-8)}.article-related-grid,.project-feature__panel,.project-secondary__grid,.project-landing ul,.home-principles .project-grid,.clarity-grid,.about-proof,.tools-feature,.about-map{grid-template-columns:1fr}.clarity-grid article{border-inline-end:0;border-block-end:var(--sk-border-1) solid var(--sk-color-gray-700)}.timeline-list li{grid-template-columns:1fr}.site-footer .sk-footer__inner{grid-template-columns:1fr;justify-items:center;text-align:center}.site-footer small,.footer-social{justify-self:center}}
@media(forced-colors:active){.home-page>.signal-hero .signal-title{-webkit-text-stroke:0}.home-page>.signal-hero .signal-kicker,.home-page>.signal-hero .signal-lede{background:Canvas;color:CanvasText}}