:root,
html[data-theme="light"] {
	color-scheme: light;
	--app-bg: #F4F6F5;
	--app-bg-secondary: #ECEFED;
	--surface-1: #FFFFFF;
	--surface-2: #F7F9F8;
	--surface-3: #E9EEEB;
	--surface-elevated: #FFFFFF;
	--surface-glass: rgba(255, 255, 255, 0.88);
	--toolbar-bg: #EAF0F7;
	--toolbar-text: #18201C;
	--toolbar-muted: #607084;
	--header-glass-bg: rgba(238, 244, 251, 0.72);
	--header-glass-border: rgba(255, 255, 255, 0.76);
	--header-glass-button: rgba(255, 255, 255, 0.58);
	--header-glass-button-hover: rgba(255, 255, 255, 0.82);
	--header-glass-shadow: 0 10px 30px rgba(32, 51, 77, 0.09), inset 0 -1px 0 rgba(35, 55, 82, 0.06);
	--dashboard-bg: var(--surface-1);
	--dashboard-surface: var(--surface-2);
	--dashboard-text: var(--text-primary);
	--dashboard-muted: var(--text-secondary);
	--text-primary: #171C19;
	--text-secondary: #59645E;
	--text-muted: #7D8882;
	--text-disabled: #A1A9A4;
	--primary: #3D6FBA;
	--primary-hover: #335F9F;
	--primary-pressed: #284C82;
	--primary-soft: #E6EEF8;
	--primary-border: rgba(61, 111, 186, 0.24);
	--accent: #3D6FBA;
	--accent-soft: #E6EEF8;
	--border: rgba(21, 29, 24, 0.09);
	--border-strong: rgba(21, 29, 24, 0.15);
	--divider: rgba(21, 29, 24, 0.075);
	--bottom-bar: rgba(255, 255, 255, 0.82);
	--tabbar-bg: rgba(255, 255, 255, 0.58);
	--tabbar-border: rgba(255, 255, 255, 0.72);
	--tabbar-inner-border: rgba(22, 33, 48, 0.07);
	--tabbar-lens-bg: rgba(255, 255, 255, 0.64);
	--tabbar-lens-border: rgba(255, 255, 255, 0.82);
	--tabbar-lens-highlight: rgba(255, 255, 255, 0.72);
	--tabbar-text: #707C8D;
	--tabbar-active: var(--primary);
	--tabbar-shadow:
		0 16px 44px rgba(20, 29, 44, 0.15),
		0 4px 12px rgba(20, 29, 44, 0.08);
	--tabbar-lens-shadow:
		0 7px 20px rgba(36, 72, 125, 0.11),
		inset 0 1px 0 rgba(255, 255, 255, 0.78);
	--overlay: rgba(16, 22, 18, 0.42);
	--shadow-card: 0 4px 14px rgba(21, 29, 24, 0.045);
	--shadow-elevated: 0 12px 30px rgba(21, 29, 24, 0.08);
	--shadow-floating: 0 16px 40px rgba(21, 29, 24, 0.13);
	--app-font: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

html[data-theme="dark"] {
	color-scheme: dark;
	--app-bg: #191C1D;
	--surface-1: #25292B;
	--surface-2: #2C3133;
	--surface-3: #343A3C;
	--toolbar-bg: #3E506B;
	--toolbar-text: #FFFFFF;
	--toolbar-muted: #E8F0FA;
	--header-glass-bg: rgba(31, 38, 45, 0.68);
	--header-glass-border: rgba(255, 255, 255, 0.11);
	--header-glass-button: rgba(255, 255, 255, 0.07);
	--header-glass-button-hover: rgba(255, 255, 255, 0.12);
	--header-glass-shadow: 0 12px 34px rgba(0, 0, 0, 0.24), inset 0 -1px 0 rgba(255, 255, 255, 0.045);
	--dashboard-bg: var(--surface-1);
	--dashboard-surface: var(--surface-2);
	--dashboard-text: var(--text-primary);
	--dashboard-muted: var(--text-secondary);
	--text-primary: #F1F3F0;
	--text-secondary: #BEC5C0;
	--text-muted: #8F9892;
	--primary: #78A7F2;
	--primary-hover: #8AB5FF;
	--primary-pressed: #5D8DD6;
	--primary-soft: rgba(120, 167, 242, 0.17);
	--primary-border: rgba(120, 167, 242, 0.30);
	--accent: #78A7F2;
	--accent-soft: rgba(120, 167, 242, 0.17);
	--border: rgba(255, 255, 255, 0.09);
	--border-strong: rgba(255, 255, 255, 0.15);
	--divider: rgba(255, 255, 255, 0.075);
	--bottom-bar: rgba(37, 41, 43, 0.56);
	--tabbar-bg: rgba(42, 48, 45, 0.62);
	--tabbar-border: rgba(255, 255, 255, 0.13);
	--tabbar-inner-border: rgba(255, 255, 255, 0.055);
	--tabbar-lens-bg: rgba(68, 82, 104, 0.50);
	--tabbar-lens-border: rgba(255, 255, 255, 0.15);
	--tabbar-lens-highlight: rgba(255, 255, 255, 0.14);
	--tabbar-text: #AAB4C2;
	--tabbar-active: #8DB7F4;
	--tabbar-shadow:
		0 18px 48px rgba(0, 0, 0, 0.36),
		0 5px 16px rgba(0, 0, 0, 0.22);
	--tabbar-lens-shadow:
		0 8px 22px rgba(0, 0, 0, 0.22),
		inset 0 1px 0 rgba(255, 255, 255, 0.13);
	--overlay: rgba(0, 0, 0, 0.65);
	--shadow-card: 0 6px 20px rgba(0, 0, 0, 0.20);
	--shadow-elevated: 0 12px 34px rgba(0, 0, 0, 0.28);
	--shadow-floating: 0 16px 40px rgba(0, 0, 0, 0.34);
}

:root {
	--color-bg: var(--app-bg);
	--color-surface: var(--surface-1);
	--color-surface-soft: var(--surface-2);
	--color-text-primary: var(--text-primary);
	--color-text-secondary: var(--text-secondary);
	--color-text-muted: var(--text-muted);
	--color-primary: var(--primary);
	--color-primary-hover: var(--primary-hover);
	--color-primary-soft: var(--primary-soft);
	--color-border: var(--border);
	--color-divider: var(--divider);
	--color-overlay: var(--overlay);
	--surface-primary: var(--surface-1);
	--surface-secondary: var(--surface-2);
	--surface-tertiary: var(--surface-3);
	--header-bg: var(--toolbar-bg);
	--header-text: var(--toolbar-text);
	--hero-bg: var(--dashboard-bg);
	--hero-bg-secondary: var(--dashboard-surface);
	--hero-text: var(--dashboard-text);
	--hero-text-muted: var(--dashboard-muted);
	--border-default: var(--border);
	--app-text: var(--text-primary);
	--app-muted: var(--text-secondary);
	--app-soft: var(--text-muted);
	--app-accent: var(--primary);
	--app-accent-strong: var(--primary-hover);
	--app-accent-soft: var(--primary-soft);
	--app-border: var(--border);
	--app-shadow: var(--shadow-card);
	--app-radius: 18px;
}