.section-navigation>div{grid-template-columns:repeat(4,minmax(0,1fr))}.section-navigation .nav-pinyin{--tab:#806294}.pinyin-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:24px}.pinyin-heading h1{font-size:32px;margin:0}.pinyin-heading label,.pinyin-quiz-settings label,.blend-controls label{display:flex;align-items:center;gap:10px;font-size:16px}.pinyin-heading select,.pinyin-heading button,.pinyin-quiz-settings select,.blend-controls select{font:inherit;font-size:16px;padding:10px 14px;background:#fff;border:1px solid #cfd8cc;border-radius:12px;color:#4f6449}.pinyin-main-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:17px;margin-bottom:28px}.pinyin-main-tabs button{display:flex;justify-content:center;align-items:center;gap:10px;font-family:inherit;font-size:22px;background:#f0f6ee;color:#4d6546;border:2px solid #c5d5c1;border-radius:24px;padding:22px 15px;cursor:pointer}.pinyin-main-tabs button:nth-child(2){background:#edf7e7;border-color:#c7deb9;color:#53733e}.pinyin-main-tabs button:nth-child(3){background:#fff4d6;border-color:#e08f95;color:#a8373f}.pinyin-main-tabs button[aria-pressed=true]{background:#4d6546;border-color:#4d6546;color:white}.pinyin-main-tabs b{font-size:18px;border-radius:50%;display:grid;place-items:center;width:32px;height:32px;background:#ffffffaa;color:#4d6546}.pinyin-subtabs{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:25px}.pinyin-subtabs button{font:inherit;font-size:17px;background:white;border:1px solid #d3ddd0;color:#5a6f54;border-radius:24px;padding:10px 21px;cursor:pointer}.pinyin-subtabs button[aria-pressed=true]{background:#fff0c7;border-color:#de9197;color:#a93940}.pinyin-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:16px;margin-bottom:25px}.pinyin-bubble span{font-family:"Arial",sans-serif;font-size:38px!important;font-weight:500}.pinyin-bubble[aria-pressed=true]{outline:3px solid #7c9176;outline-offset:3px}.pinyin-group-title{font-size:21px;margin:25px 0 16px}.pinyin-detail{padding:28px;background:white;border:1px solid #d8e1d5;border-radius:25px;margin-top:30px}.pinyin-focus{display:flex;align-items:center;gap:32px}.pinyin-focus>strong{display:grid;place-items:center;flex-shrink:0;min-width:140px;min-height:140px;border-radius:40%;background:#f0f6ef;border:2px solid #ceddca;font:55px Arial,sans-serif;color:#4d6546;padding:10px}.pinyin-focus h2{font-size:24px;margin:0 0 12px}.pinyin-focus p{font-size:18px;line-height:1.8}.pinyin-focus button{font:inherit;padding:9px 18px;border:1px solid #c8d4c5;background:#f3f7f1;color:#4d6546;border-radius:20px;cursor:pointer}.pinyin-note{font-size:15px;line-height:1.8;color:#788574;margin:20px 0}.pinyin-detail h3{font-size:21px;margin-top:26px}.pinyin-examples{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:15px;margin:20px 0}.pinyin-examples button{display:flex;flex-direction:column;align-items:center;gap:10px;padding:20px 13px;background:#edf7f2;border:1px solid #c6ded0;border-radius:25px;color:#315d4e;cursor:pointer;font-family:inherit}.pinyin-examples strong{font-size:26px}.pinyin-examples span{font-size:19px}.pinyin-examples small{font-size:13px;line-height:1.5;color:#5f7e74}.pinyin-action{font:inherit;font-size:19px;border-radius:25px;background:#36775b;color:white;padding:13px 27px;border:1px solid #36775b;cursor:pointer}.pinyin-action.secondary{background:#fff1c9;color:#ad333b;border-color:#dc9398}.pinyin-rule-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:25px}.pinyin-rule-grid article{padding:24px;border:1px solid #d7e0d4;background:white;border-radius:24px}.pinyin-rule-grid h2{font-size:22px;margin:0 0 13px}.pinyin-rule-grid p{font-size:17px;line-height:1.9;color:#71806d}.pinyin-rule-grid strong{font-size:21px;font-weight:500;line-height:2;color:#356e69}.tone-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:15px}.tone-card{font-family:inherit;display:flex;flex-direction:column;align-items:center;gap:14px;border:2px solid #d2dfce;background:#f3f8f1;color:#4d6546;border-radius:25px;padding:20px 12px;cursor:pointer}.tone-card:nth-child(even){background:#fff5d9;border-color:#e09095}.tone-card b{font-size:40px}.tone-card strong{font-size:37px;font-family:Arial,sans-serif}.tone-card span{font-size:20px}.tone-card small{font-size:15px;line-height:1.7}.tone-intro h2{font-size:25px}.tone-intro p{font-size:17px;color:#758272}.blend-controls,.pinyin-quiz-settings{display:flex;align-items:center;gap:25px;flex-wrap:wrap;padding:23px;background:white;border:1px solid #d5dfd3;border-radius:22px}.blend-equation{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:18px;padding:34px 15px;margin:24px 0;background:white;border-radius:25px;border:1px solid #d9e1d6;font-size:36px}.blend-equation b,.blend-equation strong{font:44px Arial,sans-serif;border:2px solid #c7d7c2;border-radius:35%;padding:20px 27px;background:#f0f6ef}.blend-equation strong{background:#fff2c6;border-color:#de9196}.tone-switches{display:flex;justify-content:center;gap:15px;flex-wrap:wrap}.tone-switches button{display:flex;flex-direction:column;gap:9px;font-family:inherit;padding:15px 21px;background:white;color:#4d6546;border:2px solid #d1dbce;border-radius:24px;cursor:pointer}.tone-switches b{font:28px Arial,sans-serif}.tone-switches small{font-size:15px}.tone-switches button[aria-pressed=true]{background:#e4f4e8;border-color:#90bc9c}.pinyin-launch{display:flex;justify-content:center;gap:20px;margin:30px 0}.pinyin-question{background:white;border:1px solid #d9e1d7;border-radius:28px;padding:28px;text-align:center}.pinyin-question-top{display:flex;justify-content:space-between;gap:20px;font-size:16px;color:#758471}.pinyin-question-top button{font:inherit;border:0;background:transparent;color:#61785b;cursor:pointer}.pinyin-question h2{font-size:38px;line-height:1.7;margin:20px auto 28px;max-width:800px}.pinyin-question>p{font-size:18px;color:#72826d}.pinyin-answers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;max-width:730px;margin:auto}.pinyin-answers .bubble{aspect-ratio:auto;min-height:125px;border-radius:35px}.pinyin-answers .bubble span{font-size:27px;line-height:1.7}.pinyin-answers .bubble:disabled{opacity:1;cursor:default}.pinyin-answers .answer-right{background:#dcf2e3!important;border-color:#72b387!important}.pinyin-answers .answer-miss{background:#f9e5df!important;border-color:#d2a28f!important}.pinyin-feedback{min-height:1.8em;font-size:18px!important}.pinyin-result{text-align:center;background:#fff8e2;border:1px solid #de9297;border-radius:30px;padding:40px 20px}.pinyin-result h2{font-size:30px}.pinyin-result p{font-size:23px}.pinyin-sources{font-size:14px;color:#758371;margin-top:35px;line-height:1.9}.pinyin-sources a{color:inherit}.pinyin-page button:focus-visible{outline:3px solid #d7414b;outline-offset:4px}@media(max-width:650px){.section-navigation a{font-size:14px}.pinyin-main-tabs{gap:8px}.pinyin-main-tabs button{font-size:17px;padding:16px 8px;flex-direction:column;gap:8px;border-radius:22px}.pinyin-subtabs{gap:9px}.pinyin-subtabs button{font-size:15px;padding:10px 16px}.pinyin-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.pinyin-bubble span{font-size:28px!important}.pinyin-detail{padding:22px 17px}.pinyin-focus{flex-direction:column;gap:23px;text-align:center}.pinyin-rule-grid{grid-template-columns:1fr}.pinyin-rule-grid article{padding:22px}.tone-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.pinyin-examples{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.pinyin-examples strong{font-size:22px}.pinyin-examples span{font-size:17px}.blend-controls,.pinyin-quiz-settings{gap:15px;padding:18px}.blend-equation{gap:9px;font-size:24px;padding:25px 10px}.blend-equation b,.blend-equation strong{font-size:28px;padding:13px}.tone-switches{gap:9px}.tone-switches button{padding:13px 15px}.tone-switches b{font-size:23px}.pinyin-launch{gap:12px;flex-wrap:wrap}.pinyin-action{font-size:17px;padding:13px 22px}.pinyin-question{padding:23px 15px}.pinyin-question h2{font-size:29px}.pinyin-answers{gap:12px}.pinyin-answers .bubble{min-height:100px;border-radius:27px}.pinyin-answers .bubble span{font-size:21px}.pinyin-heading{gap:14px}.pinyin-heading h1{font-size:28px}.pinyin-heading label{font-size:15px}.pinyin-heading select{font-size:15px;padding:9px}}
.pinyin-main-tabs{grid-template-columns:repeat(4,minmax(0,1fr))}.pinyin-main-tabs button:nth-child(4){background:#f2ebfa;border-color:#d7c7e8;color:#765193}.pinyin-main-tabs button[aria-pressed=true]{background:#4d6546;color:#fff;border-color:#4d6546}.pinyin-reading-rows{display:grid;gap:15px;max-width:680px}.pinyin-reading-row{display:grid;grid-template-columns:repeat(4,minmax(0,110px));gap:17px}.pinyin-reading-row .bubble{min-height:0;aspect-ratio:1.15}.example-book{margin-top:30px}.example-book>h3{border-bottom:2px solid #d6e1d3;padding-bottom:12px}.example-category{margin:20px 0;padding:4px 18px;background:#f8fcf7;border:1px solid #dee8db;border-radius:22px}.example-category h4{font-size:19px;display:flex;gap:12px;align-items:center}.example-category h4 small{font-size:14px;font-weight:400}.example-category.table-write{background:#f1f9ed;border-color:#d6e6cf}.example-category.table-words{background:#fff9e9;border-color:#efdfb2}.example-category details{padding-bottom:16px}.example-category summary{cursor:pointer;font-size:16px}.idea-round{padding:20px;border:1px solid #d7c7e8;border-radius:22px;background:#f8f4fc;margin-top:22px}.idea-round h3{margin-top:0}.idea-round p{font-size:17px;line-height:1.8}.idea-teams{display:grid;grid-template-columns:1fr 1fr;gap:15px}.idea-teams>div{display:flex;align-items:center;flex-wrap:wrap;gap:12px;background:#eff6ed;border-radius:20px;padding:14px}.idea-teams>div+div{background:#fff0d6}.idea-teams strong{font-size:30px;margin-right:auto}.idea-round button,.typing-toolbar button{font:inherit;border:1px solid #d0dacd;border-radius:16px;padding:9px 14px;background:white;color:#4d6546;cursor:pointer}.idea-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:17px}.typing-intro,.typing-board{background:white;border:1px solid #d8e1d5;border-radius:26px;padding:28px}.typing-intro p{font-size:17px;line-height:1.9;color:#667861}.typing-intro details{font-size:16px}.typing-settings{display:flex;align-items:center;gap:20px;flex-wrap:wrap;padding:20px 0}.typing-settings label{font-size:17px;display:flex;align-items:center;gap:9px}.typing-settings select{font:inherit;border:1px solid #d1dace;padding:10px;border-radius:12px}.typing-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}.typing-toolbar label{font-size:16px}.typing-target{text-align:center;margin:25px 0}.typing-target h2{font-size:42px;margin:12px 0}.typing-target p{font-size:25px;color:#5b7154;margin:10px 0}.typing-target small{font-size:14px;color:#768572}.typing-composition{display:flex;justify-content:center;align-items:center;background:#f5faf4;min-height:66px;border:2px solid #c0d0bc;border-radius:16px;padding:10px;font:32px Arial,sans-serif;overflow-wrap:anywhere;word-break:break-all}.typing-composition i{font-style:normal;color:#478361}.typing-guide{text-align:center;font-size:19px}.typing-guide b{color:#356f50}.typing-feedback{min-height:1.8em;font-size:17px;color:#975140;text-align:center}.typing-keyboard{max-width:900px;margin:25px auto;padding:20px 12px;background:#eef2ec;border-radius:24px;border:1px solid #d0dacd}.keyboard-row{display:flex;justify-content:center;gap:8px;margin:10px 0}.keyboard-row button{font:22px Arial,sans-serif;flex:0 1 70px;min-width:0;height:62px;border:1px solid #c3cdc0;border-bottom:4px solid #bdcaba;border-radius:12px;background:white;color:#4d6546;cursor:pointer}.keyboard-row button.key-next{background:#ffe49b;border-color:#cf6b71;box-shadow:0 0 0 3px #ffe49b77}.keyboard-tools button{font-family:inherit;font-size:16px;flex-basis:110px}.keyboard-tools button:nth-child(2){flex-basis:310px;font-size:17px}.typing-candidates{display:flex;justify-content:center;flex-wrap:wrap;gap:13px}.typing-candidates button{font-family:inherit;font-size:22px;padding:16px 20px;border:2px solid #c9ddbd;background:#f0f9e9;border-radius:20px;color:#416a33;cursor:pointer}.typing-candidates small{font-size:14px;margin-right:10px}.typing-board>.pinyin-action{display:block;margin:20px auto 0}.typing-board>.pinyin-note{text-align:center}@media(max-width:650px){.pinyin-main-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.pinyin-main-tabs button{flex-direction:row}.pinyin-reading-row{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.pinyin-reading-rows{gap:14px}.example-category{padding:4px 12px}.example-category h4{font-size:17px}.example-category .pinyin-examples{grid-template-columns:repeat(2,minmax(0,1fr))}.example-category .pinyin-examples button{padding:15px 8px}.idea-round{padding:15px}.idea-teams{gap:9px}.idea-teams>div{gap:8px;padding:10px}.idea-teams>div span{width:100%}.typing-intro,.typing-board{padding:20px 12px}.typing-keyboard{padding:10px 4px;border-radius:16px}.keyboard-row{gap:3px;margin:7px 0}.keyboard-row button{height:43px;border-radius:7px;font-size:16px;border-bottom-width:3px}.keyboard-tools button{font-size:13px}.keyboard-tools button:nth-child(2){font-size:13px}.typing-target h2{font-size:32px}.typing-target p{font-size:22px}.typing-candidates button{font-size:20px;padding:13px}.typing-toolbar{font-size:15px}.typing-guide{font-size:17px}}
.keyboard-row:not(.keyboard-tools) button{flex:0 0 calc((100% - 72px)/10);max-width:70px}@media(max-width:650px){.keyboard-row:not(.keyboard-tools) button{flex-basis:calc((100% - 27px)/10)}}
.ime-panel{border:1px solid #d1dbce;background:#f7faf7;border-radius:18px;padding:15px;margin:15px 0}.ime-panel .typing-candidates{justify-content:flex-start}.ime-pages{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:12px}.ime-pages button,.typing-tone-actions>button:not(.pinyin-action){font:inherit;padding:9px 15px;border:1px solid #c8d4c5;border-radius:12px;background:white;color:#4d6546}.typing-tones fieldset{border:1px solid #cdddc5;border-radius:22px;padding:20px;margin:22px 0;background:#f7fbf3}.typing-tones legend{font-size:18px;padding:0 9px}.typing-tones fieldset>div{display:flex;gap:12px;flex-wrap:wrap}.typing-tones button{font:inherit;display:flex;flex-direction:column;gap:10px;align-items:center;min-width:85px;border:2px solid #cadbc0;border-radius:20px;background:white;color:#3d6530;padding:15px;cursor:pointer}.typing-tones b{font-size:26px;font-weight:500}.typing-tones small{font-size:15px}.typing-tones button[aria-pressed=true]{background:#e4f1d9;border-color:#659248}.typing-tone-actions{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}.typing-composition strong{font-family:inherit;color:#4d6546;margin-right:12px}@media(max-width:650px){.typing-tones fieldset{padding:14px}.typing-tones button{min-width:65px;padding:11px}.typing-tones fieldset>div{gap:8px}.ime-panel{padding:10px}.ime-panel .typing-candidates{gap:8px}.ime-panel .typing-candidates button{padding:9px;font-size:19px}}
.pinyin-reading-rows{display:flex;flex-wrap:wrap;max-width:none;gap:14px;margin-bottom:22px}.pinyin-reading-row{display:flex;gap:8px;padding:9px;border-radius:22px;background:#eaf3e8}.pinyin-reading-row:nth-child(4n+2){background:#e6f3d8}.pinyin-reading-row:nth-child(4n+3){background:#ffedb7}.pinyin-reading-row:nth-child(4n+4){background:#ebdffa}.pinyin-reading-row .bubble{width:65px;height:66px;aspect-ratio:auto;flex-shrink:0;border-radius:22px}.pinyin-reading-row .pinyin-bubble span{font-size:29px!important}.compact-detail{padding:22px;margin-top:20px}.learn-toolbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:18px}.learn-toolbar>strong{font:38px Arial,sans-serif;margin-right:14px}.learn-toolbar label{font-size:16px;display:flex;align-items:center;gap:8px}.learn-toolbar select,.learn-toolbar button,.card-pager button,.compact-detail .idea-teams button{font:inherit;padding:9px 12px;border:1px solid #c9d6c5;background:white;color:#4d6546;border-radius:14px;cursor:pointer}.compact-examples{grid-template-columns:repeat(6,minmax(0,1fr));gap:13px;margin:16px 0}.compact-examples button{padding:20px 9px;background:#eef5ec;border:2px solid #c6d8c1;border-radius:28px;min-height:120px}.compact-examples button:nth-child(3n+2){background:#e9f4de;border-color:#bad79b;color:#3d6430}.compact-examples button:nth-child(3n){background:#fff0c5;border-color:#e68990;color:#a13139}.compact-examples strong{font-size:35px}.compact-examples span{font-size:21px}.card-pager{display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap;margin-top:20px}.card-pager button:disabled{opacity:.45;cursor:default}.pinyin-source-dialog{width:min(650px,92vw);max-height:85dvh;overflow:auto;border:1px solid #cfdccb;border-radius:25px;padding:28px;color:#41553b}.pinyin-source-dialog::backdrop{background:#263f5266}.source-close{float:right;border:0;background:transparent;font-size:28px;cursor:pointer}.pinyin-source-dialog h2{text-align:center;font-size:38px;margin:10px}.source-pinyin{text-align:center;font-size:25px}.pinyin-source-dialog p{line-height:1.8}.pinyin-source-dialog blockquote{margin:18px 0;background:#f2f7f1;border-radius:15px;padding:18px;font-size:20px;line-height:1.9}.pinyin-source-dialog small{display:block;font-size:14px;color:#778474;margin-top:10px}.pinyin-source-dialog #source-speak{display:block;margin:auto;font:inherit;padding:10px 18px;border:1px solid #c9d6c5;border-radius:15px;background:white;color:#4d6546}@media(max-width:650px){.pinyin-reading-rows{gap:10px}.pinyin-reading-row{gap:7px;padding:8px}.pinyin-reading-row .bubble{width:59px;height:57px}.pinyin-reading-row .pinyin-bubble span{font-size:25px!important}.compact-detail{padding:17px 13px}.compact-examples{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.compact-examples button{min-height:100px;padding:16px 5px}.compact-examples strong{font-size:28px}.compact-examples span{font-size:18px}.learn-toolbar{gap:11px}.learn-toolbar label{font-size:15px}.card-pager{gap:9px}.pinyin-source-dialog{padding:22px}}
.pinyin-reading-row{flex-wrap:wrap;max-width:100%}@media(max-width:650px){.pinyin-reading-row{gap:7px}.pinyin-reading-row .bubble{width:55px}}

.pinyin-book-buttons,.pinyin-learning-tabs,.pinyin-count-bubbles{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.pinyin-book-buttons button,.pinyin-learning-tabs button,.pinyin-count-bubbles button{font:inherit;padding:11px 17px;border:1px solid #c4d1c1;border-radius:26px;background:#f3f8f2;color:#4d6546;cursor:pointer}.pinyin-main-tabs{display:grid;grid-template-columns:1fr 1fr}.pinyin-main-tabs button{font-size:23px}.pinyin-learning-tabs{margin:18px 0}.pinyin-learning-tabs[hidden]{display:none}.pinyin-book-buttons button[aria-pressed=true],.pinyin-learning-tabs button[aria-pressed=true],.pinyin-count-bubbles button[aria-pressed=true]{background:#608556;color:white}.pinyin-mode-bubbles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin:22px 0}.pinyin-mode-bubbles button{display:flex;align-items:center;gap:14px;font:inherit;font-size:18px;border:2px solid #d2decf;border-radius:26px;background:#f3f9f2;padding:20px;color:#4d6546;cursor:pointer}.pinyin-mode-bubbles button:nth-child(2n){background:#f0f7e6}.pinyin-mode-bubbles button:nth-child(3n){background:#fff4d9}.pinyin-mode-bubbles button b{display:grid;place-items:center;min-width:40px;height:40px;border-radius:50%;background:white;font-size:25px}.pinyin-mode-bubbles button[aria-pressed=true]{border-color:#608556;box-shadow:0 0 0 2px #608556}.pinyin-count-bubbles{margin:24px 0}.pinyin-count-bubbles input{width:80px;margin-left:9px;font:inherit;padding:10px;border:1px solid #c4d1c1;border-radius:20px}@media(max-width:650px){.pinyin-mode-bubbles{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.pinyin-mode-bubbles button{padding:12px 8px;font-size:15px;gap:7px}.pinyin-main-tabs button{font-size:19px}}

/* Centered pinyin activities and directly selectable bubbles. */
.pinyin-learning-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));max-width:840px;margin:24px auto;gap:16px}.pinyin-learning-tabs button{min-height:76px;border:2px solid #cddcc8;font-size:20px;background:#f4faf2;border-radius:23px}.pinyin-learning-tabs button:nth-child(2){background:#eff7e8;border-color:#c7dfb5;color:#416e38}.pinyin-learning-tabs button:nth-child(3){background:#fff5db;border-color:#e58a90;color:#ad323a}.pinyin-learning-tabs button[aria-pressed=true]{background:#608556;border-color:#507246;color:white;box-shadow:0 3px 0 #415d39}.pinyin-subtabs,.pinyin-reading-rows,.pinyin-reading-row,.learn-toolbar,.pinyin-count-bubbles{justify-content:center}.pinyin-reading-rows{margin-left:auto;margin-right:auto}.pinyin-group-title,.tone-intro,.pinyin-page #pinyin-content>h2,.pinyin-page #pinyin-content>.pinyin-note{text-align:center}.pinyin-mode-bubbles button{justify-content:center}.blend-pickers{display:grid;grid-template-columns:1fr 1fr;gap:22px;max-width:960px;margin:auto}.blend-pickers section{padding:24px;background:#f4faf2;border:2px solid #d3e1cf;border-radius:28px;text-align:center}.blend-pickers section+section{background:#f2f9ea;border-color:#cfdfb9}.blend-pickers h2{font-size:21px;margin:0 0 20px}.blend-bubbles,.typing-bubbles{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px}.blend-bubbles button{font:27px Arial,sans-serif;min-width:65px;min-height:58px;padding:10px 14px;border:2px solid #ccdac8;border-radius:24px;background:white;color:#4d6546;cursor:pointer}.blend-pickers section+section button{border-color:#c3d9a9;color:#456a32}.blend-bubbles button[aria-pressed=true]{background:#5c7f53;color:white;border-color:#45623d;box-shadow:0 3px 0 #45623d}.blend-pickers section+section button[aria-pressed=true]{background:#58803d;border-color:#385f22;box-shadow:0 3px 0 #385f22}.typing-intro{text-align:center;max-width:900px;margin:auto}.typing-settings{flex-direction:column;justify-content:center;gap:24px}.typing-bubbles button{font:inherit;font-size:18px;padding:13px 23px;background:#f4faf2;color:#4d6546;border:2px solid #ccdbc7;border-radius:30px;cursor:pointer}.typing-bubbles button:nth-child(even){background:#eff7e6;border-color:#c9dfb6}.typing-bubbles button[aria-pressed=true]{background:#608556;color:white;border-color:#507246;box-shadow:0 3px 0 #415d39}.typing-bubbles label{border:1px solid #d4ddd2;border-radius:25px;padding:7px 13px;background:#fff9e8}.typing-bubbles input{width:70px;padding:7px;font:inherit;border:1px solid #ced7cc;border-radius:15px}.typing-tones fieldset>div{justify-content:center}.typing-intro details{max-width:640px;margin:auto}.pinyin-learning-tabs[hidden]{display:none}@media(max-width:650px){.pinyin-learning-tabs{gap:8px}.pinyin-learning-tabs button{font-size:16px;padding:10px 7px;min-height:68px}.blend-pickers{gap:10px}.blend-pickers section{padding:15px 8px;border-radius:20px}.blend-pickers h2{font-size:17px}.blend-bubbles{gap:8px}.blend-bubbles button{font-size:23px;min-width:49px;min-height:49px;padding:7px 9px}.typing-bubbles{gap:9px}.typing-bubbles button{font-size:16px;padding:12px 19px}}

.pinyin-reading-layout{display:grid;grid-template-columns:155px minmax(0,1fr);gap:24px;align-items:start}.pinyin-reading-layout .pinyin-subtabs{display:flex;flex-direction:column;gap:12px;position:sticky;top:16px;margin:0}.pinyin-reading-layout .pinyin-subtabs button{width:100%;padding:14px 10px}.pinyin-reading-main{min-width:0}.pinyin-blend-layout{display:grid;grid-template-columns:minmax(0,1fr) 210px;gap:24px;align-items:start}.pinyin-blend-main{min-width:0}.pinyin-blend-examples{padding:16px;background:#f0f7ec;border:1px solid #cfdfc3;border-radius:24px}.pinyin-blend-examples h2{font-size:18px;text-align:center;margin:0 0 14px}.pinyin-blend-examples .pinyin-examples{display:flex;flex-direction:column;gap:10px}.pinyin-blend-examples .pinyin-examples button{width:100%;min-width:0}.pinyin-blend-examples .pinyin-examples strong{font-size:30px}@media(max-width:700px){.pinyin-reading-layout,.pinyin-blend-layout{display:block}.pinyin-reading-layout .pinyin-subtabs{position:static;flex-direction:row;flex-wrap:wrap;margin-bottom:18px}.pinyin-reading-layout .pinyin-subtabs button{width:auto;padding:10px 14px}.pinyin-blend-examples{margin-top:20px}.pinyin-blend-examples .pinyin-examples{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Single-character discovery and a dedicated matching workspace. */
.sound-focus,.source-focus{color:#bd493a!important;font-weight:800!important}.source-focus{background:#fff0d0;border-radius:4px;padding:0 2px}.source-words{display:flex;flex-wrap:wrap;gap:12px}.source-words>span{background:#f2f7f1;padding:10px 16px;border-radius:16px;font-size:22px}
.pinyin-blend-layout{grid-template-columns:minmax(0,1fr) minmax(280px,.85fr);gap:20px}.pinyin-blend-layout .blend-pickers{gap:10px}.pinyin-blend-layout .blend-pickers section{padding:14px 8px}.pinyin-blend-layout .blend-bubbles{gap:7px}.pinyin-blend-layout .blend-bubbles button{min-width:43px;min-height:43px;padding:6px 8px;font-size:22px;border-radius:17px}.pinyin-blend-examples .pinyin-examples{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.pinyin-blend-examples .pinyin-examples button{padding:12px 5px;min-height:95px}.pinyin-blend-layout .tone-switches{flex-wrap:wrap}.pinyin-blend-layout .blend-equation{flex-wrap:wrap;font-size:24px}
.pinyin-match-layout{display:grid;grid-template-columns:185px minmax(0,1fr);gap:28px;align-items:start}.pinyin-match-layout .pinyin-mode-bubbles{display:flex;flex-direction:column;margin:0;gap:12px;position:sticky;top:15px}.pinyin-match-layout .pinyin-mode-bubbles button{padding:12px 10px;justify-content:flex-start;font-size:16px;gap:8px;border-radius:20px}.pinyin-match-layout .pinyin-mode-bubbles button b{min-width:32px;height:32px;font-size:21px}.pinyin-match-main{min-width:0}.pinyin-match-main .pinyin-question{margin-top:0}
@media(max-width:700px){.pinyin-blend-layout{display:block}.pinyin-match-layout{grid-template-columns:1fr;gap:18px}.pinyin-match-layout .pinyin-mode-bubbles{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.pinyin-blend-examples .pinyin-examples{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Quiet discovery controls, with a clear selected sound. */
.pinyin-reading-row .pinyin-bubble[aria-pressed=true]{background:#fb747d!important;border:3px solid #d94d56!important;color:#87262d!important;box-shadow:0 3px 0 #d94d56;transform:translateY(-2px)}
.selected-sound{display:table;margin:0 auto 12px;padding:6px 24px;border-radius:18px;background:#fb747d;color:#87262d;font-size:32px;font-weight:800}.compact-detail{padding:16px}.compact-detail .compact-examples button{min-height:96px;padding:12px 8px}.source-topbar{display:flex;align-items:center;justify-content:flex-end;gap:20px}.source-topbar label{display:flex;align-items:center;gap:7px;padding:8px 12px;background:#f2f7f1;border-radius:16px;cursor:pointer}.source-topbar input{width:18px;height:18px}.source-pinyin[hidden]{display:none}
.pinyin-blend-layout .blend-equation{gap:10px;margin:16px auto;padding:14px;font-size:24px}.pinyin-blend-layout .blend-equation b,.pinyin-blend-layout .blend-equation strong{font-size:28px;padding:10px 14px;border-radius:20px;min-width:0}.pinyin-blend-examples .tone-switches{display:flex;justify-content:center;gap:7px;margin:0 0 18px;flex-wrap:wrap}.pinyin-blend-examples .tone-switches button{padding:8px 10px;min-width:0;font-size:18px}.pinyin-blend-examples .tone-switches b{font-size:20px}.pinyin-blend-examples .tone-switches small{font-size:12px}
.source-citations{margin:12px 0;color:#7c8579;font-size:13px}.source-citations small{font-size:13px;margin:3px 0}.pinyin-source-dialog ruby{ruby-align:center}.pinyin-source-dialog rt{font-size:13px;font-weight:400;color:#667861}.pinyin-source-dialog blockquote{line-height:2.8}.hide-source-pinyin rt{visibility:hidden}.pinyin-blend-right{min-width:0}.pinyin-blend-right>.tone-switches{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:0 0 14px;padding:10px;background:white;border-radius:22px}.pinyin-blend-right>.tone-switches button{padding:8px;min-width:0}.pinyin-blend-right>.tone-switches b{font-size:22px}
.pinyin-match-main .pinyin-count-bubbles{margin:0 0 12px;gap:7px;justify-content:flex-end}.pinyin-match-main .pinyin-count-bubbles button{padding:6px 13px}.pinyin-match-main .pinyin-count-bubbles input{padding:6px;width:65px}.pinyin-match-main .pinyin-launch{text-align:right;margin:0 0 10px}.pinyin-match-main .pinyin-launch button{padding:6px 12px;font-size:14px}.tone-answers{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:10px!important}.tone-answers button{min-height:88px!important;padding:10px!important;border-radius:22px!important;aspect-ratio:auto!important}.tone-answers button span{font-size:56px!important;line-height:1!important}.tone-answers button:nth-child(1){background:#ebf4e8!important}.tone-answers button:nth-child(2){background:#e8f3d8!important}.tone-answers button:nth-child(3){background:#fff0be!important}.tone-answers button:nth-child(4){background:#f7dfea!important}.tone-answers button:nth-child(5){background:#ebe1f8!important}
.rule-equation,.rule-contrast,.rule-examples{display:flex;justify-content:center;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0}.rule-equation b,.rule-examples b,.rule-contrast>div{background:#f0f6ee;padding:12px 18px;border:2px solid #d2dfce;border-radius:22px;font-size:25px}.rule-equation b:last-child,.rule-contrast>div:last-child{background:#fff0bc;border-color:#e38c92}.rule-contrast>div{display:flex;flex-direction:column;gap:8px;text-align:center}.rule-contrast strong{font-size:30px}.bubble-rules article p{font-size:16px}.bubble-rules article>strong{font-size:23px}
.typing-board,.typing-intro{padding:16px}.typing-target h2{font-size:34px;margin:10px 0}.typing-target p{font-size:22px;margin:8px 0}.typing-keyboard{max-width:720px;margin:12px auto;padding:10px}.keyboard-row{margin:6px 0}.keyboard-row button{height:44px;font-size:19px}.typing-settings{gap:12px}.typing-bubbles button{padding:8px 17px;font-size:16px}.typing-board>.pinyin-action{margin:10px auto}.typing-composition{padding:10px;margin:10px auto}
.typing-inline-settings{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}.typing-inline-settings .typing-bubbles{gap:7px}.typing-inline-settings button{padding:7px 12px;font-size:15px}.pinyin-answers .answer-right{background:#d4f1ce!important;border:4px solid #248440!important;color:#164e2b!important;opacity:1;font-weight:800}.pinyin-answers .answer-right::after{content:'✓ 正确答案';display:block;font:700 17px/1.8 sans-serif;color:#155d36}.typing-feedback{font-weight:700}
/* Primary learning tools at left, reading categories across the content. */
.pinyin-learning-workspace{display:grid;grid-template-columns:118px minmax(0,1fr);gap:22px;align-items:start;margin:20px 0}.pinyin-learning-workspace.is-matching{display:block}.pinyin-learning-workspace>.pinyin-learning-tabs{display:flex;flex-direction:column;position:sticky;top:16px;margin:0;gap:12px}.pinyin-learning-workspace>.pinyin-learning-tabs[hidden]{display:none}.pinyin-learning-workspace>.pinyin-learning-tabs button{font-size:18px;min-height:58px;padding:10px 8px;width:100%;border-radius:20px}.pinyin-learning-workspace .pinyin-reading-layout{display:block}.pinyin-learning-workspace .pinyin-reading-layout .pinyin-subtabs{position:static;display:flex;flex-direction:row;gap:9px;margin:0 0 16px;flex-wrap:wrap;justify-content:center}.pinyin-learning-workspace .pinyin-subtabs button{width:auto;padding:9px 15px;font-size:16px}.pinyin-learning-workspace .pinyin-reading-rows{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:7px;margin-bottom:14px}.pinyin-learning-workspace .pinyin-reading-row{display:contents}.pinyin-learning-workspace .pinyin-reading-row .bubble{width:100%;height:45px;min-height:0;border-radius:15px;padding:5px;box-sizing:border-box}.pinyin-learning-workspace .pinyin-reading-row .pinyin-bubble span{font-size:23px!important}.pinyin-learning-workspace .selected-sound{font-size:25px;padding:4px 19px}.compact-rule-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.compact-rule-grid article{padding:15px!important;border-radius:20px!important;min-width:0}.compact-rule-grid h2{font-size:18px!important;margin:0 0 10px}.compact-rule-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:9px 0}.compact-rule-row .rule-equation{margin:0;gap:5px;justify-content:flex-start;flex-wrap:wrap}.compact-rule-row .rule-equation b{padding:7px 10px;font-size:19px;border-radius:15px;border-width:1px}.rule-example-word{display:flex;align-items:center;gap:8px;flex-shrink:0;background:#fff3cf;border-radius:13px;padding:7px 10px}.rule-example-word strong{font-size:24px}.rule-example-word small{font-size:13px}.compact-rule-grid article p{font-size:14px;line-height:1.6;margin:10px 0}.rule-check{font:inherit;font-size:15px;padding:7px 13px;border:1px solid #cad6c7;border-radius:18px;background:#f4faf2;color:#4d6546;cursor:pointer}@media(max-width:900px){.compact-rule-grid{grid-template-columns:1fr}.pinyin-learning-workspace .pinyin-blend-layout{display:block}.pinyin-blend-right{margin-top:16px}}@media(max-width:650px){.pinyin-learning-workspace{display:block}.pinyin-learning-workspace>.pinyin-learning-tabs{position:static;flex-direction:row;margin-bottom:16px}.pinyin-learning-workspace>.pinyin-learning-tabs button{flex:1;min-height:48px}.pinyin-learning-workspace .pinyin-reading-rows{grid-template-columns:repeat(6,minmax(0,1fr))}.pinyin-learning-workspace .pinyin-reading-row .bubble{height:42px}.compact-rule-row{flex-wrap:wrap}.pinyin-learning-workspace .pinyin-subtabs button{padding:8px 11px}}

.pinyin-learning-workspace>.pinyin-learning-tabs .pinyin-subtabs{display:grid;gap:7px;border-top:1px solid #d0d8cd;margin:8px 0 0;padding-top:12px}.pinyin-learning-workspace>.pinyin-learning-tabs .pinyin-subtabs button{font-size:15px;padding:9px 4px;min-height:40px}.pinyin-subtabs [data-pinyin-group=rules]{background:#fff0b3!important;border:2px solid #dd6b73!important;color:#a0272f!important;font-weight:800}.pinyin-subtabs [data-pinyin-group=rules][aria-pressed=true]{background:#f67982!important}.rule-topic>h2{font-size:21px;margin:12px 0}.compact-rule-grid h3{font-size:18px;margin:0 0 10px}.tone-order{display:flex;align-items:center;gap:4px;flex-wrap:wrap}.tone-order b{border-radius:50%;padding:6px 10px;background:#eff7ed;color:#506849}.inline-rule-game{margin-top:10px;padding:12px;border-radius:18px;background:#f4faf2;border:1px solid #cddac9}.rule-game-head{display:flex;justify-content:space-between;align-items:center}.inline-rule-game button{border:1px solid #c7d4c3;background:white;border-radius:20px;padding:8px 12px;font:inherit;cursor:pointer}.inline-rule-game .rule-question{font-size:20px;font-weight:bold}.rule-answer-bubbles{display:flex;flex-wrap:wrap;gap:8px}.rule-answer-bubbles button{font-size:21px;background:#fff3cf}.rule-answer-bubbles button:nth-child(2){background:#e8f4e0}.rule-answer-bubbles button:nth-child(3){background:#f4eafa}@media(max-width:650px){.pinyin-learning-workspace>.pinyin-learning-tabs{flex-wrap:wrap}.pinyin-learning-workspace>.pinyin-learning-tabs .pinyin-subtabs{width:100%;display:flex;flex-wrap:wrap}.pinyin-learning-workspace>.pinyin-learning-tabs .pinyin-subtabs button{flex:1}}

.rule-pair-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:12px}.rule-pair-grid>div{display:grid;gap:8px}.rule-pair-grid button[aria-pressed=true]{outline:3px solid #e67981;background:#fff2ba}

/* Keep the dedicated matching round compact; ordinary pinyin learning panels retain their roomy layout. */
.pinyin-match-layout{gap:18px}.pinyin-match-layout .pinyin-mode-bubbles{gap:7px}.pinyin-match-layout .pinyin-mode-bubbles button{min-height:42px;padding:7px 8px;font-size:15px}.pinyin-match-layout .pinyin-mode-bubbles button b{min-width:28px;width:28px;height:28px;font-size:18px}.pinyin-match-main .pinyin-count-bubbles{margin-bottom:6px}.pinyin-match-main .pinyin-launch{margin-bottom:6px}.pinyin-match-layout .pinyin-question{max-width:700px;margin:0 auto;padding:15px 17px;border-radius:22px}.pinyin-match-layout .pinyin-question-top{font-size:14px}.pinyin-match-layout .pinyin-question>p{margin:7px 0;font-size:16px;line-height:1.45}.pinyin-match-layout .pinyin-question h2{margin:8px auto 13px;max-width:620px;font-size:30px;line-height:1.35}.pinyin-match-layout .pinyin-answers{max-width:610px;gap:10px}.pinyin-match-layout .pinyin-answers .bubble{min-height:74px;padding:8px;border-radius:22px}.pinyin-match-layout .pinyin-answers .bubble span{font-size:24px;line-height:1.35}.pinyin-match-layout .tone-answers{gap:7px!important}.pinyin-match-layout .tone-answers button{min-height:68px!important;padding:7px!important;border-radius:18px!important}.pinyin-match-layout .tone-answers button span{font-size:42px!important}.pinyin-match-layout .pinyin-feedback{min-height:1.5em;margin:8px 0!important;font-size:16px!important}.pinyin-match-layout .pinyin-action{font-size:16px;padding:9px 17px}
@media(max-width:700px){.pinyin-match-layout{gap:12px}.pinyin-match-layout .pinyin-mode-bubbles{gap:6px}.pinyin-match-layout .pinyin-mode-bubbles button{min-height:40px;padding:6px;font-size:14px}.pinyin-match-layout .pinyin-question{padding:13px 11px}.pinyin-match-layout .pinyin-question h2{margin:7px auto 11px;font-size:27px}.pinyin-match-layout .pinyin-answers{gap:8px}.pinyin-match-layout .pinyin-answers .bubble{min-height:66px;border-radius:18px}.pinyin-match-layout .pinyin-answers .bubble span{font-size:21px}.pinyin-match-layout .tone-answers button{min-height:60px!important}.pinyin-match-layout .tone-answers button span{font-size:36px!important}}

/* The matching workspace should surface its complete live question before
   decorative page chrome.  This rule is deliberately scoped to that state. */
@media (min-width:701px) and (min-height:650px){
  body[data-pinyin-view="practice"].pinyin-page .site-masthead{margin-bottom:4px!important;padding-top:8px!important;padding-bottom:8px!important}
  body[data-pinyin-view="practice"].pinyin-page .section-navigation{margin-bottom:8px!important}
  body[data-pinyin-view="practice"].pinyin-page .section-navigation a{padding-top:7px!important;padding-bottom:7px!important;font-size:14px!important}
  body[data-pinyin-view="practice"].pinyin-page .class-main{padding-top:6px!important;padding-bottom:8px!important}
  body[data-pinyin-view="practice"].pinyin-page .foundation-primary{margin-bottom:6px!important}
  body[data-pinyin-view="practice"].pinyin-page .foundation-primary a{padding:7px!important;font-size:16px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-heading{gap:8px!important;margin-bottom:5px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-heading h1{font-size:24px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-book-buttons{gap:6px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-book-buttons button{padding:6px 11px!important;font-size:14px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-main-tabs{gap:8px!important;margin-bottom:7px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-main-tabs button{gap:7px!important;padding:10px!important;border-radius:18px!important;font-size:19px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-layout{gap:12px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-layout .pinyin-mode-bubbles{gap:5px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-layout .pinyin-mode-bubbles button{min-height:36px!important;padding:5px 7px!important;font-size:14px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-layout .pinyin-mode-bubbles button b{min-width:25px!important;width:25px!important;height:25px!important;font-size:16px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-main .pinyin-count-bubbles{gap:5px!important;margin:0 0 4px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-main .pinyin-count-bubbles button{padding:5px 10px!important;font-size:14px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-main .pinyin-count-bubbles input{padding:5px!important;font-size:14px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-main .pinyin-launch{margin:0 0 4px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-main .pinyin-launch button{padding:5px 10px!important;font-size:13px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-layout .pinyin-question{max-width:620px!important;padding:10px 13px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-layout .pinyin-question h2{margin:5px auto 8px!important;font-size:28px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-layout .pinyin-question>p{margin:5px 0!important;font-size:15px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-layout .pinyin-answers{gap:7px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-layout .pinyin-answers .bubble{min-height:62px!important;padding:6px!important;border-radius:18px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-layout .pinyin-answers .bubble span{font-size:22px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-main{position:relative;display:block}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-main .pinyin-count-bubbles{justify-content:flex-start;padding-right:118px}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-main .pinyin-launch{position:absolute;top:0;right:0;margin:0!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-main .pinyin-question{margin-top:4px!important}
  body[data-pinyin-view="practice"].pinyin-page .pinyin-match-layout .pinyin-answers .bubble{min-height:56px!important}
}

/* Keep the study tools compact and consistent with the school site. */
body.pinyin-page .class-main{max-width:var(--ls-wrap)!important;margin:0 auto!important;padding:24px 28px 42px!important}
body.pinyin-page .foundation-primary{gap:8px!important;margin:0 0 18px!important}
body.pinyin-page .foundation-primary a{min-height:42px!important;padding:9px 14px!important;border-radius:6px!important;font-size:15px!important}
body.pinyin-page .pinyin-heading{gap:12px!important;margin:0 0 14px!important}
body.pinyin-page .pinyin-heading h1{font:700 28px/1.25 var(--ls-serif)!important;color:var(--ls-navy)!important}
body.pinyin-page .pinyin-book-buttons{gap:7px!important}
body.pinyin-page .pinyin-book-buttons button,body.pinyin-page #pinyin-sound{padding:8px 11px!important;border-radius:6px!important;font-size:14px!important;box-shadow:none!important}
body.pinyin-page .pinyin-main-tabs,body.pinyin-page .pinyin-learning-tabs{gap:10px!important;margin:0 0 14px!important;max-width:none!important}
body.pinyin-page .pinyin-main-tabs button,body.pinyin-page .pinyin-learning-tabs button{min-height:46px!important;padding:9px 12px!important;border-radius:6px!important;font-size:16px!important;box-shadow:none!important}
body.pinyin-page .pinyin-main-tabs button:not([aria-pressed=true]),body.pinyin-page .pinyin-learning-tabs button:not([aria-pressed=true]){background:#fff!important;border-color:var(--ls-line)!important;color:var(--ls-navy)!important}
body.pinyin-page .pinyin-main-tabs button[aria-pressed=true],body.pinyin-page .pinyin-learning-tabs button[aria-pressed=true]{background:var(--ls-blue)!important;border-color:var(--ls-blue)!important;color:#fff!important}
body.pinyin-page .pinyin-grid{gap:10px!important;margin-bottom:16px!important}
body.pinyin-page .pinyin-bubble span{font-size:28px!important}
body.pinyin-page .pinyin-detail{margin-top:16px!important;padding:18px!important;border-radius:10px!important}
body.pinyin-page .pinyin-focus{gap:18px!important}
body.pinyin-page .pinyin-focus>strong{min-width:94px!important;min-height:94px!important;padding:8px!important;border-radius:10px!important;font-size:38px!important}
body.pinyin-page .pinyin-examples{gap:10px!important;margin:14px 0!important}
body.pinyin-page .pinyin-examples button{padding:12px 10px!important;border-radius:8px!important;gap:5px!important}
body.pinyin-page .pinyin-examples strong{font-size:22px!important}
body.pinyin-page .pinyin-action{padding:9px 15px!important;border-radius:6px!important;font-size:15px!important}
@media(max-width:650px){body.pinyin-page .class-main{padding:18px!important}body.pinyin-page .pinyin-main-tabs,body.pinyin-page .pinyin-learning-tabs{grid-template-columns:1fr!important}body.pinyin-page .pinyin-book-buttons{width:100%}.pinyin-page .pinyin-book-buttons button{flex:1}}