*, *::before, *::after {box-sizing: border-box; margin: 0; padding: 0;}
html {font-size: 15px; -webkit-text-size-adjust: 100%;}
body {font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: #1a1a2e; color: #eee; min-height: 100vh; display: flex; flex-direction: column; line-height: 1.5;}
a {color: #e94560; text-decoration: none;}
a:hover {text-decoration: underline;}

/* Nav */
.nav {background: #16213e; border-bottom: 1px solid #0f3460; position: sticky; top: 0; z-index: 100;}
.nav-inner {max-width: 1200px; margin: 0 auto; padding: 0 1rem; display: flex; align-items: center; height: 48px; gap: 1.5rem;}
.nav-brand {color: #e94560; font-weight: 700; font-size: 1.1rem; white-space: nowrap;}
.nav-brand:hover {text-decoration: none;}
.nav-links {display: flex; gap: 1rem; align-items: center; margin-left: auto;}
.nav-links a {color: #aaa; font-size: 0.9rem; padding: 0.25rem 0.5rem; border-radius: 4px; transition: color 0.2s;}
.nav-links a:hover, .nav-links a.active {color: #fff; text-decoration: none;}
.nav-links a.active {background: #0f3460;}
.nav-logout {color: #e94560 !important;}
.nav-toggle {display: none; background: none; border: none; color: #eee; font-size: 1.3rem; cursor: pointer;}

/* Container */
.container {max-width: 1200px; margin: 0 auto; padding: 1.5rem 1rem; flex: 1;}

/* Footer */
.footer {text-align: center; padding: 1rem; color: #555; font-size: 0.8rem; border-top: 1px solid #0f3460;}

/* Flash messages */
.flash {padding: 0.75rem 1rem; border-radius: 4px; margin-bottom: 1rem; font-size: 0.9rem;}
.flash-error {background: #3a1525; border: 1px solid #e94560; color: #e94560;}
.flash-info {background: #152a3a; border: 1px solid #0f3460; color: #7ab8e0;}
.flash-warning {background: #3a2a15; border: 1px solid #d4a053; color: #d4a053;}
.flash-success {background: #153a1a; border: 1px solid #4caf50; color: #4caf50;}

/* Headings */
h1 {font-size: 1.5rem; margin-bottom: 1rem; font-weight: 600;}
h2 {font-size: 1.2rem; margin-bottom: 0.75rem; font-weight: 600;}
h3 {font-size: 1rem; margin-bottom: 0.5rem; font-weight: 600; color: #aaa;}

/* Stats row */
.stats-row {display: flex; gap: 1rem; margin-bottom: 1.5rem; flex-wrap: wrap;}
.stat-card {background: #16213e; border: 1px solid #0f3460; border-radius: 6px; padding: 1rem 1.25rem; min-width: 140px; flex: 1;}
.stat-label {font-size: 0.75rem; color: #888; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 0.25rem;}
.stat-value {font-size: 1.4rem; font-weight: 700;}

/* Status colors */
.status-success {color: #4caf50;}
.status-partial {color: #d4a053;}
.status-failed {color: #e94560;}
.status-none {color: #555;}

/* Tables */
.table-wrap {overflow-x: auto; margin-bottom: 1rem;}
table {width: 100%; border-collapse: collapse; font-size: 0.85rem;}
thead th {background: #16213e; color: #aaa; text-align: left; padding: 0.6rem 0.75rem; font-weight: 600; text-transform: uppercase; font-size: 0.7rem; letter-spacing: 0.5px; border-bottom: 2px solid #0f3460; white-space: nowrap;}
tbody tr {border-bottom: 1px solid #222; transition: background 0.15s;}
tbody tr:nth-child(even) {background: rgba(15, 52, 96, 0.15);}
tbody tr:hover {background: rgba(15, 52, 96, 0.35);}
td {padding: 0.6rem 0.75rem; vertical-align: top;}
.td-title {max-width: 350px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.td-date {white-space: nowrap; color: #888;}

/* Badges */
.badge {display: inline-block; padding: 0.15rem 0.5rem; border-radius: 3px; font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.3px;}
.badge-market_signal {background: #1a3a5c; color: #7ab8e0;}
.badge-ai_tool {background: #2a1a4a; color: #b07ae0;}
.badge-dev_resource {background: #1a3a2a; color: #7ae0a0;}
.badge-trading_strategy {background: #3a2a1a; color: #e0b07a;}
.badge-agent_idea {background: #3a1a3a; color: #e07ab0;}
.badge-business_insight {background: #1a2a3a; color: #7ac0e0;}
.badge-wordpress {background: #1a2a3a; color: #7ab8e0;}
.badge-worth_remembering {background: #2a2a1a; color: #c0c07a;}
.badge-skip {background: #2a2a2a; color: #888;}
.badge-high {background: #3a1525; color: #e94560;}
.badge-medium {background: #3a2a15; color: #d4a053;}
.badge-low {background: #1a2a1a; color: #7ae07a;}

/* Filters */
.filters {display: flex; gap: 0.75rem; margin-bottom: 1rem; flex-wrap: wrap; align-items: center;}
.filters select {background: #16213e; border: 1px solid #0f3460; color: #eee; padding: 0.4rem 0.6rem; border-radius: 4px; font-size: 0.85rem; cursor: pointer;}
.filters select:focus {outline: none; border-color: #e94560;}

/* Buttons */
.btn {display: inline-block; padding: 0.5rem 1rem; border-radius: 4px; border: 1px solid #0f3460; background: #16213e; color: #eee; cursor: pointer; font-size: 0.85rem; transition: background 0.2s;}
.btn:hover {background: #0f3460; text-decoration: none;}
.btn-primary {background: #e94560; border-color: #e94560; color: #fff;}
.btn-primary:hover {background: #c23050;}
.btn-primary:disabled {opacity: 0.5; cursor: not-allowed;}
.btn-sm {padding: 0.3rem 0.6rem; font-size: 0.75rem;}
.btn-full {width: 100%;}
.btn-danger {background: #3a1525; border-color: #e94560; color: #e94560;}
.btn-danger:hover {background: #e94560; color: #fff;}

/* Login */
.login-wrap {display: flex; align-items: center; justify-content: center; min-height: 80vh;}
.login-box {background: #16213e; border: 1px solid #0f3460; border-radius: 8px; padding: 2rem; width: 100%; max-width: 380px;}
.login-box h1 {text-align: center; color: #e94560; margin-bottom: 1.5rem;}
.form-group {margin-bottom: 1rem;}
.form-group label {display: block; font-size: 0.8rem; color: #aaa; margin-bottom: 0.3rem;}
.form-group input {width: 100%; padding: 0.6rem 0.75rem; background: #1a1a2e; border: 1px solid #0f3460; border-radius: 4px; color: #eee; font-size: 0.9rem;}
.form-group input:focus {outline: none; border-color: #e94560;}

/* Settings */
.settings-grid {display: grid; gap: 1.5rem;}
.settings-section {background: #16213e; border: 1px solid #0f3460; border-radius: 6px; padding: 1.25rem;}
.setting-row {display: flex; justify-content: space-between; padding: 0.5rem 0; border-bottom: 1px solid #222; font-size: 0.9rem;}
.setting-row:last-child {border-bottom: none;}
.sources-subhead {display: flex; align-items: center; gap: 0.5rem; margin: 1.1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid #0f3460;}
.sources-subhead:first-of-type {margin-top: 0.25rem;}
.sources-subhead h3 {margin: 0; color: #aaa; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.8px; font-weight: 600;}
.sources-count {background: #0f3460; color: #7ab8e0; font-size: 0.7rem; font-weight: 600; padding: 0.1rem 0.5rem; border-radius: 10px; min-width: 1.4rem; text-align: center;}
.source-item {display: flex; flex-wrap: nowrap; align-items: center; gap: 0.75rem; padding: 0.7rem 0.85rem; background: #1a1a2e; border: 1px solid #0f3460; border-radius: 6px; margin-bottom: 0.4rem; transition: border-color 0.15s, background 0.15s;}
.source-item:hover {border-color: #1d4a7e; background: #1e1e36;}
.source-info {flex: 1 1 auto; min-width: 0; overflow: hidden;}
.source-title {font-size: 0.9rem; font-weight: 500; color: #eee; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.source-meta {font-size: 0.7rem; color: #666; font-family: ui-monospace, 'SF Mono', Menlo, monospace; margin-top: 0.15rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.source-action {margin: 0; flex: 0 0 auto;}
.toggle-pill {background: #153a1a; color: #4caf50; border: 1px solid #2d6e35; padding: 0.3rem 0.85rem; border-radius: 14px; font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.8px; cursor: pointer; min-width: 54px; transition: all 0.15s;}
.toggle-pill:hover {filter: brightness(1.15);}
.toggle-pill.off {background: #2a2a36; color: #777; border-color: #3a3a48;}
.btn-icon {display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; padding: 0; background: transparent; border: 1px solid #3a2a35; color: #888; border-radius: 4px; font-size: 1.3rem; line-height: 1; cursor: pointer; transition: all 0.15s;}
.btn-icon:hover {background: #e94560; color: #fff; border-color: #e94560;}
.empty-state {padding: 1rem; text-align: center; color: #666; font-size: 0.85rem; font-style: italic; background: #1a1a2e; border: 1px dashed #0f3460; border-radius: 6px;}
.add-list-form {margin-top: 1.5rem;}
.add-list-grid {display: grid; grid-template-columns: 1fr 180px auto; gap: 0.5rem; align-items: stretch;}
.add-list-grid input[type="text"] {padding: 0.55rem 0.75rem; background: #1a1a2e; border: 1px solid #0f3460; border-radius: 4px; color: #eee; font-size: 0.85rem;}
.add-list-grid input[type="text"]:focus {outline: none; border-color: #e94560;}
.add-list-grid button {white-space: nowrap; padding: 0.55rem 1.1rem;}
.help-text {margin-top: 0.6rem; font-size: 0.75rem; color: #666;}
.help-text code {background: #0f3460; padding: 0.1rem 0.4rem; border-radius: 3px; color: #7ab8e0; font-size: 0.72rem; font-family: ui-monospace, 'SF Mono', Menlo, monospace;}
.help-text code strong {color: #e94560;}
.nav-external {color: #7ab8e0 !important;}
.nav-external:hover {color: #a0d0f0 !important;}
@media (max-width: 560px) {
  .add-list-grid {grid-template-columns: 1fr;}
  .source-meta {display: none;}
}
.badge-list {display: flex; flex-wrap: wrap; gap: 0.5rem;}
.trigger-msg {margin-top: 0.75rem; font-size: 0.85rem;}
.trigger-msg.success {color: #4caf50;}
.trigger-msg.error {color: #e94560;}

/* Reports */
.report-section {background: #16213e; border: 1px solid #0f3460; border-radius: 6px; padding: 1.25rem; margin-bottom: 1rem;}
.report-section h2 {color: #e94560; margin-bottom: 0.75rem;}
.report-section h3 {margin-top: 0.75rem;}
.report-section ul {margin-left: 1.25rem; margin-bottom: 0.5rem;}
.report-section li {margin-bottom: 0.25rem; font-size: 0.9rem;}
.report-section p {font-size: 0.9rem; color: #ccc; margin-bottom: 0.5rem;}

/* Pipeline Log */
.pipeline-log-wrap {margin-top: 1rem; border: 1px solid #0f3460; border-radius: 6px; overflow: hidden;}
.pipeline-log-header {display: flex; justify-content: space-between; align-items: center; padding: 0.6rem 0.75rem; background: #0f3460; font-size: 0.8rem;}
.pipeline-step {font-weight: 600; color: #e94560;}
.pipeline-elapsed {color: #888; font-family: monospace;}
.pipeline-log {max-height: 320px; overflow-y: auto; padding: 0.5rem 0; background: #111827; font-family: 'SF Mono', 'Fira Code', monospace; font-size: 0.78rem; line-height: 1.6;}
.log-entry {display: flex; align-items: flex-start; padding: 0.15rem 0.75rem; gap: 0.5rem;}
.log-entry:hover {background: rgba(15, 52, 96, 0.2);}
.log-time {color: #555; min-width: 65px; flex-shrink: 0;}
.log-dot {width: 7px; height: 7px; border-radius: 50%; margin-top: 5px; flex-shrink: 0;}
.log-dot-init {background: #888;}
.log-dot-fetch {background: #7ab8e0;}
.log-dot-classify {background: #b07ae0;}
.log-dot-notion {background: #7ae0a0;}
.log-dot-complete {background: #4caf50;}
.log-dot-error {background: #e94560;}
.log-msg {color: #ccc;}
.log-entry.log-error .log-msg {color: #e94560;}
.log-entry.log-complete .log-msg {color: #4caf50; font-weight: 600;}

/* Misc */
.empty-state {color: #555; font-style: italic; padding: 2rem 0; text-align: center;}
.result-count {color: #555; font-size: 0.8rem; margin-top: 0.5rem;}

/* Mobile */
@media (max-width: 768px) {
.nav-links {display: none; position: absolute; top: 48px; left: 0; right: 0; background: #16213e; flex-direction: column; padding: 1rem; border-bottom: 1px solid #0f3460; gap: 0.5rem;}
.nav-links.open {display: flex;}
.nav-toggle {display: block; margin-left: auto;}
.stats-row {flex-direction: column;}
.stat-card {min-width: auto;}
.td-title {max-width: 180px;}
.filters {flex-direction: column;}
.filters select {width: 100%;}
.settings-grid {grid-template-columns: 1fr;}
}
