:root {
  --geo-primary: #2563eb;
  --geo-sidebar: #0f172a;
  --geo-sidebar-hover: #1e293b;
  --geo-accent: #06b6d4;
}
* { box-sizing: border-box; }
body { font-family: "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; background: #f1f5f9; margin: 0; }
.app-layout { display: flex; min-height: 100vh; }
.sidebar {
  width: 260px; background: var(--geo-sidebar); color: #e2e8f0;
  flex-shrink: 0; overflow-y: auto; position: fixed; height: 100vh; z-index: 100;
}
.sidebar-brand { padding: 1.25rem; border-bottom: 1px solid #334155; }
.sidebar-brand h1 { font-size: 1.1rem; margin: 0; color: #fff; font-weight: 700; }
.sidebar-brand small { color: #94a3b8; font-size: 0.75rem; }
.nav-section { padding: 0.5rem 0; }
.nav-section-admin-gap { margin-bottom: 0.75rem; padding-bottom: 0.25rem; border-bottom: 1px solid #334155; }
.nav-section-title {
  padding: 0.5rem 1.25rem; font-size: 0.7rem; text-transform: uppercase;
  letter-spacing: 0.05em; color: #64748b; font-weight: 600;
}
.nav-link {
  display: flex; align-items: center; gap: 0.6rem; padding: 0.65rem 1.25rem;
  margin: 2px 0;
  color: #cbd5e1; text-decoration: none; font-size: 0.875rem; border-left: 3px solid transparent;
  cursor: pointer; transition: all 0.15s;
  user-select: none;
}
.nav-link:hover, .nav-link.active {
  background: var(--geo-sidebar-hover); color: #fff; border-left-color: var(--geo-accent);
}
.nav-link i { font-size: 1rem; width: 1.25rem; text-align: center; }
.main-content { flex: 1; margin-left: 260px; min-height: 100vh; }
.topbar {
  background: #fff; border-bottom: 1px solid #e2e8f0; padding: 0.75rem 1.5rem;
  display: flex; align-items: center; justify-content: space-between; position: sticky; top: 0; z-index: 50;
}
.page-body { padding: 1.5rem; }
.metric-card {
  background: #fff; border-radius: 12px; padding: 1.25rem; border: 1px solid #e2e8f0;
  transition: box-shadow 0.2s;
}
.metric-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.06); }
.brand-list-card { display: flex; flex-direction: column; }
.brand-card-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 0.5rem; margin-bottom: 0.5rem;
}
.brand-card-title-wrap { cursor: pointer; flex: 1; min-width: 0; }
.brand-card-title { flex: 1; min-width: 0; }
.brand-card-title-wrap:hover .brand-card-title { color: var(--geo-primary); }
.brand-card-actions { display: flex; gap: 0.25rem; flex-shrink: 0; }
.brand-card-body { cursor: pointer; flex: 1; }
.brand-monitor-progress .progress { background: #e2e8f0; border-radius: 6px; }
.brand-monitor-progress .progress-bar { transition: width 0.35s ease; }
.perception-filter-group .btn { min-width: 56px; }
.factor-column {
  border-radius: 12px; padding: 0.75rem; min-height: 280px;
  background: #f8fafc; border: 1px solid #e2e8f0;
}
.factor-column-positive { border-top: 3px solid #22c55e; }
.factor-column-neutral { border-top: 3px solid #eab308; }
.factor-column-negative { border-top: 3px solid #ef4444; }
.factor-column-head {
  display: flex; justify-content: space-between; align-items: center;
  font-weight: 600; margin-bottom: 0.75rem; padding-bottom: 0.5rem; border-bottom: 1px solid #e2e8f0;
}
.factor-card {
  background: #fff; border-radius: 8px; padding: 0.75rem; margin-bottom: 0.5rem;
  border: 1px solid #e2e8f0; font-size: 0.85rem;
}
.factor-text { line-height: 1.5; color: #334155; }
.factor-meta { display: flex; justify-content: space-between; color: #94a3b8; font-size: 0.75rem; }
.overview-page .overview-hero {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap;
}
.overview-gauge-card { background: #f8fafc; border-radius: 12px; padding: 0.5rem; }
.overview-toolbar { padding-top: 0.75rem; padding-bottom: 0.75rem; }
.rate-card {
  background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 10px; padding: 0.85rem 1rem;
}
.suggestion-carousel {
  background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 10px; padding: 1rem; min-height: 180px;
}
.suggest-dots .dot {
  display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #cbd5e1; margin: 0 3px;
}
.suggest-dots .dot.active { background: #2563eb; }
.driver-mini { padding: 0.5rem; background: #f8fafc; border-radius: 8px; line-height: 1.45; }
.topic-cloud {
  min-height: 200px; padding: 1rem; text-align: center; line-height: 2.2;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%); border-radius: 8px;
}
.topic-word { display: inline-block; margin: 0.15rem 0.35rem; cursor: default; transition: transform 0.15s; }
.topic-word:hover { transform: scale(1.05); }
.citation-row {
  display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0; border-bottom: 1px solid #f1f5f9;
  font-size: 0.875rem;
}
.citation-rank { width: 1.5rem; color: #94a3b8; font-weight: 600; }
.citation-domain { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.citation-count { color: #64748b; white-space: nowrap; }
.prompt-output {
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.65;
  font-size: 0.9rem;
  max-height: none;
  overflow: visible;
}
.bg-success-subtle { background: #dcfce7 !important; }
.suggestion-desc { line-height: 1.65; white-space: pre-wrap; }
.suggestion-group-title { margin-bottom: 0.75rem; }
.suggestion-type-exposure { background: #dbeafe; color: #1e40af; }
.suggestion-type-prompt { background: #e0e7ff; color: #3730a3; }
.suggestion-type-sentiment { background: #dcfce7; color: #166534; }
.suggestion-type-citation { background: #fef3c7; color: #92400e; }
.suggestion-type-content { background: #f3e8ff; color: #6b21a8; }
.suggestion-type-competitor { background: #ffe4e6; color: #9f1239; }
.suggestion-type-monitor { background: #f1f5f9; color: #475569; }
.suggestion-type-geo { background: #cffafe; color: #0e7490; }
.metric-value { font-size: 1.75rem; font-weight: 700; color: #0f172a; }
.metric-label { font-size: 0.8rem; color: #64748b; margin-top: 0.25rem; }
.chart-box { background: #fff; border-radius: 12px; padding: 1.25rem; border: 1px solid #e2e8f0; margin-bottom: 1rem; }
.publish-channel-focus { border-color: #0d6efd !important; box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.25); }

/* 顶栏/表单内下拉：滚轮不改变选中项，避免误触发页面重载 */
.geo-no-wheel-select { pointer-events: auto; }
.geo-no-wheel-select:focus { outline: none; }
.publish-matrix-pick { cursor: pointer; transition: border-color 0.15s; }
.publish-matrix-pick:has(input:disabled) { cursor: default; }
.chart-container { height: 320px; }
.badge-sentiment-positive { background: #dcfce7; color: #166534; }
.badge-sentiment-neutral { background: #f1f5f9; color: #475569; }
.badge-sentiment-negative { background: #fee2e2; color: #991b1b; }
.quota-bar { height: 6px; border-radius: 3px; background: #e2e8f0; overflow: hidden; }
.quota-fill { height: 100%; background: linear-gradient(90deg, var(--geo-primary), var(--geo-accent)); border-radius: 3px; }
.alert-banner { background: linear-gradient(90deg, #fef3c7, #fde68a); border: 1px solid #f59e0b; border-radius: 8px; padding: 0.75rem 1rem; margin-bottom: 1rem; }
.snapshot-answer { background: #f8fafc; border-radius: 8px; padding: 1rem; line-height: 1.7; white-space: pre-wrap; }
.snapshot-answer mark { background: #fef08a; padding: 0 2px; }
.snapshot-create-success { background: #198754; color: #fff; padding: 0.5rem 0.75rem; border-radius: 8px; font-size: 0.875rem; font-weight: 500; }
.snapshot-modal-success { background: #198754; color: #fff; }
.snapshot-modal-success h6, .snapshot-modal-success p { color: #fff; }
.snapshot-card-fed { border-left: 4px solid #198754; }
.snapshot-feed-list .list-group-item { border-color: #e2e8f0; }
.template-card {
  border: 2px solid #e2e8f0; border-radius: 12px; padding: 1rem; cursor: pointer;
  transition: all 0.2s; height: 100%;
}
.template-card:hover, .template-card.selected { border-color: var(--geo-primary); background: #eff6ff; }
.media-card { border: 1px solid #e2e8f0; border-radius: 10px; padding: 1rem; margin-bottom: 0.75rem; }
.weight-high { color: #dc2626; font-weight: 600; }
.weight-medium { color: #d97706; }
.weight-low { color: #64748b; }
.ai-model-page .ai-config-form { max-width: 640px; }
.ai-monitor-modal .ai-monitor-test-pre {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 0.75rem 1rem;
  font-size: 0.85rem;
  max-height: 240px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
}
.token-stat-card {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 1rem 1.25rem;
  height: 100%;
}
.token-stat-card.token-card-primary { background: #eff6ff; border-color: #bfdbfe; }
.token-stat-card.token-card-success { background: #ecfdf5; border-color: #a7f3d0; }
.token-stat-label { font-size: 0.8rem; color: #64748b; margin-bottom: 0.35rem; }
.token-stat-value { font-size: 1.35rem; font-weight: 700; color: #0f172a; }

.geo-pipeline { display: flex; flex-direction: column; gap: 0.65rem; }
.geo-pipeline-step {
  display: flex; align-items: center; gap: 0.75rem;
  padding: 0.65rem 0.85rem; border: 1px solid #e2e8f0; border-radius: 8px; background: #fafbfc;
}
.geo-pipeline-step.done { border-color: #86efac; background: #f0fdf4; }
.geo-pipeline-step-link {
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s, background 0.15s;
}
.geo-pipeline-step-link:hover {
  border-color: #93c5fd;
  background: #eff6ff;
  box-shadow: 0 1px 4px rgba(37, 99, 235, 0.12);
}
.geo-pipeline-step-link:focus-visible {
  outline: 2px solid #3b82f6;
  outline-offset: 2px;
}
.geo-pipeline-num {
  width: 1.75rem; height: 1.75rem; border-radius: 50%; background: #e2e8f0;
  display: inline-flex; align-items: center; justify-content: center; font-size: 0.8rem; font-weight: 700;
}
.geo-pipeline-step.done .geo-pipeline-num { background: #22c55e; color: #fff; }
.geo-report-box { font-size: 0.85rem; line-height: 1.55; }

@media print {
  .sidebar, .topbar, .no-print { display: none !important; }
  .main-content { margin-left: 0 !important; }
  .page-body { padding: 0; }
}
@media (max-width: 768px) {
  .sidebar { transform: translateX(-100%); }
  .sidebar.show { transform: translateX(0); }
  .main-content { margin-left: 0; }
}