:root {
  
  --st-gray-0: oklch(1 0 0);
  --st-gray-50: oklch(0.982 0 0);
  --st-gray-100: oklch(0.967 0.003 264.5);
  --st-gray-150: oklch(0.928 0.006 264.5);
  --st-gray-200: oklch(0.922 0 0);
  --st-gray-300: oklch(0.885 0 0);
  --st-gray-350: oklch(0.845 0 0);
  --st-gray-600: oklch(0.51 0 0);
  --st-gray-800: oklch(0.321 0 0);
  --st-gray-900: oklch(0.218 0 0);

  
  --st-red-50: oklch(0.964 0.017 21.8);
  --st-red-100: oklch(0.954 0.023 20.9);
  --st-red-600: oklch(0.651 0.189 27.2);
  --st-red-700: oklch(0.556 0.189 27.2);
  --st-amber-50: oklch(0.959 0.055 91.4);
  --st-amber-100: oklch(0.964 0.052 92.9);
  --st-amber-600: oklch(0.645 0.132 83.8);
  --st-amber-700: oklch(0.544 0.113 83.8);
  --st-green-50: oklch(0.949 0.056 156.3);
  --st-green-100: oklch(0.904 0.101 157.2);
  --st-green-600: oklch(0.588 0.146 154.5);
  --st-green-700: oklch(0.492 0.122 154.9);

  
  --st-pink-600: oklch(0.591 0.2 6);
  --st-pink-700: oklch(0.521 0.2 6);
  --st-orange-600: oklch(0.577 0.139 57.4);
  --st-orange-700: oklch(0.507 0.122 57.4);
  --st-mint-500: oklch(0.706 0.124 182.6);
  --st-mint-700: oklch(0.551 0.098 182.6);
  --st-cyan-500: oklch(0.715 0.126 215.2);

  
  --st-green-25: oklch(0.979 0.022 160.2);
  --st-green-300: oklch(0.852 0.159 157.1);
  --st-red-25: oklch(0.978 0.011 24.3);
  --st-red-300: oklch(0.824 0.098 22.5);
  --st-mint-25: oklch(0.989 0.012 162.1);
  --st-mint-50: oklch(0.968 0.015 181.8);
  --st-mint-600: oklch(0.63 0.112 182.6);
  --st-mint-800: oklch(0.481 0.085 182.6);
  --st-coral-600: oklch(0.587 0.169 28);
  --st-coral-700: oklch(0.517 0.169 28);

  
  --st-cream-10: oklch(0.99 0.012 96.4);
  --st-cream-25: oklch(0.979 0.02 91.6);
  --st-cream-50: oklch(0.969 0.028 79.5);
  --st-cream-200: oklch(0.915 0.076 82.8);
  --st-gold-600: oklch(0.649 0.137 72.9);
  --st-gold-700: oklch(0.546 0.117 71.7);
  --st-rose-600: oklch(0.665 0.182 14.1);

  
  --st-text-caption: 0.75rem;
  --st-text-sm: 0.875rem;
  --st-text-body: 1rem;
  --st-text-subtitle: 1.125rem;
  --st-text-h3: 1.25rem;
  --st-text-h2: 1.5rem;
  --st-text-h1: 1.75rem;
  --st-text-display: 2.5rem;
  --st-weight-regular: 400;
  --st-weight-bold: 700;
  --st-leading-body: 1.5;
  --st-leading-heading: 1.3;

  
  --st-space-1: 4px;
  --st-space-2: 8px;
  --st-space-3: 12px;
  --st-space-4: 16px;
  --st-space-5: 20px;
  --st-space-6: 24px;
  --st-space-8: 32px;
  --st-space-10: 40px;
  --st-space-12: 48px;
  --st-space-16: 64px;
  --st-radius-xs: 4px;
  --st-radius-sm: 6px;
  --st-radius-md: 8px;
  --st-radius-lg: 10px;
  --st-radius-xl: 16px;
  --st-radius-2xl: 20px;
  --st-radius-full: 999px;
  
  --st-size-control-md: 2.5rem;
  --st-size-control-lg: 3rem;
  --st-size-icon-button: 40px;
  --st-size-icon-button-touch: 48px;
  --st-size-header: 64px;
  --st-size-page-max: 1200px;

  --st-font-sans: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', sans-serif;

  
  --st-color-bg: var(--st-gray-0);
  --st-color-surface: var(--st-gray-0);
  --st-color-fill-subtle: var(--st-gray-50);
  --st-color-fill-muted: var(--st-gray-100);
  --st-color-hover: var(--st-gray-100);
  --st-color-text: var(--st-gray-900);
  --st-color-text-soft: var(--st-gray-800);
  --st-color-text-sub: var(--st-gray-600);
  --st-color-text-disabled: var(--st-gray-350);
  --st-color-line: var(--st-gray-200);
  --st-color-line-strong: var(--st-gray-350);
  --st-color-dot: var(--st-gray-300);
  --st-color-divider: oklch(0 0 0 / 7%);
  --st-color-on-fill: var(--st-gray-0);

  
  --st-color-brand: var(--st-mint-500);
  --st-color-select: var(--st-mint-700);
  --st-color-selected-day: var(--st-gray-900);
  --st-color-start: var(--st-pink-600);
  --st-color-start-edge: var(--st-pink-700);
  --st-color-resume: var(--st-orange-600);
  --st-color-resume-edge: var(--st-orange-700);
  --st-color-action: var(--st-mint-700);
  --st-color-action-line: var(--st-mint-500);
  --st-color-chat: var(--st-cyan-500);

  
  --st-color-todo-line: var(--st-red-50);
  --st-color-todo-band: var(--st-red-100);
  --st-color-todo-graphic: var(--st-red-600);
  --st-color-todo-text: var(--st-red-700);
  --st-color-todo-fill: var(--st-red-700);
  --st-color-doing-line: var(--st-amber-50);
  --st-color-doing-band: var(--st-amber-100);
  --st-color-doing-graphic: var(--st-amber-600);
  --st-color-doing-text: var(--st-amber-700);
  --st-color-doing-fill: var(--st-amber-700);
  --st-color-done-line: var(--st-green-50);
  --st-color-done-band: var(--st-green-100);
  --st-color-done-graphic: var(--st-green-600);
  --st-color-done-text: var(--st-green-700);
  --st-color-done-fill: var(--st-green-700);

  
  --st-color-progress-bg: var(--st-cream-50);
  --st-color-progress-line: var(--st-cream-200);
  --st-color-progress-label: var(--st-gold-700);
  --st-color-progress-count: var(--st-gold-600);
  --st-color-progress-track: var(--st-gray-150);
  --st-color-progress-zero: var(--st-rose-600);
  --st-color-progress-partial: var(--st-gold-600);
  --st-color-progress-complete: var(--st-green-600);

  
  --st-color-count-correct-bg: var(--st-green-25);
  --st-color-count-correct: var(--st-green-700);
  --st-color-count-wrong-bg: var(--st-red-25);
  --st-color-count-wrong: var(--st-red-700);
  --st-color-bar: var(--st-mint-600);
  --st-color-bar-track: var(--st-gray-100);
  --st-color-choice-line: var(--st-gray-300);
  --st-color-choice-edge: var(--st-gray-200);
  --st-color-flash-correct: var(--st-green-300);
  --st-color-flash-wrong: var(--st-red-300);
  --st-color-input-bg: var(--st-mint-25);
  --st-color-input-line: var(--st-mint-600);
  --st-color-action-edge: var(--st-mint-800);

  
  --st-color-score-glow: var(--st-mint-50);
  --st-color-completed-bg: var(--st-green-25);
  --st-color-completed-mark: var(--st-green-600);
  --st-color-completed-text: var(--st-green-700);
  --st-color-incorrect-bg: var(--st-red-25);
  --st-color-incorrect-mark: var(--st-red-600);
  --st-color-incorrect-text: var(--st-red-700);
  --st-color-retry: var(--st-coral-600);
  --st-color-retry-edge: var(--st-coral-700);
  --st-color-finish-top: var(--st-cream-25);
  --st-color-finish-bottom: var(--st-cream-10);

  
  --st-color-tag-word-bg: oklch(0.949 0.028 351.9);
  --st-color-tag-word-fg: oklch(0.556 0.223 3.9);
  --st-color-tag-sentence-bg: oklch(0.957 0.021 254.9);
  --st-color-tag-sentence-fg: oklch(0.549 0.236 260.9);
  --st-color-tag-question-bg: oklch(0.967 0.057 96.4);
  --st-color-tag-question-fg: oklch(0.552 0.133 57.4);
  --st-color-tag-speaking-bg: oklch(0.96 0.027 160.9);
  --st-color-tag-speaking-fg: oklch(0.524 0.13 154.7);
  --st-color-tag-writing-bg: oklch(0.948 0.032 311.7);
  --st-color-tag-writing-fg: oklch(0.56 0.262 307.3);
  --st-color-tag-content-bg: oklch(0.936 0.023 75.9);
  --st-color-tag-content-fg: oklch(0.47 0.05 70.6);

  
  --st-focus-ring: 2px solid var(--st-color-select);
}

._label_1coyg_5 {
  text-box: trim-both cap alphabetic;
}

._icon_bh0z5_3 {
  display: block;
  flex: none;
}

._icon_bh0z5_3 > svg {
  display: block;
  width: 100%;
  height: 100%;
}

._modal_1kah8_3 {
  position: fixed;
  inset: 0;
  display: flex;
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  margin: 0;
  padding: 0;
  overflow: auto;
  border: 0;
  background: transparent;
  color: inherit;
}

._modal_1kah8_3:focus {
  outline: none;
}

._modal_1kah8_3::backdrop {
  background: rgba(0, 0, 0, var(--modal-dim, 0.3));
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/assets/inter-latin-400-normal-C38fXH4l.woff2) format('woff2'), url(/assets/inter-latin-400-normal-CyCys3Eg.woff) format('woff');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(/assets/inter-latin-500-normal-Cerq10X2.woff2) format('woff2'), url(/assets/inter-latin-500-normal-BL9OpVg8.woff) format('woff');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/assets/inter-latin-600-normal-LgqL8muc.woff2) format('woff2'), url(/assets/inter-latin-600-normal-CiBQ2DWP.woff) format('woff');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(/assets/inter-latin-700-normal-Yt3aPRUw.woff2) format('woff2'), url(/assets/inter-latin-700-normal-BLAVimhd.woff) format('woff');
}

