.practice-controls{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:16px}.practice-controls select{font-family:Inter,sans-serif;font-size:.82rem;font-weight:500;padding:6px 16px;border:1px solid #d1cdc4;border-radius:999px;background:#fff;color:#141413;cursor:pointer;transition:all .15s}.practice-controls select:hover{border-color:#d97757;color:#d97757}.practice-progress{margin-bottom:16px}.practice-bar{height:6px;background:#e8e6dc;border-radius:3px;overflow:hidden}.practice-fill{height:100%;background:#d97757;transition:width .3s}.practice-text{font-size:.8rem;color:#87867f;margin-top:4px;text-align:center}.practice-score{display:flex;justify-content:center;gap:20px;margin-bottom:16px;font-family:Inter,sans-serif;font-size:.85rem;font-weight:600}.practice-score .score-correct{color:#27ae60}.practice-score .score-wrong{color:#e74c3c}.practice-score .score-pct{color:#141413}.exercise-card{background:#fff;border-radius:16px;padding:28px 32px;border:1px solid rgba(20,20,19,.1);box-shadow:0 1px 3px #0000000a,0 4px 12px #00000008;margin-bottom:16px}.exercise-header{margin-bottom:16px}.exercise-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}.exercise-tag{font-size:.7rem;font-weight:600;padding:3px 10px;border-radius:100px;text-transform:uppercase;letter-spacing:.03em}.exercise-tag-domain{background:#ebdbbc;color:#5e5d59}.exercise-tag-fill{background:#bcd1ca;color:#2d4a42}.exercise-tag-bug{background:#ebcece;color:#7a3030}.exercise-title{font-family:"Source Serif 4",Georgia,serif;font-size:1.15rem;font-weight:600;color:#141413;margin:0 0 6px}.exercise-desc{font-size:.9rem;line-height:1.5;color:#5e5d59;margin:0}.code-block{background:#1e1e1e;border-radius:10px;padding:16px;margin-bottom:16px;overflow-x:auto;font-family:SF Mono,Fira Code,Consolas,monospace;font-size:.85rem;line-height:1.7;color:#e0e0e0;white-space:pre}.code-block .blank-input{font-family:SF Mono,Fira Code,Consolas,monospace;font-size:.85rem;color:#fff;background:transparent;border:none;border-bottom:2px solid #d97757;padding:1px 4px;outline:none;min-width:60px;transition:border-color .15s,background-color .15s}.code-block .blank-input::placeholder{color:#666}.code-block .blank-input:focus{border-bottom-color:#f0a080}.code-block .blank-input.correct{border-bottom-color:#27ae60;background:#27ae6026;color:#6ee7a0}.code-block .blank-input.wrong{border-bottom-color:#e74c3c;background:#e74c3c26;color:#f0a0a0}.blank-feedback{display:block;margin-top:4px}.blank-correction{display:none;font-family:SF Mono,Fira Code,Consolas,monospace;font-size:.78rem;color:#6ee7a0;margin-top:2px}.blank-correction.show{display:inline}.exercise-actions{display:flex;gap:8px;justify-content:center;margin-bottom:16px}.exercise-actions button{font-family:Inter,sans-serif;font-size:.82rem;font-weight:600;padding:8px 24px;border-radius:999px;cursor:pointer;transition:all .15s}.btn-check{border:2px solid #d97757;background:#fff;color:#d97757}.btn-check:hover:not(:disabled){background:#d97757;color:#fff}.btn-check:disabled{opacity:.4;cursor:default}.btn-hint{border:2px solid #d1cdc4;background:#fff;color:#87867f}.btn-hint:hover{border-color:#b0aea5;color:#5e5d59}.btn-next{border:2px solid #141413;background:#141413;color:#fff}.btn-next:hover{background:#3d3d3a}.hint-text{font-size:.82rem;color:#d97757;font-style:italic;margin-top:4px;display:none}.hint-text.show{display:block}.exercise-result{text-align:center;font-family:Inter,sans-serif;font-size:.95rem;font-weight:600;margin-bottom:16px;display:none}.exercise-result.pass{color:#27ae60;display:block}.exercise-result.fail{color:#e74c3c;display:block}.nav-buttons-practice{display:flex;gap:8px;justify-content:center;margin-bottom:16px}.nav-buttons-practice button{font-family:Inter,sans-serif;font-size:.82rem;font-weight:500;padding:8px 18px;border:1px solid #d1cdc4;border-radius:999px;background:#fff;color:#3d3d3a;cursor:pointer;transition:all .15s}.nav-buttons-practice button:hover{background:#f0eee6;border-color:#b0aea5}.practice-empty{text-align:center;padding:60px 20px;color:#87867f;font-family:"Source Serif 4",Georgia,serif;font-size:.95rem}@media(max-width:600px){.exercise-card{padding:16px 18px}.exercise-title{font-size:1rem}.code-block{font-size:.78rem;padding:12px;line-height:2.2}.code-block .blank-input{font-size:16px;padding:4px 6px;min-width:80px}.exercise-actions{flex-wrap:wrap}.exercise-actions button{padding:10px 20px}.nav-buttons-practice button{padding:10px 16px}.practice-controls select{width:100%}}
