.learn-session.lv2{--community-ink:var(--bf-title);--community-navy:var(--bf-accent);--community-slate:var(--bf-ink-soft);height:var(--learn-session-height,100dvh);background:var(--bf-bg);width:100%;max-width:820px;font-size:var(--bf-fs-16);grid-template-rows:auto minmax(0,1fr) auto;margin:0 auto;line-height:1.5;display:grid;overflow:hidden}.learn-session :is(h1,h2,h3,p){overflow-wrap:anywhere}.learn-session :is(button,a,input,select,summary){touch-action:manipulation}.learn-session :is(button,a,summary){min-width:44px;min-height:44px}.learn-session :is(button,input,select){font:inherit}.learn-session :focus-visible{outline:3px solid var(--bf-accent);outline-offset:3px}.learn-session .learn-session-header{align-items:center;gap:var(--bf-space-3);padding:calc(8px + env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) var(--bf-space-2) max(16px, env(safe-area-inset-left));border-bottom:1px solid var(--bf-line);max-height:calc(var(--learn-session-height,100dvh) * .3);min-height:0;display:flex;overflow:auto}.learn-session .learn-session-exit{border-radius:var(--bf-radius-14);background:var(--bf-soft);width:44px;font-size:var(--bf-fs-28);flex-shrink:0;align-self:flex-start;place-items:center;text-decoration:none;display:grid}.learn-session-heading{flex:1;min-width:0}.learn-session .learn-session-heading h1{font:600 var(--bf-fs-16)/1.4 var(--bf-font);letter-spacing:0;margin:0}.learn-session .learn-session-heading p{font-size:var(--bf-fs-14);margin:var(--bf-space-1) 0 0}.learn-session .learn-session-heading progress{height:6px;margin:var(--bf-space-2) 0 0}.learn-session .learn-session-middle{overscroll-behavior:contain;min-width:0;min-height:0;padding:var(--bf-space-4) max(16px, env(safe-area-inset-right)) var(--bf-space-4) max(16px, env(safe-area-inset-left));scroll-padding:16px;overflow:auto}.learn-session .learn-practice-stage{box-shadow:none;outline-offset:4px;background:0 0;border:0;border-radius:0;margin:0;padding:0}.learn-session .learn-session-actions{min-height:0;max-height:calc(var(--learn-session-height,100dvh) * .35);padding:var(--bf-space-3) max(16px, env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));border-top:1px solid var(--bf-line);background:var(--bf-surface);overflow:auto}.learn-session .learn-session-actions:empty{border:0;padding-block:0}.learn-session-action-group{align-items:center;gap:var(--bf-space-2) var(--bf-space-3);flex-wrap:wrap;display:flex}.learn-session .learn-session-action-group{flex-direction:column;align-items:stretch}.learn-session .learn-session-action-group>.learn-text-button{text-align:center}.learn-session .learn-button{min-height:48px;font-size:var(--bf-fs-16);padding:var(--bf-space-2h) var(--bf-space-4);border-radius:var(--bf-radius-14);background:var(--bf-cta);box-shadow:none}@media (hover:hover) and (pointer:fine){.learn-session .learn-button:hover{background:var(--bf-cta)}}.learn-session .learn-button-secondary{background:var(--bf-surface)}.learn-session .learn-text-button{font-size:var(--bf-fs-16)}.learn-session :is(.learn-study-heading h2,.learn-exercise>h2,.learn-feedback h2,.learn-start h2,.learn-finish h2){font-size:var(--bf-fs-22);margin:0 0 var(--bf-space-3)}.learn-session p{margin:0 0 var(--bf-space-3)}.learn-session .learn-study>.learn-muted{font-size:var(--bf-fs-16)}.learn-session .learn-study-card{padding:var(--bf-space-4);margin-top:var(--bf-space-3);border-radius:var(--bf-radius-16)}.learn-session .learn-study-card .learn-audio{margin:var(--bf-space-3) 0}.learn-session .learn-spoken{font-size:var(--bf-fs-22);line-height:1.4}.learn-session .learn-study-meaning{margin-top:var(--bf-space-3);padding-top:var(--bf-space-3)}.learn-session .learn-study-meaning p{font-size:var(--bf-fs-16)}.learn-session .learn-study-actions{justify-content:space-between;gap:var(--bf-space-2) var(--bf-space-3);flex-wrap:wrap;margin:0;display:flex}.learn-session .learn-study-actions .learn-button{font-size:var(--bf-fs-16);padding:var(--bf-space-2h) var(--bf-space-3);flex:1}.learn-session .learn-study-actions .learn-text-button,.learn-session :is(.learn-translation,.learn-choices label,.learn-choices small,.lv2-object-choice-text,.learn-start>p,.learn-client-intro p){font-size:var(--bf-fs-16)}.learn-session :is(.learn-study-label,.learn-study-meaning>span,.learn-study-heading>span,.lv2-role-label,.learn-audio-status,.learn-practice-note,.learn-self-repeat>small){font-size:var(--bf-fs-14)}.learn-session .learn-audio-toolbar{gap:var(--bf-space-2)}.learn-session .learn-audio-options{gap:var(--bf-space-1)}.learn-session .learn-audio-options button{font-size:var(--bf-fs-14);padding:var(--bf-space-2) var(--bf-space-2)}.learn-session .learn-audio-options button span{font-size:var(--bf-fs-13)}.learn-session .learn-audio .learn-audio-status{margin:var(--bf-space-2) 0;font-size:var(--bf-fs-14)}.learn-session .learn-audio summary{font-size:var(--bf-fs-14);align-items:center;text-decoration:underline;display:flex}.learn-session .lv2-coaching{padding:var(--bf-space-3);border-radius:var(--bf-radius-14);margin:0 0 var(--bf-space-3)!important}.learn-session .learn-choices{gap:var(--bf-space-2);margin:var(--bf-space-2) 0}.learn-session .learn-choices label{min-height:48px;padding:var(--bf-space-3);border-radius:var(--bf-radius-14)}.learn-session .lv2-object-choices label{gap:var(--bf-space-2);min-height:72px;padding:var(--bf-space-2) var(--bf-space-3);grid-template-columns:20px 48px minmax(0,1fr)}.learn-session .lv2-choice-art{width:48px}.learn-session .learn-answer-fields{min-width:0;margin:0}.learn-session .learn-matches select{min-width:0;max-width:100%}.learn-session .learn-exercise{padding:0}.learn-session .learn-feedback{padding:var(--bf-space-4);border-radius:var(--bf-radius-16);margin:0}.learn-session .learn-complete{padding:var(--bf-space-4) 0}.learn-session .learn-complete h2{font-size:var(--bf-fs-28)}.learn-session .learn-practice-note{margin:var(--bf-space-3) 0 0!important}.learn-session-references{gap:0 var(--bf-space-4);margin-top:var(--bf-space-3);flex-wrap:wrap;display:flex}.learn-session .learn-session-references>.learn-text-button{font-size:var(--bf-fs-14)}.learn-session-panel{width:min(680px,100% - 32px);max-height:calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom));border:1px solid var(--bf-line-strong);border-radius:var(--bf-radius-20);background:var(--bf-bg);color:var(--bf-title);margin:auto;padding:0;overflow:hidden}.learn-session-panel[open]{grid-template-rows:auto minmax(0,1fr);display:grid}.learn-session-panel::backdrop{background:color-mix(in srgb, var(--bf-ink) 50.2%, transparent)}.learn-session-panel-heading{align-items:flex-start;gap:var(--bf-space-3);padding:var(--bf-space-3) var(--bf-space-4);border-bottom:1px solid var(--bf-line-strong);max-height:30dvh;display:flex;overflow:auto}.learn-session .learn-session-panel-heading h2{font-size:var(--bf-fs-18);flex:1;align-self:center;margin:0}.learn-session-panel-heading button{flex-shrink:0}.learn-session-panel-body{min-height:0;padding:var(--bf-space-4);overscroll-behavior:contain;overflow:auto}.learn-session-panel-body>a{align-items:center;display:flex}.learn-session :is(.lv2-dialogue,.learn-phrasebook){background:0 0;border:0;margin:0;padding:0}.learn-session .lv2-dialogue-prompt,.learn-session .lv2-dialogue-reply{padding:var(--bf-space-3);margin-inline:0}@media (height<=640px){.learn-session .learn-session-middle{padding-block:var(--bf-space-3)}.learn-session .lv2-object-choices label{grid-template-columns:20px 36px minmax(0,1fr);min-height:56px}.learn-session .lv2-choice-art{width:36px}}.learn-session .learn-button{box-shadow:0 4px 0 var(--bf-accent-deep);transition:transform .1s,box-shadow .1s}.learn-session .learn-button:active:not(:disabled){box-shadow:0 2px 0 var(--bf-accent-deep);transform:translateY(2px)}.learn-session .learn-button:disabled{background:var(--bf-line);border-color:var(--bf-line);box-shadow:none;opacity:1;color:var(--bf-mist)!important}.learn-session .learn-button.learn-button-secondary{background:var(--bf-surface);border:2px solid var(--bf-line-strong);box-shadow:0 4px 0 var(--bf-line-strong)}.learn-session .learn-choices label{border:2px solid var(--bf-line-strong);box-shadow:0 4px 0 var(--bf-line-strong);transition:transform .1s,box-shadow .1s,border-color .12s,background .12s}.learn-session .learn-choices label:active{box-shadow:0 2px 0 var(--bf-line-strong);transform:translateY(2px)}.learn-session .learn-choices label.is-selected{border-color:var(--bf-learn-ink);background:var(--bf-learn-soft);box-shadow:0 4px 0 var(--bf-learn-ink)}.learn-session .learn-tiles button:not(.learn-text-button){border:2px solid var(--bf-line-strong);border-radius:var(--bf-radius-12);box-shadow:0 3px 0 var(--bf-line-strong);font-weight:600;transition:transform .1s,box-shadow .1s}.learn-session .learn-tiles button:not(.learn-text-button):active:not(:disabled){box-shadow:0 1px 0 var(--bf-line-strong);transform:translateY(2px)}.learn-session .learn-sentence{border:2px dashed var(--bf-line-strong);border-radius:var(--bf-radius-14)}.learn-session .learn-exercise>.v3-task,.learn-session .learn-self-repeat>.v3-task{margin-bottom:var(--bf-space-3);justify-items:start}.learn-session .learn-feedback h2{align-items:center;gap:var(--bf-space-2h);display:flex}.learn-session .learn-feedback.is-correct{background:var(--bf-success-soft)}.learn-session .learn-feedback.is-correct h2{color:var(--bf-success)}.learn-session .learn-feedback.is-wrong{background:var(--bf-error-soft)}.learn-session .learn-feedback.is-wrong h2{color:var(--bf-error)}.learn-verdict-ico{background:var(--bf-learn-ink);width:36px;height:36px;color:var(--bf-on-accent);border-radius:50%;flex-shrink:0;place-items:center;display:grid}.learn-feedback.is-correct .learn-verdict-ico{background:var(--bf-success)}.learn-feedback.is-wrong .learn-verdict-ico{background:var(--bf-error)}.learn-session :is(.learn-start-info,.learn-practice-note){align-items:center;gap:var(--bf-space-1);display:flex}.learn-icon-text{align-items:center;gap:var(--bf-space-1h);display:inline-flex}@media (prefers-reduced-motion:reduce){.learn-session :is(.learn-button,.learn-choices label,.learn-tiles button){transition:none}.learn-session :is(.learn-button,.learn-choices label,.learn-tiles button):active{transform:none}}.learn-session .learn-session-header{gap:var(--bf-space-2);padding:calc(6px + env(safe-area-inset-top)) var(--bf-gutter) var(--bf-space-1h) max(calc(var(--bf-gutter) - 10px), env(safe-area-inset-left))}.learn-session .learn-session-exit{width:44px;height:44px;color:var(--bf-ink-soft);background:0 0;border-radius:50%;align-self:center}@media (hover:hover) and (pointer:fine){.learn-session .learn-session-exit:hover{background:var(--bf-surface-2)}}.learn-session .learn-session-heading h1{font:var(--bf-t-label);color:var(--bf-ink);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.learn-session .learn-session-heading p{font:var(--bf-t-meta);color:var(--bf-mist);margin:2px 0 0}.learn-session .learn-session-heading progress{border-radius:var(--bf-radius-pill);background:var(--bf-surface-3);width:100%;height:8px;overflow:hidden}.learn-session .learn-session-heading progress::-webkit-progress-bar{background:var(--bf-surface-3)}.learn-session .learn-session-heading progress::-webkit-progress-value{background:var(--bf-learn-ink);border-radius:var(--bf-radius-pill)}.learn-session .learn-session-heading progress::-moz-progress-bar{background:var(--bf-learn-ink)}.learn-session .learn-session-actions{background:var(--bf-bg)}.lv2-chat{align-items:flex-end;gap:var(--bf-space-2);margin:var(--bf-space-3) 0;display:flex}.lv2-chat.is-you{justify-content:flex-end}.lv2-chat-avatar{background:var(--bf-soft-strong);width:36px;height:36px;color:var(--bf-learn-ink);border-radius:50%;flex-shrink:0;place-items:center;display:grid}.lv2-chat-avatar.is-lg{width:52px;height:52px}.lv2-chat-bubble{gap:var(--bf-space-1);min-width:0;max-width:86%;padding:var(--bf-space-3) 60px var(--bf-space-3) var(--bf-space-3h);border-radius:var(--bf-radius-20) var(--bf-radius-20) var(--bf-radius-20) 4px;background:var(--bf-surface-2);color:var(--bf-ink);display:grid;position:relative}.lv2-chat.is-you .lv2-chat-bubble{border-radius:var(--bf-radius-20) var(--bf-radius-20) 4px var(--bf-radius-20);background:var(--bf-learn-ink);color:var(--bf-on-accent);animation:lv2-bubble-in var(--m-dur-3,.32s) var(--m-ease,ease-out) both}.learn-session .lv2-chat .lv2-role-label{font:var(--bf-t-micro);letter-spacing:var(--bf-track-micro);color:var(--bf-mist)}.learn-session .lv2-chat.is-you .lv2-role-label{color:color-mix(in srgb, var(--bf-on-accent) 72%, transparent)}.learn-session .lv2-chat-en{font:var(--bf-t-body-strong);font-size:var(--bf-fs-18);color:inherit;margin:0}.learn-session .lv2-chat-vi{font:var(--bf-t-sub);color:var(--bf-ink-soft);margin:0;font-weight:400}.learn-session .lv2-chat.is-you .lv2-chat-vi{color:color-mix(in srgb, var(--bf-on-accent) 80%, transparent)}.lv2-chat-bubble .learn-audio.is-compact{margin:0;position:absolute;top:8px;right:8px}.lv2-chat.is-you .learn-play-round{background:color-mix(in srgb, var(--bf-on-accent) 18%, transparent);color:var(--bf-on-accent)}.lv2-chat.is-you .learn-play-round.is-playing{background:var(--bf-on-accent);color:var(--bf-learn-ink)}.learn-session .is-roleplay>.v3-task{margin-bottom:var(--bf-space-1)}.learn-session .lv2-replies-head{margin:var(--bf-space-5) 0 var(--bf-space-1);font:var(--bf-t-micro);letter-spacing:var(--bf-track-caps);text-transform:uppercase;color:var(--bf-mist);text-align:right}.learn-session .learn-replies label{padding:var(--bf-space-3) var(--bf-space-3h);border-radius:var(--bf-radius-20) var(--bf-radius-20) 4px var(--bf-radius-20);background:var(--bf-surface);cursor:pointer;margin-left:12%;display:block;position:relative}.learn-session .learn-replies label input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.learn-session .learn-replies label>span{gap:var(--bf-space-1);display:grid}.learn-session .learn-replies label [lang=en]{font:var(--bf-t-body-strong);color:var(--bf-ink)}.learn-session .learn-replies label small{font:var(--bf-t-sub);color:var(--bf-ink-soft);font-weight:400}.learn-session .learn-replies label:focus-within{outline:3px solid var(--bf-accent);outline-offset:3px}.learn-session .learn-replies label.is-selected{background:var(--bf-soft)}.learn-session .learn-feedback.is-neutral{background:0 0;padding:0}.learn-session .learn-feedback.is-neutral>h2{font:var(--bf-t-sub);color:var(--bf-mist);margin:0 0 var(--bf-space-2);justify-content:center;font-weight:600}.learn-session .learn-feedback.is-neutral .learn-verdict-ico{width:24px;height:24px}.learn-session .learn-feedback.is-neutral .learn-verdict-ico svg{width:14px;height:14px}.learn-session .lv2-selected-reply{justify-items:end;gap:var(--bf-space-1);border-top:0;margin-top:0;padding-top:0;display:grid}.learn-session .lv2-selected-reply .lv2-chat{width:100%;margin-bottom:0}.learn-session .lv2-selected-reply .lv2-save-phrase{min-height:44px;padding:0 var(--bf-space-3);border:4px solid #0000;border-radius:var(--bf-radius-pill);background-clip:padding-box;background-color:var(--bf-surface-2);color:var(--bf-ink);border-inline-width:0;font-weight:600}.learn-session .lv2-selected-reply .lv2-save-phrase[aria-pressed=true]{background-color:var(--bf-success-soft);color:var(--bf-success)}.learn-session .lv2-chat-speed{margin:calc(var(--bf-space-2) * -1) 0 var(--bf-space-2) calc(36px + var(--bf-space-2))}.learn-session .lv2-chat-speed button{min-width:0}.learn-session .lv2-coaching{max-width:44ch;padding:var(--bf-space-2h) var(--bf-space-3h);border-radius:var(--bf-radius-sm);background:var(--bf-surface-2);font:var(--bf-t-sub);color:var(--bf-ink-soft);text-align:center;font-weight:400;margin:var(--bf-space-4) auto 0!important}.learn-start-scene{aspect-ratio:16/10;object-fit:cover;object-position:center 40%;border-radius:var(--bf-radius);background:var(--bf-surface-2);width:100%;height:auto;margin-bottom:var(--bf-space-4);display:block}.learn-session .learn-client-intro{align-items:flex-start;gap:var(--bf-space-3);margin:0 0 var(--bf-space-3);background:0 0;padding:0;display:flex}.learn-session .learn-client-intro small{font:var(--bf-t-sub);letter-spacing:0;text-transform:none;color:var(--bf-learn-ink);font-weight:600;display:block}.learn-session .learn-client-intro h2{margin:2px 0 var(--bf-space-1);font:var(--bf-t-title);letter-spacing:var(--bf-track-tight)}.learn-session .learn-client-intro p{font:var(--bf-t-callout);color:var(--bf-ink-soft);margin:0}.learn-session .learn-start-info{font:var(--bf-t-meta);color:var(--bf-mist)}.learn-session .learn-complete{text-align:center;justify-items:center;display:grid}.learn-complete-mark{width:88px;height:88px;margin-bottom:var(--bf-space-3);background:var(--bf-success);color:var(--bf-on-accent);box-shadow:0 5px 0 color-mix(in srgb, var(--bf-success) 70%, var(--bf-accent-deep));animation:bf-pop .48s var(--m-spring,ease-out) both;border-radius:50%;place-items:center;display:grid}@keyframes lv2-bubble-in{0%{opacity:0;transform:translateY(10px)scale(.97)}}@media (prefers-reduced-motion:reduce){.lv2-chat.is-you .lv2-chat-bubble,.learn-complete-mark{animation:none}}.learn-session .learn-session-references{gap:var(--bf-space-2);margin-top:var(--bf-space-6)}.learn-session .learn-session-references>.learn-text-button{min-height:44px;padding:0 var(--bf-space-3h);border-radius:var(--bf-radius-pill);background-clip:padding-box;background-color:var(--bf-surface-2);color:var(--bf-ink);font:var(--bf-t-sub);border:4px solid #0000;border-inline-width:0;align-items:center;font-weight:600;text-decoration:none;display:inline-flex}@media (hover:hover) and (pointer:fine){.learn-session .learn-session-references>.learn-text-button:hover{background-color:var(--bf-surface-3)}}.learn-session .learn-practice-note,.learn-session .lv2-library-notice{font:var(--bf-t-meta);color:var(--bf-mist);margin-top:var(--bf-space-3)!important}.learn-session .lv2-dialogue-prompt{border-radius:var(--bf-radius-20) var(--bf-radius-20) var(--bf-radius-20) 4px;background:var(--bf-surface-2)}.learn-session .lv2-dialogue-reply{border-radius:var(--bf-radius-20) var(--bf-radius-20) 4px var(--bf-radius-20);background:var(--bf-soft);margin-left:12%}
