/* ============================================
   NOVA — Design Tokens (SKILL 8)
   ============================================ */

:root {
  /* ---- Background Colors ---- */
  --color-bg-root:            #EBEBEB;
  --color-bg-app:             #FFFFFF;
  --color-bg-hover:           #F5F5F5;
  --color-bg-active:          #F0F0F0;
  --color-bg-thinking:        #FAFAFA;
  --color-bg-user-bubble:     #F2F2F2;
  --color-bg-badge-new:       #1A1A1A;

  /* ---- Text Colors ---- */
  --color-text-primary:       #0F0F0F;
  --color-text-secondary:     #6B6B6B;
  --color-text-placeholder:   #AAAAAA;
  --color-text-white:         #FFFFFF;

  /* ---- Border Colors ---- */
  --color-border-default:     #E5E5E5;
  --color-border-input-focus: #C8C8C8;

  /* ---- Interactive Colors ---- */
  --color-send-active:        #1A1A1A;
  --color-send-inactive:      #D4D4D4;
  --color-send-stop:          #1A1A1A;

  /* ---- Brand Colors ---- */
  --color-logo-bg:            #1A1A1A;
  --color-logo-icon:          #FFFFFF;
  --color-accent-gemini:      #4F80FF;
  --color-dot-online:         #22C55E;

  /* ---- Chip Colors ---- */
  --color-chip-research:      #E53E3E;
  --color-chip-video:         #9B59B6;
  --color-chip-image:         #3B82F6;
  --color-chip-code:          #06B6D4;
  --color-chip-flashcard:     #22C55E;
  --color-chip-brainstorm:    #F59E0B;
  --color-chip-presentation:  #EF4444;

  /* ---- Typography ---- */
  --font-family:              'Inter', system-ui, -apple-system, sans-serif;
  --font-size-xs:             11px;
  --font-size-sm:             12px;
  --font-size-base:           13px;
  --font-size-md:             14px;
  --font-size-lg:             15px;
  --font-size-xl:             17px;
  --font-size-2xl:            24px;
  --font-size-3xl:            38px;

  /* ---- Spacing ---- */
  --spacing-xs:               4px;
  --spacing-sm:               8px;
  --spacing-md:               12px;
  --spacing-lg:               16px;
  --spacing-xl:               24px;
  --spacing-2xl:              32px;
  --spacing-3xl:              48px;

  /* ---- Border Radius ---- */
  --radius-sm:                4px;
  --radius-md:                8px;
  --radius-lg:                12px;
  --radius-xl:                16px;
  --radius-full:              9999px;

  /* ---- Shadows ---- */
  --shadow-sm:                0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-md:                0 4px 12px rgba(0, 0, 0, 0.06);
  --shadow-lg:                0 8px 24px rgba(0, 0, 0, 0.08);
  --shadow-card:              0 2px 8px rgba(0, 0, 0, 0.04), 0 0 0 1px rgba(0, 0, 0, 0.02);

  /* ---- Transitions ---- */
  --transition-fast:          120ms ease;
  --transition-base:          200ms ease;
  --transition-slow:          350ms ease;

  /* ---- Layout ---- */
  --sidebar-width:            260px;
  --sidebar-width-collapsed:   60px;
  --input-max-width:          768px;
}