diff --git a/src/App.css b/src/App.css index c9bc240..38add50 100644 --- a/src/App.css +++ b/src/App.css @@ -330,3 +330,64 @@ font-family: monospace; letter-spacing: 0.1em; } + +/* Navigation */ +.main-nav { + display: flex; + align-items: center; + justify-content: space-between; + padding: 0.75rem 1.5rem; + border-bottom: 1px solid #c8b89a; + background: #f5f0e8; + position: sticky; + top: 0; + z-index: 10; +} + +.nav-title { + font-size: 0.85rem; + letter-spacing: 0.2em; + color: #6b5a3e; +} + +.nav-links { + display: flex; + gap: 8px; +} + +.nav-btn { + padding: 4px 14px; + border-radius: 12px; + border: 1px solid #c8b89a; + background: transparent; + color: #6b5a3e; + font-size: 0.78rem; + letter-spacing: 0.05em; + transition: background 0.15s; +} + +.nav-btn:hover { + background: #ede8df; +} + +.nav-btn.active { + background: #2a1f0e; + color: #f5f0e8; + border-color: #2a1f0e; +} + +/* Screen wrapper */ +.screen-wrap { + min-height: calc(100vh - 49px); +} + +/* Placeholder screens */ +.placeholder { + display: flex; + align-items: center; + justify-content: center; + height: calc(100vh - 49px); + font-style: italic; + color: #6b5a3e; + font-size: 0.85rem; +}