/* 复习手感共用组件。文字与底色全部沿用两个主题的令牌。 */
.review-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-4); min-width: 0; }
.review-source { min-width: 0; margin: 0 0 var(--space-3); color: var(--ink-2); font-family: var(--mono, ui-monospace, "Cascadia Code", Consolas, monospace); font-size: var(--text-xs); overflow-wrap: anywhere; }
.review-source-link { display: block; }
#detail .detail-heading h2 { min-width: 0; overflow-wrap: anywhere; }
.review-preference { display: inline-flex; align-items: center; gap: var(--space-2); min-height: 40px; margin: 0; color: var(--ink-2); font-size: var(--text-sm); font-weight: 400; }
.review-preference input { width: 20px; height: 20px; min-height: 20px; margin: 0; accent-color: var(--accent); }
.review-recall { display: grid; gap: var(--space-2); margin: var(--space-4) 0; color: var(--ink-2); font-size: var(--text-sm); font-weight: 400; }
.review-recall input { width: 100%; min-width: 0; min-height: 42px; }
.review-reveal { display: block; width: 100%; min-height: 48px; margin: var(--space-4) 0; border-style: dashed; color: var(--ink); background: var(--surface); }
.review-reason { overflow-wrap: anywhere; }
.review-grade { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-1); min-width: 0; min-height: 64px; }
#review-grade-row { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.review-actions .review-grade { color: var(--ink); background: var(--surface); }
.review-interval { display: block; color: var(--ink-2); font-size: var(--text-xs); font-weight: 400; line-height: 1.35; white-space: nowrap; }
/* 间隔小字在统一浅底上，避免低分/高分底色改变文字对比度。 */
.focus-grade .review-interval { padding: 2px 4px; border-radius: var(--radius-compact); background: var(--surface); }
.review-suspended { display: inline-flex; align-items: center; min-height: 24px; padding: 1px var(--space-2); border: 1px solid var(--line); border-radius: var(--radius-pill); color: var(--ink-2); background: var(--surface); font-family: var(--mono, ui-monospace, "Cascadia Code", Consolas, monospace); font-size: var(--text-xs); }
.review-cap-controls { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); min-width: 0; color: var(--ink-2); font-size: var(--text-sm); }
.review-cap-controls label { display: inline-flex; align-items: center; gap: var(--space-2); margin: 0; color: var(--ink-2); font-size: var(--text-sm); font-weight: 400; }
.review-cap-controls select { width: auto; min-height: 40px; max-width: 100%; padding: var(--space-2); }
.review-cap-controls[hidden], .review-cap-controls label[hidden], .review-preference[hidden], .review-recall[hidden], .review-toolbar[hidden], .review-suspended[hidden] { display: none; }
.review-cap-note { width: 100%; margin: 0; color: var(--ink-2); font-size: var(--text-xs); overflow-wrap: anywhere; }
.review-more { position: relative; flex: 0 0 auto; }
.review-more[hidden], .review-more-menu[hidden], .review-reveal[hidden], .review-reason[hidden] { display: none; }
.review-more-button, .review-restore { min-height: 40px; }
.review-more-menu { position: absolute; top: calc(100% + var(--space-2)); right: 0; z-index: 60; display: grid; gap: var(--space-1); width: min(280px, calc(100vw - 40px)); padding: var(--space-2); border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); color: var(--ink); box-shadow: 0 8px 24px var(--soft); }
.review-more-action { min-height: 40px; width: 100%; padding: var(--space-2) var(--space-3); border-color: transparent; text-align: left; font-size: var(--text-sm); overflow-wrap: anywhere; }
.review-toast { position: fixed; left: 50%; bottom: calc(var(--space-4) + env(safe-area-inset-bottom, 0px)); z-index: 80; display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); width: min(560px, calc(100% - 24px)); max-width: 100%; padding: var(--space-3) var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); color: var(--ink); box-shadow: 0 8px 28px var(--soft); transform: translateX(-50%); }
.review-toast-text { min-width: 0; overflow-wrap: anywhere; font-size: var(--text-sm); }
.review-toast-action { flex: 0 0 auto; min-height: 40px; padding: var(--space-2) var(--space-3); color: var(--ink); background: var(--paper); }
.review-more :focus-visible, .review-toast :focus-visible, .review-reveal:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
@media (max-width: 599px) {
  #review-grade-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .review-toast { bottom: calc(var(--tabbar-h, 72px) + env(safe-area-inset-bottom, 0px) + var(--space-3)); }
  .focus-open .review-toast { bottom: calc(env(safe-area-inset-bottom, 0px) + var(--space-3)); }
  .review-toolbar { gap: var(--space-2); }
  .review-grade { padding-inline: 3px; }
}
