@import url("https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,400;9..40,500&display=swap");

:root {
	--fy-color-bg: #f4f7f9;
	--fy-color-bg-dark: #2e3440;
	--fy-color-bg-ink: #232933;
	--fy-color-surface: #ffffff;
	--fy-color-surface-soft: #f4f7f9;
	--fy-color-surface-warm: #eef3f6;
	--fy-color-surface-strong: #dce5ec;
	--fy-color-heading: #2e3440;
	--fy-color-text: #2e3440;
	--fy-color-muted: #667581;
	--fy-color-border: #dce5ec;
	--fy-color-border-strong: #bdcbd5;
	--fy-color-primary: #5f7080;
	--fy-color-primary-hover: #4d5d6c;
	--fy-color-primary-contrast: #ffffff;
	--fy-color-secondary: #2e3440;
	--fy-color-secondary-hover: #232933;
	--fy-color-accent: #f47920;
	--fy-color-accent-hover: #ff9147;
	--fy-color-action: var(--fy-color-accent);
	--fy-color-action-hover: var(--fy-color-accent-hover);
	--fy-color-action-contrast: var(--fy-color-secondary);
	--fy-color-badge: var(--fy-color-accent);
	--fy-color-badge-contrast: var(--fy-color-secondary);
	--fy-color-link: #526779;
	--fy-color-link-hover: #b94700;
	--4yt-card-bg: var(--fy-color-surface);
	--4yt-card-text: var(--fy-color-text);
	--4yt-card-text-muted: var(--fy-color-muted);
	--4yt-card-heading: var(--fy-color-heading);
	--4yt-card-accent: var(--fy-color-primary);
	--4yt-card-border: color-mix(in srgb, var(--fy-color-border) 86%, transparent);
	--4yt-card-badge-bg: var(--fy-color-badge);
	--4yt-card-badge-text: var(--fy-color-badge-contrast);
	--4yt-card-icon: var(--fy-color-primary);
	--4yt-card-link: var(--fy-color-link);
	--4yt-card-callout-bg: color-mix(in srgb, var(--fy-color-primary) 12%, transparent);
	--4yt-card-callout-text: var(--fy-color-heading);
	--4yt-nav-mobile-bg: #2e3440;
	--4yt-nav-mobile-text: #ffffff;
	--4yt-nav-mobile-muted: #dce5ec;
	--4yt-nav-mobile-accent: var(--fy-color-accent);
	--4yt-nav-mobile-hover: #ff9a52;
	--4yt-nav-mobile-focus: color-mix(in srgb, var(--fy-color-primary) 46%, transparent);
	--4yt-nav-mobile-overlay: rgb(35 41 51 / 0.76);
	--4yt-nav-toggle-color: #ffffff;
	--4yt-nav-close-color: #ffffff;
	--fy-color-success: #15803d;
	--fy-color-warning: #c77800;
	--fy-color-danger: #b42318;
	--fy-color-info: #0f6f8f;
	--fy-color-violet: #6f3dc2;
	--fy-color-success-soft: #e9f8ee;
	--fy-color-warning-soft: #fff3d8;
	--fy-color-danger-soft: #fff0ee;
	--fy-color-info-soft: #e7f5f8;
	--fy-color-violet-soft: #f1ecfb;
	--fy-font-family: DM Sans, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
	--fy-font-family-heading: var(--fy-font-family);
	--fy-font-weight-hero: 500;
	--fy-font-weight-heading: 500;
	--fy-font-weight-card-title: 500;
	--fy-font-weight-navigation: 500;
	--fy-font-weight-body: 400;
	--fy-font-weight-button: 500;
	--fy-font-weight-badge: 500;
	--fy-font-weight-meta: 400;
	--fy-font-size-xs: 0.78rem;
	--fy-font-size-sm: 0.875rem;
	--fy-font-size-base: 1rem;
	--fy-font-size-lg: 1.125rem;
	--fy-font-size-xl: 1.5rem;
	--fy-font-size-2xl: 2rem;
	--fy-line-height: 1.55;
	--fy-line-height-hero: 1.05;
	--fy-line-height-title: 1.1;
	--fy-line-height-subtitle: 1.2;
	--fy-line-height-tight: var(--fy-line-height-title);
	--fy-letter-spacing-nav: 0.06em;
	--fy-letter-spacing-label: 0.1em;
	--fy-letter-spacing-button: 0.035em;
	--fy-letter-spacing-badge: 0.035em;
	--fy-space-1: 0.25rem;
	--fy-space-2: 0.5rem;
	--fy-space-3: 0.75rem;
	--fy-space-4: 1rem;
	--fy-space-5: 1.25rem;
	--fy-space-6: 1.5rem;
	--fy-space-8: 2rem;
	--fy-space-10: 2.5rem;
	--fy-space-12: 3rem;
	--fy-space-16: 4rem;
	--fy-container-sm: 760px;
	--fy-container-md: 960px;
	--fy-container-lg: 1200px;
	--fy-container-xl: 1380px;
	--fy-radius-sm: 0.35rem;
	--fy-radius-md: 0.55rem;
	--fy-radius-lg: 0.9rem;
	--fy-radius-xl: 1.25rem;
	--fy-shadow-sm: 0 4px 14px rgb(46 52 64 / 0.07);
	--fy-shadow-md: 0 18px 45px rgb(46 52 64 / 0.12);
	--fy-shadow-lg: 0 32px 80px rgb(46 52 64 / 0.2);
	--fy-button-height: 2.75rem;
	--fy-button-height-sm: 2.25rem;
	--fy-button-padding-x: 1.15rem;
	--fy-transition-fast: 160ms ease;
	--fy-transition-medium: 240ms ease;
}

