.sq-toc {
	--sq-toc-bg: rgba(7, 10, 20, 0.92);
	--sq-toc-border: rgba(167, 139, 250, 0.4);
	--sq-toc-text: #e2e8f0;
	--sq-toc-muted: #94a3b8;
	--sq-toc-accent: #a78bfa;
	--sq-toc-cyan: #22d3ee;
	--sq-toc-width: 300px;
	position: fixed;
	top: 50%;
	right: 18px;
	transform: translateY(-50%);
	z-index: 99990;
	font-family: var(--sq-font, Outfit, system-ui, sans-serif);
	color: var(--sq-toc-text);
	width: var(--sq-toc-width);
	max-height: min(78vh, 720px);
	display: flex;
	flex-direction: column;
	align-items: stretch;
	pointer-events: none;
}
.sq-toc * { box-sizing: border-box; }
.sq-toc-toggle, .sq-toc-panel, .sq-toc-collapse, .sq-toc a { pointer-events: auto; }
.sq-toc-toggle {
	display: none;
	align-items: center;
	gap: 0.55rem;
	border: 1px solid var(--sq-toc-border);
	background: linear-gradient(135deg, rgba(168, 85, 247, 0.35), rgba(34, 211, 238, 0.18));
	color: #f8fafc;
	border-radius: 999px;
	padding: 0.7rem 1rem 0.7rem 0.85rem;
	font-weight: 800;
	font-size: 0.9rem;
	cursor: pointer;
	box-shadow: 0 12px 36px rgba(0, 0, 0, 0.35), 0 0 24px rgba(168, 85, 247, 0.25);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
}
.sq-toc-toggle:hover { filter: brightness(1.08); }
.sq-toc-toggle-icon { display: inline-flex; width: 18px; height: 18px; }
.sq-toc-toggle .sq-toc-ico-x { display: none; }
.sq-toc[data-open="true"] .sq-toc-toggle .sq-toc-ico-list { display: none; }
.sq-toc[data-open="true"] .sq-toc-toggle .sq-toc-ico-x { display: block; }
.sq-toc-panel {
	display: flex;
	flex-direction: column;
	max-height: min(78vh, 720px);
	border-radius: 16px;
	border: 1px solid var(--sq-toc-border);
	background:
		radial-gradient(ellipse 90% 70% at 100% 0%, rgba(168, 85, 247, 0.22), transparent 55%),
		radial-gradient(ellipse 70% 50% at 0% 100%, rgba(34, 211, 238, 0.12), transparent 50%),
		var(--sq-toc-bg);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45), 0 0 0 1px rgba(34, 211, 238, 0.08) inset, 0 0 40px rgba(168, 85, 247, 0.12);
	overflow: hidden;
}
.sq-toc[data-collapsed="true"] .sq-toc-panel { display: none; }
.sq-toc[data-collapsed="true"] { width: auto; right: 18px; }
.sq-toc[data-collapsed="true"] .sq-toc-toggle { display: inline-flex; }
.sq-toc-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.25rem 0.5rem;
	padding: 0.95rem 0.9rem 0.75rem 1rem;
	border-bottom: 1px solid rgba(148, 163, 184, 0.14);
	background: linear-gradient(90deg, rgba(168, 85, 247, 0.14), rgba(34, 211, 238, 0.06));
}
.sq-toc-kicker {
	width: 100%;
	font-family: var(--sq-mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
	font-size: 0.68rem;
	font-weight: 800;
	letter-spacing: 0.18em;
	color: var(--sq-toc-cyan);
}
.sq-toc-title {
	flex: 1 1 auto;
	font-size: 1.05rem;
	font-weight: 800;
	letter-spacing: -0.02em;
	color: #f8fafc;
}
.sq-toc-collapse {
	flex: 0 0 auto;
	width: 32px;
	height: 32px;
	border-radius: 8px;
	border: 1px solid rgba(167, 139, 250, 0.35);
	background: rgba(15, 23, 42, 0.55);
	color: #c4b5fd;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.sq-toc-collapse:hover { background: rgba(167, 139, 250, 0.2); color: #f5d0fe; }
.sq-toc-nav {
	overflow: auto;
	overscroll-behavior: contain;
	padding: 0.45rem 0.4rem;
	scrollbar-width: thin;
	scrollbar-color: rgba(167, 139, 250, 0.45) transparent;
}
.sq-toc-nav::-webkit-scrollbar { width: 6px; }
.sq-toc-nav::-webkit-scrollbar-thumb { background: rgba(167, 139, 250, 0.45); border-radius: 99px; }
.sq-toc-list { list-style: none; margin: 0; padding: 0; }
.sq-toc-item { margin: 0; }
.sq-toc-link {
	display: flex;
	align-items: flex-start;
	gap: 0.55rem;
	padding: 0.55rem 0.6rem;
	border-radius: 10px;
	text-decoration: none !important;
	color: var(--sq-toc-text) !important;
	font-weight: 650;
	font-size: 0.9rem;
	line-height: 1.3;
	border-left: 2px solid transparent;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.sq-toc-link:hover { background: rgba(167, 139, 250, 0.14); color: #f5d0fe !important; }
.sq-toc-link.is-active { background: rgba(34, 211, 238, 0.1); border-left-color: var(--sq-toc-cyan); color: #a5f3fc !important; }
.sq-toc-num {
	flex: 0 0 auto;
	min-width: 1.5rem;
	font-family: var(--sq-mono, ui-monospace, Menlo, Consolas, monospace);
	font-size: 0.72rem;
	font-weight: 800;
	color: var(--sq-toc-accent);
	padding-top: 0.12rem;
	letter-spacing: 0.03em;
}
.sq-toc-txt { flex: 1 1 auto; }
.sq-toc-sub {
	list-style: none;
	margin: 0 0 0.2rem 1.85rem;
	padding: 0 0 0.15rem 0.65rem;
	border-left: 2px solid rgba(34, 211, 238, 0.22);
}
.sq-toc-sub a {
	display: block;
	padding: 0.32rem 0.45rem;
	border-radius: 7px;
	text-decoration: none !important;
	color: #cbd5e1 !important;
	font-size: 0.82rem;
	font-weight: 500;
	line-height: 1.3;
}
.sq-toc-sub a:hover { background: rgba(34, 211, 238, 0.1); color: #67e8f9 !important; }
.sq-toc-sub a.is-active { color: #67e8f9 !important; background: rgba(34, 211, 238, 0.12); }
.sq-toc-foot { padding: 0.55rem 0.85rem 0.75rem; border-top: 1px solid rgba(148, 163, 184, 0.12); }
.sq-toc-top {
	font-family: var(--sq-mono, ui-monospace, Menlo, Consolas, monospace);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: var(--sq-toc-muted) !important;
	text-decoration: none !important;
}
.sq-toc-top:hover { color: var(--sq-toc-cyan) !important; }
@media (min-width: 1101px) {
	.sq-toc[data-collapsed="true"] { top: auto; bottom: 28px; transform: none; }
}
@media (max-width: 1100px) {
	.sq-toc { top: auto; bottom: 20px; right: 16px; left: auto; transform: none; width: auto; max-height: none; }
	.sq-toc-toggle { display: inline-flex; }
	.sq-toc-panel {
		display: none;
		position: fixed;
		right: 16px;
		bottom: 72px;
		width: min(320px, calc(100vw - 32px));
		max-height: min(70vh, 560px);
	}
	.sq-toc[data-open="true"] .sq-toc-panel { display: flex; }
	.sq-toc[data-collapsed="true"] .sq-toc-panel { display: none; }
	.sq-toc-collapse { display: none; }
}
@media (min-width: 1500px) {
	.sq-toc { right: 28px; --sq-toc-width: 320px; }
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto !important; }
}