/* Yön Dark — R10 night palette */
:root,
html[data-theme="dark"] {
  --theme-name: yon-dark;

  --color-bg: #333649;
  --color-bg-secondary: #2b2e40;
  --color-bg-tertiary: #262938;
  --color-surface: #3f4257;
  --color-surface-hover: #494c62;
  --color-surface-active: #515365;
  --color-border: rgba(255, 255, 255, 0.08);
  --color-border-light: rgba(255, 255, 255, 0.05);
  --color-border-dark: rgba(255, 255, 255, 0.12);
  --color-text: #f5f8fa;
  --color-text-secondary: #e2e5ee;
  --color-text-muted: #c5c9d4;
  --color-heading: #ffffff;
  --color-primary: #2f6faf;
  --color-primary-hover: #3b82c4;
  --color-primary-ink: #d4e7ff;
  --color-primary-ink-hover: #eef6ff;
  --color-primary-light: rgba(74, 144, 226, 0.16);
  --color-accent: #8b7cf0;
  --color-accent-hover: #9b8ef5;
  --color-accent-light: rgba(139, 124, 240, 0.16);
  --color-success: #35c98a;
  --color-success-light: rgba(53, 201, 138, 0.14);
  --color-warning: #f5b84b;
  --color-warning-light: rgba(245, 184, 75, 0.14);
  --color-danger: #f15b5b;
  --color-danger-light: rgba(241, 91, 91, 0.14);
  --success: #1f8f5a;
  --success-soft: rgba(53, 201, 138, 0.14);
  --success-text: #86efac;
  --danger-soft: rgba(241, 91, 91, 0.14);
  --danger-text: #fca5a5;
  --warning-soft: rgba(245, 184, 75, 0.14);
  --warning-text: #fcd34d;
  --info-soft: rgba(75, 168, 209, 0.14);
  --info-text: #a5d8f0;
  --color-info: #4ba8d1;
  --color-info-light: rgba(75, 168, 209, 0.14);
  --color-input: #2b2e40;
  --color-input-border: rgba(255, 255, 255, 0.12);
  --color-input-placeholder: #c5c9d4;
  --color-link: #d4e7ff;
  --color-link-hover: #eef6ff;
  --color-divider: rgba(255, 255, 255, 0.08);
  --color-shadow: rgba(0, 0, 0, 0.28);

  --chrome-bg: #3f4257;
  --chrome-nav: #333649;
  --chrome-surface: #494c62;
  --chrome-hover: rgba(255, 255, 255, 0.06);
  --chrome-active-bg: rgba(74, 144, 226, 0.18);
  --chrome-text: #c5c8d2;
  --chrome-text-hover: #ffffff;
  --chrome-muted: #9a9ead;
  --chrome-border: rgba(255, 255, 255, 0.08);
  --chrome-search: #494c62;
  --nx-catbar: #2f3345;

  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 10px;
  --shadow-sm: 0 1px 2px var(--color-shadow);
  --shadow-md: 0 4px 14px var(--color-shadow);
  --shadow-lg: 0 10px 28px var(--color-shadow);

  --r10-dark-bg: var(--color-bg);
  --r10-dark-surface: var(--color-surface);
  --r10-dark-secondary: var(--color-surface-hover);
  --r10-dark-tertiary: var(--color-surface-active);
  --r10-dark-text: var(--color-text);
  --r10-dark-text-secondary: var(--color-text-secondary);
  --r10-dark-muted: var(--color-text-muted);
  --r10-dark-border: var(--color-border);
  --r10-primary: var(--color-primary);
  --r10-primary-hover: var(--color-primary-hover);
  --r10-primary-active: #3a7bc8;
  --r10-success: var(--color-success);
  --r10-warning: var(--color-warning);
  --r10-warning-strong: #d89522;
  --r10-danger: var(--color-danger);
  --r10-info: var(--color-info);
  --r10-online: var(--color-success);
  --r10-link-visited: var(--color-link);

  --color-background: var(--color-bg);
  --color-surface-2: var(--color-bg-secondary);
  --color-elevated: var(--color-surface-hover);
  --color-hover: var(--color-surface-hover);
  --color-active: var(--color-surface-active);
  --color-border-soft: var(--color-border-light);
  --color-muted: var(--color-text-muted);
  --color-disabled: #6f7283;
  --color-placeholder: var(--color-input-placeholder);
  --color-meta: var(--color-text-muted);
  --color-primary-active: #3a7bc8;
  --color-warning-strong: #d89522;
  --color-premium: var(--color-accent);
  --color-online: var(--color-success);
  --color-link-visited: var(--color-link);
  --color-focus-ring: rgba(74, 144, 226, 0.22);
  --color-overlay: rgba(0, 0, 0, 0.5);
  --color-soft-primary: var(--color-primary-light);
  --color-soft-success: var(--color-success-light);
  --color-soft-warning: var(--color-warning-light);
  --color-soft-danger: var(--color-danger-light);
  --color-soft-info: var(--color-info-light);
  --color-soft-premium: var(--color-accent-light);
  --color-input-bg: var(--color-input);
  --btn-primary-bg: var(--color-primary);
  --color-on-primary: #ffffff;

  --mast-bg: var(--chrome-bg);
  --mast-nav: var(--chrome-nav);
  --mast-link: var(--chrome-text);
  --mast-link-hover: var(--chrome-text-hover);
  --mast-link-bg: var(--chrome-hover);
  --mast-search-bg: var(--chrome-search);
  --header-line: var(--chrome-border);
  --mast-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
  --mast-active-bg: var(--chrome-active-bg);

  --post-bg: var(--color-surface);
  --post-hover: var(--color-surface-hover);
  --bg: var(--color-background);
  --bg-soft: var(--color-elevated);
  --card: var(--color-surface);
  --text: var(--color-text);
  --muted: var(--color-muted);
  --line: var(--color-border);
  --accent: var(--color-primary);
  --accent-2: var(--color-primary-hover);
  --nx-radius: 6px;
  --surface-tint: transparent;
  --surface-border: var(--color-border);
  --focus-ring: 0 0 0 3px var(--color-primary-light);
  --frame-inner: min(1680px, calc(100% - 20px));
  color-scheme: dark;
}
