/* Shell foundation shared by every authenticated page (D13): the reset, the
   design tokens, and the base document rules. Theme overrides
   (chat-themes.css) load after this file; page layout (chat.css, media.css)
   loads after both. */

*,
*::before,
*::after {
  box-sizing: border-box;
}

:root {
  --black: #09090b;
  --charcoal-deep: #0f0f11;
  --charcoal: #141416;
  --charcoal-mid: #1a1a1e;
  --charcoal-light: #222226;
  --gray-900: #28282e;
  --gray-800: #323238;
  --gray-700: #3f3f46;
  --gray-600: #52525b;
  --gray-500: #71717a;
  --gray-400: #a1a1aa;
  --gray-300: #d4d4d8;
  --gray-200: #e4e4e7;
  --white: #fafafa;
  --accent-dim: rgba(228, 228, 231, 0.08);
  --accent-glow: rgba(228, 228, 231, 0.04);
  --font-display: 'Spectral', Georgia, 'Times New Roman', serif;
  --font-body: 'Spectral', Georgia, 'Times New Roman', serif;
  --font-sc: 'Spectral SC', 'Spectral', Georgia, serif;
  --font-mono: 'JetBrains Mono', monospace;
  --shadow-lg: 0 20px 40px rgba(0, 0, 0, 0.35);
  --danger-text: #f0cfd1;
  --shell-background:
    radial-gradient(1200px 500px at 80% -15%, rgba(255, 255, 255, 0.025) 0%, transparent 55%),
    linear-gradient(180deg, var(--charcoal-deep) 0%, var(--black) 100%);
  --sidebar-background: linear-gradient(180deg, var(--charcoal-deep) 0%, var(--black) 100%);
  --header-bg: rgba(15, 15, 17, 0.85);
  --composer-bg: rgba(15, 15, 17, 0.95);
  --overlay-bg: rgba(9, 9, 11, 0.85);
  --control-rim: conic-gradient(from 0deg, transparent 0%, var(--gray-300) 20%, var(--white) 40%, var(--gray-300) 60%, transparent 80%);
}

::selection {
  background: var(--accent-dim);
  color: var(--white);
}

::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--black); }
::-webkit-scrollbar-thumb { background: var(--gray-700); border-radius: 3px; }

html,
body {
  margin: 0;
  width: 100%;
  height: 100%;
  background: var(--black);
  color: var(--gray-300);
}

/* `hidden` means hidden, on every page.

   The user agent's `[hidden] { display: none }` has the lowest possible
   precedence, so ANY author `display:` declaration on the element -- a
   `.mfa-label { display: block }`, a `.settings-ack { display: flex }` --
   silently beats it and the element stays on screen with its `hidden`
   property set. chat.css had already hit this trap five separate times and
   patched it per selector; one rule here retires the whole class of bug for
   every document that loads the shell. */
[hidden] {
  display: none !important;
}

body {
  font-family: var(--font-body);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

a {
  color: inherit;
}