@import url('fonts/mallory.css');

:root {
	/* Shared values */
	--nga-imagination-magenta: #d600c5;
	--accent-color: var(--nga-imagination-magenta);
	
	--brushter-panel-corner-radius: 32px;
	--brushter-panel-border-width: 4px;
	--brushter-panel-border-color: white;
	--brushter-control-corner-radius: 12px;
	--brushter-control-border-color: #cccccc;
	--brushter-control-disabled-opacity: 0.6;
	--brushter-selection-ring-width: 4px;
	--brushter-selection-ring-color: black;
	--brushter-shadow-color: rgba(0, 0, 0, 0.2);
	--brushter-link-color: #5263ff; /* Matches nga.gov */
	
	/* Layout */
	--brushter-sidebar-width: 320px;
	--brushter-toolbar-height: 64px;
	--brushter-toolbar-icon-size: 32px;
	--brushter-brush-bar-extra-height: 16px;
	--brushter-brush-bar-control-height: 56px;
	
	--brushter-canvas-z: 1;
	--brushter-sidebar-z: 2;
	--brushter-rooster-z: 3;
	--brushter-toolbar-z: 4;
	--brushter-floating-z: 5;
	
	font-family: 'Mallory', sans-serif;
	font-weight: 300;
	accent-color: var(--accent-color);
}

html,
body {
	margin: 0;
	border: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	overscroll-behavior-y: contain; /* Prevent pull-to-refresh. */
}