@font-face {
	font-family: "Inter";
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url("../fonts/InterVariable.woff2") format("woff2");
}

@font-face {
	font-family: "Inter";
	font-style: italic;
	font-weight: 100 900;
	font-display: swap;
	src: url("../fonts/InterVariable-Italic.woff2") format("woff2");
}

/*
 * Preliminary tokens derived from the current Staging configuration.
 * They are intentionally centralized and are not a final brand redesign.
 */
:root {
	color-scheme: dark;
	font-optical-sizing: auto;
	--pc-color-brand: #ff5e59;
	--pc-color-brand-strong: #e94743;
	--pc-color-link: #ff706b;
	--pc-color-signal-cyan: var(--pc-color-success);
	--pc-color-success: #1bbc9b;
	--pc-color-warning: #ffd205;
	--pc-color-error: #e74c3c;
	--pc-brand-red-official: #ff5e58;
	--pc-brand-cyan-official: #5cf6ff;
	--pc-canvas-bg: #1b1d21;
	--pc-content-bg: #111216;
	--pc-shell-bg: var(--pc-content-bg);
	--pc-card-bg: #252930;
	--pc-color-bg: var(--pc-canvas-bg);
	--pc-color-surface: var(--pc-content-bg);
	--pc-color-surface-raised: var(--pc-card-bg);
	--pc-color-text: #ffffff;
	--pc-color-text-reading: color-mix(in srgb, var(--pc-color-text) 86%, var(--pc-content-bg));
	--pc-color-text-reading-dark: #f7f7f8;
	--pc-color-text-reading-secondary: color-mix(in srgb, var(--pc-color-text) 86%, var(--pc-content-bg));
	--pc-color-text-muted: #b9bec8;
	--pc-border-color: rgba(255, 255, 255, 0.09);
	--pc-color-border: var(--pc-border-color);
	--pc-table-header-bg: color-mix(in srgb, var(--pc-brand-red-official) 18%, var(--pc-content-bg));
	--pc-table-body-bg: var(--pc-content-bg);
	--pc-table-stripe-bg: var(--pc-canvas-bg);
	--pc-table-footer-bg: color-mix(in srgb, var(--pc-card-bg) 65%, var(--pc-content-bg));
	--pc-table-border: color-mix(in srgb, var(--pc-color-text-muted) 50%, var(--pc-content-bg));
	--pc-table-text: var(--pc-color-text-reading-dark);
	--pc-table-accent: var(--pc-brand-red-official);
	--pc-color-header: #0a0a0a;
	--pc-navigation-bg: #090a0c;
	--pc-shell-max: 1280px;
	--pc-layout-max: 1200px;
	--pc-article-max: 760px;
	--pc-sidebar-width: 320px;
	--pc-layout-gap: 32px;
	--pc-column-gap: var(--pc-layout-gap);
	--pc-shell-padding: 34px;
	--pc-site-shell-gap: 24px;
	--pc-site-shell-gap-start: var(--pc-site-shell-gap);
	--pc-site-shell-gap-end: var(--pc-site-shell-gap);
	--pc-fireplace-safe-width: 160px;
	--pc-header-height: 72px;
	--pc-header-height-compact: 58px;
	--pc-header-height-mobile: 60px;
	--pc-article-title-size: clamp(2.25rem, 1.375rem + 1.75vw, 2.875rem);
	--pc-article-title-leading: 1.12;
	--pc-page-title-size: clamp(2rem, 1.7rem + 1.4vw, 3rem);
	--pc-page-title-leading: 1.12;
	--pc-page-title-weight: 800;
	--pc-reading-font-family: var(--pc-font-sans);
	--pc-reading-font-size: clamp(1.02rem, 0.97rem + 0.18vw, 1.1rem);
	--pc-reading-font-size-mobile: 1.02rem;
	--pc-reading-font-weight: 400;
	--pc-reading-line-height: 1.65;
	--pc-reading-paragraph-gap: 1.25em;
	--pc-lead-font-size: clamp(1.08rem, 1.04rem + 0.2vw, 1.2rem);
	--pc-lead-font-weight: 600;
	--pc-lead-line-height: 1.65;
	--pc-lead-space-after: 1.5rem;
	--pc-h2-space-before: 44px;
	--pc-h2-space-after: 16px;
	--pc-label-radius: 4px;
	--pc-component-radius: 6px;
	--pc-space-1: 0.25rem;
	--pc-space-2: 0.5rem;
	--pc-space-3: 0.75rem;
	--pc-space-4: 1rem;
	--pc-space-5: 1.5rem;
	--pc-space-6: 2rem;
	--pc-space-7: 3rem;
	--pc-radius-1: 2px;
	--pc-radius-2: 6px;
	--pc-radius-3: 12px;
	--pc-radius-round: 999px;
	--pc-site-shell-radius: var(--pc-radius-2);
	--pc-font-sans: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--pc-shadow-card: 0 12px 35px rgba(0, 0, 0, 0.18);
	--pc-home-text-xs: 0.8125rem;
	--pc-home-text-sm: 0.9375rem;
	--pc-home-text-md: 1rem;
	--pc-home-title-card: clamp(1rem, 1.15vw, 1.125rem);
	--pc-home-title-section: clamp(1.625rem, 2.2vw, 1.875rem);
	--pc-home-leading-tight: 1.22;
	--pc-home-leading-copy: 1.55;
	--pc-home-gap-xs: 6px;
	--pc-home-gap-sm: 10px;
	--pc-home-gap-md: 16px;
	--pc-home-gap-lg: 24px;
	--pc-home-gap-section: clamp(44px, 4.5vw, 64px);
}

@media screen {
	html[data-theme="dark"] {
		--pc-color-text-reading: var(--pc-color-text-reading-dark);
	}
}

@media (min-width: 1344px) {
	:root {
		--pc-shell-max: 1344px;
		--pc-layout-max: 1276px;
		--pc-sidebar-width: 400px;
	}
}

@media (max-width: 991px) {
	:root {
		--pc-h2-space-before: 34px;
		--pc-h2-space-after: 14px;
	}
}

@media (max-width: 600px) {
	:root {
		--pc-site-shell-gap: 16px;
		--pc-site-shell-gap-start: 0px;
	}
}
