diff --git a/styles.css b/styles.css index 0c52ac0..aefaeb5 100644 --- a/styles.css +++ b/styles.css @@ -108,15 +108,15 @@ /* CSS Custom Properties - Material Design 3 inspired */ :root { /* Light theme (default) */ - --md-sys-color-primary: #1976D2; - --md-sys-color-primary-dark: #1565C0; - --md-sys-color-on-primary: #FFFFFF; - --md-sys-color-surface: #FAFAFA; - --md-sys-color-surface-container: #FFFFFF; + --md-sys-color-primary: #ffa31a; + --md-sys-color-primary-dark: #e8920f; + --md-sys-color-on-primary: #1b1b1b; + --md-sys-color-surface: #ffffff; + --md-sys-color-surface-container: #ffffff; --md-sys-color-surface-variant: #E3E3E3; - --md-sys-color-on-surface: #1C1B1F; - --md-sys-color-on-surface-variant: #49454F; - --md-sys-color-outline: #79747E; + --md-sys-color-on-surface: #1b1b1b; + --md-sys-color-on-surface-variant: #292929; + --md-sys-color-outline: #808080; --md-sys-color-outline-variant: #CAC4D0; --md-sys-color-background: #F5F5F5; --md-sys-color-error: #B3261E; @@ -141,21 +141,21 @@ /* Dark theme - follows system preference */ @media (prefers-color-scheme: dark) { :root { - --md-sys-color-primary: #90CAF9; - --md-sys-color-primary-dark: #64B5F6; - --md-sys-color-on-primary: #003258; - --md-sys-color-surface: #1E1E1E; - --md-sys-color-surface-container: #2D2D2D; - --md-sys-color-surface-variant: #3D3D3D; - --md-sys-color-on-surface: #E6E1E5; + --md-sys-color-primary: #ffa31a; + --md-sys-color-primary-dark: #e8920f; + --md-sys-color-on-primary: #1b1b1b; + --md-sys-color-surface: #1b1b1b; + --md-sys-color-surface-container: #292929; + --md-sys-color-surface-variant: #292929; + --md-sys-color-on-surface: #ffffff; --md-sys-color-on-surface-variant: #CAC4D0; - --md-sys-color-outline: #938F99; - --md-sys-color-outline-variant: #49454F; - --md-sys-color-background: #121212; + --md-sys-color-outline: #808080; + --md-sys-color-outline-variant: #404040; + --md-sys-color-background: #1b1b1b; --md-sys-color-error: #F2B8B5; --md-sys-color-success: #81C784; - --md-sys-color-preview-bg: #2D2D2D; - --md-sys-color-preview-pattern: #3D3D3D; + --md-sys-color-preview-bg: #292929; + --md-sys-color-preview-pattern: #1b1b1b; --md-sys-elevation-1: 0 1px 2px rgba(0,0,0,0.3), 0 1px 3px rgba(0,0,0,0.24); --md-sys-elevation-2: 0 2px 4px rgba(0,0,0,0.3), 0 4px 8px rgba(0,0,0,0.3);