
.tap-describing[data-v-tap-describing] { display: flex; flex-direction: column; align-items: center; gap: 12px; width: 100%; height: 100%; overflow-y: auto; container-type: size;
}
.tap-describing[data-v-tap-describing] > * { flex-shrink: 0;
}
.tap-describing__controls[data-v-tap-describing] { display: flex; justify-content: space-between; width: 100%;
}
.tap-describing__controls button[data-v-tap-describing] { display: grid; place-items: center; width: 40px; height: 40px; border: 0; border-radius: 50%; background: transparent; color: inherit; font-size: 24px; cursor: pointer;
}
.tap-describing__controls button[data-v-tap-describing]:hover { background: #0000000d;
}
.tap-describing__prompt[data-v-tap-describing] { margin: 0; font-weight: 700; font-size: clamp(15px, 5cqw, 20px); text-align: center;
}
.tap-describing__story[data-v-tap-describing] { margin: 6px 0; width: 100%; color: inherit; font-size: clamp(20px, 8cqw, 32px); line-height: 1.8; text-align: center; white-space: pre-wrap;
}
.tap-describing__word[data-v-tap-describing] { padding: 2px 5px; margin: 0 -2px; border: 2px solid transparent; border-radius: 12px; background: transparent; color: inherit; font: inherit; line-height: 1.5; cursor: pointer;
}
.tap-describing__word[data-v-tap-describing]:hover:not(:disabled), .tap-describing__word[data-v-tap-describing]:focus-visible, .tap-describing__word.is-selected[data-v-tap-describing] { border-color: #6176b9; background: #eaf0ff;
}
.tap-describing__word.is-correct[data-v-tap-describing] { border-color: #258049; background: #e7f6ec;
}
.tap-describing__word.is-incorrect[data-v-tap-describing] { border-color: #b44e2c; background: #fff0e5;
}
.tap-describing__done[data-v-tap-describing] { padding: 8px 20px; border: 0; border-radius: 20px; background: #258049; color: white; font: inherit; cursor: pointer;
}
.tap-describing__done[data-v-tap-describing]:disabled { opacity: .5;
}
.tap-describing__none[data-v-tap-describing] { padding: 8px 14px; border: 1px solid #b5bccb; border-radius: 18px; background: white; color: inherit; cursor: pointer; font: inherit; font-size: 13px;
}
.tap-describing__none[aria-pressed="true"][data-v-tap-describing] { border-color: #6176b9; background: #eaf0ff;
}
.tap-describing__feedback[data-v-tap-describing], .tap-describing__instructions[data-v-tap-describing] { margin: 0; padding: 10px 12px; border-radius: 12px; background: #fff0e5; color: #8e3b1a; font-size: clamp(13px, 4.5cqw, 16px); line-height: 1.4; text-align: center;
}
.tap-describing__feedback.is-correct[data-v-tap-describing] { color: #236c3d; background: #e7f6ec;
}
.tap-describing__instructions[data-v-tap-describing] { background: #edf3ff; color: #43536a;
}
.tap-describing button[data-v-tap-describing]:focus-visible { outline: 3px solid #e69500; outline-offset: 2px;
}
.tap-describing button[data-v-tap-describing]:disabled { cursor: default;
}


.tap-describing-editor__page[data-v-tap-describing-editor] { display: grid; gap: 10px; margin: 14px 0; padding: 14px; border: 1px solid #d8dfe8; border-radius: 16px;
}
.tap-describing-editor__story[data-v-tap-describing-editor] { margin: 0; font-size: 19px; line-height: 1.7; white-space: pre-wrap;
}
.tap-describing-editor__story button[data-v-tap-describing-editor] { border: 1px solid transparent; border-radius: 10px; padding: 3px 6px; background: transparent; color: inherit; font: inherit; cursor: pointer;
}
.tap-describing-editor__story button[data-v-tap-describing-editor]:hover, .tap-describing-editor__story button[aria-pressed="true"][data-v-tap-describing-editor] { border-color: #6176b9; background: #eaf0ff;
}
.tap-describing-editor__noun[data-v-tap-describing-editor] { display: grid; gap: 6px; font-size: 14px;
}
.tap-describing-editor__noun input[data-v-tap-describing-editor] { border: 1px solid #b6bfca; border-radius: 12px; padding: 10px 12px; font: inherit; width: 100%;
}
.tap-describing-editor__none[data-v-tap-describing-editor] { display: flex; align-items: center; gap: 8px;
}
