.info-tip { display: inline-flex; flex: none; align-items: center; vertical-align: middle; }
.info-tip-trigger { display: grid; place-items: center; width: 28px; height: 28px; padding: 6px; border: 0; border-radius: 0; color: var(--ink-3); background: transparent; }
.info-tip-trigger svg { width: 16px; height: 16px; }
.info-tip-trigger:is(:hover, :focus-visible, [aria-expanded="true"]) { color: var(--hot); background: var(--surface-2); }
.info-tip-content { position: fixed; inset: auto; margin: 0; width: max-content; max-width: 312px; padding: 14px 16px; border: 1px solid var(--line-strong); border-radius: 4px; background: var(--stage); color: var(--ink-2); font: var(--type-micro); text-transform: none; letter-spacing: 0; text-align: left; overflow: auto; overscroll-behavior: contain; }
.info-tip-content p { margin: 0; line-height: 1.5; }
.info-tip-content p + p { margin-top: 10px; }
.review-context { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--ink-3); font: var(--type-label); text-transform: uppercase; letter-spacing: var(--track-label); }
@media (pointer: coarse) { .info-tip-trigger { width: 40px; height: 40px; } }