/* ============================================================
   TBN Content Reader — Frontend Styles
   Theme: Deep navy / charcoal base with warm gold accent,
   matching The Book Notes premium academic branding.
   ============================================================ */

/* GTranslate shortcode wrapper — centered above the header */
.tbn-gtranslate-wrap {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 0 10px;
}

.tbn-reader {
	--tbn-accent: #d4af37;
	--tbn-navy-900: #0b1220;
	--tbn-navy-800: #101a2e;
	--tbn-navy-700: #16223b;
	--tbn-navy-600: #1c2c4a;
	--tbn-text: #e9edf5;
	--tbn-text-dim: #aab4c8;
	--tbn-radius: 14px;
	position: relative;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	color: var(--tbn-text);
	max-width: 100%;
	isolation: isolate;
}

.tbn-reader * { box-sizing: border-box; }

/* ---------------- Sticky / 3D Header ---------------- */

.tbn-header {
	position: sticky; /* desktop default; JS switches to fixed positioning below 782px for reliable mobile pinning */
	top: 0;
	z-index: 9999;
	background: linear-gradient(135deg, var(--tbn-navy-900) 0%, var(--tbn-navy-800) 55%, var(--tbn-navy-700) 100%);
	border-bottom: 1px solid rgba(212,175,55,0.25);
	box-shadow: 0 10px 30px -12px rgba(0,0,0,0.55), 0 1px 0 rgba(255,255,255,0.03) inset;
	border-radius: var(--tbn-radius) var(--tbn-radius) 0 0;
	transform-style: preserve-3d;
	transition: box-shadow .3s ease, border-radius .3s ease;
}

.tbn-header.tbn-is-stuck {
	border-radius: 0;
	box-shadow: 0 14px 34px -10px rgba(0,0,0,0.65);
}

.tbn-header-inner {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 12px 18px;
	position: relative;
}

/* subtle animated gold sheen line */
.tbn-header::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: -1px;
	height: 2px;
	background: linear-gradient(90deg, transparent, var(--tbn-accent), transparent);
	background-size: 200% 100%;
	animation: tbnSheen 5s linear infinite;
	opacity: .8;
}
@keyframes tbnSheen {
	0% { background-position: 200% 0; }
	100% { background-position: -200% 0; }
}

/* TOC toggle button */
.tbn-toc-toggle {
	display: flex;
	align-items: center;
	gap: 8px;
	background: rgba(212,175,55,0.08);
	border: 1px solid rgba(212,175,55,0.35);
	color: var(--tbn-accent);
	padding: 9px 14px;
	border-radius: 10px;
	cursor: pointer;
	font-weight: 600;
	font-size: 13px;
	letter-spacing: .02em;
	transition: transform .18s ease, background .2s ease, box-shadow .2s ease;
	transform: translateZ(0);
	flex-shrink: 0;
}
.tbn-toc-toggle:hover {
	background: rgba(212,175,55,0.16);
	transform: translateY(-1px);
	box-shadow: 0 6px 16px -6px rgba(212,175,55,0.4);
}
.tbn-toc-toggle:active { transform: translateY(0) scale(.97); }

.tbn-toc-icon { display: inline-flex; flex-direction: column; gap: 3px; width: 16px; }
.tbn-toc-icon span {
	display: block; height: 2px; width: 100%; background: currentColor; border-radius: 2px;
	transition: transform .25s ease, opacity .25s ease;
}
.tbn-toc-toggle[aria-expanded="true"] .tbn-toc-icon span:nth-child(1) { transform: translateY(5px) rotate(45deg); }
.tbn-toc-toggle[aria-expanded="true"] .tbn-toc-icon span:nth-child(2) { opacity: 0; }
.tbn-toc-toggle[aria-expanded="true"] .tbn-toc-icon span:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }

.tbn-toc-toggle-label { white-space: nowrap; }
@media (max-width: 560px) { .tbn-toc-toggle-label { display: none; } }

/* Title — centered in the header */
.tbn-header-title {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	line-height: 1.25;
	text-align: center;
}
.tbn-title-text {
	font-size: 16px;
	font-weight: 700;
	color: var(--tbn-text);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 100%;
}
@media (max-width: 480px) { .tbn-title-text { font-size: 13px; } }

/* ---------------- TOC Panel (top-left dropdown) ---------------- */

.tbn-toc-panel {
	position: absolute;
	top: 100%;
	left: 0;
	width: 320px;
	max-width: 90vw;
	max-height: 0;
	overflow: hidden;
	background: var(--tbn-navy-800);
	border-radius: 0 0 var(--tbn-radius) var(--tbn-radius);
	border: 1px solid rgba(212,175,55,0.2);
	border-top: none;
	box-shadow: 0 24px 60px -16px rgba(0,0,0,0.65);
	transition: max-height .35s cubic-bezier(.2,.8,.2,1), opacity .25s ease;
	opacity: 0;
	z-index: 9998;
}
.tbn-toc-panel.tbn-open { max-height: 70vh; opacity: 1; }

.tbn-toc-panel-head {
	display: flex; align-items: center; justify-content: space-between;
	padding: 14px 16px 10px;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--tbn-accent);
	border-bottom: 1px solid rgba(255,255,255,0.08);
}
.tbn-toc-close {
	background: none; border: none; color: var(--tbn-text-dim);
	font-size: 20px; line-height: 1; cursor: pointer; padding: 2px 6px; border-radius: 6px;
}
.tbn-toc-close:hover { color: var(--tbn-text); background: rgba(255,255,255,0.08); }

.tbn-toc-list {
	list-style: none; margin: 0; padding: 10px 8px 16px;
	max-height: calc(70vh - 50px);
	overflow-y: auto;
	overflow-x: hidden;
	min-width: 0;
	width: 100%;
	box-sizing: border-box;
}
.tbn-toc-item {
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
}
.tbn-toc-item a,
.tbn-toc-link-disabled {
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
	white-space: normal;
	overflow-wrap: anywhere;
	word-break: normal;
}
.tbn-toc-item a > span:last-child,
.tbn-toc-link-disabled {
	line-height: 1.45;
}
.tbn-toc-list::-webkit-scrollbar { width: 6px; }
.tbn-toc-list::-webkit-scrollbar-thumb { background: rgba(212,175,55,0.4); border-radius: 6px; }

