/* themes.css — Design tokens for maxim88login.com Single source of truth for colors, typography, spacing, radii. */ :root { /* Colors */ --bg-main: #FFFFFF; --bg-section: #F5F5F5; --bg-card: #FFFFFF; --chrome: #13242C; --chrome-alt: #19272F; --primary: #39B549; --primary-hover: #19723C; --accent: #DEC276; --accent-dark: #D19F22; --accent-bg: #FFFDF5; --success: #2BE53D; --text-body: #222222; --text-muted: #666666; --text-on-dark: #FFFFFF; --text-on-dark-muted: #DADADA; --border: #E5E5E5; --overlay: rgba(0, 0, 0, 0.5); /* Typography */ --font-body: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, sans-serif; --font-zh: 'Noto Sans SC', 'Inter', system-ui, sans-serif; --font-size-base: 16px; --font-size-sm: 14px; --font-size-lg: 18px; --font-size-xl: 22px; --font-size-2xl: 28px; --font-size-3xl: 36px; /* Spacing */ --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 24px; --space-6: 32px; --space-8: 48px; --space-10: 64px; /* Radii */ --radius-btn: 8px; --radius-card: 12px; --radius-pill: 999px; /* Shadows */ --shadow-sm: 0 1px 2px rgba(0,0,0,0.06), 0 1px 1px rgba(0,0,0,0.04); --shadow-md: 0 4px 12px rgba(0,0,0,0.08); --shadow-lg: 0 10px 30px rgba(0,0,0,0.12); /* Layout */ --app-width: 480px; --header-height: 56px; --bottom-bar-height: 64px; /* Transitions */ --ease: cubic-bezier(.4, 0, .2, 1); --dur-fast: 120ms; --dur-base: 200ms; } /* Chinese font stack override when */ html[lang="zh"] body { font-family: var(--font-zh); }