.conversation-page{width:100%;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.breadcrumb-row{justify-content:flex-start;align-items:center;gap:8px;max-width:1200px;margin:0 auto;padding:0 1rem;display:flex}.page-header-main{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:100;background:#fffffff2;border-bottom:1px solid #e0e0e080;width:100%;max-width:1200px;margin:auto auto 6px;padding:.25rem 0;position:sticky;top:0;box-shadow:0 2px 20px #00000014}.dark .page-header-main{background:#0f172af2;border-bottom-color:#33415580;box-shadow:0 2px 20px #0000004d}.header-tabs{scrollbar-width:none;-ms-overflow-style:none;align-items:center;gap:.625rem;padding:0;display:flex;overflow-x:auto}.header-tabs::-webkit-scrollbar{display:none}.tab-icon{color:#667eea;flex-shrink:0;width:16px;height:16px}.dark .tab-icon{color:#818cf8}.tab-link{flex-shrink:0;text-decoration:none}.tab-button{color:#6b7280;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);white-space:nowrap;background:#fffc;border:1px solid #6b728033;border-radius:1.5rem;align-items:center;gap:.375rem;min-height:32px;padding:.375rem .875rem;font-size:.8125rem;font-weight:600;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;box-shadow:0 2px 8px #0000000d}.dark .tab-button{color:#94a3b8;background:#1e293bcc;border-color:#47556966}.tab-button:hover:not(.active):not(:disabled){color:#667eea;background:#667eea1a;border-color:#667eea4d}.dark .tab-button:hover:not(.active):not(:disabled){color:#a5b4fc;background:#6366f126;border-color:#6366f166}.tab-button.active{color:#fff;background:linear-gradient(135deg,#4299e1 0%,#3182ce 100%);border-color:#0000;box-shadow:0 4px 14px #4299e166}.tab-button.done:not(.active){color:#276749;background:linear-gradient(135deg,#f0fff4 0%,#e6ffee 100%);border-color:#38a169}.dark .tab-button.done:not(.active){color:#4ade80;background:#16a34a26;border-color:#22c55e66}.tab-button.done:not(.active):hover{background:linear-gradient(135deg,#e6ffee 0%,#c6f6d5 100%);border-color:#2f855a}.tab-button.active.done{color:#fff;background:linear-gradient(135deg,#38a169 0%,#2f855a 100%);border-color:#2f855a;box-shadow:0 10px 30px #38a1694d}.done-badge{align-items:center;margin-left:2px;display:flex}.done-icon{color:#38a169;width:16px;height:16px}.tab-button.active .done-icon{color:#fff}.tab-text{flex-shrink:0}.conversation-page .container{max-width:1200px;margin:0 auto;padding:0 1rem}.main-content{min-height:700px;padding:0 0 60px}.content-layout,.conversation-page .content-layout{grid-template-columns:minmax(0,1fr) 280px;align-items:start;gap:20px;margin-top:.75rem;display:grid}@media (max-width:1024px){.content-layout,.conversation-page .content-layout{grid-template-columns:1fr}}.conversation-main{flex-direction:column;flex:1;gap:12px;min-width:0;display:flex}.lesson-tabs-wrap{background:#fff;border:1px solid #e8edf3;border-radius:14px;padding:8px;box-shadow:0 2px 8px #0000000a}.dark .lesson-tabs-wrap{background:#1e293b;border-color:#334155;box-shadow:0 2px 8px #0003}.lesson-tabs-scroll{scrollbar-width:thin;scrollbar-color:#cbd5e1 transparent;gap:6px;padding-bottom:2px;display:flex;overflow-x:auto}.lesson-tabs-scroll::-webkit-scrollbar{height:4px}.lesson-tabs-scroll::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}.lesson-tab{color:#64748b;cursor:pointer;white-space:nowrap;background:#f8fafc;border:1.5px solid #0000;border-radius:10px;flex-shrink:0;align-items:center;gap:6px;padding:8px 14px;font-size:.82rem;font-weight:500;text-decoration:none;transition:all .2s;display:flex}.dark .lesson-tab{color:#94a3b8;background:#0f172a}.lesson-tab:hover{color:#4f46e5;background:#f0f4ff;border-color:#c7d2fe}.dark .lesson-tab:hover{color:#818cf8;background:#1e1b4b;border-color:#4338ca}.lesson-tab.active{color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);border-color:#0000;font-weight:600;box-shadow:0 3px 12px #667eea4d}.dark .lesson-tab.active{color:#fff;background:linear-gradient(135deg,#6366f1,#8b5cf6);border-color:#0000;box-shadow:0 3px 12px #6366f166}.lesson-tab-name{text-overflow:ellipsis;max-width:240px;overflow:hidden}.lesson-tab-count{text-align:center;background:#00000014;border-radius:99px;min-width:20px;padding:1px 7px;font-size:.7rem;font-weight:700}.dark .lesson-tab-count{color:#cbd5e1;background:#ffffff1a}.lesson-tab.active .lesson-tab-count{color:#fff;background:#ffffff40}.conversation-area{flex-direction:column;flex:1;gap:14px;min-width:0;display:flex}.conversation-area .lesson-header{background:#fff;border:1px solid #e8edf3;border-radius:16px;align-items:center;gap:14px;padding:14px 18px;display:flex;box-shadow:0 2px 10px #0000000d}.dark .conversation-area .lesson-header{background:#0f172a;border-color:#1e293b;box-shadow:0 4px 16px #00000040}.conversation-area .lesson-icon-wrap{color:#3b82f6;background:#f0f4ff;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.dark .conversation-area .lesson-icon-wrap{color:#60a5fa;background:#3b82f626}.conversation-area .lesson-meta{flex:1;min-width:0}.conversation-area .lesson-eyebrow{text-transform:uppercase;letter-spacing:.8px;color:#94a3b8;margin-bottom:3px;font-size:11px;font-weight:700}.dark .conversation-area .lesson-eyebrow{color:#64748b}.conversation-area .lesson-title{color:#1e293b;white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:17px;font-weight:700;line-height:1.3;overflow:hidden}.dark .conversation-area .lesson-title{color:#f1f5f9}.conversation-area .lesson-actions{flex-shrink:0;align-items:center;gap:8px;display:flex}.play-btn{color:#fff;cursor:pointer;white-space:nowrap;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;border-radius:50px;align-items:center;gap:8px;padding:9px 18px 9px 14px;font-size:13px;font-weight:600;transition:all .2s;display:inline-flex;position:relative;box-shadow:0 4px 14px #667eea4d}.play-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 20px #667eea66}.play-btn:disabled{opacity:.45;cursor:not-allowed}.play-btn.playing{background:linear-gradient(135deg,#10b981,#059669);animation:2.5s ease-in-out infinite pulse-glow;box-shadow:0 4px 14px #10b98159}.play-btn.paused{background:linear-gradient(135deg,#f59e0b,#d97706);box-shadow:0 4px 14px #f59e0b59}@keyframes pulse-glow{0%,to{box-shadow:0 4px 14px #10b98159}50%{box-shadow:0 4px 22px #10b98199}}.play-btn-icon{background:#fff3;border-radius:50%;justify-content:center;align-items:center;width:26px;height:26px;display:flex}.live-dot{background:#fff;border-radius:50%;width:7px;height:7px;animation:1.4s ease-in-out infinite dot-blink;position:absolute;top:6px;right:7px}@keyframes dot-blink{0%,to{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.75)}}.settings-btn{cursor:pointer;color:#64748b;background:#fff;border:1.5px solid #e2e8f0;border-radius:10px;justify-content:center;align-items:center;width:38px;height:38px;transition:all .18s;display:flex}.dark .settings-btn{color:#94a3b8;background:#1e293b;border-color:#334155}.settings-btn:hover{color:#fff;background:#667eea;border-color:#667eea;transform:rotate(30deg)}.vocab-icon-btn{cursor:pointer;color:#3182ce;background:#ebf8ff;border:1.5px solid #bee3f8;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;gap:6px;height:38px;padding:0 12px;font-size:.82rem;font-weight:600;transition:all .18s;display:flex}.dark .vocab-icon-btn{color:#60a5fa;background:#3182ce26;border-color:#3182ce66}.vocab-btn-text{display:none}@media (min-width:768px){.vocab-btn-text{display:inline}}.vocab-icon-btn:hover{color:#fff;background:#3182ce;border-color:#3182ce}.video-icon-btn{cursor:pointer;color:#0f172a;background:#fff;border:1.5px solid #dbe4ee;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;gap:6px;height:38px;padding:0 12px;font-size:.82rem;font-weight:600;transition:all .18s;display:flex}.dark .video-icon-btn{color:#f1f5f9;background:#1e293b;border-color:#334155}.video-icon-btn:hover:not(:disabled){background:#fff5f5;border-color:#ef444459}.dark .video-icon-btn:hover:not(:disabled){background:#ef444426}.video-icon-btn:disabled{opacity:.55;cursor:not-allowed}.video-yt-red{color:#ef4444}.fav-heart-btn{cursor:pointer;color:#94a3b8;background:#fff;border:1.5px solid #e2e8f0;border-radius:10px;justify-content:center;align-items:center;width:38px;height:38px;transition:all .25s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}.dark .fav-heart-btn{color:#64748b;background:#1e293b;border-color:#334155}.fav-heart-btn:hover{color:#ec4899;border-color:#f9a8d4;transform:translateY(-1px);box-shadow:0 4px 12px #ec489926}.fav-heart-btn.active{color:#ec4899;background:linear-gradient(135deg,#fdf2f8,#fce7f3);border-color:#f472b6;box-shadow:0 2px 10px #ec489933}.dark .fav-heart-btn.active{background:#ec48992e;border-color:#ec4899}.conversation-legend{color:#475569;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;flex-direction:column;gap:8px;padding:10px 14px;font-size:.8rem;display:flex}.dark .conversation-legend{color:#94a3b8;background:#0f172a;border-color:#1e293b}.legend-items{flex-direction:column;gap:8px;width:100%;display:flex}.legend-row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.legend-hsk-row{border-top:1px dashed #e2e8f0;flex-wrap:wrap;align-items:center;gap:8px;padding-top:6px;display:flex}.dark .legend-hsk-row{border-top-color:#334155}.legend-item{align-items:center;gap:6px;display:flex}.legend-info-icon{color:#3b82f6;flex-shrink:0}.legend-label{color:#1e293b;font-weight:700}.dark .legend-label{color:#f1f5f9}.legend-word-sample{font-weight:700;font-family:var(--chinese-font,"LXGW WenKai", "Noto Sans SC", sans-serif);padding:0 2px}.legend-word-sample.blue-gradient{background:linear-gradient(135deg,#4299e1 0%,#3182ce 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.legend-word-sample.red-sample{color:#dc2626}.legend-word-sample.purple-gradient{background:linear-gradient(135deg,#a855f7 0%,#6d28d9 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.legend-text{font-weight:500}.legend-divider{background:#cbd5e1;width:1px;height:12px}.dark .legend-divider{background:#334155}.switch-btn.mini{cursor:pointer;vertical-align:middle;background:#cbd5e1;border:none;border-radius:9999px;width:32px;height:18px;padding:0;transition:background-color .2s;display:inline-block;position:relative}.switch-btn.mini.active{background:#10b981}.switch-handle{background:#fff;border-radius:50%;width:14px;height:14px;transition:transform .2s;position:absolute;top:2px;left:2px;box-shadow:0 1px 3px #00000026}.switch-btn.mini.active .switch-handle{transform:translate(14px)}.legend-hsk-btn{cursor:pointer;border:none;border-radius:4px;padding:2px 6px;font-size:11px;font-weight:700;transition:all .15s}.legend-hsk-btn.inactive{color:#64748b!important;opacity:.6!important;background-color:#e2e8f0!important;text-decoration:none!important}.dark .legend-hsk-btn.inactive{color:#94a3b8!important;background-color:#334155!important}.character-container.level-1 .hanzi,.character-container.level-1 span.hanzi{text-underline-offset:4px!important;-webkit-text-decoration:underline wavy #16a34a!important;text-decoration:underline wavy #16a34a!important;text-decoration-thickness:1.5px!important}.character-container.level-2 .hanzi,.character-container.level-2 span.hanzi{text-underline-offset:4px!important;-webkit-text-decoration:underline wavy #0284c7!important;text-decoration:underline wavy #0284c7!important;text-decoration-thickness:1.5px!important}.character-container.level-3 .hanzi,.character-container.level-3 span.hanzi{text-underline-offset:4px!important;-webkit-text-decoration:underline wavy #2563eb!important;text-decoration:underline wavy #2563eb!important;text-decoration-thickness:1.5px!important}.character-container.level-4 .hanzi,.character-container.level-4 span.hanzi{text-underline-offset:4px!important;-webkit-text-decoration:underline wavy #d97706!important;text-decoration:underline wavy #d97706!important;text-decoration-thickness:1.5px!important}.character-container.level-5 .hanzi,.character-container.level-5 span.hanzi{text-underline-offset:4px!important;-webkit-text-decoration:underline wavy #9333ea!important;text-decoration:underline wavy #9333ea!important;text-decoration-thickness:1.5px!important}.character-container.level-6 .hanzi,.character-container.level-6 span.hanzi{text-underline-offset:4px!important;-webkit-text-decoration:underline wavy #e11d48!important;text-decoration:underline wavy #e11d48!important;text-decoration-thickness:1.5px!important}.character-container.level-7 .hanzi,.character-container.level-8 .hanzi,.character-container.level-9 .hanzi,.character-container.level-7 span.hanzi,.character-container.level-8 span.hanzi,.character-container.level-9 span.hanzi{text-underline-offset:4px!important;-webkit-text-decoration:underline wavy #991b1b!important;text-decoration:underline wavy #991b1b!important;text-decoration-thickness:1.5px!important}.conversation-content{scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:#cbd5e1 transparent;background:#fff;border:1px solid #e8edf3;border-radius:16px;height:620px;padding:10px;overflow-y:auto;box-shadow:0 2px 10px #0000000a}.dark .conversation-content{scrollbar-color:#334155 transparent;background:#0f172a;border-color:#1e293b}.conversation-content::-webkit-scrollbar{width:6px}.conversation-content::-webkit-scrollbar-track{background:0 0}.conversation-content::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:6px}.dark .conversation-content::-webkit-scrollbar-thumb{background:#334155}.empty-state{color:#94a3b8;flex-direction:column;justify-content:center;align-items:center;gap:12px;height:100%;font-size:14px;display:flex}.conversation-area .dialogue-item{cursor:pointer;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#fffffff2;border:2px solid #e2e8f0cc;border-radius:.75rem;align-items:flex-start;gap:.75rem;margin-bottom:.75rem;padding:.5rem;scroll-margin:15px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden;box-shadow:0 2px 8px #0000000a}.dark .conversation-area .dialogue-item{background:#0f172af2;border-color:#1e293bcc}.conversation-area .dialogue-item:before{content:"";opacity:0;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);width:4px;height:100%;transition:opacity .3s;position:absolute;top:0;left:0}.conversation-area .dialogue-item:hover{background:#fff;border-color:#667eea66;transform:translate(2px);box-shadow:0 6px 16px #667eea1f}.dark .dialogue-item:hover{background:#1e293b;border-color:#667eea80}.dialogue-item:hover:before{opacity:.6}.dialogue-item.active{background:#667eea14;border-color:#667eea80;transform:translate(4px);box-shadow:0 8px 24px #667eea33}.dark .dialogue-item.active{background:#667eea26}.dialogue-item.active:before{opacity:1}.dialogue-item.playing{background:#10b9810a;border-color:#10b98166}.dark .dialogue-item.playing{background:#10b9811a}.dialogue-item.playing:before{opacity:1;background:linear-gradient(135deg,#10b981 0%,#059669 100%)}.character-avatar{flex-direction:column;flex-shrink:0;align-items:center;gap:.25rem;min-width:48px;display:flex}.character-avatar svg{color:#6b7280;transition:color .3s}.character-name{color:#6b7280;text-align:center;font-size:.75rem;font-weight:600;transition:color .3s}.dialogue-item.character-li .character-avatar svg,.dialogue-item.character-li .character-name{color:#3b82f6!important}.dialogue-item.character-wang .character-avatar svg,.dialogue-item.character-wang .character-name{color:#10b981!important}.dialogue-item.character-zhang .character-avatar svg,.dialogue-item.character-zhang .character-name{color:#f59e0b!important}.dialogue-item.character-chen .character-avatar svg,.dialogue-item.character-chen .character-name{color:#ef4444!important}.dialogue-item.character-default .character-avatar svg,.dialogue-item.character-default .character-name{color:#8b5cf6!important}.content-wrapper{flex:1;justify-content:space-between;align-items:flex-start;gap:.75rem;min-width:0;min-height:48px;display:flex}.text-content{flex-direction:column;flex:1;min-width:0;display:flex}.chinese-text-fallback{color:#1f2937;margin-bottom:.5rem;font-family:Noto Sans SC,Source Han Sans SC,PingFang SC,Microsoft YaHei,sans-serif;font-size:1.375rem;font-weight:600;line-height:1.4}.dark .chinese-text-fallback{color:#f1f5f9}.translation-wrap{flex-direction:column;gap:4px;margin-top:5px;display:flex}.translation-text{color:#4b5563;border-radius:.5rem;padding-left:.3rem;font-size:15px;line-height:1.45}.dark .translation-text{color:#cbd5e1}.english-text{color:#475569;font-style:italic}.dark .english-text{color:#94a3b8}.sentence-note-chip{color:#4c1d95;background:#f8fafc;border:1px solid #e9d5ff;border-left:3px solid #a855f7;border-radius:10px;align-items:flex-start;gap:.45rem;max-width:min(100%,760px);margin-top:.55rem;padding:.55rem .7rem;font-size:.82rem;line-height:1.55;display:inline-flex}.dark .sentence-note-chip{color:#d8b4fe;background:#a855f71a;border-color:#a855f74d}.sentence-note-icon{color:#7c3aed;flex-shrink:0;margin-top:.12rem}.dark .sentence-note-icon{color:#a855f7}.sentence-note-body{overflow-wrap:anywhere}.action-btns{flex-direction:column;flex-shrink:0;align-self:center;gap:6px;display:flex}.vocab-btn,.note-btn,.fav-btn{cursor:pointer;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:26px;height:26px;transition:all .2s;display:flex}.vocab-btn{color:#3182ce;background:#ebf8ff;border:1.5px solid #bee3f8}.vocab-btn:hover{color:#fff;background:#3182ce;border-color:#3182ce;transform:scale(1.1)}.dark .vocab-btn{color:#60a5fa;background:#3182ce26;border-color:#3182ce66}.note-btn{color:#7c3aed;background:#faf5ff;border:1.5px solid #ddd6fe}.note-btn:hover,.note-btn.active{color:#6d28d9;background:#f3e8ff;border-color:#c4b5fd;transform:scale(1.1)}.dark .note-btn{color:#a78bfa;background:#7c3aed26;border-color:#7c3aed66}.fav-btn{color:#94a3b8;background:#fff;border:1.5px solid #e2e8f0}.fav-btn:hover{color:#ec4899;transform:scale(1.15);box-shadow:0 3px 10px #ec489926}.fav-btn.active{color:#ec4899;background:linear-gradient(135deg,#fdf2f8,#fce7f3);border-color:#f472b6;box-shadow:0 2px 8px #ec489933}.dark .fav-btn{color:#64748b;background:#1e293b;border-color:#334155}.dark .fav-btn.active{background:#ec489926;border-color:#ec4899}.modal-backdrop{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:1000;background:#0f172a8c;justify-content:center;align-items:center;padding:1rem;animation:.2s ease-out fadeIn;display:flex;position:fixed;inset:0}.settings-modal{background:#fff;border-radius:1.25rem;flex-direction:column;width:100%;max-width:540px;max-height:88vh;animation:.25s ease-out slideUp;display:flex;overflow:hidden;box-shadow:0 20px 60px #0000002e}.dark .settings-modal{background:#0f172a;border:1px solid #1e293b;box-shadow:0 20px 60px #00000080}.settings-header{background:linear-gradient(135deg,#4299e1 0%,#2b6cb0 100%);border-bottom:1px solid #f1f5f9;flex-shrink:0;justify-content:space-between;align-items:center;padding:.875rem 1.125rem;display:flex}.dark .settings-header{border-bottom-color:#1e293b}.settings-header-left{color:#fff;letter-spacing:.01em;align-items:center;gap:.5rem;font-size:.95rem;font-weight:700;display:flex}.settings-header-icon{color:#fff;background:#fff3;border-radius:8px;justify-content:center;align-items:center;width:30px;height:30px;display:flex}.close-btn{color:#fff;cursor:pointer;background:#ffffff2e;border:none;border-radius:50%;justify-content:center;align-items:center;width:30px;height:30px;transition:background .2s;display:flex}.close-btn:hover{background:#ffffff4d}.settings-body{flex-direction:column;gap:.625rem;padding:.875rem 1rem;display:flex;overflow-y:auto}.s-block{background:#f8fafc;border:1px solid #e9edf5;border-radius:.875rem;flex-direction:column;gap:.625rem;padding:.75rem .875rem;display:flex}.dark .s-block{background:#1e293b;border-color:#334155}.s-block-label{text-transform:uppercase;letter-spacing:.07em;color:#94a3b8;align-items:center;gap:.35rem;font-size:.72rem;font-weight:700;display:flex}.s-badge{color:#fff;background:linear-gradient(135deg,#4299e1 0%,#2b6cb0 100%);border-radius:999px;margin-left:auto;padding:.1rem .55rem;font-size:.72rem;font-weight:700}.s-display-grid{grid-template-columns:1fr 1fr;gap:.4rem;display:grid}.s-display-chip{color:#64748b;cursor:pointer;text-align:center;-webkit-user-select:none;user-select:none;background:#fff;border:1.5px solid #e2e8f0;border-radius:.6rem;padding:.45rem .6rem;font-size:.8rem;font-weight:500;transition:all .15s}.dark .s-display-chip{color:#94a3b8;background:#0f172a;border-color:#334155}.s-display-chip:hover{color:#4f46e5;border-color:#90cdf4}.s-display-chip.active{color:#fff;background:linear-gradient(135deg,#4299e1,#2b6cb0);border-color:#0000;box-shadow:0 2px 8px #667eea4d}.s-toggle-list{flex-direction:column;gap:0;display:flex}.s-toggle-row{cursor:pointer;border-bottom:1px solid #f1f5f9;justify-content:space-between;align-items:center;padding:.55rem 0;display:flex}.dark .s-toggle-row{border-bottom-color:#334155}.s-toggle-row:last-child{border-bottom:none}.s-toggle-info{color:#374151;align-items:center;gap:.5rem;font-size:.855rem;font-weight:500;display:flex}.dark .s-toggle-info{color:#e2e8f0}.s-switch{flex-shrink:0;position:relative}.s-switch-input{opacity:0;width:0;height:0;position:absolute}.s-switch-track{cursor:pointer;background:#cbd5e1;border-radius:11px;width:40px;height:22px;transition:background .2s;display:block;position:relative}.dark .s-switch-track{background:#475569}.s-switch-track:after{content:"";background:#fff;border-radius:50%;width:16px;height:16px;transition:transform .2s;position:absolute;top:3px;left:3px;box-shadow:0 1px 4px #0000002e}.s-switch-input:checked+.s-switch-track{background:linear-gradient(135deg,#4299e1,#2b6cb0)}.s-switch-input:checked+.s-switch-track:after{transform:translate(18px)}.s-two-col{grid-template-columns:1fr 1fr;gap:.625rem;display:grid}.s-chip-grid{flex-wrap:wrap;gap:.35rem;display:flex}.s-chip{color:#64748b;cursor:pointer;background:#fff;border:1.5px solid #e2e8f0;border-radius:999px;padding:.3rem .7rem;font-size:.78rem;font-weight:600;transition:all .15s}.dark .s-chip{color:#94a3b8;background:#0f172a;border-color:#334155}.s-chip:hover:not(.active){color:#4f46e5;border-color:#90cdf4}.s-chip.active{color:#fff;background:linear-gradient(135deg,#4299e1,#2b6cb0);border-color:#0000;box-shadow:0 2px 6px #667eea4d}.s-font-row{gap:.4rem;display:flex}.s-font-btn{color:#64748b;cursor:pointer;background:#fff;border:1.5px solid #e2e8f0;border-radius:.6rem;flex-direction:column;flex:1;align-items:center;gap:.2rem;padding:.55rem .25rem;transition:all .15s;display:flex}.dark .s-font-btn{color:#94a3b8;background:#0f172a;border-color:#334155}.s-font-btn:hover:not(.active){color:#4f46e5;border-color:#90cdf4}.s-font-btn.active{color:#fff;background:linear-gradient(135deg,#4299e1,#2b6cb0);border-color:#0000;box-shadow:0 2px 6px #667eea4d}.s-font-lbl{font-size:.68rem;font-weight:700}.s-speed-row{flex-wrap:wrap;gap:.35rem;display:flex}.s-speed-btn{color:#64748b;cursor:pointer;text-align:center;background:#fff;border:1.5px solid #e2e8f0;border-radius:.6rem;flex:1;min-width:52px;padding:.4rem .3rem;font-size:.8rem;font-weight:600;transition:all .15s}.dark .s-speed-btn{color:#94a3b8;background:#0f172a;border-color:#334155}.s-speed-btn:hover:not(.active){color:#4f46e5;border-color:#90cdf4}.s-speed-btn.active{color:#fff;background:linear-gradient(135deg,#4299e1,#2b6cb0);border-color:#0000;box-shadow:0 2px 6px #667eea4d}.s-seg{gap:.4rem;display:flex}.s-seg-item{color:#64748b;cursor:pointer;background:#fff;border:1.5px solid #e2e8f0;border-radius:.6rem;flex:1;justify-content:center;align-items:center;gap:.35rem;padding:.45rem .6rem;font-size:.82rem;font-weight:600;transition:all .15s;display:flex}.dark .s-seg-item{color:#94a3b8;background:#0f172a;border-color:#334155}.s-seg-item.active{color:#fff;background:linear-gradient(135deg,#4299e1,#2b6cb0);border-color:#0000;box-shadow:0 2px 6px #667eea4d}@media (max-width:768px){.conversation-area .lesson-header{flex-wrap:wrap;gap:10px;padding:12px 14px}.conversation-area .lesson-title{white-space:normal;font-size:15px}.lesson-actions{flex-wrap:wrap;width:100%}.play-btn-label{display:none}.play-btn{padding:9px 12px}.conversation-content{height:480px}.dialogue-item{border-width:1.5px;gap:.5rem;margin-bottom:.5rem;padding:.875rem}.character-avatar{min-width:40px}.content-wrapper{gap:.75rem}.s-two-col{grid-template-columns:1fr}.vocab-footer{flex-direction:column;align-items:stretch}.vocab-footer-btns{width:100%}.vocab-practice-btn,.vocab-pdf-btn,.vocab-flashcard-btn,.vocab-video-btn{flex:1;justify-content:center}}@media (max-width:480px){.dialogue-item{border-width:1px;gap:.375rem;padding:.75rem}.character-avatar{min-width:36px}.content-wrapper{gap:.5rem}.s-display-grid{grid-template-columns:1fr}}
