.writing-category-page-container{background-color:var(--theme-bg-primary,#f8f9fa);min-height:100vh;transition:background-color .3s}.main-title-container{text-align:center;background-color:var(--theme-card-bg,#fff);border-bottom:1px solid var(--theme-border,#e9ecef);padding:20px 10px 10px;transition:background-color .3s,border-color .3s}.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,#343a40);margin:0;font-size:24px;font-weight:700;transition:color .3s}.title-actions{align-items:center;gap:8px;display:flex}.monthly-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}.monthly-btn{background-color:#007aff}.history-btn{background-color:#6c5ce7}.monthly-btn:hover{background-color:#0056b3}.history-btn:hover{background-color:#5746cf}.monthly-btn:active,.history-btn:active{transform:scale(.97)}.page-subtitle{color:var(--theme-text-secondary,#6c757d);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}.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-sidebar-bg,var(--theme-card-bg,#fff));border:1px solid var(--theme-border,#e9ecef);cursor:pointer;width:32px;height:50px;color:var(--theme-text-primary,#343a40);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-color:var(--theme-bg-secondary,#f8f9fa);border-color:var(--theme-accent,#007aff);color:var(--theme-accent,#007aff);transform:translate(2px)}.sidebar-wrapper.sidebar-collapsed .sidebar-toggle-btn{border-left:1px solid var(--theme-border,#e9ecef);border-radius:6px}.sidebar{background-color:var(--theme-sidebar-bg,var(--theme-card-bg,#fff));border-right:1px solid var(--theme-border,#e9ecef);flex-shrink:0;width:260px;height:calc(100vh - 60px);padding:15px 7px;transition:background-color .3s,border-color .3s;overflow-y:auto}.tache-group{margin-bottom:5px}.tache-title{color:var(--theme-text-primary,#343a40);cursor:pointer;border-radius:4px;justify-content:space-between;align-items:center;margin:0;padding:12px 10px;font-size:17px;font-weight:600;transition:all .25s ease-in-out;display:flex}.tache-title:hover{background-color:var(--theme-bg-secondary,#f1f3f5);color:var(--theme-accent,#0056b3)}.tache-title.active{color:#fff;background-color:var(--theme-accent,#007aff);box-shadow:0 2px 5px #007aff33}.arrow{border:solid var(--theme-text-secondary,#495057);border-width:0 2px 2px 0;padding:3px;transition:border-color .3s,transform .3s;display:inline-block}.tache-title.active .arrow{border-color:#fff}.arrow.right{transform:rotate(-45deg)}.arrow.down{transform:rotate(45deg)}.chapter-list{border-left:1px solid var(--theme-border,#e9ecef);margin:0;padding:0 0 0 10px;list-style-type:none;transition:border-color .3s}.chapter-item{color:var(--theme-text-secondary,#6c757d);cursor:pointer;border-radius:4px;justify-content:flex-start;align-items:center;margin:3px 0;padding:10px 12px;font-size:15px;transition:all .2s ease-in-out;display:flex;position:relative}.chapter-item:hover{background-color:var(--theme-bg-secondary,#f8f9fa);color:var(--theme-accent,#007aff)}.chapter-item.active{background-color:var(--theme-bg-tertiary,#e9f5ff);color:var(--theme-accent,#007aff);font-weight:600}.content-wrapper{background-color:var(--theme-bg-primary,transparent);flex-grow:1;width:100%;padding:20px;transition:background-color .3s}.empty-state{text-align:center;color:var(--theme-text-secondary,#888);padding:60px 20px;font-size:16px;transition:color .3s}.questions-list{flex-direction:column;gap:20px;display:flex}.question-card{background-color:var(--theme-card-bg,#fff);border-radius:8px;padding:20px;transition:box-shadow .3s,background-color .3s;box-shadow:0 2px 6px #0000000d}.question-card:hover{box-shadow:0 4px 12px #00000014}.question-header{border-bottom:1px solid var(--theme-border,#f1f3f5);margin-bottom:10px;padding-bottom:10px;transition:border-color .3s}.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-title-fr{color:var(--theme-text-primary,#2c3e50);margin:0;font-weight:600;transition:color .3s;display:block}.question-body{margin-bottom:15px}.question-body p{color:var(--theme-text-primary,#34495e);white-space:pre-line;margin:0 0 10px;line-height:1.7;transition:color .3s}.question-text-lang{color:var(--theme-text-secondary,#888);margin-top:7px;transition:color .3s}.answer-section{margin-top:15px}.answer-textarea{border:1px solid var(--theme-border,#dcdfe6);background-color:var(--theme-card-bg,#fdfdfd);width:100%;height:220px;color:var(--theme-text-primary,#000);resize:vertical;border-radius:4px;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}.answer-textarea:focus{border-color:var(--theme-accent,#007aff);outline:none;box-shadow:0 0 0 2px #007aff1a}.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.writing-category-actions{flex-wrap:nowrap;flex:auto;align-items:center;gap:4px;min-width:0;display:flex}.right-actions.writing-category-actions .action-button,.right-actions.writing-category-actions .ai-model-select{min-width:72px}.right-actions.writing-category-actions .ai-model-select{flex:0 0 230px;min-width:0;margin-right:0}.right-actions.writing-category-actions .ocr-button{min-width:84px}.word-count,.timer{color:#909399;background-color:#f4f4f9;border-radius:10px;padding:4px 8px;font-size:14px}.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}.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%)}.sample-button{background-color:#28a745}.sample-button:hover{background-color:#218838}.sample-essay-container{background-color:var(--theme-bg-secondary,#f8f9fa);border:1px solid var(--theme-border,#e9ecef);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,#495057);font-style:italic;transition:color .3s}.sample-essay-lang{color:var(--theme-text-secondary,#6c757d);margin-top:7px;transition:color .3s}@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.writing-category-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;width:100%;display:grid}.right-actions.writing-category-actions .ai-model-select{grid-column:1/-1;width:100%;min-width:0}.right-actions.writing-category-actions .action-button{width:100%;min-width:0}}@media (max-width:768px){.writing-category-page-container{gap:10px;padding:10px}.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}.title-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;width:100%;display:grid}.history-btn,.monthly-btn{width:100%;min-width:0;padding:6px 12px;font-size:12px}.action-bar{flex-direction:column;align-items:stretch;gap:8px}.answer-textarea{height:190px}.left-actions{justify-content:flex-start}.right-actions,.right-actions.writing-category-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;width:100%;display:grid}.right-actions .ai-model-select{grid-column:1/-1;width:100%;min-width:0;height:32px;margin-right:0;padding:4px 7px;font-size:11px}.right-actions .action-button{width:100%;min-width:0;padding:4px 6px;font-size:11px}.question-top-controls{flex-wrap:nowrap;gap:6px}.question-top-controls .font-size-controls{flex:none;gap:3px;min-width:0;padding:3px 6px}.question-top-controls .font-size-btn{min-width:32px;padding:3px 8px;font-size:12px}.question-top-controls .font-size-display{min-width:35px;font-size:11px}.question-top-controls .translation-toggle-btn{text-align:center;flex:auto;min-width:0;padding:5px 10px;font-size:12px}}@media (max-width:480px){.answer-textarea{height:160px}.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}.right-actions.writing-category-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}}.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)}