.siteable-skip-link {
	background: #111827;
	color: #ffffff;
	font-weight: 700;
	left: 16px;
	padding: 10px 14px;
	position: fixed;
	top: 12px;
	transform: translateY(-140%);
	transition: transform 160ms ease;
	z-index: 1000000;
}

.siteable-skip-link:focus {
	color: #ffffff;
	outline: 3px solid #facc15;
	outline-offset: 2px;
	transform: translateY(0);
}

.siteable-main-target {
	display: block;
	height: 0;
	outline: 0;
	position: relative;
	top: 0;
}

.siteable-widget {
	bottom: 22px;
	position: fixed;
	z-index: 999999;
}

.siteable-widget--right {
	right: 22px;
}

.siteable-widget--left {
	left: 22px;
}

.siteable-widget,
.siteable-widget * {
	box-sizing: border-box;
}

html {
	--siteable-color-filter: none;
	--siteable-saturation-filter: saturate(1);
	--siteable-slider-saturation: saturate(1);
	--siteable-font-size: 100%;
	--siteable-letter-spacing: 0;
	--siteable-line-height: 1.45;
	--siteable-word-spacing: 0;
}

.siteable-widget__trigger {
	align-items: center;
	background: var(--siteable-accent, #1457d9);
	border: 0;
	border-radius: 999px;
	box-shadow: 0 12px 30px rgba(15, 23, 42, 0.3);
	color: #ffffff;
	cursor: pointer;
	display: inline-flex;
	font: 700 24px/1 Arial, Helvetica, sans-serif;
	height: 58px;
	justify-content: center;
	width: 58px;
}

.siteable-widget__trigger:focus-visible,
.siteable-panel button:focus-visible {
	outline: 3px solid #facc15;
	outline-offset: 3px;
}

.siteable-widget__icon {
	border: 2px solid currentColor;
	border-radius: 999px;
	display: inline-flex;
	height: 34px;
	justify-content: center;
	line-height: 29px;
	width: 34px;
}

.siteable-panel {
	background: #ffffff;
	border: 1px solid #d8dee8;
	border-radius: 8px;
	bottom: 74px;
	box-shadow: 0 22px 60px rgba(15, 23, 42, 0.28);
	color: #111827;
	font-family: Arial, Helvetica, sans-serif;
	max-height: min(680px, calc(100vh - 110px));
	overflow: auto;
	position: absolute;
	width: min(500px, calc(100vw - 28px));
}

.siteable-widget--right .siteable-panel {
	right: 0;
}

.siteable-widget--left .siteable-panel {
	left: 0;
}

.siteable-panel__header {
	align-items: center;
	background: var(--siteable-accent, #1457d9);
	color: #ffffff;
	display: flex;
	gap: 16px;
	justify-content: space-between;
	padding: 16px;
}

.siteable-panel__header strong,
.siteable-panel__header span {
	display: block;
}

.siteable-panel__header strong {
	font-size: 18px;
	line-height: 1.2;
}

.siteable-panel__header span {
	color: #d1d5db;
	font-size: 13px;
	line-height: 1.3;
	margin-top: 2px;
}

.siteable-panel__close {
	background: transparent;
	border: 0;
	color: #ffffff;
	cursor: pointer;
	font-size: 30px;
	height: 38px;
	line-height: 1;
	width: 38px;
}

.siteable-panel__intro {
	background: #eff6ff;
	border-bottom: 1px solid #dbeafe;
	color: #1e3a8a;
	font: 700 13px/1.4 Arial, Helvetica, sans-serif;
	padding: 12px 16px;
}

.siteable-panel__controls {
	display: grid;
	gap: 14px;
	padding: 14px;
}

.siteable-control-group {
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	padding: 10px;
}

.siteable-control-group__header {
	margin-bottom: 8px;
}

.siteable-control-group__header h3 {
	color: #111827;
	font: 800 14px/1.25 Arial, Helvetica, sans-serif;
	margin: 0;
}

.siteable-control-grid {
	display: grid;
	gap: 8px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.siteable-control-grid button,
.siteable-panel__reset {
	background: #f8fafc;
	border: 1px solid #cbd5e1;
	border-radius: 6px;
	color: #111827;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	gap: 8px;
	justify-content: center;
	font: 700 13px/1.25 Arial, Helvetica, sans-serif;
	align-items: center;
	min-height: 96px;
	overflow-wrap: anywhere;
	padding: 10px;
	text-align: center;
}

.siteable-control-grid button[data-siteable-profile] {
	background: #eef2ff;
	border-color: #a5b4fc;
	color: #312e81;
}

.siteable-control-grid button[aria-pressed="true"] {
	background: var(--siteable-accent, #1457d9);
	border-color: var(--siteable-accent, #1457d9);
	color: #ffffff;
}

.siteable-control-icon,
.siteable-control-title {
	display: block;
}

.siteable-control-icon {
	color: var(--siteable-accent, #1457d9);
	font-size: 30px;
	height: 32px;
	line-height: 32px;
	width: 32px;
}

.siteable-control-grid button[aria-pressed="true"] .siteable-control-icon {
	color: #ffffff;
}

.siteable-control-title {
	font-size: 13px;
	line-height: 1.2;
	width: 100%;
}

.siteable-tool-options {
	background: #f8fafc;
	border-top: 1px solid #e5e7eb;
	padding: 14px;
}

.siteable-tool-options[hidden] {
	display: none;
}

.siteable-tool-options__header strong,
.siteable-tool-options__header span {
	display: block;
}

.siteable-tool-options__header strong {
	color: #111827;
	font: 800 14px/1.25 Arial, Helvetica, sans-serif;
}

.siteable-tool-options__header span {
	color: #4b5563;
	font: 600 12px/1.35 Arial, Helvetica, sans-serif;
	margin-top: 3px;
}

.siteable-tool-options__actions {
	display: grid;
	gap: 8px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin-top: 10px;
}

.siteable-tool-options__actions button {
	background: #ffffff;
	border: 1px solid #cbd5e1;
	border-radius: 6px;
	color: #111827;
	cursor: pointer;
	font: 800 12px/1.25 Arial, Helvetica, sans-serif;
	min-height: 42px;
	padding: 8px;
	text-align: center;
}

.siteable-range {
	display: grid;
	gap: 8px;
	margin-top: 12px;
}

.siteable-range span {
	align-items: center;
	color: #111827;
	display: flex;
	font: 800 13px/1.25 Arial, Helvetica, sans-serif;
	justify-content: space-between;
}

.siteable-range output {
	color: var(--siteable-accent, #1457d9);
	font-weight: 900;
}

.siteable-range input[type="range"] {
	accent-color: var(--siteable-accent, #1457d9);
	min-height: 34px;
	width: 100%;
}

.siteable-tool-note {
	color: #374151;
	font: 700 13px/1.4 Arial, Helvetica, sans-serif;
	margin: 10px 0 0;
}

.siteable-panel__footer {
	align-items: center;
	border-top: 1px solid #e5e7eb;
	display: flex;
	gap: 12px;
	justify-content: flex-start;
	padding: 14px;
	flex-wrap: wrap;
}

.siteable-panel__footer span {
	color: #4b5563;
	font: 600 12px/1.3 Arial, Helvetica, sans-serif;
}

.siteable-panel__reset {
	min-height: 40px;
	padding-inline: 14px;
}

.siteable-panel__report-toggle {
	background: #ffffff;
	border: 1px solid #cbd5e1;
	border-radius: 6px;
	color: #111827;
	cursor: pointer;
	font: 700 13px/1.25 Arial, Helvetica, sans-serif;
	min-height: 40px;
	padding: 10px 14px;
}

.siteable-structure {
	border-top: 1px solid #e5e7eb;
	max-height: 180px;
	overflow: auto;
	padding: 12px 14px;
}

.siteable-structure ol {
	margin: 0;
	padding-left: 20px;
}

.siteable-structure li {
	margin: 0 0 8px;
}

.siteable-structure button {
	background: transparent;
	border: 0;
	color: #1457d9;
	cursor: pointer;
	font: 700 13px/1.35 Arial, Helvetica, sans-serif;
	padding: 0;
	text-align: left;
}

.siteable-report {
	border-top: 1px solid #e5e7eb;
	display: grid;
	gap: 12px;
	padding: 14px;
}

.siteable-report[hidden] {
	display: none;
}

.siteable-report label,
.siteable-report label span {
	display: block;
}

.siteable-report label span {
	color: #111827;
	font: 700 13px/1.35 Arial, Helvetica, sans-serif;
	margin-bottom: 5px;
}

.siteable-report textarea,
.siteable-report input {
	border: 1px solid #cbd5e1;
	border-radius: 6px;
	color: #111827;
	font: 14px/1.4 Arial, Helvetica, sans-serif;
	padding: 9px;
	width: 100%;
}

.siteable-report button[type="submit"] {
	background: var(--siteable-accent, #1457d9);
	border: 0;
	border-radius: 6px;
	color: #ffffff;
	cursor: pointer;
	font: 700 13px/1.25 Arial, Helvetica, sans-serif;
	min-height: 42px;
	padding: 10px 14px;
}

.siteable-report__success {
	background: #dcfce7;
	border: 1px solid #86efac;
	border-radius: 6px;
	color: #14532d;
	font: 700 13px/1.35 Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 9px;
}

.siteable-reading-guide {
	background: rgba(250, 204, 21, 0.35);
	border-block: 2px solid rgba(133, 77, 14, 0.45);
	display: none;
	height: 38px;
	left: 0;
	pointer-events: none;
	position: fixed;
	right: 0;
	top: -19px;
	z-index: 999998;
}

.siteable-guide .siteable-reading-guide {
	display: block;
}

html[data-siteable-font-scale="-1"] body {
	font-size: 90% !important;
}

html[data-siteable-font-scale="1"] body {
	font-size: 112% !important;
}

html[data-siteable-font-scale="2"] body {
	font-size: 125% !important;
}

html[data-siteable-font-scale="3"] body {
	font-size: 140% !important;
}

html body {
	font-size: var(--siteable-font-size, inherit) !important;
}

html.siteable-contrast body,
html.siteable-contrast body *:not(.siteable-widget):not(.siteable-widget *) {
	background-color: #000000 !important;
	color: #ffffff !important;
}

html.siteable-contrast a,
html.siteable-contrast button:not(.siteable-widget button) {
	color: #facc15 !important;
}

html.siteable-dark body,
html.siteable-dark body *:not(.siteable-widget):not(.siteable-widget *) {
	background-color: #111827 !important;
	color: #f9fafb !important;
}

html.siteable-light body,
html.siteable-light body *:not(.siteable-widget):not(.siteable-widget *) {
	background-color: #ffffff !important;
	color: #111827 !important;
}

html.siteable-invert {
	--siteable-color-filter: invert(1) hue-rotate(180deg);
}

html.siteable-links a:not(.siteable-skip-link) {
	background-color: #fef08a !important;
	color: #111827 !important;
	outline: 2px solid #ca8a04 !important;
	outline-offset: 2px !important;
	text-decoration: underline !important;
}

html.siteable-headings h1,
html.siteable-headings h2,
html.siteable-headings h3,
html.siteable-headings h4,
html.siteable-headings h5,
html.siteable-headings h6 {
	background-color: #dbeafe !important;
	box-shadow: 0 0 0 3px #2563eb !important;
	color: #111827 !important;
}

html.siteable-readable body {
	font-family: Arial, Verdana, Tahoma, sans-serif !important;
}

html.siteable-readablemode body {
	background: #ffffff !important;
	color: #111827 !important;
	font-family: Arial, Verdana, Tahoma, sans-serif !important;
	line-height: 1.75 !important;
}

html.siteable-readablemode body > *:not(.siteable-widget):not(script):not(style) {
	max-width: 920px !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

html.siteable-spacing body,
html.siteable-spacing p:not(.siteable-widget *),
html.siteable-spacing li:not(.siteable-widget *),
html.siteable-spacing a:not(.siteable-widget *),
html.siteable-spacing button:not(.siteable-widget *),
html.siteable-spacing input:not(.siteable-widget *),
html.siteable-spacing textarea:not(.siteable-widget *) {
	letter-spacing: var(--siteable-letter-spacing, 0.08em) !important;
	line-height: var(--siteable-line-height, 1.85) !important;
	word-spacing: var(--siteable-word-spacing, 0.14em) !important;
}

html.siteable-spacing .siteable-widget,
html.siteable-spacing .siteable-widget * {
	letter-spacing: 0 !important;
	line-height: normal !important;
	word-spacing: normal !important;
}

html.siteable-focus a:focus,
html.siteable-focus button:focus,
html.siteable-focus input:focus,
html.siteable-focus select:focus,
html.siteable-focus textarea:focus,
html.siteable-focus [tabindex]:focus {
	outline: 4px solid #facc15 !important;
	outline-offset: 4px !important;
}

html.siteable-pause *,
html.siteable-pause *::before,
html.siteable-pause *::after {
	animation-duration: 0.001ms !important;
	animation-iteration-count: 1 !important;
	scroll-behavior: auto !important;
	transition-duration: 0.001ms !important;
}

html.siteable-images img,
html.siteable-images picture,
html.siteable-images svg,
html.siteable-images video,
html.siteable-images canvas {
	visibility: hidden !important;
}

html.siteable-enlargebuttons button:not(.siteable-widget button),
html.siteable-enlargebuttons input[type="button"],
html.siteable-enlargebuttons input[type="submit"],
html.siteable-enlargebuttons .button {
	min-height: 48px !important;
	min-width: 48px !important;
	padding: 14px 18px !important;
}

html.siteable-desaturate {
	--siteable-saturation-filter: saturate(0.1);
}

html.siteable-saturate {
	--siteable-saturation-filter: saturate(1.8);
}

html.siteable-invert body > *:not(.siteable-widget),
html.siteable-desaturate body > *:not(.siteable-widget),
html.siteable-saturate body > *:not(.siteable-widget) {
	filter: var(--siteable-color-filter) var(--siteable-saturation-filter) var(--siteable-slider-saturation) !important;
}

html.siteable-cursor,
html.siteable-cursor * {
	cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cpath fill='%23000' stroke='%23fff' stroke-width='2' d='M8 4l28 25-13 2-6 13z'/%3E%3C/svg%3E") 4 4, auto !important;
}

.siteable-magnified-text {
	background: #fef3c7 !important;
	box-shadow: 0 0 0 3px #f59e0b !important;
	color: #111827 !important;
	font-size: 135% !important;
	position: relative;
	z-index: 999997;
}

@media (max-width: 480px) {
	.siteable-widget {
		bottom: 14px;
	}

	.siteable-widget--right {
		right: 14px;
	}

	.siteable-widget--left {
		left: 14px;
	}

	.siteable-panel {
		bottom: 68px;
	}

	.siteable-control-grid,
	.siteable-tool-options__actions {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}