/* ========== DESIGN TOKENS ========== */
:root {
  --font: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --bg: #F8FAFC;
  --bg-card: #FFFFFF;
  --bg-sidebar: #FFFFFF;
  --bg-hover: #F1F5F9;
  --bg-active: #EFF6FF;
  --bg-badge: #EFF6FF;
  --border: #E2E8F0;
  --border-light: #F1F5F9;
  --text-primary: #0F172A;
  --text-secondary: #475569;
  --text-muted: #94A3B8;
  --accent: #2563EB;
  --accent-hover: #1D4ED8;
  --accent-light: #DBEAFE;
  --accent-text: #1E40AF;
  --success: #059669;
  --success-bg: #ECFDF5;
  --success-text: #065F46;
  --warning: #D97706;
  --warning-bg: #FFFBEB;
  --warning-text: #92400E;
  --danger: #DC2626;
  --danger-bg: #FEF2F2;
  --danger-text: #991B1B;
  --info: #7C3AED;
  --info-bg: #F5F3FF;
  --info-text: #5B21B6;
  --radius-sm: 6px;
  --radius: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.04);
  --shadow: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md: 0 4px 6px -1px rgba(0,0,0,0.06), 0 2px 4px -2px rgba(0,0,0,0.04);
  --shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.06), 0 4px 6px -4px rgba(0,0,0,0.04);
  --transition: 150ms ease;
  --sidebar-w: 260px;
  --header-h: 64px;
}

[data-theme="dark"] {
  --bg: #0B0F19;
  --bg-card: #111827;
  --bg-sidebar: #0F1629;
  --bg-hover: #1E293B;
  --bg-active: #172554;
  --bg-badge: #172554;
  --border: #1E293B;
  --border-light: #1E293B;
  --text-primary: #F1F5F9;
  --text-secondary: #94A3B8;
  --text-muted: #64748B;
  --accent: #3B82F6;
  --accent-hover: #2563EB;
  --accent-light: #1E3A5F;
  --accent-text: #93C5FD;
  --success: #34D399;
  --success-bg: #064E3B;
  --success-text: #6EE7B7;
  --warning: #FBBF24;
  --warning-bg: #451A03;
  --warning-text: #FCD34D;
  --danger: #F87171;
  --danger-bg: #450A0A;
  --danger-text: #FCA5A5;
  --info: #A78BFA;
  --info-bg: #2E1065;
  --info-text: #C4B5FD;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.2);
  --shadow: 0 1px 3px rgba(0,0,0,0.3), 0 1px 2px rgba(0,0,0,0.2);
  --shadow-md: 0 4px 6px -1px rgba(0,0,0,0.3), 0 2px 4px -2px rgba(0,0,0,0.2);
  --shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.4), 0 4px 6px -4px rgba(0,0,0,0.3);
}
[data-theme="dark"] .cmd-log { background: #020617; }
[data-theme="dark"] .modal-overlay { background: rgba(0,0,0,0.6); }
[data-theme="dark"] .search-box kbd { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .platform-badge { background: #1E293B; border-color: #334155; color: #CBD5E1; }
[data-theme="dark"] .filter-btn { background: #111827; color: #94A3B8; border-color: #1E293B; }
[data-theme="dark"] .filter-btn:hover { background: #1E293B; }
[data-theme="dark"] .select-styled { background: #111827; color: #CBD5E1; border-color: #1E293B; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); }