.aoal-toolbar,
.aoal-toolbar *,
.aoal-reading-content {
	box-sizing: border-box;
}

.aoal-toolbar {
	display: flex;
	align-items: stretch;
	width: 100%;
	margin: 0 0 24px;
	padding: 12px 14px;
	color: var(--aoal-text, #27252d);
	font-size: 13px;
	line-height: 1.25;
	background: var(--aoal-toolbar-bg, #fff);
	border: 1px solid var(--aoal-border, #e0e1e4);
	border-radius: var(--aoal-radius, 7px);
	transition: color .2s ease, background .2s ease, border-color .2s ease;
}

.aoal-control {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	min-width: 0;
	padding: 0 18px;
	border-right: 1px solid var(--aoal-border, #e0e1e4);
}

.aoal-control:first-child { padding-left: 6px; }
.aoal-control:last-child { padding-right: 6px; border-right: 0; }
.aoal-font-control { flex: 0 1 245px; }
.aoal-spacing-control { flex: 1 1 370px; }
.aoal-dark-control,
.aoal-reset-control { flex: 0 1 140px; }

.aoal-label {
	font-weight: 600;
	white-space: nowrap;
}

.aoal-buttons {
	display: flex;
	align-items: center;
	gap: 6px;
}

.aoal-toolbar button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 43px;
	height: 36px;
	margin: 0;
	padding: 5px 9px;
	color: var(--aoal-button-text, #27252d);
	font: inherit;
	font-weight: 600;
	line-height: 1;
	background: var(--aoal-button-bg, #fff);
	border: 1px solid var(--aoal-border, #d6d8dc);
	border-radius: calc(var(--aoal-radius, 7px) * .85);
	box-shadow: none;
	cursor: pointer;
	transition: border-color .15s ease, color .15s ease, background .15s ease;
}

.aoal-toolbar button:hover,
.aoal-toolbar button:focus-visible,
.aoal-toolbar button.is-active {
	color: var(--aoal-active-text, #0b9300);
	background: var(--aoal-active-bg, #f8fff7);
	border-color: var(--aoal-active-border, #11b800);
	outline: none;
}

.aoal-toolbar button:focus-visible {
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--aoal-active-border, #11b800) 20%, transparent);
}

.aoal-spacing-control button span {
	margin-right: 4px;
	font-size: 16px;
	transform: scaleX(1.1);
}

.aoal-reset,
.aoal-dark {
	min-width: 40px !important;
	padding: 0 !important;
	font-size: 23px !important;
}

.aoal-reading-content {
	transition: color .2s ease, background .2s ease, font-size .15s ease, line-height .15s ease, padding .2s ease;
}

.aoal-reading-content.has-aoal-font-size p,
.aoal-reading-content.has-aoal-font-size li,
.aoal-reading-content.has-aoal-font-size blockquote {
	font-size: inherit !important;
}

.aoal-reading-content.has-aoal-line-height p,
.aoal-reading-content.has-aoal-line-height li,
.aoal-reading-content.has-aoal-line-height blockquote {
	line-height: inherit !important;
}

.aoal-toolbar.is-aoal-dark {
	color: var(--aoal-dark-text, #f5f5f5);
	background: var(--aoal-dark-toolbar, #24202f);
	border-color: var(--aoal-dark-border, #514b61);
}

.aoal-toolbar.is-aoal-dark .aoal-control {
	border-color: var(--aoal-dark-border, #514b61);
}

.aoal-toolbar.is-aoal-dark button {
	color: var(--aoal-dark-button-text, #fff);
	background: var(--aoal-dark-button, #302b3c);
	border-color: var(--aoal-dark-border, #514b61);
}

.aoal-toolbar.is-aoal-dark button:hover,
.aoal-toolbar.is-aoal-dark button:focus-visible,
.aoal-toolbar.is-aoal-dark button.is-active {
	color: var(--aoal-active-text, #0b9300);
	background: var(--aoal-active-bg, #f8fff7);
	border-color: var(--aoal-active-border, #11b800);
}

.aoal-reading-content.is-aoal-dark {
	padding: var(--aoal-dark-padding, 28px);
	color: var(--aoal-dark-text, #f5f5f5) !important;
	background: var(--aoal-dark-bg, #191625);
	border-radius: var(--aoal-radius, 7px);
}

.aoal-reading-content.is-aoal-dark p,
.aoal-reading-content.is-aoal-dark li,
.aoal-reading-content.is-aoal-dark blockquote,
.aoal-reading-content.is-aoal-dark h1,
.aoal-reading-content.is-aoal-dark h2,
.aoal-reading-content.is-aoal-dark h3,
.aoal-reading-content.is-aoal-dark h4,
.aoal-reading-content.is-aoal-dark h5,
.aoal-reading-content.is-aoal-dark h6,
.aoal-reading-content.is-aoal-dark strong {
	color: inherit !important;
}

.aoal-reading-content.is-aoal-dark a {
	color: var(--aoal-dark-link, #62d957) !important;
}

@media (max-width: 1000px) {
	.aoal-toolbar { align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px; }
	.aoal-control,
	.aoal-control:first-child,
	.aoal-control:last-child { flex: 1 1 auto; padding: 0 12px; border-right: 0; }
}

@media (max-width: 580px) {
	.aoal-toolbar { align-items: stretch; flex-direction: column; padding: 12px; }
	.aoal-control,
	.aoal-control:first-child,
	.aoal-control:last-child {
		justify-content: space-between;
		width: 100%;
		padding: 0 0 12px;
		border-right: 0;
		border-bottom: 1px solid var(--aoal-border, #e0e1e4);
	}
	.aoal-control:last-child { padding-bottom: 0; border-bottom: 0; }
	.aoal-toolbar.is-aoal-dark .aoal-control { border-color: var(--aoal-dark-border, #514b61); }
	.aoal-toolbar button { min-width: 40px; padding: 5px 7px; }
	.aoal-reading-content.is-aoal-dark { padding: min(var(--aoal-dark-padding, 28px), 20px); }
}