/* 한국어 교재 — 단계 맥락·터치 가능한 이동·좁은 화면의 목록 정렬(SSOT 11·23절). */
.korean-course { container: korean-content / inline-size; min-inline-size: 0; }
.korean-course:lang(ko) { word-break: keep-all; }
.korean-course > .sonub-page-tabs { min-inline-size: 0; }
.korean-course .sonub-tabs { margin-block-end: var(--wa-space-m); }
.korean-course .sonub-tab { display: inline-flex; align-items: center; gap: var(--wa-space-xs); }
.korean-course .course-back { min-block-size: 2.5rem; padding-inline: var(--wa-space-xs); border-radius: var(--wa-border-radius-m); }
.korean-course .course-back:hover { background: var(--wa-color-brand-fill-quiet); }
.korean-course .course-link { min-block-size: 2.5rem; padding-inline: var(--wa-space-xs); }
.korean-course .korean-lesson-meta { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--wa-space-s); }
.korean-course .course-stage-label { padding: 0.25rem 0.75rem; border-radius: var(--wa-border-radius-pill); background: var(--wa-color-brand-fill-quiet); font-size: var(--wa-font-size-s); }
.korean-course .course-stage { display: grid; grid-template-columns: 2.25rem minmax(0, 1fr) auto; }
.korean-course .course-stage-tier { margin-inline-start: 0; }
.korean-course .course-pager { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.korean-course .course-pager a { justify-content: center; min-block-size: 2.75rem; padding: var(--wa-space-xs) var(--wa-space-m); border: 1px solid var(--wa-color-surface-border); border-radius: var(--wa-border-radius-m); background: var(--wa-color-surface-raised); }
.korean-course .course-pager a[rel='next'] { grid-column: 2; }
.korean-course .course-pager a:hover { background: var(--wa-color-brand-fill-quiet); text-decoration: none; }
.korean-course .ko-voice { inline-size: 100%; margin-block: 0; box-sizing: border-box; }
.korean-course .ko-voice :is(.ko-voice-status, .ko-voice-partial, .ko-voice-error) { max-inline-size: 100%; overflow-wrap: anywhere; }
@container korean-content (max-width: 28rem) {
	.korean-course .course-stage { grid-template-columns: 2.25rem minmax(0, 1fr); gap: var(--wa-space-xs) var(--wa-space-m); }
	.korean-course .course-stage-no { grid-row: 1 / span 2; align-self: start; }
	.korean-course .course-stage-tier { grid-column: 2; justify-self: start; }
}