/* Grok Bot Sand design tokens, resolved from the desktop 0.71.2 renderer. */
:root {
  color-scheme: light;
  --sand-bg-pane: #ffffff;
  --sand-bg-chrome: #fcfcfc;
  --sand-bg-sidebar: #f5f5f5;
  --sand-bg-elevated: #ffffff;
  --sand-bg-elevated-hover: #f1f1f1;
  --sand-bg-scrim: #00000080;
  --sand-bg-hover: #1c1c1c0f;
  --sand-bg-active: #1c1c1c14;
  --sand-bg-primary: #1c1c1c;
  --sand-bg-primary-hover: #363636;
  --sand-bg-primary-disabled: #1c1c1c26;
  --sand-bg-secondary: #1c1c1c0f;
  --sand-bg-secondary-hover: #1c1c1c1a;
  --sand-bg-secondary-disabled: #1c1c1c0a;
  --sand-bg-quaternary: #1c1c1c0a;
  --sand-text-primary: #1c1c1c;
  --sand-text-secondary: #1c1c1cad;
  --sand-text-tertiary: #1c1c1c8f;
  --sand-text-quaternary: #1c1c1c66;
  --sand-text-on-primary: #ffffff;
  --sand-text-inverted: #fcfcfc;
  --sand-icon-primary: #1c1c1ceb;
  --sand-icon-secondary: #1c1c1ca8;
  --sand-icon-tertiary: #1c1c1c85;
  --sand-border-primary-translucent: #1c1c1c3d;
  --sand-border-secondary-translucent: #1c1c1c1f;
  --sand-border-tertiary-translucent: #1c1c1c14;
  --sand-border-focus-primary: #1e86fc;
  --sand-shadow-card: #1c1c1c09;
  --sand-shadow-popover: #1c1c1c1a;
  --sand-bg-accent-primary: #1680f3;
  --sand-bg-accent-primary-hover: #126fd4;
  --sand-bg-accent-secondary: #1e86fc17;
  --sand-text-accent-primary: #0b6dd3;
  --sand-bg-danger-primary: #e72e3b;
  --sand-bg-danger-primary-hover: #c82532;
  --sand-bg-danger-secondary: #fb2b3e17;
  --sand-bg-danger-secondary-hover: #fb2b3e2b;
  --sand-text-danger-primary: #cd2834;
  --sand-icon-danger-primary: #e72e3b;
  --sand-bg-success-secondary: #14c16f17;
  --sand-text-success-primary: #00854a;
  --sand-icon-success-primary: #10ab61;
  --sand-bg-warn-secondary: #f5931217;
  --sand-text-warn-primary: #aa6300;
  --sand-icon-warn-primary: #da830e;
  --sand-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4.5 6.5 3.5 3.5 3.5-3.5' fill='none' stroke='%231c1c1c' stroke-opacity='.6' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;
  --text-caption: 11px/16px var(--font-sans);
  --text-label: 12px/16px var(--font-sans);
  --text-body2: 13px/18px var(--font-sans);
  --text-body1: 14px/20px var(--font-sans);
  --text-heading3: 17px/24px var(--font-sans);
  --text-heading2: 22px/28px var(--font-sans);
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;
  --hairline: 0.5px;
  --ease-out: cubic-bezier(0.2, 0, 0, 1);
  --duration-fast: 120ms;
  --face-eye: #f5f5f5;
  --face-skin: radial-gradient(circle at 34% 26%, #626262 0, #383838 26%, #1c1c1c 60%, #050505 100%);
}

/* .theme-dark keeps a region dark regardless of the chosen theme (the sign-in page). */
:root[data-theme="dark"], .theme-dark {
  color-scheme: dark;
  --sand-bg-pane: #161616;
  --sand-bg-chrome: #121212;
  --sand-bg-sidebar: #0e0e0e;
  --sand-bg-elevated: #1f1f1f;
  --sand-bg-elevated-hover: #2c2c2c;
  --sand-bg-scrim: #000000b2;
  --sand-bg-hover: #f5f5f50f;
  --sand-bg-active: #f5f5f514;
  --sand-bg-primary: #f5f5f5;
  --sand-bg-primary-hover: #dbdbdb;
  --sand-bg-primary-disabled: #f5f5f521;
  --sand-bg-secondary: #f5f5f50a;
  --sand-bg-secondary-hover: #f5f5f514;
  --sand-bg-secondary-disabled: #f5f5f505;
  --sand-bg-quaternary: #f5f5f505;
  --sand-text-primary: #f5f5f5;
  --sand-text-secondary: #f5f5f5a8;
  --sand-text-tertiary: #f5f5f58a;
  --sand-text-quaternary: #f5f5f561;
  --sand-text-on-primary: #f5f5f5;
  --sand-text-inverted: #121212;
  --sand-icon-primary: #f5f5f5e6;
  --sand-icon-secondary: #f5f5f5a3;
  --sand-icon-tertiary: #f5f5f580;
  --sand-border-primary-translucent: #f5f5f538;
  --sand-border-secondary-translucent: #f5f5f51a;
  --sand-border-tertiary-translucent: #f5f5f50f;
  --sand-border-focus-primary: #1884fc;
  --sand-shadow-card: #00000000;
  --sand-shadow-popover: #00000066;
  --sand-bg-accent-primary: #116dd2;
  --sand-bg-accent-primary-hover: #1784fb;
  --sand-bg-accent-secondary: #1884fc12;
  --sand-text-accent-primary: #4d9bff;
  --sand-bg-danger-primary: #cf2b35;
  --sand-bg-danger-primary-hover: #f73643;
  --sand-bg-danger-secondary: #fc2c3e12;
  --sand-bg-danger-secondary-hover: #fc2c3e26;
  --sand-text-danger-primary: #ff6463;
  --sand-icon-danger-primary: #cf2b35;
  --sand-bg-success-secondary: #14c37012;
  --sand-text-success-primary: #00ba69;
  --sand-icon-success-primary: #0e9f5a;
  --sand-bg-warn-secondary: #f6941212;
  --sand-text-warn-primary: #e28600;
  --sand-icon-warn-primary: #c8770c;
  --sand-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4.5 6.5 3.5 3.5 3.5-3.5' fill='none' stroke='%23f5f5f5' stroke-opacity='.6' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --face-eye: #141414;
  --face-skin: radial-gradient(circle at 34% 26%, #ffffff 0, #f2f2f2 20%, #d2d2d2 56%, #9c9c9c 100%);
}