.learning-toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:8px 0}
.learning-toolbar [aria-pressed=true]{background:var(--teal);color:white}
.learning-title{font-size:27px;margin:8px 0;flex:1}
.alphabet-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.alphabet-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:#fff;border:2px solid #dbe4d5;border-radius:18px;padding:8px;min-width:0;min-height:138px}
.alphabet-glyph{display:block;font-family:"Segoe UI","Helvetica Neue",Arial,sans-serif;font-size:60px;font-size:clamp(44px,6vw,68px);line-height:1.15;font-weight:700;letter-spacing:3px}
.alphabet-art{width:100%;height:100px;height:clamp(65px,calc((var(--available-height,800px) - 380px)/2),140px);object-fit:contain;pointer-events:none}
.alphabet-card .alphabet-glyph{font-size:40px;letter-spacing:2px}
.alphabet-card .alphabet-art{height:70px}
.alphabet-example{font-size:21px;line-height:1.2;word-wrap:break-word;overflow-wrap:anywhere}.alphabet-example strong{color:#a34d26;text-decoration:underline}
.alphabet-card .alphabet-example{font-size:18px}
.alphabet-detail-toolbar{justify-content:center}
.alphabet-detail{display:flex;flex-direction:column;align-items:center;gap:10px;padding:12px;max-width:500px;margin:6px auto;background:#fff;border:2px solid #dbe4d5;border-radius:22px}
.alphabet-detail .alphabet-glyph{font-size:86px;font-size:clamp(76px,12vw,112px);letter-spacing:6px}
.alphabet-detail .alphabet-art{height:180px;height:clamp(110px,calc(var(--available-height,800px) - 510px),230px)}
.alphabet-detail .alphabet-example{font-size:30px}
.alphabet-sample{display:flex;align-items:center;justify-content:center;gap:18px;min-height:90px;background:#f1f3e8;border-radius:18px;margin:10px auto;padding:8px;max-width:500px}
.alphabet-sample .alphabet-art{width:130px;height:90px;height:clamp(65px,calc(var(--available-height,800px) - 520px),110px)}
.alphabet-sample[hidden]{display:none}
.alphabet-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}
.alphabet-repeat{margin-left:auto}
.alphabet-answers{display:flex;gap:14px;justify-content:center;margin:14px 0}
.alphabet-answer{background:#e4efe5;border:3px solid #c7dccc;border-radius:20px;flex:1;max-width:220px;min-height:110px;padding:10px}
.alphabet-answer.correct{border-color:#238061;background:#d9eed9;opacity:1}
.alphabet-status{text-align:center;min-height:28px;font-size:22px;color:var(--teal);margin:8px}
.alphabet-next{display:block;margin:8px auto;min-height:56px;padding:10px 25px;font-size:22px}
.alphabet-parent{margin:12px auto;max-width:850px;font-size:15px;line-height:1.5}
.alphabet-parent summary{cursor:pointer;min-height:48px;padding:12px;text-align:center}
.alphabet-parent select{min-height:56px;font:inherit;margin:6px;padding:8px;max-width:100%;background:white;color:var(--ink);border:1px solid #bbcfc4;border-radius:10px}
.alphabet-parent input{width:24px;height:24px;vertical-align:middle;flex-shrink:0}
.alphabet-parent label{display:flex;align-items:center;gap:8px;min-height:56px}
.alphabet-review-group h3{font-size:20px;margin:14px 8px 6px}
.alphabet-review-row{padding:12px 8px;border-top:1px solid #dbe4d5}
.alphabet-review-heading{font-size:21px;margin:0 0 8px}
.alphabet-review-action{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:6px 0;padding:8px;background:#f6f8f3;border-radius:10px}
.alphabet-review-text{flex:1 1 180px;overflow-wrap:anywhere}
.alphabet-review-label{flex:1 1 260px;min-width:0}
.alphabet-parent .alphabet-review-choice{width:100%;margin:0;min-width:0;white-space:normal;font-size:14px}
.alphabet-review-preview{min-height:48px}
.alphabet-review-important{margin:4px 0 10px;padding:8px;border-left:4px solid #b47718;background:#fff2d6}
.alphabet-review-action[data-review-state=approved-by-person]{box-shadow:inset 3px 0 #238061}
.alphabet-review-action[data-review-state=rejected-pronunciation]{box-shadow:inset 3px 0 #b84332;background:#fff0eb}
.alphabet-review-rejected{flex:1 1 100%;color:#8e3022;font-weight:600}
.alphabet-audio-notice{max-width:700px;margin:10px auto;padding:10px;border:1px solid #b47718;border-radius:10px;background:#fff2d6;font-size:16px}
.alphabet-audio-notice[hidden]{display:none}
.pagination{justify-content:center}
.density-compact .alphabet-card{padding:6px;min-height:130px}
.density-compact .alphabet-card .alphabet-art{height:62px}
.density-compact .alphabet-card .alphabet-glyph{font-size:38px}
.density-compact .alphabet-parent{margin:6px auto}
.density-compact .alphabet-detail{gap:6px;padding:8px}
.density-compact .alphabet-detail .alphabet-art{height:160px;height:clamp(100px,calc(var(--available-height,800px) - 520px),200px)}
.density-compact.short-height .alphabet-card{padding:4px;gap:2px;min-height:120px}
.density-compact.short-height .alphabet-card .alphabet-art{height:50px}
.density-compact.short-height .alphabet-card .alphabet-glyph{font-size:36px}
@media(max-width:700px){.alphabet-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.alphabet-card .alphabet-art{height:65px}.alphabet-card{min-height:130px}}
@media(max-width:440px){.alphabet-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.alphabet-glyph{font-size:44px}.alphabet-answers{gap:8px}.alphabet-answer{padding:5px}.alphabet-example{font-size:18px}.alphabet-sample{gap:8px}.alphabet-sample .alphabet-art{width:85px}}