.tbn-toc-item a {
	display: flex; align-items: center; gap: 8px;
	color: #eef1f8;
	text-decoration: none;
	font-size: 13.5px;
	font-weight: 500;
	padding: 8px 10px;
	border-radius: 8px;
	transition: background .15s ease, color .15s ease, transform .15s ease;
}
.tbn-toc-item a:hover { background: rgba(212,175,55,0.16); color: #fff; transform: translateX(2px); }
.tbn-toc-item a.tbn-active-link { color: #10182a; background: var(--tbn-accent); font-weight: 700; }
.tbn-toc-item a.tbn-active-link .tbn-toc-dot { background: #10182a; opacity: 1; }

.tbn-toc-dot {
	width: 6px; height: 6px; border-radius: 50%;
	background: var(--tbn-accent); opacity: .5; flex-shrink: 0;
}
.tbn-toc-h4 a { padding-left: 26px; font-size: 13px; color: #d7dceb; }
.tbn-toc-h4 .tbn-toc-dot { width: 5px; height: 5px; opacity: .6; }
.tbn-toc-h5 a { padding-left: 40px; font-size: 12.5px; color: #c3cadd; }
.tbn-toc-h5 .tbn-toc-dot { width: 4px; height: 4px; opacity: .5; }
.tbn-toc-h4 a:hover, .tbn-toc-h5 a:hover { color: #fff; }

/* Locked headings (members-only, shown but not clickable) */
.tbn-toc-link-disabled {
	display: flex; align-items: center; gap: 8px;
	color: #8b93a8;
	font-size: 13.5px;
	font-weight: 500;
	padding: 8px 10px;
	border-radius: 8px;
	cursor: not-allowed;
	user-select: none;
}
.tbn-toc-locked.tbn-toc-h4 .tbn-toc-link-disabled { padding-left: 26px; font-size: 13px; }
.tbn-toc-locked.tbn-toc-h5 .tbn-toc-link-disabled { padding-left: 40px; font-size: 12.5px; }
.tbn-toc-lock-icon { flex-shrink: 0; opacity: .75; }
.tbn-toc-locked .tbn-toc-dot { background: #8b93a8; }

.tbn-toc-empty { padding: 16px; color: var(--tbn-text-dim); font-size: 13px; font-style: italic; }

.tbn-toc-overlay {
	position: fixed; inset: 0; background: rgba(4,8,16,0.5);
	backdrop-filter: blur(2px);
	opacity: 0; visibility: hidden; transition: opacity .25s ease;
	z-index: 9997;
}
.tbn-toc-overlay.tbn-open { opacity: 1; visibility: visible; }

/* ---------------- Introduction box (centered, below header) ---------------- */

.tbn-intro-box {
	background: #ffffff;
	border: 1px solid var(--tbn-accent);
	border-radius: 12px;
	margin: 18px auto;
	padding: 20px 28px;
	max-width: 720px;
	text-align: center;
	box-shadow: 0 14px 34px -18px rgba(16,24,42,0.35);
}
.tbn-intro-line {
	font-weight: 700;
	font-size: 17px;
	color: #7a1f2b;
	margin: 6px 0;
}
.tbn-intro-subject {
	font-weight: 800;
	font-size: 17px;
	letter-spacing: .02em;
	color: #7a1f2b;
	margin: 10px 0 2px;
}

/* ---------------- Body content ---------------- */

.tbn-body {
	/* Theming variables — changed only by the user's palette picker.
	   Headings never reference these, so they stay fixed. */
	--tbn-content-bg: #ffffff;
	--tbn-content-bg-2: #fbfbfd;
	--tbn-content-text: #1c2333;
	--tbn-content-text-dim: #4a5266;
	--tbn-content-border: #e6e8ee;

	background: linear-gradient(180deg, var(--tbn-content-bg) 0%, var(--tbn-content-bg-2) 100%);
	color: var(--tbn-content-text);
	padding: clamp(14px, 2vw, 28px);
	border-radius: 0 0 var(--tbn-radius) var(--tbn-radius);
	box-shadow: 0 30px 60px -30px rgba(0,0,0,0.25), 0 1px 0 rgba(255,255,255,0.5) inset;
	line-height: 1.65;
	font-size: 16px;
	transition: background .3s ease, color .3s ease;
}

/* Force real text selection to work inside the reader body even if a
   separate "copy protection" plugin sets user-select:none globally. */
.tbn-body, .tbn-body p, .tbn-body li, .tbn-body td, .tbn-body th, .tbn-body span, .tbn-body div {
	-webkit-user-select: text !important;
	-moz-user-select: text !important;
	user-select: text !important;
}

/* Headings ALWAYS render as fixed white cards, regardless of the
   content theme — deliberately not wired to the theme variables. */
.tbn-body h3, .tbn-body h4, .tbn-body h5 {
	scroll-margin-top: 110px;
	position: relative;
	font-weight: 800;
	color: #10182a !important;
	background: #ffffff !important;
	border-radius: 8px;
	box-shadow: 0 8px 22px -14px rgba(16,24,42,0.35);
}

.tbn-body h3 {
	font-size: 1.5em;
	margin: 1.35em 0 .65em;
	padding: 10px 14px;
	border-left: 5px solid var(--tbn-accent);
}
.tbn-body h4 {
	font-size: 1.22em;
	margin: 1.2em 0 .5em;
	padding: 8px 12px;
	border-left: 4px solid var(--tbn-accent);
	color: #1c2c4a !important;
}
.tbn-body h5 {
	font-size: 1.05em;
	margin: 1.05em 0 .45em;
	padding: 7px 10px;
	border-left: 3px solid var(--tbn-accent);
	color: #2a3a5c !important;
}

.tbn-body p { margin: 0 0 1.1em; color: var(--tbn-content-text); }

.tbn-body ul, .tbn-body ol { margin: 0 0 1.2em; padding-left: 1.4em; color: var(--tbn-content-text); }
.tbn-body li { margin-bottom: .5em; }
.tbn-body ul > li::marker { color: var(--tbn-accent); }
.tbn-body ol > li::marker { color: var(--tbn-accent); font-weight: 700; }

.tbn-body table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	margin: 1.4em 0;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 12px 30px -16px rgba(16,24,42,0.25);
	border: 1px solid var(--tbn-content-border);
}
.tbn-body table th {
	background: linear-gradient(135deg, var(--tbn-navy-800), var(--tbn-navy-600));
	color: #fff;
	padding: 12px 14px;
	text-align: left;
	font-size: 13.5px;
	letter-spacing: .02em;
}
.tbn-body table td {
	padding: 11px 14px;
	border-top: 1px solid var(--tbn-content-border);
	font-size: 14.5px;
	color: var(--tbn-content-text);
}
.tbn-body table tr:nth-child(even) td { background: rgba(0,0,0,0.02); }

.tbn-body blockquote {
	border-left: 4px solid var(--tbn-accent);
	background: rgba(212,175,55,0.08);
	margin: 1.4em 0;
	padding: .9em 1.2em;
	border-radius: 0 10px 10px 0;
	color: var(--tbn-content-text);
}

.tbn-body code {
	background: rgba(0,0,0,0.06);
	padding: 2px 6px;
	border-radius: 5px;
	font-size: .92em;
	color: var(--tbn-content-text);
}

.tbn-body img {
	max-width: 100%;
	border-radius: 12px;
	box-shadow: 0 20px 40px -20px rgba(0,0,0,0.3);
}

.tbn-body mjx-container {
	overflow-x: auto;
	overflow-y: hidden;
}

/* ---- Content theme presets (applied via data-tbn-bg-theme / data-tbn-text-theme on .tbn-reader) ---- */
.tbn-reader[data-tbn-bg-theme="ivory"] .tbn-body { --tbn-content-bg: #faf3e4; --tbn-content-bg-2: #f6ecd8; --tbn-content-border: #ecdfc4; }
.tbn-reader[data-tbn-bg-theme="mint"] .tbn-body { --tbn-content-bg: #eaf6ef; --tbn-content-bg-2: #dff1e6; --tbn-content-border: #cfe9d9; }
.tbn-reader[data-tbn-bg-theme="sky"] .tbn-body { --tbn-content-bg: #eaf2fb; --tbn-content-bg-2: #dfebf9; --tbn-content-border: #cfe0f2; }
.tbn-reader[data-tbn-bg-theme="sepia"] .tbn-body { --tbn-content-bg: #f1e7d0; --tbn-content-bg-2: #ecdec1; --tbn-content-border: #e0cfa8; }
.tbn-reader[data-tbn-bg-theme="lavender"] .tbn-body { --tbn-content-bg: #f1ecfa; --tbn-content-bg-2: #e9e1f6; --tbn-content-border: #ddceef; }
.tbn-reader[data-tbn-bg-theme="rose"] .tbn-body { --tbn-content-bg: #fbebee; --tbn-content-bg-2: #f6dde2; --tbn-content-border: #f0cdd3; }
.tbn-reader[data-tbn-bg-theme="sand"] .tbn-body { --tbn-content-bg: #f4ece0; --tbn-content-bg-2: #ede0cd; --tbn-content-border: #e2d0b4; }
.tbn-reader[data-tbn-bg-theme="slate"] .tbn-body { --tbn-content-bg: #e7ebf0; --tbn-content-bg-2: #dbe1e9; --tbn-content-border: #cbd3de; }
.tbn-reader[data-tbn-bg-theme="dark"] .tbn-body { --tbn-content-bg: #1b2436; --tbn-content-bg-2: #161e2d; --tbn-content-text: #dde3ef; --tbn-content-text-dim: #aab4c8; --tbn-content-border: #2a3550; }

.tbn-reader[data-tbn-text-theme="navy"] .tbn-body { --tbn-content-text: #1c2c4a; }
.tbn-reader[data-tbn-text-theme="brown"] .tbn-body { --tbn-content-text: #4a3826; }
.tbn-reader[data-tbn-text-theme="forest"] .tbn-body { --tbn-content-text: #204030; }
.tbn-reader[data-tbn-text-theme="plum"] .tbn-body { --tbn-content-text: #3a2140; }
.tbn-reader[data-tbn-text-theme="maroon"] .tbn-body { --tbn-content-text: #5c1f2b; }
.tbn-reader[data-tbn-text-theme="teal"] .tbn-body { --tbn-content-text: #0f3d3e; }
.tbn-reader[data-tbn-text-theme="slate-text"] .tbn-body { --tbn-content-text: #3a4152; }
.tbn-reader[data-tbn-text-theme="light"] .tbn-body { --tbn-content-text: #e9edf5; }

/* ---------------- Locked (members-only) notice ---------------- */

.tbn-locked-box {
	margin: 2.4em 0 1em;
	padding: 34px 30px;
	text-align: center !important;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 100%;
	background: linear-gradient(145deg, rgba(255,255,255,.92), rgba(247,244,236,.92));
	border: 1.5px solid rgba(212,175,55,0.42);
	border-radius: 16px;
	color: var(--tbn-content-text);
}
.tbn-locked-box svg { color: var(--tbn-accent); margin: 0 auto 12px; display: block; }
.tbn-locked-text {
	display: block;
	box-sizing: border-box;
	width: min(100%, 760px) !important;
	max-width: 760px !important;
	margin: 0 auto 20px !important;
	padding: 0 18px;
	text-align: center !important;
	font-size: 15px;
	line-height: 1.65;
	color: var(--tbn-content-text);
}
.tbn-locked-text strong {
	display: block;
	margin: 0 0 6px;
	text-align: center !important;
}
@media (max-width: 640px) {
	.tbn-locked-text {
		width: 100% !important;
		max-width: 100% !important;
		padding: 0 12px;
	}
}
.tbn-locked-actions { display: flex; gap: 10px; justify-content: center; align-items: center; width: 100%; flex-wrap: wrap; }
.tbn-locked-btn {
	display: inline-block;
	background: linear-gradient(135deg, var(--tbn-accent), #f3d878);
	color: #10182a !important;
	font-weight: 700;
	text-decoration: none !important;
	padding: 10px 22px;
	border-radius: 9px;
	font-size: 13.5px;
	transition: transform .15s ease, box-shadow .15s ease;
}
.tbn-locked-btn:hover { transform: translateY(-1px); box-shadow: 0 8px 20px -8px rgba(212,175,55,0.6); }
.tbn-locked-btn-ghost {
	background: transparent;
	border: 1.5px solid rgba(0,0,0,0.15);
	color: var(--tbn-content-text) !important;
}

/* ---------------- Theme / Palette switcher ---------------- */

.tbn-theme-wrap { position: relative; flex-shrink: 0; }
.tbn-theme-toggle {
	display: flex;
	align-items: center;
	gap: 6px;
	height: 38px;
	padding: 0 12px;
	background: linear-gradient(135deg, rgba(212,175,55,0.16), rgba(212,175,55,0.06));
	border: 1px solid rgba(212,175,55,0.45);
	color: var(--tbn-accent);
	border-radius: 10px;
	cursor: pointer;
	font-size: 12.5px;
	font-weight: 600;
	transition: background .2s ease, transform .18s ease, box-shadow .2s ease;
}
.tbn-theme-toggle:hover {
	background: rgba(212,175,55,0.24);
	transform: translateY(-1px);
	box-shadow: 0 6px 16px -6px rgba(212,175,55,0.45);
}
.tbn-palette-icon { width: 18px; height: 18px; flex-shrink: 0; }
.tbn-theme-toggle-label { white-space: nowrap; }
@media (max-width: 620px) { .tbn-theme-toggle-label { display: none; } .tbn-theme-toggle { padding: 0 10px; } }

.tbn-theme-dropdown-head {
	font-size: 13px;
	font-weight: 700;
	color: var(--tbn-text);
	margin-bottom: 10px;
	padding-bottom: 8px;
	border-bottom: 1px solid rgba(255,255,255,0.08);
}

.tbn-theme-dropdown {
	position: absolute;
	top: calc(100% + 10px);
	right: 0;
	width: 252px;
	max-width: 85vw;
	background: var(--tbn-navy-800);
	border: 1px solid rgba(212,175,55,0.25);
	border-radius: 12px;
	box-shadow: 0 20px 50px -12px rgba(0,0,0,0.6);
	padding: 14px;
	display: none;
	z-index: 10000;
	animation: tbnPopIn .18s ease;
}
.tbn-theme-dropdown.tbn-open { display: block; }
@keyframes tbnPopIn { from { opacity: 0; transform: scale(.94) translateY(-4px);} to { opacity: 1; transform: scale(1) translateY(0);} }

.tbn-theme-section-title {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--tbn-text-dim);
	margin: 4px 0 8px;
}
.tbn-theme-section-title:not(:first-child) { margin-top: 14px; }

.tbn-swatch-row { display: flex; gap: 8px; flex-wrap: wrap; }
.tbn-swatch {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	border: 2px solid rgba(255,255,255,0.25);
	cursor: pointer;
	padding: 0;
	transition: transform .15s ease, border-color .15s ease;
	position: relative;
}
.tbn-swatch:hover { transform: scale(1.12); }
.tbn-swatch.tbn-swatch-active { border-color: var(--tbn-accent); box-shadow: 0 0 0 2px rgba(212,175,55,0.3); }

.tbn-theme-reset {
	margin-top: 16px;
	width: 100%;
	background: rgba(212,175,55,0.1);
	border: 1px solid rgba(212,175,55,0.3);
	color: var(--tbn-accent);
	padding: 8px;
	border-radius: 8px;
	font-size: 12.5px;
	font-weight: 600;
	cursor: pointer;
	transition: background .2s ease;
}
.tbn-theme-reset:hover { background: rgba(212,175,55,0.18); }


/* Responsive header stacking on very small screens */
@media (max-width: 400px) {
	.tbn-header-inner { padding: 10px 12px; gap: 8px; }
	.tbn-toc-toggle { padding: 8px 10px; }
}

/* Mobile: header is pinned via JS (position:fixed) for reliability across
   Elementor sections / WebViews where sticky can silently fail. This just
   ensures no odd border-radius while fixed at the very top of the screen. */
@media (max-width: 782px) {
	.tbn-header.tbn-is-stuck { border-radius: 0; }
}

/* Mobile: slightly smaller headings so long topic titles and heading text
   don't overwhelm the narrower content area. */
@media (max-width: 600px) {
	.tbn-body { padding: 10px 12px; margin-left: 0; margin-right: 0; border-radius: 10px; line-height: 1.58; font-size: 15.5px; }
	.tbn-body h3 { font-size: 1.2em; padding: 8px 10px; margin: 1.15em 0 .55em; }
	.tbn-body h4 { font-size: 1.06em; padding: 7px 9px; margin: 1em 0 .45em; }
	.tbn-body h5 { font-size: 0.97em; padding: 6px 8px; margin: .9em 0 .4em; }
	.tbn-title-text { font-size: 12.5px; }
	.tbn-intro-box { padding: 16px 18px; margin: 14px auto; }
	.tbn-intro-line, .tbn-intro-subject { font-size: 14.5px; }
}

/* ============================================================
   GTranslate widget banner — keep it from pushing the page down
   or overlaying content, regardless of which layout the [gtranslate]
   shortcode is configured to use.
   ============================================================ */
html.translated-ltr, html.translated-rtl, html { top: 0 !important; }
body { top: 0 !important; position: static !important; }
.goog-te-banner-frame,
.goog-te-banner-frame.skiptranslate,
iframe.goog-te-banner-frame,
iframe[id^="goog-gt-"],
.skiptranslate > iframe,
#goog-gt-tt,
.goog-te-balloon-frame,
.goog-tooltip,
.goog-tooltip:hover,
.goog-text-highlight {
	display: none !important;
	visibility: hidden !important;
	height: 0 !important;
	width: 0 !important;
	opacity: 0 !important;
}


/* ================================================================
   TBN Content Reader 2.3.0 refinements
   Inspired by The Book Notes visual language: deep navy, warm gold,
   restrained burgundy accents, soft cards, and subtle gradients.
   ================================================================ */

/* Topic introduction: richer academic card with animated gradient edge. */
.tbn-reader > .tbn-intro-box {
	position: relative;
	isolation: isolate;
	margin: 0 auto 13px;
	max-width: 860px;
	padding: 22px 28px 20px;
	border: 1px solid transparent;
	border-radius: 16px;
	background:
		linear-gradient(180deg, #fffdfa 0%, #ffffff 52%, #f8f9fc 100%) padding-box,
		linear-gradient(110deg, #9b7a20 0%, #d4af37 28%, #8b1e2d 62%, #17233d 100%) border-box;
	box-shadow:
		0 14px 34px -22px rgba(16,24,42,.42),
		0 1px 0 rgba(255,255,255,.95) inset;
	overflow: hidden;
}
.tbn-reader > .tbn-intro-box::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(115deg, rgba(212,175,55,.08), transparent 36%, rgba(139,30,45,.055) 68%, rgba(23,35,61,.05));
	background-size: 220% 220%;
	animation: tbnIntroFlow 9s ease-in-out infinite alternate;
	pointer-events: none;
}
.tbn-reader > .tbn-intro-box::after {
	content: "";
	position: absolute;
	left: 18px;
	right: 18px;
	bottom: 0;
	height: 2px;
	border-radius: 999px;
	background: linear-gradient(90deg, transparent, #d4af37 18%, #8b1e2d 52%, #17233d 82%, transparent);
	opacity: .78;
}
@keyframes tbnIntroFlow {
	0% { background-position: 0% 50%; }
	100% { background-position: 100% 50%; }
}
.tbn-intro-line {
	position: relative;
	margin: 5px 0;
	font-weight: 750;
	font-size: clamp(15px, 1.6vw, 18px);
	line-height: 1.45;
	letter-spacing: .01em;
	color: #18243c;
}
.tbn-intro-line:first-child::before {
	content: "";
	display: block;
	width: 42px;
	height: 3px;
	margin: 0 auto 10px;
	border-radius: 999px;
	background: linear-gradient(90deg, #d4af37, #8b1e2d);
}
.tbn-intro-subject {
	margin: 11px 0 0;
	font-weight: 850;
	font-size: clamp(14px, 1.45vw, 17px);
	letter-spacing: .055em;
	text-transform: uppercase;
	color: #7c1d2b;
}

/* Language selector remains left aligned directly below the introduction. */
.tbn-reader > .tbn-gtranslate-wrap {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin: 0 0 12px;
	padding: 0 4px;
	min-height: 34px;
}

/* Thin double content boundary: 1px outer gradient + 1px inset highlight.
   The gradient shifts slowly so the edge feels alive without being flashy. */
.tbn-body {
	position: relative;
	border: 1px solid transparent;
	border-radius: 14px;
	background:
		linear-gradient(180deg, var(--tbn-content-bg) 0%, var(--tbn-content-bg-2) 100%) padding-box,
		linear-gradient(115deg, #17233d 0%, #8b1e2d 34%, #d4af37 68%, #17233d 100%) border-box;
	background-size: 100% 100%, 240% 240%;
	animation: tbnContentBorderFlow 12s ease-in-out infinite alternate;
	box-shadow:
		inset 0 0 0 1px rgba(255,255,255,.82),
		0 16px 38px -26px rgba(18,28,48,.42);
	margin: 8px 3px 18px;
}
@keyframes tbnContentBorderFlow {
	0% { background-position: 0 0, 0% 50%; }
	100% { background-position: 0 0, 100% 50%; }
}

/* Locked TOC entries: hover locally to reveal the custom subscription text. */
.tbn-toc-link-disabled {
	position: relative;
}
.tbn-toc-link-disabled::after { display: none !important; }

/* Locked-heading subscription tooltip is rendered into <body> by JS so it
 * can never be clipped by the TOC's scroll container or run off-screen. */
.tbn-toc-hover-tip {
	position: fixed;
	z-index: 2147483000;
	box-sizing: border-box;
	width: min(360px, calc(100vw - 32px));
	max-width: calc(100vw - 32px);
	padding: 11px 14px;
	border: 1px solid rgba(212,175,55,.72);
	border-radius: 11px;
	background: linear-gradient(135deg, #111a2d 0%, #202d49 58%, #3c1b28 100%);
	color: #fff;
	font-size: 12.5px;
	line-height: 1.5;
	font-weight: 600;
	white-space: normal;
	overflow-wrap: anywhere;
	word-break: normal;
	box-shadow: 0 18px 38px -14px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.08);
	pointer-events: none;
	opacity: 0;
	transform: translateY(-3px);
	transition: opacity .14s ease, transform .14s ease;
}
.tbn-toc-hover-tip.tbn-visible { opacity: 1; transform: translateY(0); }

/* One plan button per topic, even when several plans are configured. */
.tbn-locked-btn {
	background: linear-gradient(115deg, #17233d 0%, #7f2030 48%, #d4af37 100%);
	background-size: 220% 220%;
	color: #fff !important;
	box-shadow: 0 8px 18px -12px rgba(23,35,61,.8);
	transition: transform .18s ease, box-shadow .18s ease, background-position .45s ease;
}
.tbn-locked-btn:hover {
	transform: translateY(-1px);
	background-position: 100% 50%;
	box-shadow: 0 11px 24px -11px rgba(127,32,48,.65);
}

@media (max-width: 600px) {
	.tbn-reader > .tbn-intro-box { padding: 18px 17px 17px; border-radius: 13px; }
	.tbn-reader > .tbn-intro-box::after { left: 12px; right: 12px; }
	.tbn-body { margin-left: 0; margin-right: 0; border-radius: 10px; padding-left: 12px; padding-right: 12px; }
	.tbn-intro-line, .tbn-intro-subject { font-size: 14.5px; }
}

/* ================================================================
   GTranslate cleanup
   ================================================================ */
html.translated-ltr, html.translated-rtl, html { top: 0 !important; }
body { top: 0 !important; position: static !important; }
.goog-te-banner-frame,
.goog-te-banner-frame.skiptranslate,
iframe.goog-te-banner-frame,
iframe[id^="goog-gt-"],
.skiptranslate > iframe,
#goog-gt-tt,
.goog-te-balloon-frame,
.goog-tooltip,
.goog-tooltip:hover,
.goog-text-highlight {
	display: none !important;
	visibility: hidden !important;
	height: 0 !important;
	width: 0 !important;
	opacity: 0 !important;
}

/* ================================================================
   2.4.0 UI refinements
   ================================================================ */
.tbn-reader {
	padding-top: 0 !important;
	margin-top: 0 !important;
}
.tbn-reader > .tbn-intro-box {
	margin-top: 0 !important;
}
.tbn-reader > .tbn-intro-box .tbn-intro-line {
	font-size: clamp(16px, 1.7vw, 19px);
	line-height: 1.5;
}
.tbn-reader > .tbn-intro-box .tbn-intro-subject {
	font-size: clamp(15px, 1.55vw, 18px);
}

/* ================================================================
   2.6.0 — Plain frontend content
   H3/H4/H5 remain normal headings. No accordion UI is applied.
   ================================================================ */

/* Reduce the excessive top gap without pulling the reader into the
   surrounding page/header. Keep normal document spacing intact. */
.tbn-reader {
	margin-top: 0 !important;
	padding-top: 0 !important;
}

/* ---------------- Language converter ---------------- */
.tbn-reader > .tbn-gtranslate-wrap {
	display: block;
	margin: 0 0 13px;
	padding: 0 2px;
}

.tbn-language-card {
	display: flex;
	align-items: center;
	gap: 11px;
	width: fit-content;
	max-width: 100%;
	min-height: 48px;
	padding: 7px 9px 7px 10px;
	border: 1px solid rgba(23,35,61,.12);
	border-radius: 13px;
	background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(248,249,252,.96));
	box-shadow: 0 9px 22px -18px rgba(16,24,42,.72), inset 0 1px 0 rgba(255,255,255,.9);
}

.tbn-language-icon {
	width: 32px; height: 32px; flex: 0 0 32px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 9px;
	background: linear-gradient(135deg, #17233d, #7f2030);
	color: #f5d66d;
	box-shadow: 0 5px 12px -8px rgba(23,35,61,.8);
}
.tbn-language-icon svg { width: 18px; height: 18px; }
.tbn-language-copy { display: flex; flex-direction: column; gap: 1px; min-width: 130px; }
.tbn-language-label { font-size: 12px; font-weight: 800; letter-spacing: .045em; text-transform: uppercase; color: #18243c; }
.tbn-language-hint { font-size: 10.5px; line-height: 1.3; color: #70798b; }
.tbn-language-control { display: flex; align-items: center; min-width: 120px; }
.tbn-language-control .gtranslate_wrapper,
.tbn-language-control .gt_switcher,
.tbn-language-control .gt_selector,
.tbn-language-control .goog-te-gadget,
.tbn-language-control .goog-te-combo,
.tbn-language-control select { font-family: inherit !important; }
.tbn-language-control select,
.tbn-language-control .gt_selector {
	min-width: 128px !important; max-width: 190px; height: 36px !important;
	padding: 0 34px 0 11px !important; border: 1px solid rgba(23,35,61,.16) !important;
	border-radius: 9px !important; background: #fff !important; color: #18243c !important;
	font-size: 12px !important; font-weight: 700 !important; line-height: 34px !important;
	box-shadow: 0 5px 12px -10px rgba(16,24,42,.8) !important; outline: none !important; cursor: pointer !important;
}
.tbn-language-control select:focus, .tbn-language-control .gt_selector:focus {
	border-color: rgba(212,175,55,.8) !important;
	box-shadow: 0 0 0 3px rgba(212,175,55,.14) !important;
}
.tbn-language-control .gt_switcher { border: 0 !important; box-shadow: none !important; background: transparent !important; }
.tbn-language-control .gt_switcher { position: relative !important; max-width: 100% !important; }
.tbn-language-control .gt_switcher .gt_selected, .tbn-language-control .gt_switcher .gt_selected a { box-sizing: border-box !important; max-width: 100% !important; overflow: hidden !important; }
.tbn-language-control .gt_switcher .gt_selected a { white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
.tbn-language-control .gt_switcher .gt_option { box-sizing: border-box !important; left: auto !important; right: 0 !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; }
.tbn-language-control .gt_switcher .gt_option a { display: block !important; max-width: 100% !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; box-sizing: border-box !important; }
.tbn-language-control .gt_switcher .gt_selected,
.tbn-language-control .gt_switcher .gt_selected a {
	border: 1px solid rgba(23,35,61,.16) !important; border-radius: 9px !important; background: #fff !important;
	color: #18243c !important; font-size: 12px !important; font-weight: 700 !important;
}
.tbn-language-control .gt_switcher .gt_selected a { padding: 8px 30px 8px 11px !important; }
.tbn-language-control .gt_switcher .gt_option {
	border: 1px solid rgba(23,35,61,.12) !important; border-radius: 9px !important; background: #fff !important;
	box-shadow: 0 12px 25px -14px rgba(16,24,42,.65) !important; overflow: hidden !important;
}
.tbn-language-control .gt_switcher .gt_option a { padding: 7px 10px !important; font-size: 12px !important; }

@media (max-width: 600px) {
	.tbn-language-card { width: 100%; }
	.tbn-language-copy { min-width: 0; flex: 1 1 auto; }
	.tbn-language-hint { display: none; }
	.tbn-language-control { flex: 0 0 auto; }
	.tbn-language-control select, .tbn-language-control .gt_selector { min-width: 112px !important; max-width: 145px; }
}


/* 2.6.0: safety reset for markup cached from older plugin versions. */
.tbn-body .tbn-acc-section { display: contents !important; margin: 0 !important; }
.tbn-body .tbn-acc-content { display: contents !important; max-height: none !important; height: auto !important; overflow: visible !important; padding: 0 !important; }
.tbn-body h3.tbn-acc-heading { display: block !important; cursor: default !important; user-select: text !important; transform: none !important; box-shadow: none !important; margin: 1.35em 0 .65em !important; padding: 10px 14px !important; }
.tbn-body h3.tbn-acc-heading .tbn-acc-chevron { display: none !important; }
@media (max-width: 600px) {
  .tbn-body { padding: 10px 12px !important; }
  .tbn-body h3.tbn-acc-heading { margin: 1.15em 0 .55em !important; padding: 8px 10px !important; }
}

/* ================================================================
   2.7.0 — Subject Quick Links
   ================================================================ */
.tbn-utility-row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 14px;
	margin: 0 0 13px;
	position: relative;
	z-index: 30;
}
.tbn-utility-row .tbn-gtranslate-wrap { flex: 1 1 auto; margin: 0; min-width: 0; }
.tbn-utility-row .tbn-language-card { max-width: 100%; }
.tbn-quick-links { position: relative; flex: 0 0 auto; }
.tbn-quick-links-toggle {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	min-height: 48px;
	padding: 7px 13px 7px 10px;
	border: 1px solid rgba(23,35,61,.14);
	border-radius: 13px;
	background: linear-gradient(135deg,#17233d 0%,#7f2030 62%,#9c7130 100%);
	color: #fff;
	font: 800 12px/1.1 inherit;
	letter-spacing: .035em;
	box-shadow: 0 10px 24px -16px rgba(23,35,61,.85), inset 0 1px 0 rgba(255,255,255,.14);
	cursor: pointer;
	transition: transform .18s ease, box-shadow .18s ease;
}
.tbn-quick-links-toggle:hover { transform: translateY(-1px); box-shadow: 0 13px 28px -15px rgba(23,35,61,.9); }
.tbn-quick-links-icon { width: 31px; height: 31px; display:inline-flex; align-items:center; justify-content:center; border-radius:9px; background:rgba(255,255,255,.13); }
.tbn-quick-links-icon svg { width:18px; height:18px; }
.tbn-quick-links-chevron { width:15px; height:15px; transition: transform .2s ease; }
.tbn-quick-links.tbn-open .tbn-quick-links-chevron { transform: rotate(180deg); }
.tbn-quick-links-panel {
	position: absolute;
	top: calc(100% + 9px);
	right: 0;
	width: min(420px, calc(100vw - 28px));
	max-height: min(70vh, 620px);
	overflow: auto;
	padding: 10px;
	border: 1px solid rgba(23,35,61,.12);
	border-radius: 16px;
	background: rgba(255,255,255,.98);
	box-shadow: 0 24px 55px -22px rgba(16,24,42,.55), 0 2px 0 rgba(255,255,255,.9) inset;
	backdrop-filter: blur(12px);
}
.tbn-quick-links-panel[hidden] { display:none !important; }
.tbn-quick-links-panel-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 8px 12px; border-bottom:1px solid #edf0f4; }
.tbn-quick-links-panel-head div { display:flex; flex-direction:column; gap:2px; }
.tbn-quick-links-kicker { font-size:9px; text-transform:uppercase; letter-spacing:.12em; color:#9a7b26; font-weight:800; }
.tbn-quick-links-panel-head strong { font-size:16px; color:#18243c; }
.tbn-quick-links-close { width:30px; height:30px; border:0; border-radius:9px; background:#f4f5f7; color:#5e6879; font-size:21px; line-height:1; cursor:pointer; }
.tbn-quick-links-groups { display:grid; gap:7px; padding-top:9px; }
.tbn-ql-group-front, .tbn-ql-topic-front { border:1px solid #e7e9ee; border-radius:11px; overflow:hidden; background:#fff; }
.tbn-ql-group-toggle, .tbn-ql-topic-toggle { width:100%; border:0; background:#fff; color:#18243c; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:9px; padding:12px 12px; text-align:left; font:800 13px/1.25 inherit; cursor:pointer; }
.tbn-ql-group-toggle:hover, .tbn-ql-topic-toggle:hover { background:#fbfaf5; }
.tbn-ql-front-icon { width:28px; height:28px; display:inline-flex; align-items:center; justify-content:center; border-radius:8px; background:#f8f2df; }
.tbn-ql-front-chevron { font-size:18px; color:#b08c2d; transition:transform .2s ease; }
.tbn-ql-group-front.tbn-open > .tbn-ql-group-toggle .tbn-ql-front-chevron, .tbn-ql-topic-front.tbn-open > .tbn-ql-topic-toggle .tbn-ql-front-chevron { transform:rotate(180deg); }
.tbn-ql-group-content { padding: 0 9px 9px; }
.tbn-ql-direct-links, .tbn-ql-topics-front { display:grid; gap:6px; }
.tbn-ql-topics-front { margin-top:7px; }
.tbn-ql-topic-front { background:#fbfbfc; }
.tbn-ql-topic-toggle { font-size:12px; padding:10px 11px; grid-template-columns:1fr auto; }
.tbn-ql-topic-content { padding:0 8px 8px; display:grid; gap:5px; }
.tbn-ql-link { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 10px; border-radius:8px; background:#f7f8fa; color:#27334a; text-decoration:none !important; font-size:12px; font-weight:650; border:1px solid transparent; transition:background .15s ease, border-color .15s ease, transform .15s ease; }
.tbn-ql-link:hover { background:#fffdf5; border-color:rgba(212,175,55,.4); transform:translateX(2px); color:#18243c; }
.tbn-ql-arrow { color:#a68122; font-size:15px; flex:0 0 auto; }

@media (max-width: 600px) {
	.tbn-utility-row { align-items: stretch; gap: 8px; }
	.tbn-utility-row .tbn-gtranslate-wrap { min-width: 0; }
	.tbn-language-card { width: 100%; gap: 7px; padding: 6px; }
	.tbn-language-copy { min-width: 0; }
	.tbn-language-hint { display:none; }
	.tbn-language-control { min-width: 0; flex:1 1 auto; }
	.tbn-language-control select, .tbn-language-control .gt_selector { min-width: 0 !important; width: 100%; max-width: none; }
	.tbn-quick-links-toggle { min-height: 44px; padding: 6px 9px; }
	.tbn-quick-links-toggle > span:not(.tbn-quick-links-icon) { display:none; }
	.tbn-quick-links-panel { position: fixed; top: 76px; right: 10px; width: calc(100vw - 20px); max-height: calc(100vh - 92px); z-index: 10050; }
}

/* ================================================================
   2.7.1 — Quick Links refinement
   Keep Language exactly in its own row; Quick Links sits below it.
   The panel is layered above sticky site/header elements.
   ================================================================ */
.tbn-utility-row {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 10px;
	position: relative;
	z-index: 99990;
}
.tbn-utility-row .tbn-gtranslate-wrap {
	width: 100%;
	flex: none;
}
.tbn-quick-links {
	width: 100%;
	position: relative;
	z-index: 100000;
}
.tbn-quick-links-toggle {
	width: 100%;
	justify-content: space-between;
	min-height: 52px;
	padding: 8px 15px;
	border: 0;
	border-radius: 14px;
	background: linear-gradient(135deg, #17233d 0%, #5c2445 42%, #8f2d3d 70%, #d1a52f 100%);
	box-shadow: 0 12px 28px -16px rgba(23,35,61,.8), inset 0 1px 0 rgba(255,255,255,.22);
	transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.tbn-quick-links-toggle:hover {
	transform: translateY(-2px);
	filter: saturate(1.12) brightness(1.03);
	box-shadow: 0 18px 34px -17px rgba(23,35,61,.88), inset 0 1px 0 rgba(255,255,255,.28);
}
.tbn-quick-links-toggle:focus-visible {
	outline: 3px solid rgba(212,175,55,.34);
	outline-offset: 3px;
}
.tbn-quick-links-icon {
	width: 34px;
	height: 34px;
	border-radius: 10px;
	background: rgba(255,255,255,.16);
	box-shadow: inset 0 1px 0 rgba(255,255,255,.2);
}
.tbn-quick-links-toggle > span:not(.tbn-quick-links-icon) {
	flex: 1;
	text-align: left;
	font-size: 13px;
	letter-spacing: .045em;
}
.tbn-quick-links-panel {
	position: fixed !important;
	z-index: 2147483000 !important;
	width: min(460px, calc(100vw - 28px));
	max-height: min(72vh, 680px);
	margin: 0;
	padding: 11px;
	border: 1px solid rgba(23,35,61,.12);
	border-radius: 18px;
	background: rgba(255,255,255,.985);
	box-shadow: 0 28px 70px -24px rgba(12,18,32,.65), 0 5px 18px rgba(12,18,32,.12);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
}
.tbn-quick-links-panel::before {
	content: '';
	position: absolute;
	top: -7px;
	right: 34px;
	width: 14px;
	height: 14px;
	background: #fff;
	border-left: 1px solid rgba(23,35,61,.12);
	border-top: 1px solid rgba(23,35,61,.12);
	transform: rotate(45deg);
}
.tbn-quick-links-panel-head {
	padding: 8px 8px 13px;
}
.tbn-ql-group-front, .tbn-ql-topic-front {
	transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.tbn-ql-group-front:hover, .tbn-ql-topic-front:hover {
	border-color: rgba(142,45,61,.22);
	box-shadow: 0 8px 20px -16px rgba(23,35,61,.7);
}
.tbn-ql-group-toggle:hover, .tbn-ql-topic-toggle:hover {
	background: linear-gradient(90deg, #fffdf6, #f8f4ff);
	color: #7e2439;
}
.tbn-ql-link:hover {
	background: linear-gradient(90deg, #fffaf0, #f7f1ff);
	border-color: rgba(142,45,61,.28);
	color: #7e2439;
	box-shadow: 0 6px 14px -12px rgba(23,35,61,.8);
}
@media (max-width: 600px) {
	.tbn-utility-row { gap: 9px; }
	.tbn-quick-links-toggle { min-height: 48px; }
	.tbn-quick-links-toggle > span:not(.tbn-quick-links-icon) { display: inline !important; }
	.tbn-quick-links-panel { width: calc(100vw - 16px); max-height: calc(100vh - 96px); }
}

/* ================================================================
   2.9.0 — Premium utility layout + navigation polish
   ================================================================ */
.tbn-reader > .tbn-utility-row {
	margin: 0 0 16px;
	padding: 0;
	position: relative;
	z-index: 40;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: stretch;
	gap: 14px;
}

/* Language + Quick Links share the same visual footprint on desktop. */
.tbn-reader > .tbn-utility-row .tbn-gtranslate-wrap,
.tbn-reader > .tbn-utility-row .tbn-quick-links {
	width: 100%;
	min-width: 0;
	margin: 0;
}
.tbn-reader > .tbn-utility-row .tbn-language-card {
	width: 100%;
	min-height: 58px;
	padding: 8px 11px;
	border: 1px solid transparent;
	border-radius: 15px;
	background:
		linear-gradient(#fff, #f8fafc) padding-box,
		linear-gradient(135deg, #caa95b, #304968 48%, #7b3348) border-box;
	box-shadow: 0 14px 32px -22px rgba(11,18,32,.75), inset 0 1px 0 rgba(255,255,255,.95);
}
.tbn-reader > .tbn-utility-row .tbn-language-control {
	min-width: 0;
	max-width: 100%;
	flex: 0 1 auto;
	overflow: visible;
}
.tbn-reader > .tbn-utility-row .tbn-language-control .gtranslate_wrapper,
.tbn-reader > .tbn-utility-row .tbn-language-control .gt_switcher,
.tbn-reader > .tbn-utility-row .tbn-language-control .gt_selector,
.tbn-reader > .tbn-utility-row .tbn-language-control select {
	max-width: 100%;
}
.tbn-reader > .tbn-utility-row .tbn-language-control select,
.tbn-reader > .tbn-utility-row .tbn-language-control .gt_selector {
	width: auto;
	min-width: 128px !important;
	max-width: 220px;
}

/* Quick Links button — premium sapphire/obsidian/champagne treatment. */
.tbn-quick-links {
	position: relative;
	z-index: 100001;
	isolation: isolate;
}
.tbn-quick-links-toggle {
	position: relative;
	overflow: hidden;
	width: 100%;
	min-height: 58px;
	justify-content: space-between;
	padding: 9px 14px;
	border: 1px solid transparent;
	border-radius: 15px;
	background:
		linear-gradient(135deg, #07111f 0%, #142943 46%, #263f5e 72%, #9b7739 100%) padding-box,
		linear-gradient(110deg, #caa95b, #5d789a, #b78d46, #d8bd7c) border-box;
	box-shadow: 0 16px 34px -20px rgba(5,12,24,.92), inset 0 1px 0 rgba(255,255,255,.18), inset 0 -1px 0 rgba(0,0,0,.24);
	color: #fff;
}
.tbn-quick-links-toggle::after {
	content: "";
	position: absolute;
	inset: 1px;
	border-radius: 14px;
	background: linear-gradient(105deg, transparent 12%, rgba(255,255,255,.12) 47%, transparent 78%);
	transform: translateX(-125%);
	transition: transform .65s ease;
	pointer-events: none;
}
.tbn-quick-links-toggle:hover::after { transform: translateX(125%); }
.tbn-quick-links-toggle:hover {
	background:
		linear-gradient(135deg, #0a1728 0%, #1b3552 46%, #345171 72%, #b08b4b 100%) padding-box,
		linear-gradient(110deg, #e1c985, #7595b8, #d0a85b, #ecd59a) border-box;
	transform: translateY(-2px);
	box-shadow: 0 22px 42px -20px rgba(5,12,24,.95), inset 0 1px 0 rgba(255,255,255,.22);
}
.tbn-quick-links-toggle:focus-visible { outline: 3px solid rgba(202,169,91,.3); outline-offset: 3px; }
.tbn-quick-links-icon {
	width: 35px; height: 35px; flex: 0 0 35px;
	border-radius: 10px;
	background: linear-gradient(145deg, rgba(255,255,255,.19), rgba(202,169,91,.16));
	border: 1px solid rgba(255,255,255,.16);
	box-shadow: inset 0 1px 0 rgba(255,255,255,.18);
}
.tbn-quick-links-toggle > span:not(.tbn-quick-links-icon) { flex: 1; text-align: left; font-size: 13px; letter-spacing: .045em; }
.tbn-quick-links-chevron { transition: transform .25s ease; }
.tbn-quick-links.tbn-open .tbn-quick-links-chevron { transform: rotate(180deg); }

/* The panel is fixed so it can never be clipped by a sticky header/container.
   JS places it below the visible reader header when that header has crossed. */
.tbn-quick-links-panel {
	position: fixed !important;
	z-index: 2147483000 !important;
	width: min(480px, calc(100vw - 24px));
	max-height: min(72vh, 680px);
	margin: 0;
	padding: 12px;
	border: 1px solid transparent;
	border-radius: 20px;
	background:
		linear-gradient(180deg, rgba(255,255,255,.985), rgba(244,247,251,.985)) padding-box,
		linear-gradient(135deg, #caa95b, #5d789a 45%, #7b3348 78%, #caa95b) border-box;
	box-shadow: 0 32px 86px -28px rgba(5,12,24,.72), 0 8px 26px rgba(5,12,24,.12), inset 0 1px 0 #fff;
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	overflow: auto;
}
.tbn-quick-links-panel::before {
	content: "";
	position: absolute;
	top: -7px;
	right: 36px;
	width: 14px; height: 14px;
	background: #fff;
	border-left: 1px solid #caa95b;
	border-top: 1px solid #7b3348;
	transform: rotate(45deg);
}
.tbn-quick-links-panel-head {
	padding: 10px 9px 14px;
	border-bottom: 1px solid rgba(24,36,60,.09);
}
.tbn-quick-links-kicker { color: #96733a; }
.tbn-quick-links-panel-head strong { color: #101a2d; letter-spacing: -.01em; }
.tbn-quick-links-close:hover { background: #edf1f6; color: #101a2d; }
.tbn-quick-links-groups { gap: 9px; }

/* Dynamic 3-D accordion cards with animated gradient borders. */
.tbn-ql-group-front, .tbn-ql-topic-front {
	position: relative;
	border: 1px solid transparent;
	border-radius: 14px;
	background:
		linear-gradient(#fff, #f7f9fc) padding-box,
		linear-gradient(135deg, #caa95b, #5d789a 48%, #7b3348 78%, #caa95b) border-box;
	box-shadow: 0 9px 22px -17px rgba(5,12,24,.7), inset 0 1px 0 #fff;
	transition: transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s ease, filter .25s ease;
}
.tbn-ql-group-front:hover, .tbn-ql-topic-front:hover {
	transform: translateY(-2px) perspective(900px) rotateX(.5deg);
	box-shadow: 0 18px 32px -20px rgba(5,12,24,.78), 0 0 0 1px rgba(202,169,91,.12);
}
.tbn-ql-group-front.tbn-open, .tbn-ql-topic-front.tbn-open {
	box-shadow: 0 20px 38px -22px rgba(5,12,24,.72), 0 0 24px rgba(202,169,91,.10);
}
.tbn-ql-group-toggle, .tbn-ql-topic-toggle {
	background: linear-gradient(180deg, #ffffff, #f4f7fb);
}
.tbn-ql-group-toggle:hover, .tbn-ql-topic-toggle:hover {
	background: linear-gradient(105deg, #f5f8fc, #fff8e9);
	color: #735529;
}
.tbn-ql-front-icon {
	background: linear-gradient(145deg, #eaf0f6, #f7edd9);
	border: 1px solid rgba(150,115,58,.18);
	box-shadow: inset 0 1px 0 #fff, 0 5px 12px -10px rgba(5,12,24,.7);
}
.tbn-ql-front-chevron { color: #96733a; }
.tbn-ql-group-content, .tbn-ql-topic-content {
	animation: tbnQuickReveal .28s cubic-bezier(.2,.8,.2,1);
}
@keyframes tbnQuickReveal {
	from { opacity: 0; transform: translateY(-5px); }
	to { opacity: 1; transform: translateY(0); }
}
.tbn-ql-link {
	background: linear-gradient(100deg, #f4f7fa, #faf5e9);
	border: 1px solid rgba(24,36,60,.08);
	box-shadow: inset 0 1px 0 #fff;
	transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.tbn-ql-link:hover {
	background: linear-gradient(100deg, #edf3f9, #f8ead1);
	border-color: rgba(150,115,58,.38);
	transform: translateX(4px) translateZ(2px);
	box-shadow: 0 8px 18px -14px rgba(5,12,24,.8), inset 0 1px 0 #fff;
	color: #674b25;
}
.tbn-ql-arrow { color: #96733a; }

/* TOC target headings: sticky header must never cover the destination. */
.tbn-body h3, .tbn-body h4, .tbn-body h5 { scroll-margin-top: 110px; }

@media (max-width: 782px) {
	/* Keep the requested mobile order: Language first, Quick Links second. */
	.tbn-reader > .tbn-utility-row {
		display: flex;
		flex-direction: column;
		gap: 9px;
	}
	.tbn-reader > .tbn-utility-row .tbn-language-card,
	.tbn-reader > .tbn-utility-row .tbn-quick-links-toggle { width: 100%; }
	.tbn-reader > .tbn-utility-row .tbn-language-card { padding-right: 7px; }
	.tbn-reader > .tbn-utility-row .tbn-language-control { flex: 1 1 auto; }
	.tbn-reader > .tbn-utility-row .tbn-language-control select,
	.tbn-reader > .tbn-utility-row .tbn-language-control .gt_selector {
		min-width: 112px !important;
		max-width: 100%;
		width: 100%;
	}
	.tbn-quick-links-panel {
		width: calc(100vw - 16px);
		max-height: calc(100vh - 104px);
	}
	.tbn-body h3, .tbn-body h4, .tbn-body h5 { scroll-margin-top: 92px; }
}


/* ================================================================
   2.9.1 — Final mobile header + language control correction
   ================================================================ */
.tbn-mobile-header-spacer {
	display: block;
	height: 0;
	width: 100%;
	pointer-events: none;
}

/* Mobile header becomes a true viewport-fixed bar only after the user
   has crossed the original reader header position. */
@media (max-width: 782px) {
	.tbn-header.tbn-mobile-fixed {
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		width: 100vw !important;
		max-width: 100vw !important;
		z-index: 2147482000 !important;
		border-radius: 0 !important;
		margin: 0 !important;
	}

	.tbn-header.tbn-mobile-fixed .tbn-header-inner {
		width: 100%;
		max-width: 100%;
	}

	/* TOC opened from the fixed mobile header must sit beneath it. */
	.tbn-header.tbn-mobile-fixed .tbn-toc-panel {
		z-index: 2147481999;
	}

	/* Keep heading destinations safely below the fixed mobile header. */
	.tbn-body h3,
	.tbn-body h4,
	.tbn-body h5 {
		scroll-margin-top: 96px !important;
	}
}

/* GTranslate: give the selector its own shrink-safe lane so its right edge,
   arrow and dropdown trigger can never be clipped by the language card. */
.tbn-reader > .tbn-utility-row .tbn-gtranslate-wrap,
.tbn-reader > .tbn-utility-row .tbn-language-card,
.tbn-reader > .tbn-utility-row .tbn-language-control {
	min-width: 0 !important;
	overflow: visible !important;
}
.tbn-reader > .tbn-utility-row .tbn-language-card {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	padding-left: 12px !important;
	padding-right: 12px !important;
}
.tbn-reader > .tbn-utility-row .tbn-language-copy {
	min-width: 0 !important;
	flex: 1 1 auto !important;
}
.tbn-reader > .tbn-utility-row .tbn-language-control {
	flex: 0 1 230px !important;
	width: 230px !important;
	max-width: 42% !important;
	display: flex !important;
	align-items: center !important;
	justify-content: flex-end !important;
}
.tbn-reader > .tbn-utility-row .tbn-language-control > * {
	min-width: 0 !important;
	max-width: 100% !important;
}
.tbn-reader > .tbn-utility-row .tbn-language-control .gtranslate_wrapper,
.tbn-reader > .tbn-utility-row .tbn-language-control .gt_switcher,
.tbn-reader > .tbn-utility-row .tbn-language-control .gt_selector,
.tbn-reader > .tbn-utility-row .tbn-language-control select {
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
}
.tbn-reader > .tbn-utility-row .tbn-language-control .gt_switcher .gt_selected,
.tbn-reader > .tbn-utility-row .tbn-language-control .gt_switcher .gt_selected a {
	max-width: 100% !important;
	box-sizing: border-box !important;
}
.tbn-reader > .tbn-utility-row .tbn-language-control .gt_switcher .gt_selected a {
	padding-right: 34px !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

@media (max-width: 782px) {
	.tbn-reader > .tbn-utility-row .tbn-language-control {
		flex: 1 1 170px !important;
		width: auto !important;
		max-width: 48% !important;
	}
	.tbn-reader > .tbn-utility-row .tbn-language-control .gtranslate_wrapper,
	.tbn-reader > .tbn-utility-row .tbn-language-control .gt_switcher,
	.tbn-reader > .tbn-utility-row .tbn-language-control .gt_selector,
	.tbn-reader > .tbn-utility-row .tbn-language-control select {
		width: 100% !important;
	}
}

@media (max-width: 420px) {
	.tbn-reader > .tbn-utility-row .tbn-language-card {
		gap: 7px !important;
		padding-left: 9px !important;
		padding-right: 9px !important;
	}
	.tbn-reader > .tbn-utility-row .tbn-language-icon {
		flex: 0 0 30px !important;
	}
	.tbn-reader > .tbn-utility-row .tbn-language-control {
		max-width: 54% !important;
	}
}


/* ================================================================
   2.9.2 — Quick Links portal / header-overlap fix
   The floating panel is moved to <body> by JS so it cannot be trapped
   inside the reader's stacking context. JS also positions it below any
   visible sticky/fixed reader header.
   ================================================================ */
body > .tbn-quick-links-panel {
	position: fixed !important;
	z-index: 2147483647 !important;
	max-width: calc(100vw - 16px);
	box-sizing: border-box;
	isolation: isolate;
}
body > .tbn-quick-links-panel::before {
	z-index: 1;
}
@media (max-width: 782px) {
	body > .tbn-quick-links-panel {
		width: min(480px, calc(100vw - 16px)) !important;
		max-height: calc(100vh - 24px) !important;
	}
}

/* ================================================================
   2.9.4 — Language card visual alignment + single GTranslate shell
   Only the Language presentation is refined here; Quick Links and all
   other frontend behavior remain unchanged.
   ================================================================ */
.tbn-reader > .tbn-utility-row .tbn-language-card {
	border: 1px solid transparent !important;
	border-radius: 15px !important;
	background:
		linear-gradient(135deg, #ffffff 0%, #f5f8fc 62%, #f8f2e7 100%) padding-box,
		linear-gradient(110deg, #caa95b, #5d789a 48%, #7b3348 82%, #d8bd7c) border-box !important;
	box-shadow: 0 16px 34px -22px rgba(5,12,24,.78), inset 0 1px 0 rgba(255,255,255,.98) !important;
}
.tbn-reader > .tbn-utility-row .tbn-language-icon {
	background: linear-gradient(145deg, #07111f 0%, #263f5e 52%, #7b3348 100%) !important;
	border: 1px solid rgba(202,169,91,.32) !important;
	box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 8px 16px -12px rgba(5,12,24,.85) !important;
}
.tbn-reader > .tbn-utility-row .tbn-language-label { color: #101a2d !important; }
.tbn-reader > .tbn-utility-row .tbn-language-hint { color: #68758a !important; }

/* GTranslate: use ONE visible rounded selector shell. The nested selected
   link is transparent so its own border cannot create a second curved box. */
.tbn-reader > .tbn-utility-row .tbn-language-control .gt_switcher {
	width: 100% !important;
	max-width: 100% !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	overflow: visible !important;
}
.tbn-reader > .tbn-utility-row .tbn-language-control .gt_switcher .gt_selected {
	width: 100% !important;
	max-width: 100% !important;
	min-height: 40px !important;
	box-sizing: border-box !important;
	border: 1px solid rgba(23,35,61,.17) !important;
	border-radius: 12px !important;
	background: #fff !important;
	box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 7px 16px -13px rgba(5,12,24,.75) !important;
}
.tbn-reader > .tbn-utility-row .tbn-language-control .gt_switcher .gt_selected a {
	width: 100% !important;
	box-sizing: border-box !important;
	border: 0 !important;
	border-radius: 11px !important;
	background: transparent !important;
	box-shadow: none !important;
	padding: 8px 34px 8px 11px !important;
	color: #18243c !important;
}
.tbn-reader > .tbn-utility-row .tbn-language-control .gt_switcher .gt_selected a:hover,
.tbn-reader > .tbn-utility-row .tbn-language-control .gt_switcher .gt_selected a:focus {
	background: transparent !important;
}

@media (max-width: 782px) {
	.tbn-reader > .tbn-utility-row .tbn-language-card {
		border-radius: 14px !important;
	}
	.tbn-reader > .tbn-utility-row .tbn-language-control .gt_switcher .gt_selected {
		border-radius: 11px !important;
	}
	.tbn-reader > .tbn-utility-row .tbn-language-control .gt_switcher .gt_selected a {
		border-radius: 10px !important;
	}
}


/* ================================================================
   2.10.0 — Quick Links above Topic Intro + Language selector
   ================================================================ */
.tbn-reader > .tbn-quick-links {
	width: 100%;
	margin: 0 0 14px;
	position: relative;
	z-index: 70;
}
.tbn-reader > .tbn-quick-links .tbn-quick-links-desktop-bar {
	display: flex;
	align-items: stretch;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 16px;
	background:
		linear-gradient(135deg, #07111f 0%, #142943 48%, #263f5e 74%, #9b7739 100%) padding-box,
		linear-gradient(110deg, #caa95b, #5d789a 45%, #b78d46 72%, #d8bd7c) border-box;
	box-shadow: 0 16px 34px -22px rgba(5,12,24,.86), inset 0 1px 0 rgba(255,255,255,.16);
	overflow: visible;
}
.tbn-quick-links-desktop-item {
	position: relative;
	flex: 1 1 0;
	min-width: 0;
	min-height: 58px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 10px 16px;
	border: 0;
	border-radius: 12px;
	background: transparent;
	color: #f7f8fb;
	font: 800 14px/1.2 inherit;
	letter-spacing: .015em;
	cursor: pointer;
	transition: background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.tbn-quick-links-desktop-item:hover,
.tbn-quick-links-desktop-item.tbn-active {
	background: linear-gradient(135deg, rgba(255,255,255,.13), rgba(202,169,91,.22));
	color: #fff7dc;
	box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 8px 20px -16px rgba(0,0,0,.8);
}
.tbn-quick-links-desktop-icon { font-size: 18px; line-height: 1; flex: 0 0 auto; }
.tbn-quick-links-desktop-chevron { color: #d8bd7c; font-size: 17px; line-height: 1; transition: transform .2s ease; }
.tbn-quick-links-desktop-item.tbn-active .tbn-quick-links-desktop-chevron { transform: rotate(180deg); }
.tbn-reader > .tbn-quick-links .tbn-quick-links-toggle { display: none; }
.tbn-reader > .tbn-quick-links .tbn-quick-links-panel {
	width: 100vw !important;
	max-width: 100vw !important;
	left: 0 !important;
	right: auto !important;
	border-radius: 0 0 20px 20px;
	padding: 14px clamp(14px, 3vw, 42px) 18px;
}
.tbn-reader > .tbn-quick-links .tbn-quick-links-panel-head { max-width: 1180px; margin: 0 auto; }
.tbn-reader > .tbn-quick-links .tbn-quick-links-groups { max-width: 1180px; margin: 0 auto; }
.tbn-reader > .tbn-quick-links .tbn-ql-group-front[hidden] { display: none !important; }

/* Language selector uses the same centered reading width as the Topic Introduction. */
.tbn-reader > .tbn-utility-row {
	width: 100%;
	max-width: 860px;
	margin: 0 auto 16px;
	padding: 0;
	position: relative;
	z-index: 45;
}
.tbn-reader > .tbn-utility-row .tbn-gtranslate-wrap {
	width: 100%;
	min-width: 0;
	margin: 0;
	padding: 0;
}
.tbn-reader > .tbn-utility-row .tbn-language-card {
	width: 100%;
	min-width: 0;
}

@media (max-width: 782px) {
	/* Mobile: Quick Links becomes one full-width button only. */
	.tbn-reader > .tbn-quick-links {
		margin: 0 0 10px;
	}
	.tbn-reader > .tbn-quick-links .tbn-quick-links-desktop-bar { display: none; }
	.tbn-reader > .tbn-quick-links .tbn-quick-links-toggle {
		display: flex !important;
		width: 100%;
		min-height: 50px;
	}
	.tbn-reader > .tbn-quick-links .tbn-quick-links-panel {
		width: calc(100vw - 16px) !important;
		max-width: calc(100vw - 16px) !important;
		left: 8px !important;
		border-radius: 18px;
		padding: 10px;
	}
	.tbn-reader > .tbn-utility-row .tbn-language-copy { display: none !important; }
	.tbn-reader > .tbn-utility-row .tbn-language-icon { flex: 0 0 32px; }
	.tbn-reader > .tbn-utility-row .tbn-language-control {
		flex: 1 1 auto !important;
		width: auto !important;
		max-width: none !important;
		min-width: 0 !important;
	}
	}

/* ================================================================
   2.10.5 — Quick Links desktop content width refinement
   Keep the Quick Links overlay full-width, while giving its accordion
   cards a refined centered reading width so they never stretch edge-to-edge.
   ================================================================ */
.tbn-quick-links-panel .tbn-quick-links-panel-head,
.tbn-quick-links-panel .tbn-quick-links-groups {
	width: min(100%, 1120px);
	margin-left: auto;
	margin-right: auto;
}
.tbn-quick-links-panel .tbn-quick-links-panel-head {
	box-sizing: border-box;
}
.tbn-quick-links-panel .tbn-quick-links-groups {
	padding-left: 8px;
	padding-right: 8px;
	box-sizing: border-box;
}
.tbn-quick-links-panel .tbn-ql-group-front,
.tbn-quick-links-panel .tbn-ql-topic-front {
	width: 100%;
	box-sizing: border-box;
}

@media (min-width: 783px) {
	.tbn-quick-links-panel {
		padding-left: clamp(16px, 3vw, 34px);
		padding-right: clamp(16px, 3vw, 34px);
	}
	.tbn-quick-links-panel .tbn-quick-links-panel-head {
		padding-left: 8px;
		padding-right: 8px;
	}
}

@media (max-width: 782px) {
	.tbn-quick-links-panel .tbn-quick-links-panel-head,
	.tbn-quick-links-panel .tbn-quick-links-groups {
		width: 100%;
	}
	.tbn-quick-links-panel .tbn-quick-links-groups {
		padding-left: 0;
		padding-right: 0;
	}
}


/* 2.10.6 — Desktop Quick Links panel matches the heading bar footprint.
   Mobile intentionally remains full-width. */
@media (min-width: 783px) {
	body > .tbn-quick-links-panel {
		max-width: none !important;
		box-sizing: border-box;
	}
}

/* 2.10.7 — Compact Quick Links expanded panel.
   Desktop/tablet uses the centered half-width panel; mobile remains full-width. */
@media (min-width: 783px) {
	body > .tbn-quick-links-panel {
		box-sizing: border-box;
		max-width: 50vw !important;
		min-width: 420px;
	}
	body > .tbn-quick-links-panel .tbn-quick-links-panel-head,
	body > .tbn-quick-links-panel .tbn-quick-links-groups {
		max-width: 100% !important;
	}
}


/* 2.10.8 — Quick Links accordion premium color refresh only.
   Layout, sizing, behavior and positioning are intentionally unchanged. */
.tbn-quick-links-panel {
	background:
		linear-gradient(180deg, rgba(255,255,255,.99), rgba(246,249,253,.99)) padding-box,
		linear-gradient(135deg, #2563eb 0%, #7c3aed 42%, #0f766e 72%, #d4a72c 100%) border-box;
}
.tbn-ql-group-front, .tbn-ql-topic-front {
	border-width: 2px;
	background:
		linear-gradient(#ffffff, #f6f9ff) padding-box,
		linear-gradient(135deg, #2563eb 0%, #7c3aed 40%, #0f766e 72%, #d4a72c 100%) border-box;
	box-shadow: 0 10px 24px -17px rgba(37,99,235,.65), inset 0 1px 0 #fff;
}
.tbn-ql-group-front:hover, .tbn-ql-topic-front:hover {
	box-shadow: 0 18px 34px -20px rgba(37,99,235,.62), 0 0 0 2px rgba(124,58,237,.10);
}
.tbn-ql-group-front.tbn-open, .tbn-ql-topic-front.tbn-open {
	box-shadow: 0 22px 40px -22px rgba(37,99,235,.58), 0 0 28px rgba(124,58,237,.12);
}
.tbn-ql-group-toggle, .tbn-ql-topic-toggle {
	background: linear-gradient(110deg, #eef4ff 0%, #f5f0ff 48%, #ecfbf8 100%);
	color: #172554;
}
.tbn-ql-group-toggle:hover, .tbn-ql-topic-toggle:hover {
	background: linear-gradient(110deg, #dbeafe 0%, #ede9fe 48%, #d1fae5 100%);
	color: #312e81;
}
.tbn-ql-group-front.tbn-open > .tbn-ql-group-toggle,
.tbn-ql-topic-front.tbn-open > .tbn-ql-topic-toggle {
	background: linear-gradient(110deg, #dbeafe 0%, #ede9fe 48%, #dff8f2 100%);
}
.tbn-ql-front-icon {
	background: linear-gradient(145deg, #dbeafe 0%, #ede9fe 52%, #d1fae5 100%);
	border-color: rgba(37,99,235,.22);
	box-shadow: inset 0 1px 0 #fff, 0 6px 14px -10px rgba(37,99,235,.65);
}
.tbn-ql-front-chevron { color: #4f46e5; }
.tbn-ql-link {
	background: linear-gradient(105deg, #f4f8ff 0%, #f8f5ff 52%, #f1fbf8 100%);
	border-color: rgba(37,99,235,.14);
	color: #1e2a4a;
}
.tbn-ql-link:hover {
	background: linear-gradient(105deg, #dbeafe 0%, #ede9fe 52%, #d1fae5 100%);
	border-color: rgba(79,70,229,.42);
	color: #312e81;
	box-shadow: 0 8px 18px -14px rgba(37,99,235,.75), inset 0 1px 0 #fff;
}
.tbn-ql-arrow { color: #4f46e5; }

/* 2.10.9 — Premium restrained Quick Links palette.
   Uses deep ink, warm champagne and muted plum accents for a polished academic look. */
.tbn-quick-links-panel {
	background:
		linear-gradient(180deg, #f8f7f4 0%, #eef1f4 100%) padding-box,
		linear-gradient(135deg, #b9975b 0%, #27384b 42%, #5b3b4c 72%, #c5a96a 100%) border-box;
	box-shadow: 0 24px 55px -34px rgba(23,34,48,.42), 0 8px 22px -16px rgba(91,59,76,.22);
}
.tbn-ql-group-front,
.tbn-ql-topic-front {
	background:
		linear-gradient(180deg, #fbfaf8 0%, #f0f2f4 100%) padding-box,
		linear-gradient(135deg, #b9975b 0%, #667586 48%, #7b5364 76%, #c5a96a 100%) border-box;
	box-shadow: 0 12px 28px -22px rgba(23,34,48,.45), inset 0 1px 0 rgba(255,255,255,.95);
}
.tbn-ql-group-front:hover,
.tbn-ql-topic-front:hover {
	box-shadow: 0 18px 34px -22px rgba(23,34,48,.48), 0 0 0 1px rgba(185,151,91,.22);
}
.tbn-ql-group-front.tbn-open,
.tbn-ql-topic-front.tbn-open {
	box-shadow: 0 22px 40px -26px rgba(23,34,48,.5), 0 0 24px rgba(185,151,91,.12);
}
.tbn-ql-group-toggle,
.tbn-ql-topic-toggle {
	background: linear-gradient(105deg, #f7f5ef 0%, #eef1f4 58%, #f3eef1 100%);
	color: #243247;
}
.tbn-ql-group-toggle:hover,
.tbn-ql-topic-toggle:hover {
	background: linear-gradient(105deg, #eee9dc 0%, #e7edf2 56%, #eee4e9 100%);
	color: #18283b;
}
.tbn-ql-group-front.tbn-open > .tbn-ql-group-toggle,
.tbn-ql-topic-front.tbn-open > .tbn-ql-topic-toggle {
	background: linear-gradient(105deg, #ece6d8 0%, #e7ebef 54%, #eee3e8 100%);
}
.tbn-ql-front-icon {
	background: linear-gradient(145deg, #f4eddf 0%, #e8edf1 55%, #eee3e8 100%);
	border-color: rgba(185,151,91,.38);
	box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 7px 16px -12px rgba(23,34,48,.55);
}
.tbn-ql-front-chevron,
.tbn-ql-arrow { color: #9a773e; }
.tbn-ql-link {
	background: linear-gradient(105deg, #faf9f6 0%, #f1f3f5 58%, #f6f0f3 100%);
	border-color: rgba(82,98,115,.18);
	color: #29384b;
}
.tbn-ql-link:hover {
	background: linear-gradient(105deg, #eee9dc 0%, #e6ebef 56%, #eee3e8 100%);
	border-color: rgba(154,119,62,.42);
	color: #18283b;
	box-shadow: 0 8px 18px -14px rgba(23,34,48,.6), inset 0 1px 0 rgba(255,255,255,.95);
}

/* ------------------------------------------------------------------ *
 * Info Box annotations (reader side)
 * ------------------------------------------------------------------ */
.tbn-annot {
	position: relative;
	cursor: pointer;
	background: linear-gradient(180deg, rgba(212,175,55,.20), rgba(212,175,55,.07));
	border-bottom: 2px dotted #8a6f00;
	border-radius: 2px;
	padding: 0 2px;
	transition: background .15s ease;
	touch-action: manipulation;
	-webkit-tap-highlight-color: transparent;
}
.tbn-annot:hover, .tbn-annot:focus-visible {
	background: rgba(212,175,55,.32);
	outline: none;
}
.tbn-annot::after {
	content: "";
	display: inline-block;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #8a6f00;
	margin-left: 4px;
	vertical-align: super;
	animation: tbn-annot-pulse 1.8s ease-in-out infinite;
}
@keyframes tbn-annot-pulse {
	0%, 100% { opacity: .55; transform: scale(1); }
	50% { opacity: 1; transform: scale(1.35); }
}

.tbn-annot-overlay {
	position: fixed;
	inset: 0;
	z-index: 999999;
	display: none;
	align-items: center;
	justify-content: center;
	perspective: 1400px;
}
.tbn-annot-overlay.tbn-open { display: flex; }
.tbn-annot-backdrop {
	position: absolute;
	inset: 0;
	background: radial-gradient(circle at 50% 40%, rgba(10,10,15,.6), rgba(5,5,8,.82));
	opacity: 0;
	transition: opacity .25s ease;
	backdrop-filter: blur(2px);
}
.tbn-annot-overlay.tbn-visible .tbn-annot-backdrop { opacity: 1; }
.tbn-annot-scene {
	position: relative;
	width: min(560px, 92vw);
	max-height: 84vh;
}
.tbn-annot-card {
	transform: translateZ(0) scale(.96);
	opacity: 0;
	transition: transform .22s cubic-bezier(.2,.8,.25,1), opacity .2s ease;
	will-change: transform, opacity;
	position: relative;
	background: #ffffff;
	color: #1d2634;
	border-radius: 16px;
	padding: 30px 26px 24px;
	max-height: 84vh;
	overflow-x: hidden;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	border: 2px solid var(--tbn-accent, #d4af37);
	box-shadow: 0 24px 60px rgba(15,23,42,.22), 0 6px 18px rgba(15,23,42,.12);
	scrollbar-width: thin;
	scrollbar-color: var(--tbn-accent, #d4af37) rgba(15,23,42,.06);
}
.tbn-annot-overlay.tbn-visible .tbn-annot-card {
	transform: translateZ(0) scale(1);
	opacity: 1;
}
.tbn-annot-card::-webkit-scrollbar { width: 6px; }
.tbn-annot-card::-webkit-scrollbar-thumb { border-radius: 999px; background: var(--tbn-accent, #d4af37); }
.tbn-annot-label {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #10182a;
	background: var(--tbn-accent, #d4af37);
	padding: 4px 10px;
	border-radius: 999px;
	margin-bottom: 12px;
}
.tbn-annot-content { font-size: 15px; line-height: 1.65; }
.tbn-annot-content img { max-width: 100%; height: auto; border-radius: 8px; }
.tbn-annot-content table { max-width: 100%; overflow-x: auto; display: block; }
.tbn-annot-close {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(15,23,42,.06);
	border: 1.5px solid rgba(15,23,42,.14);
	border-radius: 50%;
	font-size: 19px;
	line-height: 1;
	cursor: pointer;
	color: #1d2634;
	box-shadow: none;
	transition: transform .15s ease, background .15s ease, color .15s ease;
	z-index: 2;
}
.tbn-annot-close:hover {
	background: var(--tbn-accent, #d4af37);
	border-color: var(--tbn-accent, #d4af37);
	color: #10182a;
	transform: scale(1.08);
}
@media (max-width: 600px) {
	.tbn-annot-card { padding: 44px 18px 20px; border-radius: 14px; }
	.tbn-annot-close { top: 8px; right: 8px; width: 30px; height: 30px; font-size: 18px; }
	.tbn-annot-label { padding-right: 0; }
}

/* Image alignment set from the admin Info Box editor's align toolbar
 * carries through automatically via inline styles on the <img>; this just
 * makes sure floated images clear cleanly at the end of the note. */
.tbn-annot-content::after { content: ""; display: table; clear: both; }

/* Typewriter reveal for Info Box content (see frontend.js). Text nodes are
 * revealed progressively; non-text elements (images, tables, headings...)
 * simply fade in the moment the typing reaches them so nothing pops in
 * abruptly or jumps the layout around. */
.tbn-annot-content.tbn-tw-active [data-tbn-tw-pending] {
	opacity: 0;
	transition: opacity .25s ease;
}
.tbn-annot-content.tbn-tw-active [data-tbn-tw-shown] {
	opacity: 1;
}
 }


/* ================================================================
   2.16.2 — Language width matches Topic Introduction
   The dedicated Practice Questions utility has been removed. The language
   card now follows the same centered 860px reading width as the intro card
   on desktop, tablet, and mobile.
   ================================================================ */
.tbn-reader > .tbn-utility-row,
.tbn-reader > .tbn-utility-row .tbn-gtranslate-wrap,
.tbn-reader > .tbn-utility-row .tbn-language-card {
	width: 100% !important;
	max-width: 860px !important;
	box-sizing: border-box;
}
.tbn-reader > .tbn-utility-row {
	display: block !important;
	margin-left: auto !important;
	margin-right: auto !important;
	grid-template-columns: none !important;
}
.tbn-reader > .tbn-utility-row .tbn-gtranslate-wrap {
	max-width: 100% !important;
}
.tbn-reader > .tbn-utility-row .tbn-language-card {
	max-width: 100% !important;
}
@media (max-width: 600px) {
	.tbn-reader > .tbn-utility-row,
	.tbn-reader > .tbn-utility-row .tbn-gtranslate-wrap,
	.tbn-reader > .tbn-utility-row .tbn-language-card {
		width: 100% !important;
		max-width: 100% !important;
	}
}

/* Refined Info Box palette: professional academic navy, sapphire and warm gold. */
.tbn-annot-overlay .tbn-annot-backdrop {
	background: radial-gradient(circle at 50% 18%, rgba(31,55,88,.52), rgba(6,12,24,.86));
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
}
.tbn-annot-card {
	background: linear-gradient(180deg, #ffffff 0%, #f8fbff 55%, #f5f7fb 100%);
	color: #17243a;
	border: 1px solid rgba(202,169,91,.72);
	box-shadow: 0 30px 80px rgba(7,18,38,.34), 0 8px 24px rgba(31,55,88,.16), inset 0 1px 0 rgba(255,255,255,.96);
}
.tbn-annot-card::before {
	content: '';
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 5px;
	border-radius: 16px 16px 0 0;
	background: linear-gradient(90deg, #17233d, #42698f 48%, #caa95b 100%);
	box-shadow: 0 2px 10px rgba(23,35,61,.12);
	pointer-events: none;
}
.tbn-annot-label {
	color: #fff;
	background: linear-gradient(135deg, #17233d, #35577d 62%, #8f6d27);
	box-shadow: 0 6px 14px rgba(23,35,61,.16);
}
.tbn-annot-content {
	font-size: 15px;
	line-height: 1.72;
	color: #25344b;
}
.tbn-annot-content strong { color: #17233d; }
.tbn-annot-content a { color: #315f8c; }
.tbn-annot-close {
	background: rgba(23,35,61,.07);
	border-color: rgba(23,35,61,.14);
	color: #23324a;
}
.tbn-annot-close:hover {
	background: #17233d;
	border-color: #17233d;
	color: #fff;
}


/* ================================================================
   2.16.5 — Remove frontend copy-protection notice and blocking.
   No other reader/header styling is changed here.
   ================================================================ */
.tbn-header {
	background: linear-gradient(135deg, var(--tbn-navy-900) 0%, var(--tbn-navy-800) 55%, var(--tbn-navy-700) 100%);
	color: var(--tbn-text);
	border-bottom: 1px solid rgba(212,175,55,0.25);
	box-shadow: 0 10px 30px -12px rgba(0,0,0,0.55), 0 1px 0 rgba(255,255,255,0.03) inset;
}
.tbn-header .tbn-title-text { color: var(--tbn-text) !important; }

/* Google Translate can inject its own blue selection/highlight inline. */
.goog-text-highlight,
.goog-text-highlight * {
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
	color: inherit !important;
	border-color: transparent !important;
}

/* Keep Info Box annotation triggers gold; never allow a blue tap/focus flash. */
.tbn-annot,
.tbn-annot:focus,
.tbn-annot:focus-visible,
.tbn-annot:hover {
	-webkit-tap-highlight-color: transparent !important;
	background: linear-gradient(180deg, rgba(212,175,55,.20), rgba(212,175,55,.07)) !important;
}
.tbn-annot::selection,
.tbn-annot *::selection {
	background: rgba(212,175,55,.22) !important;
	color: inherit !important;
}

/* Fast, stable typewriter: avoid animation-induced layout jumps. */
.tbn-annot-content.tbn-tw-active {
	overflow-anchor: none;
	contain: layout paint;
}