.teaching-page h1{font-size:clamp(30px,3.3vw,46px);line-height:1.2;letter-spacing:-1.5px;margin:18px 0}.teaching-page h2{font-size:25px;letter-spacing:-.7px}.teaching-page p{line-height:1.7}.teaching-page button:disabled{cursor:not-allowed;color:#777;background:#eee}.teach-oni{width:155px;height:155px;object-fit:contain}.teach-hero{display:flex;align-items:center;gap:24px;padding:20px 0 30px;border-bottom:1px solid #ddd}.teach-hero h1{margin:0}.teach-hero h1 small{font-size:22px}.teach-hero p{margin:12px 0;color:#5c616b;font-size:20px}.teach-hero-note{margin-left:auto!important;font-size:16px!important;text-align:right}.teach-form{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:16px;padding:24px 0}.teach-form .btn{align-self:end}.teach-form #recommend-error{grid-column:1/-1;margin:0}.teach-shortcuts{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #ddd;border-bottom:1px solid #ddd;padding:24px 0}.teach-shortcuts a{display:flex;align-items:center;justify-content:center;gap:20px;color:#111;text-decoration:none;border-right:1px solid #ddd;font-weight:700}.teach-shortcuts a:last-child{border:none}.teach-home-columns{display:grid;grid-template-columns:1.2fr 1fr;gap:32px;margin-top:28px}.teach-home-columns>section{min-width:0}.teach-home-columns h2{margin-bottom:6px}.teach-tabs{display:flex;gap:8px;border-bottom:1px solid #ddd;overflow:auto;margin:20px 0}.teach-tabs a{padding:14px 10px;text-decoration:none;white-space:nowrap;font-size:14px;color:#62636a;border-bottom:3px solid transparent}.teach-tabs a.active{border-color:#111;color:#111;font-weight:700}.teach-tabs span{margin-left:4px}.teach-tool{display:flex;align-items:center;gap:14px;padding:23px 0;border-bottom:1px solid #e0e0e0;min-width:0}.teach-tool h3{font-size:18px;margin:0 0 8px}.teach-tool p{font-size:14px;color:#666;margin:0 0 6px}.teach-tool>div:nth-child(2){flex:1;min-width:0}.teach-tool .btn{padding:5px;flex-shrink:0}.teach-tool-mark{height:42px;width:42px;display:grid;place-items:center;flex-shrink:0}.teach-product-row{display:flex;gap:18px;align-items:center;padding:24px 0;border-top:1px solid #ddd;border-bottom:1px solid #ddd}.teach-product-row h3{font-size:20px;margin:0 0 8px}.teach-product-row p{font-size:14px;color:#666;margin:0 0 5px}.teach-product-row>div:nth-child(2){flex:1}.teach-thumb{height:90px;min-width:122px;display:flex;align-items:center;justify-content:center;background:#f4f4f2;gap:6px}.teach-thumb span{font-size:25px;border:1px solid #bbb;background:#fff;padding:5px}.teach-actions{display:flex;gap:10px;flex-wrap:wrap}.teach-coming{padding:30px;background:#f5f5f3;text-align:center;margin:24px 0}.teach-coming h3{font-size:18px;margin:12px 0 5px}.teach-coming p{color:#666;margin:5px}.teach-home-columns .teach-product-row{flex-wrap:wrap}.teach-home-columns .teach-actions{margin-left:140px}.teach-tools-header{position:relative;text-align:center;padding:20px 0}.teach-tools-header .teach-oni{position:absolute;left:0;top:0}.teach-tool-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;align-items:start}.teach-tool-columns section{min-width:0}.teach-tool-columns .teach-tool{gap:8px}.teach-tool-columns .teach-tool-mark{width:26px}.teach-tool-columns .teach-tool p{line-height:1.6}.teach-catalog-heading{display:flex;justify-content:space-between;gap:20px}.teach-catalog-heading aside{display:flex;align-items:center;gap:10px;max-width:320px;background:#f5f5f3;padding:10px;font-size:16px}.teach-catalog-heading .teach-oni{width:100px;height:100px}.teach-resource-filter{display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1.5fr auto;gap:12px;padding:24px 0;border-bottom:1px solid #ddd}.teach-resource-filter .btn{align-self:end}.teach-product-detail{display:grid;grid-template-columns:1.35fr 1fr;gap:32px}.teach-product-cover{background:#fafaf8;padding:24px}.teach-cover-top{display:flex;align-items:center;gap:10px}.teach-cover-top .teach-oni{width:130px;height:130px}.teach-cover-top h2{font-size:28px;line-height:1.3;margin:8px 0}.teach-cover-top p{margin:8px 0;color:#666}.teach-three-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0}.teach-three-steps>div{background:white;border:1px solid #ddd;padding:16px}.teach-three-steps b{font-size:17px}.teach-three-steps p{font-size:14px}.teach-jamo-small{font-size:24px!important;font-weight:700}.teach-gallery-main{display:block;width:100%;aspect-ratio:2/1.2;object-fit:contain;background:white}.teach-gallery{display:flex;gap:10px;margin-top:12px;align-items:center}.teach-gallery>button[data-gallery]{width:80px;padding:0;border:1px solid #ccc;background:white;cursor:pointer}.teach-gallery img{display:block;width:100%}.teach-facts{margin:25px 0}.teach-facts>div{display:flex;padding:16px 0;border-bottom:1px solid #ddd}.teach-facts dt{width:130px}.teach-facts dd{margin:0}.teach-facts strong{font-size:24px}.teach-product-note{font-size:14px;padding:18px;background:#f5f5f3;color:#666}.teach-instructions{display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:32px;border-top:1px solid #ddd;margin-top:32px;padding-top:24px}.teach-instructions li{padding:6px 0}.teach-zoom{max-width:min(95vw,1200px);padding:20px;border:1px solid #bbb;border-radius:12px}.teach-zoom::backdrop{background:#0009}.teach-zoom img{max-height:75vh;max-width:100%;display:block;margin:14px 0}.teach-progress{display:flex;justify-content:center;gap:12px;padding:12px 0 30px}.teach-progress button{background:white;border:1px solid #ddd;border-radius:30px;padding:8px 14px;color:#666;cursor:pointer}.teach-progress button.active{background:#111;color:white}.teach-progress button span{margin-left:5px}.teach-game-body{text-align:center;min-height:520px}.teach-game-cover{padding:20px;max-width:700px;margin:auto}.teach-game-cover h1{font-size:clamp(50px,6vw,78px);margin:25px 0}.teach-game-cover .teach-oni{height:160px;width:160px}.teach-game-cover .btn{margin:15px 8px}.teach-game-footer{display:flex;align-items:center;justify-content:space-between;padding:20px 0;border-top:1px solid #ddd;margin-top:24px}.teach-levels{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:40px 0}.teach-levels button{padding:50px 20px;background:white;border:1px solid #bbb;border-radius:12px;cursor:pointer}.teach-levels strong{font-size:42px}.teach-levels span{font-size:15px}.teach-rule-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin:50px 0}.teach-rule-grid>div{padding:24px;border-top:1px solid #ddd;border-bottom:1px solid #ddd}.teach-rule-grid span{font-size:38px}.teach-rule-grid h2{font-size:22px}.teach-check{display:block;margin:20px}.teach-check input{width:20px;height:20px;vertical-align:middle}.teaching-game details{max-width:700px;margin:auto;text-align:left;border:1px solid #ddd;padding:20px}.teaching-game summary{cursor:pointer}.teach-letter-examples{display:flex;justify-content:center;gap:30px;margin:40px 0}.teach-letter-examples>div,.teach-letter-examples>button{width:250px;border:1px solid #ddd;border-radius:12px;background:#fafaf8;padding:35px 20px}.teach-letter-examples strong{display:block;font-size:110px;line-height:1.5}.teach-letter-examples p,.teach-letter-examples span{font-size:28px}.teach-round-heading{display:flex;align-items:center;justify-content:space-between;text-align:left}.teach-round-heading .teach-oni{width:120px;height:120px}.teach-round-grid{display:grid;grid-template-columns:2fr 1fr;gap:30px;text-align:left;margin-top:25px}.teach-round-grid>section{padding:20px 0}.teach-jamo-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.teach-jamo-cards>div{position:relative;border:1px solid #ddd;border-radius:10px;background:#fafaf8;text-align:center;padding:25px 5px}.teach-jamo-cards strong{display:block;font-size:clamp(95px,12vw,170px);line-height:1.2}.teach-card-status{display:block;font-size:14px;color:#666;min-height:24px}.teach-jamo-cards>div.used{border:2px solid #111;background:#efefed}.teach-jamo-cards .used .teach-card-status{color:#111;font-weight:700}.teach-sentence{display:block;margin-top:30px;font-size:22px;font-weight:700}.teach-sentence textarea{width:100%;resize:vertical;font:inherit;font-size:28px;border:1px solid #bbb;border-radius:6px;padding:18px;margin-top:12px;box-sizing:border-box}.teach-timer{border:1px solid #ddd;border-radius:12px;padding:25px}.teach-timer h2{font-size:22px;margin:0 0 10px}.teach-timer output{font-size:clamp(55px,6vw,80px);font-weight:800;line-height:1.2;display:block;margin:10px 0 20px}.teach-timer .teach-actions{margin-bottom:12px;display:flex;flex-wrap:nowrap}.teach-timer .btn{flex:1;padding:8px;font-size:15px}.teach-timer li{font-size:17px;padding:10px 0;line-height:1.5}.teaching-game:fullscreen{background:#fff;overflow:auto;max-width:none;padding:30px 5vw;box-sizing:border-box}.teaching-page button:focus-visible,.teaching-page a:focus-visible{outline:2px solid #111;outline-offset:3px}
@media(max-width:1000px){.teach-tool-columns{grid-template-columns:repeat(2,1fr)}.teach-resource-filter{grid-template-columns:repeat(3,1fr)}.teach-progress button span{display:none}.teach-product-detail{grid-template-columns:1fr}.teach-round-grid{grid-template-columns:1.5fr 1fr}.teach-jamo-cards strong{font-size:110px}}
@media(max-width:760px){.teach-hero{gap:15px}.teach-oni{width:90px;height:100px}.teach-hero h1 small{display:block;font-size:16px;margin-top:6px}.teach-hero p{font-size:15px}.teach-hero-note{display:none}.teach-form{grid-template-columns:1fr 1fr}.teach-shortcuts{gap:10px}.teach-shortcuts a{display:block;text-align:center;font-size:13px}.teach-shortcuts svg{display:block;margin:0 auto 8px}.teach-home-columns,.teach-tool-columns{grid-template-columns:1fr}.teach-tools-header .teach-oni{position:static;width:110px;height:100px}.teach-tools-header h1{margin-top:8px}.teach-catalog-heading aside{display:none}.teach-resource-filter{grid-template-columns:1fr 1fr}.teach-product-row{flex-wrap:wrap}.teach-product-row .teach-actions{width:100%;margin-left:0}.teach-instructions{grid-template-columns:1fr;gap:10px}.teach-three-steps{gap:5px}.teach-three-steps>div{padding:10px}.teach-three-steps b{font-size:14px}.teach-cover-top .teach-oni{width:90px;height:90px}.teach-product-cover{padding:16px}.teach-gallery{flex-wrap:wrap}.teach-levels,.teach-rule-grid{grid-template-columns:1fr;gap:15px;margin:25px 0}.teach-levels button{padding:20px}.teach-levels strong{font-size:30px}.teach-game-body{min-height:350px}.teach-letter-examples{gap:8px}.teach-letter-examples>div,.teach-letter-examples>button{padding:15px 5px;min-width:0}.teach-letter-examples strong{font-size:70px}.teach-letter-examples p,.teach-letter-examples span{font-size:15px}.teach-progress{gap:5px}.teach-progress button{padding:9px 13px}.teach-round-heading .teach-oni{display:none}.teach-round-heading h1{font-size:28px}.teach-round-grid{grid-template-columns:1fr}.teach-jamo-cards strong{font-size:90px}.teach-sentence textarea{font-size:23px}.teach-timer output{font-size:65px}.teach-game-footer span{font-size:13px}.teach-game-footer .btn{padding:8px 12px}.teach-game-cover h1{font-size:48px}}
.teach-three-steps .teach-jamo-small{font-size:20px!important;white-space:nowrap;letter-spacing:-.8px}.teach-home-columns .teach-tabs{flex-wrap:wrap;gap:0;overflow:visible}.teach-home-columns .teach-tabs a{padding:12px 8px;font-size:13px}
@media(max-width:760px){.teach-three-steps .teach-jamo-small{white-space:normal;font-size:17px!important}}
/* Round 2: preserve readable classroom controls at narrow mobile widths. */
.teaching-page section,.teach-product-detail>section,.teach-round-grid>section,.teach-round-grid>aside,.teach-form>*{min-width:0}
.teach-progress button{min-height:44px;min-width:44px}
.teach-gallery button[data-gallery][aria-pressed="true"]{outline:2px solid #111;outline-offset:2px}
.teach-zoom .teach-actions{justify-content:space-between}
@media(max-width:760px){
 .teach-progress{flex-wrap:wrap;justify-content:center}.teach-progress button{flex:0 0 44px;padding:9px 0}
 .teach-jamo-cards{gap:8px}.teach-jamo-cards>div{min-width:0;padding:20px 3px}.teach-jamo-cards strong{font-size:clamp(48px,19vw,90px)}
 .teach-card-status{font-size:12px}.teach-round-heading{flex-wrap:wrap;gap:12px}.teach-round-heading>div{min-width:0}.teach-round-heading .btn{margin-left:auto}
 .teach-hero{flex-wrap:wrap}.teach-hero>div{flex:1;min-width:170px}.teach-hero h1{font-size:clamp(28px,7vw,36px)}
 .teach-gallery>button[data-gallery]{width:65px;min-height:44px}.teach-gallery .btn{width:100%;justify-content:center}
 .teach-three-steps{grid-template-columns:1fr}.teach-three-steps>div{padding:14px}.teach-three-steps .teach-jamo-small{white-space:nowrap}
 .teach-product-detail .teach-actions .btn:not(.btn-ghost){flex:1 1 190px;justify-content:center}
 .teach-game-footer{gap:8px;flex-wrap:wrap}.teach-game-footer span{order:3;width:100%;text-align:center;padding-top:5px}
 .teach-tool{gap:8px}.teach-tool h3{overflow-wrap:anywhere}.teach-tool-mark{width:28px}.teach-tool .btn{min-width:44px}
}
.teach-restart-dialog{max-width:440px;width:calc(100% - 40px);border:1px solid #ccc;border-radius:14px;padding:24px;color:#111;background:#fff}
.teach-restart-dialog::backdrop{background:#0007}.teach-restart-dialog h2{font-size:24px;line-height:1.4;margin:0 0 12px}.teach-restart-dialog p{line-height:1.7}.teach-restart-dialog .teach-actions{margin-top:24px;justify-content:flex-end}
.teach-faq{margin-top:36px;border-top:1px solid #ddd;padding-top:20px}.teach-faq details{border-bottom:1px solid #ddd;padding:16px 0}.teach-faq summary{font-weight:700;cursor:pointer;min-height:44px;display:flex;align-items:center;justify-content:space-between}.teach-faq summary::after{content:'+';font-size:24px}.teach-faq details[open] summary::after{content:'−'}.teach-faq p{max-width:800px;color:#555;margin:4px 0 16px}
@media(max-width:400px){.teach-form .field:nth-of-type(3),.teach-form>.btn{grid-column:1/-1}.teach-form>.btn{justify-content:center;white-space:nowrap}.teach-letter-examples>button span{font-size:13px;word-break:keep-all}.teach-faq summary{gap:12px;word-break:keep-all}.teach-faq summary::after{flex-shrink:0}}
.teach-tool-columns>section:only-child{grid-column:1/-1}
@media(min-width:761px) and (max-width:1000px){.teach-home-columns .teach-actions{margin-left:0;width:100%}.teach-home-columns .teach-actions .btn-primary{margin-left:auto}}
/* Clarity pass: show the current task first; disclose optional choices when needed. */
.teach-form{grid-template-columns:1fr 1fr auto;gap:16px}
.teach-form #recommend-error:empty{display:none}
.teach-unit-filter{grid-column:1/-1;max-width:360px}
.teach-unit-filter summary,.teach-resource-more summary,.teach-filter-disclosure>summary,.teach-teacher-guide summary{cursor:pointer;min-height:44px;display:flex;align-items:center;gap:12px;font-weight:600}
.teach-unit-filter summary::after,.teach-resource-more summary::after,.teach-filter-disclosure>summary::after,.teach-teacher-guide summary::after{content:'+';margin-left:auto}
.teach-unit-filter[open] summary::after,.teach-resource-more[open] summary::after,.teach-filter-disclosure[open]>summary::after,.teach-teacher-guide[open] summary::after{content:'−'}
.teach-unit-filter summary span,.teach-resource-more summary span{font-size:13px;color:#707070;font-weight:400}
.teach-unit-filter .field{margin-top:10px}
.teach-filter-disclosure{border-top:1px solid #ddd;border-bottom:1px solid #ddd;margin:16px 0}
.teach-filter-disclosure>summary{padding:8px 0}
.teach-filter-disclosure .teach-form{padding:10px 0 20px}
.teach-tool-columns{grid-template-columns:repeat(2,1fr);gap:24px 44px}
.teach-resource-filter{grid-template-columns:minmax(140px,1fr) minmax(200px,2fr) auto;gap:14px}
.teach-resource-more{grid-column:1/-1;max-width:600px}
.teach-resource-more>div{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:12px}
.teach-coming-note{font-size:14px;color:#666;padding:16px 0}
.teach-product-detail{grid-template-columns:1.2fr 1fr;align-items:start}
.teach-product-cover{padding:18px}
.teach-preview-note{font-size:13px;color:#666;margin:18px 0 0}
.teach-gallery-main{aspect-ratio:16/10}
.teach-product-note{padding:14px 0;background:none;line-height:1.6!important;font-size:14px}
.teach-teacher-guide{border-top:1px solid #ddd;margin-top:20px;padding-top:8px}
.teach-teacher-guide h2{font-size:18px;margin:18px 0 8px}
.teach-teacher-guide p,.teach-teacher-guide li{font-size:15px;line-height:1.7}
.teach-teacher-guide ol{padding-left:22px}
.teach-trial-level{border:1px solid #ddd;border-radius:12px;background:#fafaf8;max-width:390px;margin:32px auto;padding:24px}
.teach-trial-level strong{font-size:36px;display:block}
.teach-trial-level span{display:block;font-size:40px;margin:18px 0}
.teach-trial-level p{margin:0;color:#666}
.teach-time-adjust{padding:0!important;border:0!important;margin-top:14px!important}
.teach-time-adjust summary{padding:8px 0;font-size:14px;color:#666}
.teach-time-adjust .teach-actions{margin-top:12px}
.teach-timer #timer-state:empty{display:none}
.teach-round-heading h1{font-size:clamp(26px,2.9vw,38px)}
.teach-game-body .teach-game-cover .text-link{display:inline-block;margin-top:16px}
@media(max-width:1000px){.teach-product-detail{grid-template-columns:1fr}.teach-product-detail>section:nth-child(2){grid-row:1}.teach-product-cover{max-width:740px;width:100%;box-sizing:border-box}}
@media(max-width:760px){.teach-form{grid-template-columns:1fr 1fr}.teach-form>.btn{grid-column:1/-1;justify-content:center}.teach-tool-columns{grid-template-columns:1fr}.teach-resource-filter{grid-template-columns:1fr 1fr}.teach-resource-filter>.btn{grid-column:1/-1;justify-content:center}.teach-resource-filter .field:nth-child(2){min-width:0}.teach-unit-filter{max-width:none}.teach-product-cover{padding:12px}.teach-product-detail{gap:20px}}
.teach-game-cover{padding:8px 20px}.teach-game-cover .teach-oni{width:100px;height:100px}.teach-game-cover h1{font-size:clamp(40px,4.4vw,58px);margin:16px 0}.teach-game-cover p{margin:12px 0}.teach-game-body{min-height:390px}.teach-game-footer{margin-top:18px}
@media(max-width:760px){.teach-game-body{min-height:350px}.teach-game-cover h1{font-size:40px}.teach-game-cover .teach-oni{width:90px;height:90px}}
@media(min-width:761px){.teach-jamo-cards strong{font-size:clamp(80px,8vw,115px)}.teach-jamo-cards>div{padding:18px 5px}.teach-sentence{margin-top:22px}.teach-sentence textarea{font-size:24px;padding:14px}.teach-round-grid{gap:24px}}
/* All-tools browsing starts with five meaningful groups, not 38 expanded rows. */
.teach-tool-columns:has(.teach-tool-group){display:block}
.teach-tool-group{border-bottom:1px solid #dededb;padding:8px 0}
.teach-tool-group>summary{display:flex;align-items:center;gap:14px;min-height:66px;cursor:pointer;list-style:none;font-size:21px;font-weight:700}
.teach-tool-group>summary::-webkit-details-marker{display:none}
.teach-tool-group>summary small{font-size:14px;font-weight:400;color:#666;margin-left:auto}
.teach-tool-group[open]>summary>.icon{transform:rotate(180deg)}
@media(max-width:760px){.teach-tool-group>summary{font-size:19px;min-height:62px}.teach-tool-group>summary small{font-size:13px}}
@media(max-width:760px){.teach-rule-grid{gap:0;margin:24px 0}.teach-rule-grid>div{display:flex;align-items:center;gap:18px;padding:16px 12px;text-align:left}.teach-rule-grid>div>span{font-size:24px;min-width:28px}.teach-rule-grid h2{font-size:18px;margin:0}}
