.lesson-layout{grid-template-columns:1fr}.grammar-card p{margin-bottom:12px}.grammar-pattern,.grammar-example{display:grid;gap:5px;margin-top:12px;padding:13px;border-radius:12px;background:#f6eee2}.grammar-pattern code{font:700 16px/1.5 Inter,"Noto Sans SC",sans-serif;color:var(--red);white-space:normal}.grammar-example>span{font-size:20px;font-weight:800}.grammar-example small{display:block;color:var(--muted)}.quality-practice h3{margin:0 0 8px}.practice-prompt{font-size:19px;font-weight:800;color:var(--ink)}.quality-practice details{margin-top:12px;border:1px dashed #cdbb9f;border-radius:12px;padding:10px 12px}.quality-practice summary{cursor:pointer;font-weight:750;color:var(--red)}.quality-practice details div{margin-top:8px}.quality-question{border:1px solid var(--line);border-radius:16px;padding:16px;margin:15px 0;display:grid;gap:9px}.quality-question legend{font-weight:850;padding:0 6px}.quality-question .option{width:100%}.quality-feedback{min-height:24px;margin:3px 0 0;color:var(--red);font-weight:750}.writing-picker{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.writing-picker button{width:52px;height:52px;border:1px solid var(--line);border-radius:13px;background:var(--paper);font-size:26px}.writing-picker button.active{background:var(--red);color:white;border-color:var(--red)}.writing-workspace{display:grid;grid-template-columns:minmax(260px,460px) 1fr;gap:22px;align-items:start}.writing-board{position:relative;aspect-ratio:1;border:2px solid #d7c5ae;border-radius:18px;background:linear-gradient(to right,transparent 49.8%,#eadfce 50%,transparent 50.2%),linear-gradient(to bottom,transparent 49.8%,#eadfce 50%,transparent 50.2%),#fffdf8;overflow:hidden}.writing-board:before,.writing-board:after{content:"";position:absolute;inset:0;pointer-events:none}.writing-board:before{background:linear-gradient(45deg,transparent 49.8%,#f0e7d9 50%,transparent 50.2%)}.writing-board:after{background:linear-gradient(-45deg,transparent 49.8%,#f0e7d9 50%,transparent 50.2%)}.writing-board>span{position:absolute;inset:0;display:grid;place-items:center;color:#eadfce;font-family:"Noto Serif SC","SimSun",serif;font-size:clamp(180px,30vw,330px);line-height:1;pointer-events:none}.writing-board canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;z-index:2}.writing-help{background:#f6eee2;border-radius:16px;padding:18px}.writing-help ol{padding-left:22px}.writing-help .btn{margin-top:8px}@media(max-width:700px){.writing-workspace{grid-template-columns:1fr}.writing-help{order:-1}.tabs .tab{flex:1 1 42%}}
.lesson-side{display:none!important}
.lesson-layout{grid-template-columns:minmax(0,1fr)!important}
.practice-label{display:block;margin-bottom:6px;color:var(--muted);font-size:13px;font-weight:650}.practice-order-inputs{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}.practice-order-inputs label{display:flex;align-items:center;min-width:110px;flex:1 1 130px;max-width:220px;border:1px solid var(--line);border-radius:13px;background:white;overflow:hidden}.practice-order-inputs label>span{display:grid;place-items:center;align-self:stretch;min-width:34px;background:#f2eadc;color:var(--red);font-weight:800}.practice-order-inputs input{width:100%;min-width:0;border:0;background:transparent;padding:12px 10px;font:inherit;color:var(--ink);outline:0}.practice-order-inputs label:focus-within{border-color:var(--red);box-shadow:0 0 0 3px rgba(166,61,53,.1)}.practice-order-inputs input.correct{background:#e5efe8}.practice-order-inputs input.wrong{background:#f6dfdc}.practice-order-check{margin-top:2px}.practice-order-feedback{min-height:25px;margin:12px 0 0;font-weight:750}.practice-order-feedback[data-state="correct"]{color:#356346}.practice-order-feedback[data-state="wrong"],.practice-order-feedback[data-state="empty"]{color:var(--red)}@media(max-width:600px){.practice-order-inputs label{flex-basis:calc(50% - 5px);min-width:0;max-width:none}}
.practice-choice-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:18px 0}.practice-choice-options button{display:flex;align-items:center;gap:12px;min-height:52px;padding:9px 14px;border:1px solid var(--line);border-radius:14px;background:white;color:var(--ink);font:inherit;text-align:left}.practice-choice-options button>b{display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;border-radius:50%;background:#f2eadc;color:var(--red)}.practice-choice-options button:hover,.practice-choice-options button:focus-visible{border-color:var(--red)}.practice-choice-options button.correct{border-color:var(--sage);background:#e5efe8}.practice-choice-options button.wrong{border-color:var(--red);background:#f6dfdc}.practice-choice-feedback{min-height:25px;margin:10px 0 0;font-weight:750}.practice-choice-feedback[data-state="correct"]{color:#356346}.practice-choice-feedback[data-state="wrong"]{color:var(--red)}@media(max-width:600px){.practice-choice-options{grid-template-columns:1fr}}
.writing-step{display:flex;align-items:center;gap:12px;margin:0 0 14px}.writing-step>b{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--red);color:white}.writing-step>span{font-size:19px;font-weight:850}.writing-step small{display:block;margin-top:2px;color:var(--muted);font-size:12px;font-weight:500}.stroke-demo,.writing-practice{margin-top:18px;padding:20px;border:1px solid var(--line);border-radius:20px;background:#faf4e9}.stroke-animation-board{display:grid;place-items:center;width:min(100%,360px);min-height:320px;margin:0 auto;border:2px solid #d7c5ae;border-radius:18px;background:linear-gradient(to right,transparent 49.8%,#eadfce 50%,transparent 50.2%),linear-gradient(to bottom,transparent 49.8%,#eadfce 50%,transparent 50.2%),#fffdf8}.stroke-animation-board svg{max-width:100%;height:auto}.stroke-demo-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:16px}.stroke-status{text-align:center;color:var(--red);font-weight:750;min-height:24px}.writing-practice{position:relative;transition:opacity .2s}.writing-practice.is-locked{opacity:.68}.writing-board .writing-lock{position:absolute;inset:0;z-index:4;display:grid;place-items:center;text-align:center;padding:20px;background:rgba(255,253,248,.8);color:var(--red);font-weight:850;backdrop-filter:blur(2px)}.writing-practice:not(.is-locked) .writing-lock{display:none}.writing-practice.is-locked canvas{pointer-events:none}.writing-board canvas:focus-visible{outline:4px solid rgba(166,61,53,.22);outline-offset:-4px}@media(max-width:600px){.stroke-demo,.writing-practice{padding:14px}.stroke-animation-board{min-height:280px}.stroke-demo-actions .btn{flex:1 1 140px;padding:10px 8px}}
.writing-step{display:flex;align-items:center;gap:12px;margin:0 0 14px}.writing-step>b{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--red);color:white}.writing-step>span{font-size:19px;font-weight:850}.writing-step small{display:block;margin-top:2px;color:var(--muted);font-size:12px;font-weight:500}.stroke-demo,.writing-practice{margin-top:18px;padding:20px;border:1px solid var(--line);border-radius:20px;background:#faf4e9}.stroke-animation-board{display:grid;place-items:center;width:min(100%,360px);min-height:320px;margin:0 auto;border:2px solid #d7c5ae;border-radius:18px;background:linear-gradient(to right,transparent 49.8%,#eadfce 50%,transparent 50.2%),linear-gradient(to bottom,transparent 49.8%,#eadfce 50%,transparent 50.2%),#fffdf8}.stroke-animation-board svg{max-width:100%;height:auto}.stroke-demo-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:16px}.stroke-status{text-align:center;color:var(--red);font-weight:750;min-height:24px}.writing-practice{position:relative;transition:opacity .2s}.writing-practice.is-locked{opacity:.68}.writing-board .writing-lock{position:absolute;inset:0;z-index:4;display:grid;place-items:center;text-align:center;padding:20px;background:rgba(255,253,248,.8);color:var(--red);font-weight:850;backdrop-filter:blur(2px)}.writing-practice:not(.is-locked) .writing-lock{display:none}.writing-practice.is-locked #writingQuizTarget{pointer-events:none}#writingQuizTarget{display:grid;place-items:center;width:100%;height:100%;touch-action:none}#writingQuizTarget svg{width:100%;height:100%}.writing-score{margin-top:14px;padding:18px;border:1px solid #b9cfbd;border-radius:16px;background:#eef5ef}.writing-score[hidden]{display:none}.writing-score-value{display:flex;align-items:center;gap:10px;color:#315b3c}.writing-score-value strong{font-size:52px;line-height:1}.writing-score-value span{font-size:13px;font-weight:750}.writing-score p{font-weight:750}.writing-score dl{display:flex;gap:10px;margin:14px 0}.writing-score dl>div{flex:1;padding:10px;border-radius:10px;background:white}.writing-score dt{color:var(--muted);font-size:12px}.writing-score dd{margin:3px 0 0;font-size:20px;font-weight:850}.writing-score small,.writing-score-note{display:block;color:var(--muted);font-size:12px;line-height:1.5}.writing-score-note{margin-top:14px}@media(max-width:600px){.stroke-demo,.writing-practice{padding:14px}.stroke-animation-board{min-height:280px}.stroke-demo-actions .btn{flex:1 1 140px;padding:10px 8px}.writing-score-value strong{font-size:44px}}
.writing-content{min-width:0}.writing-help .writing-score{margin-top:18px}.writing-help .writing-score dl{flex-wrap:wrap}@media(max-width:700px){.writing-help{order:initial}}
.writing-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}.writing-actions .btn{margin-top:0;flex:1 1 145px}.stroke-demo-actions #beginWriting{display:none}
.writing-status{min-height:24px;margin:14px 0 0;padding:10px 12px;border-radius:12px;background:#fffdf8;color:var(--red);font-weight:750;line-height:1.5}
.stroke-animation-board canvas,#writingQuizTarget canvas{display:block;width:100%!important;height:100%!important;touch-action:none}
@media(max-width:420px){
  .lesson-main{padding-left:14px;padding-right:14px}
  .stroke-demo,.writing-practice{margin-left:-11px;margin-right:-11px;padding:10px}
  .stroke-animation-board{min-height:0;aspect-ratio:1}
  .writing-help{padding:14px}
  .writing-actions .btn{min-height:48px}
}