:root {
  --oh-font-sans: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', sans-serif;

  
  --oh-column-width: 30rem;
  --oh-space-page: 16px;
  --oh-header-height: 3.75rem;
  --oh-tabbar-height: 3.75rem;
  --oh-radius-card: 12px;
  --oh-radius-button: 12px;
  --oh-radius-control: 9px;
  --oh-radius-tag: 5px;
  --oh-radius-sheet: 20px;
  --oh-radius-cta: 16px;

  
  --oh-color-bg: #ffffff;
  --oh-color-backdrop: #f2f2f4;
  --oh-color-surface-muted: #f8f8f8;
  --oh-color-row-hover: var(--oh-color-surface-muted);
  --oh-color-line: #e0e0e0;
  --oh-color-border: var(--oh-color-line);
  --oh-color-border-strong: #bdbdbd;
  --oh-color-border-button: var(--oh-color-line);
  --oh-color-shadow-nav: rgb(0 0 0 / 0.12);
  
  --oh-color-scrim: rgb(15 29 37 / 0.55);
  --oh-color-scrim-plain: rgb(0 0 0 / 0.54);

  
  --oh-color-text: #1d1f23;
  --oh-color-text-strong: #121212;
  --oh-color-text-body: #2f2f2f;
  --oh-color-text-muted: #757575;
  --oh-color-text-faint: #949494;
  --oh-color-text-disabled: #c9c9c9;
  --oh-color-text-inverse: #ffffff;
  --oh-color-icon: #1a1a1a;
  --oh-color-icon-nav: #4d4d4d;
  --oh-color-dot-muted: var(--oh-color-border-strong);
  --oh-color-focus: var(--oh-color-brand-deep);

  
  --oh-color-brand: #11b09a;
  --oh-color-brand-pressed: #0f9c8b;
  --oh-color-brand-deep: #13856c;
  --oh-color-brand-glow: #c4fff9;
  --oh-color-brand-outline: var(--oh-color-brand-outline-text);
  --oh-color-brand-outline-text: #2e947f;
  --oh-color-brand-outline-soft: #5a9591;
  --oh-color-nav-selected: var(--oh-color-brand);
  --oh-color-nav-icon: var(--oh-color-text-muted);
  --oh-color-nav-label: var(--oh-color-text-muted);
  --oh-color-today-marker: var(--oh-color-icon);

  
  --oh-color-danger: #fe5047;

  
  --oh-state-not-started-band: #fee6e4;
  --oh-state-not-started-card-border: #f1edec;
  --oh-state-not-started-face: var(--oh-state-not-started-band);
  --oh-state-not-started-face-border: #f1ced2;
  --oh-state-not-started-ledge: #fcd2d3;
  --oh-state-not-started-pressed-from: #ffa89e;
  --oh-state-not-started-pressed-to: #ffdad4;
  --oh-state-not-started-pressed-border: #f0a19c;
  --oh-state-not-started-dot: #f46760;
  --oh-state-in-progress-band: #fef2cc;
  --oh-state-in-progress-card-border: #faf0bd;
  --oh-state-in-progress-face: #fdf7c3;
  --oh-state-in-progress-face-border: #f6e7b0;
  --oh-state-in-progress-ledge: #fde5b5;
  --oh-state-in-progress-pressed-from: #fccd7f;
  --oh-state-in-progress-pressed-to: #ffeeba;
  --oh-state-in-progress-pressed-border: #edbc77;
  --oh-state-in-progress-dot: #f9ba21;
  --oh-state-done-band: #9bf2bd;
  --oh-state-done-card-border: #d4f3e1;
  --oh-state-done-face: #e9fdf1;
  --oh-state-done-face-border: #c9ebdb;
  --oh-state-done-ledge: var(--oh-state-done-face-border);
  --oh-state-done-pressed-from: #82d2ad;
  --oh-state-done-pressed-to: var(--oh-state-done-card-border);
  --oh-state-done-pressed-border: var(--oh-state-done-pressed-from);
  --oh-state-done-dot: #11ae60;
  --oh-date-face: #ffffff;
  --oh-date-face-border: var(--oh-color-line);
  --oh-date-ledge: var(--oh-color-text-disabled);
  --oh-date-text: var(--oh-color-text-body);
  --oh-date-text-marked: var(--oh-card-title);

  
  --oh-activity-dot-not-started: var(--oh-color-danger);
  --oh-activity-dot-in-progress: var(--oh-state-in-progress-dot);
  --oh-activity-dot-completed: #048d49;
  --oh-badge-low: var(--oh-activity-dot-not-started);
  --oh-badge-mid: #ff8000;
  --oh-badge-full: var(--oh-state-done-dot);
  --oh-color-done-check: var(--oh-color-brand-deep);

  
  --oh-pill-time-bg: #f1f5f6;
  --oh-pill-time-label: #60676f;
  --oh-pill-time-value: var(--oh-color-text);
  --oh-pill-rate-zero-bg: #ffe6ea;
  --oh-pill-rate-zero-border: #e4c6c8;
  --oh-pill-rate-zero-label: #b67c83;
  --oh-pill-rate-zero-value: #93323e;
  --oh-pill-rate-partial-bg: var(--oh-state-in-progress-band);
  --oh-pill-rate-partial-border: var(--oh-state-in-progress-face-border);
  --oh-pill-rate-partial-label: #8a6d2b;
  --oh-pill-rate-partial-value: #7a4a06;
  --oh-pill-rate-complete-bg: #e5f3e4;
  --oh-pill-rate-complete-border: #c9e0cc;
  --oh-pill-rate-complete-label: #4c6955;
  --oh-pill-rate-complete-value: #0a541f;

  
  --oh-button-start: #ff507f;
  --oh-button-start-ledge: #d9476e;
  --oh-button-start-glow: rgb(255 80 127 / 0.28);
  --oh-button-resume: #ff7f1a;
  --oh-button-resume-ledge: #dc6d16;
  --oh-button-resume-glow: rgb(255 127 26 / 0.28);
  --oh-button-resume-percent: #cc6916;
  --oh-button-resume-track: #f0d1ad;
  --oh-card-title: #231c19;

  
  --oh-button-cta-shine: rgb(255 255 255 / 0.18);
  --oh-button-cta-brand-glow: rgb(17 176 154 / 0.4);
  --oh-button-danger: var(--oh-color-danger);
  --oh-button-danger-pressed: #f64e43;
  --oh-button-danger-ledge: #df483f;
  --oh-button-danger-glow: rgb(254 80 71 / 0.36);

  
  --oh-loading-cube-face: #02e2c7;
  --oh-loading-cube-edge: #01a18c;
  --oh-loading-tile: #16c8d4;

  
  --oh-area-content-bg: #f2e6d6;
  --oh-area-content-text: #50412e;
  --oh-area-word-bg: #ffe5ee;
  --oh-area-word-text: #b7436b;
  --oh-area-sentence-bg: #e6f1fc;
  --oh-area-sentence-text: #155bd2;
  --oh-area-speaking-bg: #e9fdf4;
  --oh-area-speaking-text: #2da56a;
  --oh-area-other-bg: var(--oh-pill-time-bg);
  --oh-area-other-text: var(--oh-pill-time-label);

  
  --oh-tree-circle: #eff9f1;
  --oh-tree-seed: #956e4a;
  --oh-tree-seed-shine: #c9a57c;
  --oh-tree-leaf: #2e8943;
  --oh-tree-leaf-light: #58b872;
  --oh-tree-trunk: #7a5a44;
  --oh-tree-fruit: #f08a2e;
  --oh-tree-caption: #2b6936;
  --oh-tree-help: #63806d;

  
  --oh-logo-text: #000000;
  --oh-logo-photo: #f6d258;

  
  
  --oh-color-brand-ink: #125a50;
  
  --oh-celebration-bg: #2b2b2b;
  --oh-celebration-art: #858279;
  --oh-celebration-text: #c6c6c6;
  
  --oh-confetti-white: #ededed;
  --oh-confetti-gold-light: #c0a585;
  --oh-confetti-gold: #ae8c66;
  --oh-confetti-gold-deep: #94724c;
  --oh-confetti-gold-dark: #795c3a;
  
  --oh-complete-bg-top: #fdf5e0;
  --oh-complete-bg-bottom: #fefaef;
  --oh-complete-dot: #dae3db;
  --oh-complete-caption: #716751;
  --oh-complete-icon: #babbb5;
  --oh-complete-card-shadow: rgb(120 90 20 / 0.06);
  --oh-complete-button-shadow: rgb(60 60 40 / 0.1);
  
  --oh-button-outline-brand-border: #58b9a8;
  --oh-button-outline-brand-glow: rgb(196 255 249 / 0.7);
  
  --oh-report-card-shadow: rgb(0 0 0 / 0.07);
  --oh-report-word-title: #c01550;
  --oh-report-sentence-title: #0649bd;
  --oh-report-speaking-title: #0c874f;
  --oh-report-word-bar: var(--oh-result-chip-word);
  --oh-report-sentence-bar: #035cff;
  --oh-report-bar-shadow: rgb(0 0 0 / 0.3);
  --oh-report-content-fill: #e6cfb0;
  --oh-report-word-fill: #ffcade;
  --oh-report-sentence-fill: #acd1fe;
  
  --oh-report-number: #108d78;
  --oh-report-weak-bg: var(--oh-state-not-started-band);
  
  --oh-report-audio-bg: #c0c0c0;
  --oh-report-audio-mark: #868686;
  --oh-report-card-selected: #fffdf0;
  --oh-report-fail-veil: rgb(255 255 255 / 0.86);

  
  
  --oh-correct-surface: var(--oh-state-done-face);
  --oh-correct-text: var(--oh-area-speaking-text);
  --oh-wrong-surface: #fdf1ee;
  --oh-wrong-text: #e2554d;
  
  --oh-color-text-sub: var(--oh-color-icon-nav);
  --oh-color-surface-track: #f0f0f0;
  --oh-color-line-soft: #ececec;
  
  --oh-study-fill-glow: var(--oh-color-brand-glow);
  --oh-study-gear-muted: #a9a9a9;
  --oh-study-gear-border: var(--oh-color-line);
  --oh-study-gear-border-muted: var(--oh-color-surface-muted);
  
  --oh-choice-ledge: var(--oh-color-line);
  --oh-quiz-band-correct: #5fe5a4;
  --oh-quiz-band-wrong: #f8999f;
  
  --oh-verdict-correct-mark: var(--oh-state-done-dot);
  --oh-verdict-correct-glow: #c9f7dd;
  --oh-verdict-correct-text: #108048;
  --oh-verdict-wrong-mark: var(--oh-color-danger);
  --oh-verdict-wrong-text: #a82828;
  --oh-picked-label: #7d2827;
  --oh-picked-word: #bb2320;
  --oh-sheet-text-sub: #3a3f46;
  --oh-sheet-text-note: #525861;
  --oh-button-next-waiting: #c3d1de;
  
  --oh-leave-art: #ecf6f1;
  --oh-button-outline-pressed: var(--oh-color-surface-muted);
  --oh-button-outline-glow: rgb(226 85 77 / 0.2);
  
  --oh-result-chip-word: #fa367e;
  --oh-result-chip-sentence: #337efd;
  --oh-result-glow: #d0f5f2;
  --oh-chip-edge: rgb(0 0 0 / 0.1);
  --oh-color-veil: rgb(255 255 255 / 0.67);
  --oh-result-dot: var(--oh-color-text-faint);
  --oh-result-dot-light: var(--oh-color-text-disabled);

  
  
  --oh-watch-stage: #000000;
  --oh-watch-picture: #7b7e8b;
  --oh-watch-mark-disc: rgb(0 0 0 / 0.7);
  --oh-watch-picture-dim: rgb(0 0 0 / 0.6);
  
  --oh-watch-step-bg: #423225;
  --oh-watch-step-text: #c3a78f;
  
  --oh-watch-list-bg: #0c0c0c;
  --oh-watch-row-current-bg: #161616;
  --oh-watch-line: rgb(255 255 255 / 0.03);
  --oh-watch-list-edge: #1b1b1b;
  --oh-watch-text-soft: #e5e5e5;
  --oh-watch-english-next: #747474;
  --oh-watch-korean-next: #666666;
  --oh-watch-english-past: #4a4a4a;
  --oh-watch-korean-past: #404040;
  
  --oh-watch-controls-floor: #020202;
  --oh-watch-track: rgb(255 255 255 / 0.2);
  --oh-watch-progress: #b8966e;
  --oh-watch-progress-rest: #151310;
  --oh-watch-settings-bg: #1d1d1d;
  
  --oh-watch-done-bg: #9e794f;

  
  
  --oh-dubbing-dim: rgb(0 0 0 / 0.82);
  --oh-dubbing-alert-dim: rgb(0 0 0 / 0.34);
  
  --oh-dubbing-video: var(--oh-watch-picture);
  --oh-dubbing-video-blank: var(--oh-watch-stage);
  --oh-dubbing-video-mark: var(--oh-color-text-inverse);
  --oh-dubbing-video-mark-disc: rgb(0 0 0 / 0.2);
  --oh-dubbing-video-dot: var(--oh-color-brand);
  
  --oh-dubbing-counter: #868686;
  --oh-dubbing-rest-translation: #b2b2b2;
  --oh-dubbing-card-shadow: rgb(0 0 0 / 0.1);
  --oh-dubbing-list-fade: var(--oh-color-backdrop);
  
  --oh-score-good: #0e9e5b;
  --oh-score-fair: #eb9e10;
  --oh-score-poor: #da3839;
  
  --oh-dubbing-speak-bar: #25c4b1;
  
  --oh-dubbing-strip-bg: var(--oh-pill-time-bg);
  --oh-dubbing-strip-text: var(--oh-pill-time-label);
  --oh-dubbing-prep-track: #e5e8f2;
  --oh-dubbing-prep-arc: #5b60d8;
  --oh-dubbing-wave: #bcc1e8;
  --oh-dubbing-rec-dot: #ff3535;
  
  --oh-dubbing-button-held: #019682;
  --oh-dubbing-button-shine: rgb(255 255 255 / 0.3);
  --oh-dubbing-button-shade: rgb(0 0 0 / 0.14);
  --oh-dubbing-preparing: #7bd7cc;
  --oh-dubbing-record-locked: #fca19c;
  --oh-dubbing-guide-text: #a1a1a1;
  --oh-dubbing-control-pressed: #ebebeb;
  --oh-dubbing-submit-to: #0176bc;
  
  --oh-dubbing-veil: rgb(255 255 255 / 0.67);
  
  --oh-ai-blue: #3690f8;
  --oh-ai-violet: #8222dc;
  --oh-ai-star-soft-from: #c5d5ee;
  --oh-ai-star-soft-to: #dbbce6;
  
  --oh-dubbing-tutor-shadow: rgb(0 0 0 / 0.12);
  --oh-dubbing-replay-bg: #e4fefb;
  --oh-dubbing-replay-border: #c1e8e3;
  
  --oh-dubbing-mode-edge: var(--oh-color-text-muted);
  --oh-dubbing-mode-close: #4c9fe1;
  --oh-dubbing-mode-option: #f5fbf9;
  --oh-dubbing-mode-option-border: #dbeae7;
  --oh-dubbing-mode-option-pressed: #e4f7f5;
  
  --oh-dubbing-camera-border: #eaeaea;
  --oh-dubbing-camera-bg: #12110f;

  
  
  --oh-grammar-art: #dbedf3;
  --oh-grammar-start-end: #0099f7;
  --oh-grammar-start-shine: rgb(255 255 255 / 0.3);
  --oh-grammar-start-shade: rgb(0 0 0 / 0.14);
  
  --oh-grammar-video-frame: var(--oh-watch-stage);
  --oh-grammar-video: var(--oh-watch-picture);
  --oh-grammar-video-mark: var(--oh-dubbing-video-mark);
  --oh-grammar-video-mark-disc: var(--oh-dubbing-video-mark-disc);
  
  --oh-grammar-blank-active: var(--oh-state-done-face);
  --oh-grammar-blank-active-border: #2c9b8b;
  --oh-grammar-blank-active-glow: var(--oh-color-brand-glow);
  
  --oh-grammar-choice-shade: #efefef;
  --oh-grammar-band-correct: var(--oh-state-done-band);
  --oh-grammar-band-wrong: var(--oh-quiz-band-wrong);
  
  --oh-grammar-chip-correct: var(--oh-correct-surface);
  --oh-grammar-chip-correct-border: var(--oh-state-done-face-border);
  --oh-grammar-chip-correct-text: #0f6a5a;
  --oh-grammar-chip-wrong: var(--oh-wrong-surface);
  --oh-grammar-chip-wrong-border: #ecd0cd;
  --oh-grammar-chip-wrong-text: var(--oh-picked-word);
  --oh-grammar-chip-skipped: var(--oh-pill-time-bg);
  --oh-grammar-chip-skipped-border: var(--oh-color-line-soft);
  --oh-grammar-chip-skipped-text: #7d8793;
  
  --oh-grammar-mint: var(--oh-dubbing-replay-bg);
  --oh-grammar-mint-text: var(--oh-color-brand-ink);
  --oh-grammar-caption: var(--oh-verdict-correct-text);
  
  --oh-grammar-role-subject: #c52660;
  --oh-grammar-role-verb: var(--oh-area-sentence-text);
  --oh-grammar-role-object: var(--oh-color-brand-ink);
  --oh-grammar-role-indirect-object: #8d2bd8;
  --oh-grammar-role-auxiliary: #5042b3;
  --oh-grammar-role-complement: #663520;
  --oh-grammar-role-other: #424242;
  
  --oh-grammar-note-dot: var(--oh-color-danger);
  --oh-grammar-note-title: var(--oh-wrong-text);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  background: var(--oh-color-bg);
}

html[data-layout='desktop'],
html[data-layout='desktop'] body {
  background: var(--oh-color-backdrop);
}

body {
  font-family: var(--oh-font-sans);
  font-size: 1rem;
  line-height: 1.5;
  color: var(--oh-color-text);
  word-break: keep-all;
  overflow-wrap: break-word;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  -webkit-text-size-adjust: 100%;
}

h1,
h2,
h3,
h4,
p,
ul,
ol {
  margin: 0;
}

ul,
ol {
  padding: 0;
  list-style: none;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
textarea,
select {
  font: inherit;
  letter-spacing: inherit;
  color: inherit;
}

button {
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  text-align: inherit;
  cursor: pointer;
}

html {
  touch-action: manipulation;
}

:focus {
  outline: none;
}

:focus-visible {
  outline: 2px solid var(--oh-color-focus);
  outline-offset: 2px;
}

#main:focus {
  outline: none;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

._media_17fv6_3 {
  display: block;
  flex: none;
  background: var(--media-color);
}

dialog._layer_zn24s_5::backdrop {
  background: var(--oh-color-scrim);
}

dialog._layer_zn24s_5._plain_zn24s_9::backdrop {
  background: var(--oh-color-scrim-plain);
}

._stage_zn24s_13 {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
  min-height: 100%;
}

._sheet_zn24s_23 {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-height: 100dvh;
  padding-bottom: env(safe-area-inset-bottom);
  border-radius: var(--oh-radius-sheet) var(--oh-radius-sheet) 0 0;
  background: var(--oh-color-bg);
  animation: _rise_zn24s_1 200ms ease-out;
}

html[data-layout='desktop'] ._sheet_zn24s_23 {
  max-width: var(--oh-column-width);
}

@keyframes _rise_zn24s_1 {
  from {
    translate: 0 100%;
  }
}

._button_1exam_5 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 100%;
  min-height: 3.84375rem;
  margin-bottom: 3px;
  padding: 0 12px 3px;
  border-radius: var(--oh-radius-cta);
  background: var(--ledge-face);
  box-shadow:
    inset 0 1px 0 var(--oh-button-cta-shine),
    0 3px 0 var(--ledge-edge),
    0 8px 12px var(--ledge-glow);
  color: var(--oh-color-text-inverse);
  font-size: 1.25rem;
  font-weight: 700;
  white-space: nowrap;
}

._button_1exam_5[data-tone='brand'] {
  --ledge-face: var(--oh-color-brand);
  --ledge-face-pressed: var(--oh-color-brand-pressed);
  --ledge-edge: var(--oh-color-brand-pressed);
  --ledge-glow: var(--oh-button-cta-brand-glow);
}

._button_1exam_5[data-tone='danger'] {
  --ledge-face: var(--oh-button-danger);
  --ledge-face-pressed: var(--oh-button-danger-pressed);
  --ledge-edge: var(--oh-button-danger-ledge);
  --ledge-glow: var(--oh-button-danger-glow);
}

._button_1exam_5:active {
  translate: 0 1px;
  background: var(--ledge-face-pressed);
  box-shadow: 0 7px 12px var(--ledge-glow);
}

._button_1exam_5:disabled {
  cursor: default;
}

._screen_6bjrw_8 {
  position: relative;
  min-height: 100dvh;
  background: var(--oh-color-bg);
}

html[data-layout='desktop'] ._screen_6bjrw_8 {
  max-width: var(--oh-column-width);
  margin: 0 auto;
}

._screen_6bjrw_8 > ._cubeBox_6bjrw_19 {
  position: absolute;
  top: 51%;
  left: calc(50% - 34px);
  translate: -50% -50%;
}

._screen_6bjrw_8 > ._ring_6bjrw_26 {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -18px 0 0 -18px;
}

._cubeBox_6bjrw_19 {
  position: relative;
  display: block;
  width: 132px;
  height: 132px;
}

._world_6bjrw_40,
._mover_6bjrw_41,
._cube_6bjrw_19 {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  transform-style: preserve-3d;
}

._world_6bjrw_40 {
  top: 74px;
  left: 65px;
  transform: rotateX(54.7356deg) rotateZ(45deg);
}

._mover_6bjrw_41 {
  animation: _cube-step_6bjrw_1 666ms steps(1, end) infinite;
}

._cube_6bjrw_19 {
  transform-origin: 0 0 0;
  animation: _cube-roll_6bjrw_1 666ms ease-in-out infinite;
}

._face_6bjrw_65,
._tileNear_6bjrw_66,
._tileFar_6bjrw_67 {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 45px;
  height: 45px;
}

._face_6bjrw_65 {
  transform-origin: 0 0 0;
  border: 3px solid var(--oh-loading-cube-edge);
  background: var(--oh-loading-cube-face);
}

._face_6bjrw_65[data-side='top'] {
  transform: translateZ(45px);
}

._face_6bjrw_65[data-side='left'] {
  transform: translateY(45px) rotateX(90deg);
}

._face_6bjrw_65[data-side='right'] {
  transform: translateX(45px) rotateY(-90deg);
}

._face_6bjrw_65[data-side='back-left'] {
  transform: rotateY(-90deg);
}

._face_6bjrw_65[data-side='back-right'] {
  transform: rotateX(90deg);
}

._tileNear_6bjrw_66,
._tileFar_6bjrw_67 {
  background: var(--oh-loading-tile);
}

._tileFar_6bjrw_67 {
  animation: _tile-fade_6bjrw_1 666ms linear infinite;
}

@keyframes _cube-roll_6bjrw_1 {
  0% {
    transform: rotateY(0deg) rotateX(0deg);
  }

  35%,
  49.99% {
    transform: rotateY(-90deg) rotateX(0deg);
  }

  50% {
    transform: rotateY(0deg) rotateX(0deg);
  }

  85%,
  100% {
    transform: rotateY(0deg) rotateX(90deg);
  }
}

@keyframes _cube-step_6bjrw_1 {
  0% {
    transform: translateX(0);
  }

  50% {
    transform: translateX(-45px);
  }
}

@keyframes _tile-fade_6bjrw_1 {
  0%,
  50% {
    opacity: 1;
  }

  35%,
  49.99%,
  85%,
  100% {
    opacity: 0;
  }
}

._ring_6bjrw_26 {
  display: block;
  width: 36px;
  height: 36px;
  border: 3.5px solid var(--oh-color-line);
  border-left-color: var(--oh-color-brand-pressed);
  border-radius: 50%;
  animation: _ring-turn_6bjrw_1 800ms linear infinite;
}

@keyframes _ring-turn_6bjrw_1 {
  to {
    rotate: 360deg;
  }
}

dialog._layer_niwyy_7::backdrop {
  background: var(--oh-dubbing-dim);
}

._stage_niwyy_11 {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 100%;
  padding: 16px 17px;
}

._box_niwyy_21 {
  position: relative;
  width: 100%;
  max-width: 25.375rem;
  padding: 0 23.5px 23.5px;
  border: 1px solid var(--oh-dubbing-mode-edge);
  border-radius: 1px;
  background: var(--oh-color-bg);
  text-align: center;
}

._close_niwyy_32 {
  position: absolute;
  top: 0.5px;
  right: -1.5px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  color: var(--oh-dubbing-mode-close);
}

._title_niwyy_44 {
  padding-top: 28.5px;
  color: var(--oh-color-text-strong);
  font-size: 1.094rem;
  font-weight: 700;
  line-height: 1.625rem;
}

._description_niwyy_52 {
  margin-top: 13px;
  color: var(--oh-color-text-sub);
  font-size: 0.8875rem;
  line-height: 1.25rem;
}

._options_niwyy_59 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 13px;
  margin-top: 24.5px;
}

._option_niwyy_59 {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 6.3125rem;
  border: 1px solid var(--oh-dubbing-mode-option-border);
  border-radius: 12px;
  background: var(--oh-dubbing-mode-option);
  transition:
    scale 80ms linear,
    background-color 80ms linear;
}

._option_niwyy_59:active {
  background: var(--oh-dubbing-mode-option-pressed);
  scale: 0.98;
}

._emoji_niwyy_85 {
  margin-top: 19px;
  font-size: 1.72rem;
  line-height: 2rem;
}

._label_niwyy_91 {
  margin-top: 5.5px;
  color: var(--oh-color-text-strong);
  font-size: 0.947rem;
  font-weight: 700;
  line-height: 1.375rem;
}

._layer_1fubc_7 {
  position: fixed;
  inset: 0;
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  margin: 0 auto;
  padding: 0;
  overflow: hidden;
  border: 0;
  background: transparent;
  pointer-events: none;
  container-type: inline-size;
}

html[data-layout='desktop'] ._layer_1fubc_7 {
  max-width: var(--oh-column-width);
}

._piece_1fubc_27 {
  position: absolute;
  top: 0;
  left: var(--left);
  animation: _fall_1fubc_1 var(--duration) cubic-bezier(0.08, 0.66, 0.3, 1) var(--delay) both;
}

._shape_1fubc_34 {
  display: block;
  width: 10px;
  height: 10px;
  background: var(--oh-confetti-white);
  animation: _tumble_1fubc_1 var(--duration) linear var(--delay) both;
}

._shape_1fubc_34[data-shape='circle'] {
  width: 9px;
  height: 11px;
  border-radius: 50%;
}

._shape_1fubc_34[data-shape='bar'] {
  width: 13px;
  height: 3px;
}

._shape_1fubc_34[data-tone='gold-light'] {
  background: var(--oh-confetti-gold-light);
}

._shape_1fubc_34[data-tone='gold'] {
  background: var(--oh-confetti-gold);
}

._shape_1fubc_34[data-tone='gold-deep'] {
  background: var(--oh-confetti-gold-deep);
}

._shape_1fubc_34[data-tone='gold-dark'] {
  background: var(--oh-confetti-gold-dark);
}

@keyframes _fall_1fubc_1 {
  from {
    translate: 0 -6dvh;
  }

  to {
    translate: calc(var(--drift) * 1cqi) var(--fall);
  }
}

@keyframes _tumble_1fubc_1 {
  from {
    transform: rotate3d(var(--axis), 0turn);
    opacity: 1;
  }

  45% {
    opacity: 1;
  }

  to {
    transform: rotate3d(var(--axis), var(--turns));
    opacity: 0;
  }
}

