/* * Glossary tooltip styles (pairs with /glossary-tooltip.js). * * The JS appends a single .glossary-tooltip element to and toggles the * .visible class on hover/focus. Without these rules the element renders as a * plain block at the bottom of the page, so it MUST stay loaded wherever the * script is. */ /* Inline glossary term links inside course content. */ .glossary-term { border-bottom: 1px dotted currentColor; text-decoration: none; cursor: help; color: inherit; } .glossary-term:hover, .glossary-term:focus { border-bottom-style: solid; } /* Floating definition popover. Hidden and out of flow until .visible. */ .glossary-tooltip { position: absolute; top: 0; left: 0; z-index: 1080; max-width: 320px; padding: 0.6rem 0.75rem; border-radius: 8px; background: #1f2937; color: #f9fafb; box-shadow: 0 6px 24px rgba(0, 0, 0, 0.28); font-size: 0.82rem; line-height: 1.4; text-transform: none; letter-spacing: normal; pointer-events: none; opacity: 0; visibility: hidden; transition: opacity 0.12s ease; } .glossary-tooltip.visible { opacity: 1; visibility: visible; } .glossary-tooltip-title { font-weight: 700; margin-bottom: 0.2rem; } .glossary-tooltip-definition { font-weight: 400; opacity: 0.92; }