/* A little card-table energy, with a still surface while reading. */
.common-ground .quote-stack { position: relative; isolation: isolate; perspective: 1000px; --deal-angle: -1.4deg; }
.common-ground .quote-stack::before,
.common-ground .quote-stack::after { content: ""; position: absolute; inset: 4px 3px -4px; border-radius: 15px; pointer-events: none; z-index: -1; transition: transform .5s cubic-bezier(.22, 1, .36, 1); }
.common-ground .quote-stack::before { background: #e7dfc7; transform: translateY(3px) rotate(calc(var(--deal-angle) * -1)); }
.common-ground .quote-stack::after { background: #d0c4e4; transform: rotate(var(--deal-angle)); }
.common-ground .quote-card { position: relative; border: 1px solid #d7cce7; box-shadow: 0 3px 0 #6e5b9110; transform-origin: 50% 70%; }
.common-ground .swap-window { position: absolute; inset: 0; z-index: 3; overflow: clip; border-radius: 12px; perspective: 1000px; pointer-events: none; }
.common-ground .quote-stack[data-card-motion="flipbook"] .quote-card { transform-origin: center top; }
.common-ground .quote-stack[data-card-motion="book"] .quote-card { transform-origin: left center; }
.common-ground .quote-stack .swap-leaf { position: absolute; inset: 0; z-index: 3; width: 100%; height: 100%; min-height: 0; margin: 0; backface-visibility: hidden; pointer-events: none; will-change: transform; }
.common-ground .swap-leaf::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: linear-gradient(0deg, #352c451a, transparent 35%); }
.common-ground [data-card-motion="book"] .swap-leaf::after { background: linear-gradient(90deg, #352c452b, transparent 45%, #fff3); }
.common-ground [data-card-motion="notepad"] .swap-leaf::after { background: linear-gradient(180deg, #352c4510, transparent 30%); }
.common-ground .quote-loading { display: none; position: absolute; inset: 0; flex-direction: column; align-items: center; justify-content: center; gap: 17px; }
.common-ground .quote-loading .wordmark { font-size: clamp(32px, 5vw, 43px); font-weight: 800; }
.common-ground .quote-loading .loading-caption { font-size: 11px; color: #77658c; letter-spacing: .02em; }
.common-ground .quote-card.is-loading .quote-loading { display: flex; }
.common-ground .quote-card.is-loading .quote-text { visibility: hidden; }
.common-ground.loading-game .daily-idle .quote-stack { display: block; }
.common-ground.loading-game .answer-zone { visibility: hidden; }
.common-ground.loading-game .daily-lobby, .common-ground.loading-game .leaderboard { display: none; }
.card-motion-picker { display: grid; gap: 8px; margin: 0 0 10px; padding: 0 0 13px; border-bottom: 1px solid #8884; }
.card-motion-picker label { font-size: 11px; font-weight: 650; }
.card-motion-picker select { width: 100%; min-height: 38px; padding: 7px 9px; border: 1px solid #8886; border-radius: 7px; background: var(--challenge-surface, #faf9f6); color: inherit; font: inherit; font-size: 12px; }
.card-motion-picker a { width: fit-content; font-size: 11px; }
.common-ground .answer-zone { position: relative; margin-top: 5px; }
.common-ground .choice { transform-origin: 50% 70%; box-shadow: 0 4px 0 #302d3615; transition: transform .24s cubic-bezier(.2, 1.6, .4, 1), box-shadow .2s, border-color .2s; }
.common-ground .choice-icon { transition: transform .3s cubic-bezier(.2, 1.6, .4, 1); }
.common-ground .choice kbd { transition: transform .2s, opacity .2s; }
.common-ground .choice:focus-visible { border-color: #6e5b91; }
.common-ground .choice:active:not(:disabled) { transform: translateY(3px) scale(.98); box-shadow: 0 1px 0 #302d3620; }
.common-ground .feedback.visible { animation: none; }
/* Verdicts remain visible until Next, including with sound and motion off. */
.common-ground .feedback.visible { grid-template-columns: 38px minmax(0, 1fr) auto; border: 1px solid #b3cba2; background: #e7efdf; }
.common-ground .feedback.visible.incorrect { border-color: #dfb2bd; background: #f4e3e8; }
.common-ground .feedback .feedback-icon { width: 38px; height: 38px; background: #52793f; color: #fff; font-size: 23px; }
.common-ground .feedback.incorrect .feedback-icon { background: #ad4c61; color: #fff; }
.common-ground .feedback-title { color: #355a28; }
.common-ground .feedback.incorrect .feedback-title { color: #98374b; }
.common-ground .inline-answers .choices { height: 84px; grid-template-rows: 84px; }
.common-ground .choice-slot { display: grid; min-width: 0; height: 84px; }
.common-ground .song-slot { grid-column: 1; grid-row: 1; }
.common-ground .bible-slot { grid-column: 2; grid-row: 1; }
.common-ground .choice-slot > .choice { width: 100%; height: 100%; }
body.simplified .inline-answers > .feedback { display: none; }
.common-ground .choice-slot.is-answer { height: 84px; min-height: 84px; border: 1px solid #88a573; border-radius: 9px; box-shadow: 0 4px 0 #302d3615; }
.common-ground .choice-slot.is-answer.song-slot { background: #f0e3a0; }
.common-ground .choice-slot.is-answer.bible-slot { background: #c4d9ad; }
.common-ground .choice-slot.is-answer.is-miss { background: #f4e3e8; border-color: #c88593; }
body.simplified .inline-answers .choice-slot.is-answer .feedback { position: relative; grid-template-columns: 22px minmax(0, 1fr); height: 82px; min-height: 82px; max-height: 82px; gap: 8px; padding: 10px 12px 18px; border: 0; border-radius: inherit; background: transparent; align-items: center; }
.common-ground .choice-slot.is-answer .feedback-icon { width: 24px; height: 24px; font-size: 17px; }
body.simplified .inline-answers .feedback-copy { min-height: 0; min-width: 0; }
.common-ground .choice-slot.is-answer .feedback-copy { position: relative; z-index: 2; pointer-events: none; }
.common-ground .choice-slot.is-answer .feedback-icon { pointer-events: none; }
.common-ground .choice-slot.is-answer .reveal-sources summary,
.common-ground .choice-slot.is-answer .music-links { pointer-events: auto; }
.common-ground .choice-slot.is-answer .feedback-title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: 0 0 3px; font-size: 12px; line-height: 14px; }
.common-ground .choice-slot.is-answer .feedback-detail { font-size: 10px; line-height: 13px; }
.common-ground .choice-slot.is-answer .reveal-sources { position: relative; }
.common-ground .choice-slot.is-answer .reveal-sources summary { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; width: 100%; }
.common-ground .choice-slot.is-answer .reveal-sources .music-links { position: absolute; top: calc(100% + 8px); z-index: 30; display: flex; width: 230px; max-width: calc(100vw - 48px); margin: 0; padding: 10px 13px; gap: 0 12px; border: 1px solid #d7cce7; border-radius: 9px; background: #fffdf8; color: #302d36; box-shadow: 0 8px 24px #302d3620; }
.common-ground .choice-slot.is-answer .reveal-sources:not([open]) .music-links { display: none; }
.common-ground .song-slot .music-links { left: 0; }
.common-ground .bible-slot .music-links { right: 0; }
.common-ground .source-full-citation { display: block; width: 100%; padding-bottom: 4px; line-height: 1.5; }
.common-ground .choice-slot.is-answer .next { position: absolute; inset: 0; z-index: 1; display: flex; align-items: end; justify-content: end; width: 100%; height: 100%; min-height: 0; margin: 0; padding: 0 10px 5px; gap: 0; border: 0; border-radius: inherit; background: transparent; color: #635e6a; font-size: 10px; font-weight: 500; line-height: 12px; cursor: pointer; }
.common-ground .choice-slot.is-answer .next-hint { pointer-events: none; }
.common-ground .choice-slot.is-answer .next:hover:not(:disabled) { transform: none; box-shadow: none; background: #302d3607; }
.common-ground .choice-slot.is-answer .next:active:not(:disabled) { transform: none; box-shadow: none; background: #302d3610; }
.common-ground .next,
.common-ground #start-daily,
.common-ground .challenge-action { transition: transform .22s cubic-bezier(.2, 1.6, .4, 1), box-shadow .2s; }
.common-ground .next .arrow,
.common-ground #start-daily span { display: inline-block; transition: transform .22s; }
.common-ground .next:active:not(:disabled) { transform: translateY(2px) scale(.96); }
.common-ground .mode-picker button { transition: background .2s, opacity .2s, transform .2s; }
.common-ground .mode-picker button:active:not(:disabled) { transform: scale(.94); }
.common-ground .lobby-art { animation: vv-cover-in .65s cubic-bezier(.22, 1, .36, 1) both; }
.common-ground .lobby-badge { animation: vv-sticker-in .6s cubic-bezier(.2, 1.6, .4, 1) both; transform-origin: 75% 50%; }
.common-ground .leaderboard > summary,
.common-ground .compact-actions .sound-toggle,
.common-ground .more-menu > summary { transition: transform .2s, background .2s, box-shadow .2s; }
.common-ground .leaderboard[open] .leaderboard-content,
.common-ground .more-menu[open] .more-menu-content { animation: vv-panel-in .22s ease-out both; transform-origin: top right; }
.common-ground .strike.used { animation: vv-strike-in .3s cubic-bezier(.2, 1.6, .4, 1); }

@media (hover: hover) and (pointer: fine) {
  .common-ground .choice.song:hover:not(:disabled) { transform: translateY(-4px) rotate(-1.5deg); border-color: #b9a855; box-shadow: 2px 7px 0 #302d3615; }
  .common-ground .choice.bible:hover:not(:disabled) { transform: translateY(-4px) rotate(1.5deg); border-color: #8faa6e; box-shadow: -2px 7px 0 #302d3615; }
  .common-ground .choice:hover:not(:disabled) .choice-icon { transform: rotate(-12deg) scale(1.12); }
  .common-ground .choice.bible:hover:not(:disabled) .choice-icon { transform: rotate(10deg) scale(1.12); }
  .common-ground .choice:hover:not(:disabled) kbd { opacity: 1; transform: translateX(3px); }
  .common-ground .choice.song:hover:not(:disabled) kbd { transform: translateX(-3px); }
  .common-ground .next:hover:not(:disabled),
  .common-ground #start-daily:hover:not(:disabled),
  .common-ground .challenge-action:hover:not(:disabled) { transform: translateY(-2px) rotate(-2deg); box-shadow: 2px 5px 0 #302d3620; }
  .common-ground .next:hover:not(:disabled) .arrow,
  .common-ground #start-daily:hover:not(:disabled) span { transform: translateX(4px); }
  .common-ground .leaderboard > summary:hover { transform: rotate(-1.5deg); box-shadow: 0 3px 0 #302d360c; }
  .common-ground .compact-actions .sound-toggle:hover { transform: rotate(-9deg); }
  .common-ground .more-menu > summary:hover { transform: rotate(8deg); }
  .common-ground .choice.song:active:not(:disabled),
  .common-ground .choice.bible:active:not(:disabled),
  .common-ground .next:active:not(:disabled),
  .common-ground #start-daily:active:not(:disabled),
  .common-ground .challenge-action:active:not(:disabled) { transform: translateY(2px) scale(.98); box-shadow: 0 1px 0 #302d3620; }
}
@keyframes vv-cover-in { from { opacity: 0; transform: translateY(14px) rotate(-9deg) scale(.9); } to { opacity: 1; transform: none; } }
@keyframes vv-sticker-in { from { opacity: 0; transform: rotate(16deg) scale(.75); } to { opacity: 1; transform: rotate(4deg); } }
@keyframes vv-panel-in { from { opacity: 0; transform: translateY(-6px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes vv-strike-in { from { transform: scale(.6) rotate(-25deg); } to { transform: none; } }
@media (max-width: 640px) {
  body.simplified .inline-answers .choice-slot.is-answer .feedback { grid-template-columns: 18px minmax(0, 1fr); gap: 5px; padding: 8px 7px 17px; }
  .common-ground .choice-slot.is-answer .feedback-icon { width: 20px; height: 20px; font-size: 15px; }
  .common-ground .choice-slot.is-answer .feedback-title { font-size: 11px; }
  .common-ground .quote-stack { --deal-angle: -.9deg; }
  .common-ground .quote-stack::before, .common-ground .quote-stack::after { inset-inline: 5px; }
}
@media (prefers-reduced-motion: reduce) {
  .common-ground *, .common-ground *::before, .common-ground *::after { animation: none !important; transition: none !important; }
  .common-ground .choice:hover:not(:disabled), .common-ground .next:hover:not(:disabled),
  .common-ground #start-daily:hover:not(:disabled), .common-ground .challenge-action:hover:not(:disabled),
  .common-ground .choice-icon, .common-ground .choice kbd, .common-ground .next .arrow,
  .common-ground #start-daily span, .common-ground .leaderboard > summary:hover,
  .common-ground .compact-actions .sound-toggle:hover, .common-ground .more-menu > summary:hover { transform: none !important; }
}