._screen_1h8ec_6 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  min-height: 100dvh;
  padding: 0 16px 183.5px;
  overflow: hidden;
  background: var(--oh-celebration-bg);
}

html[data-layout='desktop'] ._screen_1h8ec_6 {
  max-width: var(--oh-column-width);
  margin: 0 auto;
}

._art_1h8ec_22 {
  width: 194.5px;
  height: 204px;
  margin-bottom: 53px;
  translate: -8px 0;
}

._title_1h8ec_29 {
  color: var(--oh-color-text-inverse);
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 2.625rem;
  text-align: center;
}

._body_1h8ec_37 {
  margin-top: 25px;
  color: var(--oh-celebration-text);
  font-size: 1.01rem;
  line-height: 1.5rem;
  text-align: center;
}

._body_1kpis_6 {
  display: flex;
  flex-direction: column;
  padding: 21px 20.5px 11px;
}

._title_1kpis_12 {
  color: var(--oh-color-text-strong);
  font-size: 1.152rem;
  font-weight: 700;
  line-height: 1.75rem;
  text-align: center;
}

._next_1kpis_20 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8.5px;
  min-height: 1.25rem;
  margin-top: 22px;
  white-space: nowrap;
}

._nextLabel_1kpis_30 {
  color: var(--oh-color-text-muted);
  font-size: 0.825rem;
  line-height: 1;
}

._chip_1kpis_36 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-height: 1.25rem;
  padding: 0 10px;
  border-radius: var(--oh-radius-tag);
  background: var(--oh-area-other-bg);
  color: var(--oh-area-other-text);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1;
}

._chip_1kpis_36[data-area='content'] {
  background: var(--oh-area-content-bg);
  color: var(--oh-area-content-text);
}

._chip_1kpis_36[data-area='word'] {
  background: var(--oh-area-word-bg);
  color: var(--oh-area-word-text);
}

._chip_1kpis_36[data-area='sentence'] {
  background: var(--oh-area-sentence-bg);
  color: var(--oh-area-sentence-text);
}

._chip_1kpis_36[data-area='speaking'] {
  background: var(--oh-area-speaking-bg);
  color: var(--oh-area-speaking-text);
}

._nextName_1kpis_71 {
  color: var(--oh-color-text-strong);
  font-size: 1.108rem;
  font-weight: 700;
  line-height: 1;
}

._last_1kpis_78 {
  margin-top: 12px;
  color: var(--oh-color-brand-ink);
  font-size: 0.827rem;
  line-height: 1.25rem;
  text-align: center;
}

._action_1kpis_86[data-after='next'] {
  margin-top: 19.5px;
}

._action_1kpis_86[data-after='last'] {
  margin-top: 13px;
}

._play_1kpis_95 {
  flex: none;
  margin: 0 -2.7px 0 -1px;
}

._check_1kpis_101 {
  flex: none;
  width: 17.5px;
  height: 14px;
  margin: 0 -0.5px 0 2px;
}

._page_1ku0f_8 {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100dvh;
  background: var(--oh-color-bg);
}

html[data-layout='desktop'] ._page_1ku0f_8,
html[data-layout='desktop'] ._failure_1ku0f_17 {
  max-width: var(--oh-column-width);
  margin: 0 auto;
}

._top_1ku0f_22 {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex: none;
  padding: 12px 21px 0 23px;
}

._back_1ku0f_31 {
  position: relative;
  display: flex;
  flex: none;
  margin-top: 5px;
  color: var(--oh-color-text-strong);
}

._back_1ku0f_31::after {
  position: absolute;
  inset: -14px -12px;
  content: '';
}

._course_1ku0f_46 {
  overflow: hidden;
  min-width: 0;
  min-height: 1.2em;
  color: var(--oh-color-text-sub);
  font-size: 0.772rem;
  line-height: 1.2;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

._main_1ku0f_58 {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  min-height: 0;
}

._heading_1ku0f_65 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex: none;
  margin-top: 18px;
  color: var(--oh-color-text-strong);
  font-size: 1.507rem;
  font-weight: 700;
  line-height: 1.2;
}

._chip_1ku0f_78 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-width: 2.3125rem;
  min-height: 1.5rem;
  margin-bottom: 2px;
  padding: 0 8px;
  border-radius: 0.75rem;
  box-shadow: inset 0 -1.5px 0 var(--oh-chip-edge);
  color: var(--oh-color-text-inverse);
  font-size: 0.76rem;
  font-weight: 600;
  line-height: 1;
}

._chip_1ku0f_78[data-tone='word'] {
  background: var(--oh-result-chip-word);
}

._chip_1ku0f_78[data-tone='sentence'] {
  background: var(--oh-result-chip-sentence);
}

._rate_1ku0f_103 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10.5px;
  flex: none;
  min-height: 4.75rem;
  margin-top: 5.5px;
  color: var(--oh-color-text-strong);
  font-size: 1.129rem;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

._rate_1ku0f_103::before {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 180px;
  height: 86px;
  background: radial-gradient(ellipse 50% 50% at 50% 50%, var(--oh-result-glow) 0%, var(--oh-result-glow) 12%, transparent 100%);
  content: '';
  translate: -50% -50%;
}

._rate_1ku0f_103 > span,
._rate_1ku0f_103 > strong {
  position: relative;
}

._rate_1ku0f_103 > strong {
  font-size: 1.61rem;
  letter-spacing: 0.02em;
}

._pills_1ku0f_141 {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 7.5px;
  flex: none;
  margin-top: 5.5px;
  padding: 0 12px;
}

._pill_1ku0f_141 {
  display: flex;
  align-items: center;
  min-height: 2.65625rem;
  padding: 0 20px 0 21px;
  border-radius: 1.36rem;
  color: var(--oh-color-text-strong);
  font-size: 0.894rem;
  line-height: 1;
  white-space: nowrap;
}

._pill_1ku0f_141 > span {
  margin-left: 5px;
}

._pill_1ku0f_141 > strong {
  margin: 2px 0 0 4px;
  font-size: 1.01rem;
}

._pill_1ku0f_141[data-kind='correct'] {
  background: var(--oh-correct-surface);
  box-shadow: 0 0 3px 0.5px var(--oh-correct-surface);
}

._pill_1ku0f_141[data-kind='correct'] > svg,
._pill_1ku0f_141[data-kind='correct'] > strong {
  color: var(--oh-correct-text);
}

._pill_1ku0f_141[data-kind='wrong'] {
  padding-right: 19px;
  background: var(--oh-wrong-surface);
  box-shadow: 0 0 3px 0.5px var(--oh-wrong-surface);
}

._pill_1ku0f_141[data-kind='wrong'] > span {
  margin-left: 7.5px;
}

._pill_1ku0f_141[data-kind='wrong'] > svg,
._pill_1ku0f_141[data-kind='wrong'] > strong {
  color: var(--oh-wrong-text);
}

._lists_1ku0f_197 {
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto;
  margin-top: 34px;
  padding: 0 20.5px 8px;
}

._section_1ku0f_205 + ._section_1ku0f_205 {
  margin-top: 32px;
}

._sectionTitle_1ku0f_209 {
  font-size: 0.825rem;
  font-weight: 700;
  line-height: 1.3;
}

._section_1ku0f_205[data-kind='correct'] ._sectionTitle_1ku0f_209,
._section_1ku0f_205[data-kind='correct'] ._lineMark_1ku0f_216 {
  color: var(--oh-correct-text);
}

._section_1ku0f_205[data-kind='wrong'] {
  color: var(--oh-wrong-text);
}

._lines_1ku0f_224 {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  row-gap: 10.2px;
  margin-top: 8px;
}

._lines_1ku0f_224[data-columns='2'] {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: 12px;
  row-gap: 20px;
}

._line_1ku0f_216 {
  display: flex;
  align-items: center;
  min-width: 0;
  font-size: 0.908rem;
  line-height: 1.3125rem;
}

._section_1ku0f_205[data-kind='correct'] ._lineText_1ku0f_245 {
  color: var(--oh-color-text-strong);
}

._lineMark_1ku0f_216 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 16.5px;
  margin-right: 6.5px;
}

._section_1ku0f_205[data-kind='wrong'] ._lineMark_1ku0f_216 {
  margin-top: 3.5px;
}

._lineText_1ku0f_245 {
  min-width: 0;
}

._footer_1ku0f_266 {
  flex: none;
  padding: 0 20.5px calc(11px + env(safe-area-inset-bottom));
}

._footer_1ku0f_266[data-kind='loading'] {
  padding: 1px 20px calc(47px + env(safe-area-inset-bottom));
}

._loadingBar_1ku0f_275 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5.5px;
  min-height: 3rem;
  border-radius: 12px;
  background: var(--oh-color-surface-track);
}

._loadingBar_1ku0f_275 > span {
  width: 7.5px;
  height: 7.5px;
  border-radius: 50%;
  background: var(--oh-result-dot);
  animation: _dot-turn_1ku0f_1 900ms linear infinite;
}

._loadingBar_1ku0f_275 > span:nth-child(2) {
  animation-delay: 300ms;
}

._loadingBar_1ku0f_275 > span:nth-child(3) {
  animation-delay: 600ms;
}

@keyframes _dot-turn_1ku0f_1 {
  0%,
  33% {
    background: var(--oh-result-dot-light);
  }

  34%,
  100% {
    background: var(--oh-result-dot);
  }
}

._notice_1ku0f_314 {
  padding-top: 12.25px;
  margin-bottom: 12.25px;
  color: var(--oh-color-text-sub);
  font-size: 0.822rem;
  line-height: 1.25rem;
  text-align: center;
}

._pin_1ku0f_323 {
  margin-right: -1px;
  font-size: 1.2em;
  line-height: 0;
  vertical-align: -0.1em;
}

._next_1ku0f_330 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 1.28125rem;
  padding-top: 4.25px;
  margin-bottom: 19.75px;
  line-height: 1;
  white-space: nowrap;
}

._nextLabel_1ku0f_342 {
  color: var(--oh-color-text-muted);
  font-size: 0.825rem;
}

._nextChip_1ku0f_347 {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 1.28125rem;
  padding: 0 10px;
  border-radius: 6px;
  background: var(--oh-area-other-bg);
  color: var(--oh-area-other-text);
  font-size: 0.76rem;
  font-weight: 700;
}

._nextChip_1ku0f_347[data-area='word'] {
  background: var(--oh-area-word-bg);
  color: var(--oh-area-word-text);
}

._nextChip_1ku0f_347[data-area='sentence'] {
  background: var(--oh-area-sentence-bg);
  color: var(--oh-area-sentence-text);
}

._nextChip_1ku0f_347[data-area='speaking'] {
  background: var(--oh-area-speaking-bg);
  color: var(--oh-area-speaking-text);
}

._nextChip_1ku0f_347[data-area='content'] {
  background: var(--oh-area-content-bg);
  color: var(--oh-area-content-text);
}

._nextName_1ku0f_380 {
  color: var(--oh-color-text-strong);
  font-size: 1.11rem;
  font-weight: 700;
}

._veil_1ku0f_386 {
  position: absolute;
  inset: 0;
  z-index: 3;
  background: var(--oh-color-veil);
}

._veilCube_1ku0f_393 {
  position: absolute;
  top: 51%;
  left: calc(50% - 34px);
  translate: -50% -50%;
}

._failure_1ku0f_17 {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: 20px;
  min-height: 100dvh;
  padding: 0 20.5px;
  background: var(--oh-color-bg);
  color: var(--oh-color-text-muted);
  font-size: 0.875rem;
  text-align: center;
}

._badge_ld92j_3 {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: none;
  gap: 9px;
}

._circle_ld92j_11 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 62px;
  height: 62px;
  border-radius: 50%;
  background: var(--oh-tree-circle);
}

._caption_ld92j_21 {
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--oh-tree-caption);
  font-size: 0.76rem;
  font-weight: 700;
  line-height: 1.316;
  white-space: nowrap;
}

._help_ld92j_32 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 16px;
  height: 16px;
  border: 1px solid var(--oh-tree-help);
  border-radius: 50%;
  color: var(--oh-tree-help);
  font-size: 0.625rem;
  font-weight: 700;
  line-height: 1;
}

._help_ld92j_32::after {
  position: absolute;
  inset: -8px;
  content: '';
}

._help_ld92j_32[aria-disabled='true'] {
  cursor: default;
}

._blank_qiyfo_8 {
  min-height: 100dvh;
  background: var(--oh-color-bg);
}

._screen_qiyfo_13 {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 100dvh;
  padding: 61px 18px 24px;
  background: linear-gradient(180deg, var(--oh-complete-bg-top), var(--oh-complete-bg-bottom));
}

html[data-layout='desktop'] ._blank_qiyfo_8,
html[data-layout='desktop'] ._screen_qiyfo_13 {
  max-width: var(--oh-column-width);
  margin: 0 auto;
}

._tree_qiyfo_28 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  background: var(--oh-tree-circle);
}

._title_qiyfo_39 {
  margin-top: 12.4px;
  color: var(--oh-color-text);
  font-size: 1.48rem;
  font-weight: 700;
  line-height: 2rem;
  text-align: center;
}

._greeting_qiyfo_48 {
  margin-top: 7.35px;
  color: var(--oh-color-text-sub);
  font-size: 0.892rem;
  line-height: 1.5rem;
  text-align: center;
}

._clap_qiyfo_57 {
  font-size: 1.11rem;
  line-height: 1;
}

._dots_qiyfo_62 {
  display: flex;
  gap: 9.8px;
  margin-top: 19px;
}

._dot_qiyfo_62 {
  width: 15.5px;
  height: 15.5px;
  border-radius: 50%;
  background: var(--oh-complete-dot);
}

._caption_qiyfo_75 {
  margin-top: 10.9px;
  color: var(--oh-complete-caption);
  font-size: 0.7675rem;
  line-height: 1.25rem;
  text-align: center;
}

._card_qiyfo_83 {
  align-self: stretch;
  margin: 19.1px 22.5px 0;
  padding: 19px 23.5px 18.65px;
  border-radius: 20px;
  background: var(--oh-color-bg);
  box-shadow: 0 1px 5px var(--oh-complete-card-shadow);
}

._cardTitle_qiyfo_92 {
  color: var(--oh-color-text-faint);
  font-size: 0.7875rem;
  font-weight: 400;
  line-height: 1.25rem;
  letter-spacing: 0.023em;
  text-align: center;
}

._latin_qiyfo_101 {
  font-weight: 700;
}

._stats_qiyfo_105 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: 15px 0 0;
}

._stat_qiyfo_105 {
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  gap: 5px;
  min-width: 0;
  padding-top: 2.75px;
}

._stat_qiyfo_105 + ._stat_qiyfo_105 {
  border-left: 1px solid var(--oh-color-line-soft);
}

._statValue_qiyfo_124 {
  display: flex;
  align-items: baseline;
  gap: 1.5px;
  margin: 0;
  color: var(--oh-color-text);
  font-size: 1.745rem;
  font-weight: 700;
  line-height: 2rem;
  white-space: nowrap;
}

._statUnit_qiyfo_136 {
  color: var(--oh-color-text-faint);
  font-size: 0.9rem;
  font-weight: 400;
}

._statLabel_qiyfo_142 {
  color: var(--oh-color-text-faint);
  font-size: 0.766rem;
  line-height: 1.25rem;
  text-align: center;
}

._rows_qiyfo_149 {
  margin-top: 16.5px;
  padding-top: 12.15px;
  border-top: 1px solid var(--oh-color-line-soft);
}

._row_qiyfo_149 {
  display: flex;
  align-items: center;
  min-height: 2.2625rem;
  animation: _rowRise_qiyfo_1 400ms linear both;
}

._row_qiyfo_149:nth-child(2) {
  animation-delay: 70ms;
}

._row_qiyfo_149:nth-child(3) {
  animation-delay: 140ms;
}

._row_qiyfo_149:nth-child(4) {
  animation-delay: 210ms;
}

._rowIcon_qiyfo_174 {
  flex: none;
  width: 16px;
  height: 16px;
  color: var(--oh-complete-icon);
}

._rowName_qiyfo_181 {
  flex: 1;
  min-width: 0;
  margin-left: 8.5px;
  color: var(--oh-color-text-sub);
  font-size: 0.818rem;
  font-weight: 500;
  line-height: 1.25rem;
}

._rowValue_qiyfo_191 {
  display: flex;
  align-items: baseline;
  flex: none;
  gap: 1px;
  color: var(--oh-color-text);
  font-size: 0.95rem;
  line-height: 1.25rem;
  white-space: nowrap;
}

._rowUnit_qiyfo_202 {
  color: var(--oh-color-text-faint);
  font-size: 0.79rem;
}

._actions_qiyfo_207 {
  display: flex;
  align-items: flex-start;
  align-self: stretch;
  gap: 10px;
  margin-top: auto;
  padding-top: 24px;
}

._listButton_qiyfo_218 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 5;
  gap: 6px;
  min-width: 0;
  min-height: 4.25rem;
  margin-top: -0.5px;
  padding-bottom: 4.5px;
  border: 1px solid var(--oh-button-outline-brand-border);
  border-radius: var(--oh-radius-cta);
  background: var(--oh-color-bg);
  box-shadow:
    inset 0 -2px 0 var(--oh-color-brand-glow),
    0 0 0 2px var(--oh-button-outline-brand-glow),
    0 6px 10px var(--oh-complete-button-shadow);
  color: var(--oh-color-text);
  font-size: 1.25rem;
  font-weight: 700;
  white-space: nowrap;
}

._listButton_qiyfo_218:active {
  translate: 0 1px;
  background: var(--oh-color-surface-muted);
}

._listIcon_qiyfo_246 {
  flex: none;
  width: 13.5px;
  height: 9.5px;
}

._reportButton_qiyfo_252 {
  flex: 7;
  min-width: 0;
}

._reportIcon_qiyfo_257 {
  flex: none;
  width: 12px;
  height: 14px;
  margin-right: -1px;
}

._failure_qiyfo_264 {
  margin-top: 40px;
  color: var(--oh-color-text-sub);
  font-size: 0.892rem;
  text-align: center;
}

@keyframes _rowRise_qiyfo_1 {
  from {
    translate: 0 7px;
    opacity: 0;
  }
}

._sheet_j855b_6 {
  align-items: center;
  padding: 50.5px 20.5px 20.5px;
  text-align: center;
}

._art_j855b_12 {
  width: 159px;
  max-width: 100%;
  height: 106.5px;
  border-radius: 8px;
}

._title_j855b_19 {
  margin-top: 45px;
  color: var(--oh-color-text-strong);
  font-size: 1.375rem;
  font-weight: 700;
  line-height: 1.3;
}

._body_j855b_27 {
  margin-top: 23px;
  color: var(--oh-color-text-strong);
  font-size: 1.131rem;
  line-height: 1.5;
}

._actions_j855b_34 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-auto-rows: minmax(4.21875rem, auto);
  gap: 11.5px;
  align-self: stretch;
  margin-top: 20px;
}

