/* RSSPipe - High-Precision Metallic Monochrome Design Tokens */

:root {
  /* Surfaces & Backgrounds (Crisp Titanium & Neutral Monochrome) */
  --bg-app: #f4f4f5;
  --bg-surface: #ffffff;
  --bg-sidebar: #fafafa;
  --bg-card: #ffffff;
  --bg-card-hover: #f4f4f5;
  --bg-card-active: #e4e4e7;
  --bg-subtle: #f4f4f5;
  --bg-overlay: rgba(9, 9, 11, 0.45);
  --bg-docked: rgba(255, 255, 255, 0.96);

  /* Borders (Neutral Steel / Zinc) */
  --border-light: #f4f4f5;
  --border-subtle: #e4e4e7;
  --border-strong: #d4d4d8;
  --border-focus: #18181b;

  /* Typography */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', monospace;

  /* Text Colors (Pure High-Contrast Zinc) */
  --text-primary: #09090b;
  --text-secondary: #27272a;
  --text-muted: #71717a;
  --text-dim: #a1a1aa;
  --text-inverse: #ffffff;

  /* Brand Accents (Titanium Black & Steel) */
  --accent-primary: #18181b;
  --accent-hover: #27272a;
  --accent-soft: rgba(24, 24, 27, 0.06);
  --accent-border: #d4d4d8;

  /* Semantic Highlight Colors */
  --star-gold: #d97706;
  --star-bg: #fef3c7;
  --success: #059669;
  --success-soft: #d1fae5;
  --danger: #dc2626;
  --danger-soft: #fee2e2;
  --badge-ai: #4f46e5;
  --badge-ai-soft: #e0e7ff;
  --badge-tts: #0284c7;
  --badge-tts-soft: #e0f2fe;

  /* Radiuses */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 20px;
  --radius-full: 9999px;

  /* Shadows (Subtle, Crisp Elevation) */
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 12px 28px rgba(0, 0, 0, 0.12);
  --shadow-docked: 0 -4px 20px rgba(0, 0, 0, 0.07);

  /* Layout Dimensions */
  --header-height: 50px;
  --safe-area-bottom: env(safe-area-inset-bottom, 0px);
  --bottom-nav-height: calc(50px + env(safe-area-inset-bottom, 0px));
  --docked-audio-height: 54px;
  --sidebar-min-width: 200px;
  --sidebar-default-width: 250px;
  --list-min-width: 300px;
  --list-default-width: 400px;
  --reader-min-width: 480px;

  /* Transitions */
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: 250ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-smooth: 350ms cubic-bezier(0.32, 0.72, 0, 1);
}