.header-tools{display:flex;align-items:center;flex-shrink:0}.audio-library-button{font-size:12px;padding:8px 11px;border:1px solid #bdc6af;border-radius:11px;margin-right:13px;color:var(--green);min-height:40px}.audio-edit{font-size:12px;color:var(--green);padding:7px 0;min-height:40px;display:block;border-bottom:1px solid #cbd3bf;margin-top:5px}.audio-sheet{width:610px}.audio-intro,.audio-scope,.audio-help,.audio-privacy{font-size:12px;color:var(--muted);margin:9px 0;line-height:1.8}.audio-label{font-size:13px;display:block;margin:17px 0 6px}.audio-sheet select{display:block;width:100%;min-width:0;max-width:100%;padding:11px 9px;border:1px solid var(--line);border-radius:10px;background:var(--white);font:15px Primer,'PingFang SC',sans-serif;color:var(--ink)}.audio-current{display:flex;align-items:center;margin:17px 0 8px;min-width:0}.audio-syllable{font-size:47px;color:var(--green);margin-right:20px;flex-shrink:0}.audio-current>div{min-width:0}.audio-current strong{font-size:14px;font-weight:500}.audio-current small{display:block;color:var(--muted);overflow-wrap:break-word;word-break:break-all}.audio-sheet audio{display:block;width:100%;height:44px}.audio-upload{position:relative;display:flex;align-items:center;justify-content:center;min-height:53px;margin-top:22px;border:1px dashed #7b9876;border-radius:12px;background:#e7ecdf;color:var(--green);overflow:hidden}.audio-upload input{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer}.audio-upload:focus-within{outline:2px solid var(--green);outline-offset:3px}.audio-upload span{pointer-events:none}.audio-bottom{display:flex;align-items:center;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:16px;margin-top:8px}.audio-bottom button{font-size:12px;margin:0 15px 8px 0}.audio-bottom span{font-size:11px;color:var(--muted)}.audio-privacy{font-size:11px}#audio-draft{padding:16px;border-radius:12px;background:var(--white);border:1px solid var(--line);margin-top:15px}#audio-draft[hidden]{display:none}#audio-draft h3{font-size:14px}#audio-draft-name{font-size:12px;word-break:break-all;margin:6px 0 12px;color:var(--muted)}#audio-message{font-size:13px;color:var(--green);margin:12px 0;min-height:24px}#audio-message.error{color:#a35c44}.course-scope{font-size:12px;color:var(--muted);margin-bottom:6px}.course-scope button{color:var(--green);font-size:12px;padding:8px 3px}.catalog-focus{display:grid;grid-template-columns:230px 1fr;grid-gap:28px;background:var(--white);border:1px solid var(--line);border-radius:20px;padding:20px;margin-top:18px}.catalog-art{display:flex;align-items:center;justify-content:center;background:#efecdf;border-radius:16px;overflow:hidden;min-height:240px}.catalog-art .sprite{width:210px;height:210px;mix-blend-mode:multiply}.catalog-art .girl-art{height:245px;width:90%}.catalog-art .letter-art{font-size:90px!important}.catalog-focus .main-letter{font-size:54px!important}.sound-group{margin:25px 0}.sound-group h2{font-size:19px;margin-bottom:12px}.sound-grid{display:grid;grid-template-columns:repeat(10,1fr);grid-gap:9px}.sound-grid button{font-size:27px;min-height:63px;border:1px solid var(--line);background:var(--white);border-radius:12px;padding:7px 4px}.sound-grid button.selected{background:var(--green);color:white}.trace-wrap:before{display:none}.trace-wrap #trace-guide{pointer-events:none}.trace-position{font-weight:500;color:var(--green)}
@media(max-width:900px){.topbar nav button{padding:7px 13px}.sound-grid{grid-template-columns:repeat(8,1fr)}}
@media(max-width:620px){.topbar nav button{width:20%;padding:7px 2px;font-size:12px}.header-tools{margin-left:6px}.audio-library-button{font-size:11px;margin-right:11px;padding:5px 8px;min-height:36px}.audio-sheet{padding:19px 16px}.audio-syllable{font-size:38px}.catalog-focus{grid-template-columns:1fr;grid-gap:12px;padding:16px}.catalog-art{min-height:150px;height:150px}.catalog-art .sprite{width:155px;height:155px}.catalog-art .girl-art{height:170px;width:120px}.catalog-art .letter-art{font-size:77px!important;padding-bottom:8px}.catalog-focus .main-letter{font-size:44px!important}.sound-grid{grid-template-columns:repeat(5,1fr);grid-gap:7px}.sound-grid button{font-size:24px;min-height:54px}.sound-group h2{font-size:16px}.course-scope{font-size:11px}.audio-overlay{padding:12px}.audio-sheet .modal-top h2{font-size:21px}.trace-position{font-size:12px}}