._leave_j855b_43 {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  padding: 0 12px 3px;
  border: 1.5px solid var(--oh-wrong-text);
  border-radius: var(--oh-radius-cta);
  background: var(--oh-color-bg);
  box-shadow: 0 6px 12px var(--oh-button-outline-glow);
  color: var(--oh-wrong-text);
  font-size: 1.25rem;
  font-weight: 700;
  white-space: nowrap;
}

._leave_j855b_43:active {
  background: var(--oh-button-outline-pressed);
}

._list_1netq_13 {
  height: 100%;
  padding-bottom: 76px;
  overflow-x: hidden;
  overflow-y: auto;
  overflow-anchor: none;
  overscroll-behavior: contain;
  scrollbar-width: none;
  background: var(--oh-watch-list-bg);
}

._list_1netq_13::-webkit-scrollbar {
  display: none;
}

._row_1netq_28 {
  padding: 13.8px 19.2px 12.7px 20px;
  border-bottom: 1px solid var(--oh-watch-line);
  background: var(--oh-watch-list-bg);
  transition:
    padding 120ms cubic-bezier(0, 0, 0.2, 1),
    background-color 100ms linear;
}

._row_1netq_28[data-state='current'] {
  padding-top: 14.65px;
  padding-bottom: 14.8px;
  background: var(--oh-watch-row-current-bg);
}

._english_1netq_43 {
  color: var(--oh-watch-english-next);
  font-size: 1.073rem;
  font-weight: 400;
  line-height: 1.58;
  transition:
    font-size 120ms cubic-bezier(0, 0, 0.2, 1),
    line-height 120ms cubic-bezier(0, 0, 0.2, 1),
    color 100ms linear;
}

._korean_1netq_54 {
  margin-top: 1.9px;
  color: var(--oh-watch-korean-next);
  font-size: 0.886rem;
  font-weight: 400;
  line-height: 1.4375rem;
  transition:
    font-size 120ms cubic-bezier(0, 0, 0.2, 1),
    margin-top 120ms cubic-bezier(0, 0, 0.2, 1),
    color 100ms linear;
}

._row_1netq_28[data-state='past'] ._english_1netq_43 {
  color: var(--oh-watch-english-past);
}

._row_1netq_28[data-state='past'] ._korean_1netq_54 {
  color: var(--oh-watch-korean-past);
}

._row_1netq_28[data-state='current'] ._english_1netq_43 {
  color: var(--oh-color-text-inverse);
  font-size: 1.1375rem;
  font-weight: 600;
  line-height: 1.54;
}

._row_1netq_28[data-state='current'] ._korean_1netq_54 {
  margin-top: 2.5px;
  color: var(--oh-watch-text-soft);
  font-size: 1.0125rem;
}

._screen_a1dj4_10 {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}

._header_a1dj4_19 {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  min-height: 2.75rem;
  padding: 0 14.25px 0 14px;
  pointer-events: none;
  transition:
    opacity 170ms cubic-bezier(0, 0, 0.2, 1),
    transform 170ms cubic-bezier(0, 0, 0.2, 1),
    visibility 0s;
}

._step_a1dj4_36 {
  display: flex;
  align-items: center;
  flex: none;
  height: 1.8125rem;
  padding: 0 10.5px 0.5px 10px;
  border-radius: 4px;
  background: var(--oh-watch-step-bg);
  color: var(--oh-watch-step-text);
  font-size: 0.881rem;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
}

._title_a1dj4_51 {
  flex: 1;
  min-width: 0;
  margin-left: 11.5px;
  font-size: 1.0125rem;
  font-weight: 500;
  line-height: 1.5625rem;
}

._close_a1dj4_60 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 2.75rem;
  height: 2.75rem;
  padding-top: 3px;
  pointer-events: auto;
}

._stage_a1dj4_71 {
  position: relative;
  flex: 1 1 0;
  min-height: 0;
}

._stageButton_a1dj4_77 {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  color: var(--oh-color-text-inverse);
}

._stageButton_a1dj4_77:focus-visible {
  outline-offset: -4px;
}

._picture_a1dj4_91 {
  position: absolute;
  top: 50%;
  right: 0;
  left: 0;
  max-height: 100%;
  aspect-ratio: 880 / 499;
  transform: translateY(-50%);
}

._dim_a1dj4_101 {
  position: absolute;
  inset: 0;
  background: var(--oh-watch-picture-dim);
}

._centerPlay_a1dj4_107,
._centerPause_a1dj4_108 {
  position: absolute;
  top: 50%;
  left: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translate(-50%, -50%);
}

._centerPause_a1dj4_108 {
  width: 62px;
  height: 62px;
  border-radius: 50%;
  background: var(--oh-watch-mark-disc);
}

._done_a1dj4_125 {
  position: absolute;
  top: 50%;
  left: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 10.5625rem;
  height: 3.875rem;
  border-radius: 12px;
  background: var(--oh-watch-done-bg);
  color: var(--oh-color-text-inverse);
  font-size: 1.234rem;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

._failure_a1dj4_145 {
  position: absolute;
  top: 50%;
  right: var(--oh-space-page);
  left: var(--oh-space-page);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  font-size: 1rem;
  text-align: center;
  transform: translateY(-50%);
}

._retry_a1dj4_159 {
  min-height: 2.75rem;
  padding: 0 20px;
  border-radius: var(--oh-radius-button);
  background: var(--oh-watch-settings-bg);
  font-weight: 700;
}

._subtitles_a1dj4_167 {
  position: relative;
  flex: 1 1 0;
  min-height: 0;
}

._subtitles_a1dj4_167::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1;
  height: 1px;
  background: var(--oh-watch-list-edge);
  content: '';
  pointer-events: none;
}

._controls_a1dj4_187 {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 12.5px;
  height: 3.625rem;
  padding: 0 14px 14px;
  background: linear-gradient(
    to bottom,
    transparent,
    color-mix(in srgb, var(--oh-watch-controls-floor) 40%, transparent) 15%,
    color-mix(in srgb, var(--oh-watch-controls-floor) 55%, transparent) 40%,
    color-mix(in srgb, var(--oh-watch-controls-floor) 65%, transparent) 60%,
    color-mix(in srgb, var(--oh-watch-controls-floor) 75%, transparent) 80%,
    var(--oh-watch-controls-floor) 95%
  );
  transition:
    opacity 170ms cubic-bezier(0, 0, 0.2, 1),
    transform 170ms cubic-bezier(0, 0, 0.2, 1),
    visibility 0s;
}

._screen_a1dj4_10[data-overlay-shown='false'] ._header_a1dj4_19,
._screen_a1dj4_10[data-overlay-shown='false'] ._controls_a1dj4_187 {
  visibility: hidden;
  opacity: 0;
  transition:
    opacity 170ms cubic-bezier(0, 0, 0.2, 1),
    transform 170ms cubic-bezier(0, 0, 0.2, 1),
    visibility 0s linear 170ms;
}

._screen_a1dj4_10[data-overlay-shown='false'] ._header_a1dj4_19 {
  transform: translateY(-8px);
}

._screen_a1dj4_10[data-overlay-shown='false'] ._controls_a1dj4_187 {
  transform: translateY(8px);
}

._play_a1dj4_231,
._settings_a1dj4_232 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 2.75rem;
  height: 2.75rem;
  color: var(--oh-color-text-inverse);
}

._play_a1dj4_231 {
  margin-right: -1px;
  padding-bottom: 0.5px;
}

._settings_a1dj4_232 {
  border-radius: 50%;
  background: var(--oh-watch-settings-bg);
}

._track_a1dj4_252 {
  flex: 1;
  min-width: 0;
  height: 6px;
  overflow: hidden;
  border-radius: 3px;
  background: var(--oh-watch-track);
}

._trackFill_a1dj4_261 {
  display: block;
  height: 100%;
  border-radius: 3px;
  background: var(--oh-watch-progress);
}

._time_a1dj4_268 {
  flex: none;
  padding-top: 1.5px;
  font-size: 1.022rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  letter-spacing: -0.01em;
  white-space: nowrap;
}

._progressLine_a1dj4_280 {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 5px;
  background: var(--oh-watch-progress-rest);
  opacity: 0;
  transition: opacity 170ms cubic-bezier(0, 0, 0.2, 1);
}

._screen_a1dj4_10[data-overlay-shown='false'] ._progressLine_a1dj4_280 {
  opacity: 1;
}

._progressFill_a1dj4_295 {
  display: block;
  height: 100%;
  background: var(--oh-watch-progress);
}

._page_2r39y_6 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100dvh;
  background: var(--oh-watch-stage);
  color: var(--oh-color-text-inverse);
}

html[data-layout='desktop'] ._page_2r39y_6 {
  max-width: var(--oh-column-width);
  margin: 0 auto;
}

._loading_2r39y_20 {
  color: var(--oh-watch-text-soft);
  font-size: 0.381rem;
  line-height: 1;
  text-align: center;
}

._failure_2r39y_27 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 0 var(--oh-space-page);
  font-size: 1rem;
  text-align: center;
}

._home_2r39y_37 {
  display: flex;
  align-items: center;
  min-height: 2.75rem;
  padding: 0 20px;
  border-radius: var(--oh-radius-button);
  background: var(--oh-watch-settings-bg);
  font-weight: 700;
}

._footer_sbjz2_8 {
  display: flex;
  flex: none;
  align-items: flex-start;
  gap: 10.5px;
  height: 5.53125rem;
  padding: 14px 16.5px 0;
  background: var(--oh-color-bg);
}

._main_sbjz2_18,
._preparing_sbjz2_19,
._locked_sbjz2_20,
._guide_sbjz2_21 {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 3.71875rem;
  border-radius: 16px;
  font-size: 1.175rem;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  
  padding-right: 5.5px;
}

._main_sbjz2_18[data-icon='trailing'] {
  padding: 0 0 0 6px;
}

._iconSlot_sbjz2_43 {
  flex: none;
  width: 26px;
}

._footer_sbjz2_8 > :only-child {
  margin-left: 9.5px;
}

._main_sbjz2_18 {
  --face: var(--oh-color-brand);
  --face-held: var(--oh-dubbing-button-held);

  background: var(--face);
  box-shadow:
    inset 5px 6px 7px -3px var(--oh-dubbing-button-shine),
    inset -4px -5px 6px -3px var(--oh-dubbing-button-shade),
    0 0 3px var(--oh-color-brand-glow);
  color: var(--oh-color-text-inverse);
}

._main_sbjz2_18:hover {
  background: var(--face-held);
}

._main_sbjz2_18:active {
  background: var(--face-held);
  box-shadow: 0 0 3px var(--oh-color-brand-glow);
}

._main_sbjz2_18[data-tone='danger'] {
  --face: var(--oh-color-danger);
  --face-held: var(--oh-button-danger-pressed);
}

._main_sbjz2_18[data-tone='submit'] {
  --face: linear-gradient(90deg, var(--oh-color-brand) 45%, var(--oh-dubbing-submit-to));
  --face-held: linear-gradient(90deg, var(--oh-dubbing-button-held) 45%, var(--oh-dubbing-submit-to));
}

._startIcon_sbjz2_84 {
  translate: 0 -1.5px;
}

._micIcon_sbjz2_88 {
  margin-left: 3px;
}

._preparing_sbjz2_19 {
  gap: 9px;
  background: var(--oh-dubbing-preparing);
  color: var(--oh-color-text-inverse);
}

._locked_sbjz2_20 {
  gap: 10.5px;
  background: var(--oh-dubbing-record-locked);
  box-shadow:
    inset 5px 6px 7px -3px var(--oh-dubbing-button-shine),
    inset -4px -5px 6px -3px var(--oh-dubbing-button-shade);
  color: var(--oh-color-text-inverse);
}

._guide_sbjz2_21 {
  gap: 9px;
  background: var(--oh-color-surface-muted);
  color: var(--oh-dubbing-guide-text);
}

._emoji_sbjz2_114 {
  font-size: 1.67rem;
  line-height: 1;
}

._emoji_sbjz2_114[data-faded='true'] {
  opacity: 0.7;
}

._square_sbjz2_123 {
  flex: none;
  width: 26px;
  height: 26px;
  border-radius: 5.5px;
  background: var(--oh-color-text-inverse);
}

._retry_sbjz2_131 {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 3.6875rem;
  height: 3.71875rem;
  border: 1px solid var(--oh-color-border-strong);
  border-radius: 17px;
  padding-top: 1.5px;
  background: var(--oh-color-bg);
  color: var(--oh-color-icon);
}

._retry_sbjz2_131:active {
  background: var(--oh-dubbing-control-pressed);
}

dialog._layer_1uv1b_6::backdrop {
  background: var(--oh-dubbing-alert-dim);
}

._stage_1uv1b_10 {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 100%;
  padding: 16px 32px;
}

._box_1uv1b_20 {
  width: 100%;
  max-width: 23.5rem;
  overflow: hidden;
  border-radius: 16px;
  background: var(--oh-color-bg);
  text-align: center;
}

._title_1uv1b_29 {
  padding: 21px 12px 0;
  color: var(--oh-color-text-strong);
  font-size: 1.253rem;
  font-weight: 700;
  line-height: 1.75rem;
}

._body_1uv1b_37 {
  padding: 6px 20px 19px;
  color: var(--oh-color-text-sub);
  font-size: 1.014rem;
  line-height: 1.5rem;
  word-break: normal;
}

._actions_1uv1b_45 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 1px solid var(--oh-color-line);
}

._reload_1uv1b_51,
._confirm_1uv1b_52 {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3.15625rem;
  font-size: 1.12rem;
}

._reload_1uv1b_51 {
  border-right: 1px solid var(--oh-color-line);
  color: var(--oh-color-brand-pressed);
  font-weight: 700;
}

._confirm_1uv1b_52 {
  color: var(--oh-color-text-muted);
}

._reload_1uv1b_51:active,
._confirm_1uv1b_52:active {
  background: var(--oh-color-surface-muted);
}

._strip_1eux4_7 {
  display: flex;
  align-items: center;
  justify-content: center;
  
  padding: 3px 3px 0 0;
  background: var(--oh-dubbing-strip-bg);
  color: var(--oh-dubbing-strip-text);
  white-space: nowrap;
}

._strip_1eux4_7[data-kind='preparing'] {
  height: 2.1875rem;
}

._strip_1eux4_7[data-kind='recording'] {
  height: 3.03125rem;
}

._spinner_1eux4_26 {
  flex: none;
  width: 15px;
  height: 15px;
  margin-right: 7px;
  border: 2.5px solid var(--oh-dubbing-prep-track);
  border-top-color: var(--oh-dubbing-prep-arc);
  border-radius: 50%;
  animation: _spinner-turn_1eux4_1 700ms linear infinite;
}

@keyframes _spinner-turn_1eux4_1 {
  from {
    rotate: 0deg;
  }

  to {
    rotate: 360deg;
  }
}

._label_1eux4_47 {
  font-size: 0.825rem;
  font-weight: 500;
  line-height: 1;
}

._dot_1eux4_53 {
  flex: none;
  width: 10px;
  height: 10px;
  margin-right: 6.5px;
  border-radius: 50%;
  background: var(--oh-dubbing-rec-dot);
  animation: _dot-blink_1eux4_1 1000ms ease-in-out infinite;
}

@keyframes _dot-blink_1eux4_1 {
  0%,
  100% {
    opacity: 1;
  }

  50% {
    opacity: 0.3;
  }
}

._time_1eux4_74 {
  margin-right: 7px;
  color: var(--oh-color-text-strong);
  font-size: 1.445rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

._wave_1eux4_83 {
  display: flex;
  flex: none;
  align-items: center;
  gap: 2.5px;
  height: 18px;
  margin-left: 12.5px;
}

._tick_1eux4_92,
._bar_1eux4_93 {
  flex: none;
  width: 2.25px;
  margin-right: 0.25px;
  border-radius: 1px;
}

._tick_1eux4_92 {
  width: 2px;
  height: 5px;
  margin-right: 0.5px;
  background: var(--oh-color-line);
}

._bar_1eux4_93 {
  height: 18px;
  background: var(--oh-dubbing-wave);
  animation: _bar-wave_1eux4_1 1000ms ease-in-out infinite;
}

._bar_1eux4_93[data-step='1'] {
  animation-delay: -143ms;
}

._bar_1eux4_93[data-step='2'] {
  animation-delay: -286ms;
}

._bar_1eux4_93[data-step='3'] {
  animation-delay: -429ms;
}

._bar_1eux4_93[data-step='4'] {
  animation-delay: -571ms;
}

._bar_1eux4_93[data-step='5'] {
  animation-delay: -714ms;
}

._bar_1eux4_93[data-step='6'] {
  animation-delay: -857ms;
}

@keyframes _bar-wave_1eux4_1 {
  0%,
  100% {
    scale: 1 0.27;
  }

  50% {
    scale: 1 1;
  }
}

._list_18mee_7 {
  position: relative;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  
  overflow-anchor: none;
  container-type: size;
  scrollbar-width: none;
  background: var(--oh-color-bg);
}

._list_18mee_7::-webkit-scrollbar {
  display: none;
}

._list_18mee_7:focus-visible {
  outline-offset: -2px;
}

._items_18mee_28 {
  padding: 8px 0 max(40px, calc(100cqh - 92px));
}

._item_18mee_28 {
  position: relative;
}

._card_18mee_36 {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  column-gap: 12px;
  padding: 16.5px 18px 15.5px;
}

._item_18mee_28[data-current='true'] > ._card_18mee_36 {
  background: var(--oh-color-bg);
  box-shadow: 0 5px 6px -1px var(--oh-dubbing-card-shadow);
}

._item_18mee_28[data-current='true'] > ._card_18mee_36::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 4px;
  background: var(--oh-color-brand);
  content: '';
}

._english_18mee_62 {
  grid-row: 1;
  grid-column: 1 / -1;
  padding-right: 41px;
  color: var(--oh-color-text-faint);
  font-size: 1.2375rem;
  font-weight: 700;
  line-height: 1.5rem;
}

._translation_18mee_72 {
  grid-row: 2;
  grid-column: 1;
  margin-top: 8px;
  color: var(--oh-dubbing-rest-translation);
  font-size: 0.869rem;
  line-height: 1.28125rem;
}

._item_18mee_28[data-current='true'] ._english_18mee_62 {
  color: var(--oh-color-text-strong);
}

._item_18mee_28[data-current='true'] ._translation_18mee_72 {
  color: var(--oh-color-text-sub);
}

._badge_18mee_89 {
  display: inline-flex;
  grid-row: 1;
  grid-column: 2;
  align-items: center;
  justify-self: end;
  gap: 3px;
  margin-top: 1px;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1rem;
  white-space: nowrap;
}

._badge_18mee_89[data-tone='good'] {
  color: var(--oh-score-good);
}

._badge_18mee_89[data-tone='fair'] {
  color: var(--oh-score-fair);
}

._badge_18mee_89[data-tone='poor'] {
  color: var(--oh-score-poor);
}

._counter_18mee_115 {
  grid-row: 2;
  grid-column: 2;
  align-self: end;
  justify-self: end;
  color: var(--oh-dubbing-counter);
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1rem;
  white-space: nowrap;
}

