

:root {
  --responsive-grid-column-width: 20rem;
  --sidebar-section-label-font-size: var(
    --font-size-2xs,
    calc(var(--font-size-base) / var(--font-size-ratio) / var(--font-size-ratio))
  );
  --sidebar-product-tenant-font-size: var(
    --font-size-2xs,
    calc(var(--font-size-base) / var(--font-size-ratio) / var(--font-size-ratio))
  );
  --sidebar-badge-font-size: var(
    --font-size-2xs,
    calc(var(--font-size-base) / var(--font-size-ratio) / var(--font-size-ratio))
  );

  --sidebar-badge-background: initial;
  --sidebar-badge-foreground: initial;

  --sidebar-badge-destructive-background: initial;
  --sidebar-badge-destructive-foreground: initial;

  --sidebar-user-focus-ring-alpha: 1;

  --topbar-chip-icon-size: 1.125rem;

  --sidebar-product-caret-icon-size: var(--icon-size-sm);
  --topbar-icon-size: var(--icon-size-md);

  --topbar-caret-icon-size: var(--icon-size-xs);

  --topbar-icon-focus-ring-alpha: 1;

  --sidebar-user-role-font-size: var(
    --font-size-2xs,
    calc(var(--font-size-base) / var(--font-size-ratio) / var(--font-size-ratio))
  );
  --org-switcher-meta-foreground: var(--muted-foreground);
  --sidebar-nav-sub-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );
  --sidebar-flyout-title-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );
  --topbar-chip-icon-font-size: var(
    --font-size-2xs,
    calc(var(--font-size-base) / var(--font-size-ratio) / var(--font-size-ratio))
  );
  --kbd-font-size: var(
    --font-size-2xs,
    calc(var(--font-size-base) / var(--font-size-ratio) / var(--font-size-ratio))
  );
  --sidebar-logo-mark-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );
  --sidebar-avatar-font-size: var(
    --font-size-2xs,
    calc(var(--font-size-base) / var(--font-size-ratio) / var(--font-size-ratio))
  );
  --sidebar-user-name-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );

  --sidebar-gradient: none;
  --topbar-gradient: none;

  --app-shell-viewport-inset: 0px;
  --app-shell-bar-height: var(--band-height-2xl);

  --app-shell-bar-inset: var(--space-page-x);
  --app-shell-bar-inset-compact: var(--space-page-compact-x);
  --app-shell-bar-gap: var(--space-3);

  --app-shell-brand-max-inline-size: none;
  --app-shell-brand-compact-max-inline-size: var(--app-shell-bar-height);

  --app-shell-sidebar-width: 16rem;
  --app-shell-sidebar-collapsed-width: 4rem;

  --app-shell-nav-rail-width: 2.5rem;

  --app-shell-nav-rail-item-size: var(--band-height-lg);

  --app-shell-nav-rail-height: var(--app-shell-nav-rail-width);

  --app-shell-nav-rail-inset: var(--space-3);

  --app-shell-page-max-width: none;

  --app-shell-main-background: initial;
  --app-shell-mobile-nav-width: 22.5rem;

  --app-shell-mobile-nav-background: initial;

  --app-shell-mobile-nav-alpha: 40%;

  --app-shell-mobile-nav-inset: var(--space-1);

  --app-shell-mobile-nav-icon-size: var(--icon-size-lg);

  --service-role-panel-list-gap: 0.25rem;
  --service-role-panel-row-gap: 0.25rem;
  --service-role-panel-item-title-gap: 0.375rem;

  --service-role-panel-item-padding-block: 0.5rem;
  --sidebar-brand-mark-size: 1.375rem;
  --sidebar-nav-item-height: var(--band-height-md);

  --sidebar-nav-item-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );

  --sidebar-nav-item-line-height: 1.5;

  --auth-account-summary-email-line-height: 1.5;
  --topbar-start-truncate-line-height: 1.5;
  --sidebar-nav-icon-size: var(--icon-size-md);
  --sidebar-nav-item-gap: 0.625rem;
  --sidebar-nav-item-padding-x: 0.625rem;
  --sidebar-nav-gap: 2px;

  --sidebar-nav-item-radius: calc(var(--radius) - 1px);
  --sidebar-nav-scroll-padding: var(--space-3) var(--space-2);
  --sidebar-section-gap: var(--space-4);
  --sidebar-section-label-padding-x: var(--space-2);
  --sidebar-section-label-padding-bottom: var(--space-1);

  --topbar-search-width: 16rem;
  --topbar-search-max-width: none;

  --topbar-height: auto;
  --topbar-inset: 0px;
  --topbar-gap: var(--space-2);

  --topbar-background-alpha: initial;
  --topbar-backdrop-blur-size: initial;

  --topbar-center-compact-display: none;

  --topbar-item-padding-inline: var(--space-3);

  --topbar-item-padding-inline-compact: var(--space-2);
  --topbar-item-gap: var(--space-2);
  --topbar-item-min-width: var(--control-height);

  --topbar-item-radius: var(--radius-sharp);
  --topbar-item-color: var(--muted-foreground);

  --topbar-item-hover-background: initial;
  --topbar-item-hover-color: initial;
  --topbar-item-active-background: var(--secondary);

  --topbar-item-badge-offset-block: var(--space-1);
  --topbar-item-badge-offset-inline: var(--space-1);
  --topbar-item-badge-size: 1rem;
  --topbar-item-badge-padding-inline: var(--space-1);
  --topbar-item-badge-font-size: var(
    --font-size-2xs,
    calc(var(--font-size-base) / var(--font-size-ratio) / var(--font-size-ratio))
  );
  --topbar-item-badge-background: initial;
  --topbar-item-badge-foreground: initial;
  --topbar-item-badge-destructive-background: initial;
  --topbar-item-badge-destructive-foreground: initial;

  --topbar-item-focus-ring-offset: calc(-1 * var(--focus-ring-width));
  --org-switcher-trigger-height: var(--band-height-xl);
  --org-switcher-trigger-padding-x: var(--space-2);

  --org-switcher-avatar-size: var(--control-height-sm);

  --org-switcher-sheet-inset: var(--space-3);

  --org-switcher-list-inset: var(--org-switcher-sheet-inset);

  --org-switcher-list-offset: 0px;

  --org-switcher-legend-space-gap: var(--space-4);
  --org-switcher-legend-font-size: var(
    --font-size-2xs,
    calc(var(--font-size-base) / var(--font-size-ratio) / var(--font-size-ratio))
  );
  --org-switcher-hint-space-gap: var(--space-1);

  --org-switcher-dialog-width: 26rem;

  --org-switcher-search-space-block: var(--space-3);
  --org-switcher-menu-width: 16rem;
  --org-switcher-sheet-max-height: 75dvh;
  --org-switcher-state-min-height: 8rem;

  --app-launcher-panel-width: 20rem;
  --app-launcher-panel-max-height: 26rem;
  --app-launcher-panel-gap: var(--space-3);
  --app-launcher-sheet-max-height: 75dvh;
  --app-launcher-grid-gap: var(--space-1);
  --app-launcher-tile-gap: var(--space-1);
  --app-launcher-tile-padding: var(--space-2);

  --app-launcher-tile-min-height: var(--control-height-comfortable);
  --app-launcher-tile-radius: var(--radius);
  --app-launcher-tile-color: var(--foreground);
  --app-launcher-tile-hover-background: initial;
  --app-launcher-tile-hover-color: initial;

  --app-launcher-tile-current-background: initial;
  --app-launcher-mark-size: 2.5rem;
  --app-launcher-mark-radius: var(--radius);
  --app-launcher-mark-background: var(--secondary);
  --app-launcher-mark-foreground: var(--secondary-foreground);
  --app-launcher-mark-font-size: var(--font-size-sm, var(--font-size-base));
  --app-launcher-name-font-size: var(
    --font-size-2xs,
    calc(var(--font-size-base) / var(--font-size-ratio) / var(--font-size-ratio))
  );
  --app-launcher-group-label-font-size: var(
    --font-size-2xs,
    calc(var(--font-size-base) / var(--font-size-ratio) / var(--font-size-ratio))
  );
  --app-launcher-group-label-color: var(--muted-foreground);
  --app-launcher-state-min-height: 8rem;

  --app-launcher-launchpad-backdrop-background: initial;
  --app-launcher-launchpad-backdrop-blur-size: var(--blur-lg);
  --app-launcher-launchpad-backdrop-alpha: 55%;

  --app-launcher-launchpad-backdrop-color-saturate: 180%;
  --app-launcher-launchpad-space-inset: var(--space-8);

  --app-launcher-launchpad-space-safe-area: 0;
  --app-launcher-launchpad-panel-max-width: 60rem;
  --app-launcher-launchpad-panel-gap: var(--space-8);
  --app-launcher-launchpad-grid-gap: var(--space-6);
  --app-launcher-launchpad-tile-inline-size: 7.5rem;
  --app-launcher-launchpad-tile-padding: var(--space-3);
  --app-launcher-launchpad-tile-radius: var(--radius-lg);
  --app-launcher-launchpad-tile-gap: var(--space-3);
  --app-launcher-launchpad-tile-hover-background: color-mix(
    in srgb,
    hsl(var(--foreground)) 10%,
    transparent
  );
  --app-launcher-launchpad-mark-size: 4rem;
  --app-launcher-launchpad-mark-radius: var(--radius-lg);

  --app-launcher-launchpad-mark-background: color-mix(in srgb, hsl(var(--card)) 78%, transparent);
  --app-launcher-launchpad-mark-border-color: color-mix(
    in srgb,
    hsl(var(--foreground)) 14%,
    transparent
  );
  --app-launcher-launchpad-mark-font-size: var(
    --font-size-lg,
    calc(var(--font-size-base) * var(--font-size-ratio) * var(--font-size-ratio))
  );
  --app-launcher-launchpad-mark-shadow: var(--shadow-lg);
  --app-launcher-launchpad-name-font-size: var(--font-size-sm, var(--font-size-base));
  --app-launcher-launchpad-title-font-size: var(
    --font-size-2xs,
    calc(var(--font-size-base) / var(--font-size-ratio) / var(--font-size-ratio))
  );
  --app-launcher-launchpad-title-letter-spacing: 0.08em;
  --app-launcher-launchpad-close-space-padding: var(--space-2);

  --sidebar-item-active-background: initial;

  --sidebar-item-active-foreground: initial;

  --sidebar-item-active-tint: initial;

  --sidebar-item-active-background-alpha: 12%;

  --auth-shell-control-height: var(--control-height-comfortable);
  --auth-shell-heading-size: var(
    --font-size-2xl,
    calc(
      var(--font-size-base) * var(--font-size-ratio) * var(--font-size-ratio) *
        var(--font-size-ratio) * var(--font-size-ratio)
    )
  );
  --auth-shell-card-max-width: 24rem;
  --auth-shell-bar-padding: var(--space-5) var(--space-6);
  --auth-shell-main-padding: var(--space-6);
  --auth-shell-footer-padding: var(--space-3) var(--space-6) var(--space-4);

  --auth-shell-bar-gap: var(--space-inline-sm);

  --auth-shell-wide-card-max-width: 64rem;

  --auth-shell-canonical-control-height: var(--band-height-lg);
  --auth-shell-canonical-card-max-width: 22.5rem;
  --auth-shell-canonical-heading-size: var(--font-size-base);
  --auth-shell-canonical-main-padding: 1rem;
  --auth-shell-canonical-main-padding-mobile: 0.9375rem;

  --auth-shell-compact-card-inset: var(--space-6);

  --auth-shell-card-padding-block-compact: initial;

  --auth-shell-card-body-gap-compact: var(--space-3);

  --auth-shell-card-gap-compact: var(--space-3);

  --auth-shell-main-align: center;

  --auth-shell-card-stack-gap: 0px;

  --auth-shell-login-card-max-width: 22.5rem;
  --auth-shell-login-flow-offset-block: 14.4375rem;
  --auth-shell-login-flow-offset-block-mobile: 13.8125rem;
  --auth-shell-login-main-padding-inline: 1rem;
  --auth-shell-login-main-padding-inline-mobile: 0.9375rem;
  --auth-shell-login-main-padding-block-end: 1rem;
  --auth-shell-login-identity-slot-block-size: 7rem;
  --auth-shell-login-card-stack-gap: 1.25rem;

  --auth-shell-login-card-padding-block-compact: var(--auth-shell-compact-card-inset);

  --auth-shell-device-card-max-width: 23.75rem;
  --auth-shell-device-main-padding: 1rem;
  --auth-shell-device-main-padding-mobile: 0.9375rem 0.3125rem;

  --auth-shell-device-otp-slot-inline-size: 1.71875rem;
  --auth-shell-device-otp-slot-block-size: 3.25rem;

  --auth-shell-context-card-max-width: 25rem;
  --auth-shell-context-main-padding: var(--space-6);
  --auth-shell-context-main-padding-mobile: var(--space-6) 0;
  --auth-shell-context-card-stack-gap: 1rem;

  --auth-shell-recovery-card-max-width: 27rem;
  --auth-shell-recovery-main-padding: 1rem;
  --auth-shell-recovery-main-padding-mobile: 0.9375rem;

  --auth-shell-registration-card-max-width: 22.5rem;

  --auth-shell-registration-main-padding-block-start: 1rem;
  --auth-shell-registration-main-padding-block-start-mobile: 0.9375rem;
  --auth-shell-registration-main-padding-inline: 1rem;
  --auth-shell-registration-main-padding-inline-mobile: 0.9375rem;

  --auth-shell-registration-main-padding-block-end: 3rem;
  --auth-shell-registration-main-padding-block-end-mobile: 2rem;
  --auth-shell-registration-card-stack-gap: 1.25rem;

  --auth-shell-registration-identity-slot-block-size: 7rem;

  --auth-shell-divider-gap: 0.625rem;
  --auth-shell-divider-label-font-size: var(
    --font-size-2xs,
    calc(var(--font-size-base) / var(--font-size-ratio) / var(--font-size-ratio))
  );
  --auth-shell-divider-label-line-height: calc(19 / 11);
  --auth-shell-divider-rule-color: var(--border);
  --auth-shell-divider-label-color: var(--muted-foreground);
  --auth-identity-gap: 0.375rem;
  --auth-requester-gap: 0.375rem;
  --auth-requester-icon-size: var(--icon-size-md);
  --auth-requester-glyph-size: var(--icon-size-2xs);
  --auth-account-summary-min-height: var(--control-height-comfortable);
  --auth-account-summary-gap: var(--space-2);
  --auth-account-summary-padding: var(--space-1) var(--space-2);
  --auth-account-summary-identity-min-width: 12rem;
  --auth-account-summary-avatar-size: var(--control-height-sm);
  --auth-account-summary-avatar-glyph-size: var(--control-icon-size-sm);
  --auth-account-summary-email-font-size: var(--font-size-sm, var(--font-size-base));
  --auth-footer-content-gap: 0.375rem;

  --auth-footer-text-font-size: var(
    --font-size-2xs,
    calc(var(--font-size-base) / var(--font-size-ratio) / var(--font-size-ratio))
  );

  --auth-footer-target-min-size: var(--touch-target-min);
  --auth-stack-gap: var(--space-3);
  --auth-shell-field-label-gap: var(--space-1);

  --auth-shell-field-label-font-size: 0.75rem;
  --auth-shell-field-label-line-height: 1.5;

  --centered-shell-bar-height: var(--app-shell-bar-height);
  --centered-shell-bar-padding-x: var(--space-page-x);
  --centered-shell-bar-padding-x-compact: var(--space-page-compact-x);
  --centered-shell-main-padding: var(--space-6);

  --centered-shell-main-padding-inline-compact: var(--space-page-compact-x);
  --centered-shell-footer-padding: var(--space-3) var(--space-6) var(--space-4);
  --centered-shell-footer-padding-inline-compact: var(--space-page-compact-x);

  --centered-shell-column-offset-block: 0;
  --centered-shell-width-sm: 32rem;
  --centered-shell-width-md: 46rem;
  --centered-shell-width-lg: 64rem;
}

