.math-equation { display: inline-flex; align-items: center; gap: 7px; }
.math-info { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; margin: -5px 0; padding: 0; color: var(--dim); pointer-events: auto; transition: color .2s; }
.math-info svg { width: 12px; height: 12px; }
.math-info:hover, .math-info[aria-expanded="true"] { color: var(--accent); }
.math-info:focus-visible { outline: 1px solid var(--accent); outline-offset: 2px; }
.math-card { position: fixed; z-index: 30; width: var(--detail-card-width); max-width: calc(100vw - 2 * var(--pad)); max-height: calc(100dvh - 24px); overflow: auto; padding: 16px 16px 0; background: var(--bg); border: 1px solid var(--line); color: var(--fg); font-family: var(--sans); animation: math-card-in .18s ease-out; }
.math-card[hidden] { display: none; }
.math-card::before { content: ""; position: absolute; inset: -1px; pointer-events: none; background: linear-gradient(var(--accent), var(--accent)) left top / 16px 1px no-repeat, linear-gradient(var(--accent), var(--accent)) left top / 1px 16px no-repeat, linear-gradient(var(--fg-2), var(--fg-2)) right bottom / 9px 1px no-repeat, linear-gradient(var(--fg-2), var(--fg-2)) right bottom / 1px 9px no-repeat; }
.math-card-meta { display: flex; align-items: center; gap: 6px; font-family: var(--mono); font-feature-settings: "zero" 1; font-size: 9px; line-height: 1.55; letter-spacing: .04em; color: var(--dim); }
.math-card-meta span:last-child { color: var(--accent); }
.math-card h2 { margin: 22px 0 14px; font-size: 27px; font-weight: 450; line-height: 1.15; letter-spacing: -.045em; }
.math-card p { margin: 0; font-size: 13px; line-height: 1.65; color: var(--fg-2); }
.math-card-graphic { display: flex; align-items: center; justify-content: center; min-height: 108px; margin: 20px 0; padding: 16px; }
.math-card-graphic img { display: block; width: 100%; height: auto; max-height: 130px; object-fit: contain; filter: invert(1); mix-blend-mode: screen; }
:root[data-theme="light"] .math-card-graphic img { filter: none; mix-blend-mode: multiply; }
.math-card p.math-card-rule { padding-left: 12px; border-left: 1px solid rgba(var(--accent-rgb),.5); color: var(--fg); }
.math-card-foot { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px 12px; margin: 24px -16px 0; padding: 16px; border-top: 1px solid var(--line); font-family: var(--mono); font-feature-settings: "zero" 1; font-size: 9px; line-height: 1.55; color: var(--dim); }
.math-card-foot a:hover { color: var(--accent); }
.math-card-foot a:focus-visible { outline: 1px solid var(--accent); outline-offset: 4px; }
@keyframes math-card-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .math-card { animation: none; } }