._actions_18mee_127 {
  display: flex;
  grid-column: 1 / -1;
  gap: 8.5px;
  height: 2.125rem;
  margin-top: 27.5px;
  animation: _actions-open_18mee_1 400ms cubic-bezier(0, 0, 0.2, 1);
}

@keyframes _actions-open_18mee_1 {
  from {
    height: 0;
    margin-top: 0;
    overflow: hidden;
  }

  to {
    overflow: hidden;
  }
}

._original_18mee_149,
._analysis_18mee_150 {
  display: inline-flex;
  flex: none;
  align-items: center;
  height: 2.125rem;
  border-radius: 8px;
  font-size: 0.815rem;
  font-weight: 700;
  white-space: nowrap;
}

._original_18mee_149 {
  gap: 5px;
  padding: 0 14.5px 0 13px;
  border: 1px solid var(--oh-color-line);
  background: var(--oh-color-bg);
  color: var(--oh-color-text-strong);
}

._original_18mee_149:active {
  background: var(--oh-dubbing-control-pressed);
}

._originalIcon_18mee_173 {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 17px;
  height: 17px;
  border-radius: 4px;
  background: var(--oh-color-brand);
  color: var(--oh-color-text-inverse);
}

._analysis_18mee_150 {
  padding: 0 14px;
  background: linear-gradient(90deg, var(--oh-ai-blue), var(--oh-ai-violet));
  color: var(--oh-color-text-inverse);
}

._analysis_18mee_150:active {
  filter: brightness(0.92);
}

._item_18mee_28[data-phase='speaking'] {
  z-index: 1;
  margin-bottom: 2px;
  border-top: 1px solid var(--oh-dubbing-dim);
}

._item_18mee_28[data-phase='speaking'] > ._card_18mee_36 {
  box-shadow: none;
}

._speak_18mee_206 {
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  height: 61px;
  overflow: hidden;
  background: var(--oh-color-bg);
  animation: _speak-open_18mee_1 200ms cubic-bezier(0, 0, 0.2, 1);
}

@keyframes _speak-open_18mee_1 {
  from {
    height: 0;
  }
}

._speakBar_18mee_223 {
  position: absolute;
  top: 11px;
  left: 64px;
  width: calc(100% - 128px);
  height: 10px;
  border-radius: 5px;
  background: var(--oh-dubbing-speak-bar);
  box-shadow: 0 0 2px var(--oh-color-brand-glow);
  animation: _bar-shrink_18mee_1 var(--shrink-ms) linear var(--hold-ms) forwards;
}

@keyframes _bar-shrink_18mee_1 {
  to {
    width: 0;
    opacity: 0;
  }
}

._speakText_18mee_242 {
  position: absolute;
  top: 36px;
  right: 0;
  left: 0;
  color: var(--oh-color-text-strong);
  font-size: 0.569rem;
  line-height: 0.9375rem;
  text-align: center;
}

._cover_18mee_254 {
  position: absolute;
  top: calc(100% + 61px);
  right: 0;
  left: 0;
  height: 0;
  box-shadow: 0 100vh 0 100vh var(--oh-dubbing-dim);
}

._card_1bapk_7 {
  position: absolute;
  top: 50%;
  right: 16.5px;
  left: 16.5px;
  z-index: 3;
  padding: 0 20px 20px 19.5px;
  border-radius: 20px;
  background: var(--oh-color-bg);
  box-shadow: 0 1px 9px var(--oh-dubbing-tutor-shadow);
  translate: 0 -50%;
  animation: _card-appear_1bapk_1 200ms linear;
}

._card_1bapk_7:focus {
  outline: none;
}

@keyframes _card-appear_1bapk_1 {
  from {
    opacity: 0;
  }
}

._card_1bapk_7[data-leaving='true'] {
  animation: _card-leave_1bapk_1 300ms linear forwards;
}

@keyframes _card-leave_1bapk_1 {
  to {
    opacity: 0;
  }
}

._head_1bapk_41 {
  display: flex;
  align-items: flex-start;
  height: 4.625rem;
}

._sparkle_1bapk_47 {
  flex: none;
  margin: 22.5px 0 0 2.5px;
}

._title_1bapk_52 {
  margin: 21px 0 0 3px;
  background: linear-gradient(170deg, var(--oh-ai-blue) 30%, var(--oh-ai-violet) 130%);
  background-clip: text;
  color: transparent;
  font-size: 1.025rem;
  font-weight: 700;
  line-height: 1.3125rem;
}

._close_1bapk_62 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 37px;
  height: 37px;
  margin: 7px -13.5px 0 auto;
  color: var(--oh-color-icon);
}

._section_1bapk_72 {
  display: flex;
  align-items: center;
  gap: 3.5px;
  height: 1rem;
  margin-left: -0.5px;
  color: var(--oh-color-text-strong);
  font-size: 0.648rem;
  font-weight: 500;
  line-height: 1;
}

._section_1bapk_72::before {
  flex: none;
  width: 5.5px;
  height: 1rem;
  background: linear-gradient(180deg, var(--oh-ai-blue), var(--oh-ai-violet));
  content: '';
}

._replay_1bapk_92 {
  display: flex;
  align-items: center;
  gap: 11px;
  width: 100%;
  height: 3.15625rem;
  margin: 12px 0 23px;
  padding-left: 14px;
  border: 1px solid var(--oh-dubbing-replay-border);
  border-radius: 1.6rem;
  background: var(--oh-dubbing-replay-bg);
  color: var(--oh-color-brand-ink);
  font-size: 0.884rem;
  font-weight: 700;
}

._replayIcon_1bapk_108 {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--oh-color-brand);
  color: var(--oh-color-text-inverse);
}

._replayPlay_1bapk_120 {
  margin-left: 2px;
}

._player_1bapk_124 {
  position: relative;
  height: 240.5px;
  margin: 12px 0 23px;
  overflow: hidden;
  border-radius: 12px;
  background: var(--oh-dubbing-video-blank);
}

._playerVideo_1bapk_133 {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

._playerStart_1bapk_140 {
  position: absolute;
  top: 50%;
  left: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: var(--oh-watch-mark-disc);
  color: var(--oh-dubbing-video-mark);
  translate: -50% -50%;
}

._words_1bapk_155 {
  display: flex;
  flex-wrap: wrap;
  column-gap: 8.75px;
  margin-left: 4.5px;
  font-size: 0.93rem;
  font-weight: 500;
  line-height: 1.25rem;
}

._word_1bapk_155[data-grade='good'] {
  color: var(--oh-score-good);
}

._word_1bapk_155[data-grade='fair'] {
  color: var(--oh-score-fair);
}

._word_1bapk_155[data-grade='poor'] {
  color: var(--oh-score-poor);
}

._word_1bapk_155[data-grade='none'] {
  color: var(--oh-color-text-muted);
}

._scores_1bapk_181 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  margin: 24.5px 0 0;
}

._score_1bapk_181 {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 4.1875rem;
  border-radius: 9px;
  background: var(--oh-color-surface-muted);
}

._scoreName_1bapk_197 {
  margin-top: 8px;
  color: var(--oh-color-text-body);
  font-size: 0.58rem;
  line-height: 0.6875rem;
}

._scoreValue_1bapk_204 {
  margin: 4.5px 0 0;
  font-size: 0.96rem;
  font-weight: 700;
  line-height: 1.25rem;
}

._scoreValue_1bapk_204[data-tone='good'] {
  color: var(--oh-score-good);
}

._scoreValue_1bapk_204[data-tone='fair'] {
  color: var(--oh-score-fair);
}

._scoreValue_1bapk_204[data-tone='poor'] {
  color: var(--oh-score-poor);
}

._scoreFull_1bapk_223 {
  margin: 3.5px 0 0;
  color: var(--oh-color-text-muted);
  font-size: 0.66rem;
  line-height: 0.75rem;
}

._unrecognized_1bapk_230 {
  margin: 12px 0 1.5px;
  color: var(--oh-color-text-strong);
  font-size: 0.924rem;
  line-height: 1.25rem;
}

._stage_1m8wq_6 {
  position: relative;
  flex: none;
  aspect-ratio: 438 / 249;
  overflow: hidden;
}

._picture_1m8wq_13 {
  position: absolute;
  inset: 0;
}

._playing_1m8wq_19 {
  position: absolute;
  inset: 0;
}

._playing_1m8wq_19[data-step='blank'] {
  background: var(--oh-dubbing-video-blank);
}

._play_1m8wq_19,
._disc_1m8wq_29,
._ring_1m8wq_30,
._dots_1m8wq_31 {
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
}

._play_1m8wq_19 {
  margin-left: 2px;
  color: var(--oh-dubbing-video-mark);
}

._disc_1m8wq_29 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: var(--oh-dubbing-video-mark-disc);
  color: var(--oh-dubbing-video-mark);
  animation: _mark-leave_1m8wq_1 200ms linear var(--mark-ms) forwards;
}

@keyframes _mark-leave_1m8wq_1 {
  to {
    opacity: 0;
  }
}

._ring_1m8wq_30 {
  width: 32px;
  height: 32px;
  border: 2px solid var(--oh-dubbing-video-mark);
  border-right-color: transparent;
  border-radius: 50%;
  animation: _ring-turn_1m8wq_1 800ms linear infinite;
}

@keyframes _ring-turn_1m8wq_1 {
  from {
    rotate: 0deg;
  }

  to {
    rotate: 360deg;
  }
}

._dots_1m8wq_31 {
  display: flex;
  gap: 14px;
}

._dot_1m8wq_31 {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--oh-dubbing-video-dot);
  animation: _dot-hop_1m8wq_1 900ms ease-in-out infinite;
}

._dot_1m8wq_31:nth-child(2) {
  animation-delay: 150ms;
}

._dot_1m8wq_31:nth-child(3) {
  animation-delay: 300ms;
}

@keyframes _dot-hop_1m8wq_1 {
  0%,
  60%,
  100% {
    translate: 0 0;
  }

  30% {
    translate: 0 -6px;
  }
}

._camera_1m8wq_114 {
  position: absolute;
  bottom: 10px;
  left: 10px;
  display: block;
  width: 120px;
  height: 160.5px;
  overflow: hidden;
  border: 2px solid var(--oh-dubbing-camera-border);
  border-radius: 9px;
  background: var(--oh-dubbing-camera-bg);
}

._cameraVideo_1m8wq_127 {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

._page_1a84v_8 {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100dvh;
  overflow: hidden;
  background: var(--oh-color-bg);
}

html[data-layout='desktop'] ._page_1a84v_8 {
  max-width: var(--oh-column-width);
  margin: 0 auto;
}

._page_1a84v_8:focus {
  outline: none;
}

._frame_1a84v_26 {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-height: 0;
  border: 1px solid var(--oh-color-line);
  border-bottom: 0;
}

._header_1a84v_35 {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: space-between;
  height: 3.03125rem;
  padding: 0 7px 0 22px;
  border-bottom: 1px solid var(--oh-color-line);
}

._exit_1a84v_45 {
  display: flex;
  align-items: center;
  gap: 5px;
  min-height: 2rem;
  color: var(--oh-color-text-strong);
  font-size: 0.894rem;
}

._exit_1a84v_45 > svg {
  flex: none;
  color: var(--oh-color-icon-nav);
}

._settings_1a84v_59 {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border: 1px solid var(--oh-color-line);
  border-radius: 7px;
  background: var(--oh-color-bg);
  color: var(--oh-color-icon);
}

._listZone_1a84v_72 {
  position: relative;
  flex: 1;
  min-height: 0;
}

._listZone_1a84v_72::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 27px;
  background: linear-gradient(to bottom, transparent, var(--oh-dubbing-list-fade));
  content: '';
  pointer-events: none;
}

._veil_1a84v_90 {
  position: absolute;
  inset: 0;
  z-index: 5;
  background: var(--oh-dubbing-veil);
}

._veil_1a84v_90 > * {
  position: absolute;
  top: 51%;
  left: calc(50% - 34px);
  translate: -50% -50%;
}

._header_mmv6x_7 {
  --study-inset: 0px;
  display: flex;
  align-items: center;
  min-height: 1.875rem;
  padding: calc(10.5px + var(--study-inset) / 2) calc(10.5px + var(--study-inset)) 0 calc(12px + var(--study-inset));
  background: var(--oh-color-bg);
}

._header_mmv6x_7[data-inset='wide'] {
  --study-inset: 5.25px;
}

._back_mmv6x_20 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  margin-top: 1.5px;
  color: var(--oh-color-text-strong);
}

._back_mmv6x_20::after {
  position: absolute;
  inset: -14px -10px;
  content: '';
}

._count_mmv6x_37 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 1.34375rem;
  height: 1.34375rem;
  margin-left: 5px;
  border-radius: 5px;
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1;
}

._count_mmv6x_37[data-kind='correct'] {
  margin-left: 22.75px;
  background: var(--oh-correct-surface);
  color: var(--oh-correct-text);
}

._count_mmv6x_37[data-kind='wrong'] {
  background: var(--oh-wrong-surface);
  color: var(--oh-wrong-text);
}

._track_mmv6x_62 {
  position: relative;
  flex: 1;
  min-width: 2rem;
  height: 14px;
  margin-left: 12px;
  border-radius: 7px;
  background: var(--oh-color-surface-track);
}

._fill_mmv6x_72 {
  position: absolute;
  top: -1px;
  bottom: -0.5px;
  left: 0;
  width: calc(100% * var(--study-fill));
  min-width: 15px;
  border-radius: 7.5px;
  background: var(--oh-color-brand);
  box-shadow:
    0 -1px 1px var(--oh-study-fill-glow),
    inset 0 -1px 0 var(--oh-color-brand-pressed);
  transition: width 220ms ease-out;
}

._counter_mmv6x_87 {
  flex: none;
  margin-left: 11.5px;
  color: var(--oh-color-text-sub);
  font-size: 0.96rem;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.035em;
  line-height: 1;
  white-space: nowrap;
}

._gear_mmv6x_98 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 29.5px;
  height: 30px;
  margin-left: 19.5px;
  border: 1px solid var(--oh-study-gear-border);
  border-radius: 6px;
  background: var(--oh-color-bg);
  color: var(--oh-color-icon);
  cursor: default;
}

._gear_mmv6x_98[data-tone='muted'] {
  border-color: var(--oh-study-gear-border-muted);
  color: var(--oh-study-gear-muted);
}

._sentence_25203_9 {
  padding: 20px 20.5px 0;
}

._english_25203_13 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7.5px 8px;
  color: var(--oh-color-text-strong);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
}

._group_25203_24 {
  display: inline-flex;
  align-items: center;
  gap: 2.5px;
  line-height: 1.78125rem;
  white-space: nowrap;
}

._blank_25203_32 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5rem;
  height: 2.84375rem;
  padding: 0 10px;
  border: 1px solid var(--oh-color-line);
  border-radius: 8px;
  background: var(--oh-color-bg);
}

._blank_25203_32[data-state='active'] {
  height: 2.8125rem;
  border: 1.5px solid var(--oh-grammar-blank-active-border);
  background: var(--oh-grammar-blank-active);
  box-shadow:
    0 0 3px 1px var(--oh-grammar-blank-active-glow),
    inset 0 0 2px var(--oh-grammar-blank-active-glow);
}

._translation_25203_53 {
  margin-top: 8.5px;
  color: var(--oh-color-text-sub);
  font-size: 1rem;
  line-height: 1.5;
}

._pad_gm9os_7 {
  flex: none;
  margin-top: auto;
  padding: 10px 10px 9.25px;
  border-radius: 15px 15px 0 0;
}

._pad_gm9os_7[data-band='correct'] {
  background: var(--oh-grammar-band-correct);
}

._pad_gm9os_7[data-band='wrong'] {
  background: var(--oh-grammar-band-wrong);
}

._failed_gm9os_22 {
  margin: 0 0 8px;
  color: var(--oh-verdict-wrong-text);
  font-size: 0.875rem;
  text-align: center;
}

._grid_gm9os_29 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

._choice_gm9os_35 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 3.78125rem;
  padding: 0 4px 1px;
  border: 1px solid var(--oh-color-line);
  border-radius: var(--oh-radius-button);
  background: var(--oh-color-bg);
  box-shadow: inset -1.5px -4px 2.5px var(--oh-grammar-choice-shade);
  color: var(--oh-color-text-strong);
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: -0.05em;
  white-space: nowrap;
}

._choice_gm9os_35[data-long='true'] {
  font-size: 1.25rem;
}

._sheet_8otvz_7 {
  max-height: 88dvh;
  border: 1px solid var(--oh-color-line);
  border-bottom: 0;
}

._head_8otvz_13 {
  position: relative;
  display: flex;
  align-items: center;
  flex: none;
  min-height: 3.96875rem;
  padding: 0 18px 0 18px;
}

._head_8otvz_13::after {
  position: absolute;
  right: 18px;
  bottom: 0;
  left: 18px;
  height: 1px;
  background: var(--oh-color-line-soft);
  content: '';
}

._head_8otvz_13[data-divider='full']::after {
  right: 0;
  left: 0;
}

._mark_8otvz_37 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 28.5px;
  height: 28.5px;
  border-radius: 50%;
  color: var(--oh-color-text-inverse);
}

._mark_8otvz_37[data-verdict='correct'] {
  background: var(--oh-verdict-correct-mark);
  box-shadow: 0 0 0 1px var(--oh-verdict-correct-glow);
}

._mark_8otvz_37[data-verdict='wrong'] {
  background: var(--oh-verdict-wrong-mark);
}

._title_8otvz_57 {
  margin: 2px 0 0 7.5px;
  font-size: 1.016rem;
  font-weight: 700;
  line-height: 1.2;
}

._title_8otvz_57[data-verdict='correct'] {
  color: var(--oh-verdict-correct-text);
}

._title_8otvz_57[data-verdict='wrong'] {
  color: var(--oh-verdict-wrong-text);
}

._body_8otvz_72 {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 0 18px;
}

._foot_8otvz_79 {
  flex: none;
  padding: 14px 18px 22.5px;
}

._next_8otvz_84 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 3.75rem;
  padding-bottom: 2px;
  border-radius: 12px;
  background: var(--oh-button-next-waiting);
  color: var(--oh-color-text-inverse);
  font-size: 1.0625rem;
  font-weight: 700;
  cursor: default;
}

._next_8otvz_84[data-ready='true'] {
  background: var(--oh-color-brand);
  box-shadow:
    inset 0 1px 0 var(--oh-button-cta-shine),
    inset 0 -2px 0 var(--oh-color-brand-pressed),
    0 -1px 1px var(--oh-study-fill-glow);
  cursor: pointer;
}

._next_8otvz_84[data-ready='true']:active {
  background: var(--oh-color-brand-pressed);
}

._bars_owb11_5 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  flex: none;
  width: 35px;
  height: 35px;
  border-radius: 50%;
  background: var(--oh-color-brand);
  box-shadow: 0 -1px 1px var(--oh-study-fill-glow);
}

._bars_owb11_5 > span {
  display: block;
  width: 3px;
  height: 15px;
  border-radius: 1.5px;
  background: var(--oh-color-text-inverse);
  scale: 1 0.55;
  animation: _bar-swing_owb11_1 620ms ease-in-out infinite alternate;
}

