:root {
  --ezra-ui-theme-background: #FFFAF0;
  --ezra-ui-theme-text: #002B65;
  --ezra-ui-theme-heading-primary: #002B65;
  --ezra-ui-theme-heading-secondary: #B21519;
  --ezra-ui-theme-heading-tertiary: #B21519;
  --ezra-ui-theme-accent: #F4E3A1;
  --ezra-ui-theme-accent-strong: #B21519;
  --ezra-ui-theme-structure: #788CA5;
  --ezra-ui-theme-header: #002B65;
  --ezra-ui-theme-nav: #B21519;
  --ezra-ui-theme-footer: #002B65;
  --ezra-ui-theme-border: #788CA5;
  --ezra-ui-theme-surface-quiet: #F4E3A1;
  --ezra-ui-theme-surface-quiet-text: #1D3150;
  --ezra-ui-theme-quote-background: #F4E3A1;
  --ezra-ui-theme-quote-text: #1D3150;
  --ezra-ui-theme-quote-border: #788CA5;
  --ezra-ui-theme-button-background: #002B65;
  --ezra-ui-theme-button-text: #FFFAF0;
  --ezra-ui-theme-focus-ring: #B21519;
  --ezra-ui-theme-focus-ring-text: #FFFAF0;
  --ezra-ui-site-link-hover: #B21519;
  --ezra-ui-site-subtitle: #B21519;
  --ezra-ui-site-label: #1D3150;
  --ezra-ui-site-sources-label: #1D3150;
  --ezra-ui-site-pagination: #B21519;
  --ezra-ui-site-pagination-inactive: color-mix(in srgb, #002B65 54%, transparent);
  --ezra-ui-theme-surface-step-1: #FFFAF0;
  --ezra-ui-theme-surface-step-2: #F4E3A1;
  --ezra-ui-theme-surface-step-3: #F4E3A1;
  --ezra-ui-theme-surface-step-4: #F4E3A1;
  --ezra-ui-theme-surface-step-5: #F4E3A1;
  --ezra-ui-theme-surface-step-6: #F4E3A1;
  --ezra-ui-theme-surface-step-7: #B21519;
  --ezra-ui-theme-surface-step-8: #002B65;
  --ezra-ui-theme-important-action-accent: var(--ezra-ui-theme-accent-strong);
  --ezra-ui-theme-important-action-background: color-mix(in srgb, var(--ezra-ui-theme-accent-strong) 12%, #FFFAF0);
  --ezra-ui-theme-important-action-text: var(--ezra-ui-theme-heading-primary);
  --ezra-ui-theme-important-action-border: color-mix(in srgb, var(--ezra-ui-theme-accent-strong) 68%, #788CA5);
  --ezra-ui-theme-important-action-hover-background: color-mix(in srgb, var(--ezra-ui-theme-accent-strong) 18%, #FFFAF0);
  --ezra-ui-theme-important-action-hover-text: var(--ezra-ui-theme-heading-primary);
  --ezra-ui-theme-important-action-hover-border: var(--ezra-ui-theme-accent-strong);
  --ezra-app-surface-theme-home-link-color: var(--ezra-ui-theme-heading-primary);
  --ezra-app-surface-theme-header-menu-accent: var(--ezra-ui-theme-accent);
  --ezra-app-surface-theme-header-menu-panel-background: color-mix(in srgb, #F4E3A1 72%, #FFFAF0 28%);
  --ezra-app-surface-theme-header-menu-panel-backdrop: none;
  --ezra-ui-theme-checkbox-text: var(--ezra-ui-theme-text);
  --ezra-app-surface-theme-mobile-filter-trigger-text: var(--ezra-ui-theme-text);
  --ezra-app-surface-theme-mobile-filter-trigger-border: #788CA5;
  --ezra-app-surface-theme-mobile-filter-trigger-open-border: color-mix(in srgb, #788CA5 76%, #F4E3A1 24%);
  --ezra-app-surface-theme-editor-heading-color: var(--ezra-ui-theme-heading-primary);
  --ezra-app-surface-theme-panel-color: color-mix(in srgb, #F4E3A1 72%, #FFFAF0 28%);
  --ezra-app-surface-theme-panel-border: #788CA5;
  --ezra-app-surface-theme-panel-border-strong: color-mix(in srgb, #788CA5 76%, #F4E3A1 24%);
  --ezra-app-surface-theme-input-bg: #FFFAF0;
  --ezra-app-surface-theme-input-border: #788CA5;
  --ezra-app-surface-theme-input-border-strong: color-mix(in srgb, #788CA5 76%, #F4E3A1 24%);
  --ezra-ui-theme-input-border: #788CA5;
  --ezra-ui-theme-input-border-strong: color-mix(in srgb, #788CA5 76%, #F4E3A1 24%);
  --ezra-app-surface-theme-muted-color: color-mix(in srgb, #002B65 68%, transparent 32%);
  --ezra-app-surface-theme-form-help-text: color-mix(in srgb, #002B65 68%, transparent 32%);
  --ezra-app-surface-theme-surface-quiet: #F4E3A1;
  --ezra-app-surface-theme-surface-hover: color-mix(in srgb, #F4E3A1 84%, #788CA5 16%);
  --ezra-app-surface-theme-focus-ring: #B21519;
  --ezra-app-surface-theme-card-padding: clamp(14px, 1.35vw, 18px);
  --ezra-app-surface-theme-card-padding-compact: clamp(12px, 1.1vw, 14px);
  --ezra-app-surface-theme-grid-gap: clamp(14px, 1.9vw, 20px);
  --ezra-app-surface-theme-stack-gap: clamp(14px, 1.4vw, 16px);
  --ezra-app-surface-theme-stack-gap-compact: 12px;
  --ezra-app-surface-theme-stack-gap-loose: clamp(18px, 2vw, 24px);
  --ezra-app-surface-theme-row-gap: 8px;
  --ezra-app-surface-theme-row-gap-compact: 6px;
  --ezra-app-surface-theme-row-gap-loose: 12px;
  --ezra-app-surface-theme-header-menu-control-size: 28px;
  --ezra-app-surface-theme-header-menu-window-width: min(264px, calc(100vw - 24px));
  --ezra-app-surface-theme-header-menu-inset: 12px;
  --ezra-app-surface-theme-header-measure: min(520px, 58vw);
  --ezra-app-surface-theme-header-band-gap: clamp(10px, 1.4vw, 14px);
  --ezra-app-surface-theme-header-title-row-min-height: clamp(2.9rem, 4.8vw, 3.45rem);
  --ezra-app-surface-theme-header-badge-height: 2.4rem;
  --ezra-app-surface-theme-header-title-to-session-gap: clamp(16px, 2.2vw, 24px);
  --ezra-app-surface-theme-header-session-gap: 10px;
  --ezra-app-surface-theme-header-workspace-gap: 10px;
  --ezra-app-surface-theme-motion-duration-fast: 160ms;
  --ezra-app-surface-theme-motion-duration-standard: 220ms;
  --ezra-app-surface-theme-motion-duration-surface: 180ms;
  --ezra-app-surface-theme-motion-duration-deck: 240ms;
  --ezra-app-surface-theme-motion-ease-standard: cubic-bezier(0.22, 1, 0.36, 1);
  --ezra-app-surface-theme-motion-ease-fade: ease;
  --ezra-app-surface-theme-motion-ease-friction: cubic-bezier(0.22, 1, 0.36, 1);
  --ezra-app-surface-theme-motion-surface-shift: 4px;
  --ezra-app-surface-theme-motion-deck-shift: 100%;
  --ezra-app-surface-theme-motion-deck-shift-negative: -100%;
  --ezra-app-surface-theme-motion-chevron-turn: 180deg;
  --ezra-app-surface-theme-control-button-size-compact: 28px;
  --ezra-app-surface-theme-control-button-size-action: 40px;
  --ezra-app-surface-theme-control-popup-anchor-size: 28px;
  --ezra-app-surface-theme-control-popup-window-width: 264px;
  --ezra-app-surface-theme-switcher-parent-inset: 1px;
  --ezra-app-surface-theme-switcher-drawer-max-height: 400px;
  --ezra-app-surface-theme-switcher-desktop-gap: 10px;
  --ezra-app-surface-theme-switcher-desktop-row-gap: 10px;
  --ezra-app-surface-theme-switcher-desktop-columns: 4;
  --ezra-app-surface-theme-switcher-parent-height: 62px;
  --ezra-app-surface-theme-switcher-chevron-width: 51px;
  --ezra-app-surface-theme-switcher-chevron-height: 60px;
  --ezra-app-surface-theme-switcher-parent-height-compact: 58px;
  --ezra-app-surface-theme-switcher-chevron-width-compact: 48px;
  --ezra-app-surface-theme-switcher-chevron-height-compact: 56px;
  --ezra-app-surface-theme-switcher-parent-height-mobile: 50px;
  --ezra-app-surface-theme-switcher-chevron-width-mobile: 46px;
  --ezra-app-surface-theme-switcher-chevron-height-mobile: 50px;
  --ezra-app-surface-theme-editor-card-bg: color-mix(in srgb, #F4E3A1 72%, #FFFAF0 28%);
  --ezra-app-surface-theme-editor-card-border: #788CA5;
  --ezra-app-surface-theme-editor-card-shadow: 0 18px 40px color-mix(in srgb, #002B65 14%, transparent 86%);
  --ezra-app-surface-theme-collection-card-bg: color-mix(in srgb, #F4E3A1 72%, #FFFAF0 28%);
  --ezra-app-surface-theme-collection-card-border: #788CA5;
  --ezra-app-surface-theme-collection-card-shadow: 0 18px 40px color-mix(in srgb, #002B65 14%, transparent 86%);
  --ezra-app-surface-theme-collection-card-body-border: #788CA5;
  --ezra-app-surface-theme-collection-button-bg: #F4E3A1;
  --ezra-app-surface-theme-collection-button-hover-bg: color-mix(in srgb, #F4E3A1 84%, #788CA5 16%);
  --ezra-app-surface-theme-mobile-collection-toggle-text: #002B65;
  --ezra-app-surface-theme-mobile-collection-toggle-meta: #1D3150;
  --ezra-app-surface-theme-mobile-collection-toggle-border: #788CA5;
  --ezra-app-surface-theme-badge-color: #1D3150;
  --ezra-app-surface-theme-badge-published-color: #B21519;
  --ezra-app-surface-theme-badge-published-border: #788CA5;
  --ezra-app-surface-theme-badge-published-bg: #F4E3A1;
  --ezra-app-surface-theme-badge-draft-color: #1D3150;
  --ezra-app-surface-theme-badge-draft-border: #788CA5;
  --ezra-app-surface-theme-badge-draft-bg: #FFFAF0;
  --ezra-app-surface-theme-badge-featured-color: #B21519;
  --ezra-app-surface-theme-badge-featured-border: color-mix(in srgb, #788CA5 76%, #F4E3A1 24%);
  --ezra-app-surface-theme-badge-featured-bg: #F4E3A1;
  --ezra-app-surface-theme-chip-color: #1D3150;
  --ezra-app-surface-theme-chip-bg: #F4E3A1;
  --ezra-app-surface-theme-chip-border: #788CA5;
  --ezra-app-surface-theme-message-error-border: color-mix(in srgb, #F4E3A1 52%, #b93434 48%);
  --ezra-app-surface-theme-message-error-bg: color-mix(in srgb, #F4E3A1 72%, #b93434 28%);
  --ezra-app-surface-theme-message-success-border: color-mix(in srgb, #F4E3A1 52%, #2f7a5b 48%);
  --ezra-app-surface-theme-message-success-bg: color-mix(in srgb, #F4E3A1 78%, #2f7a5b 22%);
  --ezra-cms-editorial-status-public-text: #B21519;
  --ezra-cms-editorial-status-public-border: #788CA5;
  --ezra-cms-editorial-status-public-background: #F4E3A1;
  --ezra-cms-editorial-status-private-text: #1D3150;
  --ezra-cms-editorial-status-private-border: #788CA5;
  --ezra-cms-editorial-status-private-background: #FFFAF0;
  --ezra-cms-editorial-status-delete-text: #1D3150;
  --ezra-cms-editorial-status-delete-border: color-mix(in srgb, #F4E3A1 52%, #b93434 48%);
  --ezra-cms-editorial-status-delete-background: color-mix(in srgb, #F4E3A1 72%, #b93434 28%);
  --ezra-app-surface-theme-repeater-bg: #F4E3A1;
  --ezra-app-surface-theme-repeater-border: #788CA5;
  --ezra-app-surface-theme-repeater-item-bg: color-mix(in srgb, #F4E3A1 72%, #FFFAF0 28%);
  --ezra-app-surface-theme-repeater-item-border: #788CA5;
  --ezra-app-surface-theme-repeater-item-border-strong: color-mix(in srgb, #788CA5 76%, #F4E3A1 24%);
  --ezra-app-surface-theme-repeater-title-color: var(--ezra-ui-theme-heading-primary);
  --ezra-app-surface-theme-repeater-meta-color: color-mix(in srgb, #002B65 68%, transparent 32%);
  --ezra-app-surface-theme-primary-button-background: #002B65;
  --ezra-app-surface-theme-primary-button-text: var(--ezra-ui-theme-button-text);
  --ezra-app-surface-theme-primary-button-border: #002B65;
  --ezra-app-surface-theme-primary-button-hover-background: #B21519;
  --ezra-app-surface-theme-primary-button-hover-text: var(--ezra-ui-theme-button-text);
  --ezra-app-surface-theme-primary-button-hover-border: #B21519;
  --ezra-app-surface-theme-secondary-button-background: #F4E3A1;
  --ezra-app-surface-theme-secondary-button-text: var(--ezra-ui-theme-text);
  --ezra-app-surface-theme-secondary-button-border: #788CA5;
  --ezra-app-surface-theme-secondary-button-hover-background: color-mix(in srgb, #F4E3A1 84%, #788CA5 16%);
  --ezra-app-surface-theme-secondary-button-hover-text: var(--ezra-ui-theme-text);
  --ezra-app-surface-theme-secondary-button-hover-border: color-mix(in srgb, #788CA5 76%, #F4E3A1 24%);
  --ezra-app-surface-theme-secondary-important-button-background: transparent;
  --ezra-app-surface-theme-secondary-important-button-text: var(--ezra-ui-theme-heading-primary);
  --ezra-app-surface-theme-secondary-important-button-border: var(--ezra-ui-theme-accent-strong);
  --ezra-app-surface-theme-secondary-important-button-hover-background: transparent;
  --ezra-app-surface-theme-secondary-important-button-hover-text: var(--ezra-ui-theme-heading-primary);
  --ezra-app-surface-theme-secondary-important-button-hover-border: var(--ezra-ui-theme-accent-strong);
  --ezra-app-surface-theme-ghost-button-text: var(--ezra-ui-theme-accent-strong);
  --ezra-app-surface-theme-ghost-button-border: #788CA5;
  --ezra-app-surface-theme-ghost-button-hover-background: color-mix(in srgb, #F4E3A1 84%, #788CA5 16%);
  --ezra-app-surface-theme-ghost-button-hover-text: var(--ezra-ui-theme-heading-primary);
  --ezra-app-surface-theme-danger-button-background: transparent;
  --ezra-app-surface-theme-danger-button-text: var(--ezra-ui-theme-accent-strong);
  --ezra-app-surface-theme-danger-button-border: color-mix(in srgb, #788CA5 55%, #b93434 45%);
  --ezra-app-surface-theme-danger-button-hover-background: transparent;
  --ezra-app-surface-theme-danger-button-hover-text: var(--ezra-ui-theme-accent-strong);
  --ezra-app-surface-theme-danger-button-hover-border: color-mix(in srgb, #788CA5 35%, #b93434 65%);
  --ezra-app-surface-theme-important-button-accent: var(--ezra-ui-theme-accent-strong);
  --ezra-app-surface-theme-important-button-background: color-mix(in srgb, var(--ezra-ui-theme-accent-strong) 12%, #FFFAF0);
  --ezra-app-surface-theme-important-button-text: var(--ezra-ui-theme-heading-primary);
  --ezra-app-surface-theme-important-button-border: color-mix(in srgb, var(--ezra-ui-theme-accent-strong) 68%, #788CA5);
  --ezra-app-surface-theme-important-button-hover-background: color-mix(in srgb, var(--ezra-ui-theme-accent-strong) 18%, #FFFAF0);
  --ezra-app-surface-theme-important-button-hover-text: var(--ezra-ui-theme-heading-primary);
  --ezra-app-surface-theme-important-button-hover-border: var(--ezra-ui-theme-accent-strong);
  --ezra-ui-tab-text: var(--ezra-ui-theme-text);
  --ezra-ui-tab-border: #788CA5;
  --ezra-ui-tab-hover-background: color-mix(in srgb, #F4E3A1 84%, #788CA5 16%);
  --ezra-ui-tab-active-background: #002B65;
  --ezra-ui-tab-active-text: var(--ezra-ui-theme-button-text);
  --ezra-ui-tab-active-border: #002B65;
  --ezra-ui-widget-shell-bg: color-mix(in srgb, #F4E3A1 72%, #FFFAF0 28%);
  --ezra-ui-widget-shell-border: #788CA5;
  --ezra-ui-widget-shell-shadow: 0 18px 40px color-mix(in srgb, #002B65 14%, transparent 86%);
  --ezra-ui-widget-title-color: var(--ezra-ui-theme-heading-primary);
  --ezra-ui-widget-accent-color: var(--ezra-ui-theme-accent);
  --ezra-ui-widget-meta-color: color-mix(in srgb, #002B65 68%, transparent 32%);
  --ezra-ui-widget-summary-bg: #F4E3A1;
  --ezra-ui-widget-summary-border: #788CA5;
  --ezra-app-surface-theme-mode-switcher-text: var(--ezra-ui-theme-text);
  --ezra-app-surface-theme-mode-subtab-text: var(--ezra-ui-theme-text);
  --ezra-app-surface-theme-mode-switcher-active-surface: #002B65;
  --ezra-app-surface-theme-mode-switcher-active-text: var(--ezra-ui-theme-button-text);
  --ezra-app-surface-theme-mode-switcher-active-border: #002B65;
  --ezra-app-surface-theme-mode-switcher-active-outline: #B21519;
  --ezra-app-surface-theme-mode-switcher-active-divider: color-mix(in srgb, #FFFAF0 18%, transparent);
  --ezra-app-surface-theme-mode-subtab-active-surface: #002B65;
  --ezra-app-surface-theme-mode-subtab-active-text: var(--ezra-ui-theme-button-text);
  --ezra-app-surface-theme-mode-subtab-active-border: #002B65;
  --ezra-app-surface-theme-mode-subtab-active-outline: #B21519;
  --ezra-app-surface-theme-mode-subtab-active-shadow: ;
  --ezra-app-surface-theme-mode-switcher-model: stepped-light;
  --ezra-app-surface-theme-mode-step-1: #FFFAF0;
  --ezra-app-surface-theme-mode-step-2: #F4E3A1;
  --ezra-app-surface-theme-mode-step-3: #F4E3A1;
  --ezra-app-surface-theme-mode-step-4: #F4E3A1;
  --ezra-app-surface-theme-mode-step-5: #F4E3A1;
  --ezra-app-surface-theme-mode-step-6: #F4E3A1;
  --ezra-app-surface-theme-mode-step-7: #B21519;
  --ezra-app-surface-theme-mode-step-8: #002B65;
  --ezra-app-surface-theme-mode-step-1-hover: color-mix(in srgb, #FFFAF0 86%, #FFFAF0 14%);
  --ezra-app-surface-theme-mode-step-2-hover: color-mix(in srgb, #F4E3A1 86%, #FFFAF0 14%);
  --ezra-app-surface-theme-mode-step-3-hover: color-mix(in srgb, #F4E3A1 86%, #FFFAF0 14%);
  --ezra-app-surface-theme-mode-step-4-hover: color-mix(in srgb, #F4E3A1 86%, #FFFAF0 14%);
  --ezra-app-surface-theme-mode-step-5-hover: color-mix(in srgb, #F4E3A1 84%, #002B65 16%);
  --ezra-app-surface-theme-mode-step-6-hover: color-mix(in srgb, #F4E3A1 84%, #002B65 16%);
  --ezra-app-surface-theme-mode-step-7-hover: color-mix(in srgb, #B21519 84%, #002B65 16%);
  --ezra-app-surface-theme-mode-step-8-hover: color-mix(in srgb, #002B65 84%, #002B65 16%);
  --ezra-app-surface-theme-mode-substep-1: color-mix(in srgb, #FFFAF0 94%, #002B65 6%);
  --ezra-app-surface-theme-mode-substep-2: color-mix(in srgb, #F4E3A1 94%, #002B65 6%);
  --ezra-app-surface-theme-mode-substep-3: color-mix(in srgb, #F4E3A1 94%, #002B65 6%);
  --ezra-app-surface-theme-mode-substep-4: color-mix(in srgb, #F4E3A1 94%, #002B65 6%);
  --ezra-app-surface-theme-mode-substep-5: color-mix(in srgb, #F4E3A1 94%, #002B65 6%);
  --ezra-app-surface-theme-mode-substep-6: color-mix(in srgb, #F4E3A1 94%, #002B65 6%);
  --ezra-app-surface-theme-mode-substep-7: color-mix(in srgb, #B21519 94%, #002B65 6%);
  --ezra-app-surface-theme-mode-substep-8: color-mix(in srgb, #002B65 94%, #002B65 6%);
  --ezra-app-surface-theme-mode-substep-1-hover: color-mix(in srgb, color-mix(in srgb, #FFFAF0 94%, #002B65 6%) 86%, #FFFAF0 14%);
  --ezra-app-surface-theme-mode-substep-2-hover: color-mix(in srgb, color-mix(in srgb, #F4E3A1 94%, #002B65 6%) 86%, #FFFAF0 14%);
  --ezra-app-surface-theme-mode-substep-3-hover: color-mix(in srgb, color-mix(in srgb, #F4E3A1 94%, #002B65 6%) 86%, #FFFAF0 14%);
  --ezra-app-surface-theme-mode-substep-4-hover: color-mix(in srgb, color-mix(in srgb, #F4E3A1 94%, #002B65 6%) 86%, #FFFAF0 14%);
  --ezra-app-surface-theme-mode-substep-5-hover: color-mix(in srgb, color-mix(in srgb, #F4E3A1 94%, #002B65 6%) 84%, #002B65 16%);
  --ezra-app-surface-theme-mode-substep-6-hover: color-mix(in srgb, color-mix(in srgb, #F4E3A1 94%, #002B65 6%) 84%, #002B65 16%);
  --ezra-app-surface-theme-mode-substep-7-hover: color-mix(in srgb, color-mix(in srgb, #B21519 94%, #002B65 6%) 84%, #002B65 16%);
  --ezra-app-surface-theme-mode-substep-8-hover: color-mix(in srgb, color-mix(in srgb, #002B65 94%, #002B65 6%) 84%, #002B65 16%);
}

[class~="billy-theme"] {
  --ezra-ui-theme-background: #FFFAF0;
  --ezra-ui-theme-text: #002B65;
  --ezra-ui-theme-heading-primary: #002B65;
  --ezra-ui-theme-heading-secondary: #B21519;
  --ezra-ui-theme-heading-tertiary: #B21519;
  --ezra-ui-theme-accent: #F4E3A1;
  --ezra-ui-theme-accent-strong: #B21519;
  --ezra-ui-theme-structure: #788CA5;
  --ezra-ui-theme-header: #002B65;
  --ezra-ui-theme-nav: #B21519;
  --ezra-ui-theme-footer: #002B65;
  --ezra-ui-theme-border: #788CA5;
  --ezra-ui-theme-surface-quiet: #F4E3A1;
  --ezra-ui-theme-surface-quiet-text: #1D3150;
  --ezra-ui-theme-quote-background: #F4E3A1;
  --ezra-ui-theme-quote-text: #1D3150;
  --ezra-ui-theme-quote-border: #788CA5;
  --ezra-ui-theme-button-background: #002B65;
  --ezra-ui-theme-button-text: #FFFAF0;
  --ezra-ui-theme-focus-ring: #B21519;
  --ezra-ui-theme-focus-ring-text: #FFFAF0;
  --ezra-ui-site-link-hover: #B21519;
  --ezra-ui-site-subtitle: #B21519;
  --ezra-ui-site-label: #1D3150;
  --ezra-ui-site-sources-label: #1D3150;
  --ezra-ui-site-pagination: #B21519;
  --ezra-ui-site-pagination-inactive: color-mix(in srgb, #002B65 54%, transparent);
  --ezra-ui-theme-surface-step-1: #FFFAF0;
  --ezra-ui-theme-surface-step-2: #F4E3A1;
  --ezra-ui-theme-surface-step-3: #F4E3A1;
  --ezra-ui-theme-surface-step-4: #F4E3A1;
  --ezra-ui-theme-surface-step-5: #F4E3A1;
  --ezra-ui-theme-surface-step-6: #F4E3A1;
  --ezra-ui-theme-surface-step-7: #B21519;
  --ezra-ui-theme-surface-step-8: #002B65;
  --ezra-ui-theme-important-action-accent: var(--ezra-ui-theme-accent-strong);
  --ezra-ui-theme-important-action-background: color-mix(in srgb, var(--ezra-ui-theme-accent-strong) 12%, #FFFAF0);
  --ezra-ui-theme-important-action-text: var(--ezra-ui-theme-heading-primary);
  --ezra-ui-theme-important-action-border: color-mix(in srgb, var(--ezra-ui-theme-accent-strong) 68%, #788CA5);
  --ezra-ui-theme-important-action-hover-background: color-mix(in srgb, var(--ezra-ui-theme-accent-strong) 18%, #FFFAF0);
  --ezra-ui-theme-important-action-hover-text: var(--ezra-ui-theme-heading-primary);
  --ezra-ui-theme-important-action-hover-border: var(--ezra-ui-theme-accent-strong);
  --ezra-app-surface-theme-home-link-color: var(--ezra-ui-theme-heading-primary);
  --ezra-app-surface-theme-header-menu-accent: var(--ezra-ui-theme-accent);
  --ezra-app-surface-theme-header-menu-panel-background: color-mix(in srgb, #F4E3A1 72%, #FFFAF0 28%);
  --ezra-app-surface-theme-header-menu-panel-backdrop: none;
  --ezra-ui-theme-checkbox-text: var(--ezra-ui-theme-text);
  --ezra-app-surface-theme-mobile-filter-trigger-text: var(--ezra-ui-theme-text);
  --ezra-app-surface-theme-mobile-filter-trigger-border: #788CA5;
  --ezra-app-surface-theme-mobile-filter-trigger-open-border: color-mix(in srgb, #788CA5 76%, #F4E3A1 24%);
  --ezra-app-surface-theme-editor-heading-color: var(--ezra-ui-theme-heading-primary);
  --ezra-app-surface-theme-panel-color: color-mix(in srgb, #F4E3A1 72%, #FFFAF0 28%);
  --ezra-app-surface-theme-panel-border: #788CA5;
  --ezra-app-surface-theme-panel-border-strong: color-mix(in srgb, #788CA5 76%, #F4E3A1 24%);
  --ezra-app-surface-theme-input-bg: #FFFAF0;
  --ezra-app-surface-theme-input-border: #788CA5;
  --ezra-app-surface-theme-input-border-strong: color-mix(in srgb, #788CA5 76%, #F4E3A1 24%);
  --ezra-ui-theme-input-border: #788CA5;
  --ezra-ui-theme-input-border-strong: color-mix(in srgb, #788CA5 76%, #F4E3A1 24%);
  --ezra-app-surface-theme-muted-color: color-mix(in srgb, #002B65 68%, transparent 32%);
  --ezra-app-surface-theme-form-help-text: color-mix(in srgb, #002B65 68%, transparent 32%);
  --ezra-app-surface-theme-surface-quiet: #F4E3A1;
  --ezra-app-surface-theme-surface-hover: color-mix(in srgb, #F4E3A1 84%, #788CA5 16%);
  --ezra-app-surface-theme-focus-ring: #B21519;
  --ezra-app-surface-theme-card-padding: clamp(14px, 1.35vw, 18px);
  --ezra-app-surface-theme-card-padding-compact: clamp(12px, 1.1vw, 14px);
  --ezra-app-surface-theme-grid-gap: clamp(14px, 1.9vw, 20px);
  --ezra-app-surface-theme-stack-gap: clamp(14px, 1.4vw, 16px);
  --ezra-app-surface-theme-stack-gap-compact: 12px;
  --ezra-app-surface-theme-stack-gap-loose: clamp(18px, 2vw, 24px);
  --ezra-app-surface-theme-row-gap: 8px;
  --ezra-app-surface-theme-row-gap-compact: 6px;
  --ezra-app-surface-theme-row-gap-loose: 12px;
  --ezra-app-surface-theme-header-menu-control-size: 28px;
  --ezra-app-surface-theme-header-menu-window-width: min(264px, calc(100vw - 24px));
  --ezra-app-surface-theme-header-menu-inset: 12px;
  --ezra-app-surface-theme-header-measure: min(520px, 58vw);
  --ezra-app-surface-theme-header-band-gap: clamp(10px, 1.4vw, 14px);
  --ezra-app-surface-theme-header-title-row-min-height: clamp(2.9rem, 4.8vw, 3.45rem);
  --ezra-app-surface-theme-header-badge-height: 2.4rem;
  --ezra-app-surface-theme-header-title-to-session-gap: clamp(16px, 2.2vw, 24px);
  --ezra-app-surface-theme-header-session-gap: 10px;
  --ezra-app-surface-theme-header-workspace-gap: 10px;
  --ezra-app-surface-theme-motion-duration-fast: 160ms;
  --ezra-app-surface-theme-motion-duration-standard: 220ms;
  --ezra-app-surface-theme-motion-duration-surface: 180ms;
  --ezra-app-surface-theme-motion-duration-deck: 240ms;
  --ezra-app-surface-theme-motion-ease-standard: cubic-bezier(0.22, 1, 0.36, 1);
  --ezra-app-surface-theme-motion-ease-fade: ease;
  --ezra-app-surface-theme-motion-ease-friction: cubic-bezier(0.22, 1, 0.36, 1);
  --ezra-app-surface-theme-motion-surface-shift: 4px;
  --ezra-app-surface-theme-motion-deck-shift: 100%;
  --ezra-app-surface-theme-motion-deck-shift-negative: -100%;
  --ezra-app-surface-theme-motion-chevron-turn: 180deg;
  --ezra-app-surface-theme-control-button-size-compact: 28px;
  --ezra-app-surface-theme-control-button-size-action: 40px;
  --ezra-app-surface-theme-control-popup-anchor-size: 28px;
  --ezra-app-surface-theme-control-popup-window-width: 264px;
  --ezra-app-surface-theme-switcher-parent-inset: 1px;
  --ezra-app-surface-theme-switcher-drawer-max-height: 400px;
  --ezra-app-surface-theme-switcher-desktop-gap: 10px;
  --ezra-app-surface-theme-switcher-desktop-row-gap: 10px;
  --ezra-app-surface-theme-switcher-desktop-columns: 4;
  --ezra-app-surface-theme-switcher-parent-height: 62px;
  --ezra-app-surface-theme-switcher-chevron-width: 51px;
  --ezra-app-surface-theme-switcher-chevron-height: 60px;
  --ezra-app-surface-theme-switcher-parent-height-compact: 58px;
  --ezra-app-surface-theme-switcher-chevron-width-compact: 48px;
  --ezra-app-surface-theme-switcher-chevron-height-compact: 56px;
  --ezra-app-surface-theme-switcher-parent-height-mobile: 50px;
  --ezra-app-surface-theme-switcher-chevron-width-mobile: 46px;
  --ezra-app-surface-theme-switcher-chevron-height-mobile: 50px;
  --ezra-app-surface-theme-editor-card-bg: color-mix(in srgb, #F4E3A1 72%, #FFFAF0 28%);
  --ezra-app-surface-theme-editor-card-border: #788CA5;
  --ezra-app-surface-theme-editor-card-shadow: 0 18px 40px color-mix(in srgb, #002B65 14%, transparent 86%);
  --ezra-app-surface-theme-collection-card-bg: color-mix(in srgb, #F4E3A1 72%, #FFFAF0 28%);
  --ezra-app-surface-theme-collection-card-border: #788CA5;
  --ezra-app-surface-theme-collection-card-shadow: 0 18px 40px color-mix(in srgb, #002B65 14%, transparent 86%);
  --ezra-app-surface-theme-collection-card-body-border: #788CA5;
  --ezra-app-surface-theme-collection-button-bg: #F4E3A1;
  --ezra-app-surface-theme-collection-button-hover-bg: color-mix(in srgb, #F4E3A1 84%, #788CA5 16%);
  --ezra-app-surface-theme-mobile-collection-toggle-text: #002B65;
  --ezra-app-surface-theme-mobile-collection-toggle-meta: #1D3150;
  --ezra-app-surface-theme-mobile-collection-toggle-border: #788CA5;
  --ezra-app-surface-theme-badge-color: #1D3150;
  --ezra-app-surface-theme-badge-published-color: #B21519;
  --ezra-app-surface-theme-badge-published-border: #788CA5;
  --ezra-app-surface-theme-badge-published-bg: #F4E3A1;
  --ezra-app-surface-theme-badge-draft-color: #1D3150;
  --ezra-app-surface-theme-badge-draft-border: #788CA5;
  --ezra-app-surface-theme-badge-draft-bg: #FFFAF0;
  --ezra-app-surface-theme-badge-featured-color: #B21519;
  --ezra-app-surface-theme-badge-featured-border: color-mix(in srgb, #788CA5 76%, #F4E3A1 24%);
  --ezra-app-surface-theme-badge-featured-bg: #F4E3A1;
  --ezra-app-surface-theme-chip-color: #1D3150;
  --ezra-app-surface-theme-chip-bg: #F4E3A1;
  --ezra-app-surface-theme-chip-border: #788CA5;
  --ezra-app-surface-theme-message-error-border: color-mix(in srgb, #F4E3A1 52%, #b93434 48%);
  --ezra-app-surface-theme-message-error-bg: color-mix(in srgb, #F4E3A1 72%, #b93434 28%);
  --ezra-app-surface-theme-message-success-border: color-mix(in srgb, #F4E3A1 52%, #2f7a5b 48%);
  --ezra-app-surface-theme-message-success-bg: color-mix(in srgb, #F4E3A1 78%, #2f7a5b 22%);
  --ezra-cms-editorial-status-public-text: #B21519;
  --ezra-cms-editorial-status-public-border: #788CA5;
  --ezra-cms-editorial-status-public-background: #F4E3A1;
  --ezra-cms-editorial-status-private-text: #1D3150;
  --ezra-cms-editorial-status-private-border: #788CA5;
  --ezra-cms-editorial-status-private-background: #FFFAF0;
  --ezra-cms-editorial-status-delete-text: #1D3150;
  --ezra-cms-editorial-status-delete-border: color-mix(in srgb, #F4E3A1 52%, #b93434 48%);
  --ezra-cms-editorial-status-delete-background: color-mix(in srgb, #F4E3A1 72%, #b93434 28%);
  --ezra-app-surface-theme-repeater-bg: #F4E3A1;
  --ezra-app-surface-theme-repeater-border: #788CA5;
  --ezra-app-surface-theme-repeater-item-bg: color-mix(in srgb, #F4E3A1 72%, #FFFAF0 28%);
  --ezra-app-surface-theme-repeater-item-border: #788CA5;
  --ezra-app-surface-theme-repeater-item-border-strong: color-mix(in srgb, #788CA5 76%, #F4E3A1 24%);
  --ezra-app-surface-theme-repeater-title-color: var(--ezra-ui-theme-heading-primary);
  --ezra-app-surface-theme-repeater-meta-color: color-mix(in srgb, #002B65 68%, transparent 32%);
  --ezra-app-surface-theme-primary-button-background: #002B65;
  --ezra-app-surface-theme-primary-button-text: var(--ezra-ui-theme-button-text);
  --ezra-app-surface-theme-primary-button-border: #002B65;
  --ezra-app-surface-theme-primary-button-hover-background: #B21519;
  --ezra-app-surface-theme-primary-button-hover-text: var(--ezra-ui-theme-button-text);
  --ezra-app-surface-theme-primary-button-hover-border: #B21519;
  --ezra-app-surface-theme-secondary-button-background: #F4E3A1;
  --ezra-app-surface-theme-secondary-button-text: var(--ezra-ui-theme-text);
  --ezra-app-surface-theme-secondary-button-border: #788CA5;
  --ezra-app-surface-theme-secondary-button-hover-background: color-mix(in srgb, #F4E3A1 84%, #788CA5 16%);
  --ezra-app-surface-theme-secondary-button-hover-text: var(--ezra-ui-theme-text);
  --ezra-app-surface-theme-secondary-button-hover-border: color-mix(in srgb, #788CA5 76%, #F4E3A1 24%);
  --ezra-app-surface-theme-secondary-important-button-background: transparent;
  --ezra-app-surface-theme-secondary-important-button-text: var(--ezra-ui-theme-heading-primary);
  --ezra-app-surface-theme-secondary-important-button-border: var(--ezra-ui-theme-accent-strong);
  --ezra-app-surface-theme-secondary-important-button-hover-background: transparent;
  --ezra-app-surface-theme-secondary-important-button-hover-text: var(--ezra-ui-theme-heading-primary);
  --ezra-app-surface-theme-secondary-important-button-hover-border: var(--ezra-ui-theme-accent-strong);
  --ezra-app-surface-theme-ghost-button-text: var(--ezra-ui-theme-accent-strong);
  --ezra-app-surface-theme-ghost-button-border: #788CA5;
  --ezra-app-surface-theme-ghost-button-hover-background: color-mix(in srgb, #F4E3A1 84%, #788CA5 16%);
  --ezra-app-surface-theme-ghost-button-hover-text: var(--ezra-ui-theme-heading-primary);
  --ezra-app-surface-theme-danger-button-background: transparent;
  --ezra-app-surface-theme-danger-button-text: var(--ezra-ui-theme-accent-strong);
  --ezra-app-surface-theme-danger-button-border: color-mix(in srgb, #788CA5 55%, #b93434 45%);
  --ezra-app-surface-theme-danger-button-hover-background: transparent;
  --ezra-app-surface-theme-danger-button-hover-text: var(--ezra-ui-theme-accent-strong);
  --ezra-app-surface-theme-danger-button-hover-border: color-mix(in srgb, #788CA5 35%, #b93434 65%);
  --ezra-app-surface-theme-important-button-accent: var(--ezra-ui-theme-accent-strong);
  --ezra-app-surface-theme-important-button-background: color-mix(in srgb, var(--ezra-ui-theme-accent-strong) 12%, #FFFAF0);
  --ezra-app-surface-theme-important-button-text: var(--ezra-ui-theme-heading-primary);
  --ezra-app-surface-theme-important-button-border: color-mix(in srgb, var(--ezra-ui-theme-accent-strong) 68%, #788CA5);
  --ezra-app-surface-theme-important-button-hover-background: color-mix(in srgb, var(--ezra-ui-theme-accent-strong) 18%, #FFFAF0);
  --ezra-app-surface-theme-important-button-hover-text: var(--ezra-ui-theme-heading-primary);
  --ezra-app-surface-theme-important-button-hover-border: var(--ezra-ui-theme-accent-strong);
  --ezra-ui-tab-text: var(--ezra-ui-theme-text);
  --ezra-ui-tab-border: #788CA5;
  --ezra-ui-tab-hover-background: color-mix(in srgb, #F4E3A1 84%, #788CA5 16%);
  --ezra-ui-tab-active-background: #002B65;
  --ezra-ui-tab-active-text: var(--ezra-ui-theme-button-text);
  --ezra-ui-tab-active-border: #002B65;
  --ezra-ui-widget-shell-bg: color-mix(in srgb, #F4E3A1 72%, #FFFAF0 28%);
  --ezra-ui-widget-shell-border: #788CA5;
  --ezra-ui-widget-shell-shadow: 0 18px 40px color-mix(in srgb, #002B65 14%, transparent 86%);
  --ezra-ui-widget-title-color: var(--ezra-ui-theme-heading-primary);
  --ezra-ui-widget-accent-color: var(--ezra-ui-theme-accent);
  --ezra-ui-widget-meta-color: color-mix(in srgb, #002B65 68%, transparent 32%);
  --ezra-ui-widget-summary-bg: #F4E3A1;
  --ezra-ui-widget-summary-border: #788CA5;
  --ezra-app-surface-theme-mode-switcher-text: var(--ezra-ui-theme-text);
  --ezra-app-surface-theme-mode-subtab-text: var(--ezra-ui-theme-text);
  --ezra-app-surface-theme-mode-switcher-active-surface: #002B65;
  --ezra-app-surface-theme-mode-switcher-active-text: var(--ezra-ui-theme-button-text);
  --ezra-app-surface-theme-mode-switcher-active-border: #002B65;
  --ezra-app-surface-theme-mode-switcher-active-outline: #B21519;
  --ezra-app-surface-theme-mode-switcher-active-divider: color-mix(in srgb, #FFFAF0 18%, transparent);
  --ezra-app-surface-theme-mode-subtab-active-surface: #002B65;
  --ezra-app-surface-theme-mode-subtab-active-text: var(--ezra-ui-theme-button-text);
  --ezra-app-surface-theme-mode-subtab-active-border: #002B65;
  --ezra-app-surface-theme-mode-subtab-active-outline: #B21519;
  --ezra-app-surface-theme-mode-subtab-active-shadow: ;
  --ezra-app-surface-theme-mode-switcher-model: stepped-light;
  --ezra-app-surface-theme-mode-step-1: #FFFAF0;
  --ezra-app-surface-theme-mode-step-2: #F4E3A1;
  --ezra-app-surface-theme-mode-step-3: #F4E3A1;
  --ezra-app-surface-theme-mode-step-4: #F4E3A1;
  --ezra-app-surface-theme-mode-step-5: #F4E3A1;
  --ezra-app-surface-theme-mode-step-6: #F4E3A1;
  --ezra-app-surface-theme-mode-step-7: #B21519;
  --ezra-app-surface-theme-mode-step-8: #002B65;
  --ezra-app-surface-theme-mode-step-1-hover: color-mix(in srgb, #FFFAF0 86%, #FFFAF0 14%);
  --ezra-app-surface-theme-mode-step-2-hover: color-mix(in srgb, #F4E3A1 86%, #FFFAF0 14%);
  --ezra-app-surface-theme-mode-step-3-hover: color-mix(in srgb, #F4E3A1 86%, #FFFAF0 14%);
  --ezra-app-surface-theme-mode-step-4-hover: color-mix(in srgb, #F4E3A1 86%, #FFFAF0 14%);
  --ezra-app-surface-theme-mode-step-5-hover: color-mix(in srgb, #F4E3A1 84%, #002B65 16%);
  --ezra-app-surface-theme-mode-step-6-hover: color-mix(in srgb, #F4E3A1 84%, #002B65 16%);
  --ezra-app-surface-theme-mode-step-7-hover: color-mix(in srgb, #B21519 84%, #002B65 16%);
  --ezra-app-surface-theme-mode-step-8-hover: color-mix(in srgb, #002B65 84%, #002B65 16%);
  --ezra-app-surface-theme-mode-substep-1: color-mix(in srgb, #FFFAF0 94%, #002B65 6%);
  --ezra-app-surface-theme-mode-substep-2: color-mix(in srgb, #F4E3A1 94%, #002B65 6%);
  --ezra-app-surface-theme-mode-substep-3: color-mix(in srgb, #F4E3A1 94%, #002B65 6%);
  --ezra-app-surface-theme-mode-substep-4: color-mix(in srgb, #F4E3A1 94%, #002B65 6%);
  --ezra-app-surface-theme-mode-substep-5: color-mix(in srgb, #F4E3A1 94%, #002B65 6%);
  --ezra-app-surface-theme-mode-substep-6: color-mix(in srgb, #F4E3A1 94%, #002B65 6%);
  --ezra-app-surface-theme-mode-substep-7: color-mix(in srgb, #B21519 94%, #002B65 6%);
  --ezra-app-surface-theme-mode-substep-8: color-mix(in srgb, #002B65 94%, #002B65 6%);
  --ezra-app-surface-theme-mode-substep-1-hover: color-mix(in srgb, color-mix(in srgb, #FFFAF0 94%, #002B65 6%) 86%, #FFFAF0 14%);
  --ezra-app-surface-theme-mode-substep-2-hover: color-mix(in srgb, color-mix(in srgb, #F4E3A1 94%, #002B65 6%) 86%, #FFFAF0 14%);
  --ezra-app-surface-theme-mode-substep-3-hover: color-mix(in srgb, color-mix(in srgb, #F4E3A1 94%, #002B65 6%) 86%, #FFFAF0 14%);
  --ezra-app-surface-theme-mode-substep-4-hover: color-mix(in srgb, color-mix(in srgb, #F4E3A1 94%, #002B65 6%) 86%, #FFFAF0 14%);
  --ezra-app-surface-theme-mode-substep-5-hover: color-mix(in srgb, color-mix(in srgb, #F4E3A1 94%, #002B65 6%) 84%, #002B65 16%);
  --ezra-app-surface-theme-mode-substep-6-hover: color-mix(in srgb, color-mix(in srgb, #F4E3A1 94%, #002B65 6%) 84%, #002B65 16%);
  --ezra-app-surface-theme-mode-substep-7-hover: color-mix(in srgb, color-mix(in srgb, #B21519 94%, #002B65 6%) 84%, #002B65 16%);
  --ezra-app-surface-theme-mode-substep-8-hover: color-mix(in srgb, color-mix(in srgb, #002B65 94%, #002B65 6%) 84%, #002B65 16%);
}

:root, [data-theme-scope] {
  --ezra-ui-site-background: var(--ezra-ui-theme-background);
  --ezra-ui-site-text: var(--ezra-ui-theme-text);
  --ezra-ui-site-h1: var(--ezra-ui-theme-heading-primary);
  --ezra-ui-site-h2: var(--ezra-ui-theme-heading-secondary);
  --ezra-ui-site-h3: var(--ezra-ui-theme-heading-tertiary, var(--ezra-ui-theme-heading-secondary));
  --ezra-ui-site-h4: var(--ezra-ui-theme-heading-tertiary, var(--ezra-ui-theme-heading-secondary));
  --ezra-ui-site-h5: var(--ezra-ui-theme-heading-tertiary, var(--ezra-ui-theme-heading-secondary));
  --ezra-ui-site-h6: var(--ezra-ui-theme-heading-tertiary, var(--ezra-ui-theme-heading-secondary));
  --ezra-ui-site-link: var(--ezra-ui-theme-accent-strong, var(--ezra-ui-theme-accent));
  --ezra-ui-site-header: var(--ezra-ui-theme-header, var(--ezra-ui-theme-accent));
  --ezra-ui-site-nav: var(--ezra-ui-theme-nav, var(--ezra-ui-theme-accent));
  --ezra-ui-site-footer: var(--ezra-ui-theme-footer, var(--ezra-ui-theme-accent));
  --ezra-ui-site-border: var(--ezra-ui-theme-border);
  --ezra-ui-site-button-background: var(--ezra-ui-theme-button-background);
  --ezra-ui-site-button-text: var(--ezra-ui-theme-button-text);
  --ezra-ui-site-quote-background: var(--ezra-ui-theme-quote-background, var(--ezra-ui-theme-surface-quiet));
  --ezra-ui-site-quote-text: var(--ezra-ui-theme-quote-text, var(--ezra-ui-theme-surface-quiet-text, var(--ezra-ui-theme-text)));
  --ezra-ui-site-quote-border: var(--ezra-ui-theme-quote-border, var(--ezra-ui-theme-border));
  --ezra-ui-site-input-highlight: var(--ezra-ui-theme-focus-ring);
  --ezra-ui-site-input-highlight-text: var(--ezra-ui-theme-focus-ring-text);

  --background-color: var(--ezra-ui-site-background);
  --text-color: var(--ezra-ui-site-text);
  --h1-color: var(--ezra-ui-site-h1);
  --h2-color: var(--ezra-ui-site-h2);
  --h3-color: var(--ezra-ui-site-h3);
  --h4-color: var(--ezra-ui-site-h4);
  --h5-color: var(--ezra-ui-site-h5);
  --h6-color: var(--ezra-ui-site-h6);
  --link-color: var(--ezra-ui-site-link);
  --link-hover-color: var(--ezra-ui-site-link-hover);
  --header-color: var(--ezra-ui-site-header);
  --nav-color: var(--ezra-ui-site-nav);
  --footer-color: var(--ezra-ui-site-footer);
  --subtitle-color: var(--ezra-ui-site-subtitle);
  --label-color: var(--ezra-ui-site-label);
  --sources-label-color: var(--ezra-ui-site-sources-label);
  --border-color: var(--ezra-ui-site-border);
  --button-text-color: var(--ezra-ui-site-button-text);
  --button-background-color: var(--ezra-ui-site-button-background);
  --quote-background-color: var(--ezra-ui-site-quote-background);
  --quote-text-color: var(--ezra-ui-site-quote-text);
  --quote-border-color: var(--ezra-ui-site-quote-border);
  --pagination-color: var(--ezra-ui-site-pagination);
  --pagination-inactive-color: var(--ezra-ui-site-pagination-inactive);
  --input-highlight-color: var(--ezra-ui-site-input-highlight);
  --input-highlight-text-color: var(--ezra-ui-site-input-highlight-text);
}

html,
body {
  width: 100%;
  min-height: 100%;
  margin: 0;
}

html {
  background: var(--ezra-surface-background, var(--background-color, Canvas));
}

body {
  background: var(--ezra-surface-background, var(--background-color, transparent));
}

[data-ezra-scroll-mode="locked"] {
  height: 100dvh;
  overflow: hidden;
}

[data-ezra-document-surface] {
  width: 100%;
  min-width: 0;
  min-height: 100%;
  box-sizing: border-box;
  background: var(--ezra-surface-background, inherit);
}

[data-ezra-viewport-frame] {
  width: 100dvw;
  height: 100dvh;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  box-sizing: border-box;
  background: var(--ezra-surface-background, inherit);
}

[data-ezra-scroll-mode="document"] [data-ezra-viewport-frame] {
  width: 100%;
  min-height: 100%;
  height: auto;
  overflow: visible;
}

[data-ezra-safe-content-area][data-ezra-safe-content-area] {
  box-sizing: border-box;
  scroll-padding-block-start: calc(var(--ezra-safe-content-padding-block-start, 0px) + env(safe-area-inset-top, 0px));
  scroll-padding-inline-end: calc(var(--ezra-safe-content-padding-inline-end, 0px) + env(safe-area-inset-right, 0px));
  scroll-padding-block-end: calc(var(--ezra-safe-content-padding-block-end, 0px) + env(safe-area-inset-bottom, 0px));
  scroll-padding-inline-start: calc(var(--ezra-safe-content-padding-inline-start, 0px) + env(safe-area-inset-left, 0px));
}

[data-ezra-physical-safe-content-inset][data-ezra-physical-safe-content-inset] {
  box-sizing: border-box;
  padding-block-start: var(--ezra-safe-content-padding-block-start, 0px);
  padding-inline-end: var(--ezra-safe-content-padding-inline-end, 0px);
  padding-block-end: var(--ezra-safe-content-padding-block-end, 0px);
  padding-inline-start: var(--ezra-safe-content-padding-inline-start, 0px);
}

[data-ezra-contained-scroll-region] {
  height: 100vh;
  height: 100dvh;
  max-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

[data-ezra-scroll-mode="document"] [data-ezra-contained-scroll-region] {
  height: auto;
  max-height: none;
  overflow: visible;
}

[data-ezra-overlay-scroll-lock] {
  position: fixed;
  inset-inline: 0;
  width: 100%;
  overflow: hidden;
  touch-action: none;
}

[data-ezra-modal-overlay] {
  position: fixed;
  inset: 0;
  z-index: var(--ezra-modal-overlay-z-index, 2147483000);
  width: 100dvw;
  height: 100dvh;
  max-width: 100%;
  max-height: 100%;
  box-sizing: border-box;
  overflow: hidden;
  overscroll-behavior: none;
  touch-action: none;
  background: var(--ezra-modal-overlay-background, var(--ezra-surface-background, var(--background-color, Canvas)));
}

[data-ezra-modal-overlay][hidden] {
  display: none !important;
}

[data-ezra-modal-overlay-content] {
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  box-sizing: border-box;
  overflow: hidden;
  padding-block-start: calc(var(--ezra-modal-overlay-safe-padding-block-start, 0px) + env(safe-area-inset-top, 0px));
  padding-inline-end: calc(var(--ezra-modal-overlay-safe-padding-inline-end, 0px) + env(safe-area-inset-right, 0px));
  padding-block-end: calc(var(--ezra-modal-overlay-safe-padding-block-end, 0px) + env(safe-area-inset-bottom, 0px));
  padding-inline-start: calc(var(--ezra-modal-overlay-safe-padding-inline-start, 0px) + env(safe-area-inset-left, 0px));
}

[data-ezra-surface-frame] {
  --ezra-surface-frame-content-inline-size: 100%;
  --ezra-surface-frame-content-min-measure: 0px;
  --ezra-surface-frame-content-ideal-measure: 100%;
  --ezra-surface-frame-content-max-measure: 100%;
  --ezra-surface-frame-inset-inline-start: 0px;
  --ezra-surface-frame-inset-inline-end: 0px;
  --ezra-surface-frame-inset-block-start: 0px;
  --ezra-surface-frame-inset-block-end: 0px;
  --ezra-surface-frame-region-gap: 0px;
  --ezra-surface-frame-content-inline-alignment: stretch;
  --ezra-surface-frame-content-block-alignment: stretch;
  --ezra-surface-frame-text-align: start;
}

[data-ezra-surface-frame-region] {
  min-width: 0;
  box-sizing: border-box;
}

[data-ezra-surface-frame-block-mode="document-scroll"] {
  height: auto;
  min-height: 100%;
  overflow: visible;
}

[data-ezra-surface-frame-block-mode="internal-scroll"] [data-ezra-surface-frame-region="body"] {
  max-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}


[data-ezra-mirrored-post-content],
[data-ezra-mirrored-post-quote] {
  min-width: 0;
  overflow-wrap: anywhere;
}

[data-ezra-mirrored-post-text] {
  display: block;
}

[data-ezra-mirrored-post-text] > p {
  margin-block: 0;
}

[data-ezra-mirrored-post-text] > p + p,
[data-ezra-mirrored-post-quote] > * + * {
  margin-top: var(--ezra-mirrored-post-block-gap, 0.75rem);
}

:where([data-ezra-mirrored-post-content], [data-ezra-mirrored-post-quote]) :where(div, p, span):has(> time) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  row-gap: var(--ezra-mirrored-post-metadata-row-gap, 0.125rem) !important;
  min-width: 0;
}

:where([data-ezra-mirrored-post-content], [data-ezra-mirrored-post-quote]) :where(div, p, span):has(> time) > time {
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}

[data-ezra-mirrored-post-link-preview] {
  display: block;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  overflow-wrap: anywhere;
}

[data-ezra-mirrored-post-link-preview] > *,
[data-ezra-mirrored-post-link-preview] span > * {
  display: block;
}

[data-ezra-mirrored-post-link-preview] img,
[data-ezra-mirrored-post-content] img,
[data-ezra-mirrored-post-content] video {
  max-width: 100%;
  height: auto;
}

[data-ezra-mirrored-post-surface-preview] {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  overflow-wrap: anywhere;
  word-break: break-word;
}

[data-ezra-mirrored-post-surface-preview] > * {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

[data-ezra-mirrored-post-surface-preview-text],
[data-ezra-mirrored-post-surface-preview-quote],
[data-ezra-mirrored-post-surface-preview-link-context] {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

[data-ezra-mirrored-post-surface-preview-media] {
  display: block;
  max-width: 100%;
  min-width: 0;
  height: auto;
  box-sizing: border-box;
}

[data-ezra-mirrored-post-quote] [data-ezra-mirrored-post-source-link] {
  display: inline-flex;
  width: fit-content;
}

[data-ezra-mirrored-post-engagement-labels] {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ezra-mirrored-post-engagement-label-gap, 0.5rem);
  min-block-size: var(--ezra-mirrored-post-engagement-label-row-min-block-size, 1rem);
  line-height: var(--ezra-mirrored-post-engagement-label-line-height, 1rem);
}

[data-ezra-mirrored-post-full-view] [data-ezra-mirrored-post-engagement-labels] {
  margin-block-start: var(--ezra-mirrored-post-engagement-label-row-margin-block-start, var(--ezra-mirrored-post-block-gap, 0.75rem));
  margin-block-end: var(--ezra-mirrored-post-engagement-label-row-margin-block-end, var(--ezra-mirrored-post-permalink-block-padding, 0.75rem));
}

[data-ezra-mirrored-post-engagement-label] {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  line-height: inherit;
  overflow-wrap: anywhere;
}

[data-ezra-surface-document] {
  min-width: 0;
}

[data-ezra-surface-shell] {
  min-height: 100%;
  display: flex;
  flex-direction: column;
}

:where(html, body)[data-ezra-surface-visual-pending] [data-ezra-surface-shell] {
  visibility: hidden;
}

[data-ezra-surface-main] {
  width: 100%;
  min-width: 0;
  flex: 1 0 auto;
}

.ezra-surface-skip-link {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 2147483647;
  transform: translateY(calc(-100% - 16px));
  border: 2px solid currentColor;
  border-radius: 4px;
  background: var(--ezra-surface-skip-link-background, Canvas);
  color: var(--ezra-surface-skip-link-text, CanvasText);
  padding: 8px 10px;
  font: 700 0.875rem/1.2 system-ui, sans-serif;
  text-decoration: none;
}

.ezra-surface-skip-link:focus,
.ezra-surface-skip-link:focus-visible {
  transform: translateY(0);
  outline: none;
}


[data-ezra-document-surface][data-ezra-site-content-layout] {
  width: 100%;
  min-width: 0;
  min-height: 100%;
}

[data-ezra-viewport-frame][data-ezra-site-content-layout] {
  width: 100dvw;
  height: 100dvh;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

[data-ezra-surface-plane][data-ezra-site-content-layout-role="surface"] {
  width: min(
    100%,
    var(
      --ezra-site-content-layout-measure,
      var(--ezra-surface-frame-content-max-measure, 100%)
    )
  );
  max-width: 100%;
  min-height: 100%;
  margin-inline: auto;
  display: grid;
  grid-template-rows: auto minmax(0, auto) auto;
  gap: var(--ezra-site-content-layout-gap, 2rem);
}

[data-ezra-contained-scroll-region][data-ezra-site-content-layout-role="body"] {
  min-height: 0;
}

[data-ezra-site-content-layout-role="header"] {
  display: grid;
  gap: var(--ezra-site-content-layout-header-gap, 1rem);
  margin-block: var(--ezra-site-content-layout-header-margin, 3rem 2rem);
}

[data-ezra-site-content-layout-role="title"],
[data-ezra-site-content-layout-role="subtitle"],
[data-ezra-site-content-layout-role="metadata"],
[data-ezra-site-content-layout-role="body"],
[data-ezra-site-content-layout-role="actions"],
[data-ezra-site-content-layout-role="footer"] {
  min-width: 0;
}

[data-ezra-site-content-layout-role="body"] {
  overflow-wrap: break-word;
}

[data-ezra-site-content-layout-role="media"] {
  width: 100%;
}

[data-ezra-site-content-layout-role="actions"]:empty,
[data-ezra-site-content-layout-role="footer"]:empty {
  display: none;
}

[data-ezra-site-layout] {
  min-width: 0;
}

[data-ezra-site-layout-region] {
  min-width: 0;
}

body {
  background: var(--ezra-site-paper, #f8f5ef);
  color: var(--ezra-site-ink, #161412);
  font-family: var(--ezra-site-body-font, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
  line-height: 1.4;
  min-height: 100%;
}

a {
  color: inherit;
}

.ezra-site-viewport-frame {
  width: 100dvw;
  height: 100dvh;
  min-width: 0;
  min-height: 0;
  padding: 0;
  overflow: hidden;
}

.ezra-site-document-surface {
  width: 100%;
  min-width: 0;
  min-height: 100%;
  padding: 0;
}

.ezra-site-surface-plane {
  width: 100%;
  min-height: 100%;
}

.ezra-site-page-body {
  width: 100%;
  min-height: 0;
}



*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  background: var(--ezra-site-footer-surface, var(--footer-color, var(--ezra-ui-theme-footer, var(--ezra-site-paper, #f8f5ef))));
}

html,
body {
  margin: 0;
}

[data-ezra-surface-shell] {
  background: var(--ezra-site-paper, #f8f5ef);
}

[data-ezra-document-surface] > [data-ezra-surface-plane][data-ezra-site-content-layout-role="surface"] {
  grid-template-rows: minmax(100%, auto);
  gap: 0;
}

.ezra-site-page-body {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
}

.site-header {
  display: flex;
  width: min(100%, 72rem);
  margin-inline: auto;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding: 1.25rem 2rem;
}

.site-identity {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 1rem;
  color: inherit;
}

.site-identity-logo {
  width: clamp(4.5rem, 8vw, 6.5rem);
  max-height: 5.25rem;
  flex: 0 0 auto;
  object-fit: contain;
}

.site-identity-copy {
  display: grid;
  min-width: 0;
  justify-items: center;
  line-height: 1.05;
}

.site-identity-title {
  color: var(--ezra-ui-theme-heading-primary, currentColor);
  font-family: var(--ezra-ui-font-heading-family, inherit);
  font-size: clamp(1.25rem, 2.3vw, 2rem);
  font-weight: var(--ezra-ui-font-heading-weight, 700);
}

.site-identity-subtitle {
  margin-top: 0.3rem;
  color: var(--ezra-ui-theme-heading-secondary, currentColor);
  font-size: clamp(0.72rem, 1.35vw, 1rem);
  letter-spacing: 0.04em;
}

.desktop-navigation {
  display: flex;
  align-items: center;
  gap: clamp(1rem, 2.5vw, 2rem);
}

.desktop-navigation a,
.site-navigation-overlay-links a {
  font-weight: var(--ezra-ui-font-control-weight, 600);
  text-decoration: none;
}

.site-main {
  position: relative;
  width: 100%;
  flex: 1 0 auto;
}

.site-page-background {
  width: 100%;
  min-height: 100%;
  padding: clamp(2.5rem, 7vw, 6rem) 2rem;
}

.site-content-overlay {
  width: min(100%, 72rem);
  min-height: clamp(20rem, 48vh, 34rem);
  margin-inline: auto;
  padding: clamp(1.5rem, 5vw, 4.5rem);
}

.site-content {
  width: min(100%, 65ch);
  margin-inline: auto;
}

.site-content > :first-child {
  margin-top: 0;
}

.site-footer {
  width: 100%;
}

.site-footer-inner {
  display: flex;
  width: min(100%, 72rem);
  margin-inline: auto;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem 2rem;
  padding: 1.5rem 2rem;
}

.site-footer p {
  margin: 0;
}

.site-footer-navigation {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.site-footer-navigation-separator {
  opacity: 0.7;
}

@media (max-width: 47.9375rem) {
  .site-header {
    gap: 0.75rem;
    padding: 1rem;
  }

  .site-identity {
    gap: 0.65rem;
  }

  .site-identity-logo {
    width: clamp(3.5rem, 17vw, 4.75rem);
  }

  .site-page-background {
    padding: 1.5rem 1rem 3rem;
  }

  .site-content-overlay {
    min-height: 18rem;
    padding: 1.5rem 1.25rem;
  }

  .site-footer-inner {
    flex-direction: column;
    align-items: flex-start;
    padding: 1.5rem 1rem;
  }
}


@font-face {
  font-family: "Source Sans 3";
  src: url("/ui-assets/fonts/source-sans-3/SourceSans3VF-Upright.ttf.woff2") format("woff2");
  font-weight: 200 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Source Sans 3";
  src: url("/ui-assets/fonts/source-sans-3/SourceSans3VF-Italic.ttf.woff2") format("woff2");
  font-weight: 200 900;
  font-style: italic;
  font-display: swap;
}

:root {
  --ezra-ui-typography-base-size: 1.125rem;
  --ezra-ui-typography-scale-ratio: 1.25;
  --ezra-ui-font-source-sans-3-family: "Source Sans 3", Aptos, "Trebuchet MS", "Gill Sans", system-ui, sans-serif;
  --ezra-ui-font-system-mono-family: ui-monospace, "SFMono-Regular", Menlo, Monaco, Consolas, monospace;
  --ezra-ui-font-body: var(--ezra-ui-font-source-sans-3-family);
  --ezra-ui-font-body-size: 1.125rem;
  --ezra-ui-font-body-weight: 400;
  --ezra-ui-font-body-line-height: 1.6;
  --ezra-ui-font-body-letter-spacing: normal;
  --ezra-ui-font-body-style: normal;
  --ezra-ui-font-body-transform: none;
  --ezra-ui-font-heading: var(--ezra-ui-font-source-sans-3-family);
  --ezra-ui-font-heading-size: clamp(2.25rem, 5vw, 4rem);
  --ezra-ui-font-heading-weight: 700;
  --ezra-ui-font-heading-line-height: 1.08;
  --ezra-ui-font-heading-letter-spacing: -0.02em;
  --ezra-ui-font-heading-style: normal;
  --ezra-ui-font-heading-transform: none;
  --ezra-ui-font-display: var(--ezra-ui-font-source-sans-3-family);
  --ezra-ui-font-display-size: clamp(2.5rem, 6vw, 5rem);
  --ezra-ui-font-display-weight: 700;
  --ezra-ui-font-display-line-height: 1;
  --ezra-ui-font-display-letter-spacing: -0.025em;
  --ezra-ui-font-display-style: normal;
  --ezra-ui-font-display-transform: none;
  --ezra-ui-font-metadata: var(--ezra-ui-font-source-sans-3-family);
  --ezra-ui-font-metadata-size: 0.875rem;
  --ezra-ui-font-metadata-weight: 400;
  --ezra-ui-font-metadata-line-height: 1.4;
  --ezra-ui-font-metadata-letter-spacing: 0.01em;
  --ezra-ui-font-metadata-style: normal;
  --ezra-ui-font-metadata-transform: none;
  --ezra-ui-font-control: var(--ezra-ui-font-source-sans-3-family);
  --ezra-ui-font-control-size: 1rem;
  --ezra-ui-font-control-weight: 600;
  --ezra-ui-font-control-line-height: 1.2;
  --ezra-ui-font-control-letter-spacing: 0.02em;
  --ezra-ui-font-control-style: normal;
  --ezra-ui-font-control-transform: none;
  --ezra-ui-font-code: var(--ezra-ui-font-system-mono-family);
  --ezra-ui-font-code-size: 0.95rem;
  --ezra-ui-font-code-weight: 400;
  --ezra-ui-font-code-line-height: 1.5;
  --ezra-ui-font-code-letter-spacing: normal;
  --ezra-ui-font-code-style: normal;
  --ezra-ui-font-code-transform: none;
  --ezra-ui-font-numeric: var(--ezra-ui-font-source-sans-3-family);
  --ezra-ui-font-numeric-size: 1rem;
  --ezra-ui-font-numeric-weight: 600;
  --ezra-ui-font-numeric-line-height: 1.2;
  --ezra-ui-font-numeric-letter-spacing: normal;
  --ezra-ui-font-numeric-style: normal;
  --ezra-ui-font-numeric-transform: none;
  --ezra-ui-font-brand: var(--ezra-ui-font-source-sans-3-family);
  --ezra-ui-font-brand-size: clamp(1.5rem, 3vw, 2.25rem);
  --ezra-ui-font-brand-weight: 700;
  --ezra-ui-font-brand-line-height: 1.05;
  --ezra-ui-font-brand-letter-spacing: -0.015em;
  --ezra-ui-font-brand-style: normal;
  --ezra-ui-font-brand-transform: none;
  --ezra-ui-font-subtitle: var(--ezra-ui-font-source-sans-3-family);
  --ezra-ui-font-subtitle-size: clamp(1rem, 2vw, 1.25rem);
  --ezra-ui-font-subtitle-weight: 400;
  --ezra-ui-font-subtitle-line-height: 1.35;
  --ezra-ui-font-subtitle-letter-spacing: normal;
  --ezra-ui-font-subtitle-style: normal;
  --ezra-ui-font-subtitle-transform: none;
  --ezra-ui-font-strong: var(--ezra-ui-font-source-sans-3-family);
  --ezra-ui-font-strong-size: 1em;
  --ezra-ui-font-strong-weight: 600;
  --ezra-ui-font-strong-line-height: 1.6;
  --ezra-ui-font-strong-letter-spacing: normal;
  --ezra-ui-font-strong-style: normal;
  --ezra-ui-font-strong-transform: none;
  --body-font: var(--ezra-ui-font-body);
  --title-font: var(--ezra-ui-font-heading);
  --header-font: var(--ezra-ui-font-heading);
  --control-font: var(--ezra-ui-font-control);
  --metadata-font: var(--ezra-ui-font-metadata);
  --code-font: var(--ezra-ui-font-code);
  --numeric-font: var(--ezra-ui-font-numeric);
  --brand-font: var(--ezra-ui-font-brand);
  --ezra-site-body-font: var(--ezra-ui-font-body);
}

body { font-family: var(--ezra-ui-font-body); font-size: var(--ezra-ui-font-body-size); font-weight: var(--ezra-ui-font-body-weight); line-height: var(--ezra-ui-font-body-line-height); letter-spacing: var(--ezra-ui-font-body-letter-spacing); }

h1, h2, h3, h4, h5, h6 { font-family: var(--ezra-ui-font-heading); font-size: var(--ezra-ui-font-heading-size); font-weight: var(--ezra-ui-font-heading-weight); line-height: var(--ezra-ui-font-heading-line-height); letter-spacing: var(--ezra-ui-font-heading-letter-spacing); text-transform: var(--ezra-ui-font-heading-transform); }

.site-name, [data-brand] { font-family: var(--ezra-ui-font-brand); font-size: var(--ezra-ui-font-brand-size); font-weight: var(--ezra-ui-font-brand-weight); line-height: var(--ezra-ui-font-brand-line-height); letter-spacing: var(--ezra-ui-font-brand-letter-spacing); text-transform: var(--ezra-ui-font-brand-transform); }

.site-subtitle, .subtitle { font-family: var(--ezra-ui-font-subtitle, var(--ezra-ui-font-body)); font-size: var(--ezra-ui-font-subtitle-size, inherit); font-weight: var(--ezra-ui-font-subtitle-weight, inherit); line-height: var(--ezra-ui-font-subtitle-line-height, inherit); }

nav, button, input, select, textarea { font-family: var(--ezra-ui-font-control); font-weight: var(--ezra-ui-font-control-weight); letter-spacing: var(--ezra-ui-font-control-letter-spacing); text-transform: var(--ezra-ui-font-control-transform); }

.site-footer, small, [data-metadata] { font-family: var(--ezra-ui-font-metadata); font-size: var(--ezra-ui-font-metadata-size); font-weight: var(--ezra-ui-font-metadata-weight); line-height: var(--ezra-ui-font-metadata-line-height); }

strong, b { font-family: var(--ezra-ui-font-strong, var(--ezra-ui-font-body)); font-weight: var(--ezra-ui-font-strong-weight, 700); }

code, pre, kbd, samp { font-family: var(--ezra-ui-font-code); font-size: var(--ezra-ui-font-code-size); font-weight: var(--ezra-ui-font-code-weight); line-height: var(--ezra-ui-font-code-line-height); }

.ezra-ui-responsive-media-embed {
  position: relative;
  clear: both;
  width: 100%;
  max-width: var(--ezra-ui-media-embed-max-width, 100%);
  margin-block: var(--ezra-ui-media-embed-margin-block, var(--content-block-spacing, 2rem));
  overflow: hidden;
}

.ezra-ui-responsive-media-embed[data-ezra-ui-media-embed-kind="video"] {
  aspect-ratio: var(--ezra-ui-media-embed-aspect-ratio, 16 / 9);
}

.ezra-ui-responsive-media-embed > iframe,
.ezra-ui-responsive-media-embed > video {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.ezra-ui-responsive-media-embed > audio {
  display: block;
  width: 100%;
}


.ezra-site-basic-image-layout::after {
  content: "";
  display: block;
  clear: both;
}

.ezra-site-basic-image-layout__figure {
  float: right;
  clear: right;
  inline-size: min(42%, 24rem);
  margin: 0.35rem 0 1.5rem clamp(1rem, 4vw, 2.5rem);
}

.ezra-site-basic-image-layout__image {
  display: block;
  inline-size: 100%;
  block-size: auto;
}

.ezra-site-basic-image-layout__figure.is-wide {
  float: none;
  clear: both;
  inline-size: 100%;
  margin: 1.5rem 0;
}

.ezra-site-basic-image-layout__bottom-flow::after {
  content: "";
  display: block;
  clear: both;
}

@media (max-width: 47.999rem) {
  .ezra-site-basic-image-layout__figure {
    float: none;
    clear: both;
    inline-size: 100%;
    margin: 1.5rem 0;
  }

  .ezra-site-basic-image-layout__bottom-flow {
    display: flex;
    flex-direction: column;
  }

  .ezra-site-basic-image-layout__bottom-content {
    order: 1;
  }

  .ezra-site-basic-image-layout__bottom-flow > .ezra-site-basic-image-layout__figure {
    order: 2;
  }
}


.ezra-site-header-menu-button {
  appearance: none;
  display: inline-grid;
  place-items: center;
  width: var(--ezra-site-header-menu-button-size, 2.5rem);
  height: var(--ezra-site-header-menu-button-size, 2.5rem);
  min-width: var(--ezra-site-header-menu-button-size, 2.5rem);
  min-height: var(--ezra-site-header-menu-button-size, 2.5rem);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ezra-site-header-menu-button-color, currentColor);
  font: inherit;
  line-height: 1;
  cursor: pointer;
}

.ezra-site-header-menu-button:hover,
.ezra-site-header-menu-button:active {
  background: transparent;
  color: var(--ezra-site-header-menu-button-hover-color, currentColor);
}

.ezra-site-header-menu-button:focus-visible {
  outline: 0;
}

.ezra-site-header-menu-button-icon,
.ezra-site-header-menu-button-icon svg {
  display: block;
  width: var(--ezra-site-header-menu-icon-size, 16px);
  height: var(--ezra-site-header-menu-icon-size, 16px);
  color: currentColor;
}

.ezra-site-header-menu-button-icon svg {
  overflow: visible;
}

.site-navigation-menu-toggle,
.site-navigation-overlay {
  display: none;
}

@media (max-width: 767px) {
  .desktop-navigation {
    display: none;
  }

  .site-navigation-menu-toggle {
    display: inline-grid;
  }

  #site-navigation-overlay {
    position: fixed;
    inset: 0;
    z-index: var(--ezra-site-navigation-overlay-z-index, 1000);
    overflow-y: auto;
    background: var(--ezra-site-navigation-overlay-background, var(--ezra-site-paper, #f8f5ef));
    color: var(--ezra-site-navigation-overlay-color, var(--ezra-site-ink, #161412));
  }

  body.ezra-site-navigation-overlay-open #site-navigation-overlay {
    display: block;
  }

  .site-navigation-overlay-content {
    box-sizing: border-box;
    display: flex;
    min-height: 100%;
    width: min(100%, var(--ezra-site-shell-max-width, 72rem));
    margin-inline: auto;
    padding: var(--ezra-site-navigation-overlay-padding, 2rem 1rem 3rem);
    flex-direction: column;
    align-items: flex-end;
  }

  .site-navigation-overlay-close {
    flex: 0 0 auto;
  }

  .site-navigation-overlay-links {
    display: flex;
    width: 100%;
    margin-top: var(--ezra-site-navigation-overlay-link-offset, 3rem);
    flex-direction: column;
    align-items: stretch;
    gap: var(--ezra-site-navigation-overlay-link-gap, 1.5rem);
  }

  .site-navigation-overlay-links a {
    display: block;
    width: 100%;
    text-align: right;
  }
}

/* @ezra-ui-package-design billy-components */
:root {
  --billy-primary: var(--ezra-ui-theme-heading-primary, #002B65);
  --billy-secondary: var(--ezra-ui-theme-accent-strong, #B21519);
  --billy-accent: var(--ezra-ui-theme-accent, #F4E3A1);
  --billy-paper: var(--ezra-ui-theme-background, #FFFAF0);
  --billy-ink: var(--ezra-ui-theme-text, #002B65);
  --ezra-site-paper: var(--billy-paper);
  --ezra-site-ink: var(--billy-ink);
  --ezra-site-header-menu-button-color: var(--billy-primary);
  --ezra-site-header-menu-button-hover-color: var(--billy-secondary);
  --ezra-site-navigation-overlay-background: var(--billy-paper);
  --ezra-site-navigation-overlay-color: var(--billy-ink);
}

.site-identity,
.site-name {
  border: 0;
  background: transparent;
  box-shadow: none;
  text-decoration: none;
}

.site-identity-logo,
.site-logo {
  display: block;
  inline-size: clamp(4rem, 7vw, 6rem);
  block-size: auto;
}

.site-identity-title,
.site-identity-subtitle {
  display: block;
  text-align: center;
}

.site-main a,
.site-header nav a {
  color: var(--billy-primary);
}

.site-main a:hover,
.site-main a:active,
.site-header nav a:hover,
.site-header nav a:active,
.site-header nav a[aria-current="page"] {
  color: var(--billy-secondary);
}

:where(a, button, summary, input, textarea, select):focus-visible {
  outline: 0.1875rem solid var(--billy-accent);
  outline-offset: 0.1875rem;
  box-shadow: 0 0 0 0.125rem var(--billy-primary);
}

.ezra-site-basic-image-layout__image {
  block-size: auto;
  object-fit: initial;
  border: 0;
  border-radius: 0.5rem;
  box-shadow: none;
}

.site-page-background,
[data-ezra-site-page-background] {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.site-content-overlay,
[data-ezra-site-content-overlay] {
  background: rgb(255 250 240 / var(--billy-content-overlay-opacity, 0.88));
}

.site-footer {
  background: var(--billy-primary);
  color: var(--billy-paper);
}

.site-footer a {
  color: inherit;
  text-decoration-color: transparent;
}

.site-footer a:hover,
.site-footer a:active,
.site-footer a[aria-current="page"] {
  color: inherit;
  text-decoration-color: var(--billy-secondary);
}

.ezra-ui-responsive-media-embed,
.ezra-ui-responsive-media-embed > iframe,
.ezra-ui-responsive-media-embed > video,
.ezra-ui-responsive-media-embed > audio {
  border: 0;
  border-radius: 0;
  box-shadow: none;
}


/* Billy app surfaces use the complete Billy theme through canonical Ezra UI primitives; no project-local app behavior or component-layout overrides. */



.ezra-ui-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 2px 10px;
  border: 1px solid var(--badge-color);
  border-radius: var(--ezra-ui-badge-radius, 999px);
  font-family: var(--header-font);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.78rem;
  line-height: 1;
}
.ezra-ui-badge--published {
  color: var(--badge-published-color);
  border-color: var(--badge-published-border);
  background: var(--badge-published-bg);
}
.ezra-ui-badge--draft {
  color: var(--h1-color, var(--text-color));
  border-color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-border));
  background: color-mix(in srgb, var(--ezra-app-surface-important-button-accent, var(--badge-draft-border)) 10%, transparent);
}
.ezra-ui-badge--ready {
  color: var(--badge-ready-color);
  border-color: var(--badge-ready-border);
  background: var(--badge-ready-bg);
}
.ezra-ui-badge--new {
  color: var(--ezra-app-surface-important-button-text, var(--h1-color, var(--text-color)));
  border-color: var(--ezra-app-surface-important-button-border, var(--ezra-app-surface-important-button-accent, var(--badge-draft-border)));
  background: var(--ezra-app-surface-important-button-background, color-mix(in srgb, var(--ezra-app-surface-important-button-accent, var(--badge-draft-border, var(--input-highlight-color))) 16%, transparent));
}
.ezra-ui-badge--edited {
  color: var(--ezra-app-surface-important-button-accent, var(--badge-featured-color));
  border-color: var(--ezra-app-surface-important-button-accent, var(--badge-featured-border));
  background: color-mix(in srgb, var(--ezra-app-surface-important-button-accent, var(--badge-featured-border)) 10%, transparent);
}
.ezra-ui-badge--updated {
  color: var(--ezra-app-surface-important-button-accent, var(--badge-featured-color));
  border-color: var(--ezra-app-surface-important-button-accent, var(--badge-featured-border));
  background: color-mix(in srgb, var(--ezra-app-surface-important-button-accent, var(--badge-featured-border)) 10%, transparent);
}
.ezra-ui-badge--delete {
  color: var(--badge-delete-color);
  border-color: var(--badge-delete-border);
  background: var(--badge-delete-bg);
}
.ezra-ui-badge--featured {
  color: var(--badge-featured-color);
  border-color: var(--badge-featured-border);
  background: var(--badge-featured-bg);
}
.ezra-ui-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ezra-ui-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 4px 12px;
  border: 1px solid var(--chip-border);
  border-radius: var(--ezra-ui-chip-radius, 999px);
  background: var(--chip-bg);
  color: var(--chip-color);
  font-family: var(--header-font);
  font-weight: 700;
  font-size: 0.95rem;
  min-width: 0;
  max-width: 100%;
  cursor: grab;
  touch-action: none;
  user-select: none;
}
.ezra-ui-chip-label {
  min-width: 0;
  overflow-wrap: anywhere;
}
.ezra-ui-chip button {
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
  line-height: 1;
  flex-shrink: 0;
}
.ezra-ui-widget-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.75rem;
  padding: 0.15rem 0.6rem;
  border-radius: var(--ezra-ui-widget-badge-radius, 999px);
  border: 1px solid var(--panel-border-strong);
  background: var(--ezra-ui-widget-summary-bg, var(--surface-quiet));
  color: var(--badge-color);
  font-family: var(--header-font);
  font-size: 0.78rem;
  line-height: 1;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.ezra-ui-widget-badge.is-neutral {
  color: var(--badge-color);
}
.ezra-ui-widget-badge.is-published,
.ezra-ui-widget-badge.is-success {
  color: var(--badge-published-color);
  border-color: var(--badge-published-border);
  background: var(--badge-published-bg);
}
.ezra-ui-widget-badge.is-draft {
  color: var(--badge-draft-color);
  border-color: var(--badge-draft-border);
  background: var(--badge-draft-bg);
}
.ezra-ui-widget-badge.is-featured {
  color: var(--badge-featured-color);
  border-color: var(--badge-featured-border);
  background: var(--badge-featured-bg);
}
.ezra-ui-widget-badge.is-error {
  color: var(--badge-draft-color);
  border-color: var(--message-error-border);
  background: var(--message-error-bg);
}
.ezra-mode-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  flex: 0 0 auto;
  height: var(--ezra-ui-app-header-badge-height, 2rem);
  min-height: var(--ezra-ui-app-header-badge-height, 2rem);
  margin: 0;
  padding: 0 var(--ezra-ui-app-header-badge-padding-inline, 10px);
  border: 1px solid color-mix(in srgb, var(--text-color) 22%, transparent);
  background: color-mix(in srgb, var(--panel-color) 82%, var(--background-color) 18%);
  border-radius: var(--ezra-mode-badge-radius, 999px);
  box-sizing: border-box;
  font-family: var(--header-font);
  font-size: var(--ezra-ui-app-header-badge-font-size, 0.78rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.ezra-mode-badge.is-dev {
  color: var(--ezra-ui-app-header-badge-accent, var(--label-color));
  border-color: color-mix(in srgb, var(--ezra-ui-app-header-badge-accent, var(--label-color)) 40%, transparent);
  background: color-mix(in srgb, var(--ezra-ui-app-header-badge-accent, var(--label-color)) 10%, transparent);
}
.ezra-mode-badge.is-live {
  color: color-mix(in srgb, var(--text-color) 68%, transparent);
  border-color: color-mix(in srgb, var(--text-color) 10%, transparent);
  background: color-mix(in srgb, var(--text-color) 3%, transparent);
}
.ezra-mode-badge.is-hidden {
  visibility: hidden;
}
@media (max-width: 640px) {
  .ezra-ui-chip {
    max-width: 100%;
    overflow-wrap: anywhere;
    min-height: 32px;
    padding: 4px 10px;
    font-size: 0.9rem;
  }
}
@media (max-width: 860px) {
  .ezra-mode-badge {
    height: var(--ezra-ui-app-header-badge-height, 2rem);
    min-height: var(--ezra-ui-app-header-badge-height, 2rem);
    padding: 0 var(--ezra-ui-app-header-badge-padding-inline, 10px);
    font-size: var(--ezra-ui-app-header-badge-font-size, 0.78rem);
    letter-spacing: 0.05em;
  }
}

[data-ezra-surface-frame] {
  --ezra-surface-frame-content-inline-size: 100%;
  --ezra-surface-frame-content-min-measure: 0px;
  --ezra-surface-frame-content-ideal-measure: 100%;
  --ezra-surface-frame-content-max-measure: 100%;
  --ezra-surface-frame-inset-inline-start: 0px;
  --ezra-surface-frame-inset-inline-end: 0px;
  --ezra-surface-frame-inset-block-start: 0px;
  --ezra-surface-frame-inset-block-end: 0px;
  --ezra-surface-frame-region-gap: 0px;
  --ezra-surface-frame-content-inline-alignment: stretch;
  --ezra-surface-frame-content-block-alignment: stretch;
  --ezra-surface-frame-text-align: start;
}

[data-ezra-surface-frame-region] {
  min-width: 0;
  box-sizing: border-box;
}

[data-ezra-surface-frame-block-mode="document-scroll"] {
  height: auto;
  min-height: 100%;
  overflow: visible;
}

[data-ezra-surface-frame-block-mode="internal-scroll"] [data-ezra-surface-frame-region="body"] {
  max-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
[data-ezra-surface-frame="app-canvas"] {
  --ezra-surface-frame-content-inline-size: var(--ezra-surface-shape-app-canvas-frame-content-inline-size, var(--ezra-surface-shape-frame-content-inline-size, 100%));
  --ezra-surface-frame-content-min-measure: var(--ezra-surface-shape-app-canvas-frame-content-min-measure, var(--ezra-surface-shape-frame-content-min-measure, 0px));
  --ezra-surface-frame-content-ideal-measure: var(--ezra-surface-shape-app-canvas-frame-content-ideal-measure, var(--ezra-surface-shape-frame-content-ideal-measure, 100%));
  --ezra-surface-frame-content-max-measure: var(--ezra-surface-shape-app-canvas-frame-content-max-measure, var(--ezra-surface-shape-frame-content-max-measure, none));
  --ezra-surface-frame-inset-inline-start: var(--ezra-surface-shape-app-canvas-frame-inset-inline-start, var(--ezra-surface-shape-frame-inset-inline-start, clamp(14px, 2.6vw, 32px)));
  --ezra-surface-frame-inset-inline-end: var(--ezra-surface-shape-app-canvas-frame-inset-inline-end, var(--ezra-surface-shape-frame-inset-inline-end, clamp(14px, 2.6vw, 32px)));
  --ezra-surface-frame-inset-block-start: var(--ezra-surface-shape-app-canvas-frame-inset-block-start, var(--ezra-surface-shape-frame-inset-block-start, clamp(20px, 3vw, 40px)));
  --ezra-surface-frame-inset-block-end: var(--ezra-surface-shape-app-canvas-frame-inset-block-end, var(--ezra-surface-shape-frame-inset-block-end, clamp(32px, 4.2vw, 56px)));
  --ezra-surface-frame-region-gap: var(--ezra-surface-shape-app-canvas-frame-region-gap, var(--ezra-surface-shape-frame-region-gap, 12px));
  --ezra-surface-frame-content-inline-alignment: var(--ezra-surface-shape-app-canvas-frame-content-inline-alignment, var(--ezra-surface-shape-frame-content-inline-alignment, stretch));
  --ezra-surface-frame-content-block-alignment: var(--ezra-surface-shape-app-canvas-frame-content-block-alignment, var(--ezra-surface-shape-frame-content-block-alignment, start));
  --ezra-surface-frame-text-align: var(--ezra-surface-shape-app-canvas-frame-text-align, var(--ezra-surface-shape-frame-text-align, start));
}

@media (max-width: 860px) {
  [data-ezra-surface-frame="app-canvas"] {
    --ezra-surface-frame-content-inline-size: var(--ezra-surface-shape-app-canvas-frame-content-inline-size, var(--ezra-surface-shape-frame-content-inline-size, 100%));
    --ezra-surface-frame-content-min-measure: var(--ezra-surface-shape-app-canvas-frame-content-min-measure, var(--ezra-surface-shape-frame-content-min-measure, 0px));
    --ezra-surface-frame-content-ideal-measure: var(--ezra-surface-shape-app-canvas-frame-content-ideal-measure, var(--ezra-surface-shape-frame-content-ideal-measure, 100%));
    --ezra-surface-frame-content-max-measure: var(--ezra-surface-shape-app-canvas-frame-content-max-measure, var(--ezra-surface-shape-frame-content-max-measure, none));
    --ezra-surface-frame-inset-inline-start: var(--ezra-surface-shape-app-canvas-frame-inset-inline-start, var(--ezra-surface-shape-frame-inset-inline-start, 12px));
    --ezra-surface-frame-inset-inline-end: var(--ezra-surface-shape-app-canvas-frame-inset-inline-end, var(--ezra-surface-shape-frame-inset-inline-end, 12px));
    --ezra-surface-frame-inset-block-start: var(--ezra-surface-shape-app-canvas-frame-inset-block-start, var(--ezra-surface-shape-frame-inset-block-start, 16px));
    --ezra-surface-frame-inset-block-end: var(--ezra-surface-shape-app-canvas-frame-inset-block-end, var(--ezra-surface-shape-frame-inset-block-end, 88px));
    --ezra-surface-frame-region-gap: var(--ezra-surface-shape-app-canvas-frame-region-gap, var(--ezra-surface-shape-frame-region-gap, 12px));
    --ezra-surface-frame-content-inline-alignment: var(--ezra-surface-shape-app-canvas-frame-content-inline-alignment, var(--ezra-surface-shape-frame-content-inline-alignment, stretch));
    --ezra-surface-frame-content-block-alignment: var(--ezra-surface-shape-app-canvas-frame-content-block-alignment, var(--ezra-surface-shape-frame-content-block-alignment, start));
    --ezra-surface-frame-text-align: var(--ezra-surface-shape-app-canvas-frame-text-align, var(--ezra-surface-shape-frame-text-align, start));
  }
}

.ezra-ui-widget-mode-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: stretch;
  align-self: start;
  justify-content: flex-end;
  justify-self: end;
  grid-column: 2;
  grid-row: 1;
}

.ezra-ui-widget-mode-actions .ezra-ui-widget-action,
.ezra-ui-widget-mode-actions .ezra-ui-button {
  min-height: var(--ezra-ui-widget-action-height, 44px);
  padding-block: var(--ezra-ui-widget-action-padding-block, 8px);
  padding-inline: var(--ezra-ui-widget-action-padding-inline, 12px);
  border-radius: 0;
  line-height: var(--ezra-ui-widget-action-line-height, 1.05);
  white-space: normal;
  overflow-wrap: anywhere;
}

.ezra-ui-widget-mode-corner-controls {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  justify-content: flex-end;
  min-width: 0;
}

.ezra-ui-widget-mode-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap:
    var(--ezra-ui-widget-mode-header-row-gap, 10px)
    var(--ezra-ui-widget-mode-header-column-gap, 12px);
  align-items: start;
  min-width: 0;
}

.ezra-ui-widget-mode-title {
  grid-column: 1;
  grid-row: 1;
  margin: 0;
}

.ezra-ui-widget-mode-eyebrow,
.ezra-ui-widget-mode-body {
  grid-column: 1 / -1;
  margin: 0;
}

.ezra-ui-widget-mode-eyebrow {
  grid-row: 1;
}

.ezra-ui-widget-mode-header:has(.ezra-ui-widget-mode-eyebrow) .ezra-ui-widget-mode-title,
.ezra-ui-widget-mode-header:has(.ezra-ui-widget-mode-eyebrow) .ezra-ui-widget-mode-actions {
  grid-row: 2;
}

.ezra-ui-widget-grid {
  --ezra-ui-widget-grid-gap: 12px;

  display: grid;
  gap: var(--ezra-ui-widget-grid-gap);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}

.ezra-ui-widget {
  box-sizing: border-box;
  display: grid;
  gap: 10px;
  grid-template-rows: auto auto auto;
  align-content: start;
  min-width: 0;
  max-width: 100%;
  min-height: var(--ezra-ui-widget-panel-slot-height, auto);
  padding: var(--ezra-ui-widget-padding, var(--ezra-ui-card-padding, 16px));
  border: 1px solid var(--ezra-ui-widget-shell-border, var(--ezra-ui-control-surface-border, var(--panel-border)));
  border-radius: var(--ezra-ui-widget-radius, 0);
  background: var(--ezra-ui-widget-shell-bg, var(--ezra-ui-control-surface-background, var(--surface-quiet)));
  box-shadow: var(--ezra-ui-widget-shell-shadow, none);
}

.ezra-ui-widget[data-ezra-ui-widget-column-span="2"] {
  grid-column: span 2;
}

.ezra-ui-widget[data-ezra-ui-widget-projected-panel-open="true"] {
  grid-column: 1 / -1;
}

.ezra-ui-widget[data-ezra-ui-widget-row-span="2"] {
  min-height: calc(var(--ezra-ui-widget-panel-slot-height, 0px) + var(--ezra-ui-widget-panel-slot-height, 0px) + var(--ezra-ui-widget-grid-gap));
}

.ezra-ui-widget[data-ezra-ui-widget-layout="full-card"] {
  grid-template-rows: none;
}

.ezra-ui-widget-header,
.ezra-ui-widget-info,
.ezra-ui-widget-controls {
  min-width: 0;
  min-height: 0;
}

.ezra-ui-widget-header {
  display: grid;
  gap: 12px;
  align-content: start;
  min-height: var(--ezra-ui-widget-panel-header-height, auto);
}

.ezra-ui-widget-info {
  display: grid;
  align-content: start;
  min-height: var(--ezra-ui-widget-panel-info-height, auto);
}

.ezra-ui-widget-controls {
  display: grid;
  gap: 8px;
  align-content: end;
  min-height: var(--ezra-ui-widget-panel-controls-height, auto);
}

.ezra-ui-widget-full-card {
  display: grid;
  gap: 10px;
  align-content: start;
  min-width: 0;
}

.ezra-ui-widget-body {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.ezra-ui-widget-heading-row {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 12px;
  min-width: 0;
}

.ezra-ui-widget-corner-controls {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
  margin-inline-start: auto;
}

.ezra-ui-widget-title {
  min-width: 0;
  margin: 0;
  color: var(--ezra-ui-widget-title-color, inherit);
  font-family: var(--header-font);
  font-size: var(--ezra-ui-widget-title-font-size, 1rem);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.ezra-ui-widget-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
  max-width: 100%;
  margin: 0;
}

.ezra-ui-widget-summary-item {
  display: grid;
  gap: 4px;
  min-width: 0;
  max-width: 100%;
  padding:
    var(--ezra-ui-widget-summary-padding-block, 10px)
    var(--ezra-ui-widget-summary-padding-inline, 12px);
  border: 1px solid var(--ezra-ui-widget-summary-border, var(--panel-border));
  background: var(--ezra-ui-widget-summary-bg, var(--surface-quiet));
  border-radius: var(--ezra-ui-widget-summary-radius, var(--ezra-ui-widget-radius, 0));
  box-sizing: border-box;
}

.ezra-ui-widget-summary-item dt,
.ezra-ui-widget-summary-item dd {
  min-width: 0;
  max-width: 100%;
  margin: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.ezra-ui-widget-summary-value {
  color: var(--ezra-ui-widget-title-color, inherit);
  font-family: var(--header-font);
  font-size: var(--ezra-ui-widget-summary-value-font-size, 0.98rem);
  line-height: var(--ezra-ui-widget-summary-value-line-height, 1.1);
}

.ezra-ui-widget-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  align-items: stretch;
}

.ezra-ui-widget-actions .ezra-ui-widget-action {
  width: 100%;
  min-width: 0;
  min-height: var(--ezra-ui-widget-action-height, 44px);
  padding-block: var(--ezra-ui-widget-action-padding-block, 8px);
  padding-inline: var(--ezra-ui-widget-action-padding-inline, 12px);
  border-radius: 0;
  justify-self: stretch;
  line-height: var(--ezra-ui-widget-action-line-height, 1.05);
  white-space: normal;
  overflow-wrap: anywhere;
}

.ezra-ui-widget-management-controls,
.ezra-ui-widget-order-actions {
  display: flex;
  justify-content: flex-end;
  min-width: 0;
}

.ezra-ui-widget-order-actions .ezra-ui-cluster {
  gap: 0.4rem;
}

@media (max-width: 1100px) {
  .ezra-ui-widget-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .ezra-ui-widget-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .ezra-ui-widget[data-ezra-ui-widget-column-span="2"] {
    grid-column: span 1;
  }

  .ezra-ui-widget-summary-grid {
    grid-template-columns: 1fr;
  }

  .ezra-ui-widget-actions {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .ezra-ui-widget-mode-actions {
    grid-column: 1;
    grid-row: auto;
    width: 100%;
    justify-content: stretch;
  }

  .ezra-ui-widget-mode-actions .ezra-ui-widget-action,
  .ezra-ui-widget-mode-actions .ezra-ui-button {
    flex: 1 1 100%;
  }

  .ezra-ui-widget-mode-corner-controls {
    flex: 1 1 100%;
    justify-content: flex-start;
  }
}


.ezra-ui-dot {
  display: inline-block;
  flex: 0 0 auto;
  box-sizing: border-box;
  width: var(--ezra-ui-dot-size, 0.6rem);
  height: var(--ezra-ui-dot-size, 0.6rem);
  border: var(--ezra-ui-dot-border-width, 2px) solid transparent;
  border-radius: var(--ezra-ui-dot-radius, 999px);
  background: var(--ezra-ui-dot-color, var(--muted-color, currentColor));
  box-shadow: none;
}

.ezra-ui-dot.is-full {
  border-color: var(--ezra-ui-dot-color, var(--muted-color, currentColor));
  background: var(--ezra-ui-dot-color, var(--muted-color, currentColor));
}

.ezra-ui-dot.is-empty {
  border-color: var(--ezra-ui-dot-color, var(--muted-color, currentColor));
  background: transparent;
}

.ezra-ui-dot.is-half {
  border-color: var(--ezra-ui-dot-color, var(--muted-color, currentColor));
  background: linear-gradient(
    to bottom,
    transparent 0 50%,
    var(--ezra-ui-dot-color, var(--muted-color, currentColor)) 50% 100%
  );
}


.ezra-ui-dot.is-public {
  --ezra-ui-dot-color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-border, var(--input-highlight-color, currentColor)));
}

.ezra-ui-dot.is-private {
  --ezra-ui-dot-color: var(--h1-color, var(--text-color, currentColor));
}

.ezra-ui-dot.is-ready {
  --ezra-ui-dot-color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-border, var(--input-highlight-color, currentColor)));
}

.ezra-ui-dot.is-new {
  --ezra-ui-dot-color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-border, var(--input-highlight-color, currentColor)));
}

.ezra-ui-dot.is-edited {
  --ezra-ui-dot-color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-border, var(--input-highlight-color, currentColor)));
}

.ezra-ui-dot.is-updated {
  --ezra-ui-dot-color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-border, var(--input-highlight-color, currentColor)));
}

.ezra-ui-dot.is-draft {
  --ezra-ui-dot-color: var(--h1-color, var(--text-color, currentColor));
}

.ezra-ui-dot.is-dirty {
  --ezra-ui-dot-color: var(--h1-color, var(--text-color, currentColor));
}

.ezra-ui-dot.is-delete {
  --ezra-ui-dot-color: var(--badge-delete-border, var(--danger-color, currentColor));
}

.ezra-ui-dot.is-change {
  --ezra-ui-dot-color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-border, var(--input-highlight-color, currentColor)));
}

.ezra-ui-dot.is-light {
  --ezra-ui-dot-color: var(--ezra-ui-theme-surface-step-1, var(--ezra-ui-theme-surface-quiet-text, var(--text-color, currentColor)));
}

.ezra-ui-dot.is-dark {
  --ezra-ui-dot-color: var(--ezra-ui-theme-surface-step-8, var(--ezra-ui-theme-background, var(--background-color, currentColor)));
}

.ezra-ui-status-marker {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
  color: var(--ezra-ui-status-marker-color, var(--muted-color, currentColor));
  font-family: var(--ezra-ui-status-marker-font, var(--header-font));
  font-size: var(--ezra-ui-status-marker-size, 0.72rem);
  font-weight: var(--ezra-ui-status-marker-weight, 700);
  letter-spacing: var(--ezra-ui-status-marker-letter-spacing, 0.04em);
  line-height: 1;
  text-transform: uppercase;
}

.ezra-ui-status-marker-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ezra-ui-status-rail {
  display: grid;
  grid-template-columns: repeat(var(--ezra-ui-status-rail-columns, 3), minmax(96px, 1fr));
  gap: var(--ezra-ui-status-rail-gap, var(--ezra-ui-row-gap, 10px));
  align-items: start;
}

.ezra-ui-status-item {
  display: grid;
  gap: var(--ezra-ui-status-item-gap, var(--ezra-ui-row-gap-compact, 6px));
  align-items: start;
  min-width: 0;
}

.ezra-ui-status-item-label {
  color: var(--ezra-ui-status-item-label-color, var(--muted-text-color, var(--text-muted, currentColor)));
  font-family: var(--ezra-ui-status-item-label-font, var(--body-font));
  font-size: var(--ezra-ui-status-item-label-size, 0.78rem);
  line-height: 1.1;
  text-transform: uppercase;
}

.ezra-ui-status-item-value {
  min-width: 0;
  color: var(--ezra-ui-status-item-value-color, var(--text-color, currentColor));
  font-family: var(--ezra-ui-status-item-value-font, var(--header-font));
  font-size: var(--ezra-ui-status-item-value-size, 1rem);
  font-weight: 700;
  line-height: 1.15;
  overflow-wrap: anywhere;
  text-transform: uppercase;
}

@media (max-width: 860px) {
  .ezra-ui-status-marker {
    min-width: 10px;
  }

  .ezra-ui-status-marker-label {
    display: var(--ezra-ui-status-marker-label-display-mobile, none);
  }
}


.ezra-ui-reference-picker {
  position: relative;
}

.ezra-ui-object-card {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.ezra-ui-object-card--media {
  grid-template-columns: 132px minmax(0, 1fr);
  align-items: start;
}

.ezra-ui-object-card-media,
.ezra-ui-object-card-fields {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.ezra-ui-object-card-media-fields {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.ezra-ui-field--utility {
  gap: 4px;
}

.ezra-ui-field--utility .ezra-ui-label {
  font-size: 0.72rem;
  letter-spacing: 0.05em;
}

.ezra-ui-field--utility .ezra-ui-input,
.ezra-ui-field--utility input,
.ezra-ui-field--utility textarea,
.ezra-ui-field--utility select {
  min-height: 2rem;
  padding: 0.35rem 0.45rem;
  font-size: 0.78rem;
  line-height: 1.2;
}

.ezra-ui-object-card-preview {
  display: grid;
  align-items: center;
  justify-items: start;
  width: 100%;
  min-height: 64px;
  overflow: hidden;
  background: color-mix(in srgb, var(--background-color) 86%, var(--quote-background-color) 14%);
}

.ezra-ui-object-card-preview img {
  display: block;
  width: 64px;
  height: auto;
}

.ezra-ui-object-card-preview-empty {
  justify-self: stretch;
  padding: 0.35rem;
  color: var(--muted-color);
  font-size: 0.72rem;
  line-height: 1.1;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.ezra-ui-image-selection-workspace,
.ezra-ui-image-library {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.ezra-ui-image-selection-workspace {
  align-content: stretch;
  min-height: 540px;
}

.ezra-ui-image-library-search,
.ezra-ui-image-library-meta,
.ezra-ui-image-selection-meta {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.ezra-ui-image-library-scroll {
  min-width: 0;
  min-height: 0;
}

.ezra-ui-image-library-list,
.ezra-ui-image-selection-list,
.ezra-ui-image-selection-grid {
  list-style: none;
  margin: 0;
  padding: 0;
}

.ezra-ui-image-selection-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.ezra-ui-image-library-item,
.ezra-ui-image-selection-item,
.ezra-ui-image-selection-card {
  min-width: 0;
  margin: 0;
}

.ezra-ui-image-library-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-width: 0;
  padding: 14px 18px;
  border: 0;
  border-bottom: 1px solid var(--ezra-ui-panel-list-body-border, var(--panel-border));
  background: var(--ezra-ui-panel-list-item-background, transparent);
  color: inherit;
  box-sizing: border-box;
}

.ezra-ui-image-library-main {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  width: 100%;
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  line-height: inherit;
  text-align: left;
  cursor: pointer;
  appearance: none;
  box-sizing: border-box;
}

.ezra-ui-image-library-main:focus-visible {
  outline: none;
}

.ezra-ui-image-library-editor {
  display: grid;
  grid-column: 2 / -1;
  gap: 6px;
  min-width: 0;
}

.ezra-ui-image-library-row:hover,
.ezra-ui-image-library-row.is-selected,
.ezra-ui-image-library-row.is-focused,
.ezra-ui-image-selection-item:hover {
  background: var(--ezra-ui-panel-list-item-hover-background, var(--surface-quiet));
}

.ezra-ui-image-library-row:focus-within {
  box-shadow: inset 0 0 0 2px var(--focus-ring, currentColor);
}

.ezra-ui-image-library-checkbox {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
}

.ezra-ui-image-library-checkbox .ezra-ui-checkbox {
  margin: 0;
}

.ezra-ui-image-library-preview,
.ezra-ui-image-selection-preview {
  overflow: hidden;
  border: 1px solid var(--panel-border);
  background: var(--surface-quiet);
  box-sizing: border-box;
}

.ezra-ui-image-library-preview {
  width: 56px;
  height: 56px;
}

.ezra-ui-image-selection-preview {
  aspect-ratio: 16 / 10;
  width: 100%;
}

.ezra-ui-image-library-preview img,
.ezra-ui-image-selection-preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ezra-ui-image-library-name,
.ezra-ui-image-selection-name {
  margin: 0;
  color: var(--h1-color);
  font-family: var(--header-font);
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.ezra-ui-image-library-path,
.ezra-ui-image-selection-path {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--muted-color);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.82rem;
  line-height: 1.25;
}

.ezra-ui-image-library-details,
.ezra-ui-image-selection-details {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  min-width: 0;
}

.ezra-ui-image-library-detail,
.ezra-ui-image-selection-detail,
.ezra-ui-image-library-save-state,
.ezra-ui-image-selection-save-state {
  color: var(--muted-color);
  font-family: var(--header-font);
  font-size: 0.76rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.ezra-ui-image-library-save-state,
.ezra-ui-image-selection-save-state {
  font-size: 0.72rem;
  opacity: 0.85;
}

.ezra-ui-image-library-save-state:empty,
.ezra-ui-image-selection-save-state:empty {
  display: none;
}

.ezra-ui-image-library-item-actions,
.ezra-ui-image-selection-item-actions,
.ezra-ui-image-selection-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  min-width: 0;
}

.ezra-ui-image-selection-card {
  display: grid;
  gap: 12px;
  align-content: start;
  min-width: 0;
  min-height: 280px;
  overflow: hidden;
  padding: 16px;
  border: 1px solid var(--panel-border);
  background: var(--ezra-ui-panel-list-item-background, transparent);
  box-sizing: border-box;
}

.ezra-ui-image-selection-card:hover {
  background: var(--ezra-ui-panel-list-item-hover-background, var(--surface-quiet));
}

.ezra-ui-image-selection-path-button {
  display: block;
  width: 100%;
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.ezra-ui-image-selection-path-button:hover .ezra-ui-image-selection-path,
.ezra-ui-image-selection-path-button:focus-visible .ezra-ui-image-selection-path {
  color: var(--text-color);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.14em;
}

.ezra-ui-image-selection-path-button:focus-visible {
  outline: none;
}

.ezra-ui-image-selection-empty {
  min-height: 0;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

.ezra-ui-image-library-alt,
.ezra-ui-image-selection-alt {
  min-width: 0;
}

.ezra-ui-image-alt-field {
  display: grid;
  gap: 6px;
}

.ezra-ui-image-alt-label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}

.ezra-ui-image-alt-required {
  color: var(--danger-color, var(--ezra-ui-theme-danger, currentColor));
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.ezra-ui-image-alt-error {
  margin: 0;
  color: var(--danger-color, var(--ezra-ui-theme-danger, currentColor));
  font-size: 0.82rem;
  line-height: 1.3;
}

.ezra-ui-image-alt-field input[aria-invalid="true"] {
  border-color: var(--danger-color, var(--ezra-ui-theme-danger, currentColor));
  box-shadow: 0 0 0 1px var(--danger-color, var(--ezra-ui-theme-danger, currentColor));
}

.ezra-ui-image-library-alt-input,
.ezra-ui-image-selection-alt-input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.ezra-ui-repeater {
  display: grid;
  gap: var(--ezra-ui-repeater-gap, var(--ezra-ui-stack-gap, clamp(14px, 1.4vw, 16px)));
  padding: var(--ezra-ui-card-padding-compact);
  border: 1px solid var(--ezra-ui-repeater-border, var(--panel-border));
  background: var(--ezra-ui-repeater-background, var(--surface-quiet));
}

.ezra-ui-repeater-footer {
  display: grid;
  gap: var(--ezra-ui-repeater-footer-gap, var(--ezra-ui-row-gap, 10px));
  min-width: 0;
}

.ezra-ui-repeater-empty-state {
  margin: 0;
}

.ezra-ui-repeater-item {
  display: grid;
  gap: var(--ezra-ui-repeater-item-gap, var(--ezra-ui-stack-gap-compact, 12px));
  padding: var(--ezra-ui-card-padding-compact);
  border: 1px solid var(--ezra-ui-repeater-item-border, var(--panel-border));
  background: var(--ezra-ui-repeater-item-background, var(--surface-quiet));
  box-shadow: inset 0 0 0 1px color-mix(
    in srgb,
    var(--ezra-ui-repeater-item-border-strong, var(--panel-border-strong)) 38%,
    transparent
  );
}

.ezra-ui-sort-item {
  transition:
    transform var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-fade),
    background-color var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-fade),
    box-shadow var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-fade),
    border-color var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-fade);
}

.ezra-ui-sort-item.is-dragging {
  background: color-mix(in srgb, var(--yellow) 12%, transparent);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.22);
  border-color: color-mix(in srgb, var(--yellow) 55%, transparent);
  transform: scale(1.01);
}

.ezra-ui-sort-item-header {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: space-between;
  flex-wrap: wrap;
}

.ezra-ui-repeater-meta {
  margin-top: 0.2rem;
  color: var(--ezra-ui-repeater-meta-color, var(--muted-color));
  font-family: var(--header-font);
  font-size: 0.75rem;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  opacity: 0.8;
}

.ezra-ui-sort-item-title {
  min-width: 0;
  font-family: var(--header-font);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ezra-ui-repeater-title-color, var(--h1-color));
  margin-right: auto;
}

.ezra-ui-sort-item-actions {
  display: flex;
  flex: 0 0 auto;
  margin-left: auto;
}

@media (max-width: 860px) {
  .ezra-ui-repeater {
    gap: var(--ezra-ui-mobile-repeater-gap, 14px);
  }

  .ezra-ui-repeater-item {
    padding: 12px;
    gap: var(--ezra-ui-mobile-repeater-item-gap, 10px);
  }

  .ezra-ui-sort-item-title {
    flex: 1 1 12rem;
    font-size: 0.98rem;
    line-height: 1rem;
  }

  .ezra-ui-sort-item-actions {
    flex: 0 0 auto;
    margin-left: auto;
  }
}

@media (max-width: 720px) {
  .ezra-ui-image-library-row,
  .ezra-ui-image-library-main {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
  }

  .ezra-ui-image-selection-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .ezra-ui-image-selection-card {
    min-height: 0;
  }

  .ezra-ui-image-selection-workspace {
    min-height: 320px;
  }

  .ezra-ui-image-library-item-actions,
  .ezra-ui-image-selection-item-actions {
    grid-column: 1 / -1;
    padding-top: 2px;
  }

  .ezra-ui-image-selection-item-actions {
    justify-content: flex-start;
  }

  .ezra-ui-image-library-preview {
    width: 52px;
    height: 52px;
  }
}

@media (max-width: 560px) {
  .ezra-ui-sort-item-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }

  .ezra-ui-sort-item-title {
    flex: none;
    margin-right: 0;
  }

  .ezra-ui-sort-item-actions {
    justify-self: end;
    margin-left: 0;
  }
}

@media (max-width: 860px) {
  .ezra-ui-object-card--media {
    grid-template-columns: 1fr;
  }

  .ezra-ui-object-card-media {
    grid-template-columns: 72px minmax(0, 1fr);
    align-items: start;
  }

  .ezra-ui-object-card-preview {
    min-height: 72px;
  }
}


.ezra-ui-measurement-progress,
.ezra-ui-measurement-bar-chart,
.ezra-ui-measurement-trend {
  --ezra-ui-measurement-accent: var(
    --ezra-ui-theme-accent-strong,
    var(--ezra-ui-theme-accent, currentColor)
  );
  --ezra-ui-measurement-track: var(
    --ezra-ui-theme-surface-quiet,
    color-mix(in srgb, currentColor 8%, transparent)
  );
  --ezra-ui-measurement-border: var(
    --ezra-ui-theme-border,
    color-mix(in srgb, currentColor 22%, transparent)
  );
  --ezra-ui-measurement-muted: var(
    --ezra-ui-theme-surface-quiet-text,
    var(--ezra-ui-theme-text, color-mix(in srgb, currentColor 68%, transparent))
  );
  min-width: 0;
  margin: 0;
  color: var(--ezra-ui-theme-text, currentColor);
  font-family: inherit;
}

.ezra-ui-measurement-heading,
.ezra-ui-measurement-chart-caption,
.ezra-ui-measurement-axis {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
}

.ezra-ui-measurement-label,
.ezra-ui-measurement-chart-title {
  min-width: 0;
  font-size: 0.78rem;
  font-weight: 700;
}

.ezra-ui-measurement-value,
.ezra-ui-measurement-unit,
.ezra-ui-measurement-axis {
  color: var(--ezra-ui-measurement-muted);
  font-size: 0.72rem;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.ezra-ui-measurement-track {
  position: relative;
  min-width: 0;
  height: var(--ezra-ui-measurement-track-height, 0.55rem);
  overflow: hidden;
  border: 1px solid var(--ezra-ui-measurement-border);
  border-radius: 999px;
  background: var(--ezra-ui-measurement-track);
}

.ezra-ui-measurement-progress .ezra-ui-measurement-track {
  margin-top: 0.45rem;
}

.ezra-ui-measurement-fill {
  display: block;
  width: var(--ezra-ui-measurement-percent, 0%);
  height: 100%;
  border-radius: inherit;
  background: var(--ezra-ui-measurement-fill, var(--ezra-ui-measurement-accent));
  transition: width var(--ezra-surface-motion-duration, 180ms) ease;
}

[data-measurement-tone="success"] {
  --ezra-ui-measurement-fill: var(--ezra-ui-measurement-success, var(--ezra-ui-theme-accent-strong, var(--ezra-ui-measurement-accent)));
}
[data-measurement-tone="warning"] {
  --ezra-ui-measurement-fill: var(--ezra-ui-measurement-warning, var(--ezra-ui-theme-accent, var(--ezra-ui-measurement-accent)));
}
[data-measurement-tone="danger"] {
  --ezra-ui-measurement-fill: var(--ezra-ui-measurement-danger, var(--ezra-ui-theme-button-background, var(--ezra-ui-measurement-accent)));
}
[data-measurement-tone="neutral"] {
  --ezra-ui-measurement-fill: var(--ezra-ui-theme-surface-quiet-text, var(--ezra-ui-measurement-muted));
}

.ezra-ui-measurement-progress[data-measurement-mode="indeterminate"] .ezra-ui-measurement-fill {
  width: 36%;
  animation: ezra-ui-measurement-loading 1.2s ease-in-out infinite;
}

.ezra-ui-measurement-description {
  margin: 0.4rem 0 0;
  color: var(--ezra-ui-measurement-muted);
  font-size: 0.72rem;
  line-height: 1.35;
}

.ezra-ui-measurement-bars {
  display: grid;
  gap: 0.55rem;
  margin: 0.7rem 0 0;
  padding: 0;
  list-style: none;
}

.ezra-ui-measurement-bar-item {
  display: grid;
  grid-template-columns: minmax(7.5rem, 0.8fr) minmax(6rem, 2fr) minmax(5.5rem, auto);
  align-items: center;
  gap: 0.65rem;
}

.ezra-ui-measurement-bar-item > .ezra-ui-measurement-value {
  text-align: right;
}

.ezra-ui-measurement-bar-item[data-measurement-availability="estimated"] .ezra-ui-measurement-fill {
  background-image: repeating-linear-gradient(135deg, transparent 0 4px, color-mix(in srgb, white 24%, transparent) 4px 7px);
}

.ezra-ui-measurement-unavailable {
  position: absolute;
  inset: 50% auto auto 50%;
  color: var(--ezra-ui-measurement-muted);
  font-size: 0.75rem;
  line-height: 1;
  transform: translate(-50%, -50%);
}

.ezra-ui-measurement-sparkline {
  display: block;
  width: 100%;
  height: 4.5rem;
  margin-top: 0.55rem;
  overflow: visible;
}

.ezra-ui-measurement-grid-line {
  stroke: var(--ezra-ui-measurement-border);
  stroke-width: 0.75;
  vector-effect: non-scaling-stroke;
}

.ezra-ui-measurement-trend-line {
  fill: none;
  stroke: var(--ezra-ui-measurement-fill, var(--ezra-ui-measurement-accent));
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.ezra-ui-measurement-axis {
  margin-top: 0.25rem;
  font-size: 0.65rem;
}

@keyframes ezra-ui-measurement-loading {
  from { transform: translateX(-110%); }
  to { transform: translateX(290%); }
}

@media (prefers-reduced-motion: reduce) {
  .ezra-ui-measurement-fill { transition: none; }
  .ezra-ui-measurement-progress[data-measurement-mode="indeterminate"] .ezra-ui-measurement-fill {
    animation: none;
    margin-left: 32%;
  }
}

@media (max-width: 640px) {
  .ezra-ui-measurement-bar-item {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .ezra-ui-measurement-bar-item > .ezra-ui-measurement-track {
    grid-column: 1 / -1;
    grid-row: 2;
  }
}


.ezra-ui-image-preview-shell {
  display: grid;
  width: 100%;
  min-width: 0;
}

.ezra-ui-image-field-group {
  display: grid;
  gap: var(--ezra-ui-stack-gap, clamp(14px, 1.4vw, 16px));
  min-width: 0;
}

.ezra-ui-image-preview-shell.is-constrained {
  width: var(--ezra-ui-image-preview-width, auto);
  height: var(--ezra-ui-image-preview-height, auto);
  max-width: 100%;
  overflow: hidden;
}

.ezra-ui-image-url-preview {
  display: grid;
  gap: 8px;
  width: 100%;
  min-width: 0;
}

.ezra-ui-image-url-preview.is-fill-container {
  width: 100%;
  height: var(--ezra-ui-image-preview-height, auto);
}

.ezra-ui-image-url-preview-frame {
  width: var(--ezra-ui-image-preview-width, auto);
  max-width: 100%;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  border: 1px solid var(--panel-border);
  background: var(--surface-quiet);
}

.ezra-ui-image-preview-shell.is-inline-size-only .ezra-ui-image-url-preview-frame {
  aspect-ratio: auto;
}

.ezra-ui-image-preview-shell.is-inline-size-only .ezra-ui-image-url-preview-frame img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

.ezra-ui-image-url-preview.is-fill-container .ezra-ui-image-url-preview-frame {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
}

.ezra-ui-image-url-preview-frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ezra-ui-image-url-preview-empty {
  display: grid;
  min-height: 7rem;
  place-items: center;
  padding: 16px;
  border: 1px solid var(--panel-border);
  background: color-mix(in srgb, var(--surface-quiet) 92%, var(--background-color) 8%);
  color: var(--muted-color);
  font-family: var(--header-font);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.1;
  text-align: center;
  text-transform: uppercase;
  box-sizing: border-box;
}

.ezra-ui-image-url-preview.is-fill-container .ezra-ui-image-url-preview-empty {
  min-height: 0;
  width: 100%;
  height: 100%;
  padding: 0.35rem;
  overflow: hidden;
  font-size: 0.75rem;
  line-height: 1.2;
  box-sizing: border-box;
}

.ezra-ui-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  max-width: 100%;
  min-height: var(--ezra-ui-button-min-height, 40px);
  padding:
    var(--ezra-ui-button-padding-block, 10px)
    var(--ezra-ui-button-padding-inline, 16px);
  appearance: none;
  border: 0;
  font-family: var(--header-font);
  font-weight: 700;
  font-size: var(--ezra-ui-button-font-size, 1rem);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: var(--ezra-ui-button-line-height, 1.05);
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  text-decoration: none;
  cursor: pointer;
  box-sizing: border-box;
}

.ezra-ui-button--small {
  min-height: var(--ezra-ui-button-small-min-height, 34px);
  padding:
    var(--ezra-ui-button-small-padding-block, 8px)
    var(--ezra-ui-button-small-padding-inline, 12px);
  font-size: var(--ezra-ui-button-small-font-size, 0.9rem);
}

.ezra-ui-repeater-standard-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.ezra-ui-repeater-standard-actions .ezra-ui-repeater-icon-button {
  width: 2.25rem;
  min-width: 2.25rem;
  min-height: 2.25rem;
  padding: 0;
  font-size: 1rem;
  line-height: 1;
}

.ezra-ui-button--responsive-width {
  width: var(--ezra-ui-button-responsive-width, fit-content);
  justify-self: var(--ezra-ui-button-responsive-justify-self, start);
}

@media (max-width: 860px) {
  .ezra-ui-button--responsive-width {
    width: var(--ezra-ui-button-responsive-mobile-width, 100%);
    justify-self: var(--ezra-ui-button-responsive-mobile-justify-self, stretch);
  }
}

.ezra-ui-button--primary {
  background: var(--ezra-app-surface-primary-button-background, var(--button-background-color));
  color: var(--ezra-app-surface-primary-button-text, var(--button-text-color));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-primary-button-border, color-mix(in srgb, var(--button-background-color) 72%, transparent));
}

.ezra-ui-button--primary:hover {
  background: var(--ezra-app-surface-primary-button-hover-background, var(--button-text-color));
  color: var(--ezra-app-surface-primary-button-hover-text, var(--button-background-color));
  box-shadow: inset 0 0 0 2px var(--ezra-app-surface-primary-button-hover-border, var(--button-background-color));
}

.ezra-ui-button--important {
  background: var(--ezra-app-surface-important-button-background, color-mix(in srgb, var(--ezra-ui-theme-accent-strong, var(--yellow, var(--input-highlight-color))) 16%, transparent));
  color: var(--ezra-app-surface-important-button-text, var(--h1-color, var(--text-color)));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-important-button-border, color-mix(in srgb, var(--ezra-ui-theme-accent-strong, var(--yellow, var(--input-highlight-color))) 68%, var(--border-color)));
}

.ezra-ui-button--important:hover {
  background: var(--ezra-app-surface-important-button-hover-background, color-mix(in srgb, var(--ezra-ui-theme-accent-strong, var(--yellow, var(--input-highlight-color))) 24%, transparent));
  color: var(--ezra-app-surface-important-button-hover-text, var(--h1-color, var(--text-color)));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-important-button-hover-border, var(--ezra-ui-theme-accent-strong, var(--yellow, var(--input-highlight-color))));
}

.ezra-ui-button--secondary-important {
  background: var(--ezra-app-surface-secondary-important-button-background, transparent);
  color: var(--ezra-app-surface-secondary-important-button-text, var(--h1-color, var(--text-color)));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-secondary-important-button-border, var(--ezra-app-surface-important-button-accent, var(--ezra-ui-theme-accent-strong, var(--input-highlight-color))));
}

.ezra-ui-button--secondary-important:hover {
  background: var(--ezra-app-surface-secondary-important-button-hover-background, transparent);
  color: var(--ezra-app-surface-secondary-important-button-hover-text, var(--ezra-app-surface-secondary-important-button-text, var(--h1-color, var(--text-color))));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-secondary-important-button-hover-border, var(--ezra-app-surface-important-button-accent, var(--ezra-ui-theme-accent-strong, var(--input-highlight-color))));
}

.ezra-ui-button--secondary {
  background: var(--ezra-app-surface-secondary-button-background, color-mix(in srgb, var(--button-background-color) 10%, transparent));
  color: var(--ezra-app-surface-secondary-button-text, color-mix(in srgb, var(--text-color) 92%, var(--muted-color) 8%));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-secondary-button-border, color-mix(in srgb, var(--border-color) 34%, transparent));
}

.ezra-ui-button--secondary:hover {
  background: var(--ezra-app-surface-secondary-button-hover-background, color-mix(in srgb, var(--button-background-color) 18%, transparent));
  color: var(--ezra-app-surface-secondary-button-hover-text, var(--text-color));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-secondary-button-hover-border, color-mix(in srgb, var(--border-color) 48%, transparent));
}

.ezra-ui-button--ghost {
  background: transparent;
  color: var(--ezra-app-surface-ghost-button-text, color-mix(in srgb, var(--text-color) 82%, var(--muted-color) 18%));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-ghost-button-border, color-mix(in srgb, var(--panel-border) 82%, transparent));
}

.ezra-ui-button--ghost:hover {
  background: var(--ezra-app-surface-ghost-button-hover-background, color-mix(in srgb, var(--text-color) 6%, transparent));
  color: var(--ezra-app-surface-ghost-button-hover-text, var(--text-color));
}

.ezra-ui-button--danger {
  background: var(--ezra-app-surface-danger-button-background, transparent);
  color: var(--ezra-app-surface-danger-button-text, var(--red));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-danger-button-border, color-mix(in srgb, var(--red) 58%, transparent));
}

.ezra-ui-button--danger:hover {
  background: var(--ezra-app-surface-danger-button-hover-background, transparent);
  color: var(--ezra-app-surface-danger-button-hover-text, var(--red));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-danger-button-hover-border, color-mix(in srgb, var(--red) 78%, transparent));
}

.ezra-ui-button:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)),
    inset 0 0 0 1px color-mix(in srgb, var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)) 18%, transparent);
}

.ezra-ui-button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.ezra-ui-toggle-switch-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  align-items: center;
  justify-content: start;
  min-width: 0;
  width: min(100%, var(--ezra-ui-toggle-switch-width, 168px));
}

.ezra-ui-toggle-switch-labels {
  display: grid;
  grid-template-columns: repeat(var(--ezra-ui-toggle-switch-position-count, 2), minmax(0, 1fr));
  align-items: start;
  width: 100%;
}

.ezra-ui-toggle-switch-label {
  appearance: none;
  min-width: 0;
  padding: 0 2px;
  border: 0;
  background: transparent;
  color: var(--label-color);
  font-family: var(--header-font);
  font-size: var(--ezra-ui-toggle-switch-label-size, 0.68rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
  text-align: center;
  text-transform: uppercase;
  opacity: 0.62;
  white-space: nowrap;
  cursor: pointer;
}

.ezra-ui-toggle-switch-label[data-active="true"] {
  color: var(--ezra-ui-toggle-switch-active-label-color, var(--ezra-ui-widget-title-color, var(--h1-color)));
  opacity: 1;
}

.ezra-ui-toggle-switch-label:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.ezra-ui-toggle-switch {
  position: relative;
  display: grid;
  grid-template-columns: repeat(var(--ezra-ui-toggle-switch-position-count, 2), minmax(0, 1fr));
  width: 100%;
  height: var(--ezra-ui-toggle-switch-height, 26px);
  min-width: 0;
  min-height: var(--ezra-ui-toggle-switch-height, 26px);
  padding: var(--ezra-ui-toggle-switch-padding, 2px);
  appearance: none;
  border: 1px solid var(--ezra-ui-toggle-switch-border, var(--ezra-ui-widget-shell-border, var(--panel-border)));
  border-radius: var(--ezra-ui-toggle-switch-radius, 999px);
  background: var(--ezra-ui-toggle-switch-background, var(--ezra-ui-control-surface-background, var(--surface-quiet)));
  color: inherit;
  cursor: pointer;
}

.ezra-ui-toggle-switch-position {
  position: relative;
  z-index: 1;
  min-width: 0;
  padding: 0;
  appearance: none;
  border: 0;
  border-radius: calc(var(--ezra-ui-toggle-switch-radius, 999px) - var(--ezra-ui-toggle-switch-padding, 2px));
  background: transparent;
  cursor: pointer;
}

.ezra-ui-toggle-switch-position:hover {
  background: color-mix(in srgb, var(--ezra-ui-toggle-switch-thumb-color, var(--ezra-ui-widget-title-color, currentColor)) 8%, transparent);
}

.ezra-ui-toggle-switch-position:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)),
    inset 0 0 0 1px color-mix(in srgb, var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)) 18%, transparent);
}

.ezra-ui-toggle-switch-thumb {
  position: absolute;
  inset-block: var(--ezra-ui-toggle-switch-padding, 2px);
  inset-inline-start: var(--ezra-ui-toggle-switch-padding, 2px);
  display: block;
  width: calc((100% - (var(--ezra-ui-toggle-switch-padding, 2px) * 2)) / var(--ezra-ui-toggle-switch-position-count, 2));
  height: auto;
  transform: translateX(calc(var(--ezra-ui-toggle-switch-active-index, 0) * 100%));
  transition: transform var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-toggle-switch-thumb::after {
  content: "";
  position: absolute;
  inset-block-start: 50%;
  inset-inline-start: 50%;
  inline-size: var(--ezra-ui-toggle-switch-thumb-size, 20px);
  block-size: var(--ezra-ui-toggle-switch-thumb-size, 20px);
  border-radius: var(--ezra-ui-toggle-switch-thumb-radius, 50%);
  background: var(--ezra-ui-toggle-switch-thumb-color, var(--ezra-ui-widget-title-color, currentColor));
  transform: translate(-50%, -50%);
}

.ezra-ui-toggle-switch:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)),
    inset 0 0 0 1px color-mix(in srgb, var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)) 18%, transparent);
}

.ezra-ui-toggle-switch:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.ezra-ui-toggle-switch[data-disabled="true"],
.ezra-ui-toggle-switch[data-disabled="true"] .ezra-ui-toggle-switch-position {
  cursor: not-allowed;
}

.ezra-ui-field {
  display: flex;
  flex-direction: column;
  gap: var(--ezra-ui-row-gap-compact, 8px);
  min-width: 0;
}

.ezra-ui-label {
  display: inline-flex;
  align-items: center;
  min-height: 0;
  color: var(--label-color);
  font-family: var(--header-font);
  font-weight: 700;
  font-size: 0.82rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1;
}

.ezra-ui-help {
  margin: 0;
  color: var(--muted-color);
  font-size: 0.95rem;
  line-height: 1.35;
}

.ezra-ui-input,
.ezra-ui-field input,
.ezra-ui-field textarea,
.ezra-ui-field select {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 44px;
  padding: 12px 14px;
  border: 1px solid var(--ezra-ui-theme-input-border, var(--panel-border));
  border-radius: 0;
  background: var(--input-bg);
  color: var(--text-color);
  font-family: var(--body-font);
  font-size: 1rem;
  line-height: 1.4;
  box-sizing: border-box;
  scroll-margin-top: 16px;
}

.ezra-ui-input:focus,
.ezra-ui-input:focus-visible,
.ezra-ui-field input:focus,
.ezra-ui-field input:focus-visible,
.ezra-ui-field textarea:focus,
.ezra-ui-field textarea:focus-visible,
.ezra-ui-field select:focus,
.ezra-ui-field select:focus-visible {
  outline: none;
  border-color: var(--focus-ring);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--focus-ring) 35%, transparent),
    inset 0 0 0 1px var(--focus-ring);
}

.ezra-ui-input::placeholder,
.ezra-ui-field input::placeholder,
.ezra-ui-field textarea::placeholder {
  color: var(--muted-color);
}

.ezra-ui-select {
  -webkit-appearance: none;
  appearance: none;
  padding-right: 42px;
  background-image:
    linear-gradient(45deg, transparent 50%, currentColor 50%),
    linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position:
    calc(100% - 18px) calc(50% - 2px),
    calc(100% - 12px) calc(50% - 2px);
  background-size:
    6px 6px,
    6px 6px;
  background-repeat: no-repeat;
}

.ezra-ui-textarea {
  resize: vertical;
  min-height: 0;
}

.ezra-ui-field--checkbox {
  gap: 8px;
}

.ezra-ui-checkbox-row,
.ezra-ui-radio-row {
  display: inline-flex;
  align-items: center;
  gap: var(--ezra-ui-checkbox-label-gap, 0.42em);
  width: fit-content;
  max-width: 100%;
  cursor: pointer;
}

.ezra-ui-checkbox,
.ezra-ui-radio {
  flex: 0 0 auto;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
  margin: 0;
  padding: 0;
  accent-color: var(--input-highlight-color);
}

.ezra-ui-checkbox-label,
.ezra-ui-radio-label {
  color: var(--ezra-ui-theme-checkbox-text, var(--text-color));
  font: inherit;
  line-height: 1.2;
}

.ezra-ui-checkbox:focus,
.ezra-ui-radio:focus {
  outline: none;
  box-shadow: 0 0 0 2px var(--focus-ring);
}

.ezra-ui-file-field {
  display: grid;
  gap: var(--ezra-ui-row-gap-compact, 8px);
  min-width: 0;
}

.ezra-ui-file-control {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  min-width: 0;
  border: 1px solid var(--ezra-ui-theme-input-border, var(--panel-border));
  background: var(--input-bg);
  color: var(--text-color);
  padding: 0.45rem 0.6rem;
  box-sizing: border-box;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ezra-ui-theme-input-border, var(--panel-border)) 28%, transparent);
}

.ezra-ui-file-field .ezra-ui-input.ezra-ui-file-input {
  position: absolute;
  width: 1px;
  height: 1px;
  min-width: 1px;
  max-width: 1px;
  min-height: 1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.ezra-ui-file-button {
  min-height: 34px;
}

.ezra-ui-file-name {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--muted-color);
}

.ezra-ui-stepper {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--ezra-ui-stepper-control-width, 34px);
  align-items: stretch;
  min-width: 0;
}

.ezra-ui-stepper .ezra-ui-input {
  min-height: var(--ezra-ui-stepper-input-height, 44px);
}

.ezra-ui-stepper-controls {
  display: grid;
  grid-template-rows: 1fr 1fr;
  min-width: 0;
}

.ezra-ui-stepper-button {
  appearance: none;
  display: inline-grid;
  place-items: center;
  width: 100%;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-left: 1px solid var(--ezra-ui-theme-input-border, var(--panel-border));
  background: var(--ezra-ui-stepper-button-bg, color-mix(in srgb, var(--input-bg) 78%, var(--surface-hover) 22%));
  color: var(--ezra-ui-stepper-button-text, var(--label-color));
  cursor: pointer;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--panel-border) 62%, transparent);
}

.ezra-ui-stepper-button + .ezra-ui-stepper-button {
  border-top: 1px solid var(--ezra-ui-theme-input-border, var(--panel-border));
}

.ezra-ui-stepper-button:hover,
.ezra-ui-stepper-button:focus-visible {
  background: var(--ezra-ui-stepper-button-hover-bg, var(--surface-hover));
  color: var(--ezra-ui-stepper-button-hover-text, var(--h1-color));
}

.ezra-ui-stepper-button:focus-visible {
  outline: none;
  box-shadow:
    inset 0 0 0 1px var(--focus-ring),
    0 0 0 1px color-mix(in srgb, var(--focus-ring) 35%, transparent);
}

.ezra-ui-stepper-button-icon {
  width: 12px;
  height: 8px;
}

.ezra-ui-stepper-button-icon path {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: square;
  stroke-linejoin: miter;
}

.ezra-ui-form-message,
.ezra-ui-form-error {
  margin: 0;
}

.ezra-ui-form-message {
  color: var(--message-success-text, var(--text-color));
}

.ezra-ui-form-error {
  color: var(--message-error-text, var(--danger-color, #b42318));
}
.ezra-ui-control-menu-shell,
.ezra-ui-theme-menu-shell {
  position: relative;
  min-width: 0;
}

.ezra-ui-control-menu-shell:has(.ezra-ui-control-menu:not([hidden])) {
  z-index: var(--ezra-ui-layer-control-popup, var(--ezra-ui-layer-workspace-dropdown, 60));
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu-shell:has(.ezra-ui-theme-menu:not([hidden])) {
  z-index: var(--ezra-ui-layer-control-popup, var(--ezra-ui-layer-workspace-dropdown, 60));
}

.ezra-ui-theme-picker--app-surface {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  width: auto;
  min-width: 0;
  max-width: 100%;
  flex-wrap: nowrap;
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-picker-label {
  display: inline-flex;
  align-items: center;
  min-height: 0;
  white-space: nowrap;
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu-shell {
  width: max-content;
  min-width: max(170px, calc((var(--ezra-ui-theme-picker-max-label-chars, 12) * 0.72em) + 76px));
  max-width: 100%;
  z-index: var(--ezra-ui-layer-workspace-menu, 40);
}

.ezra-ui-control-menu-button,
.ezra-ui-theme-menu-button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 180px;
  max-width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid var(
    --ezra-ui-theme-picker-button-border,
    var(--ezra-ui-control-menu-button-border, var(--ezra-ui-control-menu-row-border, var(--panel-border-strong)))
  );
  background: var(
    --ezra-ui-theme-picker-button-background,
    var(--ezra-ui-control-menu-button-background, var(--ezra-ui-control-menu-row-background, var(--input-bg)))
  );
  color: var(
    --ezra-ui-theme-picker-button-heading,
    var(--ezra-ui-control-menu-button-text, var(--ezra-ui-control-menu-row-heading, var(--text-color)))
  );
  font-family: var(--header-font);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1;
  text-transform: uppercase;
  text-align: left;
  cursor: pointer;
  box-sizing: border-box;
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu-button {
  min-width: max(170px, calc((var(--ezra-ui-theme-picker-max-label-chars, 12) * 0.72em) + 76px));
  min-height: 42px;
  padding: 9px 12px;
  font-size: 0.82rem;
  letter-spacing: 0.04em;
}

.ezra-ui-control-menu-button--has-leading-icon,
.ezra-ui-theme-menu-button--has-leading-icon {
  grid-template-columns: auto minmax(0, 1fr) auto;
}

.ezra-ui-control-menu-button:hover,
.ezra-ui-theme-menu-button:hover {
  background: color-mix(
    in srgb,
    var(
      --ezra-ui-theme-picker-button-background,
      var(--ezra-ui-control-menu-button-background, var(--input-bg))
    ) 88%,
    var(--ezra-ui-theme-picker-button-accent, var(--ezra-ui-control-menu-accent, var(--label-color))) 12%
  );
}

.ezra-ui-control-menu-button:focus-visible,
.ezra-ui-control-menu-item:focus-visible,
.ezra-ui-theme-menu-button:focus-visible,
.ezra-ui-theme-menu-item:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--focus-ring);
}

.ezra-ui-control-menu-button-label,
.ezra-ui-control-menu-item-label,
.ezra-ui-theme-menu-button-label,
.ezra-ui-theme-menu-item-label {
  min-width: 0;
}

.ezra-ui-control-menu-button-label,
.ezra-ui-theme-menu-button-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ezra-ui-control-menu-item-label,
.ezra-ui-theme-menu-item-label {
  overflow-wrap: anywhere;
}

.ezra-ui-control-menu-button-caret,
.ezra-ui-theme-menu-button-caret {
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 7px solid currentColor;
  flex: 0 0 auto;
}

.ezra-ui-theme-menu-button .ezra-ui-theme-menu-icon {
  color: var(
    --ezra-ui-theme-picker-button-accent,
    var(--ezra-ui-control-menu-row-accent, var(--label-color))
  );
}

.ezra-ui-control-menu,
.ezra-ui-theme-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: var(--ezra-ui-layer-workspace-menu, 40);
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(
    --ezra-ui-control-popup-border,
    var(--ezra-ui-control-menu-row-border, var(--panel-border-strong))
  );
  background: var(
    --ezra-ui-control-popup-background,
    var(--ezra-ui-control-menu-row-background, var(--panel-color))
  );
  box-shadow: 0 16px 34px color-mix(in srgb, var(--background-color) 30%, transparent);
  box-sizing: border-box;
}

.ezra-ui-control-menu-shell > .ezra-ui-control-popup-surface.ezra-ui-control-menu,
.ezra-ui-theme-menu-shell > .ezra-ui-control-popup-surface.ezra-ui-theme-menu {
  position: absolute;
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu {
  right: 0;
  left: auto;
  gap: 6px;
  width: max-content;
  min-width: max(170px, calc((var(--ezra-ui-theme-picker-max-label-chars, 12) * 0.72em) + 76px));
  max-width: min(100vw - 24px, max(170px, calc((var(--ezra-ui-theme-picker-max-label-chars, 12) * 0.72em) + 76px)));
  padding: 8px;
  box-shadow: none;
}

.ezra-ui-control-menu[hidden],
.ezra-ui-theme-menu[hidden] {
  display: none !important;
}

.ezra-ui-control-menu-item,
.ezra-ui-theme-menu-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 0;
  min-height: 40px;
  padding: 10px 12px;
  border: 0;
  background: var(--ezra-ui-control-menu-row-background, transparent);
  color: var(--ezra-ui-control-menu-row-text, var(--text-color));
  text-align: left;
  font-family: var(--body-font);
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: none;
  cursor: pointer;
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu-item {
  min-height: 42px;
  padding: 10px 12px;
  border: 0;
  box-shadow: inset 0 0 0 1px var(
    --ezra-ui-theme-picker-item-border,
    var(--ezra-ui-control-menu-row-border, var(--panel-border-strong))
  );
  font-family: var(--header-font);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1;
  text-transform: uppercase;
}

.ezra-ui-control-menu-item--themed,
.ezra-ui-theme-menu-item--themed {
  background: var(
    --ezra-ui-theme-picker-item-background,
    var(--ezra-ui-control-menu-row-background, var(--background-color))
  );
  color: var(
    --ezra-ui-theme-picker-item-text,
    var(--ezra-ui-control-menu-row-text, var(--text-color))
  );
  box-shadow: inset 0 0 0 1px var(
    --ezra-ui-theme-picker-item-border,
    var(--ezra-ui-control-menu-row-border, var(--panel-border-strong))
  );
}

.ezra-ui-control-menu-item--themed:hover,
.ezra-ui-theme-menu-item--themed:hover {
  background: color-mix(
    in srgb,
    var(
      --ezra-ui-theme-picker-item-background,
      var(--ezra-ui-control-menu-row-background, var(--background-color))
    ) 88%,
    var(--ezra-ui-control-menu-row-accent, var(--label-color)) 12%
  );
}

.ezra-ui-control-menu-item--themed .ezra-ui-theme-menu-icon,
.ezra-ui-theme-menu-item--themed .ezra-ui-theme-menu-icon {
  color: var(
    --ezra-ui-theme-menu-item-accent,
    var(
      --ezra-ui-theme-picker-menu-item-accent,
      var(--ezra-ui-control-menu-row-accent, var(--label-color))
    )
  );
}

.ezra-ui-control-menu-item--reset-theme,
.ezra-ui-theme-menu-item--reset-theme {
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  min-height: 42px;
  background: var(
    --ezra-app-surface-secondary-button-background,
    color-mix(in srgb, var(--button-background-color, var(--input-highlight-color)) 12%, var(--background-color, transparent))
  );
  color: var(--ezra-app-surface-secondary-button-text, var(--text-color));
  font-family: var(--header-font);
  font-weight: 700;
  letter-spacing: 0.03em;
  text-align: center;
  text-transform: uppercase;
  box-shadow: inset 0 0 0 1px var(
    --ezra-app-surface-secondary-button-border,
    color-mix(in srgb, var(--button-background-color, var(--input-highlight-color)) 42%, var(--border-color))
  );
}

.ezra-ui-control-menu-item--reset-theme:hover,
.ezra-ui-theme-menu-item--reset-theme:hover {
  background: var(
    --ezra-app-surface-secondary-button-hover-background,
    color-mix(in srgb, var(--button-background-color, var(--input-highlight-color)) 18%, var(--background-color, transparent))
  );
  color: var(
    --ezra-app-surface-secondary-button-hover-text,
    var(--ezra-app-surface-secondary-button-text, var(--text-color))
  );
  box-shadow: inset 0 0 0 1px var(
    --ezra-app-surface-secondary-button-hover-border,
    color-mix(in srgb, var(--button-background-color, var(--input-highlight-color)) 62%, var(--border-color))
  );
}

.ezra-ui-control-menu-item--reset-theme .ezra-ui-theme-menu-icon,
.ezra-ui-theme-menu-item--reset-theme .ezra-ui-theme-menu-icon {
  display: none;
}

.ezra-ui-control-menu-item--reset-theme .ezra-ui-theme-menu-item-label,
.ezra-ui-theme-menu-item--reset-theme .ezra-ui-theme-menu-item-label {
  color: currentColor;
  font-family: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
}

.ezra-ui-control-menu-item--themed .ezra-ui-theme-menu-item-label,
.ezra-ui-theme-menu-item--themed .ezra-ui-theme-menu-item-label,
.ezra-ui-control-menu-item--none .ezra-ui-theme-menu-item-label,
.ezra-ui-theme-menu-item--none .ezra-ui-theme-menu-item-label {
  color: var(
    --ezra-ui-theme-picker-menu-item-heading,
    var(--ezra-ui-control-menu-row-heading, var(--text-color))
  );
  font-family: var(--header-font);
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.ezra-ui-control-menu-item:hover,
.ezra-ui-theme-menu-item:hover {
  background: color-mix(
    in srgb,
    var(
      --ezra-ui-theme-picker-item-background,
      var(--ezra-ui-control-menu-row-background, var(--background-color))
    ) 90%,
    var(--ezra-ui-control-menu-row-accent, var(--label-color)) 10%
  );
}

.ezra-ui-control-menu-item-icon,
.ezra-ui-theme-menu-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

.ezra-ui-control-menu-item[aria-checked="true"],
.ezra-ui-theme-menu-item[aria-checked="true"] {
  box-shadow:
    inset 0 0 0 1px var(--ezra-ui-control-menu-row-border, var(--panel-border-strong)),
    inset 0 0 0 2px var(
      --ezra-ui-theme-menu-item-accent,
      var(
        --ezra-ui-theme-picker-menu-item-accent,
        var(
          --ezra-ui-theme-picker-button-accent,
          var(--ezra-ui-control-menu-row-accent, var(--label-color))
        )
      )
    );
}

.ezra-ui-control-menu-item[data-ezra-ui-menu-option-active="true"],
.ezra-ui-theme-menu-item[data-ezra-ui-menu-option-active="true"] {
  background: color-mix(
    in srgb,
    var(
      --ezra-ui-theme-menu-item-accent,
      var(
        --ezra-ui-theme-picker-menu-item-accent,
        var(
          --ezra-ui-theme-picker-button-accent,
          var(--ezra-ui-control-menu-row-accent, var(--label-color))
        )
      )
    ) 12%,
    var(--ezra-ui-control-menu-row-background, transparent)
  );
  box-shadow: inset 0 0 0 2px color-mix(
    in srgb,
    var(
      --ezra-ui-theme-menu-item-accent,
      var(
        --ezra-ui-theme-picker-menu-item-accent,
        var(
          --ezra-ui-theme-picker-button-accent,
          var(--ezra-ui-control-menu-row-accent, var(--label-color))
        )
      )
    ) 54%,
    transparent
  );
}

.ezra-ui-control-menu--compact-text,
.ezra-ui-control-menu--compact-text .ezra-ui-control-menu-item-label,
.ezra-ui-control-menu--compact-text .ezra-ui-theme-menu-item-label,
.ezra-ui-control-menu--compact-text p {
  font-size: 1rem;
  line-height: 1.15;
}

.ezra-ui-control-menu-item-line {
  display: block;
  width: 18px;
  height: 0;
  border-top: 2px solid currentColor;
}

.ezra-ui-theme-menu-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: var(--ezra-ui-theme-menu-icon-size, 18px);
  height: var(--ezra-ui-theme-menu-icon-size, 18px);
}

.ezra-ui-theme-menu-icon svg,
.ezra-ui-theme-menu-icon img,
.ezra-ui-control-menu-item-icon svg,
.ezra-ui-control-menu-item-icon img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
}

.ezra-ui-theme-menu-icon--swatch {
  border: 1px solid var(--panel-border-strong);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 18%, transparent);
}
.ezra-ui-control-button {
  --ezra-ui-control-button-size: var(--ezra-ui-theme-control-button-size-compact, 28px);
  --ezra-ui-control-button-padding-inline: 10px;
  --ezra-ui-control-button-background: transparent;
  --ezra-ui-control-button-border: transparent;
  --ezra-ui-control-button-text: currentColor;
  --ezra-ui-control-button-hover-background: color-mix(
    in srgb,
    var(--background-color) 82%,
    var(--surface-hover) 18%
  );
  --ezra-ui-control-button-hover-text: var(--ezra-ui-control-button-text);
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--ezra-ui-control-button-size);
  width: var(--ezra-ui-control-button-size);
  min-height: var(--ezra-ui-control-button-size);
  height: var(--ezra-ui-control-button-size);
  margin: 0;
  padding: 0 var(--ezra-ui-control-button-padding-inline);
  border: 0;
  background: var(--ezra-ui-control-button-background);
  box-shadow: inset 0 0 0 1px var(--ezra-ui-control-button-border);
  color: var(--ezra-ui-control-button-text);
  font-family: var(--header-font);
  cursor: pointer;
  pointer-events: auto;
  box-sizing: border-box;
  transition:
    color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    opacity var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    background-color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    box-shadow var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade);
}

.ezra-ui-control-button:hover {
  background: var(--ezra-ui-control-button-hover-background);
  color: var(--ezra-ui-control-button-hover-text);
}

.ezra-ui-control-button:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)),
    inset 0 0 0 1px color-mix(
      in srgb,
      var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)) 18%,
      transparent
    );
}

.ezra-ui-control-button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.ezra-ui-control-button--icon {
  padding-inline: 0;
  line-height: 0;
}

.ezra-ui-control-button--corner {
  --ezra-ui-control-button-background: color-mix(
    in srgb,
    var(--panel-color) 84%,
    var(--background-color) 16%
  );
  --ezra-ui-control-button-border: var(--panel-border-strong);
}

.ezra-ui-control-popup-surface {
  position: relative;
  z-index: var(--ezra-ui-layer-control-popup, var(--ezra-ui-layer-workspace-dropdown, 60));
  border: 1px solid var(--ezra-ui-control-popup-border, var(--panel-border-strong));
  background: var(
    --ezra-ui-control-popup-background,
    color-mix(in srgb, var(--background-color) 96%, var(--quote-background-color) 4%)
  );
  box-shadow: var(--ezra-ui-control-popup-shadow, 0 10px 24px rgba(0, 0, 0, 0.28));
  backdrop-filter: var(--ezra-ui-control-popup-backdrop, none);
  box-sizing: border-box;
}

.ezra-ui-control-popup-window {
  position: relative;
  width: min(
    var(--ezra-ui-control-popup-window-width, var(--ezra-ui-theme-control-popup-window-width, 264px)),
    calc(100vw - 24px)
  );
  max-width: calc(100vw - 24px);
}

.ezra-ui-picker {
  position: relative;
}

.ezra-ui-picker--utility-row .ezra-ui-label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.ezra-ui-picker-results {
  display: grid;
  gap: 6px;
  max-height: var(--ezra-ui-picker-results-max-height, min(62dvh, 24rem));
  padding: var(--ezra-ui-picker-results-padding, 8px);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.ezra-ui-picker--utility-row .ezra-ui-picker-results {
  max-height: none;
}

.ezra-ui-picker-option,
.ezra-ui-picker-empty {
  min-width: 0;
  padding: 10px 12px;
  box-sizing: border-box;
}

.ezra-ui-picker-option {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--ezra-ui-picker-option-gap, 2px);
  border: 1px solid var(--ezra-ui-picker-option-border, var(--panel-border));
  background: var(
    --ezra-ui-picker-option-background,
    color-mix(in srgb, var(--background-color) 92%, var(--surface-quiet) 8%)
  );
  color: var(--text-color);
  text-align: left;
  font-family: var(--body-font);
  font-size: 1rem;
  line-height: 1.4;
  cursor: pointer;
}

.ezra-ui-picker-option:hover,
.ezra-ui-picker-option.is-active {
  border-color: var(--ezra-ui-picker-option-active-border, var(--panel-border-strong));
  background: var(
    --ezra-ui-picker-option-active-background,
    color-mix(in srgb, var(--surface-hover) 72%, var(--background-color) 28%)
  );
}

.ezra-ui-picker-option-label,
.ezra-ui-picker-option-meta {
  min-width: 0;
  overflow-wrap: anywhere;
}

.ezra-ui-picker-option-label {
  overflow: hidden;
  color: var(--ezra-ui-picker-option-label-color, var(--header-color));
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--header-font);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  line-height: 1.1;
  text-transform: uppercase;
}

.ezra-ui-picker-option-meta,
.ezra-ui-picker-empty {
  color: var(--muted-color);
  font-size: 0.92rem;
  line-height: 1.25;
}

.ezra-ui-date-picker-input-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: stretch;
}

.ezra-ui-date-picker-toggle {
  min-width: 72px;
  min-height: 44px;
  padding: 0 14px;
}

.ezra-ui-date-picker-popover {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: var(--ezra-ui-layer-control-popup, var(--ezra-ui-layer-workspace-dropdown, 60));
  display: grid;
  gap: 10px;
  width: min(320px, calc(100vw - 32px));
  padding: 12px;
}

.ezra-ui-date-picker-header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.ezra-ui-date-picker-month {
  min-width: 0;
  color: var(--header-color);
  font-family: var(--header-font);
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-align: center;
  text-transform: uppercase;
}

.ezra-ui-date-picker-weekdays,
.ezra-ui-date-picker-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 4px;
}

.ezra-ui-date-picker-weekdays span {
  color: var(--muted-color);
  font-family: var(--header-font);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-align: center;
  text-transform: uppercase;
}

.ezra-ui-date-picker-day {
  appearance: none;
  min-height: 38px;
  padding: 0;
  border: 1px solid var(--panel-border);
  background: color-mix(in srgb, var(--background-color) 92%, var(--surface-quiet) 8%);
  color: var(--text-color);
  cursor: pointer;
  font: inherit;
}

.ezra-ui-date-picker-day:hover {
  background: color-mix(in srgb, var(--surface-hover) 72%, var(--background-color) 28%);
  border-color: var(--panel-border-strong);
}

.ezra-ui-date-picker-day.is-outside-month {
  color: var(--muted-color);
  opacity: 0.72;
}

.ezra-ui-date-picker-day.is-today {
  box-shadow: inset 0 0 0 1px var(--label-color);
}

.ezra-ui-date-picker-day.is-selected {
  background: var(--button-background-color);
  border-color: var(--button-background-color);
  color: var(--button-text-color);
}

.ezra-ui-date-picker-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.ezra-ui-control-trigger {
  position: relative;
  min-width: 0;
  -webkit-tap-highlight-color: transparent;
}

.ezra-ui-control-trigger-label,
.ezra-ui-control-trigger-icon {
  position: relative;
  z-index: 1;
}

.ezra-ui-control-trigger-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.ezra-ui-control-trigger-icon svg {
  display: block;
  width: 18px;
  height: 18px;
  transition: transform var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-control-trigger.is-open .ezra-ui-control-trigger-icon svg {
  transform: rotate(var(--ezra-surface-motion-chevron-turn));
}

.ezra-ui-control-trigger--mobile-surface {
  --ezra-ui-control-trigger-icon-top: 1px;
  --ezra-ui-control-trigger-icon-right: 1px;
  --ezra-ui-control-trigger-icon-bottom: 1px;
  --ezra-ui-control-trigger-icon-width: 45px;
  --ezra-ui-control-trigger-open-border: var(--panel-border-strong);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 50px;
  padding: 11px 12px 10px;
  border: 0;
  overflow: hidden;
  font-family: var(--header-font);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1;
  text-transform: uppercase;
}

.ezra-ui-control-trigger--mobile-surface .ezra-ui-control-trigger-label {
  display: block;
  width: 100%;
  min-width: 0;
  text-align: center;
  pointer-events: none;
  opacity: 1;
  visibility: visible;
  transition: opacity var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-control-trigger--mobile-surface.is-open .ezra-ui-control-trigger-label {
  opacity: 0;
  visibility: hidden;
}

.ezra-ui-control-trigger--with-chevron {
  padding-right: 45px;
}

.ezra-ui-control-trigger--with-chevron .ezra-ui-control-trigger-icon {
  position: absolute;
  top: var(--ezra-ui-control-trigger-icon-top);
  right: var(--ezra-ui-control-trigger-icon-right);
  bottom: var(--ezra-ui-control-trigger-icon-bottom);
  width: var(--ezra-ui-control-trigger-icon-width);
  opacity: 1;
  font-size: 0.9rem;
  line-height: 1;
  background: transparent;
}

.ezra-ui-control-trigger--mobile-surface.is-open {
  background: transparent;
  color: inherit;
  box-shadow: inset 0 0 0 1px var(--ezra-ui-control-trigger-open-border);
}

.ezra-ui-control-drawer {
  position: relative;
  display: grid;
  grid-template-rows: 0fr;
  min-width: 0;
  margin-top: -1px;
  overflow: hidden;
  opacity: 0;
  transition:
    grid-template-rows var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard),
    opacity var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-control-drawer.is-open {
  grid-template-rows: 1fr;
  overflow: visible;
  opacity: 1;
  pointer-events: auto;
}

.ezra-ui-control-drawer.is-closed {
  grid-template-rows: 0fr;
  opacity: 0;
  pointer-events: none;
}

.ezra-ui-control-drawer-inner {
  display: grid;
  min-height: 0;
  overflow: hidden;
  opacity: 0;
  transform: translateY(calc(var(--ezra-surface-motion-surface-shift) * -1));
  transition:
    opacity var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard),
    transform var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-control-drawer.is-open .ezra-ui-control-drawer-inner {
  overflow: visible;
  opacity: 1;
  transform: translateY(0);
}

.ezra-ui-control-drawer.is-closed .ezra-ui-control-drawer-inner {
  opacity: 0;
  transform: translateY(calc(var(--ezra-surface-motion-surface-shift) * -1));
}

.ezra-ui-control-reveal-host {
  position: relative;
  display: grid;
  gap: 0;
  width: 100%;
  min-width: 0;
}

.ezra-ui-control-reveal-host > .ezra-ui-control-trigger--mobile-surface {
  position: relative;
  z-index: 1;
}

.ezra-ui-toolbar {
  position: relative;
  z-index: var(--ezra-ui-layer-workspace-filter, 20);
  display: grid;
  grid-template-columns: minmax(0, 2fr) repeat(2, minmax(0, 1fr)) auto;
  grid-auto-flow: column;
  gap: 14px;
  align-items: end;
  margin: 0;
  min-width: 0;
  overflow: visible;
}

.ezra-ui-toolbar:has(.ezra-ui-control-menu:not([hidden])),
.ezra-ui-toolbar:has(.ezra-ui-date-picker-popover:not([hidden])) {
  z-index: var(--ezra-ui-layer-workspace-dropdown, 60);
}

.ezra-ui-toolbar:has(> :nth-child(3):last-child) {
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) auto;
}

.ezra-ui-toolbar:has(> :nth-child(2):last-child),
.ezra-ui-toolbar--search-only {
  grid-template-columns: minmax(0, 1fr) auto;
}

.ezra-ui-toolbar--search-only > .ezra-ui-toolbar-group--search {
  width: 100%;
}

.ezra-ui-toolbar--search-only > .ezra-ui-toolbar-group--button {
  margin-left: 0;
}

.ezra-ui-toolbar-group {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.ezra-ui-toolbar-group--button {
  display: flex;
  flex-direction: column;
  justify-content: end;
}

.ezra-ui-toolbar-action-button {
  width: 100%;
  height: 46px;
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.ezra-ui-toolbar .ezra-ui-input {
  min-height: 46px;
  height: 46px;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  line-height: 1.35;
}

.ezra-ui-toolbar .ezra-ui-input:is(select) {
  padding-top: 10px;
  padding-right: 42px;
  padding-bottom: 10px;
}

.ezra-ui-toolbar .ezra-ui-input[type="search"],
.ezra-ui-toolbar .ezra-ui-input:is(select) {
  -webkit-appearance: none;
  appearance: none;
}

.ezra-ui-toolbar .ezra-ui-input[type="search"] {
  border-radius: 0;
}

.ezra-ui-toolbar .ezra-ui-input[type="search"]::-webkit-search-decoration,
.ezra-ui-toolbar .ezra-ui-input[type="search"]::-webkit-search-cancel-button,
.ezra-ui-toolbar .ezra-ui-input[type="search"]::-webkit-search-results-button,
.ezra-ui-toolbar .ezra-ui-input[type="search"]::-webkit-search-results-decoration {
  -webkit-appearance: none;
}

.ezra-ui-toolbar .ezra-ui-label {
  color: var(--text-color);
  font-family: var(--body-font);
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: none;
}

.ezra-ui-search-input-wrap {
  position: relative;
  width: 100%;
}

.ezra-ui-search-input-wrap .ezra-ui-input[type="search"] {
  padding-right: 42px;
}

.ezra-ui-search-clear-button {
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--label-color);
  cursor: pointer;
  font-family: var(--body-font);
  font-size: 2rem;
  line-height: 1;
}

.ezra-ui-search-clear-button:hover {
  color: var(--text-color);
}

.ezra-ui-search-clear-button:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--focus-ring);
}

.ezra-ui-filter-toolbar-shell {
  position: relative;
  z-index: var(--ezra-ui-layer-workspace-filter, 20);
  display: none;
}

.ezra-ui-filter-toolbar-shell:has(.ezra-ui-control-drawer.is-open),
.ezra-ui-filter-toolbar-shell:has(.ezra-ui-control-menu:not([hidden])) {
  z-index: var(--ezra-ui-layer-workspace-dropdown, 60);
}

.ezra-ui-filter-toolbar-button {
  height: 46px;
  min-height: 46px;
}

.ezra-ui-filter-toolbar-menu {
  max-height: min(60dvh, 28rem);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.ezra-ui-filter-toolbar-menu .ezra-ui-control-menu-item {
  font-family: var(--body-font);
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: none;
}

.ezra-ui-filter-toolbar-menu .ezra-ui-control-menu-item[aria-checked="true"] {
  background: color-mix(
    in srgb,
    var(--ezra-ui-control-menu-row-accent, var(--label-color)) 7%,
    var(--ezra-ui-control-menu-row-background, transparent)
  );
  box-shadow: inset 0 0 0 1px color-mix(
    in srgb,
    var(--ezra-ui-control-menu-row-accent, var(--label-color)) 32%,
    transparent
  );
}

.ezra-ui-filter-toolbar-menu .ezra-ui-control-menu-item.is-typeahead-active,
.ezra-ui-filter-toolbar-menu .ezra-ui-control-menu-item[data-ezra-ui-filter-typeahead-active="true"] {
  background: color-mix(
    in srgb,
    var(--ezra-ui-control-menu-row-accent, var(--label-color)) 12%,
    var(--ezra-ui-control-menu-row-background, transparent)
  );
  box-shadow: inset 0 0 0 2px color-mix(
    in srgb,
    var(--ezra-ui-control-menu-row-accent, var(--label-color)) 54%,
    transparent
  );
}

.ezra-ui-tabs {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--ezra-ui-tabs-gap, 8px);
}

.ezra-ui-tabs--toolbar {
  margin-left: auto;
}

.ezra-ui-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 10px 16px;
  appearance: none;
  border: 0;
  background: transparent;
  color: var(
    --ezra-ui-tab-text,
    color-mix(in srgb, var(--text-color) 84%, var(--muted-color) 16%)
  );
  box-shadow: inset 0 0 0 1px var(
    --ezra-ui-tab-border,
    color-mix(in srgb, var(--panel-border) 82%, transparent)
  );
  cursor: pointer;
  font-family: var(--header-font);
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 0.04em;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
  box-sizing: border-box;
  transition:
    background-color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    box-shadow var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    opacity var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade);
}

.ezra-ui-tab:hover {
  background: var(
    --ezra-ui-tab-hover-background,
    color-mix(in srgb, var(--surface-hover) 82%, var(--surface-quiet) 18%)
  );
}

.ezra-ui-tab.is-active,
.ezra-ui-tab[aria-selected="true"] {
  background: var(--ezra-ui-tab-active-background, var(--button-background-color));
  color: var(--ezra-ui-tab-active-text, var(--button-text-color));
  box-shadow: inset 0 0 0 1px var(
    --ezra-ui-tab-active-border,
    color-mix(in srgb, var(--border-color) 84%, transparent)
  );
}

.ezra-ui-tab:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring),
    inset 0 0 0 1px color-mix(in srgb, var(--focus-ring) 18%, transparent);
}

.ezra-ui-tab:disabled {
  cursor: not-allowed;
  opacity: 0.54;
}

.ezra-ui-data-table {
  display: grid;
  min-width: 0;
  border: 1px solid var(--panel-border);
  background: var(--surface-quiet);
}

.ezra-ui-data-table-row {
  display: grid;
  grid-template-columns: var(--ezra-ui-data-table-columns, minmax(0, 1fr));
  gap: var(--ezra-ui-row-gap);
  align-items: center;
  min-width: 0;
  padding: var(--ezra-ui-row-gap-loose, var(--ezra-ui-card-padding-compact, 12px));
  border-top: 1px solid var(--panel-border);
}

.ezra-ui-data-table-row:first-child,
.ezra-ui-data-table-details-row:first-of-type .ezra-ui-data-table-row {
  border-top: 0;
}

.ezra-ui-data-table-header {
  color: var(--muted-color);
  font-family: var(--header-font);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.1;
  text-transform: uppercase;
  background: var(--surface-color, var(--surface-quiet));
}

.ezra-ui-data-table-row > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ezra-ui-data-table-details-row {
  display: block;
  min-width: 0;
}

.ezra-ui-data-table-details-row summary {
  cursor: pointer;
  list-style: none;
  transition: background var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-data-table-details-row summary:hover,
.ezra-ui-data-table-details-row[open] summary {
  background: color-mix(in srgb, var(--panel-border) 12%, transparent);
}

.ezra-ui-data-table-details-row summary::-webkit-details-marker {
  display: none;
}

.ezra-ui-data-table-details-panel {
  display: grid;
  gap: var(--ezra-ui-row-gap-loose, 12px);
  padding: var(--ezra-ui-card-padding, 16px);
  border-top: 1px solid var(--panel-border);
  background: color-mix(in srgb, var(--surface-quiet) 82%, var(--surface-color, var(--panel-color)));
}

.ezra-ui-data-table-disclosure {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: end;
  width: 28px;
  height: 28px;
  min-width: 28px;
  padding: 0;
  border: 1px solid var(--button-border, var(--panel-border));
  background: var(--surface-color, var(--surface-quiet));
  color: var(--text-color);
  line-height: 1;
}

.ezra-ui-data-table-disclosure-icon {
  display: inline-grid;
  place-items: center;
  width: 14px;
  height: 14px;
}

.ezra-ui-data-table-disclosure-close {
  display: none;
}

.ezra-ui-data-table-details-row[open] .ezra-ui-data-table-disclosure-open {
  display: none;
}

.ezra-ui-data-table-details-row[open] .ezra-ui-data-table-disclosure-close {
  display: inline;
}

.ezra-ui-mobile-navigation-toggle {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 40px;
  margin: 0;
  padding: 10px 16px;
  gap: 16px;
  border: 1px solid var(--panel-border);
  background: var(--surface-quiet);
  color: var(--ezra-ui-mobile-list-toggle-text, var(--text-color));
  box-shadow: none;
  font-family: var(--header-font);
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
  cursor: default;
  pointer-events: none;
  box-sizing: border-box;
  transition:
    background-color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    box-shadow var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    opacity var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade);
}

.ezra-ui-mobile-navigation-toggle > :first-child {
  flex: 1 1 auto;
  min-width: 0;
  text-align: left;
}

.ezra-ui-mobile-navigation-toggle-meta {
  flex: 0 0 auto;
  margin-left: auto;
  color: var(--ezra-ui-mobile-list-toggle-meta, var(--muted-color));
  font-family: var(--body-font);
  font-size: 0.86rem;
  line-height: 1rem;
  font-weight: 400;
  text-align: right;
}

.ezra-ui-mobile-navigation-toggle:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)),
    inset 0 0 0 1px color-mix(
      in srgb,
      var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)) 18%,
      transparent
    );
}

.ezra-ui-mobile-navigation-toggle:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

@media (max-width: 860px) {
  .ezra-ui-mobile-navigation-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    min-height: 42px;
    width: 100%;
    padding: 11px 12px;
    margin: 0;
    gap: 12px;
    background: var(--panel-color);
    color: var(--text-color);
    border: 1px solid var(--panel-border);
    box-shadow: none;
    cursor: pointer;
    pointer-events: auto;
  }

  .ezra-ui-mobile-navigation-toggle-meta {
    color: var(--muted-color);
    font-size: 0.92rem;
  }
}

.ezra-ui-item-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.ezra-ui-item-list-row {
  margin: 0;
}

.ezra-ui-item-list-row--with-actions {
  position: relative;
  container-type: inline-size;
}

.ezra-ui-item-list-button {
  display: block;
  width: 100%;
  padding: var(--ezra-ui-item-list-button-padding, 14px 18px);
  border: 0;
  background: var(--ezra-ui-item-list-button-background, transparent);
  color: var(--ezra-ui-item-list-button-text, inherit);
  text-align: left;
  box-shadow: inset 0 -1px 0 var(--ezra-ui-item-list-button-border, var(--panel-border));
  cursor: pointer;
  transition:
    background-color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-standard),
    box-shadow var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-item-list-button--with-row-actions {
  padding-inline-end: var(--ezra-ui-item-list-row-action-reserve, clamp(72px, 32cqi, 96px));
}

.ezra-ui-item-list-row-actions {
  position: absolute;
  inset-inline-end: var(--ezra-ui-item-list-row-action-inset-inline, 10px);
  inset-block-end: var(--ezra-ui-item-list-row-action-inset-block, 10px);
  z-index: 2;
  display: flex;
  justify-content: flex-end;
  max-inline-size: min(42cqi, var(--ezra-ui-item-list-row-action-max-inline-size, 96px));
  pointer-events: auto;
}

.ezra-ui-item-list-row-actions .ezra-ui-repeater-standard-actions {
  flex-wrap: nowrap;
  gap: var(--ezra-ui-item-list-row-action-gap, clamp(4px, 2cqi, 8px));
}

.ezra-ui-item-list-row-actions .ezra-ui-repeater-icon-button {
  inline-size: var(--ezra-ui-item-list-row-action-button-size, clamp(1.65rem, 12cqi, 2.1rem));
  min-inline-size: 0;
  padding-inline: 0;
}

.ezra-ui-item-list-button:hover,
.ezra-ui-item-list-button.is-active,
.ezra-ui-item-list-row.is-active .ezra-ui-item-list-button {
  background: var(--ezra-ui-item-list-button-hover-background, var(--surface-quiet));
}

.ezra-ui-item-list-row.is-active .ezra-ui-item-list-button {
  box-shadow:
    inset 3px 0 0 var(--ezra-ui-item-list-active-marker, var(--input-highlight-color)),
    inset 0 -1px 0 var(--ezra-ui-item-list-button-border, var(--panel-border));
}

.ezra-ui-item-list-button:focus-visible {
  outline: none;
  box-shadow:
    inset 0 0 0 2px var(--focus-ring),
    inset 0 -1px 0 var(--ezra-ui-item-list-button-border, var(--panel-border));
}

.ezra-ui-item-list-row:first-child .ezra-ui-item-list-button:focus-visible {
  box-shadow:
    inset 0 0 0 2px var(--focus-ring),
    inset 0 -1px 0 var(--ezra-ui-item-list-button-border, var(--panel-border));
}

.ezra-ui-item-list-title {
  display: block;
  margin: 0 0 6px;
  color: var(--ezra-ui-item-list-title-color, var(--h1-color));
  font-family: var(--header-font);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: normal;
  line-height: 1.15rem;
  text-transform: none;
}

.ezra-ui-item-list-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0 0;
}

.ezra-ui-item-list-excerpt {
  display: block;
  margin: 0 0 8px;
  color: var(--ezra-ui-item-list-excerpt-color, var(--muted-color));
  font-family: var(--body-font);
  font-size: 0.96rem;
  font-weight: 400;
  letter-spacing: normal;
  line-height: 1.28rem;
  text-transform: none;
}

.ezra-ui-item-list-detail {
  display: block;
  margin: 0;
  color: var(--ezra-ui-item-list-detail-color, var(--muted-color));
  font-family: var(--header-font);
  font-size: 0.78rem;
  font-style: normal;
  letter-spacing: 0.03em;
  line-height: 1rem;
  text-transform: uppercase;
}

.ezra-ui-item-list-empty {
  padding: 18px;
  color: var(--ezra-ui-item-list-empty-color, var(--muted-color));
  font-family: var(--body-font);
  font-size: var(--ezra-ui-item-list-empty-font-size, 1rem);
  font-weight: 400;
  line-height: var(--ezra-ui-item-list-empty-line-height, 1.4);
}

.ezra-ui-split-trigger-shell {
  position: relative;
  display: block;
  z-index: 1;
  width: 100%;
  min-width: 0;
}

.ezra-ui-split-trigger-button,
.ezra-ui-split-trigger-chevron {
  appearance: none;
  border: 0;
  cursor: pointer;
  box-sizing: border-box;
  background: var(--ezra-ui-split-trigger-surface, var(--surface-quiet));
  color: var(--ezra-ui-split-trigger-text, var(--text-color));
  transition:
    background-color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    border-color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    box-shadow var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    opacity var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    transform var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-split-trigger-button {
  width: 100%;
  min-width: 0;
  min-height: var(--ezra-ui-split-trigger-height, 44px);
  padding: var(
    --ezra-ui-split-trigger-padding,
    var(--ezra-ui-split-trigger-padding-top, 14px)
    var(--ezra-ui-split-trigger-padding-inline-end, 16px)
    var(--ezra-ui-split-trigger-padding-bottom, 12px)
    var(--ezra-ui-split-trigger-padding-inline-start, 16px)
  );
  box-shadow:
    inset 0 0 0 1px var(--ezra-ui-split-trigger-border, var(--panel-border)),
    inset 0 1px 0 var(--ezra-ui-split-trigger-top-highlight, transparent);
  font-family: var(--ezra-ui-split-trigger-font-family, inherit);
  font-size: var(--ezra-ui-split-trigger-font-size, inherit);
  font-weight: var(--ezra-ui-split-trigger-font-weight, inherit);
  line-height: var(--ezra-ui-split-trigger-line-height, inherit);
  letter-spacing: var(--ezra-ui-split-trigger-letter-spacing, inherit);
  text-transform: var(--ezra-ui-split-trigger-text-transform, inherit);
  text-align: var(--ezra-ui-split-trigger-text-align, left);
}

.ezra-ui-split-trigger-chevron {
  font-family: var(--ezra-ui-split-trigger-font-family, var(--header-font));
}

.ezra-ui-split-trigger-shell:hover .ezra-ui-split-trigger-button,
.ezra-ui-split-trigger-shell:hover .ezra-ui-split-trigger-chevron {
  background: var(--ezra-ui-split-trigger-hover-surface, var(--ezra-ui-split-trigger-surface, var(--surface-hover)));
}

.ezra-ui-split-trigger-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
  justify-items: var(--ezra-ui-split-trigger-copy-justify, start);
  padding-right: var(--ezra-ui-split-trigger-copy-offset, 0px);
}

.ezra-ui-split-trigger-message {
  display: block;
  width: 100%;
  min-width: 0;
  color: currentColor;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: 1;
  letter-spacing: inherit;
  text-transform: inherit;
}

.ezra-ui-split-trigger-meta {
  color: color-mix(in srgb, currentColor 78%, transparent);
  font-family: var(--header-font);
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.ezra-ui-split-trigger-chevron {
  position: absolute;
  top: var(--ezra-ui-split-trigger-inset, 0px);
  right: var(--ezra-ui-split-trigger-inset, 0px);
  bottom: auto;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--ezra-ui-split-trigger-chevron-width, 44px);
  min-width: var(--ezra-ui-split-trigger-chevron-width, 44px);
  min-height: var(--ezra-ui-split-trigger-chevron-height, var(--ezra-ui-split-trigger-height, 44px));
  height: calc(100% - (var(--ezra-ui-split-trigger-inset, 0px) * 2));
  padding: 0;
  box-shadow:
    inset 1px 0 0 var(--ezra-ui-split-trigger-divider, var(--panel-border)),
    inset 0 1px 0 var(--ezra-ui-split-trigger-top-highlight, transparent);
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.ezra-ui-split-trigger-button:focus-visible,
.ezra-ui-split-trigger-chevron:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--focus-ring);
}

.ezra-ui-split-trigger-chevron-icon {
  display: block;
  width: 18px;
  height: 18px;
}

.ezra-ui-split-trigger-chevron-icon path {
  transform-origin: 50% 50%;
  transition: transform var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-split-trigger-chevron-icon.is-open path {
  transform: rotate(var(--ezra-surface-motion-chevron-turn));
}

@media (max-width: 1180px) {
  .ezra-ui-toolbar,
  .ezra-ui-toolbar:has(> :nth-child(3):last-child) {
    grid-template-columns: minmax(0, 1.6fr) repeat(2, minmax(10rem, 1fr)) auto;
    gap: 12px;
  }

  .ezra-ui-toolbar:has(> :nth-child(2):last-child),
  .ezra-ui-toolbar--search-only {
    grid-template-columns: minmax(0, 1fr) auto;
  }
}

@media (max-width: 1080px) {
  .ezra-ui-toolbar,
  .ezra-ui-toolbar:has(> :nth-child(3):last-child),
  .ezra-ui-toolbar:has(> :nth-child(2):last-child),
  .ezra-ui-toolbar--search-only {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-flow: row;
    gap: 12px;
    align-items: end;
  }

  .ezra-ui-toolbar-group--button {
    grid-column: 1 / -1;
  }

  .ezra-ui-toolbar-action-button {
    width: 100%;
  }
}

@media (max-width: 860px) {
  .ezra-ui-toolbar,
  .ezra-ui-toolbar:has(> :nth-child(3):last-child),
  .ezra-ui-toolbar:has(> :nth-child(2):last-child),
  .ezra-ui-toolbar--search-only {
    grid-template-columns: minmax(0, 1fr);
    grid-auto-flow: row;
    gap: 12px;
    align-items: stretch;
    min-height: 42px;
  }

  .ezra-ui-toolbar--search-only > .ezra-ui-toolbar-group--search {
    width: 100%;
  }

  .ezra-ui-toolbar--search-only > .ezra-ui-toolbar-group--button {
    margin-left: 0;
  }

  .ezra-ui-toolbar-group,
  .ezra-ui-toolbar-group--mobile-menu {
    gap: 5px;
    min-width: 0;
    width: 100%;
  }

  .ezra-ui-toolbar-group--desktop-only {
    display: none;
  }

  .ezra-ui-toolbar-group--button {
    align-self: stretch;
    justify-content: flex-start;
    width: 100%;
  }

  .ezra-ui-toolbar .ezra-ui-input {
    height: auto;
    min-height: 42px;
  }

  .ezra-ui-toolbar-action-button {
    width: 100%;
    height: auto !important;
    min-height: 42px !important;
    max-height: none !important;
    padding: 10px 18px !important;
  }

  .ezra-ui-filter-toolbar-shell {
    display: grid;
    gap: 0;
    width: 100%;
  }

  .ezra-ui-search-clear-button {
    right: 9px;
  }

  .ezra-ui-filter-toolbar-trigger {
    --ezra-ui-control-trigger-icon-right: 12px;
    --ezra-ui-control-trigger-icon-width: 18px;
    --ezra-ui-control-trigger-open-border: var(
      --ezra-ui-filter-toolbar-trigger-open-border,
      var(--panel-border-strong)
    );
    padding-left: 42px;
    padding-right: 42px;
    background: var(--panel-color);
    color: var(--ezra-ui-filter-toolbar-trigger-text, var(--text-color));
    box-shadow: inset 0 0 0 1px var(--ezra-ui-filter-toolbar-trigger-border, var(--panel-border));
  }

  .ezra-ui-filter-toolbar-trigger::before {
    content: "";
    position: absolute;
    inset: 1px;
    z-index: 0;
    opacity: 0;
    transform: translateY(0);
    background: color-mix(in srgb, var(--input-highlight-color) 36%, var(--label-color) 64%);
    transition:
      opacity var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard),
      transform var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard),
      background-color var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-fade);
    pointer-events: none;
  }

  .ezra-ui-filter-toolbar-trigger.is-open::before {
    transform: translateY(100%);
  }

  .ezra-ui-filter-toolbar-trigger-label {
    min-width: 0;
    flex: 0 1 auto;
  }

  .ezra-ui-filter-toolbar-trigger-icon {
    box-shadow: none;
  }

  .ezra-ui-filter-toolbar-drawer {
    position: relative;
  }

  .ezra-ui-filter-toolbar-drawer-inner {
    gap: 8px;
    padding: 10px 2px 2px;
  }

}

@media (max-width: 720px) {
  .ezra-ui-tabs {
    width: 100%;
    gap: var(--ezra-ui-tabs-mobile-gap, 6px);
  }

  .ezra-ui-tabs--toolbar {
    order: -1;
    width: 100%;
    margin-left: 0;
  }

  .ezra-ui-tab {
    flex: 1 1 0;
    min-height: 40px;
    padding: 8px 10px;
    font-size: 0.88rem;
  }

  .ezra-ui-data-table {
    --ezra-ui-data-table-mobile-columns: minmax(0, 1fr) auto;
  }

  .ezra-ui-data-table-header {
    display: none;
  }

  .ezra-ui-data-table-row {
    grid-template-columns: var(--ezra-ui-data-table-mobile-columns);
    gap: var(--ezra-ui-row-gap-compact) var(--ezra-ui-row-gap);
    align-items: center;
  }

  .ezra-ui-data-table-row > span {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
  }

  .ezra-ui-data-table-disclosure {
    width: 40px;
    height: 40px;
    min-width: 40px;
  }
}

.ezra-ui-app-header {
  display: block;
  margin: 0;
  overflow: visible;
}

.ezra-ui-app-header-main {
  --ezra-ui-app-header-menu-size: var(--ezra-ui-app-header-menu-control-size, var(--ezra-app-surface-header-menu-control-size, 28px));
  --ezra-ui-app-header-menu-window-measure: var(
    --ezra-ui-app-header-menu-window-width,
    min(264px, calc(100vw - 24px))
  );
  --ezra-ui-app-header-menu-edge-inset: var(--ezra-ui-app-header-menu-inset, var(--ezra-app-surface-header-menu-inset, 12px));
  --ezra-ui-app-header-control-row-min-height: var(
    --ezra-ui-app-header-theme-control-row-min-height,
    calc(var(--ezra-ui-app-header-menu-size) + var(--ezra-ui-app-header-menu-edge-inset))
  );
  --ezra-ui-app-header-title-measure: var(--ezra-ui-app-header-measure, min(520px, 58vw));
  --ezra-ui-app-header-kicker-color: var(--ezra-ui-app-header-label-color, var(--label-color));
  --ezra-ui-app-header-control-accent: var(--ezra-ui-app-header-kicker-color);
  --ezra-ui-app-header-badge-accent: var(--ezra-ui-app-header-kicker-color);
  --ezra-ui-app-header-band-gap: var(--ezra-ui-app-header-gap, var(--ezra-app-surface-header-copy-gap, clamp(10px, 1.4vw, 14px)));
  --ezra-ui-app-header-title-font-size: var(--ezra-ui-app-header-title-size, var(--ezra-app-surface-header-title-size, clamp(2.3rem, 4.8vw, 3.5rem)));
  --ezra-ui-app-header-title-line-height: var(--ezra-ui-app-header-title-line, var(--ezra-app-surface-header-title-line-height, 0.94));
  --ezra-ui-app-header-title-text-line-height: calc(
    var(--ezra-ui-app-header-title-font-size) * var(--ezra-ui-app-header-title-line-height)
  );
  --ezra-ui-app-header-title-row-min-height: var(
    --ezra-ui-app-header-title-row-height,
    var(--ezra-ui-app-header-title-text-line-height)
  );
  --ezra-ui-app-header-title-badge-gap: var(
    --ezra-ui-app-header-badge-gap,
    clamp(8px, calc(var(--ezra-ui-app-header-title-font-size) * 0.26), 12px)
  );
  --ezra-ui-app-header-badge-height: var(
    --ezra-ui-app-header-mode-badge-height,
    clamp(1.7rem, calc(var(--ezra-ui-app-header-title-font-size) * 0.685), 2.4rem)
  );
  --ezra-ui-app-header-badge-padding-inline: var(
    --ezra-ui-app-header-mode-badge-padding-inline,
    clamp(7px, calc(var(--ezra-ui-app-header-title-font-size) * 0.215), 12px)
  );
  --ezra-ui-app-header-badge-font-size: var(
    --ezra-ui-app-header-mode-badge-font-size,
    clamp(0.68rem, calc(var(--ezra-ui-app-header-title-font-size) * 0.235), 0.82rem)
  );
  --ezra-ui-app-header-title-to-session-gap: var(
    --ezra-ui-app-header-session-gap,
    clamp(16px, 2.2vw, 24px)
  );
  position: relative;
  z-index: 0;
  display: grid;
  gap: var(--ezra-ui-app-header-band-gap);
  width: 100%;
  min-width: 0;
  overflow: visible;
  isolation: isolate;
}

.ezra-ui-app-header-band {
  position: relative;
  width: 100%;
  min-width: 0;
  overflow: visible;
}

.ezra-ui-app-header-band--controls {
  z-index: var(--ezra-ui-layer-header-controls, 120);
  min-height: var(--ezra-ui-app-header-menu-size);
}

.ezra-ui-app-header-band--controls:has(.ezra-ui-app-header-menu-shell.is-open) {
  z-index: var(--ezra-ui-layer-header-menu-open, 140);
}

.ezra-ui-app-header-band--identity {
  z-index: var(--ezra-ui-layer-header-identity, 110);
  display: grid;
  gap: calc(var(--ezra-ui-app-header-band-gap) - 2px);
}

.ezra-ui-app-header-band--session {
  z-index: var(--ezra-ui-layer-header-session, 100);
  padding-top: var(--ezra-ui-app-header-title-to-session-gap);
  padding-bottom: 0;
}

.ezra-ui-app-header-kicker {
  margin: 0;
  color: var(--ezra-ui-app-header-kicker-color);
  font-family: var(--header-font);
  font-size: 1rem;
  line-height: 1.05rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.ezra-ui-app-header-kicker-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  min-height: var(--ezra-ui-app-header-control-row-min-height);
  margin: 0;
  padding-right: 0;
}

.ezra-ui-app-header-kicker-row > .ezra-ui-app-header-kicker {
  min-width: 0;
}

.ezra-ui-app-header-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  column-gap: 12px;
  min-height: var(--ezra-ui-app-header-control-row-min-height);
}

.ezra-ui-app-header-controls-slot {
  position: relative;
  justify-self: end;
  align-self: center;
  min-width: 0;
  min-height: var(--ezra-ui-app-header-control-row-min-height);
}

.ezra-ui-app-header-menu-shell {
  --ezra-ui-app-header-menu-size: var(--ezra-ui-app-header-menu-control-size, var(--ezra-app-surface-header-menu-control-size, 28px));
  --ezra-ui-app-header-menu-window-measure: var(
    --ezra-ui-app-header-menu-window-width,
    min(264px, calc(100vw - 24px))
  );
  --ezra-ui-app-header-menu-edge-inset: var(--ezra-ui-app-header-menu-inset, var(--ezra-app-surface-header-menu-inset, 12px));
  --ezra-ui-app-header-control-row-min-height: var(
    --ezra-ui-app-header-theme-control-row-min-height,
    calc(var(--ezra-ui-app-header-menu-size) + var(--ezra-ui-app-header-menu-edge-inset))
  );
  position: relative;
  z-index: var(--ezra-ui-layer-header-controls, 120);
  width: calc(var(--ezra-ui-app-header-menu-size) + (var(--ezra-ui-app-header-menu-edge-inset) * 2));
  min-height: var(--ezra-ui-app-header-control-row-min-height);
  overflow: visible;
}

.ezra-ui-app-header-menu-shell.is-open {
  z-index: var(--ezra-ui-layer-header-menu-open, 140);
}

.ezra-ui-app-header-menu-toggle-shell {
  position: absolute;
  top: 50%;
  right: var(--ezra-ui-app-header-menu-edge-inset);
  z-index: calc(var(--ezra-ui-layer-header-menu-open, 140) + 4);
  transform: translateY(-50%);
}

.ezra-ui-app-header-title-row {
  position: relative;
  display: inline-grid;
  grid-template-columns: minmax(0, max-content) auto;
  align-items: center;
  column-gap: var(--ezra-ui-app-header-title-badge-gap);
  width: fit-content;
  max-width: 100%;
  min-width: 0;
  min-height: var(--ezra-ui-app-header-title-row-min-height);
  margin: 0;
  overflow: visible;
}

.ezra-ui-app-header-title-slot {
  display: flex;
  align-items: center;
  width: auto;
  max-width: 100%;
  min-width: 0;
  min-height: var(--ezra-ui-app-header-title-row-min-height);
}

.ezra-ui-app-header-title-slot--loading {
  position: absolute;
  inset: 0 auto auto 0;
  z-index: 1;
  display: flex;
  align-items: center;
  width: var(--ezra-ui-app-header-title-measure);
  max-width: 100%;
  min-width: 0;
  min-height: var(--ezra-ui-app-header-title-row-min-height);
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
}

.ezra-ui-app-header-title-slot--loading.is-visible {
  opacity: 1;
  visibility: visible;
}

.ezra-ui-app-header-title-slot--loading.is-visible ~ .ezra-ui-app-header-badge-rail {
  visibility: hidden;
}

.ezra-ui-app-header-home-link,
.ezra-ui-app-header-home-link--static {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ezra-ui-app-header-home-link-color, var(--h1-color));
  font-family: var(--title-font);
  font-size: var(--ezra-ui-app-header-title-font-size);
  font-weight: 700;
  line-height: var(--ezra-ui-app-header-title-line-height);
  letter-spacing: 0.02em;
  text-align: left;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
  appearance: none;
  -webkit-appearance: none;
  transition:
    color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    opacity var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade);
}

.ezra-ui-app-header-home-link {
  cursor: pointer;
}

.ezra-ui-app-header-home-link--static {
  cursor: default;
}

.ezra-ui-app-header-home-link:hover {
  opacity: 0.88;
}

.ezra-ui-app-header-home-link:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--focus-ring);
}

.ezra-ui-app-header-badge-rail {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
  min-height: var(--ezra-ui-app-header-title-text-line-height);
}

.ezra-ui-app-header-title-stack {
  display: inline-grid;
  gap: calc(var(--ezra-ui-app-header-band-gap) - 2px);
  width: fit-content;
  max-width: 100%;
  min-width: 0;
}

.ezra-ui-app-header-session-control-row {
  display: grid;
  width: 100%;
  min-width: 0;
  margin-top: 0;
  padding-bottom: 0;
}

.ezra-ui-app-header-title-loading {
  display: grid;
  align-content: start;
  gap: 8px;
  width: 100%;
  max-width: none;
  min-height: var(--ezra-ui-app-header-title-row-min-height);
  background: var(--background-color);
}

.ezra-ui-app-header-title-loading-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 1rem;
  color: var(--text-color);
  font-family: var(--header-font);
  font-size: 0.86rem;
  font-weight: 700;
  line-height: 1rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.ezra-ui-app-header-title-loading-bar {
  width: 100%;
  height: 10px;
  margin: 0;
  border: 1px solid var(--panel-border);
  background: var(--surface-quiet);
  overflow: hidden;
  box-sizing: border-box;
}

.ezra-ui-app-header-title-loading-bar-fill {
  display: block;
  height: 100%;
  background: var(--yellow);
  transition: width var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade);
}

.ezra-ui-app-header-menu-button {
  --ezra-ui-control-button-size: var(--ezra-ui-app-header-menu-size);
  --ezra-ui-control-button-text: var(--ezra-ui-app-header-control-accent);
  --ezra-ui-control-button-hover-text: var(--ezra-ui-app-header-control-accent);
  position: relative;
  z-index: calc(var(--ezra-ui-layer-header-menu, 130) + 1);
  color: var(--ezra-ui-app-header-control-accent);
  box-shadow: none;
  overflow: visible;
}

.ezra-ui-app-header-menu-button,
.ezra-ui-app-header-menu-button .ezra-ui-app-header-menu-icon,
.ezra-ui-app-header-menu-button .ezra-ui-app-header-menu-icon svg {
  color: var(--ezra-ui-app-header-control-accent);
}

.ezra-ui-app-header-menu-button:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring),
    inset 0 0 0 1px color-mix(in srgb, var(--focus-ring) 18%, transparent);
}

.ezra-ui-app-header-menu-icon {
  display: inline-grid;
  place-items: center;
  width: 16px;
  height: 16px;
}

.ezra-ui-app-header-menu-icon-open {
  opacity: 0;
}

.ezra-ui-app-header-menu-button.is-open .ezra-ui-app-header-menu-icon-closed {
  opacity: 0;
}

.ezra-ui-app-header-menu-button.is-open .ezra-ui-app-header-menu-icon-open {
  opacity: 1;
}

.ezra-ui-app-header-menu {
  position: absolute;
  top: 0;
  right: 0;
  z-index: calc(var(--ezra-ui-layer-header-menu-open, 140) + 2);
  display: grid;
  justify-items: end;
  width: var(--ezra-ui-app-header-menu-window-measure);
  max-width: min(var(--ezra-ui-app-header-menu-window-measure), calc(100vw - 24px));
  margin: 0;
  pointer-events: none;
}

.ezra-ui-app-header-menu.is-closed {
  display: none;
}

.ezra-ui-app-header-menu.is-open {
  display: grid;
  pointer-events: auto;
  visibility: visible;
}

.ezra-ui-app-header-menu .ezra-ui-control-popup-window {
  width: var(--ezra-ui-app-header-menu-window-measure);
  max-width: min(var(--ezra-ui-app-header-menu-window-measure), calc(100vw - 24px));
}

.ezra-ui-app-header-menu > .ezra-ui-control-popup-window > .ezra-ui-control-popup-surface {
  --ezra-ui-control-popup-background: var(
    --ezra-ui-app-header-menu-panel-background,
    color-mix(in srgb, var(--panel-color) 88%, var(--background-color) 12%)
  );
  --ezra-ui-control-popup-shadow: 0 14px 30px color-mix(in srgb, var(--background-color) 22%, transparent);
  --ezra-ui-control-popup-backdrop: var(--ezra-ui-app-header-menu-panel-backdrop, blur(10px));
  position: relative;
  z-index: calc(var(--ezra-ui-layer-header-menu-open, 140) + 3);
  display: grid;
  gap: 8px;
  width: var(--ezra-ui-app-header-menu-window-measure);
  min-width: 0;
  max-width: min(var(--ezra-ui-app-header-menu-window-measure), calc(100vw - 24px));
  padding:
    var(--ezra-ui-app-header-menu-panel-block-start, var(--ezra-ui-app-header-menu-edge-inset))
    var(--ezra-ui-app-header-menu-edge-inset)
    var(--ezra-ui-app-header-menu-edge-inset);
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transform: translateY(calc(var(--ezra-surface-motion-surface-shift) * -1));
  transform-origin: top right;
  transition:
    max-height var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard),
    opacity var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard),
    transform var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard),
    visibility 0s linear var(--ezra-surface-motion-duration-surface);
}

.ezra-ui-app-header-menu.is-open > .ezra-ui-control-popup-window > .ezra-ui-control-popup-surface {
  height: auto;
  max-height: var(--ezra-ui-app-header-menu-panel-max-height, calc(100svh - 24px));
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  transition:
    max-height var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard),
    opacity var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard),
    transform var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard),
    visibility 0s linear 0s;
}

.ezra-ui-app-header-menu-shell.is-open .ezra-ui-app-header-menu > .ezra-ui-control-popup-window > .ezra-ui-control-popup-surface {
  height: auto;
  max-height: var(--ezra-ui-app-header-menu-panel-max-height, calc(100svh - 24px));
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

.ezra-ui-app-header-menu .ezra-ui-theme-picker,
.ezra-ui-app-header-menu-controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  justify-items: stretch;
  gap: 4px;
  justify-self: stretch;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.ezra-ui-app-header-menu .ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu-shell,
.ezra-ui-app-header-menu .ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu-button {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.ezra-ui-app-header-menu .ezra-ui-app-header-auth-controls,
.ezra-ui-app-header-menu .ezra-ui-app-header-status,
.ezra-ui-app-header-menu .ezra-ui-app-header-auth-action {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.ezra-ui-app-header-menu .ezra-ui-theme-menu-shell {
  position: relative;
  z-index: calc(var(--ezra-ui-layer-header-menu, 130) + 4);
  overflow: visible;
}

.ezra-ui-app-header-menu .ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu,
.ezra-ui-app-header-menu .ezra-ui-theme-menu-shell > .ezra-ui-control-popup-surface.ezra-ui-theme-menu {
  position: static;
  top: auto;
  right: auto;
  left: auto;
  z-index: calc(var(--ezra-ui-layer-header-menu, 130) + 5);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  max-height: var(
    --ezra-ui-app-header-theme-menu-max-height,
    calc(
      var(--ezra-ui-app-header-menu-panel-max-height, calc(100svh - 24px))
      - var(--ezra-ui-app-header-theme-menu-reserved-height, 148px)
    )
  );
  margin-top: 4px;
  align-content: start;
  overflow-y: auto;
  overscroll-behavior: contain;
  box-shadow: none;
}

.ezra-ui-app-header-auth-controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  gap: 6px;
  width: 100%;
  min-width: 0;
}

.ezra-ui-app-header-status {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  max-width: 100%;
  min-height: var(--ezra-ui-app-header-status-min-height, 44px);
  padding:
    var(--ezra-ui-app-header-status-padding-block, 10px)
    var(--ezra-ui-app-header-status-padding-inline, 12px);
  border: 1px solid var(--panel-border-strong);
  background: color-mix(in srgb, var(--panel-color) 88%, var(--background-color) 12%);
  box-sizing: border-box;
  color: inherit;
  font-family: var(--header-font);
  font-size: var(--ezra-ui-app-header-status-font-size, 0.9rem);
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: var(--ezra-ui-app-header-status-line-height, 1.1);
  text-align: center;
  text-transform: uppercase;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  flex-shrink: 1;
}

@media (min-width: 861px) {
  .ezra-ui-app-header-session-control-row {
    width: var(
      --ezra-ui-app-header-session-control-width,
      calc(
      (
          (100% - (var(--ezra-ui-app-header-session-control-gap, 10px) * 3))
          / var(--ezra-ui-app-header-session-control-columns, 4)
      ) * 2
        + var(--ezra-ui-app-header-session-control-gap, 10px)
      )
    );
    max-width: 100%;
  }
}

@media (max-width: 1120px) {
  .ezra-ui-app-header-top {
    column-gap: 10px;
  }

  .ezra-ui-app-header-session-control-row {
    width: 100%;
    max-width: 100%;
  }
}

@media (max-width: 860px) {
  .ezra-ui-app-header {
    position: relative;
    display: grid;
    gap: 0;
  }

  .ezra-ui-app-header > :first-child {
    min-width: 0;
  }

  .ezra-ui-app-header-main {
    --ezra-ui-app-header-menu-window-measure: min(256px, calc(100vw - 24px));
    --ezra-ui-app-header-title-measure: 100%;
    --ezra-ui-app-header-band-gap: 6px;
    --ezra-ui-app-header-title-font-size: clamp(1.4rem, 6.6vw, 1.9rem);
    --ezra-ui-app-header-title-line-height: 0.96;
    --ezra-ui-app-header-title-row-min-height: var(--ezra-ui-app-header-title-text-line-height);
    --ezra-ui-app-header-title-badge-gap: clamp(
      6px,
      calc(var(--ezra-ui-app-header-title-font-size) * 0.28),
      8px
    );
    --ezra-ui-app-header-badge-height: clamp(
      1.2rem,
      calc(var(--ezra-ui-app-header-title-font-size) * 0.78),
      1.7rem
    );
    --ezra-ui-app-header-badge-padding-inline: clamp(
      6px,
      calc(var(--ezra-ui-app-header-title-font-size) * 0.25),
      9px
    );
    --ezra-ui-app-header-badge-font-size: clamp(
      0.58rem,
      calc(var(--ezra-ui-app-header-title-font-size) * 0.3),
      0.72rem
    );
  }

  .ezra-ui-app-header-title-row {
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: var(--ezra-ui-app-header-title-badge-gap);
    width: auto;
    max-width: 100%;
  }

  .ezra-ui-app-header-title-stack {
    width: 100%;
    max-width: 100%;
  }

  .ezra-ui-app-header-title-slot {
    flex: 0 1 auto;
    width: auto;
    max-width: 100%;
  }

  .ezra-ui-app-header-home-link {
    white-space: nowrap;
  }

  .ezra-ui-app-header-badge-rail {
    flex: 0 0 auto;
    justify-content: flex-start;
  }

  .ezra-ui-app-header-session-control-row {
    margin-top: 0;
    padding-bottom: 0;
  }

  .ezra-ui-app-header-status,
  .ezra-ui-app-header-auth-controls .ezra-ui-button {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .ezra-ui-app-header-status {
    justify-content: center;
    min-height: 42px;
    padding: 10px 12px;
    text-align: center;
  }

  .ezra-ui-app-header-auth-controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    width: 100%;
    min-width: 0;
  }
}


.ezra-app-surface {
  --panel-color: var(
    --ezra-app-surface-theme-panel-color,
    color-mix(in srgb, var(--background-color) 88%, var(--quote-background-color) 12%)
  );
  --panel-border: var(
    --ezra-app-surface-theme-panel-border,
    color-mix(in srgb, var(--border-color) 68%, transparent)
  );
  --panel-border-strong: var(
    --ezra-app-surface-theme-panel-border-strong,
    color-mix(in srgb, var(--border-color) 84%, transparent)
  );
  --input-bg: var(
    --ezra-app-surface-theme-input-bg,
    color-mix(in srgb, var(--background-color) 78%, var(--quote-background-color) 22%)
  );
  --muted-color: var(
    --ezra-app-surface-theme-muted-color,
    color-mix(in srgb, var(--text-color) 68%, transparent)
  );
  --surface-quiet: var(
    --ezra-app-surface-theme-surface-quiet,
    color-mix(in srgb, var(--background-color) 68%, var(--quote-background-color) 32%)
  );
  --surface-hover: var(
    --ezra-app-surface-theme-surface-hover,
    color-mix(in srgb, var(--button-background-color) 14%, var(--background-color))
  );
  --focus-ring: var(
    --ezra-app-surface-theme-focus-ring,
    color-mix(in srgb, var(--input-highlight-color) 70%, transparent)
  );
  --ezra-ui-space-2xs: 4px;
  --ezra-ui-space-xs: 8px;
  --ezra-ui-space-sm: 12px;
  --ezra-ui-space-md: 16px;
  --ezra-ui-space-lg: 20px;
  --ezra-ui-space-xl: 24px;
  --ezra-ui-space-2xl: 32px;
  --ezra-ui-space-3xl: 40px;
  --ezra-ui-card-padding: var(--ezra-app-surface-theme-card-padding, clamp(14px, 1.35vw, 18px));
  --ezra-ui-card-padding-compact: var(--ezra-app-surface-theme-card-padding-compact, clamp(12px, 1.1vw, 14px));
  --ezra-ui-grid-gap: var(--ezra-app-surface-theme-grid-gap, clamp(14px, 1.9vw, 20px));
  --ezra-ui-stack-gap: var(--ezra-app-surface-theme-stack-gap, clamp(14px, 1.4vw, 16px));
  --ezra-ui-stack-gap-compact: var(--ezra-app-surface-theme-stack-gap-compact, 12px);
  --ezra-ui-stack-gap-loose: var(--ezra-app-surface-theme-stack-gap-loose, clamp(18px, 2vw, 24px));
  --ezra-ui-row-gap: var(--ezra-app-surface-theme-row-gap, 8px);
  --ezra-ui-row-gap-compact: var(--ezra-app-surface-theme-row-gap-compact, 6px);
  --ezra-ui-row-gap-loose: var(--ezra-app-surface-theme-row-gap-loose, 12px);
  --ezra-ui-field-row-gap: 14px;
  --ezra-ui-layer-workspace: var(--ezra-app-surface-theme-layer-workspace, 10);
  --ezra-ui-layer-workspace-filter: var(--ezra-app-surface-theme-layer-workspace-filter, 20);
  --ezra-ui-layer-workspace-mode: var(--ezra-app-surface-theme-layer-workspace-mode, 30);
  --ezra-ui-layer-workspace-menu: var(--ezra-app-surface-theme-layer-workspace-menu, 40);
  --ezra-ui-layer-workspace-dropdown: var(--ezra-app-surface-theme-layer-workspace-dropdown, 60);
  --ezra-ui-layer-control-popup: var(
    --ezra-app-surface-theme-layer-control-popup,
    var(--ezra-ui-layer-workspace-dropdown, 60)
  );
  --ezra-ui-layer-header: var(--ezra-app-surface-theme-layer-header, 80);
  --ezra-ui-layer-header-session: var(--ezra-app-surface-theme-layer-header-session, 100);
  --ezra-ui-layer-header-identity: var(--ezra-app-surface-theme-layer-header-identity, 110);
  --ezra-ui-layer-header-controls: var(--ezra-app-surface-theme-layer-header-controls, 120);
  --ezra-ui-layer-header-menu: var(--ezra-app-surface-theme-layer-header-menu, 130);
  --ezra-ui-layer-header-menu-open: var(--ezra-app-surface-theme-layer-header-menu-open, 140);
  --ezra-ui-metadata-border: var(--panel-border);
  --ezra-app-surface-header-menu-control-size: var(--ezra-app-surface-theme-header-menu-control-size, 28px);
  --ezra-app-surface-header-menu-inset: var(--ezra-app-surface-theme-header-menu-inset, 12px);
  --ezra-app-surface-header-control-row-min-height: var(
    --ezra-app-surface-theme-header-control-row-min-height,
    calc(var(--ezra-app-surface-header-menu-control-size) + var(--ezra-app-surface-header-menu-inset))
  );
  --ezra-app-surface-header-copy-gap: var(--ezra-app-surface-theme-header-copy-gap, clamp(10px, 1.4vw, 14px));
  --ezra-app-surface-header-eyebrow-font: var(--ezra-app-surface-theme-header-eyebrow-font, var(--header-font));
  --ezra-app-surface-header-eyebrow-size: var(--ezra-app-surface-theme-header-eyebrow-size, 1rem);
  --ezra-app-surface-header-eyebrow-line-height: var(--ezra-app-surface-theme-header-eyebrow-line-height, 1.05rem);
  --ezra-app-surface-header-eyebrow-letter-spacing: var(--ezra-app-surface-theme-header-eyebrow-letter-spacing, 0.1em);
  --ezra-app-surface-header-eyebrow-weight: var(--ezra-app-surface-theme-header-eyebrow-weight, 400);
  --ezra-app-surface-header-title-size: var(
    --ezra-app-surface-theme-header-title-size,
    clamp(2.3rem, 4.8vw, 3.5rem)
  );
  --ezra-app-surface-header-title-line-height: var(--ezra-app-surface-theme-header-title-line-height, 0.94);
  --ezra-app-surface-header-title-letter-spacing: var(--ezra-app-surface-theme-header-title-letter-spacing, 0.02em);
  --ezra-app-surface-mode-focus-title-color: var(
    --ezra-app-surface-theme-mode-focus-title-color,
    var(--h1-color, currentColor)
  );
  --ezra-app-surface-mode-focus-title-font: var(
    --ezra-app-surface-theme-mode-focus-title-font,
    var(--title-font, var(--header-font))
  );
  --ezra-app-surface-mode-focus-title-weight: var(--ezra-app-surface-theme-mode-focus-title-weight, 700);
  --ezra-app-surface-mode-focus-title-size: var(--ezra-app-surface-theme-mode-focus-title-size, 4.9rem);
  --ezra-app-surface-mode-focus-title-line-height: var(--ezra-app-surface-theme-mode-focus-title-line-height, 0.92);
  --ezra-app-surface-mode-focus-title-letter-spacing: var(--ezra-app-surface-theme-mode-focus-title-letter-spacing, 0.04em);
  --ezra-surface-motion-duration-fast: var(--ezra-app-surface-theme-motion-duration-fast, 160ms);
  --ezra-surface-motion-duration-standard: var(--ezra-app-surface-theme-motion-duration-standard, 220ms);
  --ezra-surface-motion-duration-surface: var(--ezra-app-surface-theme-motion-duration-surface, 180ms);
  --ezra-surface-motion-duration-deck: var(--ezra-app-surface-theme-motion-duration-deck, 240ms);
  --ezra-surface-motion-ease-standard: var(--ezra-app-surface-theme-motion-ease-standard, cubic-bezier(0.22, 1, 0.36, 1));
  --ezra-surface-motion-ease-fade: var(--ezra-app-surface-theme-motion-ease-fade, ease);
  --ezra-surface-motion-ease-friction: var(--ezra-app-surface-theme-motion-ease-friction, var(--ezra-surface-motion-ease-standard, cubic-bezier(0.22, 1, 0.36, 1)));
  --ezra-surface-motion-surface-shift: var(--ezra-app-surface-theme-motion-surface-shift, 4px);
  --ezra-surface-motion-deck-shift: var(--ezra-app-surface-theme-motion-deck-shift, 100%);
  --ezra-surface-motion-deck-shift-negative: var(--ezra-app-surface-theme-motion-deck-shift-negative, -100%);
  --ezra-surface-motion-chevron-turn: var(--ezra-app-surface-theme-motion-chevron-turn, 180deg);
  --ezra-ui-panel-editor-background: var(
    --ezra-app-surface-theme-editor-card-bg,
    color-mix(in srgb, var(--panel-color) 94%, var(--background-color) 6%)
  );
  --ezra-ui-panel-editor-border: var(--ezra-app-surface-theme-editor-card-border, var(--panel-border-strong));
  --ezra-ui-panel-editor-shadow: var(
    --ezra-app-surface-theme-editor-card-shadow,
    0 14px 32px color-mix(in srgb, var(--background-color) 28%, transparent)
  );
  --ezra-ui-panel-list-background: var(
    --ezra-app-surface-theme-collection-card-bg,
    color-mix(in srgb, var(--panel-color) 72%, var(--background-color) 28%)
  );
  --ezra-ui-panel-list-border: var(--ezra-app-surface-theme-collection-card-border, var(--panel-border));
  --ezra-ui-panel-list-shadow: var(
    --ezra-app-surface-theme-collection-card-shadow,
    inset 0 1px 0 color-mix(in srgb, var(--background-color) 12%, transparent)
  );
  --ezra-ui-panel-list-body-border: var(--ezra-app-surface-theme-collection-card-body-border, var(--panel-border));
  --ezra-ui-panel-list-item-background: var(
    --ezra-app-surface-theme-collection-button-bg,
    color-mix(in srgb, var(--panel-color) 56%, var(--background-color) 44%)
  );
  --ezra-ui-panel-list-item-hover-background: var(
    --ezra-app-surface-theme-collection-button-hover-bg,
    color-mix(in srgb, var(--surface-hover) 68%, var(--panel-color) 32%)
  );
  --ezra-ui-mobile-list-toggle-text: var(--ezra-app-surface-theme-mobile-collection-toggle-text, var(--text-color));
  --ezra-ui-mobile-list-toggle-meta: var(--ezra-app-surface-theme-mobile-collection-toggle-meta, var(--muted-color));
  --ezra-ui-mobile-list-toggle-border: var(--ezra-app-surface-theme-mobile-collection-toggle-border, var(--panel-border));
  --badge-color: var(--ezra-app-surface-theme-badge-color, var(--input-highlight-color));
  --badge-published-color: var(--ezra-app-surface-theme-badge-published-color, var(--text-color));
  --badge-published-border: var(--ezra-app-surface-theme-badge-published-border, var(--input-highlight-color));
  --badge-published-bg: var(
    --ezra-app-surface-theme-badge-published-bg,
    color-mix(in srgb, var(--text-color) 6%, transparent)
  );
  --badge-draft-color: var(--ezra-app-surface-theme-badge-draft-color, var(--yellow));
  --badge-draft-border: var(
    --ezra-app-surface-theme-badge-draft-border,
    color-mix(in srgb, var(--yellow) 44%, transparent)
  );
  --badge-draft-bg: var(
    --ezra-app-surface-theme-badge-draft-bg,
    color-mix(in srgb, var(--yellow) 12%, transparent)
  );
  --badge-ready-color: var(--ezra-app-surface-theme-badge-ready-color, var(--badge-published-color));
  --badge-ready-border: var(
    --ezra-app-surface-theme-badge-ready-border,
    color-mix(in srgb, var(--text-color) 44%, transparent)
  );
  --badge-ready-bg: var(--ezra-app-surface-theme-badge-ready-bg, var(--badge-published-bg));
  --badge-delete-color: var(--label-color);
  --badge-delete-border: color-mix(in srgb, var(--label-color) 44%, transparent);
  --badge-delete-bg: color-mix(in srgb, var(--label-color) 10%, transparent);
  --badge-featured-color: var(--ezra-app-surface-theme-badge-featured-color, var(--label-color));
  --badge-featured-border: var(
    --ezra-app-surface-theme-badge-featured-border,
    color-mix(in srgb, var(--label-color) 44%, transparent)
  );
  --badge-featured-bg: var(--ezra-app-surface-theme-badge-featured-bg, transparent);
  --chip-color: var(--ezra-app-surface-theme-chip-color, var(--text-color));
  --chip-bg: var(
    --ezra-app-surface-theme-chip-bg,
    color-mix(in srgb, var(--button-background-color) 10%, var(--panel-color))
  );
  --chip-border: var(--ezra-app-surface-theme-chip-border, var(--panel-border-strong));
  --ezra-app-surface-primary-button-background: var(--ezra-app-surface-theme-primary-button-background, var(--button-background-color));
  --ezra-app-surface-primary-button-text: var(--ezra-app-surface-theme-primary-button-text, var(--button-text-color));
  --ezra-app-surface-primary-button-border: var(
    --ezra-app-surface-theme-primary-button-border,
    color-mix(in srgb, var(--button-background-color) 72%, transparent)
  );
  --ezra-app-surface-primary-button-hover-background: var(
    --ezra-app-surface-theme-primary-button-hover-background,
    color-mix(in srgb, var(--button-background-color) 84%, var(--background-color) 16%)
  );
  --ezra-app-surface-primary-button-hover-text: var(--ezra-app-surface-theme-primary-button-hover-text, var(--button-text-color));
  --ezra-app-surface-primary-button-hover-border: var(--ezra-app-surface-theme-primary-button-hover-border, var(--button-background-color));
  --ezra-app-surface-secondary-button-background: var(
    --ezra-app-surface-theme-secondary-button-background,
    color-mix(in srgb, var(--button-background-color) 12%, var(--background-color))
  );
  --ezra-app-surface-secondary-button-text: var(--ezra-app-surface-theme-secondary-button-text, var(--text-color));
  --ezra-app-surface-secondary-button-border: var(
    --ezra-app-surface-theme-secondary-button-border,
    color-mix(in srgb, var(--button-background-color) 42%, var(--border-color))
  );
  --ezra-app-surface-secondary-button-hover-background: var(
    --ezra-app-surface-theme-secondary-button-hover-background,
    color-mix(in srgb, var(--button-background-color) 18%, var(--background-color))
  );
  --ezra-app-surface-secondary-button-hover-text: var(--ezra-app-surface-theme-secondary-button-hover-text, var(--text-color));
  --ezra-app-surface-secondary-button-hover-border: var(
    --ezra-app-surface-theme-secondary-button-hover-border,
    color-mix(in srgb, var(--button-background-color) 62%, var(--border-color))
  );
  --ezra-app-surface-ghost-button-text: var(
    --ezra-app-surface-theme-ghost-button-text,
    color-mix(in srgb, var(--text-color) 82%, var(--muted-color) 18%)
  );
  --ezra-app-surface-ghost-button-border: var(
    --ezra-app-surface-theme-ghost-button-border,
    color-mix(in srgb, var(--panel-border) 82%, transparent)
  );
  --ezra-app-surface-ghost-button-hover-background: var(
    --ezra-app-surface-theme-ghost-button-hover-background,
    color-mix(in srgb, var(--text-color) 6%, transparent)
  );
  --ezra-app-surface-ghost-button-hover-text: var(--ezra-app-surface-theme-ghost-button-hover-text, var(--text-color));
  --ezra-app-surface-danger-button-background: var(
    --ezra-app-surface-theme-danger-button-background,
    transparent
  );
  --ezra-app-surface-danger-button-text: var(--ezra-app-surface-theme-danger-button-text, var(--red));
  --ezra-app-surface-danger-button-border: var(
    --ezra-app-surface-theme-danger-button-border,
    color-mix(in srgb, var(--red) 58%, transparent)
  );
  --ezra-app-surface-danger-button-hover-background: var(
    --ezra-app-surface-theme-danger-button-hover-background,
    transparent
  );
  --ezra-app-surface-danger-button-hover-text: var(--ezra-app-surface-theme-danger-button-hover-text, var(--red));
  --ezra-app-surface-danger-button-hover-border: var(
    --ezra-app-surface-theme-danger-button-hover-border,
    color-mix(in srgb, var(--red) 78%, transparent)
  );
  --ezra-app-surface-important-button-accent: var(
    --ezra-app-surface-theme-important-button-accent,
    var(
      --ezra-ui-theme-important-action-accent,
      var(--ezra-ui-theme-accent-strong, var(--button-background-color))
    )
  );
  --ezra-app-surface-important-button-background: var(
    --ezra-app-surface-theme-important-button-background,
    var(
      --ezra-ui-theme-important-action-background,
      color-mix(in srgb, var(--ezra-app-surface-important-button-accent) 16%, var(--background-color))
    )
  );
  --ezra-app-surface-important-button-text: var(
    --ezra-app-surface-theme-important-button-text,
    var(
      --ezra-ui-theme-important-action-text,
      var(--h1-color, var(--text-color))
    )
  );
  --ezra-app-surface-important-button-border: var(
    --ezra-app-surface-theme-important-button-border,
    var(
      --ezra-ui-theme-important-action-border,
      color-mix(in srgb, var(--ezra-app-surface-important-button-accent) 68%, var(--border-color))
    )
  );
  --ezra-app-surface-important-button-hover-background: var(
    --ezra-app-surface-theme-important-button-hover-background,
    var(
      --ezra-ui-theme-important-action-hover-background,
      color-mix(in srgb, var(--ezra-app-surface-important-button-accent) 24%, var(--background-color))
    )
  );
  --ezra-app-surface-important-button-hover-text: var(
    --ezra-app-surface-theme-important-button-hover-text,
    var(
      --ezra-ui-theme-important-action-hover-text,
      var(--h1-color, var(--text-color))
    )
  );
  --ezra-app-surface-important-button-hover-border: var(
    --ezra-app-surface-theme-important-button-hover-border,
    var(
      --ezra-ui-theme-important-action-hover-border,
      var(--ezra-app-surface-important-button-accent)
    )
  );
  --ezra-app-surface-secondary-important-button-background: var(
    --ezra-app-surface-theme-secondary-important-button-background,
    transparent
  );
  --ezra-app-surface-secondary-important-button-text: var(
    --ezra-app-surface-theme-secondary-important-button-text,
    var(--h1-color, var(--text-color))
  );
  --ezra-app-surface-secondary-important-button-border: var(
    --ezra-app-surface-theme-secondary-important-button-border,
    color-mix(in srgb, var(--ezra-app-surface-important-button-accent) 68%, var(--border-color))
  );
  --ezra-app-surface-secondary-important-button-hover-background: var(
    --ezra-app-surface-theme-secondary-important-button-hover-background,
    transparent
  );
  --ezra-app-surface-secondary-important-button-hover-text: var(
    --ezra-app-surface-theme-secondary-important-button-hover-text,
    var(--ezra-app-surface-secondary-important-button-text)
  );
  --ezra-app-surface-secondary-important-button-hover-border: var(
    --ezra-app-surface-theme-secondary-important-button-hover-border,
    color-mix(in srgb, var(--ezra-app-surface-important-button-accent) 88%, var(--border-color))
  );
  --message-error-border: var(
    --ezra-app-surface-theme-message-error-border,
    color-mix(in srgb, var(--label-color) 70%, transparent)
  );
  --message-error-bg: var(
    --ezra-app-surface-theme-message-error-bg,
    color-mix(in srgb, var(--label-color) 10%, var(--surface-quiet))
  );
  --message-success-border: var(
    --ezra-app-surface-theme-message-success-border,
    color-mix(in srgb, var(--yellow) 55%, transparent)
  );
  --message-success-bg: var(
    --ezra-app-surface-theme-message-success-bg,
    color-mix(in srgb, var(--yellow) 10%, var(--surface-quiet))
  );
  --ezra-ui-repeater-background: var(--ezra-app-surface-theme-repeater-bg, var(--surface-quiet));
  --ezra-ui-repeater-border: var(--ezra-app-surface-theme-repeater-border, var(--panel-border));
  --ezra-ui-repeater-item-background: var(--ezra-app-surface-theme-repeater-item-bg, var(--surface-quiet));
  --ezra-ui-repeater-item-border: var(--ezra-app-surface-theme-repeater-item-border, var(--panel-border));
  --ezra-ui-repeater-item-border-strong: var(--ezra-app-surface-theme-repeater-item-border-strong, var(--panel-border-strong));
  --ezra-ui-repeater-title-color: var(--ezra-app-surface-theme-repeater-title-color, var(--h1-color));
  --ezra-ui-repeater-meta-color: var(--ezra-app-surface-theme-repeater-meta-color, var(--muted-color));
  color: var(--text-color);
  width: 100%;
  min-width: 0;
  min-height: 100vh;
  min-height: 100dvh;
  padding:
    var(--ezra-surface-frame-inset-block-start)
    var(--ezra-surface-frame-inset-inline-end)
    var(--ezra-surface-frame-inset-block-end)
    var(--ezra-surface-frame-inset-inline-start);
  box-sizing: border-box;
  background: var(--ezra-surface-background, var(--background-color, Canvas));
}

.ezra-app-surface-shell {
  --ezra-app-surface-section-gap: var(
    --ezra-app-surface-theme-section-gap,
    var(--ezra-surface-frame-region-gap)
  );
  width: var(--ezra-surface-frame-content-inline-size);
  min-width: 0;
  max-width: var(--ezra-app-surface-shell-max-width, var(--ezra-surface-frame-content-max-measure));
  margin: var(--ezra-app-surface-shell-margin, 0);
  display: grid;
  grid-template-rows: auto auto;
  align-content: start;
  gap: var(--ezra-app-surface-section-gap);
}

.ezra-app-surface-page {
  width: var(--ezra-surface-frame-content-inline-size);
  max-width: var(--ezra-surface-frame-content-max-measure);
  margin: 0;
}

@media (max-width: 860px) {
  .ezra-app-surface {
    min-height: 100vh;
    min-height: 100dvh;
    padding:
      var(--ezra-surface-frame-inset-block-start)
      var(--ezra-surface-frame-inset-inline-end)
      var(--ezra-surface-frame-inset-block-end)
      var(--ezra-surface-frame-inset-inline-start);
  }
}

@media (prefers-reduced-motion: reduce) {
  .ezra-app-surface {
    --ezra-surface-motion-duration-fast: 1ms;
    --ezra-surface-motion-duration-standard: 1ms;
    --ezra-surface-motion-duration-surface: 1ms;
    --ezra-surface-motion-duration-deck: 1ms;
    --ezra-surface-motion-surface-shift: 0px;
    --ezra-surface-motion-deck-shift: 0%;
    --ezra-surface-motion-deck-shift-negative: 0%;
  }
}

.ezra-app-surface,
.ezra-app-surface-page {
  --ezra-app-surface-header-menu-control-size: var(--ezra-app-surface-theme-header-menu-control-size, 28px);
  --ezra-app-surface-header-menu-inset: var(--ezra-app-surface-theme-header-menu-inset, 12px);
  --ezra-app-surface-header-control-row-min-height: var(
    --ezra-app-surface-theme-header-control-row-min-height,
    calc(var(--ezra-app-surface-header-menu-control-size) + var(--ezra-app-surface-header-menu-inset))
  );
  --ezra-app-surface-header-copy-gap: var(--ezra-app-surface-theme-header-copy-gap, clamp(10px, 1.4vw, 14px));
  --ezra-app-surface-header-eyebrow-font: var(--ezra-app-surface-theme-header-eyebrow-font, var(--header-font));
  --ezra-app-surface-header-eyebrow-size: var(--ezra-app-surface-theme-header-eyebrow-size, 1rem);
  --ezra-app-surface-header-eyebrow-line-height: var(--ezra-app-surface-theme-header-eyebrow-line-height, 1.05rem);
  --ezra-app-surface-header-eyebrow-letter-spacing: var(--ezra-app-surface-theme-header-eyebrow-letter-spacing, 0.1em);
  --ezra-app-surface-header-eyebrow-weight: var(--ezra-app-surface-theme-header-eyebrow-weight, 400);
  --ezra-app-surface-header-title-size: var(
    --ezra-app-surface-theme-header-title-size,
    clamp(2.3rem, 4.8vw, 3.5rem)
  );
  --ezra-app-surface-header-title-line-height: var(--ezra-app-surface-theme-header-title-line-height, 0.94);
  --ezra-app-surface-header-title-letter-spacing: var(--ezra-app-surface-theme-header-title-letter-spacing, 0.02em);
  --ezra-app-surface-mode-focus-title-color: var(
    --ezra-app-surface-theme-mode-focus-title-color,
    var(--h1-color, currentColor)
  );
  --ezra-app-surface-mode-focus-title-font: var(
    --ezra-app-surface-theme-mode-focus-title-font,
    var(--title-font, var(--header-font))
  );
  --ezra-app-surface-mode-focus-title-weight: var(--ezra-app-surface-theme-mode-focus-title-weight, 700);
  --ezra-app-surface-mode-focus-title-size: var(--ezra-app-surface-theme-mode-focus-title-size, 4.9rem);
  --ezra-app-surface-mode-focus-title-line-height: var(--ezra-app-surface-theme-mode-focus-title-line-height, 0.92);
  --ezra-app-surface-mode-focus-title-letter-spacing: var(--ezra-app-surface-theme-mode-focus-title-letter-spacing, 0.04em);
}

.ezra-app-surface-page {
  display: grid;
  gap: var(--ezra-app-surface-page-gap, 18px);
}

.ezra-app-surface-content {
  display: grid;
  gap: var(--ezra-app-surface-content-gap, 16px);
  width: 100%;
  min-width: 0;
}

.ezra-app-surface-top,
.ezra-app-surface-body,
.ezra-app-surface-header,
.ezra-app-surface-header-main,
.ezra-app-surface-header-copy,
.ezra-app-surface-header-actions,
.ezra-app-surface-header-controls {
  min-width: 0;
}

.ezra-app-surface-header {
  margin: 0;
  display: grid;
  gap: var(--ezra-app-surface-header-controls-gap, var(--ezra-app-surface-section-gap, 18px));
}

.ezra-app-surface-header-copy {
  display: grid;
  align-content: start;
  gap: var(--ezra-app-surface-header-copy-gap);
  max-width: var(--ezra-app-surface-header-copy-measure, 58rem);
}

.ezra-app-surface-header-copy:has(.ezra-app-surface-eyebrow) {
  grid-template-rows: minmax(var(--ezra-app-surface-header-control-row-min-height), auto) auto;
}

.ezra-app-surface-header-main {
  display: grid;
  gap: var(--ezra-app-surface-header-action-gap, 16px);
  align-items: flex-start;
}

.ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) {
  display: flex;
  gap: var(--ezra-app-surface-header-action-gap, 16px);
  align-items: flex-start;
  justify-content: space-between;
}

.ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-header-copy {
  flex: 1 1 auto;
}

.ezra-app-surface-header-actions {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  gap: var(--ezra-app-surface-header-control-gap, 10px);
  align-items: center;
  justify-content: flex-end;
  margin-left: auto;
  min-height: var(--ezra-app-surface-header-control-row-min-height);
}

.ezra-app-surface-header-controls {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ezra-app-surface-header-control-gap, 10px);
  align-items: flex-start;
  justify-content: flex-start;
}

.ezra-app-surface-eyebrow {
  align-self: center;
  margin: 0;
  color: var(--ezra-app-surface-header-eyebrow-color, var(--label-color, var(--h6-color, currentColor)));
  font-family: var(--ezra-app-surface-header-eyebrow-font, var(--header-font));
  font-size: var(--ezra-app-surface-header-eyebrow-size);
  font-weight: var(--ezra-app-surface-header-eyebrow-weight, 400);
  line-height: var(--ezra-app-surface-header-eyebrow-line-height);
  letter-spacing: var(--ezra-app-surface-header-eyebrow-letter-spacing);
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.ezra-app-surface-title {
  margin: 0;
  color: var(--ezra-app-surface-header-title-color, var(--h1-color, currentColor));
  font-family: var(--ezra-app-surface-header-title-font, var(--title-font, var(--header-font)));
  font-weight: var(--ezra-app-surface-header-title-weight, 700);
  font-size: var(--ezra-app-surface-header-title-size);
  line-height: var(--ezra-app-surface-header-title-line-height);
  letter-spacing: var(--ezra-app-surface-header-title-letter-spacing);
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.ezra-app-surface-mode-focus-title {
  margin: 0;
  color: var(--ezra-app-surface-mode-focus-title-color);
  font-family: var(--ezra-app-surface-mode-focus-title-font);
  font-weight: var(--ezra-app-surface-mode-focus-title-weight);
  font-size: var(--ezra-app-surface-mode-focus-title-size);
  line-height: var(--ezra-app-surface-mode-focus-title-line-height);
  letter-spacing: var(--ezra-app-surface-mode-focus-title-letter-spacing);
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.ezra-app-surface-copy {
  margin: 0;
  color: var(--ezra-app-surface-copy-color, var(--muted-color, currentColor));
}

@media (max-width: 720px) {
  .ezra-app-surface,
  .ezra-app-surface-page {
    --ezra-app-surface-page-gap: var(--ezra-app-surface-theme-page-gap-mobile, 14px);
    --ezra-app-surface-header-title-size: var(--ezra-app-surface-theme-header-title-size-mobile, 2rem);
    --ezra-app-surface-header-title-line-height: var(--ezra-app-surface-theme-header-title-line-height-mobile, 0.92);
    --ezra-app-surface-mode-focus-title-size: var(--ezra-app-surface-theme-mode-focus-title-size-mobile, 2rem);
    --ezra-app-surface-mode-focus-title-line-height: var(--ezra-app-surface-theme-mode-focus-title-line-height-mobile, 0.92);
  }

  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: var(--ezra-app-surface-header-action-gap, 16px);
    row-gap: var(--ezra-app-surface-header-copy-gap);
    align-items: start;
    justify-content: stretch;
  }

  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-header-copy {
    display: contents;
  }

  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-eyebrow {
    grid-column: 1;
    grid-row: 1;
  }

  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-header-actions {
    grid-column: 2;
    grid-row: 1;
    align-self: start;
    margin-left: 0;
  }

  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-title,
  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-mode-focus-title,
  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-copy {
    grid-column: 1 / -1;
    min-width: 0;
    max-width: 100%;
  }

  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-title,
  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-mode-focus-title {
    grid-row: 2;
  }

  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-copy {
    grid-row: 3;
  }
}

.ezra-colors-page.ezra-colors-page {
  --ezra-colors-page-background: var(--background-color, var(--ezra-ui-theme-background));
  --ezra-colors-page-text: var(--text-color, var(--ezra-ui-theme-text));
  --ezra-colors-page-heading-primary: var(--h1-color, var(--ezra-ui-theme-heading-primary));
  --ezra-colors-page-heading-secondary: var(--h2-color, var(--ezra-ui-theme-heading-secondary));
  --ezra-colors-page-label: var(--label-color, var(--ezra-ui-theme-accent-strong, var(--ezra-ui-theme-accent)));
  --ezra-colors-page-border: var(--border-color, var(--ezra-ui-theme-border));
  --ezra-colors-page-panel: var(--panel-color, var(--ezra-ui-theme-surface-quiet, var(--ezra-ui-theme-background)));
  --ezra-colors-page-panel-text: var(--text-color, var(--ezra-ui-theme-surface-quiet-text, var(--ezra-ui-theme-text)));
  --ezra-colors-page-button-background: var(--button-background-color, var(--ezra-ui-theme-button-background));
  --ezra-colors-page-button-text: var(--button-text-color, var(--ezra-ui-theme-button-text));
  --badge-color: var(--ezra-ui-theme-surface-quiet-text, var(--ezra-ui-theme-text));
  --panel-border-strong: color-mix(in srgb, var(--ezra-colors-page-border) 76%, transparent);
  --surface-quiet: var(--ezra-colors-page-panel);
  min-height: 100vh;
  box-sizing: border-box;
  padding: clamp(1rem, 2vw, 2rem);
  background: var(--ezra-colors-page-background);
  color: var(--ezra-colors-page-text);
}

.ezra-colors-page.ezra-colors-page.ezra-colors-page--embedded {
  min-height: 0;
  width: 100%;
  padding: 0;
  background: transparent;
  color: inherit;
}

.ezra-colors-page--embedded .ezra-colors-page-shell {
  max-width: none;
  margin: 0;
}

.ezra-colors-page *,
.ezra-colors-page *::before,
.ezra-colors-page *::after {
  box-sizing: inherit;
}

.ezra-colors-page a {
  color: inherit;
}

.ezra-colors-page-shell {
  display: grid;
  gap: 1.5rem;
}

body.preview-colors-body .ezra-colors-page {
  padding: 0;
  min-height: 0;
}

body.preview-colors-body .ezra-colors-page-shell {
  gap: 1.75rem;
}

.ezra-colors-page-intro {
  display: grid;
  gap: var(--ezra-app-surface-header-copy-gap, clamp(10px, 1.4vw, 14px));
  padding: 0;
  border: 0;
  background: transparent;
}

.ezra-colors-page-kicker {
  margin: 0;
  font-family: var(--ezra-app-surface-header-eyebrow-font, var(--header-font));
  font-size: var(--ezra-app-surface-header-eyebrow-size, 1rem);
  font-weight: var(--ezra-app-surface-header-eyebrow-weight, 400);
  line-height: var(--ezra-app-surface-header-eyebrow-line-height, 1.05rem);
  letter-spacing: var(--ezra-app-surface-header-eyebrow-letter-spacing, 0.1em);
  text-transform: uppercase;
  color: var(--ezra-colors-page-label);
}

.ezra-colors-page-title {
  margin: 0;
  color: var(--ezra-colors-page-heading-primary);
}

.ezra-colors-empty-copy {
  margin: 0;
  max-width: 70ch;
  color: color-mix(in srgb, var(--ezra-colors-page-text) 80%, transparent);
}

.ezra-colors-toolbar {
  display: grid;
  gap: 1rem;
  align-items: start;
  width: 100%;
  min-width: 0;
}

body.preview-colors-body .ezra-colors-page-intro {
  gap: 1rem;
}

@media (min-width: 980px) {
  .ezra-colors-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }
}

.ezra-colors-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr));
  gap: 1rem;
  align-items: start;
  grid-auto-flow: dense;
}

.ezra-colors-page--embedded .ezra-colors-grid {
  padding-top: 0;
}

.ezra-colors-grid > * {
  min-width: 0;
}

.ezra-colors-card {
  --ezra-colors-card-background: var(--ezra-ui-theme-background, var(--background-color));
  --ezra-colors-card-text: var(--ezra-ui-theme-text, var(--text-color));
  --ezra-colors-card-heading-primary: var(--ezra-ui-theme-heading-primary, var(--h1-color));
  --ezra-colors-card-heading-secondary: var(--ezra-ui-theme-heading-secondary, var(--h2-color));
  --ezra-colors-card-label: var(--ezra-ui-theme-accent-strong, var(--ezra-ui-theme-accent, var(--label-color)));
  --ezra-colors-card-border: var(--ezra-ui-theme-border, var(--border-color));
  --ezra-colors-card-panel: var(--ezra-ui-theme-surface-quiet, var(--panel-color, var(--ezra-colors-card-background)));
  --ezra-colors-card-panel-text: var(--ezra-ui-theme-surface-quiet-text, var(--ezra-colors-card-text));
  --ezra-colors-card-button-background: var(--ezra-ui-theme-button-background, var(--button-background-color));
  --ezra-colors-card-button-text: var(--ezra-ui-theme-button-text, var(--button-text-color));
  --ezra-colors-card-badge-background: var(--ezra-colors-card-panel);
  --ezra-colors-card-badge-border: color-mix(in srgb, var(--ezra-colors-card-border) 76%, transparent);
  --ezra-colors-card-badge-text: var(--ezra-colors-card-panel-text);
  --ezra-colors-page-background: var(--ezra-colors-card-background);
  --ezra-colors-page-text: var(--ezra-colors-card-text);
  --ezra-colors-page-heading-primary: var(--ezra-colors-card-heading-primary);
  --ezra-colors-page-heading-secondary: var(--ezra-colors-card-heading-secondary);
  --ezra-colors-page-label: var(--ezra-colors-card-label);
  --ezra-colors-page-border: var(--ezra-colors-card-border);
  --ezra-colors-page-panel: var(--ezra-colors-card-panel);
  --ezra-colors-page-panel-text: var(--ezra-colors-card-panel-text);
  --ezra-colors-page-button-background: var(--ezra-colors-card-button-background);
  --ezra-colors-page-button-text: var(--ezra-colors-card-button-text);
  margin: 0;
  min-width: 0;
  height: auto;
  align-self: start;
  display: grid;
  align-content: start;
  border: 1px solid color-mix(in srgb, var(--ezra-colors-card-border) 74%, transparent);
  background: var(--ezra-colors-card-background);
  color: var(--ezra-colors-card-text);
  overflow: hidden;
}

.ezra-colors-card--all {
  grid-column: 1 / -1;
}

.ezra-colors-card[open] {
  border-color: color-mix(in srgb, var(--ezra-colors-page-label) 40%, var(--ezra-colors-page-border));
}

.ezra-colors-card-summary {
  list-style: none;
  cursor: pointer;
  padding: 0;
  min-width: 0;
  height: auto;
}

.ezra-colors-card-summary::-webkit-details-marker {
  display: none;
}

.ezra-colors-card-trigger {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  padding: 1rem;
  min-width: 0;
  min-height: 14rem;
  position: relative;
}

.ezra-colors-card-heading {
  display: grid;
  gap: 0.35rem;
  min-width: 0;
}

.ezra-colors-card-kicker {
  margin: 0;
  font-family: var(--header-font);
  font-size: 0.8rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ezra-colors-page-label);
}

.ezra-colors-card-title {
  margin: 0;
  font-family: var(--header-font);
  font-size: 1.5rem;
  line-height: 1;
  text-transform: uppercase;
  color: var(--ezra-colors-page-heading-secondary);
}

.ezra-colors-card-meta {
  display: flex;
  gap: 0.45rem;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-self: start;
  min-width: 0;
  padding-right: 4.75rem;
}

.ezra-colors-card-meta .ezra-ui-widget-badge,
.ezra-colors-card-meta .ezra-ui-widget-badge.is-neutral {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 0.28rem 0.55rem;
  border: 1px solid var(--ezra-colors-card-badge-border);
  background: var(--ezra-colors-card-badge-background);
  color: var(--ezra-colors-card-badge-text);
  font-family: var(--header-font);
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.ezra-colors-theme-metadata {
  display: grid;
  gap: 0.35rem;
  padding: 0 1rem 1rem;
}

.ezra-colors-theme-label-form {
  display: grid;
  gap: 0.35rem;
}

.ezra-colors-theme-metadata-form {
  display: grid;
  gap: 0.35rem;
}

.ezra-colors-theme-label-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.5rem;
  align-items: stretch;
}

.ezra-colors-theme-metadata-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.5rem;
  align-items: stretch;
}

.ezra-colors-theme-metadata .ezra-colors-theme-metadata-label {
  font-family: var(--header-font);
  font-size: 0.8rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ezra-colors-page-panel-text);
}

.ezra-colors-theme-metadata .ezra-colors-theme-metadata-input {
  width: 100%;
  box-sizing: border-box;
  min-height: 2.25rem;
  border: 1px solid color-mix(in srgb, var(--ezra-colors-page-border) 76%, transparent);
  background: var(--ezra-colors-page-panel);
  color: var(--ezra-colors-page-panel-text);
  font: inherit;
  font-size: 0.92rem;
  padding: 0.45rem 0.6rem;
}

.ezra-colors-theme-metadata .ezra-colors-theme-metadata-input::placeholder {
  color: color-mix(
    in srgb,
    var(--ezra-colors-page-panel-text) 58%,
    transparent
  );
}

.ezra-colors-theme-label-save-button {
  min-height: 2.25rem;
  border: 1px solid color-mix(in srgb, var(--ezra-colors-page-border) 76%, transparent);
  background: var(--ezra-colors-page-button-background);
  color: var(--ezra-colors-page-button-text);
  font-family: var(--header-font);
  font-size: 0.82rem;
  text-transform: uppercase;
  padding: 0.45rem 0.75rem;
  cursor: pointer;
}

.ezra-colors-theme-label-save-button:hover {
  background: color-mix(in srgb, var(--ezra-colors-page-button-background) 84%, var(--ezra-colors-page-label) 16%);
}

.ezra-colors-theme-metadata-save-button {
  --ezra-app-surface-primary-button-background: var(--ezra-colors-page-button-background);
  --ezra-app-surface-primary-button-text: var(--ezra-colors-page-button-text);
  --ezra-app-surface-primary-button-border: color-mix(
    in srgb,
    var(--ezra-colors-page-button-background) 76%,
    var(--ezra-colors-page-border)
  );
  --ezra-app-surface-primary-button-hover-background: color-mix(
    in srgb,
    var(--ezra-colors-page-button-background) 84%,
    var(--ezra-colors-page-label) 16%
  );
  --ezra-app-surface-primary-button-hover-text: var(--ezra-colors-page-button-text);
  --ezra-app-surface-primary-button-hover-border: var(--ezra-colors-page-button-background);
  --ezra-ui-button-min-height: 2.25rem;
  --ezra-ui-button-padding-inline: 1rem;
}

.ezra-colors-theme-order-actions {
  --ezra-app-surface-ghost-button-text: var(
    --ezra-ui-theme-menu-item-accent,
    var(--ezra-ui-theme-picker-button-accent, var(--ezra-ui-theme-picker-item-text, currentColor))
  );
  --ezra-app-surface-ghost-button-border: var(
    --ezra-ui-theme-picker-item-border,
    var(--ezra-ui-theme-picker-button-border, currentColor)
  );
  --ezra-app-surface-ghost-button-hover-background: color-mix(
    in srgb,
    var(--ezra-ui-theme-picker-item-background, transparent) 72%,
    var(--ezra-ui-theme-menu-item-accent, currentColor) 28%
  );
  --ezra-app-surface-ghost-button-hover-text: var(
    --ezra-ui-theme-menu-item-heading,
    var(--ezra-ui-theme-picker-item-text, currentColor)
  );
  position: absolute;
  top: 0.95rem;
  right: 0.95rem;
}

.ezra-colors-theme-order-actions .ezra-ui-cluster {
  gap: 0.4rem;
}

.ezra-colors-preview-frame {
  position: relative;
  grid-column: 1 / -1;
  min-width: 0;
  overflow: hidden;
}

.ezra-colors-preview-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid color-mix(in srgb, var(--ezra-colors-page-border) 70%, transparent);
  pointer-events: none;
}

.ezra-colors-preview {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  min-height: 4.5rem;
  min-width: 0;
  overflow: hidden;
}

.ezra-colors-card--all .ezra-colors-preview {
  grid-template-columns: repeat(auto-fit, minmax(2.6rem, 1fr));
  min-height: 4.5rem;
}

.ezra-colors-preview-swatch {
  min-height: 4.5rem;
}

.ezra-colors-card--all .ezra-colors-preview-swatch {
  min-height: 4.5rem;
}

.ezra-colors-list {
  display: grid;
  min-width: 0;
}

.ezra-colors-list--all {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  padding: 0.75rem;
}

.ezra-colors-list--all.ezra-colors-list--separated {
  gap: 0;
}

.ezra-colors-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 0.9rem;
  row-gap: 0.2rem;
  width: 100%;
  max-width: 100%;
  padding: 0.9rem 1rem;
  border: 0;
  border-top: 1px solid color-mix(in srgb, var(--ezra-colors-page-border) 56%, transparent);
  background: transparent;
  color: inherit;
  text-align: left;
  align-items: center;
  box-sizing: border-box;
  min-width: 0;
  overflow: hidden;
  border-radius: 0;
  font: inherit;
  cursor: pointer;
}

.ezra-colors-card .ezra-colors-row {
  background: var(--ezra-colors-card-background);
  color: var(--ezra-colors-card-text);
}

.ezra-colors-row--all {
  width: min(100%, clamp(14rem, 24vw, 18rem));
  border-top: 0;
  border: 1px solid color-mix(in srgb, var(--ezra-colors-page-border) 56%, transparent);
  background: color-mix(in srgb, var(--ezra-colors-page-background) 94%, var(--ezra-colors-page-panel) 6%);
}

.ezra-colors-row:hover,
.ezra-colors-row:focus-within {
  background: color-mix(in srgb, var(--ezra-colors-page-label) 6%, var(--ezra-colors-page-background));
}

.ezra-colors-card .ezra-colors-row:hover,
.ezra-colors-card .ezra-colors-row:focus-within {
  background: color-mix(in srgb, var(--ezra-colors-card-label) 6%, var(--ezra-colors-card-background));
}

.ezra-colors-row:focus-within {
  outline: 2px solid var(--focus-ring, var(--ezra-ui-theme-focus-ring));
  outline-offset: -2px;
}

.ezra-colors-row-main {
  display: grid;
  gap: 0.16rem;
}

.ezra-colors-row-main {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

.ezra-colors-row-label,
.ezra-colors-row-name,
.ezra-colors-row-detail,
.ezra-colors-row-meta,
.ezra-colors-row-hex {
  margin: 0;
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.ezra-colors-row-label,
.ezra-colors-row-name {
  font-family: var(--header-font);
}

.ezra-colors-row-label {
  font-size: 0.92rem;
  text-transform: uppercase;
  color: var(--ezra-colors-page-heading-secondary);
}

.ezra-colors-row-name {
  font-size: 1.05rem;
  color: var(--ezra-colors-page-heading-secondary);
}

.ezra-colors-row-detail,
.ezra-colors-row-meta {
  margin: 0;
  font-size: 0.88rem;
  color: color-mix(in srgb, var(--ezra-colors-page-panel-text) 72%, transparent);
}

.ezra-colors-row-swatch-shell {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.ezra-colors-row-swatch {
  width: 2.6rem;
  height: 2.6rem;
  border: 1px solid color-mix(in srgb, var(--ezra-colors-page-border) 70%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--white) 20%, transparent);
}

.ezra-colors-row-hex {
  align-self: center;
  font-family: var(--body-font);
  font-size: 0.98rem;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--ezra-colors-page-label);
  text-align: left;
  white-space: nowrap;
  padding-top: 0.3rem;
}

.ezra-colors-row-copy {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  font-family: var(--header-font);
  font-size: 0.75rem;
  line-height: 1;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--ezra-colors-page-panel-text) 58%, transparent);
  text-align: left;
  white-space: nowrap;
}

.ezra-colors-row-copy-button {
  justify-self: start;
  --ezra-ui-button-small-padding-block: 0.5rem;
  --ezra-ui-button-small-padding-inline: 0.9rem;
}

.ezra-colors-row-remove-button {
  appearance: none;
  justify-self: start;
  border: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

.ezra-colors-page .ezra-colors-row-copy-button:hover,
.ezra-colors-page .ezra-colors-row-copy-button:focus {
  background: transparent;
  color: inherit;
  box-shadow: none;
}

.ezra-colors-page .ezra-colors-row-copy-button:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--ezra-colors-page-label) 72%, transparent);
  outline-offset: 2px;
}

.ezra-colors-page .ezra-colors-row-copy-button:hover .ezra-colors-row-copy {
  color: color-mix(in srgb, var(--ezra-colors-page-text) 58%, transparent);
}

.ezra-colors-row-actions {
  cursor: default;
}

.ezra-colors-row-copy-button:focus-visible,
.ezra-colors-row-remove-button:focus-visible {
  outline: 2px solid var(--focus-ring, var(--ezra-ui-theme-focus-ring));
  outline-offset: 2px;
}

.ezra-colors-row[data-copy-state="copied"] .ezra-colors-row-copy {
  color: var(--ezra-colors-page-label);
}

.ezra-colors-row-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  min-width: 0;
  padding-top: 0.45rem;
}

.ezra-colors-row-remove-form {
  display: flex;
  min-width: 0;
}

.ezra-colors-row-remove-button {
  min-height: 2rem;
  padding: 0.4rem 0.62rem;
  border: 1px solid color-mix(in srgb, var(--ezra-colors-page-label) 54%, var(--ezra-colors-page-border));
  background: color-mix(in srgb, var(--ezra-colors-page-label) 12%, transparent);
  color: var(--ezra-colors-page-label);
  font-family: var(--header-font);
  font-size: 0.74rem;
  line-height: 1;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.ezra-colors-row-remove-button:hover {
  background: color-mix(in srgb, var(--ezra-colors-page-label) 20%, transparent);
}

.ezra-colors-empty {
  padding: 1rem;
}

@media (max-width: 840px) {
  .ezra-colors-card--all {
    grid-column: auto;
  }

  .ezra-colors-card-trigger {
    min-height: auto;
  }

  .ezra-colors-card-meta {
    justify-content: flex-start;
  }

  .ezra-colors-row {
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: 0.75rem;
  }

  .ezra-colors-row-swatch {
    width: 2.2rem;
    height: 2.2rem;
  }

  .ezra-colors-list--all {
    display: grid;
    gap: 0;
    padding: 0;
  }

  .ezra-colors-row--all {
    width: 100%;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
  }
}

.ezra-colors-add-color-form,
.ezra-colors-theme-import-form {
  --ezra-ui-control-box-gap: 0.65rem;
  --ezra-ui-control-box-padding: 0.95rem 1rem 1rem;
  --ezra-colors-control-surface-background: color-mix(
    in srgb,
    var(--ezra-colors-page-panel) 88%,
    var(--ezra-colors-page-background) 12%
  );
  --ezra-colors-control-surface-text: var(--ezra-colors-page-text);
  --ezra-colors-control-surface-heading: var(--ezra-colors-page-heading-secondary);
  --ezra-colors-control-label-text: var(--ezra-colors-page-label);
  --ezra-colors-control-field-background: color-mix(
    in srgb,
    var(--ezra-colors-page-background) 72%,
    var(--ezra-colors-page-panel) 28%
  );
  --ezra-colors-control-field-text: var(--ezra-colors-page-text);
  --ezra-colors-control-field-border: color-mix(in srgb, var(--ezra-colors-page-border) 84%, var(--ezra-colors-page-label) 16%);
  --ezra-colors-control-field-placeholder: color-mix(in srgb, var(--ezra-colors-control-field-text) 58%, transparent);
  --ezra-colors-control-file-text: color-mix(in srgb, var(--ezra-colors-control-surface-text) 76%, transparent);
  --ezra-ui-theme-input-border: var(--ezra-colors-control-field-border);
  --input-bg: var(--ezra-colors-control-field-background);
  --ezra-app-surface-primary-button-background: var(--ezra-colors-page-button-background);
  --ezra-app-surface-primary-button-text: var(--ezra-colors-page-button-text);
  --ezra-app-surface-primary-button-border: color-mix(in srgb, var(--ezra-colors-page-button-background) 76%, var(--ezra-colors-page-border));
  --ezra-app-surface-primary-button-hover-background: color-mix(
    in srgb,
    var(--ezra-colors-page-button-background) 84%,
    var(--ezra-colors-page-label) 16%
  );
  --ezra-app-surface-primary-button-hover-text: var(--ezra-colors-page-button-text);
  --ezra-app-surface-primary-button-hover-border: var(--ezra-colors-page-button-background);
  --ezra-ui-control-surface-border: color-mix(in srgb, var(--ezra-colors-page-border) 86%, transparent);
  --ezra-ui-control-surface-background: var(--ezra-colors-control-surface-background);
  border: 1px solid var(--ezra-ui-control-surface-border);
  background: var(--ezra-ui-control-surface-background);
  color: var(--ezra-colors-control-surface-text);
}

.ezra-colors-control-heading,
.ezra-colors-control-flash {
  margin: 0;
}

.ezra-colors-control-heading {
  font-family: var(--header-font);
  font-size: 0.92rem;
  line-height: 1;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ezra-colors-control-surface-heading);
}

.ezra-colors-add-color-form .ezra-ui-label,
.ezra-colors-theme-import-form .ezra-ui-label {
  color: var(--ezra-colors-control-label-text);
  min-height: 1rem;
  font-size: 0.85rem;
  letter-spacing: 0.08em;
  line-height: 1.2;
}

.ezra-colors-add-color-form .ezra-ui-field,
.ezra-colors-theme-import-form .ezra-ui-field {
  gap: var(--ezra-ui-row-gap-compact, 6px);
}

.ezra-colors-page.ezra-colors-page .ezra-colors-add-color-form.ezra-colors-add-color-form .ezra-ui-field .ezra-ui-input:not(.ezra-ui-file-input),
.ezra-colors-page.ezra-colors-page .ezra-colors-theme-import-form.ezra-colors-theme-import-form .ezra-ui-field .ezra-ui-input:not(.ezra-ui-file-input) {
  min-height: 2.35rem;
  border: 1px solid var(--ezra-colors-control-field-border);
  background: var(--ezra-colors-control-field-background);
  color: var(--ezra-colors-control-field-text);
  font: inherit;
  padding: 0.45rem 0.6rem;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ezra-colors-control-field-border) 34%, transparent);
}

.ezra-colors-page.ezra-colors-page .ezra-colors-add-color-form.ezra-colors-add-color-form .ezra-ui-field .ezra-ui-input::placeholder,
.ezra-colors-page.ezra-colors-page .ezra-colors-theme-import-form.ezra-colors-theme-import-form .ezra-ui-field .ezra-ui-input::placeholder {
  color: var(--ezra-colors-control-field-placeholder);
}

.ezra-colors-page.ezra-colors-page .ezra-colors-theme-import-form.ezra-colors-theme-import-form .ezra-ui-file-control {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: center;
  min-width: 0;
  border: 1px solid var(--ezra-colors-control-field-border);
  background: var(--ezra-colors-control-field-background);
  color: var(--ezra-colors-control-field-text);
  padding: 0.45rem 0.6rem;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ezra-colors-control-field-border) 34%, transparent);
}

.ezra-colors-page.ezra-colors-page .ezra-colors-theme-import-form.ezra-colors-theme-import-form .ezra-ui-input.ezra-ui-file-input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  min-inline-size: 0;
  min-block-size: 0;
  min-height: 0;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  opacity: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
}

.ezra-colors-page.ezra-colors-page .ezra-colors-theme-import-form.ezra-colors-theme-import-form .ezra-ui-file-button {
  min-height: 2.35rem;
  border: 1px solid var(--ezra-app-surface-primary-button-border);
  background: var(--ezra-colors-page-button-background);
  color: var(--ezra-colors-page-button-text);
  font-family: var(--header-font);
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.5rem 0.8rem;
  cursor: pointer;
}

.ezra-colors-page.ezra-colors-page .ezra-colors-theme-import-form.ezra-colors-theme-import-form .ezra-ui-file-name {
  color: var(--ezra-colors-control-file-text);
  font-family: var(--metadata-font, var(--body-font));
  font-size: 0.86rem;
  line-height: 1.25;
}

.ezra-colors-page.ezra-colors-page .ezra-colors-add-color-form.ezra-colors-add-color-form .ezra-ui-input:focus,
.ezra-colors-page.ezra-colors-page .ezra-colors-theme-import-form.ezra-colors-theme-import-form .ezra-ui-input:focus,
.ezra-colors-page.ezra-colors-page .ezra-colors-theme-import-form.ezra-colors-theme-import-form .ezra-ui-file-input:focus-visible + .ezra-ui-file-button {
  outline: 2px solid var(--focus-ring, var(--ezra-ui-theme-focus-ring, var(--ezra-colors-page-label)));
  outline-offset: 2px;
}

.ezra-colors-control-flash {
  font-size: 0.88rem;
  line-height: 1.25;
  color: color-mix(in srgb, var(--ezra-colors-page-text) 80%, transparent);
}

.ezra-colors-control-flash[data-tone="success"] {
  color: var(--ezra-colors-page-label);
}

.ezra-colors-control-flash[data-tone="error"] {
  color: color-mix(in srgb, var(--ezra-colors-page-label) 58%, var(--ezra-colors-page-text) 42%);
}

.ezra-colors-add-color-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}

.ezra-colors-theme-import-fields {
  display: grid;
  gap: 0.45rem;
  align-content: start;
}

.ezra-colors-add-color-fields > *,
.ezra-colors-theme-import-fields > * {
  min-width: 0;
}

.ezra-colors-control-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
}

.ezra-colors-page .ezra-colors-control-actions .ezra-ui-button {
  min-height: 2.35rem;
  border: 1px solid var(--ezra-app-surface-primary-button-border);
  background: var(--ezra-colors-page-button-background);
  color: var(--ezra-colors-page-button-text);
  font-family: var(--header-font);
  font-size: 0.85rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.5rem 0.8rem;
  cursor: pointer;
}

.ezra-colors-page .ezra-colors-control-actions .ezra-ui-button:hover {
  background: var(--ezra-app-surface-primary-button-hover-background);
  color: var(--ezra-app-surface-primary-button-hover-text);
  border-color: var(--ezra-app-surface-primary-button-hover-border);
}

.ezra-colors-theme-card-actions {
  display: flex;
  width: 100%;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 0.4rem;
  margin-top: 0.75rem;
}

.ezra-colors-page a.ezra-colors-theme-export-link,
.ezra-colors-theme-export-link {
  --ezra-app-surface-secondary-button-background: var(--ezra-colors-page-button-background);
  --ezra-app-surface-secondary-button-text: var(--ezra-colors-page-button-text);
  --ezra-app-surface-secondary-button-border: color-mix(in srgb, var(--ezra-colors-page-button-background) 76%, var(--ezra-colors-page-border));
  --ezra-app-surface-secondary-button-hover-background: color-mix(
    in srgb,
    var(--ezra-colors-page-button-background) 84%,
    var(--ezra-colors-page-label) 16%
  );
  --ezra-app-surface-secondary-button-hover-text: var(--ezra-colors-page-button-text);
  --ezra-app-surface-secondary-button-hover-border: var(--ezra-colors-page-button-background);
  min-height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.42rem 0.62rem;
  background: var(--ezra-app-surface-secondary-button-background);
  color: var(--ezra-app-surface-secondary-button-text);
  font-size: 0.72rem;
  line-height: 1;
  letter-spacing: 0.08em;
  white-space: nowrap;
}

.ezra-colors-page a.ezra-colors-theme-export-link:hover,
.ezra-colors-theme-export-link:hover {
  background: var(--ezra-app-surface-secondary-button-hover-background);
  color: var(--ezra-app-surface-secondary-button-hover-text);
}

@media (max-width: 560px) {
  .ezra-colors-add-color-fields {
    grid-template-columns: minmax(0, 1fr);
  }
}




.ezra-ui-border-collapse-stack,
.ezra-ui-border-collapse-inline,
.ezra-ui-border-collapse-cluster {
  --ezra-ui-border-collapse-width: 1px;
}

.ezra-ui-border-collapse-stack.ezra-ui-border-collapse-stack {
  gap: 0;
}

.ezra-ui-border-collapse-stack > * + * {
  margin-block-start: calc(var(--ezra-ui-border-collapse-width) * -1);
  border-block-start-color: transparent;
  background-clip: padding-box;
}

.ezra-ui-border-collapse-inline > * + * {
  margin-inline-start: calc(var(--ezra-ui-border-collapse-width) * -1);
  border-inline-start-color: transparent;
  background-clip: padding-box;
}

.ezra-ui-border-collapse-inline.ezra-ui-border-collapse-inline {
  gap: 0;
}

.ezra-ui-border-collapse-cluster.ezra-ui-border-collapse-cluster {
  gap: 0;
}

.ezra-ui-border-collapse-cluster > * {
  margin-block-start: calc(var(--ezra-ui-border-collapse-width) * -1);
  margin-inline-start: calc(var(--ezra-ui-border-collapse-width) * -1);
  border-block-start-color: transparent;
  border-inline-start-color: transparent;
  background-clip: padding-box;
}


.ezra-ui-surface {
  min-width: 0;
}

.ezra-ui-control-surface {
  border: 1px solid var(
    --ezra-ui-control-surface-border,
    color-mix(in srgb, var(--border-color, currentColor) 66%, transparent)
  );
  background: var(
    --ezra-ui-control-surface-background,
    color-mix(in srgb, var(--surface-quiet, transparent) 84%, transparent)
  );
}

.ezra-ui-control-surface--interactive {
  cursor: pointer;
}

.ezra-ui-control-surface--interactive:hover,
.ezra-ui-control-surface--interactive.is-selected {
  outline: 2px solid var(--ezra-ui-control-surface-focus-ring, var(--focus-ring-color, currentColor));
  outline-offset: 2px;
}

.ezra-ui-control-box {
  --ezra-ui-control-box-gap: 0.65rem;
  --ezra-ui-control-box-padding: 0.95rem 1rem 1rem;
  display: grid;
  gap: var(--ezra-ui-control-box-gap);
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: 100%;
  min-width: 0;
  height: 100%;
  padding: var(--ezra-ui-control-box-padding);
  box-sizing: border-box;
}

.ezra-ui-control-box-heading {
  margin: 0;
  min-width: 0;
  color: var(--ezra-ui-control-box-heading-color, var(--h2-color, var(--ezra-ui-theme-heading-secondary, currentColor)));
  font-family: var(--ezra-ui-control-box-heading-font, var(--header-font));
  font-size: var(--ezra-ui-control-box-heading-size, 0.92rem);
  line-height: var(--ezra-ui-control-box-heading-line-height, 1);
  letter-spacing: var(--ezra-ui-control-box-heading-letter-spacing, 0.12em);
  text-transform: var(--ezra-ui-control-box-heading-transform, uppercase);
}

.ezra-ui-control-box-body,
.ezra-ui-control-box-actions {
  min-width: 0;
}

.ezra-ui-control-box-body {
  align-self: start;
}

.ezra-ui-control-box-actions {
  display: grid;
  gap: var(--ezra-ui-control-box-gap);
  align-self: end;
}

.ezra-ui-control-group {
  --ezra-ui-control-group-border-width: 1px;
  --ezra-ui-control-group-border: var(
    --ezra-ui-control-surface-border,
    color-mix(in srgb, var(--border-color, currentColor) 66%, transparent)
  );
  display: grid;
  gap: 0;
  min-width: 0;
  border: var(--ezra-ui-control-group-border-width) solid var(--ezra-ui-control-group-border);
  background: var(
    --ezra-ui-control-group-background,
    color-mix(in srgb, var(--surface-quiet, transparent) 84%, transparent)
  );
  box-sizing: border-box;
}

.ezra-ui-control-group[data-ezra-ui-control-group-orientation="horizontal"] {
  display: flex;
  align-items: stretch;
}

.ezra-ui-control-group > * {
  min-width: 0;
  border: 0 !important;
}

.ezra-ui-control-group[data-ezra-ui-control-group-orientation="vertical"] > * + * {
  border-block-start: var(--ezra-ui-control-group-border-width) solid var(--ezra-ui-control-group-border) !important;
}

.ezra-ui-control-group[data-ezra-ui-control-group-orientation="horizontal"] > * + * {
  border-inline-start: var(--ezra-ui-control-group-border-width) solid var(--ezra-ui-control-group-border) !important;
}

.ezra-ui-control-group > [hidden] {
  display: none;
}

.ezra-ui-workspace-navigation-control-group,
.ezra-ui-control-group {
  --ezra-ui-control-group-border: var(--panel-border);
  --ezra-ui-control-group-background: var(--surface-quiet);
}

.ezra-ui-split-layout {
  display: grid;
  grid-template-columns: minmax(18rem, clamp(18rem, 31vw, 25rem)) minmax(0, 1fr);
  gap: var(--ezra-ui-split-layout-gap, 14px);
  align-items: start;
}

.ezra-ui-split-pane {
  min-width: 0;
  min-height: 0;
}

.ezra-ui-split-pane--side {
  align-self: stretch;
  overflow: hidden;
}

.ezra-ui-split-pane--main {
  align-self: start;
}

.ezra-ui-panel {
  min-width: 0;
  box-sizing: border-box;
  border: 1px solid var(--ezra-ui-panel-border, var(--panel-border));
  background: var(--ezra-ui-panel-background, var(--panel-color));
  padding: var(--ezra-ui-panel-padding, var(--ezra-ui-card-padding, clamp(14px, 1.35vw, 18px)));
}

.ezra-ui-panel--compact {
  padding: var(--ezra-ui-panel-padding-compact, var(--ezra-ui-card-padding-compact, clamp(12px, 1.1vw, 14px)));
}

.ezra-ui-panel--list {
  --ezra-ui-item-list-button-background: var(--ezra-ui-panel-list-item-background, transparent);
  --ezra-ui-item-list-button-hover-background: var(--ezra-ui-panel-list-item-hover-background, var(--surface-quiet));
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: 100%;
  overflow: hidden;
  background: var(--ezra-ui-panel-list-background, var(--panel-color));
  border-color: var(--ezra-ui-panel-list-border, var(--panel-border));
  box-shadow: var(--ezra-ui-panel-list-shadow, none);
  transition:
    box-shadow var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard),
    border-color var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard),
    background-color var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-panel--editor {
  min-width: 0;
  min-height: 0;
  height: 100%;
  background: var(--ezra-ui-panel-editor-background, var(--panel-color));
  border-color: var(--ezra-ui-panel-editor-border, var(--panel-border));
  box-shadow: var(--ezra-ui-panel-editor-shadow, none);
  transition:
    box-shadow var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard),
    border-color var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard),
    background-color var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-panel-body,
.ezra-ui-panel-body--list {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  padding-top: 0;
  overflow: hidden;
}

.ezra-ui-panel-body--list {
  background: transparent;
}

.ezra-ui-panel-body--editor {
  width: 100%;
}

.ezra-ui-split-pane--side .ezra-ui-panel-body--list {
  min-height: 0;
}

.ezra-ui-split-pane--side .ezra-ui-list-scroll {
  min-height: 0;
  height: 100%;
  max-height: 100%;
  contain: size;
}

.ezra-ui-panel--editor .ezra-ui-input,
.ezra-ui-panel--editor .ezra-ui-field input,
.ezra-ui-panel--editor .ezra-ui-field textarea,
.ezra-ui-panel--editor .ezra-ui-field select {
  font-size: inherit;
  line-height: 1.35;
}

.ezra-ui-panel--list > h2,
.ezra-ui-panel--editor > h2 {
  margin-top: 0;
  margin-bottom: 0;
  font-family: var(--header-font);
  font-weight: 700;
}

.ezra-ui-scroll-region,
.ezra-ui-list-scroll {
  overflow: auto;
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  margin-top: 0;
  -webkit-overflow-scrolling: touch;
}

.ezra-ui-stack,
.ezra-ui-section,
.ezra-ui-metadata,
.ezra-ui-field-group,
.ezra-ui-action-bar {
  display: grid;
  min-width: 0;
}

.ezra-ui-stack,
.ezra-ui-section,
.ezra-ui-field-group {
  gap: var(--ezra-ui-stack-gap, clamp(14px, 1.4vw, 16px));
}

.ezra-ui-stack--compact,
.ezra-ui-section--compact,
.ezra-ui-field-group--compact {
  gap: var(--ezra-ui-stack-gap-compact, 12px);
}

.ezra-ui-stack--loose,
.ezra-ui-section--loose,
.ezra-ui-field-group--loose {
  gap: var(--ezra-ui-stack-gap-loose, clamp(18px, 2vw, 24px));
}

.ezra-ui-metadata {
  gap: var(--ezra-ui-stack-gap, clamp(14px, 1.4vw, 16px));
  padding-top: var(--ezra-ui-metadata-padding-block-start, var(--ezra-ui-space-xs, 8px));
  border-top: 1px solid var(--ezra-ui-metadata-border, var(--panel-border));
}

.ezra-ui-metadata--top {
  padding-top: 0;
  border-top: 0;
}

.ezra-ui-unavailable-state {
  display: grid;
  min-height: var(--ezra-ui-unavailable-state-min-height, 12rem);
  place-items: center;
  padding: var(--ezra-ui-unavailable-state-padding, 1rem);
}

.ezra-ui-unavailable-state > * {
  margin: 0;
}

.ezra-ui-field-group-header {
  display: grid;
  gap: var(--ezra-ui-row-gap-compact, 6px);
  min-width: 0;
}

.ezra-ui-field-group + .ezra-ui-field-group {
  margin-top: var(--ezra-ui-field-group-adjacent-gap, var(--ezra-ui-space-2xl, 32px));
}

.ezra-ui-action-bar {
  gap: var(--ezra-ui-row-gap, 10px);
}

.ezra-ui-row,
.ezra-ui-cluster,
.ezra-ui-field-row {
  min-width: 0;
}

.ezra-ui-row,
.ezra-ui-cluster {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ezra-ui-row-gap, 10px);
}

.ezra-ui-row--compact,
.ezra-ui-cluster--compact {
  gap: var(--ezra-ui-row-gap-compact, 6px);
}

.ezra-ui-row--loose,
.ezra-ui-cluster--loose {
  gap: var(--ezra-ui-row-gap-loose, 12px);
}

.ezra-ui-row--start,
.ezra-ui-cluster--start {
  align-items: flex-start;
}

.ezra-ui-row--between,
.ezra-ui-cluster--between,
.ezra-ui-action-bar--between {
  justify-content: space-between;
}

.ezra-ui-field-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--ezra-ui-field-row-gap, var(--ezra-ui-grid-gap, 14px));
}

.ezra-ui-field-row > * {
  min-width: 0;
}

.ezra-ui-field-row--align-start {
  align-items: start;
}

@media (max-width: 1180px) {
  .ezra-ui-split-layout {
    grid-template-columns:
      minmax(16.5rem, clamp(16.5rem, 33vw, 21rem))
      minmax(0, 1fr);
  }
}

@media (max-width: 860px) {
  .ezra-ui-split-layout {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .ezra-ui-panel {
    --ezra-ui-panel-padding: 12px;
  }

  .ezra-ui-panel--list,
  .ezra-ui-panel--editor {
    min-width: 0;
    width: 100%;
  }

  .ezra-ui-panel--list {
    display: flex;
    flex-direction: column;
    height: auto !important;
    min-height: 0;
    padding-bottom: 12px;
  }

  .ezra-ui-panel-body--mobile-collapsible,
  .ezra-ui-panel-body--list {
    display: none;
    min-height: 0;
    width: 100%;
  }

  .ezra-ui-panel-body--mobile-collapsible.is-open,
  .ezra-ui-panel-body--list.is-open {
    display: flex;
    flex-direction: column;
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
    height: auto;
    max-height: min(70dvh, 34rem);
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-y;
  }

  .ezra-ui-panel-body--mobile-collapsible.is-open .ezra-ui-list-scroll,
  .ezra-ui-panel-body--list.is-open .ezra-ui-list-scroll {
    height: auto;
    max-height: none;
    contain: none;
    flex: 0 1 auto;
  }
}

@media (max-width: 720px) {
  .ezra-ui-stack,
  .ezra-ui-metadata {
    gap: var(--ezra-ui-mobile-stack-gap, 14px);
  }

  .ezra-ui-field-row {
    grid-template-columns: 1fr;
    gap: var(--ezra-ui-mobile-field-row-gap, 12px);
  }
}

.ezra-ui-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  max-width: 100%;
  min-height: var(--ezra-ui-button-min-height, 40px);
  padding:
    var(--ezra-ui-button-padding-block, 10px)
    var(--ezra-ui-button-padding-inline, 16px);
  appearance: none;
  border: 0;
  font-family: var(--header-font);
  font-weight: 700;
  font-size: var(--ezra-ui-button-font-size, 1rem);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: var(--ezra-ui-button-line-height, 1.05);
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  text-decoration: none;
  cursor: pointer;
  box-sizing: border-box;
}

.ezra-ui-button--small {
  min-height: var(--ezra-ui-button-small-min-height, 34px);
  padding:
    var(--ezra-ui-button-small-padding-block, 8px)
    var(--ezra-ui-button-small-padding-inline, 12px);
  font-size: var(--ezra-ui-button-small-font-size, 0.9rem);
}

.ezra-ui-repeater-standard-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.ezra-ui-repeater-standard-actions .ezra-ui-repeater-icon-button {
  width: 2.25rem;
  min-width: 2.25rem;
  min-height: 2.25rem;
  padding: 0;
  font-size: 1rem;
  line-height: 1;
}

.ezra-ui-button--responsive-width {
  width: var(--ezra-ui-button-responsive-width, fit-content);
  justify-self: var(--ezra-ui-button-responsive-justify-self, start);
}

@media (max-width: 860px) {
  .ezra-ui-button--responsive-width {
    width: var(--ezra-ui-button-responsive-mobile-width, 100%);
    justify-self: var(--ezra-ui-button-responsive-mobile-justify-self, stretch);
  }
}

.ezra-ui-button--primary {
  background: var(--ezra-app-surface-primary-button-background, var(--button-background-color));
  color: var(--ezra-app-surface-primary-button-text, var(--button-text-color));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-primary-button-border, color-mix(in srgb, var(--button-background-color) 72%, transparent));
}

.ezra-ui-button--primary:hover {
  background: var(--ezra-app-surface-primary-button-hover-background, var(--button-text-color));
  color: var(--ezra-app-surface-primary-button-hover-text, var(--button-background-color));
  box-shadow: inset 0 0 0 2px var(--ezra-app-surface-primary-button-hover-border, var(--button-background-color));
}

.ezra-ui-button--important {
  background: var(--ezra-app-surface-important-button-background, color-mix(in srgb, var(--ezra-ui-theme-accent-strong, var(--yellow, var(--input-highlight-color))) 16%, transparent));
  color: var(--ezra-app-surface-important-button-text, var(--h1-color, var(--text-color)));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-important-button-border, color-mix(in srgb, var(--ezra-ui-theme-accent-strong, var(--yellow, var(--input-highlight-color))) 68%, var(--border-color)));
}

.ezra-ui-button--important:hover {
  background: var(--ezra-app-surface-important-button-hover-background, color-mix(in srgb, var(--ezra-ui-theme-accent-strong, var(--yellow, var(--input-highlight-color))) 24%, transparent));
  color: var(--ezra-app-surface-important-button-hover-text, var(--h1-color, var(--text-color)));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-important-button-hover-border, var(--ezra-ui-theme-accent-strong, var(--yellow, var(--input-highlight-color))));
}

.ezra-ui-button--secondary-important {
  background: var(--ezra-app-surface-secondary-important-button-background, transparent);
  color: var(--ezra-app-surface-secondary-important-button-text, var(--h1-color, var(--text-color)));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-secondary-important-button-border, var(--ezra-app-surface-important-button-accent, var(--ezra-ui-theme-accent-strong, var(--input-highlight-color))));
}

.ezra-ui-button--secondary-important:hover {
  background: var(--ezra-app-surface-secondary-important-button-hover-background, transparent);
  color: var(--ezra-app-surface-secondary-important-button-hover-text, var(--ezra-app-surface-secondary-important-button-text, var(--h1-color, var(--text-color))));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-secondary-important-button-hover-border, var(--ezra-app-surface-important-button-accent, var(--ezra-ui-theme-accent-strong, var(--input-highlight-color))));
}

.ezra-ui-button--secondary {
  background: var(--ezra-app-surface-secondary-button-background, color-mix(in srgb, var(--button-background-color) 10%, transparent));
  color: var(--ezra-app-surface-secondary-button-text, color-mix(in srgb, var(--text-color) 92%, var(--muted-color) 8%));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-secondary-button-border, color-mix(in srgb, var(--border-color) 34%, transparent));
}

.ezra-ui-button--secondary:hover {
  background: var(--ezra-app-surface-secondary-button-hover-background, color-mix(in srgb, var(--button-background-color) 18%, transparent));
  color: var(--ezra-app-surface-secondary-button-hover-text, var(--text-color));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-secondary-button-hover-border, color-mix(in srgb, var(--border-color) 48%, transparent));
}

.ezra-ui-button--ghost {
  background: transparent;
  color: var(--ezra-app-surface-ghost-button-text, color-mix(in srgb, var(--text-color) 82%, var(--muted-color) 18%));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-ghost-button-border, color-mix(in srgb, var(--panel-border) 82%, transparent));
}

.ezra-ui-button--ghost:hover {
  background: var(--ezra-app-surface-ghost-button-hover-background, color-mix(in srgb, var(--text-color) 6%, transparent));
  color: var(--ezra-app-surface-ghost-button-hover-text, var(--text-color));
}

.ezra-ui-button--danger {
  background: var(--ezra-app-surface-danger-button-background, transparent);
  color: var(--ezra-app-surface-danger-button-text, var(--red));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-danger-button-border, color-mix(in srgb, var(--red) 58%, transparent));
}

.ezra-ui-button--danger:hover {
  background: var(--ezra-app-surface-danger-button-hover-background, transparent);
  color: var(--ezra-app-surface-danger-button-hover-text, var(--red));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-danger-button-hover-border, color-mix(in srgb, var(--red) 78%, transparent));
}

.ezra-ui-button:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)),
    inset 0 0 0 1px color-mix(in srgb, var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)) 18%, transparent);
}

.ezra-ui-button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.ezra-ui-toggle-switch-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  align-items: center;
  justify-content: start;
  min-width: 0;
  width: min(100%, var(--ezra-ui-toggle-switch-width, 168px));
}

.ezra-ui-toggle-switch-labels {
  display: grid;
  grid-template-columns: repeat(var(--ezra-ui-toggle-switch-position-count, 2), minmax(0, 1fr));
  align-items: start;
  width: 100%;
}

.ezra-ui-toggle-switch-label {
  appearance: none;
  min-width: 0;
  padding: 0 2px;
  border: 0;
  background: transparent;
  color: var(--label-color);
  font-family: var(--header-font);
  font-size: var(--ezra-ui-toggle-switch-label-size, 0.68rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
  text-align: center;
  text-transform: uppercase;
  opacity: 0.62;
  white-space: nowrap;
  cursor: pointer;
}

.ezra-ui-toggle-switch-label[data-active="true"] {
  color: var(--ezra-ui-toggle-switch-active-label-color, var(--ezra-ui-widget-title-color, var(--h1-color)));
  opacity: 1;
}

.ezra-ui-toggle-switch-label:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.ezra-ui-toggle-switch {
  position: relative;
  display: grid;
  grid-template-columns: repeat(var(--ezra-ui-toggle-switch-position-count, 2), minmax(0, 1fr));
  width: 100%;
  height: var(--ezra-ui-toggle-switch-height, 26px);
  min-width: 0;
  min-height: var(--ezra-ui-toggle-switch-height, 26px);
  padding: var(--ezra-ui-toggle-switch-padding, 2px);
  appearance: none;
  border: 1px solid var(--ezra-ui-toggle-switch-border, var(--ezra-ui-widget-shell-border, var(--panel-border)));
  border-radius: var(--ezra-ui-toggle-switch-radius, 999px);
  background: var(--ezra-ui-toggle-switch-background, var(--ezra-ui-control-surface-background, var(--surface-quiet)));
  color: inherit;
  cursor: pointer;
}

.ezra-ui-toggle-switch-position {
  position: relative;
  z-index: 1;
  min-width: 0;
  padding: 0;
  appearance: none;
  border: 0;
  border-radius: calc(var(--ezra-ui-toggle-switch-radius, 999px) - var(--ezra-ui-toggle-switch-padding, 2px));
  background: transparent;
  cursor: pointer;
}

.ezra-ui-toggle-switch-position:hover {
  background: color-mix(in srgb, var(--ezra-ui-toggle-switch-thumb-color, var(--ezra-ui-widget-title-color, currentColor)) 8%, transparent);
}

.ezra-ui-toggle-switch-position:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)),
    inset 0 0 0 1px color-mix(in srgb, var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)) 18%, transparent);
}

.ezra-ui-toggle-switch-thumb {
  position: absolute;
  inset-block: var(--ezra-ui-toggle-switch-padding, 2px);
  inset-inline-start: var(--ezra-ui-toggle-switch-padding, 2px);
  display: block;
  width: calc((100% - (var(--ezra-ui-toggle-switch-padding, 2px) * 2)) / var(--ezra-ui-toggle-switch-position-count, 2));
  height: auto;
  transform: translateX(calc(var(--ezra-ui-toggle-switch-active-index, 0) * 100%));
  transition: transform var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-toggle-switch-thumb::after {
  content: "";
  position: absolute;
  inset-block-start: 50%;
  inset-inline-start: 50%;
  inline-size: var(--ezra-ui-toggle-switch-thumb-size, 20px);
  block-size: var(--ezra-ui-toggle-switch-thumb-size, 20px);
  border-radius: var(--ezra-ui-toggle-switch-thumb-radius, 50%);
  background: var(--ezra-ui-toggle-switch-thumb-color, var(--ezra-ui-widget-title-color, currentColor));
  transform: translate(-50%, -50%);
}

.ezra-ui-toggle-switch:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)),
    inset 0 0 0 1px color-mix(in srgb, var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)) 18%, transparent);
}

.ezra-ui-toggle-switch:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.ezra-ui-toggle-switch[data-disabled="true"],
.ezra-ui-toggle-switch[data-disabled="true"] .ezra-ui-toggle-switch-position {
  cursor: not-allowed;
}

.ezra-ui-field {
  display: flex;
  flex-direction: column;
  gap: var(--ezra-ui-row-gap-compact, 8px);
  min-width: 0;
}

.ezra-ui-label {
  display: inline-flex;
  align-items: center;
  min-height: 0;
  color: var(--label-color);
  font-family: var(--header-font);
  font-weight: 700;
  font-size: 0.82rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1;
}

.ezra-ui-help {
  margin: 0;
  color: var(--muted-color);
  font-size: 0.95rem;
  line-height: 1.35;
}

.ezra-ui-input,
.ezra-ui-field input,
.ezra-ui-field textarea,
.ezra-ui-field select {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 44px;
  padding: 12px 14px;
  border: 1px solid var(--ezra-ui-theme-input-border, var(--panel-border));
  border-radius: 0;
  background: var(--input-bg);
  color: var(--text-color);
  font-family: var(--body-font);
  font-size: 1rem;
  line-height: 1.4;
  box-sizing: border-box;
  scroll-margin-top: 16px;
}

.ezra-ui-input:focus,
.ezra-ui-input:focus-visible,
.ezra-ui-field input:focus,
.ezra-ui-field input:focus-visible,
.ezra-ui-field textarea:focus,
.ezra-ui-field textarea:focus-visible,
.ezra-ui-field select:focus,
.ezra-ui-field select:focus-visible {
  outline: none;
  border-color: var(--focus-ring);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--focus-ring) 35%, transparent),
    inset 0 0 0 1px var(--focus-ring);
}

.ezra-ui-input::placeholder,
.ezra-ui-field input::placeholder,
.ezra-ui-field textarea::placeholder {
  color: var(--muted-color);
}

.ezra-ui-select {
  -webkit-appearance: none;
  appearance: none;
  padding-right: 42px;
  background-image:
    linear-gradient(45deg, transparent 50%, currentColor 50%),
    linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position:
    calc(100% - 18px) calc(50% - 2px),
    calc(100% - 12px) calc(50% - 2px);
  background-size:
    6px 6px,
    6px 6px;
  background-repeat: no-repeat;
}

.ezra-ui-textarea {
  resize: vertical;
  min-height: 0;
}

.ezra-ui-field--checkbox {
  gap: 8px;
}

.ezra-ui-checkbox-row,
.ezra-ui-radio-row {
  display: inline-flex;
  align-items: center;
  gap: var(--ezra-ui-checkbox-label-gap, 0.42em);
  width: fit-content;
  max-width: 100%;
  cursor: pointer;
}

.ezra-ui-checkbox,
.ezra-ui-radio {
  flex: 0 0 auto;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
  margin: 0;
  padding: 0;
  accent-color: var(--input-highlight-color);
}

.ezra-ui-checkbox-label,
.ezra-ui-radio-label {
  color: var(--ezra-ui-theme-checkbox-text, var(--text-color));
  font: inherit;
  line-height: 1.2;
}

.ezra-ui-checkbox:focus,
.ezra-ui-radio:focus {
  outline: none;
  box-shadow: 0 0 0 2px var(--focus-ring);
}

.ezra-ui-file-field {
  display: grid;
  gap: var(--ezra-ui-row-gap-compact, 8px);
  min-width: 0;
}

.ezra-ui-file-control {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  min-width: 0;
  border: 1px solid var(--ezra-ui-theme-input-border, var(--panel-border));
  background: var(--input-bg);
  color: var(--text-color);
  padding: 0.45rem 0.6rem;
  box-sizing: border-box;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ezra-ui-theme-input-border, var(--panel-border)) 28%, transparent);
}

.ezra-ui-file-field .ezra-ui-input.ezra-ui-file-input {
  position: absolute;
  width: 1px;
  height: 1px;
  min-width: 1px;
  max-width: 1px;
  min-height: 1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.ezra-ui-file-button {
  min-height: 34px;
}

.ezra-ui-file-name {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--muted-color);
}

.ezra-ui-stepper {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--ezra-ui-stepper-control-width, 34px);
  align-items: stretch;
  min-width: 0;
}

.ezra-ui-stepper .ezra-ui-input {
  min-height: var(--ezra-ui-stepper-input-height, 44px);
}

.ezra-ui-stepper-controls {
  display: grid;
  grid-template-rows: 1fr 1fr;
  min-width: 0;
}

.ezra-ui-stepper-button {
  appearance: none;
  display: inline-grid;
  place-items: center;
  width: 100%;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-left: 1px solid var(--ezra-ui-theme-input-border, var(--panel-border));
  background: var(--ezra-ui-stepper-button-bg, color-mix(in srgb, var(--input-bg) 78%, var(--surface-hover) 22%));
  color: var(--ezra-ui-stepper-button-text, var(--label-color));
  cursor: pointer;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--panel-border) 62%, transparent);
}

.ezra-ui-stepper-button + .ezra-ui-stepper-button {
  border-top: 1px solid var(--ezra-ui-theme-input-border, var(--panel-border));
}

.ezra-ui-stepper-button:hover,
.ezra-ui-stepper-button:focus-visible {
  background: var(--ezra-ui-stepper-button-hover-bg, var(--surface-hover));
  color: var(--ezra-ui-stepper-button-hover-text, var(--h1-color));
}

.ezra-ui-stepper-button:focus-visible {
  outline: none;
  box-shadow:
    inset 0 0 0 1px var(--focus-ring),
    0 0 0 1px color-mix(in srgb, var(--focus-ring) 35%, transparent);
}

.ezra-ui-stepper-button-icon {
  width: 12px;
  height: 8px;
}

.ezra-ui-stepper-button-icon path {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: square;
  stroke-linejoin: miter;
}

.ezra-ui-form-message,
.ezra-ui-form-error {
  margin: 0;
}

.ezra-ui-form-message {
  color: var(--message-success-text, var(--text-color));
}

.ezra-ui-form-error {
  color: var(--message-error-text, var(--danger-color, #b42318));
}
.ezra-ui-control-menu-shell,
.ezra-ui-theme-menu-shell {
  position: relative;
  min-width: 0;
}

.ezra-ui-control-menu-shell:has(.ezra-ui-control-menu:not([hidden])) {
  z-index: var(--ezra-ui-layer-control-popup, var(--ezra-ui-layer-workspace-dropdown, 60));
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu-shell:has(.ezra-ui-theme-menu:not([hidden])) {
  z-index: var(--ezra-ui-layer-control-popup, var(--ezra-ui-layer-workspace-dropdown, 60));
}

.ezra-ui-theme-picker--app-surface {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  width: auto;
  min-width: 0;
  max-width: 100%;
  flex-wrap: nowrap;
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-picker-label {
  display: inline-flex;
  align-items: center;
  min-height: 0;
  white-space: nowrap;
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu-shell {
  width: max-content;
  min-width: max(170px, calc((var(--ezra-ui-theme-picker-max-label-chars, 12) * 0.72em) + 76px));
  max-width: 100%;
  z-index: var(--ezra-ui-layer-workspace-menu, 40);
}

.ezra-ui-control-menu-button,
.ezra-ui-theme-menu-button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 180px;
  max-width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid var(
    --ezra-ui-theme-picker-button-border,
    var(--ezra-ui-control-menu-button-border, var(--ezra-ui-control-menu-row-border, var(--panel-border-strong)))
  );
  background: var(
    --ezra-ui-theme-picker-button-background,
    var(--ezra-ui-control-menu-button-background, var(--ezra-ui-control-menu-row-background, var(--input-bg)))
  );
  color: var(
    --ezra-ui-theme-picker-button-heading,
    var(--ezra-ui-control-menu-button-text, var(--ezra-ui-control-menu-row-heading, var(--text-color)))
  );
  font-family: var(--header-font);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1;
  text-transform: uppercase;
  text-align: left;
  cursor: pointer;
  box-sizing: border-box;
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu-button {
  min-width: max(170px, calc((var(--ezra-ui-theme-picker-max-label-chars, 12) * 0.72em) + 76px));
  min-height: 42px;
  padding: 9px 12px;
  font-size: 0.82rem;
  letter-spacing: 0.04em;
}

.ezra-ui-control-menu-button--has-leading-icon,
.ezra-ui-theme-menu-button--has-leading-icon {
  grid-template-columns: auto minmax(0, 1fr) auto;
}

.ezra-ui-control-menu-button:hover,
.ezra-ui-theme-menu-button:hover {
  background: color-mix(
    in srgb,
    var(
      --ezra-ui-theme-picker-button-background,
      var(--ezra-ui-control-menu-button-background, var(--input-bg))
    ) 88%,
    var(--ezra-ui-theme-picker-button-accent, var(--ezra-ui-control-menu-accent, var(--label-color))) 12%
  );
}

.ezra-ui-control-menu-button:focus-visible,
.ezra-ui-control-menu-item:focus-visible,
.ezra-ui-theme-menu-button:focus-visible,
.ezra-ui-theme-menu-item:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--focus-ring);
}

.ezra-ui-control-menu-button-label,
.ezra-ui-control-menu-item-label,
.ezra-ui-theme-menu-button-label,
.ezra-ui-theme-menu-item-label {
  min-width: 0;
}

.ezra-ui-control-menu-button-label,
.ezra-ui-theme-menu-button-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ezra-ui-control-menu-item-label,
.ezra-ui-theme-menu-item-label {
  overflow-wrap: anywhere;
}

.ezra-ui-control-menu-button-caret,
.ezra-ui-theme-menu-button-caret {
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 7px solid currentColor;
  flex: 0 0 auto;
}

.ezra-ui-theme-menu-button .ezra-ui-theme-menu-icon {
  color: var(
    --ezra-ui-theme-picker-button-accent,
    var(--ezra-ui-control-menu-row-accent, var(--label-color))
  );
}

.ezra-ui-control-menu,
.ezra-ui-theme-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: var(--ezra-ui-layer-workspace-menu, 40);
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(
    --ezra-ui-control-popup-border,
    var(--ezra-ui-control-menu-row-border, var(--panel-border-strong))
  );
  background: var(
    --ezra-ui-control-popup-background,
    var(--ezra-ui-control-menu-row-background, var(--panel-color))
  );
  box-shadow: 0 16px 34px color-mix(in srgb, var(--background-color) 30%, transparent);
  box-sizing: border-box;
}

.ezra-ui-control-menu-shell > .ezra-ui-control-popup-surface.ezra-ui-control-menu,
.ezra-ui-theme-menu-shell > .ezra-ui-control-popup-surface.ezra-ui-theme-menu {
  position: absolute;
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu {
  right: 0;
  left: auto;
  gap: 6px;
  width: max-content;
  min-width: max(170px, calc((var(--ezra-ui-theme-picker-max-label-chars, 12) * 0.72em) + 76px));
  max-width: min(100vw - 24px, max(170px, calc((var(--ezra-ui-theme-picker-max-label-chars, 12) * 0.72em) + 76px)));
  padding: 8px;
  box-shadow: none;
}

.ezra-ui-control-menu[hidden],
.ezra-ui-theme-menu[hidden] {
  display: none !important;
}

.ezra-ui-control-menu-item,
.ezra-ui-theme-menu-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 0;
  min-height: 40px;
  padding: 10px 12px;
  border: 0;
  background: var(--ezra-ui-control-menu-row-background, transparent);
  color: var(--ezra-ui-control-menu-row-text, var(--text-color));
  text-align: left;
  font-family: var(--body-font);
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: none;
  cursor: pointer;
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu-item {
  min-height: 42px;
  padding: 10px 12px;
  border: 0;
  box-shadow: inset 0 0 0 1px var(
    --ezra-ui-theme-picker-item-border,
    var(--ezra-ui-control-menu-row-border, var(--panel-border-strong))
  );
  font-family: var(--header-font);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1;
  text-transform: uppercase;
}

.ezra-ui-control-menu-item--themed,
.ezra-ui-theme-menu-item--themed {
  background: var(
    --ezra-ui-theme-picker-item-background,
    var(--ezra-ui-control-menu-row-background, var(--background-color))
  );
  color: var(
    --ezra-ui-theme-picker-item-text,
    var(--ezra-ui-control-menu-row-text, var(--text-color))
  );
  box-shadow: inset 0 0 0 1px var(
    --ezra-ui-theme-picker-item-border,
    var(--ezra-ui-control-menu-row-border, var(--panel-border-strong))
  );
}

.ezra-ui-control-menu-item--themed:hover,
.ezra-ui-theme-menu-item--themed:hover {
  background: color-mix(
    in srgb,
    var(
      --ezra-ui-theme-picker-item-background,
      var(--ezra-ui-control-menu-row-background, var(--background-color))
    ) 88%,
    var(--ezra-ui-control-menu-row-accent, var(--label-color)) 12%
  );
}

.ezra-ui-control-menu-item--themed .ezra-ui-theme-menu-icon,
.ezra-ui-theme-menu-item--themed .ezra-ui-theme-menu-icon {
  color: var(
    --ezra-ui-theme-menu-item-accent,
    var(
      --ezra-ui-theme-picker-menu-item-accent,
      var(--ezra-ui-control-menu-row-accent, var(--label-color))
    )
  );
}

.ezra-ui-control-menu-item--reset-theme,
.ezra-ui-theme-menu-item--reset-theme {
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  min-height: 42px;
  background: var(
    --ezra-app-surface-secondary-button-background,
    color-mix(in srgb, var(--button-background-color, var(--input-highlight-color)) 12%, var(--background-color, transparent))
  );
  color: var(--ezra-app-surface-secondary-button-text, var(--text-color));
  font-family: var(--header-font);
  font-weight: 700;
  letter-spacing: 0.03em;
  text-align: center;
  text-transform: uppercase;
  box-shadow: inset 0 0 0 1px var(
    --ezra-app-surface-secondary-button-border,
    color-mix(in srgb, var(--button-background-color, var(--input-highlight-color)) 42%, var(--border-color))
  );
}

.ezra-ui-control-menu-item--reset-theme:hover,
.ezra-ui-theme-menu-item--reset-theme:hover {
  background: var(
    --ezra-app-surface-secondary-button-hover-background,
    color-mix(in srgb, var(--button-background-color, var(--input-highlight-color)) 18%, var(--background-color, transparent))
  );
  color: var(
    --ezra-app-surface-secondary-button-hover-text,
    var(--ezra-app-surface-secondary-button-text, var(--text-color))
  );
  box-shadow: inset 0 0 0 1px var(
    --ezra-app-surface-secondary-button-hover-border,
    color-mix(in srgb, var(--button-background-color, var(--input-highlight-color)) 62%, var(--border-color))
  );
}

.ezra-ui-control-menu-item--reset-theme .ezra-ui-theme-menu-icon,
.ezra-ui-theme-menu-item--reset-theme .ezra-ui-theme-menu-icon {
  display: none;
}

.ezra-ui-control-menu-item--reset-theme .ezra-ui-theme-menu-item-label,
.ezra-ui-theme-menu-item--reset-theme .ezra-ui-theme-menu-item-label {
  color: currentColor;
  font-family: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
}

.ezra-ui-control-menu-item--themed .ezra-ui-theme-menu-item-label,
.ezra-ui-theme-menu-item--themed .ezra-ui-theme-menu-item-label,
.ezra-ui-control-menu-item--none .ezra-ui-theme-menu-item-label,
.ezra-ui-theme-menu-item--none .ezra-ui-theme-menu-item-label {
  color: var(
    --ezra-ui-theme-picker-menu-item-heading,
    var(--ezra-ui-control-menu-row-heading, var(--text-color))
  );
  font-family: var(--header-font);
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.ezra-ui-control-menu-item:hover,
.ezra-ui-theme-menu-item:hover {
  background: color-mix(
    in srgb,
    var(
      --ezra-ui-theme-picker-item-background,
      var(--ezra-ui-control-menu-row-background, var(--background-color))
    ) 90%,
    var(--ezra-ui-control-menu-row-accent, var(--label-color)) 10%
  );
}

.ezra-ui-control-menu-item-icon,
.ezra-ui-theme-menu-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

.ezra-ui-control-menu-item[aria-checked="true"],
.ezra-ui-theme-menu-item[aria-checked="true"] {
  box-shadow:
    inset 0 0 0 1px var(--ezra-ui-control-menu-row-border, var(--panel-border-strong)),
    inset 0 0 0 2px var(
      --ezra-ui-theme-menu-item-accent,
      var(
        --ezra-ui-theme-picker-menu-item-accent,
        var(
          --ezra-ui-theme-picker-button-accent,
          var(--ezra-ui-control-menu-row-accent, var(--label-color))
        )
      )
    );
}

.ezra-ui-control-menu-item[data-ezra-ui-menu-option-active="true"],
.ezra-ui-theme-menu-item[data-ezra-ui-menu-option-active="true"] {
  background: color-mix(
    in srgb,
    var(
      --ezra-ui-theme-menu-item-accent,
      var(
        --ezra-ui-theme-picker-menu-item-accent,
        var(
          --ezra-ui-theme-picker-button-accent,
          var(--ezra-ui-control-menu-row-accent, var(--label-color))
        )
      )
    ) 12%,
    var(--ezra-ui-control-menu-row-background, transparent)
  );
  box-shadow: inset 0 0 0 2px color-mix(
    in srgb,
    var(
      --ezra-ui-theme-menu-item-accent,
      var(
        --ezra-ui-theme-picker-menu-item-accent,
        var(
          --ezra-ui-theme-picker-button-accent,
          var(--ezra-ui-control-menu-row-accent, var(--label-color))
        )
      )
    ) 54%,
    transparent
  );
}

.ezra-ui-control-menu--compact-text,
.ezra-ui-control-menu--compact-text .ezra-ui-control-menu-item-label,
.ezra-ui-control-menu--compact-text .ezra-ui-theme-menu-item-label,
.ezra-ui-control-menu--compact-text p {
  font-size: 1rem;
  line-height: 1.15;
}

.ezra-ui-control-menu-item-line {
  display: block;
  width: 18px;
  height: 0;
  border-top: 2px solid currentColor;
}

.ezra-ui-theme-menu-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: var(--ezra-ui-theme-menu-icon-size, 18px);
  height: var(--ezra-ui-theme-menu-icon-size, 18px);
}

.ezra-ui-theme-menu-icon svg,
.ezra-ui-theme-menu-icon img,
.ezra-ui-control-menu-item-icon svg,
.ezra-ui-control-menu-item-icon img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
}

.ezra-ui-theme-menu-icon--swatch {
  border: 1px solid var(--panel-border-strong);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 18%, transparent);
}
.ezra-ui-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 2px 10px;
  border: 1px solid var(--badge-color);
  border-radius: var(--ezra-ui-badge-radius, 999px);
  font-family: var(--header-font);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.78rem;
  line-height: 1;
}
.ezra-ui-badge--published {
  color: var(--badge-published-color);
  border-color: var(--badge-published-border);
  background: var(--badge-published-bg);
}
.ezra-ui-badge--draft {
  color: var(--h1-color, var(--text-color));
  border-color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-border));
  background: color-mix(in srgb, var(--ezra-app-surface-important-button-accent, var(--badge-draft-border)) 10%, transparent);
}
.ezra-ui-badge--ready {
  color: var(--badge-ready-color);
  border-color: var(--badge-ready-border);
  background: var(--badge-ready-bg);
}
.ezra-ui-badge--new {
  color: var(--ezra-app-surface-important-button-text, var(--h1-color, var(--text-color)));
  border-color: var(--ezra-app-surface-important-button-border, var(--ezra-app-surface-important-button-accent, var(--badge-draft-border)));
  background: var(--ezra-app-surface-important-button-background, color-mix(in srgb, var(--ezra-app-surface-important-button-accent, var(--badge-draft-border, var(--input-highlight-color))) 16%, transparent));
}
.ezra-ui-badge--edited {
  color: var(--ezra-app-surface-important-button-accent, var(--badge-featured-color));
  border-color: var(--ezra-app-surface-important-button-accent, var(--badge-featured-border));
  background: color-mix(in srgb, var(--ezra-app-surface-important-button-accent, var(--badge-featured-border)) 10%, transparent);
}
.ezra-ui-badge--updated {
  color: var(--ezra-app-surface-important-button-accent, var(--badge-featured-color));
  border-color: var(--ezra-app-surface-important-button-accent, var(--badge-featured-border));
  background: color-mix(in srgb, var(--ezra-app-surface-important-button-accent, var(--badge-featured-border)) 10%, transparent);
}
.ezra-ui-badge--delete {
  color: var(--badge-delete-color);
  border-color: var(--badge-delete-border);
  background: var(--badge-delete-bg);
}
.ezra-ui-badge--featured {
  color: var(--badge-featured-color);
  border-color: var(--badge-featured-border);
  background: var(--badge-featured-bg);
}
.ezra-ui-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ezra-ui-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 4px 12px;
  border: 1px solid var(--chip-border);
  border-radius: var(--ezra-ui-chip-radius, 999px);
  background: var(--chip-bg);
  color: var(--chip-color);
  font-family: var(--header-font);
  font-weight: 700;
  font-size: 0.95rem;
  min-width: 0;
  max-width: 100%;
  cursor: grab;
  touch-action: none;
  user-select: none;
}
.ezra-ui-chip-label {
  min-width: 0;
  overflow-wrap: anywhere;
}
.ezra-ui-chip button {
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
  line-height: 1;
  flex-shrink: 0;
}
.ezra-ui-widget-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.75rem;
  padding: 0.15rem 0.6rem;
  border-radius: var(--ezra-ui-widget-badge-radius, 999px);
  border: 1px solid var(--panel-border-strong);
  background: var(--ezra-ui-widget-summary-bg, var(--surface-quiet));
  color: var(--badge-color);
  font-family: var(--header-font);
  font-size: 0.78rem;
  line-height: 1;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.ezra-ui-widget-badge.is-neutral {
  color: var(--badge-color);
}
.ezra-ui-widget-badge.is-published,
.ezra-ui-widget-badge.is-success {
  color: var(--badge-published-color);
  border-color: var(--badge-published-border);
  background: var(--badge-published-bg);
}
.ezra-ui-widget-badge.is-draft {
  color: var(--badge-draft-color);
  border-color: var(--badge-draft-border);
  background: var(--badge-draft-bg);
}
.ezra-ui-widget-badge.is-featured {
  color: var(--badge-featured-color);
  border-color: var(--badge-featured-border);
  background: var(--badge-featured-bg);
}
.ezra-ui-widget-badge.is-error {
  color: var(--badge-draft-color);
  border-color: var(--message-error-border);
  background: var(--message-error-bg);
}
.ezra-mode-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  flex: 0 0 auto;
  height: var(--ezra-ui-app-header-badge-height, 2rem);
  min-height: var(--ezra-ui-app-header-badge-height, 2rem);
  margin: 0;
  padding: 0 var(--ezra-ui-app-header-badge-padding-inline, 10px);
  border: 1px solid color-mix(in srgb, var(--text-color) 22%, transparent);
  background: color-mix(in srgb, var(--panel-color) 82%, var(--background-color) 18%);
  border-radius: var(--ezra-mode-badge-radius, 999px);
  box-sizing: border-box;
  font-family: var(--header-font);
  font-size: var(--ezra-ui-app-header-badge-font-size, 0.78rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.ezra-mode-badge.is-dev {
  color: var(--ezra-ui-app-header-badge-accent, var(--label-color));
  border-color: color-mix(in srgb, var(--ezra-ui-app-header-badge-accent, var(--label-color)) 40%, transparent);
  background: color-mix(in srgb, var(--ezra-ui-app-header-badge-accent, var(--label-color)) 10%, transparent);
}
.ezra-mode-badge.is-live {
  color: color-mix(in srgb, var(--text-color) 68%, transparent);
  border-color: color-mix(in srgb, var(--text-color) 10%, transparent);
  background: color-mix(in srgb, var(--text-color) 3%, transparent);
}
.ezra-mode-badge.is-hidden {
  visibility: hidden;
}
@media (max-width: 640px) {
  .ezra-ui-chip {
    max-width: 100%;
    overflow-wrap: anywhere;
    min-height: 32px;
    padding: 4px 10px;
    font-size: 0.9rem;
  }
}
@media (max-width: 860px) {
  .ezra-mode-badge {
    height: var(--ezra-ui-app-header-badge-height, 2rem);
    min-height: var(--ezra-ui-app-header-badge-height, 2rem);
    padding: 0 var(--ezra-ui-app-header-badge-padding-inline, 10px);
    font-size: var(--ezra-ui-app-header-badge-font-size, 0.78rem);
    letter-spacing: 0.05em;
  }
}

[data-ezra-surface-frame] {
  --ezra-surface-frame-content-inline-size: 100%;
  --ezra-surface-frame-content-min-measure: 0px;
  --ezra-surface-frame-content-ideal-measure: 100%;
  --ezra-surface-frame-content-max-measure: 100%;
  --ezra-surface-frame-inset-inline-start: 0px;
  --ezra-surface-frame-inset-inline-end: 0px;
  --ezra-surface-frame-inset-block-start: 0px;
  --ezra-surface-frame-inset-block-end: 0px;
  --ezra-surface-frame-region-gap: 0px;
  --ezra-surface-frame-content-inline-alignment: stretch;
  --ezra-surface-frame-content-block-alignment: stretch;
  --ezra-surface-frame-text-align: start;
}

[data-ezra-surface-frame-region] {
  min-width: 0;
  box-sizing: border-box;
}

[data-ezra-surface-frame-block-mode="document-scroll"] {
  height: auto;
  min-height: 100%;
  overflow: visible;
}

[data-ezra-surface-frame-block-mode="internal-scroll"] [data-ezra-surface-frame-region="body"] {
  max-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
[data-ezra-surface-frame="app-canvas"] {
  --ezra-surface-frame-content-inline-size: var(--ezra-surface-shape-app-canvas-frame-content-inline-size, var(--ezra-surface-shape-frame-content-inline-size, 100%));
  --ezra-surface-frame-content-min-measure: var(--ezra-surface-shape-app-canvas-frame-content-min-measure, var(--ezra-surface-shape-frame-content-min-measure, 0px));
  --ezra-surface-frame-content-ideal-measure: var(--ezra-surface-shape-app-canvas-frame-content-ideal-measure, var(--ezra-surface-shape-frame-content-ideal-measure, 100%));
  --ezra-surface-frame-content-max-measure: var(--ezra-surface-shape-app-canvas-frame-content-max-measure, var(--ezra-surface-shape-frame-content-max-measure, none));
  --ezra-surface-frame-inset-inline-start: var(--ezra-surface-shape-app-canvas-frame-inset-inline-start, var(--ezra-surface-shape-frame-inset-inline-start, clamp(14px, 2.6vw, 32px)));
  --ezra-surface-frame-inset-inline-end: var(--ezra-surface-shape-app-canvas-frame-inset-inline-end, var(--ezra-surface-shape-frame-inset-inline-end, clamp(14px, 2.6vw, 32px)));
  --ezra-surface-frame-inset-block-start: var(--ezra-surface-shape-app-canvas-frame-inset-block-start, var(--ezra-surface-shape-frame-inset-block-start, clamp(20px, 3vw, 40px)));
  --ezra-surface-frame-inset-block-end: var(--ezra-surface-shape-app-canvas-frame-inset-block-end, var(--ezra-surface-shape-frame-inset-block-end, clamp(32px, 4.2vw, 56px)));
  --ezra-surface-frame-region-gap: var(--ezra-surface-shape-app-canvas-frame-region-gap, var(--ezra-surface-shape-frame-region-gap, 12px));
  --ezra-surface-frame-content-inline-alignment: var(--ezra-surface-shape-app-canvas-frame-content-inline-alignment, var(--ezra-surface-shape-frame-content-inline-alignment, stretch));
  --ezra-surface-frame-content-block-alignment: var(--ezra-surface-shape-app-canvas-frame-content-block-alignment, var(--ezra-surface-shape-frame-content-block-alignment, start));
  --ezra-surface-frame-text-align: var(--ezra-surface-shape-app-canvas-frame-text-align, var(--ezra-surface-shape-frame-text-align, start));
}

@media (max-width: 860px) {
  [data-ezra-surface-frame="app-canvas"] {
    --ezra-surface-frame-content-inline-size: var(--ezra-surface-shape-app-canvas-frame-content-inline-size, var(--ezra-surface-shape-frame-content-inline-size, 100%));
    --ezra-surface-frame-content-min-measure: var(--ezra-surface-shape-app-canvas-frame-content-min-measure, var(--ezra-surface-shape-frame-content-min-measure, 0px));
    --ezra-surface-frame-content-ideal-measure: var(--ezra-surface-shape-app-canvas-frame-content-ideal-measure, var(--ezra-surface-shape-frame-content-ideal-measure, 100%));
    --ezra-surface-frame-content-max-measure: var(--ezra-surface-shape-app-canvas-frame-content-max-measure, var(--ezra-surface-shape-frame-content-max-measure, none));
    --ezra-surface-frame-inset-inline-start: var(--ezra-surface-shape-app-canvas-frame-inset-inline-start, var(--ezra-surface-shape-frame-inset-inline-start, 12px));
    --ezra-surface-frame-inset-inline-end: var(--ezra-surface-shape-app-canvas-frame-inset-inline-end, var(--ezra-surface-shape-frame-inset-inline-end, 12px));
    --ezra-surface-frame-inset-block-start: var(--ezra-surface-shape-app-canvas-frame-inset-block-start, var(--ezra-surface-shape-frame-inset-block-start, 16px));
    --ezra-surface-frame-inset-block-end: var(--ezra-surface-shape-app-canvas-frame-inset-block-end, var(--ezra-surface-shape-frame-inset-block-end, 88px));
    --ezra-surface-frame-region-gap: var(--ezra-surface-shape-app-canvas-frame-region-gap, var(--ezra-surface-shape-frame-region-gap, 12px));
    --ezra-surface-frame-content-inline-alignment: var(--ezra-surface-shape-app-canvas-frame-content-inline-alignment, var(--ezra-surface-shape-frame-content-inline-alignment, stretch));
    --ezra-surface-frame-content-block-alignment: var(--ezra-surface-shape-app-canvas-frame-content-block-alignment, var(--ezra-surface-shape-frame-content-block-alignment, start));
    --ezra-surface-frame-text-align: var(--ezra-surface-shape-app-canvas-frame-text-align, var(--ezra-surface-shape-frame-text-align, start));
  }
}

.ezra-ui-widget-mode-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: stretch;
  align-self: start;
  justify-content: flex-end;
  justify-self: end;
  grid-column: 2;
  grid-row: 1;
}

.ezra-ui-widget-mode-actions .ezra-ui-widget-action,
.ezra-ui-widget-mode-actions .ezra-ui-button {
  min-height: var(--ezra-ui-widget-action-height, 44px);
  padding-block: var(--ezra-ui-widget-action-padding-block, 8px);
  padding-inline: var(--ezra-ui-widget-action-padding-inline, 12px);
  border-radius: 0;
  line-height: var(--ezra-ui-widget-action-line-height, 1.05);
  white-space: normal;
  overflow-wrap: anywhere;
}

.ezra-ui-widget-mode-corner-controls {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  justify-content: flex-end;
  min-width: 0;
}

.ezra-ui-widget-mode-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap:
    var(--ezra-ui-widget-mode-header-row-gap, 10px)
    var(--ezra-ui-widget-mode-header-column-gap, 12px);
  align-items: start;
  min-width: 0;
}

.ezra-ui-widget-mode-title {
  grid-column: 1;
  grid-row: 1;
  margin: 0;
}

.ezra-ui-widget-mode-eyebrow,
.ezra-ui-widget-mode-body {
  grid-column: 1 / -1;
  margin: 0;
}

.ezra-ui-widget-mode-eyebrow {
  grid-row: 1;
}

.ezra-ui-widget-mode-header:has(.ezra-ui-widget-mode-eyebrow) .ezra-ui-widget-mode-title,
.ezra-ui-widget-mode-header:has(.ezra-ui-widget-mode-eyebrow) .ezra-ui-widget-mode-actions {
  grid-row: 2;
}

.ezra-ui-widget-grid {
  --ezra-ui-widget-grid-gap: 12px;

  display: grid;
  gap: var(--ezra-ui-widget-grid-gap);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}

.ezra-ui-widget {
  box-sizing: border-box;
  display: grid;
  gap: 10px;
  grid-template-rows: auto auto auto;
  align-content: start;
  min-width: 0;
  max-width: 100%;
  min-height: var(--ezra-ui-widget-panel-slot-height, auto);
  padding: var(--ezra-ui-widget-padding, var(--ezra-ui-card-padding, 16px));
  border: 1px solid var(--ezra-ui-widget-shell-border, var(--ezra-ui-control-surface-border, var(--panel-border)));
  border-radius: var(--ezra-ui-widget-radius, 0);
  background: var(--ezra-ui-widget-shell-bg, var(--ezra-ui-control-surface-background, var(--surface-quiet)));
  box-shadow: var(--ezra-ui-widget-shell-shadow, none);
}

.ezra-ui-widget[data-ezra-ui-widget-column-span="2"] {
  grid-column: span 2;
}

.ezra-ui-widget[data-ezra-ui-widget-projected-panel-open="true"] {
  grid-column: 1 / -1;
}

.ezra-ui-widget[data-ezra-ui-widget-row-span="2"] {
  min-height: calc(var(--ezra-ui-widget-panel-slot-height, 0px) + var(--ezra-ui-widget-panel-slot-height, 0px) + var(--ezra-ui-widget-grid-gap));
}

.ezra-ui-widget[data-ezra-ui-widget-layout="full-card"] {
  grid-template-rows: none;
}

.ezra-ui-widget-header,
.ezra-ui-widget-info,
.ezra-ui-widget-controls {
  min-width: 0;
  min-height: 0;
}

.ezra-ui-widget-header {
  display: grid;
  gap: 12px;
  align-content: start;
  min-height: var(--ezra-ui-widget-panel-header-height, auto);
}

.ezra-ui-widget-info {
  display: grid;
  align-content: start;
  min-height: var(--ezra-ui-widget-panel-info-height, auto);
}

.ezra-ui-widget-controls {
  display: grid;
  gap: 8px;
  align-content: end;
  min-height: var(--ezra-ui-widget-panel-controls-height, auto);
}

.ezra-ui-widget-full-card {
  display: grid;
  gap: 10px;
  align-content: start;
  min-width: 0;
}

.ezra-ui-widget-body {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.ezra-ui-widget-heading-row {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 12px;
  min-width: 0;
}

.ezra-ui-widget-corner-controls {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
  margin-inline-start: auto;
}

.ezra-ui-widget-title {
  min-width: 0;
  margin: 0;
  color: var(--ezra-ui-widget-title-color, inherit);
  font-family: var(--header-font);
  font-size: var(--ezra-ui-widget-title-font-size, 1rem);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.ezra-ui-widget-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
  max-width: 100%;
  margin: 0;
}

.ezra-ui-widget-summary-item {
  display: grid;
  gap: 4px;
  min-width: 0;
  max-width: 100%;
  padding:
    var(--ezra-ui-widget-summary-padding-block, 10px)
    var(--ezra-ui-widget-summary-padding-inline, 12px);
  border: 1px solid var(--ezra-ui-widget-summary-border, var(--panel-border));
  background: var(--ezra-ui-widget-summary-bg, var(--surface-quiet));
  border-radius: var(--ezra-ui-widget-summary-radius, var(--ezra-ui-widget-radius, 0));
  box-sizing: border-box;
}

.ezra-ui-widget-summary-item dt,
.ezra-ui-widget-summary-item dd {
  min-width: 0;
  max-width: 100%;
  margin: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.ezra-ui-widget-summary-value {
  color: var(--ezra-ui-widget-title-color, inherit);
  font-family: var(--header-font);
  font-size: var(--ezra-ui-widget-summary-value-font-size, 0.98rem);
  line-height: var(--ezra-ui-widget-summary-value-line-height, 1.1);
}

.ezra-ui-widget-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  align-items: stretch;
}

.ezra-ui-widget-actions .ezra-ui-widget-action {
  width: 100%;
  min-width: 0;
  min-height: var(--ezra-ui-widget-action-height, 44px);
  padding-block: var(--ezra-ui-widget-action-padding-block, 8px);
  padding-inline: var(--ezra-ui-widget-action-padding-inline, 12px);
  border-radius: 0;
  justify-self: stretch;
  line-height: var(--ezra-ui-widget-action-line-height, 1.05);
  white-space: normal;
  overflow-wrap: anywhere;
}

.ezra-ui-widget-management-controls,
.ezra-ui-widget-order-actions {
  display: flex;
  justify-content: flex-end;
  min-width: 0;
}

.ezra-ui-widget-order-actions .ezra-ui-cluster {
  gap: 0.4rem;
}

@media (max-width: 1100px) {
  .ezra-ui-widget-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .ezra-ui-widget-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .ezra-ui-widget[data-ezra-ui-widget-column-span="2"] {
    grid-column: span 1;
  }

  .ezra-ui-widget-summary-grid {
    grid-template-columns: 1fr;
  }

  .ezra-ui-widget-actions {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .ezra-ui-widget-mode-actions {
    grid-column: 1;
    grid-row: auto;
    width: 100%;
    justify-content: stretch;
  }

  .ezra-ui-widget-mode-actions .ezra-ui-widget-action,
  .ezra-ui-widget-mode-actions .ezra-ui-button {
    flex: 1 1 100%;
  }

  .ezra-ui-widget-mode-corner-controls {
    flex: 1 1 100%;
    justify-content: flex-start;
  }
}


.ezra-ui-dot {
  display: inline-block;
  flex: 0 0 auto;
  box-sizing: border-box;
  width: var(--ezra-ui-dot-size, 0.6rem);
  height: var(--ezra-ui-dot-size, 0.6rem);
  border: var(--ezra-ui-dot-border-width, 2px) solid transparent;
  border-radius: var(--ezra-ui-dot-radius, 999px);
  background: var(--ezra-ui-dot-color, var(--muted-color, currentColor));
  box-shadow: none;
}

.ezra-ui-dot.is-full {
  border-color: var(--ezra-ui-dot-color, var(--muted-color, currentColor));
  background: var(--ezra-ui-dot-color, var(--muted-color, currentColor));
}

.ezra-ui-dot.is-empty {
  border-color: var(--ezra-ui-dot-color, var(--muted-color, currentColor));
  background: transparent;
}

.ezra-ui-dot.is-half {
  border-color: var(--ezra-ui-dot-color, var(--muted-color, currentColor));
  background: linear-gradient(
    to bottom,
    transparent 0 50%,
    var(--ezra-ui-dot-color, var(--muted-color, currentColor)) 50% 100%
  );
}


.ezra-ui-dot.is-public {
  --ezra-ui-dot-color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-border, var(--input-highlight-color, currentColor)));
}

.ezra-ui-dot.is-private {
  --ezra-ui-dot-color: var(--h1-color, var(--text-color, currentColor));
}

.ezra-ui-dot.is-ready {
  --ezra-ui-dot-color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-border, var(--input-highlight-color, currentColor)));
}

.ezra-ui-dot.is-new {
  --ezra-ui-dot-color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-border, var(--input-highlight-color, currentColor)));
}

.ezra-ui-dot.is-edited {
  --ezra-ui-dot-color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-border, var(--input-highlight-color, currentColor)));
}

.ezra-ui-dot.is-updated {
  --ezra-ui-dot-color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-border, var(--input-highlight-color, currentColor)));
}

.ezra-ui-dot.is-draft {
  --ezra-ui-dot-color: var(--h1-color, var(--text-color, currentColor));
}

.ezra-ui-dot.is-dirty {
  --ezra-ui-dot-color: var(--h1-color, var(--text-color, currentColor));
}

.ezra-ui-dot.is-delete {
  --ezra-ui-dot-color: var(--badge-delete-border, var(--danger-color, currentColor));
}

.ezra-ui-dot.is-change {
  --ezra-ui-dot-color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-border, var(--input-highlight-color, currentColor)));
}

.ezra-ui-dot.is-light {
  --ezra-ui-dot-color: var(--ezra-ui-theme-surface-step-1, var(--ezra-ui-theme-surface-quiet-text, var(--text-color, currentColor)));
}

.ezra-ui-dot.is-dark {
  --ezra-ui-dot-color: var(--ezra-ui-theme-surface-step-8, var(--ezra-ui-theme-background, var(--background-color, currentColor)));
}

.ezra-ui-status-marker {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
  color: var(--ezra-ui-status-marker-color, var(--muted-color, currentColor));
  font-family: var(--ezra-ui-status-marker-font, var(--header-font));
  font-size: var(--ezra-ui-status-marker-size, 0.72rem);
  font-weight: var(--ezra-ui-status-marker-weight, 700);
  letter-spacing: var(--ezra-ui-status-marker-letter-spacing, 0.04em);
  line-height: 1;
  text-transform: uppercase;
}

.ezra-ui-status-marker-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ezra-ui-status-rail {
  display: grid;
  grid-template-columns: repeat(var(--ezra-ui-status-rail-columns, 3), minmax(96px, 1fr));
  gap: var(--ezra-ui-status-rail-gap, var(--ezra-ui-row-gap, 10px));
  align-items: start;
}

.ezra-ui-status-item {
  display: grid;
  gap: var(--ezra-ui-status-item-gap, var(--ezra-ui-row-gap-compact, 6px));
  align-items: start;
  min-width: 0;
}

.ezra-ui-status-item-label {
  color: var(--ezra-ui-status-item-label-color, var(--muted-text-color, var(--text-muted, currentColor)));
  font-family: var(--ezra-ui-status-item-label-font, var(--body-font));
  font-size: var(--ezra-ui-status-item-label-size, 0.78rem);
  line-height: 1.1;
  text-transform: uppercase;
}

.ezra-ui-status-item-value {
  min-width: 0;
  color: var(--ezra-ui-status-item-value-color, var(--text-color, currentColor));
  font-family: var(--ezra-ui-status-item-value-font, var(--header-font));
  font-size: var(--ezra-ui-status-item-value-size, 1rem);
  font-weight: 700;
  line-height: 1.15;
  overflow-wrap: anywhere;
  text-transform: uppercase;
}

@media (max-width: 860px) {
  .ezra-ui-status-marker {
    min-width: 10px;
  }

  .ezra-ui-status-marker-label {
    display: var(--ezra-ui-status-marker-label-display-mobile, none);
  }
}


.ezra-ui-reference-picker {
  position: relative;
}

.ezra-ui-object-card {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.ezra-ui-object-card--media {
  grid-template-columns: 132px minmax(0, 1fr);
  align-items: start;
}

.ezra-ui-object-card-media,
.ezra-ui-object-card-fields {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.ezra-ui-object-card-media-fields {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.ezra-ui-field--utility {
  gap: 4px;
}

.ezra-ui-field--utility .ezra-ui-label {
  font-size: 0.72rem;
  letter-spacing: 0.05em;
}

.ezra-ui-field--utility .ezra-ui-input,
.ezra-ui-field--utility input,
.ezra-ui-field--utility textarea,
.ezra-ui-field--utility select {
  min-height: 2rem;
  padding: 0.35rem 0.45rem;
  font-size: 0.78rem;
  line-height: 1.2;
}

.ezra-ui-object-card-preview {
  display: grid;
  align-items: center;
  justify-items: start;
  width: 100%;
  min-height: 64px;
  overflow: hidden;
  background: color-mix(in srgb, var(--background-color) 86%, var(--quote-background-color) 14%);
}

.ezra-ui-object-card-preview img {
  display: block;
  width: 64px;
  height: auto;
}

.ezra-ui-object-card-preview-empty {
  justify-self: stretch;
  padding: 0.35rem;
  color: var(--muted-color);
  font-size: 0.72rem;
  line-height: 1.1;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.ezra-ui-image-selection-workspace,
.ezra-ui-image-library {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.ezra-ui-image-selection-workspace {
  align-content: stretch;
  min-height: 540px;
}

.ezra-ui-image-library-search,
.ezra-ui-image-library-meta,
.ezra-ui-image-selection-meta {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.ezra-ui-image-library-scroll {
  min-width: 0;
  min-height: 0;
}

.ezra-ui-image-library-list,
.ezra-ui-image-selection-list,
.ezra-ui-image-selection-grid {
  list-style: none;
  margin: 0;
  padding: 0;
}

.ezra-ui-image-selection-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.ezra-ui-image-library-item,
.ezra-ui-image-selection-item,
.ezra-ui-image-selection-card {
  min-width: 0;
  margin: 0;
}

.ezra-ui-image-library-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-width: 0;
  padding: 14px 18px;
  border: 0;
  border-bottom: 1px solid var(--ezra-ui-panel-list-body-border, var(--panel-border));
  background: var(--ezra-ui-panel-list-item-background, transparent);
  color: inherit;
  box-sizing: border-box;
}

.ezra-ui-image-library-main {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  width: 100%;
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  line-height: inherit;
  text-align: left;
  cursor: pointer;
  appearance: none;
  box-sizing: border-box;
}

.ezra-ui-image-library-main:focus-visible {
  outline: none;
}

.ezra-ui-image-library-editor {
  display: grid;
  grid-column: 2 / -1;
  gap: 6px;
  min-width: 0;
}

.ezra-ui-image-library-row:hover,
.ezra-ui-image-library-row.is-selected,
.ezra-ui-image-library-row.is-focused,
.ezra-ui-image-selection-item:hover {
  background: var(--ezra-ui-panel-list-item-hover-background, var(--surface-quiet));
}

.ezra-ui-image-library-row:focus-within {
  box-shadow: inset 0 0 0 2px var(--focus-ring, currentColor);
}

.ezra-ui-image-library-checkbox {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
}

.ezra-ui-image-library-checkbox .ezra-ui-checkbox {
  margin: 0;
}

.ezra-ui-image-library-preview,
.ezra-ui-image-selection-preview {
  overflow: hidden;
  border: 1px solid var(--panel-border);
  background: var(--surface-quiet);
  box-sizing: border-box;
}

.ezra-ui-image-library-preview {
  width: 56px;
  height: 56px;
}

.ezra-ui-image-selection-preview {
  aspect-ratio: 16 / 10;
  width: 100%;
}

.ezra-ui-image-library-preview img,
.ezra-ui-image-selection-preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ezra-ui-image-library-name,
.ezra-ui-image-selection-name {
  margin: 0;
  color: var(--h1-color);
  font-family: var(--header-font);
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.ezra-ui-image-library-path,
.ezra-ui-image-selection-path {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--muted-color);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.82rem;
  line-height: 1.25;
}

.ezra-ui-image-library-details,
.ezra-ui-image-selection-details {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  min-width: 0;
}

.ezra-ui-image-library-detail,
.ezra-ui-image-selection-detail,
.ezra-ui-image-library-save-state,
.ezra-ui-image-selection-save-state {
  color: var(--muted-color);
  font-family: var(--header-font);
  font-size: 0.76rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.ezra-ui-image-library-save-state,
.ezra-ui-image-selection-save-state {
  font-size: 0.72rem;
  opacity: 0.85;
}

.ezra-ui-image-library-save-state:empty,
.ezra-ui-image-selection-save-state:empty {
  display: none;
}

.ezra-ui-image-library-item-actions,
.ezra-ui-image-selection-item-actions,
.ezra-ui-image-selection-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  min-width: 0;
}

.ezra-ui-image-selection-card {
  display: grid;
  gap: 12px;
  align-content: start;
  min-width: 0;
  min-height: 280px;
  overflow: hidden;
  padding: 16px;
  border: 1px solid var(--panel-border);
  background: var(--ezra-ui-panel-list-item-background, transparent);
  box-sizing: border-box;
}

.ezra-ui-image-selection-card:hover {
  background: var(--ezra-ui-panel-list-item-hover-background, var(--surface-quiet));
}

.ezra-ui-image-selection-path-button {
  display: block;
  width: 100%;
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.ezra-ui-image-selection-path-button:hover .ezra-ui-image-selection-path,
.ezra-ui-image-selection-path-button:focus-visible .ezra-ui-image-selection-path {
  color: var(--text-color);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.14em;
}

.ezra-ui-image-selection-path-button:focus-visible {
  outline: none;
}

.ezra-ui-image-selection-empty {
  min-height: 0;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

.ezra-ui-image-library-alt,
.ezra-ui-image-selection-alt {
  min-width: 0;
}

.ezra-ui-image-alt-field {
  display: grid;
  gap: 6px;
}

.ezra-ui-image-alt-label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}

.ezra-ui-image-alt-required {
  color: var(--danger-color, var(--ezra-ui-theme-danger, currentColor));
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.ezra-ui-image-alt-error {
  margin: 0;
  color: var(--danger-color, var(--ezra-ui-theme-danger, currentColor));
  font-size: 0.82rem;
  line-height: 1.3;
}

.ezra-ui-image-alt-field input[aria-invalid="true"] {
  border-color: var(--danger-color, var(--ezra-ui-theme-danger, currentColor));
  box-shadow: 0 0 0 1px var(--danger-color, var(--ezra-ui-theme-danger, currentColor));
}

.ezra-ui-image-library-alt-input,
.ezra-ui-image-selection-alt-input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.ezra-ui-repeater {
  display: grid;
  gap: var(--ezra-ui-repeater-gap, var(--ezra-ui-stack-gap, clamp(14px, 1.4vw, 16px)));
  padding: var(--ezra-ui-card-padding-compact);
  border: 1px solid var(--ezra-ui-repeater-border, var(--panel-border));
  background: var(--ezra-ui-repeater-background, var(--surface-quiet));
}

.ezra-ui-repeater-footer {
  display: grid;
  gap: var(--ezra-ui-repeater-footer-gap, var(--ezra-ui-row-gap, 10px));
  min-width: 0;
}

.ezra-ui-repeater-empty-state {
  margin: 0;
}

.ezra-ui-repeater-item {
  display: grid;
  gap: var(--ezra-ui-repeater-item-gap, var(--ezra-ui-stack-gap-compact, 12px));
  padding: var(--ezra-ui-card-padding-compact);
  border: 1px solid var(--ezra-ui-repeater-item-border, var(--panel-border));
  background: var(--ezra-ui-repeater-item-background, var(--surface-quiet));
  box-shadow: inset 0 0 0 1px color-mix(
    in srgb,
    var(--ezra-ui-repeater-item-border-strong, var(--panel-border-strong)) 38%,
    transparent
  );
}

.ezra-ui-sort-item {
  transition:
    transform var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-fade),
    background-color var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-fade),
    box-shadow var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-fade),
    border-color var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-fade);
}

.ezra-ui-sort-item.is-dragging {
  background: color-mix(in srgb, var(--yellow) 12%, transparent);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.22);
  border-color: color-mix(in srgb, var(--yellow) 55%, transparent);
  transform: scale(1.01);
}

.ezra-ui-sort-item-header {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: space-between;
  flex-wrap: wrap;
}

.ezra-ui-repeater-meta {
  margin-top: 0.2rem;
  color: var(--ezra-ui-repeater-meta-color, var(--muted-color));
  font-family: var(--header-font);
  font-size: 0.75rem;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  opacity: 0.8;
}

.ezra-ui-sort-item-title {
  min-width: 0;
  font-family: var(--header-font);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ezra-ui-repeater-title-color, var(--h1-color));
  margin-right: auto;
}

.ezra-ui-sort-item-actions {
  display: flex;
  flex: 0 0 auto;
  margin-left: auto;
}

@media (max-width: 860px) {
  .ezra-ui-repeater {
    gap: var(--ezra-ui-mobile-repeater-gap, 14px);
  }

  .ezra-ui-repeater-item {
    padding: 12px;
    gap: var(--ezra-ui-mobile-repeater-item-gap, 10px);
  }

  .ezra-ui-sort-item-title {
    flex: 1 1 12rem;
    font-size: 0.98rem;
    line-height: 1rem;
  }

  .ezra-ui-sort-item-actions {
    flex: 0 0 auto;
    margin-left: auto;
  }
}

@media (max-width: 720px) {
  .ezra-ui-image-library-row,
  .ezra-ui-image-library-main {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
  }

  .ezra-ui-image-selection-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .ezra-ui-image-selection-card {
    min-height: 0;
  }

  .ezra-ui-image-selection-workspace {
    min-height: 320px;
  }

  .ezra-ui-image-library-item-actions,
  .ezra-ui-image-selection-item-actions {
    grid-column: 1 / -1;
    padding-top: 2px;
  }

  .ezra-ui-image-selection-item-actions {
    justify-content: flex-start;
  }

  .ezra-ui-image-library-preview {
    width: 52px;
    height: 52px;
  }
}

@media (max-width: 560px) {
  .ezra-ui-sort-item-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }

  .ezra-ui-sort-item-title {
    flex: none;
    margin-right: 0;
  }

  .ezra-ui-sort-item-actions {
    justify-self: end;
    margin-left: 0;
  }
}

@media (max-width: 860px) {
  .ezra-ui-object-card--media {
    grid-template-columns: 1fr;
  }

  .ezra-ui-object-card-media {
    grid-template-columns: 72px minmax(0, 1fr);
    align-items: start;
  }

  .ezra-ui-object-card-preview {
    min-height: 72px;
  }
}


.ezra-ui-measurement-progress,
.ezra-ui-measurement-bar-chart,
.ezra-ui-measurement-trend {
  --ezra-ui-measurement-accent: var(
    --ezra-ui-theme-accent-strong,
    var(--ezra-ui-theme-accent, currentColor)
  );
  --ezra-ui-measurement-track: var(
    --ezra-ui-theme-surface-quiet,
    color-mix(in srgb, currentColor 8%, transparent)
  );
  --ezra-ui-measurement-border: var(
    --ezra-ui-theme-border,
    color-mix(in srgb, currentColor 22%, transparent)
  );
  --ezra-ui-measurement-muted: var(
    --ezra-ui-theme-surface-quiet-text,
    var(--ezra-ui-theme-text, color-mix(in srgb, currentColor 68%, transparent))
  );
  min-width: 0;
  margin: 0;
  color: var(--ezra-ui-theme-text, currentColor);
  font-family: inherit;
}

.ezra-ui-measurement-heading,
.ezra-ui-measurement-chart-caption,
.ezra-ui-measurement-axis {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
}

.ezra-ui-measurement-label,
.ezra-ui-measurement-chart-title {
  min-width: 0;
  font-size: 0.78rem;
  font-weight: 700;
}

.ezra-ui-measurement-value,
.ezra-ui-measurement-unit,
.ezra-ui-measurement-axis {
  color: var(--ezra-ui-measurement-muted);
  font-size: 0.72rem;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.ezra-ui-measurement-track {
  position: relative;
  min-width: 0;
  height: var(--ezra-ui-measurement-track-height, 0.55rem);
  overflow: hidden;
  border: 1px solid var(--ezra-ui-measurement-border);
  border-radius: 999px;
  background: var(--ezra-ui-measurement-track);
}

.ezra-ui-measurement-progress .ezra-ui-measurement-track {
  margin-top: 0.45rem;
}

.ezra-ui-measurement-fill {
  display: block;
  width: var(--ezra-ui-measurement-percent, 0%);
  height: 100%;
  border-radius: inherit;
  background: var(--ezra-ui-measurement-fill, var(--ezra-ui-measurement-accent));
  transition: width var(--ezra-surface-motion-duration, 180ms) ease;
}

[data-measurement-tone="success"] {
  --ezra-ui-measurement-fill: var(--ezra-ui-measurement-success, var(--ezra-ui-theme-accent-strong, var(--ezra-ui-measurement-accent)));
}
[data-measurement-tone="warning"] {
  --ezra-ui-measurement-fill: var(--ezra-ui-measurement-warning, var(--ezra-ui-theme-accent, var(--ezra-ui-measurement-accent)));
}
[data-measurement-tone="danger"] {
  --ezra-ui-measurement-fill: var(--ezra-ui-measurement-danger, var(--ezra-ui-theme-button-background, var(--ezra-ui-measurement-accent)));
}
[data-measurement-tone="neutral"] {
  --ezra-ui-measurement-fill: var(--ezra-ui-theme-surface-quiet-text, var(--ezra-ui-measurement-muted));
}

.ezra-ui-measurement-progress[data-measurement-mode="indeterminate"] .ezra-ui-measurement-fill {
  width: 36%;
  animation: ezra-ui-measurement-loading 1.2s ease-in-out infinite;
}

.ezra-ui-measurement-description {
  margin: 0.4rem 0 0;
  color: var(--ezra-ui-measurement-muted);
  font-size: 0.72rem;
  line-height: 1.35;
}

.ezra-ui-measurement-bars {
  display: grid;
  gap: 0.55rem;
  margin: 0.7rem 0 0;
  padding: 0;
  list-style: none;
}

.ezra-ui-measurement-bar-item {
  display: grid;
  grid-template-columns: minmax(7.5rem, 0.8fr) minmax(6rem, 2fr) minmax(5.5rem, auto);
  align-items: center;
  gap: 0.65rem;
}

.ezra-ui-measurement-bar-item > .ezra-ui-measurement-value {
  text-align: right;
}

.ezra-ui-measurement-bar-item[data-measurement-availability="estimated"] .ezra-ui-measurement-fill {
  background-image: repeating-linear-gradient(135deg, transparent 0 4px, color-mix(in srgb, white 24%, transparent) 4px 7px);
}

.ezra-ui-measurement-unavailable {
  position: absolute;
  inset: 50% auto auto 50%;
  color: var(--ezra-ui-measurement-muted);
  font-size: 0.75rem;
  line-height: 1;
  transform: translate(-50%, -50%);
}

.ezra-ui-measurement-sparkline {
  display: block;
  width: 100%;
  height: 4.5rem;
  margin-top: 0.55rem;
  overflow: visible;
}

.ezra-ui-measurement-grid-line {
  stroke: var(--ezra-ui-measurement-border);
  stroke-width: 0.75;
  vector-effect: non-scaling-stroke;
}

.ezra-ui-measurement-trend-line {
  fill: none;
  stroke: var(--ezra-ui-measurement-fill, var(--ezra-ui-measurement-accent));
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.ezra-ui-measurement-axis {
  margin-top: 0.25rem;
  font-size: 0.65rem;
}

@keyframes ezra-ui-measurement-loading {
  from { transform: translateX(-110%); }
  to { transform: translateX(290%); }
}

@media (prefers-reduced-motion: reduce) {
  .ezra-ui-measurement-fill { transition: none; }
  .ezra-ui-measurement-progress[data-measurement-mode="indeterminate"] .ezra-ui-measurement-fill {
    animation: none;
    margin-left: 32%;
  }
}

@media (max-width: 640px) {
  .ezra-ui-measurement-bar-item {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .ezra-ui-measurement-bar-item > .ezra-ui-measurement-track {
    grid-column: 1 / -1;
    grid-row: 2;
  }
}


.ezra-ui-image-preview-shell {
  display: grid;
  width: 100%;
  min-width: 0;
}

.ezra-ui-image-field-group {
  display: grid;
  gap: var(--ezra-ui-stack-gap, clamp(14px, 1.4vw, 16px));
  min-width: 0;
}

.ezra-ui-image-preview-shell.is-constrained {
  width: var(--ezra-ui-image-preview-width, auto);
  height: var(--ezra-ui-image-preview-height, auto);
  max-width: 100%;
  overflow: hidden;
}

.ezra-ui-image-url-preview {
  display: grid;
  gap: 8px;
  width: 100%;
  min-width: 0;
}

.ezra-ui-image-url-preview.is-fill-container {
  width: 100%;
  height: var(--ezra-ui-image-preview-height, auto);
}

.ezra-ui-image-url-preview-frame {
  width: var(--ezra-ui-image-preview-width, auto);
  max-width: 100%;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  border: 1px solid var(--panel-border);
  background: var(--surface-quiet);
}

.ezra-ui-image-preview-shell.is-inline-size-only .ezra-ui-image-url-preview-frame {
  aspect-ratio: auto;
}

.ezra-ui-image-preview-shell.is-inline-size-only .ezra-ui-image-url-preview-frame img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

.ezra-ui-image-url-preview.is-fill-container .ezra-ui-image-url-preview-frame {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
}

.ezra-ui-image-url-preview-frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ezra-ui-image-url-preview-empty {
  display: grid;
  min-height: 7rem;
  place-items: center;
  padding: 16px;
  border: 1px solid var(--panel-border);
  background: color-mix(in srgb, var(--surface-quiet) 92%, var(--background-color) 8%);
  color: var(--muted-color);
  font-family: var(--header-font);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.1;
  text-align: center;
  text-transform: uppercase;
  box-sizing: border-box;
}

.ezra-ui-image-url-preview.is-fill-container .ezra-ui-image-url-preview-empty {
  min-height: 0;
  width: 100%;
  height: 100%;
  padding: 0.35rem;
  overflow: hidden;
  font-size: 0.75rem;
  line-height: 1.2;
  box-sizing: border-box;
}

.ezra-ui-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  max-width: 100%;
  min-height: var(--ezra-ui-button-min-height, 40px);
  padding:
    var(--ezra-ui-button-padding-block, 10px)
    var(--ezra-ui-button-padding-inline, 16px);
  appearance: none;
  border: 0;
  font-family: var(--header-font);
  font-weight: 700;
  font-size: var(--ezra-ui-button-font-size, 1rem);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: var(--ezra-ui-button-line-height, 1.05);
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  text-decoration: none;
  cursor: pointer;
  box-sizing: border-box;
}

.ezra-ui-button--small {
  min-height: var(--ezra-ui-button-small-min-height, 34px);
  padding:
    var(--ezra-ui-button-small-padding-block, 8px)
    var(--ezra-ui-button-small-padding-inline, 12px);
  font-size: var(--ezra-ui-button-small-font-size, 0.9rem);
}

.ezra-ui-repeater-standard-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.ezra-ui-repeater-standard-actions .ezra-ui-repeater-icon-button {
  width: 2.25rem;
  min-width: 2.25rem;
  min-height: 2.25rem;
  padding: 0;
  font-size: 1rem;
  line-height: 1;
}

.ezra-ui-button--responsive-width {
  width: var(--ezra-ui-button-responsive-width, fit-content);
  justify-self: var(--ezra-ui-button-responsive-justify-self, start);
}

@media (max-width: 860px) {
  .ezra-ui-button--responsive-width {
    width: var(--ezra-ui-button-responsive-mobile-width, 100%);
    justify-self: var(--ezra-ui-button-responsive-mobile-justify-self, stretch);
  }
}

.ezra-ui-button--primary {
  background: var(--ezra-app-surface-primary-button-background, var(--button-background-color));
  color: var(--ezra-app-surface-primary-button-text, var(--button-text-color));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-primary-button-border, color-mix(in srgb, var(--button-background-color) 72%, transparent));
}

.ezra-ui-button--primary:hover {
  background: var(--ezra-app-surface-primary-button-hover-background, var(--button-text-color));
  color: var(--ezra-app-surface-primary-button-hover-text, var(--button-background-color));
  box-shadow: inset 0 0 0 2px var(--ezra-app-surface-primary-button-hover-border, var(--button-background-color));
}

.ezra-ui-button--important {
  background: var(--ezra-app-surface-important-button-background, color-mix(in srgb, var(--ezra-ui-theme-accent-strong, var(--yellow, var(--input-highlight-color))) 16%, transparent));
  color: var(--ezra-app-surface-important-button-text, var(--h1-color, var(--text-color)));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-important-button-border, color-mix(in srgb, var(--ezra-ui-theme-accent-strong, var(--yellow, var(--input-highlight-color))) 68%, var(--border-color)));
}

.ezra-ui-button--important:hover {
  background: var(--ezra-app-surface-important-button-hover-background, color-mix(in srgb, var(--ezra-ui-theme-accent-strong, var(--yellow, var(--input-highlight-color))) 24%, transparent));
  color: var(--ezra-app-surface-important-button-hover-text, var(--h1-color, var(--text-color)));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-important-button-hover-border, var(--ezra-ui-theme-accent-strong, var(--yellow, var(--input-highlight-color))));
}

.ezra-ui-button--secondary-important {
  background: var(--ezra-app-surface-secondary-important-button-background, transparent);
  color: var(--ezra-app-surface-secondary-important-button-text, var(--h1-color, var(--text-color)));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-secondary-important-button-border, var(--ezra-app-surface-important-button-accent, var(--ezra-ui-theme-accent-strong, var(--input-highlight-color))));
}

.ezra-ui-button--secondary-important:hover {
  background: var(--ezra-app-surface-secondary-important-button-hover-background, transparent);
  color: var(--ezra-app-surface-secondary-important-button-hover-text, var(--ezra-app-surface-secondary-important-button-text, var(--h1-color, var(--text-color))));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-secondary-important-button-hover-border, var(--ezra-app-surface-important-button-accent, var(--ezra-ui-theme-accent-strong, var(--input-highlight-color))));
}

.ezra-ui-button--secondary {
  background: var(--ezra-app-surface-secondary-button-background, color-mix(in srgb, var(--button-background-color) 10%, transparent));
  color: var(--ezra-app-surface-secondary-button-text, color-mix(in srgb, var(--text-color) 92%, var(--muted-color) 8%));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-secondary-button-border, color-mix(in srgb, var(--border-color) 34%, transparent));
}

.ezra-ui-button--secondary:hover {
  background: var(--ezra-app-surface-secondary-button-hover-background, color-mix(in srgb, var(--button-background-color) 18%, transparent));
  color: var(--ezra-app-surface-secondary-button-hover-text, var(--text-color));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-secondary-button-hover-border, color-mix(in srgb, var(--border-color) 48%, transparent));
}

.ezra-ui-button--ghost {
  background: transparent;
  color: var(--ezra-app-surface-ghost-button-text, color-mix(in srgb, var(--text-color) 82%, var(--muted-color) 18%));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-ghost-button-border, color-mix(in srgb, var(--panel-border) 82%, transparent));
}

.ezra-ui-button--ghost:hover {
  background: var(--ezra-app-surface-ghost-button-hover-background, color-mix(in srgb, var(--text-color) 6%, transparent));
  color: var(--ezra-app-surface-ghost-button-hover-text, var(--text-color));
}

.ezra-ui-button--danger {
  background: var(--ezra-app-surface-danger-button-background, transparent);
  color: var(--ezra-app-surface-danger-button-text, var(--red));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-danger-button-border, color-mix(in srgb, var(--red) 58%, transparent));
}

.ezra-ui-button--danger:hover {
  background: var(--ezra-app-surface-danger-button-hover-background, transparent);
  color: var(--ezra-app-surface-danger-button-hover-text, var(--red));
  box-shadow: inset 0 0 0 1px var(--ezra-app-surface-danger-button-hover-border, color-mix(in srgb, var(--red) 78%, transparent));
}

.ezra-ui-button:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)),
    inset 0 0 0 1px color-mix(in srgb, var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)) 18%, transparent);
}

.ezra-ui-button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.ezra-ui-toggle-switch-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  align-items: center;
  justify-content: start;
  min-width: 0;
  width: min(100%, var(--ezra-ui-toggle-switch-width, 168px));
}

.ezra-ui-toggle-switch-labels {
  display: grid;
  grid-template-columns: repeat(var(--ezra-ui-toggle-switch-position-count, 2), minmax(0, 1fr));
  align-items: start;
  width: 100%;
}

.ezra-ui-toggle-switch-label {
  appearance: none;
  min-width: 0;
  padding: 0 2px;
  border: 0;
  background: transparent;
  color: var(--label-color);
  font-family: var(--header-font);
  font-size: var(--ezra-ui-toggle-switch-label-size, 0.68rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
  text-align: center;
  text-transform: uppercase;
  opacity: 0.62;
  white-space: nowrap;
  cursor: pointer;
}

.ezra-ui-toggle-switch-label[data-active="true"] {
  color: var(--ezra-ui-toggle-switch-active-label-color, var(--ezra-ui-widget-title-color, var(--h1-color)));
  opacity: 1;
}

.ezra-ui-toggle-switch-label:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.ezra-ui-toggle-switch {
  position: relative;
  display: grid;
  grid-template-columns: repeat(var(--ezra-ui-toggle-switch-position-count, 2), minmax(0, 1fr));
  width: 100%;
  height: var(--ezra-ui-toggle-switch-height, 26px);
  min-width: 0;
  min-height: var(--ezra-ui-toggle-switch-height, 26px);
  padding: var(--ezra-ui-toggle-switch-padding, 2px);
  appearance: none;
  border: 1px solid var(--ezra-ui-toggle-switch-border, var(--ezra-ui-widget-shell-border, var(--panel-border)));
  border-radius: var(--ezra-ui-toggle-switch-radius, 999px);
  background: var(--ezra-ui-toggle-switch-background, var(--ezra-ui-control-surface-background, var(--surface-quiet)));
  color: inherit;
  cursor: pointer;
}

.ezra-ui-toggle-switch-position {
  position: relative;
  z-index: 1;
  min-width: 0;
  padding: 0;
  appearance: none;
  border: 0;
  border-radius: calc(var(--ezra-ui-toggle-switch-radius, 999px) - var(--ezra-ui-toggle-switch-padding, 2px));
  background: transparent;
  cursor: pointer;
}

.ezra-ui-toggle-switch-position:hover {
  background: color-mix(in srgb, var(--ezra-ui-toggle-switch-thumb-color, var(--ezra-ui-widget-title-color, currentColor)) 8%, transparent);
}

.ezra-ui-toggle-switch-position:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)),
    inset 0 0 0 1px color-mix(in srgb, var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)) 18%, transparent);
}

.ezra-ui-toggle-switch-thumb {
  position: absolute;
  inset-block: var(--ezra-ui-toggle-switch-padding, 2px);
  inset-inline-start: var(--ezra-ui-toggle-switch-padding, 2px);
  display: block;
  width: calc((100% - (var(--ezra-ui-toggle-switch-padding, 2px) * 2)) / var(--ezra-ui-toggle-switch-position-count, 2));
  height: auto;
  transform: translateX(calc(var(--ezra-ui-toggle-switch-active-index, 0) * 100%));
  transition: transform var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-toggle-switch-thumb::after {
  content: "";
  position: absolute;
  inset-block-start: 50%;
  inset-inline-start: 50%;
  inline-size: var(--ezra-ui-toggle-switch-thumb-size, 20px);
  block-size: var(--ezra-ui-toggle-switch-thumb-size, 20px);
  border-radius: var(--ezra-ui-toggle-switch-thumb-radius, 50%);
  background: var(--ezra-ui-toggle-switch-thumb-color, var(--ezra-ui-widget-title-color, currentColor));
  transform: translate(-50%, -50%);
}

.ezra-ui-toggle-switch:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)),
    inset 0 0 0 1px color-mix(in srgb, var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)) 18%, transparent);
}

.ezra-ui-toggle-switch:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.ezra-ui-toggle-switch[data-disabled="true"],
.ezra-ui-toggle-switch[data-disabled="true"] .ezra-ui-toggle-switch-position {
  cursor: not-allowed;
}

.ezra-ui-field {
  display: flex;
  flex-direction: column;
  gap: var(--ezra-ui-row-gap-compact, 8px);
  min-width: 0;
}

.ezra-ui-label {
  display: inline-flex;
  align-items: center;
  min-height: 0;
  color: var(--label-color);
  font-family: var(--header-font);
  font-weight: 700;
  font-size: 0.82rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1;
}

.ezra-ui-help {
  margin: 0;
  color: var(--muted-color);
  font-size: 0.95rem;
  line-height: 1.35;
}

.ezra-ui-input,
.ezra-ui-field input,
.ezra-ui-field textarea,
.ezra-ui-field select {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 44px;
  padding: 12px 14px;
  border: 1px solid var(--ezra-ui-theme-input-border, var(--panel-border));
  border-radius: 0;
  background: var(--input-bg);
  color: var(--text-color);
  font-family: var(--body-font);
  font-size: 1rem;
  line-height: 1.4;
  box-sizing: border-box;
  scroll-margin-top: 16px;
}

.ezra-ui-input:focus,
.ezra-ui-input:focus-visible,
.ezra-ui-field input:focus,
.ezra-ui-field input:focus-visible,
.ezra-ui-field textarea:focus,
.ezra-ui-field textarea:focus-visible,
.ezra-ui-field select:focus,
.ezra-ui-field select:focus-visible {
  outline: none;
  border-color: var(--focus-ring);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--focus-ring) 35%, transparent),
    inset 0 0 0 1px var(--focus-ring);
}

.ezra-ui-input::placeholder,
.ezra-ui-field input::placeholder,
.ezra-ui-field textarea::placeholder {
  color: var(--muted-color);
}

.ezra-ui-select {
  -webkit-appearance: none;
  appearance: none;
  padding-right: 42px;
  background-image:
    linear-gradient(45deg, transparent 50%, currentColor 50%),
    linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position:
    calc(100% - 18px) calc(50% - 2px),
    calc(100% - 12px) calc(50% - 2px);
  background-size:
    6px 6px,
    6px 6px;
  background-repeat: no-repeat;
}

.ezra-ui-textarea {
  resize: vertical;
  min-height: 0;
}

.ezra-ui-field--checkbox {
  gap: 8px;
}

.ezra-ui-checkbox-row,
.ezra-ui-radio-row {
  display: inline-flex;
  align-items: center;
  gap: var(--ezra-ui-checkbox-label-gap, 0.42em);
  width: fit-content;
  max-width: 100%;
  cursor: pointer;
}

.ezra-ui-checkbox,
.ezra-ui-radio {
  flex: 0 0 auto;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
  margin: 0;
  padding: 0;
  accent-color: var(--input-highlight-color);
}

.ezra-ui-checkbox-label,
.ezra-ui-radio-label {
  color: var(--ezra-ui-theme-checkbox-text, var(--text-color));
  font: inherit;
  line-height: 1.2;
}

.ezra-ui-checkbox:focus,
.ezra-ui-radio:focus {
  outline: none;
  box-shadow: 0 0 0 2px var(--focus-ring);
}

.ezra-ui-file-field {
  display: grid;
  gap: var(--ezra-ui-row-gap-compact, 8px);
  min-width: 0;
}

.ezra-ui-file-control {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  min-width: 0;
  border: 1px solid var(--ezra-ui-theme-input-border, var(--panel-border));
  background: var(--input-bg);
  color: var(--text-color);
  padding: 0.45rem 0.6rem;
  box-sizing: border-box;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ezra-ui-theme-input-border, var(--panel-border)) 28%, transparent);
}

.ezra-ui-file-field .ezra-ui-input.ezra-ui-file-input {
  position: absolute;
  width: 1px;
  height: 1px;
  min-width: 1px;
  max-width: 1px;
  min-height: 1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.ezra-ui-file-button {
  min-height: 34px;
}

.ezra-ui-file-name {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--muted-color);
}

.ezra-ui-stepper {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--ezra-ui-stepper-control-width, 34px);
  align-items: stretch;
  min-width: 0;
}

.ezra-ui-stepper .ezra-ui-input {
  min-height: var(--ezra-ui-stepper-input-height, 44px);
}

.ezra-ui-stepper-controls {
  display: grid;
  grid-template-rows: 1fr 1fr;
  min-width: 0;
}

.ezra-ui-stepper-button {
  appearance: none;
  display: inline-grid;
  place-items: center;
  width: 100%;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-left: 1px solid var(--ezra-ui-theme-input-border, var(--panel-border));
  background: var(--ezra-ui-stepper-button-bg, color-mix(in srgb, var(--input-bg) 78%, var(--surface-hover) 22%));
  color: var(--ezra-ui-stepper-button-text, var(--label-color));
  cursor: pointer;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--panel-border) 62%, transparent);
}

.ezra-ui-stepper-button + .ezra-ui-stepper-button {
  border-top: 1px solid var(--ezra-ui-theme-input-border, var(--panel-border));
}

.ezra-ui-stepper-button:hover,
.ezra-ui-stepper-button:focus-visible {
  background: var(--ezra-ui-stepper-button-hover-bg, var(--surface-hover));
  color: var(--ezra-ui-stepper-button-hover-text, var(--h1-color));
}

.ezra-ui-stepper-button:focus-visible {
  outline: none;
  box-shadow:
    inset 0 0 0 1px var(--focus-ring),
    0 0 0 1px color-mix(in srgb, var(--focus-ring) 35%, transparent);
}

.ezra-ui-stepper-button-icon {
  width: 12px;
  height: 8px;
}

.ezra-ui-stepper-button-icon path {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: square;
  stroke-linejoin: miter;
}

.ezra-ui-form-message,
.ezra-ui-form-error {
  margin: 0;
}

.ezra-ui-form-message {
  color: var(--message-success-text, var(--text-color));
}

.ezra-ui-form-error {
  color: var(--message-error-text, var(--danger-color, #b42318));
}
.ezra-ui-control-menu-shell,
.ezra-ui-theme-menu-shell {
  position: relative;
  min-width: 0;
}

.ezra-ui-control-menu-shell:has(.ezra-ui-control-menu:not([hidden])) {
  z-index: var(--ezra-ui-layer-control-popup, var(--ezra-ui-layer-workspace-dropdown, 60));
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu-shell:has(.ezra-ui-theme-menu:not([hidden])) {
  z-index: var(--ezra-ui-layer-control-popup, var(--ezra-ui-layer-workspace-dropdown, 60));
}

.ezra-ui-theme-picker--app-surface {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  width: auto;
  min-width: 0;
  max-width: 100%;
  flex-wrap: nowrap;
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-picker-label {
  display: inline-flex;
  align-items: center;
  min-height: 0;
  white-space: nowrap;
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu-shell {
  width: max-content;
  min-width: max(170px, calc((var(--ezra-ui-theme-picker-max-label-chars, 12) * 0.72em) + 76px));
  max-width: 100%;
  z-index: var(--ezra-ui-layer-workspace-menu, 40);
}

.ezra-ui-control-menu-button,
.ezra-ui-theme-menu-button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 180px;
  max-width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid var(
    --ezra-ui-theme-picker-button-border,
    var(--ezra-ui-control-menu-button-border, var(--ezra-ui-control-menu-row-border, var(--panel-border-strong)))
  );
  background: var(
    --ezra-ui-theme-picker-button-background,
    var(--ezra-ui-control-menu-button-background, var(--ezra-ui-control-menu-row-background, var(--input-bg)))
  );
  color: var(
    --ezra-ui-theme-picker-button-heading,
    var(--ezra-ui-control-menu-button-text, var(--ezra-ui-control-menu-row-heading, var(--text-color)))
  );
  font-family: var(--header-font);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1;
  text-transform: uppercase;
  text-align: left;
  cursor: pointer;
  box-sizing: border-box;
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu-button {
  min-width: max(170px, calc((var(--ezra-ui-theme-picker-max-label-chars, 12) * 0.72em) + 76px));
  min-height: 42px;
  padding: 9px 12px;
  font-size: 0.82rem;
  letter-spacing: 0.04em;
}

.ezra-ui-control-menu-button--has-leading-icon,
.ezra-ui-theme-menu-button--has-leading-icon {
  grid-template-columns: auto minmax(0, 1fr) auto;
}

.ezra-ui-control-menu-button:hover,
.ezra-ui-theme-menu-button:hover {
  background: color-mix(
    in srgb,
    var(
      --ezra-ui-theme-picker-button-background,
      var(--ezra-ui-control-menu-button-background, var(--input-bg))
    ) 88%,
    var(--ezra-ui-theme-picker-button-accent, var(--ezra-ui-control-menu-accent, var(--label-color))) 12%
  );
}

.ezra-ui-control-menu-button:focus-visible,
.ezra-ui-control-menu-item:focus-visible,
.ezra-ui-theme-menu-button:focus-visible,
.ezra-ui-theme-menu-item:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--focus-ring);
}

.ezra-ui-control-menu-button-label,
.ezra-ui-control-menu-item-label,
.ezra-ui-theme-menu-button-label,
.ezra-ui-theme-menu-item-label {
  min-width: 0;
}

.ezra-ui-control-menu-button-label,
.ezra-ui-theme-menu-button-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ezra-ui-control-menu-item-label,
.ezra-ui-theme-menu-item-label {
  overflow-wrap: anywhere;
}

.ezra-ui-control-menu-button-caret,
.ezra-ui-theme-menu-button-caret {
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 7px solid currentColor;
  flex: 0 0 auto;
}

.ezra-ui-theme-menu-button .ezra-ui-theme-menu-icon {
  color: var(
    --ezra-ui-theme-picker-button-accent,
    var(--ezra-ui-control-menu-row-accent, var(--label-color))
  );
}

.ezra-ui-control-menu,
.ezra-ui-theme-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: var(--ezra-ui-layer-workspace-menu, 40);
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(
    --ezra-ui-control-popup-border,
    var(--ezra-ui-control-menu-row-border, var(--panel-border-strong))
  );
  background: var(
    --ezra-ui-control-popup-background,
    var(--ezra-ui-control-menu-row-background, var(--panel-color))
  );
  box-shadow: 0 16px 34px color-mix(in srgb, var(--background-color) 30%, transparent);
  box-sizing: border-box;
}

.ezra-ui-control-menu-shell > .ezra-ui-control-popup-surface.ezra-ui-control-menu,
.ezra-ui-theme-menu-shell > .ezra-ui-control-popup-surface.ezra-ui-theme-menu {
  position: absolute;
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu {
  right: 0;
  left: auto;
  gap: 6px;
  width: max-content;
  min-width: max(170px, calc((var(--ezra-ui-theme-picker-max-label-chars, 12) * 0.72em) + 76px));
  max-width: min(100vw - 24px, max(170px, calc((var(--ezra-ui-theme-picker-max-label-chars, 12) * 0.72em) + 76px)));
  padding: 8px;
  box-shadow: none;
}

.ezra-ui-control-menu[hidden],
.ezra-ui-theme-menu[hidden] {
  display: none !important;
}

.ezra-ui-control-menu-item,
.ezra-ui-theme-menu-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 0;
  min-height: 40px;
  padding: 10px 12px;
  border: 0;
  background: var(--ezra-ui-control-menu-row-background, transparent);
  color: var(--ezra-ui-control-menu-row-text, var(--text-color));
  text-align: left;
  font-family: var(--body-font);
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: none;
  cursor: pointer;
}

.ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu-item {
  min-height: 42px;
  padding: 10px 12px;
  border: 0;
  box-shadow: inset 0 0 0 1px var(
    --ezra-ui-theme-picker-item-border,
    var(--ezra-ui-control-menu-row-border, var(--panel-border-strong))
  );
  font-family: var(--header-font);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1;
  text-transform: uppercase;
}

.ezra-ui-control-menu-item--themed,
.ezra-ui-theme-menu-item--themed {
  background: var(
    --ezra-ui-theme-picker-item-background,
    var(--ezra-ui-control-menu-row-background, var(--background-color))
  );
  color: var(
    --ezra-ui-theme-picker-item-text,
    var(--ezra-ui-control-menu-row-text, var(--text-color))
  );
  box-shadow: inset 0 0 0 1px var(
    --ezra-ui-theme-picker-item-border,
    var(--ezra-ui-control-menu-row-border, var(--panel-border-strong))
  );
}

.ezra-ui-control-menu-item--themed:hover,
.ezra-ui-theme-menu-item--themed:hover {
  background: color-mix(
    in srgb,
    var(
      --ezra-ui-theme-picker-item-background,
      var(--ezra-ui-control-menu-row-background, var(--background-color))
    ) 88%,
    var(--ezra-ui-control-menu-row-accent, var(--label-color)) 12%
  );
}

.ezra-ui-control-menu-item--themed .ezra-ui-theme-menu-icon,
.ezra-ui-theme-menu-item--themed .ezra-ui-theme-menu-icon {
  color: var(
    --ezra-ui-theme-menu-item-accent,
    var(
      --ezra-ui-theme-picker-menu-item-accent,
      var(--ezra-ui-control-menu-row-accent, var(--label-color))
    )
  );
}

.ezra-ui-control-menu-item--reset-theme,
.ezra-ui-theme-menu-item--reset-theme {
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  min-height: 42px;
  background: var(
    --ezra-app-surface-secondary-button-background,
    color-mix(in srgb, var(--button-background-color, var(--input-highlight-color)) 12%, var(--background-color, transparent))
  );
  color: var(--ezra-app-surface-secondary-button-text, var(--text-color));
  font-family: var(--header-font);
  font-weight: 700;
  letter-spacing: 0.03em;
  text-align: center;
  text-transform: uppercase;
  box-shadow: inset 0 0 0 1px var(
    --ezra-app-surface-secondary-button-border,
    color-mix(in srgb, var(--button-background-color, var(--input-highlight-color)) 42%, var(--border-color))
  );
}

.ezra-ui-control-menu-item--reset-theme:hover,
.ezra-ui-theme-menu-item--reset-theme:hover {
  background: var(
    --ezra-app-surface-secondary-button-hover-background,
    color-mix(in srgb, var(--button-background-color, var(--input-highlight-color)) 18%, var(--background-color, transparent))
  );
  color: var(
    --ezra-app-surface-secondary-button-hover-text,
    var(--ezra-app-surface-secondary-button-text, var(--text-color))
  );
  box-shadow: inset 0 0 0 1px var(
    --ezra-app-surface-secondary-button-hover-border,
    color-mix(in srgb, var(--button-background-color, var(--input-highlight-color)) 62%, var(--border-color))
  );
}

.ezra-ui-control-menu-item--reset-theme .ezra-ui-theme-menu-icon,
.ezra-ui-theme-menu-item--reset-theme .ezra-ui-theme-menu-icon {
  display: none;
}

.ezra-ui-control-menu-item--reset-theme .ezra-ui-theme-menu-item-label,
.ezra-ui-theme-menu-item--reset-theme .ezra-ui-theme-menu-item-label {
  color: currentColor;
  font-family: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
}

.ezra-ui-control-menu-item--themed .ezra-ui-theme-menu-item-label,
.ezra-ui-theme-menu-item--themed .ezra-ui-theme-menu-item-label,
.ezra-ui-control-menu-item--none .ezra-ui-theme-menu-item-label,
.ezra-ui-theme-menu-item--none .ezra-ui-theme-menu-item-label {
  color: var(
    --ezra-ui-theme-picker-menu-item-heading,
    var(--ezra-ui-control-menu-row-heading, var(--text-color))
  );
  font-family: var(--header-font);
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.ezra-ui-control-menu-item:hover,
.ezra-ui-theme-menu-item:hover {
  background: color-mix(
    in srgb,
    var(
      --ezra-ui-theme-picker-item-background,
      var(--ezra-ui-control-menu-row-background, var(--background-color))
    ) 90%,
    var(--ezra-ui-control-menu-row-accent, var(--label-color)) 10%
  );
}

.ezra-ui-control-menu-item-icon,
.ezra-ui-theme-menu-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

.ezra-ui-control-menu-item[aria-checked="true"],
.ezra-ui-theme-menu-item[aria-checked="true"] {
  box-shadow:
    inset 0 0 0 1px var(--ezra-ui-control-menu-row-border, var(--panel-border-strong)),
    inset 0 0 0 2px var(
      --ezra-ui-theme-menu-item-accent,
      var(
        --ezra-ui-theme-picker-menu-item-accent,
        var(
          --ezra-ui-theme-picker-button-accent,
          var(--ezra-ui-control-menu-row-accent, var(--label-color))
        )
      )
    );
}

.ezra-ui-control-menu-item[data-ezra-ui-menu-option-active="true"],
.ezra-ui-theme-menu-item[data-ezra-ui-menu-option-active="true"] {
  background: color-mix(
    in srgb,
    var(
      --ezra-ui-theme-menu-item-accent,
      var(
        --ezra-ui-theme-picker-menu-item-accent,
        var(
          --ezra-ui-theme-picker-button-accent,
          var(--ezra-ui-control-menu-row-accent, var(--label-color))
        )
      )
    ) 12%,
    var(--ezra-ui-control-menu-row-background, transparent)
  );
  box-shadow: inset 0 0 0 2px color-mix(
    in srgb,
    var(
      --ezra-ui-theme-menu-item-accent,
      var(
        --ezra-ui-theme-picker-menu-item-accent,
        var(
          --ezra-ui-theme-picker-button-accent,
          var(--ezra-ui-control-menu-row-accent, var(--label-color))
        )
      )
    ) 54%,
    transparent
  );
}

.ezra-ui-control-menu--compact-text,
.ezra-ui-control-menu--compact-text .ezra-ui-control-menu-item-label,
.ezra-ui-control-menu--compact-text .ezra-ui-theme-menu-item-label,
.ezra-ui-control-menu--compact-text p {
  font-size: 1rem;
  line-height: 1.15;
}

.ezra-ui-control-menu-item-line {
  display: block;
  width: 18px;
  height: 0;
  border-top: 2px solid currentColor;
}

.ezra-ui-theme-menu-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: var(--ezra-ui-theme-menu-icon-size, 18px);
  height: var(--ezra-ui-theme-menu-icon-size, 18px);
}

.ezra-ui-theme-menu-icon svg,
.ezra-ui-theme-menu-icon img,
.ezra-ui-control-menu-item-icon svg,
.ezra-ui-control-menu-item-icon img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
}

.ezra-ui-theme-menu-icon--swatch {
  border: 1px solid var(--panel-border-strong);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 18%, transparent);
}
.ezra-ui-control-button {
  --ezra-ui-control-button-size: var(--ezra-ui-theme-control-button-size-compact, 28px);
  --ezra-ui-control-button-padding-inline: 10px;
  --ezra-ui-control-button-background: transparent;
  --ezra-ui-control-button-border: transparent;
  --ezra-ui-control-button-text: currentColor;
  --ezra-ui-control-button-hover-background: color-mix(
    in srgb,
    var(--background-color) 82%,
    var(--surface-hover) 18%
  );
  --ezra-ui-control-button-hover-text: var(--ezra-ui-control-button-text);
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--ezra-ui-control-button-size);
  width: var(--ezra-ui-control-button-size);
  min-height: var(--ezra-ui-control-button-size);
  height: var(--ezra-ui-control-button-size);
  margin: 0;
  padding: 0 var(--ezra-ui-control-button-padding-inline);
  border: 0;
  background: var(--ezra-ui-control-button-background);
  box-shadow: inset 0 0 0 1px var(--ezra-ui-control-button-border);
  color: var(--ezra-ui-control-button-text);
  font-family: var(--header-font);
  cursor: pointer;
  pointer-events: auto;
  box-sizing: border-box;
  transition:
    color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    opacity var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    background-color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    box-shadow var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade);
}

.ezra-ui-control-button:hover {
  background: var(--ezra-ui-control-button-hover-background);
  color: var(--ezra-ui-control-button-hover-text);
}

.ezra-ui-control-button:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)),
    inset 0 0 0 1px color-mix(
      in srgb,
      var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)) 18%,
      transparent
    );
}

.ezra-ui-control-button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.ezra-ui-control-button--icon {
  padding-inline: 0;
  line-height: 0;
}

.ezra-ui-control-button--corner {
  --ezra-ui-control-button-background: color-mix(
    in srgb,
    var(--panel-color) 84%,
    var(--background-color) 16%
  );
  --ezra-ui-control-button-border: var(--panel-border-strong);
}

.ezra-ui-control-popup-surface {
  position: relative;
  z-index: var(--ezra-ui-layer-control-popup, var(--ezra-ui-layer-workspace-dropdown, 60));
  border: 1px solid var(--ezra-ui-control-popup-border, var(--panel-border-strong));
  background: var(
    --ezra-ui-control-popup-background,
    color-mix(in srgb, var(--background-color) 96%, var(--quote-background-color) 4%)
  );
  box-shadow: var(--ezra-ui-control-popup-shadow, 0 10px 24px rgba(0, 0, 0, 0.28));
  backdrop-filter: var(--ezra-ui-control-popup-backdrop, none);
  box-sizing: border-box;
}

.ezra-ui-control-popup-window {
  position: relative;
  width: min(
    var(--ezra-ui-control-popup-window-width, var(--ezra-ui-theme-control-popup-window-width, 264px)),
    calc(100vw - 24px)
  );
  max-width: calc(100vw - 24px);
}

.ezra-ui-picker {
  position: relative;
}

.ezra-ui-picker--utility-row .ezra-ui-label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.ezra-ui-picker-results {
  display: grid;
  gap: 6px;
  max-height: var(--ezra-ui-picker-results-max-height, min(62dvh, 24rem));
  padding: var(--ezra-ui-picker-results-padding, 8px);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.ezra-ui-picker--utility-row .ezra-ui-picker-results {
  max-height: none;
}

.ezra-ui-picker-option,
.ezra-ui-picker-empty {
  min-width: 0;
  padding: 10px 12px;
  box-sizing: border-box;
}

.ezra-ui-picker-option {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--ezra-ui-picker-option-gap, 2px);
  border: 1px solid var(--ezra-ui-picker-option-border, var(--panel-border));
  background: var(
    --ezra-ui-picker-option-background,
    color-mix(in srgb, var(--background-color) 92%, var(--surface-quiet) 8%)
  );
  color: var(--text-color);
  text-align: left;
  font-family: var(--body-font);
  font-size: 1rem;
  line-height: 1.4;
  cursor: pointer;
}

.ezra-ui-picker-option:hover,
.ezra-ui-picker-option.is-active {
  border-color: var(--ezra-ui-picker-option-active-border, var(--panel-border-strong));
  background: var(
    --ezra-ui-picker-option-active-background,
    color-mix(in srgb, var(--surface-hover) 72%, var(--background-color) 28%)
  );
}

.ezra-ui-picker-option-label,
.ezra-ui-picker-option-meta {
  min-width: 0;
  overflow-wrap: anywhere;
}

.ezra-ui-picker-option-label {
  overflow: hidden;
  color: var(--ezra-ui-picker-option-label-color, var(--header-color));
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--header-font);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  line-height: 1.1;
  text-transform: uppercase;
}

.ezra-ui-picker-option-meta,
.ezra-ui-picker-empty {
  color: var(--muted-color);
  font-size: 0.92rem;
  line-height: 1.25;
}

.ezra-ui-date-picker-input-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: stretch;
}

.ezra-ui-date-picker-toggle {
  min-width: 72px;
  min-height: 44px;
  padding: 0 14px;
}

.ezra-ui-date-picker-popover {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: var(--ezra-ui-layer-control-popup, var(--ezra-ui-layer-workspace-dropdown, 60));
  display: grid;
  gap: 10px;
  width: min(320px, calc(100vw - 32px));
  padding: 12px;
}

.ezra-ui-date-picker-header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.ezra-ui-date-picker-month {
  min-width: 0;
  color: var(--header-color);
  font-family: var(--header-font);
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-align: center;
  text-transform: uppercase;
}

.ezra-ui-date-picker-weekdays,
.ezra-ui-date-picker-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 4px;
}

.ezra-ui-date-picker-weekdays span {
  color: var(--muted-color);
  font-family: var(--header-font);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-align: center;
  text-transform: uppercase;
}

.ezra-ui-date-picker-day {
  appearance: none;
  min-height: 38px;
  padding: 0;
  border: 1px solid var(--panel-border);
  background: color-mix(in srgb, var(--background-color) 92%, var(--surface-quiet) 8%);
  color: var(--text-color);
  cursor: pointer;
  font: inherit;
}

.ezra-ui-date-picker-day:hover {
  background: color-mix(in srgb, var(--surface-hover) 72%, var(--background-color) 28%);
  border-color: var(--panel-border-strong);
}

.ezra-ui-date-picker-day.is-outside-month {
  color: var(--muted-color);
  opacity: 0.72;
}

.ezra-ui-date-picker-day.is-today {
  box-shadow: inset 0 0 0 1px var(--label-color);
}

.ezra-ui-date-picker-day.is-selected {
  background: var(--button-background-color);
  border-color: var(--button-background-color);
  color: var(--button-text-color);
}

.ezra-ui-date-picker-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.ezra-ui-control-trigger {
  position: relative;
  min-width: 0;
  -webkit-tap-highlight-color: transparent;
}

.ezra-ui-control-trigger-label,
.ezra-ui-control-trigger-icon {
  position: relative;
  z-index: 1;
}

.ezra-ui-control-trigger-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.ezra-ui-control-trigger-icon svg {
  display: block;
  width: 18px;
  height: 18px;
  transition: transform var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-control-trigger.is-open .ezra-ui-control-trigger-icon svg {
  transform: rotate(var(--ezra-surface-motion-chevron-turn));
}

.ezra-ui-control-trigger--mobile-surface {
  --ezra-ui-control-trigger-icon-top: 1px;
  --ezra-ui-control-trigger-icon-right: 1px;
  --ezra-ui-control-trigger-icon-bottom: 1px;
  --ezra-ui-control-trigger-icon-width: 45px;
  --ezra-ui-control-trigger-open-border: var(--panel-border-strong);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 50px;
  padding: 11px 12px 10px;
  border: 0;
  overflow: hidden;
  font-family: var(--header-font);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1;
  text-transform: uppercase;
}

.ezra-ui-control-trigger--mobile-surface .ezra-ui-control-trigger-label {
  display: block;
  width: 100%;
  min-width: 0;
  text-align: center;
  pointer-events: none;
  opacity: 1;
  visibility: visible;
  transition: opacity var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-control-trigger--mobile-surface.is-open .ezra-ui-control-trigger-label {
  opacity: 0;
  visibility: hidden;
}

.ezra-ui-control-trigger--with-chevron {
  padding-right: 45px;
}

.ezra-ui-control-trigger--with-chevron .ezra-ui-control-trigger-icon {
  position: absolute;
  top: var(--ezra-ui-control-trigger-icon-top);
  right: var(--ezra-ui-control-trigger-icon-right);
  bottom: var(--ezra-ui-control-trigger-icon-bottom);
  width: var(--ezra-ui-control-trigger-icon-width);
  opacity: 1;
  font-size: 0.9rem;
  line-height: 1;
  background: transparent;
}

.ezra-ui-control-trigger--mobile-surface.is-open {
  background: transparent;
  color: inherit;
  box-shadow: inset 0 0 0 1px var(--ezra-ui-control-trigger-open-border);
}

.ezra-ui-control-drawer {
  position: relative;
  display: grid;
  grid-template-rows: 0fr;
  min-width: 0;
  margin-top: -1px;
  overflow: hidden;
  opacity: 0;
  transition:
    grid-template-rows var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard),
    opacity var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-control-drawer.is-open {
  grid-template-rows: 1fr;
  overflow: visible;
  opacity: 1;
  pointer-events: auto;
}

.ezra-ui-control-drawer.is-closed {
  grid-template-rows: 0fr;
  opacity: 0;
  pointer-events: none;
}

.ezra-ui-control-drawer-inner {
  display: grid;
  min-height: 0;
  overflow: hidden;
  opacity: 0;
  transform: translateY(calc(var(--ezra-surface-motion-surface-shift) * -1));
  transition:
    opacity var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard),
    transform var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-control-drawer.is-open .ezra-ui-control-drawer-inner {
  overflow: visible;
  opacity: 1;
  transform: translateY(0);
}

.ezra-ui-control-drawer.is-closed .ezra-ui-control-drawer-inner {
  opacity: 0;
  transform: translateY(calc(var(--ezra-surface-motion-surface-shift) * -1));
}

.ezra-ui-control-reveal-host {
  position: relative;
  display: grid;
  gap: 0;
  width: 100%;
  min-width: 0;
}

.ezra-ui-control-reveal-host > .ezra-ui-control-trigger--mobile-surface {
  position: relative;
  z-index: 1;
}

.ezra-ui-toolbar {
  position: relative;
  z-index: var(--ezra-ui-layer-workspace-filter, 20);
  display: grid;
  grid-template-columns: minmax(0, 2fr) repeat(2, minmax(0, 1fr)) auto;
  grid-auto-flow: column;
  gap: 14px;
  align-items: end;
  margin: 0;
  min-width: 0;
  overflow: visible;
}

.ezra-ui-toolbar:has(.ezra-ui-control-menu:not([hidden])),
.ezra-ui-toolbar:has(.ezra-ui-date-picker-popover:not([hidden])) {
  z-index: var(--ezra-ui-layer-workspace-dropdown, 60);
}

.ezra-ui-toolbar:has(> :nth-child(3):last-child) {
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) auto;
}

.ezra-ui-toolbar:has(> :nth-child(2):last-child),
.ezra-ui-toolbar--search-only {
  grid-template-columns: minmax(0, 1fr) auto;
}

.ezra-ui-toolbar--search-only > .ezra-ui-toolbar-group--search {
  width: 100%;
}

.ezra-ui-toolbar--search-only > .ezra-ui-toolbar-group--button {
  margin-left: 0;
}

.ezra-ui-toolbar-group {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.ezra-ui-toolbar-group--button {
  display: flex;
  flex-direction: column;
  justify-content: end;
}

.ezra-ui-toolbar-action-button {
  width: 100%;
  height: 46px;
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.ezra-ui-toolbar .ezra-ui-input {
  min-height: 46px;
  height: 46px;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  line-height: 1.35;
}

.ezra-ui-toolbar .ezra-ui-input:is(select) {
  padding-top: 10px;
  padding-right: 42px;
  padding-bottom: 10px;
}

.ezra-ui-toolbar .ezra-ui-input[type="search"],
.ezra-ui-toolbar .ezra-ui-input:is(select) {
  -webkit-appearance: none;
  appearance: none;
}

.ezra-ui-toolbar .ezra-ui-input[type="search"] {
  border-radius: 0;
}

.ezra-ui-toolbar .ezra-ui-input[type="search"]::-webkit-search-decoration,
.ezra-ui-toolbar .ezra-ui-input[type="search"]::-webkit-search-cancel-button,
.ezra-ui-toolbar .ezra-ui-input[type="search"]::-webkit-search-results-button,
.ezra-ui-toolbar .ezra-ui-input[type="search"]::-webkit-search-results-decoration {
  -webkit-appearance: none;
}

.ezra-ui-toolbar .ezra-ui-label {
  color: var(--text-color);
  font-family: var(--body-font);
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: none;
}

.ezra-ui-search-input-wrap {
  position: relative;
  width: 100%;
}

.ezra-ui-search-input-wrap .ezra-ui-input[type="search"] {
  padding-right: 42px;
}

.ezra-ui-search-clear-button {
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--label-color);
  cursor: pointer;
  font-family: var(--body-font);
  font-size: 2rem;
  line-height: 1;
}

.ezra-ui-search-clear-button:hover {
  color: var(--text-color);
}

.ezra-ui-search-clear-button:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--focus-ring);
}

.ezra-ui-filter-toolbar-shell {
  position: relative;
  z-index: var(--ezra-ui-layer-workspace-filter, 20);
  display: none;
}

.ezra-ui-filter-toolbar-shell:has(.ezra-ui-control-drawer.is-open),
.ezra-ui-filter-toolbar-shell:has(.ezra-ui-control-menu:not([hidden])) {
  z-index: var(--ezra-ui-layer-workspace-dropdown, 60);
}

.ezra-ui-filter-toolbar-button {
  height: 46px;
  min-height: 46px;
}

.ezra-ui-filter-toolbar-menu {
  max-height: min(60dvh, 28rem);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.ezra-ui-filter-toolbar-menu .ezra-ui-control-menu-item {
  font-family: var(--body-font);
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: none;
}

.ezra-ui-filter-toolbar-menu .ezra-ui-control-menu-item[aria-checked="true"] {
  background: color-mix(
    in srgb,
    var(--ezra-ui-control-menu-row-accent, var(--label-color)) 7%,
    var(--ezra-ui-control-menu-row-background, transparent)
  );
  box-shadow: inset 0 0 0 1px color-mix(
    in srgb,
    var(--ezra-ui-control-menu-row-accent, var(--label-color)) 32%,
    transparent
  );
}

.ezra-ui-filter-toolbar-menu .ezra-ui-control-menu-item.is-typeahead-active,
.ezra-ui-filter-toolbar-menu .ezra-ui-control-menu-item[data-ezra-ui-filter-typeahead-active="true"] {
  background: color-mix(
    in srgb,
    var(--ezra-ui-control-menu-row-accent, var(--label-color)) 12%,
    var(--ezra-ui-control-menu-row-background, transparent)
  );
  box-shadow: inset 0 0 0 2px color-mix(
    in srgb,
    var(--ezra-ui-control-menu-row-accent, var(--label-color)) 54%,
    transparent
  );
}

.ezra-ui-tabs {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--ezra-ui-tabs-gap, 8px);
}

.ezra-ui-tabs--toolbar {
  margin-left: auto;
}

.ezra-ui-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 10px 16px;
  appearance: none;
  border: 0;
  background: transparent;
  color: var(
    --ezra-ui-tab-text,
    color-mix(in srgb, var(--text-color) 84%, var(--muted-color) 16%)
  );
  box-shadow: inset 0 0 0 1px var(
    --ezra-ui-tab-border,
    color-mix(in srgb, var(--panel-border) 82%, transparent)
  );
  cursor: pointer;
  font-family: var(--header-font);
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 0.04em;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
  box-sizing: border-box;
  transition:
    background-color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    box-shadow var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    opacity var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade);
}

.ezra-ui-tab:hover {
  background: var(
    --ezra-ui-tab-hover-background,
    color-mix(in srgb, var(--surface-hover) 82%, var(--surface-quiet) 18%)
  );
}

.ezra-ui-tab.is-active,
.ezra-ui-tab[aria-selected="true"] {
  background: var(--ezra-ui-tab-active-background, var(--button-background-color));
  color: var(--ezra-ui-tab-active-text, var(--button-text-color));
  box-shadow: inset 0 0 0 1px var(
    --ezra-ui-tab-active-border,
    color-mix(in srgb, var(--border-color) 84%, transparent)
  );
}

.ezra-ui-tab:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring),
    inset 0 0 0 1px color-mix(in srgb, var(--focus-ring) 18%, transparent);
}

.ezra-ui-tab:disabled {
  cursor: not-allowed;
  opacity: 0.54;
}

.ezra-ui-data-table {
  display: grid;
  min-width: 0;
  border: 1px solid var(--panel-border);
  background: var(--surface-quiet);
}

.ezra-ui-data-table-row {
  display: grid;
  grid-template-columns: var(--ezra-ui-data-table-columns, minmax(0, 1fr));
  gap: var(--ezra-ui-row-gap);
  align-items: center;
  min-width: 0;
  padding: var(--ezra-ui-row-gap-loose, var(--ezra-ui-card-padding-compact, 12px));
  border-top: 1px solid var(--panel-border);
}

.ezra-ui-data-table-row:first-child,
.ezra-ui-data-table-details-row:first-of-type .ezra-ui-data-table-row {
  border-top: 0;
}

.ezra-ui-data-table-header {
  color: var(--muted-color);
  font-family: var(--header-font);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.1;
  text-transform: uppercase;
  background: var(--surface-color, var(--surface-quiet));
}

.ezra-ui-data-table-row > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ezra-ui-data-table-details-row {
  display: block;
  min-width: 0;
}

.ezra-ui-data-table-details-row summary {
  cursor: pointer;
  list-style: none;
  transition: background var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-data-table-details-row summary:hover,
.ezra-ui-data-table-details-row[open] summary {
  background: color-mix(in srgb, var(--panel-border) 12%, transparent);
}

.ezra-ui-data-table-details-row summary::-webkit-details-marker {
  display: none;
}

.ezra-ui-data-table-details-panel {
  display: grid;
  gap: var(--ezra-ui-row-gap-loose, 12px);
  padding: var(--ezra-ui-card-padding, 16px);
  border-top: 1px solid var(--panel-border);
  background: color-mix(in srgb, var(--surface-quiet) 82%, var(--surface-color, var(--panel-color)));
}

.ezra-ui-data-table-disclosure {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: end;
  width: 28px;
  height: 28px;
  min-width: 28px;
  padding: 0;
  border: 1px solid var(--button-border, var(--panel-border));
  background: var(--surface-color, var(--surface-quiet));
  color: var(--text-color);
  line-height: 1;
}

.ezra-ui-data-table-disclosure-icon {
  display: inline-grid;
  place-items: center;
  width: 14px;
  height: 14px;
}

.ezra-ui-data-table-disclosure-close {
  display: none;
}

.ezra-ui-data-table-details-row[open] .ezra-ui-data-table-disclosure-open {
  display: none;
}

.ezra-ui-data-table-details-row[open] .ezra-ui-data-table-disclosure-close {
  display: inline;
}

.ezra-ui-mobile-navigation-toggle {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 40px;
  margin: 0;
  padding: 10px 16px;
  gap: 16px;
  border: 1px solid var(--panel-border);
  background: var(--surface-quiet);
  color: var(--ezra-ui-mobile-list-toggle-text, var(--text-color));
  box-shadow: none;
  font-family: var(--header-font);
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
  cursor: default;
  pointer-events: none;
  box-sizing: border-box;
  transition:
    background-color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    box-shadow var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    opacity var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade);
}

.ezra-ui-mobile-navigation-toggle > :first-child {
  flex: 1 1 auto;
  min-width: 0;
  text-align: left;
}

.ezra-ui-mobile-navigation-toggle-meta {
  flex: 0 0 auto;
  margin-left: auto;
  color: var(--ezra-ui-mobile-list-toggle-meta, var(--muted-color));
  font-family: var(--body-font);
  font-size: 0.86rem;
  line-height: 1rem;
  font-weight: 400;
  text-align: right;
}

.ezra-ui-mobile-navigation-toggle:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)),
    inset 0 0 0 1px color-mix(
      in srgb,
      var(--focus-ring, var(--ezra-ui-theme-focus-ring, currentColor)) 18%,
      transparent
    );
}

.ezra-ui-mobile-navigation-toggle:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

@media (max-width: 860px) {
  .ezra-ui-mobile-navigation-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    min-height: 42px;
    width: 100%;
    padding: 11px 12px;
    margin: 0;
    gap: 12px;
    background: var(--panel-color);
    color: var(--text-color);
    border: 1px solid var(--panel-border);
    box-shadow: none;
    cursor: pointer;
    pointer-events: auto;
  }

  .ezra-ui-mobile-navigation-toggle-meta {
    color: var(--muted-color);
    font-size: 0.92rem;
  }
}

.ezra-ui-item-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.ezra-ui-item-list-row {
  margin: 0;
}

.ezra-ui-item-list-row--with-actions {
  position: relative;
  container-type: inline-size;
}

.ezra-ui-item-list-button {
  display: block;
  width: 100%;
  padding: var(--ezra-ui-item-list-button-padding, 14px 18px);
  border: 0;
  background: var(--ezra-ui-item-list-button-background, transparent);
  color: var(--ezra-ui-item-list-button-text, inherit);
  text-align: left;
  box-shadow: inset 0 -1px 0 var(--ezra-ui-item-list-button-border, var(--panel-border));
  cursor: pointer;
  transition:
    background-color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-standard),
    box-shadow var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-item-list-button--with-row-actions {
  padding-inline-end: var(--ezra-ui-item-list-row-action-reserve, clamp(72px, 32cqi, 96px));
}

.ezra-ui-item-list-row-actions {
  position: absolute;
  inset-inline-end: var(--ezra-ui-item-list-row-action-inset-inline, 10px);
  inset-block-end: var(--ezra-ui-item-list-row-action-inset-block, 10px);
  z-index: 2;
  display: flex;
  justify-content: flex-end;
  max-inline-size: min(42cqi, var(--ezra-ui-item-list-row-action-max-inline-size, 96px));
  pointer-events: auto;
}

.ezra-ui-item-list-row-actions .ezra-ui-repeater-standard-actions {
  flex-wrap: nowrap;
  gap: var(--ezra-ui-item-list-row-action-gap, clamp(4px, 2cqi, 8px));
}

.ezra-ui-item-list-row-actions .ezra-ui-repeater-icon-button {
  inline-size: var(--ezra-ui-item-list-row-action-button-size, clamp(1.65rem, 12cqi, 2.1rem));
  min-inline-size: 0;
  padding-inline: 0;
}

.ezra-ui-item-list-button:hover,
.ezra-ui-item-list-button.is-active,
.ezra-ui-item-list-row.is-active .ezra-ui-item-list-button {
  background: var(--ezra-ui-item-list-button-hover-background, var(--surface-quiet));
}

.ezra-ui-item-list-row.is-active .ezra-ui-item-list-button {
  box-shadow:
    inset 3px 0 0 var(--ezra-ui-item-list-active-marker, var(--input-highlight-color)),
    inset 0 -1px 0 var(--ezra-ui-item-list-button-border, var(--panel-border));
}

.ezra-ui-item-list-button:focus-visible {
  outline: none;
  box-shadow:
    inset 0 0 0 2px var(--focus-ring),
    inset 0 -1px 0 var(--ezra-ui-item-list-button-border, var(--panel-border));
}

.ezra-ui-item-list-row:first-child .ezra-ui-item-list-button:focus-visible {
  box-shadow:
    inset 0 0 0 2px var(--focus-ring),
    inset 0 -1px 0 var(--ezra-ui-item-list-button-border, var(--panel-border));
}

.ezra-ui-item-list-title {
  display: block;
  margin: 0 0 6px;
  color: var(--ezra-ui-item-list-title-color, var(--h1-color));
  font-family: var(--header-font);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: normal;
  line-height: 1.15rem;
  text-transform: none;
}

.ezra-ui-item-list-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0 0;
}

.ezra-ui-item-list-excerpt {
  display: block;
  margin: 0 0 8px;
  color: var(--ezra-ui-item-list-excerpt-color, var(--muted-color));
  font-family: var(--body-font);
  font-size: 0.96rem;
  font-weight: 400;
  letter-spacing: normal;
  line-height: 1.28rem;
  text-transform: none;
}

.ezra-ui-item-list-detail {
  display: block;
  margin: 0;
  color: var(--ezra-ui-item-list-detail-color, var(--muted-color));
  font-family: var(--header-font);
  font-size: 0.78rem;
  font-style: normal;
  letter-spacing: 0.03em;
  line-height: 1rem;
  text-transform: uppercase;
}

.ezra-ui-item-list-empty {
  padding: 18px;
  color: var(--ezra-ui-item-list-empty-color, var(--muted-color));
  font-family: var(--body-font);
  font-size: var(--ezra-ui-item-list-empty-font-size, 1rem);
  font-weight: 400;
  line-height: var(--ezra-ui-item-list-empty-line-height, 1.4);
}

.ezra-ui-split-trigger-shell {
  position: relative;
  display: block;
  z-index: 1;
  width: 100%;
  min-width: 0;
}

.ezra-ui-split-trigger-button,
.ezra-ui-split-trigger-chevron {
  appearance: none;
  border: 0;
  cursor: pointer;
  box-sizing: border-box;
  background: var(--ezra-ui-split-trigger-surface, var(--surface-quiet));
  color: var(--ezra-ui-split-trigger-text, var(--text-color));
  transition:
    background-color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    border-color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    box-shadow var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    opacity var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    transform var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-split-trigger-button {
  width: 100%;
  min-width: 0;
  min-height: var(--ezra-ui-split-trigger-height, 44px);
  padding: var(
    --ezra-ui-split-trigger-padding,
    var(--ezra-ui-split-trigger-padding-top, 14px)
    var(--ezra-ui-split-trigger-padding-inline-end, 16px)
    var(--ezra-ui-split-trigger-padding-bottom, 12px)
    var(--ezra-ui-split-trigger-padding-inline-start, 16px)
  );
  box-shadow:
    inset 0 0 0 1px var(--ezra-ui-split-trigger-border, var(--panel-border)),
    inset 0 1px 0 var(--ezra-ui-split-trigger-top-highlight, transparent);
  font-family: var(--ezra-ui-split-trigger-font-family, inherit);
  font-size: var(--ezra-ui-split-trigger-font-size, inherit);
  font-weight: var(--ezra-ui-split-trigger-font-weight, inherit);
  line-height: var(--ezra-ui-split-trigger-line-height, inherit);
  letter-spacing: var(--ezra-ui-split-trigger-letter-spacing, inherit);
  text-transform: var(--ezra-ui-split-trigger-text-transform, inherit);
  text-align: var(--ezra-ui-split-trigger-text-align, left);
}

.ezra-ui-split-trigger-chevron {
  font-family: var(--ezra-ui-split-trigger-font-family, var(--header-font));
}

.ezra-ui-split-trigger-shell:hover .ezra-ui-split-trigger-button,
.ezra-ui-split-trigger-shell:hover .ezra-ui-split-trigger-chevron {
  background: var(--ezra-ui-split-trigger-hover-surface, var(--ezra-ui-split-trigger-surface, var(--surface-hover)));
}

.ezra-ui-split-trigger-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
  justify-items: var(--ezra-ui-split-trigger-copy-justify, start);
  padding-right: var(--ezra-ui-split-trigger-copy-offset, 0px);
}

.ezra-ui-split-trigger-message {
  display: block;
  width: 100%;
  min-width: 0;
  color: currentColor;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: 1;
  letter-spacing: inherit;
  text-transform: inherit;
}

.ezra-ui-split-trigger-meta {
  color: color-mix(in srgb, currentColor 78%, transparent);
  font-family: var(--header-font);
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.ezra-ui-split-trigger-chevron {
  position: absolute;
  top: var(--ezra-ui-split-trigger-inset, 0px);
  right: var(--ezra-ui-split-trigger-inset, 0px);
  bottom: auto;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--ezra-ui-split-trigger-chevron-width, 44px);
  min-width: var(--ezra-ui-split-trigger-chevron-width, 44px);
  min-height: var(--ezra-ui-split-trigger-chevron-height, var(--ezra-ui-split-trigger-height, 44px));
  height: calc(100% - (var(--ezra-ui-split-trigger-inset, 0px) * 2));
  padding: 0;
  box-shadow:
    inset 1px 0 0 var(--ezra-ui-split-trigger-divider, var(--panel-border)),
    inset 0 1px 0 var(--ezra-ui-split-trigger-top-highlight, transparent);
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.ezra-ui-split-trigger-button:focus-visible,
.ezra-ui-split-trigger-chevron:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--focus-ring);
}

.ezra-ui-split-trigger-chevron-icon {
  display: block;
  width: 18px;
  height: 18px;
}

.ezra-ui-split-trigger-chevron-icon path {
  transform-origin: 50% 50%;
  transition: transform var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard);
}

.ezra-ui-split-trigger-chevron-icon.is-open path {
  transform: rotate(var(--ezra-surface-motion-chevron-turn));
}

@media (max-width: 1180px) {
  .ezra-ui-toolbar,
  .ezra-ui-toolbar:has(> :nth-child(3):last-child) {
    grid-template-columns: minmax(0, 1.6fr) repeat(2, minmax(10rem, 1fr)) auto;
    gap: 12px;
  }

  .ezra-ui-toolbar:has(> :nth-child(2):last-child),
  .ezra-ui-toolbar--search-only {
    grid-template-columns: minmax(0, 1fr) auto;
  }
}

@media (max-width: 1080px) {
  .ezra-ui-toolbar,
  .ezra-ui-toolbar:has(> :nth-child(3):last-child),
  .ezra-ui-toolbar:has(> :nth-child(2):last-child),
  .ezra-ui-toolbar--search-only {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-flow: row;
    gap: 12px;
    align-items: end;
  }

  .ezra-ui-toolbar-group--button {
    grid-column: 1 / -1;
  }

  .ezra-ui-toolbar-action-button {
    width: 100%;
  }
}

@media (max-width: 860px) {
  .ezra-ui-toolbar,
  .ezra-ui-toolbar:has(> :nth-child(3):last-child),
  .ezra-ui-toolbar:has(> :nth-child(2):last-child),
  .ezra-ui-toolbar--search-only {
    grid-template-columns: minmax(0, 1fr);
    grid-auto-flow: row;
    gap: 12px;
    align-items: stretch;
    min-height: 42px;
  }

  .ezra-ui-toolbar--search-only > .ezra-ui-toolbar-group--search {
    width: 100%;
  }

  .ezra-ui-toolbar--search-only > .ezra-ui-toolbar-group--button {
    margin-left: 0;
  }

  .ezra-ui-toolbar-group,
  .ezra-ui-toolbar-group--mobile-menu {
    gap: 5px;
    min-width: 0;
    width: 100%;
  }

  .ezra-ui-toolbar-group--desktop-only {
    display: none;
  }

  .ezra-ui-toolbar-group--button {
    align-self: stretch;
    justify-content: flex-start;
    width: 100%;
  }

  .ezra-ui-toolbar .ezra-ui-input {
    height: auto;
    min-height: 42px;
  }

  .ezra-ui-toolbar-action-button {
    width: 100%;
    height: auto !important;
    min-height: 42px !important;
    max-height: none !important;
    padding: 10px 18px !important;
  }

  .ezra-ui-filter-toolbar-shell {
    display: grid;
    gap: 0;
    width: 100%;
  }

  .ezra-ui-search-clear-button {
    right: 9px;
  }

  .ezra-ui-filter-toolbar-trigger {
    --ezra-ui-control-trigger-icon-right: 12px;
    --ezra-ui-control-trigger-icon-width: 18px;
    --ezra-ui-control-trigger-open-border: var(
      --ezra-ui-filter-toolbar-trigger-open-border,
      var(--panel-border-strong)
    );
    padding-left: 42px;
    padding-right: 42px;
    background: var(--panel-color);
    color: var(--ezra-ui-filter-toolbar-trigger-text, var(--text-color));
    box-shadow: inset 0 0 0 1px var(--ezra-ui-filter-toolbar-trigger-border, var(--panel-border));
  }

  .ezra-ui-filter-toolbar-trigger::before {
    content: "";
    position: absolute;
    inset: 1px;
    z-index: 0;
    opacity: 0;
    transform: translateY(0);
    background: color-mix(in srgb, var(--input-highlight-color) 36%, var(--label-color) 64%);
    transition:
      opacity var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard),
      transform var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-standard),
      background-color var(--ezra-surface-motion-duration-standard) var(--ezra-surface-motion-ease-fade);
    pointer-events: none;
  }

  .ezra-ui-filter-toolbar-trigger.is-open::before {
    transform: translateY(100%);
  }

  .ezra-ui-filter-toolbar-trigger-label {
    min-width: 0;
    flex: 0 1 auto;
  }

  .ezra-ui-filter-toolbar-trigger-icon {
    box-shadow: none;
  }

  .ezra-ui-filter-toolbar-drawer {
    position: relative;
  }

  .ezra-ui-filter-toolbar-drawer-inner {
    gap: 8px;
    padding: 10px 2px 2px;
  }

}

@media (max-width: 720px) {
  .ezra-ui-tabs {
    width: 100%;
    gap: var(--ezra-ui-tabs-mobile-gap, 6px);
  }

  .ezra-ui-tabs--toolbar {
    order: -1;
    width: 100%;
    margin-left: 0;
  }

  .ezra-ui-tab {
    flex: 1 1 0;
    min-height: 40px;
    padding: 8px 10px;
    font-size: 0.88rem;
  }

  .ezra-ui-data-table {
    --ezra-ui-data-table-mobile-columns: minmax(0, 1fr) auto;
  }

  .ezra-ui-data-table-header {
    display: none;
  }

  .ezra-ui-data-table-row {
    grid-template-columns: var(--ezra-ui-data-table-mobile-columns);
    gap: var(--ezra-ui-row-gap-compact) var(--ezra-ui-row-gap);
    align-items: center;
  }

  .ezra-ui-data-table-row > span {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
  }

  .ezra-ui-data-table-disclosure {
    width: 40px;
    height: 40px;
    min-width: 40px;
  }
}

.ezra-ui-app-header {
  display: block;
  margin: 0;
  overflow: visible;
}

.ezra-ui-app-header-main {
  --ezra-ui-app-header-menu-size: var(--ezra-ui-app-header-menu-control-size, var(--ezra-app-surface-header-menu-control-size, 28px));
  --ezra-ui-app-header-menu-window-measure: var(
    --ezra-ui-app-header-menu-window-width,
    min(264px, calc(100vw - 24px))
  );
  --ezra-ui-app-header-menu-edge-inset: var(--ezra-ui-app-header-menu-inset, var(--ezra-app-surface-header-menu-inset, 12px));
  --ezra-ui-app-header-control-row-min-height: var(
    --ezra-ui-app-header-theme-control-row-min-height,
    calc(var(--ezra-ui-app-header-menu-size) + var(--ezra-ui-app-header-menu-edge-inset))
  );
  --ezra-ui-app-header-title-measure: var(--ezra-ui-app-header-measure, min(520px, 58vw));
  --ezra-ui-app-header-kicker-color: var(--ezra-ui-app-header-label-color, var(--label-color));
  --ezra-ui-app-header-control-accent: var(--ezra-ui-app-header-kicker-color);
  --ezra-ui-app-header-badge-accent: var(--ezra-ui-app-header-kicker-color);
  --ezra-ui-app-header-band-gap: var(--ezra-ui-app-header-gap, var(--ezra-app-surface-header-copy-gap, clamp(10px, 1.4vw, 14px)));
  --ezra-ui-app-header-title-font-size: var(--ezra-ui-app-header-title-size, var(--ezra-app-surface-header-title-size, clamp(2.3rem, 4.8vw, 3.5rem)));
  --ezra-ui-app-header-title-line-height: var(--ezra-ui-app-header-title-line, var(--ezra-app-surface-header-title-line-height, 0.94));
  --ezra-ui-app-header-title-text-line-height: calc(
    var(--ezra-ui-app-header-title-font-size) * var(--ezra-ui-app-header-title-line-height)
  );
  --ezra-ui-app-header-title-row-min-height: var(
    --ezra-ui-app-header-title-row-height,
    var(--ezra-ui-app-header-title-text-line-height)
  );
  --ezra-ui-app-header-title-badge-gap: var(
    --ezra-ui-app-header-badge-gap,
    clamp(8px, calc(var(--ezra-ui-app-header-title-font-size) * 0.26), 12px)
  );
  --ezra-ui-app-header-badge-height: var(
    --ezra-ui-app-header-mode-badge-height,
    clamp(1.7rem, calc(var(--ezra-ui-app-header-title-font-size) * 0.685), 2.4rem)
  );
  --ezra-ui-app-header-badge-padding-inline: var(
    --ezra-ui-app-header-mode-badge-padding-inline,
    clamp(7px, calc(var(--ezra-ui-app-header-title-font-size) * 0.215), 12px)
  );
  --ezra-ui-app-header-badge-font-size: var(
    --ezra-ui-app-header-mode-badge-font-size,
    clamp(0.68rem, calc(var(--ezra-ui-app-header-title-font-size) * 0.235), 0.82rem)
  );
  --ezra-ui-app-header-title-to-session-gap: var(
    --ezra-ui-app-header-session-gap,
    clamp(16px, 2.2vw, 24px)
  );
  position: relative;
  z-index: 0;
  display: grid;
  gap: var(--ezra-ui-app-header-band-gap);
  width: 100%;
  min-width: 0;
  overflow: visible;
  isolation: isolate;
}

.ezra-ui-app-header-band {
  position: relative;
  width: 100%;
  min-width: 0;
  overflow: visible;
}

.ezra-ui-app-header-band--controls {
  z-index: var(--ezra-ui-layer-header-controls, 120);
  min-height: var(--ezra-ui-app-header-menu-size);
}

.ezra-ui-app-header-band--controls:has(.ezra-ui-app-header-menu-shell.is-open) {
  z-index: var(--ezra-ui-layer-header-menu-open, 140);
}

.ezra-ui-app-header-band--identity {
  z-index: var(--ezra-ui-layer-header-identity, 110);
  display: grid;
  gap: calc(var(--ezra-ui-app-header-band-gap) - 2px);
}

.ezra-ui-app-header-band--session {
  z-index: var(--ezra-ui-layer-header-session, 100);
  padding-top: var(--ezra-ui-app-header-title-to-session-gap);
  padding-bottom: 0;
}

.ezra-ui-app-header-kicker {
  margin: 0;
  color: var(--ezra-ui-app-header-kicker-color);
  font-family: var(--header-font);
  font-size: 1rem;
  line-height: 1.05rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.ezra-ui-app-header-kicker-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  min-height: var(--ezra-ui-app-header-control-row-min-height);
  margin: 0;
  padding-right: 0;
}

.ezra-ui-app-header-kicker-row > .ezra-ui-app-header-kicker {
  min-width: 0;
}

.ezra-ui-app-header-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  column-gap: 12px;
  min-height: var(--ezra-ui-app-header-control-row-min-height);
}

.ezra-ui-app-header-controls-slot {
  position: relative;
  justify-self: end;
  align-self: center;
  min-width: 0;
  min-height: var(--ezra-ui-app-header-control-row-min-height);
}

.ezra-ui-app-header-menu-shell {
  --ezra-ui-app-header-menu-size: var(--ezra-ui-app-header-menu-control-size, var(--ezra-app-surface-header-menu-control-size, 28px));
  --ezra-ui-app-header-menu-window-measure: var(
    --ezra-ui-app-header-menu-window-width,
    min(264px, calc(100vw - 24px))
  );
  --ezra-ui-app-header-menu-edge-inset: var(--ezra-ui-app-header-menu-inset, var(--ezra-app-surface-header-menu-inset, 12px));
  --ezra-ui-app-header-control-row-min-height: var(
    --ezra-ui-app-header-theme-control-row-min-height,
    calc(var(--ezra-ui-app-header-menu-size) + var(--ezra-ui-app-header-menu-edge-inset))
  );
  position: relative;
  z-index: var(--ezra-ui-layer-header-controls, 120);
  width: calc(var(--ezra-ui-app-header-menu-size) + (var(--ezra-ui-app-header-menu-edge-inset) * 2));
  min-height: var(--ezra-ui-app-header-control-row-min-height);
  overflow: visible;
}

.ezra-ui-app-header-menu-shell.is-open {
  z-index: var(--ezra-ui-layer-header-menu-open, 140);
}

.ezra-ui-app-header-menu-toggle-shell {
  position: absolute;
  top: 50%;
  right: var(--ezra-ui-app-header-menu-edge-inset);
  z-index: calc(var(--ezra-ui-layer-header-menu-open, 140) + 4);
  transform: translateY(-50%);
}

.ezra-ui-app-header-title-row {
  position: relative;
  display: inline-grid;
  grid-template-columns: minmax(0, max-content) auto;
  align-items: center;
  column-gap: var(--ezra-ui-app-header-title-badge-gap);
  width: fit-content;
  max-width: 100%;
  min-width: 0;
  min-height: var(--ezra-ui-app-header-title-row-min-height);
  margin: 0;
  overflow: visible;
}

.ezra-ui-app-header-title-slot {
  display: flex;
  align-items: center;
  width: auto;
  max-width: 100%;
  min-width: 0;
  min-height: var(--ezra-ui-app-header-title-row-min-height);
}

.ezra-ui-app-header-title-slot--loading {
  position: absolute;
  inset: 0 auto auto 0;
  z-index: 1;
  display: flex;
  align-items: center;
  width: var(--ezra-ui-app-header-title-measure);
  max-width: 100%;
  min-width: 0;
  min-height: var(--ezra-ui-app-header-title-row-min-height);
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
}

.ezra-ui-app-header-title-slot--loading.is-visible {
  opacity: 1;
  visibility: visible;
}

.ezra-ui-app-header-title-slot--loading.is-visible ~ .ezra-ui-app-header-badge-rail {
  visibility: hidden;
}

.ezra-ui-app-header-home-link,
.ezra-ui-app-header-home-link--static {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ezra-ui-app-header-home-link-color, var(--h1-color));
  font-family: var(--title-font);
  font-size: var(--ezra-ui-app-header-title-font-size);
  font-weight: 700;
  line-height: var(--ezra-ui-app-header-title-line-height);
  letter-spacing: 0.02em;
  text-align: left;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
  appearance: none;
  -webkit-appearance: none;
  transition:
    color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    opacity var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade);
}

.ezra-ui-app-header-home-link {
  cursor: pointer;
}

.ezra-ui-app-header-home-link--static {
  cursor: default;
}

.ezra-ui-app-header-home-link:hover {
  opacity: 0.88;
}

.ezra-ui-app-header-home-link:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--focus-ring);
}

.ezra-ui-app-header-badge-rail {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
  min-height: var(--ezra-ui-app-header-title-text-line-height);
}

.ezra-ui-app-header-title-stack {
  display: inline-grid;
  gap: calc(var(--ezra-ui-app-header-band-gap) - 2px);
  width: fit-content;
  max-width: 100%;
  min-width: 0;
}

.ezra-ui-app-header-session-control-row {
  display: grid;
  width: 100%;
  min-width: 0;
  margin-top: 0;
  padding-bottom: 0;
}

.ezra-ui-app-header-title-loading {
  display: grid;
  align-content: start;
  gap: 8px;
  width: 100%;
  max-width: none;
  min-height: var(--ezra-ui-app-header-title-row-min-height);
  background: var(--background-color);
}

.ezra-ui-app-header-title-loading-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 1rem;
  color: var(--text-color);
  font-family: var(--header-font);
  font-size: 0.86rem;
  font-weight: 700;
  line-height: 1rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.ezra-ui-app-header-title-loading-bar {
  width: 100%;
  height: 10px;
  margin: 0;
  border: 1px solid var(--panel-border);
  background: var(--surface-quiet);
  overflow: hidden;
  box-sizing: border-box;
}

.ezra-ui-app-header-title-loading-bar-fill {
  display: block;
  height: 100%;
  background: var(--yellow);
  transition: width var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade);
}

.ezra-ui-app-header-menu-button {
  --ezra-ui-control-button-size: var(--ezra-ui-app-header-menu-size);
  --ezra-ui-control-button-text: var(--ezra-ui-app-header-control-accent);
  --ezra-ui-control-button-hover-text: var(--ezra-ui-app-header-control-accent);
  position: relative;
  z-index: calc(var(--ezra-ui-layer-header-menu, 130) + 1);
  color: var(--ezra-ui-app-header-control-accent);
  box-shadow: none;
  overflow: visible;
}

.ezra-ui-app-header-menu-button,
.ezra-ui-app-header-menu-button .ezra-ui-app-header-menu-icon,
.ezra-ui-app-header-menu-button .ezra-ui-app-header-menu-icon svg {
  color: var(--ezra-ui-app-header-control-accent);
}

.ezra-ui-app-header-menu-button:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring),
    inset 0 0 0 1px color-mix(in srgb, var(--focus-ring) 18%, transparent);
}

.ezra-ui-app-header-menu-icon {
  display: inline-grid;
  place-items: center;
  width: 16px;
  height: 16px;
}

.ezra-ui-app-header-menu-icon-open {
  opacity: 0;
}

.ezra-ui-app-header-menu-button.is-open .ezra-ui-app-header-menu-icon-closed {
  opacity: 0;
}

.ezra-ui-app-header-menu-button.is-open .ezra-ui-app-header-menu-icon-open {
  opacity: 1;
}

.ezra-ui-app-header-menu {
  position: absolute;
  top: 0;
  right: 0;
  z-index: calc(var(--ezra-ui-layer-header-menu-open, 140) + 2);
  display: grid;
  justify-items: end;
  width: var(--ezra-ui-app-header-menu-window-measure);
  max-width: min(var(--ezra-ui-app-header-menu-window-measure), calc(100vw - 24px));
  margin: 0;
  pointer-events: none;
}

.ezra-ui-app-header-menu.is-closed {
  display: none;
}

.ezra-ui-app-header-menu.is-open {
  display: grid;
  pointer-events: auto;
  visibility: visible;
}

.ezra-ui-app-header-menu .ezra-ui-control-popup-window {
  width: var(--ezra-ui-app-header-menu-window-measure);
  max-width: min(var(--ezra-ui-app-header-menu-window-measure), calc(100vw - 24px));
}

.ezra-ui-app-header-menu > .ezra-ui-control-popup-window > .ezra-ui-control-popup-surface {
  --ezra-ui-control-popup-background: var(
    --ezra-ui-app-header-menu-panel-background,
    color-mix(in srgb, var(--panel-color) 88%, var(--background-color) 12%)
  );
  --ezra-ui-control-popup-shadow: 0 14px 30px color-mix(in srgb, var(--background-color) 22%, transparent);
  --ezra-ui-control-popup-backdrop: var(--ezra-ui-app-header-menu-panel-backdrop, blur(10px));
  position: relative;
  z-index: calc(var(--ezra-ui-layer-header-menu-open, 140) + 3);
  display: grid;
  gap: 8px;
  width: var(--ezra-ui-app-header-menu-window-measure);
  min-width: 0;
  max-width: min(var(--ezra-ui-app-header-menu-window-measure), calc(100vw - 24px));
  padding:
    var(--ezra-ui-app-header-menu-panel-block-start, var(--ezra-ui-app-header-menu-edge-inset))
    var(--ezra-ui-app-header-menu-edge-inset)
    var(--ezra-ui-app-header-menu-edge-inset);
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transform: translateY(calc(var(--ezra-surface-motion-surface-shift) * -1));
  transform-origin: top right;
  transition:
    max-height var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard),
    opacity var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard),
    transform var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard),
    visibility 0s linear var(--ezra-surface-motion-duration-surface);
}

.ezra-ui-app-header-menu.is-open > .ezra-ui-control-popup-window > .ezra-ui-control-popup-surface {
  height: auto;
  max-height: var(--ezra-ui-app-header-menu-panel-max-height, calc(100svh - 24px));
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  transition:
    max-height var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard),
    opacity var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard),
    transform var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard),
    visibility 0s linear 0s;
}

.ezra-ui-app-header-menu-shell.is-open .ezra-ui-app-header-menu > .ezra-ui-control-popup-window > .ezra-ui-control-popup-surface {
  height: auto;
  max-height: var(--ezra-ui-app-header-menu-panel-max-height, calc(100svh - 24px));
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

.ezra-ui-app-header-menu .ezra-ui-theme-picker,
.ezra-ui-app-header-menu-controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  justify-items: stretch;
  gap: 4px;
  justify-self: stretch;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.ezra-ui-app-header-menu .ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu-shell,
.ezra-ui-app-header-menu .ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu-button {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.ezra-ui-app-header-menu .ezra-ui-app-header-auth-controls,
.ezra-ui-app-header-menu .ezra-ui-app-header-status,
.ezra-ui-app-header-menu .ezra-ui-app-header-auth-action {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.ezra-ui-app-header-menu .ezra-ui-theme-menu-shell {
  position: relative;
  z-index: calc(var(--ezra-ui-layer-header-menu, 130) + 4);
  overflow: visible;
}

.ezra-ui-app-header-menu .ezra-ui-theme-picker--app-surface .ezra-ui-theme-menu,
.ezra-ui-app-header-menu .ezra-ui-theme-menu-shell > .ezra-ui-control-popup-surface.ezra-ui-theme-menu {
  position: static;
  top: auto;
  right: auto;
  left: auto;
  z-index: calc(var(--ezra-ui-layer-header-menu, 130) + 5);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  max-height: var(
    --ezra-ui-app-header-theme-menu-max-height,
    calc(
      var(--ezra-ui-app-header-menu-panel-max-height, calc(100svh - 24px))
      - var(--ezra-ui-app-header-theme-menu-reserved-height, 148px)
    )
  );
  margin-top: 4px;
  align-content: start;
  overflow-y: auto;
  overscroll-behavior: contain;
  box-shadow: none;
}

.ezra-ui-app-header-auth-controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  gap: 6px;
  width: 100%;
  min-width: 0;
}

.ezra-ui-app-header-status {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  max-width: 100%;
  min-height: var(--ezra-ui-app-header-status-min-height, 44px);
  padding:
    var(--ezra-ui-app-header-status-padding-block, 10px)
    var(--ezra-ui-app-header-status-padding-inline, 12px);
  border: 1px solid var(--panel-border-strong);
  background: color-mix(in srgb, var(--panel-color) 88%, var(--background-color) 12%);
  box-sizing: border-box;
  color: inherit;
  font-family: var(--header-font);
  font-size: var(--ezra-ui-app-header-status-font-size, 0.9rem);
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: var(--ezra-ui-app-header-status-line-height, 1.1);
  text-align: center;
  text-transform: uppercase;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  flex-shrink: 1;
}

@media (min-width: 861px) {
  .ezra-ui-app-header-session-control-row {
    width: var(
      --ezra-ui-app-header-session-control-width,
      calc(
      (
          (100% - (var(--ezra-ui-app-header-session-control-gap, 10px) * 3))
          / var(--ezra-ui-app-header-session-control-columns, 4)
      ) * 2
        + var(--ezra-ui-app-header-session-control-gap, 10px)
      )
    );
    max-width: 100%;
  }
}

@media (max-width: 1120px) {
  .ezra-ui-app-header-top {
    column-gap: 10px;
  }

  .ezra-ui-app-header-session-control-row {
    width: 100%;
    max-width: 100%;
  }
}

@media (max-width: 860px) {
  .ezra-ui-app-header {
    position: relative;
    display: grid;
    gap: 0;
  }

  .ezra-ui-app-header > :first-child {
    min-width: 0;
  }

  .ezra-ui-app-header-main {
    --ezra-ui-app-header-menu-window-measure: min(256px, calc(100vw - 24px));
    --ezra-ui-app-header-title-measure: 100%;
    --ezra-ui-app-header-band-gap: 6px;
    --ezra-ui-app-header-title-font-size: clamp(1.4rem, 6.6vw, 1.9rem);
    --ezra-ui-app-header-title-line-height: 0.96;
    --ezra-ui-app-header-title-row-min-height: var(--ezra-ui-app-header-title-text-line-height);
    --ezra-ui-app-header-title-badge-gap: clamp(
      6px,
      calc(var(--ezra-ui-app-header-title-font-size) * 0.28),
      8px
    );
    --ezra-ui-app-header-badge-height: clamp(
      1.2rem,
      calc(var(--ezra-ui-app-header-title-font-size) * 0.78),
      1.7rem
    );
    --ezra-ui-app-header-badge-padding-inline: clamp(
      6px,
      calc(var(--ezra-ui-app-header-title-font-size) * 0.25),
      9px
    );
    --ezra-ui-app-header-badge-font-size: clamp(
      0.58rem,
      calc(var(--ezra-ui-app-header-title-font-size) * 0.3),
      0.72rem
    );
  }

  .ezra-ui-app-header-title-row {
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: var(--ezra-ui-app-header-title-badge-gap);
    width: auto;
    max-width: 100%;
  }

  .ezra-ui-app-header-title-stack {
    width: 100%;
    max-width: 100%;
  }

  .ezra-ui-app-header-title-slot {
    flex: 0 1 auto;
    width: auto;
    max-width: 100%;
  }

  .ezra-ui-app-header-home-link {
    white-space: nowrap;
  }

  .ezra-ui-app-header-badge-rail {
    flex: 0 0 auto;
    justify-content: flex-start;
  }

  .ezra-ui-app-header-session-control-row {
    margin-top: 0;
    padding-bottom: 0;
  }

  .ezra-ui-app-header-status,
  .ezra-ui-app-header-auth-controls .ezra-ui-button {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .ezra-ui-app-header-status {
    justify-content: center;
    min-height: 42px;
    padding: 10px 12px;
    text-align: center;
  }

  .ezra-ui-app-header-auth-controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    width: 100%;
    min-width: 0;
  }
}


.ezra-app-surface {
  --panel-color: var(
    --ezra-app-surface-theme-panel-color,
    color-mix(in srgb, var(--background-color) 88%, var(--quote-background-color) 12%)
  );
  --panel-border: var(
    --ezra-app-surface-theme-panel-border,
    color-mix(in srgb, var(--border-color) 68%, transparent)
  );
  --panel-border-strong: var(
    --ezra-app-surface-theme-panel-border-strong,
    color-mix(in srgb, var(--border-color) 84%, transparent)
  );
  --input-bg: var(
    --ezra-app-surface-theme-input-bg,
    color-mix(in srgb, var(--background-color) 78%, var(--quote-background-color) 22%)
  );
  --muted-color: var(
    --ezra-app-surface-theme-muted-color,
    color-mix(in srgb, var(--text-color) 68%, transparent)
  );
  --surface-quiet: var(
    --ezra-app-surface-theme-surface-quiet,
    color-mix(in srgb, var(--background-color) 68%, var(--quote-background-color) 32%)
  );
  --surface-hover: var(
    --ezra-app-surface-theme-surface-hover,
    color-mix(in srgb, var(--button-background-color) 14%, var(--background-color))
  );
  --focus-ring: var(
    --ezra-app-surface-theme-focus-ring,
    color-mix(in srgb, var(--input-highlight-color) 70%, transparent)
  );
  --ezra-ui-space-2xs: 4px;
  --ezra-ui-space-xs: 8px;
  --ezra-ui-space-sm: 12px;
  --ezra-ui-space-md: 16px;
  --ezra-ui-space-lg: 20px;
  --ezra-ui-space-xl: 24px;
  --ezra-ui-space-2xl: 32px;
  --ezra-ui-space-3xl: 40px;
  --ezra-ui-card-padding: var(--ezra-app-surface-theme-card-padding, clamp(14px, 1.35vw, 18px));
  --ezra-ui-card-padding-compact: var(--ezra-app-surface-theme-card-padding-compact, clamp(12px, 1.1vw, 14px));
  --ezra-ui-grid-gap: var(--ezra-app-surface-theme-grid-gap, clamp(14px, 1.9vw, 20px));
  --ezra-ui-stack-gap: var(--ezra-app-surface-theme-stack-gap, clamp(14px, 1.4vw, 16px));
  --ezra-ui-stack-gap-compact: var(--ezra-app-surface-theme-stack-gap-compact, 12px);
  --ezra-ui-stack-gap-loose: var(--ezra-app-surface-theme-stack-gap-loose, clamp(18px, 2vw, 24px));
  --ezra-ui-row-gap: var(--ezra-app-surface-theme-row-gap, 8px);
  --ezra-ui-row-gap-compact: var(--ezra-app-surface-theme-row-gap-compact, 6px);
  --ezra-ui-row-gap-loose: var(--ezra-app-surface-theme-row-gap-loose, 12px);
  --ezra-ui-field-row-gap: 14px;
  --ezra-ui-layer-workspace: var(--ezra-app-surface-theme-layer-workspace, 10);
  --ezra-ui-layer-workspace-filter: var(--ezra-app-surface-theme-layer-workspace-filter, 20);
  --ezra-ui-layer-workspace-mode: var(--ezra-app-surface-theme-layer-workspace-mode, 30);
  --ezra-ui-layer-workspace-menu: var(--ezra-app-surface-theme-layer-workspace-menu, 40);
  --ezra-ui-layer-workspace-dropdown: var(--ezra-app-surface-theme-layer-workspace-dropdown, 60);
  --ezra-ui-layer-control-popup: var(
    --ezra-app-surface-theme-layer-control-popup,
    var(--ezra-ui-layer-workspace-dropdown, 60)
  );
  --ezra-ui-layer-header: var(--ezra-app-surface-theme-layer-header, 80);
  --ezra-ui-layer-header-session: var(--ezra-app-surface-theme-layer-header-session, 100);
  --ezra-ui-layer-header-identity: var(--ezra-app-surface-theme-layer-header-identity, 110);
  --ezra-ui-layer-header-controls: var(--ezra-app-surface-theme-layer-header-controls, 120);
  --ezra-ui-layer-header-menu: var(--ezra-app-surface-theme-layer-header-menu, 130);
  --ezra-ui-layer-header-menu-open: var(--ezra-app-surface-theme-layer-header-menu-open, 140);
  --ezra-ui-metadata-border: var(--panel-border);
  --ezra-app-surface-header-menu-control-size: var(--ezra-app-surface-theme-header-menu-control-size, 28px);
  --ezra-app-surface-header-menu-inset: var(--ezra-app-surface-theme-header-menu-inset, 12px);
  --ezra-app-surface-header-control-row-min-height: var(
    --ezra-app-surface-theme-header-control-row-min-height,
    calc(var(--ezra-app-surface-header-menu-control-size) + var(--ezra-app-surface-header-menu-inset))
  );
  --ezra-app-surface-header-copy-gap: var(--ezra-app-surface-theme-header-copy-gap, clamp(10px, 1.4vw, 14px));
  --ezra-app-surface-header-eyebrow-font: var(--ezra-app-surface-theme-header-eyebrow-font, var(--header-font));
  --ezra-app-surface-header-eyebrow-size: var(--ezra-app-surface-theme-header-eyebrow-size, 1rem);
  --ezra-app-surface-header-eyebrow-line-height: var(--ezra-app-surface-theme-header-eyebrow-line-height, 1.05rem);
  --ezra-app-surface-header-eyebrow-letter-spacing: var(--ezra-app-surface-theme-header-eyebrow-letter-spacing, 0.1em);
  --ezra-app-surface-header-eyebrow-weight: var(--ezra-app-surface-theme-header-eyebrow-weight, 400);
  --ezra-app-surface-header-title-size: var(
    --ezra-app-surface-theme-header-title-size,
    clamp(2.3rem, 4.8vw, 3.5rem)
  );
  --ezra-app-surface-header-title-line-height: var(--ezra-app-surface-theme-header-title-line-height, 0.94);
  --ezra-app-surface-header-title-letter-spacing: var(--ezra-app-surface-theme-header-title-letter-spacing, 0.02em);
  --ezra-app-surface-mode-focus-title-color: var(
    --ezra-app-surface-theme-mode-focus-title-color,
    var(--h1-color, currentColor)
  );
  --ezra-app-surface-mode-focus-title-font: var(
    --ezra-app-surface-theme-mode-focus-title-font,
    var(--title-font, var(--header-font))
  );
  --ezra-app-surface-mode-focus-title-weight: var(--ezra-app-surface-theme-mode-focus-title-weight, 700);
  --ezra-app-surface-mode-focus-title-size: var(--ezra-app-surface-theme-mode-focus-title-size, 4.9rem);
  --ezra-app-surface-mode-focus-title-line-height: var(--ezra-app-surface-theme-mode-focus-title-line-height, 0.92);
  --ezra-app-surface-mode-focus-title-letter-spacing: var(--ezra-app-surface-theme-mode-focus-title-letter-spacing, 0.04em);
  --ezra-surface-motion-duration-fast: var(--ezra-app-surface-theme-motion-duration-fast, 160ms);
  --ezra-surface-motion-duration-standard: var(--ezra-app-surface-theme-motion-duration-standard, 220ms);
  --ezra-surface-motion-duration-surface: var(--ezra-app-surface-theme-motion-duration-surface, 180ms);
  --ezra-surface-motion-duration-deck: var(--ezra-app-surface-theme-motion-duration-deck, 240ms);
  --ezra-surface-motion-ease-standard: var(--ezra-app-surface-theme-motion-ease-standard, cubic-bezier(0.22, 1, 0.36, 1));
  --ezra-surface-motion-ease-fade: var(--ezra-app-surface-theme-motion-ease-fade, ease);
  --ezra-surface-motion-ease-friction: var(--ezra-app-surface-theme-motion-ease-friction, var(--ezra-surface-motion-ease-standard, cubic-bezier(0.22, 1, 0.36, 1)));
  --ezra-surface-motion-surface-shift: var(--ezra-app-surface-theme-motion-surface-shift, 4px);
  --ezra-surface-motion-deck-shift: var(--ezra-app-surface-theme-motion-deck-shift, 100%);
  --ezra-surface-motion-deck-shift-negative: var(--ezra-app-surface-theme-motion-deck-shift-negative, -100%);
  --ezra-surface-motion-chevron-turn: var(--ezra-app-surface-theme-motion-chevron-turn, 180deg);
  --ezra-ui-panel-editor-background: var(
    --ezra-app-surface-theme-editor-card-bg,
    color-mix(in srgb, var(--panel-color) 94%, var(--background-color) 6%)
  );
  --ezra-ui-panel-editor-border: var(--ezra-app-surface-theme-editor-card-border, var(--panel-border-strong));
  --ezra-ui-panel-editor-shadow: var(
    --ezra-app-surface-theme-editor-card-shadow,
    0 14px 32px color-mix(in srgb, var(--background-color) 28%, transparent)
  );
  --ezra-ui-panel-list-background: var(
    --ezra-app-surface-theme-collection-card-bg,
    color-mix(in srgb, var(--panel-color) 72%, var(--background-color) 28%)
  );
  --ezra-ui-panel-list-border: var(--ezra-app-surface-theme-collection-card-border, var(--panel-border));
  --ezra-ui-panel-list-shadow: var(
    --ezra-app-surface-theme-collection-card-shadow,
    inset 0 1px 0 color-mix(in srgb, var(--background-color) 12%, transparent)
  );
  --ezra-ui-panel-list-body-border: var(--ezra-app-surface-theme-collection-card-body-border, var(--panel-border));
  --ezra-ui-panel-list-item-background: var(
    --ezra-app-surface-theme-collection-button-bg,
    color-mix(in srgb, var(--panel-color) 56%, var(--background-color) 44%)
  );
  --ezra-ui-panel-list-item-hover-background: var(
    --ezra-app-surface-theme-collection-button-hover-bg,
    color-mix(in srgb, var(--surface-hover) 68%, var(--panel-color) 32%)
  );
  --ezra-ui-mobile-list-toggle-text: var(--ezra-app-surface-theme-mobile-collection-toggle-text, var(--text-color));
  --ezra-ui-mobile-list-toggle-meta: var(--ezra-app-surface-theme-mobile-collection-toggle-meta, var(--muted-color));
  --ezra-ui-mobile-list-toggle-border: var(--ezra-app-surface-theme-mobile-collection-toggle-border, var(--panel-border));
  --badge-color: var(--ezra-app-surface-theme-badge-color, var(--input-highlight-color));
  --badge-published-color: var(--ezra-app-surface-theme-badge-published-color, var(--text-color));
  --badge-published-border: var(--ezra-app-surface-theme-badge-published-border, var(--input-highlight-color));
  --badge-published-bg: var(
    --ezra-app-surface-theme-badge-published-bg,
    color-mix(in srgb, var(--text-color) 6%, transparent)
  );
  --badge-draft-color: var(--ezra-app-surface-theme-badge-draft-color, var(--yellow));
  --badge-draft-border: var(
    --ezra-app-surface-theme-badge-draft-border,
    color-mix(in srgb, var(--yellow) 44%, transparent)
  );
  --badge-draft-bg: var(
    --ezra-app-surface-theme-badge-draft-bg,
    color-mix(in srgb, var(--yellow) 12%, transparent)
  );
  --badge-ready-color: var(--ezra-app-surface-theme-badge-ready-color, var(--badge-published-color));
  --badge-ready-border: var(
    --ezra-app-surface-theme-badge-ready-border,
    color-mix(in srgb, var(--text-color) 44%, transparent)
  );
  --badge-ready-bg: var(--ezra-app-surface-theme-badge-ready-bg, var(--badge-published-bg));
  --badge-delete-color: var(--label-color);
  --badge-delete-border: color-mix(in srgb, var(--label-color) 44%, transparent);
  --badge-delete-bg: color-mix(in srgb, var(--label-color) 10%, transparent);
  --badge-featured-color: var(--ezra-app-surface-theme-badge-featured-color, var(--label-color));
  --badge-featured-border: var(
    --ezra-app-surface-theme-badge-featured-border,
    color-mix(in srgb, var(--label-color) 44%, transparent)
  );
  --badge-featured-bg: var(--ezra-app-surface-theme-badge-featured-bg, transparent);
  --chip-color: var(--ezra-app-surface-theme-chip-color, var(--text-color));
  --chip-bg: var(
    --ezra-app-surface-theme-chip-bg,
    color-mix(in srgb, var(--button-background-color) 10%, var(--panel-color))
  );
  --chip-border: var(--ezra-app-surface-theme-chip-border, var(--panel-border-strong));
  --ezra-app-surface-primary-button-background: var(--ezra-app-surface-theme-primary-button-background, var(--button-background-color));
  --ezra-app-surface-primary-button-text: var(--ezra-app-surface-theme-primary-button-text, var(--button-text-color));
  --ezra-app-surface-primary-button-border: var(
    --ezra-app-surface-theme-primary-button-border,
    color-mix(in srgb, var(--button-background-color) 72%, transparent)
  );
  --ezra-app-surface-primary-button-hover-background: var(
    --ezra-app-surface-theme-primary-button-hover-background,
    color-mix(in srgb, var(--button-background-color) 84%, var(--background-color) 16%)
  );
  --ezra-app-surface-primary-button-hover-text: var(--ezra-app-surface-theme-primary-button-hover-text, var(--button-text-color));
  --ezra-app-surface-primary-button-hover-border: var(--ezra-app-surface-theme-primary-button-hover-border, var(--button-background-color));
  --ezra-app-surface-secondary-button-background: var(
    --ezra-app-surface-theme-secondary-button-background,
    color-mix(in srgb, var(--button-background-color) 12%, var(--background-color))
  );
  --ezra-app-surface-secondary-button-text: var(--ezra-app-surface-theme-secondary-button-text, var(--text-color));
  --ezra-app-surface-secondary-button-border: var(
    --ezra-app-surface-theme-secondary-button-border,
    color-mix(in srgb, var(--button-background-color) 42%, var(--border-color))
  );
  --ezra-app-surface-secondary-button-hover-background: var(
    --ezra-app-surface-theme-secondary-button-hover-background,
    color-mix(in srgb, var(--button-background-color) 18%, var(--background-color))
  );
  --ezra-app-surface-secondary-button-hover-text: var(--ezra-app-surface-theme-secondary-button-hover-text, var(--text-color));
  --ezra-app-surface-secondary-button-hover-border: var(
    --ezra-app-surface-theme-secondary-button-hover-border,
    color-mix(in srgb, var(--button-background-color) 62%, var(--border-color))
  );
  --ezra-app-surface-ghost-button-text: var(
    --ezra-app-surface-theme-ghost-button-text,
    color-mix(in srgb, var(--text-color) 82%, var(--muted-color) 18%)
  );
  --ezra-app-surface-ghost-button-border: var(
    --ezra-app-surface-theme-ghost-button-border,
    color-mix(in srgb, var(--panel-border) 82%, transparent)
  );
  --ezra-app-surface-ghost-button-hover-background: var(
    --ezra-app-surface-theme-ghost-button-hover-background,
    color-mix(in srgb, var(--text-color) 6%, transparent)
  );
  --ezra-app-surface-ghost-button-hover-text: var(--ezra-app-surface-theme-ghost-button-hover-text, var(--text-color));
  --ezra-app-surface-danger-button-background: var(
    --ezra-app-surface-theme-danger-button-background,
    transparent
  );
  --ezra-app-surface-danger-button-text: var(--ezra-app-surface-theme-danger-button-text, var(--red));
  --ezra-app-surface-danger-button-border: var(
    --ezra-app-surface-theme-danger-button-border,
    color-mix(in srgb, var(--red) 58%, transparent)
  );
  --ezra-app-surface-danger-button-hover-background: var(
    --ezra-app-surface-theme-danger-button-hover-background,
    transparent
  );
  --ezra-app-surface-danger-button-hover-text: var(--ezra-app-surface-theme-danger-button-hover-text, var(--red));
  --ezra-app-surface-danger-button-hover-border: var(
    --ezra-app-surface-theme-danger-button-hover-border,
    color-mix(in srgb, var(--red) 78%, transparent)
  );
  --ezra-app-surface-important-button-accent: var(
    --ezra-app-surface-theme-important-button-accent,
    var(
      --ezra-ui-theme-important-action-accent,
      var(--ezra-ui-theme-accent-strong, var(--button-background-color))
    )
  );
  --ezra-app-surface-important-button-background: var(
    --ezra-app-surface-theme-important-button-background,
    var(
      --ezra-ui-theme-important-action-background,
      color-mix(in srgb, var(--ezra-app-surface-important-button-accent) 16%, var(--background-color))
    )
  );
  --ezra-app-surface-important-button-text: var(
    --ezra-app-surface-theme-important-button-text,
    var(
      --ezra-ui-theme-important-action-text,
      var(--h1-color, var(--text-color))
    )
  );
  --ezra-app-surface-important-button-border: var(
    --ezra-app-surface-theme-important-button-border,
    var(
      --ezra-ui-theme-important-action-border,
      color-mix(in srgb, var(--ezra-app-surface-important-button-accent) 68%, var(--border-color))
    )
  );
  --ezra-app-surface-important-button-hover-background: var(
    --ezra-app-surface-theme-important-button-hover-background,
    var(
      --ezra-ui-theme-important-action-hover-background,
      color-mix(in srgb, var(--ezra-app-surface-important-button-accent) 24%, var(--background-color))
    )
  );
  --ezra-app-surface-important-button-hover-text: var(
    --ezra-app-surface-theme-important-button-hover-text,
    var(
      --ezra-ui-theme-important-action-hover-text,
      var(--h1-color, var(--text-color))
    )
  );
  --ezra-app-surface-important-button-hover-border: var(
    --ezra-app-surface-theme-important-button-hover-border,
    var(
      --ezra-ui-theme-important-action-hover-border,
      var(--ezra-app-surface-important-button-accent)
    )
  );
  --ezra-app-surface-secondary-important-button-background: var(
    --ezra-app-surface-theme-secondary-important-button-background,
    transparent
  );
  --ezra-app-surface-secondary-important-button-text: var(
    --ezra-app-surface-theme-secondary-important-button-text,
    var(--h1-color, var(--text-color))
  );
  --ezra-app-surface-secondary-important-button-border: var(
    --ezra-app-surface-theme-secondary-important-button-border,
    color-mix(in srgb, var(--ezra-app-surface-important-button-accent) 68%, var(--border-color))
  );
  --ezra-app-surface-secondary-important-button-hover-background: var(
    --ezra-app-surface-theme-secondary-important-button-hover-background,
    transparent
  );
  --ezra-app-surface-secondary-important-button-hover-text: var(
    --ezra-app-surface-theme-secondary-important-button-hover-text,
    var(--ezra-app-surface-secondary-important-button-text)
  );
  --ezra-app-surface-secondary-important-button-hover-border: var(
    --ezra-app-surface-theme-secondary-important-button-hover-border,
    color-mix(in srgb, var(--ezra-app-surface-important-button-accent) 88%, var(--border-color))
  );
  --message-error-border: var(
    --ezra-app-surface-theme-message-error-border,
    color-mix(in srgb, var(--label-color) 70%, transparent)
  );
  --message-error-bg: var(
    --ezra-app-surface-theme-message-error-bg,
    color-mix(in srgb, var(--label-color) 10%, var(--surface-quiet))
  );
  --message-success-border: var(
    --ezra-app-surface-theme-message-success-border,
    color-mix(in srgb, var(--yellow) 55%, transparent)
  );
  --message-success-bg: var(
    --ezra-app-surface-theme-message-success-bg,
    color-mix(in srgb, var(--yellow) 10%, var(--surface-quiet))
  );
  --ezra-ui-repeater-background: var(--ezra-app-surface-theme-repeater-bg, var(--surface-quiet));
  --ezra-ui-repeater-border: var(--ezra-app-surface-theme-repeater-border, var(--panel-border));
  --ezra-ui-repeater-item-background: var(--ezra-app-surface-theme-repeater-item-bg, var(--surface-quiet));
  --ezra-ui-repeater-item-border: var(--ezra-app-surface-theme-repeater-item-border, var(--panel-border));
  --ezra-ui-repeater-item-border-strong: var(--ezra-app-surface-theme-repeater-item-border-strong, var(--panel-border-strong));
  --ezra-ui-repeater-title-color: var(--ezra-app-surface-theme-repeater-title-color, var(--h1-color));
  --ezra-ui-repeater-meta-color: var(--ezra-app-surface-theme-repeater-meta-color, var(--muted-color));
  color: var(--text-color);
  width: 100%;
  min-width: 0;
  min-height: 100vh;
  min-height: 100dvh;
  padding:
    var(--ezra-surface-frame-inset-block-start)
    var(--ezra-surface-frame-inset-inline-end)
    var(--ezra-surface-frame-inset-block-end)
    var(--ezra-surface-frame-inset-inline-start);
  box-sizing: border-box;
  background: var(--ezra-surface-background, var(--background-color, Canvas));
}

.ezra-app-surface-shell {
  --ezra-app-surface-section-gap: var(
    --ezra-app-surface-theme-section-gap,
    var(--ezra-surface-frame-region-gap)
  );
  width: var(--ezra-surface-frame-content-inline-size);
  min-width: 0;
  max-width: var(--ezra-app-surface-shell-max-width, var(--ezra-surface-frame-content-max-measure));
  margin: var(--ezra-app-surface-shell-margin, 0);
  display: grid;
  grid-template-rows: auto auto;
  align-content: start;
  gap: var(--ezra-app-surface-section-gap);
}

.ezra-app-surface-page {
  width: var(--ezra-surface-frame-content-inline-size);
  max-width: var(--ezra-surface-frame-content-max-measure);
  margin: 0;
}

@media (max-width: 860px) {
  .ezra-app-surface {
    min-height: 100vh;
    min-height: 100dvh;
    padding:
      var(--ezra-surface-frame-inset-block-start)
      var(--ezra-surface-frame-inset-inline-end)
      var(--ezra-surface-frame-inset-block-end)
      var(--ezra-surface-frame-inset-inline-start);
  }
}

@media (prefers-reduced-motion: reduce) {
  .ezra-app-surface {
    --ezra-surface-motion-duration-fast: 1ms;
    --ezra-surface-motion-duration-standard: 1ms;
    --ezra-surface-motion-duration-surface: 1ms;
    --ezra-surface-motion-duration-deck: 1ms;
    --ezra-surface-motion-surface-shift: 0px;
    --ezra-surface-motion-deck-shift: 0%;
    --ezra-surface-motion-deck-shift-negative: 0%;
  }
}

.ezra-app-surface,
.ezra-app-surface-page {
  --ezra-app-surface-header-menu-control-size: var(--ezra-app-surface-theme-header-menu-control-size, 28px);
  --ezra-app-surface-header-menu-inset: var(--ezra-app-surface-theme-header-menu-inset, 12px);
  --ezra-app-surface-header-control-row-min-height: var(
    --ezra-app-surface-theme-header-control-row-min-height,
    calc(var(--ezra-app-surface-header-menu-control-size) + var(--ezra-app-surface-header-menu-inset))
  );
  --ezra-app-surface-header-copy-gap: var(--ezra-app-surface-theme-header-copy-gap, clamp(10px, 1.4vw, 14px));
  --ezra-app-surface-header-eyebrow-font: var(--ezra-app-surface-theme-header-eyebrow-font, var(--header-font));
  --ezra-app-surface-header-eyebrow-size: var(--ezra-app-surface-theme-header-eyebrow-size, 1rem);
  --ezra-app-surface-header-eyebrow-line-height: var(--ezra-app-surface-theme-header-eyebrow-line-height, 1.05rem);
  --ezra-app-surface-header-eyebrow-letter-spacing: var(--ezra-app-surface-theme-header-eyebrow-letter-spacing, 0.1em);
  --ezra-app-surface-header-eyebrow-weight: var(--ezra-app-surface-theme-header-eyebrow-weight, 400);
  --ezra-app-surface-header-title-size: var(
    --ezra-app-surface-theme-header-title-size,
    clamp(2.3rem, 4.8vw, 3.5rem)
  );
  --ezra-app-surface-header-title-line-height: var(--ezra-app-surface-theme-header-title-line-height, 0.94);
  --ezra-app-surface-header-title-letter-spacing: var(--ezra-app-surface-theme-header-title-letter-spacing, 0.02em);
  --ezra-app-surface-mode-focus-title-color: var(
    --ezra-app-surface-theme-mode-focus-title-color,
    var(--h1-color, currentColor)
  );
  --ezra-app-surface-mode-focus-title-font: var(
    --ezra-app-surface-theme-mode-focus-title-font,
    var(--title-font, var(--header-font))
  );
  --ezra-app-surface-mode-focus-title-weight: var(--ezra-app-surface-theme-mode-focus-title-weight, 700);
  --ezra-app-surface-mode-focus-title-size: var(--ezra-app-surface-theme-mode-focus-title-size, 4.9rem);
  --ezra-app-surface-mode-focus-title-line-height: var(--ezra-app-surface-theme-mode-focus-title-line-height, 0.92);
  --ezra-app-surface-mode-focus-title-letter-spacing: var(--ezra-app-surface-theme-mode-focus-title-letter-spacing, 0.04em);
}

.ezra-app-surface-page {
  display: grid;
  gap: var(--ezra-app-surface-page-gap, 18px);
}

.ezra-app-surface-content {
  display: grid;
  gap: var(--ezra-app-surface-content-gap, 16px);
  width: 100%;
  min-width: 0;
}

.ezra-app-surface-top,
.ezra-app-surface-body,
.ezra-app-surface-header,
.ezra-app-surface-header-main,
.ezra-app-surface-header-copy,
.ezra-app-surface-header-actions,
.ezra-app-surface-header-controls {
  min-width: 0;
}

.ezra-app-surface-header {
  margin: 0;
  display: grid;
  gap: var(--ezra-app-surface-header-controls-gap, var(--ezra-app-surface-section-gap, 18px));
}

.ezra-app-surface-header-copy {
  display: grid;
  align-content: start;
  gap: var(--ezra-app-surface-header-copy-gap);
  max-width: var(--ezra-app-surface-header-copy-measure, 58rem);
}

.ezra-app-surface-header-copy:has(.ezra-app-surface-eyebrow) {
  grid-template-rows: minmax(var(--ezra-app-surface-header-control-row-min-height), auto) auto;
}

.ezra-app-surface-header-main {
  display: grid;
  gap: var(--ezra-app-surface-header-action-gap, 16px);
  align-items: flex-start;
}

.ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) {
  display: flex;
  gap: var(--ezra-app-surface-header-action-gap, 16px);
  align-items: flex-start;
  justify-content: space-between;
}

.ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-header-copy {
  flex: 1 1 auto;
}

.ezra-app-surface-header-actions {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  gap: var(--ezra-app-surface-header-control-gap, 10px);
  align-items: center;
  justify-content: flex-end;
  margin-left: auto;
  min-height: var(--ezra-app-surface-header-control-row-min-height);
}

.ezra-app-surface-header-controls {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ezra-app-surface-header-control-gap, 10px);
  align-items: flex-start;
  justify-content: flex-start;
}

.ezra-app-surface-eyebrow {
  align-self: center;
  margin: 0;
  color: var(--ezra-app-surface-header-eyebrow-color, var(--label-color, var(--h6-color, currentColor)));
  font-family: var(--ezra-app-surface-header-eyebrow-font, var(--header-font));
  font-size: var(--ezra-app-surface-header-eyebrow-size);
  font-weight: var(--ezra-app-surface-header-eyebrow-weight, 400);
  line-height: var(--ezra-app-surface-header-eyebrow-line-height);
  letter-spacing: var(--ezra-app-surface-header-eyebrow-letter-spacing);
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.ezra-app-surface-title {
  margin: 0;
  color: var(--ezra-app-surface-header-title-color, var(--h1-color, currentColor));
  font-family: var(--ezra-app-surface-header-title-font, var(--title-font, var(--header-font)));
  font-weight: var(--ezra-app-surface-header-title-weight, 700);
  font-size: var(--ezra-app-surface-header-title-size);
  line-height: var(--ezra-app-surface-header-title-line-height);
  letter-spacing: var(--ezra-app-surface-header-title-letter-spacing);
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.ezra-app-surface-mode-focus-title {
  margin: 0;
  color: var(--ezra-app-surface-mode-focus-title-color);
  font-family: var(--ezra-app-surface-mode-focus-title-font);
  font-weight: var(--ezra-app-surface-mode-focus-title-weight);
  font-size: var(--ezra-app-surface-mode-focus-title-size);
  line-height: var(--ezra-app-surface-mode-focus-title-line-height);
  letter-spacing: var(--ezra-app-surface-mode-focus-title-letter-spacing);
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.ezra-app-surface-copy {
  margin: 0;
  color: var(--ezra-app-surface-copy-color, var(--muted-color, currentColor));
}

@media (max-width: 720px) {
  .ezra-app-surface,
  .ezra-app-surface-page {
    --ezra-app-surface-page-gap: var(--ezra-app-surface-theme-page-gap-mobile, 14px);
    --ezra-app-surface-header-title-size: var(--ezra-app-surface-theme-header-title-size-mobile, 2rem);
    --ezra-app-surface-header-title-line-height: var(--ezra-app-surface-theme-header-title-line-height-mobile, 0.92);
    --ezra-app-surface-mode-focus-title-size: var(--ezra-app-surface-theme-mode-focus-title-size-mobile, 2rem);
    --ezra-app-surface-mode-focus-title-line-height: var(--ezra-app-surface-theme-mode-focus-title-line-height-mobile, 0.92);
  }

  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: var(--ezra-app-surface-header-action-gap, 16px);
    row-gap: var(--ezra-app-surface-header-copy-gap);
    align-items: start;
    justify-content: stretch;
  }

  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-header-copy {
    display: contents;
  }

  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-eyebrow {
    grid-column: 1;
    grid-row: 1;
  }

  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-header-actions {
    grid-column: 2;
    grid-row: 1;
    align-self: start;
    margin-left: 0;
  }

  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-title,
  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-mode-focus-title,
  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-copy {
    grid-column: 1 / -1;
    min-width: 0;
    max-width: 100%;
  }

  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-title,
  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-mode-focus-title {
    grid-row: 2;
  }

  .ezra-app-surface-header-main:has(.ezra-app-surface-header-actions) .ezra-app-surface-copy {
    grid-row: 3;
  }
}

.ezra-cms-markdown-preview img {
  display: block;
  max-width: 100%;
  height: auto;
  margin-block: 1rem;
  border: 1px solid var(--panel-border);
  background: var(--surface-quiet);
}

.ezra-cms-markdown-preview iframe {
  width: 100%;
  max-width: 800px;
  aspect-ratio: 16 / 9;
  border: none;
}

.ezra-cms-markdown-preview p > img {
  width: 100%;
  min-width: 100%;
}

.ezra-cms-markdown-preview blockquote.instagram-media {
  min-height: 640px;
}

.ezra-cms-markdown-preview figure {
  margin: 0.75rem 0 1.125rem;
  width: 100%;
}

.ezra-cms-markdown-preview figure img {
  margin: 0;
  height: auto;
  display: block;
  width: 100%;
}

.ezra-cms-markdown-preview figure figcaption {
  margin: 0.75rem 0 0;
  font-style: italic;
  font-size: 1.125rem;
  line-height: 1.375rem;
  font-weight: 400;
}

.ezra-cms-markdown-preview figure.float-left,
.ezra-cms-markdown-preview figure.float-right {
  width: max(50%, 400px);
  max-width: max(50%, 400px);
}

.ezra-cms-markdown-preview figure.float-left {
  float: left;
  margin-right: 1.75rem;
}

.ezra-cms-markdown-preview figure.float-right {
  float: right;
  margin-left: 1.75rem;
}

.ezra-cms-markdown-preview figure:has(img + img) {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
}

.ezra-cms-markdown-preview figure:has(img + img) img {
  aspect-ratio: 5 / 4;
  object-fit: cover;
}

.ezra-cms-markdown-preview figure:has(img + img) figcaption {
  grid-column: 1 / -1;
  margin: 0;
}

@media (max-width: 768px) {
.ezra-cms-markdown-preview figure:has(img + img) {
  display: block;
}

.ezra-cms-markdown-preview figure:has(img + img) img {
  width: 100%;
  height: auto;
  aspect-ratio: unset;
  object-fit: cover;
  display: block;
  margin-bottom: 1rem;
}

.ezra-cms-markdown-preview figure:has(img + img) img:last-child {
  margin-bottom: 0;
}

.ezra-cms-markdown-preview figure:has(img + img) figcaption {
  margin-top: 0;
}

.ezra-cms-markdown-preview figure.float-left,
.ezra-cms-markdown-preview figure.float-right,
.ezra-cms-markdown-preview .float-left,
.ezra-cms-markdown-preview .float-right {
  float: none;
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
  display: block;
}

.ezra-cms-markdown-preview figure.float-left img,
.ezra-cms-markdown-preview figure.float-right img,
.ezra-cms-markdown-preview .float-left img,
.ezra-cms-markdown-preview .float-right img {
  width: 100%;
  height: auto;
  aspect-ratio: unset;
  object-fit: contain;
}
}


.ezra-cms-application-chrome {
  --panel-color: var(
    --ezra-app-surface-theme-panel-color,
    color-mix(in srgb, var(--background-color) 88%, var(--quote-background-color) 12%)
  );
  --panel-border: var(
    --ezra-app-surface-theme-panel-border,
    color-mix(in srgb, var(--border-color) 68%, transparent)
  );
  --panel-border-strong: var(
    --ezra-app-surface-theme-panel-border-strong,
    color-mix(in srgb, var(--border-color) 84%, transparent)
  );
  --input-bg: var(
    --ezra-app-surface-theme-input-bg,
    color-mix(in srgb, var(--background-color) 78%, var(--quote-background-color) 22%)
  );
  --muted-color: var(
    --ezra-app-surface-theme-muted-color,
    color-mix(in srgb, var(--text-color) 68%, transparent)
  );
  --surface-quiet: var(
    --ezra-app-surface-theme-surface-quiet,
    color-mix(in srgb, var(--background-color) 68%, var(--quote-background-color) 32%)
  );
  --surface-hover: var(
    --ezra-app-surface-theme-surface-hover,
    color-mix(in srgb, var(--button-background-color) 14%, var(--background-color))
  );
  --focus-ring: var(
    --ezra-app-surface-theme-focus-ring,
    color-mix(in srgb, var(--input-highlight-color) 70%, transparent)
  );
  --ezra-ui-space-2xs: 4px;
  --ezra-ui-space-xs: 8px;
  --ezra-ui-space-sm: 12px;
  --ezra-ui-space-md: 16px;
  --ezra-ui-space-lg: 20px;
  --ezra-ui-space-xl: 24px;
  --ezra-ui-space-2xl: 32px;
  --ezra-ui-space-3xl: 40px;
  --ezra-ui-card-padding: var(--ezra-app-surface-theme-card-padding, clamp(14px, 1.35vw, 18px));
  --ezra-ui-card-padding-compact: var(--ezra-app-surface-theme-card-padding-compact, clamp(12px, 1.1vw, 14px));
  --ezra-ui-grid-gap: var(--ezra-app-surface-theme-grid-gap, clamp(14px, 1.9vw, 20px));
  --ezra-ui-stack-gap: var(--ezra-app-surface-theme-stack-gap, clamp(14px, 1.4vw, 16px));
  --ezra-ui-stack-gap-compact: var(--ezra-app-surface-theme-stack-gap-compact, 12px);
  --ezra-ui-stack-gap-loose: var(--ezra-app-surface-theme-stack-gap-loose, clamp(18px, 2vw, 24px));
  --ezra-ui-row-gap: var(--ezra-app-surface-theme-row-gap, 8px);
  --ezra-ui-row-gap-compact: var(--ezra-app-surface-theme-row-gap-compact, 6px);
  --ezra-ui-row-gap-loose: var(--ezra-app-surface-theme-row-gap-loose, 12px);
  --ezra-ui-field-row-gap: 14px;
  --ezra-ui-layer-workspace: var(--ezra-app-surface-theme-layer-workspace, 10);
  --ezra-ui-layer-workspace-filter: var(--ezra-app-surface-theme-layer-workspace-filter, 20);
  --ezra-ui-layer-workspace-mode: var(--ezra-app-surface-theme-layer-workspace-mode, 30);
  --ezra-ui-layer-workspace-menu: var(--ezra-app-surface-theme-layer-workspace-menu, 40);
  --ezra-ui-layer-workspace-dropdown: var(--ezra-app-surface-theme-layer-workspace-dropdown, 60);
  --ezra-ui-layer-control-popup: var(
    --ezra-app-surface-theme-layer-control-popup,
    var(--ezra-ui-layer-workspace-dropdown, 60)
  );
  --ezra-ui-layer-header: var(--ezra-app-surface-theme-layer-header, 80);
  --ezra-ui-layer-header-session: var(--ezra-app-surface-theme-layer-header-session, 100);
  --ezra-ui-layer-header-identity: var(--ezra-app-surface-theme-layer-header-identity, 110);
  --ezra-ui-layer-header-controls: var(--ezra-app-surface-theme-layer-header-controls, 120);
  --ezra-ui-layer-header-menu: var(--ezra-app-surface-theme-layer-header-menu, 130);
  --ezra-ui-layer-header-menu-open: var(--ezra-app-surface-theme-layer-header-menu-open, 140);
  --ezra-ui-metadata-border: var(--panel-border);
  --ezra-app-surface-header-menu-control-size: var(--ezra-app-surface-theme-header-menu-control-size, 28px);
  --ezra-app-surface-header-menu-inset: var(--ezra-app-surface-theme-header-menu-inset, 12px);
  --ezra-app-surface-header-control-row-min-height: var(
    --ezra-app-surface-theme-header-control-row-min-height,
    calc(var(--ezra-app-surface-header-menu-control-size) + var(--ezra-app-surface-header-menu-inset))
  );
  --ezra-app-surface-header-copy-gap: var(--ezra-app-surface-theme-header-copy-gap, clamp(10px, 1.4vw, 14px));
  --ezra-app-surface-header-eyebrow-font: var(--ezra-app-surface-theme-header-eyebrow-font, var(--header-font));
  --ezra-app-surface-header-eyebrow-size: var(--ezra-app-surface-theme-header-eyebrow-size, 1rem);
  --ezra-app-surface-header-eyebrow-line-height: var(--ezra-app-surface-theme-header-eyebrow-line-height, 1.05rem);
  --ezra-app-surface-header-eyebrow-letter-spacing: var(--ezra-app-surface-theme-header-eyebrow-letter-spacing, 0.1em);
  --ezra-app-surface-header-eyebrow-weight: var(--ezra-app-surface-theme-header-eyebrow-weight, 400);
  --ezra-app-surface-header-title-size: var(
    --ezra-app-surface-theme-header-title-size,
    clamp(2.3rem, 4.8vw, 3.5rem)
  );
  --ezra-app-surface-header-title-line-height: var(--ezra-app-surface-theme-header-title-line-height, 0.94);
  --ezra-app-surface-header-title-letter-spacing: var(--ezra-app-surface-theme-header-title-letter-spacing, 0.02em);
  --ezra-app-surface-mode-focus-title-color: var(
    --ezra-app-surface-theme-mode-focus-title-color,
    var(--h1-color, currentColor)
  );
  --ezra-app-surface-mode-focus-title-font: var(
    --ezra-app-surface-theme-mode-focus-title-font,
    var(--title-font, var(--header-font))
  );
  --ezra-app-surface-mode-focus-title-weight: var(--ezra-app-surface-theme-mode-focus-title-weight, 700);
  --ezra-app-surface-mode-focus-title-size: var(--ezra-app-surface-theme-mode-focus-title-size, 4.9rem);
  --ezra-app-surface-mode-focus-title-line-height: var(--ezra-app-surface-theme-mode-focus-title-line-height, 0.92);
  --ezra-app-surface-mode-focus-title-letter-spacing: var(--ezra-app-surface-theme-mode-focus-title-letter-spacing, 0.04em);
  --ezra-surface-motion-duration-fast: var(--ezra-app-surface-theme-motion-duration-fast, 160ms);
  --ezra-surface-motion-duration-standard: var(--ezra-app-surface-theme-motion-duration-standard, 220ms);
  --ezra-surface-motion-duration-surface: var(--ezra-app-surface-theme-motion-duration-surface, 180ms);
  --ezra-surface-motion-duration-deck: var(--ezra-app-surface-theme-motion-duration-deck, 240ms);
  --ezra-surface-motion-ease-standard: var(--ezra-app-surface-theme-motion-ease-standard, cubic-bezier(0.22, 1, 0.36, 1));
  --ezra-surface-motion-ease-fade: var(--ezra-app-surface-theme-motion-ease-fade, ease);
  --ezra-surface-motion-ease-friction: var(--ezra-app-surface-theme-motion-ease-friction, var(--ezra-surface-motion-ease-standard, cubic-bezier(0.22, 1, 0.36, 1)));
  --ezra-surface-motion-surface-shift: var(--ezra-app-surface-theme-motion-surface-shift, 4px);
  --ezra-surface-motion-deck-shift: var(--ezra-app-surface-theme-motion-deck-shift, 100%);
  --ezra-surface-motion-deck-shift-negative: var(--ezra-app-surface-theme-motion-deck-shift-negative, -100%);
  --ezra-surface-motion-chevron-turn: var(--ezra-app-surface-theme-motion-chevron-turn, 180deg);
  --ezra-ui-panel-editor-background: var(
    --ezra-app-surface-theme-editor-card-bg,
    color-mix(in srgb, var(--panel-color) 94%, var(--background-color) 6%)
  );
  --ezra-ui-panel-editor-border: var(--ezra-app-surface-theme-editor-card-border, var(--panel-border-strong));
  --ezra-ui-panel-editor-shadow: var(
    --ezra-app-surface-theme-editor-card-shadow,
    0 14px 32px color-mix(in srgb, var(--background-color) 28%, transparent)
  );
  --ezra-ui-panel-list-background: var(
    --ezra-app-surface-theme-collection-card-bg,
    color-mix(in srgb, var(--panel-color) 72%, var(--background-color) 28%)
  );
  --ezra-ui-panel-list-border: var(--ezra-app-surface-theme-collection-card-border, var(--panel-border));
  --ezra-ui-panel-list-shadow: var(
    --ezra-app-surface-theme-collection-card-shadow,
    inset 0 1px 0 color-mix(in srgb, var(--background-color) 12%, transparent)
  );
  --ezra-ui-panel-list-body-border: var(--ezra-app-surface-theme-collection-card-body-border, var(--panel-border));
  --ezra-ui-panel-list-item-background: var(
    --ezra-app-surface-theme-collection-button-bg,
    color-mix(in srgb, var(--panel-color) 56%, var(--background-color) 44%)
  );
  --ezra-ui-panel-list-item-hover-background: var(
    --ezra-app-surface-theme-collection-button-hover-bg,
    color-mix(in srgb, var(--surface-hover) 68%, var(--panel-color) 32%)
  );
  --ezra-ui-mobile-list-toggle-text: var(--ezra-app-surface-theme-mobile-collection-toggle-text, var(--text-color));
  --ezra-ui-mobile-list-toggle-meta: var(--ezra-app-surface-theme-mobile-collection-toggle-meta, var(--muted-color));
  --ezra-ui-mobile-list-toggle-border: var(--ezra-app-surface-theme-mobile-collection-toggle-border, var(--panel-border));
  --badge-color: var(--ezra-app-surface-theme-badge-color, var(--input-highlight-color));
  --badge-published-color: var(--ezra-app-surface-theme-badge-published-color, var(--text-color));
  --badge-published-border: var(--ezra-app-surface-theme-badge-published-border, var(--input-highlight-color));
  --badge-published-bg: var(
    --ezra-app-surface-theme-badge-published-bg,
    color-mix(in srgb, var(--text-color) 6%, transparent)
  );
  --badge-draft-color: var(--ezra-app-surface-theme-badge-draft-color, var(--yellow));
  --badge-draft-border: var(
    --ezra-app-surface-theme-badge-draft-border,
    color-mix(in srgb, var(--yellow) 44%, transparent)
  );
  --badge-draft-bg: var(
    --ezra-app-surface-theme-badge-draft-bg,
    color-mix(in srgb, var(--yellow) 12%, transparent)
  );
  --badge-ready-color: var(--ezra-app-surface-theme-badge-ready-color, var(--badge-published-color));
  --badge-ready-border: var(
    --ezra-app-surface-theme-badge-ready-border,
    color-mix(in srgb, var(--text-color) 44%, transparent)
  );
  --badge-ready-bg: var(--ezra-app-surface-theme-badge-ready-bg, var(--badge-published-bg));
  --badge-delete-color: var(--label-color);
  --badge-delete-border: color-mix(in srgb, var(--label-color) 44%, transparent);
  --badge-delete-bg: color-mix(in srgb, var(--label-color) 10%, transparent);
  --badge-featured-color: var(--ezra-app-surface-theme-badge-featured-color, var(--label-color));
  --badge-featured-border: var(
    --ezra-app-surface-theme-badge-featured-border,
    color-mix(in srgb, var(--label-color) 44%, transparent)
  );
  --badge-featured-bg: var(--ezra-app-surface-theme-badge-featured-bg, transparent);
  --chip-color: var(--ezra-app-surface-theme-chip-color, var(--text-color));
  --chip-bg: var(
    --ezra-app-surface-theme-chip-bg,
    color-mix(in srgb, var(--button-background-color) 10%, var(--panel-color))
  );
  --chip-border: var(--ezra-app-surface-theme-chip-border, var(--panel-border-strong));
  --ezra-app-surface-primary-button-background: var(--ezra-app-surface-theme-primary-button-background, var(--button-background-color));
  --ezra-app-surface-primary-button-text: var(--ezra-app-surface-theme-primary-button-text, var(--button-text-color));
  --ezra-app-surface-primary-button-border: var(
    --ezra-app-surface-theme-primary-button-border,
    color-mix(in srgb, var(--button-background-color) 72%, transparent)
  );
  --ezra-app-surface-primary-button-hover-background: var(
    --ezra-app-surface-theme-primary-button-hover-background,
    color-mix(in srgb, var(--button-background-color) 84%, var(--background-color) 16%)
  );
  --ezra-app-surface-primary-button-hover-text: var(--ezra-app-surface-theme-primary-button-hover-text, var(--button-text-color));
  --ezra-app-surface-primary-button-hover-border: var(--ezra-app-surface-theme-primary-button-hover-border, var(--button-background-color));
  --ezra-app-surface-secondary-button-background: var(
    --ezra-app-surface-theme-secondary-button-background,
    color-mix(in srgb, var(--button-background-color) 12%, var(--background-color))
  );
  --ezra-app-surface-secondary-button-text: var(--ezra-app-surface-theme-secondary-button-text, var(--text-color));
  --ezra-app-surface-secondary-button-border: var(
    --ezra-app-surface-theme-secondary-button-border,
    color-mix(in srgb, var(--button-background-color) 42%, var(--border-color))
  );
  --ezra-app-surface-secondary-button-hover-background: var(
    --ezra-app-surface-theme-secondary-button-hover-background,
    color-mix(in srgb, var(--button-background-color) 18%, var(--background-color))
  );
  --ezra-app-surface-secondary-button-hover-text: var(--ezra-app-surface-theme-secondary-button-hover-text, var(--text-color));
  --ezra-app-surface-secondary-button-hover-border: var(
    --ezra-app-surface-theme-secondary-button-hover-border,
    color-mix(in srgb, var(--button-background-color) 62%, var(--border-color))
  );
  --ezra-app-surface-ghost-button-text: var(
    --ezra-app-surface-theme-ghost-button-text,
    color-mix(in srgb, var(--text-color) 82%, var(--muted-color) 18%)
  );
  --ezra-app-surface-ghost-button-border: var(
    --ezra-app-surface-theme-ghost-button-border,
    color-mix(in srgb, var(--panel-border) 82%, transparent)
  );
  --ezra-app-surface-ghost-button-hover-background: var(
    --ezra-app-surface-theme-ghost-button-hover-background,
    color-mix(in srgb, var(--text-color) 6%, transparent)
  );
  --ezra-app-surface-ghost-button-hover-text: var(--ezra-app-surface-theme-ghost-button-hover-text, var(--text-color));
  --ezra-app-surface-danger-button-background: var(
    --ezra-app-surface-theme-danger-button-background,
    transparent
  );
  --ezra-app-surface-danger-button-text: var(--ezra-app-surface-theme-danger-button-text, var(--red));
  --ezra-app-surface-danger-button-border: var(
    --ezra-app-surface-theme-danger-button-border,
    color-mix(in srgb, var(--red) 58%, transparent)
  );
  --ezra-app-surface-danger-button-hover-background: var(
    --ezra-app-surface-theme-danger-button-hover-background,
    transparent
  );
  --ezra-app-surface-danger-button-hover-text: var(--ezra-app-surface-theme-danger-button-hover-text, var(--red));
  --ezra-app-surface-danger-button-hover-border: var(
    --ezra-app-surface-theme-danger-button-hover-border,
    color-mix(in srgb, var(--red) 78%, transparent)
  );
  --ezra-app-surface-important-button-accent: var(
    --ezra-app-surface-theme-important-button-accent,
    var(
      --ezra-ui-theme-important-action-accent,
      var(--ezra-ui-theme-accent-strong, var(--button-background-color))
    )
  );
  --ezra-app-surface-important-button-background: var(
    --ezra-app-surface-theme-important-button-background,
    var(
      --ezra-ui-theme-important-action-background,
      color-mix(in srgb, var(--ezra-app-surface-important-button-accent) 16%, var(--background-color))
    )
  );
  --ezra-app-surface-important-button-text: var(
    --ezra-app-surface-theme-important-button-text,
    var(
      --ezra-ui-theme-important-action-text,
      var(--h1-color, var(--text-color))
    )
  );
  --ezra-app-surface-important-button-border: var(
    --ezra-app-surface-theme-important-button-border,
    var(
      --ezra-ui-theme-important-action-border,
      color-mix(in srgb, var(--ezra-app-surface-important-button-accent) 68%, var(--border-color))
    )
  );
  --ezra-app-surface-important-button-hover-background: var(
    --ezra-app-surface-theme-important-button-hover-background,
    var(
      --ezra-ui-theme-important-action-hover-background,
      color-mix(in srgb, var(--ezra-app-surface-important-button-accent) 24%, var(--background-color))
    )
  );
  --ezra-app-surface-important-button-hover-text: var(
    --ezra-app-surface-theme-important-button-hover-text,
    var(
      --ezra-ui-theme-important-action-hover-text,
      var(--h1-color, var(--text-color))
    )
  );
  --ezra-app-surface-important-button-hover-border: var(
    --ezra-app-surface-theme-important-button-hover-border,
    var(
      --ezra-ui-theme-important-action-hover-border,
      var(--ezra-app-surface-important-button-accent)
    )
  );
  --ezra-app-surface-secondary-important-button-background: var(
    --ezra-app-surface-theme-secondary-important-button-background,
    transparent
  );
  --ezra-app-surface-secondary-important-button-text: var(
    --ezra-app-surface-theme-secondary-important-button-text,
    var(--h1-color, var(--text-color))
  );
  --ezra-app-surface-secondary-important-button-border: var(
    --ezra-app-surface-theme-secondary-important-button-border,
    color-mix(in srgb, var(--ezra-app-surface-important-button-accent) 68%, var(--border-color))
  );
  --ezra-app-surface-secondary-important-button-hover-background: var(
    --ezra-app-surface-theme-secondary-important-button-hover-background,
    transparent
  );
  --ezra-app-surface-secondary-important-button-hover-text: var(
    --ezra-app-surface-theme-secondary-important-button-hover-text,
    var(--ezra-app-surface-secondary-important-button-text)
  );
  --ezra-app-surface-secondary-important-button-hover-border: var(
    --ezra-app-surface-theme-secondary-important-button-hover-border,
    color-mix(in srgb, var(--ezra-app-surface-important-button-accent) 88%, var(--border-color))
  );
  --message-error-border: var(
    --ezra-app-surface-theme-message-error-border,
    color-mix(in srgb, var(--label-color) 70%, transparent)
  );
  --message-error-bg: var(
    --ezra-app-surface-theme-message-error-bg,
    color-mix(in srgb, var(--label-color) 10%, var(--surface-quiet))
  );
  --message-success-border: var(
    --ezra-app-surface-theme-message-success-border,
    color-mix(in srgb, var(--yellow) 55%, transparent)
  );
  --message-success-bg: var(
    --ezra-app-surface-theme-message-success-bg,
    color-mix(in srgb, var(--yellow) 10%, var(--surface-quiet))
  );
  --ezra-ui-repeater-background: var(--ezra-app-surface-theme-repeater-bg, var(--surface-quiet));
  --ezra-ui-repeater-border: var(--ezra-app-surface-theme-repeater-border, var(--panel-border));
  --ezra-ui-repeater-item-background: var(--ezra-app-surface-theme-repeater-item-bg, var(--surface-quiet));
  --ezra-ui-repeater-item-border: var(--ezra-app-surface-theme-repeater-item-border, var(--panel-border));
  --ezra-ui-repeater-item-border-strong: var(--ezra-app-surface-theme-repeater-item-border-strong, var(--panel-border-strong));
  --ezra-ui-repeater-title-color: var(--ezra-app-surface-theme-repeater-title-color, var(--h1-color));
  --ezra-ui-repeater-meta-color: var(--ezra-app-surface-theme-repeater-meta-color, var(--muted-color));
  color: var(--text-color);
  width: 100%;
  min-width: 0;
  min-height: 100vh;
  min-height: 100dvh;
  padding:
    var(--ezra-surface-frame-inset-block-start)
    var(--ezra-surface-frame-inset-inline-end)
    var(--ezra-surface-frame-inset-block-end)
    var(--ezra-surface-frame-inset-inline-start);
  box-sizing: border-box;
  background: var(--ezra-surface-background, var(--background-color, Canvas));
}

.ezra-cms-application-chrome-shell {
  --ezra-app-surface-section-gap: var(
    --ezra-app-surface-theme-section-gap,
    var(--ezra-surface-frame-region-gap)
  );
  width: var(--ezra-surface-frame-content-inline-size);
  min-width: 0;
  max-width: var(--ezra-app-surface-shell-max-width, var(--ezra-surface-frame-content-max-measure));
  margin: var(--ezra-app-surface-shell-margin, 0);
  display: grid;
  grid-template-rows: auto auto;
  align-content: start;
  gap: var(--ezra-app-surface-section-gap);
}

.ezra-cms-page-surface,
.cms-page {
  width: var(--ezra-surface-frame-content-inline-size);
  max-width: var(--ezra-surface-frame-content-max-measure);
  margin: 0;
}

@media (max-width: 860px) {
  .ezra-cms-application-chrome {
    min-height: 100vh;
    min-height: 100dvh;
    padding:
      var(--ezra-surface-frame-inset-block-start)
      var(--ezra-surface-frame-inset-inline-end)
      var(--ezra-surface-frame-inset-block-end)
      var(--ezra-surface-frame-inset-inline-start);
  }
}

@media (prefers-reduced-motion: reduce) {
  .ezra-cms-application-chrome {
    --ezra-surface-motion-duration-fast: 1ms;
    --ezra-surface-motion-duration-standard: 1ms;
    --ezra-surface-motion-duration-surface: 1ms;
    --ezra-surface-motion-duration-deck: 1ms;
    --ezra-surface-motion-surface-shift: 0px;
    --ezra-surface-motion-deck-shift: 0%;
    --ezra-surface-motion-deck-shift-negative: 0%;
  }
}

.ezra-cms-application-chrome {
  --ezra-cms-application-measure: var(--ezra-app-surface-theme-application-measure, 1480px);
  --ezra-app-surface-shell-max-width: var(--ezra-cms-application-measure);
  --ezra-app-surface-shell-margin: 0 auto;
  --ezra-cms-section-gap: var(--ezra-app-surface-theme-section-gap, 12px);
  --ezra-cms-chrome-block-start: var(--ezra-app-surface-theme-chrome-block-start, clamp(20px, 3vw, 40px));
  --ezra-cms-layer-workspace: 10;
  --ezra-cms-layer-workspace-mode: 30;
  --ezra-cms-layer-workspace-filter: 20;
  --ezra-cms-layer-workspace-menu: 40;
  --ezra-cms-layer-workspace-dropdown: 60;
  --ezra-cms-layer-header: 80;
  --ezra-cms-layer-header-session: 100;
  --ezra-cms-layer-header-identity: 110;
  --ezra-cms-layer-header-controls: 120;
  --ezra-cms-layer-header-menu: 130;
  --ezra-cms-layer-header-menu-open: 140;
  --ezra-ui-layer-workspace: var(--ezra-cms-layer-workspace);
  --ezra-ui-layer-workspace-mode: var(--ezra-cms-layer-workspace-mode);
  --ezra-ui-layer-workspace-filter: var(--ezra-cms-layer-workspace-filter);
  --ezra-ui-layer-workspace-menu: var(--ezra-cms-layer-workspace-menu);
  --ezra-ui-layer-workspace-dropdown: var(--ezra-cms-layer-workspace-dropdown);
  --ezra-ui-layer-control-popup: var(--ezra-cms-layer-workspace-dropdown);
  --ezra-ui-layer-header: var(--ezra-cms-layer-header);
  --ezra-ui-layer-header-session: var(--ezra-cms-layer-header-session);
  --ezra-ui-layer-header-identity: var(--ezra-cms-layer-header-identity);
  --ezra-ui-layer-header-controls: var(--ezra-cms-layer-header-controls);
  --ezra-ui-layer-header-menu: var(--ezra-cms-layer-header-menu);
  --ezra-ui-layer-header-menu-open: var(--ezra-cms-layer-header-menu-open);
  --ezra-ui-app-header-menu-control-size: var(--ezra-app-surface-theme-header-menu-control-size, 28px);
  --ezra-ui-app-header-menu-window-width: var(
    --ezra-app-surface-theme-header-menu-window-width,
    min(264px, calc(100vw - 24px))
  );
  --ezra-ui-app-header-menu-inset: var(--ezra-app-surface-theme-header-menu-inset, 12px);
  --ezra-ui-app-header-measure: var(--ezra-app-surface-theme-header-measure, min(520px, 58vw));
  --ezra-ui-app-header-label-color: var(--label-color);
  --ezra-ui-app-header-gap: var(--ezra-app-surface-theme-header-band-gap, clamp(10px, 1.4vw, 14px));
  --ezra-ui-app-header-title-size: var(--ezra-app-surface-theme-title-font-size, clamp(2.3rem, 4.8vw, 3.5rem));
  --ezra-ui-app-header-title-line: var(--ezra-app-surface-theme-title-line-height, 0.94);
  --ezra-ui-app-header-title-row-height: var(
    --ezra-app-surface-theme-header-title-row-min-height,
    calc(var(--ezra-ui-app-header-title-size) * var(--ezra-ui-app-header-title-line))
  );
  --ezra-ui-app-header-badge-gap: var(
    --ezra-app-surface-theme-header-title-badge-gap,
    clamp(8px, calc(var(--ezra-ui-app-header-title-size) * 0.26), 12px)
  );
  --ezra-ui-app-header-mode-badge-height: var(
    --ezra-app-surface-theme-header-badge-height,
    clamp(1.7rem, calc(var(--ezra-ui-app-header-title-size) * 0.685), 2.4rem)
  );
  --ezra-ui-app-header-mode-badge-padding-inline: var(
    --ezra-app-surface-theme-header-badge-padding-inline,
    clamp(7px, calc(var(--ezra-ui-app-header-title-size) * 0.215), 12px)
  );
  --ezra-ui-app-header-mode-badge-font-size: var(
    --ezra-app-surface-theme-header-badge-font-size,
    clamp(0.68rem, calc(var(--ezra-ui-app-header-title-size) * 0.235), 0.82rem)
  );
  --ezra-ui-app-header-session-gap: var(
    --ezra-app-surface-theme-header-title-to-session-gap,
    clamp(16px, 2.2vw, 24px)
  );
  --ezra-ui-app-header-home-link-color: var(--ezra-app-surface-theme-home-link-color, var(--h1-color));
  --ezra-ui-app-header-menu-panel-background: var(
    --ezra-app-surface-theme-header-menu-panel-background,
    color-mix(in srgb, var(--panel-color) 88%, var(--background-color) 12%)
  );
  --ezra-ui-app-header-menu-panel-backdrop: var(--ezra-app-surface-theme-header-menu-panel-backdrop, blur(10px));
  --ezra-ui-app-header-menu-panel-block-start: var(
    --ezra-app-surface-theme-header-menu-panel-block-start,
    var(--ezra-ui-app-header-menu-inset)
  );
  --ezra-ui-app-header-menu-panel-max-height: var(
    --ezra-app-surface-theme-header-menu-panel-max-height,
    calc(100svh - 24px)
  );
  --ezra-ui-app-header-theme-menu-reserved-height: var(
    --ezra-app-surface-theme-header-menu-list-reserved-height,
    148px
  );
  --ezra-ui-app-header-theme-menu-max-height: var(
    --ezra-app-surface-theme-header-menu-list-max-height,
    calc(
      var(--ezra-ui-app-header-menu-panel-max-height, calc(100svh - 24px))
      - var(--ezra-ui-app-header-theme-menu-reserved-height)
    )
  );
  --ezra-ui-app-header-session-control-gap: var(--ezra-cms-switcher-desktop-gap, 10px);
  --ezra-ui-app-header-session-control-columns: var(--ezra-cms-switcher-desktop-columns, 4);
  isolation: isolate;
  padding-block-start: var(--ezra-cms-chrome-block-start);
}

.ezra-cms-home-panel-clock {
  display: inline-grid;
  grid-template-columns: minmax(0, auto) auto;
  gap: 0.28em;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
  color: var(--ezra-cms-home-panel-clock-primary-color, var(--ezra-ui-widget-title-color, var(--h1-color)));
  font-family: var(--header-font);
  font-size: var(--ezra-cms-home-panel-clock-size, clamp(1.05rem, 1.6vw, 1.42rem));
  font-weight: var(--ezra-cms-home-panel-clock-weight, 800);
  font-variant-numeric: tabular-nums;
  line-height: 1;
  letter-spacing: 0;
  text-align: end;
  white-space: nowrap;
}

.ezra-cms-home-panel-clock-digits {
  display: inline-flex;
  align-items: baseline;
  min-width: 0;
}

.ezra-cms-home-panel-clock-primary {
  color: var(--ezra-cms-home-panel-clock-primary-color, var(--ezra-ui-widget-title-color, var(--h1-color)));
}

.ezra-cms-home-panel-clock-secondary {
  color: var(--ezra-cms-home-panel-clock-secondary-color, var(--ezra-app-surface-theme-muted-color, var(--muted-color)));
}

.ezra-cms-home-panel-clock-period {
  --ezra-cms-home-panel-clock-period-height: 0.7em;
  --ezra-cms-home-panel-clock-period-slot-gap: 0.06em;
  --ezra-cms-home-panel-clock-period-slot-size: calc(
    (var(--ezra-cms-home-panel-clock-period-height) - var(--ezra-cms-home-panel-clock-period-slot-gap)) / 2
  );
  display: grid;
  grid-template-rows: repeat(2, minmax(0, var(--ezra-cms-home-panel-clock-period-slot-size)));
  gap: var(--ezra-cms-home-panel-clock-period-slot-gap);
  align-self: center;
  align-items: center;
  justify-items: center;
  width: var(--ezra-cms-home-panel-clock-period-slot-size);
  min-width: var(--ezra-cms-home-panel-clock-period-slot-size);
  height: var(--ezra-cms-home-panel-clock-period-height);
  overflow: hidden;
}

.ezra-cms-home-panel-clock-period-slot {
  display: grid;
  place-items: center;
  width: var(--ezra-cms-home-panel-clock-period-slot-size);
  height: var(--ezra-cms-home-panel-clock-period-slot-size);
  line-height: 0;
}

.ezra-cms-home-panel-clock-period-dot {
  --ezra-ui-dot-size: min(
    var(--ezra-cms-home-panel-clock-period-dot-size, 0.22em),
    var(--ezra-cms-home-panel-clock-period-slot-size)
  );
  --ezra-ui-dot-border-width: var(--ezra-cms-home-panel-clock-period-dot-border-width, max(1px, 0.045em));
  box-shadow: 0 0 0 1px var(
    --ezra-cms-home-panel-clock-period-dot-border,
    var(--ezra-app-surface-theme-panel-border-strong, var(--panel-border-strong, var(--border-color, currentColor)))
  );
}

.ezra-cms-app-boot {
  display: contents;
}

.ezra-cms-application-chrome-top,
.ezra-cms-application-chrome-body {
  position: relative;
  min-width: 0;
}

.ezra-cms-application-chrome-top {
  align-self: start;
  z-index: var(--ezra-cms-layer-header);
}

.ezra-cms-application-chrome-body {
  z-index: var(--ezra-cms-layer-workspace);
  min-height: 0;
}

.ezra-cms-application-chrome-top + .ezra-cms-application-chrome-body {
  margin-top: var(--ezra-cms-section-gap);
}

.ezra-cms-application-chrome-shell[hidden],
.ezra-cms-authenticated-gate-shell[hidden] {
  display: none !important;
}

.ezra-cms-authenticated-gate-shell {
  width: min(100%, var(--ezra-cms-application-measure, 1480px));
  margin: var(--ezra-app-surface-shell-margin, 0 auto);
  box-sizing: border-box;
}

.ezra-cms-authenticated-gate-body {
  display: grid;
  align-content: start;
  gap: var(--ezra-cms-authenticated-gate-gap, var(--ezra-ui-grid-gap, 14px));
}

.ezra-cms-authenticated-gate-actions {
  display: grid;
  gap: var(--ezra-cms-authenticated-gate-action-gap, var(--ezra-ui-row-gap-loose, 12px));
  width: min(100%, var(--ezra-cms-authenticated-gate-actions-measure, 32rem));
  min-width: 0;
}

.ezra-cms-authenticated-gate-action {
  justify-self: start;
  width: auto;
  min-width: min(100%, 18rem);
  max-width: min(100%, 22rem);
}

.ezra-cms-authenticated-gate-status {
  display: grid;
  gap: var(--ezra-ui-row-gap-compact, 6px);
  min-width: 0;
}

.ezra-cms-authenticated-gate-status-detail {
  color: var(--muted-color);
  font-family: var(--body-font);
  font-size: 0.95rem;
  line-height: 1.35;
  text-transform: none;
}

.cms-editor-utility-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ezra-ui-row-gap, 10px);
  min-width: 0;
  padding: 6px 8px;
}

.cms-collection-utilities-toggle {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  color: var(--muted-color);
  cursor: pointer;
  pointer-events: auto;
}

.cms-collection-utilities-toggle > :first-child,
.cms-collection-utilities-toggle .ezra-ui-mobile-navigation-toggle-meta {
  color: var(--muted-color);
}

.cms-collection-utilities-panel {
  display: grid;
  gap: 0;
  min-width: 0;
  padding: 0;
  border: 1px solid var(--panel-border);
  border-top: 0;
  background: var(--panel-color);
}

.cms-collection-utilities-panel[hidden] {
  display: none;
}

.cms-collection-utilities-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-width: 0;
  padding: 10px 12px;
}

.cms-collection-utilities-item + .cms-collection-utilities-item {
  border-top: 1px solid color-mix(in srgb, var(--panel-border) 66%, transparent);
}

.cms-collection-utilities-link {
  min-width: 0;
  overflow: hidden;
  color: var(--text-color);
  font-family: var(--header-font);
  font-size: 0.86rem;
  font-weight: 700;
  line-height: 1.1;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.cms-collection-utilities-detail {
  min-width: 0;
  max-width: 9rem;
  overflow: hidden;
  color: var(--muted-color);
  font-family: var(--header-font);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1;
  justify-self: end;
  text-align: right;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.cms-utility-control-panel {
  display: grid;
  gap: var(--ezra-ui-stack-gap-compact);
  min-width: 0;
}

.cms-utility-control-nav {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.cms-utility-control-surface {
  min-width: 0;
}

.cms-utility-control-body {
  display: grid;
  gap: var(--ezra-ui-stack-gap);
  --badge-published-color: var(--background-color);
  --badge-published-border: var(--message-success-border, var(--button-background-color));
  --badge-published-bg: var(--message-success-border, var(--button-background-color));
  --badge-delete-color: var(--text-color);
  --badge-delete-border: var(--danger-color, var(--label-color));
  --badge-delete-bg: var(--danger-color, var(--label-color));
}

.cms-utility-metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--ezra-ui-row-gap);
}

.cms-utility-metric {
  display: grid;
  gap: var(--ezra-ui-row-gap-compact);
  align-content: center;
  min-width: 0;
  padding: var(--ezra-ui-row-gap) var(--ezra-ui-stack-gap-compact);
}

.cms-utility-metric span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted-text-color, var(--text-muted));
  font-size: 0.78rem;
  text-transform: uppercase;
}

.cms-utility-metric strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 1rem;
}

.cms-utility-section {
  display: grid;
  gap: var(--ezra-ui-row-gap);
  min-width: 0;
}

.cms-utility-section-header {
  display: block;
  min-width: 0;
}

.cms-utility-section-header h3 {
  margin: 0;
  font-size: 1rem;
  line-height: 1.1;
  text-transform: uppercase;
}

.cms-bot-console,
.cms-bot-config-panel,
.cms-bot-feed-panel,
.cms-bot-account-panel,
.cms-bot-auth-panel,
.cms-feed-mirror-feed-panel,
.cms-feed-mirror-profile-card,
.cms-feed-mirror-notice {
  min-width: 0;
}

.cms-bot-console,
.cms-bot-console-copy,
.cms-utility-main-column,
.cms-utility-side-column,
.cms-feed-mirror-primary,
.cms-feed-mirror-secondary,
.cms-feed-mirror-profile-copy,
.cms-feed-mirror-result,
.cms-feed-mirror-feed-picker-inner {
  display: grid;
  gap: var(--ezra-ui-row-gap);
  min-width: 0;
}

.cms-utility-main-grid,
.cms-feed-mirror-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.42fr);
  gap: var(--ezra-ui-stack-gap);
  align-items: start;
  min-width: 0;
}

.cms-utility-section-grid,
.cms-utility-form-grid,
.cms-feed-mirror-settings-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--ezra-ui-row-gap);
  min-width: 0;
}

.cms-feed-mirror-settings-source-column,
.cms-feed-mirror-settings-toggles,
.cms-feed-mirror-settings-label-grid {
  display: grid;
  gap: var(--ezra-ui-row-gap);
  align-content: start;
  min-width: 0;
}

.cms-feed-mirror-settings-label-grid {
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cms-utility-actions,
.cms-feed-mirror-actions,
.cms-feed-mirror-collection-add-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ezra-ui-row-gap-compact);
  align-items: center;
  min-width: 0;
}

.cms-bot-message,
.cms-bot-notice,
.cms-bot-empty,
.cms-feed-mirror-notice,
.cms-feed-mirror-error {
  margin: 0;
  min-width: 0;
}

.cms-bot-notice,
.cms-feed-mirror-notice {
  padding: var(--ezra-ui-row-gap);
}

.cms-bot-notice.is-error,
.cms-feed-mirror-error {
  color: var(--message-error-text, var(--text-color));
}

.cms-bot-error {
  color: var(--message-error-text, var(--danger-color, var(--label-color)));
  overflow-wrap: anywhere;
}

.cms-bot-table,
.cms-feed-mirror-table {
  min-width: 0;
}

.cms-bot-table {
  --ezra-ui-data-table-mobile-columns: minmax(0, 1fr) auto;
}

.cms-bot-table .ezra-ui-data-table-row {
  gap: var(--ezra-ui-row-gap-compact) var(--ezra-ui-row-gap);
}

.cms-bot-table .ezra-ui-status-marker {
  --ezra-ui-status-marker-label-display-mobile: inline;
}

.cms-bot-table .cms-bot-queue-item-cell {
  display: grid;
  gap: 0.25rem;
  overflow: visible;
  white-space: normal;
}

.cms-bot-queue-title,
.cms-bot-queue-date {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cms-bot-queue-date {
  color: var(--muted-color);
  font-size: 0.86rem;
}

.cms-bot-table-title-cell,
.cms-feed-mirror-title-cell {
  min-width: 0;
  width: 100%;
}

.cms-bot-table-status-cell,
.cms-bot-table-meta-cell {
  width: auto;
  white-space: nowrap;
}

.cms-bot-table-disclosure-cell,
.cms-feed-mirror-disclosure-cell {
  width: 1%;
  white-space: nowrap;
}

.cms-bot-table-summary-row {
  color: var(--muted-color);
}

.cms-feed-mirror-feed-picker {
  min-width: 0;
}

.cms-feed-mirror-feed-picker-drawer {
  min-width: min(100%, 22rem);
}

.cms-feed-mirror-feed-picker-option,
.cms-feed-mirror-feed-picker-trigger {
  width: 100%;
  min-width: 0;
}

.cms-feed-mirror-feed-picker-option-label,
.cms-feed-mirror-feed-picker-trigger-label,
.cms-feed-mirror-title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cms-feed-mirror-profile-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--ezra-ui-row-gap);
  align-items: center;
}

.cms-feed-mirror-profile-avatar {
  inline-size: 3rem;
  block-size: 3rem;
  border-radius: 50%;
  object-fit: cover;
  background: var(--surface-quiet);
}

.cms-feed-mirror-profile-avatar.is-empty {
  display: block;
  border: 1px solid var(--panel-border);
}

.cms-feed-mirror-policy-row,
.ezra-mirrored-posts-helper-status,
.ezra-mirrored-posts-helper-controls {
  display: grid;
  gap: var(--ezra-ui-row-gap-compact);
  min-width: 0;
}

.ezra-mirrored-posts-helper-controls {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ezra-mirrored-posts-helper-controls .ezra-ui-toggle-switch-row {
  grid-column: 1 / -1;
}

.cms-feed-mirror-enabled-field,
.cms-feed-mirror-reposts-field {
  min-width: 0;
}

@media (max-width: 860px) {
  .cms-utility-metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cms-utility-main-grid,
  .cms-feed-mirror-layout,
  .cms-utility-section-grid,
  .cms-utility-form-grid,
  .cms-feed-mirror-settings-grid,
  .cms-feed-mirror-settings-label-grid,
  .ezra-mirrored-posts-helper-controls {
    grid-template-columns: minmax(0, 1fr);
  }

  .cms-feed-mirror-profile-card {
    grid-template-columns: minmax(0, 1fr);
  }
}

.ezra-cms-live-link,
.ezra-cms-save-state-indicator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 10px 16px;
  font-family: var(--header-font);
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
  box-sizing: border-box;
}

.ezra-cms-save-state-indicator {
  display: inline-grid;
  align-items: center;
  justify-content: center;
  text-align: center;
  border: 1px solid var(--panel-border);
  background: var(--panel-color);
  color: var(--muted-color);
  cursor: default;
  pointer-events: none;
  transition:
    transform var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard),
    box-shadow var(--ezra-surface-motion-duration-surface) var(--ezra-surface-motion-ease-standard);
  transform-origin: center;
}

.ezra-cms-save-state-measure,
.ezra-cms-save-state-label {
  grid-area: 1 / 1;
}

.ezra-cms-save-state-measure {
  visibility: hidden;
  white-space: nowrap;
}

.ezra-cms-save-state--saved {
  color: var(--muted-color);
  border-color: color-mix(in srgb, var(--panel-border) 70%, transparent);
  background: color-mix(in srgb, var(--panel-color) 80%, transparent);
}

.ezra-cms-save-state-indicator.is-saved,
.ezra-cms-save-state-indicator[data-state="saved"],
.ezra-cms-save-state-indicator[data-save-state="saved"] {
  animation: ezra-cms-save-pulse var(--ezra-surface-motion-duration-deck) var(--ezra-surface-motion-ease-friction);
}

@keyframes ezra-cms-save-pulse {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 0 color-mix(in srgb, var(--input-highlight-color) 0%, transparent);
  }

  35% {
    transform: scale(1.02);
    box-shadow: 0 0 0 6px color-mix(in srgb, var(--input-highlight-color) 20%, transparent);
  }

  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 color-mix(in srgb, var(--input-highlight-color) 0%, transparent);
  }
}

.ezra-cms-save-state--dirty {
  color: var(--h1-color, var(--text-color));
  border-color: color-mix(in srgb, var(--h1-color, var(--text-color)) 55%, transparent);
  background: color-mix(in srgb, var(--h1-color, var(--text-color)) 4%, transparent);
}

.ezra-cms-save-state--draft,
.ezra-cms-save-state--new-draft {
  color: var(--h1-color, var(--text-color));
  border-color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-border));
  background: color-mix(in srgb, var(--ezra-app-surface-important-button-accent, var(--badge-draft-border)) 10%, transparent);
}

.ezra-cms-save-state--edited-draft,
.ezra-cms-save-state--updated-draft {
  color: var(--h1-color, var(--text-color));
  border-color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-border));
  background: color-mix(in srgb, var(--ezra-app-surface-important-button-accent, var(--badge-draft-border)) 10%, transparent);
}

.ezra-cms-save-state--new {
  color: var(--ezra-app-surface-important-button-text, var(--h1-color, var(--text-color)));
  border-color: var(--ezra-app-surface-important-button-border, var(--ezra-app-surface-important-button-accent, var(--badge-draft-border)));
  background: var(--ezra-app-surface-important-button-background, color-mix(in srgb, var(--ezra-app-surface-important-button-accent, var(--badge-draft-border)) 16%, transparent));
}

.ezra-cms-save-state--edited,
.ezra-cms-save-state--updated,
.ezra-cms-save-state--ready {
  color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-color));
  border-color: var(--ezra-app-surface-important-button-accent, var(--badge-draft-border));
  background: color-mix(in srgb, var(--ezra-app-surface-important-button-accent, var(--badge-draft-border)) 10%, transparent);
}

.ezra-cms-save-state--delete {
  color: var(--badge-delete-color);
  border-color: var(--badge-delete-border);
  background: var(--badge-delete-bg);
}

.ezra-cms-save-state--saving {
  color: var(--text-color);
  border-color: color-mix(in srgb, var(--text-color) 22%, transparent);
}

.ezra-cms-live-link {
  white-space: nowrap;
}

.ezra-cms-live-link--ready,
.ezra-cms-live-link--delete {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.45rem 0.85rem;
  border-radius: var(--ezra-cms-live-link-radius, var(--ezra-ui-badge-radius, 0));
  line-height: 1;
  cursor: default;
  pointer-events: none;
}

.ezra-cms-live-link--ready {
  border: 1px solid var(--badge-ready-border);
  background: var(--badge-ready-bg);
  color: var(--badge-ready-color);
}

.ezra-cms-live-link--delete {
  border: 1px solid color-mix(in srgb, var(--label-color) 44%, transparent);
  background: color-mix(in srgb, var(--label-color) 10%, transparent);
  color: var(--label-color);
}


[data-ezra-ui-theme-role] {
  scroll-margin: var(--ezra-ui-theme-editor-scroll-margin, 16px);
}

[data-ezra-ui-theme-role].is-ezra-ui-theme-editor-selected {
  outline: 2px solid var(
    --ezra-ui-theme-editor-selection-ring,
    var(--ezra-ui-control-surface-focus-ring, var(--focus-ring-color, currentColor))
  );
  outline-offset: 3px;
}


.ezra-cms-body-image-selection-menu {
  min-width: min(22rem, calc(100vw - 32px));
}

.ezra-cms-body-image-selection-list {
  max-height: 18rem;
  padding-right: 4px;
}

.ezra-cms-body-image-selection-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas:
    "check preview"
    ". name";
  column-gap: 10px;
  row-gap: 8px;
  align-items: start;
  min-width: 0;
  padding: 10px 6px 12px;
}

.ezra-cms-body-image-selection-row + .ezra-cms-body-image-selection-row {
  border-block-start: 1px solid var(--panel-border);
}

.ezra-cms-body-image-selection-row > .ezra-ui-checkbox {
  grid-area: check;
  margin-block-start: 2px;
}

.ezra-cms-body-image-selection-row > .ezra-ui-image-library-preview {
  grid-area: preview;
}

.ezra-cms-body-image-selection-name {
  grid-area: name;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ezra-cms-body-image-selection-action {
  width: 100%;
}

.ezra-cms-body-image-selection-empty {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 8px;
}

.ezra-cms-body-image-selection-empty p {
  margin: 0;
}

.ezra-ui-workspace,
.ezra-ui-workspace-body {
  min-width: 0;
}

.ezra-cms-application-chrome .ezra-ui-workspace {
  display: grid;
  grid-template-rows: auto minmax(0, auto);
  gap: var(--ezra-cms-section-gap);
}

.ezra-ui-workspace-top {
  display: grid;
  gap: var(--ezra-cms-section-gap);
}

.ezra-cms-application-chrome .ezra-ui-split-layout {

  --ezra-ui-split-layout-gap: var(--ezra-ui-grid-gap);
}

.ezra-cms-scroll-surface {

  overflow: auto;
  min-width: 0;
  max-width: 100%;
  -webkit-overflow-scrolling: touch;
}

.ezra-cms-theme-field {

  min-width: 0;
}

.ezra-cms-stack {

  display: grid;
  gap: var(--ezra-cms-stack-gap, var(--ezra-ui-stack-gap, clamp(14px, 1.4vw, 16px)));
  min-width: 0;
}

.ezra-cms-stack--compact {

  gap: var(--ezra-cms-stack-gap-compact, var(--ezra-ui-stack-gap-compact, 12px));
}

.ezra-cms-stack--loose {

  gap: var(--ezra-cms-stack-gap-loose, var(--ezra-ui-stack-gap-loose, clamp(18px, 2vw, 24px)));
}

.ezra-cms-section-note {

  margin-top: var(--ezra-ui-space-sm);
}

.ezra-cms-section-note--flush {

  margin-top: 0;
}

.ezra-cms-section-title {

  margin: 0;
  color: var(--h1-color);
  font-family: var(--header-font);
  font-weight: 700;
  font-size: 1.2rem;
  line-height: 1.15;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.ezra-cms-check-row {

  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  align-items: center;
}

.ezra-cms-check {

  display: inline-flex;
  align-items: center;
  gap: var(--ezra-ui-checkbox-label-gap, 0.42em);
  min-height: 44px;
  font-family: var(--header-font);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  --ezra-ui-checkbox-label-gap: 0.42em;
}

.ezra-cms-drag-handle {

  min-height: 28px;
  min-width: 28px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: var(--muted-color);
  cursor: grab;
  touch-action: none;
  user-select: none;
  border: 0;
  box-shadow: none;
  opacity: 0.82;
  flex-shrink: 0;
}

.ezra-cms-drag-handle:hover {

  opacity: 1;
  color: var(--text-color);
}

.ezra-cms-drag-handle:active {

  cursor: grabbing;
}

.ezra-cms-drag-handle--minimal {

  font-size: 1rem;
  letter-spacing: -0.1em;
}

body.ezra-cms-sorting,
body.ezra-cms-sorting * {

  user-select: none !important;
}

/* Canonical CMS control primitives. */
.ezra-cms-editor-actions {

  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
  margin-left: auto;
}

[data-ezra-cms-action-region] {

  min-width: 0;
}

.ezra-cms-editor-actions-overflow {

  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
}

.ezra-cms-editor-actions-overflow-toggle {

  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: var(--ezra-app-surface-theme-control-button-size-action, 44px);
  width: var(--ezra-app-surface-theme-control-button-size-action, 44px);
  min-height: var(--ezra-app-surface-theme-control-button-size-action, 44px);
  height: var(--ezra-app-surface-theme-control-button-size-action, 44px);
  padding: 0;
  font-size: 1.2rem;
  line-height: 1;
  letter-spacing: 0;
}

.ezra-cms-editor-actions-overflow-menu {

  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 40;
  display: grid;
  gap: 6px;
  min-width: 168px;
  padding: 8px;
  --ezra-ui-control-popup-background: var(--panel-color);
  --ezra-ui-control-popup-shadow: 0 14px 30px color-mix(in srgb, var(--background-color) 22%, transparent);
}

.ezra-cms-editor-actions-overflow-menu .ezra-ui-button {

  width: 100%;
}

@media (max-width: 1260px) {
  .ezra-cms-editor-actions {

      flex-wrap: nowrap;
  }

  .ezra-cms-editor-actions .ezra-cms-editor-action-optional {

      display: none;
  }
}

.ezra-cms-editor-actions .ezra-ui-button,
.ezra-ui-mobile-action-bar .ezra-ui-button {

  flex: 0 0 auto;
}

.ezra-cms-editor-toolbar-menu-item-icon {

  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

.ezra-cms-editor-toolbar-menu-item-icon--section {

  width: 22px;
  min-width: 22px;
  height: 18px;
  color: var(--ezra-ui-control-menu-row-accent, currentColor);
}

.ezra-cms-editor-toolbar-menu-item-line {

  display: block;
  width: 18px;
  height: 0;
  border-top: 2px solid currentColor;
}

.ezra-ui-mobile-action-bar,
[data-ezra-cms-surface-region="editor-mobile-actions"] {

  display: none;
  position: relative;
  z-index: 15;
  isolation: isolate;
  pointer-events: auto;
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid var(--panel-border);
}

.ezra-cms-editor-toolbar {

  margin: 0 0 8px;
}

.ezra-cms-editor-toolbar-group {

  position: relative;
  display: flex;
  align-items: center;
  min-width: 0;
}

.ezra-cms-editor-toolbar-group .ezra-ui-control-menu-button,
.ezra-cms-editor-toolbar-group .ezra-ui-theme-menu-button {

  width: 100%;
  grid-template-columns: minmax(0, 1fr) auto;
}

.ezra-cms-editor-toolbar-group .ezra-ui-control-menu-button-label,
.ezra-cms-editor-toolbar-group .ezra-ui-theme-menu-button-label {

  text-align: left;
}

.ezra-cms-editor-toolbar-group .ezra-ui-control-menu,
.ezra-cms-editor-toolbar-group .ezra-ui-theme-menu {

  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 30;
  min-width: 100%;
}

/* Canonical CMS content primitives. */
.ezra-cms-module-app__editor-panel {

  padding-top: 0;
}

.ezra-ui-editor-header,
[data-ezra-cms-surface-region="editor-header"] {

  display: grid;
  align-items: flex-start;
  gap: 8px;
  margin-top: 0;
  margin-bottom: 12px;
}

.ezra-ui-editor-header-main,
[data-ezra-cms-surface-region="editor-header-main"] {

  display: flex;
  align-items: flex-start;
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
}

.ezra-cms-application-chrome .ezra-ui-editor-header-main,
.ezra-cms-application-chrome [data-ezra-cms-surface-region="editor-header-main"] {

  gap: var(--ezra-cms-section-gap);
  margin-block: 0;
}

.ezra-cms-application-chrome .ezra-ui-editor-header-main > .ezra-cms-heading--editor,
.ezra-cms-application-chrome [data-ezra-cms-surface-region="editor-header-main"] > .ezra-cms-heading--editor {

  flex: 1 1 auto;
  width: auto;
}

.ezra-cms-application-chrome .ezra-ui-editor-header-main > [data-ezra-cms-live-href],
.ezra-cms-application-chrome [data-ezra-cms-surface-region="editor-header-main"] > [data-ezra-cms-live-href] {

  flex: 0 0 auto;
  white-space: nowrap;
}

.ezra-cms-heading {

  margin: 0;
  color: inherit;
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  text-transform: none;
}

.ezra-cms-heading--editor {

  display: block;
  flex: 0 0 auto;
  width: 100%;
  min-height: 1.5rem;
  color: var(--ezra-app-surface-theme-editor-heading-color, var(--h1-color));
  font-family: var(--header-font);
  font-weight: 700;
  font-size: 2.8rem;
  line-height: 2.55rem;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.ezra-ui-editor-header-controls,
[data-ezra-cms-surface-region="editor-header-controls"],
.ezra-ui-mobile-action-bar .ezra-ui-editor-header-controls {

  min-width: 0;
}

.ezra-ui-editor-header-controls,
[data-ezra-cms-surface-region="editor-header-controls"] {

  flex: 1 1 100%;
}

.ezra-ui-editor-header-controls > .ezra-cms-save-state-indicator,
.ezra-ui-editor-header-controls > .ezra-cms-live-link,
[data-ezra-cms-surface-region="editor-header-controls"] > .ezra-cms-save-state-indicator,
[data-ezra-cms-surface-region="editor-header-controls"] > .ezra-cms-live-link,
.ezra-ui-mobile-action-bar .ezra-ui-editor-header-controls > .ezra-cms-save-state-indicator,
.ezra-ui-mobile-action-bar .ezra-ui-editor-header-controls > .ezra-cms-live-link {

  flex: 0 0 auto;
}

.ezra-ui-editor-header-controls > .ezra-cms-live-link,
[data-ezra-cms-surface-region="editor-header-controls"] > .ezra-cms-live-link,
.ezra-ui-mobile-action-bar .ezra-ui-editor-header-controls > .ezra-cms-live-link {

  margin-right: auto;
}

@media (max-width: 1180px) {
  .ezra-ui-editor-header,
  [data-ezra-cms-surface-region="editor-header"] {

      gap: 12px;
      margin-bottom: 16px;
  }

  .ezra-cms-heading--editor {

      font-size: clamp(2rem, 3.2vw, 2.45rem);
      line-height: 0.94;
  }
}

@media (max-width: 720px) {
  .ezra-ui-editor-header,
  [data-ezra-cms-surface-region="editor-header"] {

      gap: 10px;
      margin-bottom: 16px;
  }

  .ezra-cms-heading--editor {

      font-size: 1.6rem;
      line-height: 1.7rem;
      min-height: 1.5rem;
  }
}

/* Home / Widget system (shared foundation for future Utilities/Bots) */

.ezra-cms-mode-page {
  --ezra-app-surface-mode-focus-title-color: var(--ezra-app-surface-theme-editor-heading-color, var(--h1-color));
  --ezra-app-surface-mode-focus-title-font: var(--ezra-cms-mode-page-title-font, var(--title-font, var(--header-font)));
  --ezra-app-surface-mode-focus-title-size: var(--ezra-cms-mode-page-title-size, 4.9rem);
  --ezra-app-surface-mode-focus-title-line-height: var(--ezra-cms-mode-page-title-line-height, 0.92);
  --ezra-app-surface-mode-focus-title-letter-spacing: var(--ezra-cms-mode-page-title-letter-spacing, 0.04em);
  --ezra-app-surface-header-eyebrow-color: var(--label-color, var(--ezra-app-surface-theme-editor-label-color, var(--h6-color)));
  --ezra-app-surface-header-eyebrow-font: var(--header-font);
  --ezra-app-surface-theme-header-eyebrow-size: 1rem;
  --ezra-app-surface-header-eyebrow-weight: 800;
  --ezra-app-surface-theme-header-eyebrow-line-height: 1.05rem;
  --ezra-app-surface-theme-header-eyebrow-letter-spacing: 0.1em;
}

@media (max-width: 720px) {
  .ezra-cms-mode-page {
      --ezra-app-surface-mode-focus-title-size: var(--ezra-cms-mode-page-title-size-mobile, 2rem);
      --ezra-app-surface-mode-focus-title-line-height: var(--ezra-cms-mode-page-title-line-height-mobile, 0.92);
  }
}

/* Canonical CMS form primitives. */
.ezra-cms-check,
.ezra-cms-check-row,
.ezra-cms-check label,
.ezra-cms-check span:not(.ezra-ui-label) {

  color: var(--ezra-ui-theme-checkbox-text, var(--text-color));
}

.ezra-cms-editor-body {

  min-height: 520px !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 1rem;
  line-height: 1.55;
}

.ezra-cms-editor-body-header {

  display: block;
  margin-bottom: -2px;
}

.ezra-ui-control-menu-item--snippet.ezra-ui-control-menu-item--themed {

  background: var(--ezra-ui-control-menu-row-background, var(--background-color));
  color: var(--ezra-ui-control-menu-row-text, var(--text-color));
  box-shadow: inset 0 0 0 1px var(--ezra-ui-control-menu-row-border, var(--panel-border-strong));
}

.ezra-ui-control-menu-item--snippet.ezra-ui-control-menu-item--themed:hover {

  background: color-mix(
    in srgb,
    var(--ezra-ui-control-menu-row-background, var(--background-color)) 88%,
    var(--ezra-ui-control-menu-row-accent, var(--label-color)) 12%
  );
}

.ezra-ui-control-menu-item--snippet.ezra-ui-control-menu-item--themed .ezra-ui-control-menu-item-icon {

  color: var(--ezra-ui-control-menu-row-accent, var(--label-color));
}

.ezra-ui-control-menu-item--snippet.ezra-ui-control-menu-item--themed .ezra-ui-control-menu-item-label {

  color: var(--ezra-ui-control-menu-row-heading, var(--header-color));
  font-family: var(--header-font);
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.ezra-cms-markdown-preview {

  min-height: 520px;
  padding: 16px;
  border: 1px solid var(--panel-border);
  background: var(--surface-quiet);
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
}

.ezra-cms-markdown-preview > *:first-child {

  margin-top: 0;
}

.ezra-cms-markdown-preview > *:last-child {

  margin-bottom: 0;
}

.ezra-cms-markdown-preview h1,
.ezra-cms-markdown-preview h2,
.ezra-cms-markdown-preview h3,
.ezra-cms-markdown-preview h4,
.ezra-cms-markdown-preview h5,
.ezra-cms-markdown-preview h6 {

  margin-top: 1.3em;
  margin-bottom: 0.5em;
}

.ezra-cms-markdown-preview p,
.ezra-cms-markdown-preview li,
.ezra-cms-markdown-preview blockquote {

  font-size: 1.1rem;
  line-height: 1.55rem;
}

.ezra-cms-markdown-preview blockquote {

  color: var(--quote-text-color);
}

.ezra-cms-markdown-preview pre {

  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid var(--panel-border);
  background: color-mix(in srgb, var(--background-color) 76%, var(--surface-quiet));
}

.ezra-cms-markdown-preview code {

  padding: 2px 5px;
  border-radius: var(--ezra-cms-code-radius, 0);
  background: color-mix(in srgb, var(--background-color) 62%, var(--surface-quiet));
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.ezra-cms-markdown-preview pre code {

  padding: 0;
  border-radius: 0;
  background: transparent;
}

@media (max-width: 860px) {
  [data-ezra-cms-editor-action-placement="desktop"] {

      display: none !important;
  }

  .ezra-ui-editor-header,
  [data-ezra-cms-surface-region="editor-header"] {

      display: grid;
      grid-template-columns: minmax(0, 1fr);
      align-items: start;
      gap: 8px;
      margin-bottom: 10px;
  }

  .ezra-ui-editor-header-controls:not([data-ezra-cms-editor-action-placement="desktop"]),
  [data-ezra-cms-surface-region="editor-header-controls"]:not([data-ezra-cms-editor-action-placement="desktop"]) {

      display: grid !important;
      grid-template-columns: minmax(0, 1fr);
      align-items: stretch;
      gap: 8px;
      min-width: 0;
      flex: none;
  }

  .ezra-ui-editor-header-controls > .ezra-cms-save-state-indicator,
  .ezra-ui-editor-header-controls > .ezra-cms-live-link,
  .ezra-ui-editor-header-controls > .ezra-cms-editor-actions,
  [data-ezra-cms-surface-region="editor-header-controls"] > .ezra-cms-save-state-indicator,
  [data-ezra-cms-surface-region="editor-header-controls"] > .ezra-cms-live-link,
  [data-ezra-cms-surface-region="editor-header-controls"] > .ezra-cms-editor-actions {

      width: 100%;
      min-width: 0;
      margin: 0;
      justify-self: stretch;
  }

  .ezra-ui-editor-header-controls > .ezra-cms-live-link,
  [data-ezra-cms-surface-region="editor-header-controls"] > .ezra-cms-live-link {

      min-height: 42px;
      justify-content: center;
  }

  .ezra-cms-editor-actions {

      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 8px;
      margin-left: 0;
      min-width: 0;
      justify-content: stretch;
  }

  .ezra-cms-editor-actions .ezra-ui-button {

      width: 100%;
      min-width: 0;
      min-height: 42px;
      justify-self: stretch;
      flex: none;
  }

  .ezra-cms-editor-actions .ezra-cms-editor-action-optional {

      display: inline-flex;
  }

  .ezra-ui-field {

      gap: 6px;
  }

  .ezra-ui-label {

      font-size: 0.88rem;
      line-height: 0.95rem;
  }

  .ezra-ui-field input,
  .ezra-ui-field textarea,
  .ezra-ui-field select {

      min-height: 42px;
      padding: 10px 12px;
  }

  .ezra-ui-field textarea {

      min-height: 96px;
  }

  .ezra-cms-editor-body-header {

      flex-direction: column;
      align-items: stretch;
      gap: 8px;
  }

  .ezra-cms-editor-toolbar {

      margin: 4px 0 6px;
      gap: 6px;
  }

  .ezra-cms-editor-toolbar-group {

      position: relative;
      flex: 1 1 100%;
      width: 100%;
  }

  .ezra-cms-editor-toolbar-group .ezra-ui-control-menu-button,
  .ezra-cms-editor-toolbar-group .ezra-ui-theme-menu-button {

      width: 100%;
      min-width: 0;
      min-height: 38px;
      padding: 8px 12px;
      font-size: 0.9rem;
  }

  .ezra-cms-editor-toolbar-group .ezra-ui-control-menu,
  .ezra-cms-editor-toolbar-group .ezra-ui-theme-menu {

      position: absolute;
      top: calc(100% + 6px);
      left: 0;
      right: 0;
      min-width: 0;
  }

  .ezra-cms-editor-toolbar-group .ezra-ui-control-menu-item,
  .ezra-cms-editor-toolbar-group .ezra-ui-theme-menu-item {

      min-height: 34px;
      padding: 8px 10px;
      font-size: 0.96rem;
  }

  .ezra-cms-editor-body,
  .ezra-cms-markdown-preview {

      min-height: 280px !important;
  }

  .ezra-cms-editor-body {

      overflow: auto;
      -webkit-overflow-scrolling: touch;
  }

  .ezra-cms-markdown-preview {

      padding: 12px;
  }

  .ezra-ui-help {

      font-size: 0.9rem;
      line-height: 1.18rem;
  }

  .ezra-cms-check-row {

      flex-direction: column;
      align-items: flex-start;
      gap: 4px;
  }

  .ezra-cms-check {

      min-height: 38px;
      gap: 8px;
  }

  .ezra-cms-check .ezra-ui-checkbox {

      width: 17px;
      height: 17px;
  }

  .ezra-cms-drag-handle {

      min-width: 24px;
      min-height: 24px;
  }

  .ezra-ui-mobile-action-bar,
  [data-ezra-cms-surface-region="editor-mobile-actions"] {

      display: block;
      position: sticky;
      bottom: 0;
      z-index: 35;
      isolation: isolate;
      pointer-events: auto;
      margin-top: 16px;
      padding-top: 10px;
      background:
        linear-gradient(
          to bottom,
          color-mix(in srgb, var(--background-color) 0%, transparent),
          var(--background-color) 26%
        );
  }

  .ezra-ui-mobile-action-bar .ezra-ui-editor-header-controls,
  [data-ezra-cms-surface-region="editor-mobile-actions"] [data-ezra-cms-surface-region="editor-header-controls"],
  [data-ezra-cms-surface-region="editor-mobile-action-controls"] {

      display: grid !important;
      grid-template-columns: minmax(0, 1fr);
      gap: 8px;
      position: relative;
      z-index: 1;
      padding: 10px;
      border: 1px solid var(--panel-border);
      background: color-mix(in srgb, var(--background-color) 90%, transparent);
      backdrop-filter: blur(10px);
      justify-content: stretch;
  }

  .ezra-ui-mobile-action-bar .ezra-ui-editor-header-controls > .ezra-cms-save-state-indicator,
  .ezra-ui-mobile-action-bar .ezra-ui-editor-header-controls > .ezra-cms-live-link,
  [data-ezra-cms-surface-region="editor-mobile-actions"] [data-ezra-cms-surface-region="editor-header-controls"] > .ezra-cms-save-state-indicator,
  [data-ezra-cms-surface-region="editor-mobile-actions"] [data-ezra-cms-surface-region="editor-header-controls"] > .ezra-cms-live-link,
  [data-ezra-cms-surface-region="editor-mobile-action-controls"] > .ezra-cms-save-state-indicator,
  [data-ezra-cms-surface-region="editor-mobile-action-controls"] > .ezra-cms-live-link {

      width: 100%;
      min-width: 0;
      justify-self: stretch;
  }

  .ezra-ui-mobile-action-bar .ezra-ui-editor-header-controls > .ezra-cms-live-link,
  [data-ezra-cms-surface-region="editor-mobile-actions"] [data-ezra-cms-surface-region="editor-header-controls"] > .ezra-cms-live-link,
  [data-ezra-cms-surface-region="editor-mobile-action-controls"] > .ezra-cms-live-link {

      min-height: 42px;
      justify-content: center;
  }

  .ezra-ui-mobile-action-bar .ezra-cms-editor-actions,
  [data-ezra-cms-surface-region="editor-mobile-actions"] .ezra-cms-editor-actions,
  [data-ezra-cms-surface-region="editor-mobile-action-controls"] .ezra-cms-editor-actions {

      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 8px;
      margin-left: 0;
      min-width: 0;
  }

  .ezra-ui-mobile-action-bar .ezra-ui-button,
  [data-ezra-cms-surface-region="editor-mobile-actions"] .ezra-ui-button,
  [data-ezra-cms-surface-region="editor-mobile-action-controls"] .ezra-ui-button {

      width: 100% !important;
      min-width: 0;
      min-height: 42px;
      justify-self: stretch;
      flex: none;
  }

}

/* Canonical CMS mode-switcher primitives. */
/* ezra-cms-mode-switcher.css */
.ezra-cms-mode-switcher {

  --ezra-cms-switcher-parent-height: var(--ezra-app-surface-theme-switcher-parent-height, 62px);
  --ezra-cms-switcher-parent-inset: var(--ezra-app-surface-theme-switcher-parent-inset, 1px);
  --ezra-cms-switcher-chevron-width: var(--ezra-app-surface-theme-switcher-chevron-width, 51px);
  --ezra-cms-switcher-chevron-height: var(--ezra-app-surface-theme-switcher-chevron-height, 60px);
  --ezra-ui-split-trigger-font-family: var(--title-font);
  --ezra-ui-split-trigger-font-size: 1rem;
  --ezra-ui-split-trigger-font-weight: 700;
  --ezra-ui-split-trigger-line-height: 1;
  --ezra-ui-split-trigger-letter-spacing: 0.04em;
  --ezra-ui-split-trigger-text-transform: uppercase;
  --ezra-ui-split-trigger-text-align: center;
  --ezra-ui-split-trigger-copy-justify: center;
  --ezra-ui-split-trigger-height: var(--ezra-cms-switcher-parent-height);
  --ezra-ui-split-trigger-chevron-height: var(--ezra-cms-switcher-chevron-height);
  --ezra-ui-split-trigger-chevron-width: var(--ezra-cms-switcher-chevron-width);
  --ezra-ui-split-trigger-inset: var(--ezra-cms-switcher-parent-inset);
  --ezra-cms-switcher-drawer-max-height: var(--ezra-app-surface-theme-switcher-drawer-max-height, 400px);
  --ezra-cms-switcher-desktop-gap: var(--ezra-app-surface-theme-switcher-desktop-gap, 10px);
  --ezra-cms-switcher-desktop-row-gap: var(--ezra-app-surface-theme-switcher-desktop-row-gap, 10px);
  --ezra-cms-switcher-desktop-columns: var(--ezra-app-surface-theme-switcher-desktop-columns, 4);
  --ezra-cms-mode-step-1: var(--ezra-app-surface-theme-mode-step-1, var(--ezra-ui-theme-surface-step-1, color-mix(in srgb, var(--background-color) 72%, white 28%)));
  --ezra-cms-mode-step-2: var(--ezra-app-surface-theme-mode-step-2, var(--ezra-ui-theme-surface-step-2, color-mix(in srgb, var(--background-color) 84%, white 16%)));
  --ezra-cms-mode-step-3: var(--ezra-app-surface-theme-mode-step-3, var(--ezra-ui-theme-surface-step-3, color-mix(in srgb, var(--background-color) 94%, white 6%)));
  --ezra-cms-mode-step-4: var(--ezra-app-surface-theme-mode-step-4, var(--ezra-ui-theme-surface-step-4, color-mix(in srgb, var(--background-color) 98%, white 2%)));
  --ezra-cms-mode-step-5: var(--ezra-app-surface-theme-mode-step-5, var(--ezra-ui-theme-surface-step-5, color-mix(in srgb, var(--background-color) 96%, black 4%)));
  --ezra-cms-mode-step-6: var(--ezra-app-surface-theme-mode-step-6, var(--ezra-ui-theme-surface-step-6, color-mix(in srgb, var(--background-color) 88%, black 12%)));
  --ezra-cms-mode-step-7: var(--ezra-app-surface-theme-mode-step-7, var(--ezra-ui-theme-surface-step-7, color-mix(in srgb, var(--background-color) 76%, black 24%)));
  --ezra-cms-mode-step-8: var(--ezra-app-surface-theme-mode-step-8, var(--ezra-ui-theme-surface-step-8, color-mix(in srgb, var(--background-color) 62%, black 38%)));
  --ezra-cms-mode-step-1-hover: var(--ezra-app-surface-theme-mode-step-1-hover, color-mix(in srgb, var(--ezra-cms-mode-step-1) 86%, var(--surface-hover) 14%));
  --ezra-cms-mode-step-2-hover: var(--ezra-app-surface-theme-mode-step-2-hover, color-mix(in srgb, var(--ezra-cms-mode-step-2) 86%, var(--surface-hover) 14%));
  --ezra-cms-mode-step-3-hover: var(--ezra-app-surface-theme-mode-step-3-hover, color-mix(in srgb, var(--ezra-cms-mode-step-3) 86%, var(--surface-hover) 14%));
  --ezra-cms-mode-step-4-hover: var(--ezra-app-surface-theme-mode-step-4-hover, color-mix(in srgb, var(--ezra-cms-mode-step-4) 86%, var(--surface-hover) 14%));
  --ezra-cms-mode-step-5-hover: var(--ezra-app-surface-theme-mode-step-5-hover, color-mix(in srgb, var(--ezra-cms-mode-step-5) 86%, var(--surface-hover) 14%));
  --ezra-cms-mode-step-6-hover: var(--ezra-app-surface-theme-mode-step-6-hover, color-mix(in srgb, var(--ezra-cms-mode-step-6) 86%, var(--surface-hover) 14%));
  --ezra-cms-mode-step-7-hover: var(--ezra-app-surface-theme-mode-step-7-hover, color-mix(in srgb, var(--ezra-cms-mode-step-7) 86%, var(--surface-hover) 14%));
  --ezra-cms-mode-step-8-hover: var(--ezra-app-surface-theme-mode-step-8-hover, color-mix(in srgb, var(--ezra-cms-mode-step-8) 86%, var(--surface-hover) 14%));
  --ezra-cms-mode-substep-1: var(--ezra-app-surface-theme-mode-substep-1, color-mix(in srgb, var(--ezra-cms-mode-step-1) 94%, black 6%));
  --ezra-cms-mode-substep-2: var(--ezra-app-surface-theme-mode-substep-2, color-mix(in srgb, var(--ezra-cms-mode-step-2) 94%, black 6%));
  --ezra-cms-mode-substep-3: var(--ezra-app-surface-theme-mode-substep-3, color-mix(in srgb, var(--ezra-cms-mode-step-3) 94%, black 6%));
  --ezra-cms-mode-substep-4: var(--ezra-app-surface-theme-mode-substep-4, color-mix(in srgb, var(--ezra-cms-mode-step-4) 94%, black 6%));
  --ezra-cms-mode-substep-5: var(--ezra-app-surface-theme-mode-substep-5, color-mix(in srgb, var(--ezra-cms-mode-step-5) 94%, black 6%));
  --ezra-cms-mode-substep-6: var(--ezra-app-surface-theme-mode-substep-6, color-mix(in srgb, var(--ezra-cms-mode-step-6) 94%, black 6%));
  --ezra-cms-mode-substep-7: var(--ezra-app-surface-theme-mode-substep-7, color-mix(in srgb, var(--ezra-cms-mode-step-7) 94%, black 6%));
  --ezra-cms-mode-substep-8: var(--ezra-app-surface-theme-mode-substep-8, color-mix(in srgb, var(--ezra-cms-mode-step-8) 94%, black 6%));
  --ezra-cms-mode-substep-1-hover: var(--ezra-app-surface-theme-mode-substep-1-hover, color-mix(in srgb, var(--ezra-cms-mode-substep-1) 84%, var(--ezra-cms-mode-step-1-hover) 16%));
  --ezra-cms-mode-substep-2-hover: var(--ezra-app-surface-theme-mode-substep-2-hover, color-mix(in srgb, var(--ezra-cms-mode-substep-2) 84%, var(--ezra-cms-mode-step-2-hover) 16%));
  --ezra-cms-mode-substep-3-hover: var(--ezra-app-surface-theme-mode-substep-3-hover, color-mix(in srgb, var(--ezra-cms-mode-substep-3) 84%, var(--ezra-cms-mode-step-3-hover) 16%));
  --ezra-cms-mode-substep-4-hover: var(--ezra-app-surface-theme-mode-substep-4-hover, color-mix(in srgb, var(--ezra-cms-mode-substep-4) 84%, var(--ezra-cms-mode-step-4-hover) 16%));
  --ezra-cms-mode-substep-5-hover: var(--ezra-app-surface-theme-mode-substep-5-hover, color-mix(in srgb, var(--ezra-cms-mode-substep-5) 84%, var(--ezra-cms-mode-step-5-hover) 16%));
  --ezra-cms-mode-substep-6-hover: var(--ezra-app-surface-theme-mode-substep-6-hover, color-mix(in srgb, var(--ezra-cms-mode-substep-6) 84%, var(--ezra-cms-mode-step-6-hover) 16%));
  --ezra-cms-mode-substep-7-hover: var(--ezra-app-surface-theme-mode-substep-7-hover, color-mix(in srgb, var(--ezra-cms-mode-substep-7) 84%, var(--ezra-cms-mode-step-7-hover) 16%));
  --ezra-cms-mode-substep-8-hover: var(--ezra-app-surface-theme-mode-substep-8-hover, color-mix(in srgb, var(--ezra-cms-mode-substep-8) 84%, var(--ezra-cms-mode-step-8-hover) 16%));
  --ezra-cms-mode-switcher-surface: color-mix(in srgb, var(--surface-quiet) 84%, var(--background-color) 16%);
  --ezra-cms-mode-switcher-surface-hover: color-mix(in srgb, var(--surface-hover) 82%, var(--surface-quiet) 18%);
  --ezra-cms-mode-subtab-surface: color-mix(in srgb, var(--surface-quiet) 88%, var(--background-color) 12%);
  --ezra-cms-mode-subtab-surface-hover: color-mix(in srgb, var(--surface-hover) 82%, var(--surface-quiet) 18%);
  --ezra-cms-mode-switcher-text: var(--ezra-app-surface-theme-mode-switcher-text, color-mix(in srgb, var(--text-color) 88%, transparent));
  --ezra-cms-mode-switcher-border: var(--panel-border-strong);
  --ezra-cms-mode-switcher-top-highlight: color-mix(in srgb, var(--text-color) 5%, transparent);
  --ezra-cms-mode-switcher-divider: color-mix(in srgb, var(--text-color) 7%, transparent);
  --ezra-ui-split-trigger-surface: var(--ezra-cms-mode-switcher-surface);
  --ezra-ui-split-trigger-hover-surface: var(--ezra-cms-mode-switcher-surface-hover);
  --ezra-ui-split-trigger-text: var(--ezra-cms-mode-switcher-text);
  --ezra-ui-split-trigger-border: var(--ezra-cms-mode-switcher-border);
  --ezra-ui-split-trigger-top-highlight: var(--ezra-cms-mode-switcher-top-highlight);
  --ezra-ui-split-trigger-divider: var(--ezra-cms-mode-switcher-divider);
  --ezra-cms-mode-switcher-active-surface: var(--ezra-app-surface-theme-mode-switcher-active-surface, var(--button-background-color));
  --ezra-cms-mode-switcher-active-text: var(--ezra-app-surface-theme-mode-switcher-active-text, var(--button-text-color));
  --ezra-cms-mode-switcher-active-border: var(--ezra-app-surface-theme-mode-switcher-active-border, color-mix(in srgb, var(--border-color) 84%, transparent));
  --ezra-cms-mode-switcher-active-outline: var(--ezra-app-surface-theme-mode-switcher-active-outline, color-mix(in srgb, var(--border-color) 28%, transparent));
  --ezra-cms-mode-switcher-active-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
  --ezra-cms-mode-switcher-active-divider: var(--ezra-app-surface-theme-mode-switcher-active-divider, color-mix(in srgb, var(--button-text-color) 10%, transparent));
  --ezra-cms-mode-subtab-text: var(--ezra-app-surface-theme-mode-subtab-text, color-mix(in srgb, var(--text-color) 82%, transparent));
  --ezra-cms-mode-subtab-border: var(--panel-border);
  --ezra-cms-mode-subtab-top-highlight: color-mix(in srgb, var(--text-color) 6%, transparent);
  --ezra-cms-mode-subtab-branch-top-highlight: color-mix(in srgb, var(--text-color) 7%, transparent);
  display: grid;
  gap: 0;
  margin: 0 0 14px;
  position: relative;
  z-index: var(--ezra-cms-layer-workspace-mode, 30);
  min-width: 0;
  overflow: visible;
}

.ezra-cms-mode-switcher-main {

  display: grid;
  grid-template-columns: repeat(var(--ezra-cms-switcher-desktop-columns), minmax(0, 1fr));
  gap: var(--ezra-cms-switcher-desktop-row-gap) var(--ezra-cms-switcher-desktop-gap);
  align-items: start;
  position: relative;
  z-index: 1;
  min-width: 0;
}

.ezra-cms-mode-switcher-branch,
.ezra-cms-mode-switcher-mobile-group {

  display: grid;
  gap: 0;
  align-content: start;
  min-width: 0;
}

.ezra-cms-mode-switcher-branch {

  min-width: 0;
  max-width: 100%;
}

.ezra-cms-mode-switcher-step-0 {

  --ezra-cms-mode-switcher-surface: var(--ezra-cms-mode-step-1);
  --ezra-cms-mode-switcher-surface-hover: var(--ezra-cms-mode-step-1-hover);
  --ezra-cms-mode-subtab-surface: var(--ezra-cms-mode-substep-1);
  --ezra-cms-mode-subtab-surface-hover: var(--ezra-cms-mode-substep-1-hover);
}

.ezra-cms-mode-switcher-step-1 {

  --ezra-cms-mode-switcher-surface: var(--ezra-cms-mode-step-2);
  --ezra-cms-mode-switcher-surface-hover: var(--ezra-cms-mode-step-2-hover);
  --ezra-cms-mode-subtab-surface: var(--ezra-cms-mode-substep-2);
  --ezra-cms-mode-subtab-surface-hover: var(--ezra-cms-mode-substep-2-hover);
}

.ezra-cms-mode-switcher-step-2 {

  --ezra-cms-mode-switcher-surface: var(--ezra-cms-mode-step-3);
  --ezra-cms-mode-switcher-surface-hover: var(--ezra-cms-mode-step-3-hover);
  --ezra-cms-mode-subtab-surface: var(--ezra-cms-mode-substep-3);
  --ezra-cms-mode-subtab-surface-hover: var(--ezra-cms-mode-substep-3-hover);
}

.ezra-cms-mode-switcher-step-3 {

  --ezra-cms-mode-switcher-surface: var(--ezra-cms-mode-step-4);
  --ezra-cms-mode-switcher-surface-hover: var(--ezra-cms-mode-step-4-hover);
  --ezra-cms-mode-subtab-surface: var(--ezra-cms-mode-substep-4);
  --ezra-cms-mode-subtab-surface-hover: var(--ezra-cms-mode-substep-4-hover);
}

.ezra-cms-mode-switcher-step-4 {

  --ezra-cms-mode-switcher-surface: var(--ezra-cms-mode-step-5);
  --ezra-cms-mode-switcher-surface-hover: var(--ezra-cms-mode-step-5-hover);
  --ezra-cms-mode-subtab-surface: var(--ezra-cms-mode-substep-5);
  --ezra-cms-mode-subtab-surface-hover: var(--ezra-cms-mode-substep-5-hover);
}

.ezra-cms-mode-switcher-step-5 {

  --ezra-cms-mode-switcher-surface: var(--ezra-cms-mode-step-6);
  --ezra-cms-mode-switcher-surface-hover: var(--ezra-cms-mode-step-6-hover);
  --ezra-cms-mode-subtab-surface: var(--ezra-cms-mode-substep-6);
  --ezra-cms-mode-subtab-surface-hover: var(--ezra-cms-mode-substep-6-hover);
}

.ezra-cms-mode-switcher-step-6 {

  --ezra-cms-mode-switcher-surface: var(--ezra-cms-mode-step-7);
  --ezra-cms-mode-switcher-surface-hover: var(--ezra-cms-mode-step-7-hover);
  --ezra-cms-mode-subtab-surface: var(--ezra-cms-mode-substep-7);
  --ezra-cms-mode-subtab-surface-hover: var(--ezra-cms-mode-substep-7-hover);
}

.ezra-cms-mode-switcher-step-7 {

  --ezra-cms-mode-switcher-surface: var(--ezra-cms-mode-step-8);
  --ezra-cms-mode-switcher-surface-hover: var(--ezra-cms-mode-step-8-hover);
  --ezra-cms-mode-subtab-surface: var(--ezra-cms-mode-substep-8);
  --ezra-cms-mode-subtab-surface-hover: var(--ezra-cms-mode-substep-8-hover);
}

.ezra-cms-mode-switcher-mobile-trigger,
.ezra-cms-mode-switcher-mobile-menu,
.ezra-cms-mode-switcher-mobile-closed-subtab {

  display: none;
}

.ezra-cms-mode-switcher-button,
.ezra-cms-mode-subtab,
.ezra-cms-mode-switcher-chevron {

  appearance: none;
  border: 0;
  cursor: pointer;
  text-transform: uppercase;
  text-align: var(--ezra-ui-split-trigger-text-align, left);
  box-sizing: border-box;
  transition:
    background-color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    border-color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    color var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    box-shadow var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    opacity var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade),
    transform var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-friction),
    max-height var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-friction),
    padding-top var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-friction),
    padding-bottom var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-friction);
}

.ezra-cms-mode-switcher-item {

  position: relative;
  display: block;
  min-width: 0;
  z-index: 0;
}

.ezra-cms-mode-switcher-item.has-children {

  overflow: hidden;
}

.ezra-cms-mode-switcher-button,
.ezra-cms-mode-switcher-chevron {

  background: var(--ezra-cms-mode-switcher-surface);
  color: var(--ezra-cms-mode-switcher-text);
}

.ezra-cms-mode-switcher-button {

  display: grid;
  justify-items: var(--ezra-ui-split-trigger-copy-justify, start);
  align-items: center;
  font-family: var(--ezra-ui-split-trigger-font-family);
  font-size: var(--ezra-ui-split-trigger-font-size);
  line-height: var(--ezra-ui-split-trigger-line-height);
  letter-spacing: var(--ezra-ui-split-trigger-letter-spacing);
}

.ezra-cms-mode-switcher-button.has-children {

  --ezra-ui-split-trigger-padding-top: 14px;
  --ezra-ui-split-trigger-padding-bottom: 12px;
  --ezra-ui-split-trigger-padding-inline-start: calc(
    var(--ezra-cms-switcher-chevron-width) + 16px
  );
  --ezra-ui-split-trigger-padding-inline-end: calc(
    var(--ezra-cms-switcher-chevron-width) + 16px
  );
}

.ezra-cms-mode-switcher-button-label {}

.ezra-cms-mode-switcher-button:hover,
.ezra-cms-mode-switcher-chevron:hover {

  background: var(--ezra-cms-mode-switcher-surface-hover);
}

.ezra-cms-mode-switcher-button.is-active,
.ezra-cms-mode-switcher-button.is-active + .ezra-cms-mode-switcher-chevron {

  background: var(--ezra-cms-mode-switcher-active-surface);
  color: var(--ezra-cms-mode-switcher-active-text);
}

.ezra-ui-split-trigger-shell:hover .ezra-cms-mode-switcher-button.is-active,
.ezra-ui-split-trigger-shell:hover .ezra-cms-mode-switcher-button.is-active + .ezra-cms-mode-switcher-chevron {

  background: var(--ezra-cms-mode-switcher-active-surface);
  color: var(--ezra-cms-mode-switcher-active-text);
}

.ezra-cms-mode-switcher-button.is-active {

  box-shadow:
    inset 0 0 0 1px var(--ezra-cms-mode-switcher-active-border),
    0 0 0 1px var(--ezra-cms-mode-switcher-active-outline),
    var(--ezra-cms-mode-switcher-active-shadow);
}

.ezra-cms-mode-switcher-button.is-active + .ezra-cms-mode-switcher-chevron {

  box-shadow: inset 1px 0 0 var(--ezra-cms-mode-switcher-active-divider);
}

.ezra-cms-mode-switcher-chevron {}

.ezra-cms-mode-switcher-branch .ezra-cms-mode-switcher-item.has-children.is-drawer-open {

  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.ezra-cms-mode-switcher-button:focus-visible,
.ezra-cms-mode-subtab:focus-visible,
.ezra-cms-mode-switcher-chevron:focus-visible {

  outline: none;
  box-shadow:
    0 0 0 2px var(--focus-ring),
    inset 0 0 0 1px transparent;
}

.ezra-cms-mode-switcher-sub {

  position: relative;
  z-index: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
  margin-top: -1px;
  padding-top: 0;
  overflow: hidden;
  transform-origin: top center;
  max-height: var(--ezra-cms-switcher-drawer-max-height);
  opacity: 1;
  transform: translateY(0);
  transition:
    max-height var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-standard),
    opacity var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-standard),
    transform var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-standard);
}

.ezra-cms-mode-subtab {

  width: 100%;
  min-width: 0;
  min-height: 42px;
  max-height: 52px;
  padding: 13px 14px 8px;
  background: var(--ezra-cms-mode-subtab-surface);
  color: var(--ezra-cms-mode-subtab-text);
  box-shadow:
    inset 0 0 0 1px var(--ezra-cms-mode-subtab-border),
    inset 0 1px 0 var(--ezra-cms-mode-subtab-top-highlight);
  font-family: var(--title-font);
  font-size: 0.74rem;
  line-height: 1;
  letter-spacing: 0.045em;
  border-top: 0;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  opacity: 1;
  transform: translateY(0);
  will-change: transform, opacity;
}

.ezra-cms-mode-switcher-branch .ezra-cms-mode-subtab,
.ezra-cms-mode-switcher-mobile-group .ezra-cms-mode-subtab,
.ezra-cms-mode-switcher-mobile-closed-subtab .ezra-cms-mode-subtab {

  margin-top: 0;
  box-shadow:
    inset 0 0 0 1px var(--ezra-cms-mode-subtab-border),
    inset 0 1px 0 var(--ezra-cms-mode-subtab-branch-top-highlight);
}

.ezra-cms-mode-switcher-branch .ezra-cms-mode-subtab + .ezra-cms-mode-subtab,
.ezra-cms-mode-switcher-mobile-group .ezra-cms-mode-subtab + .ezra-cms-mode-subtab,
.ezra-cms-mode-switcher-mobile-closed-subtab .ezra-cms-mode-subtab + .ezra-cms-mode-subtab {

  margin-top: -1px;
}

.ezra-cms-mode-switcher-sub.is-open {

  max-height: var(--ezra-cms-switcher-drawer-max-height);
  opacity: 1;
  transform: translateY(0);
}

.ezra-cms-mode-switcher-sub.is-open .ezra-cms-mode-subtab {

  opacity: 1;
  transform: translateY(0);
}

.ezra-cms-mode-switcher-sub.is-closed {

  max-height: 0;
  opacity: 0;
  transform: translateY(0);
  pointer-events: none;
}

.ezra-cms-mode-switcher-sub.is-closed .ezra-cms-mode-subtab {

  opacity: 0;
  transform: translateY(0);
}

.ezra-cms-mode-subtab:hover {

  background: var(--ezra-cms-mode-subtab-surface-hover);
}

.ezra-cms-mode-subtab.is-active {

  background: var(--ezra-app-surface-theme-mode-subtab-active-surface, var(--ezra-cms-mode-switcher-active-surface));
  color: var(--ezra-app-surface-theme-mode-subtab-active-text, var(--ezra-cms-mode-switcher-active-text));
  box-shadow:
    inset 0 0 0 1px var(--ezra-app-surface-theme-mode-subtab-active-border, var(--ezra-cms-mode-switcher-active-border)),
    0 0 0 1px var(--ezra-app-surface-theme-mode-subtab-active-outline, var(--ezra-cms-mode-switcher-active-outline)),
    var(--ezra-app-surface-theme-mode-subtab-active-shadow, var(--ezra-cms-mode-switcher-active-shadow));
}

@media (max-width: 1320px) {
  .ezra-cms-mode-switcher {

      --ezra-cms-switcher-desktop-columns: 4;
      --ezra-cms-switcher-parent-height: var(--ezra-app-surface-theme-switcher-parent-height-compact, 58px);
      --ezra-cms-switcher-chevron-width: var(--ezra-app-surface-theme-switcher-chevron-width-compact, 48px);
      --ezra-cms-switcher-chevron-height: var(--ezra-app-surface-theme-switcher-chevron-height-compact, 56px);
      --ezra-cms-switcher-desktop-gap: 8px;
      --ezra-cms-switcher-desktop-row-gap: 8px;
  }

  .ezra-cms-mode-switcher-button {

      padding: 13px 14px 11px;
      font-size: 0.92rem;
      letter-spacing: 0.038em;
  }

  .ezra-cms-mode-switcher-button.has-children {

      --ezra-ui-split-trigger-padding-top: 13px;
      --ezra-ui-split-trigger-padding-bottom: 11px;
      --ezra-ui-split-trigger-padding-inline-start: calc(
        var(--ezra-cms-switcher-chevron-width) + 14px
      );
      --ezra-ui-split-trigger-padding-inline-end: calc(
        var(--ezra-cms-switcher-chevron-width) + 14px
      );
  }

  .ezra-cms-mode-subtab {

      min-height: 40px;
      padding: 12px 12px 8px;
      font-size: 0.7rem;
      letter-spacing: 0.042em;
  }

  .ezra-cms-mode-switcher-chevron svg {

      width: 17px;
      height: 17px;
  }
}

@media (max-width: 1120px) {
  .ezra-cms-mode-switcher {

      min-height: var(--ezra-app-surface-theme-switcher-parent-height-mobile, 50px);
      margin-bottom: 0;
      overflow: visible;
  }

  .ezra-cms-mode-switcher-main {

      display: none;
  }

  .ezra-cms-mode-switcher-mobile-trigger {

      display: block;
  }

  .ezra-cms-mode-switcher-mobile-menu,
  .ezra-cms-mode-switcher-mobile-closed-subtab {

      display: grid;
  }

  .ezra-cms-mode-switcher-mobile-trigger,
  .ezra-cms-mode-switcher-mobile-option,
  .ezra-cms-mode-switcher-mobile-subtab,
  .ezra-cms-mode-switcher-chevron {

      -webkit-tap-highlight-color: transparent;
  }

  .ezra-cms-mode-switcher-mobile-menu {

      min-height: 0;
  }

  .ezra-cms-mode-switcher-mobile-trigger {

      width: 100%;
  }

  .ezra-cms-mode-switcher-mobile-trigger::before {

      content: none;
      display: none;
  }

  .ezra-cms-mode-switcher-mobile-trigger.is-active:not(.is-open) {

      background: var(--ezra-cms-mode-switcher-active-surface);
      color: var(--ezra-cms-mode-switcher-active-text);
      box-shadow:
        inset 0 0 0 1px var(--ezra-cms-mode-switcher-active-border),
        0 0 0 1px var(--ezra-cms-mode-switcher-active-outline),
        var(--ezra-cms-mode-switcher-active-shadow);
  }

  .ezra-cms-mode-switcher-mobile-trigger-label {

      min-width: 0;
  }

  .ezra-cms-mode-switcher-mobile-shell {

      width: 100%;
      overflow: visible;
  }

  .ezra-cms-mode-switcher-mobile-trigger-icon {

      box-shadow: inset 1px 0 0 var(--ezra-cms-mode-switcher-divider);
  }

  .ezra-cms-mode-switcher-mobile-trigger.is-active:not(.is-open) .ezra-cms-mode-switcher-mobile-trigger-icon {

      box-shadow: inset 1px 0 0 var(--ezra-cms-mode-switcher-active-divider);
  }

  .ezra-cms-mode-switcher-mobile-menu {

      min-height: 0;
  }

  .ezra-cms-mode-switcher-mobile-menu-inner {

      gap: 6px;
      padding-top: 6px;
  }

  .ezra-cms-mode-switcher-mobile-option {

      width: 100%;
  }

  .ezra-cms-mode-switcher-mobile-group,
  .ezra-cms-mode-switcher-mobile-closed-subtab,
  .ezra-cms-mode-switcher-mobile-subnav {

      gap: 0;
  }

  .ezra-cms-mode-switcher-mobile-group {

      --ezra-cms-switcher-parent-height: 46px;
      --ezra-ui-split-trigger-font-family: var(--title-font);
      --ezra-ui-split-trigger-font-size: 0.9rem;
      --ezra-ui-split-trigger-font-weight: 700;
      --ezra-ui-split-trigger-line-height: 1;
      --ezra-ui-split-trigger-letter-spacing: 0.035em;
      --ezra-ui-split-trigger-text-transform: uppercase;
      --ezra-ui-split-trigger-text-align: center;
      --ezra-ui-split-trigger-copy-justify: center;
  }

  .ezra-cms-mode-switcher-mobile-group .ezra-cms-mode-switcher-item,
  .ezra-cms-mode-switcher-mobile-closed-subtab .ezra-cms-mode-switcher-sub,
  .ezra-cms-mode-switcher-mobile-subnav {

      width: 100%;
  }

  .ezra-cms-mode-switcher-mobile-group .ezra-cms-mode-switcher-item {

      overflow: hidden;
  }

  .ezra-cms-mode-switcher-mobile-group .ezra-cms-mode-switcher-button,
  .ezra-cms-mode-switcher-mobile-subtab {

      width: 100%;
  }

  .ezra-cms-mode-switcher-mobile-subtab {

      margin-top: -1px;
  }

  .ezra-cms-mode-switcher-mobile-option + .ezra-cms-mode-switcher-chevron {

      position: absolute;
      top: 1px;
      right: 1px;
      bottom: 1px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 44px;
      min-width: 44px;
      min-height: 0;
      height: auto;
      opacity: 1;
      line-height: 1;
      background: transparent;
      box-shadow: inset 1px 0 0 var(--ezra-cms-mode-switcher-divider);
  }

  .ezra-cms-mode-switcher-item.has-children {

      overflow: hidden;
  }

  .ezra-cms-mode-switcher-mobile-group .ezra-cms-mode-switcher-button {

      min-height: 46px;
      padding: 10px 12px 9px;
      font-size: var(--ezra-ui-split-trigger-font-size);
      letter-spacing: var(--ezra-ui-split-trigger-letter-spacing);
  }

  .ezra-cms-mode-switcher-mobile-group .ezra-cms-mode-switcher-button.has-children {

      --ezra-ui-split-trigger-padding-top: 10px;
      --ezra-ui-split-trigger-padding-bottom: 9px;
      --ezra-ui-split-trigger-padding-inline-start: 46px;
      --ezra-ui-split-trigger-padding-inline-end: 46px;
  }

  .ezra-cms-mode-switcher-mobile-group .ezra-cms-mode-switcher-chevron {

      top: 1px;
      right: 1px;
      bottom: 1px;
      width: 44px;
      min-width: 44px;
      min-height: 0;
  }

  .ezra-cms-mode-switcher-mobile-group .ezra-cms-mode-switcher-chevron svg {

      width: 16px;
      height: 16px;
  }

  .ezra-cms-mode-switcher-sub {

      margin-top: -1px;
      padding-top: 0;
      justify-content: stretch;
      transition:
        max-height var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-friction),
        opacity var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-friction);
  }

  .ezra-cms-mode-subtab {

      min-height: 34px;
      max-height: none;
      padding: 9px 10px 6px;
      font-family: var(--title-font);
      font-size: 0.66rem;
      font-weight: 700;
      letter-spacing: 0.035em;
  }
}

/* Canonical CMS theme-picker primitives. */
.ezra-cms-theme-picker {

  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex-wrap: nowrap;
}

.ezra-cms-theme-picker-label {

  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--label-color);
  font-family: var(--header-font);
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  white-space: nowrap;
}

.ezra-cms-theme-picker-field {

  min-width: 0;
}

.ezra-cms-theme-field {

  align-items: flex-start;
}

.ezra-cms-theme-field .ezra-ui-theme-menu-shell {

  width: min(320px, 100%);
  max-width: 100%;
}

.ezra-cms-theme-field .ezra-ui-theme-menu {

  height: auto;
  max-height: min(76dvh, calc(100vh - 144px));
  align-content: start;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.ezra-cms-theme-picker--header {

  align-items: stretch;
}

@media (max-width: 768px) {
  .ezra-cms-theme-field .ezra-ui-theme-menu-shell {

      width: 100%;
  }
}

.ezra-cms-mode-page[data-ezra-cms-mode="home"] .ezra-ui-panel,
.ezra-cms-mode-page[data-ezra-cms-mode="home"] .ezra-ui-panel-body {

  overflow: visible;
}

.ezra-cms-home-site-settings {

  --ezra-cms-home-site-settings-border: color-mix(in srgb, var(--text-color) 14%, transparent);
  --ezra-cms-home-site-settings-bg: color-mix(in srgb, var(--background-color) 96%, var(--text-color) 4%);
  --ezra-cms-home-site-settings-text: var(--text-color);
  --ezra-ui-split-trigger-surface: var(--ezra-cms-home-site-settings-bg);
  --ezra-ui-split-trigger-hover-surface: color-mix(
    in srgb,
    var(--ezra-cms-home-site-settings-bg) 86%,
    var(--text-color) 14%
  );
  --ezra-ui-split-trigger-text: var(--ezra-cms-home-site-settings-text);
  --ezra-ui-split-trigger-border: var(--ezra-cms-home-site-settings-border);
  --ezra-ui-split-trigger-top-highlight: color-mix(in srgb, var(--text-color) 6%, transparent);
  --ezra-ui-split-trigger-divider: color-mix(in srgb, var(--text-color) 12%, transparent);
  --ezra-ui-split-trigger-font-family: var(--header-font);
  --ezra-ui-split-trigger-font-size: 1rem;
  --ezra-ui-split-trigger-font-weight: 700;
  --ezra-ui-split-trigger-line-height: 1;
  --ezra-ui-split-trigger-letter-spacing: 0.04em;
  --ezra-ui-split-trigger-text-transform: uppercase;
  --ezra-ui-split-trigger-text-align: left;
  --ezra-ui-split-trigger-copy-justify: start;
  --ezra-ui-split-trigger-height: 54px;
  --ezra-ui-split-trigger-chevron-height: 52px;
  --ezra-ui-split-trigger-chevron-width: 52px;
  --ezra-ui-split-trigger-inset: 1px;
  --ezra-ui-split-trigger-padding: 13px calc(var(--ezra-ui-split-trigger-chevron-width) + 14px) 11px 14px;
  position: relative;
  z-index: var(--ezra-ui-layer-workspace-dropdown, 60);
  display: grid;
  width: 100%;
  min-width: 0;
}

.ezra-cms-home-site-settings-trigger-shell {

  width: 100%;
  min-width: 0;
}

.ezra-cms-home-site-settings-trigger-button {

  width: 100%;
  min-width: 0;
}

.ezra-cms-home-site-settings-drawer {

  --ezra-ui-control-popup-background: var(--panel-color);
  --ezra-ui-control-popup-shadow: 0 18px 34px color-mix(in srgb, var(--background-color) 34%, transparent);
  position: absolute;
  top: calc(100% - 1px);
  left: 0;
  right: 0;
  z-index: calc(var(--ezra-ui-layer-workspace-dropdown, 60) + 1);
  display: grid;
  gap: 14px;
  width: 100%;
  min-width: 0;
  max-height: calc(100svh - 24px);
  padding: 14px;
  overflow-y: auto;
  overscroll-behavior: contain;
  border-top: 0;
}

.ezra-cms-home-site-settings-drawer[hidden],
.ezra-cms-home-site-settings-drawer.is-closed {

  display: none !important;
}

.ezra-cms-home-site-settings-form,
.ezra-cms-home-site-settings-grid {

  display: grid;
  gap: 12px;
  min-width: 0;
}

.ezra-cms-home-site-settings-section {

  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 0 0 12px;
  border-bottom: 1px solid color-mix(in srgb, var(--border-color, currentColor) 18%, transparent);
}

.ezra-cms-home-site-settings-section:last-of-type {

  padding-bottom: 0;
  border-bottom: 0;
}

.ezra-cms-home-site-settings-section-title {

  margin: 0;
  color: color-mix(in srgb, var(--text-color, currentColor) 72%, transparent);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: 0;
  text-transform: uppercase;
}

.ezra-cms-home-site-settings-section-description {

  margin: -4px 0 0;
  max-width: 72ch;
}

.ezra-cms-home-site-settings-grid {

  grid-template-columns: minmax(0, 1fr);
}

.ezra-cms-home-site-settings-field,
.ezra-cms-home-site-settings-input {

  min-width: 0;
}

.ezra-cms-home-site-settings-help {

  max-width: 68ch;
}

.ezra-cms-home-site-settings-actions {

  display: flex;
  justify-content: flex-end;
  min-width: 0;
}

.ezra-cms-session-control {

  --ezra-cms-session-control-color: color-mix(in srgb, var(--text-color) 68%, transparent);
  --ezra-cms-session-control-border: color-mix(in srgb, var(--text-color) 10%, transparent);
  --ezra-cms-session-control-bg: color-mix(in srgb, var(--background-color) 97%, var(--text-color) 3%);
  --ezra-cms-session-control-fill: color-mix(in srgb, var(--text-color) 25%, transparent);
  --ezra-cms-switcher-parent-height: var(--ezra-app-surface-theme-switcher-parent-height, 62px);
  --ezra-cms-switcher-parent-inset: var(--ezra-app-surface-theme-switcher-parent-inset, 1px);
  --ezra-cms-switcher-chevron-width: var(--ezra-app-surface-theme-switcher-chevron-width, 51px);
  --ezra-cms-switcher-chevron-height: var(--ezra-app-surface-theme-switcher-chevron-height, 60px);
  --ezra-cms-session-control-chevron-width: var(--ezra-cms-switcher-chevron-width);
  --ezra-cms-session-control-trigger-inset: var(--ezra-cms-switcher-parent-inset);
  --ezra-ui-split-trigger-chevron-width: var(--ezra-cms-session-control-chevron-width);
  --ezra-ui-split-trigger-inset: var(--ezra-cms-session-control-trigger-inset);
  --ezra-ui-split-trigger-padding: 14px calc(var(--ezra-cms-session-control-chevron-width) + 16px) 12px 16px;
  --ezra-ui-split-trigger-font-family: var(--header-font);
  --ezra-ui-split-trigger-font-size: 1.05rem;
  --ezra-ui-split-trigger-font-weight: 700;
  --ezra-ui-split-trigger-line-height: 1;
  --ezra-ui-split-trigger-letter-spacing: 0.04em;
  --ezra-ui-split-trigger-text-transform: uppercase;
  --ezra-ui-split-trigger-text-align: left;
  --ezra-ui-split-trigger-copy-justify: start;
  --ezra-ui-split-trigger-height: var(--ezra-cms-switcher-parent-height);
  --ezra-ui-split-trigger-chevron-height: var(--ezra-cms-switcher-chevron-height);
  --ezra-cms-mode-switcher-surface: var(--ezra-cms-session-control-bg);
  --ezra-cms-mode-switcher-surface-hover: color-mix(
    in srgb,
    var(--ezra-cms-session-control-bg) 84%,
    var(--ezra-cms-session-control-color) 16%
  );
  --ezra-cms-mode-switcher-text: var(--ezra-cms-session-control-color);
  --ezra-cms-mode-switcher-border: var(--ezra-cms-session-control-border);
  --ezra-cms-mode-switcher-top-highlight: color-mix(in srgb, var(--ezra-cms-session-control-color) 6%, transparent);
  --ezra-cms-mode-switcher-divider: color-mix(in srgb, var(--ezra-cms-session-control-color) 12%, transparent);
  --ezra-ui-split-trigger-surface: var(--ezra-cms-mode-switcher-surface);
  --ezra-ui-split-trigger-hover-surface: var(--ezra-cms-mode-switcher-surface-hover);
  --ezra-ui-split-trigger-text: var(--ezra-cms-mode-switcher-text);
  --ezra-ui-split-trigger-border: var(--ezra-cms-mode-switcher-border);
  --ezra-ui-split-trigger-top-highlight: var(--ezra-cms-mode-switcher-top-highlight);
  --ezra-ui-split-trigger-divider: var(--ezra-cms-mode-switcher-divider);
  position: relative;
  z-index: var(--ezra-cms-layer-header-session, 100);
  display: grid;
  gap: 8px;
  width: 100%;
  min-width: 0;
}

.ezra-cms-session-control.is-pending {

  --ezra-cms-session-control-color: var(--button-background-color);
  --ezra-cms-session-control-border: color-mix(in srgb, var(--button-background-color) 55%, transparent);
  --ezra-cms-session-control-bg: color-mix(in srgb, var(--background-color) 90%, var(--button-background-color) 10%);
  --ezra-cms-session-control-fill: var(--yellow);
}

.ezra-cms-session-control.is-private {

  --ezra-cms-session-control-color: var(--h1-color, var(--text-color));
  --ezra-cms-session-control-border: color-mix(in srgb, var(--ezra-cms-session-control-color) 46%, transparent);
  --ezra-cms-session-control-bg: color-mix(in srgb, var(--background-color) 94%, var(--ezra-cms-session-control-color) 6%);
  --ezra-cms-session-control-fill: color-mix(in srgb, var(--ezra-cms-session-control-color) 30%, transparent);
}

.ezra-cms-session-control.is-publishing,
.ezra-cms-session-control.is-loading {

  --ezra-cms-session-control-color: var(--text-color);
  --ezra-cms-session-control-border: color-mix(in srgb, var(--text-color) 22%, transparent);
  --ezra-cms-session-control-bg: color-mix(in srgb, var(--background-color) 92%, var(--text-color) 8%);
  --ezra-cms-session-control-fill: color-mix(in srgb, var(--text-color) 30%, transparent);
}

.ezra-cms-session-control.is-conflict,
.ezra-cms-session-control.is-error {

  --ezra-cms-session-control-color: var(--danger-color, #b42318);
  --ezra-cms-session-control-border: color-mix(in srgb, var(--danger-color, #b42318) 55%, transparent);
  --ezra-cms-session-control-bg: color-mix(in srgb, var(--background-color) 90%, var(--danger-color, #b42318) 10%);
  --ezra-cms-session-control-fill: var(--danger-color, #b42318);
}

.ezra-cms-session-control-label {

  color: var(--label-color);
  font-family: var(--header-font);
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.ezra-cms-session-control-tree-item:focus-visible {

  outline: none;
  box-shadow: 0 0 0 2px var(--focus-ring);
}

.ezra-cms-session-control-menu {

  --ezra-ui-control-popup-border: var(--ezra-cms-session-control-border);
  --ezra-ui-control-popup-background: var(--ezra-cms-session-control-bg);
  --ezra-ui-control-popup-shadow: var(--ezra-app-surface-theme-collection-card-shadow);
  position: absolute;
  top: calc(100% - 1px);
  left: 0;
  z-index: 1;
  display: grid;
  gap: 12px;
  width: 100%;
  min-width: 0;
  padding: 12px;
  border-top: 0;
}

.ezra-cms-session-control-progress-shell,
.ezra-cms-session-control-footer,
.ezra-cms-session-control-tree,
.ezra-cms-session-control-tree-group,
.ezra-cms-session-control-maintenance,
.ezra-cms-session-control-secondary-actions,
.ezra-cms-session-control-summary,
.ezra-cms-session-control-issues {

  display: grid;
  gap: 10px;
}

.ezra-cms-session-control-progress-bar {

  width: 100%;
  height: 10px;
  border: 1px solid var(--panel-border);
  background: var(--surface-quiet);
  overflow: hidden;
  box-sizing: border-box;
}

.ezra-cms-session-control-progress-fill {

  display: block;
  height: 100%;
  background: var(--ezra-cms-session-control-fill);
  transition: width var(--ezra-surface-motion-duration-fast) var(--ezra-surface-motion-ease-fade);
}

.ezra-cms-session-control-progress-copy {

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--text-color);
  font-family: var(--header-font);
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ezra-cms-session-control-summary {

  --ezra-cms-session-control-summary-item-min-width: 88px;
  --ezra-cms-session-control-summary-item-max-width: 220px;
  grid-template-columns: repeat(
    auto-fill,
    minmax(
      var(--ezra-cms-session-control-summary-item-min-width),
      var(--ezra-cms-session-control-summary-item-max-width)
    )
  );
  justify-content: start;
  margin: 0;
}

.ezra-cms-session-control-summary-item {

  --ezra-cms-session-status-tone: var(--label-color);
  --ezra-cms-session-status-text: var(--ezra-cms-session-status-tone);
  --ezra-cms-session-status-border: color-mix(in srgb, var(--ezra-cms-session-status-tone) 46%, var(--panel-border));
  --ezra-cms-session-status-bg: color-mix(in srgb, var(--ezra-cms-session-status-tone) 8%, var(--surface-quiet));
  display: grid;
  gap: 3px;
  padding: 7px 9px;
  border: 1px solid var(--ezra-cms-session-status-border);
  background: var(--ezra-cms-session-status-bg);
}

.ezra-cms-session-control-summary-item.is-public,
.ezra-cms-session-control-summary-item.is-new,
.ezra-cms-session-control-summary-item.is-edited,
.ezra-cms-session-control-summary-item.is-updated,
.ezra-cms-session-control-summary-item.is-ready,
.ezra-cms-session-control-summary-item.is-change {
  --ezra-cms-session-status-tone: var(--ezra-cms-editorial-status-public-border);
  --ezra-cms-session-status-text: var(--ezra-cms-editorial-status-public-text);
  --ezra-cms-session-status-border: var(--ezra-cms-editorial-status-public-border);
  --ezra-cms-session-status-bg: var(--ezra-cms-editorial-status-public-background);
}

.ezra-cms-session-control-summary-item.is-private,
.ezra-cms-session-control-summary-item.is-draft,
.ezra-cms-session-control-summary-item.is-dirty {
  --ezra-cms-session-status-tone: var(--ezra-cms-editorial-status-private-border);
  --ezra-cms-session-status-text: var(--ezra-cms-editorial-status-private-text);
  --ezra-cms-session-status-border: var(--ezra-cms-editorial-status-private-border);
  --ezra-cms-session-status-bg: var(--ezra-cms-editorial-status-private-background);
}

.ezra-cms-session-control-summary-item.is-private.is-full,
.ezra-cms-session-control-summary-item.is-draft.is-full {
  --ezra-cms-session-status-border: color-mix(in srgb, var(--ezra-cms-session-status-tone) 56%, var(--panel-border));
  --ezra-cms-session-status-bg: color-mix(in srgb, var(--ezra-cms-session-status-tone) 8%, transparent);
}

.ezra-cms-session-control-summary-item.is-delete {
  --ezra-cms-session-status-tone: var(--ezra-cms-editorial-status-delete-border);
  --ezra-cms-session-status-text: var(--ezra-cms-editorial-status-delete-text);
  --ezra-cms-session-status-border: var(--ezra-cms-editorial-status-delete-border);
  --ezra-cms-session-status-bg: var(--ezra-cms-editorial-status-delete-background);
}

.ezra-cms-session-control-summary-item.is-public.is-full,
.ezra-cms-session-control-summary-item.is-new.is-full,
.ezra-cms-session-control-summary-item.is-edited.is-full,
.ezra-cms-session-control-summary-item.is-updated.is-full,
.ezra-cms-session-control-summary-item.is-ready.is-full,
.ezra-cms-session-control-summary-item.is-change.is-full {
  --ezra-cms-session-status-bg: color-mix(in srgb, var(--ezra-cms-session-status-tone) 12%, transparent);
}

.ezra-cms-session-control-summary-item.is-empty {
  --ezra-cms-session-status-bg: color-mix(in srgb, var(--ezra-cms-session-status-tone) 3%, transparent);
}

.ezra-cms-session-control-summary-item.is-half {
  --ezra-cms-session-status-bg: linear-gradient(
    to bottom,
    color-mix(in srgb, var(--ezra-cms-session-status-tone) 3%, transparent) 0 50%,
    color-mix(in srgb, var(--ezra-cms-session-status-tone) 10%, transparent) 50% 100%
  );
}

.ezra-cms-session-control-summary-item dt,
.ezra-cms-session-control-tree-group-label,
.ezra-cms-session-control-outcome-title,
.ezra-cms-session-control-issue-label {

  margin: 0;
  color: var(--ezra-cms-session-status-text, var(--label-color));
  font-family: var(--header-font);
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.ezra-cms-session-control-summary-item dd {

  margin: 0;
  color: var(--text-color);
  font-family: var(--header-font);
  font-size: 0.96rem;
  font-weight: 700;
  line-height: 1.1;
}

.ezra-cms-session-control-tree-items {

  --ezra-cms-session-control-tree-status-track: max(var(--ezra-ui-dot-size, 0.6rem), 0.72rem);
  position: relative;
  display: grid;
  gap: 0;
  margin-left: 8px;
  padding-left: 16px;
  border-left: 1px solid color-mix(in srgb, var(--text-color) 14%, transparent);
}

.ezra-cms-session-control-tree-item:last-child::after {

  content: "";
  position: absolute;
  z-index: 1;
  top: 50%;
  bottom: -8px;
  left: -17px;
  width: 3px;
  background: var(
    --ezra-cms-session-control-bg,
    color-mix(in srgb, var(--panel-color) 92%, var(--background-color) 8%)
  );
  pointer-events: none;
}

.ezra-cms-session-control-tree-item {

  position: relative;
  display: grid;
  grid-template-columns: var(--ezra-cms-session-control-tree-status-track) minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  width: 100%;
  min-width: 0;
  margin-left: -1px;
  padding: 7px 0 7px 2px;
  border: 0;
  background: transparent;
  color: var(--text-color);
  text-align: left;
  cursor: pointer;
  box-sizing: border-box;
}

.ezra-cms-session-control-tree-item::before {

  content: "";
  position: absolute;
  z-index: 0;
  top: 50%;
  left: -16px;
  width: 16px;
  border-top: 1px solid color-mix(in srgb, var(--text-color) 14%, transparent);
  transform: translateY(-50%);
  pointer-events: none;
}

.ezra-cms-session-control-tree-status-dot,
.ezra-cms-session-control-tree-item > .ezra-ui-dot {

  align-self: start;
  justify-self: center;
  margin-top: 0.34em;
}

.ezra-cms-session-control-tree-item-label {

  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--body-font);
  font-size: 0.95rem;
  line-height: 1.25;
}

.ezra-cms-session-control-tree-item-copy {

  display: grid;
  align-self: center;
  min-width: 0;
  max-width: 100%;
  gap: 2px;
}

.ezra-cms-session-control-tree-item-secondary-label {

  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted-color);
  font-size: 0.82rem;
  line-height: 1.2;
}

.ezra-cms-session-control-tree-item-tertiary-label {

  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted-color);
  font-size: 0.78rem;
  line-height: 1.2;
}

.ezra-cms-session-control-empty,
.ezra-cms-session-control-issue-detail,
.ezra-cms-session-control-outcome-text {

  margin: 0;
  color: var(--muted-color);
  font-size: 0.92rem;
  line-height: 1.35;
}

.ezra-cms-session-control-issue,
.ezra-cms-session-control-outcome {

  display: grid;
  gap: 6px;
  padding: 8px 10px;
  border: 1px solid var(--panel-border);
  background: color-mix(in srgb, var(--surface-quiet) 70%, transparent);
}

.ezra-cms-session-control-outcome.is-success {

  border-color: var(--message-success-border);
  background: var(--message-success-bg);
}

.ezra-cms-session-control-outcome.is-error {

  border-color: var(--message-error-border);
  background: var(--message-error-bg);
}

.ezra-cms-session-control-outcome-header {

  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 10px;
}

.ezra-cms-session-control-outcome-dismiss {

  --ezra-ui-control-button-size: 28px;
  --ezra-ui-control-button-background: transparent;
  --ezra-ui-control-button-border: color-mix(in srgb, currentColor 24%, transparent);
  --ezra-ui-control-button-text: currentColor;
  --ezra-ui-control-button-hover-background: color-mix(in srgb, currentColor 10%, transparent);
  flex: 0 0 auto;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
}

.ezra-cms-session-control-secondary-actions {

  grid-auto-flow: row;
}

.ezra-cms-session-control-maintenance {

  padding-top: 2px;
}

.ezra-cms-session-control-maintenance-summary {

  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--muted-color);
  font-family: var(--header-font);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
  list-style: none;
}

.ezra-cms-session-control-maintenance-summary::-webkit-details-marker,
.ezra-cms-session-control-maintenance-summary::marker {

  display: none;
  content: "";
}

.ezra-cms-session-control-maintenance-caret {

  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid currentColor;
  flex: 0 0 auto;
  transform: rotate(0deg);
  transform-origin: center;
}

.ezra-cms-session-control-maintenance[open] .ezra-cms-session-control-maintenance-caret {

  transform: rotate(var(--ezra-surface-motion-chevron-turn));
}

.ezra-cms-session-control-primary-button,
.ezra-cms-session-control-save-button,
.ezra-cms-session-control-secondary-button,
.ezra-cms-session-control-clear-button {

  width: 100%;
  justify-content: center;
}

@media (max-width: 1320px) {
  .ezra-cms-session-control {

      --ezra-cms-switcher-parent-height: var(--ezra-app-surface-theme-switcher-parent-height-compact, 58px);
      --ezra-cms-switcher-chevron-width: var(--ezra-app-surface-theme-switcher-chevron-width-compact, 48px);
      --ezra-cms-switcher-chevron-height: var(--ezra-app-surface-theme-switcher-chevron-height-compact, 56px);
  }

  .ezra-cms-session-control-trigger-button {

      --ezra-ui-split-trigger-padding: 13px calc(var(--ezra-cms-session-control-chevron-width) + 14px) 11px 14px;
  }
}

@media (max-width: 980px) {
  .ezra-cms-session-control {

      --ezra-cms-switcher-parent-height: var(--ezra-app-surface-theme-switcher-parent-height-mobile, 50px);
      --ezra-cms-switcher-chevron-width: var(--ezra-app-surface-theme-switcher-chevron-width-mobile, 46px);
      --ezra-cms-switcher-chevron-height: var(--ezra-app-surface-theme-switcher-chevron-height-mobile, 50px);
  }
}

@media (max-width: 860px) {
  .ezra-cms-session-control,
  .ezra-cms-session-control-menu {

      width: 100%;
      max-width: 100%;
  }

  .ezra-cms-session-control {

      --ezra-cms-switcher-parent-height: var(--ezra-app-surface-theme-switcher-parent-height-mobile, 50px);
      --ezra-cms-switcher-chevron-width: var(--ezra-app-surface-theme-switcher-chevron-width-mobile, 46px);
      --ezra-cms-switcher-chevron-height: var(--ezra-app-surface-theme-switcher-chevron-height-mobile, 50px);
  }

  .ezra-cms-session-control-trigger-button {

      --ezra-ui-split-trigger-padding: 11px 56px 10px 12px;
  }

  .ezra-cms-session-control .ezra-ui-split-trigger-chevron {

      top: 1px;
      right: 1px;
      bottom: 1px;
      width: 44px;
      min-width: 44px;
      min-height: 0;
      height: auto;
  }

  .ezra-cms-session-control .ezra-ui-split-trigger-chevron:focus-visible {

      box-shadow:
        inset 1px 0 0 var(--ezra-cms-mode-switcher-divider),
        inset 0 1px 0 var(--ezra-cms-mode-switcher-top-highlight),
        inset 0 0 0 1px var(--focus-ring);
  }

  .ezra-cms-session-control-menu {

      top: calc(100% - 1px);
      padding: 10px;
  }

  .ezra-cms-session-control-summary {

      grid-template-columns: repeat(
        auto-fit,
        minmax(var(--ezra-cms-session-control-summary-item-min-width), 1fr)
      );
  }
}

@media (max-width: 860px) {
  .ezra-cms-editor-actions--desktop {

      display: none;
  }

}




.ezra-cms-module-app {
  font-family: var(--ezra-ui-font-body, var(--body-font));
}

.ezra-cms-module-app .ezra-cms-mode-switcher {
  width: 100%;
}

.ezra-cms-module-app .ezra-cms-mode-switcher-mobile-shell {
  display: none;
}

.ezra-cms-module-app [hidden],
.ezra-cms-module-app [data-ezra-cms-session-control-menu][hidden],
.ezra-cms-module-app [data-ezra-cms-session-control-menu].is-closed {
  display: none !important;
}

.ezra-cms-module-app__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.ezra-cms-module-app__mode h2 {
  margin: 0;
}

.ezra-cms-module-app__mode {
  display: grid;
  gap: var(--ezra-cms-section-gap, 12px);
  min-width: 0;
}

.ezra-cms-module-app__split {
  display: grid;
  gap: var(--ezra-ui-split-layout-gap, var(--ezra-ui-grid-gap, 20px));
  align-items: start;
}

.ezra-cms-module-app__filter-bar {
  width: 100%;
}

.ezra-cms-module-app__filter-bar .ezra-ui-toolbar-action-button {
  white-space: nowrap;
}

.ezra-cms-module-app__document-list {
  display: grid;
  gap: 0.5rem;
  padding: 0;
  list-style: none;
}

.ezra-cms-module-app__document-list-item {
  display: block;
}

.ezra-cms-module-app [data-ezra-cms-reference-list-items],
.ezra-cms-module-app [data-ezra-cms-record-repeater-items] {
  display: contents;
}

.ezra-cms-module-app__editor {
  display: grid;
  gap: 0.75rem;
}

.ezra-cms-module-app__session {
  width: 100%;
  min-height: 22rem;
  margin-top: 1rem;
  font-family: var(--ezra-ui-font-code, var(--body-font));
}

@media (max-width: 760px) {
  .ezra-cms-module-app__split {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1120px) {
  .ezra-cms-module-app .ezra-cms-mode-switcher-main {
    display: none;
  }

  .ezra-cms-module-app .ezra-cms-mode-switcher-mobile-shell {
    display: grid;
  }
}