Spaces:
Running
Running
| :root { | |
| --bg: #0d1117; | |
| --surface: #161b22; | |
| --surface2: #1c2128; | |
| --border: #30363d; | |
| --border-focus: #58a6ff; | |
| --mineral: #4fc3f7; | |
| --gas: #69f0ae; | |
| --supply: #ffa726; | |
| --player: #58a6ff; | |
| --enemy: #f85149; | |
| --neutral: #8b949e; | |
| --text: #e6edf3; | |
| --text-muted: #8b949e; | |
| --text-dim: #484f58; | |
| --accent: #58a6ff; | |
| --success: #3fb950; | |
| --warning: #d29922; | |
| --danger: #f85149; | |
| --map-bg: #0b1a0b; | |
| --map-grid: rgba(255, 255, 255, 0.03); | |
| --radius: 8px; | |
| --radius-lg: 16px; | |
| --radius-xl: 24px; | |
| --font-mono: 'JetBrains Mono', 'Fira Code', 'Courier New', monospace; | |
| } | |
| *, *::before, *::after { | |
| box-sizing: border-box; | |
| margin: 0; | |
| padding: 0; | |
| } | |
| html { | |
| height: 100%; | |
| height: -webkit-fill-available; | |
| } | |
| body { | |
| height: 100%; | |
| min-height: -webkit-fill-available; | |
| background: var(--bg); | |
| color: var(--text); | |
| font-family: system-ui, -apple-system, sans-serif; | |
| overflow: hidden; | |
| overscroll-behavior: none; | |
| -webkit-tap-highlight-color: transparent; | |
| user-select: none; | |
| -webkit-user-select: none; | |
| } | |
| button { | |
| cursor: pointer; | |
| border: none; | |
| background: none; | |
| color: inherit; | |
| font: inherit; | |
| -webkit-tap-highlight-color: transparent; | |
| } | |
| input { | |
| font: inherit; | |
| color: inherit; | |
| } | |
| /* Scrollbar */ | |
| ::-webkit-scrollbar { width: 4px; } | |
| ::-webkit-scrollbar-track { background: var(--surface); } | |
| ::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; } | |
| /* Utility classes */ | |
| .mono { font-family: var(--font-mono); } | |
| .glow-mineral { text-shadow: 0 0 8px var(--mineral); } | |
| .glow-gas { text-shadow: 0 0 8px var(--gas); } | |
| .glow-danger { text-shadow: 0 0 8px var(--danger); } | |