/* Full sentence notes in one stable place on the source book. */
@media (min-width:1100px) and (min-aspect-ratio:5/4) {
  .book-note { position:absolute; z-index:3; top:18%; left:17%; right:6%; max-height:72%; overflow:auto; overscroll-behavior:contain; scrollbar-width:thin;
    padding:16px 18px; border-radius:6px; background:#f6eedc; color:#2f271d;
    box-shadow:0 1px 0 #ffffffa0 inset, 0 18px 38px #1a0f0670, 0 2px 6px #1a0f0638; animation:note-in .28s ease both; }
  @keyframes note-in { from { opacity:0; transform:translateY(-6px); } }
  .note-meaning { font-size:clamp(14px,1.15vw,17px); line-height:1.7; }
  .note-words { margin:14px 0 0; padding-top:12px; border-top:1px solid #2f271d22; display:grid; gap:6px; }
  .note-words>div { display:grid; grid-template-columns:minmax(64px,auto) 1fr; gap:14px; align-items:baseline; }
  .note-words dt,.note-words dd { margin:0; }
  .note-word { font-family:var(--serif); font-size:14px; color:#2f271d; padding:8px 6px; margin-left:-6px; min-height:44px; min-width:44px; }
  .note-words .needs-care .note-word { text-decoration:underline; text-decoration-color:var(--heart); text-underline-offset:4px; }
  .note-words dd { font-size:12px; color:#5d5141; }
  .note-details { margin-top:16px; font-size:13px; line-height:1.7; color:#4b4132; display:grid; gap:8px; }
  .note-actions { display:flex; gap:8px 14px; flex-wrap:wrap; }
  .note-actions .text-button { padding:8px 6px; margin-left:-6px; min-height:44px; font-size:12px; }
}
@media not all and (min-width:1100px) and (min-aspect-ratio:5/4) {

  .book-note { position:absolute; z-index:3; top:0; left:0; right:0; padding:14px 16px; border-radius:6px; background:#f6eedc; color:#2f271d;
    box-shadow:0 18px 38px #1a0f0680, 0 2px 6px #1a0f0640; animation:note-in .28s ease both; }
  .note-meaning { font-size:15px; line-height:1.7; }
  .note-words { margin:12px 0 0; padding-top:10px; border-top:1px solid #2f271d22; display:grid; gap:4px; }
  .note-words>div { display:grid; grid-template-columns:minmax(64px,auto) 1fr; gap:12px; align-items:baseline; }
  .note-words dt,.note-words dd { margin:0; }
  .note-word { font-family:var(--serif); font-size:14px; color:#2f271d; padding:8px 6px; margin-left:-6px; min-height:44px; min-width:44px; }
  .note-words .needs-care .note-word { text-decoration:underline; text-decoration-color:var(--heart); text-underline-offset:4px; }
  .note-words dd { font-size:12px; color:#5d5141; }
  .note-details { margin-top:16px; font-size:13px; line-height:1.7; color:#4b4132; display:grid; gap:8px; }
  .note-actions { display:flex; gap:8px 14px; flex-wrap:wrap; }
  .note-actions .text-button { padding:8px 6px; margin-left:-6px; min-height:44px; font-size:12px; }
  .book-note { max-height:min(100%,calc(24svh + 24px)); overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; }
}
