diff --git a/frontend/src/style.css b/frontend/src/style.css index 3939d31..015020d 100644 --- a/frontend/src/style.css +++ b/frontend/src/style.css @@ -6,43 +6,43 @@ --font-display: "Space Grotesk", "Segoe UI", sans-serif; --font-mono: "IBM Plex Mono", Consolas, monospace; - --bg-0: #0d1417; - --bg-1: #172227; - --bg-2: #0a1012; - --ink-0: #edf6f3; - --ink-1: #cadbd6; - --ink-soft: #9cb2ab; + --bg-0: #32292f; + --bg-1: #3d3238; + --bg-2: #2a2027; + --ink-0: #ede8e6; + --ink-1: #c4bdb9; + --ink-soft: #8a827e; - --panel: #17252b; - --panel-2: #1f3138; - --line: #30464d; - --line-soft: #3d5962; + --panel: #362d33; + --panel-2: #3f343b; + --line: #4a3f46; + --line-soft: #42373e; - --brand: #2ec4b6; - --brand-strong: #20a79a; - --brand-contrast: #061412; - --ok: #5add94; - --warn: #f2b560; - --danger: #ff7d8f; - --danger-soft: #3a1f27; + --brand: #587792; + --brand-strong: #4a6780; + --brand-contrast: #f4f8fb; + --ok: #04650d; + --warn: #d49624; + --danger: #c44a5e; + --danger-soft: #3a2328; - --focus: #78f2e0; + --focus: #2ebfa5; --shadow-1: 0 14px 30px rgba(0, 0, 0, 0.34); --shadow-2: 0 22px 44px rgba(0, 0, 0, 0.45); - --bg-grad-a: #132129; + --bg-grad-a: #392e35; --bg-grad-b: var(--bg-0); --bg-grad-c: var(--bg-2); --live-dot: #ff6b6b; - --overlay-bg: rgba(4, 14, 18, 0.84); + --overlay-bg: rgba(26, 20, 23, 0.84); - --input-bg: #131f24; + --input-bg: #2d2429; --input-border: var(--line-soft); - --placeholder: #90a8a1; + --placeholder: #7a7270; - --badge-start: #35c8bb; - --badge-end: #1f8d85; + --badge-start: #2ebfa5; + --badge-end: #1a8c78; --radius-1: 0.6rem; --radius-2: 1rem; @@ -63,43 +63,43 @@ :root { color-scheme: light; - --bg-0: #f4f6ef; - --bg-1: #e3e8db; - --bg-2: #eff3ea; - --ink-0: #101b18; - --ink-1: #2d3a36; - --ink-soft: #5a6963; + --bg-0: #b4c4ae; + --bg-1: #a3b59c; + --bg-2: #c5d1c0; + --ink-0: #1a1f18; + --ink-1: #3a4037; + --ink-soft: #5c6358; - --panel: #fffffd; - --panel-2: #f7fbf2; - --line: #c6d1c5; - --line-soft: #d8e2d8; + --panel: #ffffff; + --panel-2: #f4f8f0; + --line: #9aad93; + --line-soft: #bcc8b5; - --brand: #005f73; - --brand-strong: #00464f; - --brand-contrast: #f9fffd; - --ok: #2f7a43; - --warn: #b76a00; + --brand: #587792; + --brand-strong: #4a6780; + --brand-contrast: #f4f8fb; + --ok: #04650d; + --warn: #a86200; --danger: #a7283f; --danger-soft: #fff3f6; - --focus: #0a9396; - --shadow-1: 0 14px 30px rgba(31, 54, 47, 0.12); - --shadow-2: 0 22px 44px rgba(20, 39, 35, 0.2); + --focus: #2ebfa5; + --shadow-1: 0 14px 30px rgba(50, 41, 47, 0.1); + --shadow-2: 0 22px 44px rgba(50, 41, 47, 0.16); - --bg-grad-a: #dce9d6; + --bg-grad-a: #c5d1c0; --bg-grad-b: var(--bg-0); - --bg-grad-c: #eff3ea; + --bg-grad-c: #d5e0d0; --live-dot: #cb271a; - --overlay-bg: rgba(0, 16, 19, 0.84); + --overlay-bg: rgba(26, 20, 23, 0.84); - --input-bg: #fff; - --input-border: #c2d2c1; - --placeholder: #74817b; + --input-bg: #ffffff; + --input-border: #bcc8b5; + --placeholder: #7a8274; - --badge-start: #0a9396; - --badge-end: #005f73; + --badge-start: #2ebfa5; + --badge-end: #1a8c78; } } @@ -472,7 +472,7 @@ select { } .live-label { - background: #d62828; + background: var(--live-dot); color: #fff; border-radius: 999px; padding: 0.1rem 0.45rem; @@ -637,8 +637,8 @@ select { } .admin-sidebar { - background: #102a2f; - color: #ecfff6; + background: var(--bg-2); + color: var(--ink-0); display: grid; grid-template-rows: auto auto 1fr; gap: var(--space-4); @@ -666,7 +666,7 @@ select { width: 100%; text-align: left; background: transparent; - color: #ddf8ee; + color: var(--ink-1); border: 1px solid transparent; border-radius: var(--radius-1); padding: 0.62rem 0.72rem;