* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: #0f1117; color: #e0e0e0; }
a { color: #7c8aff; text-decoration: none; }
a:hover { text-decoration: underline; }

.navbar { display: flex; align-items: center; justify-content: space-between; padding: 0.75rem 1.5rem; background: #1a1d27; border-bottom: 1px solid #2a2d37; }
.nav-brand { font-size: 1.25rem; font-weight: 700; color: #fff; }
.nav-links { display: flex; gap: 1.5rem; }
.nav-links a { color: #888; font-size: 0.9rem; }
.nav-links a.active { color: #fff; }
.nav-logout { color: #ff6b6b !important; }

.container { max-width: 1200px; margin: 0 auto; padding: 1.5rem; }

.stats-row { display: flex; gap: 1rem; margin-bottom: 1.5rem; }
.stat-card { flex: 1; background: #1a1d27; border-radius: 8px; padding: 1.25rem; text-align: center; border: 1px solid #2a2d37; }
.stat-value { font-size: 2rem; font-weight: 700; color: #fff; }
.stat-label { font-size: 0.8rem; color: #888; margin-top: 0.25rem; }

h2 { margin: 1.5rem 0 0.75rem; font-size: 1.1rem; color: #ccc; }

.table { width: 100%; border-collapse: collapse; background: #1a1d27; border-radius: 8px; overflow: hidden; }
.table th { text-align: left; padding: 0.5rem 0.75rem; font-size: 0.75rem; color: #888; text-transform: uppercase; border-bottom: 1px solid #2a2d37; }
.table td { padding: 0.5rem 0.75rem; font-size: 0.85rem; border-bottom: 1px solid #1f2230; }

.badge { display: inline-block; padding: 0.15rem 0.5rem; border-radius: 4px; font-size: 0.75rem; font-weight: 600; background: #2a2d37; }
.badge-ok { background: #1a3a2a; color: #4ade80; }
.badge-warning { background: #3a3020; color: #fbbf24; }
.badge-critical, .badge-error { background: #3a1a1a; color: #f87171; }
.badge-pending { background: #2a2d37; color: #888; }

.btn { padding: 0.3rem 0.6rem; border: 1px solid #3a3d47; border-radius: 4px; background: #2a2d37; color: #ccc; cursor: pointer; font-size: 0.8rem; }
.btn:hover { background: #3a3d47; }
.btn-sm { padding: 0.2rem 0.4rem; font-size: 0.75rem; }
.inline-form { display: inline; }

.text-muted { color: #666; font-size: 0.85rem; }

/* Check detail */
.check-run { background: #1a1d27; border-radius: 8px; padding: 1rem; margin-bottom: 0.75rem; border-left: 3px solid #2a2d37; }
.check-run.run-ok { border-left-color: #4ade80; }
.check-run.run-warning { border-left-color: #fbbf24; }
.check-run.run-critical { border-left-color: #f87171; }
.run-header { display: flex; gap: 1rem; align-items: center; font-size: 0.85rem; color: #888; }
.findings-list { list-style: none; margin-top: 0.75rem; }
.finding { padding: 0.5rem 0; border-top: 1px solid #1f2230; }
.finding p { font-size: 0.8rem; color: #888; margin-top: 0.25rem; }
.fix-detail { color: #4ade80 !important; }

/* Login */
.login-page { display: flex; align-items: center; justify-content: center; min-height: 100vh; }
.login-card { background: #1a1d27; border-radius: 12px; padding: 2rem; width: 320px; text-align: center; border: 1px solid #2a2d37; }
.login-card h1 { font-size: 1.5rem; margin-bottom: 0.25rem; }
.login-subtitle { color: #888; font-size: 0.85rem; margin-bottom: 1.5rem; }
.login-card input { display: block; width: 100%; padding: 0.6rem; margin-bottom: 0.75rem; background: #0f1117; border: 1px solid #2a2d37; border-radius: 6px; color: #e0e0e0; font-size: 0.9rem; }
.login-card button { width: 100%; padding: 0.6rem; background: #7c8aff; border: none; border-radius: 6px; color: #fff; font-weight: 600; cursor: pointer; font-size: 0.9rem; }
.login-card button:hover { background: #6b7bff; }
.alert-error { background: #3a1a1a; color: #f87171; padding: 0.5rem; border-radius: 4px; margin-bottom: 1rem; font-size: 0.85rem; }

/* Chat */
.chat-container { display: flex; flex-direction: column; height: calc(100vh - 120px); }
.chat-messages { flex: 1; overflow-y: auto; padding: 1rem 0; }
.chat-welcome { text-align: center; padding: 2rem; color: #888; }
.chat-bubble { max-width: 80%; padding: 0.75rem 1rem; border-radius: 12px; margin-bottom: 0.5rem; font-size: 0.9rem; line-height: 1.5; }
.chat-bubble.user { background: #2a3a5a; margin-left: auto; border-bottom-right-radius: 4px; }
.chat-bubble.assistant { background: #1a1d27; margin-right: auto; border-bottom-left-radius: 4px; }
.chat-bubble.tool { background: #1a2a1a; margin-right: auto; font-family: monospace; font-size: 0.8rem; border-left: 3px solid #4ade80; }
.chat-bubble.error { background: #3a1a1a; color: #f87171; }
.chat-input-row { display: flex; gap: 0.5rem; padding: 0.75rem 0; }
.chat-input-row input { flex: 1; padding: 0.6rem; background: #1a1d27; border: 1px solid #2a2d37; border-radius: 8px; color: #e0e0e0; font-size: 0.9rem; }
.chat-input-row button { padding: 0.6rem 1.5rem; background: #7c8aff; border: none; border-radius: 8px; color: #fff; font-weight: 600; cursor: pointer; }