.chaperon-main .play-heading > p { max-width: 60ch; }
.sentence-board { padding-top: .75rem; }
.message-route { display: flex; flex-wrap: wrap; gap: .5rem 1rem; list-style: none; padding: 0; margin: .6rem 0 1.5rem; }
.message-stop { display: flex; gap: .45rem; align-items: center; color: var(--chalk-soft); font-size: 1.05rem; }
.message-stop .message-number { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid var(--line); font: 500 1rem/1.2 "Atkinson Hyperlegible Next", sans-serif; }
.message-stop.is-current { color: var(--chalk); text-decoration: underline; text-underline-offset: .25em; }
.message-stop.is-sent .message-number { color: var(--object-ink); background: var(--green); border-color: var(--green); }
.sentence-board .story-line { font-size: 1.35rem; min-height: 0; margin-bottom: 1.6rem; }
.letter-workspace { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(240px, 1fr); gap: 2.5rem; align-items: start; }
.message-sheet { border-block: 1px solid var(--line); padding: 1.2rem 0; }
.message-sheet h3, .sentence-reserve h3 { font-size: 1.35rem; }
.instruction, .sentence-reserve > p { color: var(--chalk-soft); font-size: 1.1rem; max-width: 55ch; }
.sentence-slots { display: flex; flex-wrap: wrap; gap: .8rem; align-items: start; margin: 1.4rem 0 1rem; }
.sentence-slot { display: flex; flex-direction: column; align-items: stretch; min-width: 0; flex: 0 1 auto; }
.slot-number { font: 500 1rem/1.2 "Atkinson Hyperlegible Next", sans-serif; color: var(--chalk-soft); padding: 0 .25rem .4rem; }
.sentence-word { font: 500 1.6rem/1.3 "Atkinson Hyperlegible Next", sans-serif; min-height: 64px; min-width: 72px; max-width: 100%; border: 0; border-radius: 4px; padding: .55rem .8rem; color: var(--object-ink); background: var(--blue); box-shadow: 1px 3px 5px rgb(0 0 0 / 35%), inset 0 1px 1px rgb(255 255 255 / 50%); cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; }
.sentence-word:hover { background: var(--blue); }
.sentence-word.is-empty { border: 2px dashed var(--line); background: transparent; color: var(--chalk-soft); box-shadow: none; cursor: pointer; min-width: 88px; }
.sentence-word.is-empty:hover { border-color: var(--chalk); background: var(--raised); }
.sentence-word:disabled { opacity: 1; cursor: default; }
.sentence-word[aria-pressed="true"] { outline: 3px solid var(--chalk); outline-offset: 5px; }
.sentence-word.is-drop-target { outline: 3px solid var(--chalk); outline-offset: 4px; }
.sentence-word.is-drag-source { opacity: .4; }
.sentence-reserve { padding-top: 1.2rem; }
.reserve-words { display: flex; gap: .8rem; flex-wrap: wrap; min-height: 64px; margin: 1rem 0; }
.reserve-empty { margin: 0; align-self: center; color: var(--chalk-soft); font-size: 1.1rem; }
.return-word { width: 100%; min-height: 64px; border-style: dashed; text-align: left; font-size: 1.15rem; }
.return-word:disabled { opacity: 1; color: var(--chalk-soft); }
.return-word.is-drop-target { outline: 3px solid var(--chalk); outline-offset: 4px; background: var(--raised); }
.sentence-reading { margin: .8rem 0 0; min-height: 2.4em; font: 500 1.5rem/1.5 "Atkinson Hyperlegible Next", sans-serif; overflow-wrap: anywhere; }
.sentence-reading.is-validated { color: var(--green); }
.sentence-board .game-feedback { font-size: 1.25rem; min-height: 3em; margin-top: 1.5rem; }
.sentence-board .hint-text { font-size: 1.15rem; }
.sentence-ghost { position: fixed; z-index: 100; margin: 0; pointer-events: none; cursor: grabbing; box-shadow: 2px 8px 12px rgb(0 0 0 / 45%), inset 0 1px 1px rgb(255 255 255 / 60%); }
.message-sheet.is-sent .sentence-slots { animation: letter-sent 500ms cubic-bezier(.16,1,.3,1) both; }
@keyframes letter-sent { from { transform: translateY(0); } to { transform: translateY(-4px); } }
@media (max-width: 800px) {
  .letter-workspace { grid-template-columns: 1fr; gap: .4rem; }
  .sentence-reserve { padding-top: 1rem; }
  .sentence-reserve > p { max-width: 65ch; }
  .return-word { width: auto; min-width: 240px; }
}
@media (max-width: 480px) {
  .chaperon-main .adventure-scene { height: 170px; }
  .chaperon-main .scene-caption { left: .25rem; right: .25rem; font-size: .95rem; width: fit-content; max-width: calc(100% - .5rem); }
  .sentence-slots, .reserve-words { gap: .8rem .6rem; }
  .sentence-word { font-size: 1.5rem; padding-inline: .65rem; }
  .sentence-word.is-empty { min-width: 72px; }
  .message-route { gap: .65rem .9rem; }
  .message-stop { font-size: 1rem; }
  .message-stop .message-number { width: 28px; height: 28px; }
  .return-word { min-width: 0; width: 100%; }
  .sentence-reading { font-size: 1.5rem; }
}
@media (prefers-reduced-motion: reduce) { .message-sheet.is-sent .sentence-slots { animation: none; } }