/**
 * Entasher.com — single source of truth for design tokens.
 * Brand: Blue #264EFF, Orange #F7A722, White, Black only.
 * Use these variables everywhere; no inline color/radius/shadow duplication.
 */
:root {
  /* Brand (strict) */
  --blue: #264EFF;
  --blue-light: #4A6EFF;
  --blue-dark: #1A3DD9;
  --orange: #F7A722;
  --orange-light: #FFB84A;
  --white: #FFFFFF;
  --black: #000000;
  /* Aliases for existing entasher-* usage */
  --entasher-blue: var(--blue);
  --entasher-orange: var(--orange);
  --entasher-white: var(--white);
  --entasher-black: var(--black);
  /* Semantic (derived from brand + neutrals) */
  --ink: #0E1320;
  --ink-light: #1F2937;
  --muted: #6B7280;
  --muted-light: #9CA3AF;
  --bg: #F3F4FB;
  --bg-light: #FAFBFF;
  --surface: #FFFFFF;
  --line: #E5E7F0;
  --line-light: #F0F2F5;
  --success: #10B981;
  --warning: #F59E0B;
  --error: #EF4444;
  --entasher-ink: var(--ink);
  --entasher-ink-muted: var(--muted);
  --entasher-line: rgba(0, 0, 0, 0.1);
  --entasher-surface: var(--surface);
  --entasher-bg: var(--bg);
  /* Typography */
  --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --entasher-font: var(--font);
  /* Radius */
  --radius-lg: 20px;
  --radius-md: 14px;
  --radius-sm: 10px;
  --radius-pill: 999px;
  --entasher-radius-sm: var(--radius-sm);
  --entasher-radius-md: var(--radius-md);
  --entasher-radius-lg: var(--radius-lg);
  --entasher-radius-pill: var(--radius-pill);
  /* Shadows */
  --shadow-xs: 0 1px 3px rgba(15, 23, 42, 0.05);
  --shadow-sm: 0 4px 12px rgba(15, 23, 42, 0.08);
  --shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
  --shadow-lg: 0 20px 48px rgba(15, 23, 42, 0.16);
  --shadow-xl: 0 24px 64px rgba(15, 23, 42, 0.2);
  --shadow-blue: 0 8px 24px rgba(38, 78, 255, 0.15);
  --shadow-orange: 0 8px 24px rgba(247, 167, 34, 0.15);
  --focus: 0 0 0 3px rgba(38, 78, 255, 0.12);
  --glow-blue: 0 0 20px rgba(38, 78, 255, 0.3);
  --entasher-shadow-sm: var(--shadow-sm);
  --entasher-shadow: var(--shadow);
  /* Layout */
  --wrap: 1200px;
  --header-height: 64px;
  --sticky-bottom-height: 72px;
  /* Motion */
  --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-fast: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
/* Mobile: reduce header / sticky heights */
@media (max-width: 640px) {
  :root {
    --header-height: 52px;
    --sticky-bottom-height: 56px;
  }
}
@media (max-width: 480px) {
  :root {
    --header-height: 48px;
    --sticky-bottom-height: 52px;
  }
}