/**
 * Design tokens from Figma (voyEJ37mA4ojH86oiCHCdy).
 */

:root {
	--en-color-page: #050607;
	--en-color-header: #0c0f12;
	--en-color-card: #11161b;
	--en-color-chip: #171d23;
	--en-color-notice: #092238;
	--en-color-notice-border: #063b60;
	--en-color-stock: #0e2b20;
	--en-color-text: #f5f8fa;
	--en-color-muted: #9caab6;
	--en-color-dim: #697783;
	--en-color-primary: #1098f7;
	--en-color-accent: #45b5ff;
	--en-color-success: #6ddba4;
	--en-color-warning: #f0c766;
	--en-color-mark: #e1262f;
	--en-color-border: #29323b;
	--en-color-border-strong: #3a4753;
	--en-color-overlay: rgba(18, 26, 34, 0.91);

	--en-font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
	--en-font-mono: "Roboto Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

	--en-radius-control: 4px;
	--en-radius-panel: 8px;
	--en-radius-card: 16px;
	--en-radius-frame: 24px;
	--en-radius-pill: 999px;

	--en-shadow-primary: 0 8px 30px rgba(16, 152, 247, 0.27);
	--en-shadow-card: 0 20px 44px rgba(0, 0, 0, 0.4);
	--en-shadow-summary: 0 20px 22px rgba(0, 0, 0, 0.4);

	--en-container: 1240px;
	--en-pad: 100px;
	--en-pad-mobile: 18px;

	--en-space-1: 4px;
	--en-space-2: 8px;
	--en-space-3: 12px;
	--en-space-4: 16px;
	--en-space-5: 22px;
	--en-space-6: 28px;
	--en-space-7: 36px;
	--en-space-8: 54px;
	--en-space-9: 72px;
	--en-space-10: 96px;

	--en-control-h: 50px;
	--en-icon-btn: 42px;
}

@media (max-width: 1279px) {
	:root {
		--en-pad: 40px;
	}
}

@media (max-width: 767px) {
	:root {
		--en-pad: var(--en-pad-mobile);
	}
}