* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: Arial, sans-serif; background: #1a1a2e; color: #eee; display: flex; min-height: 100vh; }

#sidebar { width: 200px; background: #16213e; border-right: 2px solid #e94560; display: flex; flex-direction: column; overflow-y: auto; }
#sidebar > a { color: #64b5f6; text-decoration: none; padding: 15px 20px; border-left: 4px solid transparent; border-bottom: 1px solid #444; transition: all 0.3s; flex-shrink: 0; }
#sidebar > a img.menu-icon { width: 20px; height: 20px; margin-right: 12px; vertical-align: middle; }
#sidebar > a span.menu-text { vertical-align: middle; }
#sidebar > a.hidden { display: none; }
#sidebar > a:hover:not(.disabled) { background: #0f3460; border-left-color: #64b5f6; }
#sidebar > a.active { background: #1f2b47; color: #fff; border-left-color: #64b5f6; }
#sidebar > a.disabled { color: #555; cursor: not-allowed; pointer-events: none; }
#sidebar-spacer { flex: 1; min-height: 0; }

#content { flex: 1; padding: 20px; overflow-y: auto; }
.loading { text-align: center; padding: 50px; color: #666; }

.card { background: #16213e; padding: 15px; border-radius: 5px; border: 1px solid #333; margin: 10px 0; }

.tab-btn { padding: 8px 20px; background: #1a1a2e; color: #888; border: 1px solid #333; border-radius: 4px; cursor: pointer; font-size: 14px; }
.tab-btn:hover { background: #243b6a; color: #eee; }
.tab-btn.active { background: #e94560; color: #fff; border-color: #e94560; }

.data-table { width: 100%; border-collapse: collapse; }
.data-table th, .data-table td { padding: 8px; text-align: left; border-bottom: 1px solid #333; }
.data-table th { background: #0f3460; }

.btn-primary { padding: 10px 20px; background: #e94560; color: #fff; border: none; border-radius: 5px; cursor: pointer; }
.btn-primary:hover { background: #c73e4a; }

.character-card:hover { background: #243b6a !important; }

.error { color: #f44336; }
.success { color: #4caf50; }

#settings-footer { position: fixed; bottom: 0; left: 200px; right: 0; text-align: center; font-size: 0.75em; color: #777; padding: 8px 0; background: #1a1a2e; border-top: 1px solid #333; }
#settings-footer p { margin: 0; }