body[data-zhuyin="hidden"] .zhuyin { display: none !important; }
.reading-options { display:flex; justify-content:flex-end; margin:0 0 16px; }
.reading-toggle { display:inline-flex; align-items:center; gap:12px; padding:9px 15px; border:1px solid #c8d5b3; border-radius:12px; background:#fffef8; color:#607946; font-size:20px; min-height:46px; cursor:pointer; }
.toggle-mark { border-radius:50%; background:#e8eedc; width:25px; height:25px; display:grid; place-items:center; }
.child-screen .front-zhuyin { display:block; font-size:clamp(22px,2vw,30px); letter-spacing:.06em; line-height:1.7; margin-top:18px; overflow-wrap:anywhere; }
.child-screen .word-card, .child-screen .word-card.flipped { height:600px; min-height:600px; max-height:600px; }
.child-screen .word-card .card-content, .child-screen .word-card.flipped .card-content { flex:1 1 0; min-height:0; overflow-y:auto; overflow-x:hidden; scrollbar-gutter:stable; justify-content:safe center; }
.child-screen .word-card.flipped .card-content { justify-content:flex-start; }
.child-screen .card-meta, .child-screen .card-foot, .child-screen .compose-entry, .child-screen .card-content>span { flex-shrink:0; }
.child-screen .compose-entry { align-self:stretch; justify-content:center; border-top:1px dashed #d8dfc9; padding:12px 6px 2px; margin-top:8px; font-size:21px; min-height:46px; }
.recall-reading { font-size:28px; color:#718657; margin-bottom:24px; line-height:1.7; }
.writing-tabs { display:flex; gap:14px; margin-bottom:24px; }
.writing-tabs button { flex:1; }
.writing-prompt h3 { font-size:28px; line-height:1.6; color:#566f3e; margin:20px 0; }
.writing-prompt label { display:flex; align-items:center; gap:16px; font-size:22px; }
.writing-prompt select { width:auto; min-width:90px; font-size:30px; }
#writing-form>label { font-size:22px; color:#5c7344; }
#writing-response { font-size:28px; line-height:1.7; padding:16px; width:100%; resize:vertical; min-height:110px; }
.writing-error { color:#996543; font-size:20px; margin:8px 0; }
.writing-error:empty { display:none; }
.writing-example { padding:16px; background:#eef2e4; border-radius:12px; font-size:23px; line-height:1.8; overflow-wrap:anywhere; }
.writing-note { color:#81906c; font-size:18px; line-height:1.7; }
.writing-recent { margin-top:26px; border-top:1px solid #dbe3ce; padding-top:18px; }
.writing-recent summary { cursor:pointer; font-size:19px; color:#637c49; }
.writing-recent article { padding:16px 0; border-bottom:1px solid #e3e8d8; }
.writing-recent article span { color:#849471; font-size:16px; }
.writing-recent p,.saved-response,.writing-response { white-space:pre-wrap; overflow-wrap:anywhere; }
.writing-recent p { font-size:23px; margin:6px 0; }
.writing-saved { text-align:center; position:relative; }
.writing-saved .completion-image { width:150px; height:160px; object-fit:contain; }
.writing-saved h3 { font-size:27px; color:#627e45; }
.writing-saved .saved-response { font-size:30px; line-height:1.8; padding:20px; background:#f0f4e8; border-radius:14px; }
.event-dot.writing { background:#bda574; }
@media(max-width:700px) {
  .reading-options { margin-bottom:12px; }
  .reading-toggle { font-size:18px; }
  .child-screen .front-zhuyin { font-size:23px; margin-top:12px; }
  .child-screen .word-card, .child-screen .word-card.flipped { height:480px; min-height:480px; max-height:480px; }
  .child-screen .compose-entry { font-size:19px; }
  .writing-tabs { gap:10px; }
  .writing-prompt h3 { font-size:25px; }
  #writing-response { font-size:26px; }
}
