/* Shared Lexdum palette and surfaces, used by every page. */
:root, :root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #080808;
  --surface: #121212;
  --text: #f4efe6;
  --muted: #aaa59b;
  --gold: #d7b27c;
  --gold-bright: #e9cc97;
  --gold-deep: #b8925c;
  --line: rgb(226 216 202 / 12%);
  --line-strong: rgb(226 216 202 / 24%);
  --line-faint: rgb(226 216 202 / 7%);
  --sans: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --serif: var(--sans);
  --mono: 'JetBrains Mono', ui-monospace, monospace;
  --font-sans: var(--sans);
  --font-serif: var(--sans);
  --font-mono: var(--mono);
  --surface-0: var(--bg);
  --surface-1: var(--surface);
  --surface-2: #22211e;
  --surface-sidebar: #10100f;
  --surface-hover: #24231f;
  --surface-menu: #191917;
  --text-primary: var(--text);
  --text-secondary: #d0cbc2;
  --text-muted: var(--muted);
  --text-dim: #969087;
  --text-inverse: #18130c;
  --brass: var(--gold);
  --brass-bright: var(--gold-bright);
  --brass-wash: rgb(215 178 124 / 10%);
  --brass-line: rgb(215 178 124 / 32%);
  --overlay: rgb(0 0 0 / 65%);
  --shadow: 0 20px 70px rgb(0 0 0 / 22%);
  --ring: 0 0 0 2px var(--bg), 0 0 0 4px rgb(215 178 124 / 50%);
  --danger: #ec9381;
  --ok: #d7b27c;
  --canvas: var(--bg);
  --surface-soft: var(--surface-2);
  --body: var(--text-secondary);
  --muted-light: var(--text-dim);
  --border: var(--line);
  --primary: var(--gold);
  --primary-soft: var(--brass-wash);
  --success: var(--gold);
  --secondary: #bab4a9;
  --radius-control: 12px;
  --radius-card: 24px;
  --obsidian: var(--bg);
  --ivory: var(--text);
  --ivory-dim: var(--text-secondary);
  --ivory-mute: var(--muted);
  --glass: linear-gradient(135deg, rgb(34 33 31 / 83%), rgb(15 15 14 / 90%));
  --glass-edge: linear-gradient(135deg, rgb(250 233 207 / 28%), rgb(230 218 200 / 4%) 50%, rgb(225 211 186 / 16%));
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f4f1eb;
  --surface: #faf8f4;
  --text: #25221d;
  --muted: #686158;
  --gold: #936b32;
  --gold-bright: #7c5826;
  --surface-2: #eae5db;
  --surface-sidebar: #eeebe5;
  --surface-hover: #e5dfd4;
  --surface-menu: #faf8f4;
  --text-secondary: #484139;
  --text-dim: #736b60;
  --text-inverse: #fff9ef;
  --line: rgb(63 47 23 / 12%);
  --line-strong: rgb(63 47 23 / 25%);
  --overlay: rgb(30 25 16 / 35%);
  --glass: linear-gradient(135deg, rgb(255 253 248 / 90%), rgb(241 236 226 / 90%));
  --glass-edge: linear-gradient(135deg, rgb(120 91 45 / 28%), rgb(120 91 45 / 8%) 50%, rgb(120 91 45 / 20%));
  --danger: #a53f31;
}
body { font-family: var(--sans); color: var(--text); }
::selection { background: var(--gold); color: var(--bg); }
.liquid-glass,
.auth-gate__card, .settings-card, .project-dialog,
.composer, .account-menu, .chat-menu, .attachment-menu,
.metric-card, .data-card, .gate-card, .legal-document > h1 + p {
  border: 1px solid transparent;
  background: var(--glass) padding-box, var(--glass-edge) border-box;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  box-shadow: inset 0 1px 0 rgb(245 235 214 / 4%), var(--shadow);
}
.auth-gate__card, .settings-card, .gate-card { border-radius: 28px; }
.chat-page .app, .chat-page .auth-gate, .chat-page .billing,
.admin-gate, .admin-shell { background: radial-gradient(ellipse at 80% 0, rgb(215 178 124 / 7%), transparent 45%), var(--bg); }
.chat-page .main { background: transparent; }
.chat-page .sidebar { background: var(--glass); border-right-color: var(--line); }
.app-topbar {
  margin: 18px 24px 0;
  padding-inline: 24px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: var(--glass);
  backdrop-filter: blur(18px);
}
.app-topbar { top: 18px; }
.chat-page .new-chat, .google-signin, .billing__choose,
.settings-row__button, .settings-actions button, .button, .btn { border-radius: 999px; }
.chat-page .new-chat { border-color: var(--brass-line); background: var(--brass-wash); }
.chat-page .composer { border-radius: 28px; }
.chat-page .attachment-menu { border-color: var(--line-strong); background: var(--surface-menu); backdrop-filter: none; -webkit-backdrop-filter: none; }
.chat-page .empty__greeting { font-family: var(--sans); font-weight: 600; letter-spacing: -.055em; }
.chat-page .empty__greeting em { color: var(--gold); font-style: normal; }
.avatar, .settings-profile__avatar { background: var(--brass-wash); color: var(--gold); border-color: var(--brass-line); }
.google-signin { border-color: var(--line-strong); background: var(--surface-2); color: var(--text); }
.google-signin:hover { background: var(--surface-hover); }
.billing[role="dialog"] { background: var(--overlay); }
.legal-nav { background: transparent; border: 0; }
.legal-nav .row { border-radius: 999px; }
.legal-main { padding-top: 170px; }
.legal-document > h1 { font: 600 clamp(44px, 6vw, 72px)/1.05 var(--sans); letter-spacing: -.055em; }
.legal-document > h1 + p { border-radius: 22px; }
.legal-document h2 { font: 600 clamp(24px, 3vw, 32px)/1.2 var(--sans); letter-spacing: -.035em; }
.legal-toc { padding: 20px; border: 1px solid var(--line); border-radius: 22px; background: var(--surface); top: 130px; }
.app-sidebar { background: var(--glass); border-color: var(--line); }
.action-button, .dialog-close, .field input, .field select, .field textarea, .input,
dialog { background: var(--surface); color: var(--text); border-color: var(--line-strong); }
dialog { border-radius: 24px; }
.btn-primary, .button--primary { background: var(--gold); color: var(--text-inverse); }
.notice, .form-error { background: rgb(236 147 129 / 9%); color: var(--danger); }
.notice.success, .badge.active, .badge.paid, .badge.captured, .badge.pro, .badge.trial { background: var(--brass-wash); color: var(--gold); }
.badge.expired, .badge.refunded, .badge.revoked { background: rgb(236 147 129 / 9%); color: var(--danger); }
tbody tr:hover { background: var(--surface-hover); }
.app-sidebar .brand, .sample-sidebar .brand, .menu-list button { color: var(--text); }
.avatar-teal, .avatar-blue, .avatar-violet, .avatar-profile { background: var(--brass-wash); color: var(--gold); }
.sidebar-promo, .menu-panel, .ref-card { border-radius: 20px; background: var(--surface); border-color: var(--line); }
@media (max-width: 760px) {
  .app-topbar { margin: 10px 12px 0; padding-inline: 14px; border-radius: 24px; }
  .app-topbar { top: 10px; }
  .legal-main { padding-top: 130px; }
}
@media (prefers-reduced-transparency: reduce) {
  .liquid-glass, .composer, .settings-card, .project-dialog { background: var(--surface); backdrop-filter: none; }
}
