/* Glossary terms: dotted underline, help cursor, theme-token colors with
   dark fallbacks. */
.ssc-term {
	text-decoration: underline dotted;
	text-decoration-color: var(--accent, #3b82f6);
	text-decoration-thickness: 1.5px;
	text-underline-offset: 3px;
	cursor: help;
	border-radius: 3px;
}
.ssc-term:hover,
.ssc-term:focus-visible {
	background: color-mix(in srgb, var(--accent, #3b82f6) 14%, transparent);
}
.ssc-term:focus-visible {
	outline: 2px solid var(--accent, #3b82f6);
	outline-offset: 1px;
}

.ssc-glossary-tip {
	position: absolute;
	z-index: 60;
	background: var(--surface-2, #16203a);
	color: var(--text, #e8edf6);
	border: 1px solid var(--border, #223049);
	border-radius: var(--radius-md, 10px);
	box-shadow: var(--shadow-2, 0 6px 22px rgba(2, 6, 16, .35));
	padding: 10px 14px;
	font-size: 0.85rem;
	line-height: 1.5;
	pointer-events: none;
}
.ssc-glossary-tip::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -5px;
	transform: translateX(-50%) rotate(45deg);
	width: 9px;
	height: 9px;
	background: inherit;
	border-right: 1px solid var(--border, #223049);
	border-bottom: 1px solid var(--border, #223049);
}
.ssc-glossary-tip--below::after {
	bottom: auto;
	top: -5px;
	border: 0;
	border-left: 1px solid var(--border, #223049);
	border-top: 1px solid var(--border, #223049);
}
