: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;--canvas-board:#fffdf8;--canvas-ink:#171411;--canvas-accent:#e36725;--canvas-wash:#f1ad5b2e;--canvas-text-accent:#91451e;--canvas-line:#362b2029;--canvas-rule:#362b2057;--canvas-grid:#55493a14;--canvas-grid-size:28px;--canvas-muted:#746d65;--canvas-body-size:1.25rem;--canvas-secondary-size:.8125rem;--canvas-title-size:clamp(1.75rem, 5.5cqi, 2.25rem);--canvas-point-size:clamp(1.375rem, 4.5cqi, 1.625rem);--canvas-emphasis-size:clamp(1.375rem, 4.8cqi, 1.875rem);--canvas-draw-time:.62s;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}@font-face{font-family:Classroom Pen;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/ClassroomPen-Regular.woff2)format("woff2")}*{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);color:var(--accent);padding:var(--space-3);z-index:60;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}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{inline-size:100%;aspect-ratio:var(--stage-aspect,16 / 10);background:var(--stage);border-radius:var(--radius-md);position:relative;overflow:hidden}.media-portrait,.live-video,.media-transition-frame{object-fit:contain;width:100%;height:100%;position:absolute;inset:0}.media-transition-frame{z-index:1;pointer-events:none}.media-caption{z-index:2}.audio-only-video{visibility:hidden}.media-stack{inline-size:100%;aspect-ratio:var(--stage-aspect,16 / 10);position:relative}.media-stack .media-frame{aspect-ratio:auto;z-index:1;transition:opacity .32s;position:absolute;inset:0}.media-stack .media-layer-hidden{opacity:0;pointer-events:none;z-index:0}.media-caption{inset-inline:var(--space-4);inline-size:fit-content;max-inline-size:calc(100% - var(--space-8));padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);color:var(--surface);background:color-mix(in srgb, var(--stage) 78%, transparent);text-align:center;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-inline:auto;line-height:1.5;display:-webkit-box;position:absolute;inset-block-end:var(--space-4);overflow:hidden}.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}.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)}.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)}.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,.playback-panel{padding:var(--space-4)}.rehearsal-note{gap:var(--space-1)}nav{gap:var(--space-4)}}@media (prefers-reduced-motion:reduce){.button,.media-stack .media-frame{transition:none}}.phrase-list>ol{margin:0;padding:0;list-style:none}.visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.script-tools{align-items:center;gap:var(--space-1) var(--space-2);color:var(--muted);font-size:var(--text-sm);flex-wrap:wrap;display:flex}.learner-page{min-block-size:100dvh}body:has(.call){overscroll-behavior:none;background:#0f1211;overflow:hidden}.call{--call-bg:#0f1211;--call-ink:#f4f6f3;--call-muted:#d3d9d4;--call-glass:#0c0f0dc7;--call-line:#ffffff3d;--call-green:#1d7a43;--call-red:#c43636;--bar-space:calc(132px + env(safe-area-inset-bottom));--top-space:calc(env(safe-area-inset-top) + 104px);--edge-left:max(var(--space-2), env(safe-area-inset-left));--edge-right:max(var(--space-2), env(safe-area-inset-right));isolation:isolate;background:var(--call-bg);color:var(--call-ink);display:flex;position:fixed;inset:0;overflow:hidden}.call :focus-visible{outline-color:#fff}.call :is(.call-sheet,.call-script,.call-alert,.call-toast) :focus-visible{outline-color:var(--accent)}.call :is(textarea,input:not([type=checkbox]),select){font-size:16px}.call [aria-disabled=true]{cursor:not-allowed;opacity:.52}.call-stage{flex:1 1 0;block-size:100%;min-inline-size:0;position:relative}.magic-canvas{min-block-size:0;padding:var(--space-3) clamp(var(--space-3), 2.4vw, var(--space-8)) var(--space-4);color:var(--canvas-ink);background-color:var(--canvas-board);background-image:radial-gradient(var(--canvas-grid) 1px, transparent 1px);background-size:var(--canvas-grid-size) var(--canvas-grid-size);border-bottom:1px solid var(--canvas-line);flex-direction:column;display:flex;overflow:hidden}.canvas-heading{justify-content:space-between;align-items:center;gap:var(--space-2);min-block-size:44px;border-block-end:1px solid var(--canvas-line);flex:none;padding-block-end:var(--space-1);display:flex}.canvas-heading h2{white-space:nowrap;font-family:inherit;font-size:var(--text-sm);flex:none;margin:0;font-weight:600;line-height:1.25}.canvas-heading :where(h2)>span{margin-block-start:var(--space-1)}.canvas-navigation{align-items:center;gap:var(--space-1);flex:none;margin-inline-start:auto;display:flex}.canvas-navigation .button{flex:0 0 44px;inline-size:44px;padding-inline:0}.canvas-navigation .button[aria-disabled=true]{color:var(--canvas-muted);opacity:.52}.canvas-collapse{flex:none;inline-size:44px;padding-inline:0}.canvas-page-count{color:var(--canvas-muted);font-size:var(--canvas-secondary-size);font-variant-numeric:tabular-nums;white-space:nowrap}.canvas-status,.canvas-source{margin:var(--space-1) 0 0;color:var(--canvas-muted);font-size:var(--canvas-secondary-size)}.canvas-scene .canvas-writing{letter-spacing:.01em;font-family:Classroom Pen,Nanum Pen Script,Segoe Print,cursive;font-weight:400;animation:.42s linear both canvas-write}.canvas-scene h3.canvas-writing{font-size:var(--canvas-title-size);line-height:1.2}.canvas-content{min-block-size:0;padding-block:var(--space-3) var(--space-2);flex:auto;overflow:clip}.canvas-page{block-size:100%;min-block-size:0;overflow:clip;container-type:inline-size}.canvas-sheet{block-size:100%}.canvas-supplement-label{align-items:center;gap:var(--space-2);color:var(--canvas-text-accent);font-size:var(--canvas-secondary-size);letter-spacing:.04em;white-space:nowrap;margin:0;font-weight:600;display:flex}.canvas-supplement-label:before{inline-size:var(--space-3);content:"";background:var(--canvas-accent);block-size:2px;transform:rotate(-2deg)}.canvas-prepared-label{align-items:center;gap:var(--space-2);color:var(--canvas-muted);font-size:var(--canvas-secondary-size);letter-spacing:.04em;white-space:nowrap;margin:0;font-weight:600;display:flex}.canvas-prepared-label:before{inline-size:var(--space-3);content:"";background:var(--canvas-rule);block-size:1px}.canvas-scene{padding:var(--space-3) 0 var(--space-4);text-wrap:pretty;position:relative}.canvas-scene h3{font-size:var(--canvas-title-size);text-wrap:balance;margin:0;font-weight:600}.canvas-ink{inline-size:40%;block-size:var(--space-4);pointer-events:none;display:block;overflow:visible}.canvas-ink path{fill:none;stroke:var(--canvas-accent);stroke-linecap:round;stroke-linejoin:round;stroke-width:2.4px;stroke-dasharray:1;stroke-dashoffset:1px;vector-effect:non-scaling-stroke;animation:canvas-draw var(--canvas-draw-time) ease-in-out forwards}.canvas-frame{block-size:100%;inline-size:100%;position:absolute;inset:0}.canvas-frame path{stroke:var(--canvas-rule);stroke-width:1.2px}.canvas-ink .canvas-pen{fill:var(--canvas-accent);stroke:none;offset-rotate:0deg;animation:canvas-pen var(--canvas-draw-time) ease-in-out both}.canvas-body{max-inline-size:42ch;margin:var(--space-3) 0 0;font-size:var(--canvas-body-size);opacity:.78;line-height:1.35}.canvas-points{gap:var(--space-2);margin:var(--space-3) 0 0;padding:0;list-style:none;display:grid}.canvas-points li{gap:var(--space-2);align-items:baseline;min-inline-size:0;display:flex;position:relative}.canvas-points .canvas-writing{animation-delay:inherit}.canvas-points p{font-size:var(--canvas-body-size);margin:0;line-height:1.35}.canvas-points p.canvas-writing{font-size:var(--canvas-point-size);text-wrap:pretty;line-height:1.2}.canvas-number{min-block-size:1.4em;min-inline-size:2ch;color:var(--canvas-text-accent);font-family:Classroom Pen,cursive;font-size:var(--canvas-point-size);flex:none;place-items:center;font-weight:400;display:inline-grid}.canvas-scene[data-kind=flow] .canvas-points{gap:var(--space-6)}.canvas-scene[data-kind=compare] .canvas-points li{padding:var(--space-3);align-items:flex-start;position:relative}.canvas-scene[data-kind=flow] .canvas-points li:not(:last-child):after{color:var(--canvas-text-accent);content:"↓";font-family:Classroom Pen,cursive;font-size:var(--canvas-point-size);line-height:var(--space-6);position:absolute;inset-block-start:100%;inset-inline-start:0}.canvas-scene[data-kind=compare] .canvas-points{gap:var(--space-2);grid-template-columns:minmax(0,1fr)}.canvas-scene[data-kind=compare] .canvas-points li{background:var(--canvas-wash);border-radius:var(--radius-sm)}.canvas-emphasis{max-inline-size:42ch;margin:var(--space-3) 0 0;color:var(--canvas-text-accent);font-size:var(--canvas-emphasis-size);text-wrap:balance;line-height:1.2}.canvas-emphasis .canvas-writing{animation:.62s steps(12,end) both canvas-write;display:inline-block}.canvas-scene[data-kind=formula] .canvas-emphasis{background:linear-gradient(transparent 54%, var(--canvas-wash) 54%, var(--canvas-wash) 88%, transparent 88%)}.canvas-sheet>.canvas-scene{column-count:1;column-fill:auto;column-gap:var(--space-6);block-size:100%;padding:0}.canvas-sheet :is(h3,.canvas-ink,.canvas-body,.canvas-points li,.canvas-emphasis){break-inside:avoid}.canvas-sheet h3{break-after:avoid}.canvas-sheet .canvas-scene .canvas-points{display:block}.canvas-sheet .canvas-scene .canvas-points li{grid-template-columns:var(--space-6) minmax(0, 1fr);column-gap:0;padding-inline-start:0;display:grid}.canvas-sheet .canvas-scene .canvas-points li+li{margin-block-start:var(--space-3)}.canvas-sheet .canvas-number{grid-area:1/1;position:static}.canvas-sheet .canvas-scene[data-kind=compare] .canvas-points li{padding-inline-start:var(--space-3)}.canvas-sheet .canvas-scene[data-kind=flow] .canvas-points li+li{margin-block-start:var(--space-6)}.canvas-sheet .canvas-emphasis .canvas-writing{overflow-wrap:anywhere;display:block}.canvas-source{align-self:flex-end}.canvas-preview{margin-block:var(--space-3);padding:var(--space-4);border:1px solid var(--canvas-line);border-radius:var(--radius-md);container-type:inline-size}@container (width>=520px){.canvas-sheet .canvas-scene[data-kind=compare] .canvas-points,.canvas-preview .canvas-scene[data-kind=compare] .canvas-points{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.canvas-sheet .canvas-scene[data-kind=compare] .canvas-points li+li{margin-block-start:0}}@keyframes canvas-write{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}@keyframes canvas-draw{to{stroke-dashoffset:0}}@keyframes canvas-pen{0%{opacity:1;offset-distance:0%}95%{opacity:1}to{opacity:0;offset-distance:100%}}.call .media-stack{aspect-ratio:auto;inline-size:auto;position:absolute;inset:0}.call .media-frame{background:var(--call-bg);border-radius:0}.call :is(.media-portrait,.live-video){object-fit:cover;object-position:50% 30%}.call .media-caption{max-inline-size:calc(100% - var(--space-8));padding:var(--space-2) 14px;border-radius:var(--radius-md);color:#fff;-webkit-line-clamp:3;background:#0a0c0bc7;font-size:1.0625rem;transition:opacity .18s;inset-block-end:calc(var(--bar-space) + var(--space-2))}.call[data-lesson-quiet] .media-caption{opacity:.3}.call.canvas-only .media-caption{opacity:.82;-webkit-line-clamp:2;background:#0a0c0ba3;font-size:.95rem}.call .media-unlock{z-index:2;min-block-size:52px;padding-inline:var(--space-6);font-size:var(--text-md);border-radius:999px;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.call-overlay{z-index:2;background:var(--call-bg);transition:opacity .48s,visibility 0s linear .48s;position:absolute;inset:0;overflow:hidden}.call-overlay[data-visible=false]{opacity:0;visibility:hidden;pointer-events:none}.call-overlay[data-visible=true]{transition:opacity .2s}.call-scroll{inset:var(--top-space) 0 var(--bar-space);padding:var(--space-2) max(var(--space-5), env(safe-area-inset-right)) var(--space-2) max(var(--space-5), env(safe-area-inset-left));display:flex;position:absolute;overflow-y:auto}.call-backdrop{object-fit:cover;filter:blur(30px)brightness(.3)saturate(1.15);z-index:-1;block-size:calc(100% + 96px);inline-size:calc(100% + 96px);position:absolute;inset:-48px}.call-card{align-items:center;gap:var(--space-3);text-align:center;flex-direction:column;inline-size:100%;max-inline-size:420px;margin:auto;display:flex;position:relative}.call-avatar{aspect-ratio:1;block-size:132px;inline-size:132px;font-size:var(--text-2xl);background:#26332c;border-radius:50%;flex:none;place-items:center;font-weight:600;display:grid;position:relative;overflow:hidden}.call-avatar img{object-fit:cover;object-position:50% 25%;border-radius:50%;block-size:100%;inline-size:100%}.call-avatar[data-ringing=true]:before,.call-avatar[data-ringing=true]:after{content:"";opacity:0;border:2px solid #ffffff8c;border-radius:50%;position:absolute;inset:-4px}@media (prefers-reduced-motion:no-preference){.call-avatar[data-ringing=true]:before,.call-avatar[data-ringing=true]:after{animation:2.4s ease-out infinite call-ring}.call-avatar[data-ringing=true]:after{animation-delay:1.2s}}@keyframes call-ring{0%{opacity:.7;transform:scale(1)}to{opacity:0;transform:scale(1.65)}}.call-name{font-size:var(--text-xl);letter-spacing:-.02em;margin-block-start:var(--space-2);font-weight:600}.call-state{gap:var(--space-1);color:var(--call-muted);flex-direction:column;display:flex}.call-state strong{color:var(--call-ink);font-size:var(--text-lg);font-weight:600}.call-setup{inline-size:100%;flex-direction:column;gap:14px;margin-block-start:var(--space-3);display:flex}.call-settings{flex-wrap:wrap;gap:10px;display:flex}.call-field{text-align:start;color:var(--call-muted);flex-direction:column;flex:150px;gap:6px;font-size:.8125rem;display:flex}.call-field select{border-radius:var(--radius-md);border:1px solid var(--call-line);color:#fff;background:#ffffff1a;min-block-size:48px}.call-field option{color:var(--ink)}.call-check{color:var(--call-ink);font-size:var(--text-sm);flex-basis:100%;justify-content:center}.call-preflight{gap:var(--space-2);flex-direction:column;display:flex}.call-warning{padding:var(--space-2) var(--space-3);color:#ffd892;font-size:var(--text-sm);background:#ffc45729;border-radius:10px}.call-top{z-index:3;align-items:start;gap:var(--space-2) var(--space-3);padding:calc(env(safe-area-inset-top) + 12px) max(16px, env(safe-area-inset-right)) 28px max(16px, env(safe-area-inset-left));text-shadow:0 1px 3px #000c;background:linear-gradient(#000000b8 0,#00000094 72%,#0000 100%);grid-template-columns:minmax(0,1fr) auto;display:grid;position:absolute;inset:0 0 auto}.call-heading{min-inline-size:0}.call-heading h1{font-size:var(--text-lg);letter-spacing:-.01em;text-overflow:ellipsis;white-space:nowrap;line-height:1.35;overflow:hidden}.call-heading p{color:var(--call-ink);white-space:nowrap;align-items:center;gap:6px;margin-block-start:var(--space-1);font-size:.8125rem;display:flex;overflow:hidden}.call-heading p>span:first-child{text-overflow:ellipsis;min-inline-size:0;overflow:hidden}.call-badge{padding:1px var(--space-2);color:var(--call-ink);font-size:var(--text-xs);background:#0000008c;border-radius:999px;flex:none;display:inline-flex}.call-top-actions{justify-content:end;gap:var(--space-2);flex-wrap:wrap;display:flex}.call-chip{border:1px solid var(--call-line);background:var(--call-glass);min-block-size:44px;min-inline-size:44px;color:var(--call-ink);font-size:var(--text-sm);text-shadow:none;border-radius:999px;align-items:center;gap:6px;padding-inline:14px;display:inline-flex}.call-chip .icon{block-size:20px;inline-size:20px}@media (width<=419px){.call-chip{padding-inline:11px}.call-chip span{clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;position:absolute;overflow:hidden}}.call-progress{grid-column:1/-1;align-items:center;gap:10px;font-size:.8125rem;display:flex}.call-progress progress{background:#ffffff4d;flex:auto;block-size:4px;margin:0}.call-progress progress::-webkit-progress-bar{background:#ffffff4d}.call-progress progress::-webkit-progress-value{background:#fff}.call-progress progress::-moz-progress-bar{background:#fff}.call-progress span{white-space:nowrap}.call:not([data-phase=live]) .call-progress{visibility:hidden}.call-notices{z-index:10;inset-inline:var(--edge-left) var(--edge-right);align-items:center;gap:var(--space-2);pointer-events:none;flex-direction:column;display:flex;position:absolute;inset-block-start:calc(var(--top-space) + var(--space-2))}.call-notices>*{pointer-events:auto;max-inline-size:min(100%,520px)}.call-notice{padding:var(--space-2) 14px;border-radius:var(--radius-md);border:1px solid var(--call-line);background:var(--call-glass);font-size:var(--text-sm);text-align:center}.call-alert{padding:14px var(--space-4);background:var(--surface);color:#5a1d1d;border-radius:14px;flex-direction:column;align-items:flex-start;gap:10px;font-size:.9375rem;display:flex;box-shadow:0 10px 32px #00000061}.call-sheet .call-alert{z-index:1;box-shadow:none;border:1px solid var(--danger-soft);background:var(--danger-soft);position:sticky;inset-block-start:0}.call-alert .icon{block-size:18px;inline-size:18px}.call-turn{--turn-bottom:calc(var(--caption-top,calc(var(--bar-space) + var(--space-2))) + var(--space-2));z-index:10;inset-inline:var(--edge-left) var(--edge-right);pointer-events:none;flex-direction:column;align-items:flex-end;display:flex;position:absolute;inset-block-end:var(--turn-bottom)}.call[data-chrome=hidden] .call-turn{--turn-bottom:calc(var(--caption-top,calc(env(safe-area-inset-bottom) + 40px)) + var(--space-2))}.call-bubble{max-inline-size:min(100%,40ch);padding:var(--space-2) 14px;color:#1b1f1d;overflow-wrap:anywhere;background:#fffffff0;border-radius:16px 16px 4px;font-size:.9375rem;line-height:1.5;box-shadow:0 6px 20px #00000047}.call-bubble-text{max-block-size:clamp(1.5em, calc(100dvh - var(--top-space,0px) - var(--turn-bottom) - var(--space-4) - 1em), calc(1.5em * 5));flex-direction:column;justify-content:flex-end;display:flex;overflow:hidden}.call-bubble-text[data-overflow]{-webkit-mask-image:linear-gradient(#0000,#000 1.5em);mask-image:linear-gradient(#0000,#000 1.5em)}.call-toast{border-radius:var(--radius-md);background:var(--surface);color:#1b1f1d;font-size:var(--text-sm);text-align:center;padding:10px 14px;box-shadow:0 8px 28px #00000052}.call-icon-button{background:var(--surface-muted);min-block-size:44px;min-inline-size:44px;color:var(--ink);border:0;border-radius:50%;place-items:center;display:grid}.call-icon-button .icon{block-size:20px;inline-size:20px}.call-controls{z-index:5;padding:30px max(12px, env(safe-area-inset-right)) calc(14px + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));background:linear-gradient(#0000,#000000b8);justify-content:center;align-items:flex-start;gap:clamp(6px,3.5vw,20px);display:flex;position:absolute;inset:auto 0 0}.call-mic{display:contents}.call-mic[hidden]{display:none}.call-mic-status,.call-button span{text-shadow:0 1px 3px #000000b3}.call-mic-status{inset-inline:var(--space-4);inline-size:fit-content;max-inline-size:calc(100% - var(--space-8));color:var(--call-ink);font-size:var(--text-xs);white-space:nowrap;text-overflow:ellipsis;background:#000000ad;border-radius:999px;margin-inline:auto;padding:1px 10px;position:absolute;inset-block-start:2px;overflow:hidden}.call-top,.call-controls button{transition:opacity .24s}.call[data-chrome=hidden] .call-top,.call[data-chrome=hidden] .call-controls button{opacity:0}.call[data-chrome=hidden] :is(.call-top,.call-controls){pointer-events:none}.call[data-chrome=hidden] .call-controls{background:0 0}.call[data-chrome=hidden] .call-mic-status{inset-block-start:auto;inset-block-end:calc(env(safe-area-inset-bottom) + 8px)}.call[data-chrome=hidden] .media-caption{inset-block-end:calc(env(safe-area-inset-bottom) + 40px)}@media (prefers-reduced-motion:reduce){.call-top,.call-controls button{transition:none}}.call-button{min-inline-size:64px;color:var(--call-ink);font-size:var(--text-xs);background:0 0;border:0;flex-direction:column;align-items:center;gap:6px;padding:0;font-weight:500;display:flex}.call-button span{white-space:nowrap}.call-button .icon{box-sizing:content-box;border:1px solid var(--call-line);block-size:24px;inline-size:24px;transition:background var(--motion-fast) ease-out;background:#00000061;border-radius:50%;padding:15px}.call-button.is-on .icon{color:#111;background:#fff}.call-button.call-start .icon{background:var(--call-green);color:#fff;border-color:#0000;padding:18px}.call-button.call-end .icon{background:var(--call-red);color:#fff;border-color:#0000}.call-button:focus-visible{outline:none}.call-button:focus-visible .icon{outline-offset:3px;outline:3px solid #fff}@media (width<=379px){.call-controls{padding-inline:max(4px, env(safe-area-inset-left)) max(4px, env(safe-area-inset-right));gap:2px}.call-button{min-inline-size:56px;font-size:.6875rem}.call-button .icon{padding:12px}.call-button.call-start .icon{padding:15px}}.call-sheet,.call-script{inset-inline:var(--edge-left) var(--edge-right);max-block-size:calc(100% - max(var(--keyboard,0px), var(--bar-space)) - var(--top-space) - var(--space-2));border-radius:20px;position:absolute;inset-block-end:max(var(--keyboard,0px), var(--bar-space));box-shadow:0 12px 40px #0006}.call-sheet{z-index:8;overscroll-behavior:contain;gap:var(--space-4);padding:var(--space-4) var(--space-5) var(--space-5);background:var(--surface);color:var(--ink);flex-direction:column;display:flex;overflow-y:auto}.call-sheet[hidden]{display:none}.sheet-heading{justify-content:space-between;align-items:center;gap:var(--space-3);display:flex}.call-script{z-index:9;background:var(--surface);color:var(--ink);flex-direction:column;display:flex;overflow:hidden}.call-script .script-panel{border:0;border-radius:0;flex-direction:column;flex:auto;min-block-size:0;display:flex}.call-script .panel-heading{padding:var(--space-3) var(--space-4)}.call-script .phrase-list{flex:auto;min-block-size:0;max-block-size:none}.call:has(.question-sheet:not([hidden])) .call-script:not(.with-canvas){display:none}@media (pointer:coarse){.question-sheet:has(textarea:focus){inset-block:calc(env(safe-area-inset-top) + var(--space-2)) var(--keyboard,0px);max-block-size:none}}@media (width<=899px){.call:has(.question-sheet:not([hidden])) .call-script.with-canvas{z-index:7}}@media (height<=900px){.call-avatar{block-size:104px;inline-size:104px}.call-card{gap:var(--space-2)}.call-setup{gap:10px;margin-block-start:var(--space-2)}}@media (height<=540px){.call-sheet,.call-script{inset-block:calc(env(safe-area-inset-top) + var(--space-2)) var(--bar-space);inset-inline:auto var(--edge-right);inline-size:min(440px, calc(100% - var(--space-4)));max-block-size:none}.question-sheet{inset-block-end:max(var(--keyboard,0px), var(--bar-space))}.call-scroll{inset-block-start:calc(env(safe-area-inset-top) + 72px)}.call-avatar{block-size:88px;inline-size:88px}}@media (orientation:landscape) and (height<=540px){.call :is(.media-portrait,.live-video){object-fit:contain}}@media (width>=900px) and (height>=541px){.call{--bar-space:calc(128px + env(safe-area-inset-bottom))}.call .media-stack{inline-size:min(calc(100% - 64px), calc((100dvh - 232px) * var(--stage-aspect,1.6)));aspect-ratio:var(--stage-aspect,16 / 10);border-radius:20px;inset:auto;inset-block-start:50%;inset-inline-start:50%;overflow:hidden;transform:translate(-50%,calc(-50% - 8px));box-shadow:0 24px 60px #00000073}.magic-canvas{flex:0 0 45dvh;max-block-size:50dvh}.canvas-only .magic-canvas{flex:auto;max-block-size:none}.call .media-caption{max-inline-size:min(calc(100% - var(--space-8)), 36em);-webkit-line-clamp:2;inset-block-end:var(--space-4)}.call-top,.call-controls{background:0 0}.call-top{padding-inline:max(var(--space-8), env(safe-area-inset-left)) max(var(--space-8), env(safe-area-inset-right))}.question-sheet{inset-inline:auto max(var(--space-6), env(safe-area-inset-right));inline-size:min(420px,100% - 48px);inset-block-end:max(var(--keyboard,0px), calc(var(--bar-space) + 4px))}.call-script{block-size:100%;max-block-size:none;min-inline-size:0;box-shadow:none;border-inline-start:1px solid var(--border);border-radius:0;flex:0 clamp(440px,44vw,720px);position:static}.call-script .panel-heading{padding:var(--space-5) var(--space-6)}.call:has(.question-sheet:not([hidden])) .call-script{display:flex}}@media (width<=899px),(width<=1099px) and (height<=540px){.call:has(.call-script){flex-direction:column}.call:has(.call-script) .call-stage{flex:auto;block-size:auto;min-block-size:0}.call:has(.call-script) .call-script{block-size:clamp(160px,34dvh,320px);max-block-size:none;inline-size:100%;box-shadow:none;border-radius:0;flex:0 0 clamp(160px,34dvh,320px);order:-1;position:relative;inset:auto}.call-script.with-canvas:not(.canvas-only){flex-basis:clamp(240px,44dvh,420px);block-size:clamp(240px,44dvh,420px)}.call-script.with-canvas :is(.magic-canvas,.script-panel){flex:1 1 0;max-block-size:none}.call-script .magic-canvas{padding:calc(var(--space-2) + env(safe-area-inset-top)) var(--space-4) var(--space-2)}.call-script .canvas-content{padding-block:var(--space-2) 0}.call-script.with-canvas:not(.canvas-only) .magic-canvas{flex:0 0 66%}}@media (prefers-reduced-motion:reduce){.call-overlay,.call-overlay[data-visible=true],.call .media-caption{transition:none}.magic-canvas,.canvas-points li,.canvas-scene h3,.canvas-body,.canvas-scene .canvas-writing,.canvas-ink path,.canvas-ink .canvas-pen{animation:none}.canvas-ink path{stroke-dashoffset:0}.canvas-ink .canvas-pen{display:none}.canvas-emphasis .canvas-writing{clip-path:none}}.call-button:not(.call-start,.call-end,.is-on,[aria-disabled=true]):hover .icon{background:#ffffff47}.session-list{gap:var(--space-2);margin:0;padding:0;list-style:none;display:grid}.session-list summary{align-items:center;gap:var(--space-2) var(--space-3);cursor:pointer;flex-wrap:wrap;min-block-size:44px;display:flex}.session-when{font-variant-numeric:tabular-nums;font-weight:600}.session-detail{padding-block:var(--space-2)}.session-turns{gap:var(--space-3);margin:0;padding-inline-start:1.25em;display:grid}.session-turns p{overflow-wrap:anywhere;margin:0}
