:root {
  /* surfaces */
  --bg-app: #000000;
  --bg-sidebar: #050505;
  --bg-panel: #0c0c0d;
  --bg-elev1: #1a1a1c;      /* selected rows, cards */
  --bg-elev2: #232326;      /* option rows, inputs on cards */
  --bg-elev3: #2e2e31;      /* chips, small buttons */
  --bg-input: #1c1c1f;      /* search, composer */
  --bg-menu: #1f1f22;       /* popovers, context menus */
  --bg-modal: #1c1c1e;
  --bg-bubble-agent: #1e1e20;
  --bg-bubble-user: #3f3f42;
  --bg-code: #2c2c2e;

  /* text */
  --text-primary: #f5f5f7;
  --text-secondary: #a8a8ad;
  --text-tertiary: #6e6e73;

  /* accents */
  --blue: #0a84ff;
  --green: #30d158;
  --orange: #ff9f0a;
  --red: #ff453a;
  --white-btn: #ffffff;

  /* mascot palette */
  --m-white: #f2f2f2;
  --m-brown: #8d6a4a;
  --m-red: #e6392f;
  --m-orange: #f0641e;
  --m-amber: #f5a623;
  --m-green: #34a853;
  --m-teal: #2aa198;
  --m-blue: #1a73e8;
  --m-purple: #7c5cff;
  --m-pink: #e73895;
  --m-gray: #8e8e93;

  --hairline: rgba(255,255,255,0.08);
  --hairline-strong: rgba(255,255,255,0.14);

  --radius-bubble: 20px;
  --radius-card: 16px;
  --radius-input: 12px;
  --radius-pill: 999px;

  --font-ui: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;

  --sidebar-w: 380px;
  --rail-w: 64px;
  --rpanel-w: 420px;

  --shadow-pop: 0 12px 40px rgba(0,0,0,.55), 0 2px 8px rgba(0,0,0,.4);
}