/* Shared source-card component. All colors inherit the existing page palette. */
.lexicon-sources:has(.source-card) {
  --source-surface: var(--panel-soft, var(--panel));
  --source-ink: var(--text);
  --source-muted: var(--text-soft);
  --source-accent: color-mix(in srgb, var(--lex-gold, var(--accent)) 35%, var(--text) 65%);
  --source-highlight: color-mix(in srgb, var(--lex-gold, var(--accent)) 12%, var(--panel-soft, var(--panel)));
}
/* Source jumps land immediately, so the complete pulse is visible at the destination. */
html:has(.source-card:target), html:has(.cite-ref:target) { scroll-behavior: auto; }
html { --source-scroll-offset: calc(var(--header-height, 136px) + 24px); }
.lexicon-sources > ol:has(> .source-card) {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch; gap: 16px; margin: 24px 0; padding: 0; list-style: none;
}
.lexicon-content .lexicon-sources .source-card {
  display: flex; flex-direction: column; gap: 12px; min-width: 0; min-height: 272px;
  margin: 0; padding: 22px; border: 1px solid var(--line-strong, var(--line));
  border-radius: 6px; background: var(--source-surface); color: var(--source-ink);
  font-size: .9rem; line-height: 1.6; overflow-wrap: anywhere;
  scroll-margin-top: var(--source-scroll-offset) !important;
}
.lexicon-sources .source-card:hover { background: var(--source-highlight); }
.lexicon-content .lexicon-sources .source-card-title {
  color: var(--source-ink); font-size: 1.08rem; font-weight: 750; font-style: normal; line-height: 1.45;
}
.source-card-kicker { font-size: .75rem; font-weight: 750; letter-spacing: .08em; }
.source-card-kicker, .source-card-meta { color: var(--source-muted); }
.source-card-ref { color: var(--source-ink); }
.source-card-actions { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px 18px; margin-top: auto; padding-top: 8px; }
.lexicon-content .source-card-actions a,
.lexicon-content .source-card-actions a:hover,
.lexicon-content .source-card-actions a:focus-visible {
  color: var(--source-accent); font-size: .85rem; text-decoration: underline; text-decoration-color: currentColor;
  text-underline-offset: 3px;
}
.source-card-back { white-space: nowrap; }
.cite-ref { display: inline-block; border-radius: 2px; scroll-margin-top: var(--source-scroll-offset) !important; }
.source-card:focus:not(:focus-visible), .cite-ref:focus:not(:focus-visible) { outline: none; }
.source-card:focus-visible, .cite-ref:focus-visible { outline: 2px solid var(--source-accent, var(--lex-gold)); outline-offset: 4px; }
/* Suppress inherited focus-visible heuristics for an actual pointer interaction. */
.source-card.is-source-pointer-focus:focus, .cite-ref.is-source-pointer-focus:focus { outline: none; }
@keyframes source-card-pulse {
  0%, 30% { background-color: var(--source-highlight); box-shadow: inset 0 0 0 2px var(--source-accent); }
  100% { background-color: var(--source-surface); box-shadow: inset 0 0 0 0 var(--source-accent); }
}
@keyframes source-card-repeat {
  0%, 30% { background-color: var(--source-highlight); box-shadow: inset 0 0 0 2px var(--source-accent); }
  100% { background-color: var(--source-surface); box-shadow: inset 0 0 0 0 var(--source-accent); }
}
@keyframes source-ref-pulse {
  0%, 30% { background-color: color-mix(in srgb, var(--lex-gold, var(--accent)) 18%, var(--panel)); outline: 2px solid currentColor; }
  100% { background-color: transparent; outline: 0 solid currentColor; }
}
@keyframes source-ref-repeat {
  0%, 30% { background-color: color-mix(in srgb, var(--lex-gold, var(--accent)) 18%, var(--panel)); outline: 2px solid currentColor; }
  100% { background-color: transparent; outline: 0 solid currentColor; }
}
.source-card:target { animation: source-card-pulse 1.6s ease-out; }
.cite-ref:target { animation: source-ref-pulse 1.6s ease-out; }
.source-card.is-source-pulse { animation: source-card-repeat 1.6s ease-out; }
.cite-ref.is-source-pulse { animation: source-ref-repeat 1.6s ease-out; }
@media (max-width: 860px) { html { --source-scroll-offset: calc(var(--header-height, 128px) + 24px); } }
@media (max-width: 699px) {
  .lexicon-sources > ol:has(> .source-card) { grid-template-columns: minmax(0, 1fr); }
  .lexicon-content .lexicon-sources .source-card { min-height: 0; padding: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  .source-card:target, .cite-ref:target, .source-card.is-source-pulse, .cite-ref.is-source-pulse { animation: none; box-shadow: inset 0 0 0 2px currentColor; }
  .source-card.is-source-settled, .cite-ref.is-source-settled { box-shadow: none; }
}
