:root {
      --bg-body: #ECEEF8; --bg-card: rgba(255,255,255,0.85); --bg-elevated: #F3F4FB; --bg-hover: #E8E9F5;
      --blue-50: #EEF2FF; --blue-100: #E0E7FF; --blue-200: #C7D2FE; --blue-300: #A5B4FC;
      --blue-400: #818CF8; --blue-500: #6366F1; --blue-600: #4F46E5; --blue-700: #4338CA;
      --blue-800: #3730A3; --blue-900: #312E81;
      --green-500: #10B981; --green-100: #D1FAE5;
      --red-500: #EF4444; --red-100: #FEE2E2;
      --yellow-500: #F59E0B; --yellow-100: #FEF3C7;
      --accent-primary: #4F46E5; --sidebar-bg: linear-gradient(180deg, #1E1B3A 0%, #13112B 100%); --sidebar-hover: rgba(255,255,255,0.08); --sidebar-active: #4F46E5;
      --text-primary: #1E293B; --text-secondary: #64748B; --text-muted: #94A3B8; --border: rgba(199,210,254,0.4);
      --shadow-sm: 0 1px 3px rgba(79,70,229,0.04); --shadow-md: 0 4px 16px rgba(79,70,229,0.06); --shadow-lg: 0 12px 28px rgba(79,70,229,0.1);
      --glass: rgba(255,255,255,0.85); --glass-border: rgba(255,255,255,0.6); --glass-blur: blur(20px);
    }
    * { margin: 0; padding: 0; box-sizing: border-box; }
    html { font-size: 14px; scroll-behavior: smooth; }
    ::-webkit-scrollbar { width: 6px; }
    ::-webkit-scrollbar-track { background: transparent; }
    ::-webkit-scrollbar-thumb { background: var(--blue-200); border-radius: 3px; }
    body { font-family: 'Inter', 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: var(--bg-body); color: var(--text-primary); line-height: 1.5; }
    
    .sidebar { position: fixed; left: 12px; top: 12px; width: 220px; height: calc(100vh - 24px); background: linear-gradient(180deg, #1E1B3A 0%, #13112B 100%); overflow-y: auto; z-index: 100; display: flex; flex-direction: column; border-radius: 16px; box-shadow: 0 8px 32px rgba(0,0,0,0.3); border: 1px solid rgba(255,255,255,0.08); }
    .sidebar-header { padding: 14px 12px 10px; }
    .logo { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
    .logo-icon { width: 34px; height: 34px; background: var(--accent-primary); border-radius: 5px; display: flex; align-items: center; justify-content: center; }
    .logo-icon svg { width: 20px; height: 20px; }
    .logo-text { font-size: 17px; font-weight: 700; color: #FFFFFF; }
    .logo-sub { font-size: 10px; color: rgba(255,255,255,0.5); font-weight: 500; }
    .brand-badge { display: flex; align-items: center; gap: 8px; padding: 8px 10px; background: rgba(255,255,255,0.06); border-radius: 8px; border: 1px solid rgba(255,255,255,0.1); }
    .brand-score { width: 40px; height: 40px; border-radius: 50%; background: conic-gradient(#FF1414 0% 33%, rgba(255,255,255,0.1) 27% 100%); display: flex; align-items: center; justify-content: center; }
    .brand-score-inner { width: 32px; height: 32px; background: #1E1B3A; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; color: #FFFFFF; }
    .brand-info h3 { font-size: 13px; font-weight: 600; color: #FFFFFF; }
    .brand-info p { font-size: 10px; color: rgba(255,255,255,0.5); }
    .nav-section { padding: 0 8px; margin-bottom: 2px; }
    .nav-title { font-size: 9px; font-weight: 600; color: rgba(255,255,255,0.4); text-transform: uppercase; letter-spacing: 1px; padding: 0 10px; margin-bottom: 6px; }
    .nav-item { display: flex; align-items: center; justify-content: space-between; padding: 6px 10px; color: rgba(255,255,255,0.6); text-decoration: none; font-size: 11px; font-weight: 500; border-radius: 6px; transition: all 0.15s; margin-bottom: 1px; cursor: pointer; }
    .nav-item:hover { background: rgba(255,255,255,0.08); color: #FFFFFF; }
    .nav-item.active { background: var(--sidebar-active); color: white; font-weight: 600; border-radius: 8px; }
    .nav-badge { font-size: 9px; padding: 2px 6px; border-radius: 4px; font-weight: 600; background: rgba(255,255,255,0.15); color: white; }
    .sidebar-footer { margin-top: auto; padding: 8px 10px; border-top: 1px solid rgba(255,255,255,0.08); }
    .sidebar-btn { display: flex; align-items: center; gap: 6px; width: 100%; padding: 6px 10px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.08); border-radius: 6px; color: rgba(255,255,255,0.6); font-size: 10px; font-weight: 500; cursor: pointer; margin-bottom: 3px; transition: all 0.15s; }
    .sidebar-btn:hover { background: rgba(255,255,255,0.12); color: #FFFFFF; }
    .sidebar-btn svg { width: 14px; height: 14px; }

    .main { margin-left: 244px; min-height: 100vh; padding: 12px; background: var(--bg-body); overflow-x: hidden; max-width: 100vw; box-sizing: border-box; }
    .module-section { margin: 0; padding: 0; }
    .module-section > .section:first-child { margin-top: 0; }
    .main.hidden { display: none; }
    .top-bar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; padding: 14px 18px; background: var(--bg-card); border-radius: 3px; border: 1px solid var(--border); }
    .top-bar-left { display: flex; align-items: center; gap: 16px; }
    .date-range { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--text-secondary); }
    .date-range select { background: var(--bg-elevated); border: 1px solid var(--border); padding: 6px 10px; border-radius: 3px; font-size: 11px; color: var(--text-primary); }
    .top-bar-right { display: flex; align-items: center; gap: 10px; }
    .top-btn { display: flex; align-items: center; gap: 6px; padding: 8px 14px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 4px; font-size: 11px; font-weight: 500; color: var(--text-secondary); cursor: pointer; transition: all 0.15s; }
    .top-btn:hover { background: var(--blue-50); color: var(--blue-600); border-color: var(--blue-200); }
    .top-btn.primary { background: var(--blue-500); color: white; border-color: var(--blue-500); }
    .top-btn.primary:hover { background: var(--blue-600); }

    .data-source-bar { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; padding: 12px 16px; background: var(--bg-card); border-radius: 5px; border: 1px solid var(--border); overflow-x: auto; }
    .data-source-label { font-size: 11px; font-weight: 600; color: var(--text-muted); white-space: nowrap; }
    .data-source-items { display: flex; gap: 8px; flex: 1; }
    .data-source-item { display: flex; align-items: center; gap: 6px; padding: 6px 12px; background: var(--bg-elevated); border-radius: 3px; font-size: 11px; white-space: nowrap; }
    .data-source-item .icon { font-size: 14px; }
    .data-source-item .name { color: var(--text-secondary); }
    .data-source-item .count { font-weight: 700; color: var(--blue-500); }
    .data-source-total { padding: 6px 14px; background: var(--blue-500); color: white; border-radius: 3px; font-size: 11px; font-weight: 600; white-space: nowrap; }

    .section { margin-bottom: 28px; background: var(--glass); backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur); border: 1px solid var(--glass-border); border-radius: 16px; padding: 24px; box-shadow: var(--shadow-sm); }
    .section.hidden { display: none; }
    .section-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 16px; }
    .section-tag { display: inline-block; font-size: 10px; font-weight: 600; color: var(--blue-400); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 2px; }
    .section-title { font-size: 17px; font-weight: 700; color: var(--text-primary); }
    .section-desc { font-size: 12px; color: var(--text-secondary); margin-top: 2px; }
    .section-filters { display: flex; gap: 8px; align-items: center; }
    .section-filter { padding: 6px 10px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 3px; font-size: 10px; color: var(--text-secondary); cursor: pointer; }

    .card { background: var(--glass); backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur); border: 1px solid var(--glass-border); border-radius: 12px; padding: 20px; box-shadow: var(--shadow-md); transition: all 0.2s ease; }
    .card:hover { box-shadow: var(--shadow-lg); }
    .card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
    .card-title { font-size: 13px; font-weight: 600; color: var(--text-primary); }
    .card-action { font-size: 10px; color: var(--blue-500); cursor: pointer; font-weight: 500; }
    .card-action:hover { text-decoration: underline; }
    .grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
    .grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
    .grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
    .grid-5 { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }

    .kpi-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; margin-bottom: 20px; }
    .kpi-card { background: var(--glass); backdrop-filter: var(--glass-blur); border: 1px solid var(--glass-border); border-radius: 12px; padding: 16px; box-shadow: var(--shadow-sm); transition: all 0.2s; cursor: pointer; }
    .kpi-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
    .kpi-card:hover { box-shadow: var(--shadow-md); transform: translateY(-1px); }
    .kpi-top { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 10px; }
    .kpi-icon { width: 38px; height: 38px; border-radius: 5px; background: var(--blue-50); display: flex; align-items: center; justify-content: center; font-size: 16px; }
    .kpi-mini-chart { width: 60px; height: 30px; }
    .kpi-label { font-size: 11px; color: var(--text-muted); margin-bottom: 4px; font-weight: 500; }
    .kpi-value { font-size: 22px; font-weight: 700; color: var(--blue-500); line-height: 1; margin-bottom: 6px; }
    .kpi-change { display: inline-flex; align-items: center; gap: 3px; font-size: 10px; padding: 3px 8px; background: var(--blue-50); color: var(--blue-500); border-radius: 3px; font-weight: 600; }
    .kpi-change.negative { background: #FFE5E5; color: #DC2626; }

    /* Sentiment Mini Bars */
    .sentiment-mini { margin-top: 8px; }
    .sentiment-mini-row { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
    .sentiment-mini-label { font-size: 9px; width: 50px; color: var(--text-muted); }
    .sentiment-mini-bar { flex: 1; height: 6px; background: var(--bg-elevated); border-radius: 3px; overflow: hidden; }
    .sentiment-mini-fill { height: 100%; border-radius: 3px; }
    .sentiment-mini-value { font-size: 9px; font-weight: 600; width: 30px; text-align: right; }

    .highlight-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-bottom: 16px; }
    .highlight-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 3px; padding: 16px; position: relative; overflow: hidden; box-shadow: var(--shadow-sm); cursor: pointer; transition: all 0.2s; }
    .highlight-card:hover { box-shadow: var(--shadow-md); }
    .highlight-card::before { content: ''; position: absolute; top: 0; left: 0; width: 4px; height: 100%; background: var(--blue-500); }
    .highlight-card.risk::before { background: var(--blue-700); }
    .highlight-card.opportunity::before { background: var(--blue-400); }
    .highlight-top { display: flex; justify-content: space-between; align-items: flex-start; }
    .highlight-icon { width: 42px; height: 42px; border-radius: 5px; background: var(--blue-50); display: flex; align-items: center; justify-content: center; font-size: 20px; margin-bottom: 12px; }
    .highlight-action { font-size: 10px; color: var(--blue-500); font-weight: 600; padding: 4px 10px; background: var(--blue-50); border-radius: 3px; }
    .highlight-label { font-size: 9px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: var(--blue-600); margin-bottom: 4px; }
    .highlight-title { font-size: 14px; font-weight: 700; color: var(--text-primary); margin-bottom: 6px; }
    .highlight-desc { font-size: 11px; color: var(--text-secondary); line-height: 1.5; }

    .trend-chart-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 3px; padding: 18px; margin-bottom: 16px; }
    .chart-container { height: 200px; position: relative; }

    .benchmark-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 3px; padding: 18px; }
    .benchmark-row { display: flex; align-items: center; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--border); }
    .benchmark-row:last-child { border-bottom: none; }
    .benchmark-label { font-size: 12px; color: var(--text-secondary); }
    .benchmark-value { font-size: 16px; font-weight: 700; }
    .benchmark-value.negative { color: var(--blue-500); }
    .benchmark-value.neutral { color: var(--text-muted); }
    .benchmark-value.positive { color: var(--blue-400); }
    .benchmark-bar { flex: 1; margin: 0 16px; height: 8px; background: var(--bg-elevated); border-radius: 4px; overflow: hidden; }
    .benchmark-fill { height: 100%; border-radius: 4px; }

    .roi-card { background: linear-gradient(135deg, #00399E, #000B68); border-radius: 3px; padding: 18px; color: white; }
    .roi-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
    .roi-title { font-size: 14px; font-weight: 700; }
    .roi-badge { font-size: 10px; padding: 4px 10px; background: rgba(255,255,255,0.2); border-radius: 3px; }
    .roi-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
    .roi-item { text-align: center; padding: 12px; background: rgba(255,255,255,0.1); border-radius: 5px; }
    .roi-item-label { font-size: 10px; opacity: 0.8; margin-bottom: 4px; }
    .roi-item-value { font-size: 18px; font-weight: 700; }
    .roi-item-change { font-size: 10px; margin-top: 4px; opacity: 0.9; }

    /* AI Insight Card */
    .ai-insight-card { background: linear-gradient(135deg, #000B68, #1A2258); border-radius: 3px; padding: 18px; color: white; margin-bottom: 16px; }
    .ai-insight-header { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
    .ai-insight-icon { width: 36px; height: 36px; background: rgba(255,255,255,0.1); border-radius: 5px; display: flex; align-items: center; justify-content: center; font-size: 18px; }
    .ai-insight-title { font-size: 14px; font-weight: 700; }
    .ai-insight-badge { font-size: 9px; padding: 3px 8px; background: var(--blue-500); border-radius: 5px; margin-left: auto; }
    .ai-insight-list { list-style: none; }
    .ai-insight-list li { padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,0.1); font-size: 12px; display: flex; align-items: flex-start; gap: 8px; }
    .ai-insight-list li:last-child { border-bottom: none; }
    .ai-insight-list li::before { content: ''; display: inline-block; width: 12px; height: 12px; background: currentColor; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M9 18h6'/%3E%3Cpath d='M10 22h4'/%3E%3Cpath d='M15.09 14c.18-.98.65-1.74 1.41-2.5A4.65 4.65 0 0 0 18 8 6 6 0 0 0 6 8c0 1 .23 2.23 1.5 3.5A4.61 4.61 0 0 1 8.91 14'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M9 18h6'/%3E%3Cpath d='M10 22h4'/%3E%3Cpath d='M15.09 14c.18-.98.65-1.74 1.41-2.5A4.65 4.65 0 0 0 18 8 6 6 0 0 0 6 8c0 1 .23 2.23 1.5 3.5A4.61 4.61 0 0 1 8.91 14'/%3E%3C/svg%3E"); -webkit-mask-size: contain; mask-size: contain; flex-shrink: 0; }

    /* SoV vs Sentiment Table */
    .sov-sentiment-table { width: 100%; border-collapse: collapse; }
    .sov-sentiment-table th { padding: 10px 8px; font-size: 10px; font-weight: 600; color: var(--text-muted); text-align: left; background: var(--bg-elevated); border-bottom: 1px solid var(--border); }
    .sov-sentiment-table td { padding: 10px 8px; font-size: 11px; border-bottom: 1px solid var(--border); }
    .sov-sentiment-table tr:last-child td { border-bottom: none; }
    .sov-sentiment-table .brand-cell { font-weight: 600; color: var(--text-primary); }
    .sov-sentiment-table .highlight-row { background: var(--blue-50); }
    .sov-sentiment-table .highlight-row .brand-cell { color: var(--blue-500); }
    .sentiment-badge { display: inline-block; padding: 2px 8px; border-radius: 5px; font-size: 10px; font-weight: 600; }
    .sentiment-badge.positive { background: #D1FAE5; color: #059669; }
    .sentiment-badge.negative { background: #FFE5E5; color: #DC2626; }
    .sentiment-badge.neutral { background: #FEF3C7; color: #D97706; }

    /* Trending Keywords */
    .trending-keywords { display: flex; flex-direction: column; gap: 8px; }
    .trending-keyword { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 4px; padding: 10px 12px; background: var(--bg-elevated); border-radius: 4px; border: none; }
    .trending-keyword-text { font-size: 12px; font-weight: 600; color: var(--text-primary); }
    .trending-keyword-change { font-size: 11px; font-weight: 700; padding: 3px 8px; border-radius: 3px; }
    .trending-keyword-change.up { background: #FFE5E5; color: #DC2626; }
    .trending-keyword-change.down { background: #D1FAE5; color: #059669; }

    /* Topic Clusters */
    .topic-cluster { display: flex; align-items: center; gap: 12px; padding: 12px; background: var(--bg-elevated); border-radius: 4px; margin-bottom: 8px; border: none; }
    .topic-cluster-icon { width: 36px; height: 36px; background: var(--blue-100); border-radius: 4px; display: flex; align-items: center; justify-content: center; font-size: 16px; }
    .topic-cluster-info { flex: 1; }
    .topic-cluster-name { font-size: 12px; font-weight: 600; color: var(--text-primary); }
    .topic-cluster-count { font-size: 10px; color: var(--text-muted); }
    .topic-cluster-bar { width: 60px; height: 6px; background: var(--blue-100); border-radius: 3px; overflow: hidden; }
    .topic-cluster-fill { height: 100%; background: var(--blue-500); border-radius: 3px; }

    /* Timeline Events */
    .timeline-event { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border); }
    .timeline-event:last-child { border-bottom: none; }
    .timeline-date { width: 60px; text-align: center; }
    .timeline-date-day { font-size: 18px; font-weight: 700; color: var(--blue-600); }
    .timeline-date-month { font-size: 9px; color: var(--text-muted); text-transform: uppercase; }
    .timeline-content { flex: 1; }
    .timeline-title { font-size: 12px; font-weight: 600; color: var(--text-primary); margin-bottom: 4px; }
    .timeline-desc { font-size: 10px; color: var(--text-secondary); }
    .timeline-badge { font-size: 9px; padding: 2px 8px; background: var(--blue-100); color: var(--blue-600); border-radius: 5px; margin-top: 6px; display: inline-block; }

    /* Gap Analysis Cards */
    .gap-card { background: var(--bg-elevated); border-radius: 5px; padding: 14px; margin-bottom: 10px; }
    .gap-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
    .gap-title { font-size: 12px; font-weight: 600; color: var(--text-primary); }
    .gap-compare { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    .gap-item { text-align: center; padding: 8px; border-radius: 3px; }
    .gap-item.strong { background: #D1FAE5; }
    .gap-item.weak { background: #FFE5E5; }
    .gap-item-label { font-size: 9px; color: var(--text-muted); margin-bottom: 2px; }
    .gap-item-value { font-size: 11px; font-weight: 700; }
    .gap-item.strong .gap-item-value { color: #059669; }
    .gap-item.weak .gap-item-value { color: #DC2626; }

    /* Action Priority Sections */
    .action-priority-section { margin-bottom: 20px; }
    .action-priority-header { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; padding: 12px 16px; border-radius: 5px; transition: all 0.3s; }
    .action-priority-header.critical { background: #DC2626; color: white; }
    .action-priority-header.high { background: #D97706; color: white; }
    .action-priority-header.medium { background: #059669; color: white; }
    @keyframes priorityPulse-red { 0%,100% { box-shadow: 0 2px 12px rgba(220,38,38,0.3); } 50% { box-shadow: 0 4px 24px rgba(220,38,38,0.5); } }
    @keyframes priorityPulse-yellow { 0%,100% { box-shadow: 0 2px 12px rgba(217,119,6,0.25); } 50% { box-shadow: 0 4px 20px rgba(217,119,6,0.4); } }
    .action-priority-title { font-size: 13px; font-weight: 700; color: white; }
    .action-priority-count { font-size: 10px; padding: 2px 8px; background: rgba(255,255,255,0.25); border-radius: 5px; margin-left: auto; color: white; font-weight: 600; }

    .alert-section { background: var(--bg-card); border: 1px solid var(--border); border-radius: 3px; padding: 18px; margin-bottom: 16px; }
    .alert-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
    .alert-title { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--text-primary); }
    .alert-count { font-size: 10px; padding: 3px 10px; background: #DC2626; color: white; border-radius: 3px; font-weight: 600; }
    .alert-actions-header { display: flex; gap: 8px; }
    .alert-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
    .alert-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 5px; padding: 14px; position: relative; overflow: hidden; transition: all 0.2s; }
    .alert-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
    .alert-card::before { content: ''; position: absolute; top: 0; left: 0; width: 4px; height: 100%; border-radius: 5px 0 0 5px; }
    .alert-card.critical::before { background: #DC2626; box-shadow: 0 0 8px rgba(220,38,38,0.3); }
    .alert-card.critical { border-color: rgba(220,38,38,0.2); }
    .alert-card.warning::before { background: #D97706; }
    .alert-card.warning { border-color: rgba(217,119,6,0.15); }
    .alert-badge { display: inline-block; font-size: 9px; padding: 3px 8px; border-radius: 3px; font-weight: 700; margin-bottom: 6px; letter-spacing: 0.5px; }
    .alert-card.critical .alert-badge { background: #DC2626; color: white; }
    .alert-card.warning .alert-badge { background: #D97706; color: white; }
    .alert-card-title { font-size: 12px; font-weight: 600; margin-bottom: 8px; color: var(--text-primary); }
    .alert-metric { display: flex; justify-content: space-between; font-size: 10px; color: var(--text-secondary); margin-bottom: 3px; }
    .alert-metric-value { font-weight: 600; }
    .alert-card.critical .alert-metric-value { color: #DC2626; }
    .alert-card.warning .alert-metric-value { color: #D97706; }
    .alert-card-actions { display: flex; gap: 6px; margin-top: 10px; }
    .alert-btn { padding: 6px 12px; border-radius: 3px; font-size: 10px; font-weight: 600; cursor: pointer; border: none; transition: all 0.15s; }
    .alert-btn.primary { background: var(--blue-500); color: white; }
    .alert-btn.primary:hover { background: var(--blue-600); }
    .alert-btn.secondary { background: var(--bg-elevated); color: var(--text-secondary); }
    .alert-btn.secondary:hover { background: var(--bg-hover); }

    .bar-row { display: flex; align-items: center; margin-bottom: 8px; }
    .bar-label { width: 90px; font-size: 10px; color: var(--text-secondary); font-weight: 500; }
    .bar-container { flex: 1; height: 22px; background: var(--bg-elevated); border-radius: 3px; overflow: hidden; margin: 0 8px; }
    .bar-fill { height: 100%; border-radius: 3px; display: flex; align-items: center; padding-left: 8px; font-size: 9px; font-weight: 600; color: white; background: var(--blue-500); }
    .bar-value { width: 40px; font-size: 11px; font-weight: 700; text-align: right; color: var(--text-primary); }

    .rank-row { display: flex; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--border); }
    .rank-row:last-child { border-bottom: none; }
    .rank-num { width: 24px; height: 24px; border-radius: 3px; background: var(--bg-elevated); display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 700; margin-right: 10px; color: var(--text-secondary); }
    .rank-num.gold { background: var(--blue-500); color: white; }
    .rank-num.silver { background: var(--blue-400); color: white; }
    .rank-num.bronze { background: var(--blue-300); color: white; }
    .rank-brand { flex: 1; font-size: 11px; font-weight: 600; color: var(--text-primary); }
    .rank-score { font-size: 13px; font-weight: 800; width: 55px; text-align: right; color: var(--text-primary); }

    .donut-container { display: flex; align-items: center; gap: 16px; }
    .donut-chart { width: 100px; height: 100px; position: relative; }
    .donut-chart svg { transform: rotate(-90deg); }
    .donut-center { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; }
    .donut-center-value { font-size: 16px; font-weight: 800; color: var(--text-primary); }
    .donut-center-label { font-size: 8px; color: var(--text-muted); }
    .legend { flex: 1; }
    .legend-row { display: flex; align-items: center; justify-content: space-between; padding: 4px 0; }
    .legend-label { display: flex; align-items: center; gap: 6px; }
    .legend-dot { width: 6px; height: 6px; border-radius: 50%; }
    .legend-text { font-size: 10px; color: var(--text-secondary); }
    .legend-value { font-size: 11px; font-weight: 700; color: var(--text-primary); }

    .heatmap-table { width: 100%; border-collapse: collapse; }
    .heatmap-table th { padding: 8px 6px; font-size: 9px; font-weight: 700; color: var(--text-muted); text-align: center; background: var(--bg-elevated); text-transform: uppercase; letter-spacing: 0.5px; }
    .heatmap-table th:first-child { text-align: left; padding-left: 12px; }
    .heatmap-table td { padding: 6px; text-align: center; font-size: 9px; font-weight: 600; border-bottom: 1px solid var(--border); }
    .heatmap-table td:first-child { text-align: left; color: var(--text-secondary); padding-left: 12px; }
    .heatmap-table tr:first-child td { background: rgba(0,57,158,0.03); }
    .heatmap-table tr:first-child td:first-child { font-weight: 700; color: var(--blue-500); }
    .heatmap-table tr:hover { background: var(--bg-elevated); }
    .heat-cell { padding: 4px 8px; border-radius: 4px; display: inline-block; min-width: 36px; font-weight: 700; }
    .heat-0 { background: #F1F5F9; color: #94A3B8; }
    .heat-1 { background: #D1FAE5; color: #059669; }
    .heat-2 { background: #FEF9C3; color: #A16207; }
    .heat-3 { background: #FED7AA; color: #C2410C; }
    .heat-4 { background: #FECACA; color: #B91C1C; }
    .heat-5 { background: #B91C1C; color: white; }

    .segment-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
    .segment-card { background: var(--bg-card); border: none; border-radius: 4px; padding: 14px; box-shadow: 0 1px 3px rgba(0,0,0,0.04); }
    .segment-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 6px; }
    .segment-name { font-size: 11px; font-weight: 600; color: var(--text-primary); }
    .segment-percent { font-size: 14px; font-weight: 800; color: var(--blue-500); }
    .segment-strategy { font-size: 9px; color: var(--text-secondary); line-height: 1.5; padding: 8px; background: var(--bg-elevated); border-radius: 3px; }

    .comment-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 3px; padding: 14px; margin-bottom: 10px; cursor: pointer; transition: all 0.15s; }
    .comment-card:hover { border-color: var(--blue-300); }
    .comment-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 8px; }
    .comment-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
    .comment-rank { width: 22px; height: 22px; border-radius: 3px; background: var(--blue-500); color: white; font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
    .comment-source { font-size: 9px; padding: 2px 6px; border-radius: 5px; font-weight: 600; background: var(--blue-50); color: var(--blue-500); }
    .comment-date { font-size: 9px; color: var(--text-muted); }
    .comment-viral { font-size: 10px; font-weight: 700; color: #DC2626; }
    .comment-text { font-size: 11px; color: var(--text-secondary); line-height: 1.5; padding: 10px; background: var(--bg-elevated); border-radius: 4px; border-left: 3px solid var(--blue-400); margin-bottom: 8px; }
    .comment-tags { display: flex; gap: 4px; flex-wrap: wrap; }
    .comment-tag { font-size: 9px; padding: 2px 6px; background: var(--blue-50); color: var(--blue-500); border-radius: 5px; }

    .action-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .action-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 3px; padding: 14px; position: relative; cursor: pointer; transition: all 0.2s; }
    .action-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
    .action-card::before { content: ''; position: absolute; top: 0; left: 0; width: 4px; height: 100%; border-radius: 3px 0 0 3px; }
    .action-card.priority-1::before { background: #DC2626; box-shadow: 0 0 8px rgba(220,38,38,0.25); }
    .action-card.priority-1 { border-color: rgba(220,38,38,0.15); }
    .action-card.priority-2::before { background: #D97706; }
    .action-card.priority-2 { border-color: rgba(217,119,6,0.12); }
    .action-card.priority-3::before { background: #059669; }
    .action-card.priority-3 { border-color: rgba(5,150,105,0.12); }
    .action-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 8px; }
    .action-title { font-size: 12px; font-weight: 600; color: var(--text-primary); }
    .action-priority { font-size: 9px; padding: 3px 8px; border-radius: 3px; font-weight: 700; letter-spacing: 0.3px; }
    .action-card.priority-1 .action-priority { background: #DC2626; color: white; }
    .action-card.priority-2 .action-priority { background: #D97706; color: white; }
    .action-card.priority-3 .action-priority { background: #059669; color: white; }
    .action-items { list-style: none; margin-bottom: 10px; }
    .action-items li { font-size: 10px; color: var(--text-secondary); padding: 2px 0; padding-left: 10px; position: relative; }
    .action-card.priority-1 .action-items li::before { content: '•'; position: absolute; left: 0; color: #DC2626; }
    .action-card.priority-2 .action-items li::before { content: '•'; position: absolute; left: 0; color: #D97706; }
    .action-card.priority-3 .action-items li::before { content: '•'; position: absolute; left: 0; color: #059669; }
    .action-footer { display: flex; justify-content: space-between; align-items: center; padding-top: 10px; border-top: 1px solid var(--border); }
    .action-platform { display: flex; gap: 4px; }
    .action-platform-badge { font-size: 9px; padding: 2px 6px; background: var(--bg-elevated); color: var(--text-muted); border-radius: 4px; }
    .action-deadline { font-size: 9px; color: var(--text-muted); }
    .action-impact { display: inline-flex; font-size: 9px; font-weight: 600; padding: 4px 8px; border-radius: 5px; }
    .action-card.priority-1 .action-impact { color: #DC2626; background: #FFE5E5; }
    .action-card.priority-2 .action-impact { color: #D97706; background: #FEF3C7; }
    .action-card.priority-3 .action-impact { color: #059669; background: #D1FAE5; }

    .sube-ozet-card { background: var(--bg-card); border: none; border-radius: 4px; padding: 16px; cursor: pointer; transition: all 0.2s; box-shadow: 0 1px 3px rgba(0,0,0,0.04); }
    .sube-ozet-card:hover { box-shadow: var(--shadow-md); border-color: var(--blue-300); }
    .sube-ozet-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
    .sube-ozet-title { font-size: 14px; font-weight: 700; color: var(--text-primary); }
    .sube-ozet-btn { font-size: 11px; padding: 6px 14px; background: var(--blue-500); color: white; border-radius: 3px; font-weight: 600; }
    .sube-ozet-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
    .sube-ozet-stat { text-align: center; padding: 12px; background: var(--bg-elevated); border-radius: 5px; }
    .sube-ozet-stat-value { font-size: 18px; font-weight: 700; color: var(--blue-500); }
    .sube-ozet-stat-label { font-size: 10px; color: var(--text-muted); margin-top: 2px; }

    .kpi-targets { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 14px; }
    .kpi-target { background: var(--bg-card); border: none; border-radius: 4px; padding: 12px; text-align: center; box-shadow: 0 1px 3px rgba(0,0,0,0.04); }
    .kpi-target-label { font-size: 9px; color: var(--text-muted); margin-bottom: 4px; }
    .kpi-target-current { font-size: 12px; font-weight: 700; color: var(--blue-500); }
    .kpi-target-arrow { font-size: 10px; color: var(--text-muted); margin: 2px 0; }
    .kpi-target-goal { font-size: 12px; font-weight: 700; color: var(--blue-400); }

    .pagination { display: flex; justify-content: center; gap: 4px; margin-top: 14px; }
    .page-btn { width: 32px; height: 32px; border-radius: 3px; border: 1px solid var(--border); background: var(--bg-card); color: var(--text-secondary); font-size: 11px; font-weight: 600; cursor: pointer; display: flex; align-items: center; justify-content: center; }
    .page-btn:hover { border-color: var(--blue-300); color: var(--blue-600); }
    .page-btn.active { background: var(--blue-500); border-color: var(--blue-500); color: white; }

    .modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.4); z-index: 1000; display: none; align-items: center; justify-content: center; backdrop-filter: blur(3px); }
    .modal-overlay.show { display: flex; }
    .modal { background: var(--bg-card); border: 1px solid var(--border); border-radius: 4px; width: 90%; max-width: 500px; box-shadow: var(--shadow-lg); }
    .modal-header { padding: 16px; border-bottom: 1px solid var(--border); display: flex; justify-content: space-between; align-items: center; }
    .modal-title { font-size: 15px; font-weight: 700; color: var(--text-primary); }
    .modal-close { background: var(--bg-elevated); border: none; color: var(--text-muted); font-size: 16px; cursor: pointer; width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
    .modal-body { padding: 16px; max-height: 400px; overflow-y: auto; }
    .modal-footer { padding: 16px; border-top: 1px solid var(--border); display: flex; justify-content: flex-end; gap: 8px; }
    .form-group { margin-bottom: 14px; }
    .form-label { font-size: 11px; font-weight: 600; color: var(--text-secondary); margin-bottom: 6px; display: block; }
    .form-select, .form-input { width: 100%; background: var(--bg-elevated); border: 1px solid var(--border); color: var(--text-primary); padding: 10px 12px; border-radius: 4px; font-size: 12px; }
    .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .checkbox-group { display: flex; flex-wrap: wrap; gap: 8px; }
    .checkbox-item { display: flex; align-items: center; gap: 6px; padding: 8px 12px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 4px; cursor: pointer; font-size: 11px; color: var(--text-secondary); transition: all 0.15s; }
    .checkbox-item.selected { border-color: var(--blue-400); color: var(--blue-600); background: var(--blue-50); }
    .checkbox-item input { display: none; }
    .btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 4px; font-size: 11px; font-weight: 600; cursor: pointer; border: none; transition: all 0.15s; }
    .btn-primary { background: var(--blue-500); color: white; }
    .btn-primary:hover { background: var(--blue-600); }
    .btn-secondary { background: var(--bg-elevated); color: var(--text-secondary); border: 1px solid var(--border); }
    .toast { position: fixed; bottom: 20px; right: 20px; background: var(--blue-500); color: white; padding: 12px 20px; border-radius: 5px; font-size: 12px; font-weight: 600; transform: translateY(100px); opacity: 0; transition: all 0.3s; z-index: 1000; }
    .toast.show { transform: translateY(0); opacity: 1; }

    /* ===== BRAND HEALTH GAUGE ===== */
    .brand-health-section { background: linear-gradient(135deg, #1E1B4B 0%, #312E81 50%, #1E1B4B 100%); border-radius: 16px; padding: 28px 32px; margin-bottom: 20px; color: white; position: relative; overflow: hidden; }
    .brand-health-section::before { content: ''; position: absolute; top: -60%; right: -10%; width: 400px; height: 400px; background: radial-gradient(circle, rgba(79,70,229,0.15) 0%, transparent 70%); pointer-events: none; }
    .brand-health-section::after { content: ''; position: absolute; bottom: -40%; left: -5%; width: 300px; height: 300px; background: radial-gradient(circle, rgba(99,102,241,0.1) 0%, transparent 70%); pointer-events: none; }
    .brand-health-top { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
    .brand-health-tag { font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; color: var(--text-secondary); }
    .brand-health-questions { display: flex; gap: 8px; margin-left: auto; }
    .brand-health-q { font-size: 9px; padding: 4px 10px; background: var(--bg-elevated); border-radius: 3px; color: var(--text-primary); border: 1px solid var(--border); cursor: pointer; }
    .brand-health-grid { display: flex; flex-direction: column; gap: 20px; position: relative; z-index: 1; }
    .brand-health-grid .health-bar-and-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
    .gauge-trend { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 700; padding: 4px 12px; border-radius: 3px; margin-top: 6px; }
    .gauge-trend.down { background: rgba(239,68,68,0.1); color: #DC2626; }
    .gauge-trend.up { background: rgba(16,185,129,0.1); color: #059669; }

    /* Health Bar */
    .health-bar-widget { padding: 4px 0; }
    .health-bar-header { display: flex; align-items: baseline; gap: 12px; margin-bottom: 10px; }
    .health-bar-score { font-size: 42px; font-weight: 800; line-height: 1; }
    .health-bar-max { font-size: 16px; font-weight: 400; color: var(--text-muted); }
    .health-bar-badge { font-size: 11px; font-weight: 700; padding: 4px 14px; border-radius: 4px; border: 1px solid; letter-spacing: 0.5px; }
    .health-bar-track { position: relative; width: 100%; height: 10px; background: var(--bg-elevated); border-radius: 5px; overflow: visible; }
    .health-bar-fill { height: 100%; border-radius: 5px; transition: width 1s ease; box-shadow: 0 0 12px rgba(0,0,0,0.08); }
    .health-bar-mark { position: absolute; top: -3px; width: 1px; height: 16px; background: var(--border); }
    .health-bar-labels { position: relative; display: flex; margin-top: 4px; height: 14px; }
    .health-bar-labels span { position: absolute; font-size: 9px; color: var(--text-muted); font-weight: 500; transform: translateX(-50%); }
    .health-bar-labels span:first-child { left: 0; transform: none; }
    .health-bar-labels span:last-child { left: auto; right: 0; transform: none; }
    .health-bar-label { font-size: 12px; font-weight: 600; color: var(--text-secondary); margin-top: 8px; letter-spacing: 0.3px; }
    .health-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
    .health-metric { background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 8px; padding: 18px; text-align: center; transition: all 0.25s; cursor: pointer; position: relative; overflow: hidden; }
    .health-metric:hover { background: var(--bg-hover); border-color: rgba(79,70,229,0.2); transform: translateY(-2px); }
    .health-metric-icon { font-size: 22px; margin-bottom: 8px; }
    .health-metric-label { font-size: 10px; color: var(--text-secondary); font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 6px; }
    .health-metric-value { font-size: 26px; font-weight: 800; line-height: 1; margin-bottom: 6px; }
    .health-metric-change { font-size: 10px; font-weight: 600; padding: 3px 8px; border-radius: 3px; display: inline-flex; align-items: center; gap: 3px; }
    .health-metric-change.negative { background: rgba(220,38,38,0.1); color: #DC2626; }
    .health-metric-change.positive { background: rgba(5,150,105,0.1); color: #059669; }
    .health-metric-bar { width: 100%; height: 4px; background: var(--border); border-radius: 2px; margin-top: 10px; overflow: hidden; }
    .health-metric-bar-fill { height: 100%; border-radius: 2px; transition: width 1s ease; }
    .health-3q { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 20px; }
    .health-3q-item { background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 8px; padding: 14px 16px; cursor: pointer; transition: all 0.2s; }
    .health-3q-item:hover { background: var(--bg-hover); border-color: rgba(79,70,229,0.2); }
    .health-3q-emoji { font-size: 16px; margin-bottom: 6px; }
    .health-3q-question { font-size: 11px; font-weight: 700; color: var(--text-primary); margin-bottom: 4px; }
    .health-3q-answer { font-size: 10px; color: var(--text-secondary); line-height: 1.5; }

    /* ===== CONVERSATION MAP (BUBBLE CHART) ===== */
    .convo-map-container { background: var(--bg-card); border: 1px solid var(--border); border-radius: 4px; padding: 24px; position: relative; min-height: 420px; }
    .convo-map-canvas { width: 100%; height: 380px; position: relative; overflow: hidden; border-radius: 3px; background: var(--bg-elevated); }
    .bubble { position: absolute; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 4px 20px rgba(0,0,0,0.1); border: 3px solid rgba(255,255,255,0.8); }
    .bubble:hover { transform: scale(1.12); z-index: 10; box-shadow: 0 8px 30px rgba(0,0,0,0.2); }
    .bubble-icon { font-size: 20px; margin-bottom: 2px; color: white; }
    .bubble-icon .i { width: 22px; height: 22px; }
    .bubble-label { font-size: 10px; font-weight: 700; color: white; text-shadow: 0 1px 3px rgba(0,0,0,0.3); text-align: center; line-height: 1.2; padding: 0 6px; }
    .bubble-count { font-size: 9px; font-weight: 600; color: var(--text-primary); }
    .bubble-tooltip { display: none; position: absolute; bottom: calc(100% + 10px); left: 50%; transform: translateX(-50%); background: var(--text-primary); color: white; padding: 8px 12px; border-radius: 4px; font-size: 10px; white-space: nowrap; z-index: 20; pointer-events: none; }
    .bubble-tooltip::after { content: ''; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); border: 5px solid transparent; border-top-color: var(--text-primary); }
    .bubble:hover .bubble-tooltip { display: block; }
    @keyframes bubbleFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
    .bubble:nth-child(1) { animation: bubbleFloat 4s ease-in-out infinite; }
    .bubble:nth-child(2) { animation: bubbleFloat 5s ease-in-out infinite 0.5s; }
    .bubble:nth-child(3) { animation: bubbleFloat 4.5s ease-in-out infinite 1s; }
    .bubble:nth-child(4) { animation: bubbleFloat 5.5s ease-in-out infinite 1.5s; }
    .bubble:nth-child(5) { animation: bubbleFloat 4s ease-in-out infinite 2s; }
    .bubble:nth-child(6) { animation: bubbleFloat 5s ease-in-out infinite 0.8s; }
    .bubble:nth-child(7) { animation: bubbleFloat 4.2s ease-in-out infinite 1.2s; }
    .bubble:nth-child(8) { animation: bubbleFloat 5.2s ease-in-out infinite 0.3s; }
    .bubble:hover { animation-play-state: paused; }
    .convo-map-legend { display: flex; align-items: center; justify-content: center; gap: 24px; margin-top: 14px; }
    .convo-map-legend-item { display: flex; align-items: center; gap: 6px; font-size: 10px; color: var(--text-muted); }
    .convo-map-legend-dot { width: 10px; height: 10px; border-radius: 50%; }

    /* ===== DRILL-DOWN MODAL ===== */
    .drill-modal { background: var(--bg-card); border-radius: 4px; width: 90%; max-width: 700px; max-height: 80vh; overflow: hidden; box-shadow: 0 25px 60px rgba(0,0,0,0.15); }
    .drill-modal-header { padding: 20px 24px; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 14px; }
    .drill-modal-icon { width: 44px; height: 44px; border-radius: 3px; display: flex; align-items: center; justify-content: center; font-size: 22px; }
    .drill-modal-title { font-size: 16px; font-weight: 700; color: var(--text-primary); }
    .drill-modal-subtitle { font-size: 11px; color: var(--text-secondary); }
    .drill-modal-close { margin-left: auto; background: var(--bg-elevated); border: none; color: var(--text-muted); font-size: 18px; cursor: pointer; width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
    .drill-modal-body { padding: 20px 24px; overflow-y: auto; max-height: calc(80vh - 80px); }
    .drill-tabs { display: flex; gap: 6px; margin-bottom: 18px; }
    .drill-tab { padding: 7px 14px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 4px; font-size: 11px; font-weight: 600; color: var(--text-secondary); cursor: pointer; transition: all 0.15s; }
    .drill-tab.active { background: var(--blue-500); color: white; border-color: var(--blue-500); }
    .drill-comment { padding: 12px; background: var(--bg-elevated); border-radius: 5px; margin-bottom: 8px; border-left: 3px solid var(--blue-400); }
    .drill-comment-source { font-size: 9px; color: var(--text-muted); margin-bottom: 4px; }
    .drill-comment-text { font-size: 11px; color: var(--text-secondary); line-height: 1.6; }
    .drill-keyword-cloud { display: flex; flex-wrap: wrap; gap: 6px; }
    .drill-keyword { padding: 5px 12px; border-radius: 3px; font-size: 11px; font-weight: 600; cursor: pointer; transition: all 0.15s; }
    .drill-keyword:hover { transform: scale(1.05); }
    .drill-branch-row { display: flex; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--border); }
    .drill-branch-row:last-child { border-bottom: none; }
    .drill-branch-name { flex: 1; font-size: 12px; font-weight: 600; color: var(--text-primary); }
    .drill-branch-count { font-size: 11px; font-weight: 700; color: var(--blue-600); width: 40px; text-align: right; }
    .drill-branch-bar { flex: 1; height: 6px; background: var(--bg-elevated); border-radius: 3px; overflow: hidden; margin: 0 12px; }
    .drill-branch-fill { height: 100%; border-radius: 3px; }



    /* ===== CHART INFO POPOVER ===== */
    .chart-info { position: relative; display: inline-flex; margin-left: 6px; vertical-align: middle; }
    .chart-info-btn { width: 18px; height: 18px; border-radius: 50%; background: var(--bg-elevated); border: 1px solid var(--border); display: flex; align-items: center; justify-content: center; font-size: 10px; color: var(--text-muted); cursor: pointer; transition: all 0.15s; font-style: normal; line-height: 1; }
    .chart-info-btn:hover { background: var(--blue-50); color: var(--blue-600); border-color: var(--blue-200); }
    .chart-info-pop { display: none; position: absolute; bottom: calc(100% + 10px); left: 50%; transform: translateX(-50%); background: var(--text-primary); color: white; padding: 12px 14px; border-radius: 5px; font-size: 11px; line-height: 1.6; width: 280px; z-index: 60; box-shadow: 0 8px 24px rgba(0,0,0,0.15); font-weight: 400; }
    .chart-info-pop.show { display: block; animation: infoFadeIn 0.2s ease; }
    .chart-info-pop::after { content: ''; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); border: 6px solid transparent; border-top-color: var(--text-primary); }
    .chart-info-pop-title { font-weight: 700; font-size: 11px; margin-bottom: 6px; color: #93C5FD; }
    .chart-info-pop-close { position: absolute; top: 6px; right: 8px; background: none; border: none; color: var(--text-muted); font-size: 14px; cursor: pointer; }
    @keyframes infoFadeIn { from { opacity: 0; transform: translateX(-50%) translateY(4px); } to { opacity: 1; transform: translateX(-50%) translateY(0); } }
    /* Right-aligned variant for cards near right edge */
    .chart-info-pop.pop-left { left: auto; right: 0; transform: none; }
    .chart-info-pop.pop-left::after { left: auto; right: 14px; transform: none; }

    /* ===== DATA SOURCE TABLE ===== */
    .ds-table-wrap { background: var(--bg-card); border: 1px solid var(--border); border-radius: 3px; padding: 0; margin-bottom: 20px; overflow: hidden; }
    .ds-table-header { display: flex; justify-content: space-between; align-items: center; padding: 14px 18px; border-bottom: 1px solid var(--border); }
    .ds-table-title { font-size: 14px; font-weight: 700; color: var(--text-primary); display: flex; align-items: center; gap: 8px; }
    .ds-table-subtitle { font-size: 10px; color: var(--text-muted); }
    .ds-table { width: 100%; border-collapse: collapse; font-size: 11px; }
    .ds-table th { padding: 10px 12px; font-size: 9px; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; text-align: center; background: var(--bg-elevated); border-bottom: 1px solid var(--border); }
    .ds-table th:first-child { text-align: left; padding-left: 18px; }
    .ds-table td { padding: 8px 12px; text-align: center; border-bottom: 1px solid var(--border); font-weight: 600; color: var(--text-secondary); }
    .ds-table td:first-child { text-align: left; font-weight: 700; color: var(--text-primary); padding-left: 18px; }
    .ds-table tr:last-child td { border-bottom: none; }
    .ds-table tr.ds-highlight { background: var(--blue-50); }
    .ds-table tr.ds-highlight td:first-child { color: var(--blue-500); }
    .ds-table .ds-total-row td { font-weight: 800; background: var(--bg-elevated); color: var(--text-primary); border-top: 2px solid var(--border); color: var(--text-primary); }
    .ds-table .ds-total-row td:first-child { color: var(--text-primary); }

    /* ===== SOCIAL MEDIA METRICS STRIP ===== */
    .sm-strip { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 20px; }
    .sm-card { background: var(--bg-card); border: none; border-radius: 4px; padding: 14px; text-align: center; position: relative; box-shadow: 0 1px 3px rgba(0,0,0,0.04); }
    .sm-card-icon { font-size: 18px; margin-bottom: 6px; }
    .sm-card-value { font-size: 20px; font-weight: 800; color: var(--blue-500); line-height: 1; margin-bottom: 4px; }
    .sm-card-label { font-size: 9px; color: var(--text-muted); font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; }
    .sm-card-change { font-size: 9px; font-weight: 600; margin-top: 4px; padding: 2px 6px; border-radius: 5px; display: inline-block; }
    .sm-card-change.up { background: #D1FAE5; color: #059669; }
    .sm-card-change.down { background: #FFE5E5; color: #DC2626; }
    .sm-refresh-note { font-size: 9px; color: var(--text-muted); text-align: right; margin-top: -14px; margin-bottom: 14px; }

    /* ===== KPI INFO TOOLTIP ===== */
    .kpi-info { position: relative; display: inline-flex; }
    .kpi-info-icon { width: 16px; height: 16px; border-radius: 50%; background: var(--bg-elevated); border: 1px solid var(--border); display: flex; align-items: center; justify-content: center; font-size: 9px; color: var(--text-muted); cursor: help; font-style: normal; }
    .kpi-info-tip { display: none; position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%); background: var(--text-primary); color: white; padding: 8px 12px; border-radius: 4px; font-size: 10px; line-height: 1.5; width: 220px; z-index: 50; pointer-events: none; font-weight: 400; }
    .kpi-info-tip::after { content: ''; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); border: 5px solid transparent; border-top-color: var(--text-primary); }
    .kpi-info:hover .kpi-info-tip { display: block; }

    /* ===== CEO SUMMARY PAGE ===== */
    .ceo-hero { background: linear-gradient(135deg, #000B68 0%, #1A2258 50%, #00399E 100%); border-radius: 4px; padding: 32px; color: white; margin-bottom: 24px; position: relative; overflow: hidden; }
    .ceo-hero::before { content: ''; position: absolute; top: -40%; right: -10%; width: 350px; height: 350px; background: radial-gradient(circle, rgba(0,57,158,0.12) 0%, transparent 70%); }
    .ceo-hero-title { font-size: 22px; font-weight: 800; margin-bottom: 6px; position: relative; }
    .ceo-hero-subtitle { font-size: 12px; color: var(--text-secondary); position: relative; }
    .ceo-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 24px; position: relative; }
    .ceo-stat { text-align: center; padding: 16px; background: var(--bg-elevated); border: 1px solid rgba(255,255,255,0.08); border-radius: 3px; }
    .ceo-stat-value { font-size: 28px; font-weight: 800; line-height: 1; margin-bottom: 4px; }
    .ceo-stat-label { font-size: 10px; color: var(--text-secondary); font-weight: 600; }
    .ceo-stat-sub { font-size: 9px; margin-top: 4px; }
    .ceo-section { background: var(--bg-card); border: 1px solid var(--border); border-radius: 3px; padding: 20px; margin-bottom: 16px; }
    .ceo-section-title { font-size: 14px; font-weight: 700; color: var(--text-primary); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
    .ceo-bullet { display: flex; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--border); }
    .ceo-bullet:last-child { border-bottom: none; }
    .ceo-bullet-icon { font-size: 16px; width: 24px; text-align: center; }
    .ceo-bullet-text { font-size: 12px; color: var(--text-primary); line-height: 1.6; flex: 1; }
    .ceo-bullet-text strong { color: var(--text-primary); }
    .ceo-target-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 14px; }
    .ceo-target { padding: 14px; background: var(--bg-elevated); border-radius: 5px; display: flex; align-items: center; gap: 14px; }
    .ceo-target-now { text-align: center; }
    .ceo-target-now-val { font-size: 18px; font-weight: 800; color: var(--red-500); }
    .ceo-target-now-label { font-size: 8px; color: var(--text-secondary); }
    .ceo-target-arrow { font-size: 16px; color: var(--text-muted); }
    .ceo-target-goal-val { font-size: 18px; font-weight: 800; color: var(--green-500); }
    .ceo-target-goal-label { font-size: 8px; color: var(--text-secondary); }
    .ceo-target-info { flex: 1; }
    .ceo-target-name { font-size: 11px; font-weight: 700; color: var(--text-primary); }
    .ceo-target-desc { font-size: 9px; color: var(--text-secondary); }

    /* ===== COMMENT WITH RESPONSE ===== */
    .comment-response { margin-top: 8px; padding: 10px 12px; background: var(--green-100); border-radius: 4px; border-left: 3px solid var(--green-500); }
    .comment-response-label { font-size: 9px; font-weight: 700; color: var(--green-500); margin-bottom: 4px; display: flex; align-items: center; gap: 6px; }
    .comment-response-text { font-size: 11px; color: var(--text-primary); line-height: 1.5; }
    .comment-copy-btn { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; background: var(--green-500); color: white; border: none; border-radius: 3px; font-size: 9px; font-weight: 600; cursor: pointer; margin-top: 6px; transition: all 0.15s; }
    .comment-copy-btn:hover { background: #059669; }

    /* ===== COMPARISON PAGE ===== */
    .compare-header-card { background: linear-gradient(135deg, #000B68 0%, #1A2258 100%); border-radius: 4px; padding: 24px; color: white; margin-bottom: 20px; display: flex; align-items: center; gap: 24px; overflow: hidden; flex-wrap: wrap; }
    .compare-month-selector { display: flex; gap: 12px; }
    .compare-month { text-align: center; padding: 14px 24px; border-radius: 3px; cursor: pointer; transition: all 0.2s; border: 2px solid transparent; }
    .compare-month.active { border-color: rgba(255,255,255,0.3); background: rgba(255,255,255,0.1); }
    .compare-month-name { font-size: 10px; color: var(--text-secondary); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 4px; }
    .compare-month-score { font-size: 28px; font-weight: 800; }
    .compare-month-label { font-size: 9px; color: var(--text-secondary); margin-top: 2px; }
    .compare-vs { font-size: 20px; font-weight: 800; color: var(--text-muted); display: flex; align-items: center; }
    .compare-delta-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 700; padding: 6px 14px; border-radius: 3px; margin-left: auto; }
    .compare-delta-badge.worse { background: rgba(220,38,38,0.2); color: #FCA5A5; }
    .compare-delta-badge.better { background: rgba(5,150,105,0.2); color: #6EE7B7; }
    .compare-row { display: grid; grid-template-columns: 140px 1fr 60px 1fr 60px 70px; gap: 8px; align-items: center; padding: 12px 14px; border-bottom: 1px solid var(--border); font-size: 12px; overflow: hidden; }
    .compare-row:last-child { border-bottom: none; }
    .compare-row-header { font-weight: 700; color: var(--text-muted); font-size: 10px; text-transform: uppercase; letter-spacing: 0.5px; background: var(--bg-elevated); border-radius: 4px 8px 0 0; border-bottom: 2px solid var(--border); }
    .compare-metric-name { font-weight: 600; color: var(--text-primary); display: flex; align-items: center; gap: 8px; }
    .compare-row-header { font-weight: 700; color: var(--text-muted); }
    .compare-bar { height: 8px; background: var(--bg-elevated); border-radius: 4px; overflow: hidden; }
    .compare-bar-fill { height: 100%; border-radius: 4px; transition: width 0.8s ease; }
    .compare-val { font-weight: 700; text-align: right; color: var(--text-primary); }
    .compare-delta { display: inline-flex; align-items: center; gap: 3px; font-size: 10px; font-weight: 700; padding: 3px 8px; border-radius: 3px; }
    .compare-delta.up { background: #D1FAE5; color: #059669; }
    .compare-delta.down { background: #FFE5E5; color: #DC2626; }
    .compare-delta.neutral { background: #FEF3C7; color: #D97706; }
    .compare-insight-strip { display: flex; gap: 12px; margin-top: 16px; flex-wrap: wrap; }
    .compare-insight-item { flex: 1; padding: 14px; background: var(--bg-elevated); border-radius: 3px; border-left: 4px solid var(--blue-500); }
    .compare-insight-item.risk { border-left-color: var(--red-500); }
    .compare-insight-item.opportunity { border-left-color: var(--green-500); }
    .compare-insight-label { font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-muted); margin-bottom: 4px; }
    .compare-insight-text { font-size: 11px; color: var(--text-secondary); line-height: 1.5; }

    /* ===== AI CHAT WIDGET ===== */
    .ai-chat-fab { position: fixed; bottom: 24px; right: 24px; width: 56px; height: 56px; border-radius: 50%; background: linear-gradient(135deg, #00399E, #000B68); color: white; border: none; cursor: pointer; z-index: 200; display: flex; align-items: center; justify-content: center; font-size: 24px; box-shadow: 0 4px 20px rgba(0,57,158,0.4); transition: all 0.3s; }
    .ai-chat-fab:hover { transform: scale(1.08); box-shadow: 0 6px 28px rgba(0,57,158,0.5); }
    .ai-chat-fab.hidden { display: none; }
    .ai-chat-panel { position: fixed; bottom: 24px; right: 24px; width: 420px; height: 600px; background: var(--bg-card); border-radius: 3px; box-shadow: 0 20px 60px rgba(0,0,0,0.15); z-index: 300; display: none; flex-direction: column; overflow: hidden; border: 1px solid var(--border); }
    .ai-chat-panel.open { display: flex; animation: chatSlideUp 0.3s ease; }
    @keyframes chatSlideUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
    .ai-chat-header { padding: 16px 20px; background: linear-gradient(135deg, #000B68, #1A2258); color: white; display: flex; align-items: center; gap: 12px; }
    .ai-chat-avatar { width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.15); display: flex; align-items: center; justify-content: center; font-size: 18px; }
    .ai-chat-header-info h3 { font-size: 14px; font-weight: 700; }
    .ai-chat-header-info p { font-size: 10px; color: var(--text-secondary); }
    .ai-chat-close { margin-left: auto; background: rgba(255,255,255,0.1); border: none; color: white; width: 28px; height: 28px; border-radius: 50%; cursor: pointer; font-size: 14px; display: flex; align-items: center; justify-content: center; }
    .ai-chat-body { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 12px; }
    .ai-chat-msg { max-width: 85%; padding: 10px 14px; border-radius: 3px; font-size: 12px; line-height: 1.6; animation: msgFade 0.3s ease; }
    @keyframes msgFade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
    .ai-chat-msg.bot { align-self: flex-start; background: var(--bg-elevated); color: var(--text-primary); border-bottom-left-radius: 4px; }
    .ai-chat-msg.user { align-self: flex-end; background: var(--blue-500); color: white; border-bottom-right-radius: 4px; }
    .ai-chat-msg.typing { align-self: flex-start; background: var(--bg-elevated); color: var(--text-muted); font-style: italic; }
    .ai-chat-suggestions { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 16px 8px; }
    .ai-chat-suggestion { padding: 6px 12px; background: var(--blue-50); border: 1px solid var(--blue-200); border-radius: 3px; font-size: 10px; color: var(--blue-600); cursor: pointer; font-weight: 500; transition: all 0.15s; white-space: nowrap; }
    .ai-chat-suggestion:hover { background: var(--blue-100); border-color: var(--blue-300); }
    .ai-chat-input-area { padding: 12px 16px; border-top: 1px solid var(--border); display: flex; gap: 8px; background: var(--bg-card); }
    .ai-chat-input { flex: 1; border: 1px solid var(--border); border-radius: 3px; padding: 10px 14px; font-size: 12px; color: var(--text-primary); background: var(--bg-elevated); outline: none; resize: none; font-family: inherit; }
    .ai-chat-input:focus { border-color: var(--blue-400); }
    .ai-chat-send { width: 38px; height: 38px; border-radius: 50%; background: var(--blue-500); color: white; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 16px; transition: all 0.15s; }
    .ai-chat-send:hover { background: var(--blue-600); }
    .ai-chat-send:disabled { background: var(--bg-elevated); color: var(--text-muted); cursor: not-allowed; }

    /* ===== AI COMMAND CENTER ===== */
    .ai-command-center { background: #FFFFFF; border: 2px solid #DC2626; border-radius: 4px; padding: 0; margin-bottom: 20px; color: var(--text-primary); position: relative; overflow: hidden; }
    .ai-command-center::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 4px; background: linear-gradient(90deg, #DC2626, #D97706, #059669); pointer-events: none; }
    .ai-command-center::after { display: none; }
    .acc-header { padding: 22px 28px 0; display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 1; }
    .acc-header-left { display: flex; align-items: center; gap: 12px; }
    .acc-header-icon { width: 42px; height: 42px; border-radius: 3px; background: var(--blue-500); display: flex; align-items: center; justify-content: center; font-size: 20px; }
    .acc-header-title { font-size: 17px; font-weight: 800; letter-spacing: -0.3px; }
    .acc-header-sub { font-size: 10px; color: var(--text-muted); font-weight: 500; }
    .acc-header-badge { font-size: 9px; padding: 5px 12px; background: rgba(239,68,68,0.2); color: #FCA5A5; border-radius: 3px; font-weight: 700; border: 1px solid rgba(239,68,68,0.3); animation: accPulse 2s infinite; }
    @keyframes accPulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.6; } }
    .acc-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0; position: relative; z-index: 1; }
    .acc-panel { padding: 20px 24px 22px; border-right: 1px solid var(--border); }
    .acc-panel:last-child { border-right: none; }
    .acc-panel-header { display: flex; align-items: center; gap: 8px; margin-bottom: 14px; padding-bottom: 10px; border-bottom: 1px solid var(--border); }
    .acc-panel-icon { font-size: 16px; }
    .acc-panel-title { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; }
    .acc-panel-title.problems { color: #DC2626; }
    .acc-panel-title.actions { color: var(--blue-500); }
    .acc-panel-title.changes { color: #D97706; }
    .acc-item { display: flex; gap: 10px; padding: 10px 12px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 4px; margin-bottom: 8px; transition: all 0.2s; cursor: pointer; align-items: flex-start; }
    .acc-item:hover { background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.12); transform: translateX(2px); }
    .acc-item:last-child { margin-bottom: 0; }
    .acc-item-num { width: 22px; height: 22px; border-radius: 3px; display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 800; flex-shrink: 0; margin-top: 1px; }
    .acc-item-num.problem { background: #DC2626; color: white; }
    .acc-item-num.action { background: var(--blue-500); color: white; }
    .acc-item-num.change { background: #D97706; color: white; }
    .acc-item-content { flex: 1; min-width: 0; }
    .acc-item-title { font-size: 11px; font-weight: 600; color: var(--text-primary); margin-bottom: 2px; line-height: 1.4; }
    .acc-item-meta { font-size: 9px; color: var(--text-muted); display: flex; align-items: center; gap: 6px; }
    .acc-item-badge { font-size: 8px; padding: 1px 6px; border-radius: 4px; font-weight: 700; }
    .acc-item-badge.critical { background: #DC2626; color: white; }
    .acc-item-badge.warning { background: #D97706; color: white; }
    .acc-item-badge.up { background: #FFE5E5; color: #DC2626; }
    .acc-item-badge.down { background: #D1FAE5; color: #059669; }
    .acc-item-badge.info { background: var(--blue-50); color: var(--blue-500); }
    .acc-cta { display: flex; align-items: center; gap: 6px; margin-top: 12px; padding: 8px 14px; background: var(--blue-50); border: 1px solid var(--blue-200); border-radius: 4px; font-size: 10px; font-weight: 600; color: var(--blue-500); cursor: pointer; transition: all 0.2s; }
    .acc-cta:hover { background: var(--blue-100); }

    /* ===== GLOBAL DATE RANGE PICKER ===== */
    .global-date-bar { display: flex; align-items: center; gap: 12px; padding: 10px 16px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 5px; margin-bottom: 16px; }
    .global-date-label { font-size: 10px; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; white-space: nowrap; }
    .global-date-inputs { display: flex; align-items: center; gap: 8px; }
    .global-date-input { padding: 6px 10px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 3px; font-size: 11px; color: var(--text-primary); font-family: inherit; }
    .global-date-presets { display: flex; gap: 4px; margin-left: 8px; }
    .global-date-preset { padding: 5px 10px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 3px; font-size: 10px; font-weight: 500; color: var(--text-secondary); cursor: pointer; transition: all 0.15s; white-space: nowrap; }
    .global-date-preset:hover, .global-date-preset.active { background: var(--blue-50); color: var(--blue-600); border-color: var(--blue-200); }
    .global-date-compare { margin-left: auto; display: flex; align-items: center; gap: 6px; }
    .compare-toggle { display: flex; align-items: center; gap: 6px; padding: 5px 12px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 3px; font-size: 10px; font-weight: 600; color: var(--text-secondary); cursor: pointer; transition: all 0.15s; }
    .compare-toggle:hover, .compare-toggle.active { background: var(--blue-50); color: var(--blue-600); border-color: var(--blue-200); }
    .compare-selector { display: none; align-items: center; gap: 6px; }
    .compare-selector.show { display: flex; }

    /* ===== ENHANCED COMMENTS ===== */
    .comment-go-link { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; background: var(--blue-50); color: var(--blue-600); border: 1px solid var(--blue-200); border-radius: 3px; font-size: 9px; font-weight: 600; cursor: pointer; transition: all 0.15s; text-decoration: none; margin-left: 8px; }
    .comment-go-link:hover { background: var(--blue-100); }

    /* ===== COMPARISON OVERLAY BAR ===== */
    .compare-overlay { display: none; padding: 12px 16px; background: linear-gradient(90deg, var(--blue-50), #F0F4FF); border: 1px solid var(--blue-200); border-radius: 5px; margin-bottom: 16px; }
    .compare-overlay.show { display: flex; align-items: center; gap: 12px; }
    .compare-overlay-label { font-size: 11px; font-weight: 600; color: var(--blue-500); white-space: nowrap; }
    .compare-overlay-period { display: flex; gap: 6px; }
    .compare-overlay-btn { padding: 5px 12px; background: white; border: 1px solid var(--blue-200); border-radius: 3px; font-size: 10px; font-weight: 600; color: var(--blue-600); cursor: pointer; transition: all 0.15s; }
    .compare-overlay-btn:hover, .compare-overlay-btn.active { background: var(--blue-500); color: white; border-color: var(--blue-500); }
    .compare-overlay-close { margin-left: auto; background: none; border: none; color: var(--blue-400); cursor: pointer; font-size: 14px; padding: 4px; }

    @media (max-width: 1200px) { .kpi-grid { grid-template-columns: repeat(3, 1fr); } .brand-health-grid { grid-template-columns: 1fr; } .health-metrics { grid-template-columns: repeat(3, 1fr); } .acc-grid { grid-template-columns: 1fr; } .acc-panel { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.06); } .acc-panel:last-child { border-bottom: none; } }
    @media (max-width: 1024px) { .sidebar { width: 180px; } .main { margin-left: 180px; } .kpi-grid { grid-template-columns: repeat(2, 1fr); } .brand-health-grid { grid-template-columns: 1fr; } .health-3q { grid-template-columns: 1fr; } .compare-row { grid-template-columns: 120px 1fr 60px 1fr 60px 70px; font-size: 11px; } }
    /* see comprehensive mobile below */

    /* ===== 2D VECTOR ICON SYSTEM ===== */
    .i { display: inline-flex; width: 1em; height: 1em; background-color: currentColor; -webkit-mask-size: contain; mask-size: contain; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; vertical-align: -0.125em; flex-shrink: 0; }
    .i-lg { width: 1.2em; height: 1.2em; }
    .i-xl { width: 1.5em; height: 1.5em; }
    .i-2x { width: 2em; height: 2em; }
    /* Container-specific icon sizing */
    .sm-card-icon .i { width: 20px; height: 20px; color: var(--blue-500); }
    .kpi-icon .i { width: 20px; height: 20px; color: var(--blue-500); }
    .highlight-icon .i { width: 22px; height: 22px; color: var(--blue-500); }
    .health-metric-icon .i { width: 24px; height: 24px; }
    .acc-header-icon .i { width: 22px; height: 22px; color: white; }
    .acc-panel-icon .i { width: 16px; height: 16px; }
    .topic-cluster-icon .i { width: 18px; height: 18px; color: var(--blue-500); }
    .drill-modal-icon .i { width: 24px; height: 24px; }
    .sidebar .i { color: currentColor; }
    .i-chart { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='20' x2='18' y2='10'/%3E%3Cline x1='12' y1='20' x2='12' y2='4'/%3E%3Cline x1='6' y1='20' x2='6' y2='14'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='20' x2='18' y2='10'/%3E%3Cline x1='12' y1='20' x2='12' y2='4'/%3E%3Cline x1='6' y1='20' x2='6' y2='14'/%3E%3C/svg%3E"); }
    .i-alert { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'/%3E%3Cline x1='12' y1='9' x2='12' y2='13'/%3E%3Cline x1='12' y1='17' x2='12.01' y2='17'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'/%3E%3Cline x1='12' y1='9' x2='12' y2='13'/%3E%3Cline x1='12' y1='17' x2='12.01' y2='17'/%3E%3C/svg%3E"); }
    .i-brain { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2a4 4 0 0 1 4 4c0 1.1-.9 2-2 2h-4a2 2 0 0 1 0-4 4 4 0 0 1 4-2z'/%3E%3Cpath d='M8 8a4 4 0 0 0-4 4c0 2.2 1.8 4 4 4'/%3E%3Cpath d='M16 8a4 4 0 0 1 4 4c0 2.2-1.8 4-4 4'/%3E%3Cpath d='M8 16a4 4 0 0 0 4 4 4 4 0 0 0 4-4'/%3E%3Cline x1='12' y1='8' x2='12' y2='20'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2a4 4 0 0 1 4 4c0 1.1-.9 2-2 2h-4a2 2 0 0 1 0-4 4 4 0 0 1 4-2z'/%3E%3Cpath d='M8 8a4 4 0 0 0-4 4c0 2.2 1.8 4 4 4'/%3E%3Cpath d='M16 8a4 4 0 0 1 4 4c0 2.2-1.8 4-4 4'/%3E%3Cpath d='M8 16a4 4 0 0 0 4 4 4 4 0 0 0 4-4'/%3E%3Cline x1='12' y1='8' x2='12' y2='20'/%3E%3C/svg%3E"); }
    .i-trending { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='23 6 13.5 15.5 8.5 10.5 1 18'/%3E%3Cpolyline points='17 6 23 6 23 12'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='23 6 13.5 15.5 8.5 10.5 1 18'/%3E%3Cpolyline points='17 6 23 6 23 12'/%3E%3C/svg%3E"); }
    .i-target { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Ccircle cx='12' cy='12' r='6'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Ccircle cx='12' cy='12' r='6'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3C/svg%3E"); }
    .i-msg { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3C/svg%3E"); }
    .i-users { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M23 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M23 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E"); }
    .i-pin { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E"); }
    .i-calendar { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'/%3E%3Cline x1='16' y1='2' x2='16' y2='6'/%3E%3Cline x1='8' y1='2' x2='8' y2='6'/%3E%3Cline x1='3' y1='10' x2='21' y2='10'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'/%3E%3Cline x1='16' y1='2' x2='16' y2='6'/%3E%3Cline x1='8' y1='2' x2='8' y2='6'/%3E%3Cline x1='3' y1='10' x2='21' y2='10'/%3E%3C/svg%3E"); }
    .i-bolt { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='13 2 3 14 12 14 11 22 21 10 12 10 13 2'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='13 2 3 14 12 14 11 22 21 10 12 10 13 2'/%3E%3C/svg%3E"); }
    .i-search { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E"); }
    .i-key { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M21 2l-2 2m-7.61 7.61a5.5 5.5 0 1 1-7.778 7.778 5.5 5.5 0 0 1 7.777-7.777zm0 0L15.5 7.5m0 0l3 3L22 7l-3-3m-3.5 3.5L19 4'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M21 2l-2 2m-7.61 7.61a5.5 5.5 0 1 1-7.778 7.778 5.5 5.5 0 0 1 7.777-7.777zm0 0L15.5 7.5m0 0l3 3L22 7l-3-3m-3.5 3.5L19 4'/%3E%3C/svg%3E"); }
    .i-map { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpolygon points='1 6 1 22 8 18 16 22 23 18 23 2 16 6 8 2 1 6'/%3E%3Cline x1='8' y1='2' x2='8' y2='18'/%3E%3Cline x1='16' y1='6' x2='16' y2='22'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpolygon points='1 6 1 22 8 18 16 22 23 18 23 2 16 6 8 2 1 6'/%3E%3Cline x1='8' y1='2' x2='8' y2='18'/%3E%3Cline x1='16' y1='6' x2='16' y2='22'/%3E%3C/svg%3E"); }
    .i-trophy { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M6 9H4.5a2.5 2.5 0 0 1 0-5H6'/%3E%3Cpath d='M18 9h1.5a2.5 2.5 0 0 0 0-5H18'/%3E%3Cpath d='M4 22h16'/%3E%3Cpath d='M10 14.66V17c0 .55-.47.98-.97 1.21C7.85 18.75 7 20 7 22'/%3E%3Cpath d='M14 14.66V17c0 .55.47.98.97 1.21C16.15 18.75 17 20 17 22'/%3E%3Cpath d='M18 2H6v7a6 6 0 0 0 12 0V2Z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M6 9H4.5a2.5 2.5 0 0 1 0-5H6'/%3E%3Cpath d='M18 9h1.5a2.5 2.5 0 0 0 0-5H18'/%3E%3Cpath d='M4 22h16'/%3E%3Cpath d='M10 14.66V17c0 .55-.47.98-.97 1.21C7.85 18.75 7 20 7 22'/%3E%3Cpath d='M14 14.66V17c0 .55.47.98.97 1.21C16.15 18.75 17 20 17 22'/%3E%3Cpath d='M18 2H6v7a6 6 0 0 0 12 0V2Z'/%3E%3C/svg%3E"); }
    .i-megaphone { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M3 11l18-5v12L3 13v-2z'/%3E%3Cpath d='M11.6 16.8a3 3 0 1 1-5.8-1.6'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M3 11l18-5v12L3 13v-2z'/%3E%3Cpath d='M11.6 16.8a3 3 0 1 1-5.8-1.6'/%3E%3C/svg%3E"); }
    .i-store { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3Cpolyline points='9 22 9 12 15 12 15 22'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3Cpolyline points='9 22 9 12 15 12 15 22'/%3E%3C/svg%3E"); }
    .i-check { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/%3E%3Cpolyline points='22 4 12 14.01 9 11.01'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/%3E%3Cpolyline points='22 4 12 14.01 9 11.01'/%3E%3C/svg%3E"); }
    .i-clipboard { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/%3E%3Crect x='8' y='2' width='8' height='4' rx='1' ry='1'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/%3E%3Crect x='8' y='2' width='8' height='4' rx='1' ry='1'/%3E%3C/svg%3E"); }
    .i-bulb { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M9 18h6'/%3E%3Cpath d='M10 22h4'/%3E%3Cpath d='M15.09 14c.18-.98.65-1.74 1.41-2.5A4.65 4.65 0 0 0 18 8 6 6 0 0 0 6 8c0 1 .23 2.23 1.5 3.5A4.61 4.61 0 0 1 8.91 14'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M9 18h6'/%3E%3Cpath d='M10 22h4'/%3E%3Cpath d='M15.09 14c.18-.98.65-1.74 1.41-2.5A4.65 4.65 0 0 0 18 8 6 6 0 0 0 6 8c0 1 .23 2.23 1.5 3.5A4.61 4.61 0 0 1 8.91 14'/%3E%3C/svg%3E"); }
    .i-cart { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Ccircle cx='9' cy='21' r='1'/%3E%3Ccircle cx='20' cy='21' r='1'/%3E%3Cpath d='M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Ccircle cx='9' cy='21' r='1'/%3E%3Ccircle cx='20' cy='21' r='1'/%3E%3Cpath d='M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6'/%3E%3C/svg%3E"); }
    .i-phone { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Crect x='5' y='2' width='14' height='20' rx='2' ry='2'/%3E%3Cline x1='12' y1='18' x2='12.01' y2='18'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Crect x='5' y='2' width='14' height='20' rx='2' ry='2'/%3E%3Cline x1='12' y1='18' x2='12.01' y2='18'/%3E%3C/svg%3E"); }
    .i-dollar { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cline x1='12' y1='1' x2='12' y2='23'/%3E%3Cpath d='M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cline x1='12' y1='1' x2='12' y2='23'/%3E%3Cpath d='M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6'/%3E%3C/svg%3E"); }
    .i-flame { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M8.5 14.5A2.5 2.5 0 0 0 11 12c0-1.38-.5-2-1-3-1.072-2.143-.224-4.054 2-6 .5 2.5 2 4.9 4 6.5 2 1.6 3 3.5 3 5.5a7 7 0 1 1-14 0c0-1.153.433-2.294 1-3a2.5 2.5 0 0 0 2.5 2.5z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M8.5 14.5A2.5 2.5 0 0 0 11 12c0-1.38-.5-2-1-3-1.072-2.143-.224-4.054 2-6 .5 2.5 2 4.9 4 6.5 2 1.6 3 3.5 3 5.5a7 7 0 1 1-14 0c0-1.153.433-2.294 1-3a2.5 2.5 0 0 0 2.5 2.5z'/%3E%3C/svg%3E"); }
    .i-link { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E"); }
    .i-refresh { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpolyline points='23 4 23 10 17 10'/%3E%3Cpolyline points='1 20 1 14 7 14'/%3E%3Cpath d='M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpolyline points='23 4 23 10 17 10'/%3E%3Cpolyline points='1 20 1 14 7 14'/%3E%3Cpath d='M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15'/%3E%3C/svg%3E"); }
    .i-download { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpolyline points='7 10 12 15 17 10'/%3E%3Cline x1='12' y1='15' x2='12' y2='3'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpolyline points='7 10 12 15 17 10'/%3E%3Cline x1='12' y1='15' x2='12' y2='3'/%3E%3C/svg%3E"); }
    .i-heart { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E"); }
    .i-eye { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); }
    .i-edit { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7'/%3E%3Cpath d='M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7'/%3E%3Cpath d='M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z'/%3E%3C/svg%3E"); }
    .i-health { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M22 12h-4l-3 9L9 3l-3 9H2'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M22 12h-4l-3 9L9 3l-3 9H2'/%3E%3C/svg%3E"); }
    .i-briefcase { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Crect x='2' y='7' width='20' height='14' rx='2' ry='2'/%3E%3Cpath d='M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Crect x='2' y='7' width='20' height='14' rx='2' ry='2'/%3E%3Cpath d='M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16'/%3E%3C/svg%3E"); }
    .i-plus { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cline x1='12' y1='5' x2='12' y2='19'/%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cline x1='12' y1='5' x2='12' y2='19'/%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3C/svg%3E"); }
    .i-copy { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Crect x='9' y='9' width='13' height='13' rx='2' ry='2'/%3E%3Cpath d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Crect x='9' y='9' width='13' height='13' rx='2' ry='2'/%3E%3Cpath d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/%3E%3C/svg%3E"); }
    .i-settings { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z'/%3E%3C/svg%3E"); }

    /* ===== STICKY AI BAR ===== */
    .sticky-ai-bar { position: fixed; top: 0; left: 220px; right: 0; z-index: 90; background: white; color: var(--text-primary); border-bottom: 2px solid #DC2626; padding: 10px 24px; display: flex; align-items: center; gap: 14px; transform: translateY(-100%); transition: transform 0.3s ease; box-shadow: 0 4px 12px rgba(0,0,0,0.06); }
    .sticky-ai-bar.visible { transform: translateY(0); }
    .sticky-ai-bar .sab-dot { width: 8px; height: 8px; border-radius: 50%; background: #DC2626; animation: accPulse 1.5s infinite; flex-shrink: 0; }
    .sticky-ai-bar .sab-text { font-size: 12px; font-weight: 600; }
    .sticky-ai-bar .sab-badges { display: flex; gap: 6px; margin-left: auto; }
    .sticky-ai-bar .sab-badge { font-size: 9px; padding: 3px 8px; border-radius: 3px; font-weight: 600; }
    .sticky-ai-bar .sab-btn { padding: 5px 12px; background: var(--blue-50); border: 1px solid var(--blue-200); border-radius: 3px; color: var(--blue-500); font-size: 10px; font-weight: 600; cursor: pointer; transition: all 0.15s; }
    .sticky-ai-bar .sab-btn:hover { background: var(--blue-100); }

    /* ===== COLLAPSIBLE SECTIONS ===== */
    .section-collapse { cursor: pointer; user-select: none; }
    .section-collapse::after { content: ''; display: inline-block; width: 12px; height: 12px; background: var(--text-muted); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='3'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='3'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); -webkit-mask-size: contain; mask-size: contain; margin-left: 8px; transition: transform 0.3s; vertical-align: middle; }
    .section-collapse.collapsed::after { transform: rotate(-90deg); }
    .section-body { transition: max-height 0.4s ease, opacity 0.3s ease; overflow: hidden; }
    .section-body.collapsed { max-height: 0 !important; opacity: 0; pointer-events: none; }

    /* ===== NOTIFICATION SYSTEM ===== */
    .notif-container { position: fixed; top: 60px; right: 24px; z-index: 500; display: flex; flex-direction: column; gap: 8px; pointer-events: none; }
    .notif { pointer-events: auto; background: var(--bg-card); border: 1px solid var(--border); border-left: 4px solid #FF1414; border-radius: 4px; padding: 12px 16px; box-shadow: 0 8px 30px rgba(0,0,0,0.12); animation: notifSlide 0.4s ease, notifFade 0.4s ease 4s forwards; display: flex; align-items: center; gap: 10px; min-width: 340px; }
    .notif.success { border-left-color: #10B981; }
    .notif.info { border-left-color: #00399E; }
    .notif-icon { width: 20px; height: 20px; flex-shrink: 0; }
    .notif-icon .i { width: 18px; height: 18px; }
    .notif-text { font-size: 12px; color: var(--text-primary); font-weight: 500; }
    .notif-close { margin-left: auto; background: none; border: none; color: var(--text-muted); cursor: pointer; font-size: 14px; padding: 2px; }
    @keyframes notifSlide { from { transform: translateX(100px); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
    @keyframes notifFade { from { opacity: 1; } to { opacity: 0; transform: translateY(-10px); pointer-events: none; } }

    /* ===== PERSONALIZATION FILTER ===== */
    .personalize-bar { display: flex; align-items: center; gap: 8px; padding: 10px 16px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 4px; margin-bottom: 14px; }
    .personalize-label { font-size: 10px; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; white-space: nowrap; }
    .personalize-chip { padding: 4px 10px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 3px; font-size: 10px; font-weight: 500; color: var(--text-secondary); cursor: pointer; transition: all 0.15s; white-space: nowrap; }
    .personalize-chip:hover, .personalize-chip.active { background: var(--blue-500); color: white; border-color: var(--blue-500); }

    /* ===== TRACK / FEEDBACK BUTTONS ===== */
    .track-btn { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; background: transparent; border: 1px solid var(--border); border-radius: 3px; font-size: 9px; font-weight: 600; color: var(--text-muted); cursor: pointer; transition: all 0.2s; }
    .track-btn:hover { background: var(--blue-50); color: var(--blue-500); border-color: var(--blue-200); }
    .track-btn.tracked { background: #D1FAE5; color: #059669; border-color: #059669; }
    .track-btn.light { background: transparent; border-color: var(--border); color: var(--text-muted); }
    .track-btn.light:hover { background: var(--blue-50); color: var(--blue-500); border-color: var(--blue-200); }
    .track-btn.light.tracked { background: var(--green-100); color: var(--green-500); border-color: var(--green-500); }
    .feedback-btn { display: inline-flex; align-items: center; gap: 4px; padding: 5px 12px; background: var(--blue-500); border: none; border-radius: 3px; font-size: 10px; font-weight: 600; color: white; cursor: pointer; transition: all 0.2s; }
    .feedback-btn:hover { background: var(--blue-600); }
    .feedback-btn.done { background: var(--green-500); }

    /* ===== ENHANCED ANIMATIONS ===== */
    @keyframes glowPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(255,20,20,0.15); } 50% { box-shadow: 0 0 20px 4px rgba(255,20,20,0.1); } }
    @keyframes slideUp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
    .glow-red { /* animation removed for cleaner look */ }
    @keyframes glowPulse-white { 0%,100% { box-shadow: 0 0 0 0 rgba(220,38,38,0.1); } 50% { box-shadow: 0 0 20px 2px rgba(220,38,38,0.08); } }
    .animate-in { animation: slideUp 0.5s ease forwards; }
    .acc-item { transition: all 0.2s ease; }
    .acc-item:hover { transform: translateX(3px); background: var(--bg-elevated); }
    .acc-item:active { transform: scale(0.98); }
    .card:hover { box-shadow: var(--shadow-md); }

    /* ===== CONFIDENCE BADGE ===== */
    .confidence-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 9px; padding: 2px 8px; border-radius: 3px; font-weight: 700; }
    .confidence-badge .conf-bar { width: 30px; height: 4px; background: var(--bg-elevated); border-radius: 2px; overflow: hidden; }
    .confidence-badge .conf-fill { height: 100%; border-radius: 2px; background: currentColor; }

    /* ===== IMPACT STRIP ===== */
    .impact-strip { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 6px; }
    .impact-tag { font-size: 8px; padding: 2px 7px; border-radius: 3px; font-weight: 700; letter-spacing: 0.3px; }
    .impact-tag.critical { background: #DC2626; color: white; }
    .impact-tag.high { background: #FFE5E5; color: #DC2626; }
    .impact-tag.medium { background: #FEF3C7; color: #D97706; }
    .impact-tag.info { background: var(--blue-50); color: var(--blue-500); }
    .impact-tag.success { background: #D1FAE5; color: #059669; }

    /* ===== AI PREDICTION BLOCK ===== */
    .ai-predict { margin-top: 14px; padding: 14px 18px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 4px; }
    .ai-predict-title { font-size: 10px; font-weight: 700; color: var(--blue-500); text-transform: uppercase; letter-spacing: 0.8px; margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
    .ai-predict-text { font-size: 11px; color: var(--text-secondary); line-height: 1.7; }

    @media (max-width: 1024px) { .sticky-ai-bar { left: 0; } }

    /* ===== VIEW-BASED NAVIGATION ===== */
    /* All sections visible by default, toggled by widget manager */
    @keyframes viewFadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

    /* ===== SIDEBAR GROUP HEADERS — COLORFUL BUTTONS ===== */
    .nav-group-header {
      display:flex; align-items:center; gap:8px; padding:7px 10px; cursor:pointer;
      border-radius:8px; transition:all 0.2s; margin-bottom:2px; user-select:none;
      font-weight:700; font-size:10px; text-transform:uppercase; letter-spacing:0.6px;
      border:1px solid rgba(255,255,255,0.08); min-height:34px; box-sizing:border-box; background:rgba(255,255,255,0.04);
      white-space:nowrap; overflow:hidden;
    }
    .nav-group-header:hover { transform:translateX(3px); filter:brightness(1.15); }
    .nav-group-header:active { transform:scale(0.97); }
    .nav-group-header.active { filter:brightness(1.2); box-shadow:0 0 16px rgba(255,255,255,0.1); }
    .nav-group-icon { font-size:14px; flex-shrink:0; pointer-events:none; display:flex; align-items:center; }
    .nav-group-label { flex:1; letter-spacing:0.6px; pointer-events:none; font-size:11px; overflow:hidden; text-overflow:ellipsis; color:inherit; }
    .nav-group-header .sb-arrow { pointer-events:none; }
    .nav-group-header svg { pointer-events:none; }
    /* Individual group colors — koyu tema */
    .nav-group-header.ng-genel { background:rgba(99,102,241,0.15); color:#A5B4FC; }
    .nav-group-header.ng-genel:hover { background:rgba(99,102,241,0.25); }
    .nav-group-header.ng-sm { background:rgba(59,130,246,0.15); color:#93C5FD; }
    .nav-group-header.ng-sm:hover { background:rgba(59,130,246,0.25); }
    .nav-group-header.ng-algi { background:rgba(16,185,129,0.15); color:#6EE7B7; }
    .nav-group-header.ng-algi:hover { background:rgba(16,185,129,0.25); }
    .nav-group-header.ng-kritik { background:rgba(239,68,68,0.15); color:#FCA5A5; }
    .nav-group-header.ng-kritik:hover { background:rgba(239,68,68,0.25); }
    .nav-group-header.ng-dna { background:rgba(167,139,250,0.15); color:#C4B5FD; }
    .nav-group-header.ng-dna:hover { background:rgba(167,139,250,0.25); }
    .nav-group-header.ng-act { background:rgba(251,191,36,0.15); color:#FCD34D; }
    .nav-group-header.ng-act:hover { background:rgba(251,191,36,0.25); }
    .nav-group-header.ng-takip { background:rgba(34,211,238,0.15); color:#67E8F9; }
    .nav-group-header.ng-takip:hover { background:rgba(34,211,238,0.25); }

    /* ===== ADD-ON BUTTON ===== */
    .addon-btn { background:rgba(99,102,241,0.1); border:1px dashed rgba(99,102,241,0.3); color:#A5B4FC; }
    .addon-btn:hover { background:rgba(99,102,241,0.2); border-color:#6366F1; color:white; }
    .addon-btn svg { stroke:#A5B4FC; }
    .addon-btn:hover svg { stroke:white; }
    .nav-item { transition: all 0.2s ease; }
    .nav-item:hover { background: var(--sidebar-hover); color: white; transform: translateX(3px); }
    .nav-item:active { transform: scale(0.97); }
    .nav-item.active { background: var(--sidebar-active); color: white; font-weight: 600; box-shadow: 0 2px 8px rgba(0,57,158,0.3); }

    /* ===== CLICK FEEL ===== */
    .top-btn, .section-filter, .global-date-preset, .personalize-chip, .compare-toggle, .feedback-btn, .track-btn, .alert-btn, .acc-cta, .comment-copy-btn, .comment-go-link {
      transition: all 0.15s ease !important;
    }
    .top-btn:hover, .section-filter:hover, .global-date-preset:hover, .alert-btn:hover {
      transform: translateY(-1px); box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    }
    .top-btn:active, .section-filter:active, .global-date-preset:active, .alert-btn:active, .acc-cta:active, .personalize-chip:active {
      transform: scale(0.96) !important; box-shadow: none !important;
    }
    .top-btn.primary:hover { box-shadow: 0 4px 12px rgba(0,57,158,0.25); transform: translateY(-1px); }
    input[type="date"]:focus, select:focus { border-color: var(--blue-400) !important; box-shadow: 0 0 0 3px rgba(0,57,158,0.1) !important; outline: none; }

    /* ===== CLEAN SECTION CARDS (white bg, no gradient overkill) ===== */
    .section-clean { background: var(--bg-card); border: 1px solid var(--border); border-radius: 4px; padding: 20px; margin-bottom: 16px; }

    /* ===== SM ANALYSIS CARD ===== */
    .sm-analysis { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin-bottom: 20px; }
    .sm-platform-card { background: var(--bg-card); border: none; border-radius: 4px; padding: 14px; text-align: center; transition: all 0.2s; cursor: pointer; box-shadow: 0 1px 3px rgba(0,0,0,0.04); }
    .sm-platform-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
    .sm-platform-name { font-size: 10px; font-weight: 700; color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 8px; }
    .sm-platform-score { font-size: 22px; font-weight: 800; line-height: 1; margin-bottom: 4px; }
    .sm-platform-label { font-size: 9px; color: var(--text-muted); }
    .sm-platform-bar { height: 4px; background: var(--bg-elevated); border-radius: 2px; margin-top: 8px; overflow: hidden; }
    .sm-platform-fill { height: 100%; border-radius: 2px; }
    .sm-sentiment-row { display: flex; gap: 4px; margin-top: 8px; justify-content: center; }
    .sm-sent-dot { font-size: 8px; padding: 1px 6px; border-radius: 3px; font-weight: 600; }

    /* ===== VIEW FILTER TOOLBAR ===== */
    .view-filter-bar-old { display: flex; align-items: center; gap: 8px; padding: 10px 16px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 4px; margin-bottom: 14px; }
    .view-filter-label { font-size: 10px; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; }
    .view-chip-old { padding: 5px 12px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 3px; font-size: 10px; font-weight: 600; color: var(--text-secondary); cursor: pointer; transition: all 0.15s; }
    .view-chip:hover { background: var(--blue-50); color: var(--blue-500); border-color: var(--blue-200); transform: translateY(-1px); }
    .view-chip:active { transform: scale(0.95); }
    .view-chip.active { background: var(--blue-500); color: white; border-color: var(--blue-500); }


    /* ===== WIDGET CUSTOMIZER (Google Analytics Style) ===== */
    .widget-customize-btn { display: flex; align-items: center; gap: 6px; padding: 6px 14px; background: var(--bg-card); border: 1px dashed var(--blue-300); border-radius: 4px; font-size: 10px; font-weight: 600; color: var(--blue-500); cursor: pointer; transition: all 0.2s; margin-left: auto; }
    .widget-customize-btn:hover { background: var(--blue-50); border-style: solid; transform: translateY(-1px); }
    .widget-customize-btn:active { transform: scale(0.96); }
    .widget-panel { position: fixed; top: 0; right: -400px; width: 380px; height: 100vh; background: var(--bg-card); border-left: 1px solid var(--border); z-index: 500; transition: right 0.35s ease; box-shadow: -8px 0 30px rgba(0,0,0,0.08); display: flex; flex-direction: column; }
    .widget-panel.open { right: 0; }
    .widget-panel-header { padding: 18px 20px; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; }
    .widget-panel-title { font-size: 14px; font-weight: 700; color: var(--text-primary); }
    .widget-panel-close { background: var(--bg-elevated); border: none; width: 28px; height: 28px; border-radius: 4px; cursor: pointer; font-size: 14px; color: var(--text-muted); display: flex; align-items: center; justify-content: center; transition: all 0.15s; }
    .widget-panel-close:hover { background: var(--bg-hover); color: var(--text-primary); }
    .widget-panel-body { flex: 1; overflow-y: auto; padding: 16px 20px; }
    .widget-group-title { font-size: 10px; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 10px; margin-top: 16px; }
    .widget-group-title:first-child { margin-top: 0; }
    .widget-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 4px; margin-bottom: 6px; cursor: grab; transition: all 0.15s; }
    .widget-item:hover { border-color: var(--blue-300); background: var(--blue-50); }
    .widget-item:active { cursor: grabbing; transform: scale(0.98); }
    .widget-item-drag { color: var(--text-muted); font-size: 14px; cursor: grab; }
    .widget-item-info { flex: 1; }
    .widget-item-name { font-size: 11px; font-weight: 600; color: var(--text-primary); }
    .widget-item-desc { font-size: 9px; color: var(--text-muted); }
    .widget-toggle { position: relative; width: 36px; height: 20px; background: var(--bg-hover); border-radius: 10px; cursor: pointer; transition: all 0.2s; flex-shrink: 0; }
    .widget-toggle.on { background: var(--blue-500); }
    .widget-toggle::after { content: ''; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; background: white; border-radius: 50%; transition: all 0.2s; box-shadow: 0 1px 3px rgba(0,0,0,0.15); }
    .widget-toggle.on::after { left: 18px; }
    .widget-panel-footer { padding: 14px 20px; border-top: 1px solid var(--border); display: flex; gap: 8px; }
    .widget-backdrop { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.2); z-index: 499; display: none; backdrop-filter: blur(2px); }
    .widget-backdrop.open { display: block; }


    /* ===== WIDGET MANAGER DROPDOWN ===== */
    .wm-trigger { display: flex; align-items: center; gap: 6px; padding: 7px 14px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 4px; font-size: 11px; font-weight: 600; color: var(--text-secondary); cursor: pointer; transition: all 0.15s; position: relative; }
    .wm-trigger:hover { background: var(--blue-50); color: var(--blue-500); border-color: var(--blue-200); transform: translateY(-1px); }
    .wm-trigger:active { transform: scale(0.96); }
    .wm-trigger .wm-count { background: var(--blue-500); color: white; font-size: 9px; padding: 1px 6px; border-radius: 3px; font-weight: 700; }
    .wm-dropdown { position: absolute; top: calc(100% + 6px); right: 0; width: 340px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 4px; box-shadow: 0 12px 40px rgba(0,0,0,0.12); z-index: 200; display: none; max-height: 520px; overflow: hidden; }
    .wm-dropdown.open { display: block; animation: viewFadeIn 0.2s ease; }
    .wm-dropdown-header { padding: 12px 14px; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; }
    .wm-dropdown-title { font-size: 12px; font-weight: 700; color: var(--text-primary); }
    .wm-dropdown-actions { display: flex; gap: 6px; }
    .wm-dropdown-action { font-size: 9px; padding: 3px 8px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 3px; color: var(--text-muted); cursor: pointer; font-weight: 600; }
    .wm-dropdown-action:hover { background: var(--blue-50); color: var(--blue-500); }
    .wm-dropdown-body { max-height: 420px; overflow-y: auto; padding: 6px; }
    .wm-item { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 3px; cursor: grab; transition: all 0.12s; user-select: none; margin-bottom: 2px; }
    .wm-item:hover { background: var(--bg-elevated); }
    .wm-item:active { cursor: grabbing; background: var(--blue-50); box-shadow: 0 2px 8px rgba(0,0,0,0.08); }
    .wm-item.dragging { opacity: 0.5; background: var(--blue-100); }
    .wm-item.drag-over { border-top: 2px solid var(--blue-500); }
    .wm-drag { color: var(--text-muted); font-size: 12px; cursor: grab; flex-shrink: 0; line-height: 1; }
    .wm-check { width: 18px; height: 18px; border-radius: 3px; border: 2px solid var(--border); display: flex; align-items: center; justify-content: center; flex-shrink: 0; cursor: pointer; transition: all 0.15s; }
    .wm-check.on { background: var(--blue-500); border-color: var(--blue-500); }
    .wm-check.on::after { content: ''; display: block; width: 10px; height: 10px; background: white; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='3'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='3'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E"); -webkit-mask-size: contain; mask-size: contain; }
    .wm-label { font-size: 11px; font-weight: 500; color: var(--text-primary); flex: 1; }
    .wm-item.off .wm-label { color: var(--text-muted); text-decoration: line-through; }
    .wm-shortcut { font-size: 9px; color: var(--text-muted); padding: 1px 5px; background: var(--bg-elevated); border-radius: 2px; font-weight: 600; }
    .wm-dropdown-footer { padding: 8px 14px; border-top: 1px solid var(--border); font-size: 9px; color: var(--text-muted); text-align: center; }


    /* ===== SMOOTH WIDGET TOGGLE ===== */
    [data-widget] { transition: opacity 0.3s ease, max-height 0.4s ease; }

    /* ===== HOW TO SOLVE BLOCKS ===== */
    .howto { margin-top: 14px; padding: 16px; background: #F0FDF4; border: 1px solid #D1FAE5; border-radius: 4px; border-left: 3px solid var(--green); }
    .howto-header { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; cursor: pointer; }
    .howto-header:hover .howto-title { color: #047857; }
    .howto-icon { width: 28px; height: 28px; background: var(--green); border-radius: 4px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .howto-icon .i { width: 14px; height: 14px; color: white; }
    .howto-title { font-size: 11px; font-weight: 700; color: var(--green); transition: color 0.15s; }
    .howto-subtitle { font-size: 9px; color: var(--text3); }
    .howto-steps { display: none; }
    .howto-steps.open { display: block; animation: fadeIn 0.3s ease; }
    .howto-step { display: flex; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--border); }
    .howto-step:last-child { border-bottom: none; }
    .howto-step-num { width: 22px; height: 22px; background: #D1FAE5; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 700; color: var(--green); flex-shrink: 0; }
    .howto-step-text { font-size: 11px; color: var(--text2); line-height: 1.6; }
    .howto-step-text strong { color: var(--text); }
    @keyframes fadeIn { from{opacity:0;transform:translateY(4px)} to{opacity:1;transform:translateY(0)} }

    /* ===== AI TICKET SYSTEM ===== */
    .ai-ticket-fab { position: fixed; bottom: 24px; right: 24px; z-index: 200; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
    .ai-ticket-btn { width: 52px; height: 52px; border-radius: 50%; background: var(--royal); color: white; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 16px rgba(0,57,158,0.3); transition: all 0.2s; }
    .ai-ticket-btn:hover { transform: scale(1.05); box-shadow: 0 6px 20px rgba(0,57,158,0.4); }
    .ai-ticket-btn .i { width: 22px; height: 22px; }
    .ai-ticket-panel { width: 380px; height: 520px; background: #FFFFFF; border: 1px solid var(--border); border-radius: 8px; box-shadow: 0 16px 48px rgba(0,0,0,0.15); display: none; flex-direction: column; overflow: hidden; }
    .ai-ticket-panel.open { display: flex; animation: fadeIn 0.3s ease; }
    .ai-ticket-header { padding: 14px 18px; background: var(--royal); color: white; display: flex; align-items: center; gap: 10px; }
    .ai-ticket-header-icon { width: 32px; height: 32px; background: rgba(255,255,255,0.15); border-radius: 6px; display: flex; align-items: center; justify-content: center; }
    .ai-ticket-header-icon .i { width: 18px; height: 18px; color: white; }
    .ai-ticket-header h3 { font-size: 13px; font-weight: 700; }
    .ai-ticket-header p { font-size: 9px; opacity: 0.7; }
    .ai-ticket-close { margin-left: auto; background: rgba(255,255,255,0.1); border: none; width: 26px; height: 26px; border-radius: 4px; color: white; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 14px; }
    .ai-ticket-body { flex: 1; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 10px; background: #FFFFFF; }
    .ai-ticket-msg { max-width: 85%; padding: 10px 14px; border-radius: 8px; font-size: 12px; line-height: 1.6; }
    .ai-ticket-msg.bot { align-self: flex-start; background: #EDF2F7; color: var(--text); border-bottom-left-radius: 2px; }
    .ai-ticket-msg.user { align-self: flex-end; background: var(--royal); color: white; border-bottom-right-radius: 2px; }
    .ai-ticket-input-area { display: flex; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--border); background: #FFFFFF; }
    .ai-ticket-input { flex: 1; border: 1px solid var(--border); border-radius: 4px; padding: 8px 12px; font-size: 12px; font-family: inherit; color: var(--text); background: #FFFFFF; }
    .ai-ticket-input:focus { outline: none; border-color: var(--royal); }
    .ai-ticket-send { width: 34px; height: 34px; background: var(--royal); border: none; border-radius: 4px; color: white; cursor: pointer; display: flex; align-items: center; justify-content: center; }
    .ai-ticket-send .i { width: 14px; height: 14px; }
    .ai-ticket-quick { display: flex; flex-wrap: wrap; gap: 4px; padding: 8px 14px; border-top: 1px solid var(--border); background: #FFFFFF; }
    .ai-ticket-quick-btn { padding: 4px 10px; background: #EDF2F7; border: 1px solid var(--border); border-radius: 3px; font-size: 9px; color: var(--text2); cursor: pointer; font-family: inherit; transition: all 0.15s; }
    .ai-ticket-quick-btn:hover { background: var(--royal); color: white; border-color: var(--royal); }


    /* ===== ORG TYPE DEMO SWITCHER ===== */
    .org-switcher { display: flex; align-items: center; gap: 8px; padding: 10px 16px; background: #1E1E2E; border-radius: 4px; margin-bottom: 0; }
    .org-switcher-label { font-size: 10px; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: 1px; white-space: nowrap; }
    .org-switcher-btn { padding: 6px 12px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 3px; font-size: 10px; font-weight: 600; color: var(--text-secondary); cursor: pointer; font-family: inherit; transition: all 0.15s; white-space: nowrap; }
    .org-switcher-btn:hover { background: var(--bg-hover); color: var(--text-primary); transform: translateY(-1px); }
    .org-switcher-btn:active { transform: scale(0.96); }
    .org-switcher-btn.active { background: var(--blue-500); color: white; border-color: var(--blue-500); }
    .org-switcher-btn.active.gov { background: #DC2626; border-color: #DC2626; }
    .org-switcher-btn.active.ngo { background: #059669; border-color: #059669; }
    .org-switcher-btn.active.political { background: #F59E0B; border-color: #F59E0B; }
    .org-switcher-btn.active.halka { background: #6366F1; border-color: #6366F1; }
    .org-switcher-btn.active.healthcare { background: #0EA5E9; border-color: #0EA5E9; }
    .org-switcher-btn.active.bank { background: #14532D; border-color: #14532D; }
    .org-transition { transition: opacity 0.3s ease, transform 0.3s ease; }
    .org-hidden { display: none !important; }


    /* ===== BUGÜN NE YAPMALI ===== */
    .today-block { background: linear-gradient(135deg, #111D52 0%, #0A1238 100%); border: none; border-radius: 8px; padding: 28px 30px; margin-bottom: 20px; position: relative; overflow: hidden; }
    .today-block::before { content: ''; position: absolute; top: -40%; right: -10%; width: 300px; height: 300px; background: radial-gradient(circle, rgba(16,185,129,0.08) 0%, transparent 70%); pointer-events: none; }
    .today-block::after { content: ''; position: absolute; bottom: -30%; left: -5%; width: 200px; height: 200px; background: radial-gradient(circle, rgba(0,57,158,0.1) 0%, transparent 70%); pointer-events: none; }
    .today-header { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; position: relative; z-index: 1; }
    .today-icon { width: 44px; height: 44px; background: linear-gradient(135deg, #10B981, #059669); border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; box-shadow: 0 4px 12px rgba(16,185,129,0.3); }
    .today-icon .i { width: 20px; height: 20px; color: white; }
    .today-title { font-size: 17px; font-weight: 800; color: #FFFFFF; letter-spacing: -0.3px; }
    .today-subtitle { font-size: 11px; color: var(--text-muted); margin-top: 2px; }
    .today-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; position: relative; z-index: 1; }
    .today-step { display: flex; gap: 12px; padding: 16px; background: var(--bg-elevated); border-radius: 8px; align-items: flex-start; cursor: pointer; transition: all 0.2s; border: 1px solid rgba(255,255,255,0.06); backdrop-filter: blur(4px); }
    .today-step:hover { background: rgba(255,255,255,0.12); border-color: rgba(255,255,255,0.15); transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,0.15); }
    .today-step:active { transform: scale(0.98); }
    .today-step-num { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; flex-shrink: 0; color: white; box-shadow: 0 2px 8px rgba(0,0,0,0.2); }
    .today-step-num.urgent { background: #DC2626; }
    .today-step-num.high { background: #D97706; }
    .today-step-num.normal { background: #10B981; }
    .today-step-num.info { background: #3B82F6; }
    .today-step-title { font-size: 12px; font-weight: 700; color: #FFFFFF; margin-bottom: 4px; }
    .today-step-desc { font-size: 10px; color: var(--text-muted); line-height: 1.5; }
    .today-step-tag { font-size: 8px; padding: 2px 8px; border-radius: 3px; font-weight: 700; margin-top: 6px; display: inline-block; }

    /* ===== KELİMELERİM ===== */
    .kw-section { background: var(--bg-card); border: 1px solid var(--border); border-radius: 4px; padding: 20px; margin-bottom: 16px; }
    .kw-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
    .kw-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
    .kw-card { padding: 14px; background: var(--bg-elevated); border-radius: 4px; border-left: 3px solid var(--blue-500); transition: all 0.15s; }
    .kw-card:hover { background: var(--bg-card); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
    .kw-word { font-size: 12px; font-weight: 700; color: var(--text-primary); margin-bottom: 6px; }
    .kw-stats { display: flex; gap: 8px; margin-bottom: 6px; }
    .kw-stat { font-size: 9px; color: var(--text-muted); }
    .kw-stat strong { color: var(--text-primary); }
    .kw-platforms { display: flex; gap: 3px; }
    .kw-platform { font-size: 8px; padding: 1px 5px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 2px; color: var(--text-muted); }
    .kw-awareness { margin-top: 6px; }
    .kw-awareness-bar { height: 4px; background: var(--bg-elevated); border-radius: 2px; overflow: hidden; }
    .kw-awareness-fill { height: 100%; border-radius: 2px; }
    .kw-awareness-label { font-size: 8px; color: var(--text-muted); margin-top: 2px; }

    /* ===== ADD-ON HAVUZU ===== */
    .addon-trigger { display: flex; align-items: center; gap: 6px; width: 100%; padding: 10px 12px; background: linear-gradient(135deg, rgba(99,102,241,0.08), rgba(139,92,246,0.08)); border: 1px dashed rgba(99,102,241,0.3); border-radius: 4px; font-size: 11px; font-weight: 600; color: #6366F1; cursor: pointer; font-family: inherit; transition: all 0.15s; margin-top: 8px; }
    .addon-trigger:hover { background: linear-gradient(135deg, rgba(99,102,241,0.15), rgba(139,92,246,0.15)); border-style: solid; transform: translateY(-1px); }
    .addon-trigger .i { width: 14px; height: 14px; }
    .addon-panel { position: fixed; top: 0; right: -420px; width: 400px; height: 100vh; background: var(--bg-card); border-left: 1px solid var(--border); z-index: 300; transition: right 0.35s ease; box-shadow: -8px 0 30px rgba(0,0,0,0.1); display: flex; flex-direction: column; }
    .addon-panel.open { right: 0; }
    .addon-backdrop { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.15); z-index: 299; display: none; }
    .addon-backdrop.open { display: block; }
    .addon-header { padding: 18px 20px; border-bottom: 1px solid var(--border); }
    .addon-header-title { font-size: 14px; font-weight: 700; color: var(--text-primary); display: flex; align-items: center; gap: 8px; }
    .addon-header-sub { font-size: 10px; color: var(--text-muted); margin-top: 2px; }
    .addon-body { flex: 1; overflow-y: auto; padding: 16px 20px; }
    .addon-category { font-size: 9px; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: 1px; margin: 16px 0 8px; }
    .addon-category:first-child { margin-top: 0; }
    .addon-item { padding: 14px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 4px; margin-bottom: 8px; transition: all 0.15s; }
    .addon-item:hover { border-color: #6366F1; }
    .addon-item-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; }
    .addon-item-name { font-size: 12px; font-weight: 700; color: var(--text-primary); }
    .addon-item-price { font-size: 10px; font-weight: 700; color: #6366F1; }
    .addon-item-desc { font-size: 10px; color: var(--text-muted); line-height: 1.5; margin-bottom: 8px; }
    .addon-item-btn { padding: 5px 12px; background: #6366F1; color: white; border: none; border-radius: 3px; font-size: 10px; font-weight: 600; cursor: pointer; font-family: inherit; transition: all 0.15s; }
    .addon-item-btn:hover { background: #4F46E5; }
    .addon-item-btn:active { transform: scale(0.96); }
    .addon-item-btn.added { background: var(--green); }
    .addon-item-included { font-size: 9px; color: var(--green); font-weight: 600; }
    .addon-footer { padding: 14px 20px; border-top: 1px solid var(--border); }
    .addon-package-badge { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 3px; font-size: 10px; font-weight: 600; color: var(--text-muted); }
    .addon-package-badge.current { background: #EDE9FE; color: #6366F1; border-color: #6366F1; }

    /* ===== MODULE ACTIVATION BADGE ===== */
    .module-reason { display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px; background: #F0FDF4; border: 1px solid #D1FAE5; border-radius: 3px; font-size: 8px; color: var(--green); font-weight: 600; margin-left: 8px; }


    /* ===== PRE-ANALİZ MODU ===== */
    .preanaliz-banner { display:none; margin-left:220px; background:linear-gradient(135deg, #000B68 0%, #00399E 60%, #0066CC 100%); padding:28px 32px; position:relative; overflow:hidden; z-index:10; }
    .preanaliz-banner::before { content:''; position:absolute; top:-50%; right:-10%; width:50%; height:200%; background:radial-gradient(circle, rgba(255,255,255,0.04) 0%, transparent 70%); }
    .preanaliz-banner-inner { display:flex; align-items:center; justify-content:space-between; position:relative; z-index:1; }
    .preanaliz-badge { display:inline-flex; align-items:center; gap:6px; padding:3px 12px; background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.15); border-radius:14px; font-size:9px; font-weight:700; color:rgba(255,255,255,0.7); letter-spacing:0.5px; text-transform:uppercase; margin-bottom:8px; }
    .preanaliz-badge-dot { width:5px; height:5px; border-radius:50%; background:#10B981; animation:paBlink 2s infinite; }
    @keyframes paBlink { 0%,100%{opacity:1}50%{opacity:0.3} }
    .preanaliz-title { font-size:18px; font-weight:800; color:white; margin-bottom:2px; }
    .preanaliz-sub { font-size:11px; color:rgba(255,255,255,0.5); }
    .preanaliz-cta { padding:10px 24px; background:white; color:#000B68; border:none; border-radius:6px; font-size:12px; font-weight:800; cursor:pointer; font-family:inherit; transition:all 0.2s; white-space:nowrap; }
    .preanaliz-cta:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(0,0,0,0.2); }

    body.preanaliz-mode .preanaliz-banner { display:block; }
    body.preanaliz-mode .org-switcher { display:none !important; }

    /* Blur locked sections */
    body.preanaliz-mode .pa-locked { position:relative; }
    body.preanaliz-mode .pa-locked > * { filter:blur(5px); pointer-events:none; user-select:none; }
    body.preanaliz-mode .pa-locked::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.7) 60%, rgba(255,255,255,0.95) 100%); z-index:2; border-radius:4px; }
    body.preanaliz-mode .pa-locked::before { content:'Bu bölüm PRO pakette açılır'; position:absolute; bottom:20px; left:50%; transform:translateX(-50%); z-index:3; background:#000B68; color:white; padding:8px 20px; border-radius:6px; font-size:11px; font-weight:700; white-space:nowrap; cursor:pointer; box-shadow:0 4px 16px rgba(0,0,0,0.15); }

    /* Floating bottom CTA */
    .preanaliz-float { display:none; position:fixed; bottom:0; left:220px; right:0; background:white; border-top:2px solid #000B68; padding:14px 32px; z-index:200; box-shadow:0 -4px 20px rgba(0,0,0,0.08); }
    body.preanaliz-mode .preanaliz-float { display:flex; align-items:center; justify-content:space-between; }
    .preanaliz-float-text { font-size:12px; font-weight:700; color:#0A0E3A; }
    .preanaliz-float-sub { font-size:10px; color:#6C828D; }
    .preanaliz-float-btn { padding:10px 28px; background:linear-gradient(135deg, #000B68, #00399E); color:white; border:none; border-radius:6px; font-size:12px; font-weight:800; cursor:pointer; font-family:inherit; transition:all 0.2s; }
    .preanaliz-float-btn:hover { transform:translateY(-1px); box-shadow:0 4px 16px rgba(0,57,158,0.3); }

    /* Package section inside dashboard */
    .pa-packages { display:none; padding:32px; background:linear-gradient(180deg, #F8FAFB, #FFFFFF); border:2px solid #E5EBF0; border-radius:8px; margin-bottom:24px; }
    body.preanaliz-mode .pa-packages { display:block; }
    .pa-pkg-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:20px; }
    .pa-pkg { padding:24px 20px; border:2px solid #E5EBF0; border-radius:10px; text-align:center; cursor:pointer; transition:all 0.2s; background:white; }
    .pa-pkg:hover { border-color:#00399E; transform:translateY(-3px); box-shadow:0 8px 30px rgba(0,57,158,0.08); }
    .pa-pkg.rec { border-color:#00399E; background:linear-gradient(180deg, #EDF2FA, white 40%); position:relative; }
    .pa-pkg.rec::before { content:'SİZE ÖNERİLEN'; position:absolute; top:-10px; left:50%; transform:translateX(-50%); background:#00399E; color:white; font-size:7px; font-weight:800; padding:3px 12px; border-radius:10px; letter-spacing:0.8px; }
    .pa-pkg-name { font-size:13px; font-weight:800; color:#0A0E3A; }
    .pa-pkg-price { font-size:28px; font-weight:900; color:#00399E; margin:10px 0 2px; letter-spacing:-1px; }
    .pa-pkg-period { font-size:9px; color:#A3B5CB; margin-bottom:14px; }
    .pa-pkg-features { text-align:left; font-size:10px; color:#6C828D; line-height:2; }
    .pa-pkg-features .on { color:#0A0E3A; }
    .pa-pkg-features .off { color:#A3B5CB; text-decoration:line-through; }
    .pa-pkg-btn { display:block; width:100%; padding:10px; margin-top:16px; border-radius:6px; font-size:11px; font-weight:700; cursor:pointer; font-family:inherit; transition:all 0.15s; }
    .pa-pkg-btn.primary { background:#00399E; color:white; border:none; }
    .pa-pkg-btn.primary:hover { background:#000B68; }
    .pa-pkg-btn.outline { background:transparent; color:#00399E; border:1.5px solid #00399E; }
    .pa-pkg-btn.outline:hover { background:#00399E; color:white; }


    /* Focus module transition */
    #mainPage > [id] { transition: opacity 0.15s ease; }
    .focus-back-btn { display:none; margin-bottom:16px; padding:10px 20px; background:var(--bg-elevated); border:1px solid var(--border); border-radius:4px; font-size:11px; font-weight:600; color:var(--text-secondary); cursor:pointer; font-family:inherit; transition:all 0.15s; }
    .focus-back-btn:hover { background:var(--bg-card); border-color:var(--accent-primary); color:var(--accent-primary); }
    body.focus-mode .focus-back-btn { display:inline-flex; align-items:center; gap:6px; }


    /* ===== TARIH KARŞILAŞTIR (Top Bar) ===== */
    .date-compare-toggle { display:inline-flex; align-items:center; gap:6px; padding:5px 12px; background:var(--bg-elevated); border:1px solid var(--border); border-radius:4px; font-size:10px; font-weight:600; color:var(--text-secondary); cursor:pointer; font-family:inherit; transition:all 0.15s; margin-left:10px; }
    .date-compare-toggle:hover { border-color:var(--accent-primary); color:var(--accent-primary); }
    .date-compare-toggle.active { background:#EDF2FA; border-color:var(--accent-primary); color:var(--accent-primary); }
    .date-compare-panel { display:none; align-items:center; gap:8px; margin-left:10px; }
    .date-compare-panel.show { display:inline-flex; }
    .date-compare-select { padding:4px 8px; border:1px solid var(--border); border-radius:3px; font-size:10px; font-family:inherit; color:var(--text-primary); background:var(--bg-card); cursor:pointer; }
    .date-compare-vs { font-size:9px; font-weight:700; color:var(--text-muted); }
    .date-compare-badge { padding:2px 8px; background:#DBEAFE; color:#1E40AF; border-radius:3px; font-size:9px; font-weight:700; }

    /* ===== MODÜL İÇİ TARİH SEÇİCİ ===== */
    .module-date-bar { display:flex; align-items:center; gap:8px; padding:8px 14px; background:var(--bg-elevated); border:1px solid var(--border); border-radius:4px 4px 4px 4px; margin-bottom:0; position:relative; flex-wrap:wrap; }
    .module-date-bar .i { width:12px; height:12px; color:var(--text-muted); }
    .module-date-select { padding:3px 8px; border:1px solid var(--border); border-radius:3px; font-size:10px; font-family:inherit; color:var(--text-primary); background:var(--bg-card); cursor:pointer; }
    .module-date-label { font-size:9px; color:var(--text-muted); font-weight:600; }
    .module-date-compare-btn { padding:3px 8px; background:transparent; border:1px dashed var(--border); border-radius:3px; font-size:9px; font-weight:600; color:var(--text-muted); cursor:pointer; font-family:inherit; transition:all 0.12s; }
    .module-date-compare-btn:hover { border-color:var(--accent-primary); color:var(--accent-primary); border-style:solid; }
    .module-date-compare-btn.active { background:#EDF2FA; border-color:var(--accent-primary); color:var(--accent-primary); border-style:solid; }
    .module-compare-select { display:none; }
    .module-compare-select.show { display:inline-flex; align-items:center; gap:4px; }
    .module-date-delta { font-size:9px; font-weight:700; padding:2px 6px; border-radius:3px; margin-left:auto; }
    .module-date-delta.positive { background:#D1FAE5; color:#059669; }
    .module-date-delta.negative { background:#FFE5E5; color:#DC2626; }


    /* ===== ÖZEL TARİH SEÇİCİ ===== */
    .custom-date-row { display:none; align-items:center; gap:6px; margin-top:6px; }
    .custom-date-row.show { display:inline-flex; }
    .custom-date-input { padding:4px 8px; border:1px solid var(--border); border-radius:3px; font-size:10px; font-family:inherit; color:var(--text-primary); background:var(--bg-card); cursor:pointer; width:120px; }
    .custom-date-input:focus { border-color:var(--accent-primary); outline:none; }
    .custom-date-dash { font-size:10px; color:var(--text-muted); }
    .custom-date-apply { padding:4px 10px; background:var(--accent-primary); color:white; border:none; border-radius:3px; font-size:9px; font-weight:700; cursor:pointer; font-family:inherit; transition:all 0.15s; }
    .custom-date-apply:hover { opacity:0.9; }


    /* ===== PLATFORM FİLTRE ===== */
    .platform-filter { display:flex; align-items:center; gap:6px; padding:6px 14px; background:var(--bg-elevated); border:1px solid var(--border); border-radius:4px; margin-bottom:12px; flex-wrap:wrap; }
    .platform-filter-label { font-size:9px; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.5px; margin-right:4px; white-space:nowrap; }
    .pf-chip { padding:4px 10px; border:1px solid var(--border); border-radius:14px; font-size:9px; font-weight:600; color:var(--text-secondary); cursor:pointer; transition:all 0.12s; background:var(--bg-card); user-select:none; display:inline-flex; align-items:center; gap:4px; }
    .pf-chip:hover { border-color:var(--accent-primary); color:var(--accent-primary); }
    .pf-chip.active { background:var(--accent-primary); color:white; border-color:var(--accent-primary); }
    .pf-chip .pf-dot { width:6px; height:6px; border-radius:50%; flex-shrink:0; }
    .pf-chip-all { font-weight:700; }

    /* ===== KEYWORD PLATFORM TAGS ===== */
    .kw-platform-tags { display:flex; gap:3px; flex-wrap:wrap; margin-top:4px; }
    .kw-ptag { font-size:7px; padding:1px 5px; border-radius:2px; font-weight:600; display:inline-flex; align-items:center; gap:3px; }
    .kw-ptag .kw-ptag-dot { width:4px; height:4px; border-radius:50%; }
    .kw-ptag-sikayetvar { background:#FEE2E2; color:#991B1B; }
    .kw-ptag-sikayetvar .kw-ptag-dot { background:#DC2626; }
    .kw-ptag-google { background:#DBEAFE; color:#1E40AF; }
    .kw-ptag-google .kw-ptag-dot { background:#2563EB; }
    .kw-ptag-instagram { background:#FCE7F3; color:#9D174D; }
    .kw-ptag-instagram .kw-ptag-dot { background:#EC4899; }
    .kw-ptag-x { background:#F3F4F6; color:#374151; }
    .kw-ptag-x .kw-ptag-dot { background:#1F2937; }
    .kw-ptag-facebook { background:#EFF6FF; color:#1E3A8A; }
    .kw-ptag-facebook .kw-ptag-dot { background:#3B82F6; }


    /* ===== KARŞILAŞTIRMA — AŞAĞI AÇILAN PANEL ===== */
    .compare-custom-dates { display:none; gap:8px; padding:12px 16px; background:var(--bg-card); border:1px solid var(--border); border-top:none; border-radius:0 0 4px 4px; flex-wrap:wrap; align-items:center; width:100%; }
    .compare-custom-dates.show { display:flex; }
    .compare-period { display:flex; align-items:center; gap:4px; padding:4px 8px; background:var(--bg-elevated); border:1px solid var(--border); border-radius:3px; }
    .compare-period-label { font-size:8px; font-weight:700; color:white; padding:2px 6px; border-radius:2px; }
    .compare-period-label.a { background:var(--accent-primary); }
    .compare-period-label.b { background:#D97706; }
    .compare-apply-btn { padding:5px 12px; background:var(--accent-primary); color:white; border:none; border-radius:3px; font-size:9px; font-weight:700; cursor:pointer; font-family:inherit; }
    .compare-result { display:none; padding:16px 20px; background:var(--bg-card); border:1px solid var(--border); border-top:2px solid var(--accent-primary); border-radius:0 0 6px 6px; font-size:10px; width:100%; margin-bottom:14px; box-shadow:0 2px 8px rgba(0,0,0,0.04); }
    .compare-result.show { display:block; }
    .compare-result-period { font-size:9px; font-weight:700; padding:2px 8px; border-radius:3px; display:inline-block; }
    .compare-result-period.a { background:#EDF2FA; color:var(--accent-primary); }
    .compare-result-period.b { background:#FEF3C7; color:#D97706; }
    .compare-result-arrow { font-size:14px; color:var(--text-muted); margin:0 4px; }
    .compare-result-delta { font-size:11px; font-weight:600; line-height:1.6; display:block; margin-top:8px; color:var(--text-primary); }
    .compare-result-delta.up { color:#059669; }
    .compare-result-delta.down { color:#DC2626; }
    /* SQL karşılaştırma tablosu — ds-table stiliyle uyumlu */
    .compare-wrap { background:var(--bg-card); border:1px solid var(--border); border-radius:3px; overflow:hidden; margin-top:8px; }
    .compare-wrap-header { display:flex; justify-content:space-between; align-items:center; padding:12px 18px; border-bottom:1px solid var(--border); }
    .compare-wrap-title { font-size:13px; font-weight:700; color:var(--text-primary); }
    .compare-sql-table { width:100%; border-collapse:collapse; font-size:11px; }
    .compare-sql-table th { padding:10px 12px; font-size:9px; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.5px; text-align:center; background:var(--bg-elevated); border-bottom:1px solid var(--border); }
    .compare-sql-table th:first-child { text-align:left; padding-left:18px; }
    .compare-sql-table td { padding:8px 12px; text-align:center; border-bottom:1px solid var(--border); font-weight:600; color:var(--text-secondary); }
    .compare-sql-table td:first-child { text-align:left; font-weight:600; color:var(--text-primary); padding-left:18px; }
    .compare-sql-table tr:last-child td { border-bottom:none; }
    .compare-sql-table tr:hover td { background:rgba(0,57,158,0.02); }
    .compare-sql-table .val-up { color:#059669; font-weight:700; }
    .compare-sql-table .val-down { color:#DC2626; font-weight:700; }
    .compare-sql-table .val-neutral { color:var(--text-muted); }
    .compare-ai-btn { margin:12px 18px; padding:8px 16px; background:var(--accent-primary); color:white; border:none; border-radius:3px; font-size:10px; font-weight:600; cursor:pointer; font-family:inherit; transition:all 0.15s; }
    .compare-ai-btn:hover { background:var(--blue-600); }


    /* ===== SABAH BRİFİNG ===== */
    .briefing-block { background:var(--bg-card); border:1px solid var(--border); border-radius:6px; padding:20px 24px; margin-bottom:16px; }
    .briefing-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
    .briefing-header-left { display:flex; align-items:center; gap:10px; }
    .briefing-icon { width:36px; height:36px; background:linear-gradient(135deg, #3B82F6, #6366F1); border-radius:8px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
    .briefing-icon .i { width:18px; height:18px; color:white; }
    .briefing-title { font-size:14px; font-weight:800; color:var(--text-primary); }
    .briefing-time { font-size:9px; color:var(--text-muted); margin-top:1px; }
    .briefing-items { display:flex; flex-direction:column; gap:10px; }
    .briefing-item { display:flex; gap:12px; padding:12px 14px; background:var(--bg-elevated); border-radius:6px; border-left:3px solid transparent; transition:all 0.15s; cursor:pointer; }
    .briefing-item:hover { background:var(--bg-card); box-shadow:0 2px 8px rgba(0,0,0,0.04); transform:translateX(2px); }
    .briefing-item.sector { border-left-color:#6366F1; }
    .briefing-item.competitor { border-left-color:#D97706; }
    .briefing-item.regulation { border-left-color:#DC2626; }
    .briefing-item.trend { border-left-color:#10B981; }
    .briefing-item-type { font-size:7px; font-weight:800; text-transform:uppercase; letter-spacing:0.8px; margin-bottom:3px; }
    .briefing-item.sector .briefing-item-type { color:#6366F1; }
    .briefing-item.competitor .briefing-item-type { color:#D97706; }
    .briefing-item.regulation .briefing-item-type { color:#DC2626; }
    .briefing-item.trend .briefing-item-type { color:#10B981; }
    .briefing-item-text { font-size:11px; font-weight:600; color:var(--text-primary); line-height:1.5; }
    .briefing-item-meta { font-size:9px; color:var(--text-muted); margin-top:3px; display:flex; align-items:center; gap:8px; }
    .briefing-item-source { padding:1px 6px; background:var(--bg-card); border:1px solid var(--border); border-radius:2px; font-size:8px; font-weight:600; }
    .briefing-item-relevance { font-size:8px; font-weight:700; padding:1px 6px; border-radius:2px; }
    .briefing-item-relevance.high { background:#FEE2E2; color:#DC2626; }
    .briefing-item-relevance.medium { background:#FEF3C7; color:#D97706; }
    .briefing-item-relevance.low { background:#D1FAE5; color:#059669; }
    .briefing-upgrade { display:flex; align-items:center; gap:10px; margin-top:12px; padding:10px 14px; background:linear-gradient(135deg, rgba(99,102,241,0.05), rgba(139,92,246,0.05)); border:1px dashed rgba(99,102,241,0.25); border-radius:6px; cursor:pointer; transition:all 0.15s; }
    .briefing-upgrade:hover { border-style:solid; background:linear-gradient(135deg, rgba(99,102,241,0.1), rgba(139,92,246,0.1)); }
    .briefing-upgrade-text { font-size:10px; color:#6366F1; font-weight:600; }
    .briefing-upgrade-badge { font-size:8px; font-weight:700; padding:2px 8px; background:#6366F1; color:white; border-radius:3px; }


    /* ===== DEEP SEARCH PANEL ===== */
    .kw-card { cursor:pointer; position:relative; }
    .kw-card::after { content:'Deep Search'; position:absolute; top:8px; right:8px; font-size:7px; font-weight:700; color:var(--text-muted); opacity:0; transition:opacity 0.15s; background:var(--bg-card); padding:2px 6px; border-radius:2px; border:1px solid var(--border); }
    .kw-card:hover::after { opacity:1; }

    .deep-search-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.4); z-index:500; backdrop-filter:blur(2px); }
    .deep-search-overlay.show { display:flex; align-items:center; justify-content:center; }
    .deep-search-panel { width:720px; max-height:85vh; background:var(--bg-card); border-radius:10px; box-shadow:0 20px 60px rgba(0,0,0,0.2); overflow-y:auto; position:relative; }
    .ds-panel-header { padding:24px 28px 16px; border-bottom:1px solid var(--border); position:sticky; top:0; background:var(--bg-card); z-index:2; }
    .ds-panel-close { position:absolute; top:16px; right:20px; background:none; border:none; font-size:18px; cursor:pointer; color:var(--text-muted); padding:4px 8px; border-radius:4px; }
    .ds-panel-close:hover { background:var(--bg-elevated); color:var(--text-primary); }
    .ds-panel-keyword { font-size:20px; font-weight:800; color:var(--text-primary); display:flex; align-items:center; gap:10px; }
    .ds-panel-keyword .ds-risk-badge { font-size:9px; padding:3px 10px; border-radius:4px; font-weight:700; }
    .ds-panel-keyword .ds-risk-badge.critical { background:#DC2626; color:white; }
    .ds-panel-keyword .ds-risk-badge.high { background:#D97706; color:white; }
    .ds-panel-keyword .ds-risk-badge.opportunity { background:#059669; color:white; }
    .ds-panel-meta { font-size:10px; color:var(--text-muted); margin-top:4px; }
    .ds-panel-body { padding:20px 28px 28px; }

    /* Platform breakdown */
    .ds-platform-strip { display:flex; gap:8px; margin-bottom:20px; flex-wrap:wrap; }
    .ds-platform-card { flex:1; min-width:110px; padding:12px; background:var(--bg-elevated); border-radius:6px; text-align:center; border:1px solid var(--border); }
    .ds-platform-name { font-size:9px; font-weight:700; color:var(--text-secondary); margin-bottom:4px; }
    .ds-platform-count { font-size:18px; font-weight:900; color:var(--text-primary); }
    .ds-platform-sentiment { font-size:9px; font-weight:700; margin-top:2px; }

    /* Live links */
    .ds-section-title { font-size:11px; font-weight:800; color:var(--text-primary); margin-bottom:10px; display:flex; align-items:center; gap:6px; }
    .ds-section-title .i { width:14px; height:14px; color:var(--accent-primary); }
    .ds-link-list { display:flex; flex-direction:column; gap:6px; margin-bottom:20px; }
    .ds-link-item { display:flex; align-items:flex-start; gap:10px; padding:10px 12px; background:var(--bg-elevated); border-radius:5px; border-left:3px solid var(--border); font-size:10px; transition:all 0.12s; }
    .ds-link-item:hover { background:var(--bg-card); box-shadow:0 1px 4px rgba(0,0,0,0.04); }
    .ds-link-item.risk-critical { border-left-color:#DC2626; }
    .ds-link-item.risk-high { border-left-color:#D97706; }
    .ds-link-item.risk-medium { border-left-color:#3B82F6; }
    .ds-link-item.risk-low { border-left-color:#10B981; }
    .ds-link-platform { font-size:8px; font-weight:700; padding:2px 6px; border-radius:2px; white-space:nowrap; flex-shrink:0; }
    .ds-link-url { font-size:10px; color:var(--accent-primary); font-weight:600; word-break:break-all; cursor:pointer; }
    .ds-link-url:hover { text-decoration:underline; }
    .ds-link-snippet { font-size:9px; color:var(--text-muted); margin-top:2px; line-height:1.4; }
    .ds-link-risk { font-size:8px; font-weight:700; padding:2px 6px; border-radius:2px; white-space:nowrap; margin-left:auto; flex-shrink:0; }
    .ds-link-risk.critical { background:#FEE2E2; color:#DC2626; }
    .ds-link-risk.high { background:#FEF3C7; color:#D97706; }
    .ds-link-risk.medium { background:#DBEAFE; color:#2563EB; }
    .ds-link-risk.low { background:#D1FAE5; color:#059669; }
    .ds-link-date { font-size:8px; color:var(--text-muted); white-space:nowrap; flex-shrink:0; }

    /* AI Action */
    .ds-ai-box { padding:16px; background:linear-gradient(135deg, #FFF7ED, #FFFBEB); border:1px solid #FDE68A; border-radius:6px; margin-bottom:20px; }
    .ds-ai-title { font-size:10px; font-weight:800; color:#92400E; margin-bottom:6px; display:flex; align-items:center; gap:6px; }
    .ds-ai-text { font-size:11px; color:#78350F; line-height:1.7; }
    .ds-ai-actions { display:flex; gap:6px; margin-top:10px; flex-wrap:wrap; }
    .ds-ai-action { font-size:9px; padding:4px 10px; background:white; border:1px solid #FDE68A; border-radius:3px; font-weight:600; color:#92400E; cursor:pointer; }
    .ds-ai-action:hover { background:#FEF3C7; }

    /* Entity breakdown */
    .ds-entity-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:20px; }
    .ds-entity-card { padding:10px; background:var(--bg-elevated); border-radius:4px; text-align:center; border:1px solid var(--border); }
    .ds-entity-name { font-size:10px; font-weight:700; color:var(--text-primary); }
    .ds-entity-count { font-size:16px; font-weight:900; color:var(--accent-primary); margin:4px 0; }
    .ds-entity-label { font-size:8px; color:var(--text-muted); }


    /* ===== SM RİSK & LİNK ===== */
    .sm-risk-strip { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin-bottom:16px; }
    .sm-risk-card { padding:12px; background:var(--bg-elevated); border-radius:5px; border-top:3px solid; text-align:center; }
    .sm-risk-platform { font-size:9px; font-weight:700; color:var(--text-secondary); margin-bottom:4px; }
    .sm-risk-score { font-size:22px; font-weight:900; }
    .sm-risk-label { font-size:8px; font-weight:600; color:var(--text-muted); text-transform:uppercase; margin-top:2px; }
    .sm-risk-bar { height:4px; background:var(--bg-elevated); border-radius:2px; margin-top:6px; overflow:hidden; }
    .sm-risk-fill { height:100%; border-radius:2px; transition:width 0.5s; }

    .sm-comments-section { margin-top:16px; }
    .sm-comment-item { display:flex; gap:10px; padding:12px; background:var(--bg-elevated); border-radius:5px; margin-bottom:8px; border-left:3px solid var(--border); transition:all 0.12s; }
    .sm-comment-item:hover { background:var(--bg-card); box-shadow:0 1px 4px rgba(0,0,0,0.04); }
    .sm-comment-item.risk-high { border-left-color:#DC2626; }
    .sm-comment-item.risk-medium { border-left-color:#D97706; }
    .sm-comment-item.risk-low { border-left-color:#10B981; }
    .sm-comment-platform { font-size:8px; font-weight:700; padding:2px 6px; border-radius:2px; white-space:nowrap; }
    .sm-comment-text { font-size:10px; color:var(--text-primary); line-height:1.5; flex:1; }
    .sm-comment-link { font-size:9px; color:var(--accent-primary); font-weight:600; margin-top:3px; cursor:pointer; display:inline-flex; align-items:center; gap:3px; }
    .sm-comment-link:hover { text-decoration:underline; }
    .sm-comment-risk { font-size:8px; font-weight:700; padding:2px 6px; border-radius:2px; white-space:nowrap; flex-shrink:0; }
    .sm-comment-date { font-size:8px; color:var(--text-muted); margin-top:3px; }


    /* ===== RAKİBİMİ İZLE ===== */
    .rival-header-strip { display:flex; align-items:center; gap:10px; margin-bottom:16px; }
    .rival-pkg-info { font-size:9px; padding:3px 10px; background:#EDE9FE; color:#6366F1; border-radius:4px; font-weight:700; margin-left:auto; }
    .rival-tabs { display:flex; gap:4px; margin-bottom:16px; }
    .rival-tab { padding:6px 14px; border:1px solid var(--border); border-radius:4px; font-size:10px; font-weight:600; color:var(--text-secondary); cursor:pointer; background:var(--bg-card); transition:all 0.12s; font-family:inherit; }
    .rival-tab:hover { border-color:var(--accent-primary); color:var(--accent-primary); }
    .rival-tab.active { background:var(--accent-primary); color:white; border-color:var(--accent-primary); }
    .rival-overview { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin-bottom:20px; }
    .rival-kpi { padding:12px; background:var(--bg-elevated); border-radius:5px; text-align:center; border:1px solid var(--border); }
    .rival-kpi-value { font-size:20px; font-weight:900; color:var(--text-primary); }
    .rival-kpi-label { font-size:8px; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.5px; margin-top:2px; }
    .rival-kpi-change { font-size:9px; font-weight:700; margin-top:4px; }
    .rival-kpi-change.up { color:#059669; }
    .rival-kpi-change.down { color:#DC2626; }

    .rival-detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
    .rival-card { padding:16px; background:var(--bg-card); border:1px solid var(--border); border-radius:6px; }
    .rival-card-title { font-size:11px; font-weight:700; color:var(--text-primary); margin-bottom:10px; display:flex; align-items:center; gap:6px; }
    .rival-card-title .i { width:14px; height:14px; color:var(--accent-primary); }

    .rival-activity-item { display:flex; gap:8px; padding:8px 0; border-bottom:1px solid var(--bg-elevated); font-size:10px; }
    .rival-activity-item:last-child { border-bottom:none; }
    .rival-activity-platform { font-size:7px; font-weight:700; padding:2px 5px; border-radius:2px; flex-shrink:0; margin-top:2px; }
    .rival-activity-text { color:var(--text-primary); line-height:1.5; flex:1; }
    .rival-activity-date { font-size:8px; color:var(--text-muted); flex-shrink:0; }

    .rival-topic-bar { display:flex; align-items:center; gap:8px; margin-bottom:6px; }
    .rival-topic-name { font-size:10px; font-weight:600; color:var(--text-primary); width:100px; flex-shrink:0; }
    .rival-topic-track { flex:1; height:6px; background:var(--bg-elevated); border-radius:3px; overflow:hidden; }
    .rival-topic-fill { height:100%; border-radius:3px; }
    .rival-topic-count { font-size:9px; font-weight:700; color:var(--text-secondary); width:40px; text-align:right; flex-shrink:0; }

    .rival-platform-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:6px; }
    .rival-platform-cell { padding:8px; background:var(--bg-elevated); border-radius:4px; text-align:center; border:1px solid var(--border); }
    .rival-platform-name { font-size:8px; font-weight:700; color:var(--text-muted); }
    .rival-platform-val { font-size:14px; font-weight:800; color:var(--text-primary); margin:2px 0; }
    .rival-platform-change { font-size:8px; font-weight:700; }

    .rival-compare-row { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid var(--bg-elevated); }
    .rival-compare-row:last-child { border-bottom:none; }
    .rival-compare-metric { font-size:10px; font-weight:600; color:var(--text-primary); width:120px; flex-shrink:0; }
    .rival-compare-bar { flex:1; display:flex; align-items:center; gap:6px; }
    .rival-compare-you { height:8px; background:var(--accent-primary); border-radius:2px; }
    .rival-compare-them { height:8px; background:#D97706; border-radius:2px; opacity:0.7; }
    .rival-compare-val { font-size:9px; font-weight:700; width:50px; text-align:right; }


    /* ===== BÖLGESEL ANALİZ ===== */
    .ra-wizard { max-width:680px; margin:0 auto; }
    .ra-step { display:none; }
    .ra-step.active { display:block; }
    .ra-step-indicator { display:flex; align-items:center; gap:0; margin-bottom:28px; }
    .ra-step-dot { width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:800; border:2px solid var(--border); color:var(--text-muted); background:var(--bg-card); transition:all 0.2s; flex-shrink:0; }
    .ra-step-dot.done { background:var(--accent-primary); border-color:var(--accent-primary); color:white; }
    .ra-step-dot.current { border-color:var(--accent-primary); color:var(--accent-primary); box-shadow:0 0 0 4px rgba(0,57,158,0.1); }
    .ra-step-line { flex:1; height:2px; background:var(--border); }
    .ra-step-line.done { background:var(--accent-primary); }
    .ra-step-label { font-size:8px; color:var(--text-muted); text-align:center; margin-top:4px; }

    .ra-title { font-size:20px; font-weight:800; color:var(--text-primary); margin-bottom:4px; }
    .ra-subtitle { font-size:11px; color:var(--text-muted); margin-bottom:20px; }

    .ra-location-input { width:100%; padding:14px 18px; border:2px solid var(--border); border-radius:8px; font-size:14px; font-family:inherit; color:var(--text-primary); background:var(--bg-card); transition:border-color 0.15s; }
    .ra-location-input:focus { border-color:var(--accent-primary); outline:none; box-shadow:0 0 0 4px rgba(0,57,158,0.08); }
    .ra-location-suggestions { margin-top:8px; }
    .ra-location-sug { padding:10px 14px; font-size:11px; color:var(--text-secondary); cursor:pointer; border-radius:4px; transition:all 0.1s; display:flex; align-items:center; gap:8px; }
    .ra-location-sug:hover { background:var(--bg-elevated); color:var(--accent-primary); }
    .ra-location-sug .i { width:14px; height:14px; color:var(--text-muted); }

    .ra-question-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
    .ra-q-card { padding:16px; border:2px solid var(--border); border-radius:8px; cursor:pointer; transition:all 0.15s; text-align:center; background:var(--bg-card); }
    .ra-q-card:hover { border-color:var(--accent-primary); transform:translateY(-2px); box-shadow:0 4px 12px rgba(0,0,0,0.04); }
    .ra-q-card.selected { border-color:var(--accent-primary); background:#EDF2FA; }
    .ra-q-card.disabled { opacity:0.4; pointer-events:none; }
    .ra-q-icon { font-size:24px; margin-bottom:8px; }
    .ra-q-title { font-size:11px; font-weight:700; color:var(--text-primary); margin-bottom:2px; }
    .ra-q-desc { font-size:9px; color:var(--text-muted); line-height:1.4; }
    .ra-q-count { font-size:9px; color:var(--accent-primary); font-weight:700; margin-top:20px; }

    .ra-btn { padding:12px 28px; border:none; border-radius:6px; font-size:12px; font-weight:700; cursor:pointer; font-family:inherit; transition:all 0.15s; }
    .ra-btn-primary { background:var(--accent-primary); color:white; }
    .ra-btn-primary:hover { background:#000B68; transform:translateY(-1px); }
    .ra-btn-primary:disabled { opacity:0.4; cursor:default; transform:none; }
    .ra-btn-outline { background:transparent; color:var(--text-secondary); border:1px solid var(--border); }
    .ra-btn-outline:hover { border-color:var(--accent-primary); color:var(--accent-primary); }
    .ra-btn-row { display:flex; justify-content:space-between; margin-top:24px; }

    /* RESULTS */
    .ra-results { max-width:100%; }
    .ra-result-header { padding:24px; background:linear-gradient(135deg, #111D52, #0A1238); border-radius:8px; margin-bottom:20px; color:white; position:relative; overflow:hidden; }
    .ra-result-header::before { content:''; position:absolute; top:-40%; right:-10%; width:200px; height:200px; background:radial-gradient(circle, rgba(99,102,241,0.1), transparent 70%); }
    .ra-result-location { font-size:22px; font-weight:800; }
    .ra-result-meta { font-size:10px; color:rgba(255,255,255,0.5); margin-top:4px; }
    .ra-result-scores { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:16px; }
    .ra-score-card { padding:14px; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.08); border-radius:6px; text-align:center; }
    .ra-score-value { font-size:24px; font-weight:900; }
    .ra-score-label { font-size:8px; color:rgba(255,255,255,0.5); text-transform:uppercase; letter-spacing:0.5px; margin-top:2px; }

    .ra-answer-card { background:var(--bg-card); border:1px solid var(--border); border-radius:6px; padding:20px; margin-bottom:14px; }
    .ra-answer-title { font-size:13px; font-weight:800; color:var(--text-primary); margin-bottom:4px; display:flex; align-items:center; gap:8px; }
    .ra-answer-subtitle { font-size:10px; color:var(--text-muted); margin-bottom:14px; }
    .ra-data-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:14px; }
    .ra-data-item { padding:10px; background:var(--bg-elevated); border-radius:4px; text-align:center; }
    .ra-data-value { font-size:16px; font-weight:900; color:var(--text-primary); }
    .ra-data-label { font-size:8px; color:var(--text-muted); margin-top:2px; }
    .ra-data-source { font-size:7px; color:var(--accent-primary); margin-top:3px; font-weight:600; }

    .ra-insight { padding:14px; background:linear-gradient(135deg, #FFF7ED, #FFFBEB); border:1px solid #FDE68A; border-radius:6px; margin-top:12px; }
    .ra-insight-title { font-size:10px; font-weight:700; color:#92400E; margin-bottom:4px; }
    .ra-insight-text { font-size:10px; color:#78350F; line-height:1.6; }

    .ra-compare-btn { display:flex; align-items:center; justify-content:center; gap:8px; padding:14px; background:var(--bg-elevated); border:2px dashed var(--border); border-radius:8px; cursor:pointer; transition:all 0.15s; margin-top:20px; }
    .ra-compare-btn:hover { border-color:var(--accent-primary); background:#EDF2FA; }
    .ra-compare-btn-text { font-size:12px; font-weight:700; color:var(--text-secondary); }

    @keyframes spin { to { transform: rotate(360deg); } }

    /* ===== AKSİYON OLUŞTUR BUTONLARI ===== */
    .create-action-btn { display:inline-flex; align-items:center; gap:4px; padding:5px 12px; background:linear-gradient(135deg, #00399E, #000B68); color:white; border:none; border-radius:4px; font-size:9px; font-weight:700; cursor:pointer; font-family:inherit; transition:all 0.15s; white-space:nowrap; }
    .create-action-btn:hover { transform:translateY(-1px); box-shadow:0 3px 10px rgba(0,57,158,0.25); }
    .create-action-btn .i { width:11px; height:11px; }

    /* ===== TASK MANAGER ===== */
    .task-summary-strip { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin-bottom:20px; }
    .task-summary-card { padding:14px; background:var(--bg-elevated); border-radius:6px; text-align:center; border-top:3px solid var(--border); cursor:pointer; transition:all 0.12s; }
    .task-summary-card:hover { background:var(--bg-card); box-shadow:0 2px 8px rgba(0,0,0,0.04); }
    .task-summary-card.active { border-top-color:var(--accent-primary); background:var(--bg-card); }
    .task-summary-value { font-size:22px; font-weight:900; color:var(--text-primary); }
    .task-summary-label { font-size:9px; color:var(--text-muted); margin-top:2px; }

    .task-filters { display:flex; align-items:center; gap:8px; margin-bottom:14px; flex-wrap:wrap; }
    .task-filter-select { padding:5px 10px; border:1px solid var(--border); border-radius:4px; font-size:10px; font-family:inherit; color:var(--text-primary); background:var(--bg-card); cursor:pointer; }

    .task-table { width:100%; border-collapse:collapse; }
    .task-table th { padding:10px 12px; font-size:9px; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.5px; text-align:left; border-bottom:2px solid var(--border); background:var(--bg-elevated); }
    .task-table td { padding:10px 12px; font-size:10px; border-bottom:1px solid var(--bg-elevated); vertical-align:middle; }
    .task-table tr:hover { background:rgba(0,57,158,0.02); }

    .task-check { width:16px; height:16px; border:2px solid var(--border); border-radius:3px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.15s; flex-shrink:0; }
    .task-check.done { background:var(--green-500); border-color:var(--green-500); }
    .task-check.done::after { content:'✓'; color:white; font-size:10px; font-weight:800; }

    .task-name { font-weight:600; color:var(--text-primary); }
    .task-source-badge { font-size:7px; padding:2px 6px; border-radius:2px; font-weight:700; margin-left:6px; }
    .task-priority-dot { width:8px; height:8px; border-radius:50%; display:inline-block; }
    .task-priority-dot.p1 { background:#DC2626; }
    .task-priority-dot.p2 { background:#D97706; }
    .task-priority-dot.p3 { background:#3B82F6; }

    .task-status { font-size:8px; padding:3px 8px; border-radius:3px; font-weight:700; display:inline-flex; align-items:center; gap:4px; }
    .task-status.pending { background:#FEF3C7; color:#D97706; }
    .task-status.progress { background:#DBEAFE; color:#2563EB; }
    .task-status.done { background:#D1FAE5; color:#059669; }
    .task-status.failed { background:#FEE2E2; color:#DC2626; }

    .task-verify { font-size:8px; padding:3px 8px; border-radius:3px; font-weight:700; display:inline-flex; align-items:center; gap:4px; }
    .task-verify.improved { background:#D1FAE5; color:#059669; }
    .task-verify.no-change { background:#FEF3C7; color:#D97706; }
    .task-verify.worsened { background:#FEE2E2; color:#DC2626; }
    .task-verify.waiting { background:var(--bg-elevated); color:var(--text-muted); }

    .task-deadline { font-size:9px; color:var(--text-muted); }
    .task-deadline.overdue { color:#DC2626; font-weight:700; }

    .task-progress-bar { width:60px; height:5px; background:var(--bg-elevated); border-radius:3px; overflow:hidden; display:inline-block; vertical-align:middle; margin-right:6px; }
    .task-progress-fill { height:100%; border-radius:3px; }


    /* ===== EKİP & ROL SİSTEMİ ===== */
    .team-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; }
    .team-role-tabs { display:flex; gap:6px; }
    .team-role-tab { padding:6px 14px; border:1px solid var(--border); border-radius:4px; font-size:10px; font-weight:600; cursor:pointer; background:var(--bg-card); color:var(--text-secondary); font-family:inherit; transition:all 0.12s; }
    .team-role-tab:hover { border-color:var(--accent-primary); }
    .team-role-tab.active { background:var(--accent-primary); color:white; border-color:var(--accent-primary); }

    .team-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:24px; }
    .team-card { padding:16px; background:var(--bg-card); border:1px solid var(--border); border-radius:8px; text-align:center; position:relative; transition:all 0.15s; }
    .team-card:hover { box-shadow:0 4px 12px rgba(0,0,0,0.05); }
    .team-avatar { width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:16px; font-weight:800; color:white; margin:0 auto 10px; }
    .team-name { font-size:12px; font-weight:700; color:var(--text-primary); }
    .team-role-badge { font-size:8px; padding:2px 8px; border-radius:3px; font-weight:700; margin-top:4px; display:inline-block; }
    .team-stats { display:flex; justify-content:center; gap:14px; margin-top:10px; font-size:9px; color:var(--text-muted); }
    .team-stat-value { font-weight:800; color:var(--text-primary); }
    .team-online { position:absolute; top:12px; right:12px; width:8px; height:8px; border-radius:50%; border:2px solid var(--bg-card); }
    .team-online.on { background:#10B981; }
    .team-online.off { background:var(--border); }

    .team-assign-modal { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.4); z-index:500; backdrop-filter:blur(2px); }
    .team-assign-modal.show { display:flex; align-items:center; justify-content:center; }
    .team-assign-panel { width:480px; max-height:80vh; background:var(--bg-card); border-radius:10px; box-shadow:0 20px 60px rgba(0,0,0,0.2); overflow-y:auto; padding:24px; }
    .team-assign-title { font-size:16px; font-weight:800; color:var(--text-primary); margin-bottom:4px; }
    .team-assign-sub { font-size:10px; color:var(--text-muted); margin-bottom:16px; }
    .team-assign-list { display:flex; flex-direction:column; gap:6px; }
    .team-assign-row { display:flex; align-items:center; gap:10px; padding:10px 12px; background:var(--bg-elevated); border-radius:6px; cursor:pointer; transition:all 0.12s; border:2px solid transparent; }
    .team-assign-row:hover { background:var(--bg-card); border-color:var(--accent-primary); }
    .team-assign-row.selected { border-color:var(--accent-primary); background:#EDF2FA; }
    .team-assign-avatar { width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:800; color:white; flex-shrink:0; }
    .team-assign-info { flex:1; }
    .team-assign-name { font-size:11px; font-weight:700; color:var(--text-primary); }
    .team-assign-role { font-size:9px; color:var(--text-muted); }
    .team-assign-ai { font-size:8px; padding:2px 6px; background:#FEF3C7; color:#D97706; border-radius:2px; font-weight:700; }

    /* Task table assignee */
    .task-assignee { display:flex; align-items:center; gap:4px; }
    .task-assignee-dot { width:20px; height:20px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:8px; font-weight:800; color:white; flex-shrink:0; }
    .task-assignee-name { font-size:9px; font-weight:600; color:var(--text-secondary); }


    /* ===== UZMAN EKLE FORM ===== */
    .add-expert-modal { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.4); z-index:500; backdrop-filter:blur(2px); }
    .add-expert-modal.show { display:flex; align-items:center; justify-content:center; }
    .add-expert-panel { width:520px; background:var(--bg-card); border-radius:10px; box-shadow:0 20px 60px rgba(0,0,0,0.2); padding:28px; max-height:85vh; overflow-y:auto; }
    .ae-title { font-size:16px; font-weight:800; color:var(--text-primary); margin-bottom:4px; }
    .ae-sub { font-size:10px; color:var(--text-muted); margin-bottom:20px; }
    .ae-field { margin-bottom:14px; }
    .ae-label { font-size:10px; font-weight:700; color:var(--text-secondary); margin-bottom:4px; display:block; }
    .ae-input { width:100%; padding:10px 14px; border:1px solid var(--border); border-radius:6px; font-size:12px; font-family:inherit; color:var(--text-primary); background:var(--bg-card); transition:border-color 0.15s; }
    .ae-input:focus { border-color:var(--accent-primary); outline:none; }
    .ae-select { width:100%; padding:10px 14px; border:1px solid var(--border); border-radius:6px; font-size:12px; font-family:inherit; color:var(--text-primary); background:var(--bg-card); cursor:pointer; }
    .ae-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
    .ae-skill-chips { display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
    .ae-skill { padding:4px 10px; border:1px solid var(--border); border-radius:14px; font-size:9px; font-weight:600; color:var(--text-secondary); cursor:pointer; transition:all 0.12s; }
    .ae-skill:hover { border-color:var(--accent-primary); }
    .ae-skill.selected { background:var(--accent-primary); color:white; border-color:var(--accent-primary); }

    /* ===== NÖBET SİSTEMİ ===== */
    .oncall-section { margin-top:20px; }
    .oncall-week { display:grid; grid-template-columns:repeat(7,1fr); gap:6px; margin-bottom:14px; }
    .oncall-day { padding:10px 6px; background:var(--bg-elevated); border:1px solid var(--border); border-radius:6px; text-align:center; min-height:80px; transition:all 0.12s; }
    .oncall-day.today { border-color:var(--accent-primary); background:rgba(0,57,158,0.04); }
    .oncall-day-name { font-size:8px; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.5px; margin-bottom:6px; }
    .oncall-day-date { font-size:9px; color:var(--text-muted); margin-bottom:8px; }
    .oncall-person { display:flex; flex-direction:column; align-items:center; gap:4px; }
    .oncall-avatar-sm { width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:9px; font-weight:800; color:white; }
    .oncall-name-sm { font-size:8px; font-weight:600; color:var(--text-primary); }
    .oncall-shift { font-size:7px; padding:1px 5px; border-radius:2px; font-weight:600; }
    .oncall-shift.night { background:#312E81; color:#C7D2FE; }
    .oncall-shift.day { background:#FEF3C7; color:#D97706; }

    /* ===== TASK REASSIGN ===== */
    .task-reassign-btn { background:none; border:1px dashed var(--border); border-radius:3px; padding:2px 6px; font-size:7px; font-weight:700; color:var(--text-muted); cursor:pointer; font-family:inherit; margin-left:4px; transition:all 0.12s; }
    .task-reassign-btn:hover { border-color:var(--accent-primary); color:var(--accent-primary); border-style:solid; }


    .task-reassign { padding:2px 6px; background:transparent; border:1px solid var(--border); border-radius:2px; font-size:7px; font-weight:700; color:var(--text-muted); cursor:pointer; font-family:inherit; transition:all 0.12s; margin-left:4px; }
    .task-reassign:hover { border-color:var(--accent-primary); color:var(--accent-primary); background:#EDF2FA; }


    /* ===== AI AKSİYON KUTUSU (tüm modüllerde standart) ===== */
    .ai-action-box { margin-top:16px; padding:18px; background:linear-gradient(135deg, #F0F4FF, #F8FAFF); border:1px solid #D6E0F0; border-radius:8px; position:relative; }
    .ai-action-box::before { content:'AI'; position:absolute; top:10px; right:14px; font-size:8px; font-weight:900; color:var(--accent-primary); background:#EDF2FA; padding:2px 8px; border-radius:3px; letter-spacing:1px; }
    .ai-action-header { display:flex; align-items:center; gap:8px; margin-bottom:10px; }
    .ai-action-icon { width:28px; height:28px; border-radius:6px; background:var(--accent-primary); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
    .ai-action-icon .i { width:14px; height:14px; color:white; }
    .ai-action-title { font-size:11px; font-weight:800; color:var(--text-primary); }
    .ai-action-subtitle { font-size:9px; color:var(--text-muted); }
    .ai-action-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:12px; }
    .ai-action-item { padding:10px 12px; background:white; border:1px solid var(--border); border-radius:5px; }
    .ai-action-item-label { font-size:8px; font-weight:700; color:var(--accent-primary); text-transform:uppercase; letter-spacing:0.5px; margin-bottom:3px; }
    .ai-action-item-text { font-size:10px; color:var(--text-primary); line-height:1.5; }
    .ai-action-impact { padding:8px 12px; background:white; border:1px solid #D1FAE5; border-radius:5px; display:flex; align-items:center; gap:8px; margin-bottom:10px; }
    .ai-action-impact-icon { font-size:14px; }
    .ai-action-impact-text { font-size:10px; color:#059669; font-weight:600; }
    .ai-action-links { display:flex; gap:6px; flex-wrap:wrap; }
    .ai-action-link { font-size:9px; padding:4px 10px; background:white; border:1px solid var(--border); border-radius:3px; color:var(--accent-primary); font-weight:600; cursor:pointer; transition:all 0.12s; font-family:inherit; }
    .ai-action-link:hover { background:var(--accent-primary); color:white; border-color:var(--accent-primary); }

    /* ===== MODULE TAB SİSTEMİ ===== */
    .module-tabs { display:flex; gap:0; border-bottom:2px solid var(--bg-elevated); margin-bottom:16px; }
    .module-tab { padding:8px 18px; font-size:11px; font-weight:600; color:var(--text-muted); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-2px; transition:all 0.12s; background:none; border-top:none; border-left:none; border-right:none; font-family:inherit; }
    .module-tab:hover { color:var(--text-primary); }
    .module-tab.active { color:var(--accent-primary); border-bottom-color:var(--accent-primary); font-weight:700; }
    .module-tab-content { display:none; }
    .module-tab-content.active { display:block; }


    /* ===== EMOTION WHEEL ===== */
    .emotion-wheel { display:flex; flex-direction:column; gap:6px; }
    .emotion-bar-row { display:flex; align-items:center; gap:8px; }
    .emotion-label { font-size:9px; font-weight:600; color:var(--text-secondary); width:70px; text-align:right; flex-shrink:0; }
    .emotion-track { flex:1; height:10px; background:var(--bg-elevated); border-radius:5px; overflow:hidden; }
    .emotion-fill { height:100%; border-radius:5px; transition:width 0.5s; }
    .emotion-pct { font-size:9px; font-weight:700; width:35px; flex-shrink:0; }

    /* ===== INTENT DISTRIBUTION ===== */
    .intent-grid { display:flex; flex-direction:column; gap:6px; }
    .intent-row { display:flex; align-items:center; gap:8px; }
    .intent-name { font-size:10px; font-weight:600; color:var(--text-primary); width:110px; flex-shrink:0; }
    .intent-track { flex:1; height:12px; background:var(--bg-elevated); border-radius:6px; overflow:hidden; }
    .intent-fill { height:100%; border-radius:6px; }
    .intent-pct { font-size:10px; font-weight:800; width:40px; flex-shrink:0; text-align:right; }
    .intent-alert { margin-top:10px; padding:10px 14px; background:#FEF2F2; border:1px solid #FECACA; border-radius:5px; font-size:10px; color:#991B1B; font-weight:600; display:flex; align-items:center; gap:6px; }

    /* ===== ASPECT × EMOTION HEATMAP ===== */
    .ae-matrix { width:100%; border-collapse:collapse; }
    .ae-matrix th { padding:8px; font-size:8px; font-weight:700; color:var(--text-muted); text-transform:uppercase; text-align:center; }
    .ae-matrix td { padding:6px; text-align:center; }
    .ae-cell { display:inline-block; width:28px; height:28px; border-radius:4px; line-height:28px; font-size:8px; font-weight:800; color:white; }
    .ae-insight { margin-top:8px; font-size:9px; color:var(--text-secondary); line-height:1.6; padding:8px; background:var(--bg-elevated); border-radius:4px; }

    /* ===== 4-CLUSTER PSYCHOLOGY ===== */
    .cluster-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
    .cluster-card { padding:18px; background:var(--bg-card); border:1px solid var(--border); border-radius:8px; border-left:4px solid; transition:all 0.15s; }
    .cluster-card:hover { box-shadow:0 4px 12px rgba(0,0,0,0.05); }
    .cluster-pct { font-size:24px; font-weight:900; margin-bottom:4px; }
    .cluster-name { font-size:13px; font-weight:700; color:var(--text-primary); margin-bottom:2px; }
    .cluster-desc { font-size:9px; color:var(--text-muted); margin-bottom:8px; line-height:1.4; }
    .cluster-strategy { font-size:10px; color:var(--text-primary); line-height:1.6; padding:10px; background:var(--bg-elevated); border-radius:4px; }
    .cluster-strategy strong { color:var(--accent-primary); }
    .cluster-detail-toggle { font-size:9px; color:var(--accent-primary); font-weight:600; cursor:pointer; margin-top:8px; display:inline-block; }

    /* ===== INTENT BADGE ===== */
    .intent-badge { font-size:7px; padding:2px 6px; border-radius:2px; font-weight:700; display:inline-flex; align-items:center; gap:3px; }
    .intent-badge.threat { background:#FEE2E2; color:#DC2626; }
    .intent-badge.solution { background:#DBEAFE; color:#2563EB; }
    .intent-badge.info { background:#FEF3C7; color:#D97706; }
    .intent-badge.anger { background:#FFE5E5; color:#991B1B; }
    .intent-badge.praise { background:#D1FAE5; color:#059669; }
    .intent-badge.escalation { background:#EDE9FE; color:#6366F1; }

    /* ===== CONFIDENCE INDICATOR ===== */
    .confidence-bar { display:inline-flex; align-items:center; gap:4px; font-size:8px; color:var(--text-muted); }
    .confidence-dots { display:flex; gap:2px; }
    .confidence-dot { width:5px; height:5px; border-radius:50%; background:var(--border); }
    .confidence-dot.filled { background:var(--accent-primary); }
    .confidence-dot.filled.high { background:#059669; }
    .confidence-dot.filled.medium { background:#D97706; }


    .task-p0 { background:linear-gradient(135deg,#FEF2F2,#FFF1F1) !important; border:2px solid #DC2626 !important; animation:p0pulse 2s ease-in-out infinite; }
    @keyframes p0pulse { 0%,100%{box-shadow:0 0 0 0 rgba(220,38,38,0.15);} 50%{box-shadow:0 0 0 8px rgba(220,38,38,0);} }
    .p0-badge { background:#DC2626; color:white; font-size:8px; padding:3px 10px; border-radius:3px; font-weight:800; letter-spacing:0.5px; }


    /* ===== PWA & MOBILE — iPhone 14 Pro (393px) COMPREHENSIVE ===== */
    
    /* Tablet breakpoint */
    @media (max-width: 768px) {
      /* Layout */
      .sidebar { display:none !important; }
      .main { margin-left:0 !important; padding:10px !important; padding-bottom:72px !important; }
      .org-switcher { display:none !important; }
      .preanaliz-banner { display:none !important; }
      .focus-back-btn { left:10px !important; top:6px !important; font-size:11px !important; }

      /* Top bar */
      .top-bar { flex-wrap:wrap; gap:6px; padding:10px !important; }
      .top-bar-left, .top-bar-right { width:100%; }
      .top-bar-right { justify-content:flex-start; flex-wrap:wrap; gap:4px; }

      /* ALL GRIDS → single or double column */
      .grid-2, .grid-3, .action-grid, .highlight-grid,
      .health-metrics, .health-3q, .segment-grid, .alert-grid,
      .roi-grid, .gap-compare, .ds-entity-grid, .pa-pkg-grid,
      .cluster-grid, .ai-action-grid { 
        grid-template-columns:1fr !important; 
      }
      .kpi-grid, .sube-ozet-stats, .kpi-targets, .ceo-target-grid { 
        grid-template-columns:repeat(2,1fr) !important; 
      }
      .kw-grid { grid-template-columns:1fr !important; }
      .today-steps { grid-template-columns:1fr 1fr !important; }
      .ceo-grid { grid-template-columns:1fr 1fr !important; }
      .sm-strip, .sm-analysis { grid-template-columns:1fr 1fr !important; }
      .sm-risk-strip { grid-template-columns:1fr 1fr !important; }
      .acc-grid { grid-template-columns:1fr !important; }
      .acc-panel { border-right:none !important; border-bottom:1px solid rgba(255,255,255,0.06); }
      .brand-health-grid { grid-template-columns:1fr !important; }
      .brand-health-section { padding:16px !important; }
      .compare-row { grid-template-columns:1fr !important; gap:4px; }
      .compare-header-card, .compare-insight-strip { flex-direction:column; }
      .briefing-items { grid-template-columns:1fr !important; }
      .team-grid, .yp-team-grid { grid-template-columns:1fr 1fr !important; }
      .task-summary-strip { grid-template-columns:repeat(3,1fr) !important; }

      /* Convo map */
      .convo-map-canvas { height:280px !important; }
      .bubble { transform:scale(0.7); }
      .ai-chat-panel { width:calc(100vw - 20px) !important; left:10px !important; right:10px !important; height:70vh; }

      /* Section headers */
      .section-header { flex-direction:column !important; align-items:flex-start !important; gap:6px; }
      .section-filters { width:100%; margin-top:6px; }
      .section-title { font-size:16px !important; }
      .section-tag { font-size:8px !important; }

      /* Date bars — hide compare on mobile */
      .module-date-bar { flex-wrap:wrap; gap:4px; }
      .module-date-compare-btn, .module-compare-select, 
      .compare-custom-dates, .compare-result,
      .date-compare-toggle, .date-compare-panel { display:none !important; }

      /* Tables — horizontal scroll */
      .task-table, .sov-sentiment-table, .ae-matrix { display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; }
      .task-table th, .task-table td { white-space:nowrap; padding:6px 8px !important; font-size:9px !important; }

      /* Cards */
      .card { padding:12px !important; }
      .card-header { flex-wrap:wrap; }

      /* SM Analysis platform cards */
      .sm-platform-card { padding:10px !important; }
      .sm-platform-score { font-size:18px !important; }

      /* AI action box */
      .ai-action-box { padding:14px !important; }
      .ai-action-links { flex-wrap:wrap; }
      .ai-action-link { flex:1; min-width:120px; text-align:center; }

      /* Today block */
      .today-block { padding:16px !important; }
      .today-header { gap:10px; }
      .today-title { font-size:18px !important; }
      .today-step { padding:12px !important; }
      .today-step-title { font-size:11px !important; }

      /* Briefing */
      .briefing-block { padding:14px !important; }

      /* Rival tabs */
      .rival-header-tabs { flex-wrap:wrap !important; gap:4px !important; }
      .rival-tab { padding:6px 10px !important; font-size:9px !important; }

      /* KPI cards */
      .kpi-card { padding:10px !important; }
      .kpi-value { font-size:20px !important; }

      /* Font sizes */
      .page-title { font-size:18px !important; }
      .section-desc { font-size:10px !important; }

      /* Touch targets */
      .btn, .top-btn, .create-action-btn, .ai-action-link, .task-reassign,
      .pf-chip, .module-tab, .team-role-tab { 
        min-height:36px !important; 
        -webkit-tap-highlight-color:transparent;
      }
      .pf-chip { padding:6px 12px !important; }

      /* Howto sections */
      .howto { margin:10px 0 !important; }

      /* Deep search overlay */
      .ds-overlay-panel { width:95vw !important; max-width:none !important; padding:16px !important; }

      /* Mobile bottom nav */
      .mobile-nav { display:flex !important; }
    }

    /* iPhone SE / smaller phones */
    @media (max-width: 400px) {
      .today-steps { grid-template-columns:1fr !important; }
      .sm-strip, .sm-analysis, .sm-risk-strip { grid-template-columns:1fr !important; }
      .kpi-grid, .sube-ozet-stats, .kpi-targets { grid-template-columns:1fr !important; }
      .team-grid, .yp-team-grid { grid-template-columns:1fr !important; }
      .task-summary-strip { grid-template-columns:repeat(2,1fr) !important; }
      .ceo-grid { grid-template-columns:1fr !important; }
    }

    @media (min-width: 769px) {
      .mobile-nav { display:none !important; }
    }

    /* Mobile bottom nav */
    .mobile-nav {
      position:fixed; bottom:0; left:0; right:0; height:56px; background:#111D52;
      display:none; align-items:center; justify-content:space-around; z-index:999;
      box-shadow:0 -2px 12px rgba(0,0,0,0.15); padding:0 4px;
      padding-bottom:env(safe-area-inset-bottom);
    }
    .mobile-nav-item {
      display:flex; flex-direction:column; align-items:center; gap:2px;
      padding:6px 8px; border-radius:8px; cursor:pointer; transition:all 0.12s;
      color:rgba(255,255,255,0.45); text-decoration:none; -webkit-tap-highlight-color:transparent;
      user-select:none;
    }
    .mobile-nav-item:active { transform:scale(0.9); }
    .mobile-nav-item.active { color:white; background:rgba(0,57,158,0.3); }
    .mobile-nav-item .i { width:18px; height:18px; }
    .mobile-nav-label { font-size:8px; font-weight:600; letter-spacing:0.3px; }

    /* PWA standalone mode */
    @media (display-mode: standalone) {
      body { padding-top:env(safe-area-inset-top); }
      .mobile-nav { padding-bottom:calc(4px + env(safe-area-inset-bottom)); }
    }

    /* Smooth scroll + touch */
    html { scroll-behavior:smooth; -webkit-tap-highlight-color:transparent; }
    * { -webkit-text-size-adjust:100%; }

    @media (max-width: 768px) {
      html, body { overflow-x:hidden; max-width:100vw; }
    }



    /* ===== MICRO INFO (for metric labels) ===== */
    .mi { display:inline-flex; align-items:center; justify-content:center; width:12px; height:12px; border-radius:50%; background:var(--bg-elevated); color:var(--text-muted); font-size:7px; font-weight:800; cursor:help; margin-left:3px; vertical-align:middle; position:relative; flex-shrink:0; border:1px solid var(--border); font-style:normal; }
    .mi:hover { background:var(--accent-primary); color:white; border-color:var(--accent-primary); }
    .mi:hover::after { content:attr(data-tip); position:absolute; bottom:calc(100% + 6px); left:50%; transform:translateX(-50%); background:var(--text-primary); color:var(--bg-card); padding:6px 10px; border-radius:4px; font-size:9px; font-weight:500; white-space:normal; width:200px; line-height:1.5; z-index:100; pointer-events:none; box-shadow:0 4px 12px rgba(0,0,0,0.15); }
    .mi:hover::before { content:''; position:absolute; bottom:calc(100% + 2px); left:50%; transform:translateX(-50%); border:4px solid transparent; border-top-color:var(--text-primary); z-index:101; }
    @media (max-width: 768px) { .mi:hover::after { width:160px; left:auto; right:0; transform:none; } }


    /* ===== 4-ADIM ÖZET KATMANI ===== */
    .overview-layer { padding:20px 0; }
    /* overview controlled by JS display */
    /* detail-layer always visible, modules hidden individually */

    .ov-alert { padding:14px 20px; background:linear-gradient(135deg,#FEF2F2,#FFF1F1); border:2px solid #DC2626; border-radius:8px; margin-bottom:16px; display:flex; align-items:center; gap:12px; }
    .ov-alert-badge { padding:4px 12px; background:#DC2626; color:white; border-radius:4px; font-size:9px; font-weight:800; letter-spacing:0.5px; flex-shrink:0; }
    .ov-alert-text { font-size:12px; font-weight:600; color:#991B1B; flex:1; }
    .ov-alert-btn { padding:6px 14px; background:#DC2626; color:white; border:none; border-radius:4px; font-size:10px; font-weight:700; cursor:pointer; font-family:inherit; flex-shrink:0; }

    .ov-hero { display:flex; align-items:center; gap:20px; margin-bottom:24px; padding:24px 28px; background:var(--glass); backdrop-filter:var(--glass-blur); border:1px solid var(--glass-border); border-radius:16px; color:var(--text-primary); position:relative; overflow:hidden; box-shadow:var(--shadow-md); }
    .ov-hero::before { content:''; position:absolute; top:-40%; right:-10%; width:250px; height:250px; background:radial-gradient(circle, rgba(79,70,229,0.06) 0%, transparent 70%); }
    .ov-score { flex-shrink:0; text-align:center; }
    .ov-score-ring { width:90px; height:90px; position:relative; display:flex; align-items:center; justify-content:center; }
    .ov-score-ring svg { position:absolute; top:0; left:0; transform:rotate(-90deg); }
    .ov-score-value { position:relative; z-index:1; font-size:28px; font-weight:900; }
    .ov-score-label { font-size:10px; color:var(--text-muted); margin-top:6px; font-weight:600; }
    .ov-hero-text { flex:1; position:relative; z-index:1; }
    .ov-hero-title { font-size:18px; font-weight:800; margin-bottom:6px; }
    .ov-hero-desc { font-size:12px; color:var(--text-secondary); line-height:1.6; }

    .ov-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:20px; }
    @media (max-width: 768px) { .ov-grid { grid-template-columns:1fr 1fr; } }
    @media (max-width: 480px) { .ov-grid { grid-template-columns:1fr; } }

    .ov-card { padding:20px; background:var(--glass); backdrop-filter:var(--glass-blur); border:1px solid var(--glass-border); border-radius:12px; transition:all 0.2s; position:relative; border-top:3px solid transparent; box-shadow:var(--shadow-sm); }
    .ov-card:hover { transform:translateY(-2px); box-shadow:var(--shadow-md); }
    .ov-card-num { font-size:11px; font-weight:800; color:var(--text-muted); margin-bottom:8px; }
    .ov-card-title { font-size:15px; font-weight:800; color:var(--text-primary); margin-bottom:6px; }
    .ov-card-content { font-size:11px; color:var(--text-secondary); line-height:1.7; }
    .ov-card-metric { display:flex; align-items:baseline; gap:6px; margin-top:10px; padding-top:10px; border-top:1px solid var(--bg-elevated); }
    .ov-card-metric-value { font-size:20px; font-weight:900; }
    .ov-card-metric-label { font-size:9px; color:var(--text-muted); }
    .ov-card-arrow { position:absolute; bottom:14px; right:14px; font-size:14px; color:var(--text-muted); transition:transform 0.2s; }
    .ov-card:hover .ov-card-arrow { transform:translateX(3px); color:var(--accent-primary); }

    .ov-card.durum { border-top-color:#DC2626; }
    .ov-card.neden { border-top-color:#D97706; }
    .ov-card.duzelt { border-top-color:#2563EB; }
    .ov-card.aksiyon { border-top-color:#059669; }

    .ov-quick-emotions { display:flex; gap:6px; margin-top:8px; flex-wrap:wrap; }
    .ov-emotion-chip { font-size:9px; padding:3px 8px; border-radius:10px; font-weight:600; }

    .ov-quick-tasks { display:flex; flex-direction:column; gap:4px; margin-top:8px; }
    .ov-task-mini { display:flex; align-items:center; gap:6px; font-size:10px; color:var(--text-secondary); }
    .ov-task-dot { width:6px; height:6px; border-radius:50%; flex-shrink:0; }

    .ov-back-bar { padding:0; margin:0; display:none; align-items:center; gap:10px; }
    .ov-back-btn { padding:6px 14px; background:var(--accent-primary); color:white; border:none; border-radius:4px; font-size:11px; font-weight:700; cursor:pointer; font-family:inherit; display:flex; align-items:center; gap:6px; }
    .ov-back-title { font-size:14px; font-weight:700; color:var(--text-primary); }

    .ov-view-toggle { display:flex; gap:0; background:var(--bg-elevated); border-radius:4px; overflow:hidden; border:1px solid var(--border); }
    .ov-view-btn { padding:6px 14px; font-size:10px; font-weight:600; border:none; cursor:pointer; font-family:inherit; color:var(--text-muted); background:transparent; transition:all 0.12s; }
    .ov-view-btn.active { background:var(--accent-primary); color:white; }


    /* ===== ÖZET SAYFALARI ===== */
    .summary-page { display:none; padding:20px 0; }

    /* SP Insight Cards */
    .sp-insight-card { padding:18px 20px; border-radius:10px; margin-bottom:14px; position:relative; overflow:hidden; transition:all 0.2s; }
    .sp-insight-card:hover { transform:translateY(-1px); box-shadow:0 4px 16px rgba(0,0,0,0.08); }
    .sp-insight-card .sp-ic-icon { width:36px; height:36px; border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:16px; flex-shrink:0; }
    .sp-insight-card .sp-ic-title { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.8px; margin-bottom:6px; }
    .sp-insight-card .sp-ic-body { font-size:13px; line-height:1.8; color:var(--text-primary); }
    .sp-insight-card .sp-ic-action { font-size:11px; margin-top:8px; padding:8px 12px; background:rgba(255,255,255,0.5); border-radius:6px; font-weight:600; }

    .sp-insight-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:20px; }
    .sp-insight-stat { padding:16px; background:var(--bg-card); border:1px solid var(--border); border-radius:10px; text-align:center; }
    .sp-insight-stat-value { font-size:24px; font-weight:900; line-height:1; }
    .sp-insight-stat-label { font-size:9px; font-weight:600; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.5px; margin-top:6px; }
    .sp-insight-stat-sub { font-size:10px; color:var(--text-secondary); margin-top:4px; }

    @media(max-width:768px) { .sp-insight-grid { grid-template-columns:1fr; } }
    /* summary-page visibility controlled by JS */
    
    .sp-header { margin-bottom:28px; padding:32px 32px 28px; border-radius:12px; position:relative; overflow:hidden; box-shadow:0 4px 20px rgba(0,0,0,0.15); }
    .sp-header::before { content:''; position:absolute; top:0; right:0; width:200px; height:200px; border-radius:50%; opacity:0.08; }
    .sp-header.sph-bugun { background:linear-gradient(135deg,#DC2626,#991B1B); }
    .sp-header.sph-bugun::before { background:white; }
    .sp-header.sph-analiz { background:linear-gradient(135deg,#2563EB,#1E40AF); }
    .sp-header.sph-analiz::before { background:white; }
    .sp-header.sph-aksiyon { background:linear-gradient(135deg,#D97706,#92400E); }
    .sp-header.sph-aksiyon::before { background:white; }
    .sp-header.sph-takip { background:linear-gradient(135deg,#059669,#065F46); }
    .sp-header.sph-takip::before { background:white; }
    .sp-back { display:inline-flex; align-items:center; gap:6px; padding:6px 14px; background:var(--accent-primary); color:white; border:none; border-radius:4px; font-size:11px; font-weight:700; cursor:pointer; font-family:inherit; margin-bottom:16px; }
    /* sp-num removed */
    .sp-title { font-size:26px; font-weight:800; color:white; text-transform:uppercase; letter-spacing:1px; line-height:1.3; font-family:'Inter','Outfit',sans-serif; }
    .sp-subtitle { font-size:15px; color:rgba(255,255,255,0.85); margin-top:10px; font-weight:500; letter-spacing:0.3px; line-height:1.5; }

    .sp-body { }
    .sp-paragraph { font-size:16px; color:var(--text-primary); line-height:2.2; margin-bottom:24px; font-weight:400; }
    .sp-bold { font-weight:800; color:var(--accent-primary); cursor:pointer; border-bottom:2px dashed rgba(0,57,158,0.3); transition:all 0.15s; padding:2px 4px; border-radius:3px; }
    .sp-bold:hover { border-bottom-color:var(--accent-primary); background:rgba(0,57,158,0.08); box-shadow:0 1px 4px rgba(0,57,158,0.15); }

    .sp-expand { display:none; margin:-4px 0 24px; padding:20px 24px; background:var(--bg-card); border-radius:10px; border-left:4px solid var(--accent-primary); animation:spSlide 0.2s ease; box-shadow:0 2px 12px rgba(0,0,0,0.06); }
    .sp-expand.open { display:block; }
    @keyframes spSlide { from{opacity:0;transform:translateY(-6px)} to{opacity:1;transform:translateY(0)} }
    
    .sp-mini-table { width:100%; border-collapse:collapse; margin-top:8px; }
    .sp-mini-table th { font-size:10px; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.5px; padding:10px 14px; text-align:left; border-bottom:2px solid var(--border); background:var(--bg-elevated); }
    .sp-mini-table td { font-size:12px; padding:10px 14px; border-bottom:1px solid var(--bg-elevated); color:var(--text-primary); }
    .sp-mini-table tr:hover td { background:rgba(0,57,158,0.03); }
    .sp-mini-table { border:1px solid var(--border); border-radius:8px; overflow:hidden; box-shadow:0 1px 4px rgba(0,0,0,0.04); }

    .sp-metric-strip { display:flex; gap:12px; margin:20px 0; flex-wrap:wrap; }
    .sp-metric { padding:18px 20px; background:var(--bg-card); border:1px solid var(--border); border-radius:10px; flex:1; min-width:120px; text-align:center; box-shadow:0 2px 8px rgba(0,0,0,0.04); transition:all 0.2s; }
    .sp-metric:hover { transform:translateY(-2px); box-shadow:0 4px 12px rgba(0,0,0,0.08); }
    .sp-metric-value { font-size:28px; font-weight:900; line-height:1.2; }
    .sp-metric-label { font-size:10px; font-weight:600; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.5px; margin-top:4px; }
    /* sp-metric-value moved above */
    /* sp-metric-label moved above */

    .sp-detail-btn { display:inline-flex; align-items:center; gap:6px; padding:14px 28px; background:linear-gradient(135deg,var(--accent-primary),#000B68); color:white; border:none; border-radius:8px; font-size:13px; font-weight:700; cursor:pointer; transition:all 0.2s; margin-top:16px; letter-spacing:0.5px; text-transform:uppercase; box-shadow:0 4px 12px rgba(0,57,158,0.25); }
    .sp-detail-btn:hover { background:var(--accent-primary); color:white; }

    .sp-detail-btn.active { background:var(--accent-primary); color:white; }
    .sp-detail-btn.active:hover { background:var(--blue-600); }


    .sp-emotion-bar { display:flex; align-items:center; gap:10px; margin:6px 0; }
    .sp-emotion-name { font-size:12px; width:80px; text-align:right; color:var(--text-primary); font-weight:700; }
    .sp-emotion-track { flex:1; height:16px; background:var(--bg-elevated); border-radius:8px; overflow:hidden; }
    .sp-emotion-fill { height:100%; border-radius:6px; }
    .sp-emotion-pct { font-size:13px; font-weight:800; width:45px; }

    @media (max-width: 768px) {
      .sp-title { font-size:22px; }
      .sp-paragraph { font-size:14px; }
      .sp-metric-strip { flex-direction:column; }
      /* sp-num removed */
    }



    /* ===== ROL BAZLI ERİŞİM ===== */
    .role-locked { display:none !important; }
    
    /* Uzman consent modal */
    .uzman-consent-overlay { display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,11,104,0.95); z-index:10000; align-items:center; justify-content:center; }
    .uzman-consent-overlay.show { display:flex; }
    .uzman-consent-box { background:white; border-radius:12px; max-width:520px; width:92%; max-height:85vh; overflow-y:auto; padding:32px; box-shadow:0 20px 60px rgba(0,0,0,0.3); }
    .uc-title { font-size:20px; font-weight:800; color:#0A0E3A; margin-bottom:4px; }
    .uc-subtitle { font-size:11px; color:#6C828D; margin-bottom:20px; }
    .uc-section { border:1px solid #D6E0F0; border-radius:8px; padding:14px; margin-bottom:10px; background:#F5F7FA; }
    .uc-section-title { font-size:12px; font-weight:700; color:#0A0E3A; margin-bottom:6px; }
    .uc-section-text { font-size:10px; color:#6C828D; line-height:1.7; }
    .uc-check-row { display:flex; align-items:flex-start; gap:10px; margin-bottom:10px; }
    .uc-check-row input { margin-top:3px; accent-color:#00399E; }
    .uc-check-label { font-size:11px; color:#0A0E3A; line-height:1.5; }
    .uc-check-label strong { color:#DC2626; }
    .uc-btn { width:100%; padding:14px; background:#00399E; color:white; border:none; border-radius:8px; font-size:13px; font-weight:700; cursor:pointer; margin-top:16px; }
    .uc-btn:disabled { background:#A3B5CB; cursor:not-allowed; }
    .uc-btn:not(:disabled):hover { background:#000B68; }
    .uc-error { color:#DC2626; font-size:10px; text-align:center; margin-top:8px; display:none; }

    /* ===== UZMAN GÖREV PANELİ ===== */
    .uzman-panel { display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:var(--bg-body); z-index:9000; overflow-y:auto; }
    .uzman-panel.show { display:block; }
    .uz-topbar { background:linear-gradient(135deg,#000B68,#00399E); padding:16px 24px; color:white; display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; z-index:10; }
    .uz-topbar-left { display:flex; align-items:center; gap:12px; }
    .uz-topbar-logo { width:32px; height:32px; background:rgba(255,255,255,0.15); border-radius:8px; display:flex; align-items:center; justify-content:center; }
    .uz-topbar-name { font-size:15px; font-weight:700; }
    .uz-topbar-role { font-size:9px; opacity:0.6; margin-top:1px; }
    .uz-topbar-right { display:flex; align-items:center; gap:12px; }
    .uz-topbar-btn { padding:7px 14px; background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.15); border-radius:6px; color:white; font-size:10px; font-weight:600; cursor:pointer; font-family:inherit; }
    .uz-body { max-width:800px; margin:0 auto; padding:20px 16px 80px; }
    
    /* Uzman KPI bar */
    .uz-kpi-bar { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:20px; }
    .uz-kpi { background:white; border:1px solid #D6E0F0; border-radius:8px; padding:14px; text-align:center; }
    .uz-kpi-val { font-size:24px; font-weight:800; line-height:1.2; }
    .uz-kpi-label { font-size:9px; color:#6C828D; margin-top:2px; font-weight:600; text-transform:uppercase; letter-spacing:0.5px; }
    
    /* Uzman görev kartı */
    .uz-task { background:white; border:1px solid #D6E0F0; border-radius:10px; margin-bottom:12px; overflow:hidden; transition:all 0.2s; }
    .uz-task:hover { border-color:#00399E; box-shadow:0 2px 12px rgba(0,57,158,0.06); }
    .uz-task-header { padding:16px; cursor:pointer; display:flex; align-items:flex-start; gap:12px; }
    .uz-task-priority { width:6px; border-radius:3px; min-height:40px; flex-shrink:0; }
    .uz-task-priority.p0 { background:#DC2626; }
    .uz-task-priority.p1 { background:#D97706; }
    .uz-task-priority.p2 { background:#2563EB; }
    .uz-task-priority.p3 { background:#059669; }
    .uz-task-content { flex:1; }
    .uz-task-top { display:flex; align-items:center; gap:8px; margin-bottom:4px; }
    .uz-task-badge { padding:2px 8px; border-radius:3px; font-size:8px; font-weight:700; text-transform:uppercase; }
    .uz-task-badge.p0 { background:#FEE2E2; color:#991B1B; }
    .uz-task-badge.p1 { background:#FEF3C7; color:#92400E; }
    .uz-task-badge.p2 { background:#DBEAFE; color:#1E40AF; }
    .uz-task-badge.p3 { background:#D1FAE5; color:#065F46; }
    .uz-task-platform { padding:2px 8px; border-radius:3px; font-size:8px; font-weight:700; background:#EDF2F7; color:#6C828D; }
    .uz-task-deadline { font-size:9px; color:#6C828D; margin-left:auto; }
    .uz-task-deadline.overdue { color:#DC2626; font-weight:700; }
    .uz-task-title { font-size:13px; font-weight:600; color:#0A0E3A; margin-bottom:6px; }
    .uz-task-comment { font-size:11px; color:#6C828D; line-height:1.6; background:#F5F7FA; padding:10px 12px; border-radius:6px; border-left:3px solid #D6E0F0; }
    .uz-task-actions { display:flex; align-items:center; gap:6px; margin-top:10px; }
    
    /* Görev detay (açılır) */
    .uz-task-detail { display:none; padding:0 16px 16px; border-top:1px solid #EDF2F7; }
    .uz-task-detail.open { display:block; padding-top:16px; }
    .uz-task-suggest { background:#F0FDF4; border:1px solid #BBF7D0; border-radius:8px; padding:12px; margin-bottom:12px; }
    .uz-task-suggest-title { font-size:10px; font-weight:700; color:#059669; margin-bottom:6px; }
    .uz-task-suggest-text { font-size:11px; color:#0A0E3A; line-height:1.6; }
    .uz-task-reply { width:100%; padding:12px; border:1px solid #D6E0F0; border-radius:8px; font-size:12px; font-family:inherit; resize:vertical; min-height:80px; color:#0A0E3A; }
    .uz-task-reply:focus { outline:none; border-color:#00399E; box-shadow:0 0 0 3px rgba(0,57,158,0.1); }
    .uz-task-btn-row { display:flex; gap:8px; margin-top:10px; }
    .uz-task-btn { padding:10px 20px; border:none; border-radius:6px; font-size:11px; font-weight:700; cursor:pointer; font-family:inherit; }
    .uz-task-btn.primary { background:#00399E; color:white; }
    .uz-task-btn.primary:hover { background:#000B68; }
    .uz-task-btn.success { background:#059669; color:white; }
    .uz-task-btn.success:hover { background:#047857; }
    .uz-task-btn.outline { background:transparent; border:1px solid #D6E0F0; color:#6C828D; }
    .uz-task-done { background:#D1FAE5; border-color:#6EE7B7; }
    .uz-task-done .uz-task-title { text-decoration:line-through; color:#6C828D; }
    
    /* Uzman destek */
    .uz-support-btn { position:fixed; bottom:20px; right:20px; width:48px; height:48px; border-radius:50%; background:#00399E; border:none; cursor:pointer; box-shadow:0 4px 12px rgba(0,57,158,0.3); display:flex; align-items:center; justify-content:center; z-index:100; }
    .uz-support-btn svg { width:20px; height:20px; stroke:white; fill:none; }
    
    @media(max-width:768px){
      .uz-kpi-bar { grid-template-columns:repeat(2,1fr); }
      .uz-body { padding:12px 10px 80px; }
      .uz-topbar { padding:12px 16px; }
      .uz-task-btn-row { flex-direction:column; }
    }


    /* API Status Indicator */
    .api-status { position:fixed; bottom:12px; left:12px; padding:4px 10px; border-radius:4px; font-size:9px; font-weight:700; z-index:100; opacity:0.7; transition:opacity 0.3s; }
    .api-status:hover { opacity:1; }
    .api-status.online { background:#D1FAE5; color:#065F46; }
    .api-status.offline { background:#FEE2E2; color:#991B1B; }
    .api-status.loading { background:#DBEAFE; color:#1E40AF; }

    /* ===== PWA INSTALL BANNER ===== */
    .pwa-install-banner {
      display:none; position:fixed; bottom:70px; left:50%; transform:translateX(-50%);
      background:linear-gradient(135deg,#00399E,#000B68); color:white; padding:14px 20px;
      border-radius:12px; box-shadow:0 8px 30px rgba(0,0,0,0.25); z-index:200;
      max-width:380px; width:calc(100% - 32px); animation:pwaSlideUp 0.4s ease;
    }
    .pwa-install-banner.show { display:flex; align-items:center; gap:14px; }
    @keyframes pwaSlideUp { from{transform:translateX(-50%) translateY(30px);opacity:0;} to{transform:translateX(-50%) translateY(0);opacity:1;} }
    .pwa-install-icon { width:44px; height:44px; background:white; border-radius:10px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
    .pwa-install-icon svg { width:26px; height:26px; }
    .pwa-install-text { flex:1; }
    .pwa-install-title { font-size:13px; font-weight:700; margin-bottom:2px; }
    .pwa-install-desc { font-size:10px; opacity:0.8; line-height:1.4; }
    .pwa-install-btn { padding:8px 16px; background:white; color:#00399E; border:none; border-radius:6px; font-size:11px; font-weight:700; cursor:pointer; white-space:nowrap; }
    .pwa-install-btn:active { transform:scale(0.95); }
    .pwa-install-close { position:absolute; top:6px; right:8px; background:none; border:none; color:rgba(255,255,255,0.5); font-size:16px; cursor:pointer; padding:4px; }
    
    /* Sidebar install button */
    .sidebar-install-btn {
      display:flex; align-items:center; gap:8px; padding:8px 12px; margin:4px 0;
      background:linear-gradient(135deg,rgba(99,102,241,0.15),rgba(139,92,246,0.15));
      border:1px dashed rgba(99,102,241,0.4); border-radius:6px; cursor:pointer;
      color:#A5B4FC; font-size:10px; font-weight:600; transition:all 0.15s;
      white-space:nowrap; overflow:hidden;
    }
    .sidebar-install-btn:hover { background:linear-gradient(135deg,rgba(99,102,241,0.25),rgba(139,92,246,0.25)); color:white; border-color:#6366F1; }
    .sidebar-install-btn svg { width:16px; height:16px; flex-shrink:0; }

    /* iOS install guide modal */
    .ios-guide-overlay { display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.6); z-index:300; align-items:center; justify-content:center; }
    .ios-guide-overlay.show { display:flex; }
    .ios-guide { background:white; border-radius:16px; padding:28px; max-width:340px; width:90%; text-align:center; }
    .ios-guide-title { font-size:16px; font-weight:800; margin-bottom:12px; color:#0A0E3A; }
    .ios-guide-steps { text-align:left; font-size:12px; color:#6C828D; line-height:2.0; }
    .ios-guide-step-num { display:inline-flex; width:22px; height:22px; border-radius:50%; background:#00399E; color:white; font-size:10px; font-weight:700; align-items:center; justify-content:center; margin-right:8px; }
    
    @media(min-width:769px) {
      .pwa-install-banner { bottom:20px; }
    }