/* Kapelle color tokens. Base ramps are theme-independent; semantic aliases switch with [data-theme]. */
:root {
	/* Stone — warm neutral ramp */
	--stone-0: #ffffff;
	--stone-25: #fbfaf8;
	--stone-50: #f6f5f2;
	--stone-100: #eeece7;
	--stone-150: #e5e2dc;
	--stone-200: #d9d5ce;
	--stone-300: #bfbab1;
	--stone-400: #9a948a;
	--stone-500: #78726a;
	--stone-600: #5d5852;
	--stone-700: #46423d;
	--stone-800: #2f2c29;
	--stone-850: #24221f;
	--stone-900: #1b1a18;
	--stone-950: #131211;
	--stone-1000: #0c0b0a;
	/* Verdigris — the single accent (oxidised copper) */
	--verdigris-50: #e8f4f2;
	--verdigris-100: #cfe8e4;
	--verdigris-200: #a3d3cc;
	--verdigris-300: #6fb8ae;
	--verdigris-400: #3f9a8f;
	--verdigris-500: #1f7f75;
	--verdigris-600: #16675f;
	--verdigris-700: #12524c;
	--verdigris-800: #0f3f3b;
	--verdigris-900: #0b2e2b;
	/* Status ramps (3 stops each: 100 tint, 600 ink, 300 dark-theme ink) */
	--green-100: #e4f1e0;
	--green-300: #8fcf86;
	--green-600: #2f6b2f;
	--green-900: #182716;
	--amber-100: #faeed3;
	--amber-300: #e8b45a;
	--amber-600: #875800;
	--amber-900: #2c220e;
	--red-100: #fae7e4;
	--red-300: #f08a80;
	--red-600: #b0302a;
	--red-900: #321714;
	--blue-100: #e5edf8;
	--blue-300: #93b5ea;
	--blue-600: #2f5d9e;
	--blue-900: #152033;

	/* ---------- Semantic: light (default) ---------- */
	color-scheme: light;
	--bg-app: var(--stone-50);
	--bg-sunken: var(--stone-100);
	--surface-1: var(--stone-0);
	--surface-2: var(--stone-0);
	--surface-hover: var(--stone-100);
	--surface-active: var(--stone-150);
	--surface-selected: var(--verdigris-50);
	--surface-inverse: var(--stone-900);
	--border-subtle: var(--stone-150);
	--border-default: var(--stone-200);
	--border-strong: var(--stone-300);
	--text-1: var(--stone-900);
	--text-2: var(--stone-600);
	--text-3: var(--stone-500);
	--text-disabled: var(--stone-400);
	--text-inverse: var(--stone-25);
	--accent: var(--verdigris-600);
	--accent-hover: var(--verdigris-700);
	--accent-subtle: var(--verdigris-50);
	--accent-border: var(--verdigris-200);
	--accent-text: var(--verdigris-700);
	--on-accent: #ffffff;
	--ink: var(--stone-900);
	--ink-hover: var(--stone-800);
	--on-ink: var(--stone-25);
	--focus-ring: var(--verdigris-500);
	--success-fg: var(--green-600);
	--success-bg: var(--green-100);
	--success-dot: #3d8a3a;
	--warning-fg: var(--amber-600);
	--warning-bg: var(--amber-100);
	--warning-dot: #c98a12;
	--danger-fg: var(--red-600);
	--danger-bg: var(--red-100);
	--danger-dot: #cf3f36;
	--info-fg: var(--blue-600);
	--info-bg: var(--blue-100);
	--info-dot: #3f74c4;
	--neutral-fg: var(--stone-600);
	--neutral-bg: var(--stone-100);
	--neutral-dot: var(--stone-400);
	--code-bg: var(--stone-25);
	--code-gutter: var(--stone-400);
	--syntax-key: var(--verdigris-700);
	--syntax-string: #7a4a12;
	--syntax-comment: var(--stone-500);
	--syntax-var: #2f5d9e;
	--scrim: rgba(19, 18, 17, 0.42);
}
[data-theme="dark"] {
	color-scheme: dark;
	--bg-app: var(--stone-950);
	--bg-sunken: var(--stone-1000);
	--surface-1: var(--stone-900);
	--surface-2: var(--stone-850);
	--surface-hover: var(--stone-850);
	--surface-active: var(--stone-800);
	--surface-selected: #14302d;
	--surface-inverse: var(--stone-100);
	--border-subtle: #2a2825;
	--border-default: #35322e;
	--border-strong: #4a4641;
	--text-1: #ece9e4;
	--text-2: #b0aaa1;
	--text-3: #8f897f;
	--text-disabled: #6a655e;
	--text-inverse: var(--stone-900);
	--accent: var(--verdigris-300);
	--accent-hover: var(--verdigris-200);
	--accent-subtle: #14302d;
	--accent-border: #24534d;
	--accent-text: var(--verdigris-300);
	--on-accent: var(--stone-1000);
	--ink: #ece9e4;
	--ink-hover: #ffffff;
	--on-ink: var(--stone-950);
	--focus-ring: var(--verdigris-300);
	--success-fg: var(--green-300);
	--success-bg: var(--green-900);
	--success-dot: #6fbf65;
	--warning-fg: var(--amber-300);
	--warning-bg: var(--amber-900);
	--warning-dot: #e0a33a;
	--danger-fg: var(--red-300);
	--danger-bg: var(--red-900);
	--danger-dot: #e8675c;
	--info-fg: var(--blue-300);
	--info-bg: var(--blue-900);
	--info-dot: #6f9be0;
	--neutral-fg: #b0aaa1;
	--neutral-bg: var(--stone-850);
	--neutral-dot: #7a746c;
	--code-bg: var(--stone-1000);
	--code-gutter: #5d5852;
	--syntax-key: var(--verdigris-300);
	--syntax-string: #e0b77a;
	--syntax-comment: #7a746c;
	--syntax-var: #93b5ea;
	--scrim: rgba(0, 0, 0, 0.6);
}
