@layer alz.adapt {
  html {
    font-size: calc(100% * var(--type-scale));
  }
  :where(button, [role=button], a.button, input, select):not([role=switch], [type=checkbox], [type=radio]) {
    min-block-size: var(--target-min);
  }
  :where([role=switch], [type=checkbox], [type=radio]) {
    position: relative;
  }
  :where([role=switch], [type=checkbox], [type=radio])::after {
    content: "";
    position: absolute;
    inset: 50% auto auto 50%;
    inline-size: max(100%, var(--target-min));
    block-size: max(100%, var(--target-min));
    transform: translate(-50%, -50%);
  }
  :focus-visible {
    outline-width: var(--focus-size);
  }
  .alz-secondary {
    display: var(--show-secondary);
  }
  .alz-rail {
    display: var(--show-rails);
  }
  .alz-clamp {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: var(--text-lines-max);
    overflow: hidden;
  }
  .alz-measure {
    max-inline-size: var(--measure);
  }
  .alz-bento {
    display: grid;
    grid-template-columns: repeat(var(--work-columns), minmax(0, 1fr));
    grid-auto-rows: minmax(var(--bento-row), auto);
    grid-auto-flow: dense;
    gap: var(--space-group, 12px);
  }
  .alz-bento > .wide {
    grid-column: span var(--span-wide);
  }
  .alz-bento > .tall {
    grid-row: span var(--span-tall);
  }
  .alz-bento > .hero {
    grid-column: span var(--span-hero);
    grid-row: span var(--span-tall);
  }
  .alz-split {
    display: grid;
    grid-template-columns: repeat(var(--layout-panes), minmax(0, 1fr));
    column-gap: max(var(--layout-gutter), var(--fold-gap, 0px));
  }
  @media print {
    :root, [data-style], [data-palette], [data-theme] {
      --alz-canvas: #ffffff !important;
      --alz-surface: #ffffff !important;
      --alz-panel-muted: #f2f2f2 !important;
      --alz-ink: #000000 !important;
      --alz-navy-900: #000000 !important;
      --alz-muted: #333333 !important;
      --alz-border: #999999 !important;
      --alz-input-border: #666666 !important;
      --skin-canvas: none !important;
      --skin-panel-texture: none !important;
      --skin-panel-shadow: none !important;
      --skin-raised-shadow: none !important;
      --skin-glow: none !important;
      --skin-text-glow: none !important;
      --skin-panel-blur: 0px !important;
      --skin-raised-blur: 0px !important;
      --celebrate-budget: 0 !important;
      --motion-factor: 0 !important;
    }
  }
  .alz-print, .alz-print [data-palette], .alz-print [data-theme] {
    --alz-canvas: #ffffff !important;
    --alz-surface: #ffffff !important;
    --alz-panel-muted: #f2f2f2 !important;
    --alz-ink: #000000 !important;
    --alz-navy-900: #000000 !important;
    --alz-muted: #333333 !important;
    --alz-border: #999999 !important;
    --alz-input-border: #666666 !important;
    --skin-canvas: none !important;
    --skin-panel-texture: none !important;
    --skin-panel-shadow: none !important;
    --skin-raised-shadow: none !important;
    --skin-glow: none !important;
    --skin-text-glow: none !important;
    --skin-panel-blur: 0px !important;
    --skin-raised-blur: 0px !important;
    --celebrate-budget: 0 !important;
    --motion-factor: 0 !important;
  }
  html {
    scrollbar-gutter: stable;
  }
  .alz-scroll-x {
    overflow-x: auto;
    overscroll-behavior-x: contain;
    max-inline-size: 100%;
  }
  .alz-scroll-y {
    overflow-y: auto;
    overscroll-behavior-y: contain;
    max-block-size: var(--scroll-region-max, 60vh);
  }
  :where([role=dialog], dialog, .alz-overlay) {
    overscroll-behavior: contain;
    max-block-size: calc(100dvh - 2 * var(--layout-gutter, 16px));
    overflow-y: auto;
  }
  :root:has(dialog[open], .alz-overlay[data-open]) {
    overflow: hidden;
  }
  :where([role=dialog], dialog, .alz-overlay) :where([role=dialog], dialog, .alz-overlay) {
    overflow: visible;
    max-block-size: none;
  }
  .alz-logo {
    display: var(--brand-show-wordmark, inline-block);
    block-size: max(var(--brand-min-logo-height, 20px), 1.6em);
    aspect-ratio: 4 / 1;
    background: var(--brand-logo) left center / contain no-repeat;
    margin: calc(1em * var(--brand-clear-space, .5));
    filter: none !important;
  }
  .alz-logo.on-dark {
    background-image: var(--brand-logo-on-dark);
  }
  .alz-logo.on-light {
    background-image: var(--brand-logo-on-light);
  }
  .alz-mark {
    display: var(--brand-show-mark, none);
    inline-size: max(var(--brand-min-mark-size, 24px), 2em);
    aspect-ratio: 1;
    background: var(--brand-mark) center / contain no-repeat;
    filter: none !important;
  }
  .alz-powered-by {
    display: var(--brand-show-powered-by, none);
  }
  .alz-powered-by::before {
    content: var(--brand-powered-by);
  }
  [data-glass=clear] :where(button, [role=button], .alz-chip, input) {
    box-shadow: 0 0 0 100vmax transparent, inset 0 0 0 100vmax var(--glass-dim, transparent);
  }
  .alz-diagram {
    max-inline-size: min(100%, var(--diagram-max, 64rem));
    margin-inline: auto;
  }
  .alz-adapt {
    container: alz-slot / inline-size;
  }
  @container alz-slot (max-width: 280px) {
    .alz-adapt > * {
      --layout-columns: 1;
      --layout-gutter: 8px;
      --layout-panes: 1;
      --type-scale: 0.94;
      --space-scale: 0.75;
      --target-floor: 48px;
      --text-lines-max: 2;
      --show-secondary: none;
      --show-rails: none;
      --measure: 28ch;
      --layout-content-max: 100%;
      --layout-rail: 0;
      --show-detail: none;
      --work-columns: 1;
      --span-wide: 1;
      --span-tall: 1;
      --span-hero: 1;
      --bento-row: 4.5rem;
      --page-spreads: 1;
      --overlay-kind: "fullscreen";
      --overlay-inset: 0;
      --overlay-width: 100%;
      --overlay-radius: 0;
      --toast-inset: 8px 8px auto 8px;
      --toast-place: "top";
      --brand-show-wordmark: none;
      --brand-show-mark: inline-block;
      --device: watch;
      --target-min: max(var(--input-target), var(--target-floor), var(--target-floor-distance, 0px));
    }
  }
  @container alz-slot (min-width: 281px) and (max-width: 599px) {
    .alz-adapt > * {
      --layout-columns: 4;
      --layout-gutter: 16px;
      --layout-panes: 1;
      --type-scale: 1;
      --space-scale: 0.875;
      --target-floor: 44px;
      --text-lines-max: 3;
      --show-secondary: block;
      --show-rails: none;
      --measure: 40ch;
      --layout-content-max: 100%;
      --layout-rail: 0;
      --show-detail: none;
      --work-columns: 2;
      --span-wide: 2;
      --span-tall: 1;
      --span-hero: 2;
      --bento-row: 6rem;
      --page-spreads: 1;
      --overlay-kind: "sheet";
      --overlay-inset: auto 0 0 0;
      --overlay-width: 100%;
      --overlay-radius: var(--radius-lg) var(--radius-lg) 0 0;
      --toast-inset: 8px 8px auto 8px;
      --toast-place: "top";
      --brand-show-wordmark: inline-block;
      --brand-show-mark: none;
      --device: phone;
      --target-min: max(var(--input-target), var(--target-floor), var(--target-floor-distance, 0px));
    }
  }
  @container alz-slot (min-width: 600px) and (max-width: 1023px) {
    .alz-adapt > * {
      --layout-columns: 8;
      --layout-gutter: 24px;
      --layout-panes: 2;
      --type-scale: 1;
      --space-scale: 1;
      --target-floor: 44px;
      --text-lines-max: 4;
      --show-secondary: block;
      --show-rails: none;
      --measure: 60ch;
      --layout-content-max: 100%;
      --layout-rail: 0;
      --show-detail: none;
      --work-columns: 3;
      --span-wide: 2;
      --span-tall: 2;
      --span-hero: 2;
      --bento-row: 7rem;
      --page-spreads: 1;
      --overlay-kind: "sheet";
      --overlay-inset: auto 0 0 0;
      --overlay-width: 100%;
      --overlay-radius: var(--radius-lg) var(--radius-lg) 0 0;
      --toast-inset: 8px 8px auto 8px;
      --toast-place: "top";
      --brand-show-wordmark: inline-block;
      --brand-show-mark: none;
      --device: tablet;
      --target-min: max(var(--input-target), var(--target-floor), var(--target-floor-distance, 0px));
    }
  }
  @container alz-slot (min-width: 1024px) and (max-width: 1679px) {
    .alz-adapt > * {
      --layout-columns: 12;
      --layout-gutter: 24px;
      --layout-panes: 2;
      --type-scale: 1;
      --space-scale: 1;
      --target-floor: 24px;
      --text-lines-max: 6;
      --show-secondary: block;
      --show-rails: none;
      --measure: 72ch;
      --layout-content-max: 90rem;
      --layout-rail: 0;
      --show-detail: none;
      --work-columns: 4;
      --span-wide: 2;
      --span-tall: 2;
      --span-hero: 2;
      --bento-row: 7.5rem;
      --page-spreads: 1;
      --overlay-kind: "dialog";
      --overlay-inset: 12% 18% auto 18%;
      --overlay-width: auto;
      --overlay-radius: var(--radius-lg);
      --toast-inset: auto 16px 16px auto;
      --toast-place: "bottom-right";
      --brand-show-wordmark: inline-block;
      --brand-show-mark: none;
      --device: desktop;
      --target-min: max(var(--input-target), var(--target-floor), var(--target-floor-distance, 0px));
    }
  }
  @container alz-slot (min-width: 1680px) {
    .alz-adapt > * {
      --layout-columns: 12;
      --layout-gutter: 32px;
      --layout-panes: 2;
      --type-scale: 1;
      --space-scale: 1;
      --target-floor: 24px;
      --text-lines-max: 8;
      --show-secondary: block;
      --show-rails: block;
      --measure: 72ch;
      --layout-content-max: 120rem;
      --layout-rail: 16rem;
      --show-detail: block;
      --work-columns: 6;
      --span-wide: 2;
      --span-tall: 2;
      --span-hero: 3;
      --bento-row: 7.5rem;
      --page-spreads: 1;
      --overlay-kind: "dialog";
      --overlay-inset: 12% 26% auto 26%;
      --overlay-width: auto;
      --overlay-radius: var(--radius-lg);
      --toast-inset: auto 16px 16px auto;
      --toast-place: "bottom-right";
      --brand-show-wordmark: inline-block;
      --brand-show-mark: none;
      --device: wide;
      --target-min: max(var(--input-target), var(--target-floor), var(--target-floor-distance, 0px));
    }
  }
  @container alz-slot (min-width: 2560px) {
    .alz-adapt > * {
      --layout-columns: 24;
      --layout-gutter: 24px;
      --layout-panes: 4;
      --type-scale: 1;
      --space-scale: 1;
      --target-floor: 24px;
      --text-lines-max: 10;
      --show-secondary: block;
      --show-rails: block;
      --measure: 72ch;
      --layout-content-max: none;
      --layout-rail: 18rem;
      --show-detail: block;
      --work-columns: 10;
      --span-wide: 3;
      --span-tall: 2;
      --span-hero: 4;
      --bento-row: 7.5rem;
      --page-spreads: 2;
      --overlay-kind: "drawer";
      --overlay-inset: 0 0 0 auto;
      --overlay-width: 28rem;
      --overlay-radius: 0;
      --toast-inset: 16px 16px auto auto;
      --toast-place: "top-right";
      --brand-show-wordmark: inline-block;
      --brand-show-mark: none;
      --device: ultrawide;
      --target-min: max(var(--input-target), var(--target-floor), var(--target-floor-distance, 0px));
    }
  }
  @container alz-slot (min-width: 3800px) {
    .alz-adapt > * {
      --layout-columns: 24;
      --layout-gutter: 28px;
      --layout-panes: 4;
      --type-scale: 1;
      --space-scale: 1;
      --target-floor: 24px;
      --text-lines-max: 10;
      --show-secondary: block;
      --show-rails: block;
      --measure: 72ch;
      --layout-content-max: none;
      --layout-rail: 20rem;
      --show-detail: block;
      --work-columns: 12;
      --span-wide: 3;
      --span-tall: 2;
      --span-hero: 4;
      --bento-row: 8rem;
      --page-spreads: 2;
      --overlay-kind: "drawer";
      --overlay-inset: 0 0 0 auto;
      --overlay-width: 32rem;
      --overlay-radius: 0;
      --toast-inset: 16px 16px auto auto;
      --toast-place: "top-right";
      --brand-show-wordmark: inline-block;
      --brand-show-mark: none;
      --device: giant;
      --target-min: max(var(--input-target), var(--target-floor), var(--target-floor-distance, 0px));
    }
  }
  @media (prefers-reduced-motion: reduce) {
    * {
      transition: none !important;
    }
  }
}