*{box-sizing:border-box;margin:0;padding:0}body{color:var(--text-color);background-color:var(--bg-color);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.6;transition:background-color .3s,color .3s}.container{max-width:900px;margin:0 auto;padding:20px}h1{text-align:center;color:var(--text-color);margin-bottom:20px}.language-selector{justify-content:center;margin-bottom:20px;display:flex}.language-selector a{color:var(--primary-color);border-radius:4px;margin:0 5px;padding:8px 16px;text-decoration:none;transition:background-color .3s}.language-selector a:hover{background-color:var(--lighter-bg)}.language-selector a.active{background-color:var(--primary-color);color:#fff}.form-group{margin-bottom:15px}.checkbox-group{align-items:center;margin-bottom:10px;display:flex}.checkbox-group input[type=checkbox]{cursor:pointer;width:18px;height:18px;margin-right:10px}.checkbox-group label{cursor:pointer;color:var(--text-color);font-weight:400;display:inline}label{color:var(--text-color);margin-bottom:5px;font-weight:600;display:block}select{border:1px solid var(--border-color);background-color:var(--bg-color);width:100%;color:var(--text-color);border-radius:4px;padding:10px;font-size:16px}button{background-color:var(--primary-color);color:#fff;cursor:pointer;border:none;border-radius:4px;padding:10px 15px;font-size:16px;transition:background-color .3s}button:hover{background-color:var(--primary-hover)}#generate-btn{background-color:var(--success-color);width:100%;margin-top:10px}.hidden{display:none}#loading{text-align:center;color:var(--text-color);padding:30px}.spinner{border:4px solid var(--spinner-border);border-top:4px solid var(--primary-color);border-radius:50%;width:40px;height:40px;margin:0 auto 15px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}#progress-indicator{background-color:var(--primary-color);width:0%;height:100%;transition:width .3s}#exercise-title{color:var(--text-color);margin-bottom:10px}#exercise-description{background-color:var(--card-bg);box-shadow:var(--card-shadow);color:var(--text-color);border-radius:5px;margin-bottom:15px;padding:15px}.editor-container{margin-bottom:15px}#code-editor{border:1px solid var(--border-color);border-radius:5px}.button-group{gap:10px;margin-bottom:15px;display:flex}#run-btn{background-color:var(--info-color)}#run-btn:hover{background-color:var(--info-color);opacity:.9}#check-btn{background-color:var(--warning-color)}#check-btn:hover{background-color:var(--warning-color);opacity:.9}#next-btn{background-color:var(--success-color)}#next-btn:hover{background-color:var(--success-hover)}#console-output{background-color:var(--code-bg);color:var(--text-color);border:1px solid var(--border-color);border-radius:5px;margin-bottom:15px;padding:15px}#output{white-space:pre-wrap;font-family:monospace}#feedback{background-color:var(--light-bg);border-radius:5px;margin-bottom:15px;padding:15px}#results{text-align:center;background-color:var(--card-bg);box-shadow:var(--card-shadow);color:var(--text-color);border-radius:5px;padding:20px}#score{color:var(--text-color);margin-bottom:15px;font-size:18px}#restart-btn{background-color:var(--danger-color)}#restart-btn:hover{background-color:var(--danger-color);opacity:.9}.typing-trainer{width:100%;max-width:900px;margin:0 auto}.typing-trainer .description{color:var(--text-color);margin-bottom:20px;line-height:1.5}.typing-trainer .start-btn{background-color:var(--success-color);width:100%;margin-top:15px}.typing-trainer .start-btn:hover{background-color:var(--success-hover)}.typing-trainer .start-btn:disabled{background-color:var(--secondary-color);cursor:not-allowed}.typing-example-panel{background-color:var(--card-bg);box-shadow:var(--card-shadow);border-radius:5px;margin-bottom:20px;padding:20px}.example-description{background-color:var(--light-bg);color:var(--text-color);border-radius:5px;margin-bottom:20px;padding:15px}.code-example-container,.user-input-container{margin-bottom:20px}.code-example-container h3,.user-input-container h3{color:var(--text-color);margin-bottom:10px}.code-example-editor,.user-input-editor{border:1px solid var(--border-color);border-radius:5px;margin-bottom:15px}.typing-stats{background-color:var(--light-bg);border-radius:5px;margin-bottom:20px;padding:15px}.typing-stats h3{color:var(--text-color);margin-top:0;margin-bottom:15px}.stats-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:15px;display:grid}.stat-item{flex-direction:column;display:flex}.stat-label{color:var(--secondary-color);margin-bottom:5px;font-size:14px}.stat-value{color:var(--text-color);font-size:18px;font-weight:700}.typing-controls{flex-direction:column;align-items:center;display:flex}.completion-message{text-align:center;margin-bottom:20px}.completion-message h3{color:var(--success-color);margin-bottom:10px}.next-example-btn,.restart-btn{cursor:pointer;border-radius:4px;padding:10px 20px;font-size:16px;transition:background-color .3s}.next-example-btn{background-color:var(--success-color);color:#fff}.next-example-btn:hover{background-color:var(--success-hover)}.restart-btn{background-color:var(--warning-color);color:#212529}.restart-btn:hover{background-color:var(--warning-color);opacity:.9}.char-correct{color:var(--success-color)}.char-error{color:var(--danger-color);text-decoration:underline}.char-pending{color:var(--text-color);opacity:.5}:root{--bg-color:#fff;--text-color:#333;--border-color:#ddd;--primary-color:#007bff;--primary-hover:#0056b3;--secondary-color:#6c757d;--success-color:#28a745;--success-hover:#218838;--info-color:#17a2b8;--warning-color:#ffc107;--danger-color:#dc3545;--light-bg:#f8f9fa;--lighter-bg:#f0f0f0;--card-bg:#fff;--card-shadow:0 2px 4px #0000001a;--card-hover-shadow:0 5px 15px #0000001a;--tag-bg:#f0f0f0;--tag-color:#666;--spinner-border:#0000001a;--code-bg:#f8f9fa;--table-header-bg:#f2f2f2;--table-border:#ddd;--table-even-row:#f8f9fa}[data-theme=dark]{--bg-color:#1e1e1e;--text-color:#e0e0e0;--border-color:#444;--primary-color:#0d6efd;--primary-hover:#0b5ed7;--secondary-color:#6c757d;--success-color:#198754;--success-hover:#157347;--info-color:#0dcaf0;--warning-color:#ffc107;--danger-color:#dc3545;--light-bg:#2d2d2d;--lighter-bg:#383838;--card-bg:#2d2d2d;--card-shadow:0 2px 4px #0000004d;--card-hover-shadow:0 5px 15px #00000080;--tag-bg:#444;--tag-color:#e0e0e0;--spinner-border:#ffffff1a;--code-bg:#2d2d2d;--table-header-bg:#383838;--table-border:#444;--table-even-row:#333}.container{background-color:var(--bg-color);color:var(--text-color);transition:background-color .3s,color .3s}h1,h2,h3,h4,h5,h6,.form-group label{color:var(--text-color)}.form-group select,.form-group input[type=text],.form-group input[type=number]{background-color:var(--bg-color);color:var(--text-color);border:1px solid var(--border-color)}.setup-panel{background-color:var(--card-bg);box-shadow:var(--card-shadow);border-radius:8px;margin-bottom:20px;padding:20px}#generate-btn{background-color:var(--primary-color);color:#fff;cursor:pointer;border:none;border-radius:4px;padding:10px 20px;transition:background-color .3s}#generate-btn:hover{background-color:var(--primary-hover)}.progress-bar{background-color:var(--light-bg);border-radius:4px;height:10px;margin-bottom:20px;overflow:hidden}#progress-indicator{background-color:var(--primary-color);height:100%;transition:width .3s}.button-group{gap:10px;margin:15px 0;display:flex}.button-group button{cursor:pointer;border:none;border-radius:4px;padding:8px 16px;transition:background-color .3s}#run-btn{background-color:var(--info-color);color:#fff}#check-btn{background-color:var(--primary-color);color:#fff}#next-btn{background-color:var(--success-color);color:#fff}#restart-btn{background-color:var(--primary-color);color:#fff;cursor:pointer;border:none;border-radius:4px;padding:10px 20px}#console-output,#feedback{background-color:var(--light-bg);border-radius:8px;margin-top:15px;padding:15px}#console-output h3,#feedback h3{margin-top:0}#output{background-color:var(--code-bg);white-space:pre-wrap;border-radius:4px;padding:10px;font-family:monospace;overflow-x:auto}#feedback.success{border-left:4px solid var(--success-color);background-color:#1987541a}#feedback.error{border-left:4px solid var(--danger-color);background-color:#dc35451a}#results{text-align:center;background-color:var(--card-bg);box-shadow:var(--card-shadow);border-radius:8px;padding:30px}#score{margin-bottom:20px;font-size:18px}.theme-switcher{align-items:center;margin-left:15px;display:flex}.theme-switcher button{cursor:pointer;color:var(--text-color);background:0 0;border:none;padding:5px;font-size:20px;transition:transform .3s}.theme-switcher button:hover{transform:rotate(30deg)}.mode-switcher{border-bottom:1px solid var(--border-color);justify-content:center;margin-bottom:20px;padding-bottom:10px;display:flex}.mode-switcher button{background-color:var(--lighter-bg);border:1px solid var(--border-color);cursor:pointer;color:var(--text-color);border-radius:4px;margin:0 5px;padding:8px 16px;font-size:14px;transition:all .3s}.mode-switcher button.active{background-color:var(--primary-color);color:#fff;border-color:var(--primary-hover)}.mode-switcher button:hover:not(.active){background-color:var(--light-bg)}.exercise-manager{width:100%;max-width:1200px;color:var(--text-color);margin:0 auto}.exercise-manager .controls{flex-wrap:wrap;justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.exercise-manager .filters{flex-wrap:wrap;gap:15px;display:flex}.exercise-manager .create-btn{background-color:var(--success-color);color:#fff;cursor:pointer;border:none;border-radius:4px;padding:8px 16px;font-size:14px;transition:background-color .3s}.exercise-manager .create-btn:hover{background-color:var(--success-hover)}.exercise-list{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin-top:20px;display:grid}.exercise-card,.exercise-item{border:1px solid var(--border-color);background-color:var(--card-bg);box-shadow:var(--card-shadow);border-radius:8px;padding:15px;transition:transform .3s,box-shadow .3s}.exercise-card:hover,.exercise-item:hover{box-shadow:var(--card-hover-shadow);transform:translateY(-5px)}.exercise-card h3,.exercise-item h3,.exercise-header h3{color:var(--text-color);margin-top:0;margin-bottom:10px;font-size:18px}.exercise-card .tags,.exercise-tags{flex-wrap:wrap;gap:5px;margin-bottom:15px;display:flex}.exercise-card .tag,.tag{background-color:var(--tag-bg);color:var(--tag-color);border-radius:12px;padding:3px 8px;font-size:12px}.exercise-card .actions,.exercise-actions{flex-wrap:wrap;justify-content:space-between;gap:5px;margin-top:10px;display:flex}.exercise-card .actions button,.exercise-actions button{cursor:pointer;border:none;border-radius:4px;flex:1;padding:5px 10px;font-size:13px;transition:background-color .3s}.exercise-card .actions button:first-child,.exercise-actions button:first-child,.button-primary{background-color:var(--info-color);color:#fff}.exercise-card .actions button:nth-child(2),.exercise-actions button:nth-child(2),.button-danger{background-color:var(--danger-color);color:#fff}.exercise-card .actions button:nth-child(3),.exercise-actions button:nth-child(3),.button-secondary{background-color:var(--secondary-color);color:#fff}.exercise-card .actions button:nth-child(4),.exercise-actions button:nth-child(4){background-color:var(--success-color);color:#fff}.exercise-card .actions button:hover,.exercise-actions button:hover{opacity:.9}.exercise-header{margin-bottom:10px}.exercise-content{margin:10px 0}.exercise-code{background-color:var(--code-bg);border-radius:4px;padding:10px;overflow-x:auto}.exercise-code pre{white-space:pre-wrap;margin:0;font-family:monospace}.exercise-code code{font-family:monospace}.exercise-edit-form,.exercise-create-form{background-color:var(--card-bg);box-shadow:var(--card-shadow);border-radius:8px;margin-bottom:20px;padding:15px}.exercise-edit-form h3,.exercise-create-form h3{color:var(--text-color);margin-top:0;margin-bottom:15px}.code-editor{background-color:var(--code-bg);color:var(--text-color);font-family:monospace}.form-actions{justify-content:flex-end;gap:10px;margin-top:15px;display:flex}.button{cursor:pointer;border:none;border-radius:4px;padding:8px 16px;transition:background-color .3s}.button:hover{opacity:.9}.button:disabled{opacity:.5;cursor:not-allowed}.no-exercises{text-align:center;background-color:var(--light-bg);color:var(--secondary-color);border-radius:8px;padding:30px;font-style:italic}.exercise-viewer{background-color:var(--card-bg);box-shadow:var(--card-shadow);color:var(--text-color);border-radius:8px;padding:20px}.exercise-viewer .viewer-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:20px;display:flex}.exercise-viewer .viewer-header h2{color:var(--text-color);margin:0}.exercise-viewer .actions{gap:10px;display:flex}.exercise-viewer .actions button{cursor:pointer;border:none;border-radius:4px;padding:8px 16px;font-size:14px;transition:background-color .3s}.exercise-viewer .back-btn{background-color:var(--secondary-color);color:#fff}.exercise-viewer .edit-btn{background-color:var(--warning-color);color:#212529}.exercise-viewer .practice-btn{background-color:var(--success-color);color:#fff}.exercise-viewer .actions button:hover{opacity:.9}.exercise-viewer .metadata{background-color:var(--light-bg);border-radius:8px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-bottom:20px;padding:15px;display:grid}.exercise-viewer .metadata-item{flex-direction:column;display:flex}.exercise-viewer .label{color:var(--secondary-color);font-size:12px;font-weight:700}.exercise-viewer .value{color:var(--text-color)}.exercise-viewer .tags{flex-wrap:wrap;gap:5px;margin-bottom:20px;display:flex}.exercise-viewer .tag{background-color:var(--tag-bg);color:var(--tag-color);border-radius:12px;padding:3px 8px;font-size:12px}.exercise-viewer h3{color:var(--text-color);border-bottom:1px solid var(--border-color);margin-top:25px;margin-bottom:10px;padding-bottom:5px}.exercise-viewer .description-content{line-height:1.6}.exercise-viewer .code-block{background-color:var(--code-bg);white-space:pre-wrap;border-radius:8px;margin:0;padding:15px;font-family:monospace;overflow-x:auto}.exercise-viewer .test-cases-table{border-collapse:collapse;width:100%;margin-top:10px}.exercise-viewer .test-cases-table th,.exercise-viewer .test-cases-table td{border:1px solid var(--table-border);text-align:left;padding:8px 12px}.exercise-viewer .test-cases-table th{background-color:var(--table-header-bg);font-weight:700}.exercise-viewer .test-cases-table tr:nth-child(2n){background-color:var(--table-even-row)}.exercise-editor-container{background-color:var(--card-bg);box-shadow:var(--card-shadow);color:var(--text-color);border-radius:8px;padding:20px}.exercise-editor-container h2{color:var(--text-color);text-align:center;margin-top:0;margin-bottom:20px}.exercise-editor{flex-direction:column;gap:15px;display:flex}.exercise-editor .form-group{flex-direction:column;display:flex}.exercise-editor label{color:var(--text-color);margin-bottom:5px;font-weight:700}.exercise-editor input,.exercise-editor textarea,.exercise-editor select{border:1px solid var(--border-color);background-color:var(--bg-color);color:var(--text-color);border-radius:4px;padding:8px 12px;font-size:14px}.exercise-editor textarea{resize:vertical;min-height:100px}.exercise-editor .description-container{flex-direction:column;gap:10px;display:flex}.exercise-editor .preview-btn{background-color:var(--secondary-color);color:#fff;cursor:pointer;border:none;border-radius:4px;align-self:flex-start;padding:5px 10px;font-size:13px}.exercise-editor .description-preview{background-color:var(--light-bg);border:1px solid var(--border-color);border-radius:4px;margin-top:10px;padding:15px}.exercise-editor .code-editor{border:1px solid var(--border-color);border-radius:4px}.exercise-editor .test-case{align-items:flex-end;gap:10px;margin-bottom:10px;display:flex}.exercise-editor .test-input,.exercise-editor .test-output{flex:1}.exercise-editor .remove-test-btn{background-color:var(--danger-color);color:#fff;cursor:pointer;border:none;border-radius:4px;height:36px;padding:8px 12px;font-size:13px}.exercise-editor .add-test-btn{background-color:var(--info-color);color:#fff;cursor:pointer;border:none;border-radius:4px;margin-top:10px;padding:8px 12px;font-size:14px}.exercise-editor .form-actions{justify-content:flex-end;gap:10px;margin-top:20px;display:flex}.exercise-editor .save-btn{background-color:var(--success-color);color:#fff;cursor:pointer;border:none;border-radius:4px;padding:10px 20px;font-size:14px}.exercise-editor .cancel-btn{background-color:var(--secondary-color);color:#fff;cursor:pointer;border:none;border-radius:4px;padding:10px 20px;font-size:14px}.exercise-editor button:hover{opacity:.9}.loading{color:var(--text-color);flex-direction:column;justify-content:center;align-items:center;padding:30px;display:flex}.spinner{border:4px solid var(--spinner-border);border-top:4px solid var(--primary-color);border-radius:50%;width:40px;height:40px;margin-bottom:15px;animation:1s linear infinite spin}@media (width<=768px){.exercise-manager .controls{flex-direction:column;align-items:stretch;gap:15px}.exercise-manager .filters{flex-direction:column}.exercise-viewer .viewer-header{flex-direction:column;align-items:flex-start}.exercise-viewer .actions{justify-content:space-between;width:100%}.exercise-editor .test-case{flex-direction:column;align-items:stretch}.exercise-editor .remove-test-btn{width:100%;margin-top:5px}}.typing-trainer{background-color:var(--bg-color);color:var(--text-color);font-family:var(--font-family,"Roboto Mono", monospace);border-radius:8px;flex-direction:column;gap:1rem;max-width:1000px;margin:0 auto;padding:1rem;display:flex}.typing-trainer.dark{--bg-color:#1e1e1e;--text-color:#e0e0e0;--border-color:#444;--correct-color:#4caf50;--incorrect-color:#f44336;--remaining-color:#888;--button-bg:#333;--button-hover-bg:#444;--button-text:#fff;--input-bg:#2d2d2d;--input-border:#555;--stats-bg:#333}.typing-trainer.light{--bg-color:#f5f5f5;--text-color:#333;--border-color:#ddd;--correct-color:#4caf50;--incorrect-color:#f44336;--remaining-color:#888;--button-bg:#e0e0e0;--button-hover-bg:#d0d0d0;--button-text:#333;--input-bg:#fff;--input-border:#ccc;--stats-bg:#e9e9e9}.typing-header{flex-direction:column;gap:.5rem;margin-bottom:1rem;display:flex}.typing-header-top{justify-content:space-between;align-items:center;margin-bottom:.5rem;display:flex}.typing-header h2{color:var(--text-color);margin:0;font-size:1.5rem}.typing-example-info{flex-direction:column;gap:.25rem;display:flex}.typing-example-number{color:var(--text-color);opacity:.8;font-size:.9rem}.typing-example-description{color:var(--text-color);font-size:1.1rem;font-weight:500}.typing-actions{justify-content:center;gap:1rem;display:flex}.typing-button{background-color:var(--button-bg);color:var(--button-text);cursor:pointer;border:none;border-radius:6px;padding:.75rem 1.5rem;font-size:1rem;font-weight:500;transition:background-color .2s}.typing-button:hover{background-color:var(--button-hover-bg)}.typing-button:disabled{opacity:.7;cursor:not-allowed}.typing-button-next{color:#fff;background-color:#007bff}.typing-button-next:hover{background-color:#0069d9}.typing-button-restart{color:#fff;background-color:#6c757d}.typing-button-restart:hover{background-color:#5a6268}.typing-button-generate{color:#fff;background-color:#28a745}.typing-button-generate:hover{background-color:#218838}.typing-button-retry{color:#fff;background-color:#dc3545}.typing-button-retry:hover{background-color:#c82333}.typing-loading,.typing-error{text-align:center;background-color:var(--stats-bg);border-radius:6px;padding:2rem}.typing-loading-inline{background-color:var(--stats-bg);border-radius:6px;flex-direction:column;justify-content:center;align-items:center;margin-top:1rem;padding:1rem;display:flex}.typing-loading-inline p{color:var(--text-color);margin-top:.5rem;margin-bottom:0}.typing-loading-spinner{border:3px solid #ffffff4d;border-top-color:var(--text-color);border-radius:50%;width:20px;height:20px;animation:1s ease-in-out infinite spin;display:inline-block}.typing-error p{color:var(--incorrect-color);margin-bottom:1.5rem}.typing-trainer .setup-panel{background-color:var(--stats-bg);border-radius:8px;max-width:500px;margin:1rem auto;padding:1.5rem}.typing-trainer .form-group{margin-bottom:1rem}.typing-trainer .form-group label{color:var(--text-color);margin-bottom:.5rem;font-weight:500;display:block}.typing-trainer .form-group select{border:1px solid var(--input-border);background-color:var(--input-bg);width:100%;color:var(--text-color);border-radius:4px;padding:.5rem;font-size:1rem}.typing-trainer .checkbox-group{align-items:center;gap:.5rem;display:flex}.typing-trainer .checkbox-group input[type=checkbox]{margin:0}.typing-trainer .checkbox-group label{margin-bottom:0}.typing-trainer .checkbox-group label.disabled{opacity:.6;font-style:italic}.typing-trainer .radio-group{flex-direction:column;gap:.5rem;margin-bottom:1rem;display:flex}.typing-trainer .radio-option{align-items:center;gap:.5rem;display:flex}.typing-trainer .radio-option input[type=radio]{margin:0}.typing-trainer .radio-option label{cursor:pointer;margin-bottom:0}.percentage-slider{appearance:none;background:#0000001a;border-radius:4px;outline:none;width:100%;height:8px}.typing-trainer.dark .percentage-slider{background:#fff3}.percentage-slider::-webkit-slider-thumb{appearance:none;cursor:pointer;background:#007bff;border-radius:50%;width:18px;height:18px}.percentage-slider::-moz-range-thumb{cursor:pointer;background:#007bff;border:none;border-radius:50%;width:18px;height:18px}.typing-button-start{color:#fff;background-color:#28a745;width:100%;margin-top:1rem}.typing-button-start:hover{background-color:#218838}.typing-button-back{color:#fff;background-color:#6c757d}.typing-button-back:hover{background-color:#5a6268}.mode-specific-settings{background-color:#00000008;border:1px solid #0000000d;border-radius:4px;margin-top:-.5rem;margin-bottom:1rem;padding:.75rem}.typing-trainer.dark .mode-specific-settings{background-color:#ffffff08;border:1px solid #ffffff0d}.setup-slider-container{align-items:center;gap:1rem;display:flex}.setup-slider{flex:1}.setup-slider-value{text-align:right;min-width:3rem}.typing-workspace{flex-direction:column;gap:1rem;margin-bottom:1rem;display:flex}.typing-code-display{background-color:var(--input-bg);border:1px solid var(--input-border);white-space:pre-wrap;border-radius:6px;max-height:300px;padding:1rem;font-family:Roboto Mono,monospace;font-size:1rem;line-height:1.5;overflow-y:auto}.typing-code-display pre{margin:0}.typing-code-display code{font-family:inherit}.typing-code-hidden{text-align:center;min-height:150px;color:var(--text-color);opacity:.7;border:1px dashed var(--input-border);justify-content:center;align-items:center;display:flex}.typing-input{background-color:var(--input-bg);border:1px solid var(--input-border);resize:vertical;min-height:150px;color:var(--text-color);border-radius:6px;padding:1rem;font-family:Roboto Mono,monospace;font-size:1rem;line-height:1.5}.typing-input:focus{border-color:#007bff;outline:none;box-shadow:0 0 0 2px #007bff40}.code-with-highlighting{white-space:pre-wrap;font-family:Roboto Mono,monospace;line-height:1.5}.code-line{white-space:pre;height:1.5em;padding:1px 0;transition:background-color .2s;position:relative}.typing-correct{color:var(--correct-color,#4caf50)}.typing-incorrect{color:#fff;background-color:#f44336;border-radius:2px;margin:0 -2px;padding:0 2px;position:relative}@keyframes errorPulse{0%{box-shadow:0 0 #f4433666}70%{box-shadow:0 0 0 5px #f4433600}to{box-shadow:0 0 #f4433600}}.typing-incorrect:after{content:"";border-radius:2px;animation:1s ease-out errorPulse;position:absolute;inset:0}.typing-remaining{color:var(--remaining-color,#888)}.typing-hidden{color:#888;opacity:.7;background-color:#0000000d;border-radius:2px;padding:0 4px;font-style:italic}.typing-trainer.dark .typing-hidden{background-color:#ffffff0d}.code-line.completed-line{border-left:3px solid var(--correct-color,#4caf50);background-color:#4caf5014;border-radius:3px;margin-left:-3px;padding-left:3px}.code-line.partially-completed{position:relative}.code-line.partially-completed:after{content:"";background-color:var(--correct-color,#4caf50);border-radius:0 2px 2px 0;width:3px;height:100%;position:absolute;top:0;left:0}@keyframes revealLine{0%{background-color:#007bff1a;transform:translateY(-2px)}to{background-color:#0000;transform:translateY(0)}}.code-line.newly-revealed{animation:.5s ease-out revealLine}.hints-mode{margin-bottom:1.5rem;position:relative}.hints-mode-description{background-color:#ffffdce6;border-left:4px solid #f0c040;border-radius:4px;margin-bottom:1rem;padding:.75rem;font-style:italic}.hints-mode .code-line{white-space:pre-wrap;font-family:Fira Code,monospace;line-height:1.5;position:relative}.hints-mode .code-line:has(.typing-correct){background-color:#00ff000d}.code-with-highlighting.hints-mode pre{background-color:#f0f8ff0d;border-radius:4px;padding:1rem;position:relative}@keyframes hints-pulse{0%{background-color:#ffff001a}50%{background-color:#ff03}to{background-color:#ffff001a}}.dark .hints-mode-description{color:#e0e0e0;background-color:#32320acc;border-left-color:#d0a020}.dark .hints-mode .code-line:has(.typing-correct){background-color:#00ff001a}.fill-blanks-mode{margin-bottom:1.5rem;position:relative}.fill-blanks-description{background-color:#f0f8ffe6;border-left:4px solid #4080c0;border-radius:4px;margin-bottom:1rem;padding:.75rem;font-style:italic}.fill-blanks-mode .code-line{white-space:pre-wrap;font-family:Fira Code,monospace;line-height:1.5;position:relative}.fill-blanks-mode .code-line:has(span){background-color:#f0f8ff0d}.fill-blanks-mode .___{color:#888;text-decoration:underline dotted #666}.fill-blanks-mode .code-line:has(.typing-correct){background-color:#00ff000d}@keyframes blank-correct{0%{background-color:#0f03}to{background-color:#0000}}.fill-blanks-mode .typing-correct-blank{animation:1s ease-out blank-correct}.dark .fill-blanks-description{color:#e0e0e0;background-color:#14283ccc;border-left-color:#4080c0}.dark .fill-blanks-mode .code-line:has(.typing-correct){background-color:#00ff001a}.dark .fill-blanks-mode .___{color:#aaa;text-decoration-color:#888}.typing-mode-selector{align-items:center;gap:.5rem;display:flex}.typing-mode-selector label{color:var(--text-color);font-size:.9rem}.typing-mode-selector select{border:1px solid var(--input-border);background-color:var(--input-bg);color:var(--text-color);border-radius:4px;padding:.25rem .5rem;font-size:.9rem}.partial-mode-message{text-align:center;color:var(--text-color);background-color:#ffc10726;border:1px solid #ffc1074d;border-radius:6px;margin:.5rem 0;padding:.75rem;font-size:.9rem;font-weight:500}.typing-trainer.light .partial-mode-message{color:#664d00;border-color:#ffc10780}.partial-mode-progress{color:var(--text-color);opacity:.8;justify-content:center;align-items:center;gap:5px;margin-top:.5rem;font-size:.8rem;display:flex}.progress-dot{background-color:var(--input-border);border-radius:50%;width:8px;height:8px}.progress-dot.active{background-color:var(--correct-color)}@keyframes fadeInHighlight{0%{background-color:#4caf5033}to{background-color:#0000}}.memory-timer{text-align:center;color:var(--text-color);background-color:#007bff1a;border-radius:6px;margin:.5rem 0;padding:.75rem;font-size:.9rem;font-weight:500}.typing-trainer.dark .memory-timer{border:1px solid #007bff4d}.typing-trainer.light .memory-timer{color:#004085;border:1px solid #007bff80}.implementation-description{background-color:#007bff1a;border-radius:6px;margin:.5rem 0 1rem;padding:1rem}.typing-trainer.dark .implementation-description{border:1px solid #007bff4d}.typing-trainer.light .implementation-description{color:#004085;border:1px solid #007bff80}.implementation-description h3{margin-top:0;margin-bottom:.75rem;font-size:1.1rem;font-weight:600}.implementation-description p{margin:0;font-size:.95rem;line-height:1.5}.exercise-mode-filter{width:100%;margin-bottom:1rem;position:relative}.exercise-mode-filter .form-group-label{color:var(--text-color);margin-bottom:.5rem;font-weight:500;display:block}.exercise-mode-selected{border:1px solid var(--input-border);background-color:var(--input-bg);color:var(--text-color);cursor:pointer;border-radius:4px;justify-content:space-between;align-items:center;height:40px;padding:.5rem .75rem;font-size:1rem;transition:border-color .2s;display:flex}.exercise-mode-selected:hover,.exercise-mode-selected.active{border-color:#007bff}.dropdown-arrow{font-size:.8rem;transition:transform .2s}.exercise-mode-dropdown{z-index:100;background-color:var(--input-bg);border:1px solid var(--input-border);border-radius:4px;width:100%;max-height:280px;position:absolute;top:calc(100% + 4px);left:0;overflow-y:auto;box-shadow:0 2px 6px #00000026}.exercise-mode-option{cursor:pointer;align-items:flex-start;padding:.75rem;transition:background-color .15s;display:flex}.exercise-mode-option:hover{background-color:var(--button-hover-bg)}.exercise-mode-option.selected{background-color:#007bff1a}.exercise-mode-option-check{color:#007bff;width:20px;margin-right:.5rem;font-weight:700}.exercise-mode-option-content{flex:1}.exercise-mode-option-label{margin-bottom:.25rem;font-weight:500}.exercise-mode-option-description{opacity:.8;font-size:.9rem}@media (width<=768px){.exercise-mode-dropdown{z-index:1000;border-radius:8px 8px 0 0;width:100%;max-height:70vh;animation:.2s ease-out slideUp;position:fixed;top:auto;bottom:0;left:0;overflow-y:auto;box-shadow:0 -2px 10px #0003}.exercise-mode-option{padding:1rem}.exercise-mode-option-label{margin-bottom:.5rem;font-size:1rem}.exercise-mode-option-description{font-size:.9rem}.dropdown-backdrop{z-index:999;background-color:#00000080;position:fixed;inset:0}}@keyframes slideUp{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}.typing-stats-bar{background-color:var(--stats-bg);border-radius:6px;justify-content:space-between;margin-bottom:1rem;padding:.75rem;display:flex}.typing-stat{flex-direction:column;align-items:center;gap:.25rem;display:flex}.typing-stat-label{color:var(--text-color);opacity:.8;font-size:.8rem}.typing-stat-value{color:var(--text-color);font-size:1.1rem;font-weight:600}.typing-results{background-color:var(--stats-bg);border-radius:6px;margin-bottom:1rem;padding:1rem}.typing-results h3{color:var(--text-color);margin-top:0;margin-bottom:1rem;font-size:1.2rem}.typing-results .typing-stats{justify-content:space-between;margin-bottom:1.5rem;display:flex}.typing-result-details{background-color:#00000008;border-radius:4px;margin-bottom:1rem;padding:1rem}.typing-trainer.dark .typing-result-details{background-color:#ffffff08}.typing-result-details h4{margin-top:0;margin-bottom:.75rem;font-size:1rem}.typing-result-details table{border-collapse:collapse;width:100%}.typing-result-details th,.typing-result-details td{text-align:left;border-bottom:1px solid var(--border-color);padding:.5rem}.typing-result-details th{opacity:.8;font-weight:600}.typing-result-rating{align-items:center;gap:.5rem;margin-top:.5rem;display:flex}.rating-excellent{color:#4caf50}.rating-good{color:#2196f3}.rating-average{color:#ff9800}.rating-needs-practice{color:#f44336}.completion-progress{background-color:#0000001a;border-radius:4px;height:8px;margin:.5rem 0 1rem;overflow:hidden}.typing-trainer.dark .completion-progress{background-color:#ffffff1a}.progress-fill{background-color:#4caf50;border-radius:4px;height:100%;transition:width .3s}@media (width<=768px){.typing-trainer{gap:.75rem;padding:.75rem}.typing-header-top{flex-direction:column;align-items:flex-start;gap:.5rem}.typing-mode-selector{justify-content:space-between;width:100%}.typing-mode-selector select{flex:1}.typing-stats-bar{flex-direction:column;gap:.5rem}.typing-stat{flex-direction:row;justify-content:space-between;width:100%}.typing-results .typing-stats,.typing-actions{flex-direction:column;gap:.5rem}.typing-button{width:100%}}@media (width<=480px){.typing-trainer{gap:.5rem;padding:.5rem}.typing-code-display{max-height:250px;padding:.75rem;font-size:.9rem}.typing-input{min-height:120px;padding:.75rem;font-size:.9rem}.typing-header h2{font-size:1.3rem}.typing-example-description{font-size:1rem}.setup-panel{padding:1rem}}@media (width>=769px) and (width<=1024px){.typing-trainer{max-width:90%}}@media (width>=1200px){.typing-code-display{max-height:400px}.typing-input{min-height:180px}}@media (resolution>=192dpi){.typing-code-display,.typing-input{font-size:1.05rem}}@media (prefers-color-scheme:dark){.typing-trainer:not(.light):not(.dark){--bg-color:#1e1e1e;--text-color:#e0e0e0;--border-color:#444;--correct-color:#4caf50;--incorrect-color:#f44336;--remaining-color:#888;--button-bg:#333;--button-hover-bg:#444;--button-text:#fff;--input-bg:#2d2d2d;--input-border:#555;--stats-bg:#333}}@media print{.typing-trainer{color:#000;background-color:#fff;max-width:100%;padding:0}.typing-input,.typing-button,.typing-actions{display:none}.typing-code-display{border:1px solid #ddd;max-height:none;overflow:visible}.typing-stats-bar{background-color:#f9f9f9;border:1px solid #ddd}}.typing-input-wrapper{margin-bottom:.5rem;position:relative}.typing-input{background-color:var(--input-bg,#2d2d2d);border:1px solid var(--input-border,#555);resize:vertical;width:100%;min-height:150px;color:var(--text-color,#e0e0e0);border-radius:6px;outline:none;padding:1rem;font-family:Roboto Mono,monospace;font-size:1rem;line-height:1.5}.typing-input:focus{border-color:#007bff;box-shadow:0 0 0 2px #007bff40}.typing-input:disabled{opacity:.7;cursor:not-allowed}.typing-input-actions{gap:5px;display:flex;position:absolute;bottom:10px;right:10px}.typing-input-action{width:30px;height:30px;color:var(--text-color,#e0e0e0);cursor:pointer;background-color:#007bff1a;border:1px solid #007bff33;border-radius:4px;justify-content:center;align-items:center;padding:0;font-size:18px;transition:all .2s;display:flex}.typing-input-action-icon{line-height:1}.typing-input-clear{background-color:#dc35451a;border:1px solid #dc354533}.typing-input-clear:hover{background-color:#dc354533}.typing-input-action:disabled{opacity:.3;cursor:not-allowed}.typing-input-action:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 2px 4px #0003}.typing-input-action:not(:disabled):active{box-shadow:none;transform:translateY(0)}@media (width<=768px){.typing-input-action{width:36px;height:36px}}