:root[data-fy-color-scheme="dark"] {
		--fy-color-bg: #232933;
		--fy-color-surface: #2e3440;
		--fy-color-surface-soft: #38424e;
		--fy-color-surface-warm: #414d59;
		--fy-color-surface-strong: #5f7080;
		--fy-color-heading: #ffffff;
		--fy-color-text: #eef3f6;
		--fy-color-muted: #bdcbd5;
		--fy-color-border: #52606d;
		--fy-color-border-strong: #718291;
		--fy-color-primary: #8193a3;
		--fy-color-primary-hover: #9aabb9;
		--fy-color-primary-contrast: #202630;
		--fy-color-accent: #f47920;
		--fy-color-accent-hover: #ff9147;
		--fy-color-action: var(--fy-color-accent);
		--fy-color-action-hover: var(--fy-color-accent-hover);
		--fy-color-action-contrast: #202630;
		--fy-color-badge: var(--fy-color-accent);
		--fy-color-badge-contrast: #202630;
		--fy-color-link: #ff9a52;
		--fy-color-link-hover: #ffb47d;
		--4yt-card-bg: var(--fy-color-surface);
		--4yt-card-text: var(--fy-color-text);
		--4yt-card-text-muted: var(--fy-color-muted);
		--4yt-card-heading: var(--fy-color-heading);
		--4yt-card-accent: var(--fy-color-primary);
		--4yt-card-border: color-mix(in srgb, var(--fy-color-border) 86%, transparent);
		--4yt-card-badge-bg: color-mix(in srgb, var(--fy-color-primary) 18%, transparent);
		--4yt-card-badge-text: #ffffff;
		--4yt-card-icon: var(--fy-color-primary);
		--4yt-card-link: var(--fy-color-link);
		--4yt-card-callout-bg: color-mix(in srgb, var(--fy-color-primary) 14%, transparent);
		--4yt-card-callout-text: var(--fy-color-heading);
		--4yt-nav-mobile-bg: #2e3440;
		--4yt-nav-mobile-text: #ffffff;
		--4yt-nav-mobile-muted: #dce5ec;
		--4yt-nav-mobile-accent: var(--fy-color-accent);
		--4yt-nav-mobile-hover: #ff9a52;
		--4yt-nav-mobile-focus: color-mix(in srgb, var(--fy-color-primary) 50%, transparent);
		--4yt-nav-mobile-overlay: rgb(3 8 14 / 0.78);
		--4yt-nav-toggle-color: #ffffff;
		--4yt-nav-close-color: #ffffff;
		--fy-color-success-soft: #113821;
		--fy-color-warning-soft: #3a2a0b;
		--fy-color-danger-soft: #3b1716;
		--fy-color-info-soft: #0f3542;
		--fy-color-violet-soft: #251d3f;
}