/* Candidate detail page (moved from templates/candidates/detail.html inline <style>) */
/* Candidate Header */
.candidate-header-content {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-xl);
}

.candidate-header-info {
    flex: 1;
}

.candidate-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-sm);
}

.candidate-meta-item {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--font-size-base);
    color: var(--color-text-secondary);
}

.candidate-meta-item i {
    font-size: var(--font-size-sm);
    opacity: 0.7;
}

.candidate-bio {
    margin-top: var(--spacing-md);
    margin-bottom: 0;
    font-size: var(--font-size-base);
    color: var(--color-text-secondary);
    line-height: 1.6;
    max-width: 600px;
}

@media (max-width: 576px) {
    .candidate-header-content {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .candidate-meta {
        justify-content: center;
    }

    .candidate-bio {
        text-align: left;
    }
}

/* ========== BATTLE DASHBOARD STYLES ========== */

/* Battle Metrics Grid */
.battle-metrics-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-md);
}

.battle-metric {
    background: linear-gradient(135deg, var(--color-surface) 0%, #f8fafc 100%);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    padding: var(--spacing-lg);
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    position: relative;
    overflow: hidden;
}

.battle-metric::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
}

.battle-metric.momentum::before { background: linear-gradient(90deg, #22c55e, #10b981); }
.battle-metric.viral::before { background: linear-gradient(90deg, #f97316, #ef4444); }
.battle-metric.controversy::before { background: linear-gradient(90deg, #eab308, #f59e0b); }
.battle-metric.attacks::before { background: linear-gradient(90deg, #8b5cf6, #6366f1); }

.battle-metric .metric-icon {
    width: 56px;
    height: 56px;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
}

.battle-metric.momentum .metric-icon { background: rgba(34, 197, 94, 0.1); color: #22c55e; }
.battle-metric.viral .metric-icon { background: rgba(249, 115, 22, 0.1); color: #f97316; }
.battle-metric.controversy .metric-icon { background: rgba(234, 179, 8, 0.1); color: #eab308; }
.battle-metric.attacks .metric-icon { background: rgba(139, 92, 246, 0.1); color: #8b5cf6; }

.metric-content {
    flex: 1;
}

.metric-score {
    font-size: 2rem;
    font-weight: var(--font-weight-bold);
    line-height: 1;
    color: var(--color-text-primary);
}

.metric-label {
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
    margin-top: var(--spacing-xs);
}

.metric-trend {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    margin-top: var(--spacing-xs);
}

.metric-trend.trend-up { color: #22c55e; }
.metric-trend.trend-down { color: #ef4444; }
.metric-trend.trend-stable { color: var(--color-text-muted); }

.metric-badge {
    display: inline-block;
    font-size: var(--font-size-xs);
    background: rgba(249, 115, 22, 0.1);
    color: #f97316;
    padding: 2px 8px;
    border-radius: var(--radius-full);
    margin-top: var(--spacing-xs);
}

.metric-status {
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
    margin-top: var(--spacing-xs);
}

/* PK Section */
.pk-section {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    padding: var(--spacing-xl);
}

.pk-header {
    text-align: center;
    margin-bottom: var(--spacing-lg);
}

.pk-title {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.pk-title i { color: var(--color-primary); }

.pk-arena {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-xl);
    margin-bottom: var(--spacing-xl);
}

.pk-candidate {
    text-align: center;
    flex: 1;
    max-width: 150px;
}

.pk-avatar {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    border: 4px solid;
    background: var(--color-background);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto var(--spacing-sm);
    overflow: hidden;
}

.pk-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pk-avatar i {
    font-size: 2rem;
    color: var(--color-text-muted);
}

.pk-name {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-bold);
    color: var(--color-text-primary);
}

.pk-party {
    font-size: var(--font-size-sm);
}

.pk-vs {
    font-size: 2rem;
    font-weight: var(--font-weight-black);
    color: var(--color-primary);
}

.pk-comparison {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-lg);
}

.pk-stat {
    display: grid;
    grid-template-columns: 80px 1fr 120px;
    align-items: center;
    gap: var(--spacing-md);
}

.pk-stat-label {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    text-align: right;
}

.pk-bar-container {
    display: flex;
    height: 24px;
    border-radius: var(--radius-full);
    overflow: hidden;
    background: var(--color-border);
}

.pk-bar {
    height: 100%;
    transition: width 0.5s ease;
}

.pk-bar-self {
    background: linear-gradient(90deg, #22c55e, #10b981);
}

.pk-bar-opponent {
    background: linear-gradient(90deg, #3b82f6, #6366f1);
}

.pk-stat-values {
    display: flex;
    justify-content: space-between;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
}

.pk-value-self { color: #22c55e; }
.pk-value-opponent { color: #3b82f6; }

.pk-verdict {
    text-align: center;
    padding: var(--spacing-md);
    background: var(--color-primary-bg);
    border-radius: var(--radius-lg);
    color: var(--color-primary);
    font-weight: var(--font-weight-semibold);
}

.pk-verdict i {
    color: #f59e0b;
    margin-right: var(--spacing-xs);
}

/* ===== Multi-Candidate PK Styles ===== */
.pk-subtitle {
    display: block;
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
    margin-top: var(--spacing-xs);
}

.pk-candidates-row {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-xl);
    flex-wrap: wrap;
}

.pk-candidate-item {
    text-align: center;
    text-decoration: none;
    color: inherit;
    transition: transform 0.2s;
}

.pk-candidate-item:hover {
    transform: scale(1.05);
}

.pk-candidate-current {
    position: relative;
}

.pk-candidate-current::after {
    content: "YOU";
    position: absolute;
    top: -8px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--color-primary);
    color: white;
    font-size: 0.6rem;
    padding: 2px 6px;
    border-radius: var(--radius-sm);
    font-weight: bold;
}

.pk-avatar-sm {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 3px solid;
    background: var(--color-background);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto var(--spacing-xs);
    overflow: hidden;
}

.pk-avatar-sm img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pk-avatar-sm i {
    font-size: 1.5rem;
    color: var(--color-text-muted);
}

.pk-candidate-name {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    color: var(--color-text-primary);
}

.pk-candidate-party {
    font-size: 0.7rem;
}

.pk-vs-sm {
    font-size: 1rem;
    font-weight: var(--font-weight-bold);
    color: var(--color-text-muted);
}

.pk-multi-comparison {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
    margin-bottom: var(--spacing-lg);
}

.pk-stat-row {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.pk-stat-row .pk-stat-label {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-secondary);
    text-align: left;
}

.pk-bars-multi {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.pk-bar-row {
    display: grid;
    grid-template-columns: 110px 1fr 70px;
    align-items: center;
    gap: var(--spacing-sm);
    padding: 3px 6px;
    border-radius: 6px;
    transition: background-color 0.2s ease;
}

.pk-row-current {
    background-color: rgba(99, 102, 241, 0.08);
    border-left: 3px solid #6366f1;
}

.pk-bar-name-col {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    min-width: 0;
}

.pk-color-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
}

.pk-self-badge {
    font-size: 0.6rem !important;
    padding: 1px 4px !important;
    border-radius: 4px;
    font-weight: 700;
    line-height: 1.2;
}

.pk-bar-name {
    font-size: 0.8rem;
    color: var(--color-text-secondary);
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pk-bar-name-current {
    font-weight: var(--font-weight-bold);
    color: var(--color-text-primary);
}

.pk-bar-track {
    height: 18px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: var(--radius-full);
    overflow: hidden;
}

.pk-bar-fill {
    height: 100%;
    border-radius: var(--radius-full);
    transition: width 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    min-width: 4px;
}

.pk-bar-value {
    font-size: 0.8rem;
    font-weight: var(--font-weight-bold);
    color: var(--color-text-primary);
    text-align: left;
    white-space: nowrap;
}

/* ===== Unified Gated CTA (Purple-Pink Gradient) ===== */
.pk-gated-cta,
.kol-unlock-cta,
.gated-unlock-btn,
.versus-unlock-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-top: var(--spacing-sm);
    padding: 0.625rem 1.25rem;
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    color: white;
    border-radius: var(--radius-md);
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 4px 12px rgba(139, 92, 246, 0.3);
    transition: all 0.2s ease;
}

.pk-gated-cta:hover,
.kol-unlock-cta:hover,
.gated-unlock-btn:hover,
.versus-unlock-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(139, 92, 246, 0.4);
}

.pk-gated-cta i,
.kol-unlock-cta i,
.gated-unlock-btn i,
.versus-unlock-cta i {
    font-size: 0.8rem;
}

/* ===== KOL Inline Section (Always Open) ===== */
.kol-inline-section {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.kol-inline-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--spacing-lg);
    flex-wrap: wrap;
    gap: var(--spacing-sm);
}

.kol-inline-title {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--color-text-primary);
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    margin: 0;
}

.kol-inline-title i {
    color: #ec4899;
}

.kol-summary-badges {
    display: flex;
    gap: var(--spacing-sm);
}

.kol-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.625rem;
    border-radius: var(--radius-full);
    font-size: 0.75rem;
    font-weight: 600;
}

.kol-badge--ally {
    background: rgba(34, 197, 94, 0.1);
    color: #16a34a;
}

.kol-badge--opponent {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
}

.kol-inline-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-lg);
    margin-bottom: var(--spacing-lg);
}

@media (max-width: 768px) {
    .kol-inline-grid {
        grid-template-columns: 1fr;
    }
}

.kol-item--gated {
    position: relative;
    opacity: 0.7;
}

/* Key Moments Timeline */
.moments-timeline {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.moment-item {
    display: flex;
    gap: var(--spacing-md);
    padding: var(--spacing-md);
    border-radius: var(--radius-lg);
    background: var(--color-background);
    border-left: 4px solid;
}

.moment-item.moment-viral { border-left-color: #ef4444; }
.moment-item.moment-turning_point { border-left-color: #f97316; }
.moment-item.moment-defense { border-left-color: #22c55e; }
.moment-item.moment-attack { border-left-color: #8b5cf6; }

.moment-item.impact-high { background: linear-gradient(90deg, rgba(239, 68, 68, 0.05) 0%, transparent 100%); }

.moment-icon {
    width: 44px;
    height: 44px;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    flex-shrink: 0;
}

.moment-viral .moment-icon { background: rgba(239, 68, 68, 0.1); color: #ef4444; }
.moment-turning_point .moment-icon { background: rgba(249, 115, 22, 0.1); color: #f97316; }
.moment-defense .moment-icon { background: rgba(34, 197, 94, 0.1); color: #22c55e; }
.moment-attack .moment-icon { background: rgba(139, 92, 246, 0.1); color: #8b5cf6; }

.moment-content { flex: 1; }

.moment-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--spacing-xs);
}

.moment-date {
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
}

.moment-mentions {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    background: var(--color-surface);
    padding: 2px 8px;
    border-radius: var(--radius-full);
}

.moment-title {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    margin: 0 0 var(--spacing-xs);
    color: var(--color-text-primary);
}

.moment-description {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: 0;
    line-height: 1.5;
}

/* Controversies */
.controversies-list {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.controversy-item {
    display: flex;
    gap: var(--spacing-md);
    padding: var(--spacing-md);
    border-radius: var(--radius-lg);
    background: var(--color-background);
}

.controversy-item.severity-low { border-left: 4px solid #eab308; }
.controversy-item.severity-medium { border-left: 4px solid #f97316; }
.controversy-item.severity-high { border-left: 4px solid #ef4444; }

.controversy-status {
    flex-shrink: 0;
}

.status-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--font-size-xs);
    padding: 4px 10px;
    border-radius: var(--radius-full);
    font-weight: var(--font-weight-medium);
}

.status-badge.active { background: rgba(239, 68, 68, 0.1); color: #ef4444; }
.status-badge.fading { background: rgba(234, 179, 8, 0.1); color: #ca8a04; }
.status-badge.resolved { background: rgba(34, 197, 94, 0.1); color: #22c55e; }

.controversy-content { flex: 1; }

.controversy-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--spacing-xs);
}

.controversy-date {
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
}

.controversy-mentions {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

.controversy-title {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    margin: 0 0 var(--spacing-xs);
    color: var(--color-text-primary);
}

.controversy-summary {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: 0;
    line-height: 1.5;
}

/* Battle Dashboard Responsive */
@media (max-width: 992px) {
    .battle-metrics-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .battle-metrics-grid {
        grid-template-columns: 1fr;
    }

    .pk-arena {
        flex-direction: column;
        gap: var(--spacing-md);
    }

    .pk-vs {
        font-size: 1.5rem;
    }

    .pk-stat {
        grid-template-columns: 1fr;
        gap: var(--spacing-xs);
    }

    .pk-stat-label {
        text-align: left;
    }

    .pk-stat-values {
        justify-content: center;
        gap: var(--spacing-xl);
    }
}

/* ===== 動態雙欄 Grid ===== */
.dynamics-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-md);
}

.dynamics-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.dynamics-card-header {
    padding: var(--spacing-sm) var(--spacing-md);
    border-bottom: 1px solid var(--color-border);
    background: var(--color-bg);
}

.dynamics-card-title {
    font-size: 0.9rem;
    font-weight: 600;
    margin: 0;
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.dynamics-card-title i {
    font-size: 1rem;
}

.dynamics-focus .dynamics-card-title { color: #3b82f6; }
.dynamics-topics .dynamics-card-title { color: #8b5cf6; }

.dynamics-card-body {
    padding: var(--spacing-md);
    flex: 1;
}

.dynamics-empty {
    color: var(--color-text-muted);
    font-size: 0.85rem;
    text-align: center;
    padding: var(--spacing-lg) 0;
    margin: 0;
}

/* 今日焦點 */
.focus-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.focus-item {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm);
    border-radius: var(--radius-md);
    background: var(--color-bg);
    font-size: 0.85rem;
    line-height: 1.4;
}

.focus-item i {
    flex-shrink: 0;
    margin-top: 2px;
}

.focus-item.focus-positive i { color: #22c55e; }
.focus-item.focus-negative i { color: #ef4444; }
.focus-item.focus-neutral i { color: #6b7280; }
.focus-item.focus-alert i { color: #f59e0b; }

/* 議題分析 */
.topic-cluster-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.topic-cluster-item {
    padding: var(--spacing-sm);
    border-radius: var(--radius-md);
    background: var(--color-bg);
    border-left: 3px solid var(--color-border);
}

.topic-cluster-item.sentiment-positive { border-left-color: #22c55e; }
.topic-cluster-item.sentiment-negative { border-left-color: #ef4444; }
.topic-cluster-item.sentiment-neutral { border-left-color: #6b7280; }

.cluster-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--spacing-xs);
}

.cluster-name {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--color-text);
}

.cluster-count {
    font-size: 0.7rem;
    color: var(--color-text-muted);
    background: var(--color-surface);
    padding: 2px 6px;
    border-radius: var(--radius-sm);
}

.cluster-summary {
    font-size: 0.8rem;
    color: var(--color-text-secondary);
    margin: 0;
    line-height: 1.4;
}

@media (max-width: 992px) {
    .dynamics-grid {
        grid-template-columns: 1fr;
    }
}

/* ========== END BATTLE DASHBOARD STYLES ========== */

/* Quick Stats Row - Polished Design */
.stats-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-lg);
}

.stat-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    transition: transform var(--transition-fast), box-shadow var(--transition-fast);
    border-left: 4px solid var(--color-primary);
}

.stat-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.stat-card .stat-icon {
    width: 52px;
    height: 52px;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    background: linear-gradient(135deg, var(--color-primary-bg), rgba(124, 92, 255, 0.08));
    color: var(--color-primary);
}

.stat-card.positive {
    border-left-color: #22c55e;
}
.stat-card.positive .stat-icon {
    background: linear-gradient(135deg, rgba(34, 197, 94, 0.15), rgba(34, 197, 94, 0.08));
    color: #22c55e;
}

.stat-card.negative {
    border-left-color: #ef4444;
}
.stat-card.negative .stat-icon {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.15), rgba(239, 68, 68, 0.08));
    color: #ef4444;
}

.stat-card.neutral {
    border-left-color: #6b7280;
}
.stat-card.neutral .stat-icon {
    background: linear-gradient(135deg, rgba(107, 114, 128, 0.15), rgba(107, 114, 128, 0.08));
    color: #6b7280;
}

.stat-card .stat-content {
    display: flex;
    flex-direction: column;
}

.stat-card .stat-number {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-text-primary);
    line-height: 1.2;
}

.stat-card .stat-label {
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
}

/* Trend Indicators */
.stat-card .stat-trend {
    font-size: var(--font-size-xs);
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 2px;
    margin-top: 4px;
    padding: 2px 6px;
    border-radius: var(--radius-sm);
    background: rgba(107, 114, 128, 0.1);
    color: var(--color-text-muted);
}

.stat-card .stat-trend.trend-up {
    background: rgba(34, 197, 94, 0.1);
    color: #22c55e;
}

.stat-card .stat-trend.trend-down {
    background: rgba(239, 68, 68, 0.1);
    color: #ef4444;
}

.stat-card .stat-trend.trend-stable {
    background: rgba(107, 114, 128, 0.1);
    color: #6b7280;
}

.stat-card .stat-trend i {
    font-size: 1rem;
}

/* Alert Badge for Stats Card */
.stat-card {
    position: relative;
}

.stat-alert-badge {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    background: #ef4444;
    color: white;
    animation: pulse-alert 2s infinite;
}

.stat-alert-badge.alert-green {
    background: #22c55e;
    animation: none;
}

@keyframes pulse-alert {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.1); opacity: 0.8; }
}

/* Alert Border Colors for Stat Card */
.stat-card.alert-red {
    border-color: #ef4444;
    box-shadow: 0 0 0 1px rgba(239, 68, 68, 0.2);
}

.stat-card.alert-green {
    border-color: #22c55e;
    box-shadow: 0 0 0 1px rgba(34, 197, 94, 0.2);
}

.stat-card.alert-yellow {
    border-color: #f59e0b;
}

@media (max-width: 992px) {
    .stats-row {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .stats-row {
        grid-template-columns: 1fr;
    }
}

/* Source Distribution Pie Chart */
/* Combined Voice Overview Grid */
.voice-overview-grid {
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: var(--spacing-xl);
    align-items: start;
}

/* Single column layout (after SOV merged to Command Center) */
.voice-overview-single {
    display: block;
}

.voice-overview-single .voice-source-section {
    border-left: none;
    padding-left: 0;
    max-width: 600px;
}

.subsection-title {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-secondary);
    margin-bottom: var(--spacing-md);
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.subsection-title i {
    font-size: var(--font-size-sm);
    opacity: 0.7;
}

.voice-sov-section {
    min-width: 0;
}

.voice-source-section {
    border-left: 1px solid var(--color-border);
    padding-left: var(--spacing-xl);
}

.source-chart-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-md);
}

.source-pie-chart {
    width: 160px;
    height: 160px;
    flex-shrink: 0;
}

.source-legend {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
    width: 100%;
}

.source-legend-item {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.source-legend .legend-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex-shrink: 0;
}

.source-legend .legend-dot.news { background: #3b82f6; }
.source-legend .legend-dot.social { background: #a855f7; }
.source-legend .legend-dot.other { background: #6b7280; }

.source-legend .legend-label {
    flex: 1;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.source-legend .legend-value {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    color: var(--color-text-primary);
}

@media (max-width: 768px) {
    .voice-overview-grid {
        grid-template-columns: 1fr;
        gap: var(--spacing-lg);
    }

    .voice-source-section {
        border-left: none;
        border-top: 1px solid var(--color-border);
        padding-left: 0;
        padding-top: var(--spacing-lg);
    }

    .source-chart-wrapper {
        flex-direction: row;
        justify-content: center;
        gap: var(--spacing-xl);
    }

    .source-pie-chart {
        width: 140px;
        height: 140px;
    }
}

/* Source Analysis (合併版) */
.source-analysis-row {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.source-overall,
.source-negative {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.source-section-label {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    font-weight: var(--font-weight-medium);
}

.driver-badge {
    padding: 2px var(--spacing-xs);
    border-radius: var(--radius-sm);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
}

.driver-badge.badge-media {
    background: rgba(59, 130, 246, 0.1);
    color: #2563eb;
}

.driver-badge.badge-social {
    background: rgba(168, 85, 247, 0.1);
    color: #9333ea;
}

.source-bar-horizontal {
    display: flex;
    height: 32px;
    border-radius: var(--radius-md);
    overflow: hidden;
    background: var(--color-border);
}

.source-segment {
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    min-width: 40px;
    transition: width 0.3s ease;
}

.source-segment.news { background: #3b82f6; }
.source-segment.social { background: #a855f7; }
.source-segment.other { background: #6b7280; }

.source-segment .segment-pct {
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.source-legend-inline {
    display: flex;
    gap: var(--spacing-lg);
    margin-top: var(--spacing-sm);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

.source-legend-inline .legend-item {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.source-legend-inline .legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.source-legend-inline .legend-dot.news { background: #3b82f6; }
.source-legend-inline .legend-dot.social { background: #a855f7; }
.source-legend-inline .legend-dot.other { background: #6b7280; }

/* Concentration Card (單獨顯示) */
.concentration-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.concentration-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--color-background);
    border-bottom: 1px solid var(--color-border);
}

.concentration-title {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    margin: 0;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.concentration-title i {
    color: var(--color-primary);
}

.concentration-body {
    padding: var(--spacing-md);
}

.concentration-info {
    display: flex;
    align-items: baseline;
    gap: var(--spacing-sm);
    margin-top: var(--spacing-sm);
}

.concentration-ratio {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-text-primary);
}

.concentration-desc {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

@media (max-width: 768px) {
    .source-legend-inline {
        flex-wrap: wrap;
        gap: var(--spacing-md);
    }

    .concentration-info {
        flex-direction: column;
        gap: var(--spacing-xs);
    }
}

/* 輿情透視 Two-Column Grid */
.insight-grid {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: var(--spacing-xl);
    align-items: start;
}

.insight-col-left,
.insight-col-right {
    min-width: 0;
}

/* Source Charts - Stacked Vertically */
.source-charts-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--spacing-md);
}

.insight-section-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.insight-section-title {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    margin: 0 0 var(--spacing-xs);
}

.insight-section-title i {
    color: var(--color-primary);
    font-size: var(--font-size-sm);
}

.insight-section-subtitle {
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
    margin: 0 0 var(--spacing-md);
}

/* Topic Cards (右側熱議話題) */
.insight-col-right {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.topic-card {
    border-radius: var(--radius-lg);
    padding: var(--spacing-md);
    transition: transform var(--transition-fast), box-shadow var(--transition-fast);
}

.topic-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.topic-card-negative {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.08), rgba(239, 68, 68, 0.04));
    border: 1px solid rgba(239, 68, 68, 0.2);
}

.topic-card-positive {
    background: linear-gradient(135deg, rgba(34, 197, 94, 0.08), rgba(34, 197, 94, 0.04));
    border: 1px solid rgba(34, 197, 94, 0.2);
}

.topic-card-trending {
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.08), rgba(59, 130, 246, 0.04));
    border: 1px solid rgba(59, 130, 246, 0.2);
}

.topic-card-header {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    margin-bottom: var(--spacing-sm);
}

.topic-card-negative .topic-card-header { color: #dc2626; }
.topic-card-positive .topic-card-header { color: #16a34a; }
.topic-card-trending .topic-card-header { color: #2563eb; }

.topic-card-header .topic-count {
    margin-left: auto;
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    opacity: 0.8;
}

.topic-keywords {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-xs);
    margin-bottom: var(--spacing-sm);
}

.topic-keyword {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px var(--spacing-sm);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
}

.topic-card-negative .topic-keyword {
    background: rgba(239, 68, 68, 0.15);
    color: #b91c1c;
}

.topic-card-positive .topic-keyword {
    background: rgba(34, 197, 94, 0.15);
    color: #15803d;
}

.topic-card-trending .topic-keyword {
    background: rgba(59, 130, 246, 0.15);
    color: #1d4ed8;
}

.keyword-delta {
    font-size: var(--font-size-xs);
    color: #2563eb;
    font-weight: var(--font-weight-bold);
}

.topic-summary {
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
    margin: 0;
    line-height: 1.5;
}

@media (max-width: 768px) {
    .insight-grid {
        grid-template-columns: 1fr;
        gap: var(--spacing-lg);
    }

    .insight-col-right {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .topic-card {
        flex: 1 1 280px;
    }
}

/* ========== AI + CTA COMBINED SECTION ========== */
.ai-cta-combined {
    background: linear-gradient(135deg, rgba(124, 92, 255, 0.03) 0%, rgba(99, 102, 241, 0.05) 100%);
    border: 1px solid rgba(124, 92, 255, 0.15);
    border-radius: var(--radius-xl);
    padding: var(--spacing-xl);
    margin-bottom: var(--spacing-xl);
}

.ai-quick-section {
    margin-bottom: var(--spacing-lg);
}

.ai-quick-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--spacing-md);
}

.ai-quick-title {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-bold);
    color: var(--color-text-primary);
}

.ai-quick-title i {
    color: var(--color-primary);
}

.ai-risk-indicator {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--radius-full);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
}

.ai-risk-indicator.risk-green {
    background: rgba(34, 197, 94, 0.1);
    color: #16a34a;
}

.ai-risk-indicator.risk-yellow {
    background: rgba(251, 191, 36, 0.1);
    color: #b45309;
}

.ai-risk-indicator.risk-red {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
}

/* Compact Findings */
.ai-findings-compact {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-md);
}

.finding-compact {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--color-surface);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    border-left: 3px solid transparent;
}

.finding-compact i {
    color: var(--color-primary);
    flex-shrink: 0;
    margin-top: 2px;
}

.finding-compact.finding-highlight { border-left-color: #f59e0b; }
.finding-compact.finding-trend { border-left-color: #3b82f6; }
.finding-compact.finding-sentiment { border-left-color: #22c55e; }
.finding-compact.finding-connection { border-left-color: #8b5cf6; }

.ai-risk-summary {
    padding: var(--spacing-sm) var(--spacing-md);
    background: rgba(251, 191, 36, 0.08);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
}

.ai-risk-summary .risk-label {
    font-weight: var(--font-weight-semibold);
    color: #b45309;
}

.ai-risk-summary .risk-text {
    color: var(--color-text-secondary);
}

/* CTA Actions */
.ai-cta-actions {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-md);
}

.ai-cta-btn {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-md);
    border-radius: var(--radius-lg);
    text-decoration: none;
    transition: all var(--transition-fast);
}

.ai-cta-btn i {
    font-size: var(--font-size-xl);
    flex-shrink: 0;
}

.ai-cta-btn .btn-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.ai-cta-btn .btn-text strong {
    font-size: var(--font-size-sm);
}

.ai-cta-btn .btn-text small {
    font-size: var(--font-size-xs);
    opacity: 0.8;
}

.ai-cta-primary {
    background: linear-gradient(135deg, var(--color-primary), #6366f1);
    color: white;
}

.ai-cta-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(124, 92, 255, 0.3);
}

.ai-cta-secondary {
    background: linear-gradient(135deg, #f59e0b, #f97316);
    color: white;
}

.ai-cta-secondary:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(249, 115, 22, 0.3);
}

.ai-cta-outline {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    color: var(--color-text-primary);
}

.ai-cta-outline:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

.ai-cta-footer {
    text-align: center;
    color: var(--color-text-muted);
}

.ai-cta-footer i {
    margin-right: var(--spacing-xs);
}

@media (max-width: 768px) {
    .ai-cta-actions {
        grid-template-columns: 1fr;
    }

    .ai-quick-header {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--spacing-sm);
    }
}

/* AI Report Styles (Legacy - can be removed if not used) */
.ai-report-card {
    background: linear-gradient(135deg, var(--color-surface) 0%, #f8fafc 100%);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    padding: var(--spacing-xl);
    position: relative;
    overflow: hidden;
}

.ai-report-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #8b5cf6, #6366f1, #3b82f6);
}

.ai-report-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-xl);
    padding-bottom: var(--spacing-lg);
    border-bottom: 1px solid var(--color-border);
}

.ai-report-title {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-text-primary);
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.ai-report-title i {
    color: #8b5cf6;
}

.ai-report-meta {
    display: flex;
    align-items: center;
}

.ai-section {
    margin-bottom: var(--spacing-xl);
}

.ai-section:last-of-type {
    margin-bottom: var(--spacing-lg);
}

.ai-section-title {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    margin-bottom: var(--spacing-md);
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.ai-section-title i {
    color: #6366f1;
}

/* Key Findings */
.key-findings-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-md);
}

.finding-card {
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    padding: var(--spacing-md);
    display: flex;
    gap: var(--spacing-md);
    border: 1px solid var(--color-border);
    transition: transform var(--transition-fast), box-shadow var(--transition-fast);
}

.finding-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.finding-icon {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-lg);
    flex-shrink: 0;
}

.finding-highlight .finding-icon { background: rgba(234, 179, 8, 0.1); color: #eab308; }
.finding-trend .finding-icon { background: rgba(34, 197, 94, 0.1); color: #22c55e; }
.finding-sentiment .finding-icon { background: rgba(59, 130, 246, 0.1); color: #3b82f6; }
.finding-connection .finding-icon { background: rgba(168, 85, 247, 0.1); color: #a855f7; }

.finding-text {
    font-size: var(--font-size-base);
    color: var(--color-text-primary);
    margin: 0;
    line-height: 1.7;
}

/* Topics */
.topics-container {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.topic-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.topic-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--spacing-sm);
}

.topic-name {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    margin: 0;
    color: var(--color-text-primary);
}

.topic-stats {
    font-size: var(--font-size-sm);
}

.topic-count {
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
}

.topic-percentage {
    color: var(--color-text-muted);
}

.topic-sentiment-bar {
    display: flex;
    height: 6px;
    border-radius: var(--radius-full);
    overflow: hidden;
    margin-bottom: var(--spacing-md);
}

.topic-keywords {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-xs);
    margin-bottom: var(--spacing-md);
}

.keyword-tag {
    background: var(--color-primary-bg);
    color: var(--color-primary);
    padding: 2px 10px;
    border-radius: var(--radius-full);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
}

.topic-summary {
    font-size: var(--font-size-base);
    color: var(--color-text-primary);
    line-height: 1.8;
    margin: 0;
}

/* Recommendations */
.recommendations-card {
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.05) 0%, rgba(139, 92, 246, 0.05) 100%);
    border: 1px solid rgba(99, 102, 241, 0.2);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.recommendations-summary {
    font-size: var(--font-size-base);
    color: var(--color-text-primary);
    line-height: 1.8;
    margin-bottom: var(--spacing-md);
}

.action-items {
    list-style: none;
    padding: 0;
    margin: 0;
}

.action-items li {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-sm);
    font-size: var(--font-size-base);
    color: var(--color-text-primary);
    padding: var(--spacing-sm) 0;
    line-height: 1.6;
}

.action-items li i {
    color: #6366f1;
    margin-top: 2px;
}

/* Disclaimer */
.ai-disclaimer {
    background: var(--color-background);
    border-radius: var(--radius-md);
    padding: var(--spacing-sm) var(--spacing-md);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.ai-disclaimer i {
    color: var(--color-text-muted);
}

/* ========== TOPIC CO-OCCURRENCE (話題關聯) ========== */
.accordion-section.cooccurrence .accordion-header {
    border-left: 4px solid #8b5cf6;
}

.cooccurrence-intro {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin-bottom: var(--spacing-lg);
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--color-background);
    border-radius: var(--radius-md);
}

.cooccurrence-intro i {
    color: var(--color-primary);
}

.cooccurrence-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-xl);
}

.cooccurrence-section {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.cooccurrence-section-title {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    margin: 0 0 var(--spacing-md);
}

.cooccurrence-section-title i {
    color: var(--color-primary);
}

/* Co-occurrence List */
.cooccurrence-list {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.cooccurrence-item {
    display: grid;
    grid-template-columns: 1fr 80px 40px;
    gap: var(--spacing-sm);
    align-items: center;
    padding-bottom: var(--spacing-sm);
    border-bottom: 1px solid var(--color-border-light);
}

.cooccurrence-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.cooccurrence-candidate {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.candidate-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.candidate-name {
    font-weight: var(--font-weight-medium);
    color: var(--color-text-primary);
}

.candidate-party {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

.cooccurrence-bar-container {
    height: 8px;
    background: var(--color-border);
    border-radius: var(--radius-full);
    overflow: hidden;
}

.cooccurrence-bar {
    height: 100%;
    background: linear-gradient(90deg, #8b5cf6, #6366f1);
    border-radius: var(--radius-full);
    transition: width 0.3s ease;
}

.cooccurrence-pct {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    text-align: right;
}

.cooccurrence-topic {
    grid-column: 1 / -1;
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    padding-left: 16px;
}

/* Topic Cluster List */
.topic-cluster-list {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.topic-cluster-item {
    padding-bottom: var(--spacing-md);
    border-bottom: 1px solid var(--color-border-light);
}

.topic-cluster-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.cluster-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--spacing-xs);
}

.cluster-name {
    font-weight: var(--font-weight-medium);
    color: var(--color-text-primary);
}

.cluster-pct {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
}

.cluster-bar {
    height: 6px;
    background: var(--color-border);
    border-radius: var(--radius-full);
    overflow: hidden;
    margin-bottom: var(--spacing-sm);
}

.cluster-bar-fill {
    height: 100%;
    background: linear-gradient(90deg, #8b5cf6, #a855f7);
    border-radius: var(--radius-full);
    transition: width 0.3s ease;
}

.cluster-keywords {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-xs);
}

.cluster-keyword {
    font-size: var(--font-size-xs);
    padding: 2px var(--spacing-sm);
    background: var(--color-background);
    color: var(--color-text-secondary);
    border-radius: var(--radius-full);
}

/* Co-occurrence Disclaimer */
.cooccurrence-disclaimer {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    margin-top: var(--spacing-lg);
    padding: var(--spacing-sm) var(--spacing-md);
    background: rgba(34, 197, 94, 0.05);
    border: 1px solid rgba(34, 197, 94, 0.2);
    border-radius: var(--radius-md);
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
}

.cooccurrence-disclaimer i {
    color: #16a34a;
}

@media (max-width: 768px) {
    .cooccurrence-grid {
        grid-template-columns: 1fr;
    }

    .cooccurrence-item {
        grid-template-columns: 1fr 60px 35px;
    }
}

/* Political Profile Styles (Legacy - can be removed if not used) */
.profile-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--spacing-md);
    flex-wrap: wrap;
    gap: var(--spacing-sm);
}

.profile-meta {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.confidence-indicator {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--radius-full);
}

.confidence-high {
    background: var(--color-success-bg);
    color: var(--color-success);
}

.confidence-medium {
    background: var(--color-warning-bg);
    color: #b45309;
}

.confidence-low {
    background: var(--color-danger-bg);
    color: var(--color-danger);
}

.profile-tags {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-lg);
}

.profile-tag {
    display: inline-flex;
    align-items: center;
    padding: var(--spacing-xs) var(--spacing-md);
    border-radius: var(--radius-full);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
}

.profile-tag-primary {
    background: linear-gradient(135deg, var(--color-primary), #6366f1);
    color: white;
}

.profile-tag-secondary {
    background: var(--color-primary-bg);
    color: var(--color-primary);
    border: 1px solid var(--color-primary);
}

.profile-tag-info {
    background: var(--color-background);
    color: var(--color-text-secondary);
    border: 1px solid var(--color-border);
}

.profile-content {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: var(--spacing-xl);
}

/* Compass Chart */
.compass-section {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.compass-chart {
    width: 240px;
    height: 240px;
    position: relative;
}

.compass-grid {
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    position: relative;
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.compass-quadrant {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--spacing-sm);
}

.compass-quadrant.q-tl { background: #dcfce7; }
.compass-quadrant.q-tr { background: #dbeafe; }
.compass-quadrant.q-bl { background: #fef9c3; }
.compass-quadrant.q-br { background: #fee2e2; }

.compass-quadrant .quadrant-label {
    font-size: 11px;
    color: var(--color-text-muted);
    text-align: center;
}

.compass-axis-x,
.compass-axis-y {
    position: absolute;
    display: flex;
    justify-content: space-between;
    font-size: 10px;
    color: var(--color-text-muted);
}

.compass-axis-x {
    left: 0;
    right: 0;
    bottom: -24px;
}

.compass-axis-y {
    top: 0;
    bottom: 0;
    left: -60px;
    flex-direction: column;
    width: 50px;
    text-align: right;
}

.compass-dot {
    position: absolute;
    width: 16px;
    height: 16px;
    background: var(--color-primary);
    border: 3px solid white;
    border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    transform: translate(-50%, -50%);
    z-index: 10;
}

/* Axes Section */
.axes-section {
    border-left: 1px solid var(--color-border);
    padding-left: var(--spacing-xl);
}

.axes-list {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
}

.axis-item {
    padding-bottom: var(--spacing-md);
    border-bottom: 1px solid var(--color-border-light);
}

.axis-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.axis-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--spacing-xs);
}

.axis-name {
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.axis-label-badge {
    font-size: var(--font-size-xs);
    padding: 2px var(--spacing-sm);
    background: var(--color-primary-bg);
    color: var(--color-primary);
    border-radius: var(--radius-full);
    font-weight: var(--font-weight-medium);
}

.axis-bar-container {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-xs);
}

.axis-endpoint {
    font-size: 11px;
    color: var(--color-text-muted);
    min-width: 60px;
}

.axis-endpoint:last-child {
    text-align: right;
}

.axis-bar {
    flex: 1;
    height: 8px;
    background: linear-gradient(to right, #22c55e 0%, #f3f4f6 50%, #ef4444 100%);
    border-radius: var(--radius-full);
    position: relative;
}

.axis-bar-fill {
    position: absolute;
    width: 12px;
    height: 12px;
    background: var(--color-text-primary);
    border: 2px solid white;
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}

.axis-description {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: 0;
    line-height: 1.5;
}

.profile-methodology {
    margin-top: var(--spacing-lg);
    padding-top: var(--spacing-md);
    border-top: 1px solid var(--color-border);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

/* Profile Disclaimer (重要聲明) */
.profile-disclaimer {
    margin-top: var(--spacing-lg);
    padding: var(--spacing-md) var(--spacing-lg);
    background: rgba(251, 191, 36, 0.1);
    border: 1px solid rgba(251, 191, 36, 0.3);
    border-radius: var(--radius-lg);
    font-size: var(--font-size-sm);
    color: #92400e;
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-sm);
    line-height: 1.5;
}

.profile-disclaimer i {
    color: #d97706;
    font-size: var(--font-size-lg);
    flex-shrink: 0;
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .profile-content {
        grid-template-columns: 1fr;
    }

    .compass-section {
        padding-bottom: var(--spacing-lg);
    }

    .axes-section {
        border-left: none;
        border-top: 1px solid var(--color-border);
        padding-left: 0;
        padding-top: var(--spacing-lg);
    }

    .compass-axis-y {
        left: -50px;
    }
}

/* AI Report Responsive */
@media (max-width: 768px) {
    .key-findings-grid {
        grid-template-columns: 1fr;
    }

    .ai-report-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .finding-card {
        flex-direction: column;
        text-align: center;
    }

    .finding-icon {
        margin: 0 auto;
    }
}

/* Risk Badge in Accordion Header */
.accordion-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--radius-full);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    margin-left: auto;
    margin-right: var(--spacing-md);
}

.accordion-badge.risk-badge-green {
    background: rgba(34, 197, 94, 0.1);
    color: #16a34a;
}

.accordion-badge.risk-badge-yellow {
    background: rgba(251, 191, 36, 0.1);
    color: #d97706;
}

.accordion-badge.risk-badge-orange {
    background: rgba(249, 115, 22, 0.15);
    color: #ea580c;
}

.accordion-badge.risk-badge-red {
    background: rgba(239, 68, 68, 0.15);
    color: #dc2626;
    animation: pulse-red 2s ease-in-out infinite;
}

/* Risk Trigger Banner */
.risk-trigger-banner {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-md) var(--spacing-lg);
    border-radius: var(--radius-lg);
    margin-bottom: var(--spacing-lg);
}

.risk-trigger-banner.risk-yellow {
    background: rgba(251, 191, 36, 0.1);
    border: 1px solid rgba(251, 191, 36, 0.3);
}

.risk-trigger-banner.risk-orange {
    background: rgba(249, 115, 22, 0.1);
    border: 1px solid rgba(249, 115, 22, 0.3);
}

.risk-trigger-banner.risk-red {
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.3);
    animation: pulse-border-red 2s ease-in-out infinite;
}

@keyframes pulse-border-red {
    0%, 100% { border-color: rgba(239, 68, 68, 0.3); }
    50% { border-color: rgba(239, 68, 68, 0.6); }
}

.risk-trigger-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-full);
    font-size: 1.25rem;
    flex-shrink: 0;
}

.risk-yellow .risk-trigger-icon {
    background: rgba(251, 191, 36, 0.2);
    color: #d97706;
}

.risk-orange .risk-trigger-icon {
    background: rgba(249, 115, 22, 0.2);
    color: #ea580c;
}

.risk-red .risk-trigger-icon {
    background: rgba(239, 68, 68, 0.2);
    color: #dc2626;
}

.risk-trigger-content {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.risk-trigger-label {
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-base);
}

.risk-yellow .risk-trigger-label { color: #b45309; }
.risk-orange .risk-trigger-label { color: #c2410c; }
.risk-red .risk-trigger-label { color: #b91c1c; }

.risk-trigger-factors {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

/* Strategy Report CTA (Gated Content) */
.strategy-report-cta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--spacing-lg);
    margin-top: var(--spacing-xl);
    margin-bottom: var(--spacing-lg);
    padding: var(--spacing-lg);
    background: linear-gradient(135deg, rgba(124, 92, 255, 0.08), rgba(59, 130, 246, 0.08));
    border: 2px dashed var(--color-border);
    border-radius: var(--radius-lg);
}

.strategy-cta-content {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
}

.strategy-cta-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-primary-bg);
    border-radius: var(--radius-lg);
    font-size: 1.5rem;
    color: var(--color-primary);
    flex-shrink: 0;
}

.strategy-cta-text h4 {
    margin: 0 0 var(--spacing-xs);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.strategy-cta-text p {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.strategy-cta-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-xs);
    flex-shrink: 0;
}

.btn-download-report {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-sm) var(--spacing-lg);
    font-weight: var(--font-weight-medium);
}

.cta-hint {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

@media (max-width: 768px) {
    .strategy-report-cta {
        flex-direction: column;
        text-align: center;
    }

    .strategy-cta-content {
        flex-direction: column;
    }

    .risk-trigger-banner {
        flex-direction: column;
        text-align: center;
    }

    .risk-trigger-content {
        align-items: center;
    }
}

/* Share of Voice Styles */
.sov-chart {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.sov-candidate {
    display: grid;
    grid-template-columns: 200px 1fr 100px;
    gap: var(--spacing-md);
    align-items: center;
    padding: var(--spacing-sm);
    border-radius: var(--radius-md);
    transition: background-color var(--transition-fast);
}

.sov-candidate:hover {
    background-color: var(--color-background);
}

.sov-candidate.sov-current {
    background-color: var(--color-primary-bg);
    border: 1px solid var(--color-primary);
}

.sov-info {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.sov-rank {
    font-weight: var(--font-weight-bold);
    color: var(--color-text-muted);
    min-width: 24px;
}

.sov-party-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.sov-name {
    font-weight: var(--font-weight-medium);
}

.sov-bar-container {
    height: 20px;
    background-color: var(--color-background);
    border-radius: var(--radius-md);
    overflow: hidden;
}

.sov-bar {
    height: 100%;
    border-radius: var(--radius-md);
    transition: width 0.5s ease;
    min-width: 4px;
}

.sov-stats {
    text-align: right;
    white-space: nowrap;
}

.sov-share {
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-lg);
}

.sov-count {
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
    margin-left: var(--spacing-xs);
}

/* Source Distribution Styles */
.source-type-comparison {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.source-type-item {
    display: grid;
    grid-template-columns: 40px 1fr 1fr;
    gap: var(--spacing-md);
    align-items: center;
}

.source-type-icon {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-lg);
}

.source-type-item.news .source-type-icon {
    background-color: rgba(59, 130, 246, 0.1);
    color: #3b82f6;
}

.source-type-item.social .source-type-icon {
    background-color: rgba(168, 85, 247, 0.1);
    color: #a855f7;
}

.source-type-item.other .source-type-icon {
    background-color: rgba(107, 114, 128, 0.1);
    color: #6b7280;
}

.source-type-info {
    display: flex;
    flex-direction: column;
}

.source-type-label {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.source-type-value {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
}

.source-type-bar {
    height: 8px;
    background-color: var(--color-background);
    border-radius: var(--radius-full);
    overflow: hidden;
}

.source-type-fill {
    height: 100%;
    border-radius: var(--radius-full);
    transition: width 0.5s ease;
}

.source-type-fill.news { background: linear-gradient(90deg, #3b82f6, #60a5fa); }
.source-type-fill.social { background: linear-gradient(90deg, #a855f7, #c084fc); }
.source-type-fill.other { background: linear-gradient(90deg, #6b7280, #9ca3af); }

.platform-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: var(--spacing-sm);
}

.platform-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--spacing-sm) var(--spacing-md);
    background-color: var(--color-background);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
}

.platform-item.news { border-left: 3px solid #3b82f6; }
.platform-item.social { border-left: 3px solid #a855f7; }
.platform-item.other { border-left: 3px solid #6b7280; }

.platform-name {
    font-weight: var(--font-weight-medium);
}

.platform-pct {
    color: var(--color-text-muted);
}

/* Keyword Styles */
.keyword-list {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.keyword-item {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) var(--spacing-md);
    border-radius: var(--radius-md);
}

.keyword-item.positive {
    background-color: rgba(34, 197, 94, 0.05);
}

.keyword-item.negative {
    background-color: rgba(239, 68, 68, 0.05);
}

.keyword-rank {
    font-weight: var(--font-weight-bold);
    color: var(--color-text-muted);
    min-width: 24px;
}

.keyword-text {
    flex: 1;
    font-weight: var(--font-weight-medium);
}

.keyword-item.positive .keyword-text { color: #16a34a; }
.keyword-item.negative .keyword-text { color: #dc2626; }

.keyword-count {
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
}

.keyword-summary {
    font-size: var(--font-size-base);
    color: var(--color-text-primary);
    line-height: 1.8;
    margin-bottom: var(--spacing-md);
    padding-bottom: var(--spacing-md);
    border-bottom: 1px solid var(--color-border);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .sov-candidate {
        grid-template-columns: 1fr;
        gap: var(--spacing-xs);
    }

    .sov-stats {
        text-align: left;
    }

    .source-type-item {
        grid-template-columns: 40px 1fr;
    }

    .source-type-bar {
        grid-column: span 2;
        margin-top: var(--spacing-xs);
    }
}

/* Social Listening Report Styles */
.report-card {
    background: var(--color-surface);
    border-radius: var(--radius-xl);
    padding: var(--spacing-xl);
    box-shadow: var(--shadow-sm);
}

.report-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--spacing-md);
    padding-bottom: var(--spacing-lg);
    border-bottom: 1px solid var(--color-border);
    margin-bottom: var(--spacing-lg);
}

.report-period {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.report-period i {
    margin-right: var(--spacing-xs);
}

.report-total {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.report-total strong {
    color: var(--color-primary);
    font-size: var(--font-size-lg);
}

.report-section {
    margin-bottom: var(--spacing-xl);
}

.report-section-title {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    margin-bottom: var(--spacing-md);
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.report-section-title i {
    color: var(--color-primary);
}

/* Sentiment Analysis */
.sentiment-analysis {
    background: var(--color-background);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.sentiment-bar-large {
    display: flex;
    height: 24px;
    border-radius: var(--radius-md);
    overflow: hidden;
    margin-bottom: var(--spacing-lg);
}

.sentiment-segment {
    transition: width 0.3s ease;
}

.sentiment-segment.positive {
    background: linear-gradient(135deg, #22c55e, #16a34a);
}

.sentiment-segment.neutral {
    background: linear-gradient(135deg, #6b7280, #4b5563);
}

.sentiment-segment.negative {
    background: linear-gradient(135deg, #ef4444, #dc2626);
}

.sentiment-legend {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    gap: var(--spacing-md);
}

.legend-item {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.legend-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
}

.legend-item.positive .legend-dot { background: #22c55e; }
.legend-item.neutral .legend-dot { background: #6b7280; }
.legend-item.negative .legend-dot { background: #ef4444; }

.legend-label {
    font-weight: var(--font-weight-medium);
}

.legend-value {
    font-weight: var(--font-weight-bold);
}

.legend-item.positive .legend-value { color: #22c55e; }
.legend-item.neutral .legend-value { color: #6b7280; }
.legend-item.negative .legend-value { color: #ef4444; }

.legend-count {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

/* Trend Indicator */
.trend-indicator {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-md);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    margin-top: var(--spacing-md);
}

.trend-indicator.trend-up {
    background: rgba(34, 197, 94, 0.1);
    color: #16a34a;
}

.trend-indicator.trend-down {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
}

.trend-indicator.trend-stable {
    background: rgba(107, 114, 128, 0.1);
    color: #4b5563;
}

.trend-indicator i {
    font-size: var(--font-size-lg);
}

/* Source List */
.source-list {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.source-item {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: var(--spacing-sm);
    align-items: center;
    padding: var(--spacing-sm) 0;
    position: relative;
}

.source-name {
    font-weight: var(--font-weight-medium);
}

.source-count {
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
}

.source-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--color-primary), var(--color-primary-light, #60a5fa));
    border-radius: var(--radius-sm);
    min-width: 10px;
}

/* Related Entities */
.related-entities {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
}

.entity-group {
    background: var(--color-background);
    border-radius: var(--radius-lg);
    padding: var(--spacing-md);
}

.entity-title {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-secondary);
    margin-bottom: var(--spacing-sm);
}

.entity-tags {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
}

.entity-tag {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--radius-full);
    font-size: var(--font-size-sm);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
}

.entity-tag.person {
    border-color: var(--color-primary);
}

.entity-tag.person i {
    color: var(--color-primary);
}

.entity-tag.org {
    border-color: #8b5cf6;
}

.entity-tag.org i {
    color: #8b5cf6;
}

.tag-count {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    margin-left: var(--spacing-xs);
}

/* Report Summary */
.report-summary {
    margin-top: var(--spacing-lg);
    padding: var(--spacing-md);
    background: var(--color-background);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.report-summary i {
    color: var(--color-primary);
    margin-right: var(--spacing-xs);
}

/* Responsive */
@media (max-width: 768px) {
    .report-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .sentiment-legend {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* ========== ACCORDION STYLES ========== */
.accordion-section {
    margin-bottom: var(--spacing-lg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    overflow: hidden;
    background: var(--color-surface);
}

.accordion-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--spacing-md) var(--spacing-lg);
    background: var(--color-surface);
    cursor: pointer;
    user-select: none;
    transition: background-color var(--transition-fast);
}

.accordion-header:hover {
    background: var(--color-background);
}

.accordion-title {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    margin: 0;
}

.accordion-title i {
    font-size: 1.25rem;
}

.accordion-icon {
    font-size: 1.25rem;
    color: var(--color-text-muted);
    transition: transform var(--transition-normal);
}

.accordion-section.open .accordion-icon {
    transform: rotate(180deg);
}

.accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease;
}

.accordion-section.open .accordion-content {
    max-height: 5000px;
}

.accordion-body {
    padding: 0 var(--spacing-lg) var(--spacing-lg);
}

/* Accordion section colors - Unified theme with primary accent */
.accordion-section .accordion-header {
    border-left: 4px solid var(--color-primary);
    transition: background-color var(--transition-fast), border-color var(--transition-fast);
}

.accordion-section.open .accordion-header {
    border-left-color: var(--color-primary);
    background: linear-gradient(90deg, rgba(124, 92, 255, 0.04) 0%, transparent 100%);
}

/* Section-specific accent colors (subtle icon tints only) */
.accordion-section.battle .accordion-title i { color: #ef4444; }
.accordion-section.volume .accordion-title i { color: #3b82f6; }
.accordion-section.ai .accordion-title i,
.accordion-section.ai-insights .accordion-title i { color: var(--color-primary); }
.accordion-section.related .accordion-title i { color: #22c55e; }
.accordion-section.profile .accordion-title i { color: #f59e0b; }

/* ========== AI 輿情洞察 Section Styles ========== */

/* Accordion header with risk badge */
.accordion-section.ai-insights .accordion-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.accordion-header-right {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.header-risk-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.75rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
}

.header-risk-badge.risk-green { background: rgba(34, 197, 94, 0.15); color: #16a34a; }
.header-risk-badge.risk-yellow { background: rgba(234, 179, 8, 0.15); color: #ca8a04; }
.header-risk-badge.risk-orange { background: rgba(249, 115, 22, 0.15); color: #ea580c; }
.header-risk-badge.risk-red { background: rgba(239, 68, 68, 0.15); color: #dc2626; }

/* 輿情總覽 Card - Polished Design */
.ai-overview-card {
    background: linear-gradient(135deg, rgba(124, 92, 255, 0.06) 0%, rgba(124, 92, 255, 0.02) 100%);
    border: 1px solid rgba(124, 92, 255, 0.2);
    border-radius: var(--radius-lg);
    padding: var(--spacing-xl);
    position: relative;
    overflow: hidden;
}

.ai-overview-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--color-primary), #6366f1, #3b82f6);
}

.ai-overview-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--spacing-md);
}

.ai-overview-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-text-primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
}

.ai-overview-title i {
    color: #8b5cf6;
}

.ai-trend-indicator {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.75rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
}

.ai-trend-indicator.trend-improving { background: rgba(34, 197, 94, 0.15); color: #16a34a; }
.ai-trend-indicator.trend-stable { background: rgba(107, 114, 128, 0.15); color: #6b7280; }
/* Editorial Text Collapsible System (identical to Home Page) */
.editorial-text-wrapper {
    position: relative;
    overflow: hidden;
    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.editorial-text-wrapper.collapsed {
    max-height: 88px; /* ~3-4 lines preview */
}

.editorial-text-wrapper.collapsed .editorial-fade-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 54px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.85) 60%, rgba(255, 255, 255, 1) 100%);
    cursor: pointer;
    display: block;
}

.editorial-text-wrapper.expanded {
    max-height: 4000px;
}

.editorial-text-wrapper.expanded .editorial-fade-overlay {
    display: none !important;
}

.editorial-text p:last-child {
    margin-bottom: 0;
}

.editorial-toggle-action {
    font-size: 0.85rem;
    transition: all 0.2s ease;
    cursor: pointer;
}

.editorial-toggle-action:hover {
    color: #3730a3 !important;
}

/* AI Narrative Collapsible System */
.ai-narrative-wrapper,
.ai-narrative-container {
    position: relative;
    margin-bottom: var(--spacing-lg);
}

.ai-narrative-content {
    position: relative;
    overflow: hidden;
    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Collapsed state */
.ai-narrative-wrapper.collapsed .ai-narrative-content,
.ai-narrative-container.collapsed .ai-overview-narrative,
.ai-overview-narrative.collapsed {
    max-height: 135px;
    overflow: hidden;
}

/* Expanded state */
.ai-narrative-wrapper:not(.collapsed) .ai-narrative-content,
.ai-narrative-container:not(.collapsed) .ai-overview-narrative,
.ai-overview-narrative.expanded {
    max-height: 5000px;
}

/* Fade gradient overlay */
.ai-narrative-fade,
.ai-narrative-fade-overlay {
    display: none;
}

.ai-narrative-wrapper.collapsed .ai-narrative-fade,
.ai-narrative-container.collapsed .ai-narrative-fade,
.ai-narrative-container.collapsed .ai-narrative-fade-overlay,
.ai-overview-narrative.collapsed + .ai-narrative-fade-overlay {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 75px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.75) 45%, #ffffff 100%);
    cursor: pointer;
    z-index: 2;
}

/* Action bar: centered button */
.ai-narrative-action-bar,
.ai-narrative-toggle-row {
    display: flex;
    justify-content: center;
    position: relative;
    z-index: 3;
    margin-top: -14px;
    margin-bottom: 0.5rem;
}

.ai-narrative-wrapper:not(.collapsed) .ai-narrative-action-bar,
.ai-narrative-container:not(.collapsed) .ai-narrative-toggle-row {
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

/* Modern pill button */
.ai-narrative-btn,
.ai-narrative-toggle-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 0.45rem 1.35rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: #4338ca;
    background: #ffffff;
    border: 1px solid #c7d2fe;
    border-radius: 9999px;
    box-shadow: 0 2px 8px rgba(79, 70, 229, 0.1), 0 1px 2px rgba(0, 0, 0, 0.04);
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    user-select: none;
    outline: none;
    line-height: 1.4;
}

.ai-narrative-btn:hover,
.ai-narrative-toggle-btn:hover {
    color: #3730a3;
    background: #f5f3ff;
    border-color: #818cf8;
    box-shadow: 0 4px 14px rgba(79, 70, 229, 0.18);
    transform: translateY(-1px);
}

.ai-narrative-btn:active,
.ai-narrative-toggle-btn:active {
    transform: translateY(0);
}

.ai-narrative-btn-icon,
.btn-icon {
    font-size: 0.75rem;
    transition: transform 0.25s ease;
}

/* Expanded state button styling (soft slate) */
.ai-narrative-wrapper:not(.collapsed) .ai-narrative-btn,
.ai-narrative-wrapper:not(.collapsed) .ai-narrative-toggle-btn,
.ai-narrative-container:not(.collapsed) .ai-narrative-btn,
.ai-narrative-container:not(.collapsed) .ai-narrative-toggle-btn {
    color: #64748b;
    background: #f8fafc;
    border-color: #e2e8f0;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.ai-narrative-wrapper:not(.collapsed) .ai-narrative-btn:hover,
.ai-narrative-wrapper:not(.collapsed) .ai-narrative-toggle-btn:hover,
.ai-narrative-container:not(.collapsed) .ai-narrative-btn:hover,
.ai-narrative-container:not(.collapsed) .ai-narrative-toggle-btn:hover {
    color: #334155;
    background: #f1f5f9;
    border-color: #cbd5e1;
}

.ai-overview-narrative {
    font-size: 0.9375rem;
    line-height: 1.85;
    color: var(--color-text-secondary);
    margin-bottom: 0.5rem;
}

.ai-overview-narrative p {
    margin-bottom: var(--spacing-md);
}

.ai-overview-narrative p:last-child {
    margin-bottom: 0;
}

.ai-overview-narrative strong {
    color: var(--color-text-primary);
    font-weight: 600;
}

.ai-findings-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.ai-finding-item {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem;
    background: var(--color-bg-card);
    border-radius: var(--radius-md);
    font-size: 0.875rem;
    line-height: 1.5;
}

.ai-finding-item i {
    flex-shrink: 0;
    margin-top: 0.125rem;
}

.ai-finding-item.finding-trend i { color: #3b82f6; }
.ai-finding-item.finding-sentiment i { color: #22c55e; }
.ai-finding-item.finding-connection i { color: #8b5cf6; }
.ai-finding-item.finding-highlight i { color: #f59e0b; }

.ai-risk-alert {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: var(--spacing-md);
    padding: 0.75rem;
    border-radius: var(--radius-md);
    font-size: 0.8125rem;
}

.ai-risk-alert.risk-yellow { background: rgba(234, 179, 8, 0.1); border: 1px solid rgba(234, 179, 8, 0.3); }
.ai-risk-alert.risk-orange { background: rgba(249, 115, 22, 0.1); border: 1px solid rgba(249, 115, 22, 0.3); }
.ai-risk-alert.risk-red { background: rgba(239, 68, 68, 0.1); border: 1px solid rgba(239, 68, 68, 0.3); }

.ai-risk-alert i { color: inherit; }

/* 話題關聯 (Full) - Polished Design */
.topic-full-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-xl);
    position: relative;
}

.topic-full-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: linear-gradient(180deg, var(--color-primary), #a78bfa);
    border-radius: var(--radius-lg) 0 0 var(--radius-lg);
}

.topic-full-header {
    margin-bottom: var(--spacing-sm);
}

.topic-full-title {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--color-text-primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
}

.topic-full-title i {
    color: var(--color-primary);
    font-size: 1.2rem;
}

.topic-full-intro {
    font-size: 0.9rem;
    color: var(--color-text-secondary);
    margin-bottom: var(--spacing-xl);
    line-height: 1.6;
}

.topic-full-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-xl);
}

@media (max-width: 640px) {
    .topic-full-grid {
        grid-template-columns: 1fr;
    }
}

.topic-full-col {
    background: var(--color-background);
    border-radius: var(--radius-md);
    padding: var(--spacing-md);
}

.topic-col-title {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--color-text-muted);
    margin-bottom: var(--spacing-md);
    display: flex;
    align-items: center;
    gap: 0.375rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.topic-col-title i {
    font-size: 0.875rem;
    color: var(--color-primary);
}

.topic-items {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.topic-item {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-xs) 0;
}

.topic-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.topic-name {
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-text-primary);
    flex: 1;
}

.topic-label {
    font-size: 0.9375rem;
    color: var(--color-text-primary);
    flex: 1;
}

.topic-pct {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-primary);
    min-width: 48px;
    text-align: right;
}

.topic-item-bar {
    display: grid;
    grid-template-columns: 80px 1fr 48px;
    gap: var(--spacing-sm);
}

.topic-item-bar .topic-label {
    font-size: 0.875rem;
}

.topic-bar-wrap {
    height: 8px;
    background: var(--color-border);
    border-radius: var(--radius-full);
    overflow: hidden;
    align-self: center;
}

.topic-bar {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--color-primary), #a78bfa);
    border-radius: var(--radius-full);
    transition: width 0.3s ease;
}

.topic-methodology {
    margin-top: var(--spacing-lg);
    padding-top: var(--spacing-md);
    border-top: 1px solid var(--color-border);
    font-size: 0.75rem;
    color: var(--color-text-tertiary);
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

/* 爭議事件追蹤 */
.controversy-card {
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.controversy-header {
    margin-bottom: var(--spacing-md);
}

.controversy-header .controversy-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-text-primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
}

.controversy-header .controversy-title i { color: #ef4444; }

.controversy-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.controversy-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    background: var(--color-bg-tertiary);
    border-radius: var(--radius-md);
    font-size: 0.8125rem;
}

.controversy-item.severity-high {
    border-left: 3px solid #ef4444;
}

.controversy-item.severity-medium {
    border-left: 3px solid #f59e0b;
}

.controversy-item.severity-low {
    border-left: 3px solid #6b7280;
}

.controversy-status {
    font-size: 0.75rem;
    white-space: nowrap;
    min-width: 70px;
}

.controversy-text {
    flex: 1;
    color: var(--color-text-primary);
}

.controversy-count {
    color: var(--color-text-tertiary);
    font-size: 0.75rem;
}

/* ===== Combined CTA Section ===== */
.ai-cta-combined {
    margin-top: var(--spacing-lg);
    padding-top: var(--spacing-lg);
    border-top: 1px solid var(--color-border);
}

.ai-cta-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-md);
}

.ai-cta-card {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-md) var(--spacing-lg);
    border-radius: var(--radius-lg);
    transition: all 0.2s ease;
}

.ai-cta-card--login {
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.08) 0%, rgba(59, 130, 246, 0.08) 100%);
    border: 1px solid rgba(139, 92, 246, 0.2);
}

.ai-cta-card--report {
    background: linear-gradient(135deg, rgba(124, 92, 255, 0.08) 0%, rgba(236, 72, 153, 0.08) 100%);
    border: 1px solid rgba(124, 92, 255, 0.2);
}

.ai-cta-icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.ai-cta-card--login .ai-cta-icon {
    background: rgba(139, 92, 246, 0.15);
}

.ai-cta-card--login .ai-cta-icon i {
    font-size: 1.25rem;
    color: #8b5cf6;
}

.ai-cta-card--report .ai-cta-icon {
    background: rgba(236, 72, 153, 0.15);
}

.ai-cta-card--report .ai-cta-icon i {
    font-size: 1.25rem;
    color: #ec4899;
}

.ai-cta-text {
    flex: 1;
    min-width: 0;
}

.ai-cta-text strong {
    display: block;
    font-size: 0.9rem;
    color: var(--color-text-primary);
    margin-bottom: 0.125rem;
}

.ai-cta-text span {
    font-size: 0.8rem;
    color: var(--color-text-secondary);
}

.ai-cta-text em {
    font-style: normal;
    color: var(--color-primary);
    font-weight: 600;
}

.ai-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 1rem;
    border-radius: var(--radius-md);
    font-size: 0.8125rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
    transition: all 0.2s ease;
}

.ai-cta-btn--primary {
    background: linear-gradient(135deg, #8b5cf6 0%, #6366f1 100%);
    color: white;
    box-shadow: 0 4px 12px rgba(139, 92, 246, 0.25);
}

.ai-cta-btn--primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(139, 92, 246, 0.35);
}

.ai-cta-btn--secondary {
    background: linear-gradient(135deg, #ec4899 0%, #8b5cf6 100%);
    color: white;
    box-shadow: 0 4px 12px rgba(236, 72, 153, 0.25);
}

.ai-cta-btn--secondary:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(236, 72, 153, 0.35);
}

.ai-footer-note {
    font-size: 0.75rem;
    color: var(--color-text-tertiary);
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

@media (max-width: 768px) {
    .ai-cta-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 576px) {
    .ai-cta-card {
        flex-direction: column;
        text-align: center;
    }

    .ai-cta-btn {
        width: 100%;
        justify-content: center;
    }
}

/* ========== Insight Cards - Polished Design ========== */
.insight-cards-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-lg);
    margin-bottom: var(--spacing-xl);
}

@media (max-width: 992px) {
    .insight-cards-row {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .insight-cards-row {
        grid-template-columns: 1fr;
    }
}

.insight-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    border-top: 4px solid var(--color-border);
    transition: transform var(--transition-fast), box-shadow var(--transition-fast);
    position: relative;
}

.insight-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-lg);
}

.insight-card--green { border-top-color: #22c55e; }
.insight-card--yellow { border-top-color: #eab308; }
.insight-card--orange { border-top-color: #f97316; }
.insight-card--red { border-top-color: #ef4444; }
.insight-card--gray { border-top-color: var(--color-primary); }

/* Subtle background gradient based on status */
.insight-card--green::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 60px;
    background: linear-gradient(180deg, rgba(34, 197, 94, 0.05) 0%, transparent 100%);
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    pointer-events: none;
}
.insight-card--yellow::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 60px;
    background: linear-gradient(180deg, rgba(234, 179, 8, 0.05) 0%, transparent 100%);
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    pointer-events: none;
}
.insight-card--orange::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 60px;
    background: linear-gradient(180deg, rgba(249, 115, 22, 0.05) 0%, transparent 100%);
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    pointer-events: none;
}
.insight-card--red::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 60px;
    background: linear-gradient(180deg, rgba(239, 68, 68, 0.05) 0%, transparent 100%);
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    pointer-events: none;
}

.insight-card__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--spacing-md);
    position: relative;
    z-index: 1;
}

.insight-card__title {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--color-text-primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
}

.insight-card__title i {
    font-size: 1.1rem;
}

.insight-card--green .insight-card__title i { color: #22c55e; }
.insight-card--yellow .insight-card__title i { color: #eab308; }
.insight-card--orange .insight-card__title i { color: #f97316; }
.insight-card--red .insight-card__title i { color: #ef4444; }
.insight-card--gray .insight-card__title i { color: var(--color-primary); }

.insight-card__status {
    padding: 0.3rem 0.85rem;
    border-radius: var(--radius-full);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.insight-card__status--green { background: rgba(34, 197, 94, 0.15); color: #16a34a; }
.insight-card__status--yellow { background: rgba(234, 179, 8, 0.15); color: #ca8a04; }
.insight-card__status--orange { background: rgba(249, 115, 22, 0.15); color: #ea580c; }
.insight-card__status--red { background: rgba(239, 68, 68, 0.15); color: #dc2626; }
.insight-card__status--gray { background: rgba(107, 114, 128, 0.15); color: #6b7280; }

.insight-card__facts {
    font-size: 0.8rem;
    color: var(--color-text-secondary);
    margin-bottom: var(--spacing-sm);
    font-family: var(--font-mono);
    padding: var(--spacing-xs) var(--spacing-sm);
    background: var(--color-bg-muted);
    border-radius: var(--radius-sm);
    display: inline-block;
    position: relative;
    z-index: 1;
}

.insight-card__narrative {
    font-size: 0.9rem;
    line-height: 1.7;
    color: var(--color-text-secondary);
    position: relative;
    z-index: 1;
}

/* Insight Sections (Non-expandable) - Polished Design */
.insight-section {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    overflow: hidden;
}

.insight-section__title {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-md) var(--spacing-lg);
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-text-primary);
    border-bottom: 1px solid var(--color-border);
    background: linear-gradient(90deg, rgba(124, 92, 255, 0.04) 0%, transparent 100%);
    border-left: 4px solid var(--color-primary);
}

.insight-section__title i {
    color: var(--color-primary);
    font-size: 1.1rem;
}

.insight-section__badge {
    margin-left: auto;
    padding: 4px 12px;
    border-radius: var(--radius-full);
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.insight-section__badge.badge-green {
    background: rgba(34, 197, 94, 0.15);
    color: #16a34a;
}

.insight-section__badge.badge-yellow {
    background: rgba(234, 179, 8, 0.15);
    color: #ca8a04;
}

.insight-section__badge.badge-red {
    background: rgba(239, 68, 68, 0.15);
    color: #dc2626;
}

.insight-section__body {
    padding: var(--spacing-lg);
}

/* Trend Analysis Styles */
.trend-section-title {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: var(--spacing-sm);
}

.trend-section-title i {
    color: var(--primary);
}

.trend-turning-points {
    margin-bottom: var(--spacing-lg);
}

.trend-point {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) 0;
    border-bottom: 1px solid var(--border-color);
}

.trend-point:last-child {
    border-bottom: none;
}

.trend-point__date {
    font-size: 0.8rem;
    color: var(--text-muted);
    min-width: 80px;
}

.trend-point__event {
    flex: 1;
    font-weight: 500;
}

.trend-point__impact {
    font-size: 0.8rem;
    padding: 2px 8px;
    border-radius: 4px;
}

.trend-point__impact--positive {
    background: rgba(34, 197, 94, 0.15);
    color: #16a34a;
}

.trend-point__impact--negative {
    background: rgba(239, 68, 68, 0.15);
    color: #dc2626;
}

.trend-assessment__text {
    color: var(--text-secondary);
    line-height: 1.6;
}

/* Controversy Detail Styles */
.controversy-detail-card {
    padding: var(--spacing-md);
    border-radius: var(--border-radius);
    background: var(--bg-secondary);
    margin-bottom: var(--spacing-md);
    border-left: 4px solid var(--border-color);
}

.controversy-detail-card:last-child {
    margin-bottom: 0;
}

.controversy-detail-card.heat-green {
    border-left-color: #22c55e;
}

.controversy-detail-card.heat-yellow {
    border-left-color: #eab308;
}

.controversy-detail-card.heat-red {
    border-left-color: #ef4444;
}

.controversy-detail__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--spacing-sm);
}

.controversy-detail__topic {
    font-weight: 600;
    font-size: 1.05rem;
}

.controversy-detail__heat {
    font-size: 0.8rem;
    padding: 2px 8px;
    border-radius: 12px;
}

.controversy-detail__heat.heat--heating {
    background: rgba(239, 68, 68, 0.15);
    color: #dc2626;
}

.controversy-detail__heat.heat--cooling {
    background: rgba(234, 179, 8, 0.15);
    color: #ca8a04;
}

.controversy-detail__heat.heat--low {
    background: rgba(34, 197, 94, 0.15);
    color: #16a34a;
}

.controversy-detail__meta {
    display: flex;
    gap: var(--spacing-md);
    font-size: 0.85rem;
    color: var(--text-muted);
    margin-bottom: var(--spacing-sm);
}

.controversy-detail__meta i {
    margin-right: 4px;
}

.controversy-detail__quote {
    font-style: italic;
    padding: var(--spacing-sm) var(--spacing-md);
    border-left: 3px solid var(--border-color);
    background: var(--bg-card);
    margin: var(--spacing-sm) 0;
    color: var(--text-secondary);
}

.controversy-detail__assessment {
    font-size: 0.9rem;
    color: var(--text-secondary);
    margin-bottom: var(--spacing-sm);
}

.controversy-detail__assessment strong {
    color: var(--text-primary);
}

.controversy-detail__action {
    font-size: 0.85rem;
    padding: var(--spacing-xs) var(--spacing-sm);
    background: rgba(59, 130, 246, 0.1);
    border-radius: 4px;
    color: var(--primary);
}

.controversy-detail__action i {
    margin-right: 4px;
}

/* ===== Gated Content (Blur + Unlock CTA) ===== */
.gated-content {
    position: relative;
}

.gated-blur {
    filter: blur(5px);
    user-select: none;
    pointer-events: none;
}

/* Override for inline positioned unlock button */
.gated-content .gated-unlock-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-top: 0;
    white-space: nowrap;
    z-index: 10;
}

.gated-content .gated-unlock-btn:hover {
    transform: translate(-50%, -50%) scale(1.05);
}

/* ===== Candidates Comparison Table ===== */
.candidates-comparison-table {
    margin-bottom: var(--spacing-lg);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.comparison-table-header {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--color-background);
    border-bottom: 1px solid var(--color-border);
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--color-text-muted);
    text-transform: uppercase;
}

.comparison-table-row {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    padding: var(--spacing-md);
    border-bottom: 1px solid var(--color-border-light);
    text-decoration: none;
    color: inherit;
    transition: background 0.2s;
}

.comparison-table-row:hover {
    background: var(--color-background);
}

.comparison-table-row:last-child {
    border-bottom: none;
}

.comparison-row--current {
    background: linear-gradient(90deg, rgba(59, 130, 246, 0.08) 0%, transparent 100%);
}

.comparison-col {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.comparison-col--name {
    gap: var(--spacing-md);
}

.comparison-col--metric {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.comparison-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 2px solid;
    background: var(--color-background);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
}

.comparison-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.comparison-avatar i {
    font-size: 1.2rem;
    color: var(--color-text-muted);
}

.comparison-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.comparison-name {
    font-weight: 600;
    color: var(--color-text-primary);
    font-size: 0.95rem;
}

.current-badge {
    display: inline-block;
    font-size: 0.65rem;
    padding: 1px 6px;
    background: var(--color-primary);
    color: white;
    border-radius: var(--radius-sm);
    font-weight: 500;
    margin-left: 4px;
}

.comparison-party {
    font-size: 0.75rem;
}

.comparison-bar-wrap {
    width: 100%;
    height: 8px;
    background: var(--color-border);
    border-radius: var(--radius-full);
    overflow: hidden;
}

.comparison-bar {
    height: 100%;
    border-radius: var(--radius-full);
    transition: width 0.5s ease;
}

.comparison-value {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--color-text-primary);
}

@media (max-width: 768px) {
    .comparison-table-header,
    .comparison-table-row {
        grid-template-columns: 1.5fr 1fr 1fr 1fr;
    }

    .comparison-avatar {
        width: 32px;
        height: 32px;
    }

    .comparison-name {
        font-size: 0.85rem;
    }
}

/* Versus Comparison Styles - Polished Design */
.versus-comparison {
    margin-bottom: var(--spacing-lg);
    background: linear-gradient(135deg, rgba(124, 92, 255, 0.03) 0%, rgba(59, 130, 246, 0.03) 100%);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.versus-legend {
    display: flex;
    justify-content: center;
    gap: var(--spacing-xl);
    margin-bottom: var(--spacing-lg);
    padding-bottom: var(--spacing-md);
    border-bottom: 1px solid var(--color-border);
}

.versus-legend__item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--color-text-primary);
}

.versus-dot {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}

.versus-legend__item--self .versus-dot {
    background: linear-gradient(135deg, var(--color-primary), #6366f1);
}

.versus-legend__item--opponent .versus-dot {
    background: linear-gradient(135deg, #64748b, #475569);
}

.versus-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-lg);
    margin-bottom: var(--spacing-lg);
}

@media (max-width: 768px) {
    .versus-grid {
        grid-template-columns: 1fr;
        gap: var(--spacing-md);
    }
}

.versus-metric {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    text-align: center;
    transition: transform var(--transition-fast), box-shadow var(--transition-fast);
}

.versus-metric:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.versus-metric__header {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.75px;
    margin-bottom: var(--spacing-md);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.versus-metric__header i {
    font-size: 0.9rem;
    color: var(--color-primary);
}

.versus-metric__content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-md);
}

.versus-side {
    display: flex;
    align-items: baseline;
    gap: 3px;
}

.versus-side--self .versus-value {
    color: var(--color-primary);
}

.versus-side--opponent .versus-value {
    color: #64748b;
}

.versus-value {
    font-weight: 800;
    font-size: 1.75rem;
    line-height: 1;
    font-feature-settings: "tnum";
}

.versus-value--large {
    font-size: 2rem;
}

.versus-value--better {
    color: #16a34a !important;
}

.versus-label {
    font-size: 0.8rem;
    color: var(--color-text-muted);
    font-weight: 500;
}

.versus-divider {
    font-size: 0.65rem;
    font-weight: 800;
    color: var(--color-text-tertiary);
    padding: 4px 8px;
    background: var(--color-bg-muted);
    border-radius: var(--radius-sm);
    letter-spacing: 1px;
}

.versus-bar-container {
    display: flex;
    height: 8px;
    border-radius: 4px;
    overflow: hidden;
    background: var(--color-bg-muted);
}

.versus-bar {
    height: 100%;
    transition: width 0.5s ease;
}

.versus-bar--self {
    background: linear-gradient(90deg, var(--color-primary), #6366f1);
}

.versus-bar--opponent {
    background: linear-gradient(90deg, #64748b, #475569);
}

/* Analysis Cards - Polished Design */
.analysis-cards {
    display: grid;
    gap: var(--spacing-md);
}

.analysis-card {
    display: flex;
    gap: var(--spacing-md);
    padding: var(--spacing-lg);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-left: 4px solid var(--color-primary);
    transition: transform var(--transition-fast), box-shadow var(--transition-fast);
}

.analysis-card:hover {
    transform: translateX(4px);
    box-shadow: var(--shadow-md);
}

.analysis-card--situation {
    border-left-color: #3b82f6;
}

.analysis-card--attack {
    border-left-color: #ef4444;
}

.analysis-card--watch {
    border-left-color: #f59e0b;
}

.analysis-card__icon {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-lg);
    font-size: 1.25rem;
}

.analysis-card--situation .analysis-card__icon {
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.15), rgba(59, 130, 246, 0.08));
    color: #3b82f6;
}

.analysis-card--attack .analysis-card__icon {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.15), rgba(239, 68, 68, 0.08));
    color: #ef4444;
}

.analysis-card--watch .analysis-card__icon {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.15), rgba(245, 158, 11, 0.08));
    color: #f59e0b;
}

.analysis-card__content {
    flex: 1;
    min-width: 0;
}

.analysis-card__title {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 var(--spacing-xs) 0;
}

.analysis-card__text {
    font-size: 0.9rem;
    color: var(--text-secondary);
    line-height: 1.6;
    margin: 0;
}

/* ========== END AI 輿情洞察 Styles ========== */

/* Mobile accordion improvements */
@media (max-width: 576px) {
    .accordion-header {
        padding: var(--spacing-md);
    }

    .accordion-title {
        font-size: var(--font-size-base);
    }

    .accordion-body {
        padding: 0 var(--spacing-md) var(--spacing-md);
    }
}

/* CTA Section Styles */
.cta-section {
    margin-top: var(--spacing-xl);
}

.cta-card {
    background: linear-gradient(135deg, var(--color-bg-card) 0%, rgba(124, 92, 255, 0.08) 100%);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    padding: var(--spacing-xl);
    text-align: center;
    position: relative;
    overflow: hidden;
}

.cta-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
}

.cta-header {
    margin-bottom: var(--spacing-lg);
}

.cta-header i {
    font-size: 2.5rem;
    color: var(--color-primary);
    margin-bottom: var(--spacing-sm);
    display: block;
}

.cta-header h3 {
    font-size: var(--font-size-xl);
    font-weight: 600;
    color: var(--color-text-primary);
    margin: 0;
}

.cta-features {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-xl);
    text-align: left;
}

.cta-feature {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm);
    background: rgba(124, 92, 255, 0.05);
    border-radius: var(--radius-md);
}

.cta-feature i {
    font-size: 1.25rem;
    flex-shrink: 0;
}

.cta-feature span {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.cta-actions {
    display: flex;
    justify-content: center;
    gap: var(--spacing-md);
    flex-wrap: wrap;
    margin-bottom: var(--spacing-md);
}

.cta-btn {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-sm) var(--spacing-lg);
    border-radius: var(--radius-full);
    font-weight: 500;
    font-size: var(--font-size-sm);
    text-decoration: none;
    transition: all 0.2s ease;
}

.cta-btn-primary {
    background: var(--color-primary);
    color: white;
}

.cta-btn-primary:hover {
    background: var(--color-primary-hover);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(124, 92, 255, 0.3);
}

.cta-btn-secondary {
    background: var(--color-accent);
    color: white;
}

.cta-btn-secondary:hover {
    background: #e8910e;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(255, 159, 67, 0.3);
}

.cta-btn-outline {
    background: transparent;
    color: var(--color-text-primary);
    border: 1px solid var(--color-border);
}

.cta-btn-outline:hover {
    background: var(--color-bg-tertiary);
    border-color: var(--color-primary);
    color: var(--color-primary);
}

.cta-footer {
    margin-top: var(--spacing-sm);
}

@media (max-width: 768px) {
    .cta-features {
        grid-template-columns: 1fr;
    }

    .cta-actions {
        flex-direction: column;
        align-items: center;
    }

    .cta-btn {
        width: 100%;
        justify-content: center;
        max-width: 280px;
    }
}

/* ========== COMMAND CENTER STYLES ========== */
.command-center {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    padding: var(--spacing-lg);
}

.command-center-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-md);
}

.cc-card {
    display: flex;
    gap: var(--spacing-md);
    padding: var(--spacing-lg);
    background: var(--color-background);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    transition: all 0.2s ease;
}

.cc-card:hover {
    border-color: var(--color-primary);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.cc-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-lg);
    font-size: 1.5rem;
    flex-shrink: 0;
}

.cc-volume .cc-icon { background: rgba(239, 68, 68, 0.1); color: #ef4444; }
.cc-sentiment .cc-icon { background: rgba(245, 158, 11, 0.1); color: #f59e0b; }
.cc-rank .cc-icon { background: rgba(59, 130, 246, 0.1); color: #3b82f6; }
.cc-risk .cc-icon { background: rgba(34, 197, 94, 0.1); color: #22c55e; }

.cc-content {
    flex: 1;
    min-width: 0;
}

.cc-main-value {
    font-size: 1.75rem;
    font-weight: var(--font-weight-bold);
    color: var(--color-text-primary);
    line-height: 1.2;
}

.cc-label {
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
    margin-bottom: var(--spacing-xs);
}

.cc-delta {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    padding: 2px 6px;
    border-radius: var(--radius-sm);
}

.cc-delta.delta-up { background: rgba(34, 197, 94, 0.1); color: #16a34a; }
.cc-delta.delta-down { background: rgba(239, 68, 68, 0.1); color: #dc2626; }
.cc-delta.delta-stable { background: rgba(107, 114, 128, 0.1); color: #6b7280; }
.cc-delta.delta-danger { background: rgba(239, 68, 68, 0.1); color: #dc2626; }
.cc-delta.delta-success { background: rgba(34, 197, 94, 0.1); color: #16a34a; }

.cc-vs {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    margin-left: 4px;
}

/* Risk Card Special Styling */
.cc-risk {
    position: relative;
}

.cc-risk-light {
    flex-shrink: 0;
}

.risk-indicator {
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-full);
    font-size: 1.75rem;
}

.risk-indicator.level-0 { background: rgba(34, 197, 94, 0.15); color: #16a34a; }
.risk-indicator.level-1 { background: rgba(245, 158, 11, 0.15); color: #d97706; }
.risk-indicator.level-2 { background: rgba(249, 115, 22, 0.15); color: #ea580c; }
.risk-indicator.level-3 {
    background: rgba(239, 68, 68, 0.2);
    color: #dc2626;
    animation: pulse-danger 1.5s ease-in-out infinite;
}

@keyframes pulse-danger {
    0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4); }
    50% { box-shadow: 0 0 0 8px rgba(239, 68, 68, 0); }
}

.cc-risk .cc-main-value.risk-label {
    font-size: var(--font-size-xl);
}

.cc-risk-desc {
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
    margin-top: var(--spacing-xs);
    line-height: 1.4;
}

/* Risk border colors */
.cc-card.risk-green { border-left: 4px solid #22c55e; }
.cc-card.risk-yellow { border-left: 4px solid #f59e0b; }
.cc-card.risk-orange { border-left: 4px solid #f97316; }
.cc-card.risk-red { border-left: 4px solid #ef4444; }

/* Warning state for sentiment card */
.cc-card.cc-sentiment.warning {
    border-color: #f59e0b;
    background: rgba(245, 158, 11, 0.05);
}

/* Command Center Footer */
.command-center-footer {
    display: flex;
    justify-content: space-between;
    margin-top: var(--spacing-md);
    padding-top: var(--spacing-md);
    border-top: 1px solid var(--color-border);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

.command-center-footer span {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.command-center-note {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-xs);
    margin-top: var(--spacing-sm);
    padding: var(--spacing-xs) var(--spacing-md);
    background: rgba(251, 191, 36, 0.1);
    border-radius: var(--radius-md);
    font-size: var(--font-size-xs);
    color: #92400e;
}

/* Responsive Command Center */
@media (max-width: 992px) {
    .command-center-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .command-center-grid {
        grid-template-columns: 1fr;
    }

    .cc-card {
        padding: var(--spacing-md);
    }

    .cc-main-value {
        font-size: 1.5rem;
    }

    .command-center-footer {
        flex-direction: column;
        gap: var(--spacing-xs);
    }
}

/* ========== CAMPAIGN DYNAMICS STYLES ========== */

/* Today's Brief */
.todays-brief {
    background: var(--color-background);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.brief-title {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    margin: 0 0 var(--spacing-md);
}

.brief-title i {
    color: var(--color-primary);
}

.brief-list {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.brief-item {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    text-decoration: none;
    transition: all 0.2s ease;
    border-left: 3px solid var(--color-border);
}

.brief-item:hover {
    border-color: var(--color-primary);
    border-left-color: var(--color-primary);
    background: var(--color-primary-bg);
}

.brief-item.brief-volume { border-left-color: #22c55e; }
.brief-item.brief-negative { border-left-color: #ef4444; }
.brief-item.brief-competitor { border-left-color: #3b82f6; }

.brief-icon {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    flex-shrink: 0;
}

.brief-volume .brief-icon { background: rgba(34, 197, 94, 0.1); color: #16a34a; }
.brief-negative .brief-icon { background: rgba(239, 68, 68, 0.1); color: #dc2626; }
.brief-competitor .brief-icon { background: rgba(59, 130, 246, 0.1); color: #3b82f6; }

.brief-text {
    flex: 1;
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
    line-height: 1.5;
}

.brief-arrow {
    color: var(--color-text-muted);
    transition: transform 0.2s ease;
}

.brief-item:hover .brief-arrow {
    transform: translateX(4px);
    color: var(--color-primary);
}

/* Campaign Timeline */
.campaign-timeline {
    background: var(--color-background);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.timeline-title {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    margin: 0 0 var(--spacing-md);
}

.timeline-title i {
    color: var(--color-primary);
}

.timeline-list {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.timeline-item {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--color-surface);
    border-radius: var(--radius-md);
    text-decoration: none;
    transition: background 0.2s ease;
}

.timeline-item:hover {
    background: var(--color-primary-bg);
}

.timeline-time {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 50px;
    flex-shrink: 0;
}

.time-value {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.time-date {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

.timeline-tag {
    padding: 2px 8px;
    border-radius: var(--radius-full);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    flex-shrink: 0;
}

.tag-media { background: rgba(59, 130, 246, 0.1); color: #2563eb; }
.tag-social { background: rgba(168, 85, 247, 0.1); color: #7c3aed; }
.tag-forum { background: rgba(245, 158, 11, 0.1); color: #d97706; }

.timeline-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.timeline-event-title {
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.timeline-source {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    display: flex;
    align-items: center;
    gap: 4px;
}

/* Controversy Tracker */
.controversy-tracker {
    background: var(--color-background);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.tracker-title {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    margin: 0 0 var(--spacing-md);
}

.tracker-title i {
    color: #f59e0b;
}

.controversy-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--spacing-md);
}

.controversy-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-md);
    border-left: 4px solid var(--color-border);
}

.controversy-card.risk-high { border-left-color: #ef4444; }
.controversy-card.risk-medium { border-left-color: #f59e0b; }
.controversy-card.risk-low { border-left-color: #22c55e; }

.controversy-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--spacing-md);
}

.controversy-name {
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.controversy-status {
    font-size: var(--font-size-sm);
}

.status-heating { color: #ef4444; }
.status-cooling { color: #22c55e; }
.status-recurring { color: #f59e0b; }

.controversy-body {
    display: flex;
    gap: var(--spacing-md);
    align-items: center;
}

.controversy-sparkline {
    flex: 1;
    height: 32px;
    background: var(--color-background);
    border-radius: var(--radius-sm);
    padding: var(--spacing-xs);
}

.controversy-sparkline svg {
    width: 100%;
    height: 100%;
}

.controversy-stats {
    display: flex;
    gap: var(--spacing-md);
}

.controversy-stats .stat-item {
    text-align: center;
}

.controversy-stats .stat-value {
    display: block;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-bold);
    color: var(--color-text-primary);
}

.controversy-stats .stat-label {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

/* PK Quick Card */
.pk-quick-card {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-md) var(--spacing-lg);
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.05), rgba(249, 115, 22, 0.05));
    border: 1px solid rgba(239, 68, 68, 0.2);
    border-radius: var(--radius-lg);
    text-decoration: none;
    transition: all var(--transition-fast);
}

.pk-quick-card:hover {
    border-color: rgba(239, 68, 68, 0.4);
    box-shadow: 0 4px 12px rgba(239, 68, 68, 0.1);
    transform: translateY(-1px);
}

.pk-quick-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(239, 68, 68, 0.1);
    border-radius: var(--radius-md);
    color: #dc2626;
    font-size: 1.25rem;
}

.pk-quick-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.pk-quick-title {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.pk-quick-desc {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

.pk-quick-arrow {
    color: var(--color-text-muted);
    font-size: var(--font-size-lg);
}

.pk-quick-card:hover .pk-quick-arrow {
    color: #dc2626;
}

.pk-bar-cta {
    display: block;
    text-align: center;
    margin-top: var(--spacing-md);
    color: var(--color-primary);
    font-size: var(--font-size-sm);
    text-decoration: none;
}

.pk-bar-cta:hover {
    text-decoration: underline;
}

/* Responsive Campaign Dynamics */
@media (max-width: 576px) {
    .brief-item {
        flex-wrap: wrap;
    }

    .brief-text {
        flex-basis: calc(100% - 52px);
    }

    .timeline-item {
        flex-wrap: wrap;
    }

    .timeline-content {
        flex-basis: 100%;
        margin-top: var(--spacing-xs);
    }

    .controversy-body {
        flex-direction: column;
    }

    .controversy-sparkline {
        width: 100%;
    }

    .pk-bar-self, .pk-bar-opponent {
        flex-direction: column;
        justify-content: center;
        padding: var(--spacing-sm);
        min-width: 80px;
    }
}

/* ========== KOL ANALYSIS STYLES ========== */
/* KOL and Persona section icons (border handled by unified accordion styles) */
.accordion-section.kol .accordion-title i { color: #ec4899; }
.accordion-section.persona .accordion-title i { color: #06b6d4; }

/* KOL Overview */
.kol-overview {
    background: var(--color-background);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.kol-stat-row {
    display: flex;
    align-items: center;
    gap: var(--spacing-xl);
}

.kol-stat {
    text-align: center;
    flex-shrink: 0;
}

.kol-stat-number {
    display: block;
    font-size: 2rem;
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    line-height: 1;
}

.kol-stat-label {
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
}

.kol-stance-breakdown {
    flex: 1;
}

.stance-bar {
    display: flex;
    height: 12px;
    border-radius: var(--radius-full);
    overflow: hidden;
    background: var(--color-border);
}

.stance-segment {
    transition: width 0.3s ease;
}

.stance-segment.positive { background: #22c55e; }
.stance-segment.neutral { background: #9ca3af; }
.stance-segment.negative { background: #ef4444; }

.stance-legend {
    display: flex;
    gap: var(--spacing-lg);
    margin-top: var(--spacing-sm);
    font-size: var(--font-size-sm);
}

.stance-legend .legend-item {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.stance-legend .dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.stance-legend .dot.positive { background: #22c55e; }
.stance-legend .dot.neutral { background: #9ca3af; }
.stance-legend .dot.negative { background: #ef4444; }

/* KOL List */
.kol-list {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.kol-item {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: var(--spacing-md);
    align-items: center;
    padding: var(--spacing-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    transition: all 0.2s ease;
}

.kol-item:hover {
    border-color: var(--color-primary);
    box-shadow: 0 2px 8px rgba(124, 92, 255, 0.1);
}

.kol-item.gated {
    opacity: 0.6;
    filter: blur(1px);
    pointer-events: none;
}

.kol-rank {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-primary-bg);
    color: var(--color-primary);
    border-radius: var(--radius-md);
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-sm);
}

.kol-info {
    min-width: 0;
}

.kol-name {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-primary);
}

.kol-name i {
    color: var(--color-text-muted);
}

.gated-badge {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

.kol-meta {
    display: flex;
    gap: var(--spacing-sm);
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
}

.kol-stance {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-full);
    font-size: var(--font-size-lg);
}

.kol-stance.stance-positive { background: rgba(34, 197, 94, 0.1); color: #16a34a; }
.kol-stance.stance-neutral { background: rgba(107, 114, 128, 0.1); color: #6b7280; }
.kol-stance.stance-negative { background: rgba(239, 68, 68, 0.1); color: #dc2626; }

.kol-score {
    text-align: center;
    min-width: 60px;
}

.score-value {
    display: block;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
}

.score-label {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

/* Gated Content CTA */
.kol-gated-cta {
    margin-top: var(--spacing-lg);
    position: relative;
}

.gated-overlay {
    background: linear-gradient(135deg, rgba(124, 92, 255, 0.05), rgba(236, 72, 153, 0.05));
    border: 2px dashed var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-xl);
    text-align: center;
}

.gated-overlay i {
    font-size: 2rem;
    color: var(--color-text-muted);
    margin-bottom: var(--spacing-sm);
}

.gated-overlay h4 {
    margin: 0 0 var(--spacing-sm);
    font-size: var(--font-size-lg);
    color: var(--color-text-primary);
}

.gated-overlay p {
    margin: 0 0 var(--spacing-md);
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
}

/* Suspicious Alert */
.suspicious-alert {
    display: flex;
    gap: var(--spacing-md);
    align-items: center;
    margin-top: var(--spacing-lg);
    padding: var(--spacing-md);
    border-radius: var(--radius-lg);
    background: rgba(251, 191, 36, 0.1);
    border: 1px solid rgba(251, 191, 36, 0.3);
}

.suspicious-alert.alert-high {
    background: rgba(239, 68, 68, 0.1);
    border-color: rgba(239, 68, 68, 0.3);
}

.alert-icon {
    font-size: 1.5rem;
    color: #f59e0b;
}

.alert-high .alert-icon { color: #dc2626; }

.alert-content {
    flex: 1;
}

.alert-content strong {
    display: block;
    color: var(--color-text-primary);
}

.alert-content p {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.alert-badge {
    padding: var(--spacing-xs) var(--spacing-sm);
    background: rgba(251, 191, 36, 0.2);
    border-radius: var(--radius-full);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: #b45309;
}

.alert-high .alert-badge {
    background: rgba(239, 68, 68, 0.2);
    color: #dc2626;
}

/* KOL Battle Grid (友軍 vs 敵軍) */
.kol-summary-row {
    display: flex;
    gap: var(--spacing-lg);
    justify-content: center;
    padding: var(--spacing-md);
    background: var(--color-background);
    border-radius: var(--radius-lg);
}

.kol-summary-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.kol-summary-stat .stat-number {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
}

.kol-summary-stat .stat-label {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

.kol-battle-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-lg);
}

.kol-team-card {
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.kol-team-ally {
    border: 1px solid rgba(34, 197, 94, 0.3);
    background: linear-gradient(180deg, rgba(34, 197, 94, 0.05) 0%, var(--color-surface) 100%);
}

.kol-team-opponent {
    border: 1px solid rgba(239, 68, 68, 0.3);
    background: linear-gradient(180deg, rgba(239, 68, 68, 0.05) 0%, var(--color-surface) 100%);
}

.kol-team-header {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) var(--spacing-md);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-sm);
}

.kol-team-ally .kol-team-header {
    background: rgba(34, 197, 94, 0.1);
    color: #16a34a;
}

.kol-team-opponent .kol-team-header {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
}

.kol-team-list {
    padding: var(--spacing-sm);
}

.kol-team-item {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm);
    border-radius: var(--radius-md);
    transition: background var(--transition-fast);
}

.kol-team-item:hover {
    background: var(--color-background);
}

.kol-item-rank {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-bold);
    color: var(--color-text-muted);
    background: var(--color-background);
    border-radius: var(--radius-sm);
}

.kol-item-info {
    flex: 1;
    min-width: 0;
}

.kol-item-name {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-primary);
}

.kol-item-name i {
    color: var(--color-text-muted);
    font-size: var(--font-size-xs);
}

.kol-item-meta {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

.kol-item-score {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
}

/* KOL Lead Generation CTA */
.kol-lead-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--spacing-md);
    margin-top: var(--spacing-lg);
    padding: var(--spacing-md) var(--spacing-lg);
    background: linear-gradient(135deg, rgba(124, 92, 255, 0.08), rgba(236, 72, 153, 0.08));
    border: 1px solid rgba(124, 92, 255, 0.2);
    border-radius: var(--radius-lg);
}

.kol-lead-content {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
}

.kol-lead-content > i {
    font-size: 1.5rem;
    color: var(--color-primary);
}

.kol-lead-text {
    display: flex;
    flex-direction: column;
}

.kol-lead-text strong {
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
}

.kol-lead-text span {
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
}

.kol-lead-btn {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--color-primary);
    color: white;
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    transition: all var(--transition-fast);
    white-space: nowrap;
}

.kol-lead-btn:hover {
    background: var(--color-primary-dark);
    transform: translateY(-1px);
}

@media (max-width: 768px) {
    .kol-battle-grid {
        grid-template-columns: 1fr;
    }

    .kol-lead-cta {
        flex-direction: column;
        text-align: center;
    }

    .kol-lead-content {
        flex-direction: column;
    }
}

/* ========== VOTER PERSONA STYLES ========== */
.persona-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-lg);
}

.persona-card {
    background: var(--color-background);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.persona-card-title {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    margin: 0 0 var(--spacing-md);
}

.persona-card-title i {
    color: var(--color-primary);
}

.persona-insight {
    margin: var(--spacing-md) 0 0;
    padding-top: var(--spacing-md);
    border-top: 1px solid var(--color-border);
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
}

/* Age Chart */
.age-chart {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.age-bar-row {
    display: grid;
    grid-template-columns: 50px 1fr 40px 24px;
    gap: var(--spacing-sm);
    align-items: center;
}

.age-label {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.age-bar-container {
    height: 8px;
    background: var(--color-border);
    border-radius: var(--radius-full);
    overflow: hidden;
}

.age-bar {
    height: 100%;
    background: linear-gradient(90deg, #06b6d4, #0891b2);
    border-radius: var(--radius-full);
    transition: width 0.3s ease;
}

.age-pct {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-primary);
    text-align: right;
}

.age-trend {
    font-size: var(--font-size-lg);
}

.age-trend.up { color: #22c55e; }
.age-trend.down { color: #ef4444; }

/* Gender Chart */
.gender-chart {
    margin-bottom: var(--spacing-sm);
}

.gender-bar {
    display: flex;
    height: 40px;
    border-radius: var(--radius-md);
    overflow: hidden;
}

.gender-segment {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-xs);
    color: white;
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-sm);
    transition: width 0.3s ease;
}

.gender-segment.male { background: #3b82f6; }
.gender-segment.female { background: #ec4899; }

/* Interest Topics */
.interest-list {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.interest-item {
    display: grid;
    grid-template-columns: 24px 1fr 80px 32px;
    gap: var(--spacing-sm);
    align-items: center;
}

.interest-item i {
    color: var(--color-text-muted);
}

.interest-name {
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
}

.interest-bar-container {
    height: 6px;
    background: var(--color-border);
    border-radius: var(--radius-full);
    overflow: hidden;
}

.interest-bar {
    height: 100%;
    background: linear-gradient(90deg, var(--color-primary), #a855f7);
    border-radius: var(--radius-full);
}

.interest-score {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    text-align: right;
}

/* Political Spectrum */
.spectrum-chart {
    margin-top: var(--spacing-sm);
}

.spectrum-bar {
    display: flex;
    height: 24px;
    border-radius: var(--radius-md);
    overflow: hidden;
}

.spectrum-segment {
    transition: width 0.3s ease;
}

.spectrum-segment.deep-green { background: #15803d; }
.spectrum-segment.light-green { background: #4ade80; }
.spectrum-segment.neutral { background: #9ca3af; }
.spectrum-segment.light-blue { background: #60a5fa; }
.spectrum-segment.deep-blue { background: #1d4ed8; }

.spectrum-legend {
    display: flex;
    justify-content: space-between;
    margin-top: var(--spacing-xs);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

/* Swing Voters Section */
.swing-voters-section {
    background: var(--color-background);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.swing-content {
    display: flex;
    gap: var(--spacing-xl);
    align-items: center;
    margin-top: var(--spacing-md);
}

.swing-stat {
    text-align: center;
    flex-shrink: 0;
}

.swing-pct {
    display: block;
    font-size: 2.5rem;
    font-weight: var(--font-weight-bold);
    color: #f59e0b;
    line-height: 1;
}

.swing-label {
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
}

.swing-topics {
    flex: 1;
}

.swing-topics p {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.topic-tags {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
}

.topic-tag {
    padding: var(--spacing-xs) var(--spacing-sm);
    background: rgba(245, 158, 11, 0.1);
    border: 1px solid rgba(245, 158, 11, 0.3);
    border-radius: var(--radius-full);
    font-size: var(--font-size-sm);
    color: #b45309;
}

/* Persuadable List */
.persuadable-list {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.persuadable-item {
    padding: var(--spacing-md);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    border-left: 3px solid var(--color-border);
}

.persuadable-item.potential-high {
    border-left-color: #22c55e;
    background: rgba(34, 197, 94, 0.05);
}

.persuadable-item.potential-medium {
    border-left-color: #f59e0b;
    background: rgba(245, 158, 11, 0.05);
}

.persuadable-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--spacing-xs);
}

.persuadable-topic {
    font-weight: var(--font-weight-medium);
    color: var(--color-text-primary);
}

.persuadable-potential {
    font-size: var(--font-size-sm);
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.potential-high .persuadable-potential { color: #16a34a; }
.potential-medium .persuadable-potential { color: #d97706; }

.persuadable-desc {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

/* Persona CTA */
.persona-cta {
    display: flex;
    align-items: center;
    gap: var(--spacing-lg);
    padding: var(--spacing-lg);
    background: linear-gradient(135deg, rgba(6, 182, 212, 0.08), rgba(124, 92, 255, 0.08));
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
}

.persona-cta .cta-icon {
    font-size: 2rem;
    color: var(--color-primary);
}

.persona-cta .cta-content {
    flex: 1;
}

.persona-cta .cta-content h4 {
    margin: 0 0 var(--spacing-xs);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.persona-cta .cta-content p {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

/* Responsive for KOL & Persona */
@media (max-width: 768px) {
    .kol-item {
        grid-template-columns: auto 1fr;
    }

    .kol-score {
        display: none;
    }

    .persona-grid {
        grid-template-columns: 1fr;
    }

    .swing-content {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
    }

    .persona-cta {
        flex-direction: column;
        text-align: center;
    }
}

/* ========== ENHANCED SENTIMENT INSIGHTS ========== */
.sentiment-insights-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-lg);
}

.insight-card {
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    overflow: hidden;
}

.insight-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--spacing-md) var(--spacing-lg);
    background: var(--color-background);
    border-bottom: 1px solid var(--color-border);
}

.insight-title {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    margin: 0;
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.insight-title i {
    color: var(--color-primary);
}

.insight-badge {
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--radius-full);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
}

.insight-badge.badge-low {
    background: rgba(34, 197, 94, 0.1);
    color: #16a34a;
}

.insight-badge.badge-medium {
    background: rgba(251, 191, 36, 0.1);
    color: #d97706;
}

.insight-badge.badge-high {
    background: rgba(249, 115, 22, 0.1);
    color: #ea580c;
}

.insight-badge.badge-media {
    background: rgba(59, 130, 246, 0.1);
    color: #2563eb;
}

.insight-badge.badge-social {
    background: rgba(168, 85, 247, 0.1);
    color: #9333ea;
}

.insight-body {
    padding: var(--spacing-lg);
}

/* Concentration Meter */
.concentration-meter {
    margin-bottom: var(--spacing-md);
}

.meter-label {
    display: flex;
    justify-content: space-between;
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    margin-bottom: var(--spacing-xs);
}

.meter-bar {
    position: relative;
    height: 12px;
    background: linear-gradient(90deg, #22c55e 0%, #fbbf24 50%, #ef4444 100%);
    border-radius: var(--radius-full);
    overflow: visible;
}

.meter-fill {
    height: 100%;
    border-radius: var(--radius-full);
    transition: width 0.3s ease;
}

.meter-marker {
    position: absolute;
    top: -4px;
    width: 4px;
    height: 20px;
    background: var(--color-text-primary);
    border-radius: 2px;
    transform: translateX(-50%);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.meter-value {
    text-align: center;
    margin-top: var(--spacing-xs);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-bold);
    color: var(--color-text-primary);
}

.insight-desc {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: 0 0 var(--spacing-md);
    line-height: 1.5;
}

.insight-detail {
    display: flex;
    justify-content: space-between;
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--color-background);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
}

.detail-label {
    color: var(--color-text-muted);
}

.detail-value {
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

/* Risk indicator borders */
.insight-card.risk-low {
    border-left: 4px solid #22c55e;
}

.insight-card.risk-medium {
    border-left: 4px solid #fbbf24;
}

.insight-card.risk-high {
    border-left: 4px solid #ef4444;
}

/* Breakdown Bar */
.breakdown-bar {
    display: flex;
    height: 48px;
    border-radius: var(--radius-md);
    overflow: hidden;
    margin-bottom: var(--spacing-md);
}

.breakdown-segment {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: white;
    min-width: 60px;
    transition: width 0.3s ease;
}

.breakdown-segment.media {
    background: linear-gradient(135deg, #3b82f6, #2563eb);
}

.breakdown-segment.social {
    background: linear-gradient(135deg, #a855f7, #9333ea);
}

.segment-label {
    font-size: var(--font-size-xs);
    opacity: 0.9;
}

.segment-value {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-bold);
}

/* Breakdown Sources */
.breakdown-sources {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
    margin-top: var(--spacing-md);
}

.source-item {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--color-background);
    border-radius: var(--radius-md);
}

.source-item i {
    color: var(--color-text-muted);
    width: 20px;
    text-align: center;
}

.source-name {
    flex: 1;
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
}

.source-pct {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
}

/* Responsive Sentiment Insights */
@media (max-width: 768px) {
    .sentiment-insights-grid {
        grid-template-columns: 1fr;
    }

    .breakdown-segment {
        min-width: 50px;
    }

    .segment-label {
        font-size: 10px;
    }

    .segment-value {
        font-size: var(--font-size-sm);
    }
}