/* hover-card.css — A-1451, A-1470 (Michael's walks, 2026-10-08 and 2026-10-09). Styles the ONE card
 * hover-card.js draws: the Market Dashboard's definition card, now on every page. White card, a bold
 * 12.5px header over 12px text in the secondary color, one shadow, positioned in the viewport
 * (position: fixed) so a clipping ancestor (an overflow:hidden group box) can never cut it off.
 * The fallbacks after each var() are the shell's light-theme values, for a page that defines no tokens.
 */
.hc-card {
    position: fixed; z-index: 2147483000; display: none; left: 0; top: 0;
    width: max-content; max-width: min(300px, calc(100vw - 16px));
    background: var(--surface, #ffffff); border: 1px solid var(--border, #d8d8d2); border-radius: var(--radius, 8px);
    padding: 10px 12px; box-shadow: 0 8px 28px rgba(0, 0, 0, 0.28); pointer-events: none;
    font-size: 12px; font-weight: 400; line-height: 1.5; letter-spacing: 0; text-transform: none;
    text-align: left; font-style: normal; color: var(--text-secondary, #5f6168);
}
.hc-card .hc-title { margin-bottom: 3px; font-size: 12.5px; font-weight: 700; color: var(--text, #1a1c20); white-space: normal; }
.hc-card .hc-body { white-space: pre-line; }
.hc-card.hc-wide { max-width: min(460px, calc(100vw - 16px)); }