/* Graphite and cool silver. Shared glass behavior lives in material-glass.css. */
@layer themes {
:root:not([data-theme]),
:root[data-theme="liquid-glass"],
:root[data-theme="liquid-glass"] body {
  color-scheme: dark;
  --sys-bg-base: #10151d;
  --sys-bg-raised: #242e3c;
  --sys-bg-high: #344154;
  --sys-bg-overlay: #1c2430;
  --sys-on-surface: #f0f3f8;
  --sys-on-surface-variant: #d5dde8;
  --sys-on-surface-muted: #b9c4d3;
  --sys-accent: #c7d1e1;
  --sys-accent-strong: #42546c;
  --sys-accent-alt: #a4b5ca;
  --sys-accent-gradient: linear-gradient(135deg, #42546c, #344255);
  --sys-accent-gradient-hover: linear-gradient(135deg, #4d617c, #3e5067);
  --sys-surface: rgba(164, 181, 202, .09);
  --sys-border: rgba(164, 181, 202, .24);
  --sys-border-strong: rgba(164, 181, 202, .48);
  --sys-surface-hover: rgba(164, 181, 202, .14);
  --sys-blur: 8px;
  --sys-surface-shell: linear-gradient(135deg, rgba(164, 181, 202, .17), rgba(8, 12, 20, .22) 60%, rgba(164, 181, 202, .055));
  --sys-surface-plate: linear-gradient(145deg, rgba(36, 46, 60, .95), rgba(28, 36, 48, .96));
  --sys-surface-control: linear-gradient(135deg, rgba(164, 181, 202, .12), rgba(164, 181, 202, .035));
  --sys-elevation-2: inset 0 1px 0 rgba(255, 255, 255, .19), inset 1px 0 0 rgba(255, 255, 255, .045), inset 0 -1px 0 rgba(8, 12, 20, .22), 0 10px 26px rgba(0, 0, 0, .13);
  --sys-elevation-1: inset 0 1px 0 rgba(255, 255, 255, .19), inset 0 -1px 0 rgba(164, 181, 202, .045), 0 3px 10px rgba(0, 0, 0, .1);
  --sys-refraction: blur(10px) saturate(108%);
  --sys-refraction-subtle: blur(7px) saturate(108%);
  --comp-bubble-own-bg: linear-gradient(135deg, rgba(164, 181, 202, .19), rgba(164, 181, 202, .08));
  --comp-bubble-own-border: rgba(164, 181, 202, .31);
  --comp-bubble-other-bg: linear-gradient(135deg, rgba(8, 12, 19, .42), rgba(164, 181, 202, .045));
  --comp-bubble-other-border: rgba(164, 181, 202, .22);
  --comp-glass-bubble-filter: blur(4px) saturate(106%);
  --comp-glass-bubble-shadow: inset 0 1px 0 rgba(255, 255, 255, .19), inset 0 -1px 0 rgba(164, 181, 202, .045), 0 4px 14px rgba(0, 0, 0, .1);
  --comp-glass-bubble-own-solid: #344154;
  --comp-glass-bubble-other-solid: #1c2430;
  --comp-glass-rim: linear-gradient(130deg, rgba(255, 255, 255, .08), transparent 30%, transparent 76%, rgba(164, 181, 202, .035));
  /* Keep reactions, selection and focus in the same cool-silver palette. */
  --ref-graphite-accent-soft: rgba(164, 181, 202, .14);
  --ref-graphite-accent-line: rgba(164, 181, 202, .42);
  --ref-graphite-accent-ring: 0 0 0 3px rgba(164, 181, 202, .18);
  --comp-pill-mine-bg: var(--ref-graphite-accent-soft);
  --comp-pill-active-bg: var(--ref-graphite-accent-soft);
  --comp-pill-active-border: var(--ref-graphite-accent-line);
  --comp-input-type-text-focus-border: var(--sys-accent);
  --comp-input-type-text-focus-bg: var(--ref-glass-input);
  --comp-input-type-text-focus-shadow: var(--ref-graphite-accent-ring);
  --comp-input-type-text-focus-bg-2: var(--ref-glass-input);
  --comp-input-type-text-focus-shadow-2: var(--ref-graphite-accent-ring);
  --comp-message-highlight-shadow: var(--ref-graphite-accent-ring);
  --comp-message-link-color: var(--sys-accent);
  --comp-message-link-hover-color: var(--sys-on-surface);
  --comp-summary-hover-color: var(--sys-accent);
  --comp-message-more-open-summary-background: var(--ref-graphite-accent-soft);
  --comp-message-action-hover-bg: var(--ref-graphite-accent-soft);
  --comp-message-action-hover-border: var(--ref-graphite-accent-line);
  --comp-message-menu-item-hover-bg: var(--ref-graphite-accent-soft);
  --comp-message-menu-item-hover-border: var(--ref-graphite-accent-line);
  --comp-emoji-suggestion-aria-selected-true-bg: var(--ref-graphite-accent-soft);
  --comp-poll-option-progress-background: linear-gradient(90deg, rgba(164, 181, 202, .22), rgba(199, 209, 225, .14));
  --comp-poll-option-is-selected-shadow: var(--sys-elevation-1);
  --comp-message-mention-color: var(--sys-accent);
  --comp-message-mention-background: var(--ref-graphite-accent-soft);
  --comp-message-mention-border: 1px solid var(--ref-graphite-accent-line);
  --comp-button-hover-bg: var(--ref-graphite-accent-soft);
  --comp-theme-option-card-is-selected-bg: var(--ref-graphite-accent-soft);
  --comp-button-mini-hover-shadow: var(--sys-elevation-2);
  --comp-button-send-shadow: var(--sys-elevation-1);
  --comp-button-send-hover-shadow: var(--sys-elevation-2);
  --comp-button-cta-shadow: var(--sys-elevation-1);
  --comp-button-cta-hover-shadow: var(--sys-elevation-2);
  --comp-button-dialog-primary-shadow: var(--sys-elevation-1);
  --comp-button-dialog-primary-hover-shadow: var(--sys-elevation-2);
  --ref-glass-regular: rgba(36, 46, 60, .95);
  --ref-glass-input: rgba(6, 10, 18, .16);
  --ref-glass-shadow: rgba(0, 0, 0, .13);
  --ref-glass-texture: rgba(164, 181, 202, .005);
  --ref-glass-scene: url("crystal-liquid-scene.svg");
}
}