| *, *::before, *::after { | |
| box-sizing: border-box; | |
| margin: 0; | |
| padding: 0; | |
| } | |
| :root { | |
| --bg-base: #111111; | |
| --bg-sidebar: #1a1a1a; | |
| --bg-card: #222222; | |
| --bg-input: #1e1e1e; | |
| --bg-step-icon: #2a2a2a; | |
| --accent: #f97316; | |
| --accent-hover: #ea6c0a; | |
| --accent-light: #fb923c; | |
| --accent-glow: rgba(249, 115, 22, 0.18); | |
| --text-primary: #f5f5f5; | |
| --text-secondary:#a3a3a3; | |
| --text-muted: #525252; | |
| --border: #2a2a2a; | |
| --border-light: #333333; | |
| --user-bubble: linear-gradient(135deg, #f97316, #ea580c); | |
| --radius: 12px; | |
| --radius-sm: 8px; | |
| --radius-full: 9999px; | |
| font-family: 'Inter', system-ui, sans-serif; | |
| font-size: 15px; | |
| line-height: 1.6; | |
| color: var(--text-primary); | |
| background: var(--bg-base); | |
| -webkit-font-smoothing: antialiased; | |
| } | |
| /* Light mode */ | |
| .light { | |
| --bg-base: #f5f5f5; | |
| --bg-sidebar: #efefef; | |
| --bg-card: #e8e8e8; | |
| --bg-input: #e8e8e8; | |
| --bg-step-icon: #ddd; | |
| --text-primary: #111111; | |
| --text-secondary:#555555; | |
| --text-muted: #888888; | |
| --border: #d4d4d4; | |
| --border-light: #c0c0c0; | |
| } | |
| body { | |
| height: 100dvh; | |
| overflow: hidden; | |
| } | |
| #root { | |
| height: 100dvh; | |
| display: flex; | |
| } | |
| button { font-family: inherit; cursor: pointer; border: none; outline: none; } | |
| textarea { font-family: inherit; resize: none; } | |
| ::-webkit-scrollbar { width: 5px; } | |
| ::-webkit-scrollbar-track { background: transparent; } | |
| ::-webkit-scrollbar-thumb { background: var(--border-light); border-radius: var(--radius-full); } | |