/* vk house style, served instance-wide by the edge Caddy as /vk-theme.css.
   html:root beats Fluxer's :root defaults; a user's own Quick CSS (:root:root) still wins. */
html:root {
  /* palette */
  --vk-bg: #0f0f0f;
  --vk-surface: #1a1a1a;
  --vk-surface-2: #161616;
  --vk-raised: #222222;
  --vk-border: #2a2a2a;
  --vk-text: #e0e0e0;
  --vk-muted: #888888;
  --vk-accent: #c8a97e;
  --vk-accent-dim: rgb(200 169 126 / 0.14);

  /* type: Georgia for reading, local mono for anything structural, no webfonts */
  --font-sans: Georgia, 'Fluxer Sans', serif;
  --font-mono: ui-monospace, 'JetBrains Mono', 'SF Mono', Menlo, monospace;

  /* surfaces */
  --background-primary: var(--vk-bg);
  --bg-primary: var(--vk-bg);
  --background-secondary: var(--vk-surface-2);
  --bg-secondary: var(--vk-surface-2);
  --background-secondary-alt: var(--vk-surface);
  --background-secondary-lighter: var(--vk-surface);
  --background-tertiary: var(--vk-surface);
  --bg-tertiary: var(--vk-surface);
  --background-channel-header: var(--vk-bg);
  --background-header-primary: var(--vk-surface);
  --background-header-primary-hover: var(--vk-raised);
  --background-header-secondary: var(--vk-surface);
  --background-textarea: var(--vk-surface);
  --composer-surface-color: var(--vk-surface);
  --form-surface-background: var(--vk-surface);
  --guild-list-foreground: var(--vk-surface);
  --guild-badge-surface: var(--vk-surface-2);
  --panel-control-bg: var(--vk-surface);
  --bg-blockquote: var(--vk-surface);
  --bg-code: var(--vk-surface);
  --bg-code-block: var(--vk-surface-2);
  --background-modifier-hover: rgb(255 255 255 / 0.03);
  --bg-hover: rgb(255 255 255 / 0.03);
  --surface-interactive-hover-bg: rgb(255 255 255 / 0.03);
  --background-modifier-selected: var(--vk-accent-dim);
  --bg-active: var(--vk-accent-dim);
  --surface-interactive-selected-bg: var(--vk-accent-dim);
  --surface-interactive-selected-color: var(--vk-accent);
  --background-modifier-accent: var(--vk-border);
  --control-button-hover-bg: var(--vk-surface);
  --control-button-active-bg: var(--vk-raised);
  --control-button-normal-text: var(--vk-muted);
  --control-button-hover-text: var(--vk-accent);
  --control-button-active-text: var(--vk-accent);

  /* text */
  --text-primary: var(--vk-text);
  --text-chat: var(--vk-text);
  --text-secondary: var(--vk-text);
  --text-primary-muted: var(--vk-muted);
  --text-chat-muted: var(--vk-muted);
  --text-tertiary: var(--vk-muted);
  --text-tertiary-muted: #6a6a6a;
  --text-tertiary-secondary: #6a6a6a;
  --text-link: var(--vk-accent);
  --text-selection: rgb(200 169 126 / 0.3);
  --text-on-brand-primary: var(--vk-bg);

  /* accent is punctuation: links, selection, focus, the primary button */
  --brand-primary: var(--vk-accent);
  --brand-secondary: #b39469;
  --brand-primary-light: #dcc4a0;
  --brand-primary-fill: var(--vk-bg);
  --accent-primary: var(--vk-accent);
  --accent-info: #5794f2;
  --accent-success: #73bf69;
  --accent-warning: #e8823a;
  --accent-purple: #b877d9;
  --button-primary-fill: var(--vk-accent);
  --button-primary-active-fill: #b39469;
  --button-primary-text: var(--vk-bg);
  --button-secondary-fill: transparent;
  --button-secondary-active-fill: var(--vk-surface);
  --button-secondary-text: var(--vk-muted);
  --button-secondary-active-text: var(--vk-accent);
  --button-outline-border: 1px solid var(--vk-border);
  --button-outline-active-border: 1px solid var(--vk-accent);
  --button-outline-text: var(--vk-muted);
  --message-mention-color: var(--vk-accent);
  --message-mention-bg: var(--vk-accent-dim);
  --message-mention-bg-hover: rgb(200 169 126 / 0.2);

  /* rules, not cards: 1px borders, no radius, no shadows */
  --border-color: var(--vk-border);
  --border-color-hover: #3a3a3a;
  --border-color-focus: var(--vk-accent);
  --focus-primary: var(--vk-accent);
  --panel-control-border: var(--vk-border);
  --floating-surface-ring-color: var(--vk-border);
  --floating-surface-ring-color-strong: #3a3a3a;
  --message-preview-card-background: var(--vk-surface-2);
  --message-preview-card-border: var(--vk-border);
  --radius-sm: 0;
  --radius-md: 0;
  --radius-lg: 0;
  --radius-xl: 0;
  --radius-2xl: 0;
  --radius-full: 0;
  --media-border-radius: 0;
  --folder-radius: 0;
  --footer-box-radius: 0;
  --active-now-card-radius: 0;
  --active-now-action-radius: 0;
  --friend-row-separator-radius: 0;
  --outline-frame-radius-native: 0;
  --shadow-sm: none;
  --shadow-md: none;
  --shadow-lg: none;
  --shadow-xl: none;
}

/* hover is colour, never motion */
a:hover { color: var(--vk-accent); }