:root {
  --centered-shell-landing-max-width: 67.5rem;
  --centered-shell-landing-inset-inline: var(--space-6);
  --centered-shell-landing-inset-inline-compact: var(--space-4);
  --centered-shell-landing-main-padding-block: var(--space-10);
  --centered-shell-landing-main-padding-block-compact: var(--space-6);
  --centered-shell-landing-section-gap: var(--space-10);
  --centered-shell-landing-section-gap-compact: var(--space-6);
  --centered-shell-landing-footer-padding-block: var(--space-8);

  --centered-shell-landing-card-shadow: none;

  --centered-shell-landing-heading-size: var(--font-size-display);
  --centered-shell-landing-heading-size-compact: var(
    --font-size-3xl,
    calc(var(--font-size-display) / var(--font-size-display-ratio) / var(--font-size-display-ratio))
  );

  --centered-shell-landing-background: initial;
}

@media (pointer: coarse) {
  :root {
    --app-shell-bar-height: var(--band-height-3xl);

    --app-shell-nav-rail-width: 3rem;
    --app-shell-nav-rail-item-size: var(--band-height-xl);
  }
}

:root {
  --mobile-shell-block-size: 100dvh;

  --mobile-shell-max-inline-size: 26.875rem;
  --mobile-shell-safe-inset-block-start: env(safe-area-inset-top);
  --mobile-shell-safe-inset-block-end: env(safe-area-inset-bottom);
  --mobile-shell-safe-inset-inline: max(env(safe-area-inset-left), env(safe-area-inset-right));

  --mobile-shell-inset-inline: var(--space-4);

  --mobile-shell-control-height: var(--control-height-comfortable);
  --mobile-shell-region-gap: var(--space-2);
  --mobile-shell-status-bar-height: var(--band-height-lg);
  --mobile-shell-header-bar-height: var(--band-height-3xl);

  --mobile-shell-tab-bar-height: calc(var(--band-height-3xl) + var(--space-2));
  --mobile-shell-main-padding-block: var(--space-4);
  --mobile-shell-actions-padding-block: var(--space-3);
}
