.phonics-home{max-width:690px;margin:auto;padding-bottom:95px}.phonics-home h1{font-size:25px;margin:12px 0 3px}.course-count{font-size:12px;color:#7f896f;margin:3px 0 12px}.phonics-methods{list-style:none;padding:0;margin:0;display:grid;gap:8px}.phonics-methods>li{background:#fffef8;border:1px solid #e0e5d2;border-radius:13px;padding:10px 13px}.phonics-methods strong{font-size:18px}.phonics-methods p{font-size:13px;line-height:1.6;margin:3px 0}.phonics-methods small{display:block;font-size:11px;color:#8a846c;line-height:1.6}.phonics-resume{display:flex;gap:8px;flex-wrap:wrap;padding:8px 0}.phonics-resume button{font-size:12px;min-height:44px}.phonics-panel{max-width:650px;padding:15px;margin:8px auto}.phonic-meta{display:flex;justify-content:space-between;font-size:12px;color:#84906f}.phonics-panel h1{font-size:23px;margin:10px 0 6px}.phonic-method{font-size:15px;line-height:1.6;margin:6px 0}.phonic-note{font-size:12px;color:#8c795c;line-height:1.6;margin:6px 0}.phonics-word{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:0;position:relative;padding:24px 2px 17px;margin:10px 0 5px;touch-action:none;border:1px solid #e2e8d6;border-radius:13px;background:#fffefa}.phonic-letter{border:0;border-radius:3px;background:transparent;color:#31583d;font:var(--word-font)/1.5 Andika,Arial,sans-serif;padding:3px 2px;min-height:44px;min-width:0;position:relative;margin:0;opacity:1!important;cursor:pointer}.phonic-letter:disabled{cursor:default}.phonic-letter.vowel-marked:after{content:'';position:absolute;bottom:6px;left:1px;right:1px;border-bottom:3px solid #c95748}.phonic-letter.cut-before:before{content:'';position:absolute;left:-1px;top:0;bottom:2px;border-left:3px solid #c95748;transform:rotate(7deg)}.phonics-stress-word{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:1px;margin:18px 0 8px}.stress-syllable{font:27px/1.7 Andika,Arial,sans-serif;background:#fffefa;color:#31583d;border:1px solid #e3e7d4;border-left:3px solid #c95748;padding:5px 8px;min-height:59px;position:relative;border-radius:5px;opacity:1!important}.stress-syllable:first-child{border-left:1px solid #e3e7d4}.stress-syllable.stressed{background:#eaf2d8;border-color:#7b9d55}.stress-sign{position:absolute;left:1px;top:-10px;font-size:29px;color:#a63f35;font-weight:700}.vowel-ink{border-bottom:3px solid #c95748}.phonic-ipa{font-size:24px;text-align:center;line-height:1.5;margin:12px 0;overflow-wrap:anywhere}.phonic-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:14px 0 5px}.phonic-actions button{min-height:46px;font-size:16px;padding:9px 20px}.phonic-actions .plain{font-size:12px;padding:5px}.phonic-good{color:#4a793e;text-align:center;font-size:15px}.phonic-feedback{padding:9px!important}.phonic-feedback>.phonics-word{margin:4px 0;padding-top:7px;padding-bottom:7px}.phonic-feedback .phonics-stress-word{margin:12px 0 6px}.phonic-feedback .stress-syllable{font-size:20px;min-height:44px;padding:3px 5px}.phonic-help{margin-top:9px;font-size:12px}.phonic-help p{font-size:12px;line-height:1.7}body[data-screen="phonics"] footer{display:none}
@media(max-width:680px){body[data-screen="phonics"] header{height:50px;padding:6px 12px}body[data-screen="phonics"] main{padding:0 8px}.phonics-panel{padding:13px;margin:4px auto}.phonics-home h1{font-size:23px}.phonics-methods{gap:5px}.phonics-methods>li{padding:8px 11px}.phonics-methods strong{font-size:16px}.phonics-methods p{font-size:12px}.phonics-methods small{font-size:10px}.phonics-panel h1{font-size:21px}.phonic-method{font-size:14px}.stress-syllable{font-size:24px;padding:5px 7px}.phonic-ipa{font-size:22px}}