._bars_owb11_5 > span:nth-child(1) {
  animation-delay: -620ms;
}

._bars_owb11_5 > span:nth-child(2) {
  animation-delay: -310ms;
}

._bars_owb11_5 > span:nth-child(3) {
  animation-delay: -110ms;
}

._bars_owb11_5 > span:nth-child(4) {
  animation-delay: -200ms;
}

._bars_owb11_5 > span:nth-child(5) {
  animation-delay: -30ms;
}

@keyframes _bar-swing_owb11_1 {
  from {
    scale: 1 1;
  }

  to {
    scale: 1 0.53;
  }
}

._speaker_owb11_58 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 50px;
  height: 50px;
  padding-bottom: 2.5px;
  border-radius: 13px;
  background: var(--oh-color-brand);
  box-shadow:
    inset 0 -5px 0 var(--oh-color-brand-pressed),
    0 -1px 1px var(--oh-study-fill-glow);
  color: var(--oh-color-text-inverse);
}

._speaker_owb11_58:active {
  background: var(--oh-color-brand-pressed);
}

._lines_ih7hd_8 {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 27px;
}

._ruler_ih7hd_15 {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  height: 0;
  overflow: hidden;
  visibility: hidden;
  white-space: nowrap;
  pointer-events: none;
}

._ruler_ih7hd_15 > * {
  flex: none;
}

._row_ih7hd_33 {
  display: flex;
  gap: 12px;
}

._lines_ih7hd_8[data-measured='false'] ._row_ih7hd_33 {
  flex-wrap: wrap;
}

._chunk_ih7hd_42 {
  --role-color: var(--oh-grammar-role-other);
  display: inline-flex;
  flex: none;
  flex-direction: column;
  align-items: flex-start;
}

._chunk_ih7hd_42[data-tone='subject'] {
  --role-color: var(--oh-grammar-role-subject);
}

._chunk_ih7hd_42[data-tone='verb'] {
  --role-color: var(--oh-grammar-role-verb);
}

._chunk_ih7hd_42[data-tone='object'] {
  --role-color: var(--oh-grammar-role-object);
}

._chunk_ih7hd_42[data-tone='indirect-object'] {
  --role-color: var(--oh-grammar-role-indirect-object);
}

._chunk_ih7hd_42[data-tone='auxiliary'] {
  --role-color: var(--oh-grammar-role-auxiliary);
}

._chunk_ih7hd_42[data-tone='complement'] {
  --role-color: var(--oh-grammar-role-complement);
}

._role_ih7hd_74 {
  display: block;
  color: var(--role-color);
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.2;
  white-space: nowrap;
}

._words_ih7hd_83 {
  display: block;
  margin-top: 5.5px;
  padding-bottom: 2.5px;
  border-bottom: 3.5px solid var(--role-color);
  color: var(--oh-color-text-strong);
  font-size: 1.175rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

._review_1c8he_14 {
  padding: 13px 0 0;
}

._answerHead_1c8he_18 {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

._caption_1c8he_24 {
  translate: 0 1px;
  color: var(--oh-grammar-caption);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.2;
}

._answer_1c8he_18 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6.5px;
  margin-top: 6.5px;
  color: var(--oh-color-text-strong);
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.3;
}

._group_1c8he_44 {
  display: inline-flex;
  align-items: center;
  gap: 6.5px;
  line-height: 1.71875rem;
  white-space: nowrap;
}

._group_1c8he_44[data-spaced='true'] {
  margin-right: 5.5px;
}

._word_1c8he_56 {
  translate: 0 1.25px;
}

._chip_1c8he_60 {
  display: inline-flex;
  align-items: center;
  height: 2.09375rem;
  padding: 2.5px 8.25px 0;
  border: 1px solid var(--oh-grammar-chip-correct-border);
  font-size: 1.225rem;
  border-radius: 7px;
  background: var(--oh-grammar-chip-correct);
  color: var(--oh-grammar-chip-correct-text);
}

._chip_1c8he_60[data-state='wrong'] {
  border-color: var(--oh-grammar-chip-wrong-border);
  background: var(--oh-grammar-chip-wrong);
  color: var(--oh-grammar-chip-wrong-text);
}

._chip_1c8he_60[data-state='skipped'] {
  border-color: var(--oh-grammar-chip-skipped-border);
  background: var(--oh-grammar-chip-skipped);
  color: var(--oh-grammar-chip-skipped-text);
}

._translation_1c8he_84 {
  margin-top: 8.25px;
  color: var(--oh-sheet-text-sub);
  font-size: 0.95rem;
  line-height: 1.5;
}

._reason_1c8he_91 {
  margin-top: 16.25px;
  padding: 16.5px 17.5px;
  border-radius: 16px;
  background: var(--oh-grammar-mint);
}

._reasonTitle_1c8he_98,
._structureTitle_1c8he_99 {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
}

._reasonTitle_1c8he_98 {
  color: var(--oh-grammar-mint-text);
  font-size: 0.97rem;
  line-height: 1.3;
}

._reasonBody_1c8he_112 {
  margin-top: 11.5px;
  color: var(--oh-color-text-strong);
  font-size: 0.94375rem;
  line-height: 1.625rem;
  word-break: normal;
  word-spacing: 0.25px;
}

._reasonBody_1c8he_112 ._nonHangul_1c8he_121 {
  font-size: 1.0464em;
}

._nonHangul_1c8he_121 {
  line-height: 0;
}

._aiChip_1c8he_130 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-width: 1.625rem;
  height: 1.3125rem;
  padding: 0 4px;
  border-radius: 6px;
  background: var(--oh-grammar-mint);
  color: var(--oh-grammar-mint-text);
  font-size: 0.725rem;
  font-weight: 700;
  line-height: 1;
}

._reasonTitle_1c8he_98 ._aiChip_1c8he_130 {
  height: 1.25rem;
  background: var(--oh-color-bg);
}

._structure_1c8he_99 {
  margin-top: 16.25px;
  padding: 18px 18px 16.5px;
  border: 1px solid var(--oh-color-line);
  border-radius: 14px;
}

._reason_1c8he_91 + ._structure_1c8he_99 {
  margin-top: 14px;
}

._structureTitle_1c8he_99 {
  margin-bottom: 20px;
  color: var(--oh-color-text-strong);
  font-size: 0.9375rem;
  line-height: 1.4;
}

._notes_1c8he_169 {
  margin-top: 33.5px;
  padding-top: 15px;
  border-top: 1px solid var(--oh-color-line);
}

._note_1c8he_169 {
  position: relative;
  padding-left: 15.5px;
  color: var(--oh-color-text-body);
  font-size: 0.94375rem;
  line-height: 1.5625rem;
  word-break: normal;
  word-spacing: 0.25px;
}

._note_1c8he_169 + ._note_1c8he_169 {
  margin-top: 11.5px;
}

._note_1c8he_169::before {
  position: absolute;
  top: 0.6rem;
  left: 0;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--oh-grammar-note-dot);
  content: '';
}

._note_1c8he_169 ._nonHangul_1c8he_121 {
  font-size: 1.0132em;
}

._noteTitle_1c8he_204 {
  color: var(--oh-grammar-note-title);
  font-weight: 700;
}

._noteTitle_1c8he_204 ._nonHangul_1c8he_121 {
  font-size: 1.0331em;
}

._notice_1c8he_213 {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 2.59375rem;
  margin-top: 14.5px;
  padding: 6px 11.5px;
  border: 1px dashed var(--oh-color-line);
  border-radius: 8px;
  background: var(--oh-color-surface-muted);
  color: var(--oh-color-text-sub);
  font-size: 0.885rem;
  line-height: 1.4;
}

._notice_1c8he_213:last-child {
  margin-bottom: 1.5px;
}

._infoGlyph_1c8he_232 {
  flex: none;
  color: var(--oh-color-text-faint);
}

._again_1c8he_237 {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 18px;
  color: var(--oh-sheet-text-note);
  font-size: 0.817rem;
  line-height: 1.2;
}

._againFace_1c8he_247 {
  font-size: 0.9375rem;
  line-height: 1;
}

._notice_uzyqw_8 {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 100dvh;
  padding: 143px 30.5px 30.5px;
  background: var(--oh-color-bg);
}

html[data-layout='desktop'] ._notice_uzyqw_8 {
  max-width: var(--oh-column-width);
  margin: 0 auto;
}

._title_uzyqw_23 {
  color: var(--oh-color-text);
  font-size: 1.625rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
}

._art_uzyqw_31 {
  width: 319px;
  max-width: 100%;
  aspect-ratio: 319 / 287;
  margin-top: 59.5px;
}

._failed_uzyqw_38 {
  margin-top: 16px;
  color: var(--oh-color-text-sub);
  font-size: 1rem;
  text-align: center;
}

._start_uzyqw_45 {
  position: relative;
  z-index: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10.5px;
  width: 100%;
  min-height: 4.375rem;
  margin-top: auto;
  padding: 0 12px;
  border-radius: 2.1875rem;
  color: var(--oh-color-text-inverse);
  font-size: 1.375rem;
  font-weight: 700;
  white-space: nowrap;
}

._start_uzyqw_45::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--oh-color-brand) 0%, var(--oh-color-brand) 35%, var(--oh-grammar-start-end) 100%);
  box-shadow:
    inset 0 2px 3px var(--oh-grammar-start-shine),
    inset 0 -3px 4px var(--oh-grammar-start-shade);
  content: '';
}

._start_uzyqw_45[data-waiting='true']::before {
  opacity: 0.57;
}

._ring_uzyqw_80 {
  display: block;
  flex: none;
  width: 20px;
  height: 20px;
  border: 2.5px solid var(--oh-grammar-start-shine);
  border-left-color: var(--oh-color-text-inverse);
  border-radius: 50%;
  animation: _ring-turn_uzyqw_1 800ms linear infinite;
}

@keyframes _ring-turn_uzyqw_1 {
  to {
    rotate: 360deg;
  }
}

._cube_uzyqw_97 {
  position: absolute;
  top: 51%;
  left: calc(50% - 34px);
  display: block;
  translate: -50% -50%;
  pointer-events: none;
}

._notice_uzyqw_8[data-step='entering'] > :not(._cube_uzyqw_97) {
  opacity: 0;
}

._notice_uzyqw_8[data-step='appearing'] > :not(._cube_uzyqw_97) {
  animation: _notice-appear_uzyqw_1 var(--appear-ms) linear both;
}

._notice_uzyqw_8[data-step='appearing'] > ._art_uzyqw_31 {
  animation-name: _art-appear_uzyqw_1;
}

@keyframes _notice-appear_uzyqw_1 {
  from {
    opacity: 0.25;
  }

  to {
    opacity: 0.6;
  }
}

@keyframes _art-appear_uzyqw_1 {
  from {
    opacity: 0;
  }

  40% {
    opacity: 0.25;
  }

  to {
    opacity: 0.6;
  }
}

._band_1e34j_6 {
  position: relative;
  display: block;
  flex: none;
  width: 100%;
  aspect-ratio: 880 / 679;
  background: var(--oh-grammar-video-frame);
  color: var(--oh-grammar-video-mark);
  cursor: pointer;
}

._band_1e34j_6:focus-visible {
  outline-offset: -3px;
}

._picture_1e34j_21 {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  aspect-ratio: 16 / 9;
  translate: 0 -50%;
}

._play_1e34j_30,
._disc_1e34j_31,
._ring_1e34j_32 {
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
}

._play_1e34j_30 {
  margin-left: 2.5px;
}

._disc_1e34j_31 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: var(--oh-grammar-video-mark-disc);
}

._ring_1e34j_32 {
  width: 32px;
  height: 32px;
  border: 2px solid var(--oh-grammar-video-mark);
  border-right-color: transparent;
  border-radius: 50%;
  animation: _ring-turn_1e34j_1 800ms linear infinite;
}

@keyframes _ring-turn_1e34j_1 {
  from {
    rotate: 0deg;
  }

  to {
    rotate: 360deg;
  }
}

._page_1p62a_6 {
  display: flex;
  flex-direction: column;
  min-height: 100dvh;
  background: var(--oh-color-bg);
}

html[data-layout='desktop'] ._page_1p62a_6 {
  max-width: var(--oh-column-width);
  margin: 0 auto;
}

._head_1p62a_18 {
  flex: none;
  min-height: 3.46875rem;
}

._frame_czgx1_6 {
  display: flex;
  flex-direction: column;
  min-height: 100dvh;
  background: var(--oh-color-bg);
}

html[data-layout='desktop'] ._frame_czgx1_6 {
  max-width: var(--oh-column-width);
  margin: 0 auto;
}

._header_czgx1_18 {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  flex: none;
  min-height: calc(var(--oh-header-height) + 0.5px);
  padding: 0 10.5px 0 11.5px;
  border-bottom: 1px solid var(--oh-color-line);
  background: var(--oh-color-bg);
}

._logo_czgx1_31 {
  display: flex;
  align-items: center;
  flex: none;
  margin-right: auto;
  padding-top: 4px;
  color: var(--oh-logo-text);
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

._logoPhoto_czgx1_44 {
  width: 26px;
  height: 26px;
  border-radius: 50%;
}

._gift_czgx1_50 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 36px;
  height: 36px;
  margin: 0 8.5px 0 12px;
  border-radius: 50%;
  background: var(--oh-color-brand-deep);
  box-shadow: 0 4px 9px rgb(19 133 108 / 0.32);
  color: var(--oh-color-text-inverse);
}

._gift_czgx1_50[aria-disabled='true'],
._account_czgx1_65[aria-disabled='true'],
._tab_czgx1_66[aria-disabled='true'] {
  cursor: default;
}

._account_czgx1_65 {
  display: flex;
  align-items: center;
  flex: 0 1 11.1875rem;
  min-width: 0;
  min-height: 2.875rem;
  padding: 0 12.75px 0 12px;
  border: 1px solid var(--oh-color-border);
  border-radius: var(--oh-radius-control);
  background: var(--oh-color-bg);
  color: var(--oh-color-text-body);
  font-size: 0.78rem;
  line-height: 1;
}

._accountText_czgx1_85 {
  overflow: hidden;
  flex: 1 1 0;
  min-width: 0;
  line-height: 1.4;
  text-overflow: ellipsis;
  white-space: nowrap;
}

._accountDot_czgx1_94 {
  flex: none;
  width: 3px;
  height: 3px;
  margin: 0 9px 0 11px;
  border-radius: 50%;
  background: var(--oh-color-dot-muted);
}

._accountChevron_czgx1_103 {
  flex: none;
  margin-left: 4.25px;
  color: var(--oh-color-icon);
}

._main_czgx1_109 {
  flex: 1;
  min-width: 0;
}

._tabBar_czgx1_114 {
  position: sticky;
  bottom: 0;
  z-index: 2;
  display: grid;
  flex: none;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  padding-bottom: env(safe-area-inset-bottom);
  background: var(--oh-color-bg);
  box-shadow: 0 -2px 12px var(--oh-color-shadow-nav);
  
  clip-path: inset(-20px 0 0 0);
}

._tab_czgx1_66 {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 0;
  min-height: var(--oh-tabbar-height);
  padding: 10.5px 0 4px;
  color: var(--oh-color-nav-icon);
  font-size: 0.665rem;
  line-height: 1;
  white-space: nowrap;
}

._tab_czgx1_66 > span {
  margin-top: 1.5px;
  color: var(--oh-color-nav-label);
}

._tab_czgx1_66[aria-current='page'],
._tab_czgx1_66[aria-current='page'] > span {
  color: var(--oh-color-nav-selected);
}

._tag_93f5o_3 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-height: 1.4375rem;
  padding: 0 10px;
  border-radius: var(--oh-radius-tag);
  background: var(--oh-area-other-bg);
  color: var(--oh-area-other-text);
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

._tag_93f5o_3[data-area='content'] {
  background: var(--oh-area-content-bg);
  color: var(--oh-area-content-text);
}

._tag_93f5o_3[data-area='word'] {
  background: var(--oh-area-word-bg);
  color: var(--oh-area-word-text);
}

._tag_93f5o_3[data-area='sentence'] {
  background: var(--oh-area-sentence-bg);
  color: var(--oh-area-sentence-text);
}

._tag_93f5o_3[data-area='speaking'] {
  background: var(--oh-area-speaking-bg);
  color: var(--oh-area-speaking-text);
}

._card_1ddvz_6 {
  container-type: inline-size;
  overflow: hidden;
  border: 1px solid var(--oh-state-not-started-card-border);
  border-radius: var(--oh-radius-card);
  background: var(--oh-color-bg);
}

._card_1ddvz_6[data-state='in-progress'] {
  border-color: var(--oh-state-in-progress-card-border);
}

._card_1ddvz_6[data-state='done'] {
  border-color: var(--oh-state-done-card-border);
}

._band_1ddvz_22 {
  display: flex;
  align-items: center;
  min-height: 3.0625rem;
  padding: 8px 19px;
  background: var(--oh-state-not-started-band);
}

._card_1ddvz_6[data-state='in-progress'] ._band_1ddvz_22 {
  background: var(--oh-state-in-progress-band);
}

._card_1ddvz_6[data-state='done'] ._band_1ddvz_22 {
  background: var(--oh-state-done-band);
}

._title_1ddvz_38 {
  color: var(--oh-card-title);
  font-size: 0.887rem;
  font-weight: 600;
  line-height: 1.35;
}

._actions_1ddvz_45 {
  display: flex;
  align-items: flex-start;
  gap: 7.5px;
  padding: 9.5px 12px 0;
}

._startSlot_1ddvz_53 {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-width: 0;
}

._start_1ddvz_53,
._resume_1ddvz_61 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  gap: 6px;
  min-width: 0;
  min-height: 3rem;
  margin-bottom: 3px;
  padding: 0 6px;
  border-radius: var(--oh-radius-button);
  color: var(--oh-color-text-inverse);
  font-size: 0.906rem;
  font-weight: 700;
  white-space: nowrap;
}

._start_1ddvz_53 {
  background: var(--oh-button-start);
  box-shadow:
    0 3px 0 var(--oh-button-start-ledge),
    0 9px 12px var(--oh-button-start-glow);
}

._resume_1ddvz_61 {
  gap: 9.5px;
  background: var(--oh-button-resume);
  box-shadow:
    0 3px 0 var(--oh-button-resume-ledge),
    0 5px 8px var(--oh-button-resume-glow);
}

._start_1ddvz_53:active,
._resume_1ddvz_61:active {
  translate: 0 2px;
}

._start_1ddvz_53[aria-disabled='true'],
._resume_1ddvz_61[aria-disabled='true'],
._lesson_1ddvz_100[aria-disabled='true'],
._activityButton_1ddvz_101[aria-disabled='true'] {
  cursor: default;
}

._percent_1ddvz_105 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-height: 1.40625rem;
  padding: 0 6px;
  border-radius: 0.72rem;
  background: var(--oh-button-resume-percent);
  font-size: 0.75rem;
  line-height: 1;
}

._playMark_1ddvz_119 {
  flex: none;
}

