:root[data-theme="dark"]{

	--accent: #4da3ff;
	--accent-hover: #6fb5ff;
	--accent-dark: #8cc4ff;
	--accent-pale: #2b6cb0;
	--accent-light: #3d84cc;
	--focus-ring: rgba(77, 163, 255, .3);
	--on-accent: #0b1220;

	--badge-text: #fff;

	--bg: #14171d;

	--bg-gradient: radial-gradient(1000px 1000px at 50% 50%, rgba(77, 163, 255, .12), rgba(77, 163, 255, 0) 70%);
	--surface: #1c2027;
	--surface-hover: #262b34;
	--surface-2: #232830;
	--surface-raised: #1c2027;
	--text: #b7bfcc;
	--text-mid: #d0d6e1;
	--text-strong: #e8edf5;
	--muted: #5a6373;
	--on-muted: #14171d;
	--on-dark: #e8edf5;
	--soft: #2a3039;
	--shadow: #000;
	--danger: #ff6b6b;
	--effect: #6cc38a;
	--length: #a98cd8;
	--repeat: #62b0ff;

	--field-bg: #1c2027;
	--field-text: #d6dde8;
	--label-text: #8e99a8;
	--faint-text: #8e99a8;
	--border: #39414d;
	--table-border: #2a3039;
	--row-hover: rgba(255, 255, 255, .05);
	--card-border: rgba(255, 255, 255, .09);
	--card-header-bg: rgba(255, 255, 255, .03);

	--navbar-bg: #0c0f14;
	--navbar-brand: #e8edf5;
	--navbar-link: rgba(232, 237, 245, .55);
	--navbar-link-hover: rgba(232, 237, 245, .8);
	--navbar-link-active: #fff;
	--navbar-toggler-border: rgba(232, 237, 245, .15);

	--blow: #d99a9a;
	--draw: #8fb6dd;
	--harp-text: #14171d;
	--harp-text-outline: #cfd6e0;
	--harp-frame: #0c0f14;
	--comb-bg: #2a3039;
	--holenum-bg: #05070a;
	--bend: #6b5836;
	--overbend: #6e3f3f;

	--current-bg: #2a6fbd;
	--on-chip: #fff;
	--on-current: #fff;

	--key-white: #cfd6e0;
	--key-white-edge: #8e97a5;
	--key-label-signed: #3a4250;
	--key-border: #0c0f14;
	--key-black: #0a0d12;
	--key-black-edge: #2a3039;
	--stave-line: #98a2b3;
	--stave-faint: #2f353e;
	--stave-hover: rgba(255, 255, 255, .07);

	--circle-note: #cfd6e0;
	--accent-tint-1: #16202c;
	--accent-tint-2: #1d2c3d;
	--accent-tint-3: #26394f;
	--ring-1: #1b2733;
	--ring-2: #24384c;
	--circle-pointer: #cfd6e0;
	--on-ring: #e8edf5;
	--on-ring-soft: #8fb6dd;
	--callout-bg: #17222f;

	--beat-main: #e8edf5;
}