Spaces:
Running
Running
| .toolbar { | |
| height: 48px; | |
| background: #09091a; | |
| border-bottom: 1px solid #2a2a4a; | |
| display: flex; | |
| align-items: center; | |
| padding: 0 16px; | |
| gap: 20px; | |
| font-family: 'JetBrains Mono', monospace; | |
| flex-shrink: 0; | |
| } | |
| .toolbar-brand { | |
| display: flex; | |
| align-items: center; | |
| gap: 8px; | |
| } | |
| .brand-icon { | |
| font-size: 20px; | |
| color: #6666ff; | |
| filter: drop-shadow(0 0 6px #6666ff88); | |
| } | |
| .brand-name { | |
| font-size: 13px; | |
| font-weight: 800; | |
| color: #ddddff; | |
| letter-spacing: 3px; | |
| } | |
| .brand-sub { | |
| font-size: 9px; | |
| color: #444466; | |
| letter-spacing: 1px; | |
| } | |
| .mode-switcher { | |
| display: flex; | |
| gap: 4px; | |
| background: #13132a; | |
| padding: 4px; | |
| border-radius: 7px; | |
| border: 1px solid #2a2a4a; | |
| } | |
| .mode-btn { | |
| display: flex; | |
| align-items: center; | |
| gap: 6px; | |
| padding: 5px 14px; | |
| border-radius: 5px; | |
| border: none; | |
| background: transparent; | |
| color: #666688; | |
| cursor: pointer; | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 10px; | |
| font-weight: 700; | |
| letter-spacing: 1.5px; | |
| transition: all 0.2s; | |
| } | |
| .mode-btn:hover { color: #aaaacc; background: #1e1e3a; } | |
| .mode-btn--active { | |
| background: #1e1e4a; | |
| color: #aaaaff; | |
| box-shadow: 0 0 0 1px #5555cc44; | |
| } | |
| .mode-icon { font-size: 13px; } | |
| .toolbar-actions { | |
| margin-left: auto; | |
| display: flex; | |
| align-items: center; | |
| gap: 12px; | |
| } | |
| .scene-info { | |
| display: flex; | |
| gap: 6px; | |
| } | |
| .info-badge { | |
| padding: 3px 8px; | |
| background: #13132a; | |
| border: 1px solid #2a2a4a; | |
| border-radius: 3px; | |
| font-size: 9px; | |
| color: #666688; | |
| font-family: 'JetBrains Mono', monospace; | |
| } | |
| .info-badge.selected { | |
| border-color: #5555cc; | |
| color: #aaaaff; | |
| } | |
| .record-btn { | |
| padding: 6px 14px; | |
| border-radius: 5px; | |
| border: 1px solid #4a2a4a; | |
| background: #1e0e1e; | |
| color: #cc66cc; | |
| cursor: pointer; | |
| font-family: 'JetBrains Mono', monospace; | |
| font-size: 9px; | |
| font-weight: 700; | |
| letter-spacing: 1px; | |
| transition: all 0.2s; | |
| } | |
| .record-btn:hover { border-color: #cc44cc; color: #dd88dd; } | |
| .record-btn.recording { | |
| border-color: #ff4444; | |
| background: #2a0a0a; | |
| color: #ff6666; | |
| animation: pulse-record 1s infinite; | |
| } | |
| @keyframes pulse-record { | |
| 0%, 100% { opacity: 1; } | |
| 50% { opacity: 0.6; } | |
| } | |