@font-face{font-family:Arabic;src:url('./fonts/arabic.woff2') format('woff2');font-display:swap}
:root{font-family:"Segoe UI",Arial,sans-serif;color:#233c34;background:#f8f7f2;font-synthesis:none;--green:#254b42;--muted:#6b776d;--line:#dfe2d8}
*{box-sizing:border-box}body{margin:0}button{font:inherit;cursor:pointer;touch-action:manipulation}button:focus-visible,a:focus-visible{outline:3px solid #aa6938;outline-offset:5px}button:disabled{cursor:default}button,a{-webkit-tap-highlight-color:transparent}.skip-link{position:absolute;left:12px;top:-100px;padding:12px;background:white;z-index:10}.skip-link:focus{top:12px}.site-header{max-width:1000px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:30px 36px}.brand{display:flex;align-items:center;gap:10px;font-family:Georgia,serif;font-size:36px;font-weight:700;letter-spacing:-1.8px}.brand-mark{font-family:Arabic,"Traditional Arabic",serif;font-weight:400;font-size:34px;width:35px;height:43px;line-height:41px;text-align:center;color:#e2ecbb;background:var(--green);border-radius:12px 12px 4px 12px}.brand-dot{color:#94a476}.header-note{font-size:12px;color:var(--muted)}main{width:min(100% - 40px,580px);margin:32px auto 0;outline:none}.course-progress{margin:0 4px 22px}.progress-text{display:flex;justify-content:space-between;gap:16px;font-size:11px;color:var(--muted);margin-bottom:12px}.progress-text span:first-child{color:var(--green);font-weight:600}.progress-track{height:4px;background:#e1e5d8;border-radius:8px;overflow:hidden}.progress-fill{height:100%;background:#7e986e;transition:width .2s}.lesson{background:#fffefb;border:1px solid var(--line);border-radius:23px;overflow:hidden;box-shadow:0 10px 40px #254b4203}.lesson-content{padding:30px 38px 27px;text-align:center}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:600;text-transform:uppercase;color:#7c8a70;margin:0 0 12px}h1{font-family:Georgia,"Times New Roman",serif;font-size:32px;line-height:1.2;font-weight:400;letter-spacing:-.6px;margin:0}.ar{font-family:Arabic,"Traditional Arabic",Tahoma,serif;direction:rtl;letter-spacing:0;font-weight:400}.glyph{font-size:106px;line-height:1.8;min-height:170px;display:flex;align-items:center;justify-content:center;white-space:pre-wrap;overflow-wrap:anywhere;margin:8px 0 0}.glyph.word{font-size:76px}.glyph.rule{font-size:74px}.reading{font-family:Georgia,serif;font-size:25px;line-height:1.3;margin:0 0 18px}.explanation{font-size:15px;color:#5f6f62;line-height:1.8;margin:0 auto 18px;max-width:430px}.cue{font-size:13px;line-height:1.75;color:#5e7055;padding:14px 19px;margin:21px 0 0;border-radius:12px;background:#f1f4e7;text-align:left}.audio-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:11px 18px;min-height:44px;border:1px solid #d9dfcd;background:transparent;border-radius:24px;font-size:13px;color:var(--green)}.audio-button:hover{background:#f0f4e5}.audio-button svg{width:17px;height:17px}.audio-button.playing{background:#edf2df}.audio-button.large{width:100px;height:100px;border-radius:50%;background:#edf2df;box-shadow:0 0 0 12px #f6f8ef}.audio-button.large svg{width:34px;height:34px}.listen-stage{display:flex;align-items:center;justify-content:center;min-height:190px}.listen-note{font-size:12px;color:var(--muted);margin:0 0 18px}.lesson-bottom{padding:20px 28px;border-top:1px solid var(--line);background:#fdfcf7}.primary{display:flex;align-items:center;justify-content:center;gap:16px;width:100%;min-height:49px;border:1px solid var(--green);border-radius:10px;background:var(--green);color:white;font-size:14px;font-weight:550;padding:12px 19px}.primary:hover{background:#326052}.choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;text-align:center;margin-top:6px}.choice{min-height:65px;padding:15px 8px;border:1px solid #d6ddcd;border-radius:11px;background:transparent;color:var(--green);font-size:19px;line-height:1.35;overflow-wrap:anywhere}.choice.long{font-size:13px}.choice.ar{font-size:37px;line-height:1.5}.choice:hover:not(:disabled){border-color:#8aa377;background:#f3f6e9}.choice.rejected{background:#f9ede5;border-color:#c59a80;color:#936d56;opacity:.65}.choice.correct{border-color:#729453;background:#e9f0d9}.choice:disabled:not(.correct):not(.rejected){opacity:.45}.feedback{margin-top:20px;border-radius:12px;background:#edf3df;padding:16px 18px;text-align:left;font-size:13px;line-height:1.75}.feedback.wrong{background:#f7ecdf;color:#775b40}.feedback strong{display:block;color:var(--green);margin-bottom:4px}.feedback.wrong strong{color:#775b40}.feedback p{margin:0}.feedback .audio-button{margin-top:12px}.check-note{margin:20px 0 0;color:var(--muted);font-size:12px;line-height:1.6}.chunks{display:flex;justify-content:center;gap:9px;direction:rtl;margin:0 0 20px}.chunk{min-width:50px;padding:5px 10px;background:#f4f5ec;border-radius:8px}.chunk .ar{display:block;font-size:26px;line-height:1.6}.chunk small{font-size:11px;color:var(--muted);display:block;direction:ltr}footer{width:min(100% - 40px,580px);margin:26px auto 28px;display:flex;flex-direction:column;gap:7px;text-align:center;font-size:10px;line-height:1.6;color:#7a8576}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:10;background:var(--green);color:white;padding:14px 20px;border-radius:11px;font-size:13px;max-width:min(90vw,500px);box-shadow:0 5px 30px #173e3420;display:none;line-height:1.7}#toast.visible{display:block}.finish{padding:45px 35px}.finish-mark{display:grid;place-items:center;width:80px;height:80px;border-radius:50%;background:#e8efda;margin:0 auto 25px;font-size:32px}.finish h1{margin-bottom:20px}.finish .primary{margin-top:30px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:600px){.site-header{padding:22px 23px}.brand{font-size:32px}.brand-mark{width:31px;height:37px;line-height:35px;font-size:31px}.header-note{font-size:10px}main{margin-top:18px;width:calc(100% - 32px)}.lesson-content{padding:26px 23px 23px}h1{font-size:29px}.glyph{font-size:100px;min-height:157px;line-height:1.65}.glyph.word,.glyph.rule{font-size:64px}.explanation{font-size:14px}.cue{font-size:12px;padding:13px 16px}.lesson-bottom{padding:18px 22px}.progress-text{font-size:10px}.course-progress{margin-bottom:18px}.choices{gap:8px}.choice{font-size:18px;min-height:61px}.choice.long{font-size:12px}.choice.ar{font-size:34px}.reading{font-size:24px}.chunks{gap:7px}.chunk{min-width:44px;padding:5px 9px}footer{margin-top:20px}.finish{padding:35px 25px}}
.audio-wrap{display:flex;flex-direction:column;align-items:center;gap:7px}.audio-caption{font-size:10px;line-height:1.5;color:var(--muted)}.listen-stage .audio-wrap{gap:22px}.feedback .audio-wrap{align-items:flex-start}footer a{color:inherit;text-underline-offset:3px}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.glyph{display:block}.target-letter{color:inherit;background:#e6edcd;border-bottom:3px solid #799255;border-radius:3px;font:inherit;padding:0}.target-note,.direction-note{font-size:11px;color:var(--muted);line-height:1.6;margin:-8px 0 18px}.form-guide{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0 0 22px}.form-card{background:#f3f5e9;border:1px solid #e3e8d6;border-radius:10px;padding:8px 3px}.form-card .ar{font-size:37px;line-height:1.7;display:block}.form-card small{display:block;font-size:10px;line-height:1.5;color:var(--muted)}.neighbor-guide{display:flex;direction:rtl;justify-content:center;gap:7px;margin:12px 0 22px}.neighbor-card{flex:1;min-width:0;max-width:110px;padding:8px 3px;background:#f4f5ec;border-radius:9px}.neighbor-card .ar{font-size:32px;line-height:1.8;display:block}.neighbor-card strong{display:block;font-size:11px;font-weight:600;direction:ltr}.neighbor-card small{display:block;font-size:9px;line-height:1.8;direction:ltr;color:var(--muted)}.direction-note{margin:0}.recall-prompt{font-size:34px;margin:24px 0 16px}.input-label{display:block;text-align:left;color:var(--green);font-size:12px;font-weight:600;margin:24px 0 8px}.recall-input{display:block;width:100%;min-height:66px;border:1px solid #aebba3;background:#fffefb;border-radius:10px;padding:10px 15px;color:var(--green);font:24px Georgia,serif;text-align:center}.recall-input.ar{font-family:Arabic,"Traditional Arabic",serif;font-size:43px;line-height:1.6;min-height:86px}.recall-input:focus-visible{outline:3px solid #aa6938;outline-offset:3px}.recall-input:disabled{background:#f1f4e7;color:var(--green);opacity:1}.recall-input+.check-note{margin:11px 0 16px;text-align:left}.letter-keyboard{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px}.letter-key{min-height:51px;font-size:29px;line-height:1.6;padding:2px;background:#f6f7ef;color:var(--green);border:1px solid #d9dfcd;border-radius:8px}.letter-key:hover{background:#e8efda}.edit-keys{display:flex;justify-content:space-between;margin:8px 0 16px;gap:8px}.text-button{background:transparent;border:0;border-radius:5px;min-height:44px;padding:8px;color:var(--green);font-size:12px;text-decoration:underline;text-underline-offset:3px}.text-button:hover{background:#edf2df}.text-button:disabled{opacity:.5}.reading-keys{display:flex;justify-content:center;flex-wrap:wrap;margin-bottom:16px}.reading-keys .text-button{font:22px Georgia,serif;min-width:42px;border:1px solid var(--line);margin:3px;text-decoration:none}.recall-submit{margin-top:12px}.hint-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;text-align:left}.hint-controls span{font-size:10px;color:var(--muted);line-height:1.6}.hint{margin-top:10px;text-align:left;padding:14px 16px;background:#f4f1e6;border:1px dashed #cfc4a6;border-radius:10px;font-size:13px;line-height:1.8;overflow-wrap:anywhere}.hint>.ar{display:block;font-size:42px;text-align:center}.hint p{text-align:center}.upgrade-note{padding:13px 17px;margin:0 0 20px;border:1px solid #dfe6cc;background:#eef3e1;border-radius:12px;font-size:12px;line-height:1.7}.upgrade-note p{margin:0}.upgrade-note .text-button{padding:0 5px}.feedback .neighbor-guide{margin-bottom:0}.feedback .direction-note{margin-top:12px}.recall-input,button{scroll-margin:20px}
@media(max-width:600px){.form-guide{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.form-card{padding:5px}.form-card .ar{font-size:34px}.letter-keyboard{grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}.letter-key{min-height:46px;font-size:27px}.neighbor-guide{gap:5px}.neighbor-card .ar{font-size:29px}.neighbor-card small{font-size:8px}.hint-controls{gap:6px}.hint-controls span{max-width:130px}.progress-text{flex-wrap:wrap;gap:5px 12px}}

/* Keep the ordinary lesson in the viewport. Expanded help stays in document
   flow, so hints, memory tips and zoomed text can scroll without clipping. */
body{min-height:100svh;display:grid;grid-template-rows:auto 1fr auto}
.site-header{width:min(100%,1000px);padding:12px 24px}
.brand{font-size:30px}.brand-mark{width:29px;height:35px;font-size:29px;line-height:33px}
main{width:min(calc(100% - 24px),640px);margin:8px auto;align-self:center}
.course-progress{margin:0 3px 12px}.progress-text{margin-bottom:6px;line-height:1.4}
.lesson-content{padding:20px 24px}.lesson-stimulus,.lesson-task{min-width:0}
.eyebrow{margin-bottom:7px}h1{font-size:clamp(23px,3.5svh,32px);line-height:1.18}
.glyph{font-size:clamp(60px,11svh,96px);line-height:1.65;min-height:0;margin:3px 0}
.glyph.word,.glyph.rule{font-size:clamp(44px,8svh,70px)}
.reading{font-size:24px;margin:0 0 10px}.explanation{font-size:14px;line-height:1.6;margin-bottom:12px}
.lesson-bottom{padding:12px 20px}.primary{min-height:44px;padding:10px 14px}
.audio-button{padding:7px 13px;min-height:40px}.audio-wrap{gap:4px}
.audio-caption{font-size:9px}.listen-stage{min-height:140px}.listen-note{margin-bottom:12px}
.audio-button.large{width:76px;height:76px}.listen-stage .audio-wrap{gap:16px}
.choices{gap:8px;margin-top:8px}.choice{min-height:48px;padding:10px 6px}
.check-note{margin:12px 0 0}.feedback{margin-top:12px;padding:12px 14px;line-height:1.6}
.feedback .audio-button{margin-top:8px}
.target-note{margin:0 0 10px}.direction-note{margin:0;font-size:10px}
.form-guide{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-bottom:12px}
.form-card{padding:4px 2px}.form-card .ar{font-size:32px;line-height:1.6}.form-card small{font-size:10px}
.neighbor-guide{margin:6px 0 12px}.neighbor-card{padding:5px 2px}.neighbor-card .ar{font-size:29px;line-height:1.6}
.extra-detail,.input-help{font-size:12px;line-height:1.6;text-align:left;color:var(--muted)}
.extra-detail{margin-top:10px}.extra-detail summary,.input-help summary{cursor:pointer;min-height:28px;padding:4px 0;text-underline-offset:3px}
.extra-detail summary:focus-visible,.input-help summary:focus-visible{outline:3px solid #aa6938;outline-offset:3px}
.extra-detail .cue{margin:6px 0 0;padding:10px 12px}.extra-detail[open]{margin-bottom:6px}
.spell-prompt{display:flex;justify-content:center;align-items:center;gap:24px;margin:12px 0}
.spell-prompt .recall-prompt{font-size:32px;margin:0}.spell-prompt .audio-caption{display:none}
.input-label.sr-only{margin:0;padding:0}
.recall-input,.recall-input.ar{min-height:48px;padding:4px 12px;font-size:27px;line-height:1.6}
.recall-input.ar{font-size:34px}
.recall-input+.check-note{font-size:11px;line-height:1.45;margin:6px 0 10px}
.letter-keyboard{grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
.letter-key{min-height:42px;font-size:26px;line-height:1.4;padding:1px}
.edit-keys{margin:4px 0 6px;gap:4px}.edit-keys .text-button{padding:4px;min-height:30px;font-size:11px}
.recall-submit{margin-top:4px}.hint-controls{position:relative;margin-top:6px;align-items:flex-start}
.hint-controls>.text-button{min-height:30px;padding:4px;font-size:11px}
.input-help{text-align:right;font-size:11px;max-width:55%}.input-help p{text-align:left;margin:6px 0;font-size:12px}
.input-help[open]{text-align:left}.input-help summary{white-space:nowrap}
.reading-keys{margin:0 0 8px;gap:4px}.reading-keys .text-button{min-width:38px;min-height:38px;font-size:20px;margin:0;padding:4px}
.lesson[data-phase="passed"] #recall-form,.lesson[data-phase="passed"] .choices{display:none}
.lesson[data-phase="passed"] .feedback{margin-top:0}
footer{width:calc(100% - 24px);margin:5px auto;padding-bottom:max(5px,env(safe-area-inset-bottom));gap:1px;font-size:9px;line-height:1.4}
.upgrade-note{margin-bottom:10px;padding:8px 12px;font-size:11px}.upgrade-note .text-button{min-height:28px}
.finish{padding:24px}.finish-mark{width:52px;height:52px;margin-bottom:16px;font-size:25px}.finish .primary{margin-top:16px}

@media(max-height:740px){
  .site-header{padding:8px 18px}.brand{font-size:26px}.brand-mark{height:30px;width:25px;line-height:28px;font-size:26px}
  main{margin:5px auto}.course-progress{margin-bottom:8px}.lesson{border-radius:17px}
  .lesson-content{padding:14px 18px}.eyebrow{font-size:9px;margin-bottom:5px}
  .glyph{font-size:68px;line-height:1.55}.glyph.word,.glyph.rule{font-size:48px}
  .reading{font-size:22px;margin-bottom:6px}.explanation{font-size:13px;line-height:1.5;margin-bottom:8px}
  .lesson-bottom{padding:9px 14px}.form-card .ar{font-size:29px}.form-guide{margin-bottom:8px}
  .audio-caption{display:none}.audio-button{min-height:36px}.target-note{margin-bottom:6px;font-size:10px}
  .extra-detail{margin-top:6px}.feedback{font-size:12px;padding:9px 12px}
  .spell-prompt{margin:8px 0;gap:20px}.spell-prompt .recall-prompt{font-size:28px}
  .listen-stage{min-height:110px}.finish .explanation{font-size:13px}
}
@media(max-height:620px){
  .site-header{padding:5px 16px}.brand{font-size:23px;gap:7px}.brand-mark{width:22px;height:27px;font-size:23px;line-height:25px}
  main{margin:4px auto}.course-progress{margin-bottom:6px}.progress-text{font-size:9px;margin-bottom:4px}
  .lesson-content{padding:10px 14px}h1{font-size:23px}.eyebrow{font-size:8px;margin-bottom:4px}
  .glyph{font-size:58px;line-height:1.5}.glyph.word,.glyph.rule{font-size:42px}
  .reading{font-size:20px;margin-bottom:4px}.explanation{font-size:12px;line-height:1.45;margin-bottom:6px}
  .spell-prompt{margin:5px 0}.spell-prompt .recall-prompt{font-size:26px}
  .recall-input.ar{min-height:44px;font-size:30px}.recall-input+.check-note{margin:4px 0 6px;font-size:10px}
  .letter-key{min-height:38px;font-size:25px}.letter-keyboard{gap:4px}
  .edit-keys{margin:2px 0}.edit-keys .text-button{min-height:28px}
  .hint-controls{margin-top:3px}.hint-controls>.text-button,.input-help summary{min-height:28px}
  .form-card .ar{font-size:27px}.form-card small{font-size:9px}.form-guide{gap:4px}
  .neighbor-card .ar{font-size:26px}.neighbor-card strong{font-size:10px}.neighbor-card small{font-size:8px}
  .feedback{margin-top:8px;font-size:11px}.primary{min-height:42px}.choice{min-height:44px}
  footer{font-size:8px;margin:3px auto;padding-bottom:max(3px,env(safe-area-inset-bottom))}
  .header-note{font-size:9px}.listen-stage{min-height:95px}.check-note{margin-top:8px}
}
/* Wide, short screens use the spare horizontal space rather than stacking. */
@media(min-width:480px) and (max-height:560px){
  .site-header{max-width:1100px}.header-note{font-size:10px}
  main{width:min(calc(100% - 24px),1000px)}
  .lesson-content{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);align-items:center;gap:18px;padding:12px 18px}
  h1{font-size:25px}.lesson-stimulus .glyph{font-size:74px;line-height:1.55}.lesson-stimulus .glyph.word,.lesson-stimulus .glyph.rule{font-size:54px}
  .lesson-bottom{padding:7px 18px}.lesson-bottom .primary{max-width:360px;margin:auto}
  .lesson-task .explanation{font-size:12px}.form-guide{margin:6px 0}.letter-key{min-height:34px;font-size:23px}
  .spell-prompt{margin:10px 0}.spell-prompt .recall-prompt{font-size:32px}.recall-input.ar{min-height:42px;font-size:28px}
  .edit-keys .text-button{font-size:10px;min-height:26px}.recall-input+.check-note{font-size:9px;margin:3px 0 5px}
  .hint-controls>.text-button,.input-help summary{min-height:24px;padding:2px;font-size:10px}
  .reading-keys .text-button{min-height:30px;min-width:30px;font-size:18px}
  .finish{display:block;max-width:640px;margin:auto}.finish-mark{display:none}.finish h1{margin-bottom:12px}
}
@media(max-height:740px){
  .lesson[data-kind="spell"] .lesson-content{padding-top:10px;padding-bottom:10px}
  .spell-prompt{margin:6px 0}
}
@media(max-height:620px){.lesson-content{padding-top:8px;padding-bottom:8px}}
@media(min-width:480px) and (max-height:560px){
  .site-header{padding:3px 16px}.brand{font-size:21px}.brand-mark{height:23px;width:20px;line-height:21px;font-size:21px}
  footer{flex-direction:row;justify-content:center;gap:12px;font-size:8px}
  .lesson-content{gap:12px;padding:8px 14px}h1{font-size:22px}
  .lesson-stimulus .glyph{font-size:60px;line-height:1.4}.lesson-stimulus .glyph.word,.lesson-stimulus .glyph.rule{font-size:46px}
  .lesson-bottom{padding:6px 14px}.lesson-bottom .primary{min-height:36px;padding:6px 12px}
  .lesson-task>.audio-wrap{display:inline-flex;vertical-align:middle;margin-right:8px}
  .lesson-task>.extra-detail{display:inline-block;vertical-align:middle}
  .lesson-task>.extra-detail[open]{display:block}
  .lesson[data-kind="spell"][data-phase="check"] .lesson-content{
    grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
    grid-template-areas:"stimulus keys" "input keys" "note edit" "tools submit";
    gap:4px 16px;padding:8px 14px;
  }
  .lesson[data-kind="spell"][data-phase="check"] .lesson-task,
  .lesson[data-kind="spell"][data-phase="check"] #recall-form{display:contents}
  .lesson[data-kind="spell"][data-phase="check"] .lesson-stimulus{grid-area:stimulus}
  .lesson[data-kind="spell"][data-phase="check"] .recall-input{grid-area:input}
  .lesson[data-kind="spell"][data-phase="check"] #recall-note{grid-area:note;margin:0}
  .lesson[data-kind="spell"][data-phase="check"] .letter-keyboard{grid-area:keys}
  .lesson[data-kind="spell"][data-phase="check"] .edit-keys{grid-area:edit;margin:0}
  .lesson[data-kind="spell"][data-phase="check"] .recall-submit{grid-area:submit;margin:0;min-height:36px;padding:6px 8px}
  .lesson[data-kind="spell"][data-phase="check"] .hint-controls{grid-area:tools;margin:0}
  .lesson[data-kind="spell"][data-phase="check"] .hint,
  .lesson[data-kind="spell"][data-phase="check"] .feedback{grid-column:1/-1}
  .spell-prompt{gap:12px}.spell-prompt .audio-button span{display:none}
  .spell-prompt .audio-button{padding:7px;min-width:34px}.spell-prompt .recall-prompt{font-size:28px}
}
@media(max-height:740px){
  .lesson[data-kind="spell"] .lesson-content{padding-top:8px;padding-bottom:8px}
  .recall-input.ar{line-height:1.45}.hint-controls{margin-top:2px}
}
@media(min-width:480px) and (max-height:380px){
  .site-header{padding:2px 16px}.brand{font-size:19px}.brand-mark{height:21px;line-height:19px;font-size:19px}
  .course-progress{margin-bottom:4px}.progress-text{margin-bottom:2px}
  .lesson-bottom{padding:5px 14px}.lesson-bottom .primary{min-height:34px;padding:5px 12px}
  .neighbor-guide{margin:3px 0 6px}.neighbor-card{padding:3px 2px}
  .neighbor-card .ar{font-size:26px;line-height:1.3}.neighbor-card small{line-height:1.3}
  .letter-key{min-height:32px;line-height:1.2;font-size:23px}
  .recall-input.ar{min-height:42px;height:42px;line-height:1.2;padding:2px 8px}
  .lesson-content{padding:6px 12px}.lesson[data-kind="spell"][data-phase="check"] .lesson-content{padding:6px 12px}
  .finish{padding:16px}
  .target-note{margin-bottom:2px}
  .lesson[data-phase="passed"] .listen-note{display:none}
}