:root{--canvas:#f6f5f2;--surface:#fff;--surface-muted:#efeee9;--ink:#282a26;--muted:#64675e;--border:#d9dcd3;--accent:#356448;--accent-hover:#244d34;--accent-soft:#eaf0e7;--stage:#252c29;--stage-muted:#bfc9c1;--warning:#86551a;--warning-soft:#fbf2e1;--danger:#a43131;--danger-soft:#fbebeb;--text-xs:.75rem;--text-sm:.875rem;--text-md:1rem;--text-lg:1.125rem;--text-xl:1.5rem;--text-2xl:2rem;--text-display:2.75rem;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--content-width:1440px;--radius-sm:6px;--radius-md:12px;--motion-fast:.12s;color:var(--ink);background:var(--canvas);font-synthesis:none;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans KR,sans-serif;font-size:var(--text-md);line-height:1.6}*{box-sizing:border-box}body{min-width:320px;margin:0}button,input,select,textarea{font:inherit}button,a,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.52}a{color:var(--accent);text-underline-offset:.2em}a:hover{color:var(--accent-hover)}h1,h2,h3,p{margin:0}h1,h2,h3{line-height:1.25}h1{font-size:clamp(var(--text-xl), 2.5vw, var(--text-2xl));letter-spacing:-.035em;font-weight:600}h2{font-size:var(--text-lg);font-weight:600}h3{font-size:var(--text-md);font-weight:600}[lang=ko]{word-break:keep-all;overflow-wrap:anywhere}:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.skip-link{background:var(--surface);padding:var(--space-3);z-index:5;position:fixed;inset-block-start:var(--space-2);inset-inline-start:var(--space-4);transform:translateY(-200%)}.skip-link:focus{transform:translateY(0)}.app-header{min-height:72px;padding:var(--space-4) clamp(var(--space-4), 4vw, var(--space-12));border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:var(--space-6);background:var(--surface);display:flex}.wordmark{align-items:center;gap:var(--space-3);color:var(--ink);font-size:var(--text-lg);letter-spacing:-.04em;font-weight:600;text-decoration:none;display:inline-flex}.brand-mark{width:var(--space-8);height:var(--space-8);background:var(--accent);color:var(--surface);font-family:Georgia,serif;font-size:var(--text-xl);border-radius:var(--radius-sm);place-items:center;display:grid}.wordmark-detail{border-inline-start:1px solid var(--border);color:var(--muted);font-size:var(--text-sm);letter-spacing:0;padding-inline-start:var(--space-3);font-weight:400}.header-caption{color:var(--muted);font-size:var(--text-sm)}nav{align-items:center;gap:var(--space-6);font-size:var(--text-sm);flex-wrap:wrap;display:flex}nav a{padding-block:var(--space-2);color:var(--muted);text-decoration:none}nav a[aria-current=page]{color:var(--accent);font-weight:600;text-decoration:underline}.page{max-width:var(--content-width);padding:var(--space-10) clamp(var(--space-4), 4vw, var(--space-12));min-height:calc(100dvh - 145px);margin-inline:auto}.page-header{justify-content:space-between;align-items:flex-start;gap:var(--space-6);margin-block-end:var(--space-6);display:flex}.page-header :where(.muted){margin-block-start:var(--space-3)}.eyebrow{color:var(--muted);font-size:var(--text-xs);letter-spacing:.12em;margin-block-end:var(--space-2);font-weight:600;line-height:1.4;display:block}.muted{color:var(--muted);font-size:var(--text-sm)}.inline-divider{border-inline-start:1px solid var(--border);height:.8em;margin-inline:var(--space-3);display:inline-block}.status{align-items:center;gap:var(--space-2);background:var(--accent-soft);color:var(--accent);border-radius:var(--radius-sm);padding:var(--space-1) var(--space-2);font-size:var(--text-xs);white-space:nowrap;line-height:1.7;display:inline-flex}.status.warning{background:var(--warning-soft);color:var(--warning)}.status.error{background:var(--danger-soft);color:var(--danger)}.rehearsal-note{gap:var(--space-2) var(--space-4);padding:var(--space-3) 0 var(--space-5);border-bottom:1px solid var(--border);font-size:var(--text-sm);color:var(--muted);flex-wrap:wrap;margin-block-end:var(--space-4);display:flex}.rehearsal-note strong{color:var(--ink);font-weight:500}.classroom-grid{align-items:start;gap:var(--space-6);grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);display:grid}.classroom-grid.script-hidden{grid-template-columns:minmax(0,1fr);max-width:960px;margin-inline:auto}.lesson-column{gap:var(--space-4);flex-direction:column;min-width:0;display:flex}.lesson-stage{aspect-ratio:16/10;background:var(--stage);color:var(--surface);border-radius:var(--radius-md);padding:var(--space-6);flex-direction:column;justify-content:space-between;display:flex;overflow:hidden}.stage-top,.stage-bottom{justify-content:space-between;align-items:center;gap:var(--space-3);color:var(--stage-muted);font-size:var(--text-xs);display:flex}.stage-kicker{letter-spacing:.12em;font-weight:500}.stage-status{text-align:end}.stage-content{min-height:0;padding-block:var(--space-6);place-items:center;display:grid}.stage-title{text-align:center}.stage-index{color:var(--stage-muted);letter-spacing:.15em;font-size:var(--text-xs);margin-block-end:var(--space-5);display:inline-block}.stage-title h2{font-family:Georgia,Times New Roman,serif;font-size:clamp(var(--text-2xl), 3.8vw, var(--text-display));letter-spacing:-.025em;font-weight:400;line-height:1.1}.stage-title p{color:var(--stage-muted);font-size:var(--text-sm);margin-block-start:var(--space-5)}.instructor-portrait{object-fit:contain;width:100%;height:100%;max-height:360px}.profile-portrait{inline-size:calc(var(--space-16) * 3);aspect-ratio:1;object-fit:cover;border-radius:var(--radius-md);max-inline-size:100%}.course-preview{aspect-ratio:16/10;background:var(--stage);inline-size:100%;max-inline-size:100%}.media-frame{aspect-ratio:16/10;background:var(--stage);border-radius:var(--radius-md);inline-size:100%;position:relative;overflow:hidden}.media-portrait,.live-video{object-fit:contain;width:100%;height:100%;position:absolute;inset:0}.audio-only-video{visibility:hidden}.media-caption{inset-inline:var(--space-4);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);color:var(--surface);background:var(--stage);text-align:center;max-block-size:50%;line-height:1.9;position:absolute;inset-block-end:var(--space-4);overflow-y:auto}.media-unlock{position:absolute;inset-block-start:var(--space-4);inset-inline-start:var(--space-4)}.playback-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-5)}.progress-label{justify-content:space-between;gap:var(--space-3);font-size:var(--text-xs);color:var(--muted);display:flex}progress{appearance:none;height:var(--space-1);background:var(--surface-muted);width:100%;color:var(--accent);margin-block:var(--space-2) var(--space-5);border-radius:var(--radius-sm);border:0;display:block;overflow:hidden}progress::-webkit-progress-bar{background:var(--surface-muted)}progress::-webkit-progress-value{background:var(--accent)}progress::-moz-progress-bar{background:var(--accent)}.playback-controls{justify-content:space-between;align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.cluster{align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.stack{gap:var(--space-5);flex-direction:column;display:flex}.button{justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);min-height:44px;color:var(--ink);font-size:var(--text-sm);transition:transform var(--motion-fast) ease-out, opacity var(--motion-fast) ease-out;font-weight:500;text-decoration:none;display:inline-flex}.button:hover:enabled{background:var(--surface-muted)}.button:active:enabled{transform:translateY(1px)}.button.primary{background:var(--accent);color:var(--surface);border-color:var(--accent)}.button.primary:hover:enabled{background:var(--accent-hover)}.button.quiet{color:var(--muted);background:0 0;border-color:#0000}.button.danger{color:var(--danger)}.button.compact{padding-inline:var(--space-2)}.mic-state{color:var(--muted);font-size:var(--text-xs)}.read-confirm{align-items:flex-start;gap:var(--space-4);border-top:1px solid var(--border);flex-direction:column;margin-block-start:var(--space-5);padding-block-start:var(--space-5);display:flex}.read-confirm p{line-height:1.9}.resume-note{color:var(--accent);font-size:var(--text-sm);margin-block-start:var(--space-4)}.panel{border:1px solid var(--border);background:var(--surface);border-radius:var(--radius-md);min-width:0;overflow:hidden}.panel-heading{justify-content:space-between;align-items:center;gap:var(--space-3);padding:var(--space-5) var(--space-6);border-bottom:1px solid var(--border);flex-wrap:wrap;display:flex}.panel-heading .eyebrow{margin-block-end:var(--space-1)}.panel-body{padding:var(--space-6)}.script-panel{flex-direction:column;min-height:0;display:flex}.script-meta{justify-content:space-between;gap:var(--space-2);padding:var(--space-3) var(--space-6);color:var(--muted);font-size:var(--text-xs);border-bottom:1px solid var(--border);flex-wrap:wrap;display:flex}.check-field{min-block-size:var(--space-12);min-inline-size:var(--space-12);align-items:center;gap:var(--space-2);cursor:pointer;display:inline-flex}input[type=checkbox]{accent-color:var(--accent);width:var(--space-4);height:var(--space-4);margin:0}.phrase-list{padding:0 var(--space-3);overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--border) transparent;min-height:0;max-height:660px;margin:0;list-style:none;position:relative;overflow-y:auto}.phrase{padding:var(--space-5) var(--space-3);border-bottom:1px solid var(--border);border-inline-start:3px solid #0000}.phrase-label{align-items:center;gap:var(--space-3);color:var(--muted);font-size:var(--text-xs);font-variant-numeric:tabular-nums;margin-block-end:var(--space-2);display:flex}.phrase-heard{color:var(--muted)}.phrase-lead-in{color:var(--accent);background:var(--surface);text-underline-offset:.2em;text-decoration:underline;text-decoration-thickness:2px}.phrase p{font-size:var(--text-md);line-height:1.9}.phrase.current{background:var(--accent-soft);border-inline-start-color:var(--accent)}.phrase.current .phrase-label{color:var(--accent);font-weight:600}.phrase:where(.completed) p{color:var(--muted)}.script-footer{padding:var(--space-3) var(--space-6);align-items:center;gap:var(--space-2);font-size:var(--text-xs);color:var(--muted);border-top:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;display:flex}.field{align-items:stretch;gap:var(--space-2);font-size:var(--text-sm);flex-direction:column;min-width:0;font-weight:500;display:flex}input:not([type=checkbox]),select,textarea{width:100%;min-width:0;min-height:44px;color:var(--ink);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:var(--space-3);font-size:var(--text-sm)}textarea{resize:vertical;line-height:1.8}input::placeholder,textarea::placeholder{color:var(--muted);font-weight:400}.field .muted{font-weight:400}.form-grid{gap:var(--space-6);grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));display:grid}.qa-answer{align-items:flex-start;gap:var(--space-3);flex-direction:column;display:flex}.qa-answer .eyebrow{margin:0}.qa-answer p{line-height:1.9}.qa-answer p+.eyebrow{margin-block-start:var(--space-4)}details{border-bottom:1px solid var(--border)}summary{cursor:pointer;padding:var(--space-4) 0;font-size:var(--text-sm);font-weight:500}summary:hover{color:var(--accent)}summary span{color:var(--muted);font-size:var(--text-xs);margin-inline-start:var(--space-3);font-weight:400}details>.stack,details>.panel-body{padding-block-end:var(--space-5)}.transcript-turn{border-inline-start:2px solid var(--border);gap:var(--space-3);flex-direction:column;padding-inline-start:var(--space-4);display:flex}.transcript-turn p{font-size:var(--text-sm);line-height:1.9}.notice{padding:var(--space-4) var(--space-5);background:var(--accent-soft);color:var(--accent);border-radius:var(--radius-sm);font-size:var(--text-sm);margin-block-end:var(--space-5)}.notice.error{background:var(--danger-soft);color:var(--danger)}.notice.warning{background:var(--warning-soft);color:var(--warning)}.notice p+.cluster{margin-block-start:var(--space-3)}.empty-state{padding:var(--space-16) var(--space-6);text-align:center;align-items:center;gap:var(--space-5);flex-direction:column;max-width:68ch;margin-inline:auto;display:flex}.code{overflow-wrap:anywhere;font-variant-numeric:tabular-nums;font-size:var(--text-sm)}.provider-grid{gap:var(--space-5);grid-template-columns:repeat(auto-fit,minmax(min(340px,100%),1fr));display:grid}.provider-path{padding-block:var(--space-4);border-bottom:1px solid var(--border)}.provider-path:last-child{border:0;padding-block-end:0}.provider-path:first-child{padding-block-start:0}.provider-path p{margin-block-start:var(--space-2)}.provider-path summary{padding-block:var(--space-3)}.provider-path li{font-size:var(--text-sm);color:var(--muted)}.evaluation-metrics{gap:var(--space-5);grid-template-columns:repeat(auto-fit,minmax(min(150px,100%),1fr));display:grid}.evaluation-metrics dt{font-size:var(--text-sm);color:var(--muted)}.evaluation-metrics dd{margin:var(--space-2) 0 0;font-size:var(--text-lg)}.app-footer{padding:var(--space-5) clamp(var(--space-4), 4vw, var(--space-12));justify-content:space-between;gap:var(--space-3);border-top:1px solid var(--border);font-size:var(--text-xs);color:var(--muted);flex-wrap:wrap;display:flex}@media (width<=900px){.classroom-grid{grid-template-columns:minmax(0,1fr)}.phrase-list{max-height:520px}.page{padding-block-start:var(--space-6)}.header-caption{display:none}.stage-title h2{font-size:var(--text-display)}}@media (width<=520px){.app-header{gap:var(--space-2);flex-wrap:wrap}.wordmark-detail{display:none}.page-header{gap:var(--space-3);flex-direction:column}.page-header .muted{line-height:1.8}.lesson-stage{padding:var(--space-4);aspect-ratio:auto;min-height:310px}.stage-title h2{font-size:var(--text-2xl)}.stage-bottom{align-items:end}.stage-bottom span{max-width:60%}.panel-heading,.panel-body{padding:var(--space-4)}.script-meta,.script-footer{padding-inline:var(--space-4)}.playback-panel{padding:var(--space-4)}.rehearsal-note{gap:var(--space-1)}nav{gap:var(--space-4)}}@media (prefers-reduced-motion:reduce){.button{transition:none}}.phrase-list>ol{margin:0;padding:0;list-style:none}