._resume_1ddvz_61 > ._playMark_1ddvz_119 {
  margin-left: -6px;
}

._track_1ddvz_128 {
  overflow: hidden;
  height: 4px;
  margin-top: 4px;
  border-radius: 2px;
  background: var(--oh-button-resume-track);
}

._trackFill_1ddvz_136 {
  display: block;
  height: 100%;
  background: var(--oh-button-resume);
}

._report_1ddvz_142 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  gap: 7px;
  min-width: 0;
  min-height: 3.1875rem;
  padding: 0 4px;
  border: 1.5px solid var(--oh-color-border-button);
  border-radius: 14px;
  background: var(--oh-color-bg);
  color: var(--oh-color-text-strong);
  font-size: 0.9rem;
  font-weight: 700;
  white-space: nowrap;
}

._card_1ddvz_6[data-state='in-progress'] ._report_1ddvz_142 {
  flex: none;
  width: calc((100% - 7.5px) * 0.3814);
}

@container (max-width: 20.5rem) {
  ._report_1ddvz_142,
  ._resume_1ddvz_61 {
    gap: 4px;
    font-size: 0.8125rem;
  }

  ._resume_1ddvz_61 > ._playMark_1ddvz_119 {
    margin-left: -4px;
  }

  ._activityButton_1ddvz_101 {
    min-width: 4.375rem;
  }
}

._meta_1ddvz_183 {
  display: flex;
  align-items: center;
  padding: 21.5px 20px 17px 21px;
}

._meta_1ddvz_183[data-open] {
  padding-top: 25px;
}

._metaText_1ddvz_194 {
  flex: 1;
  min-width: 0;
}

._tags_1ddvz_199 {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 3px;
}

._options_1ddvz_206 {
  color: var(--oh-color-text-muted);
  font-size: 0.7rem;
  line-height: 1.875;
}

._option_1ddvz_206 {
  display: inline-block;
  margin-right: 5.5px;
  white-space: nowrap;
}

._expand_1ddvz_218 {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  flex: none;
  width: 28px;
  min-height: 40px;
  margin-left: -6px;
  border-radius: 6px;
  color: var(--oh-color-icon);
  translate: 0 2.5px;
}

._meta_1ddvz_183[data-open] ._expand_1ddvz_218 {
  translate: 0 -3px;
}

._expand_1ddvz_218::after {
  position: absolute;
  inset: 0 -8px;
  content: '';
}

._panel_1ddvz_243 {
  display: flex;
  flex-direction: column;
  padding: 9.5px 9.5px 12px;
}

._spinner_1ddvz_250 {
  align-self: center;
  width: 30px;
  height: 30px;
  margin: 6px 0 -1.5px;
  border: 4px solid var(--oh-color-border-strong);
  border-right-color: transparent;
  border-radius: 50%;
  animation: _spin_1ddvz_250 0.8s linear infinite;
}

@keyframes _spin_1ddvz_250 {
  to {
    rotate: 360deg;
  }
}

._activities_1ddvz_267 {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

._activity_1ddvz_101 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8.5px 9.5px 9.5px;
  border-radius: 10px;
}

@media (hover: hover) {
  ._activity_1ddvz_101:hover {
    background: var(--oh-color-row-hover);
  }
}

._activity_1ddvz_101:active {
  background: var(--oh-color-row-hover);
}

._activityInfo_1ddvz_292 {
  min-width: 0;
}

._activityTags_1ddvz_296 {
  display: flex;
  align-items: center;
  gap: 3px;
}

._badge_1ddvz_302 {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 1.46875rem;
  padding: 0 9px;
  border-radius: 6px;
  color: var(--oh-color-text-inverse);
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

._badge_1ddvz_302[data-tone='low'] {
  background: var(--oh-badge-low);
}

._badge_1ddvz_302[data-tone='mid'] {
  background: var(--oh-badge-mid);
}

._badge_1ddvz_302[data-tone='full'] {
  background: var(--oh-badge-full);
}

._activityName_1ddvz_328 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 4px;
  margin-top: 7px;
  color: var(--oh-color-text-strong);
  font-size: 0.855rem;
  line-height: 1.572;
}

._activityTitle_1ddvz_339 {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}

._dot_1ddvz_345 {
  flex: none;
  width: 9px;
  height: 9px;
  margin-right: 8px;
  border-radius: 50%;
  background: var(--oh-activity-dot-not-started);
}

._activity_1ddvz_101[data-status='in-progress'] ._dot_1ddvz_345,
._activity_1ddvz_101[data-status='needs-review'] ._dot_1ddvz_345 {
  background: var(--oh-activity-dot-in-progress);
}

._activity_1ddvz_101[data-status='completed'] ._dot_1ddvz_345 {
  background: var(--oh-activity-dot-completed);
}

._studiedAt_1ddvz_363 {
  color: var(--oh-color-text-faint);
  font-size: 0.83rem;
}

._activitySide_1ddvz_368 {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  flex: none;
  gap: 8px;
}

._doneLabel_1ddvz_376 {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--oh-color-text-strong);
  font-size: 0.87rem;
  font-weight: 500;
  line-height: 1.15;
}

._doneLabel_1ddvz_376 > svg {
  color: var(--oh-color-done-check);
}

._activityButtons_1ddvz_390 {
  display: flex;
  gap: 5px;
}

._activityButton_1ddvz_101 {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 5.28125rem;
  min-height: 2.25rem;
  padding: 0 10px;
  border-radius: var(--oh-radius-control);
  font-size: 0.79rem;
  font-weight: 700;
  white-space: nowrap;
}

._activityButton_1ddvz_101[data-look='start'] {
  background: var(--oh-color-brand);
  box-shadow:
    inset 0 -1.5px 0 var(--oh-color-brand-pressed),
    0 0 0 1px var(--oh-color-brand-glow);
  color: var(--oh-color-text-inverse);
}

._activity_1ddvz_101:active ._activityButton_1ddvz_101[data-look='start'] {
  background: var(--oh-color-brand-pressed);
}

@media (hover: hover) {
  ._activity_1ddvz_101:hover ._activityButton_1ddvz_101[data-look='start'] {
    background: var(--oh-color-brand-pressed);
  }
}

._activityButton_1ddvz_101[data-look='outline'] {
  border: 1px solid var(--oh-color-brand-outline);
  background: var(--oh-color-bg);
  box-shadow: 0 0 0 1.5px var(--oh-color-brand-glow);
  color: var(--oh-color-brand-outline-text);
}

._activityButton_1ddvz_101[data-look='plain'] {
  border: 1px solid var(--oh-color-border-button);
  background: var(--oh-color-bg);
  color: var(--oh-color-text-strong);
}

._lesson_1ddvz_100 {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 2.75rem;
  margin: 20px 3px 0;
  border: 1px solid var(--oh-color-brand-outline-soft);
  border-radius: 8px;
  background: var(--oh-color-bg);
  box-shadow: 0 0 0 1.5px var(--oh-color-brand-glow);
  color: var(--oh-color-text-strong);
  font-size: 0.855rem;
  font-weight: 700;
}

._strip_28pgx_5 {
  display: flex;
  align-items: center;
  padding: 0 4px;
}

._arrow_28pgx_11 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 31px;
  height: 44px;
  color: var(--oh-color-icon-nav);
}

._days_28pgx_21 {
  display: grid;
  flex: 1;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  grid-template-rows: auto auto auto;
  min-width: 0;
}

._day_28pgx_21 {
  display: grid;
  grid-row: span 3;
  grid-template-rows: subgrid;
  justify-items: center;
  min-width: 0;
}

._weekday_28pgx_37 {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  min-height: 0.9375rem;
  color: var(--oh-color-text-faint);
  font-size: 0.76rem;
  line-height: 1;
}

._weekday_28pgx_37[data-today] {
  min-width: 1.53125rem;
  min-height: 1.375rem;
  border-radius: 6px;
  background: var(--oh-color-today-marker);
  color: var(--oh-color-text-inverse);
  font-weight: 700;
}

._cell_28pgx_58 {
  --cell-face: var(--oh-date-face);
  --cell-border: var(--oh-date-face-border);
  --cell-ledge: var(--oh-date-ledge);
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(2.3125rem, 100% - 3px);
  height: 2.3125rem;
  margin: 10px 0 4px;
  border: 1px solid var(--cell-border);
  border-radius: 8px;
  background: var(--cell-face);
  box-shadow:
    0 4px 0 var(--cell-ledge),
    0 6px 6px rgb(0 0 0 / 0.06);
  color: var(--oh-date-text);
  font-size: 0.956rem;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

._cell_28pgx_58[data-state='not-started'] {
  --cell-face: var(--oh-state-not-started-face);
  --cell-border: var(--oh-state-not-started-face-border);
  --cell-ledge: var(--oh-state-not-started-ledge);
  --cell-pressed-from: var(--oh-state-not-started-pressed-from);
  --cell-pressed-to: var(--oh-state-not-started-pressed-to);
  --cell-pressed-border: var(--oh-state-not-started-pressed-border);
  color: var(--oh-date-text-marked);
}

._cell_28pgx_58[data-state='in-progress'] {
  --cell-face: var(--oh-state-in-progress-face);
  --cell-border: var(--oh-state-in-progress-face-border);
  --cell-ledge: var(--oh-state-in-progress-ledge);
  --cell-pressed-from: var(--oh-state-in-progress-pressed-from);
  --cell-pressed-to: var(--oh-state-in-progress-pressed-to);
  --cell-pressed-border: var(--oh-state-in-progress-pressed-border);
  color: var(--oh-date-text-marked);
}

._cell_28pgx_58[data-state='done'] {
  --cell-face: var(--oh-state-done-face);
  --cell-border: var(--oh-state-done-face-border);
  --cell-ledge: var(--oh-state-done-ledge);
  --cell-pressed-from: var(--oh-state-done-pressed-from);
  --cell-pressed-to: var(--oh-state-done-pressed-to);
  --cell-pressed-border: var(--oh-state-done-pressed-border);
  color: var(--oh-date-text-marked);
}

._cell_28pgx_58[data-pressed] {
  height: calc(2.3125rem + 1px);
  margin: 13px 0 0;
  border-color: var(--cell-pressed-border, var(--cell-border));
  background: linear-gradient(to bottom, var(--cell-pressed-from, var(--cell-face)), var(--cell-pressed-to, var(--cell-face)) 45%);
  box-shadow: inset 0 -1px 0 rgb(0 0 0 / 0.14);
  font-weight: 700;
}

._mark_28pgx_120 {
  position: relative;
  width: 5.5px;
  height: 5.5px;
  margin-top: 3px;
  border-radius: 1.5px;
}

._mark_28pgx_120[data-state='not-started'] {
  background: var(--oh-state-not-started-dot);
}

._mark_28pgx_120[data-state='in-progress'] {
  background: var(--oh-state-in-progress-dot);
}

._mark_28pgx_120[data-state='done'] {
  background: var(--oh-state-done-dot);
}

._grown_28pgx_141 {
  position: absolute;
  top: 8px;
  left: 50%;
  translate: -50% 0;
}

._page_t24g5_5 {
  padding-bottom: 62px;
}

._summary_t24g5_9 {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  min-height: 99.5px;
  padding: 12px var(--oh-space-page) 0;
}

._greeting_t24g5_18 {
  min-width: 0;
  margin-top: 19.5px;
  padding-left: 0.5px;
  color: var(--oh-color-text);
  font-size: 1.016rem;
  font-weight: 700;
  line-height: 1.415;
}

._emoji_t24g5_29 {
  font-size: 1.26em;
  line-height: 0;
  vertical-align: -0.08em;
}

._tree_t24g5_35 {
  flex: none;
  min-height: 87.5px;
}

._pills_t24g5_40 {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-height: 2rem;
  margin-top: 12.5px;
  padding: 0 var(--oh-space-page);
}

._timePill_t24g5_49,
._ratePill_t24g5_50 {
  display: flex;
  align-items: center;
  gap: 6.5px;
  min-height: 2rem;
  padding: 0 15px;
  border-radius: 1rem;
  font-size: 0.8125rem;
  line-height: 1;
  white-space: nowrap;
}

._timePill_t24g5_49 {
  background: var(--oh-pill-time-bg);
  color: var(--oh-pill-time-label);
}

._timePill_t24g5_49 > strong {
  color: var(--oh-pill-time-value);
}

._ratePill_t24g5_50 {
  padding: 0 15px;
  border: 1px solid var(--oh-pill-rate-zero-border);
  background: var(--oh-pill-rate-zero-bg);
  color: var(--oh-pill-rate-zero-label);
}

._ratePill_t24g5_50 > strong {
  color: var(--oh-pill-rate-zero-value);
}

._ratePill_t24g5_50[data-state='in-progress'] {
  border-color: var(--oh-pill-rate-partial-border);
  background: var(--oh-pill-rate-partial-bg);
  color: var(--oh-pill-rate-partial-label);
}

._ratePill_t24g5_50[data-state='in-progress'] > strong {
  color: var(--oh-pill-rate-partial-value);
}

._ratePill_t24g5_50[data-state='done'] {
  border-color: var(--oh-pill-rate-complete-border);
  background: var(--oh-pill-rate-complete-bg);
  color: var(--oh-pill-rate-complete-label);
}

._ratePill_t24g5_50[data-state='done'] > strong {
  color: var(--oh-pill-rate-complete-value);
}

._timePill_t24g5_49 > strong,
._ratePill_t24g5_50 > strong {
  font-size: 0.86rem;
  font-weight: 700;
}

._dateRow_t24g5_108 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  row-gap: 8px;
  min-height: 2.25rem;
  margin-top: 21.5px;
  padding: 0 18px 0 19px;
}

._dateTitle_t24g5_118 {
  color: var(--oh-color-text-strong);
  font-size: 1.005rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

._refresh_t24g5_126 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 23px;
  height: 23px;
  margin-left: 7.5px;
  border: 1px solid var(--oh-color-line);
  border-radius: 50%;
  color: var(--oh-color-icon);
}

._refresh_t24g5_126::after {
  position: absolute;
  inset: -6px;
  content: '';
}

._viewSwitch_t24g5_147 {
  display: flex;
  flex: none;
  margin-left: auto;
  border-radius: var(--oh-radius-control);
  background: var(--oh-color-surface-muted);
}

._viewOption_t24g5_155 {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 3.5rem;
  min-height: 2.25rem;
  border: 1px solid transparent;
  border-radius: var(--oh-radius-control);
  color: var(--oh-color-text-disabled);
  font-size: 0.87rem;
}

._viewOption_t24g5_155[aria-pressed='true'] {
  min-width: 3.65625rem;
  border-color: var(--oh-color-border-strong);
  background: var(--oh-color-bg);
  color: var(--oh-color-text-strong);
  font-weight: 700;
}

._viewOption_t24g5_155[aria-disabled='true'] {
  cursor: default;
}

._week_t24g5_179 {
  margin-top: 12.5px;
}

._cards_t24g5_183 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 41px;
  padding: 0 17.5px;
}

._failure_t24g5_191 {
  margin-top: 41px;
  padding: 0 var(--oh-space-page);
  color: var(--oh-color-text-muted);
  font-size: 0.875rem;
}

._card_188b1_8 {
  --area-title: var(--oh-color-text-strong);
  --area-bar: var(--oh-color-text-faint);
  --area-fill: var(--oh-color-line);

  padding: 14.5px 16.5px 14.5px;
  border: 1px solid var(--oh-color-line);
  border-radius: 19px;
  background: var(--oh-color-bg);
  box-shadow: 0 1px 8px var(--oh-report-card-shadow);
}

._card_188b1_8[data-area='content'] {
  --area-title: var(--oh-area-content-text);
  --area-fill: var(--oh-report-content-fill);
}

._card_188b1_8[data-area='word'] {
  --area-title: var(--oh-report-word-title);
  --area-bar: var(--oh-report-word-bar);
  --area-fill: var(--oh-report-word-fill);
}

._card_188b1_8[data-area='sentence'] {
  --area-title: var(--oh-report-sentence-title);
  --area-bar: var(--oh-report-sentence-bar);
  --area-fill: var(--oh-report-sentence-fill);
}

._card_188b1_8[data-area='speaking'] {
  --area-title: var(--oh-report-speaking-title);
}

._title_188b1_41 {
  color: var(--area-title);
  font-size: 1.385rem;
  font-weight: 700;
  line-height: 2rem;
  white-space: nowrap;
}

._dashed_188b1_49 {
  height: 1px;
  background: repeating-linear-gradient(90deg, var(--oh-color-line) 0 3px, transparent 3px 6px);
}

._meterRow_188b1_54 {
  display: flex;
  align-items: center;
  min-height: 2.96875rem;
  padding: 1.5px 10px 0 9.5px;
  color: var(--oh-color-text-strong);
}

._meterName_188b1_62 {
  flex: none;
  width: 7.5625rem;
  font-size: 0.882rem;
  font-weight: 500;
  line-height: 1.25rem;
}

._meter_188b1_54 {
  display: flex;
  align-items: center;
  flex: 1;
  min-width: 0;
}

._meterFill_188b1_77 {
  flex: none;
  width: calc(27.7% * var(--meter-percent) / 100);
  height: 12px;
  border-radius: 6px;
  background: var(--area-fill);
}

._meterPercent_188b1_85 {
  margin-left: 4px;
  font-size: 0.94rem;
  font-weight: 700;
  line-height: 1.25rem;
}

._meterValue_188b1_92 {
  display: flex;
  align-items: baseline;
  flex: none;
  white-space: nowrap;
}

._mark_188b1_99 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 13.5px;
  height: 13.5px;
  border: 2.75px solid var(--oh-correct-text);
  border-radius: 50%;
  box-shadow: 0 0 2px var(--oh-verdict-correct-glow);
}

._mark_188b1_99[data-result='incorrect'] {
  border: 0;
  box-shadow: none;
  color: var(--oh-wrong-text);
}

._wrongCount_188b1_117 {
  display: block;
  color: var(--oh-wrong-text);
  font-size: 0.59rem;
  line-height: 0.75rem;
  white-space: nowrap;
}

._rows_1gjba_3 {
  margin-top: 17.75px;
  padding-bottom: 1.25px;
}

._time_1gjba_8 {
  color: var(--oh-report-number);
  font-size: 0.94rem;
  font-weight: 700;
}

._timeNote_1gjba_14 {
  margin-left: 4px;
  color: var(--oh-color-text-sub);
  font-size: 0.77rem;
}

._weakTitle_25x54_7 {
  margin-top: 4.5px;
  color: var(--oh-color-text-strong);
  font-size: 0.884rem;
  font-weight: 700;
  line-height: 1.5rem;
}

._weakList_25x54_15 {
  display: flex;
  flex-wrap: wrap;
  gap: 8.5px;
  margin-top: 10.25px;
}

._weak_25x54_7 {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 2.1875rem;
  padding: 0 11px 0 12.5px;
  border-radius: 1.09375rem;
  background: var(--oh-report-weak-bg);
  color: var(--oh-color-text-strong);
  font-size: 0.8665rem;
  font-weight: 700;
  white-space: nowrap;
}

._weakCount_25x54_36 {
  translate: 0 1.5px;
  color: var(--oh-verdict-wrong-text);
  font-size: 0.915rem;
}

