/* ============================================================
   Design tokens — paste once, never edit per screen.
   ============================================================ */

:root,
:root[data-theme='dark'],
[data-theme='dark'] {
  --color-app-bg:          #121212;
  --color-tabbar-bg:       #202020;
  --color-tab-active-bg:   #454545;
  --color-card-bg:         #181818;
  --color-card-border:     #222222;
  --color-icon-btn-bg:     #222222;

  --color-text-primary:    #e1e1e1;
  --color-text-secondary:  #9f9f9f;

  --color-btn-primary-bg:    #e1e1e1;
  --color-btn-primary-text:  #121212;

  --color-accent:          #05d864;
  --color-accent-danger:   #ff5050;

  --color-bg-danger:       #401111;
  --color-bg-success:      #08321b;

  --color-avatar-fallback: #067dcb;
  --color-avatar-letter:   #ffffff;

  --color-icon-muted:      #9f9f9f;

  --color-shimmer-highlight: #ffffff;
  --color-tab-hover-text:    #ffffff;

  --shadow-popover: 0 6px 24.3px 1px rgba(0, 0, 0, 0.57);

  color-scheme: dark;
}

:root[data-theme='light'],
[data-theme='light'] {
  --color-app-bg:          #fdfdfd;
  --color-tabbar-bg:       #f1f1f1;
  --color-tab-active-bg:   #ffffff;
  --color-card-bg:         #ffffff;
  --color-card-border:     #d4d4d4;
  --color-icon-btn-bg:     #ececec;

  --color-text-primary:    #0f0f0f;
  --color-text-secondary:  #3c3c3c;

  --color-btn-primary-bg:    #0f0f0f;
  --color-btn-primary-text:  #fdfdfd;

  --color-accent:          #05d864;
  --color-accent-danger:   #ff5050;

  --color-bg-danger:       #ffe2e2;
  --color-bg-success:      #cfffe4;

  --color-avatar-fallback: #067dcb;
  --color-avatar-letter:   #ffffff;

  --color-icon-muted:      #3c3c3c;

  --color-shimmer-highlight: #c8c8c8;
  --color-tab-hover-text:    #0f0f0f;

  --shadow-popover: 0 4px 18px 0 rgba(15, 15, 15, 0.07);

  color-scheme: light;
}

:root {
  --space-page:  30px;
  --radius-pill: 100px;
  --radius-card: 30px;
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}