.reader-mode-launch {
	--rm-accent: #b46900;
	--rm-accent-hover: #915500;
	--rm-ink: #20242a;
	--rm-muted: #68707a;
	--rm-surface: #fff;
	--rm-soft: #f4f5f6;
	--rm-line: #d7dade;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .5rem;
	width: fit-content;
	max-width: 100%;
	margin: 1.5rem 0;
	padding: .45rem;
	border: 1px solid var(--rm-line);
	border-radius: .8rem;
	background: var(--rm-surface);
	box-shadow: 0 3px 14px rgb(20 25 30 / 7%);
	color: var(--rm-ink);
	font: 600 14px/1.2 system-ui, -apple-system, "Segoe UI", sans-serif;
}

.reader-mode-launch__button,
.reader-mode-icon-button {
	appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	min-height: 2.55rem;
	margin: 0;
	border: 0;
	border-radius: .5rem;
	font: inherit;
	text-decoration: none !important;
	cursor: pointer;
	transition: background-color .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.reader-mode-launch__button { padding: .65rem .85rem; }
.reader-mode-reader-link { background: transparent; color: var(--rm-accent) !important; }
.reader-mode-reader-link:hover { background: #fff7e8; color: var(--rm-accent-hover) !important; }

.reader-mode-book-icon {
	position: relative;
	width: 1.05rem;
	height: .82rem;
	border: 1.6px solid currentColor;
	border-radius: .15rem;
}
.reader-mode-book-icon::after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	border-left: 1px solid currentColor;
	content: "";
}

.reader-mode-post-speech {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: .3rem;
	padding-left: .5rem;
	border-left: 1px solid var(--rm-line);
}
.reader-mode-post-speech[hidden],
.reader-mode-post-speech [hidden] { display: none !important; }

.reader-mode-speech-toggle { background: var(--rm-ink); color: #fff !important; }
.reader-mode-speech-toggle:hover { background: #080a0d; color: #fff !important; transform: translateY(-1px); }
.reader-mode-speech-toggle[aria-pressed="true"] { background: var(--rm-accent); }
.reader-mode-play-icon {
	width: 0;
	height: 0;
	border-top: .32rem solid transparent;
	border-bottom: .32rem solid transparent;
	border-left: .5rem solid currentColor;
}
.reader-mode-speech-toggle[aria-pressed="true"] .reader-mode-play-icon {
	width: .48rem;
	height: .66rem;
	border: 0;
	border-left: .16rem solid currentColor;
	border-right: .16rem solid currentColor;
}

.reader-mode-icon-button {
	width: 2.55rem;
	padding: 0;
	background: var(--rm-soft);
	color: var(--rm-muted);
}
.reader-mode-icon-button:hover { background: #e8eaed; color: var(--rm-ink); }
.reader-mode-icon-button:disabled { cursor: not-allowed; opacity: .45; }
.reader-mode-speech-settings[aria-expanded="true"] { background: #e8eaed; color: var(--rm-accent); }

.reader-mode-speech-options {
	position: absolute;
	top: calc(100% + .65rem);
	right: 0;
	z-index: 1000;
	display: grid;
	gap: .75rem;
	width: min(20rem, calc(100vw - 2rem));
	padding: .9rem;
	border: 1px solid var(--rm-line);
	border-radius: .7rem;
	background: var(--rm-surface);
	box-shadow: 0 12px 35px rgb(20 25 30 / 17%);
	color: var(--rm-ink);
}
.reader-mode-speech-options::before {
	position: absolute;
	top: -.35rem;
	right: 1rem;
	width: .65rem;
	height: .65rem;
	border-top: 1px solid var(--rm-line);
	border-left: 1px solid var(--rm-line);
	background: var(--rm-surface);
	content: "";
	transform: rotate(45deg);
}
.reader-mode-speech-options label { display: grid; grid-template-columns: 3.4rem 1fr; align-items: center; gap: .65rem; margin: 0; color: var(--rm-muted); font-size: .78rem; }
.reader-mode-speech-options select {
	width: 100%;
	min-width: 0;
	min-height: 2.35rem;
	margin: 0;
	padding: .35rem 1.8rem .35rem .55rem;
	border: 1px solid var(--rm-line);
	border-radius: .4rem;
	background: var(--rm-surface);
	color: var(--rm-ink);
	font: 500 .82rem/1.2 system-ui, -apple-system, "Segoe UI", sans-serif;
}

.reader-mode-launch__button:focus-visible,
.reader-mode-icon-button:focus-visible,
.reader-mode-speech-options select:focus-visible {
	outline: 3px solid color-mix(in srgb, var(--rm-accent) 45%, transparent);
	outline-offset: 2px;
}

.reader-mode-speech-status {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

@media (max-width: 520px) {
	.reader-mode-launch { width: 100%; }
	.reader-mode-reader-link { flex: 1 1 auto; }
	.reader-mode-post-speech { padding-left: .4rem; }
	.reader-mode-speech-options { position: fixed; top: auto; right: 1rem; bottom: 1rem; left: 1rem; width: auto; }
	.reader-mode-speech-options::before { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.reader-mode-launch__button,
	.reader-mode-icon-button { transition: none; }
}