._weakEnd_25x54_42 {
  margin-top: 13.75px;
}

._actions_25x54_46 {
  display: flex;
  gap: 9.5px;
  margin-top: 10.5px;
}

._explain_25x54_52,
._explainWrong_25x54_53 {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 2.75rem;
  border-radius: var(--oh-radius-button);
  background: var(--oh-color-bg);
  font-weight: 700;
  white-space: nowrap;
}

._explain_25x54_52 {
  flex: 1;
  min-width: 0;
  border: 1px solid var(--oh-button-outline-brand-border);
  box-shadow:
    inset 0 -1.5px 0 var(--oh-color-brand-glow),
    0 0 0 1.5px var(--oh-button-outline-brand-glow);
  color: var(--oh-color-brand-ink);
  font-size: 0.936rem;
}

._explainWrong_25x54_53 {
  flex: none;
  padding: 0 15.5px;
  border: 1px solid var(--oh-color-line);
  color: var(--oh-color-text-body);
  font-size: 0.944rem;
}

._explain_25x54_52[aria-disabled='true'],
._explainWrong_25x54_53[aria-disabled='true'],
._rowExplain_25x54_85[aria-disabled='true'] {
  cursor: default;
}

._table_25x54_89 {
  width: 100%;
  margin: 11.5px 0 3px;
  border: 1px solid var(--oh-color-line);
  border-spacing: 0;
  border-radius: 8px;
  table-layout: fixed;
}

._headSentence_25x54_98,
._headResult_25x54_99 {
  height: 2.765rem;
  padding: 0;
  background: var(--oh-color-surface-muted);
  color: var(--oh-color-text-strong);
  font-size: 1.01rem;
  font-weight: 400;
  text-align: center;
}

._headSentence_25x54_98 {
  border-top-left-radius: 7px;
}

._headResult_25x54_99 {
  width: 82.5px;
  border-top-right-radius: 7px;
  border-left: 1px solid var(--oh-color-line);
  font-weight: 700;
}

._row_25x54_85:active {
  background: var(--oh-color-row-hover);
}

@media (hover: hover) {
  ._row_25x54_85:hover {
    background: var(--oh-color-row-hover);
  }
}

._sentenceCell_25x54_130,
._resultCell_25x54_131 {
  border-top: 1px solid var(--oh-color-line);
  vertical-align: middle;
}

._sentenceCell_25x54_130 {
  padding: 9.25px 13px 11.5px;
  text-align: center;
}

._resultCell_25x54_131 {
  padding: 0;
  border-left: 1px solid var(--oh-color-line);
}

._sentence_25x54_130 {
  color: var(--oh-color-text-strong);
  font-size: 0.908rem;
  line-height: 1.34375rem;
}

._rowExplain_25x54_85 {
  display: block;
  margin: 9.75px auto 0;
  color: var(--oh-color-brand-ink);
  font-size: 0.8225rem;
  font-weight: 700;
  line-height: 1.25rem;
}

._result_25x54_131 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}

._table_1gz3c_6 {
  width: calc(100% - 3px);
  margin: 10px 1.5px 4.25px;
  border: 1px solid var(--oh-color-line);
  border-spacing: 0;
  border-radius: 8px;
  table-layout: fixed;
}

._cell_1gz3c_15 {
  padding: 10.6px 18px 10.6px 16px;
  vertical-align: middle;
}

._cell_1gz3c_15 + ._cell_1gz3c_15 {
  border-left: 1px solid var(--oh-color-line);
}

tr + tr > ._cell_1gz3c_15 {
  border-top: 1px solid var(--oh-color-line);
}

._entry_1gz3c_28 {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 6px;
}

._entry_1gz3c_28 > :last-child:not(._word_1gz3c_35) {
  margin-bottom: 3.4px;
}

._word_1gz3c_35 {
  min-width: 0;
  color: var(--oh-color-text-strong);
  font-size: 0.9rem;
  line-height: 1.265625rem;
}

._word_1gz3c_35 > span {
  margin-top: 1.6px;
  padding-bottom: 2.9px;
}

._entry_1gz3c_28[data-wrong='true'] > :last-child:not(._word_1gz3c_35) {
  margin-bottom: 2.1px;
}

._head_19yca_7 {
  display: flex;
  align-items: center;
  min-height: 2rem;
  line-height: 1;
  white-space: nowrap;
}

._headLabel_19yca_16 {
  margin-left: 11.5px;
  translate: 0 3px;
  color: var(--oh-color-text-sub);
  font-size: 0.77rem;
}

._headPercent_19yca_23 {
  margin-left: 7.5px;
  translate: 0 3.25px;
  color: var(--oh-color-text-strong);
  font-size: 1.286rem;
  font-weight: 700;
}

._headCount_19yca_31 {
  display: flex;
  align-items: baseline;
  margin-left: auto;
  translate: 0 1.5px;
}

._count_19yca_38 {
  color: var(--oh-report-number);
  font-size: 0.93rem;
  font-weight: 700;
}

._countTotal_19yca_44 {
  margin-left: 2.5px;
  color: var(--oh-color-text-sub);
  font-size: 0.79rem;
}

._bar_19yca_50 {
  height: 10px;
  margin-top: 11px;
}

._barFill_19yca_55 {
  display: block;
  height: 100%;
  border-radius: 5px;
  background: var(--area-bar);
  box-shadow: 0 1px 2px var(--oh-report-bar-shadow);
}

._rows_19yca_63 {
  margin-top: 19px;
}

._detailTitle_19yca_67 {
  margin-top: 30.75px;
  padding-bottom: 7.25px;
  border-bottom: 2px solid var(--area-bar);
  box-shadow: 0 1px 1px -0.5px var(--oh-report-bar-shadow);
  color: var(--oh-color-text-strong);
  font-size: 1.008rem;
  font-weight: 700;
  line-height: 1.5rem;
  text-align: center;
}

._stats_19yca_79 {
  display: flex;
  gap: 19.5px;
  margin-top: 9.5px;
  color: var(--oh-color-text-strong);
  font-size: 0.893rem;
  line-height: 1.5rem;
  white-space: nowrap;
}

._stats_19yca_79 strong {
  margin-left: 2px;
  font-size: 0.9rem;
  font-weight: 700;
}

._stats_19yca_79 > span + span strong {
  margin-left: 2.5px;
}

._statsTotal_19yca_99 {
  margin-left: 1.5px;
  font-size: 0.79rem;
}

._card_11b9b_7 {
  padding: 16.5px 22px 18.25px 23px;
  background: var(--oh-color-bg);
}

._card_11b9b_7 + ._card_11b9b_7 {
  border-top: 8px solid var(--oh-color-surface-muted);
}

._card_11b9b_7[data-selected='true'] {
  background: var(--oh-report-card-selected);
  box-shadow:
    inset 0 0 0 2px var(--oh-correct-text),
    0 0 0 1.5px var(--oh-verdict-correct-glow);
}

._head_11b9b_23 {
  display: flex;
  align-items: center;
  min-height: 3.1875rem;
}

._sentence_11b9b_29 {
  flex: 1;
  min-width: 0;
  color: var(--oh-color-text-strong);
  font-size: 0.972rem;
  font-weight: 600;
  line-height: 1.6875rem;
}

._sentence_11b9b_29 > [data-tone='good'],
._scoreValue_11b9b_39[data-tone='good'] {
  color: var(--oh-score-good);
}

._sentence_11b9b_29 > [data-tone='fair'],
._scoreValue_11b9b_39[data-tone='fair'] {
  color: var(--oh-score-fair);
}

._sentence_11b9b_29 > [data-tone='poor'],
._scoreValue_11b9b_39[data-tone='poor'] {
  color: var(--oh-score-poor);
}

._play_11b9b_53 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 48px;
  height: 48px;
  margin: 1.5px 0;
  border-radius: 50%;
  background: var(--oh-color-brand);
  box-shadow: 0 0 0 1.5px var(--oh-button-outline-brand-glow);
  color: var(--oh-color-text-inverse);
}

._play_11b9b_53[aria-disabled='true'] {
  cursor: default;
}

._playIcon_11b9b_71 {
  flex: none;
  margin-left: -2.5px;
}

._scoreArea_11b9b_76 {
  position: relative;
  margin-top: 15.25px;
}

._scores_11b9b_81 {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 4.5px;
  margin: 0;
}

._score_11b9b_39 {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 3.4375rem;
  padding-top: 8.5px;
  border-radius: 8px;
  background: var(--oh-color-surface-muted);
}

._scoreLabel_11b9b_98 {
  color: var(--oh-color-text-strong);
  font-size: 0.766rem;
  line-height: 1rem;
  white-space: nowrap;
}

._scoreValue_11b9b_39 {
  margin: 2px 0 0;
  color: var(--oh-color-text-strong);
  font-size: 0.94rem;
  font-weight: 700;
  line-height: 1.125rem;
}

._failed_11b9b_113 {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--oh-report-fail-veil);
  color: var(--oh-color-text-strong);
  font-size: 1.0076rem;
  line-height: 1.5rem;
  text-align: center;
  white-space: nowrap;
}

._head_1kn2e_10 {
  display: flex;
  align-items: center;
  min-height: 2rem;
  margin-top: 38px;
  color: var(--oh-color-text-strong);
  font-size: 0.886rem;
  white-space: nowrap;
}

._activity_1kn2e_20 {
  color: var(--area-title);
  font-size: 1.2545rem;
  font-weight: 700;
  line-height: 2rem;
}

._level_1kn2e_27 {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 26.5px;
  min-height: 1.375rem;
  margin-left: 7px;
  border-radius: 5px;
  background: var(--oh-color-surface-track);
  font-size: 0.76rem;
}

._average_1kn2e_39 {
  margin-left: 16.5px;
}

._analyzed_1kn2e_43 {
  margin-left: 16.5px;
}

._head_1kn2e_10 strong {
  margin-left: 1px;
  font-weight: 700;
}

._video_1kn2e_52 {
  width: 100%;
  margin-top: 17.75px;
  aspect-ratio: 16 / 9;
  border-radius: 8px;
}

._notice_1kn2e_59 {
  margin-top: 10.75px;
  color: var(--oh-wrong-text);
  font-size: 0.7636rem;
  line-height: 1.25rem;
  text-align: center;
}

._toggles_1kn2e_67,
._controls_1kn2e_68 {
  display: flex;
  align-items: center;
  gap: 8.5px;
}

._toggles_1kn2e_67 {
  margin-top: 8.25px;
}

._round_1kn2e_78 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 2.5rem;
  height: 2.5rem;
  border: 1px solid var(--oh-color-line);
  border-radius: 50%;
  background: var(--oh-color-bg);
  color: var(--oh-color-icon);
}

._round_1kn2e_78[data-muted='true'] {
  border-color: var(--oh-color-line-soft);
  color: var(--oh-color-text-muted);
}

._round_1kn2e_78[aria-disabled='true'],
._playAll_1kn2e_97[aria-disabled='true'] {
  cursor: default;
}

._roundIcon_1kn2e_101 {
  flex: none;
  width: 18px;
  height: 18px;
}

._audio_1kn2e_107 {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-top: 12px;
  aspect-ratio: 16 / 9;
  border: 1px solid var(--oh-color-line);
  border-radius: 8px;
  background: var(--oh-report-audio-bg);
}

._audioMark_1kn2e_120 {
  position: absolute;
  top: calc(50% - 53.5px);
  left: calc(50% - 17.25px);
  width: 34.5px;
  height: 34.5px;
  border-radius: 50%;
  background: var(--oh-report-audio-mark);
}

._playAll_1kn2e_97 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8.5px;
  width: 11.25rem;
  min-height: 4.03rem;
  padding: 0 0 1.5px 5.5px;
  border-radius: 29px;
  background: var(--oh-color-brand);
  translate: 0 -0.75px;
  box-shadow: 0 2px 3px var(--oh-report-bar-shadow);
  color: var(--oh-color-text-inverse);
  font-size: 1.39rem;
  font-weight: 700;
  white-space: nowrap;
}

._playAllIcon_1kn2e_149 {
  flex: none;
  margin-left: -8px;
  translate: 0 1.5px;
}

._audioNote_1kn2e_156 {
  position: absolute;
  top: calc(50% + 32.75px);
  left: 0;
  width: 100%;
  color: var(--oh-color-text-muted);
  font-size: 0.8855rem;
  font-weight: 500;
  line-height: 1.25rem;
  text-align: center;
}

._controls_1kn2e_68 {
  margin-top: 39px;
}

._volume_1kn2e_172 {
  display: flex;
  align-items: center;
  width: 239.5px;
  max-width: 100%;
  min-height: 2.5rem;
  padding: 0 10.5px 0 8.5px;
  border: 1px solid var(--oh-color-line);
  border-radius: 1.25rem;
  background: var(--oh-color-bg);
  color: var(--oh-color-icon);
}

._volumeTrack_1kn2e_185 {
  flex: 1;
  min-width: 0;
  height: 10px;
  margin-left: 10px;
  border-radius: 5px;
  background: var(--oh-color-line);
}

._volumeFill_1kn2e_194 {
  display: block;
  height: 100%;
  border-radius: 5px;
  background: var(--oh-color-brand);
}

._recorded_1kn2e_201 {
  margin-top: 23px;
  color: var(--oh-color-text-strong);
  font-size: 0.775rem;
  line-height: 0.875rem;
  text-align: right;
}

._cards_1kn2e_209 {
  margin: 1.5px -0.5px 1.5px;
}

._page_1e0i3_6 {
  min-height: 100dvh;
  background: var(--oh-color-bg);
}

html[data-layout='desktop'] ._page_1e0i3_6 {
  max-width: var(--oh-column-width);
  margin: 0 auto;
}

._head_1e0i3_16 {
  min-height: 98.5px;
  padding: 10px 10px 19.75px;
  border-bottom: 1px solid var(--oh-color-line);
}

._headRow_1e0i3_22 {
  display: flex;
  align-items: center;
  min-height: 2.75rem;
}

._close_1e0i3_28 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 2.75rem;
  height: 2.75rem;
  color: var(--oh-color-text-strong);
}

._student_1e0i3_38 {
  margin: 2px 0 0 0.5px;
  color: var(--oh-color-text-strong);
  font-size: 1.01rem;
  font-weight: 700;
  white-space: nowrap;
}

._lesson_1e0i3_46 {
  margin-top: -0.25px;
  color: var(--oh-color-text-strong);
  font-size: 1.019rem;
  line-height: 1.5rem;
  text-align: center;
}

._body_1e0i3_54 {
  padding: 18.5px 20px 20.5px;
}

._title_1e0i3_58 {
  color: var(--oh-color-text-strong);
  font-size: 1.258rem;
  font-weight: 700;
  line-height: 2rem;
}

._sections_1e0i3_65 {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 18px;
}

._failure_1e0i3_72 {
  padding: 40px 20px;
  color: var(--oh-color-text-sub);
  font-size: 0.892rem;
  text-align: center;
}

._picked_yk9lg_6 {
  min-height: 4.71875rem;
  margin-top: 15px;
  padding: 11px 13.5px 0;
  border-radius: 10px;
  background: var(--oh-wrong-surface);
}

._pickedLabel_yk9lg_14 {
  color: var(--oh-picked-label);
  font-size: 0.767rem;
  font-weight: 600;
  line-height: 1.3;
}

._pickedWord_yk9lg_21 {
  margin-top: 10px;
  color: var(--oh-picked-word);
  font-size: 1.27rem;
  font-weight: 700;
  line-height: 1.3;
}

._answerLabel_yk9lg_29 {
  margin-top: 14.5px;
  color: var(--oh-verdict-correct-text);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.3;
}

._wordRow_yk9lg_38 {
  display: flex;
  align-items: center;
  gap: 13px;
  min-height: 2.375rem;
  margin-top: 6px;
}

._wordRow_yk9lg_38[data-verdict='correct'] {
  margin-top: 14.5px;
}

._word_yk9lg_38 {
  min-width: 0;
  color: var(--oh-color-text-strong);
  font-size: 1.495rem;
  font-weight: 700;
  letter-spacing: 0.008em;
  line-height: 1.25;
}

._meaning_yk9lg_59 {
  margin-top: 7.5px;
  color: var(--oh-sheet-text-sub);
  font-size: 0.956rem;
  line-height: 1.5;
}

._meaning_yk9lg_59[data-last] {
  padding-bottom: 21px;
}

._note_yk9lg_70 {
  margin-top: 13px;
  color: var(--oh-sheet-text-note);
  font-size: 0.82rem;
  line-height: 1.5;
}

._emoji_yk9lg_77 {
  margin-left: 2px;
  font-size: 1.24em;
  line-height: 0;
  vertical-align: -0.08em;
}

._page_1e5bz_7 {
  display: flex;
  flex-direction: column;
  min-height: 100dvh;
  background: var(--oh-color-bg);
}

html[data-layout='desktop'] ._page_1e5bz_7,
html[data-layout='desktop'] ._failure_1e5bz_15 {
  max-width: var(--oh-column-width);
  margin: 0 auto;
}

._main_1e5bz_20 {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-width: 0;
}

._promptArea_1e5bz_27 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  min-height: 6rem;
  padding: 6px 20px 0;
}

._prompt_1e5bz_27 {
  max-width: 100%;
  color: var(--oh-color-text-strong);
  font-size: 1.97rem;
  font-weight: 700;
  letter-spacing: -0.023em;
  line-height: 1.5;
  word-break: normal;
}

._sendFailed_1e5bz_46 {
  padding: 0 20px 12px;
  color: var(--oh-wrong-text);
  font-size: 0.875rem;
  text-align: center;
}

._choices_1e5bz_53 {
  position: relative;
  display: flex;
  flex: none;
  flex-direction: column;
  gap: 5.75px;
  padding: 0 10px calc(9.5px + env(safe-area-inset-bottom));
}

._choices_1e5bz_53[data-band]::before {
  position: absolute;
  top: -10.5px;
  right: 0;
  bottom: 0;
  left: 0;
  content: '';
}

._choices_1e5bz_53[data-band='correct']::before {
  background: var(--oh-quiz-band-correct);
}

._choices_1e5bz_53[data-band='wrong']::before {
  background: var(--oh-quiz-band-wrong);
}

._choices_1e5bz_53 > li {
  position: relative;
}

._choice_1e5bz_53 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 3.90625rem;
  margin-bottom: 6px;
  padding: 1.5px 16px 0;
  border: 1px solid var(--oh-color-border);
  border-radius: 20px;
  background: var(--oh-color-bg);
  box-shadow: 0 6px 0 var(--oh-choice-ledge);
  color: var(--oh-color-text);
  font-size: 1.245rem;
  font-weight: 600;
  text-align: center;
  
  -webkit-tap-highlight-color: transparent;
}

._failure_1e5bz_15 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  min-height: 100dvh;
  padding: 0 20px;
  background: var(--oh-color-bg);
  color: var(--oh-color-text-muted);
  font-size: 0.875rem;
}

._failureLink_1e5bz_116 {
  color: var(--oh-color-brand-deep);
  font-weight: 700;
}