diff --git a/client/src/App.css b/client/src/App.css index 8abb5ec..d908f6e 100644 --- a/client/src/App.css +++ b/client/src/App.css @@ -73,11 +73,11 @@ .map-container { position: relative; - background: #0a0e1a; + background: #2c2c2c; } .panel-container { - background: #0f172a; + background: #2c2c2c; overflow: hidden; display: flex; flex-direction: column; @@ -87,34 +87,37 @@ display: flex; gap: 0.25rem; padding: 0.5rem; - background: #1e293b; - border-bottom: 2px solid #334155; + background: #3b3b3b; + border-bottom: 3px solid #1a1a1a; overflow-x: auto; flex-shrink: 0; } .panel-tabs button { padding: 0.5rem 1rem; - border: none; - background: #334155; - color: #94a3b8; - border-radius: 0.375rem; + border: 2px solid #1a1a1a; + background: #5a5a5a; + color: #b0b0b0; + border-radius: 0; font-size: 0.875rem; - font-weight: 600; + font-weight: 700; cursor: pointer; - transition: all 0.2s; + transition: all 0.1s; white-space: nowrap; + font-family: 'Silkscreen', 'Courier New', monospace; + text-shadow: 1px 1px 0 #1a1a1a; + box-shadow: inset 0 -2px 0 #444, inset 0 2px 0 #777; } .panel-tabs button:hover { - background: #475569; + background: #6b6b6b; color: #e5e7eb; } .panel-tabs button.active { - background: #3b82f6; + background: #4a8c2a; color: white; - box-shadow: 0 0 8px rgba(59, 130, 246, 0.4); + box-shadow: inset 0 2px 0 #6ab04c, inset 0 -2px 0 #2d6b1a; } .panel-content-wrapper {