.speaking-page-container{background-color:var(--theme-bg-primary);min-height:100vh;transition:background-color .3s}.main-title-container{text-align:center;border-bottom:1px solid var(--theme-border);padding:20px 10px 10px;transition:background-color .3s,border-color .3s;background-color:var(--theme-bg-primary)!important}.main-title-container>.practice-skill-nav{margin-left:auto;margin-right:auto}.title-header{justify-content:space-between;align-items:center;gap:20px;margin-bottom:10px;display:flex;position:relative}.title-header>.sidebar-toggle-btn-in-header{flex-shrink:0;position:absolute;left:0}.title-header>.page-title{text-align:center;flex:1}@media (min-width:769px){.title-header{justify-content:flex-end;min-height:44px}.title-header>.page-title{width:max-content;max-width:calc(100% - 260px);margin:0;position:absolute;left:50%;transform:translate(-50%)}}.page-title{color:var(--theme-text-primary);margin:0;font-size:24px;font-weight:700;transition:color .3s}.title-actions{align-items:center;gap:8px;display:flex}.category-btn,.history-btn{color:#fff;cursor:pointer;box-sizing:border-box;white-space:nowrap;border:none;border-radius:6px;justify-content:center;align-items:center;min-width:100px;padding:8px 20px;font-size:14px;font-weight:500;line-height:1.2;transition:background-color .2s,transform .1s;display:inline-flex}.category-btn{background-color:#007aff}.history-btn{background-color:#6c5ce7}.category-btn:hover{background-color:#0056b3}.history-btn:hover{background-color:#5746cf}.category-btn:active,.history-btn:active{transform:scale(.97)}.page-subtitle{color:var(--theme-text-secondary);max-width:90%;margin-top:7px;margin-left:auto;margin-right:auto;font-size:13px;line-height:1.5;transition:color .3s}.content-grid{flex-direction:row;align-items:flex-start;max-width:1400px;margin:0 auto;display:flex;position:relative}.sidebar-wrapper{flex-shrink:0;align-items:flex-start;gap:0;display:flex;position:relative}.sidebar-container{width:260px;transition:width .3s,opacity .3s,margin .3s;overflow:hidden}.sidebar-container.collapsed{opacity:0;pointer-events:none;width:0;margin:0}.sidebar-toggle-btn{background:var(--theme-card-bg);border:1px solid var(--theme-border);cursor:pointer;width:32px;height:50px;color:var(--theme-text-primary);z-index:1000;border-left:none;border-radius:0 6px 6px 0;flex-shrink:0;justify-content:center;align-self:flex-start;align-items:center;margin-top:100px;padding:0;font-size:16px;transition:all .3s;display:flex;box-shadow:2px 2px 8px #0000001a}.sidebar-toggle-btn:hover{background:var(--theme-bg-secondary);border-color:var(--theme-accent);color:var(--theme-accent);transform:translate(2px)}.sidebar-wrapper.sidebar-collapsed .sidebar-toggle-btn{border-left:1px solid var(--theme-border);border-radius:6px}.sidebar{border-right:1px solid var(--theme-border);flex-shrink:0;width:260px;height:calc(100vh - 60px);padding:15px 7px;transition:background-color .3s,border-color .3s;overflow-y:auto;background-color:var(--theme-sidebar-bg)!important}.month-group{margin-bottom:5px}.month-item{color:var(--theme-text-primary);cursor:pointer;border-radius:6px;margin:0;padding:12px 10px;font-size:16px;font-weight:500;transition:all .3s}.month-item:hover{background-color:var(--theme-bg-tertiary);color:var(--theme-accent)}.month-item.active{background-color:var(--theme-accent);color:#fff;transform:translate(2px);box-shadow:0 2px 5px #007aff33}.content-wrapper{background-color:var(--theme-bg-primary);flex-grow:1;width:100%;padding:20px;transition:background-color .3s}.empty-state{text-align:center;color:var(--theme-text-secondary);padding:60px 20px;font-size:16px;transition:color .3s}.questions-list{flex-direction:column;gap:20px;display:flex}.question-card{border-radius:8px;padding:20px;transition:box-shadow .3s,background-color .3s;box-shadow:0 2px 6px #0000000d;background-color:var(--theme-card-bg)!important}.question-card:hover{box-shadow:0 4px 12px #00000014}.part-header{color:var(--theme-text-secondary);justify-content:space-between;align-items:center;margin-bottom:5px;font-size:14px;transition:color .3s;display:flex}.part-info{font-weight:600}.subject-info{font-style:italic}.font-size-controls{background-color:var(--theme-bg-secondary);border-radius:var(--radius-md);border:1px solid var(--theme-border);align-items:center;gap:4px;padding:4px 8px;display:flex}.font-size-btn{border:1px solid var(--theme-border);border-radius:var(--radius-md);background-color:var(--theme-card-bg);min-width:36px;color:var(--theme-text-primary);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;box-shadow:var(--shadow-sm);padding:4px 10px;font-size:14px;font-weight:600}.font-size-btn:hover:not(:disabled){background-color:var(--theme-bg-tertiary);border-color:var(--theme-accent);color:var(--theme-accent)}.font-size-btn:disabled{opacity:.4;cursor:not-allowed}.font-size-display{color:var(--theme-text-secondary);text-align:center;min-width:40px;font-size:12px;font-weight:500}.translation-toggle-btn{border:1px solid var(--theme-border);background-color:var(--theme-card-bg);color:var(--theme-text-primary);cursor:pointer;white-space:nowrap;border-radius:6px;padding:6px 12px;font-size:13px;font-weight:500;transition:all .2s}.translation-toggle-btn:hover{background-color:var(--theme-bg-secondary);border-color:var(--theme-accent);color:var(--theme-accent)}.translation-toggle-btn:active{transform:scale(.98)}.question-top-controls{flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px;display:flex}.clear-highlights-btn-inline{color:#d9363e;background-color:#fff1f0;border-color:#ffccc7}.clear-highlights-btn-inline:hover{color:#cf1322;background-color:#ffe1df;border-color:#ff7875}.question-header{border-bottom:1px solid var(--theme-border);margin-bottom:10px;padding-bottom:10px;transition:border-color .3s}.question-title-fr{margin:0;font-weight:600;transition:color .3s;display:block;color:var(--theme-text-primary)!important}.question-header>.question-title-fr,.question-header>.question-text-lang{display:none}.question-body{margin-bottom:15px}.question-body p{color:var(--theme-text-primary);white-space:pre-line;margin:0 0 10px;line-height:1.7;transition:color .3s}.question-text-fr{white-space:pre-line;margin:0 0 10px;font-weight:500;line-height:1.7;transition:color .3s;color:var(--theme-text-primary)!important}.question-text-lang{margin-top:7px;font-weight:500;transition:color .3s;color:var(--theme-text-primary)!important}.answer-section{margin-top:15px}.answer-textarea{border:1px solid var(--theme-border);resize:vertical;border-radius:4px;width:100%;height:200px;margin-top:15px;padding:10px;font-family:inherit;font-size:15px;line-height:1.6;transition:border-color .2s,box-shadow .2s,background-color .3s,color .3s;background-color:var(--theme-bg-secondary)!important;color:var(--theme-text-primary)!important}.answer-textarea:focus{border-color:var(--theme-accent);outline:none;box-shadow:0 0 0 2px #1890ff1a}.answer-textarea::placeholder{color:var(--theme-text-tertiary);opacity:.7}.action-bar{justify-content:flex-start;align-items:center;gap:8px;margin-top:10px;display:flex}.left-actions,.right-actions{align-items:center;gap:10px;display:flex}.right-actions.speaking-question-actions{flex-wrap:nowrap;flex:auto;align-items:center;gap:4px;min-width:0;display:flex}.right-actions.speaking-question-actions .action-button,.right-actions.speaking-question-actions .ai-model-select{min-width:72px}.right-actions.speaking-question-actions .ai-model-select{flex:0 0 230px;min-width:0;margin-right:0}.right-actions.speaking-question-actions .ocr-button{min-width:84px}.word-count{color:var(--theme-text-secondary);background-color:var(--theme-bg-tertiary);border-radius:10px;padding:4px 8px;font-size:14px;transition:color .3s,background-color .3s}.action-button{color:#fff;letter-spacing:.2px;cursor:pointer;white-space:nowrap;border:none;border-radius:8px;justify-content:center;align-items:center;padding:5px 12px;font-size:13px;font-weight:700;line-height:1.2;transition:background-color .2s,transform .1s,box-shadow .2s;display:inline-flex}.action-button:active{transform:scale(.97)}.action-button:disabled{cursor:not-allowed;box-shadow:none;color:#4b5563!important;background:#e5e7eb!important}.ai-assist-actions{flex-wrap:wrap;gap:8px;display:flex}.ai-assist-hint{color:#667085;margin-top:8px;font-size:12px;line-height:1.45}.save-button{background:linear-gradient(135deg,#2563eb 0%,#1d4ed8 100%);box-shadow:0 2px 8px #2563eb40}.save-button:hover:not(:disabled){background:linear-gradient(135deg,#1d4ed8 0%,#1e40af 100%)}.copy-button{background:linear-gradient(135deg,#334155 0%,#1f2937 100%);box-shadow:0 2px 8px #1f293738}.copy-button:hover:not(:disabled){background:linear-gradient(135deg,#1f2937 0%,#111827 100%)}.record-button{background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);box-shadow:0 2px 8px #dc262647}.record-button:hover:not(:disabled){background:linear-gradient(135deg,#dc2626 0%,#b91c1c 100%)}.record-stop-button{background:linear-gradient(135deg,#f97316 0%,#ea580c 100%);box-shadow:0 2px 8px #ea580c47}.record-stop-button:hover:not(:disabled){background:linear-gradient(135deg,#ea580c 0%,#c2410c 100%)}.sample-button{background-color:#28a745}.sample-button:hover{background-color:#218838}.sample-essay-container{background-color:var(--theme-bg-secondary);border:1px solid var(--theme-border);border-radius:4px;margin-top:15px;padding:15px;transition:background-color .3s,border-color .3s;animation:.5s fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.sample-essay-container p{white-space:pre-line;margin:0 0 10px;line-height:1.7}.sample-essay-fr{color:var(--theme-text-primary);font-style:italic;transition:color .3s}.sample-essay-lang{color:var(--theme-text-secondary);margin-top:7px;transition:color .3s}.recording-hint{color:#0958d9;background:#e6f4ff;border:1px solid #91caff;border-radius:6px;margin-top:10px;padding:6px 10px;font-size:13px;line-height:1.5}.recording-hint.error{color:#a8071a;background:#fff1f0;border-color:#ffccc7}.recording-interim{color:#1f2937;font-style:italic}.recording-playback{flex-wrap:wrap;align-items:center;gap:10px;margin-top:10px;display:flex}.recording-playback audio{width:100%;max-width:320px}.delete-record-button{background:linear-gradient(135deg,#6b7280 0%,#4b5563 100%);box-shadow:0 2px 8px #4b556340}.delete-record-button:hover:not(:disabled){background:linear-gradient(135deg,#4b5563 0%,#374151 100%)}@media (max-width:1024px){.action-bar{grid-template-columns:1fr;align-items:stretch;gap:6px;display:grid}.left-actions{justify-content:flex-start;width:100%}.right-actions.speaking-question-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;width:100%;display:grid}.right-actions.speaking-question-actions .ai-model-select{grid-column:1/-1;width:100%;min-width:0}.right-actions.speaking-question-actions .action-button{width:100%;min-width:0}.content-grid{padding:0 15px}.sidebar-container{width:220px}.content-wrapper{padding:15px}.page-title{font-size:22px}.category-btn,.history-btn{min-width:90px;padding:7px 16px;font-size:13px}.question-card{padding:18px}}@media (max-width:768px){.main-title-container{padding:15px 8px 8px}.title-header{flex-direction:column;gap:12px;margin-bottom:8px}.page-title{font-size:20px}.page-subtitle{max-width:95%;font-size:12px}.title-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;width:100%;display:grid}.category-btn,.history-btn{width:100%;min-width:0;padding:6px 12px;font-size:12px}.content-grid{flex-direction:column;gap:0;padding:0}.sidebar-wrapper{order:1;height:auto;min-height:auto;position:relative}.sidebar-container{z-index:9999;background:var(--theme-card-bg);border-right:1px solid var(--theme-border);border-radius:0;width:280px;max-width:85vw;height:100vh;margin:0;transition:transform .3s;position:fixed;top:0;left:0;transform:translate(-100%);box-shadow:2px 0 8px #00000026}.sidebar-container:not(.collapsed){transform:translate(0)}.sidebar{width:100%;height:100vh;max-height:100vh}.sidebar-overlay{z-index:9998;opacity:0;visibility:hidden;pointer-events:none;background-color:#00000080;transition:opacity .3s,visibility .3s;position:fixed;inset:0}.sidebar-overlay.active{opacity:1;visibility:visible;pointer-events:all}.main-title-container{z-index:1;background:var(--theme-bg);order:1;position:relative}.title-header>.sidebar-toggle-btn-in-header{z-index:10000;background:var(--theme-card-bg);position:absolute;left:0}.title-header>.sidebar-toggle-btn-in-header:hover{background:var(--theme-bg-secondary);border-color:var(--theme-accent);color:var(--theme-accent)}.content-wrapper{order:2;width:100%;padding:15px}.question-card{padding:15px}.part-header{flex-direction:column;align-items:flex-start;gap:6px;font-size:13px}.font-size-controls{gap:3px;padding:3px 6px}.font-size-btn{min-width:32px;padding:3px 8px;font-size:12px}.font-size-display{min-width:35px;font-size:11px}.question-top-controls{flex-wrap:nowrap;gap:6px}.question-top-controls .font-size-controls{flex:none;min-width:0}.question-top-controls .translation-toggle-btn{text-align:center;flex:auto;min-width:0;padding:5px 10px;font-size:12px}.answer-textarea{height:170px;padding:8px;font-size:14px}.action-bar{flex-direction:column;align-items:stretch;gap:8px}.left-actions,.right-actions{flex-wrap:wrap;justify-content:flex-start}.right-actions.speaking-question-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;width:100%;display:grid}.right-actions.speaking-question-actions .ai-model-select{grid-column:1/-1;width:100%;min-width:0;height:32px}.right-actions.speaking-question-actions .action-button{width:100%;min-width:0;padding:4px 6px}.word-count{padding:3px 6px;font-size:12px}.action-button{padding:4px 6px;font-size:11px}.ai-assist-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px!important;display:grid!important}.ai-assist-actions .action-button{width:100%;min-width:0;padding:4px 6px;font-size:12px}}@media (max-width:480px){.main-title-container{padding:12px 6px 6px}.page-title{font-size:18px}.page-subtitle{font-size:11px}.category-btn,.history-btn{min-width:0;padding:5px 10px;font-size:11px}.question-top-controls{gap:4px}.question-top-controls .font-size-controls{gap:2px;padding:2px 4px}.question-top-controls .font-size-btn{min-width:26px;padding:2px 6px;font-size:11px}.question-top-controls .font-size-display{min-width:28px;font-size:10px}.question-top-controls .translation-toggle-btn{border-radius:8px;padding:4px 7px;font-size:10px}.content-wrapper,.question-card{padding:12px}.part-header{font-size:12px}.answer-textarea{height:150px;font-size:13px}.action-button{padding:3px 6px;font-size:10px}.right-actions.speaking-question-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}.right-actions.speaking-question-actions .ai-model-select{height:30px;padding:4px 7px;font-size:11px}.ai-assist-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.ai-assist-hint{font-size:11px;line-height:1.5}.sidebar-toggle-btn{width:45px;height:45px;bottom:8px}}.ai-model-select{border:1px solid var(--theme-border);background:var(--theme-card-bg);color:var(--theme-text-primary);cursor:pointer;border-radius:4px;outline:none;min-width:180px;height:32px;margin-right:10px;padding:6px 12px;font-size:14px;font-weight:500;transition:all .3s}.ai-model-select:hover{border-color:var(--theme-accent);box-shadow:0 2px 4px #0000001a}.ai-model-select:focus{border-color:var(--theme-accent);box-shadow:0 0 0 3px #1890ff1a}.ai-grading-button{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%)}.ai-grading-button:hover:not(:disabled){background:linear-gradient(135deg,#764ba2 0%,#667eea 100%);transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.ai-grading-button:disabled{opacity:.6;cursor:not-allowed}.ai-grading-container{background:linear-gradient(135deg,#f8f9ff 0%,#f0f2ff 100%);border:2px solid #667eea33;border-radius:8px;margin-top:15px;padding:20px;transition:all .3s;animation:.5s fadeIn}.ai-grading-header{border-bottom:2px solid #667eea33;justify-content:space-between;align-items:center;margin-bottom:15px;padding-bottom:10px;display:flex}.ai-grading-header h4{color:var(--theme-text-primary);margin:0;font-size:18px;font-weight:700}.close-grading-btn{color:var(--theme-text-secondary);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px 8px;font-size:20px;transition:all .3s}.close-grading-btn:hover{color:var(--theme-text-primary);background:#667eea1a}.ai-grading-content{color:var(--theme-text-primary);word-wrap:break-word;width:100%;max-height:none;padding:10px 0;line-height:1.8;overflow:auto visible}.ai-grading-content.plain-text-content{max-height:none;line-height:1.6;overflow:visible}.plain-text-wrapper{color:var(--theme-text-primary);width:100%}.plain-text-line{word-wrap:break-word;white-space:pre-wrap;margin-bottom:4px;line-height:1.6}.ai-correct-essay-section{border-top:2px solid #667eea33;margin-top:20px;padding-top:20px}.correct-essay-title{color:var(--theme-text-primary);margin:0 0 12px;font-size:18px;font-weight:700}.ai-correct-essay-content{color:var(--theme-text-primary);background:#667eea0d;border:1px solid #667eea33;border-radius:8px;padding:15px;line-height:1.8}.ai-corrected-essay-section{border-top:2px solid #ffc1074d;margin-top:20px;padding-top:20px}.corrected-essay-title{color:var(--theme-text-primary);margin:0 0 12px;font-size:18px;font-weight:700}.ai-corrected-essay-content{color:var(--theme-text-primary);word-wrap:break-word;background:#ffc10714;border:1px solid #ffc1074d;border-radius:8px;max-height:none;padding:15px;line-height:1.8;overflow:visible}.ai-corrected-essay-content pre{white-space:pre-wrap;word-wrap:break-word;max-height:none;overflow:visible}.corrected-highlight{color:#d32f2f;background-color:#ffeb3b;border-radius:3px;padding:2px 4px;font-weight:600;box-shadow:0 1px 2px #0000001a}.api-key-overlay{z-index:10000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.api-key-panel{background:var(--theme-card-bg,#fff);border-radius:16px;width:90%;max-width:500px;padding:24px;position:relative;box-shadow:0 8px 32px #0003}.api-key-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.api-key-header h3{color:var(--theme-text-primary);margin:0;font-size:20px;font-weight:700}.api-key-close-btn{color:var(--theme-text-secondary);cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;padding:0;font-size:24px;transition:all .3s;display:flex}.api-key-close-btn:hover{background:var(--theme-bg-tertiary);color:var(--theme-text-primary)}.api-key-input-group{margin-bottom:16px}.api-key-input{border:2px solid var(--theme-border,#e0e0e0);background:var(--theme-bg-primary,#fff);width:100%;color:var(--theme-text-primary,#000);box-sizing:border-box;border-radius:8px;padding:12px 16px;font-size:14px;transition:all .3s}.api-key-input:focus{border-color:#667eea;outline:none;box-shadow:0 0 0 3px #667eea1a}.api-key-actions{gap:12px;margin-bottom:16px;display:flex}.api-key-save-btn,.api-key-cancel-btn{cursor:pointer;border:none;border-radius:8px;flex:1;padding:12px 20px;font-size:14px;font-weight:600;transition:all .3s}.api-key-save-btn{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%)}.api-key-save-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.api-key-cancel-btn{background:var(--theme-bg-tertiary,#f0f2f5);color:var(--theme-text-primary,#000)}.api-key-cancel-btn:hover{background:var(--theme-border,#e0e0e0)}.api-key-hint{color:var(--theme-text-secondary);text-align:center;font-size:12px;line-height:1.6}.api-key-hint p{margin:4px 0}.api-key-link{color:#667eea;font-weight:600;text-decoration:none;transition:color .3s}.api-key-link:hover{color:#764ba2;text-decoration:underline}[data-theme=black] .ai-model-select{background:var(--theme-card-bg,#1a1a1a);border-color:var(--theme-border,#404040);color:var(--theme-text-primary,#fff)}[data-theme=black] .ai-model-select:hover{border-color:#667eea}[data-theme=black] .ai-grading-container{background:linear-gradient(135deg,#2d2d2d 0%,#1a1a1a 100%);border-color:#667eea4d}[data-theme=black] .ai-grading-header{border-bottom-color:#667eea4d}[data-theme=black] .ai-grading-header h4,[data-theme=black] .ai-grading-content{color:var(--theme-text-primary,#fff)}[data-theme=black] .close-grading-btn{color:var(--theme-text-secondary,#e0e0e0)}[data-theme=black] .close-grading-btn:hover{color:var(--theme-text-primary,#fff);background:#667eea33}[data-theme=black] .ai-correct-essay-content{color:var(--theme-text-primary,#fff);background:#667eea1a;border-color:#667eea4d}[data-theme=black] .ai-corrected-essay-content{color:var(--theme-text-primary,#fff);background:#ffc10726;border-color:#ffc10766}[data-theme=black] .corrected-highlight{color:#fff;background-color:#ffc107;box-shadow:0 1px 3px #ffc1074d}[data-theme=black] .api-key-panel{background:var(--theme-card-bg,#1a1a1a);border:1px solid var(--theme-border,#404040)}[data-theme=black] .api-key-input{background:var(--theme-bg-primary,#2a2a2a);border-color:var(--theme-border,#404040);color:var(--theme-text-primary,#fff)}[data-theme=black] .api-key-cancel-btn{background:var(--theme-bg-tertiary,#2a2a2a);color:var(--theme-text-primary,#fff)}